/* Design tokens that do not change between themes.
   Colour tokens live in theme-dark.css / theme-light.css instead --
   see docs/DESIGN_SYSTEM.md Section 12. Values below come from
   docs/DESIGN_SYSTEM.md Sections 5-9, plus the breakpoint values from
   docs/ARCHITECTURE.md Section 12 (see that section's own comment
   further down). */

:root {
  /* Typography -- Section 5 */
  --font-family-base: -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, Helvetica, Arial, sans-serif;
  /* Phase G.3: renamed from --font-family-mono. Same stack value --
     this is the default typeface for every DATA value in the system
     (stat tiles, table numeric cells, chart axes/tooltips, inline
     numbers in body text), not just usernames/hashes as before --
     docs/DESIGN_SYSTEM_V2.md Section 3. Single CSS consumer at rename
     time (base.css's .mono rule), so this is a rename, not an alias. */
  --font-family-data: ui-monospace, "SF Mono", "Cascadia Code", "Consolas",
    "Roboto Mono", monospace;

  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-md: 1.125rem;
  --font-size-lg: 1.25rem;
  --font-size-xl: 1.5rem;
  --font-size-2xl: 2rem;
  --font-size-3xl: 2.5rem;
  /* Phase G.3: Primary-tier ("Hero") value only -- docs/DESIGN_SYSTEM_V2.md
     Section 3/5. Larger than --font-size-3xl (landing-only, unchanged),
     reserved for the single most important figure on a page. */
  --font-size-hero: 3rem;

  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  --line-height-tight: 1.2;
  --line-height-base: 1.5;
  --line-height-compact: 1.4;

  /* Phase G.3, docs/DESIGN_SYSTEM_V2.md Section 3: labels get MORE
     tracking (uppercase, letter-spaced) as data values get none --
     the label/data typeface split relies on this opposite-direction
     pull, not on font-family difference alone. */
  --letter-spacing-label: 0.04em;
  --letter-spacing-data: 0;

  /* Spacing -- Section 6 */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;

  /* Radius, border, elevation -- Section 7 */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-full: 9999px;

  --border-width: 1px;
  --border-color: var(--color-border);

  --glow-accent: 0 0 12px rgba(255, 215, 0, 0.35);

  /* Stacking order. Deliberately minimal -- only the one layered
     element that exists so far (the sticky shell header) has a token;
     add to this set as later milestones actually introduce modals,
     dropdowns, or tooltips, rather than pre-defining a scale for
     elements that don't exist yet. */
  --z-index-header: 50;

  /* Iconography -- Section 8 */
  --icon-size-sm: 16px;
  --icon-size-md: 20px;
  --icon-size-lg: 24px;

  /* Motion -- Section 9 */
  --duration-fast: 120ms;
  --duration-base: 200ms;
  --duration-slow: 320ms;
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  /* Phase G.3, docs/DESIGN_SYSTEM_V2.md Section 8: the live-data pulse
     dot's looping cycle. Deliberately NOT added to the
     prefers-reduced-motion zeroing block below -- zeroing an
     *infinite/looping* animation's duration does not reliably produce
     a static result (the same caveat already documented for the
     Global Live Feed, docs/DESIGN_SYSTEM.md Section 10.8). The pulse
     dot gets its own dedicated `animation: none` override where it's
     defined (shell.css) instead. */
  --duration-pulse: 1600ms;

  /* Responsive breakpoints, as tokens rather than hard-coded values
     -- docs/ARCHITECTURE.md Section 12, reused by DESIGN_SYSTEM.md
     Section 11. Custom properties cannot be used inside @media
     conditions, so these exist for documentation/JS use (e.g. a
     ResizeObserver threshold); CSS @media queries below repeat the
     literal pixel values. */
  --breakpoint-sm: 480px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 1024px;
  --breakpoint-xl: 1280px;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-fast: 0ms;
    --duration-base: 0ms;
    --duration-slow: 0ms;
  }
}
