/* ============================================================================
   tokens.css — single source of truth for eyeon.ai design tokens.
   Linked (cache-busted) in the <head> of every surface BEFORE its inline
   <style>, so pages inherit one canonical palette/type/spacing scale instead
   of maintaining five drifting :root blocks.

   Pages may still override *layout* tokens (--gutter, --sidebar-w, --max,
   --newsletter-max) inline and inside @media blocks — those are intentionally
   per-page / responsive. Do NOT re-declare the palette/type tokens per page.
   ============================================================================ */
:root{
  /* ── Surfaces ─────────────────────────────────────────── */
  --bg:#0a0d13; --bg-card:#0f1319; --bg-card-hover:#141a22; --bg-surface:#111620;
  --border:#1c2535; --border-hover:#2a3548; --border-bright:#2a3548;

  /* ── Text ─────────────────────────────────────────────── */
  /* --dim raised from #828d9e to #8b96a6 so sub-14px meta text clears WCAG
     1.4.3 (>=4.5:1) on --bg-card / --bg-surface, where most of it sits. */
  --txt:#c8cdd6; --dim:#8b96a6; --bright:#eef1f6; --white:#fff;

  /* ── Accents + dim tints (unified across all pages) ───── */
  --gold:#d4a84b; --gold-dim:#d4a84b30; --gold-soft:#d4a84b14; --gold-bright:#f0c060;
  --cyan:#00d4e6; --cyan-dim:#00d4e620;
  --red:#ff3b5c; --red-dim:#ff3b5c18; --red-border:#ff3b5c40;
  --orange:#ff9640; --orange-dim:#ff964018; --orange-border:#ff964040;
  --yellow:#f0c040; --yellow-dim:#f0c04018; --yellow-border:#f0c04040;
  --green:#00e676; --green-dim:#00e67618;

  /* ── Type ─────────────────────────────────────────────── */
  --mono:'JetBrains Mono',monospace;
  --body:'Outfit',sans-serif;
  --sans:'Outfit',system-ui,sans-serif;   /* alias used by reports.html */
  --fs-xs:0.8rem; --fs-sm:0.875rem; --fs-base:1rem; --fs-md:1.0625rem;
  --fs-lg:1.2rem; --fs-xl:1.4rem; --fs-2xl:1.75rem;   /* 2xl = section/display tier */
  --fs-mono-xs:0.75rem; --fs-mono-sm:0.8125rem; --fs-mono-base:0.875rem;

  /* ── Radius ───────────────────────────────────────────── */
  --radius-sm:4px; --radius:8px; --radius-lg:12px; --radius-xl:18px;

  /* ── Spacing scale (4px base) ─────────────────────────── */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px; --space-6:24px;

  /* ── Elevation (promoted from landing.html) ───────────── */
  --shadow-sm:0 2px 8px rgba(0,0,0,.35);
  --shadow-md:0 8px 24px rgba(0,0,0,.45);
  --shadow-glow-gold:0 0 60px rgba(212,168,75,.12);
  --shadow-glow-cyan:0 0 60px rgba(0,212,230,.10);

  /* ── Layout defaults (pages/@media override) ──────────── */
  --gutter:28px; --sidebar-w:240px; --touch:48px;
}
