:root{--bg-0:#05060a;--bg-1:#0b111c;--bg-2:#101a2a;--bg-panel:#080d14d1;--bg-inset:#ffffff0a;--line:#92bdd629;--line-hi:#70d8ff8c;--primary:#70d8ff;--danger:#f1495f;--accent:#f2b36c;--success:#3ad29f;--team-blue:#64d8ff;--team-red:#ff5d70;--text:#d8ecff;--text-hi:#fffdf5;--text-dim:#8ba7b8;--font-ui:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--font-body:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--glow-primary:0 0 14px #70d8ff59;--glow-danger:0 0 14px #f1495f66;--glow-accent:0 0 14px #f2b36c66;--radius-1:4px;--radius-2:8px;--radius-3:14px;--pad-1:8px;--pad-2:14px;--pad-3:22px}.panel{border:1px solid var(--line);border-radius:var(--radius-2);background:var(--bg-panel);box-shadow:inset 0 1px #ffffff0a,0 18px 56px #0006}.pill{border:1px solid var(--line);font:800 10px/1.5 var(--font-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim);background:var(--bg-inset);white-space:nowrap;border-radius:999px;align-items:center;gap:6px;padding:4px 11px;display:inline-flex}.pill:before{content:"";background:currentColor;border-radius:50%;width:7px;height:7px;box-shadow:0 0 6px}.pill--ok{color:var(--success);border-color:#3ad29f66}.pill--warn{color:var(--accent);border-color:#f2b36c66}.pill--bad{color:var(--danger);border-color:#f1495f66}@keyframes pill-pulse{50%{opacity:.45}}.pill--warn:before,.pill--bad:before{animation:1.2s ease-in-out infinite pill-pulse}*{box-sizing:border-box;margin:0}html,body{background:var(--bg-0);height:100%;font-family:var(--font-body);overflow:hidden}canvas{display:block}button,input{font:inherit}.main-menu{z-index:20;color:var(--text);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:linear-gradient(90deg,#040608eb 0%,#070c10d6 48%,#0f0809b8 100%);justify-content:center;align-items:stretch;padding:24px;display:flex;position:fixed;inset:0}.main-menu__shell{grid-template-rows:auto 1fr;gap:16px;width:min(1180px,100%);min-height:min(720px,100%);animation:.35s ease-out menu-in;display:grid}@keyframes menu-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.main-menu__top{border-bottom:1px solid #dfe7da2e;justify-content:space-between;align-items:end;gap:18px;padding-bottom:12px;display:flex}.main-menu__title span{color:var(--accent);font:800 12px/1.2 var(--font-ui);text-transform:uppercase;letter-spacing:0;display:block}.main-menu__title strong{color:var(--text-hi);letter-spacing:0;margin-top:5px;font-size:clamp(32px,5.5vw,62px);line-height:.98;display:block}.menu-status-stack{flex-direction:column;align-items:flex-end;gap:7px;display:flex}.menu-status{max-width:440px;min-height:20px;color:var(--text-dim);text-align:right;font:700 12px/1.4 var(--font-ui)}.menu-layout,.lobby-layout{grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:16px;min-height:0;display:grid}.mode-list{grid-template-columns:repeat(3,minmax(0,1fr));align-content:start;gap:12px;display:grid}.mode-card,.command-panel,.lobby-panel{border:1px solid var(--line);border-radius:var(--radius-2);background:var(--bg-panel);box-shadow:inset 0 1px #ffffff0a,0 18px 56px #00000057}.mode-card{grid-template-rows:1fr auto;min-height:318px;padding:18px;transition:transform .15s,border-color .15s,box-shadow .15s;display:grid;position:relative;overflow:hidden}.mode-card:hover{border-color:var(--line-hi);box-shadow:inset 0 1px 0 #ffffff0d, 0 22px 60px #00000073, var(--glow-primary);transform:translateY(-3px)}.mode-card__stripe{background:linear-gradient(180deg, var(--primary), var(--danger) 52%, var(--accent));width:4px;position:absolute;inset:0 auto 0 0;box-shadow:0 0 12px #70d8ff59}.mode-card__head{padding-left:4px}.mode-card__head span{color:var(--text-dim);font:800 11px/1 var(--font-ui);text-transform:uppercase;letter-spacing:0}.mode-card h2,.command-panel h2{color:var(--text-hi);letter-spacing:0;margin-top:10px;font-size:24px;line-height:1.05}.mode-card p,.command-panel p{color:var(--text-dim);margin-top:10px;font-size:14px;line-height:1.5}.mode-card__body,.command-panel,.lobby-panel{gap:12px;display:grid}.command-panel,.lobby-panel{align-content:start;padding:18px}.field-label{color:var(--text-dim);font:800 11px/1.2 var(--font-ui);text-transform:uppercase;letter-spacing:0;gap:6px;display:grid}.field-label--grow{min-width:0}.field-note{color:var(--primary);font:700 10px/1.2 var(--font-ui);text-transform:none;opacity:.75;min-height:12px}select.menu-input{appearance:none;cursor:pointer;padding:0 10px}.menu-button,.menu-input{width:100%;min-height:42px;font:800 13px/1 var(--font-ui);letter-spacing:0;border-radius:6px}.menu-button{color:#16100a;cursor:pointer;background:linear-gradient(#ffe7a3,#f2a85f);border:1px solid #ffeebbb3;transition:filter .12s,box-shadow .12s,transform 50ms}.menu-button:hover:not(:disabled){filter:brightness(1.06);box-shadow:var(--glow-accent)}.menu-button:active:not(:disabled){transform:translateY(1px)}.menu-button:disabled{cursor:default;opacity:.55}.menu-button--ghost{color:var(--text);background:#091212c7;border-color:#70d8ff7a}.menu-input{border:1px solid var(--line);color:var(--text-hi);text-transform:none;background:#020607bd;outline:none;padding:0 12px}.menu-input:focus,.menu-button:focus-visible{border-color:var(--line-hi);box-shadow:0 0 0 2px #70d8ff29}.menu-input--error{border-color:var(--danger);box-shadow:0 0 0 2px #f1495f2e}.join-row,.password-gate,.invite-output__actions{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:10px;display:grid}.invite-output__actions .menu-button,.join-row .menu-button,.password-gate .menu-button{width:auto;min-width:132px;padding:0 16px}.room-facts{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;display:grid}.room-fact{border:1px solid var(--line);border-radius:var(--radius-2);background:var(--bg-inset);min-height:68px;padding:12px}.room-fact span{color:var(--text-dim);font:800 10px/1 var(--font-ui);text-transform:uppercase;letter-spacing:0;display:block}.room-fact strong{color:var(--text-hi);letter-spacing:0;margin-top:8px;font-size:15px;line-height:1.15;display:block}.roster-list{gap:8px;display:grid}.roster-slot{border:1px solid var(--line);border-radius:var(--radius-2);background:var(--bg-inset);grid-template-columns:14px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:48px;padding:10px 12px;display:grid}.roster-slot strong{min-width:0;color:var(--text-hi);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.roster-slot em{color:var(--text-dim);font:800 11px/1 var(--font-ui);font-style:normal}.roster-slot--empty{opacity:.62}.roster-slot--offline strong,.roster-slot--offline .team-dot{opacity:.45}.roster-slot--offline em{color:var(--accent)}.team-dot{background:#66706d;border-radius:50%;width:10px;height:10px}.team-dot--blue{background:var(--team-blue)}.team-dot--red{background:var(--team-red)}.mode-notes{gap:8px;display:grid}.mode-notes span{border-left:3px solid var(--accent);color:var(--text);background:var(--bg-inset);padding:9px 10px;font-size:13px;line-height:1.35;display:block}@media (width<=1020px){.menu-layout,.lobby-layout{grid-template-columns:1fr}.mode-list{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=700px){html,body{overflow:auto}.main-menu{min-height:100%;padding:16px;position:absolute}.main-menu__shell{min-height:0}.main-menu__top{flex-direction:column;align-items:start}.menu-status{text-align:left}.mode-list,.room-facts{grid-template-columns:1fr}.mode-card{min-height:230px}.join-row,.password-gate,.invite-output__actions{grid-template-columns:1fr}.invite-output__actions .menu-button,.join-row .menu-button,.password-gate .menu-button{width:100%}}html.touch-mode,html.touch-mode body,html.touch-mode canvas{touch-action:none;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}html.touch-mode .main-menu{touch-action:pan-x pan-y;-webkit-user-select:auto;user-select:auto;min-height:0;padding:calc(12px + env(safe-area-inset-top,0px)) calc(12px + env(safe-area-inset-right,0px)) calc(12px + env(safe-area-inset-bottom,0px)) calc(12px + env(safe-area-inset-left,0px));position:fixed;inset:0;overflow-y:auto}.touch-ui{z-index:4;pointer-events:none;font-family:var(--font-ui);position:fixed;inset:0}@media (hover:hover) and (pointer:fine){.touch-ui{display:none!important}}.touch-ui .is-hidden{display:none!important}.touch-joy{left:calc(18px + env(safe-area-inset-left,0px));bottom:calc(18px + env(safe-area-inset-bottom,0px));pointer-events:auto;touch-action:none;background:radial-gradient(circle,#102a364d,#08121a8c);border:2px solid #66ffff59;border-radius:50%;width:132px;height:132px;position:absolute;box-shadow:inset 0 0 24px #66ffff1a}.touch-joy__thumb{pointer-events:none;background:#66ffff2e;border:2px solid #66ffffbf;border-radius:50%;width:58px;height:58px;margin:-29px 0 0 -29px;position:absolute;top:50%;left:50%;box-shadow:0 0 14px #66ffff59}.touch-btns{right:calc(14px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));pointer-events:none;width:172px;height:170px;position:absolute}.touch-btn{color:#aef8ff;width:58px;height:58px;font:800 11px/1 var(--font-ui);letter-spacing:1px;text-shadow:0 0 6px #6ff9;appearance:none;pointer-events:auto;touch-action:none;cursor:pointer;background:#0a1a226b;border:2px solid #66ffff8c;border-radius:50%;outline:none;padding:0;position:absolute}.touch-btn.is-held{background:#66ffff47}.touch-btn--fire{color:#ffb9c2;text-shadow:0 0 6px #ff5566b3;background:#300a1073;border-color:#ff5566b3;width:84px;height:84px;font-size:13px;bottom:0;right:0}.touch-btn--fire.is-held{background:#ff55664d}.touch-btn--boost{bottom:0;right:98px}.touch-btn--dash{color:#ffd9a1;text-shadow:0 0 6px #fa39;border-color:#fa39;bottom:98px;right:0}.touch-btn--dash.is-held{background:#ffaa3347}.touch-btn--wpn{width:56px;height:56px;bottom:82px;right:88px}.touch-btn--pause{top:calc(10px + env(safe-area-inset-top,0px));right:calc(10px + env(safe-area-inset-right,0px));width:46px;height:46px;font-size:12px}.touch-resume{z-index:10;color:#cfe;font:800 24px/1.4 var(--font-ui);letter-spacing:4px;text-shadow:0 0 10px #000;pointer-events:auto;background:#05060a8c;justify-content:center;align-items:center;display:none;position:absolute;inset:0}.touch-resume.is-on{display:flex}@media (pointer:coarse),(width<=820px){html.touch-mode .hud-help{display:none}html.touch-mode .hud{top:calc(8px + env(safe-area-inset-top,0px));left:calc(10px + env(safe-area-inset-left,0px));font-size:11px;line-height:1.45}html.touch-mode .hud-hpbar{top:calc(44px + env(safe-area-inset-top,0px));left:calc(10px + env(safe-area-inset-left,0px));width:150px;height:10px}html.touch-mode .hud-skills{top:calc(60px + env(safe-area-inset-top,0px));left:calc(10px + env(safe-area-inset-left,0px));font-size:10px}html.touch-mode .hud-weapon{top:calc(76px + env(safe-area-inset-top,0px));left:calc(10px + env(safe-area-inset-left,0px));font-size:10px}html.touch-mode .hud-banner{font-size:26px}html.touch-mode .hud-radar{width:104px;height:104px;right:calc(10px + env(safe-area-inset-right,0px));bottom:calc(196px + env(safe-area-inset-bottom,0px))}html.touch-mode .fleet-bars{top:calc(6px + env(safe-area-inset-top,0px))}html.touch-mode .fleet-bars .fleet-row{width:min(52vw,300px)}html.touch-mode .capital-bar{width:min(60vw,320px)}}.game-menu{z-index:30;padding:calc(20px + env(safe-area-inset-top,0px)) calc(20px + env(safe-area-inset-right,0px)) calc(20px + env(safe-area-inset-bottom,0px)) calc(20px + env(safe-area-inset-left,0px));color:var(--text);-webkit-backdrop-filter:blur(5px);font-family:var(--font-ui);pointer-events:auto;background:radial-gradient(120% 120% at 50% 30%,#060c12b8,#030508eb);justify-content:center;align-items:center;display:none;position:fixed;inset:0}.game-menu.is-open{display:flex}.game-menu__panel{text-align:center;background:linear-gradient(#0e1622f5,#090e16f5);border:1px solid #66ffff47;border-radius:14px;width:min(380px,100%);padding:26px 24px 24px;box-shadow:0 18px 60px #0000008c,inset 0 0 40px #32789614}.game-menu__title{letter-spacing:5px;color:var(--primary);text-shadow:var(--glow-primary);font-size:30px;font-weight:800}.game-menu--end .game-menu__title{color:var(--danger);text-shadow:var(--glow-danger)}.game-menu--win .game-menu__title{color:var(--accent);text-shadow:var(--glow-accent)}.game-menu__sub{letter-spacing:1px;color:#bed6e6b8;min-height:14px;margin-top:8px;font-size:12px}.game-menu__actions{flex-direction:column;gap:10px;margin-top:22px;display:flex}.gm-btn{color:#cdf3ff;width:100%;font:700 14px/1 var(--font-ui);letter-spacing:2px;text-transform:uppercase;cursor:pointer;appearance:none;touch-action:manipulation;background:#0e1e2899;border:1px solid #6ff6;border-radius:9px;outline:none;padding:14px 16px;transition:background .12s,border-color .12s,transform 50ms}.gm-btn:hover{background:#162e3ed9;border-color:#78f0ffbf}.gm-btn:active{transform:translateY(1px)}.gm-btn--primary{color:#b9ffe2;background:#0e2c24b3;border-color:#5ae6aab3}.gm-btn--primary:hover{background:#143c30e6;border-color:#78ffc8e6}.gm-btn--ghost{color:#c8d8e6d9;letter-spacing:1px;background:#10161e80;border-color:#96a8ba59}.gm-btn--ghost:hover{background:#18202ab3;border-color:#bed0e299}.hud{color:var(--text);font:16px/1.5 var(--font-ui);text-shadow:0 0 6px #000;pointer-events:none;position:fixed;top:12px;left:16px}.hud__match{color:var(--primary)}.hud__win{color:var(--accent)}.hud-hpbar{background:var(--bg-2);border:1px solid var(--line);pointer-events:none;border-radius:3px;width:220px;height:12px;position:fixed;top:64px;left:16px;overflow:hidden}.hud-hpbar__fill{background:linear-gradient(90deg, var(--success), #a6f0c6);width:100%;height:100%;transition:width .12s;box-shadow:0 0 10px #3ad29f73}.hud-skills{color:var(--success);font:12px/1.4 var(--font-ui);text-shadow:0 0 6px #000;pointer-events:none;position:fixed;top:84px;left:16px}.hud-weapon{color:var(--accent);font:12px/1.4 var(--font-ui);text-shadow:0 0 6px #000;pointer-events:none;position:fixed;top:104px;left:16px}.hud-help{color:var(--text-dim);font:13px/1.5 var(--font-ui);pointer-events:none;position:fixed;bottom:14px;left:16px}.hud-radar{pointer-events:none;opacity:.92;width:170px;height:170px;position:fixed;bottom:14px;right:14px}.reticle{box-sizing:border-box;pointer-events:none;position:fixed;top:50%;left:50%}.reticle__dot{background:currentColor;width:3px;height:3px;margin:-1.5px 0 0 -1.5px;position:absolute;top:50%;left:50%}.reticle--gun{color:#6ff;opacity:.85;border:2px solid #6ff;border-radius:50%;width:26px;height:26px;margin:-13px 0 0 -13px}.reticle--gun .reticle__dot{border-radius:50%}.reticle--beam{color:#ff3b3b;opacity:.9;border:2px solid #ff3b3b;width:22px;height:22px;margin:-11px 0 0 -11px;display:none;transform:rotate(45deg)}.reticle--missile{color:#fa3;opacity:.9;border:2px dashed #fa3;width:30px;height:30px;margin:-15px 0 0 -15px;display:none}.lock-box{box-sizing:border-box;opacity:0;pointer-events:none;width:44px;height:44px;font:bold 10px var(--font-ui);color:#fa3;text-align:center;z-index:2;border:2px dashed #fa3;margin:-22px 0 0 -22px;position:fixed}.lock-box__label{white-space:nowrap;text-shadow:0 0 5px #000;margin-top:3px;position:absolute;top:100%;left:50%;transform:translate(-50%)}.hint-splash{text-align:center;color:var(--text);font:22px var(--font-ui);text-shadow:0 0 8px #000;cursor:pointer;background:#05060a8c;flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.hint-splash__sub{opacity:.7;font-size:14px}.hit-marker{color:#f56;font:bold 22px var(--font-ui);opacity:0;pointer-events:none;transition:opacity .25s;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.hurt-flash{opacity:0;pointer-events:none;background:#f23;transition:opacity .3s;position:fixed;inset:0}.hurt-ring{opacity:0;pointer-events:none;width:76vmin;height:76vmin;margin:-38vmin 0 0 -38vmin;transition:opacity .55s;position:fixed;top:50%;left:50%}.hurt-ring__wedge{background:radial-gradient(at 50% 0,#ff2d2dd9,#ff2d2d00 70%);border-radius:50%;width:30vmin;height:12vmin;position:absolute;top:-2vmin;left:50%;transform:translate(-50%)}.hud-banner{color:#ffe;font:bold 40px var(--font-ui);letter-spacing:2px;text-shadow:0 0 12px #000, var(--glow-accent);opacity:0;pointer-events:none;white-space:nowrap;transition:opacity .5s;position:fixed;top:38%;left:50%;transform:translate(-50%,-50%)}.chooser{color:var(--text);font-family:var(--font-ui);cursor:default;z-index:5;background:#05060acc;flex-direction:column;justify-content:center;align-items:center;gap:22px;display:none;position:fixed;inset:0}.chooser__title{font:bold 26px var(--font-ui);text-shadow:0 0 10px #000}.chooser__row{flex-wrap:wrap;justify-content:center;gap:16px;display:flex}.chooser-card{border:1px solid var(--line);border-radius:var(--radius-2);background:var(--bg-panel);cursor:pointer;text-align:center;width:220px;padding:16px;transition:transform .12s,border-color .12s,box-shadow .12s,background .12s}.chooser-card:hover{background:var(--bg-2);border-color:var(--primary);box-shadow:var(--glow-primary);transform:translateY(-2px)}.chooser-card b{font-size:18px}.chooser-card span{opacity:.75;font-size:13px}.capital-bar{text-align:center;width:320px;font:12px/1.5 var(--font-ui);text-shadow:0 0 6px #000;pointer-events:none;z-index:3;display:none;position:fixed;left:50%;transform:translate(-50%)}.capital-bar--enemy{color:#fbb;top:14px}.capital-bar--ally{color:#bdf;top:56px}.capital-bar__label{letter-spacing:3px;margin-bottom:3px}.capital-bar__bar{height:11px}.capital-bar--enemy .capital-bar__bar{background:#2a1015;border:1px solid #803040}.capital-bar--ally .capital-bar__bar{background:#0f1c2c;border:1px solid #2f66a8}.capital-bar__fill{width:100%;height:100%}.capital-bar--enemy .capital-bar__fill{background:linear-gradient(90deg,#f34,#ffb055)}.capital-bar--ally .capital-bar__fill{background:linear-gradient(90deg,#36a6ff,#9fe4ff)}.fleet-bars{pointer-events:none;z-index:3;flex-direction:column;align-items:center;gap:4px;display:flex;position:fixed;top:12px;left:50%;transform:translate(-50%)}.fleet-row{text-align:center;width:300px;font:11px/1.25 var(--font-ui);text-shadow:0 0 5px #000;display:none}.fleet-row__label{letter-spacing:2px;margin-bottom:2px}.fleet-row__bar{border-radius:2px;height:9px;overflow:hidden}.fleet-row__fill{height:100%;transition:width .12s linear}.fleet-row--enemy .fleet-row__label{color:#ffb0b0}.fleet-row--ally .fleet-row__label{color:#bcd8ff}.fleet-row--enemy .fleet-row__bar{background:#2a1015;border:1px solid #803040}.fleet-row--ally .fleet-row__bar{background:#0f1c2c;border:1px solid #2f66a8}.fleet-row--enemy .fleet-row__fill{background:linear-gradient(90deg,#f34,#ffb055)}.fleet-row--ally .fleet-row__fill{background:linear-gradient(90deg,#36a6ff,#9fe4ff)}