:root{--mint:#6fffe3;--lime:#caff72;--ink:#eaffff;--panel:#06111e;--danger:#ff416c}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#02040a;color:var(--ink);font-family:Segoe UI,system-ui,sans-serif}button,a{font:inherit}#game{position:fixed;inset:0;width:100%;height:100%;touch-action:none;outline:0}.scanlines{position:fixed;inset:0;pointer-events:none;z-index:2;opacity:.1;background:repeating-linear-gradient(0deg,transparent 0 3px,#8dfff51a 4px)}
.hud{position:fixed;z-index:4;inset:0;pointer-events:none;padding:18px;display:flex;flex-direction:column;justify-content:space-between;text-shadow:0 2px 5px #000}.top{display:flex;justify-content:space-between;align-items:flex-start}.brand b{font-size:clamp(17px,3vw,28px);letter-spacing:.16em}.brand b span{color:var(--mint)}.brand small,.objective small{display:block;color:#83aab2;letter-spacing:.12em;margin-top:3px}.objective{text-align:right}.bar{width:min(240px,42vw);height:9px;margin-top:7px;border:1px solid var(--mint);background:#06131a}.bar i{display:block;width:100%;height:100%;background:linear-gradient(90deg,var(--mint),var(--lime));box-shadow:0 0 16px var(--mint);transition:.25s width}.bottom{display:flex;align-items:flex-end;justify-content:space-between}.stat{background:linear-gradient(120deg,rgba(4,12,25,.94),rgba(11,29,47,.7));border:1px solid #71ffe059;padding:11px 15px;clip-path:polygon(0 0,92% 0,100% 25%,100% 100%,8% 100%,0 75%)}.stat b{font-size:26px;color:var(--lime)}
.cross{position:fixed;z-index:5;left:50%;top:50%;width:30px;height:30px;transform:translate(-50%,-50%);transition:.18s}.cross:before,.cross:after,.cross i:before,.cross i:after{content:"";position:absolute;background:#aaffea;box-shadow:0 0 7px #56ffd0}.cross:before,.cross:after{width:9px;height:2px;top:14px}.cross:before{left:0}.cross:after{right:0}.cross i:before,.cross i:after{width:2px;height:9px;left:14px}.cross i:before{top:0}.cross i:after{bottom:0}.aiming .cross{width:19px;height:19px}.aiming .cross:before,.aiming .cross:after,.aiming .cross i:before,.aiming .cross i:after{background:var(--lime);box-shadow:0 0 10px var(--lime)}.aiming .cross:before,.aiming .cross:after{top:9px;width:6px}.aiming .cross i:before,.aiming .cross i:after{left:9px;height:6px}
.hit-marker{position:fixed;z-index:6;left:50%;top:50%;transform:translate(-50%,-50%) scale(.4) rotate(45deg);font-size:38px;color:#fff;opacity:0;text-shadow:0 0 12px #ff315f}.hit-marker.show{animation:hit .22s ease}.damage{position:fixed;z-index:3;inset:0;pointer-events:none;opacity:0;background:radial-gradient(circle,transparent 35%,#e5143a99 100%)}.damage.show{animation:damage .38s ease}.message{position:fixed;z-index:6;left:50%;top:21%;transform:translateX(-50%);font-size:clamp(15px,2.4vw,25px);font-weight:900;letter-spacing:.13em;color:var(--lime);text-align:center;opacity:0;transition:.25s}.message.show{opacity:1}.muzzle{position:fixed;z-index:5;left:50%;bottom:11%;width:16px;height:16px;pointer-events:none;border-radius:50%;opacity:0;background:#fff;box-shadow:0 0 25px 14px #72ffe4,0 0 70px 30px #7b36ff}.muzzle.show{animation:muzzle .13s ease}
.weapon{position:fixed;z-index:4;left:50%;bottom:-4vh;width:min(330px,42vw);height:min(270px,35vh);transform:translateX(-50%);pointer-events:none;filter:drop-shadow(0 18px 12px #000b);transition:.18s transform}.aiming .weapon{transform:translateX(-50%) translateY(5vh) scale(.82)}.weapon-body{position:absolute;left:12%;right:12%;bottom:0;height:75%;background:linear-gradient(90deg,#0b1020,#27304b 25%,#11182b 50%,#27304b 75%,#090e1c);clip-path:polygon(28% 0,72% 0,100% 100%,0 100%);border-top:5px solid #6c3ec2}.weapon-body:before,.weapon-body:after{content:"";position:absolute;top:17%;width:19%;height:62%;background:linear-gradient(#702bd0,#35116e)}.weapon-body:before{left:17%;transform:skewX(-8deg)}.weapon-body:after{right:17%;transform:skewX(8deg)}.weapon-body i{position:absolute;left:42%;top:8%;width:16%;height:67%;background:#521d9d}.weapon-body span{position:absolute;left:34%;top:30%;width:32%;height:5%;background:var(--mint);box-shadow:0 0 15px var(--mint)}.weapon-core{position:absolute;left:42%;top:0;width:16%;aspect-ratio:1;border-radius:50%;background:#8affea;box-shadow:0 0 18px 7px #6effdd,0 0 45px #7132ff}
.menu{position:fixed;z-index:10;inset:0;display:grid;place-items:center;background:radial-gradient(circle at 50% 30%,#36196994,#000000f0)}.menu.hidden{display:none}.card{width:min(600px,calc(100% - 30px));padding:clamp(22px,5vw,48px);border:1px solid #71ffe073;background:#040a18ed;box-shadow:0 0 80px #5dffdc2b;text-align:center;clip-path:polygon(0 0,93% 0,100% 10%,100% 100%,7% 100%,0 90%)}.kicker{color:#78ffe1;letter-spacing:.25em;font-size:11px}.card h1{font-size:clamp(38px,8vw,75px);line-height:.86;margin:13px 0}.card h1 span{color:transparent;-webkit-text-stroke:1px var(--lime)}.card p{color:#9ab6c1;line-height:1.55}.card button{border:0;background:linear-gradient(90deg,#65ffe0,var(--lime));padding:14px 25px;font-weight:900;letter-spacing:.12em;cursor:pointer;clip-path:polygon(0 0,92% 0,100% 25%,100% 100%,8% 100%,0 75%)}.back{display:block;color:#79ffe0;margin-top:20px;text-decoration:none;font-size:13px}
.touch{display:none;position:fixed;z-index:7;inset:0;pointer-events:none}.touch button,.stick{pointer-events:auto;position:absolute;border:1px solid #78ffe180;background:#071426b3;color:var(--lime)}.stick{left:22px;bottom:28px;width:128px;height:128px;border-radius:50%}.stick i{position:absolute;left:39px;top:39px;width:48px;height:48px;border-radius:50%;background:#8fffe288;box-shadow:0 0 20px #72ffe266}.touch button{width:58px;height:58px;border-radius:50%;font-weight:800}.touch .fire{right:22px;bottom:30px;width:88px;height:88px;color:#fff;background:#ff48774d;border-color:#ff688f}.touch .aim{right:123px;bottom:46px}.touch .turnL{right:112px;bottom:146px}.touch .turnR{right:28px;bottom:146px}
@keyframes hit{50%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(45deg)}}@keyframes damage{35%{opacity:1}}@keyframes muzzle{45%{opacity:1;transform:scale(2)}}
@media(pointer:coarse),(max-width:760px){.touch{display:block}.hud{padding:10px}.brand small{display:none}.objective small{font-size:8px}.stat{padding:7px 10px}.stat b{font-size:19px}.weapon{width:min(290px,55vw)}.card p{font-size:14px}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;transition:none!important}}
