:root{--theme-bg-0: #04070f;--theme-bg-1: #0a1224;--theme-surface: rgba(13, 22, 42, .72);--theme-surface-glass: rgba(15, 26, 48, .55);--theme-surface-deep: rgba(7, 13, 27, .85);--theme-text: #f4f7ff;--theme-text-muted: #a9b8d6;--theme-accent: #ffb703;--theme-accent-soft: rgba(255, 183, 3, .16);--theme-accent-2: #65d6ce;--theme-royale: #ff4d6d;--theme-danger: #ff6b6b;--theme-ok: #22c55e;--theme-border: rgba(138, 180, 248, .18);--theme-border-strong: rgba(138, 180, 248, .36);--theme-shadow: 0 18px 42px rgba(0, 0, 0, .42);--theme-radius: 16px;--theme-radius-sm: 10px;--theme-transition: .25s ease;--font-display: "Orbitron", "Trebuchet MS", sans-serif;--font-ui: "Exo 2", "Segoe UI", "Verdana", sans-serif}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:radial-gradient(1100px 500px at 12% -6%,rgba(49,46,129,.4),transparent 60%),radial-gradient(900px 480px at 92% 4%,rgba(14,116,144,.32),transparent 62%),radial-gradient(700px 420px at 70% 92%,rgba(112,26,117,.2),transparent 60%),linear-gradient(160deg,var(--theme-bg-1),var(--theme-bg-0) 58%);background-attachment:fixed;color:var(--theme-text);font-family:var(--font-ui);line-height:1.55}#app{min-height:100vh;padding:18px}.hidden{display:none!important}.shell{max-width:1460px;margin:0 auto;display:grid;gap:14px}.top-logo{display:grid;justify-items:center;padding-top:4px}.logo{display:block;width:min(400px,62vw);max-width:100%;height:auto;margin:0;filter:drop-shadow(0 10px 30px rgba(101,214,206,.22))}.statusbar{display:flex;align-items:center;gap:12px;padding:10px 16px;border:1px solid var(--theme-border);border-radius:var(--theme-radius-sm);background:var(--theme-surface-glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}#connection-badge{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:999px;border:1px solid rgba(255,107,107,.45);color:var(--theme-danger);font-family:var(--font-display);font-size:.72rem;font-weight:700;letter-spacing:.1em}#connection-badge:before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor}#connection-badge.online{border-color:#22c55e80;color:var(--theme-ok)}.notice{margin:0;color:#dce7ff;font-size:.9rem}.panel{display:none;gap:14px;padding:20px;border:1px solid var(--theme-border);border-radius:var(--theme-radius);background:var(--theme-surface-glass);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:var(--theme-shadow)}.panel.visible{display:grid;animation:fadeInUp .35s ease both}.panel h2,.panel h3{margin:0;font-family:var(--font-display);letter-spacing:.04em}label,.field{display:grid;gap:5px;font-size:.82rem;color:var(--theme-text-muted);letter-spacing:.03em}input,select,button{border:1px solid var(--theme-border-strong);border-radius:var(--theme-radius-sm);background:#080f1ce6;color:var(--theme-text);padding:10px 12px;min-height:44px;font-size:.92rem;font-family:inherit;transition:border-color var(--theme-transition),box-shadow var(--theme-transition),background var(--theme-transition)}input:focus-visible,select:focus-visible,button:focus-visible{outline:none;border-color:var(--theme-accent);box-shadow:0 0 0 3px #ffb70338}button{background:linear-gradient(145deg,#294a7eeb,#1a3054eb);cursor:pointer;font-weight:600}button:hover{border-color:#ffc449d1}button:disabled{cursor:not-allowed;opacity:.55}button.ghost{background:#12223cb8}button.primary{background:linear-gradient(145deg,#f59e0b,#d97706);border-color:#ffd278a6;color:#171003;font-weight:700;letter-spacing:.04em;text-transform:uppercase;font-family:var(--font-display);font-size:.85rem;transition:transform var(--theme-transition),box-shadow var(--theme-transition),filter var(--theme-transition)}button.primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 10px 26px #f59e0b59;filter:brightness(1.06)}.actions{display:flex;flex-wrap:wrap;gap:8px;align-items:end}.hint{margin:0;color:var(--theme-text-muted);font-size:.82rem}.empty{margin:0;color:var(--theme-text-muted)}.pilot-strip{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) auto;gap:12px;align-items:end;padding:14px;border:1px solid var(--theme-border);border-radius:var(--theme-radius-sm);background:var(--theme-surface-deep)}.settings-btn{min-width:110px}.start-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:stretch}.start-card{display:flex;flex-direction:column;gap:14px;padding:18px;border:1px solid var(--theme-border);border-radius:var(--theme-radius);background:var(--theme-surface);transition:transform var(--theme-transition),box-shadow var(--theme-transition),border-color var(--theme-transition)}.start-card:hover{transform:translateY(-2px);border-color:var(--theme-border-strong);box-shadow:0 16px 38px #0006}.start-card h2{font-size:1.05rem;text-transform:uppercase;letter-spacing:.1em;color:var(--theme-accent-2)}.start-card .primary{margin-top:auto}.code-input{font-family:var(--font-display);font-size:1.3rem;letter-spacing:.42em;text-align:center;text-transform:uppercase}.footnote{text-align:center;opacity:.85}.settings-field{display:grid;gap:7px}.settings-label{font-size:.82rem;color:var(--theme-text-muted);letter-spacing:.03em}.mode-selector{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:4px;border:1px solid var(--theme-border-strong);border-radius:var(--theme-radius-sm);background:#080f1ce6}.mode-option{min-height:44px;padding:8px 10px;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--theme-text-muted);font-family:var(--font-display);font-size:.74rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase}.mode-option:hover:not(:disabled){color:var(--theme-text);border-color:var(--theme-border)}.mode-option.active{background:var(--theme-accent-soft);border-color:#ffb70399;color:var(--theme-accent)}.mode-option.active[data-mode=royale]{background:#ff4d6d24;border-color:#ff4d6d99;color:var(--theme-royale)}.mode-option:disabled{opacity:.8;cursor:default}.mode-desc{min-height:3.6em}.settings-stack{display:grid;gap:10px;max-width:420px}.toggle-row{display:inline-flex;align-items:center;gap:8px;color:var(--theme-text)}.toggle-row input[type=checkbox]{accent-color:var(--theme-accent);min-height:auto;width:18px;height:18px}input[type=range]{min-height:auto;padding:0;accent-color:var(--theme-accent);border:none;background:transparent}.lobby-panel{gap:18px}.lobby-head{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;padding:16px 18px;border:1px solid var(--theme-border);border-radius:var(--theme-radius-sm);background:var(--theme-surface-deep)}.lobby-code-block{display:grid;gap:2px}.lobby-code-label{font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;color:var(--theme-text-muted)}.lobby-code-row{display:flex;align-items:center;gap:12px}.lobby-code{font-family:var(--font-display);font-size:clamp(1.6rem,4vw,2.4rem);font-weight:900;letter-spacing:.3em;color:var(--theme-accent);text-shadow:0 0 24px rgba(255,183,3,.4)}.copy-btn{min-height:36px;padding:6px 14px;font-size:.78rem}.copy-btn.copied{border-color:#22c55e99;color:var(--theme-ok)}.lobby-head-meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.chip{display:inline-flex;align-items:center;padding:5px 12px;border-radius:999px;border:1px solid var(--theme-border-strong);background:#0c162ab3;color:var(--theme-text-muted);font-size:.76rem;font-weight:600;letter-spacing:.05em;text-transform:capitalize}.chip-mode{border-color:#ffb70380;color:var(--theme-accent)}.chip-mode.royale{border-color:#ff4d6d8c;color:var(--theme-royale)}.lobby-body{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px;align-items:start}.lobby-roster{display:grid;gap:10px;align-content:start;min-height:300px}.roster-title{font-size:.85rem;letter-spacing:.16em;text-transform:uppercase;color:var(--theme-text-muted)}.player-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;align-content:start}.player-card{position:relative;display:flex;align-items:center;gap:10px;min-height:64px;padding:10px 12px 10px 14px;border:1px solid var(--theme-border);border-radius:var(--theme-radius-sm);background:var(--theme-surface);overflow:hidden;animation:fadeInUp .3s ease both;transition:border-color var(--theme-transition),box-shadow var(--theme-transition)}.player-card:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--player-color, var(--theme-accent-2));box-shadow:0 0 14px var(--player-color, var(--theme-accent-2))}.player-card:hover{border-color:var(--theme-border-strong)}.player-card__swatch{flex-shrink:0;width:14px;height:14px;border-radius:50%;background:var(--player-color, var(--theme-accent-2));box-shadow:0 0 0 2px #ffffff2e,0 0 12px var(--player-color, var(--theme-accent-2))}.player-card__info{display:grid;gap:1px;min-width:0}.player-card__name{font-weight:700;font-size:.94rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-card__ship{font-size:.74rem;color:var(--theme-text-muted);letter-spacing:.06em;text-transform:uppercase}.player-card__badges{display:flex;gap:4px;margin-left:auto;flex-shrink:0}.tag{padding:2px 8px;border-radius:999px;font-size:.66rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border:1px solid rgba(101,214,206,.5);color:var(--theme-accent-2)}.tag.me{border-color:#ffb70385;color:var(--theme-accent)}.tag.ship-class{border-color:#9cb8e973;color:#d7e6ff}.lobby-settings{display:grid;gap:12px;align-content:start;padding:16px;border:1px solid var(--theme-border);border-radius:var(--theme-radius);background:var(--theme-surface)}.lobby-settings h3{font-size:.85rem;letter-spacing:.16em;text-transform:uppercase;color:var(--theme-text-muted)}.launch-btn{min-height:52px;font-size:.95rem}.waiting-hint{text-align:center;color:var(--theme-accent-2);animation:softPulse 2.4s ease-in-out infinite}.color-picker-field{display:grid;gap:6px}.color-picker-label{font-size:.82rem;color:var(--theme-text-muted)}.color-palette{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:6px;padding:8px;border-radius:var(--theme-radius-sm);border:1px solid var(--theme-border-strong);background:#080f1ce6}button.color-option{aspect-ratio:1;width:100%;min-height:22px;padding:0;border-radius:6px;border:2px solid rgba(255,255,255,.3);background:var(--swatch-color);transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease}button.color-option:hover{transform:translateY(-1px);border-color:#ffffffe6}button.color-option.selected{border-color:#fff;box-shadow:0 0 0 2px #ffb703d9,0 0 0 4px #ffffff3d}button.color-option:focus-visible{outline:none;border-color:#fff;box-shadow:0 0 0 2px #ffb703e6,0 0 0 4px #ffffff47}.game-layout{display:none;grid-template-columns:minmax(0,1fr) 340px;gap:12px;align-items:start}.game-layout.visible{display:grid}.game-layout:fullscreen,.game-layout:-webkit-full-screen{display:grid;grid-template-columns:minmax(0,1fr) 340px;align-items:stretch;width:100vw;height:100vh;max-width:none;padding:12px;background:linear-gradient(150deg,var(--theme-bg-1),var(--theme-bg-0))}.arena{position:relative;display:flex;align-items:center;justify-content:center;align-self:start;width:100%;aspect-ratio:16 / 9;max-height:74vh;border:1px solid var(--theme-border);border-radius:var(--theme-radius);overflow:hidden;background:#020617;box-shadow:0 18px 36px #00000059}.game-layout:fullscreen .arena,.game-layout:-webkit-full-screen .arena{aspect-ratio:auto;height:100%;max-height:none}.arena canvas{display:block;width:100%;height:auto;max-height:100%;margin:0!important}.hud{display:grid;align-content:start;gap:8px;padding:14px;border:1px solid var(--theme-border);border-radius:var(--theme-radius);background:var(--theme-surface-glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.hud h2{margin:0;font-family:var(--font-display);font-size:2rem;color:var(--theme-accent);text-shadow:0 0 24px rgba(255,183,3,.35)}.hud p{margin:0;font-size:.88rem}.royale-hud{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 10px;border:1px solid rgba(255,77,109,.4);border-radius:var(--theme-radius-sm);background:#ff4d6d14}.alive-pill{display:inline-flex;align-items:center;padding:3px 10px;border-radius:999px;border:1px solid rgba(255,77,109,.55);color:var(--theme-royale);font-family:var(--font-display);font-size:.78rem;font-weight:700;letter-spacing:.06em}.zone-status{font-size:.8rem;color:var(--theme-text-muted)}.zone-status.closing{color:var(--theme-royale);font-weight:600;animation:softPulse 1.6s ease-in-out infinite}.health-bar{height:10px;border-radius:999px;border:1px solid var(--theme-border-strong);background:#080f1ce6;overflow:hidden}.health-bar__fill{height:100%;width:0%;border-radius:999px;background:linear-gradient(90deg,#16a34a,#22c55e);box-shadow:0 0 12px #22c55e80;transition:width .2s ease,background .3s ease}.health-bar__fill.warn{background:linear-gradient(90deg,#d97706,#f59e0b);box-shadow:0 0 12px #f59e0b80}.health-bar__fill.danger{background:linear-gradient(90deg,#dc2626,#ef4444);box-shadow:0 0 12px #ef44448c}.hud-actions{display:flex;flex-wrap:wrap;gap:8px}.game-audio-panel{display:none;gap:8px;padding:10px;border:1px solid var(--theme-border);border-radius:var(--theme-radius-sm);background:#08101ee0}.game-audio-panel.visible{display:grid}.game-audio-header{display:flex;justify-content:space-between;align-items:center;gap:8px}.game-layout:fullscreen .hud,.game-layout:-webkit-full-screen .hud{overflow:auto}.home-indicator{display:grid;justify-items:center;gap:6px;padding:8px 10px;border-radius:var(--theme-radius-sm);border:1px solid var(--theme-border);background:#0a1424c7}.home-indicator.hidden{display:none}.home-indicator.docked{opacity:.72}.home-title{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--theme-text-muted)}.home-arrow-icon{width:58px;height:58px;color:var(--theme-accent);transform-origin:50% 50%;transition:transform .08s linear;filter:drop-shadow(0 6px 12px rgba(0,0,0,.45))}.home-indicator.docked .home-arrow-icon{color:var(--theme-accent-2)}.upgrade-grid{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.upgrade-grid button{font-size:.78rem;padding:8px 6px}.scoreboard{display:none;position:absolute;inset:0;padding:16px;border:0;border-radius:0;background:#030812eb;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);overflow:auto;z-index:30}.scoreboard.visible{display:block}.scoreboard h3{margin:0 0 8px;font-family:var(--font-display)}table{width:100%;border-collapse:collapse;font-size:.86rem}th,td{padding:7px 8px;border-bottom:1px solid rgba(156,184,233,.25);text-align:left}th{color:#c7d8fb;font-size:.72rem;text-transform:uppercase;letter-spacing:.05em}.mine{background:#65d6ce1f}.end-table{max-height:45vh;overflow:auto}.track-banner{position:fixed;right:18px;bottom:18px;z-index:160;max-width:min(320px,75vw);padding:8px 12px;border-radius:var(--theme-radius-sm);border:1px solid var(--theme-border-strong);background:#040a14e6;color:#f3f8ff;font-size:.84rem;box-shadow:0 10px 22px #0000006b;opacity:0;transform:translateY(8px);transition:opacity .18s ease,transform .18s ease;pointer-events:none}.track-banner.visible{opacity:1;transform:translateY(0)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes softPulse{0%,to{opacity:1}50%{opacity:.55}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media(max-width:1080px){#app{padding:10px}.pilot-strip,.start-cards,.lobby-body{grid-template-columns:1fr}.lobby-roster{min-height:0}.color-palette{grid-template-columns:repeat(5,minmax(0,1fr))}.game-layout.visible{grid-template-columns:1fr}.game-layout:fullscreen,.game-layout:-webkit-full-screen{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}.arena{max-height:56vh}.game-layout:fullscreen .arena,.game-layout:-webkit-full-screen .arena{min-height:0}}@media(max-width:560px){.statusbar{flex-direction:column;align-items:flex-start;gap:6px}.lobby-head{flex-direction:column;align-items:flex-start}.player-grid{grid-template-columns:1fr}}