:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--ui-bg:#070c14d1;--ui-bg-strong:#050a11eb;--ui-stroke:#9ac0ff2e;--ui-stroke-strong:#b5d8ff3d;--ui-text-soft:#b8c8e8;--ui-accent:#86bfff;--ui-accent-warm:#ffd58a;color:#eaf1ff;background:radial-gradient(circle at top,#1b2d47 0%,#0a1017 45%,#04070b 100%);font-family:Trebuchet MS,Segoe UI,sans-serif;font-weight:400;line-height:1.4}*{box-sizing:border-box}html,body,#game-root{width:100%;min-height:100%;margin:0}body{background:radial-gradient(circle at 20% 10%,#60a8ff33,#0000 28%),radial-gradient(circle at 80% 10%,#74efc726,#0000 25%),linear-gradient(#071019 0%,#02050a 100%)}button,input{font:inherit}button{cursor:pointer}.heroes-host-shell{aspect-ratio:16/9;background:linear-gradient(#07111bf5,#020509fa);border:1px solid #98beff38;border-radius:22px;width:min(100vw,1600px);margin:0 auto;position:relative;overflow:hidden;box-shadow:0 32px 80px #0000006b}.heroes-canvas-root,.heroes-overlay-root,.overlay-shell{position:absolute;inset:0}.heroes-canvas-root{z-index:1}.heroes-canvas-root canvas{width:100%;height:100%;display:block}.heroes-overlay-root{pointer-events:auto;z-index:2}.overlay-shell.overlay-running,.overlay-shell.overlay-running .hud-shell{pointer-events:none}.overlay-shell.overlay-menu,.overlay-shell.overlay-menu *,.overlay-shell.overlay-running .panel,.overlay-shell.overlay-running .panel *,.overlay-shell.overlay-running .floating-tooltip,.overlay-shell.overlay-running [data-action],.overlay-shell.overlay-running [data-action] *,.overlay-shell.overlay-running .hud-shell button,.overlay-shell.overlay-running .hud-shell input,.overlay-shell.overlay-running .hud-debug,.overlay-shell.overlay-running .hud-debug *{pointer-events:auto}.panel{border:1px solid var(--ui-stroke);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:linear-gradient(#0b121de0,#060b12e6);border-radius:24px;position:absolute;box-shadow:0 24px 60px #00000061}.main-menu-panel,.selection-panel,.modal-panel,.codex-panel{width:min(540px,90%);padding:28px;top:8%;left:5%}.selection-panel,.modal-panel,.codex-panel{width:min(920px,90%)}.progression-panel{width:auto;max-height:86%;padding:28px;top:6%;left:5%;right:5%;overflow:auto}.main-menu-panel h1,.panel h2{margin:0 0 8px;font-family:Georgia,serif}.main-menu-panel{width:min(1160px,92%)}.selection-panel{width:min(1120px,92%)}.main-menu-layout{grid-template-columns:minmax(0,1.3fr) minmax(260px,.7fr);align-items:stretch;gap:20px;display:grid}.main-menu-copy{align-content:start;gap:12px;display:grid}.main-menu-panel h1{max-width:8ch;font-size:clamp(52px,6vw,86px);line-height:.94}.main-menu-lead{color:#dbe8ff;max-width:620px;font-size:18px}.main-menu-side{gap:12px;display:grid}.menu-stat-card{border:1px solid var(--ui-stroke);background:radial-gradient(circle at 0 0,#86bfff29,#0000 56%),linear-gradient(#080e18e6,#060a12eb);border-radius:22px;align-content:center;gap:4px;min-height:108px;padding:16px 18px;display:grid}.menu-stat-card span,.results-loadout-label{text-transform:uppercase;letter-spacing:.12em;color:var(--ui-accent);font-size:11px}.menu-stat-card strong{color:#f2f7ff;font-size:32px;font-weight:800}.eyebrow{text-transform:uppercase;letter-spacing:.16em;color:#86bfff;margin-bottom:10px;font-size:12px}.button-row{flex-wrap:wrap;gap:10px;margin-top:18px;display:flex}.draft-controls{justify-content:space-between;align-items:center;margin:6px 0 4px}.draft-confirm-row{justify-content:flex-end;margin-top:14px}button{color:#081019;background:linear-gradient(#8ad3ff,#4b99ff);border:0;border-radius:999px;padding:12px 18px;font-weight:700;transition:transform .14s,opacity .14s}button:hover{transform:translateY(-1px)}button.secondary{color:#eaf3ff;background:#91b3ff1f;border:1px solid #91b3ff38}button.small{padding:8px 12px;font-size:12px}.card-grid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin-top:18px;display:grid}.choice-card{text-align:left;color:#eff5ff;background:radial-gradient(circle at 0 0,#70bcff29,#0000 48%),linear-gradient(#0a121ce6,#080c14eb);border:1px solid #9cc7ff24;border-radius:24px;flex-direction:column;align-items:flex-start;gap:10px;min-height:170px;padding:20px;display:flex}.choice-card.is-selected{background:radial-gradient(circle at 0 0,#70bcff3d,#0000 48%),linear-gradient(#0e1826f0,#080c14f5);border-color:#8ad3ffc7;box-shadow:0 0 0 2px #8ad3ff38,inset 0 0 0 1px #ffffff0a}.choice-card .hud-summary-vitals{margin-top:auto}.choice-card.is-locked,.choice-card:disabled{opacity:.66;filter:saturate(.7);cursor:not-allowed}.choice-card-top,.with-thumb,.results-unlock-card{align-items:flex-start;gap:14px;display:flex}.choice-title{margin-bottom:8px;font-size:18px;font-weight:700}.choice-copy{color:#dce7fb;font-size:14px}.choice-copy.subtle{color:#b8c8e8;margin-top:auto}.art-thumb,.choice-art,.chip-art,.ability-icon,.codex-thumb,.results-art,.archive-thumb{background:radial-gradient(circle at 30% 20%,#74cdff33,#0000 48%),linear-gradient(#080e18f5,#04080efa);border:1px solid #aacfff24;border-radius:16px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff05}.art-thumb img,.choice-art img,.chip-art img,.ability-icon img,.codex-thumb img,.results-art img,.archive-thumb img{object-fit:contain;width:100%;height:100%;display:block}.choice-art,.codex-thumb{flex:none;width:72px;height:72px}.chip-art,.ability-icon{border-radius:10px;flex:none;width:28px;height:28px}.results-art{flex:none;width:56px;height:56px}.archive-thumb{aspect-ratio:1;width:100%}.art-fallback,.glyph-icon{color:#edf5ff;letter-spacing:.06em;place-items:center;font-size:14px;font-weight:800;display:grid}.ability-row{flex-wrap:wrap;gap:8px;margin-top:4px;display:flex}.ability-badge{color:#deebff;background:#040a128a;border:1px solid #aacfff24;border-radius:999px;align-items:center;gap:8px;padding:8px 10px;font-size:12px;display:inline-flex}.hud-shell{padding:18px;position:absolute;inset:0}.hud-edge-layout{position:absolute;inset:0}.hud-corner{gap:12px;display:flex;position:absolute}.hud-top-left{max-width:min(380px,29vw);top:18px;left:18px}.hud-top-center{justify-content:center;width:min(760px,48vw);top:18px;left:50%;transform:translate(-50%)}.hud-top-right{flex-direction:column;align-items:flex-end;gap:8px;max-width:min(260px,20vw);top:18px;right:18px}.hud-bottom-left{flex-direction:column;align-items:flex-start;max-width:min(280px,22vw);bottom:18px;left:18px}.hud-bottom-right{width:min(240px,18vw);bottom:18px;right:18px}.hud-bottom-main,.support-chip-list{flex-wrap:wrap;gap:8px;display:flex}.hud-debug{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex;position:absolute;top:78px;right:18px}.hud-title,.hud-stat,.hud-chip,.route-node{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#040a12a8;border:1px solid #a0c9ff2e;border-radius:999px;align-items:center;gap:8px;padding:8px 12px;display:inline-flex}.hud-summary-card,.hud-route-card{background:var(--ui-bg);border:1px solid var(--ui-stroke);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:24px;padding:8px 10px}.hud-summary-card{gap:8px;width:100%;display:grid}.hud-summary-card .choice-copy.subtle{color:#dbe8ff;background:#0a121c94;border:1px solid #9dc1ff1f;border-radius:16px;margin:0;padding:10px 12px}.hud-alert-card,.hud-combat-panel,.tutorial-panel,.event-feed{background:linear-gradient(#0a121ce0,#060b12e6);border:1px solid #abd0ff2e;border-radius:18px;gap:6px;padding:10px 12px;display:grid;box-shadow:0 14px 34px #0000003d}.hud-alert-card strong,.hud-combat-panel strong,.tutorial-panel strong{letter-spacing:.06em;text-transform:uppercase;color:#ffdca4;font-size:13px}.hud-alert-card span{color:#eef4ff;font-size:13px}.hud-objective-panel,.hud-inline-help{background:#ffffff0b;border:1px solid #a6ccff29;border-radius:18px;gap:6px;padding:10px 12px;display:grid}.hud-objective-panel.is-compact{gap:4px}.hud-objective-panel strong{letter-spacing:.1em;text-transform:uppercase;color:#ffdca4;font-size:12px}.hud-objective-panel .choice-title{margin-bottom:0;font-size:16px}.hud-objective-panel.is-compact .choice-title{font-size:14px}.hud-objective-panel .choice-copy.subtle{background:0 0;border-radius:0;padding:0}.hud-inline-help{flex-wrap:wrap;gap:6px;width:100%;display:flex}.hud-combat-panel{gap:8px}.hud-combat-panel strong{color:#9fe8ff}.hud-help-line{color:#e7f0ff;flex-wrap:wrap;align-items:center;gap:6px;font-size:13px;display:flex}.hud-help-line-muted{color:#bfd1f4}.hud-control-chip{color:#e7f0ff;background:#ffffff0a;border-radius:999px;align-items:center;gap:6px;padding:6px 8px;font-size:12px;display:inline-flex}.hud-keycap{color:#ffe1a2;letter-spacing:.04em;background:#080d16f0;border:1px solid #b9d8ff2e;border-radius:10px;justify-content:center;align-items:center;min-width:34px;padding:4px 7px;font-size:11px;font-weight:800;display:inline-flex}.pause-help-grid{gap:10px;margin-top:14px;display:grid}.tutorial-panel{width:min(250px,100%)}.event-feed{gap:8px;width:min(320px,100%)}.event-feed .eyebrow{margin-bottom:0}.event-feed ul{gap:6px;margin:0;padding:0;list-style:none;display:grid}.event-feed li{color:#dbe8ff;background:#ffffff0a;border:1px solid #abd0ff1f;border-radius:12px;padding:8px 10px;font-size:12px;line-height:1.35}.tutorial-panel .eyebrow{margin-bottom:0}.tutorial-panel .choice-copy{font-size:13px}.tutorial-copy{gap:6px;display:grid}.tutorial-legend{gap:6px;margin-top:2px;display:grid}.tutorial-legend-row{color:#dbe8ff;background:#ffffff0a;border:1px solid #abd0ff1a;border-radius:12px;gap:2px;padding:7px 9px;font-size:12px;line-height:1.35;display:grid}.tutorial-legend-label{color:#fff1c9;letter-spacing:.05em;text-transform:uppercase;font-size:11px;font-weight:800}.tutorial-checklist{gap:6px;margin-top:2px;display:grid}.tutorial-check{color:#dbe8ff;background:#ffffff0a;border:1px solid #abd0ff1f;border-radius:12px;align-items:center;gap:8px;padding:7px 9px;font-size:12px;display:flex}.tutorial-check.is-active{color:#fff3d2;background:#2a1c0a4d;border-color:#ffdc9c47}.tutorial-check.is-done{color:#e9fff0;background:#0c221757;border-color:#8ce8bd3d}.tutorial-check-mark{color:#ffe1a2;letter-spacing:.04em;background:#080d16e6;border:1px solid #b9d8ff2e;border-radius:999px;justify-content:center;align-items:center;min-width:22px;min-height:22px;padding:0 6px;font-size:10px;font-weight:800;display:inline-flex}.hud-summary-head,.hud-summary-vitals,.hud-actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.hud-summary-head{justify-content:space-between;align-items:flex-start}.hud-objective-chip{color:#fff2d6;background:#1e150885;border:1px solid #ffd58a47;border-radius:999px;align-items:center;gap:8px;padding:10px 12px;font-weight:700;display:inline-flex}.hud-objective-chip.is-ready{color:#ffe39a;background:#2a1d0985;border-color:#ffe08c47}.route-strip{gap:8px;padding-bottom:2px;display:flex;overflow-x:auto}.route-node{text-align:center;gap:4px;min-width:88px;padding:10px 12px;display:grid}.route-node.active{border-color:#ffde8073}.route-grade{font-size:12px}.route-grade-s{color:#90ffba}.route-grade-a{color:#8cd8ff}.route-grade-b{color:#ffd882}.route-grade-c{color:#ff9d8d}.meter-grid{grid-template-columns:1fr;gap:8px;display:grid}.meter-card{background:#040a12c7;border:1px solid #a0c9ff24;border-radius:18px;padding:12px}.meter-card.is-warning{border-color:#ffc27547;box-shadow:inset 0 0 0 1px #ffc27514}.meter-card.is-critical{border-color:#ff7e7057;box-shadow:inset 0 0 0 1px #ff7e701f}.meter-label{color:#b8c8e8;font-size:12px}.meter-bar{background:#ffffff14;border-radius:999px;height:8px;margin:8px 0;overflow:hidden}.meter-bar span{background:linear-gradient(90deg,#74eff5 0%,#ff8f6f 100%);height:100%;display:block}.meter-value{font-size:13px;font-weight:700}.support-chip-list{flex-wrap:wrap;gap:8px;display:flex}.support-chip-list:empty{display:none}.support-chip{font-size:12px}.primary-support-chip{background:#1e150885;border-color:#ffdc9c38}.secondary-support-chip{background:#040a12b8}.support-chip.is-empty{opacity:.62}.pause-panel,.settings-panel,.route-peek-panel{width:min(420px,88%);top:12%;left:auto;right:4%}.route-peek-panel{top:auto;bottom:18px}.codex-panel{width:auto;max-height:84%;left:5%;right:5%;overflow:auto}.codex-list{gap:12px;margin-top:16px;display:grid}.codex-entry,.route-peek-row,.settings-row,.debug-panel{background:#09101ab8;border:1px solid #9dc1ff24;border-radius:16px;padding:12px}.codex-entry.is-unlocked{border-color:#8fe8ff3d;box-shadow:inset 0 0 0 1px #8fe8ff14}.archive-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-top:10px;display:grid}.settings-grid{gap:14px;margin-top:16px;display:grid}.progression-columns{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;margin-top:18px;display:grid}.progression-column{align-content:start;gap:12px;display:grid}.class-tab-row{margin-top:8px}.hud-chip.muted{opacity:.7}.settings-row{gap:8px;display:grid}.settings-row input{width:100%}.results-grade{color:#7ce3ff;margin:10px 0 14px;font-size:56px;font-weight:800}.results-block{gap:6px;margin-top:16px;display:grid}.results-focus-block{background:radial-gradient(circle at 0 0,#ffc66f14,#0000 46%),#060c14b8;border:1px solid #ffd19133;border-radius:22px;padding:16px 18px}.results-screen{border:1px solid var(--ui-stroke-strong);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:radial-gradient(circle at 0 0,#7ebbff1f,#0000 38%),linear-gradient(#080e18f0,#050910f5);border-radius:28px;gap:18px;padding:28px;display:grid;position:absolute;inset:5%;box-shadow:0 30px 80px #00000073}.results-hero{justify-content:space-between;align-items:end;gap:18px;display:flex}.results-screen h2{margin-bottom:6px;font-size:clamp(34px,5vw,58px)}.results-copy{color:#dce9ff;max-width:900px;margin:0}.results-grade-badge{color:#8fe8ff;background:linear-gradient(#84e0ff42,#4270af29);border:1px solid #9adcff3d;border-radius:28px;place-items:center;min-width:108px;min-height:108px;font-size:62px;font-weight:800;display:grid}.results-loadout-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}.results-loadout-card{background:#080e18b3;border:1px solid #9dc1ff24;border-radius:20px;padding:14px 16px}.results-unlock-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin-top:10px;display:grid}.results-unlock-card,.archive-card{background:#09101ab8;border:1px solid #9dc1ff24;border-radius:16px;padding:12px}.archive-card{gap:8px;display:grid}.codex-section-label{text-transform:uppercase;letter-spacing:.12em;color:#8fcaff;margin-top:18px;margin-bottom:10px;font-size:11px}.floating-tooltip{color:#eff6ff;background:#050a11eb;border:1px solid #a0c9ff2e;border-radius:16px;max-width:340px;padding:12px 14px;font-size:13px;position:absolute;bottom:18px;left:18px}.floating-tooltip.is-hidden{display:none}.debug-panel{flex-wrap:wrap;align-items:center;gap:10px;margin-top:18px;display:flex}.debug-label{letter-spacing:.14em;text-transform:uppercase;color:#8dc7ff;font-size:12px}@media (max-width:1100px){.heroes-host-shell{border:0;border-radius:0;width:100vw}.main-menu-panel,.selection-panel,.modal-panel,.codex-panel,.progression-panel{width:auto;padding:22px;top:5%;left:4%;right:4%}.main-menu-layout,.results-loadout-row,.progression-columns{grid-template-columns:1fr}.results-hero{flex-direction:column;align-items:flex-start}.hud-shell{align-content:start;gap:12px;display:grid;overflow-y:auto}.hud-corner,.hud-debug{justify-content:flex-start;width:auto;max-width:none;position:static;transform:none}.hud-top-center,.hud-bottom-right{width:auto}.hud-top-right{align-items:stretch;max-width:none}.meter-grid{grid-template-columns:repeat(2,minmax(120px,1fr))}.route-strip{max-width:100%}.results-screen{padding:22px;inset:4%}}