:root{--hud:#7fe7ff;--hud-dim:#7fe7ff73;--text:#fff;--warn:#ff7a45;--gold:#ffd27a;--bg:#02040a;--panel:#040c169e;--font-hud:"Chakra Petch", "Avenir Next", sans-serif;--font-ui:"Inter", "Avenir Next", sans-serif;color:var(--text);background:var(--bg);font-family:var(--font-ui)}*{box-sizing:border-box}html,body,#app{background:var(--bg);width:100%;height:100%;margin:0;overflow:hidden}#game-canvas{cursor:crosshair;width:100%;height:100%;display:block;position:fixed;inset:0}.hidden{display:none!important}.loading{text-align:center;background:var(--bg);z-index:50;place-content:center;gap:18px;transition:opacity .6s;display:grid;position:fixed;inset:0}.loading.done{opacity:0;pointer-events:none}.loading-title{font:600 34px/1 var(--font-hud);letter-spacing:.4em;color:var(--text)}.loading-bar{background:#ffffff1a;width:min(420px,80vw);height:2px}#loading-fill{background:var(--hud);width:0;height:100%;transition:width .2s}#loading-text{font:400 13px var(--font-ui);color:var(--hud-dim);letter-spacing:.08em}.attribution{font:400 10px var(--font-ui);color:#ffffff73;pointer-events:none;z-index:5;text-align:right;position:fixed;bottom:6px;right:10px}.hud{pointer-events:none;font-family:var(--font-hud);color:var(--text);text-shadow:0 0 6px #000000e6;z-index:10;position:fixed;inset:0}.reticle{width:0;height:0;position:absolute;top:50%;left:50%}.reticle-ring{border:1px solid #7fe7ff2e;border-radius:50%;width:128px;height:128px;position:absolute;top:-64px;left:-64px}.reticle-ring:after{content:"";border:1px solid var(--hud-dim);border-radius:50%;width:10px;height:10px;margin:-5px 0 0 -5px;position:absolute;top:50%;left:50%}.reticle-dot{background:var(--hud);width:6px;height:6px;box-shadow:0 0 8px var(--hud);border-radius:50%;position:absolute;top:-3px;left:-3px}.hud-flight{align-items:flex-end;gap:22px;display:flex;position:absolute;bottom:34px;left:50%;transform:translate(-50%)}.hud-block{flex-direction:column;min-width:170px;display:flex}.hud-block:first-child{text-align:right;align-items:flex-end}.hud-label{letter-spacing:.22em;color:var(--hud-dim);font-size:11px}.hud-value{letter-spacing:.04em;font-variant-numeric:tabular-nums;white-space:nowrap;font-size:26px;font-weight:600}.hud-sub{color:var(--hud-dim);letter-spacing:.1em;font-size:11px}.hud-throttle{border:1px solid var(--hud-dim);width:8px;height:64px;position:relative;overflow:hidden}.hud-throttle-fill{background:var(--hud);transform-origin:bottom;height:100%;box-shadow:0 0 10px var(--hud);position:absolute;bottom:0;left:0;right:0;transform:scaleY(0)}.hud-throttle-fill.reverse{background:var(--warn)}.hud-status{letter-spacing:.18em;color:var(--gold);text-transform:uppercase;font-size:18px;position:absolute;top:22%;left:50%;transform:translate(-50%)}.hud-hint{font:400 13px var(--font-ui);color:var(--text);background:var(--panel);border:1px solid var(--hud-dim);white-space:nowrap;padding:8px 14px;position:absolute;bottom:120px;left:50%;transform:translate(-50%)}.hud-target{flex-direction:column;align-items:center;gap:2px;display:flex;position:absolute;top:18px;left:50%;transform:translate(-50%)}.hud-target-name{letter-spacing:.12em;text-transform:uppercase;font-size:22px;font-weight:600}.hud-ap{letter-spacing:.16em;color:var(--hud-dim);font-size:11px}.hud-ap.on{color:var(--gold);animation:1.2s ease-in-out infinite pulse}@keyframes pulse{50%{opacity:.45}}.markers{pointer-events:none;z-index:8;font-family:var(--font-hud);position:fixed;inset:0}.marker{white-space:nowrap;text-shadow:0 0 5px #000;flex-direction:column;margin-top:-7px;padding-left:10px;display:flex;position:absolute;top:0;left:0}.marker:before{content:"";background:var(--c);width:6px;height:6px;box-shadow:0 0 6px var(--c);border-radius:50%;position:absolute;top:4px;left:-3px}.marker-label{letter-spacing:.12em;color:#fff;text-transform:uppercase;font-size:12px}.marker-dist{color:var(--hud-dim);letter-spacing:.06em;font-size:10px}.marker.no-label .marker-label,.marker.no-label .marker-dist{display:none}.marker.is-target .marker-label{color:var(--gold)}.marker.is-player:before{background:var(--c);border-radius:0;transform:rotate(45deg)}.target-bracket{--b:10px;background:linear-gradient(var(--gold), var(--gold)) top left / var(--b) 1px no-repeat, linear-gradient(var(--gold), var(--gold)) top left / 1px var(--b) no-repeat, linear-gradient(var(--gold), var(--gold)) top right / var(--b) 1px no-repeat, linear-gradient(var(--gold), var(--gold)) top right / 1px var(--b) no-repeat, linear-gradient(var(--gold), var(--gold)) bottom left / var(--b) 1px no-repeat, linear-gradient(var(--gold), var(--gold)) bottom left / 1px var(--b) no-repeat, linear-gradient(var(--gold), var(--gold)) bottom right / var(--b) 1px no-repeat, linear-gradient(var(--gold), var(--gold)) bottom right / 1px var(--b) no-repeat;border:1px solid #0000;position:absolute;top:0;left:0}.target-arrow{border-left:18px solid var(--gold);filter:drop-shadow(0 0 4px #000);border-top:9px solid #0000;border-bottom:9px solid #0000;width:0;height:0;position:absolute;top:-9px;left:-9px}.system-map{z-index:20;background:radial-gradient(circle,#081222f0,#02040af7);position:fixed;inset:0}.system-map canvas{cursor:pointer;width:100%;height:100%;display:block}.map-title{font:600 16px var(--font-hud);letter-spacing:.3em;color:var(--hud);position:absolute;top:16px;left:20px}.map-title span{letter-spacing:.12em;color:var(--hud-dim);margin-left:12px;font-size:11px;font-weight:400}.hud-shield{flex-direction:column;gap:4px;width:220px;display:flex;position:absolute;bottom:34px;left:28px}.hud-shield-bar{border:1px solid var(--hud-dim);height:6px;padding:1px}.hud-shield-fill{background:linear-gradient(90deg, #3fb8ff, var(--hud));transform-origin:0;height:100%;box-shadow:0 0 8px var(--hud);transition:transform .15s}.hud-shield-fill.low{background:var(--warn);box-shadow:0 0 10px var(--warn);animation:.6s infinite pulse}.hud-score{flex-direction:column;align-items:flex-end;display:flex;position:absolute;top:18px;right:28px}.hud-score .hud-value.pop{color:var(--gold);animation:.35s cubic-bezier(.34,1.56,.64,1) pop}@keyframes pop{0%{transform:scale(1.45)}to{transform:scale(1)}}.hud-vignette{opacity:0;background:radial-gradient(#0000 55%,#ff3c1e8c 100%);transition:opacity 80ms;position:absolute;inset:0}.hud-death{text-align:center;background:#00000059;place-content:center;display:grid;position:absolute;inset:0}.hud-death-title{letter-spacing:.35em;color:var(--warn);font-size:34px}.hud-death-count{letter-spacing:.2em;color:var(--text);margin-top:10px;font-size:14px}.hud-log{text-align:right;flex-direction:column;align-items:flex-end;gap:2px;max-width:280px;display:flex;position:absolute;top:84px;right:28px}.hud-log-next{color:var(--gold);letter-spacing:.06em;font-size:13px}.hud-toast{opacity:0;background:var(--panel);border:1px solid var(--hud-dim);flex-direction:column;align-items:center;gap:4px;padding:10px 22px;transition:opacity .35s,transform .35s cubic-bezier(.34,1.56,.64,1);display:flex;position:absolute;top:110px;left:50%;transform:translate(-50%,-12px)}.hud-toast.show{opacity:1;transform:translate(-50%)}.hud-toast b{letter-spacing:.2em;color:var(--gold);font-size:15px;font-weight:600}.hud-toast span{color:var(--hud-dim);letter-spacing:.1em;font-size:12px}.menu{z-index:30;pointer-events:none;background:linear-gradient(90deg,#02040ad1 0%,#02040a59 34%,#0000 55%);grid-template-rows:auto 1fr auto;padding:36px 44px;display:grid;position:fixed;inset:0}.menu>*{pointer-events:auto}.menu-brand{max-width:520px}.menu-title{font:600 44px/1 var(--font-hud);letter-spacing:.32em;color:#fff;text-shadow:0 0 24px #7fe7ff59}.menu-tag{font:400 14px var(--font-ui);color:var(--hud-dim);letter-spacing:.06em;margin-top:10px}.menu-panel{background:var(--panel);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid #7fe7ff40;flex-direction:column;align-self:center;gap:18px;width:min(380px,90vw);padding:24px;display:flex}.menu-field{font:11px var(--font-hud);letter-spacing:.22em;color:var(--hud-dim);flex-direction:column;gap:6px;display:flex}.menu-field input{font:500 18px var(--font-ui);color:#fff;border:1px solid var(--hud-dim);background:#ffffff0d;outline:none;padding:10px 12px}.menu-field input:focus{border-color:var(--hud);box-shadow:0 0 0 1px var(--hud)}.menu-ship{justify-content:space-between;align-items:center;gap:8px;display:flex}.menu-arrow{width:44px;height:44px;font:28px/1 var(--font-hud);color:var(--hud);border:1px solid var(--hud-dim);cursor:pointer;background:0 0}.menu-arrow:hover,.menu-arrow:focus-visible{border-color:var(--hud);background:#7fe7ff1f;outline:none}.menu-ship-info{text-align:center}.menu-ship-name{font:600 26px var(--font-hud);letter-spacing:.18em;text-transform:uppercase}.menu-ship-role{font:12px var(--font-ui);color:var(--hud-dim);letter-spacing:.08em}.menu-stats{flex-direction:column;gap:8px;display:flex}.stat{font:11px var(--font-hud);letter-spacing:.2em;color:var(--hud-dim);grid-template-columns:88px 1fr;align-items:center;display:grid}.stat-bar{background:#ffffff14;height:6px}.stat-bar i{background:var(--hud);transform-origin:0;height:100%;box-shadow:0 0 8px var(--hud);transition:transform .3s cubic-bezier(.34,1.56,.64,1);display:block}.menu-swatches{justify-content:center;gap:10px;min-height:28px;display:flex}.swatch{background:var(--sw);cursor:pointer;border:2px solid #0000;border-radius:50%;width:28px;height:28px;box-shadow:inset 0 0 0 3px #00000059}.swatch.on{box-shadow:0 0 12px var(--sw);border-color:#fff}.menu-launch{font:600 18px var(--font-hud);letter-spacing:.4em;color:#02040a;background:var(--hud);cursor:pointer;border:none;padding:14px;transition:transform .15s,box-shadow .15s}.menu-launch:hover,.menu-launch:focus-visible{outline:none;transform:translateY(-1px);box-shadow:0 0 24px #7fe7ff99}.menu-online{font:12px var(--font-ui);color:var(--hud-dim);text-align:center;min-height:16px}.menu-help{font:12px var(--font-ui);color:#ffffff8c;flex-wrap:wrap;gap:6px 16px;max-width:760px;display:flex}.pause{z-index:40;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#02040a8c;place-items:center;display:grid;position:fixed;inset:0}.pause-card{background:var(--panel);border:1px solid #7fe7ff40;flex-direction:column;gap:18px;width:min(820px,92vw);padding:28px;display:flex}.pause-title{font:600 26px var(--font-hud);letter-spacing:.35em}.pause-title span{font:400 12px var(--font-ui);letter-spacing:.06em;color:var(--hud-dim);margin-left:12px}.pause-cols{grid-template-columns:1fr 1fr;gap:28px;display:grid}.pause-btn{width:100%;font:600 14px var(--font-hud);letter-spacing:.25em;text-transform:uppercase;color:var(--text);border:1px solid var(--hud-dim);cursor:pointer;background:0 0;margin-bottom:10px;padding:12px;display:block}.pause-btn:hover,.pause-btn:focus-visible{border-color:var(--hud);background:#7fe7ff1a;outline:none}.pause-btn.small{padding:8px;font-size:12px}.pause-vol{font:12px var(--font-hud);letter-spacing:.2em;color:var(--hud-dim);align-items:center;gap:12px;margin:6px 0 12px;display:flex}.pause-vol input{accent-color:var(--hud);flex:1}.pause-keys{font:12px/1.9 var(--font-ui);color:#ffffffb3}.pause-keys b{color:var(--hud);font-weight:500}.pause-sub{font:11px var(--font-hud);letter-spacing:.25em;color:var(--hud-dim);margin-bottom:8px}.pause-log{columns:2;font:12px/1.9 var(--font-ui);color:#ffffff73;margin:0;padding:0;list-style:none}.pause-log li:before{content:"○ "}.pause-log li.done{color:var(--gold)}.pause-log li.done:before{content:"● "}.pause-credits{font:10px/1.5 var(--font-ui);color:#fff6}.social{pointer-events:none;z-index:12;font-family:var(--font-ui);position:fixed;inset:0}.chat-feed{flex-direction:column;gap:4px;width:min(420px,60vw);display:flex;position:absolute;bottom:96px;left:28px}.chat-line{color:#fff;text-shadow:0 0 4px #000,0 0 2px #000;font-size:13px;line-height:1.4;transition:opacity 1.5s}.chat-line b{margin-right:8px;font-weight:600}.chat-line.system{color:var(--hud-dim);font-style:italic}.chat-line.old{opacity:.35}.chat-input{pointer-events:auto;width:min(420px,60vw);font:14px var(--font-ui);color:#fff;background:var(--panel);border:1px solid var(--hud);outline:none;padding:8px 10px;position:absolute;bottom:64px;left:28px}.player-list{pointer-events:auto;background:var(--panel);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid #7fe7ff4d;width:min(760px,92vw);padding:12px 16px;position:absolute;top:120px;left:50%;transform:translate(-50%)}.pl-head{font:11px var(--font-hud);letter-spacing:.22em;color:var(--hud-dim);margin-bottom:8px}.pl-row{cursor:pointer;border-top:1px solid #ffffff0f;grid-template-columns:24px 14px 1fr 110px 130px 110px 80px;align-items:center;gap:8px;padding:6px 4px;font-size:13px;display:grid}.pl-row:hover{background:#7fe7ff14}.pl-row.self{cursor:default;color:var(--hud)}.pl-rank{color:var(--hud-dim);font-family:var(--font-hud)}.pl-dot{border-radius:50%;width:10px;height:10px}.pl-name{text-overflow:ellipsis;white-space:nowrap;font-weight:500;overflow:hidden}.pl-ship,.pl-where{color:#fff9;text-transform:capitalize}.pl-dist,.pl-score{text-align:right;font-variant-numeric:tabular-nums;font-family:var(--font-hud)}.net-status{font:11px var(--font-hud);letter-spacing:.2em;color:var(--hud-dim);position:absolute;top:18px;left:28px}.net-status.online{color:#6fe39a}.net-status.offline{color:var(--warn)}.hud-warp{flex-direction:column;align-self:flex-end;gap:4px;min-width:150px;margin-left:8px;display:flex}.hud-warp-bar{border:1px solid var(--hud-dim);height:4px}.hud-warp-fill{transform-origin:0;background:#9fd8ff;height:100%;transform:scaleX(0);box-shadow:0 0 10px #9fd8ff}.hud-warp-text{letter-spacing:.2em;color:var(--hud);font-size:13px}.hud-warp[data-state=on] .hud-warp-text{color:#fff;text-shadow:0 0 10px #9fd8ff}.hud-warp[data-state=spool] .hud-warp-text{color:var(--gold);animation:.5s infinite pulse}.hud-warp[data-state=locked] .hud-warp-text{color:var(--warn)}.hud.cockpit .hud-flight,.hud.cockpit .hud-shield,.hud.cockpit .reticle-ring{display:none}