:root{--fg: #f2ead6;--muted: #a89c82;--border: #17150f;--surface: #14130f;--accent: #ffb02e;--accent-2: #ff6a2b;--success: #8ce06a;--warning: #ffc93c;--error: #ff3b2f;--ink: #0f0e0a;--paper: #1b1913;--line-w: 3px;--hud-font: "Bahnschrift", "DIN Alternate", "Franklin Gothic Medium", "Arial Narrow", system-ui, sans-serif;--mono-font: "Cascadia Mono", "JetBrains Mono", Consolas, monospace}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html,body{width:100%;height:100%;overflow:hidden;background:var(--ink);color:var(--fg);font-family:var(--hud-font);user-select:none;-webkit-user-select:none;touch-action:none;overscroll-behavior:none}.mono{font-family:var(--mono-font);letter-spacing:.04em}#app{position:fixed;inset:0}#game{position:absolute;inset:0;width:100%;height:100%;display:block}#hud{position:absolute;inset:0;pointer-events:none;z-index:5}.panel{position:absolute;background:color-mix(in srgb,var(--paper) 92%,transparent);border:var(--line-w) solid var(--ink);outline:1.5px solid color-mix(in srgb,var(--fg) 34%,transparent);box-shadow:6px 6px #0000009e;padding:16px 14px 12px;clip-path:polygon(0 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%)}.panel-tab{position:absolute;top:-13px;left:10px;padding:2px 9px 3px;background:var(--accent);color:var(--ink);border:2px solid var(--ink);font-size:10px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;transform:skew(-8deg)}.panel-tab>*,.panel-tab{transform-origin:left}.panel.hull{top:16px;left:16px;width:296px}.panel.hull.danger{animation:hull-shake .32s steps(2) infinite}.panel.hull.danger .panel-tab{background:var(--error);color:var(--ink)}@keyframes hull-shake{0%{transform:translate(0)}50%{transform:translate(-2px,1px)}to{transform:translate(2px,-1px)}}.gauge{display:grid;grid-template-columns:34px 1fr 54px;align-items:center;gap:8px;margin-bottom:7px}.gauge-label{font-size:10px;font-weight:800;letter-spacing:.12em;color:var(--muted)}.gauge-value{font-size:11px;text-align:right;color:var(--fg);font-weight:700}.bar{position:relative;height:13px;border:2px solid var(--ink);background:repeating-linear-gradient(90deg,#000 0 6px,#0b0a07 6px 12px);overflow:hidden}.bar>div{height:100%;width:100%;transform-origin:left center;transition:transform .09s linear;background-image:repeating-linear-gradient(90deg,rgba(0,0,0,.28) 0 2px,transparent 2px 9px)}.bar.ap>div{background-color:var(--success)}.bar.heat>div{background-color:var(--warning)}.bar.heat.warm>div{background-color:var(--accent-2)}.bar.heat.over>div{background-color:var(--error)}.bar.heat.over{animation:hull-shake .18s steps(2) infinite}.bar.boost>div{background-color:#6fd0ff}.hull-foot{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);letter-spacing:.08em;margin-top:4px;padding-top:6px;border-top:1.5px dashed color-mix(in srgb,var(--fg) 26%,transparent)}.panel.opord{top:16px;left:50%;transform:translate(-50%);width:min(380px,46vw)}.panel.opord ul{list-style:none;display:grid;gap:3px}.panel.opord li{display:flex;gap:8px;align-items:baseline;font-size:12px;letter-spacing:.05em;color:var(--fg)}.panel.opord li .tick{width:13px;height:13px;flex:none;border:2px solid var(--muted);transform:rotate(45deg) scale(.72)}.panel.opord li.done{color:var(--muted);text-decoration:line-through}.panel.opord li.done .tick{background:var(--success);border-color:var(--ink)}.panel.opord li.fail .tick{background:var(--error);border-color:var(--ink)}.panel.opord li.active .tick{border-color:var(--accent);animation:tick-pulse 1s ease-in-out infinite}@keyframes tick-pulse{50%{background:var(--accent)}}.panel.radar-panel{top:16px;right:16px;width:208px;padding-bottom:10px}#radar{width:176px;height:176px;display:block;margin:0 auto;border:2px solid var(--ink);background:#0b120d}.radar-foot{display:flex;justify-content:space-between;font-size:9px;color:var(--muted);margin-top:6px;letter-spacing:.08em}.panel.armament{bottom:16px;right:16px;width:268px}#weapon-slots{display:grid;gap:5px}.wslot{display:grid;grid-template-columns:20px 1fr auto;gap:8px;align-items:center;padding:4px 7px;border:2px solid color-mix(in srgb,var(--fg) 20%,transparent);background:#00000052}.wslot .key{font-size:10px;font-weight:900;color:var(--muted);font-family:var(--mono-font)}.wslot .wname{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.wslot .wammo{font-size:10px;font-family:var(--mono-font);color:var(--muted)}.wslot .wname .wsub{display:block;font-size:8.5px;font-weight:600;color:var(--muted);letter-spacing:.1em}.wslot.selected{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 16%,rgba(0,0,0,.4))}.wslot.selected .wname,.wslot.selected .key{color:var(--accent)}.wslot.empty{opacity:.45}.wslot.reloading .wammo{color:var(--warning)}.wslot.ready .wammo{color:var(--success)}.wslot.disabled .wname{color:var(--muted);text-decoration:line-through}.wslot.hot{border-color:var(--error)}.wslot .heatpip{display:block;height:3px;margin-top:3px;background:#ffffff1f}.wslot .heatpip>i{display:block;height:100%;background:var(--accent-2);width:0}.crosshair{position:absolute;left:50%;top:42%;width:64px;height:64px;transform:translate(-50%,-50%);transition:opacity .15s}.crosshair.hidden{opacity:0}.ch-line{position:absolute;background:var(--accent);box-shadow:0 0 0 1.5px var(--ink)}.ch-l{left:0;top:50%;width:18px;height:3px}.ch-r{right:0;top:50%;width:18px;height:3px}.ch-t{top:0;left:50%;width:3px;height:18px}.ch-b{bottom:0;left:50%;width:3px;height:18px}.ch-dot{position:absolute;left:50%;top:50%;width:5px;height:5px;margin:-2.5px;background:var(--fg);box-shadow:0 0 0 1.5px var(--ink)}.ch-ring{position:absolute;inset:20px;border:2px dashed color-mix(in srgb,var(--accent) 70%,transparent);border-radius:50%;transition:transform .1s linear}.crosshair.hot .ch-line{background:var(--error)}.crosshair.over .ch-ring{border-color:var(--error);border-style:solid}.lock-frame{position:absolute;width:0;height:0;pointer-events:none;transition:opacity .1s}.lock-frame.hidden{display:none}.lock-frame>.lock-corner{position:absolute;width:22px;height:22px;border:3px solid var(--error);filter:drop-shadow(1.5px 1.5px 0 var(--ink))}.lock-corner.tl{left:0;top:0;border-right:none;border-bottom:none}.lock-corner.tr{right:0;top:0;border-left:none;border-bottom:none}.lock-corner.bl{left:0;bottom:0;border-right:none;border-top:none}.lock-corner.br{right:0;bottom:0;border-left:none;border-top:none}.lock-readout{position:absolute;left:50%;top:-20px;transform:translate(-50%);display:flex;gap:10px;white-space:nowrap;font-size:10px;color:var(--error);font-weight:700;letter-spacing:.1em;text-shadow:1.5px 1.5px 0 var(--ink)}.hitmark{position:absolute;left:50%;top:42%;width:30px;height:30px;transform:translate(-50%,-50%) rotate(45deg);opacity:0;pointer-events:none;border:3px solid var(--fg)}.hitmark.show{animation:hit-pop .2s ease-out}.hitmark.kill{border-color:var(--error)}@keyframes hit-pop{0%{opacity:1;transform:translate(-50%,-50%) rotate(45deg) scale(1.5)}to{opacity:0;transform:translate(-50%,-50%) rotate(45deg) scale(.85)}}#alert-flash{position:absolute;inset:0;box-shadow:inset 0 0 90px 22px #ff3b2f00;transition:box-shadow .16s ease-out}#alert-flash.hit{box-shadow:inset 0 0 90px 22px #ff3b2f80}.toast{position:absolute;left:50%;top:24%;transform:translate(-50%) rotate(-1.5deg);padding:6px 18px;background:var(--accent);color:var(--ink);border:3px solid var(--ink);box-shadow:5px 5px #0009;font-weight:900;letter-spacing:.16em;font-size:14px;text-transform:uppercase}.toast.hidden{display:none}.toast.bad{background:var(--error);color:var(--fg)}.indirect{position:absolute;left:50%;top:33%;transform:translate(-50%);font-size:11px;font-weight:800;letter-spacing:.18em;color:var(--warning);text-shadow:1.5px 1.5px 0 var(--ink)}.indirect.hidden{display:none}body:not(.touch-ui) #controls .stick-zone,body:not(.touch-ui) #controls .vbtn{display:none}body:not(.touch-ui) .weapon-bar{bottom:18px;left:16px;transform:none}#controls{position:absolute;inset:0;z-index:10;pointer-events:none}#controls>*{pointer-events:auto}.stick-zone{position:absolute;bottom:0;width:42%;max-width:320px;height:42%}.stick-zone.left{left:0}.stick-zone.right{right:0}.stick-base{position:absolute;left:50%;bottom:26px;transform:translate(-50%);width:126px;height:126px;border-radius:50%;border:3px solid color-mix(in srgb,var(--fg) 40%,transparent);background:radial-gradient(circle,color-mix(in srgb,var(--fg) 10%,transparent),transparent 70%);box-shadow:inset 0 0 0 1.5px var(--ink);transition:opacity .15s,border-color .15s;opacity:.5}.stick-zone.active .stick-base{opacity:.95;border-color:var(--accent)}.stick-zone.left .stick-base{left:26%}.stick-zone.right .stick-base{left:74%}.stick-nub{position:absolute;left:50%;top:50%;width:50px;height:50px;border-radius:50%;transform:translate(-50%,-50%);background:color-mix(in srgb,var(--fg) 82%,transparent);border:3px solid var(--ink);box-shadow:0 3px #00000073}.stick-zone.active .stick-nub{background:var(--accent)}.vbtn{position:absolute;border-radius:50%;border:3px solid var(--ink);background:color-mix(in srgb,var(--paper) 82%,transparent);color:var(--fg);font-family:var(--hud-font);font-weight:900;font-size:12px;letter-spacing:.09em;display:flex;align-items:center;justify-content:center;box-shadow:0 4px #0000008c;transition:transform .06s,background .06s}.vbtn span{pointer-events:none}.vbtn:active,.vbtn.down{transform:translateY(3px);background:color-mix(in srgb,var(--accent) 62%,var(--paper));color:var(--ink)}.vbtn.fire{width:98px;height:98px;right:26px;bottom:196px;font-size:15px;color:var(--paper);background:var(--error);border-color:var(--ink)}.vbtn.fire:active,.vbtn.fire.down{background:#ff6f5e}.vbtn.small{width:58px;height:58px;font-size:9.5px}.vbtn.boost{right:136px;bottom:214px;color:#6fd0ff}.vbtn.lockon{right:30px;bottom:308px;color:var(--success)}.vbtn.reload{right:136px;bottom:140px;color:var(--warning)}.weapon-bar{position:absolute;left:50%;bottom:154px;transform:translate(-50%);z-index:2;display:flex;gap:7px;pointer-events:auto}.wchip{min-width:52px;height:44px;padding:3px 8px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:3px solid var(--ink);background:color-mix(in srgb,var(--paper) 84%,transparent);box-shadow:0 3px #00000080;cursor:pointer}.wchip b{font-size:12px;font-weight:900;letter-spacing:.06em}.wchip span{font-size:8px;color:var(--muted);font-family:var(--mono-font)}.wchip.on{background:var(--accent)}.wchip.on b,.wchip.on span{color:var(--ink)}.wchip.empty{opacity:.4}.wchip.cooling{background:color-mix(in srgb,var(--error) 40%,var(--paper))}.overlay{position:absolute;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 40%,rgba(255,176,46,.09),transparent 62%),repeating-linear-gradient(135deg,#0000008c 0 3px,#0000006b 3px 6px),#0c0b08e8;backdrop-filter:blur(2px)}.overlay.hidden{display:none}.overlay-card{position:relative;width:min(520px,92vw);border:4px solid var(--ink);outline:2px solid color-mix(in srgb,var(--fg) 26%,transparent);outline-offset:-10px;background:linear-gradient(180deg,rgba(255,255,255,.045),transparent 40%),var(--paper);padding:30px 30px 22px;box-shadow:12px 12px #0000008c;text-align:left;animation:card-in .26s cubic-bezier(.2,1.4,.4,1)}@keyframes card-in{0%{transform:rotate(-1.4deg) scale(.94);opacity:0}}.overlay-card .stamp{display:inline-block;padding:2px 8px;margin-bottom:10px;border:2px solid var(--error);color:var(--error);font-size:9px;font-weight:800;letter-spacing:.22em;transform:rotate(-2deg)}.overlay-card h1{font-size:44px;line-height:.92;letter-spacing:.06em;font-weight:900;color:var(--accent);text-shadow:4px 4px 0 var(--ink);margin-bottom:8px}.overlay-card .sub{color:var(--muted);font-size:11px;letter-spacing:.18em;text-transform:uppercase;margin-bottom:18px;border-bottom:3px solid var(--ink);padding-bottom:10px}.brief{font-size:13.5px;line-height:1.75;margin-bottom:18px}.brief b{color:var(--accent);letter-spacing:.04em}.brief .mono{color:var(--muted);font-size:11px}.brief .warn{color:var(--warning);margin-top:6px}.stats{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:4px 16px;margin-bottom:18px;font-size:11px;color:var(--muted)}.stats b{color:var(--fg);float:right}#btn-start,#btn-again{font-family:var(--hud-font);font-size:19px;font-weight:900;letter-spacing:.2em;padding:13px 46px;background:var(--accent);color:var(--ink);border:4px solid var(--ink);box-shadow:0 6px 0 var(--ink);cursor:pointer;clip-path:polygon(0 0,100% 0,calc(100% - 12px) 100%,0 100%)}#btn-start:active,#btn-again:active{transform:translateY(4px);box-shadow:0 2px 0 var(--ink)}.bootlog{margin-top:16px;font-size:10px;color:var(--muted);min-height:12px;white-space:pre-line;line-height:1.5}@media(max-width:900px){.panel.hull{width:236px;padding:13px 10px 9px}.panel.radar-panel{width:152px}#radar{width:124px;height:124px}.panel.armament{width:208px}.panel.opord{width:176px;top:116px}.panel.opord li{font-size:10.5px}.overlay-card h1{font-size:34px}.vbtn.fire{width:86px;height:86px;bottom:176px}.vbtn.boost{right:118px;bottom:196px}.vbtn.reload{right:118px;bottom:124px}.vbtn.lockon{bottom:278px}.weapon-bar{bottom:134px}}@media(max-width:640px){.panel{clip-path:none}.panel.hull{top:10px;left:10px;width:190px}.panel.radar-panel{top:10px;right:10px;width:118px;padding:12px 8px 7px}#radar{width:96px;height:96px}.radar-foot,.panel.armament{display:none}.panel.opord{top:auto;bottom:260px;left:10px;transform:none;width:172px}.hull-foot{display:none}.weapon-bar{gap:4px;bottom:122px}.wchip{min-width:42px;height:38px}}
