:root{
    --bg:#07090d; --panel:#11151d; --panel2:#171d27; --ink:#f7f0de; --muted:#9fa8b7;
    --gold:#e8c267; --gold2:#9d7833; --green:#53d88b; --yellow:#f1c75b; --red:#ff6b68;
    --cyan:#70d7e8; --violet:#9d7dff; --line:rgba(255,255,255,.08); --shadow:0 18px 50px rgba(0,0,0,.45);
  }
  *{box-sizing:border-box}
  html,body{margin:0;background:radial-gradient(circle at 50% -10%,#20283b 0,#0b0e14 38%,#06080b 75%);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;min-height:100%;}
  body{display:flex;flex-direction:column;align-items:center;}
  button{font:inherit}
  .app{width:min(100%,540px);min-height:100vh;position:relative;overflow:hidden;background:linear-gradient(180deg,rgba(14,18,26,.88),rgba(6,8,12,.96));border-left:1px solid rgba(255,255,255,.05);border-right:1px solid rgba(255,255,255,.05);}
  .app:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:28px 28px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.6),transparent 65%)}

  .topbar{position:relative;z-index:8;padding:14px 14px 10px;background:linear-gradient(180deg,rgba(6,8,11,.94),rgba(8,10,14,.68),transparent);}
  .brandrow{display:flex;align-items:center;justify-content:space-between;gap:10px}
  .brand{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:.08em;font-size:12px;color:#f7e6b3}
  .sigil{width:28px;height:28px;border-radius:50%;border:1px solid #9a7a39;display:grid;place-items:center;box-shadow:inset 0 0 16px rgba(233,194,103,.22),0 0 18px rgba(233,194,103,.08);font-size:14px}
  .top-actions{display:flex;align-items:center;gap:8px}.statusline{display:flex;align-items:center;gap:6px;color:#97a3b5;font-size:10px;text-transform:uppercase;letter-spacing:.12em}.rulesbtn{height:30px;padding:0 12px;border-radius:999px;border:1px solid rgba(232,194,103,.28);background:linear-gradient(180deg,rgba(33,40,54,.96),rgba(16,20,27,.96));color:#f2ddb0;font-size:10px;font-weight:1000;letter-spacing:.08em;cursor:pointer;box-shadow:0 8px 18px rgba(0,0,0,.22)}.rulesbtn:active{transform:scale(.98)}
  .live-dot{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green);animation:pulse 1.4s infinite}
  @keyframes pulse{50%{opacity:.35;transform:scale(.75)}}
  .stats{display:grid;grid-template-columns:1fr 1fr 1.15fr;gap:8px;margin-top:10px}
  .stat{background:linear-gradient(180deg,rgba(31,37,49,.92),rgba(17,22,30,.92));border:1px solid var(--line);border-radius:14px;padding:10px 10px 9px;box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
  .stat small{display:block;color:#8490a1;font-weight:800;font-size:9px;letter-spacing:.12em;text-transform:uppercase}
  .stat strong{display:block;margin-top:4px;font-size:18px;line-height:1}.stat strong.gold{color:#f3d17c}.stat strong.green{color:#74e0a2}
  .timerstat{position:relative;overflow:hidden}
  .timerstat .progress{position:absolute;left:0;bottom:0;height:2px;width:100%;background:linear-gradient(90deg,var(--gold),#f1df9f);transform-origin:left center}
  .timerstat.locked{border-color:rgba(255,107,104,.45);box-shadow:0 0 20px rgba(255,107,104,.08),inset 0 1px 0 rgba(255,255,255,.03)}

  .flow{position:relative;z-index:7;margin:0 14px 10px;padding:10px 11px;background:rgba(12,16,22,.88);border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 30px rgba(0,0,0,.18);backdrop-filter:blur(10px)}
  .flowhead{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px}.flowhead b{font-size:11px;letter-spacing:.06em}.flowhead span{font-size:9px;color:#768293}
  .flowline{display:flex;align-items:flex-start;gap:7px;min-width:0}.flowline+.flowline{margin-top:7px}.flowlabel{width:48px;flex:0 0 48px;color:#8f9aab;font-size:9px;font-weight:800;padding-top:6px}.dicehist{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:4px;flex:1;min-width:0;align-items:center}.enemyhist{display:flex;gap:5px;overflow:hidden;flex:1;min-width:0}.enemyhist .dotcard{height:23px;min-width:44px;padding:0 5px;border-radius:6px;display:flex;align-items:center;gap:4px;background:#1a202b;border:1px solid rgba(255,255,255,.07);font-size:8px;color:#d5dae3;white-space:nowrap}.die-face{position:relative;border-radius:7px;background:#ffffff;border:1px solid rgba(0,0,0,.2);box-shadow:0 4px 12px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.8)}.mini-die{width:18px;height:18px;min-width:0;justify-self:center;align-self:center;border-radius:5px}.mini-die.placeholder{background:linear-gradient(145deg,#1b222e,#141923);border-color:rgba(255,255,255,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}.mini-die.latest{box-shadow:0 0 0 1px rgba(232,194,103,.38),0 4px 12px rgba(0,0,0,.22),0 0 18px rgba(232,194,103,.22),inset 0 1px 0 rgba(255,255,255,.8)}.pip{position:absolute;border-radius:50%;background:#0a0a0a;box-shadow:none}.mini-die .pip{width:3.5px;height:3.5px}.bigdie .pip{width:12px;height:12px}.pip.tl{left:18%;top:18%}.pip.tc{left:50%;top:18%;transform:translateX(-50%)}.pip.tr{right:18%;top:18%}.pip.cl{left:18%;top:50%;transform:translateY(-50%)}.pip.cc{left:50%;top:50%;transform:translate(-50%,-50%)}.pip.cr{right:18%;top:50%;transform:translateY(-50%)}.pip.bl{left:18%;bottom:18%}.pip.bc{left:50%;bottom:18%;transform:translateX(-50%)}.pip.br{right:18%;bottom:18%}.resdot{width:6px;height:6px;border-radius:50%;flex:0 0 6px}.win{background:var(--green)}.draw{background:var(--yellow)}.lose{background:var(--red)}

  .dungeon{position:relative;height:650px;overflow:hidden;border-top:1px solid rgba(255,255,255,.03);border-bottom:1px solid rgba(255,255,255,.03);background:linear-gradient(180deg,#1a202a 0,#11161e 62%,#080b10 100%)}
  .dungeon:after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.52;background:linear-gradient(90deg,transparent 0 49%,rgba(0,0,0,.22) 50% 52%,transparent 53%) 0 0/112px 54px,repeating-linear-gradient(0deg,transparent 0 50px,rgba(4,6,9,.75) 51px 54px),radial-gradient(ellipse at 50% 105%,rgba(86,70,48,.28),transparent 58%)}
  .dungeon:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 14% 22%,rgba(255,151,68,.14),transparent 20%),radial-gradient(circle at 86% 28%,rgba(255,151,68,.11),transparent 18%),radial-gradient(ellipse at 50% 70%,rgba(112,215,232,.08),transparent 38%),linear-gradient(180deg,rgba(0,0,0,.06),rgba(0,0,0,.52));z-index:1;pointer-events:none}
  .mist{position:absolute;width:300px;height:120px;border-radius:50%;filter:blur(28px);background:rgba(130,146,185,.05);animation:mist 7s linear infinite;z-index:1}@keyframes mist{from{transform:translateX(-260px)}to{transform:translateX(540px)}}
  .world{position:absolute;inset:0;z-index:2;transform:translateY(0);transition:transform .37s cubic-bezier(.22,.74,.25,1)}
  .world.moving{filter:drop-shadow(0 14px 18px rgba(0,0,0,.18))}
  .path-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
  .route-line{fill:none;stroke:rgba(232,194,103,.72);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:7 8;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 5px rgba(232,194,103,.38));animation:routeFlow 1.4s linear infinite}
  @keyframes routeFlow{to{stroke-dashoffset:-15}}
  .rock{position:absolute;width:50px;height:34px;background:linear-gradient(145deg,#2a2f38,#11151b);clip-path:polygon(15% 70%,30% 20%,62% 5%,88% 42%,76% 86%,38% 100%);opacity:.6;filter:drop-shadow(0 9px 8px rgba(0,0,0,.5))}.r1{left:8%;top:70px;transform:rotate(-12deg)}.r2{right:6%;top:175px;transform:rotate(13deg) scale(.85)}.r3{left:5%;bottom:55px;transform:rotate(18deg) scale(1.2)}
  .torch{position:absolute;width:5px;height:24px;background:#5b4430;border-radius:4px;z-index:2}.torch:before{content:"";position:absolute;width:14px;height:18px;left:-4px;top:-13px;border-radius:50% 50% 45% 45%;background:radial-gradient(circle at 50% 65%,#fff0a0 0 16%,#ffae3d 18% 47%,#ff5b32 50% 70%,transparent 72%);filter:drop-shadow(0 0 10px #ff8a3d);animation:flame .4s ease-in-out infinite alternate}@keyframes flame{to{transform:translateY(-2px) scale(.88,1.12)}}.t1{left:24%;top:212px}.t2{right:20%;top:98px}
  .themechip{position:absolute;left:50%;top:11px;transform:translateX(-50%);z-index:5;padding:5px 9px;border-radius:99px;background:rgba(10,13,18,.72);border:1px solid rgba(255,255,255,.07);font-size:8px;color:#9aa6b7;letter-spacing:.13em;text-transform:uppercase;backdrop-filter:blur(8px)}
  .node{position:absolute;transform:translate(-50%,-50%);z-index:4;text-align:center;transition:filter .3s ease}
  .node .num{position:absolute;left:-9px;top:-9px;z-index:3;width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:#0d1118;border:1px solid #8b703d;color:#e8ca7e;font-size:10px;font-weight:1000;box-shadow:0 4px 12px rgba(0,0,0,.38)}
  .enemy-card{position:relative;width:clamp(54px,8vw,76px);height:clamp(72px,10vw,96px);border-radius:12px;padding:7px 6px;background:linear-gradient(145deg,#292f3c,#121722);border:1px solid rgba(255,255,255,.12);box-shadow:0 10px 20px rgba(0,0,0,.4),inset 0 0 24px rgba(255,255,255,.025);overflow:hidden}
  .enemy-card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 28%,var(--aura,rgba(255,255,255,.12)),transparent 45%);opacity:.7}.enemy-card .art{position:relative;height:46px;display:grid;place-items:center;font-size:31px;filter:drop-shadow(0 5px 5px rgba(0,0,0,.6))}.enemy-card .elbadge{position:absolute;right:4px;top:4px;z-index:2;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:rgba(7,10,14,.72);border:1px solid rgba(255,255,255,.12);font-size:10px}.enemy-card .ename{position:relative;font-size:7px;font-weight:1000;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:1px}.enemy-card .etype{position:relative;font-size:6px;color:#a8b0bd;margin-top:1px}.matchtag{position:absolute;z-index:3;left:50%;bottom:-8px;transform:translateX(-50%);width:38px;height:16px;border-radius:99px;display:grid;place-items:center;font-size:8px;font-weight:1000;color:#07100b;box-shadow:0 5px 10px rgba(0,0,0,.32)}.matchtag.win{background:#69dd9a}.matchtag.draw{background:#efd069;color:#17120a}.matchtag.lose{background:#ff7a73;color:#1a0807}
  .enemy-card .art{height:58px;font-size:39px}.enemy-card .ename{font-size:8px}.enemy-card .etype{font-size:7px}
  .node.selected{z-index:8}.node.selected .enemy-card{transform:scale(1.12);border-color:#f0d07b;box-shadow:0 0 0 1px rgba(240,208,123,.25),0 0 34px rgba(240,208,123,.22),0 15px 26px rgba(0,0,0,.5)}
  .node.selected .num{background:#e3bf62;color:#111;border-color:#f2da95}

  .player-anchor{position:absolute;left:14%;top:82%;transform:translate(-50%,-50%);z-index:7;display:grid;place-items:center;pointer-events:none;transition:left .37s cubic-bezier(.22,.74,.25,1)}
  .player-ring{width:86px;height:86px;border-radius:50%;border:1px solid rgba(112,215,232,.34);box-shadow:0 0 35px rgba(112,215,232,.13),inset 0 0 24px rgba(112,215,232,.08);display:grid;place-items:center;animation:ring 3s linear infinite}@keyframes ring{50%{transform:scale(1.06);opacity:.8}}
  .player{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 40% 35%,#36475c,#131a24 62%,#090d12);border:1px solid #87cad8;box-shadow:0 10px 24px rgba(0,0,0,.5);font-size:27px;position:relative}
  .player:after{content:"YOU";position:absolute;bottom:-16px;font-size:8px;font-weight:900;letter-spacing:.16em;color:#8dd7e5}
  .centerline{display:none}
  .direction{position:absolute;right:13px;bottom:11px;z-index:5;color:#748092;font-size:8px;letter-spacing:.1em}.direction b{color:#c8d0dc}

  .dice-stage{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);z-index:10;pointer-events:none;opacity:0;transition:opacity .16s ease}.dice-stage.show{opacity:1}.dice-roulette{position:relative;width:150px;height:150px;display:grid;place-items:center}.roulette-ring{position:absolute;border-radius:50%;border:2px solid rgba(232,194,103,.32);box-shadow:0 0 22px rgba(232,194,103,.18), inset 0 0 22px rgba(232,194,103,.08)}.roulette-ring.outer{width:150px;height:150px;border-style:dashed}.roulette-ring.mid{width:118px;height:118px;border-color:rgba(112,215,232,.28)}.roulette-ring.inner{width:96px;height:96px;border-color:rgba(255,255,255,.08)}.roulette-pointer{position:absolute;top:-7px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:9px solid transparent;border-right:9px solid transparent;border-top:15px solid #f2ddb0;filter:drop-shadow(0 0 10px rgba(242,221,176,.45))}.dice-roulette.rolling .roulette-ring.outer{animation:wheelSpin 1s linear infinite}.dice-roulette.rolling .roulette-ring.mid{animation:wheelSpinReverse .82s linear infinite}.dice-roulette.rolling .bigdie{animation:diePop .46s ease-in-out infinite}.bigdie{position:relative;width:84px;height:84px;border-radius:18px;display:block;background:#fff;border:2px solid rgba(0,0,0,.18);box-shadow:0 0 0 7px rgba(255,255,255,.04),0 0 26px rgba(255,255,255,.12),0 18px 40px rgba(0,0,0,.55)}.dicecaption{margin-top:10px;text-align:center;font-size:10px;font-weight:900;letter-spacing:.14em;color:#f2ddb0;text-shadow:0 0 18px rgba(232,194,103,.2)}@keyframes wheelSpin{from{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes wheelSpinReverse{from{transform:rotate(0)}to{transform:rotate(-360deg)}}@keyframes diePop{0%{transform:scale(.9) rotate(-8deg)}50%{transform:scale(1.06) rotate(8deg)}100%{transform:scale(.9) rotate(-8deg)}}
  .dicecaption{text-align:center;margin-top:8px;font-size:9px;letter-spacing:.15em;font-weight:900;color:#f2d582;text-shadow:0 2px 10px #000}

  .battle{position:absolute;inset:0;z-index:20;display:none;place-items:center;background:radial-gradient(circle at center,rgba(31,39,55,.86),rgba(4,6,10,.93));backdrop-filter:blur(5px)}.battle.show{display:grid}.battlebox{position:relative;text-align:center;width:min(100%,360px);padding:10px 12px}.battle-seq{position:relative}.battle-glow{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);width:250px;height:250px;border-radius:50%;filter:blur(24px);opacity:0}.versus{display:flex;align-items:center;justify-content:center;gap:18px;position:relative;z-index:2}.battlecard{width:104px;height:134px;border-radius:14px;padding:10px;background:linear-gradient(145deg,#262e3d,#10151d);border:1px solid rgba(255,255,255,.14);box-shadow:0 18px 40px rgba(0,0,0,.45);display:grid;place-items:center;opacity:0;transform:translateY(16px) scale(.92);transition:transform .28s ease,opacity .28s ease}.battlecard .emoji{font-size:46px}.battlecard b{font-size:10px}.vs{font-size:15px;font-weight:1000;color:#f0cc72;text-shadow:0 0 18px rgba(240,204,114,.45);opacity:0;transform:scale(.7);transition:transform .24s ease,opacity .24s ease}.clash{font-size:36px;margin:10px 0 4px;opacity:0;transform:scale(.35) rotate(-18deg);transition:transform .28s ease,opacity .28s ease;position:relative;z-index:2}.battle-result{font-size:29px;font-weight:1000;letter-spacing:.08em;margin-top:10px;opacity:0;transform:translateY(10px) scale(.82);position:relative;z-index:2}.battle-pred{font-size:11px;font-weight:900;margin-top:6px;opacity:0;transform:translateY(8px);transition:transform .22s ease,opacity .22s ease;position:relative;z-index:2}.battlebox.reveal-me .battlecard.me{opacity:1;transform:translateY(0) scale(1)}.battlebox.reveal-vs .vs{opacity:1;transform:scale(1)}.battlebox.reveal-foe .battlecard.foe{opacity:1;transform:translateY(0) scale(1)}.battlebox.reveal-clash .clash{opacity:1;transform:scale(1.06) rotate(0)}.battlebox.reveal-result .battle-result{opacity:1;transform:translateY(0) scale(1)}.battlebox.reveal-pred .battle-pred{opacity:1;transform:translateY(0) scale(1)}.battlebox.state-win .battle-glow{background:radial-gradient(circle,rgba(83,216,139,.42),rgba(83,216,139,.04) 62%,transparent 75%);animation:glowWin .8s ease-out forwards}.battlebox.state-draw .battle-glow{background:radial-gradient(circle,rgba(241,199,91,.42),rgba(241,199,91,.05) 62%,transparent 75%);animation:glowDraw .8s ease-out forwards}.battlebox.state-lose .battle-glow{background:radial-gradient(circle,rgba(255,107,104,.4),rgba(255,107,104,.05) 62%,transparent 75%);animation:glowLose .8s ease-out forwards}.battle-result.win{color:#74e0a2;text-shadow:0 0 20px rgba(116,224,162,.3)}.battle-result.draw{color:#efd069;text-shadow:0 0 20px rgba(239,208,105,.28)}.battle-result.lose{color:#ff7b76;text-shadow:0 0 20px rgba(255,123,118,.25)}.battlebox.reveal-result .battle-result.win{animation:resultWin .66s ease-out both}.battlebox.reveal-result .battle-result.draw{animation:resultDraw .66s ease-out both}.battlebox.reveal-result .battle-result.lose{animation:resultLose .72s ease-out both}.battlebox.reveal-result .clash{animation:clashBurst .42s ease-out both}.battlebox.state-win.reveal-result .battlecard.me{animation:winnerSurge .72s cubic-bezier(.2,.85,.2,1) both}.battlebox.state-win.reveal-result .battlecard.foe{animation:loserKnockRight .72s ease-out both}.battlebox.state-draw.reveal-result .battlecard.me{animation:drawLeft .74s ease-out both}.battlebox.state-draw.reveal-result .battlecard.foe{animation:drawRight .74s ease-out both}.battlebox.state-lose.reveal-result .battlecard.foe{animation:winnerSurgeLeft .72s cubic-bezier(.2,.85,.2,1) both}.battlebox.state-lose.reveal-result .battlecard.me{animation:loserKnockLeft .72s ease-out both}.correct{color:#74e0a2}.wrong{color:#ff7b76}.nopred{color:#9aa6b5}@keyframes clashBurst{0%{transform:scale(.92)}50%{transform:scale(1.22)}100%{transform:scale(1)}}@keyframes resultWin{0%{transform:translateY(12px) scale(.72)}60%{transform:translateY(-4px) scale(1.12)}100%{transform:translateY(0) scale(1)}}@keyframes resultDraw{0%{transform:translateY(12px) scale(.72)}55%{transform:translateY(0) scale(1.04)}70%{transform:translateX(-4px) scale(1)}85%{transform:translateX(4px) scale(1)}100%{transform:translateX(0) scale(1)}}@keyframes resultLose{0%{transform:translateY(10px) scale(.74)}40%{transform:translateY(0) scale(1.08)}55%{transform:translateX(-5px) scale(1)}70%{transform:translateX(5px) scale(1)}100%{transform:translateX(0) scale(1)}}@keyframes glowWin{0%{opacity:0;transform:translate(-50%,-50%) scale(.55)}100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes glowDraw{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}100%{opacity:.92;transform:translate(-50%,-50%) scale(.95)}}@keyframes glowLose{0%{opacity:0;transform:translate(-50%,-50%) scale(.55)}100%{opacity:.95;transform:translate(-50%,-50%) scale(1.05)}}@keyframes winnerSurge{0%{transform:translateX(0) scale(1)}45%{transform:translateX(18px) scale(1.12) rotate(2deg);filter:brightness(1.22)}100%{transform:translateX(8px) scale(1.06)}}@keyframes winnerSurgeLeft{0%{transform:translateX(0) scale(1)}45%{transform:translateX(-18px) scale(1.12) rotate(-2deg);filter:brightness(1.22)}100%{transform:translateX(-8px) scale(1.06)}}@keyframes loserKnockRight{0%{transform:translateX(0) scale(1);opacity:1}45%{transform:translateX(28px) scale(.92) rotate(5deg);filter:brightness(.72)}100%{transform:translateX(18px) scale(.94);opacity:.62}}@keyframes loserKnockLeft{0%{transform:translateX(0) scale(1);opacity:1}45%{transform:translateX(-28px) scale(.92) rotate(-5deg);filter:brightness(.72)}100%{transform:translateX(-18px) scale(.94);opacity:.62}}@keyframes drawLeft{0%{transform:translateX(0) scale(1)}38%{transform:translateX(11px) scale(1.06)}58%{transform:translateX(5px) scale(1.02)}100%{transform:translateX(0) scale(1)}}@keyframes drawRight{0%{transform:translateX(0) scale(1)}38%{transform:translateX(-11px) scale(1.06)}58%{transform:translateX(-5px) scale(1.02)}100%{transform:translateX(0) scale(1)}}

  .cards{padding:12px 14px 8px;position:relative;z-index:7;background:linear-gradient(180deg,rgba(10,13,18,.4),rgba(7,9,12,.94))}
  .cardrow{display:grid;grid-template-columns:1.55fr .75fr .75fr;gap:8px}
  .hero-card{position:relative;overflow:hidden;min-height:92px;border-radius:14px;border:1px solid rgba(255,255,255,.09);background:linear-gradient(145deg,#202735,#11161f);padding:10px;box-shadow:var(--shadow)}
  .hero-card.current{border-color:rgba(232,194,103,.42);background:linear-gradient(145deg,#2c2b2b,#161921)}
  .hero-card:before{content:"";position:absolute;width:100px;height:100px;border-radius:50%;right:-28px;top:-34px;background:var(--glow,rgba(255,255,255,.08));filter:blur(18px)}
  .label{position:relative;color:#7f8998;font-size:8px;font-weight:900;letter-spacing:.12em}.current .label{color:#dfc16e}.cardcontent{position:relative;display:flex;align-items:center;gap:8px;margin-top:8px}.portrait{position:relative;width:48px;height:48px;border-radius:12px;display:grid;place-items:center;font-size:30px;background:rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.07)}.portrait .element-badge{position:absolute;right:-4px;bottom:-4px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:#11161e;border:1px solid rgba(255,255,255,.13);font-size:11px}.current .portrait{width:54px;height:54px;font-size:34px}.cardname{font-size:12px;font-weight:1000}.cardmeta{font-size:8px;color:#9ca6b5;margin-top:3px}.next-mini .cardcontent{display:block}.next-mini .portrait{width:38px;height:38px;font-size:24px;margin-bottom:5px}.next-mini .portrait .element-badge{width:17px;height:17px;font-size:9px}.next-mini .cardname{font-size:9px}.next-mini .cardmeta{font-size:7px}

  .odds{margin-top:8px;background:#0f141c;border:1px solid var(--line);border-radius:12px;padding:8px}.oddshead{display:flex;justify-content:space-between;align-items:center;margin-bottom:7px}.oddshead b{font-size:9px;letter-spacing:.05em}.oddshead span{font-size:8px;color:#778393}.oddsgrid{display:grid;grid-template-columns:repeat(6,1fr);gap:5px}.oddit{border-radius:8px;background:#171e29;border:1px solid rgba(255,255,255,.06);padding:5px 2px;text-align:center}.oddit b{display:block;font-size:9px}.oddit span{display:block;margin-top:3px;font-size:8px;font-weight:900}.oddit.win span{color:#63db95}.oddit.draw span{color:#efd069}.oddit.lose span{color:#ff7770}

  .demo{position:absolute;left:10px;bottom:75px;z-index:31;padding:5px 8px;border-radius:8px;border:1px solid rgba(255,255,255,.08);background:#111720;color:#7f8b9a;font-size:8px;cursor:pointer}.demo.on{color:#e7c86f;border-color:rgba(231,200,111,.35)}

    .rules-modal{position:fixed;inset:0;z-index:60;display:none;align-items:flex-end;background:rgba(4,7,11,.72);backdrop-filter:blur(6px)}.rules-modal.open{display:flex}.rules-sheet{width:min(100%,540px);max-height:82vh;overflow:auto;margin:0 auto;background:linear-gradient(180deg,#171d27,#0d1219);border-top-left-radius:22px;border-top-right-radius:22px;border:1px solid rgba(255,255,255,.08);box-shadow:0 -20px 50px rgba(0,0,0,.45);padding:16px 16px max(20px,env(safe-area-inset-bottom))}.rules-sheet h3{margin:0;font-size:18px}.rules-sub{margin-top:4px;color:#9aa6b7;font-size:12px}.rules-list{display:grid;gap:10px;margin-top:14px}.rule-item{background:#121821;border:1px solid rgba(255,255,255,.07);border-radius:14px;padding:11px 12px}.rule-item b{display:block;font-size:12px;color:#f3d17c;margin-bottom:4px}.rule-item p{margin:0;font-size:11px;line-height:1.55;color:#d4dae3}.rules-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}.sheetbtn{height:38px;padding:0 14px;border-radius:12px;border:1px solid rgba(255,255,255,.08);background:#111720;color:#f1f3f5;font-weight:900;cursor:pointer}.sheetbtn.primary{border-color:rgba(232,194,103,.32);color:#f2ddb0;background:linear-gradient(180deg,rgba(36,43,58,.96),rgba(17,22,31,.96))}
  @media (max-width:380px){.dungeon{height:680px}.enemy-card{width:50px;height:68px;padding:4px}.enemy-card .art{height:42px;font-size:28px}.enemy-card .ename{font-size:6px}.enemy-card .etype{font-size:5px}.node .num{left:-6px;top:-8px;width:19px;height:19px;font-size:8px}.matchtag{bottom:-7px;width:32px;height:14px;font-size:7px}.cardrow{grid-template-columns:1.45fr .8fr .8fr}.hero-card{padding:8px}.current .portrait{width:48px;height:48px}.player-ring{width:62px;height:62px}.player{width:44px;height:44px;font-size:22px}.player-anchor{top:82%}}

  /* Node/PHP runtime refinements */
  .mini-die{width:18px!important;height:18px!important}
  .mini-die .pip{width:3.2px!important;height:3.2px!important}
  .flowlabel{padding-top:4px!important}
  .engine-state{font-size:8px;font-weight:900;letter-spacing:.08em;color:#74e0a2}
  .engine-state.offline{color:#ff7b76}
  .battle-result.win,.battle-result.draw,.battle-result.lose{background:transparent!important}
  .battlebox.state-win.reveal-result .battlecard.me{animation:meVictoryStrike .72s cubic-bezier(.2,.8,.2,1) both}
  .battlebox.state-win.reveal-result .battlecard.foe{animation:foeDefeated .72s cubic-bezier(.2,.8,.2,1) both}
  .battlebox.state-draw.reveal-result .battlecard.me{animation:drawLeft .72s ease-in-out both}
  .battlebox.state-draw.reveal-result .battlecard.foe{animation:drawRight .72s ease-in-out both}
  .battlebox.state-lose.reveal-result .battlecard.me{animation:meDefeated .72s cubic-bezier(.2,.8,.2,1) both}
  .battlebox.state-lose.reveal-result .battlecard.foe{animation:foeVictoryStrike .72s cubic-bezier(.2,.8,.2,1) both}
  .battlebox.state-win.reveal-result .clash{filter:drop-shadow(0 0 14px rgba(83,216,139,.65))}
  .battlebox.state-draw.reveal-result .clash{filter:drop-shadow(0 0 14px rgba(241,199,91,.65))}
  .battlebox.state-lose.reveal-result .clash{filter:drop-shadow(0 0 14px rgba(255,107,104,.65))}
  @keyframes meVictoryStrike{0%{transform:translateX(0) scale(1)}38%{transform:translateX(23px) scale(1.08)}58%{transform:translateX(17px) scale(1.04)}100%{transform:translateX(0) scale(1)}}
  @keyframes foeDefeated{0%{transform:translateX(0) rotate(0);filter:brightness(1)}42%{transform:translateX(28px) rotate(5deg);filter:brightness(.72)}100%{transform:translateX(18px) rotate(3deg);filter:brightness(.72)}}
  @keyframes drawLeft{0%{transform:translateX(0)}42%{transform:translateX(14px) scale(1.05)}56%{transform:translateX(7px)}72%{transform:translateX(12px)}100%{transform:translateX(0)}}
  @keyframes drawRight{0%{transform:translateX(0)}42%{transform:translateX(-14px) scale(1.05)}56%{transform:translateX(-7px)}72%{transform:translateX(-12px)}100%{transform:translateX(0)}}
  @keyframes meDefeated{0%{transform:translateX(0) rotate(0);filter:brightness(1)}42%{transform:translateX(-28px) rotate(-5deg);filter:brightness(.68)}100%{transform:translateX(-18px) rotate(-3deg);filter:brightness(.68)}}
  @keyframes foeVictoryStrike{0%{transform:translateX(0) scale(1)}38%{transform:translateX(-23px) scale(1.08)}58%{transform:translateX(-17px) scale(1.04)}100%{transform:translateX(0) scale(1)}}
  .toast{position:fixed;left:50%;bottom:92px;z-index:80;transform:translateX(-50%) translateY(12px);opacity:0;pointer-events:none;padding:9px 12px;border-radius:10px;background:rgba(10,14,20,.94);border:1px solid rgba(255,255,255,.08);box-shadow:0 10px 28px rgba(0,0,0,.35);font-size:10px;font-weight:900;color:#e7ebf1;transition:.2s ease}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}.toast.error{color:#ff8a84;border-color:rgba(255,107,104,.25)}
  /* 3D dice, step-by-step movement, and sound control */
  .rulesbtn[aria-pressed="true"]{color:#f2d582;border-color:rgba(232,194,103,.5);background:#211b11}
  .dice-roulette.rolling .bigdie{animation:none!important}
  .cube-shell{width:84px;height:84px!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;perspective:620px;transform-style:preserve-3d}
  .die-cube{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(-18deg) rotateY(28deg);will-change:transform}
  .die-cube.tumbling{animation:cubeTumble .72s linear infinite}
  .die-side{position:absolute;inset:0;border-radius:15px;background:linear-gradient(145deg,#fff,#d9dde5);border:1px solid rgba(0,0,0,.22);box-shadow:inset 0 0 12px rgba(0,0,0,.08),inset 2px 2px 3px rgba(255,255,255,.9);backface-visibility:hidden}
  .die-side.s1{transform:translateZ(42px)}.die-side.s6{transform:rotateY(180deg) translateZ(42px)}.die-side.s3{transform:rotateY(90deg) translateZ(42px)}.die-side.s4{transform:rotateY(-90deg) translateZ(42px)}.die-side.s2{transform:rotateX(90deg) translateZ(42px)}.die-side.s5{transform:rotateX(-90deg) translateZ(42px)}
  .die-shadow{position:absolute;width:92px;height:25px;left:50%;top:72%;transform:translate(-50%,-50%);border-radius:50%;background:rgba(0,0,0,.62);filter:blur(10px)}
  .roulette-pointer,.roulette-ring.inner{display:none}.roulette-ring.outer{width:142px;height:142px;border-style:solid;border-color:rgba(232,194,103,.13);transform:rotateX(66deg)}.roulette-ring.mid{width:112px;height:112px;border-color:rgba(112,215,232,.12);transform:rotateX(66deg)}
  .dice-roulette.rolling .roulette-ring.outer{animation:ringBreath .9s ease-in-out infinite!important}.dice-roulette.rolling .roulette-ring.mid{animation:ringBreath .9s ease-in-out .15s infinite!important}
  .dice-roulette.rolling .die-shadow{animation:shadowBounce .42s ease-in-out infinite alternate}
  @keyframes cubeTumble{0%{transform:rotateX(0deg) rotateY(0deg) rotateZ(0deg) translateY(-4px)}50%{transform:rotateX(390deg) rotateY(510deg) rotateZ(120deg) translateY(5px)}100%{transform:rotateX(720deg) rotateY(1080deg) rotateZ(240deg) translateY(-4px)}}
  @keyframes shadowBounce{to{transform:translate(-50%,-50%) scale(.7);opacity:.42}}@keyframes ringBreath{50%{opacity:.35;filter:drop-shadow(0 0 8px rgba(232,194,103,.3))}}
  .move-counter{position:absolute;left:13px;bottom:11px;z-index:8;display:flex;align-items:center;gap:7px;min-width:142px;padding:7px 9px;border:1px solid rgba(112,215,232,.18);border-radius:10px;background:rgba(7,11,16,.82);color:#8e9bad;font-size:8px;letter-spacing:.08em;opacity:.72}.move-counter.active{opacity:1;border-color:rgba(112,215,232,.48);box-shadow:0 0 20px rgba(112,215,232,.11)}.move-counter span{color:#70d7e8;font-weight:1000}.move-counter b{color:#e7ecf3}.move-counter i{display:flex;gap:3px;margin-left:auto}.move-counter i em{width:5px;height:5px;border-radius:50%;background:#303a49}.move-counter i em.done{background:#70d7e8;box-shadow:0 0 7px rgba(112,215,232,.7)}
  .player-ring.step-hop{animation:playerStepHop .38s cubic-bezier(.2,.75,.25,1)}
  .node.passed,.node.past{z-index:3}.node.passed .enemy-card,.node.past .enemy-card{opacity:.38;filter:grayscale(1) saturate(0) brightness(.72)}.node.passed .matchtag,.node.past .matchtag{opacity:.42;filter:grayscale(1)}.node.past .num{color:#aeb5bf;border-color:#68717d;background:#222832}
  .battle-hold{margin:12px auto 0;width:210px;color:#cbd4df;font:900 8px ui-monospace,monospace;letter-spacing:.14em}.battle-hold i{display:block;height:3px;margin-top:6px;border-radius:3px;background:linear-gradient(90deg,#e8c267,#70d7e8);transform-origin:left;animation:resultHold var(--result-hold,4800ms) linear forwards}@keyframes resultHold{from{transform:scaleX(1)}to{transform:scaleX(0)}}
  @keyframes playerStepHop{0%{transform:translateY(0) scale(1)}42%{transform:translateY(-13px) scale(1.08);box-shadow:0 0 42px rgba(112,215,232,.3)}100%{transform:translateY(0) scale(1)}}

  /* Match the card broadcast frame: centered 1280px desktop, fluid single-column mobile. */
  .app{width:min(1480px,100%);min-height:100vh;margin:0 auto;padding:12px 16px 18px;overflow:visible;background:transparent;border:0}
  .topbar{padding:12px 15px;border:1px solid rgba(232,194,103,.28);border-radius:18px;background:linear-gradient(180deg,rgba(24,29,39,.97),rgba(10,13,18,.98));box-shadow:0 18px 55px rgba(0,0,0,.32)}
  .game-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,420px);align-items:stretch;gap:14px;margin-top:12px}.game-main,.game-side{min-width:0}.game-main{height:clamp(740px,calc(100vh - 175px),920px)}.game-side{position:sticky;top:8px;height:clamp(740px,calc(100vh - 175px),920px);display:grid;grid-template-rows:minmax(0,1fr) auto auto;align-self:stretch;gap:10px}
  .dungeon{height:100%;border:1px solid rgba(232,194,103,.2);border-radius:22px;box-shadow:0 24px 65px rgba(0,0,0,.35)}.cards{height:100%;min-height:0;padding:16px;border:1px solid rgba(232,194,103,.2);border-radius:20px;background:linear-gradient(180deg,rgba(18,23,31,.98),rgba(8,11,15,.98));box-shadow:0 18px 45px rgba(0,0,0,.28);display:flex;flex-direction:column}.cards .cardrow{flex:1;min-height:0;grid-template-columns:1fr 1fr;grid-template-rows:minmax(0,1.25fr) minmax(0,.75fr)}.cards .hero-card{height:100%;display:flex;flex-direction:column;justify-content:center}.cards .hero-card .label{position:absolute;left:16px;top:15px}.hero-card.current{grid-column:1/-1;min-height:190px}.current .portrait{width:118px;height:118px;font-size:68px}.current .cardname{font-size:17px}.current .cardmeta{font-size:10px}.hero-card.next-mini{min-height:132px}.next-mini .cardcontent{display:flex}.next-mini .portrait{width:64px;height:64px;margin:0;font-size:38px}.next-mini .cardname{font-size:12px}.next-mini .cardmeta{font-size:8px}.odds{margin-top:10px}.game-side .flow{margin:0;padding:12px 13px}.game-side .flowline{min-width:0}.game-side .dicehist,.game-side .enemyhist{overflow-x:auto;scrollbar-width:thin}.demo{position:static;justify-self:end;margin:0 2px -4px}

  /* A longer multi-axis spin, followed by the JavaScript deceleration to the result face. */
  .die-cube.tumbling{animation:cubeTumble 1s linear infinite}
  @keyframes cubeTumble{0%{transform:rotateX(0deg) rotateY(0deg) rotateZ(0deg) translateY(-5px)}25%{transform:rotateX(420deg) rotateY(570deg) rotateZ(180deg) translateY(3px)}50%{transform:rotateX(840deg) rotateY(1140deg) rotateZ(360deg) translateY(6px)}75%{transform:rotateX(1260deg) rotateY(1710deg) rotateZ(540deg) translateY(1px)}100%{transform:rotateX(1680deg) rotateY(2280deg) rotateZ(720deg) translateY(-5px)}}
  .cube-shell.landing{animation:diceDrop .95s cubic-bezier(.16,.78,.18,1) both}.dice-roulette.settling .die-shadow{animation:diceImpactShadow .95s ease-out both}
  @keyframes diceDrop{0%{transform:translateY(-118px) scale(.8);filter:blur(1px)}54%{transform:translateY(10px) scale(1.08);filter:none}70%{transform:translateY(-13px) scale(.96)}84%{transform:translateY(4px) scale(1.025)}100%{transform:translateY(0) scale(1)}}
  @keyframes diceImpactShadow{0%{transform:translate(-50%,-50%) scale(.22);opacity:.16}54%{transform:translate(-50%,-50%) scale(1.28);opacity:.78}72%{transform:translate(-50%,-50%) scale(.84);opacity:.48}100%{transform:translate(-50%,-50%) scale(1);opacity:.62}}

  /* Tabbed rules and visual card matchup guide. */
  .rules-sheet{width:min(900px,calc(100% - 28px));max-height:88vh;border-radius:22px 22px 0 0}.dice-rules-tabs{display:flex;gap:6px;margin-top:14px;padding:4px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:#0a0e14}.dice-rules-tab{flex:1;height:36px;border:1px solid transparent;border-radius:9px;background:transparent;color:#8995a6;font-size:11px;font-weight:1000;cursor:pointer}.dice-rules-tab.active{color:#f2d582;border-color:rgba(232,194,103,.42);background:#211b11}.dice-rules-pane{display:none}.dice-rules-pane.active{display:block}.dice-guide-head{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin:15px 0 9px}.dice-guide-head b{color:#f3d17c;font-size:13px}.dice-guide-head span{color:#929dab;font-size:9px;text-align:right}.dice-guide-head.element{margin-top:18px}.dice-type-guide{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}.dice-guide-item{min-width:0;padding:7px;text-align:center;border:1px solid rgba(255,255,255,.08);border-radius:13px;background:#0d1219}.dice-guide-item>strong{display:block;margin-top:6px;font-size:10px}.dice-guide-item>span{display:block;margin-top:3px;color:#d8bd72;font-size:7px;line-height:1.35}.dice-guide-card{position:relative;min-height:126px;padding:8px 6px;border:1px solid rgba(232,194,103,.32);border-radius:11px;background:radial-gradient(circle at 50% 32%,var(--guide-aura),transparent 38%),linear-gradient(160deg,#252d3b,#0b0f15);overflow:hidden;box-shadow:0 10px 20px rgba(0,0,0,.3)}.dice-guide-card .guide-element{position:absolute;right:6px;top:6px;width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:#101620;border:1px solid rgba(255,255,255,.14);font-size:12px}.dice-guide-card .guide-art{height:70px;display:grid;place-items:center;font-size:43px;filter:drop-shadow(0 7px 8px #000)}.dice-guide-card b{display:block;font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dice-guide-card small{display:block;margin-top:3px;color:#9ca7b6;font-size:7px}.dice-element-guide{display:flex;align-items:center;justify-content:center;gap:12px;padding:12px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:#0d1219}.dice-element-guide .dice-guide-card{width:112px;flex:0 0 112px}.dice-element-guide>i{color:#e8c267;font:1000 23px Georgia,serif}

  @media(max-width:920px){.game-layout{grid-template-columns:1fr}.game-main{height:760px}.game-side{position:static;height:auto;grid-template-rows:auto}.dungeon{height:100%}.cards{height:auto;margin:0}.cards .cardrow{flex:0 0 auto;grid-template-columns:1.55fr .75fr .75fr;grid-template-rows:auto}.cards .hero-card{height:auto;display:block}.cards .hero-card .label{position:relative;left:auto;top:auto}.hero-card.current{grid-column:auto;min-height:92px}.hero-card.next-mini{min-height:92px}.current .portrait{width:54px;height:54px;font-size:34px}.current .cardname{font-size:12px}.current .cardmeta{font-size:8px}.next-mini .cardcontent{display:block}.next-mini .portrait{width:38px;height:38px;font-size:24px;margin-bottom:5px}.next-mini .cardname{font-size:9px}.next-mini .cardmeta{font-size:7px}.dice-type-guide{grid-template-columns:repeat(3,1fr)}}
  @media(max-width:560px){.app{padding:8px}.topbar{border-radius:15px}.game-layout{margin-top:8px;gap:8px}.game-main{height:700px}.dungeon{height:100%;border-radius:17px}.cards{padding:10px;border-radius:16px}.game-side .flow{margin:0}.rules-sheet{width:100%}.dice-type-guide{grid-template-columns:repeat(2,1fr)}.dice-element-guide{gap:5px;overflow-x:auto;justify-content:flex-start}.dice-element-guide .dice-guide-card{width:88px;flex-basis:88px;min-height:112px}.dice-element-guide>i{font-size:16px}.dice-guide-head{align-items:flex-start;flex-direction:column}.dice-guide-head span{text-align:left}}

/* Keep ambient decoration static; animate only the current game action. */
.mist,.route-line,.torch:before{animation:none}
.route-line{filter:none}
.flow,.themechip{backdrop-filter:none}
.die-cube{will-change:auto}
.dice-stage.show .die-cube{will-change:transform}
.dice-stage:not(.show){visibility:hidden}
#timerProgress{transition:transform .25s linear}
@media(max-width:700px){.mist{display:none}.battle-glow{filter:none}.battle{backdrop-filter:none}}

/* Fixed 5 × 5 perimeter. The pawn moves; the board never scrolls. */
.game-layout{grid-template-columns:minmax(0,1fr) minmax(300px,360px);align-items:start}
.game-main{height:auto}
.game-side{height:auto;min-height:0;position:static;align-self:start;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto}
.game-side .cards,.game-side .flow{min-width:0}
.cards .cardrow{flex:none;grid-template-rows:auto auto}
.cards .hero-card.current{min-height:235px}
.cards .hero-card.next-mini{min-height:150px}
.dungeon{height:auto;padding:14px;background:radial-gradient(ellipse at 50% 48%,#252b37,#10141c 72%)}
.dungeon:after{opacity:.16}
.board-heading,.board-footer{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:10px}
.board-heading{margin:0 2px 14px;color:#a99b7b;font:800 10px ui-monospace,monospace;letter-spacing:.12em}
.board-heading .themechip{position:static;transform:none;padding:0;background:none;border:0;color:#ead39d;font-size:10px;letter-spacing:.12em;white-space:nowrap}
.board-table{position:relative;z-index:2;width:100%;aspect-ratio:1;container-type:inline-size}
.board-table .world{transform:none;transition:none}
.board-table .route-line{stroke:rgba(232,194,103,.28);stroke-width:2;stroke-dasharray:3 5}
.board-center{position:absolute;inset:21%;border:1px solid rgba(232,194,103,.14);border-radius:20px;background:radial-gradient(circle at 50% 30%,rgba(232,194,103,.05),transparent 65%),#10151e;box-shadow:inset 0 0 40px rgba(0,0,0,.3);display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none}
.board-idle{position:absolute;top:15%;left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.board-sigil{font-size:clamp(30px,9cqw,82px);line-height:1;color:#e8c267;text-shadow:0 5px 25px rgba(232,194,103,.14)}
.board-idle strong{font-size:clamp(11px,2.5cqw,22px);letter-spacing:.12em;color:#ebd7a5}
.board-idle>span:last-child{color:#8592a5;font-size:clamp(8px,1.7cqw,12px)}
.board-loop{position:absolute;bottom:7%;font-size:clamp(8px,1.6cqw,12px);color:#8290a4;letter-spacing:.05em}
.turn-active .board-idle{visibility:hidden}
.board-cell{width:18%;height:18%}
.board-cell .enemy-card{width:100%;height:100%;padding:7% 5%;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(145deg,#283140,#141a24);transition:transform .25s,border-color .25s}
.board-cell .enemy-card .art{height:auto;flex:1;min-height:0;width:100%;font-size:clamp(25px,6.8cqw,62px);line-height:1;filter:drop-shadow(0 4px 5px rgba(0,0,0,.45))}
.board-cell .enemy-card .ename{width:100%;font-size:clamp(8px,1.8cqw,14px);font-weight:800}
.board-cell .enemy-card .etype{margin-top:2px;font-size:clamp(6px,1.3cqw,10px);color:#9ba8ba}
.board-cell .enemy-card .elbadge{right:5%;top:5%;width:23%;height:23%;font-size:clamp(9px,2.2cqw,18px)}
.board-cell .num{left:5%;top:5%;width:auto;height:auto;border:0;box-shadow:none;background:transparent;font:800 clamp(7px,1.5cqw,12px) ui-monospace,monospace;color:#909baa}
.board-cell.reachable .enemy-card{border-color:rgba(232,194,103,.72)}
.board-cell .cell-distance{position:absolute;left:4%;bottom:-4%;z-index:4;padding:2px 4px;border:1px solid #8f773f;border-radius:5px;background:#282319;color:#efda9f;font:800 clamp(7px,1.4cqw,11px) ui-monospace,monospace}
.board-cell .matchtag{left:auto;right:4%;bottom:-4%;transform:none;width:auto;min-width:24%;height:auto;padding:2px 4px;font-size:clamp(7px,1.4cqw,11px)}
.board-cell.selected{z-index:5}
.board-cell.selected .enemy-card{transform:none;border-color:#8fe7f5;box-shadow:0 0 0 2px rgba(112,215,232,.4),0 0 24px rgba(112,215,232,.12)}
.board-cell.selected .num{background:transparent;color:#a5effa}
.board-cell.passed .enemy-card,.board-cell.passed .matchtag{opacity:1;filter:none}
.board-cell.special .enemy-card{border-color:#9879d9;background:radial-gradient(circle at 50% 28%,#685091,#2c233d 80%)}
.board-cell.special .art{color:#e0c7ff;font-family:Georgia,serif}
.board-cell.special .ename{color:#f0e2ff}
.board-cell.special .etype{font-size:clamp(5px,1.2cqw,10px);color:#c7b4e6;white-space:nowrap}
.matchtag.random,.oddit.random{background:#4a3565;color:#e0c8ff;border-color:#9773c8}
.board-table .player-anchor{margin-left:5%;margin-top:4%;z-index:8;transition:left .37s cubic-bezier(.22,.74,.25,1),top .37s cubic-bezier(.22,.74,.25,1)}
.board-table .player-ring{width:clamp(24px,6cqw,48px);height:clamp(24px,6cqw,48px);animation:none;background:#102b35;border:2px solid #90e8f5;box-shadow:0 0 14px rgba(112,215,232,.4)}
.board-table .player-ring.step-hop{animation:playerStepHop .38s cubic-bezier(.2,.75,.25,1)}
.board-table .player{width:90%;height:90%;border:0;font-size:clamp(16px,4.3cqw,32px);box-shadow:none}
.board-table .player:after{bottom:-8px;font-size:clamp(5px,1.2cqw,8px);letter-spacing:.05em;background:#102b35;padding:1px 3px;border-radius:3px}
.board-table .move-counter{left:50%;bottom:30%;transform:translateX(-50%);min-width:0;width:42%;max-width:230px;padding:7px 9px;font-size:clamp(7px,1.5cqw,10px)}
.board-table .dice-stage{top:45%}
.board-footer{margin:16px 2px 0;flex-wrap:wrap;color:#939fb1;font-size:10px;line-height:1.6}
.board-footer i{display:inline-block;width:6px;height:6px;margin-right:5px;border-radius:50%;background:#e8c267}
.board-footer .special-note{color:#c8b1e8}
.board-table .battle{inset:21%;border-radius:20px;background:#10151e;backdrop-filter:none;overflow:hidden}
.board-table .battlebox{width:100%;padding:clamp(5px,1.8cqw,14px)}
.board-table .battle-event{position:relative;z-index:3;margin-bottom:clamp(6px,2cqw,18px);color:#9dabbe;font-size:clamp(7px,1.6cqw,12px);font-weight:800}
.board-table .battle-event.special{color:#d4b3ff}
.board-table .versus{gap:clamp(6px,2cqw,18px)}
.board-table .battlecard{width:clamp(44px,14cqw,112px);height:clamp(64px,19cqw,144px);padding:5px;border-radius:10px}
.board-table .battlecard .emoji{font-size:clamp(18px,5cqw,40px);line-height:1.25}
.board-table .battlecard b{font-size:clamp(6px,1.5cqw,11px)}
.board-table .vs{font-size:clamp(9px,2.5cqw,17px)}
.board-table .clash{font-size:clamp(16px,4cqw,30px);margin:4px 0 0}
.board-table .battle-result{font-size:clamp(16px,4cqw,30px);margin-top:3px;background:transparent}
.board-table .battle-hold{width:80%;font-size:clamp(5px,1.2cqw,8px);margin-top:6px}
.board-table .battle-glow{width:80%;height:80%;filter:none}
.board-shuffled .board-cell:not(.special) .enemy-card{animation:boardShuffle .7s ease-out both}
@keyframes boardShuffle{0%{transform:scale(.85) rotateY(90deg);filter:brightness(1.8)}100%{transform:scale(1) rotateY(0);filter:none}}
@media(max-width:1100px){.game-layout{grid-template-columns:minmax(0,1fr) 300px}}
@media(max-width:920px){
  .game-layout{grid-template-columns:1fr}.game-main,.game-side{height:auto}
  .cards .cardrow{grid-template-rows:auto}.cards .hero-card.current,.cards .hero-card.next-mini{min-height:92px}
}
@media(max-width:560px){
  .dungeon{padding:8px}.board-heading{margin:2px 2px 10px;font-size:8px}.board-heading .themechip{font-size:8px}
  .board-cell .enemy-card{border-radius:8px}.board-center,.board-table .battle{border-radius:12px}
  .board-idle{gap:5px}.board-footer{margin-top:12px;gap:3px;font-size:8px}
  .board-table .move-counter{padding:4px 6px;gap:4px}.board-table .move-counter i{gap:2px}.board-table .move-counter i em{width:3px;height:3px}
  .brandrow{flex-wrap:wrap}.top-actions{flex-wrap:wrap}.statusline{font-size:8px}
}
@container(max-width:450px){.board-table .dice-stage{transform:translate(-50%,-50%) scale(.65)}.board-table .clash{display:none}}
@media(prefers-reduced-motion:reduce){.board-shuffled .board-cell .enemy-card{animation:none}.board-table .player-anchor{transition-duration:0s!important}.board-table .player-ring.step-hop{animation:none}}