:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#26352d;background:#f5f6f2;font-synthesis:none;--green:#c6f578;--ink:#18261e;--muted:#849087;--line:#e1e6df}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.45}button:focus-visible,a:focus-visible{outline:3px solid #599f3d;outline-offset:4px}[hidden]{display:none!important}.rail{position:fixed;inset:0 auto 0 0;width:76px;border-right:1px solid var(--line);background:#fff;display:flex;align-items:center;flex-direction:column;gap:27px;padding:24px 0;color:#9aa39d;font-size:23px}.brand{display:grid;place-items:center;background:var(--ink);color:var(--green);width:39px;height:39px;border-radius:10px;text-decoration:none;font-weight:700;font-size:31px;margin-bottom:19px}.rail-active{background:#edf4e8;color:#496d34;border-radius:8px;padding:8px 12px}.rail-bottom{margin-top:auto;font-size:10px;line-height:3;text-align:center}.rail-bottom b{display:block;background:#e9ede7;border-radius:50%;width:33px;font-size:11px}.workspace{margin-left:76px}header{height:72px;border-bottom:1px solid var(--line);padding:0 34px;display:flex;justify-content:space-between;align-items:center;background:#fbfcf9}.breadcrumb{font-size:10px;font-weight:650;letter-spacing:1.8px;color:#69746d}.breadcrumb span{color:#c3cac4;margin:0 15px}.header-right{display:flex;align-items:center;gap:9px;font-size:11px;color:#707d73}.status-dot{display:inline-block;width:6px;height:6px;background:#7cae52;border-radius:50%;vertical-align:middle}.avatar{background:#e5e9e0;border:3px solid white;border-radius:50%;font-size:10px;font-weight:700;padding:9px;margin-left:16px}main{max-width:1580px;margin:auto;padding:29px 34px 0}.page-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:25px}.eyebrow{font-size:9px;letter-spacing:1.6px;font-weight:650;color:#849078}h1{font-size:32px;letter-spacing:-1.3px;margin:7px 0}h1 span{font-size:13px;vertical-align:top;margin:4px}p{margin:0}.page-title p{color:#829084;font-size:12px}.tag{border:1px solid #dce3d4;background:#f0f3e9;padding:10px 13px;font-size:9px;font-weight:650;letter-spacing:1px;border-radius:5px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:22px}.metrics>div{background:#fff;border:1px solid var(--line);border-radius:9px;padding:17px 20px}.metrics label{display:flex;justify-content:space-between;font-size:9px;font-weight:650;letter-spacing:1px;color:#839080}.metrics label span{font-size:15px;color:#a6b19f}.metrics strong{display:block;font-size:27px;letter-spacing:-.6px;font-weight:600;margin:7px 0 11px;font-variant-numeric:tabular-nums}.metrics small{font-size:13px;color:#b0b8aa;font-weight:400}.meter{height:4px;border-radius:4px;background:#eef1e9;overflow:hidden}.meter i{display:block;background:#9ec673;width:100%;height:100%;transition:width .15s}.meter.xp i{background:#bbda78;width:0}.metric-note{color:#9ba491;font-size:10px;height:4px;line-height:4px}.game-layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:22px}.arena-panel{border:1px solid #d8e0d7;border-radius:9px;overflow:hidden;background:#fff;min-width:0}.panel-toolbar{height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;font-size:9px;font-weight:600;letter-spacing:1px}.panel-toolbar .status-dot{margin-right:7px}.panel-toolbar em{font-style:normal;letter-spacing:0;font-size:9px;color:#9ca695;margin-left:12px;font-weight:400}.toolbar-right{color:#9aa592;font-size:8px}.toolbar-right>span{font-size:16px;margin-left:18px}.arena-wrap{position:relative;height:clamp(420px,55vh,660px);background:#101a15;overflow:hidden}canvas{display:block;width:100%;height:100%;cursor:crosshair}.arena-corner{position:absolute;bottom:16px;left:18px;color:#687c66;font-size:8px;letter-spacing:1.3px;pointer-events:none}.arena-corner span{margin:0 8px}.arena-footer{height:40px;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:9px;color:#788572}.arena-footer .status-dot{width:5px;height:5px;margin-right:5px}.muted{color:#a9b09f;margin-left:3px}.divider{margin:0 8px;color:#c9cebf}.side-panel{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:9px;background:#fcfdf9;padding:20px 18px}.section-heading{display:flex;justify-content:space-between;font-size:9px;font-weight:700;letter-spacing:1.3px;margin-bottom:17px;color:#66745f}.section-heading>span{color:#a1ad97;font-weight:400}.milestone{display:flex;gap:10px;align-items:center;margin:0 0 16px}.milestone-icon{height:34px;width:34px;display:grid;place-items:center;background:#f0f2ea;border:1px solid #e4e8dc;border-radius:7px;font-size:17px;color:#7e8e6c}.milestone b{font-size:11px;display:block}.milestone small{display:block;color:#9da68f;font-size:9px;margin-top:5px}.milestone.active .milestone-icon{background:#fff0dc;border-color:#e3be7b;color:#a1762b}.milestone.done .milestone-icon{background:#e9f3dc;color:#6f963c}.side-note{font-size:10px;color:#9ca58f;line-height:1.7;border-bottom:1px solid var(--line);padding-bottom:18px}.loadout{margin-top:20px}.base-weapon,.owned-ability{display:flex;align-items:center;gap:9px;padding:9px 0}.ability-icon{width:32px;height:32px;border:1px solid #dfe8d0;border-radius:7px;display:grid;place-items:center;color:#738e50;background:#f0f5e7;font-size:18px;flex-shrink:0}.base-weapon b,.owned-ability b{font-size:10px;display:block}.base-weapon small,.owned-ability small{display:block;font-size:7px;letter-spacing:.5px;color:#9ca68e;margin-top:5px}.weapon-dot{width:5px;height:5px;background:#9bbc66;border-radius:50%;margin-left:auto}.empty-loadout{text-align:center;border:1px dashed #dce3d2;border-radius:7px;color:#a5af98;font-size:10px;line-height:1.8;padding:16px 4px;margin-top:12px}.empty-loadout span{display:block;font-size:20px;margin-bottom:3px}.tip{margin-top:auto;padding-top:28px}.tip>span{font-size:8px;color:#96a186;letter-spacing:1px}.tip p{font-size:10px;line-height:1.9;color:#7e8b73;margin-top:8px}footer{display:flex;justify-content:space-between;align-items:center;height:65px;font-size:8px;letter-spacing:1px;color:#9aa68e}footer b{font-weight:400;letter-spacing:0;color:#b2bba7;margin-left:7px}footer>span:nth-child(2){letter-spacing:0}footer button{border:0;background:none;font-size:10px;color:#657454}footer button span{background:#e8eede;padding:4px 7px;border-radius:4px;margin:0 5px}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;background:#0e19135c;backdrop-filter:blur(3px);z-index:3}.overlay:empty{display:none}.welcome{text-align:center;color:#eaf0e3;max-width:500px}.welcome .pill{display:inline-block;font-size:8px;letter-spacing:2px;border:1px solid #5b704746;border-radius:20px;padding:8px 12px;color:#a9c18e;background:#1f2f20}.welcome .hero-mark{display:grid;place-items:center;margin:22px auto 19px;width:64px;height:64px;border:1px solid #647d43;border-radius:17px;background:#233821;box-shadow:0 0 70px #a7dd6722;font-size:34px;color:#c6f578;transform:rotate(-7deg)}.welcome h2{font-size:38px;letter-spacing:-1.7px;line-height:1.15;margin:0 0 15px;font-weight:600}.welcome h2 span{color:#c6f578}.welcome p{font-size:12px;color:#91a18a;line-height:1.9}.primary{border:0;border-radius:6px;background:#c6f578;color:#24341a;padding:14px 24px;font-size:11px;font-weight:750;transition:background .2s,transform .2s}.primary:hover{background:#d5ff94;transform:translateY(-1px)}.welcome .primary{margin-top:25px;min-width:210px}.primary span{margin-left:30px}.welcome .controls{margin-top:22px;display:flex;justify-content:center;gap:19px;font-size:9px;color:#8e9e84}.controls kbd,kbd{border:1px solid #5e715044;background:#243021;color:#c1cdb5;border-radius:3px;padding:3px 5px;margin-right:4px;font-family:inherit;font-size:9px}.welcome .footnote{font-size:8px;letter-spacing:.4px;margin-top:20px;color:#61765a}.dialog{background:#f8faf4;border:1px solid #dce5d0;border-radius:12px;padding:27px;color:#273722;width:min(740px,100%);max-height:100%;overflow:auto;box-shadow:0 20px 80px #0006}.dialog h2{font-size:25px;letter-spacing:-.7px;margin:5px 0 9px}.dialog .subtitle{font-size:11px;color:#86917b;line-height:1.7}.dialog .eyebrow{color:#6a9145}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin-top:23px}.upgrade{font:inherit;text-align:left;border:1px solid #dce4d1;border-radius:8px;padding:16px 13px;background:white;display:flex;flex-direction:column;min-height:230px;transition:transform .15s,border-color .15s}.upgrade:hover{transform:translateY(-4px);border-color:#7d9d4d;background:#f4fae9}.upgrade .ability-icon{height:40px;width:40px;font-size:23px;margin-bottom:16px}.upgrade b{font-size:12px;line-height:1.4}.upgrade .level-label{font-size:9px;color:#799750;margin:6px 0 12px}.upgrade p{font-size:10px;line-height:1.6;color:#7c8973}.upgrade .capstone{font-size:8px;line-height:1.5;color:#819759;border-top:1px solid #edf0e7;padding-top:10px;margin-top:auto}.quiet{border:1px solid #dce3d5;background:#fff;border-radius:6px;padding:9px 12px;font-size:10px;color:#77866a}.quiet kbd{background:#f2f5ec;color:#80936c;margin-left:10px}.dialog-actions{display:flex;gap:10px;margin-top:23px}.shop-list{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}.shop-item{border:1px solid #dfe6d3;background:white;border-radius:8px;padding:16px}.shop-item h3{font-size:12px;margin:12px 0 7px}.shop-item p{font-size:10px;color:#8b977d;line-height:1.7}.shop-item button{width:100%;margin-top:14px;padding:10px}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}.result-stats div{background:#eaf0e0;border-radius:7px;padding:15px;font-size:10px;color:#7c8d6b}.result-stats b{display:block;font-size:24px;margin-top:8px;color:#3e542e}.result-build{font-size:11px;line-height:1.8;color:#7b896d}#boss-bars{position:absolute;top:14px;left:20%;right:20%;pointer-events:none}.boss-health{margin-bottom:8px;font-size:9px;color:#f3c7ab;text-shadow:0 1px 3px #000}.boss-health .meter{background:#3c2f2a;margin-top:5px;height:5px}.boss-health i{background:#dd9470}#toast{position:absolute;bottom:45px;left:50%;transform:translateX(-50%);background:#c6f578;color:#28391c;border-radius:5px;font-size:11px;padding:10px 18px;white-space:nowrap;opacity:0;transition:opacity .2s;pointer-events:none;z-index:4}#toast.show{opacity:1}.storage-note{color:#a37a42!important;font-size:10px;margin-top:10px!important}@media(min-width:1600px){main{padding-top:40px}.page-title{margin-bottom:30px}.arena-wrap{height:58vh}}@media(max-width:1100px){main{padding:22px 20px 0}.game-layout{grid-template-columns:minmax(0,1fr) 225px;gap:14px}.side-panel{padding:17px 13px}.page-title h1{font-size:28px}.rail{width:60px}.workspace{margin-left:60px}.header-right{font-size:9px}.toolbar-right{display:none}.metrics>div{padding:14px}.welcome h2{font-size:32px}.cards{gap:7px}.upgrade{padding:11px 9px}.dialog{padding:20px}.panel-toolbar em{display:none}}@media(max-width:760px){.rail{display:none}.workspace{margin:0}header{padding:0 18px;height:52px}.header-right{display:none}.breadcrumb{font-size:8px}main{padding:20px 12px 0}.eyebrow{font-size:7px}.page-title h1{font-size:24px}.page-title .tag{display:none}.metrics{gap:6px;margin-bottom:12px}.metrics>div{padding:10px 8px}.metrics label{font-size:7px;letter-spacing:0}.metrics label span{display:none}.metrics strong{font-size:20px}.metrics small{font-size:10px}.metric-note{font-size:7px;line-height:1.3;height:auto}.game-layout{grid-template-columns:1fr}.side-panel{display:none}.arena-wrap{height:62vh;min-height:440px}.arena-footer{font-size:7px;padding:0 9px}.welcome h2{font-size:31px}.welcome p{font-size:11px}.overlay{padding:13px}.dialog{padding:17px}.upgrade b{font-size:10px}.upgrade p{font-size:9px}.upgrade{min-height:240px}.upgrade .capstone{font-size:7px}.shop-list{gap:8px}.shop-item{padding:12px}footer>span:nth-child(2){display:none}.welcome .controls{gap:10px}#boss-bars{left:12%;right:12%}}

