:root { --bg:#07091c; --panel:#0d1129; --line:#252b54; --cyan:#62f4ff; --pink:#ff4ca8; --purple:#a889ff; --text:#edf2ff; --muted:#7780a7; }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; color:var(--text); background:var(--bg); font-family:'Space Grotesk',sans-serif; background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px); background-size:48px 48px; }
body:before { content:''; position:fixed; inset:0; pointer-events:none; background:radial-gradient(circle at 75% 15%,rgba(101,73,207,.14),transparent 28%),radial-gradient(circle at 15% 70%,rgba(0,230,255,.07),transparent 26%); }
.shell { width:min(1180px,calc(100% - 48px)); margin:auto; position:relative; }
.topbar { height:92px; display:flex; align-items:center; border-bottom:1px solid var(--line); gap:28px; }
.brand { display:flex; align-items:center; gap:12px; color:var(--text); font:800 16px Orbitron,sans-serif; letter-spacing:2px; text-decoration:none; }.brand-dim{color:var(--purple)}
.brand-mark { width:26px; height:26px; border:2px solid var(--cyan); border-radius:50%; display:grid; place-items:center; transform:rotate(-30deg); box-shadow:0 0 14px #00eaff66; }.brand-mark span{width:11px;height:11px;border-right:2px solid var(--cyan);border-bottom:2px solid var(--cyan);transform:translate(-2px,-2px)}
.status { margin-left:auto; color:#8d91b6; font:600 10px Orbitron,sans-serif; letter-spacing:1px; }.status-dot{display:inline-block;width:6px;height:6px;background:#36e3a0;border-radius:50%;box-shadow:0 0 8px #36e3a0;margin-right:7px}.top-actions{display:flex;align-items:center;gap:22px}.version{color:#596181;font:10px Orbitron,sans-serif}.icon-button{background:none;border:0;color:var(--cyan);font-size:24px;cursor:pointer;transform:rotate(-30deg)}
.hero { display:flex; justify-content:space-between; padding:74px 0 63px; }.eyebrow,.mini-label{color:var(--cyan);font:700 10px Orbitron,sans-serif;letter-spacing:2px}.eyebrow span{color:var(--pink);margin-right:8px}.hero h1{margin:16px 0 18px;font:800 clamp(56px,8vw,88px)/.86 Orbitron,sans-serif;letter-spacing:-5px}.hero h1 em{color:transparent;font-style:normal;-webkit-text-stroke:1px var(--purple);text-shadow:0 0 24px #8a6dff33}.lede{color:#858daf;font-size:15px;line-height:1.6}.hero-meta{align-self:end;width:215px;margin-bottom:4px}.mini-label{color:#777fa5;font-size:9px;letter-spacing:1px}.objective{display:flex;gap:12px;align-items:center;margin-top:15px;color:#e8ebff;font-size:13px;line-height:1.45}.objective b{color:var(--cyan);font:700 11px Orbitron,sans-serif}.target-icon{color:var(--pink);font-size:28px;text-shadow:0 0 12px #ff4ca8}.scan-line{height:1px;margin-top:21px;background:linear-gradient(90deg,var(--pink),transparent)}
.game-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:30px;align-items:start}.play-panel{border:1px solid var(--line);background:#090d24cc;box-shadow:0 25px 60px #0005}.panel-header{height:46px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);font:700 10px Orbitron,sans-serif;letter-spacing:1.5px}.panel-title{color:var(--cyan)}.live-dot{display:inline-block;width:7px;height:7px;background:var(--pink);border-radius:50%;box-shadow:0 0 10px var(--pink);margin-right:8px}.panel-coords{color:#596181;font-size:9px}.panel-coords span{color:var(--pink);padding:0 7px}.canvas-wrap{position:relative;max-width:680px;margin:26px auto 20px;padding:0 22px}.canvas-wrap:after{content:'';position:absolute;inset:0 22px;pointer-events:none;background:linear-gradient(transparent 50%,#62f4ff08 50%);background-size:100% 4px}.canvas-wrap canvas{display:block;width:100%;aspect-ratio:1.76;background:#080d25;border:1px solid #263269;box-shadow:0 0 0 5px #080d25,0 0 35px #273a9c55}.game-message{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;pointer-events:none;text-shadow:0 0 16px #000}.game-message strong{font:800 clamp(20px,4vw,32px) Orbitron,sans-serif;letter-spacing:3px;color:var(--cyan);margin:9px 0}.game-message small{color:#9aa2c7;font-size:11px}.message-kicker{font:700 9px Orbitron,sans-serif;color:var(--pink);letter-spacing:2px}.game-message.hidden{opacity:0}.controls-row{border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:17px 22px;color:#747d9f;font:10px Orbitron,sans-serif;letter-spacing:1px}.key{display:inline-grid;place-items:center;width:22px;height:22px;margin-right:4px;border:1px solid #3c4677;color:#b9c1e9;font:700 10px Orbitron,sans-serif}.key.wide{width:45px;margin-right:8px}.start-button{border:1px solid var(--pink);background:#ff4ca80d;color:#ff8cc7;padding:12px 20px;font:700 10px Orbitron,sans-serif;letter-spacing:1px;cursor:pointer;box-shadow:inset 0 0 14px #ff4ca814}.start-button span{display:inline-block;width:6px;height:6px;background:var(--pink);border-radius:50%;margin-right:8px;box-shadow:0 0 8px var(--pink)}.start-button:hover{background:#ff4ca825}.touch-controls{display:none;text-align:center;padding:4px 0 18px}.touch-controls button{width:45px;height:38px;margin:2px;border:1px solid #3c4677;background:#121838;color:var(--cyan);font-size:15px}
.sidebar{display:flex;flex-direction:column;gap:14px}.stat-card{border:1px solid var(--line);background:#0d1129;padding:19px 20px}.card-top{display:flex;justify-content:space-between;color:#8b94b8;font:700 9px Orbitron,sans-serif;letter-spacing:1px}.live-pill{color:var(--pink);font-size:8px}.score-value{margin:12px 0 11px;color:var(--cyan);font:700 29px Orbitron,sans-serif;letter-spacing:2px;text-shadow:0 0 14px #62f4ff77}.score-track,.shield-bar{height:3px;background:#20284d}.score-track span{display:block;width:0;height:100%;background:var(--cyan);transition:width .25s}.high-score{display:flex;justify-content:space-between;margin-top:12px;color:#646d91;font:9px Orbitron,sans-serif}.high-score strong{color:#afb8df}.shield-bar{margin:17px 0 13px}.shield-bar span{display:block;width:100%;height:100%;background:var(--purple);box-shadow:0 0 7px var(--purple);transition:width .3s}.shield-note{color:#6c7598;font-size:11px}.shield-icon{color:var(--purple);margin-right:7px}.lives{display:flex;gap:11px;margin-top:16px;color:var(--pink);font-size:18px;text-shadow:0 0 12px var(--pink)}.briefing{padding:10px 4px;color:#747c9e;font-size:12px;line-height:1.6}.briefing-heading{color:#a9b3dc;font:700 9px Orbitron,sans-serif;letter-spacing:1px}.briefing-heading span{color:var(--pink);margin-right:8px}.briefing p{margin:14px 0 0}.briefing-accent{color:var(--cyan)}
footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);margin-top:70px;padding:22px 0 26px;color:#555e80;font:9px Orbitron,sans-serif;letter-spacing:1px}footer b{color:#36e3a0;margin-left:7px}
@media(max-width:800px){.shell{width:min(100% - 28px,600px)}.topbar{height:72px}.status,.version{display:none}.hero{padding:48px 0 40px}.hero-meta{width:180px}.game-layout{grid-template-columns:1fr}.sidebar{display:grid;grid-template-columns:1fr 1fr}.briefing{grid-column:1/-1}.controls-row{gap:10px}.key-hint{font-size:0}.canvas-wrap{padding:0 12px}.canvas-wrap:after{inset:0 12px}}
@media(max-width:520px){.hero{display:block}.hero-meta{margin-top:35px}.game-layout{gap:18px}.panel-coords{display:none}.controls-row{justify-content:center}.controls-row .key-hint{display:none}.touch-controls{display:block}.sidebar{display:flex}.hero h1{font-size:64px}footer{font-size:7px}}
.canvas-wrap canvas{aspect-ratio:1.05}