/* VX MACHINA — Obsidian Forge v1.3 design tokens
   Source of truth for colour, type, spacing and motion. Fonts are self-hosted in assets/fonts/fonts.css;
   */
:root {
  /* Neutrals: 85% of every screen. Neutral, never navy/blue/purple-tinted. */
  --void: #0A0A0A;        /* page background */
  --obsidian: #0E0E0E;    /* raised band */
  --charcoal: #121212;    /* panels */
  --graphite: #171717;    /* cards, secondary buttons */
  --gunmetal: #2B2B2B;    /* borders, dividers, disabled fills */
  --titanium: #F5F5F5;    /* primary text */
  --silver: #B5B5B5;      /* secondary text */

  /* Chromatic accents: 5% of every screen. Within accents ~70 / 20 / 10. */
  --violet: #7A4BFF;      /* PRIMARY: brand, CTAs, nav active, reactor, illumination */
  --teal: #4D8DFF;        /* SECONDARY: diagrams, data, annotations, secondary states */
  --magenta: #7A4BFF;     /* TERTIARY: rare FX, pulses, pixel highlights */

  /* Accessible variants (computed, see components.html contrast table) */
  --violet-text: #A285FF; /* violet for text/thin lines on dark: 7.04:1 on void, 6.11:1 on graphite */
  --on-violet: #FFFFFF;   /* label on violet fill: 4.91:1 (titanium is only 4.40:1) */
  --violet-press: #6E40F5;/* pressed/hover fill: 5.06:1 with titanium */
  --violet-glow: rgba(122, 75, 255, .45);
  --violet-haze: rgba(122, 75, 255, .10);
  --teal-haze: rgba(77,141,255, .10);

  /* Structure */
  --rule: rgba(169, 181, 181, .14);  /* hairline: metallic, neutral */
  --rule-strong: rgba(169, 181, 181, .28);

  /* Type */
  --font-display: "Space Grotesk", system-ui, sans-serif;  /* headings, display */
  --font-body: "Inter", system-ui, sans-serif;             /* body, nav, UI */
  --font-tech: "Rajdhani", "Inter", sans-serif;            /* labels, numerals, coordinates */
  --font-brand: "Orbitron", "Space Grotesk", sans-serif;   /* rare branding moments only */
  --fs-hero: clamp(44px, 8vw, 116px);
  --fs-h2: clamp(30px, 3.6vw, 48px);
  --fs-h3: clamp(19px, 1.6vw, 22px);
  --fs-body: 17px;
  --fs-small: 15px;
  --fs-tech: 13px;
  --track-tech: .18em;

  /* Space & shape */
  --max: 1240px;
  --gut: clamp(20px, 5vw, 64px);
  --radius: 2px;          /* machined, not soft */
  --notch: 10px;          /* clipped corner size on cards/buttons */

  /* Motion: mechanically precise */
  --ease-machine: cubic-bezier(.65, .05, .25, 1);
  --t-fast: 140ms;
  --t-med: 320ms;
  --t-slow: 900ms;
}
@media (prefers-reduced-motion: reduce) {
  :root { --t-fast: 0ms; --t-med: 0ms; --t-slow: 0ms; }
}