/* =========================================================================
   Aerospace Design Tokens
   Single source of truth for palette, type, spacing, motion, elevation.
   Reference via var(--token-name) — do NOT hardcode values in components.
   ========================================================================= */

:root {
  /* ---------- Color: Deep Space Base ---------- */
  --c-void:          #05070d;   /* absolute black, page bg */
  --c-abyss:         #0a1128;   /* primary surface */
  --c-hull:          #0e1524;   /* card surface */
  --c-hull-elev:     #131c2e;   /* raised card */
  --c-hull-line:     #1b2741;   /* hairline borders */

  /* ---------- Color: Cyan HUD ---------- */
  --c-beam-100:      #e6faff;
  --c-beam-300:      #7cdaff;
  --c-beam:          #00d4ff;   /* primary accent */
  --c-beam-700:      #0099c4;
  --c-beam-glow:     0 0 24px rgba(0, 212, 255, 0.35);

  /* ---------- Color: Ember (reserved for CTAs) ---------- */
  --c-ember:         #ff7a1a;
  --c-ember-700:     #c8530a;

  /* ---------- Color: Signal Greens (success/telemetry) ---------- */
  --c-signal:        #22e06b;
  --c-signal-dim:    #14803e;

  /* ---------- Color: Text ---------- */
  --c-text:          #f4faff;   /* primary */
  --c-text-dim:      #a8b7cc;   /* secondary */
  --c-text-mute:     #6c7a91;   /* tertiary, labels */

  /* ---------- Type ---------- */
  --font-display:    "Space Grotesk", system-ui, sans-serif;
  --font-body:       "Space Grotesk", system-ui, sans-serif;
  --font-mono:       "JetBrains Mono", ui-monospace, "Cascadia Mono", Menlo, monospace;

  --fs-hero:         clamp(2.75rem, 6vw, 5.5rem);     /* 44–88px */
  --fs-h1:           clamp(2.25rem, 4.5vw, 3.75rem);
  --fs-h2:           clamp(1.75rem, 3vw, 2.5rem);
  --fs-h3:           clamp(1.4rem, 2.2vw, 1.85rem);
  --fs-lead:         clamp(1.05rem, 1.3vw, 1.2rem);
  --fs-body:         1rem;
  --fs-sm:           0.875rem;
  --fs-xs:           0.75rem;

  --lh-tight:        1.08;
  --lh-snug:         1.3;
  --lh-normal:       1.55;

  --tracking-tight:  -0.02em;
  --tracking-wide:   0.08em;    /* HUD labels */

  /* ---------- Space (4px base) ---------- */
  --s-1:  0.25rem;
  --s-2:  0.5rem;
  --s-3:  0.75rem;
  --s-4:  1rem;
  --s-5:  1.5rem;
  --s-6:  2rem;
  --s-7:  3rem;
  --s-8:  4rem;
  --s-9:  6rem;
  --s-10: 8rem;

  /* ---------- Radii ---------- */
  --r-xs:  4px;
  --r-sm:  8px;
  --r-md:  14px;
  --r-lg:  20px;
  --r-pill: 999px;

  /* ---------- Elevation (NO backdrop-filter; solid-first) ---------- */
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.35);
  --shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 12px 32px rgba(0, 0, 0, 0.5);
  --shadow-lg: 0 24px 64px rgba(0, 0, 0, 0.55);
  --shadow-beam: 0 0 0 1px rgba(0, 212, 255, 0.15), 0 0 32px rgba(0, 212, 255, 0.08);

  /* ---------- Motion ---------- */
  --ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  --dur-fast:   150ms;
  --dur-base:   240ms;
  --dur-slow:   420ms;
  --dur-epic:   800ms;

  /* ---------- Layout ---------- */
  --container-max: 1280px;
  --gutter:        clamp(1rem, 3vw, 2rem);

  /* ---------- Z-index layers ---------- */
  --z-base:     1;
  --z-nav:      100;
  --z-overlay:  500;
  --z-modal:    1000;
  --z-cursor:   9000;
  --z-loader:   9999;
}

/* Respect OS-level motion reduction globally */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 0ms;
    --dur-base: 0ms;
    --dur-slow: 0ms;
    --dur-epic: 0ms;
  }
}
