.warpzone{
  margin:24px 0;padding:6px;
  background:linear-gradient(135deg,#ff1493,#ffd700,#00bfff,#9c27b0,#ff1493);
  background-size:400% 400%;animation:warpBG 5s linear infinite;
  border-radius:24px;box-shadow:0 8px 30px rgba(255,20,147,.4);
}
@keyframes warpBG{0%{background-position:0% 50%;}100%{background-position:400% 50%;}}
.warpzone .inner{background:#fff;border-radius:18px;padding:24px;text-align:center;}
.warpzone h2{font-size:clamp(22px,4vw,32px);margin:0 0 6px;
  background:linear-gradient(45deg,#ff1493,#9c27b0,#00bfff);
  -webkit-background-clip:text;background-clip:text;color:transparent;}

.threecol{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px;margin:24px 0;}
.panel{background:#fff;border:4px solid #222;border-radius:18px;padding:18px;
  box-shadow:6px 6px 0 #222;position:relative;overflow:hidden;}
.panel.hakase{transform:rotate(-1deg);background:linear-gradient(135deg,#fff,#fff8e1);}
.panel.art{transform:rotate(1deg);background:linear-gradient(135deg,#fff,#f3e5f5);}
.panel.kuji{transform:rotate(-.5deg);background:linear-gradient(135deg,#fff,#fce4ec);text-align:center;}
.panel h3{margin:0 0 10px;font-size:16px;letter-spacing:2px;
  border-bottom:2px dashed #222;padding-bottom:6px;}
.panel .icon{position:absolute;top:-10px;right:-10px;font-size:50px;opacity:.2;transform:rotate(20deg);}
.panel .img{width:90px;height:90px;float:left;margin:0 12px 8px 0;
  border:3px solid #222;border-radius:10px;background:#fffbe6;padding:4px;}
.panel.hakase .img{border-radius:50%;}
.panel p{font-size:14px;line-height:1.6;margin:0;}
.panel .more{display:inline-block;margin-top:10px;font-size:12px;
  background:#222;color:#fff;padding:6px 14px;border-radius:20px;
  text-decoration:none;font-weight:bold;}
.panel .more:hover{background:#ff1493;}
.panel .fortune{font-size:48px;font-weight:900;margin:10px 0;
  background:linear-gradient(45deg,#ff1493,#ffd700);
  -webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:4px;}

.todayChara{
  background:#000;color:#fff;border-radius:18px;padding:24px;margin:24px 0;
  display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:center;
  position:relative;overflow:hidden;
  border:4px solid #ffd700;box-shadow:0 0 30px rgba(255,215,0,.3);
}
.todayChara::before{content:'';position:absolute;inset:0;
  background:repeating-linear-gradient(45deg,transparent 0 20px,rgba(255,215,0,.05) 20px 21px);pointer-events:none;}
.todayChara .label{position:absolute;top:10px;right:14px;
  background:#ffd700;color:#000;padding:4px 14px;border-radius:20px;
  font-size:11px;font-weight:bold;letter-spacing:2px;}
.todayChara img{width:140px;height:140px;border:4px solid #ffd700;
  border-radius:14px;background:#fff;padding:6px;
  filter:drop-shadow(0 0 20px rgba(255,215,0,.5));position:relative;z-index:2;}
.todayChara .info{position:relative;z-index:2;}
.todayChara h3{margin:0 0 10px;font-size:28px;color:#ffd700;text-shadow:0 0 10px rgba(255,215,0,.5);}
.todayChara .stats{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;}
.todayChara .stat{font-size:11px;background:rgba(255,255,255,.1);
  border:1px solid #ffd700;padding:3px 10px;border-radius:12px;}
.todayChara .stat b{color:#ffd700;}
.todayChara .stars{color:#ffd700;font-size:18px;letter-spacing:2px;}

.infobar{
  position:relative;z-index:5;max-width:900px;margin:10px auto;
  background:#fff;border:3px solid #222;border-radius:14px;padding:10px 20px;
  display:flex;justify-content:space-between;align-items:center;
  box-shadow:4px 4px 0 #222;font-size:14px;flex-wrap:wrap;
}
.infobar .label{background:#ff1493;color:#fff;padding:2px 10px;border-radius:20px;
  font-weight:bold;margin-right:10px;font-size:12px;}
.infobar a{color:#222;text-decoration:none;font-weight:bold;}
.infobar a:hover{color:#ff1493;}
.infobar .right a{color:#888;font-size:12px;}

@media (max-width:700px){
  .todayChara{grid-template-columns:1fr;text-align:center;}
  .todayChara img{margin:0 auto;}
}

/* メインビジュアル: アスオパークを歩くたいち */
.main-visual{position:relative;overflow:hidden;height:230px;background:#bfe6ff;
  --skin:#f0c060;--ink:#111;--shirt:#111;--shorts:#0a3ad6;--shoe:#33380b;}
.mv-bg{position:absolute;inset:0;background:url(/image/park-tile.png) repeat-x;
  background-size:1600px 100%;animation:mvScroll 18s linear infinite;}
@keyframes mvScroll{from{background-position:0 0}to{background-position:-1600px 0}}
.mv-gate{position:absolute;bottom:8px;left:0;width:330px;height:160px;z-index:1;pointer-events:none;
  animation:mvGate 18s linear infinite;}
@keyframes mvGate{from{transform:translateX(1200px)}to{transform:translateX(-380px)}}
.mv-gate .gt{position:absolute;top:0;left:0;right:0;height:50px;
  background:linear-gradient(#ffd24a,#ff8c1a);border:4px solid #fff;border-radius:16px;
  display:flex;align-items:center;justify-content:center;white-space:nowrap;
  color:#8a1846;font-weight:900;font-size:20px;letter-spacing:3px;
  box-shadow:0 4px 0 #b35a00,0 7px 16px rgba(0,0,0,.3);text-shadow:1px 1px 0 #fff;}
.mv-gate .gp{position:absolute;top:40px;bottom:0;width:22px;
  background:linear-gradient(90deg,#eef0f3,#b9bec7);border:3px solid #8a8f98;border-radius:6px;}
.mv-gate .gp.l{left:20px;}.mv-gate .gp.r{right:20px;}
.mv-ground{position:absolute;left:0;right:0;bottom:0;height:16px;z-index:2;
  border-top:2px solid #6b6b6e;background:url(/image/concrete-tile.png) repeat-x;
  background-size:64px 100%;animation:mvGround .70s linear infinite;}
@keyframes mvGround{from{background-position:0 0}to{background-position:-64px 0}}
.mv-walker{position:absolute;bottom:-65px;left:calc(50% - 70px);width:140px;height:240px;z-index:3;}
.mv-walker svg{width:140px;height:240px;overflow:visible;display:block;}
.mv-walker #mvFig{animation:mvBob .5s ease-in-out infinite;transform-box:view-box;transform-origin:70px 130px;}
@keyframes mvBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
.mv-walker .limb{transform-box:fill-box;transform-origin:50% 0;}
.mv-walker #mvLegL{animation:mvLegA 1s ease-in-out infinite;}
.mv-walker #mvLegR{animation:mvLegB 1s ease-in-out infinite;}
.mv-walker #mvArmL{animation:mvArmB 1s ease-in-out infinite;}
.mv-walker #mvArmR{animation:mvArmA 1s ease-in-out infinite;}
@keyframes mvLegA{0%,100%{transform:rotate(24deg)}50%{transform:rotate(-24deg)}}
@keyframes mvLegB{0%,100%{transform:rotate(-24deg)}50%{transform:rotate(24deg)}}
@keyframes mvArmA{0%,100%{transform:rotate(22deg)}50%{transform:rotate(-22deg)}}
@keyframes mvArmB{0%,100%{transform:rotate(-22deg)}50%{transform:rotate(22deg)}}
@media (prefers-reduced-motion:reduce){.mv-bg,.mv-gate,.mv-ground,.mv-walker *{animation:none!important;}}

/* ===== home インライン由来のクラス ===== */
.mv-frame{width:100vw;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;margin-top:10px;margin-bottom:14px;border-top:3px solid #222;border-bottom:3px solid #222;}
#mvBody{transform-box:view-box;transform-origin:70px 96px;transform:scale(.66);}
.visit-wrap{text-align:center;margin:0 0 22px;}
.visit-box{display:inline-flex;align-items:center;gap:8px;background:#222;border:3px solid #222;border-radius:10px;padding:7px 14px;}
.visit-label{color:#fff;font-size:11px;letter-spacing:2px;}
.visit-digits{display:inline-flex;gap:3px;}
.visit-digit{background:#111;color:#e8456e;font-family:'Courier New',monospace;font-weight:bold;font-size:20px;padding:2px 6px;border-radius:3px;}
.pg-banner-wrap{text-align:center;margin:24px 0;}
.pg-banner-link{display:inline-block;text-decoration:none;}
.warp-sub{color:#666;font-size:13px;}
.warp-btns{margin-top:14px;}
.today-comment{font-size:13px;line-height:1.6;margin:8px 0 0;opacity:.9;}
.today-detail-btn{display:inline-block;margin-top:10px;background:#ffd700;color:#000;padding:6px 16px;border-radius:20px;text-decoration:none;font-weight:bold;font-size:12px;}
.art-link{display:block;text-decoration:none;color:inherit;}
.art-thumb{width:100%;max-height:140px;object-fit:contain;background:#fff;border:2px solid #222;border-radius:10px;padding:6px;}
.art-cap{font-size:13px;margin:8px 0 0;font-weight:bold;text-align:center;}
.kuji-msg{font-size:12px;color:#666;}
.more-mt{margin-top:14px;}
