/* tokens.css — Design system custom properties */

/* Brand faces, self-hosted (same files as the map app — one voice across
   teaser and product; decision 2026-07-02, supersedes the earlier font ban) */
@font-face {
  font-family: 'Orbitron';
  src: url('../assets/fonts/Orbitron-SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: 'Orbitron';
  src: url('../assets/fonts/Orbitron-ExtraBold.woff2') format('woff2');
  font-weight: 700 800;
  font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('../assets/fonts/Inter-Regular.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('../assets/fonts/Inter-SemiBold.woff2') format('woff2');
  font-weight: 600 700;
  font-display: swap;
}
/* JetBrains Mono, self-hosted (latin subset, variable weight axis). Was loaded
   from Google Fonts — moved local to drop a render-blocking third-party request
   and keep the font off Google's servers. */
@font-face {
  font-family: 'JetBrains Mono';
  src: url('../assets/fonts/JetBrainsMono.woff2') format('woff2');
  font-weight: 400 700;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* Void (backgrounds) */
  --void-deep: #08080F;
  --void-surface: #0D0D18;
  --void-elevated: #141422;

  /* Section scrims — translucent versions of the void tones so the animated
     starfield (js/starfield.js) shows through while text zones stay calm */
  --scrim-deep: rgba(8, 8, 15, 0.42);
  --scrim-surface: rgba(13, 13, 24, 0.62);

  /* Duality — warm (conflict, Varkatt, entropy) */
  --warm-deep: #8B1A1A;
  --warm-mid: #D4742C;
  --warm-glow: #E8A832;

  /* Duality — cool (order, Council, precision) */
  --cool-deep: #0D1B3E;
  --cool-mid: #3A6B9F;
  --cool-glow: #7EB8D4;

  /* Singularity (center, emphasis, signatures) */
  --singularity-glow: #F5E6C8;
  --singularity-bright: #FFFAED;

  /* Text hierarchy */
  --text-primary: #E8E4DF;
  --text-secondary: #A09888;
  --text-muted: #605848;

  /* Schematic overlay (technical diagram aesthetic) */
  --schematic-line: #A09070;
  --schematic-dim: #504830;

  /* Faction accents (mapped from galactic map territories) */
  --faction-antuari: #2D8B57;
  --faction-azzek: #A07840;
  --faction-ceevar: #2856A0;
  --faction-human: #2898A0;
  --faction-maesuu: #9868A8;
  --faction-seklex: #7030A0;
  --faction-varkatt: #404858;
  --faction-velkaan: #C8A830;

  /* Typography — Orbitron + Inter self-hosted (matches the map app; decision
     2026-07-02), JetBrains Mono via Google Fonts for data readouts */
  --font-display: 'Orbitron', sans-serif;
  --font-body: 'Inter', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;

  /* Type scale (modular, base 1rem = 16px) */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.25rem;
  --text-xl: 1.5rem;
  --text-2xl: 2rem;
  --text-3xl: 2.5rem;
  --text-4xl: 3.5rem;
  --text-5xl: 4.5rem;

  /* Line heights */
  --leading-tight: 1.1;
  --leading-snug: 1.3;
  --leading-normal: 1.6;
  --leading-loose: 1.8;

  /* Letter spacing */
  --tracking-tight: -0.02em;
  --tracking-normal: 0;
  --tracking-wide: 0.05em;
  --tracking-wider: 0.1em;
  --tracking-widest: 0.2em;

  /* Spacing */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;
  --space-4xl: 6rem;
  --space-5xl: 8rem;
  --space-section: 8rem;

  /* Motion */
  --duration-fast: 200ms;
  --duration-normal: 400ms;
  --duration-slow: 800ms;
  --duration-glacial: 1500ms;

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* Kill all motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}