@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root { --ink:#dff4e9; --muted:#77908b; --panel:#0b1d2b; --line:rgba(166,217,190,.16); --lime:#bbff5f; --red:#ff7262; --amber:#f7c968; }
* { box-sizing:border-box; }
.game-panel .controls { height:auto; min-height:42px; flex-wrap:wrap; padding-top:8px; padding-bottom:8px; }
.controls .skip-button:disabled { opacity:.4; cursor:not-allowed; background:transparent; }
body { margin:0; min-width:320px; background:#071321; color:var(--ink); font-family:"Space Grotesk",sans-serif; }
body:before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.18; background-image:linear-gradient(rgba(174,255,210,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(174,255,210,.04) 1px,transparent 1px); background-size:40px 40px; }
.page-shell { width:min(1440px,calc(100% - 48px)); margin:auto; padding:30px 0 18px; }
.masthead { display:flex; justify-content:space-between; align-items:center; margin-bottom:22px; }
.brand-lockup { display:flex; align-items:center; gap:11px; }.brand-mark { width:38px; height:38px; display:grid; place-items:center; border:1px solid var(--lime); color:var(--lime); font-size:30px; transform:rotate(-25deg); }.eyebrow,.panel-label,footer,.hud span,.controls,.intel-status { font:500 10px "DM Mono",monospace; letter-spacing:.12em; }
.eyebrow { color:var(--lime); margin:0 0 3px; }.masthead h1 { font-size:28px; margin:0; letter-spacing:-.06em; }.masthead h1 em { font-style:normal; color:var(--lime); }.mission { margin:0; color:var(--muted); font-size:14px; }
.game-layout { display:grid; grid-template-columns:244px minmax(450px,1fr) 245px; gap:14px; }.panel { border:1px solid var(--line); background:linear-gradient(145deg,rgba(17,43,55,.94),rgba(7,22,34,.96)); }
.briefing,.intel { padding:22px 20px; }.panel-label { margin:0 0 16px; color:#91aba2; }.briefing h2 { margin:0; font-size:24px; letter-spacing:-.055em; line-height:1.02; }.briefing h2 span { color:var(--lime); }.brief-copy { color:#9eb2ad; font-size:13px; line-height:1.55; margin:17px 0 22px; }.score-rules { border-top:1px solid var(--line); }.score-rules div { display:flex; gap:10px; align-items:center; padding:11px 0; border-bottom:1px solid var(--line); font-size:12px; }.score-rules b { font:500 18px "DM Mono",monospace; }.score-rules strong { margin-left:auto; color:#dff4e9; font:500 13px "DM Mono",monospace; }.rule-plus { color:var(--lime); }.rule-minus { color:var(--red); }.rule-zero { color:var(--amber); }.source-note { display:flex; gap:7px; align-items:flex-start; margin-top:22px; color:#718681; font:10px/1.35 "DM Mono",monospace; }.data-light { flex:0 0 7px; height:7px; margin-top:3px; background:var(--amber); border-radius:50%; box-shadow:0 0 8px var(--amber); }.data-light.ready { background:var(--lime); box-shadow:0 0 8px var(--lime); }
.game-panel { overflow:hidden; }.hud { height:70px; display:flex; justify-content:space-between; align-items:center; padding:0 20px; border-bottom:1px solid var(--line); }.hud-item { display:flex; flex-direction:column; gap:1px; }.hud-item span,.hud-center { color:#829d96; }.hud-item strong { color:var(--lime); font:500 28px "DM Mono",monospace; line-height:1; }.align-right { text-align:right; }.hud-center { display:flex; flex-direction:column; gap:7px; align-items:center; font:10px "DM Mono",monospace; }.round-label b { color:var(--ink); }.hud-center #feedback { color:var(--amber); font-size:9px; letter-spacing:.08em; }
.playfield { position:relative; height:548px; overflow:hidden; isolation:isolate; background:radial-gradient(ellipse at 50% 0%,#173c48 0%,#0a2231 43%,#071723 100%); cursor:crosshair; }.scanlines { position:absolute; inset:0; z-index:-1; opacity:.16; background:repeating-linear-gradient(0deg,transparent 0,transparent 3px,#b7ffd0 4px); }.stars { position:absolute; inset:0; z-index:-1; opacity:.4; background-image:radial-gradient(#c4ffe2 1px,transparent 1.5px),radial-gradient(#c4ffe2 .6px,transparent 1px); background-position:13px 21px,56px 45px; background-size:83px 91px,47px 61px; }.danger-line { position:absolute; bottom:70px; left:0; right:0; border-top:1px dashed rgba(255,114,98,.55); text-align:right; padding-right:10px; color:var(--red); font:8px "DM Mono",monospace; }.danger-line span { position:relative; top:-12px; background:#0b2631; padding:0 4px; }.ship { position:absolute; width:38px; height:28px; bottom:27px; left:calc(50% - 19px); clip-path:polygon(50% 0,100% 100%,60% 80%,50% 100%,40% 80%,0 100%); background:var(--lime); filter:drop-shadow(0 0 8px rgba(187,255,95,.8)); transition:left .05s linear; }.ship span { position:absolute; left:17px; top:13px; width:5px; height:17px; background:#f3ffe5; }.start-overlay { position:absolute; inset:0; z-index:5; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; background:rgba(5,18,28,.79); backdrop-filter:blur(3px); }.overlay-kicker { color:var(--lime); font:10px "DM Mono",monospace; letter-spacing:.14em; }.start-overlay h2 { margin:11px 0 24px; font-size:31px; line-height:1; letter-spacing:-.06em; }.start-overlay button { border:1px solid var(--lime); padding:13px 18px; background:var(--lime); color:#0a1d25; font:600 12px "DM Mono",monospace; letter-spacing:.06em; cursor:pointer; }.start-overlay small { margin-top:15px; color:#819b93; font:10px "DM Mono",monospace; }
.alien { position:absolute; width:116px; min-height:137px; display:flex; flex-direction:column; align-items:center; padding:7px; border:1px solid rgba(187,255,95,.7); background:rgba(8,32,38,.89); color:#e7fff1; box-shadow:0 0 13px rgba(187,255,95,.14); transition:transform .15s ease,opacity .22s ease; animation:descend var(--travel,4s) linear forwards; }.alien.native { border-color:rgba(102,183,255,.75); box-shadow:0 0 13px rgba(102,183,255,.14); }.alien.other { border-color:rgba(247,201,104,.75); box-shadow:0 0 13px rgba(247,201,104,.14); }.alien:hover { transform:scale(1.06); }.alien.hit { pointer-events:none; animation-play-state:paused; }.alien.shot { pointer-events:none; opacity:0; transform:scale(1.55); }.alien img,.alien .alien-placeholder { width:73px; height:73px; object-fit:cover; border-radius:50%; border:1px solid rgba(222,255,235,.35); background:#143440; }.alien .alien-placeholder { display:grid; place-items:center; color:var(--amber); font-size:27px; }.alien-tag { max-width:100%; margin-top:6px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:9px "DM Mono",monospace; }.alien-sci { max-width:100%; margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#91a7a0; font-size:9px; font-style:italic; }.laser { position:absolute; z-index:3; height:3px; border-radius:999px; pointer-events:none; transform-origin:0 50%; background:#f5ffe3; box-shadow:0 0 5px #f5ffe3,0 0 13px var(--lime); animation:laser-shot .16s linear forwards; }.explosion { position:absolute; z-index:4; width:82px; height:82px; margin:-41px 0 0 -41px; pointer-events:none; border-radius:50%; background:radial-gradient(circle,#fffbd1 0 8%,#ffdd54 11%,#ff754c 30%,transparent 64%); animation:explode .38s ease-out forwards; }.explosion:before,.explosion:after { content:""; position:absolute; inset:4px; border:2px solid #ffe86c; border-radius:50%; }.explosion:after { inset:18px; border-color:#fff7b2; }.blast { position:absolute; z-index:5; color:#fff3a2; font:600 18px "DM Mono",monospace; pointer-events:none; animation:blast .55s ease-out forwards; }.controls { display:flex; height:42px; justify-content:space-between; align-items:center; gap:11px; padding:0 17px; color:#829d96; font-size:9px; }.skip-button { border:1px solid rgba(247,201,104,.55); background:transparent; color:var(--amber); padding:5px 7px; font:500 9px "DM Mono",monospace; letter-spacing:.06em; cursor:pointer; }.skip-button:hover { background:rgba(247,201,104,.12); }.pointer-icon { color:var(--lime); font-size:16px; font-style:normal; vertical-align:-2px; }.legend-invasive { color:var(--lime); }.legend-native { color:#75bfff; }
.intel-image-wrap { position:relative; display:block; height:158px; margin-bottom:14px; background:#102a36; overflow:hidden; }.intel-image-wrap:after { content:""; position:absolute; inset:0; border:1px solid rgba(187,255,95,.32); pointer-events:none; }.intel-image-wrap img { width:100%; height:100%; display:none; object-fit:cover; }.image-fallback { height:100%; display:grid; place-items:center; color:#4c716d; font:52px "DM Mono",monospace; }.profile-link { color:inherit; text-decoration:none; cursor:pointer; }.profile-link:hover { color:var(--lime); }.intel-image-wrap:hover:after { border-color:var(--lime); }.intel-status { color:var(--amber); margin:0 0 7px; }.intel h2 { margin:0; font-size:22px; line-height:1.05; letter-spacing:-.05em; }.scientific { min-height:34px; margin:7px 0 18px; color:#9aafa9; font:italic 12px/1.35 "DM Mono",monospace; }.intel dl { margin:0; border-top:1px solid var(--line); }.intel dl div { display:flex; justify-content:space-between; padding:9px 0; border-bottom:1px solid var(--line); font:9px "DM Mono",monospace; }.intel dt { color:#758e88; }.intel dd { max-width:120px; margin:0; text-align:right; color:#c3d7d1; }.residency-hidden { display:none !important; } footer { margin-top:15px; text-align:center; color:#627a75; font-size:9px; } footer a { color:#8bab9f; text-decoration:none; }
@keyframes descend { to { top:var(--end-top); } } @keyframes laser-shot { 0% { opacity:0; } 20% { opacity:1; } 100% { opacity:0; } } @keyframes explode { to { opacity:0; transform:scale(1.75) rotate(45deg); } } @keyframes blast { to { opacity:0; transform:scale(2); } }
@media (max-width:1000px) { .game-layout { grid-template-columns:200px minmax(380px,1fr); }.intel { grid-column:1/-1; display:grid; grid-template-columns:145px 1fr; gap:0 16px; }.intel .panel-label { grid-column:1/-1; }.intel-image-wrap { grid-row:2/6; height:155px; margin:0; }.intel h2,.intel .scientific,.intel dl,.intel-status { align-self:start; }.intel dl { display:flex; gap:18px; }.intel dl div { gap:10px; }.intel dd { max-width:none; } }
@media (max-width:650px) { .page-shell { width:min(100% - 24px,520px); padding-top:18px; }.masthead { align-items:flex-start; }.mission { max-width:140px; text-align:right; font-size:12px; }.game-layout { display:flex; flex-direction:column; }.briefing { order:2; }.game-panel { order:1; }.intel { order:3; }.briefing { padding:16px; }.briefing h2 br { display:none; }.brief-copy { margin:10px 0 15px; }.score-rules { display:flex; }.score-rules div { flex:1; flex-direction:column; align-items:flex-start; gap:2px; padding:9px 4px; }.score-rules span { font-size:10px; }.source-note { margin-top:13px; }.playfield { height:470px; }.alien { width:95px; min-height:121px; }.alien img,.alien .alien-placeholder { width:61px; height:61px; }.intel { display:block; }.intel-image-wrap { height:180px; margin-bottom:14px; }.intel dl { display:block; }.intel dl div { display:flex; }.hud { padding:0 13px; }.hud-item strong { font-size:24px; }.hud-center { font-size:8px; }.controls { padding:0 10px; font-size:8px; } }
