/* YOGAKU ARCADE（ゲームコーナー）：筐体・メニュー・結果・トップのプレイヤーカード */
.arc-wrap{width:min(1180px,100%);margin-inline:auto}
.arc{position:relative;border-radius:26px;overflow:hidden;background:#1a0b3a;isolation:isolate;box-shadow:0 0 0 4px #fff,0 0 0 9px #ff2e63,0 0 0 13px #ffd23f,0 30px 90px rgba(120,30,140,.35);user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}
.arc:fullscreen{border-radius:0;box-shadow:none;width:100vw;height:100vh}
.arc-scr{position:relative}
.arc-cv{display:block;width:100%;touch-action:none}
.arc-ov{position:absolute;inset:0;display:grid;place-items:center;padding:clamp(10px,2vw,26px);overflow:auto;z-index:2}
.arc-ov:empty{pointer-events:none}
.arc-tools{position:absolute;left:50%;translate:-50% 0;top:12px;display:flex;gap:6px;z-index:3}
.arc-tb{width:38px;height:38px;border-radius:12px;background:rgba(255,255,255,.18);color:#fff;font-size:17px;display:grid;place-items:center;backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.3);transition:background .2s}
.arc-tb:hover{background:rgba(255,255,255,.34)}
.arc-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 26px;border-radius:999px;font:400 22px/1 var(--disp);letter-spacing:.12em;color:#1c0b33;background:linear-gradient(180deg,#fff27a,#ffb703);box-shadow:0 5px 0 #c26a00,0 10px 30px rgba(255,183,3,.45);transition:transform .12s,box-shadow .12s;text-decoration:none;cursor:pointer}
.arc-btn:hover{transform:translateY(-2px)}.arc-btn:active{transform:translateY(4px);box-shadow:0 1px 0 #c26a00}
.arc-btn.big{font-size:clamp(24px,3vw,32px);padding:16px 44px}
.arc-btn.ghost{background:rgba(255,255,255,.92);box-shadow:0 5px 0 rgba(0,0,0,.25);color:#3a0ca3;font-size:18px}
.arc-btn.pulse{animation:arcPulse 1.1s ease-in-out infinite}
@keyframes arcPulse{50%{transform:scale(1.07);box-shadow:0 5px 0 #c26a00,0 0 50px rgba(255,230,80,.8)}}
.arc kbd{display:inline-block;min-width:24px;padding:1px 6px;margin:0 2px;border-radius:6px;background:#1c0b33;color:#fff;font:400 15px/1.4 var(--disp);text-align:center}

/* タイトル */
.lb-title{text-align:center;color:#fff;display:grid;gap:14px;justify-items:center;text-shadow:0 3px 0 rgba(30,5,60,.6)}
.lb-k{font:400 15px/1 var(--disp);letter-spacing:.4em;opacity:.9}
.lb-logo{margin:0;line-height:.85;font:400 clamp(70px,13vw,160px)/.85 var(--disp);letter-spacing:.02em;display:grid}
.lb-logo span{color:#fff;-webkit-text-stroke:3px #ff2e63;text-shadow:0 0 30px #ff5ad1,6px 6px 0 #3a0ca3}
.lb-logo b{font-weight:400;background:linear-gradient(180deg,#fff27a 10%,#ff8a00 55%,#ff2e63 90%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(6px 6px 0 #3a0ca3) drop-shadow(0 0 24px rgba(255,180,0,.6));animation:logoGlow 2s ease-in-out infinite}
.lb-logo.wm span{-webkit-text-stroke-color:#2fd8ff;text-shadow:0 0 30px #2fd8ff,6px 6px 0 #3a0ca3}
@keyframes logoGlow{50%{filter:drop-shadow(6px 6px 0 #3a0ca3) drop-shadow(0 0 40px rgba(255,230,80,.95))}}
.lb-sub{font-size:clamp(16px,2vw,22px);font-weight:900;letter-spacing:.2em}
.lb-feat{list-style:none;margin:6px 0 0;padding:12px 20px;border-radius:16px;background:rgba(20,6,50,.55);font-size:14px;line-height:1.9;text-shadow:none;backdrop-filter:blur(4px)}
.lb-feat b{color:#ffe066}.wm-best{font:400 20px/1 var(--disp);letter-spacing:.15em;color:#ffe066}

/* 曲えらび */
.lb-sel{width:min(1040px,100%);display:grid;grid-template-columns:minmax(220px,340px) minmax(0,1fr);gap:16px;align-items:start}
.lb-list{display:grid;gap:9px}
.lb-tr{position:relative;display:grid;text-align:left;gap:1px;padding:12px 16px;border-radius:16px;color:#fff;background:linear-gradient(110deg,var(--c1),var(--c2));box-shadow:0 4px 0 rgba(0,0,0,.25);transition:transform .2s cubic-bezier(.3,1.6,.5,1),outline-color .2s;outline:3px solid transparent;text-shadow:0 2px 0 rgba(0,0,0,.25)}
.lb-tr small{font:400 13px/1.2 var(--disp);letter-spacing:.14em;opacity:.92}.lb-tr b{font:400 26px/1 var(--disp);letter-spacing:.04em}.lb-tr span{font-size:12px;font-weight:700;opacity:.9}
.lb-tr:hover{transform:translateX(6px)}.lb-tr.on{outline-color:#fff;transform:translateX(12px) scale(1.02);box-shadow:0 0 0 6px rgba(255,255,255,.25),0 10px 30px rgba(0,0,0,.3)}
.lb-tr em{position:absolute;right:12px;top:50%;translate:0 -50%;font:400 30px/1 var(--disp);font-style:normal}
.lb-det{padding:clamp(18px,2.4vw,28px);border-radius:22px;background:rgba(255,255,255,.95);color:#1c1a21;box-shadow:0 20px 60px rgba(20,0,60,.35);display:grid;gap:10px}
.lb-genre{font:400 15px/1 var(--disp);letter-spacing:.3em;color:#ff2e63;margin:0}
.lb-det h3{margin:0;font:400 clamp(40px,5vw,62px)/.9 var(--disp);letter-spacing:.02em;color:#3a0ca3}
.lb-ja{margin:0;font-weight:900;color:#77727f;font-size:14px}.lb-desc{margin:0;font-size:14px;line-height:1.7}
.lb-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(78px,1fr));gap:8px;margin:0}
.lb-meta div{padding:8px 10px;border-radius:12px;background:#f4efe5;text-align:center}.lb-meta dt{font:400 12px/1 var(--disp);letter-spacing:.14em;color:#77727f}.lb-meta dd{margin:4px 0 0;font:400 26px/1 var(--disp);color:#1c1a21}
.lb-diff{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.lb-diff button{display:grid;gap:2px;padding:10px 6px;border-radius:14px;border:3px solid transparent;background:#f4efe5;color:#45414d;transition:transform .15s}
.lb-diff button small{font:400 15px/1 var(--disp);letter-spacing:.18em}.lb-diff button b{font:400 34px/1 var(--disp)}
.lb-diff .d0.on{background:#3ddc84;color:#fff;border-color:#1f9d57}.lb-diff .d1.on{background:#ffb703;color:#fff;border-color:#c26a00}.lb-diff .d2.on{background:#ff2e63;color:#fff;border-color:#a50e38}
.lb-diff button:hover{transform:translateY(-2px)}
.lb-best{margin:0;font:400 20px/1.2 var(--disp);letter-spacing:.06em;color:#45414d}.lb-best b{font-weight:400;font-size:28px;color:#1c1a21}.lb-best i{font-style:normal;color:#ff2e63;margin-left:6px}
.lb-opt{font-size:13px;border-radius:12px;background:#f4efe5;padding:8px 12px}.lb-opt summary{cursor:pointer;font-weight:700}
.lb-opt label{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;align-items:center;margin-top:8px}.lb-opt label input[type=range]{grid-column:1/-1;width:100%;accent-color:#ff2e63}.lb-opt output{font:400 18px/1 var(--disp);color:#ff2e63;justify-self:end}
.lb-opt .chk{display:flex}
.lb-det #lb-go{justify-self:stretch}
.lb-how{margin:0;font-size:12.5px;line-height:1.7;color:#45414d}
[class*=rk-]{font-style:normal}
.rk-SSS,.rk-SS{background:linear-gradient(180deg,#fff27a,#ff2e63);-webkit-background-clip:text;background-clip:text;color:transparent!important}
.rk-S{color:#ffb703!important}.rk-A{color:#ff2e63!important}.rk-B{color:#2fa8ff!important}.rk-C{color:#3ddc84!important}.rk-D,.rk-F{color:#8a8494!important}

/* 結果 */
.lb-res{width:min(1000px,100%);display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:16px;padding:clamp(16px,2.4vw,26px);border-radius:24px;background:rgba(255,255,255,.96);color:#1c1a21;box-shadow:0 20px 60px rgba(20,0,60,.4);animation:resIn .5s cubic-bezier(.3,1.5,.5,1)}
@keyframes resIn{from{transform:scale(.85);opacity:0}}
.lb-res-l{text-align:center;display:grid;justify-items:center;gap:4px;align-content:start}
.lb-rank{font:400 clamp(110px,14vw,170px)/.85 var(--disp);filter:drop-shadow(5px 5px 0 rgba(58,12,163,.25));animation:rankIn .8s .2s cubic-bezier(.2,1.8,.4,1) both}
@keyframes rankIn{from{transform:scale(3) rotate(-14deg);opacity:0}}
.lb-res-l img{width:min(180px,40vw);height:auto;margin-top:-10px}
.lb-fc,.lb-fl{margin:0;font:400 28px/1 var(--disp);letter-spacing:.1em;color:#ff2e63}.lb-fc.ap{background:linear-gradient(90deg,#ff4f9a,#ffc93c,#2fd8ff,#a66bff);-webkit-background-clip:text;background-clip:text;color:transparent}.lb-fc.cl{color:#3a0ca3}.lb-fl{color:#77727f}
.lb-res-r{display:grid;gap:8px;align-content:start}
.lb-sc{margin:0;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}.lb-sc small{font:400 16px/1 var(--disp);letter-spacing:.2em;color:#77727f}.lb-sc b{font:400 clamp(48px,6vw,72px)/1 var(--disp);color:#3a0ca3}
.lb-sc em{font:400 22px/1 var(--disp);font-style:normal;color:#fff;background:#ff2e63;padding:5px 10px;border-radius:8px;animation:arcPulse 1s infinite}
.lb-jb{display:grid;grid-template-columns:86px 1fr 46px;gap:10px;align-items:center;font:400 18px/1 var(--disp);letter-spacing:.06em}
.lb-jb span{text-shadow:0 1px 0 rgba(0,0,0,.35)}.lb-jb i{height:10px;border-radius:9px;background:#f0ebe2;overflow:hidden}.lb-jb b{display:block;height:100%;width:var(--w);border-radius:9px;animation:barIn 1s ease-out both}.lb-jb em{font-style:normal;text-align:right}
@keyframes barIn{from{width:0}}
.lb-learn{grid-column:1/-1;border-top:2px dashed #e6dfd1;padding-top:12px}
.lb-learn h4{margin:0 0 8px;font-size:17px}.lb-learn h4 small{color:#ff2e63;margin-left:6px}
.lb-learn ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:8px}
.lb-learn li{display:grid;grid-template-columns:auto 1fr auto;gap:2px 8px;align-items:center;padding:9px 12px;border-radius:12px;background:#f4efe5}
.lb-learn li.ok{background:#e8fbef}.lb-learn li.ng{background:#fdecef}
.lb-learn li i{font-style:normal;font-weight:900;color:#1f9d57}.lb-learn li.ng i{color:#d61f4b}
.lb-learn li b{font-size:16px}.lb-learn li span{grid-column:2/-1;font-size:13px;color:#45414d}.lb-learn li a{grid-column:2/-1;font-size:12px;color:#a86b00}
.lb-learn .say{width:30px;height:30px;border-radius:50%;background:#fff;display:grid;place-items:center;color:#ff2e63}.lb-learn .say svg{width:17px}
.lb-btns{grid-column:1/-1;display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.lb-pause{display:grid;gap:12px;justify-items:center;padding:30px 40px;border-radius:24px;background:rgba(255,255,255,.95)}.lb-pause h3{margin:0;font:400 64px/1 var(--disp);color:#3a0ca3;letter-spacing:.1em}

/* XP */
.ax-xp{padding:12px 14px;border-radius:14px;background:linear-gradient(110deg,#3a0ca3,#7209b7);color:#fff;display:grid;gap:6px}
.ax-xp-h{display:flex;justify-content:space-between;align-items:baseline;gap:8px}.ax-xp-h b{font:400 28px/1 var(--disp);color:#ffe066}.ax-xp-h span{font-weight:900;font-size:14px}
.ax-bar{height:12px;border-radius:9px;background:rgba(255,255,255,.2);overflow:hidden}.ax-bar i{display:block;height:100%;width:var(--w);background:linear-gradient(90deg,#ff4f9a,#ffe066);border-radius:9px;animation:barIn 1.2s .3s ease-out both}
.ax-xp small{font-size:11px;opacity:.85}
.ax-lvup{margin:0;font:400 26px/1 var(--disp);letter-spacing:.1em;color:#ffe066;animation:arcPulse 1s infinite}
.ax-newb{display:grid;gap:6px}.ax-newb span{display:flex;gap:8px;align-items:center;padding:6px 10px;border-radius:10px;background:rgba(255,255,255,.16);font-size:13px;animation:resIn .5s .6s both}.ax-newb i{font-style:normal;font-size:22px}

/* WORD METEOR */
.wm-in{position:absolute;left:0;bottom:0;width:1px;height:1px;opacity:0;font-size:16px;border:0;padding:0}
.wm-res .lb-rank{font-size:clamp(90px,11vw,130px)}

@media (max-width:760px){
  .lb-sel,.lb-res{grid-template-columns:minmax(0,1fr)}
  .lb-list{grid-template-columns:minmax(0,1fr)}
  .lb-tr{scroll-snap-align:none}.lb-tr:hover,.lb-tr.on{transform:none}
  .lb-det h3{font-size:40px}.lb-res-l img{display:none}
  .arc{border-radius:18px;box-shadow:0 0 0 3px #fff,0 0 0 6px #ff2e63,0 16px 40px rgba(120,30,140,.3)}
  .arc-ov{align-items:start}
}

/* ゲームコーナーのトップ */
.ax-hero{position:relative;overflow:hidden;background:linear-gradient(180deg,#fff6e0,#ffe1ef);border-bottom:1px solid var(--line)}
.ax-hero-in{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:24px;align-items:center;padding-block:clamp(30px,5vw,60px)}
.ax-hero-img{position:relative;border-radius:24px;overflow:hidden;box-shadow:0 0 0 4px #fff,0 0 0 8px #ff2e63,0 24px 60px rgba(160,40,120,.25);rotate:1.5deg}
.ax-hero-img img{display:block;width:100%;height:auto}
.ax-hero h1{font-size:clamp(30px,4.6vw,58px);font-weight:900;line-height:1.15;letter-spacing:-.02em;margin:8px 0 14px}
.ax-hero h1 em{font-style:normal;background:linear-gradient(100deg,#ff8a00,#ff2e63 60%,#7209b7);-webkit-background-clip:text;background-clip:text;color:transparent}
.ax-marq{display:inline-flex;gap:8px;align-items:center;font:400 16px/1 var(--disp);letter-spacing:.3em;color:#ff2e63}
.ax-marq i{width:10px;height:10px;border-radius:50%;background:#ff2e63;animation:blink 1s steps(2) infinite}.ax-marq i:nth-child(2){background:#ffb703;animation-delay:.33s}.ax-marq i:nth-child(3){background:#2fa8ff;animation-delay:.66s}
@keyframes blink{50%{opacity:.2}}
.ax-card{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center;padding:16px 18px;border-radius:20px;background:linear-gradient(110deg,#3a0ca3,#7209b7 60%,#f72585);color:#fff;box-shadow:0 14px 40px rgba(90,20,140,.3);margin-top:18px}
.ax-lv{display:grid;place-items:center;width:92px;height:92px;border-radius:50%;background:radial-gradient(circle,#fff27a,#ffb703);color:#3a0ca3;box-shadow:0 0 0 5px rgba(255,255,255,.35)}
.ax-lv small{font:400 10px/1 var(--disp);letter-spacing:.14em;margin-top:14px}.ax-lv b{font:400 46px/.8 var(--disp);margin-bottom:12px}
.ax-title{margin:0 0 6px;font-weight:900;font-size:18px}.ax-num{margin:6px 0 8px;font-size:12px;opacity:.85}
.ax-stats{list-style:none;margin:0;padding:0;display:flex;gap:6px;flex-wrap:wrap}.ax-stats li{font-size:11px;padding:4px 9px;border-radius:999px;background:rgba(255,255,255,.16)}.ax-stats b{font:400 17px/1 var(--disp);margin-right:4px;color:#ffe066}
.ax-feat{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.ax-big{position:relative;display:grid;border-radius:26px;overflow:hidden;color:#fff;background:#1a0b3a;text-decoration:none;box-shadow:0 18px 50px rgba(80,20,120,.25);transition:transform .3s cubic-bezier(.3,1.5,.5,1),box-shadow .3s;isolation:isolate}
.ax-big:hover{transform:translateY(-8px) rotate(-.6deg);box-shadow:0 30px 70px rgba(200,40,120,.35)}
.ax-big img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;display:block;transition:transform .6s}
.ax-big:hover img{transform:scale(1.06)}
.ax-big-t{padding:18px 22px 22px;display:grid;gap:6px;background:linear-gradient(110deg,var(--a),var(--b))}
.ax-big-t small{font:400 15px/1 var(--disp);letter-spacing:.24em;opacity:.95}.ax-big-t b{font:400 clamp(40px,4.6vw,58px)/.9 var(--disp);letter-spacing:.02em;text-shadow:3px 3px 0 rgba(0,0,0,.25)}.ax-big-t strong{font-size:16px;font-weight:900}
.ax-big-t ul{margin:4px 0 0;padding-left:1.2em;font-size:13.5px;line-height:1.75}
.ax-big-t i{font-style:normal;justify-self:start;margin-top:6px}
.ax-new{position:absolute;top:14px;left:14px;z-index:2;font:400 18px/1 var(--disp);letter-spacing:.14em;background:#ffe066;color:#1c0b33;padding:7px 12px;border-radius:10px;rotate:-6deg;box-shadow:0 4px 0 #c26a00;animation:arcPulse 1.4s infinite}
.ax-badges{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.ax-badges li{display:grid;gap:3px;justify-items:center;text-align:center;padding:14px 10px;border-radius:16px;background:var(--card2);border:2px dashed var(--line);filter:grayscale(1);opacity:.7}
.ax-badges li.on{filter:none;opacity:1;border:2px solid #ffb703;background:linear-gradient(180deg,#fffbe6,#fff);box-shadow:0 8px 20px rgba(255,183,3,.2)}
.ax-badges i{font-style:normal;font-size:32px}.ax-badges b{font-size:13.5px}.ax-badges small{font-size:11px;color:var(--mut);line-height:1.5}
.ax-why{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.ax-why div{padding:18px;border-radius:18px;background:var(--card);border:1px solid var(--line)}.ax-why h3{margin:0 0 6px;font-size:16px}.ax-why p{margin:0;font-size:13.5px;line-height:1.8;color:var(--tx2)}
.ax-credit{font-size:12px;color:var(--mut);line-height:1.8}
@media (max-width:760px){.ax-hero-in,.ax-feat{grid-template-columns:minmax(0,1fr)}.ax-hero-img{rotate:0deg}.ax-lv{width:74px;height:74px}.ax-lv b{font-size:36px}}