/* Design tokens: colours, type, spacing, corners, glows and motion.
   style.css builds everything from these. */

/* ---------- colors ---------- */
:root{
/* Night-sky neutrals (menus, panels) */
--ink-1000:#04070B;--ink-950:#070B10;--ink-900:#0B1118;--ink-850:#0F1720;--ink-800:#131C27;--ink-700:#1A2533;--ink-600:#233142;--ink-500:#324357;--ink-400:#4A5D74;--ink-300:#6E8199;--ink-200:#9EADBF;--ink-100:#CBD5E1;--ink-50:#EEF2F7;
/* Signal cyan — primary interactive (menu focus, selection, CTAs) */
--cyan-700:#0A6E8C;--cyan-600:#0E93B8;--cyan-500:#22C3EE;--cyan-400:#5AD7F7;--cyan-300:#9AE8FB;
/* Afterburner orange — arcade accent (score, rewards, boost, hero CTA) */
--burn-600:#D9580B;--burn-500:#FF7A1A;--burn-400:#FF9A4D;
/* Phosphor green — HUD symbology */
--hud-600:#1FAE52;--hud-500:#3DFF7E;--hud-400:#86FFAE;
/* Avionics magenta — navigation, route, waypoints */
--nav-500:#E54BFF;--nav-400:#EE86FF;
/* Semantic: annunciator / alerting (follows cockpit convention) */
--caution-500:#FFB21A;--caution-600:#C98500;--warning-500:#FF3B3B;--warning-600:#C21E1E;--advisory-500:#22C3EE;--ok-500:#3DFF7E;
/* IFF */
--iff-friendly:#4DA8FF;--iff-hostile:#FF3B3B;--iff-unknown:#FFD84A;--iff-neutral:#CBD5E1;

/* Semantic aliases */
--bg-app:var(--ink-950);--bg-scrim:rgba(4,7,11,.72);
--surface-panel:rgba(15,23,32,.86);--surface-raised:var(--ink-800);--surface-sunken:var(--ink-1000);--surface-hover:rgba(34,195,238,.08);--surface-selected:rgba(34,195,238,.14);
--line-subtle:rgba(158,173,191,.14);--line-default:rgba(158,173,191,.26);--line-strong:rgba(158,173,191,.48);--line-focus:var(--cyan-500);
--text-primary:var(--ink-50);--text-secondary:var(--ink-200);--text-tertiary:var(--ink-300);--text-disabled:var(--ink-400);--text-on-accent:var(--ink-1000);
--accent:var(--cyan-500);--accent-hover:var(--cyan-400);--accent-press:var(--cyan-600);
--accent-arcade:var(--burn-500);
--hud-color:var(--hud-500);--hud-dim:rgba(61,255,126,.45);--nav-color:var(--nav-500);
}

/* ---------- typography ---------- */
:root{
--font-display:"Saira Condensed","Arial Narrow",sans-serif;
--font-ui:"Barlow","Helvetica Neue",sans-serif;
--font-hud:"B612 Mono","Consolas",monospace;
--font-instrument:"B612","Helvetica Neue",sans-serif;

--fs-hero:72px;--fs-display:48px;--fs-h1:34px;--fs-h2:26px;--fs-h3:20px;--fs-body:16px;--fs-small:14px;--fs-micro:12px;--fs-label:11px;
--fs-hud-lg:22px;--fs-hud-md:16px;--fs-hud-sm:13px;
--lh-tight:1.0;/* @kind other */--lh-snug:1.15;/* @kind other */--lh-body:1.45;/* @kind other */
--tracking-display:.02em;/* @kind other */--tracking-label:.14em;/* @kind other */--tracking-hud:.04em;/* @kind other */
--fw-regular:400;/* @kind font */--fw-medium:500;/* @kind font */--fw-semibold:600;/* @kind font */--fw-bold:700;/* @kind font */--fw-black:800;/* @kind font */

--text-hero:var(--fw-black) var(--fs-hero)/var(--lh-tight) var(--font-display);/* @kind font */
--text-title:var(--fw-bold) var(--fs-h1)/var(--lh-snug) var(--font-display);/* @kind font */
--text-body:var(--fw-regular) var(--fs-body)/var(--lh-body) var(--font-ui);/* @kind font */
--text-label:var(--fw-semibold) var(--fs-label)/1 var(--font-ui);/* @kind font */
--text-hud:var(--fw-regular) var(--fs-hud-md)/1 var(--font-hud);/* @kind font */
}

/* ---------- spacing ---------- */
:root{
--space-0:0;--space-1:2px;--space-2:4px;--space-3:8px;--space-4:12px;--space-5:16px;--space-6:24px;--space-7:32px;--space-8:48px;--space-9:64px;--space-10:96px;
--safe-area:48px;/* TV/console title-safe margin at 1080p */
--hud-safe:64px;
--control-h-sm:32px;--control-h-md:44px;--control-h-lg:56px;
--panel-pad:var(--space-6);
}

/* ---------- effects ---------- */
:root{
/* Corners: mostly square; chamfer is the signature shape */
--radius-0:0;--radius-1:2px;--radius-2:4px;--radius-pill:999px;
--chamfer:10px;--chamfer-sm:6px;
--clip-chamfer:polygon(var(--chamfer) 0,100% 0,100% calc(100% - var(--chamfer)),calc(100% - var(--chamfer)) 100%,0 100%,0 var(--chamfer));/* @kind other */
--clip-chamfer-sm:polygon(var(--chamfer-sm) 0,100% 0,100% calc(100% - var(--chamfer-sm)),calc(100% - var(--chamfer-sm)) 100%,0 100%,0 var(--chamfer-sm));/* @kind other */
--border-w:1px;/* @kind other */--border-w-strong:2px;/* @kind other */
/* Elevation: dark drop + hairline, never soft-grey */
--shadow-panel:0 12px 32px rgba(0,0,0,.55),0 0 0 1px var(--line-subtle);
--shadow-pop:0 20px 48px rgba(0,0,0,.7),0 0 0 1px var(--line-default);
/* Glows — emissive light, used for focus + HUD */
--glow-accent:0 0 0 1px var(--cyan-500),0 0 18px rgba(34,195,238,.35);
--glow-hud:0 0 6px rgba(61,255,126,.55);
--glow-warning:0 0 16px rgba(255,59,59,.55);
--glow-caution:0 0 16px rgba(255,178,26,.45);
--text-glow-hud:0 0 6px rgba(61,255,126,.6);
--blur-panel:blur(14px) saturate(120%);/* @kind other */
/* Motion */
--ease-out:cubic-bezier(.2,.8,.2,1);/* @kind other */--ease-in-out:cubic-bezier(.6,0,.2,1);/* @kind other */--ease-snap:cubic-bezier(.3,1.4,.5,1);/* @kind other */
--dur-instant:80ms;/* @kind other */--dur-fast:140ms;/* @kind other */--dur-base:220ms;/* @kind other */--dur-slow:420ms;/* @kind other */
--blink-warning:500ms;/* @kind other *//* 1 Hz master warning flash, half period */
}

/* ---------- keyframes ---------- */
@keyframes fs-blink{0%,49%{opacity:1}50%,100%{opacity:.15}}
@keyframes fs-slide-in{from{transform:translateX(24px);opacity:0}to{transform:none;opacity:1}}
@keyframes fs-sweep{from{transform:rotate(0)}to{transform:rotate(360deg)}}