/* ── tokens.css ──────────────────────────────────────────────────────────
   Raw brand primitives. Color, type, scale. No semantic intent.
   Components must NOT reference these directly — go through themes.css.
   Mirrors the palette defined in .reference/DoctorsDirect/brand-canvas.jsx.
   ─────────────────────────────────────────────────────────────────────── */

:root {
  /* ── neutrals: surfaces + type ───────────────────────────── */
  --bone:        oklch(0.97 0.008 80);
  --paper:       oklch(0.94 0.010 85);
  --mute:        oklch(0.65 0.008 80);
  --ink:         oklch(0.18 0.012 250);
  --ink-2:       oklch(0.42 0.010 250);

  /* ── signal: the one functional accent ───────────────────── */
  --operator:    oklch(0.55 0.080 155);
  --operator-2:  oklch(0.42 0.060 155);

  /* ── accents: card themes + campaign grounds ─────────────── */
  --cobalt:      oklch(0.55 0.170 252);
  --cobalt-2:    oklch(0.38 0.130 252);
  --moss:        oklch(0.66 0.130 148);
  --moss-2:      oklch(0.48 0.110 148);
  --rose:        oklch(0.60 0.180 10);
  --sand:        oklch(0.88 0.040 75);

  /* Tonal aliases used to derive theme-scoped foreground transparencies.
     RGB triplets so themes.css can compose rgba(...) without losing alpha. */
  --bone-rgb:    244 239 231;
  --ink-rgb:     35 38 50;

  /* ── type system ─────────────────────────────────────────── */
  --font-sans:      "Hanken Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --font-condensed: "Barlow Condensed", "Franklin Gothic Medium", "Franklin Gothic", "Arial Narrow", "Helvetica Neue Condensed", sans-serif;
  --font-mono:      "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* ── type scale (8pt grid, from .reference type specimen) ── */
  --type-display-l: 4.5rem;   /* 72 / 0.95 / -3.5% */
  --type-display-m: 3rem;     /* 48 / 1.00 / -3.0% */
  --type-heading:   1.5rem;   /* 24 / 1.15 / -2.0% */
  --type-subhead:   1.125rem; /* 18 / 1.30 / -1.0% */
  --type-body:      1rem;     /* 16 / 1.50 / -0.5% */
  --type-caption:   0.8125rem;/* 13 / 1.40 /  0.0% */
  --type-mono:      0.6875rem;/* 11 / 1.20 / +1.4em (UI) */

  /* ── spacing scale (8pt grid) ─────────────────────────────── */
  --space-1: 0.5rem;   /*  8 */
  --space-2: 0.75rem;  /* 12 */
  --space-3: 1rem;     /* 16 */
  --space-4: 1.5rem;   /* 24 */
  --space-5: 2rem;     /* 32 */
  --space-6: 3rem;     /* 48 */
  --space-7: 4.5rem;   /* 72 */
  --space-8: 6rem;     /* 96 */

  /* ── viewport-relative page padding (matches .reference) ──── */
  --pad-x: clamp(14px, 2.4vmin, 40px);
  --pad-y: clamp(14px, 2.4vmin, 40px);
}