/* Shared surfaces let the whole workspace follow the selected location. */
:root{--page:#f5f6f2;--surface:#fff;--surface-soft:#fbfcf9;--surface-tint:#edf3e5;--text:#26352d;--secondary:#718066;--subtle:#95a18a;--border:#dce4d2;--accent:#c6f578;--accent-text:#24341a;--selected:#f0f7e6;--soft-shadow:#15261218;--arena:#101b15}
body{background:var(--page);color:var(--text)}
body[data-theme="startup"]{--page:#191621;--surface:#25202f;--surface-soft:#211c2a;--surface-tint:#342a43;--text:#ece4f4;--secondary:#bbabcd;--subtle:#9885ac;--border:#43364f;--accent:#c9a0ff;--accent-text:#2b193f;--selected:#392a4b;--soft-shadow:#0003;--arena:#181322;--line:#3d3348;--ink:#21192b;--green:#c9a0ff}
body[data-theme="home"]{--page:#f5f0e8;--surface:#fffcf7;--surface-soft:#f8f4ec;--surface-tint:#e6eef0;--text:#30434c;--secondary:#6d838c;--subtle:#98a2a0;--border:#d9dfdd;--accent:#a7d5eb;--accent-text:#203b49;--selected:#e6f2f6;--soft-shadow:#203b4918;--arena:#172731;--line:#dedfd8;--ink:#263f4d;--green:#a7d5eb}
.rail,.metrics>div,.arena-panel,.quiet{background:var(--surface);border-color:var(--border)}
header,.side-panel{background:var(--surface-soft);border-color:var(--border)}
.avatar,.rail-bottom b,.milestone-icon,.result-stats div{background:var(--surface-tint);color:var(--secondary)}
.avatar{border-color:var(--surface)}
.rail-active,.tag{background:var(--selected);border-color:var(--border);color:var(--secondary)}
.breadcrumb,.header-right,.eyebrow,.page-title p,.metrics label,.metric-note,.panel-toolbar em,.toolbar-right,.arena-footer,.section-heading,.milestone small,.side-note,.empty-loadout,.tip>span,.tip p,footer,.quiet,.dialog .subtitle,.shop-item p,.result-build,.base-weapon small,.owned-ability small{color:var(--secondary)}
.metrics strong,.milestone b,.base-weapon b,.owned-ability b,.result-stats b,.shop-item h3{color:var(--text)}
.metrics small,.muted{color:var(--subtle)}
.meter{background:var(--surface-tint)}
.meter i,.meter.xp i{background:var(--accent)}
.side-note,.empty-loadout,.milestone-icon{border-color:var(--border)}
.ability-icon{background:var(--surface-tint);border-color:var(--border);color:var(--secondary)}
.primary{background:var(--accent);color:var(--accent-text)}
.primary:hover{background:var(--accent);filter:brightness(1.08)}
.quiet kbd{background:var(--surface-tint);color:var(--secondary)}
.dialog,.shop-item,.upgrade{background:var(--surface);border-color:var(--border);color:var(--text)}
.upgrade:hover{background:var(--selected);border-color:var(--accent)}
.upgrade p,.upgrade .capstone{color:var(--secondary)}
.upgrade .capstone{border-color:var(--border)}
.upgrade .level-label,.dialog .eyebrow{color:var(--secondary)}
footer button{color:var(--secondary)}
footer button span{background:var(--surface-tint)}
.arena-wrap{background:var(--arena)}
.arena-corner{color:#a6baa085}
.boss-health .meter{background:#312733}
.boss-health i{background:#dd9470}
#toast{background:var(--accent);color:var(--accent-text)}

/* Pre-shift character and location selection. */
.launch-screen{width:min(790px,100%);max-height:100%;overflow:auto;padding:4px 3px 5px;color:#edf2e7;scrollbar-width:thin;scrollbar-color:#65765355 transparent}
.launch-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
.launch-heading .eyebrow{color:#a6b497;font-size:8px;letter-spacing:1.5px}
.launch-heading h2{font-size:31px;letter-spacing:-1.1px;margin:8px 0 0;font-weight:600}
.launch-heading h2>span{color:var(--accent)}
.launch-badge{font-size:8px;letter-spacing:1px;padding:8px 10px;border:1px solid #afc59430;border-radius:5px;color:#b4c3a4}
.launch-section-label{font-size:9px;color:var(--accent);letter-spacing:1px;margin:15px 0 10px;font-weight:600}
.launch-section-label>span{color:#aebca1;font-size:8px;margin-left:9px;letter-spacing:1.4px}
.character-picker{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
.character-card{position:relative;min-width:0;border:1px solid #a8be932a;background:#2330239c;color:#e1e9d6;border-radius:8px;padding:9px 10px 12px;text-align:left;transition:background .15s,border-color .15s}
.character-card:hover{background:#33432dcc;border-color:#c6f57888}
.character-card.selected{border-color:var(--accent);background:#34412ad9;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 15%,transparent)}
.character-card canvas{width:46px;height:46px;margin:0 0 7px;cursor:pointer}
.character-card>b{font-size:11px;display:block;margin-bottom:7px}
.character-stats{display:block;font-size:7px;color:#a6b595;white-space:nowrap;letter-spacing:-.15px}
.character-passive{display:block;font-size:9px;color:var(--accent);margin:13px 0 5px}
.character-description{display:block;font-size:8px;line-height:1.6;color:#a8b69c;min-height:26px}
.selected-tick{display:none;position:absolute;right:11px;top:13px;color:var(--accent);font-size:12px}
.selected .selected-tick{display:block}
.theme-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.theme-card{display:flex;gap:9px;align-items:center;text-align:left;border:1px solid #a8be932a;background:#2330239c;color:#e1e9d6;border-radius:7px;padding:10px;min-width:0}
.theme-card.selected{border-color:var(--accent);background:#34412ad9}
.theme-card:hover{border-color:var(--accent)}
.theme-card b{display:block;font-size:10px;margin-bottom:4px}
.theme-card small{display:block;font-size:7px;line-height:1.4;color:#a8b69c}
.theme-swatch{display:grid;place-items:center;background:var(--preview-bg);color:var(--preview-accent);width:32px;height:32px;border:1px solid color-mix(in srgb,var(--preview-accent) 45%,transparent);border-radius:6px;font-size:19px;flex-shrink:0}
.theme-tick{margin-left:auto;font-size:10px;color:var(--accent)}
.launch-actions{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:20px}
.launch-controls{display:flex;gap:10px;flex-wrap:wrap;font-size:8px;color:#aab89b;max-width:370px}
.launch-controls small{display:block;width:100%;font-size:7px;letter-spacing:.3px;color:#94a484;margin-top:5px}
.launch-controls kbd{background:#263423;color:#c6d2b9;font-size:8px}
.launch-actions .primary{white-space:nowrap;padding:13px 19px}
.character-summary{display:flex;gap:9px;align-items:flex-start;margin-top:15px;padding:12px 0;border-bottom:1px solid var(--border)}
.character-summary b{display:block;font-size:10px;margin-bottom:4px}
.character-summary small{display:block;font-size:8px;color:var(--secondary)}
.character-summary p{font-size:9px;line-height:1.6;color:var(--subtle);margin-top:5px}
body[data-theme="startup"] .character-card,body[data-theme="startup"] .theme-card{background:#30253ed9;border-color:#79618455;color:#eee3f8}
body[data-theme="startup"] .character-card.selected,body[data-theme="startup"] .theme-card.selected{background:#48305bd9;border-color:var(--accent)}
body[data-theme="startup"] .character-description,body[data-theme="startup"] .character-stats,body[data-theme="startup"] .theme-card small,body[data-theme="startup"] .launch-section-label>span,body[data-theme="startup"] .launch-controls,body[data-theme="startup"] .launch-heading .eyebrow{color:#c5b2d5}
body[data-theme="home"] .character-card,body[data-theme="home"] .theme-card{background:#233b47dc;border-color:#9bc6d544;color:#e5f2f7}
body[data-theme="home"] .character-card.selected,body[data-theme="home"] .theme-card.selected{background:#304d5cdd;border-color:var(--accent)}
body[data-theme="home"] .character-description,body[data-theme="home"] .character-stats,body[data-theme="home"] .theme-card small,body[data-theme="home"] .launch-section-label>span,body[data-theme="home"] .launch-controls,body[data-theme="home"] .launch-heading .eyebrow{color:#b5cbd3}

/* Real simulation cooldowns. These transitions never run on wall-clock timers. */
.ability-bar{display:flex;align-items:center;gap:16px;padding:12px 16px;background:var(--surface-soft);border-bottom:1px solid var(--border);position:relative;z-index:2}
.ability-bar-label{font-size:8px;letter-spacing:1px;color:var(--secondary);max-width:55px;line-height:1.8;flex-shrink:0}
.cooldown-tiles{display:flex;flex-wrap:wrap;gap:8px;min-width:0}
.cooldown-tile{position:relative;display:grid;place-items:center;width:54px;height:62px;border:1px solid var(--border);border-radius:7px;background:var(--surface);color:var(--ability-color);padding:0;isolation:isolate}
.cooldown-tile svg{position:absolute;width:46px;height:46px;left:3px;top:1px;overflow:visible}
.cooldown-tile circle{fill:none;stroke-width:2;transform:rotate(-90deg);transform-origin:center}
.cooldown-track{stroke:var(--border)}
.cooldown-progress{stroke:var(--ability-color);stroke-dasharray:100;stroke-dashoffset:100;stroke-linecap:round}
.cooldown-icon{font-size:20px;position:absolute;top:10px;left:0;right:0;text-align:center;text-shadow:0 1px 5px #0004}
.skill-dots{font-size:8px;position:absolute;bottom:5px;letter-spacing:2px;line-height:1;color:var(--secondary)}
.cooldown-tile.fired{background:color-mix(in srgb,var(--ability-color) 18%,var(--surface));border-color:var(--ability-color);box-shadow:0 0 13px color-mix(in srgb,var(--ability-color) 22%,transparent)}
.cooldown-tile.is-passive .cooldown-icon{top:11px}
.passive-mark{position:absolute;right:4px;top:0;font-size:11px;color:var(--secondary)}
.tile-tooltip{position:absolute;bottom:calc(100% + 10px);left:-1px;display:none;width:205px;text-align:left;padding:12px 13px;border-radius:7px;background:var(--surface);border:1px solid var(--border);box-shadow:0 5px 25px #0004;color:var(--text);z-index:8;pointer-events:none}
.tile-tooltip b{display:block;font-size:11px;line-height:1.5;margin-bottom:5px}
.tile-tooltip>span{font-size:10px;line-height:1.6;color:var(--secondary);display:block}
.cooldown-tile:hover .tile-tooltip,.cooldown-tile:focus-visible .tile-tooltip{display:block}
@media(max-width:1100px){.launch-heading h2{font-size:26px}.character-card{padding:7px 8px 10px}.character-stats{font-size:6px}.character-description{font-size:7px}.character-picker,.theme-picker{gap:6px}.launch-screen{padding:2px}.launch-badge{display:none}.theme-card{padding:8px;gap:6px}.theme-card small{font-size:6px}.ability-bar{padding:10px;gap:9px}.ability-bar-label{font-size:7px}.cooldown-tiles{gap:6px}}
@media(max-width:760px){.overlay{padding:14px}.launch-heading{margin-bottom:10px}.launch-heading h2{font-size:25px}.character-picker{grid-template-columns:repeat(2,minmax(0,1fr))}.character-card{padding:9px 10px 10px}.character-card canvas{float:left;width:40px;height:40px;margin:0 8px 7px 0}.character-card>b{padding-top:5px;font-size:10px}.character-stats{font-size:6px;white-space:normal}.character-passive{clear:both;margin-top:8px}.character-description{min-height:22px}.theme-card{display:grid;grid-template-columns:26px 1fr;gap:6px}.theme-swatch{width:26px;height:26px;font-size:17px}.theme-card b{font-size:8px;margin:0}.theme-card small{display:none}.theme-tick{display:none}.launch-actions{margin-top:14px;align-items:flex-end;gap:8px}.launch-controls{gap:6px;max-width:170px;font-size:7px}.launch-controls small{display:none}.launch-actions .primary{padding:12px;font-size:10px}.launch-actions .primary span{margin-left:12px}.launch-heading .eyebrow{font-size:6px}.launch-section-label{margin:12px 0 8px;font-size:8px}.launch-section-label>span{font-size:7px}.ability-bar-label{display:none}.ability-bar{padding:9px}.cooldown-tile{width:48px;height:58px}.cooldown-tile svg{left:0;top:0}.cooldown-icon{top:9px}.cooldown-tiles{gap:6px}.tile-tooltip{width:180px}.cooldown-tile:nth-child(n+4) .tile-tooltip{left:auto;right:-1px}.arena-footer>span:first-child{max-width:45%;line-height:1.4}}
.cooldown-tile{background:var(--arena)}
.cooldown-track{stroke:#ffffff20}
.cooldown-tile.fired{background:color-mix(in srgb,var(--ability-color) 22%,var(--arena))}
body.is-playing header{height:48px}
body.is-playing main{padding-top:14px;padding-bottom:12px}
body.is-playing .page-title{margin-bottom:14px}
body.is-playing .page-title h1{font-size:24px;margin:4px 0}
body.is-playing .page-title p{display:none}
body.is-playing .metrics{margin-bottom:14px}
body.is-playing .metrics>div{padding:10px 14px}
body.is-playing .metrics strong{font-size:23px;margin:4px 0 7px}
body.is-playing .arena-wrap{height:calc(100dvh - 400px);min-height:240px;max-height:760px}
body.is-playing .side-panel{max-height:calc(100dvh - 208px);overflow:auto;scrollbar-width:thin}
body.is-playing footer{display:none}
@media(max-width:760px){body.is-playing .arena-wrap{height:calc(100dvh - 365px);min-height:260px}body.is-playing .metrics>div{padding:9px 8px}body.is-playing .metrics strong{font-size:20px}}

/* Online profile, economy and public rankings share the workspace theme. */
.online-nav{display:flex;align-items:center;gap:8px;margin-left:auto;margin-right:20px}
.online-nav button{border:1px solid var(--border);border-radius:5px;background:var(--surface);color:var(--text);padding:7px 10px;font-size:10px;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#account-mode{font-size:7px;letter-spacing:1px;color:var(--secondary);margin-right:8px}
.run-mode-note{font-size:8px;color:#b6c9a6;letter-spacing:.3px;padding:9px 0;border-bottom:1px solid #ffffff12;margin-bottom:7px}
.verification-status{font-size:11px;line-height:1.7;padding:10px;border-radius:5px;background:var(--surface-tint);color:var(--secondary);margin-top:14px}
.online-dialog{width:min(940px,calc(100vw - 32px));max-height:calc(100dvh - 50px);border:1px solid var(--border);border-radius:12px;padding:26px;background:var(--surface);color:var(--text);box-shadow:0 25px 100px #0006;overflow:auto;font:inherit}
.online-dialog::backdrop{background:#09120dbb;backdrop-filter:blur(5px)}
.online-panel-heading{display:flex;justify-content:space-between;align-items:center;gap:15px}.online-panel-heading h2{font-size:26px;letter-spacing:-.8px;margin:8px 0}.online-panel-heading>.quiet{font-size:20px}
.online-message{font-size:12px;color:var(--secondary);line-height:1.7;white-space:pre-wrap}.online-message:not(:empty){padding:12px;background:var(--surface-tint);border-radius:6px;margin:12px 0}
.online-subtitle{font-size:12px;line-height:1.8;color:var(--secondary);margin:12px 0}
.online-empty{padding:35px 15px;text-align:center;color:var(--secondary)}.online-empty>span{font-size:42px;color:var(--text)}.online-empty h3{font-size:18px;color:var(--text)}.online-empty p{font-size:12px;line-height:1.8;max-width:470px;margin:0 auto 25px}
.account-form{display:grid;gap:16px;max-width:420px;margin:24px 0}.account-form label{font-size:11px;color:var(--secondary);display:grid;gap:7px}.account-form input,.leader-filters select{font:inherit;font-size:13px;border:1px solid var(--border);padding:11px 12px;border-radius:6px;background:var(--surface-soft);color:var(--text)}.account-form .primary{margin-top:5px}
.account-links{display:flex;gap:18px;align-items:center;margin-top:22px}.account-links button{background:none;border:0;padding:0;font:inherit;color:var(--secondary);font-size:11px;text-decoration:underline}.account-links>span{font-size:11px;color:var(--secondary)}
.career-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:20px 0}.career-metrics>div{background:var(--surface-soft);border:1px solid var(--border);border-radius:7px;padding:15px}.career-metrics small{display:block;font-size:10px;color:var(--secondary)}.career-metrics b{display:block;font-size:25px;margin-top:8px;font-weight:600}
.career-upgrades{display:grid;grid-template-columns:1fr 1fr;gap:8px}.career-upgrades>div{display:flex;justify-content:space-between;gap:10px;padding:12px;border:1px solid var(--border);border-radius:6px;font-size:11px}.career-upgrades b{white-space:nowrap}
.leader-filters{display:flex;flex-wrap:wrap;gap:9px;margin:20px 0}.leader-filters select{font-size:11px;padding:8px 10px}.online-table-wrap{overflow-x:auto;margin-top:20px}.online-table{width:100%;border-collapse:collapse;text-align:left;font-size:11px}.online-table th{font-size:9px;letter-spacing:1px;color:var(--secondary);font-weight:600;padding:12px 9px;border-bottom:1px solid var(--border)}.online-table td{padding:14px 9px;border-bottom:1px solid var(--border);line-height:1.6;vertical-align:top}.online-table td small{display:block;color:var(--secondary);font-size:9px;margin-top:5px}.online-table details{font-size:9px;color:var(--secondary);max-width:260px}.online-table summary{cursor:pointer}.online-table details p{margin:6px 0}.online-table .my-ranking{background:var(--selected)}.online-table .quiet{font-size:9px;padding:6px;margin-top:7px}.online-dialog h3{font-size:15px;margin-top:25px}
@media(max-width:1100px){.header-right{display:none}.online-nav{margin-right:0}#account-mode{display:none}.online-nav button{font-size:9px;padding:6px 8px}}
@media(max-width:760px){header{padding:0 12px}.breadcrumb{font-size:6px;letter-spacing:.5px}.breadcrumb span{margin:0 5px}.online-nav{gap:5px;margin-left:8px}.online-nav button{font-size:8px;padding:6px;max-width:100px}.online-dialog{padding:18px}.online-panel-heading h2{font-size:22px}.career-metrics{grid-template-columns:repeat(2,1fr)}.career-metrics b{font-size:22px}.career-upgrades{grid-template-columns:1fr}.online-dialog .dialog-actions{flex-wrap:wrap}.run-mode-note{font-size:7px}}
/* Keep the canonical 900×550 playfield readable on short desktop windows. */
body.is-playing header{height:40px}
body.is-playing .page-title{display:none}
body.is-playing main{padding-top:10px;padding-bottom:8px}
body.is-playing .metrics{gap:10px;margin-bottom:10px}
body.is-playing .metrics>div{padding:7px 13px}
body.is-playing .metrics label{font-size:8px}
body.is-playing .metrics strong{font-size:21px;line-height:1.1;margin:3px 0 6px}
body.is-playing .panel-toolbar{height:34px}
body.is-playing .toolbar-right{margin-left:auto;margin-right:12px}
body.is-playing .panel-toolbar #pause-button{padding:4px 8px;font-size:9px;white-space:nowrap}
body.is-playing .arena-wrap{height:calc(100dvh - 280px);min-height:260px}
body.is-playing .arena-footer{height:32px}
body.is-playing .side-panel{max-height:calc(100dvh - 120px)}
@media(max-width:760px){body.is-playing .metrics>div{padding:7px}body.is-playing .metrics strong{font-size:19px}body.is-playing .arena-wrap{height:calc(100dvh - 280px)}body.is-playing .toolbar-right{display:none}}
