:root{--hud:#d8ffe0;--hud-dim:#d8ffe08c;--accent:#9fd36a;--danger:#e5533d;--panel:#080e0a8c;--font:"Segoe UI", "Helvetica Neue", Arial, sans-serif;--mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace}*{box-sizing:border-box}html,body{height:100%;color:var(--hud);font-family:var(--font);background:#0b0f0c;margin:0;overflow:hidden}#app canvas{width:100vw;height:100vh;display:block}.hidden{display:none!important}.screen{z-index:20;background:radial-gradient(#050a0759,#050a07d9);justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#loading{background:#0b0f0c}.panel{text-align:center;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0a100cb8;border:1px solid #d8ffe026;max-width:560px;padding:32px 40px}.panel h1{letter-spacing:.18em;color:#f2f5e8;margin:0 0 6px;font-size:44px;font-weight:800}.panel h2{letter-spacing:.16em;margin:0 0 18px;font-size:30px}.tagline{color:var(--hud-dim);letter-spacing:.05em;margin:0 0 24px}.bar{background:#ffffff1a;height:6px;margin:24px 0 10px}#loading-fill{background:var(--accent);width:0;height:100%;transition:width .2s}#loading-text{color:var(--hud-dim);font-size:13px}button{width:100%;font:600 15px var(--font);letter-spacing:.14em;color:var(--hud);cursor:pointer;background:0 0;border:1px solid #d8ffe059;margin:8px 0;padding:12px;display:block}button:hover{background:#d8ffe014}button.primary{background:var(--accent);color:#0d150c;border-color:var(--accent);font-size:17px}button.primary:hover{filter:brightness(1.1)}.settings{color:var(--hud-dim);justify-content:center;gap:18px;margin:18px 0 8px;font-size:13px;display:flex}.settings label{flex-direction:column;gap:6px;display:flex}.controls{border-collapse:collapse;margin:14px auto 0;font-size:13px}.controls td{text-align:left;color:var(--hud-dim);padding:3px 10px}.controls td:first-child{color:var(--hud);font-family:var(--mono);text-align:right}.hint{color:var(--hud-dim);margin:14px 0 0;font-size:13px}#gameover-stats{font-family:var(--mono);margin-bottom:18px;line-height:1.8}#hud{pointer-events:none;z-index:10;font-family:var(--mono);text-shadow:0 1px 2px #000c;position:fixed;inset:0}#vignette{opacity:0;background:radial-gradient(#0000 55%,#aa140abf);position:absolute;inset:0}#damage-flash{opacity:0;background:radial-gradient(#ff3c1e0d 40%,#ff281473);position:absolute;inset:0}#zoom-mask{opacity:0;background:radial-gradient(circle,#0000 0 34vh,#000000eb 35vh);transition:opacity .12s;position:absolute;inset:0}#zoom-mask:before,#zoom-mask:after{content:"";background:#000000bf;position:absolute}#zoom-mask:before{width:1px;top:15vh;bottom:15vh;left:50%}#zoom-mask:after{height:1px;top:50%;left:calc(50% - 34vh);right:calc(50% - 34vh)}#zoom-mask.visible{opacity:1}#crosshair{--gap:6px;width:0;height:0;transition:opacity .1s;position:absolute;top:50%;left:50%}#crosshair.dim{opacity:.35}#crosshair i{background:var(--hud);display:block;position:absolute;box-shadow:0 0 2px #000000e6}.xh-mg .t,.xh-mg .b{width:2px;height:10px;left:-1px}.xh-mg .t{bottom:var(--gap)}.xh-mg .b{top:var(--gap)}.xh-mg .l,.xh-mg .r{width:10px;height:2px;top:-1px}.xh-mg .l{right:var(--gap)}.xh-mg .r{left:var(--gap)}#crosshair .dot{border-radius:50%;width:3px;height:3px;top:-1.5px;left:-1.5px}.xh-cannon .chev{border-left:2px solid var(--hud);border-top:2px solid var(--hud);width:18px;height:18px;top:-3px;left:-9px;transform:rotate(45deg);box-shadow:none!important;background:0 0!important}.xh-cannon .rm{width:14px;height:1.5px;left:-7px}.xh-cannon .rm span{color:var(--hud-dim);white-space:nowrap;font-size:10px;position:absolute;top:-7px;left:20px}.xh-missile .ring{border:1.5px dashed var(--hud-dim);border-radius:50%;transform:translate(-50%,-50%);box-shadow:none!important;background:0 0!important}#lock-box{border:2px dashed #ffd24d;transition:width 80ms,height 80ms;display:none;position:absolute;top:0;left:0}#lock-box.locked{border:2px solid #ff3b30;box-shadow:0 0 8px #ff3b30b3}#lock-box.locked:after{content:"LOCK";color:#ff3b30;font-size:11px;font-weight:700;position:absolute;top:-18px;left:50%;transform:translate(-50%)}#hitmarker{opacity:0;width:22px;height:22px;margin:-11px 0 0 -11px;position:absolute;top:50%;left:50%}#hitmarker.visible{opacity:1}#hitmarker:before,#hitmarker:after{content:"";background:#fff;width:2px;height:26px;position:absolute;top:-2px;left:10px}#hitmarker:before{transform:rotate(45deg)}#hitmarker:after{transform:rotate(-45deg)}#hitmarker.kill:before,#hitmarker.kill:after{background:var(--danger);height:30px;top:-4px}#kill-feed{flex-direction:column;gap:2px;display:flex;position:absolute;top:calc(50% + 30px);left:calc(50% + 40px)}#kill-feed .kill{color:#ffe08a;font-size:13px;animation:1.6s ease-out forwards rise}@keyframes rise{0%{opacity:0;transform:translateY(6px)}12%{opacity:1;transform:none}75%{opacity:1}to{opacity:0;transform:translateY(-10px)}}#message{text-align:center;opacity:0;transition:opacity .4s;position:absolute;top:22%;left:0;right:0}#message.visible{opacity:1}#message-title{font:800 40px var(--font);letter-spacing:.22em;color:#f4f1e2}#message-sub{color:var(--hud-dim);letter-spacing:.06em;margin-top:8px;font-size:15px}#hint{text-align:center;color:#ffd27a;opacity:0;font-size:13px;transition:opacity .25s;position:absolute;top:calc(50% + 70px);left:0;right:0}#hint.visible{opacity:1}#top-left{background:var(--panel);gap:22px;padding:8px 14px;display:flex;position:absolute;top:18px;left:20px}.stat{flex-direction:column;display:flex}.stat .k{letter-spacing:.18em;color:var(--hud-dim);font-size:10px}.stat span:last-child{font-size:20px;font-weight:700}#compass{background:var(--panel);width:400px;height:26px;margin-left:-200px;position:absolute;top:14px;left:50%;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#0000,#000 18% 82%,#0000);mask-image:linear-gradient(90deg,#0000,#000 18% 82%,#0000)}#compass-strip{height:100%;position:absolute;top:0;left:0}#compass-strip span{color:var(--hud-dim);font-size:12px;position:absolute;top:5px;transform:translate(-50%)}#compass-needle{background:var(--hud);width:2px;height:7px;position:absolute;top:0;left:199px}#radar{width:180px;height:180px;position:absolute;top:18px;right:18px}#bottom-left{background:var(--panel);width:260px;padding:10px 14px;position:absolute;bottom:20px;left:20px}#bottom-left .label{letter-spacing:.18em;color:var(--hud-dim);font-size:10px}.meter{background:#ffffff14;height:10px;margin:6px 0}#armor-fill{background:var(--accent);width:100%;height:100%;transition:width .15s}#armor-text{font-size:22px;font-weight:700}#airstrikes{color:#ffd27a;min-height:14px;margin-top:4px;font-size:12px}#weapons{flex-direction:column;gap:4px;display:flex;position:absolute;bottom:20px;right:20px}.weapon{background:var(--panel);opacity:.55;border-left:3px solid #0000;grid-template-rows:auto 3px;grid-template-columns:18px 210px 54px;column-gap:8px;padding:6px 12px;display:grid}.weapon.active{opacity:1;border-left-color:var(--accent)}.weapon.empty .ammo{color:var(--danger)}.weapon .key{color:var(--hud-dim)}.weapon .name{letter-spacing:.06em;align-self:center;font-size:12px}.weapon .ammo{text-align:right;font-size:16px;font-weight:700}.wbar{background:#ffffff14;grid-column:1/-1;height:3px;margin-top:4px}.wbar>div{background:var(--hud-dim);height:100%}.wbar>div.warn{background:var(--danger)}#dmg-indicators{position:absolute;top:50%;left:50%}#dmg-indicators .dmg{filter:drop-shadow(0 0 4px #ff2814cc);border-top:5px solid #ff321ed9;border-radius:50% 50% 0 0;width:90px;height:16px;position:absolute;top:0;left:0}@media (max-width:760px){#compass{display:none}.weapon{grid-template-columns:18px 120px 44px}.weapon .name{font-size:10px}#radar{width:120px;height:120px}}