:root{--bg:#0b0a12;--panel:#12101eeb;--panel-border:#3a3452;--text:#e8e2d0;--muted:#9a93a8;--accent:#f2c14e;--hp:#d9534f;--hp-bg:#3a1a1a;--font:"Press Start 2P", "Courier New", monospace;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);font-family:var(--font);-webkit-user-select:none;user-select:none;touch-action:none;margin:0;font-size:12px;overflow:hidden}#game{position:fixed;inset:0}#game canvas{image-rendering:pixelated;image-rendering:crisp-edges;display:block}#ui{pointer-events:none;padding:calc(8px + var(--safe-top)) 8px calc(8px + var(--safe-bottom));flex-direction:column;justify-content:space-between;display:flex;position:fixed;inset:0}#ui>*{pointer-events:auto}.hud-top{justify-content:space-between;align-items:flex-start;gap:8px;display:flex}.panel{background:var(--panel);border:2px solid var(--panel-border);border-radius:4px;padding:6px 8px;box-shadow:0 2px #000}.hero-card{flex-direction:column;gap:4px;min-width:140px;display:flex}.hero-name{color:var(--accent);font-size:11px}.hp-bar{background:var(--hp-bg);border:1px solid #000;height:10px;position:relative}.hp-bar>div{background:var(--hp);height:100%;transition:width .25s ease-out}.hp-bar>span{text-align:center;color:#fff;text-shadow:1px 1px #000;font-size:8px;line-height:10px;position:absolute;inset:0}.floor-badge{text-align:right;color:var(--muted);font-size:10px;line-height:1.6}.floor-badge b{color:var(--text);font-size:12px;display:block}.hud-bottom{flex-direction:column;gap:6px;display:flex}.log{max-height:64px;color:var(--muted);font-size:9px;line-height:1.5;overflow:hidden}.log div:last-child{color:var(--text)}.actions{justify-content:flex-end;gap:6px;display:flex}button.btn{font-family:var(--font);color:var(--text);border:2px solid var(--panel-border);cursor:pointer;background:#2a2540;border-bottom-width:4px;border-radius:4px;padding:8px 12px;font-size:10px}button.btn:active{border-bottom-width:2px;transform:translateY(2px)}button.btn.primary{border-color:var(--accent);background:#5a4a1a}button.btn:disabled{opacity:.4;cursor:default}.menu{background:radial-gradient(ellipse at center, #1c1730 0%, var(--bg) 70%);pointer-events:auto;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.menu .panel{flex-direction:column;gap:12px;width:min(360px,92vw);padding:16px;display:flex}.menu h1{color:var(--accent);text-shadow:3px 3px #000;text-align:center;letter-spacing:2px;margin:0;font-size:22px}.menu .row{align-items:center;gap:6px;display:flex}.menu input{font-family:var(--font);color:var(--text);border:2px solid var(--panel-border);background:#0b0a12;flex:1;padding:8px;font-size:10px}.class-grid{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.class-grid button.btn.selected{border-color:var(--accent);color:var(--accent)}.lang{color:var(--muted);justify-content:center;gap:4px;font-size:9px;display:flex}.lang button{all:unset;cursor:pointer;padding:2px 4px}.lang button.on{color:var(--accent)}.party{flex-direction:column;gap:4px;display:flex}.hero-card small{color:var(--muted);font-size:8px}.hero-card.leader{border-color:#6a5f8a}.hero-card.fainted{opacity:.55}.hero-card.targetable{cursor:pointer;border-color:#8fd3ff;animation:.8s ease-in-out infinite alternate pulse;box-shadow:0 0 0 2px #8fd3ff59,0 2px #000}@keyframes pulse{0%{box-shadow:0 0 0 1px #8fd3ff33,0 2px #000}to{box-shadow:0 0 0 3px #8fd3ff8c,0 2px #000}}.hero-status{gap:4px;min-height:10px;font-size:8px;display:flex}.st.shield{color:#8fd3ff}.st.poison{color:#b0f060}.st.dodge{color:#fff}.st.fainted{color:var(--hp)}.tray{flex-direction:column;gap:6px;display:flex}.tray-row{align-items:stretch;gap:8px;display:flex}.tray-row.dice{justify-content:center}.tray-row.controls{justify-content:flex-end;align-items:center}.mana{color:#7fb2ff;margin-right:auto;font-size:12px}.die{cursor:pointer;background:#1c1930;border:2px solid #4a4370;border-radius:8px;flex-direction:column;align-items:center;gap:4px;width:84px;min-height:84px;padding:6px 4px 14px;transition:transform .12s ease-out,border-color .12s;display:flex;position:relative}.die:active{transform:scale(.96)}.die.selected{border-color:var(--accent);transform:translateY(-4px);box-shadow:0 4px #000,0 0 12px #f2c14e59}.die.spent{opacity:.4;cursor:default}.die.locked:not(.spent){border-color:#8fd3ff}.die-face{align-items:baseline;gap:3px;font-size:18px;line-height:1;display:flex}.die-icon{font-size:20px}.die-value{font-size:18px}.die-damage .die-face{color:#ff7b7b}.die-shield .die-face{color:#8fd3ff}.die-heal .die-face{color:#7cfc98}.die-move .die-face{color:#f2c14e}.die-mana .die-face{color:#7fb2ff}.die-dodge .die-face{color:#fff}.die-blank .die-face{color:#555}.die-kw{flex-wrap:wrap;justify-content:center;gap:2px;display:flex}.die-kw span{color:#d8d0f0;background:#302a4a;border-radius:3px;padding:1px 3px;font-size:7px}.die-uses{color:var(--accent);font-size:8px;position:absolute;top:4px;right:6px}.die-owner{text-align:center;color:var(--muted);font-size:7px;position:absolute;bottom:3px;left:0;right:0}.die-auto{color:var(--accent);opacity:.85;font-size:7px;position:absolute;top:4px;left:6px}.die .lock{all:unset;cursor:pointer;opacity:.5;font-size:9px;position:absolute}.die .lock.on{opacity:1}.hint{color:var(--accent);text-align:center;flex-direction:column;align-items:center;gap:4px;font-size:9px;display:flex}.hint-heroes{gap:4px;display:flex}button.btn.tiny{padding:4px 8px;font-size:8px}.overlay{pointer-events:auto;background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.overlay .panel{text-align:center;flex-direction:column;gap:12px;width:min(340px,90vw);padding:16px;display:flex}.overlay h2{color:var(--hp);margin:0;font-size:16px}.overlay p{color:var(--muted);margin:0;font-size:9px;line-height:1.6}.icon{image-rendering:pixelated;vertical-align:middle;display:inline-block}.st{align-items:center;gap:2px;display:inline-flex}.die .lock.on .icon{filter:none}.die .lock:not(.on) .icon{filter:grayscale()brightness(.6)}.mana{align-items:center;gap:4px;display:inline-flex}.panel.inv{text-align:left;gap:6px;width:min(380px,94vw);max-height:80vh;overflow-y:auto}.inv-head{align-items:center;gap:8px;display:flex}.inv-head h2{color:var(--accent);flex:1;margin:0;font-size:13px}.inv h3{color:var(--muted);margin:8px 0 2px;font-size:10px}.inv h3 small{font-weight:400}.inv .muted{color:var(--muted);margin:0;font-size:9px}.item-row{border-bottom:1px solid #262238;align-items:center;gap:6px;padding:4px 2px;font-size:9px;display:flex}.item-name{flex:1;line-height:1.4}.item-name small,.item-faces{color:var(--muted);font-size:8px;display:block}.item-actions{flex-wrap:wrap;justify-content:flex-end;gap:3px;display:flex}button.btn.ghost{color:var(--muted);background:0 0;border-color:#3a3452}.gold{color:gold;align-items:center;gap:3px;font-size:9px;display:inline-flex}.hunger{color:#c08040;align-items:center;gap:3px;font-size:9px;display:inline-flex}.hunger.warn{color:var(--hp);animation:1s infinite alternate pulse-text}@keyframes pulse-text{0%{opacity:.6}to{opacity:1}}.badges{justify-content:flex-end;gap:8px;margin-top:2px;display:flex}.badge{all:unset;cursor:pointer;background:var(--accent);color:#000;border-radius:6px;margin-left:6px;padding:1px 4px;font-size:8px;animation:.8s infinite alternate pulse-text}.pips{gap:2px;display:flex}.pips i{border:1px solid var(--accent);width:8px;height:8px;display:inline-block}.pips i.on{background:var(--accent)}.tray-row.spells{flex-wrap:wrap;justify-content:center;gap:4px}button.btn.spell{border-color:#3a5a8a;align-items:center;gap:4px;padding:5px 8px;font-size:8px;display:inline-flex}button.btn.spell.selected{border-color:var(--accent);color:var(--accent)}.quest-tracker{flex-direction:column;gap:2px;margin-top:4px;font-size:8px;display:flex}.quest-line{color:#f2c14e;align-items:center;gap:3px;display:flex}button.btn.spell.ability{background:#2a1a10;border-color:#b0702a}.class-grid button.btn.locked{opacity:.55;flex-direction:column;gap:2px;display:flex}.class-grid .unlock-hint{color:var(--accent);font-size:7px}.challenges{text-align:left;flex-direction:column;gap:4px;margin:6px 0;font-size:9px;display:flex}.challenges label{align-items:center;gap:6px;display:flex}.menu-meta{justify-content:center;gap:6px;margin-top:6px;display:flex}.stats-line{font-size:8px}.ach-grid{flex-direction:column;gap:6px;display:flex}.ach{opacity:.55;text-align:left;align-items:flex-start;gap:8px;font-size:9px;display:flex}.ach.got{opacity:1}.ach-icon{color:var(--accent);font-size:14px}.ach-unlock{color:var(--accent)}.history-row{text-align:left;font-size:8px}.tutorial{text-align:left;pointer-events:auto;z-index:5;width:150px;font-size:8px;position:absolute;top:96px;left:6px}.tut-head{justify-content:space-between;align-items:center;margin-bottom:4px;display:flex}.tut-step{margin:2px 0}.toasts{z-index:30;pointer-events:none;flex-direction:column;gap:4px;display:flex;position:absolute;top:8px;left:50%;transform:translate(-50%)}.toast{border:1px solid var(--accent);color:var(--accent);background:#1a1630;border-radius:4px;padding:4px 10px;font-size:9px;animation:.3s ease-out toastIn}@keyframes toastIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}.run-summary{text-align:left;margin:6px 0;font-size:9px}.run-summary ul{margin:4px 0;padding-left:12px}.run-summary .unlocked{color:var(--accent)}button.btn.spell.ability.used{opacity:.4}.recruit-grid{flex-direction:column;gap:8px;display:flex}.recruit-card{text-align:left;flex-direction:column;gap:4px;display:flex}.recruit-card .faces{flex-wrap:wrap;gap:4px;display:flex}.recruit-card .faces span{background:#302a4a;border-radius:3px;align-items:center;gap:2px;padding:2px 4px;font-size:8px;display:inline-flex}.hero-card{cursor:pointer}.overlay h2.win{color:var(--accent)}.badge.mold-badge{background:#b48cff}.mold-name{color:#b48cff;font-size:9px}.item-row.locked{opacity:.45}.mold{border:1px solid var(--border,#444);border-radius:6px;margin:6px 0;padding:6px 8px}.mold h3{margin:0 0 2px}.recast-row{align-items:center;gap:8px;margin:3px 0;display:flex}.recast-row .arrow{color:var(--accent)}.face-chip{background:#ffffff0f;border-radius:4px;align-items:center;gap:3px;padding:2px 5px;font-size:11px;display:inline-flex}.face-chip small{color:#aaa;font-size:9px}