/* =====================================================================
   Design tokens — Overasselt Intelligence Dossier
   Editorial dossier direction. Warm off-white / deep charcoal.
   HSL H S% L%. WCAG AA min contrast for body text.
   ===================================================================== */

:root {
  /* Fluid type scale (rem + vw) */
  --text-xs:  clamp(0.75rem, 0.7rem + 0.15vw, 0.8125rem);
  --text-sm:  clamp(0.8125rem, 0.78rem + 0.2vw, 0.9375rem);
  --text-base: clamp(1rem, 0.95rem + 0.2vw, 1.0625rem);
  --text-md:  clamp(1.0625rem, 1rem + 0.25vw, 1.1875rem);
  --text-lg:  clamp(1.25rem, 1.1rem + 0.6vw, 1.625rem);
  --text-xl:  clamp(1.625rem, 1.35rem + 1.1vw, 2.375rem);
  --text-2xl: clamp(2rem, 1.4rem + 2.4vw, 3.25rem);
  --text-hero: clamp(2.5rem, 1.6rem + 4.4vw, 5.5rem);

  /* Spacing (4px base) */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-14: 3.5rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* Type families */
  --font-serif: "Fraunces", ui-serif, "Iowan Old Style", "Charter", Georgia, serif;
  --font-sans:  "Inter Tight", ui-sans-serif, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono:  "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* Radii — sharp by default */
  --r-0: 0px;
  --r-pill: 999px;
  --r-inline: 3px;

  /* Layout */
  --container: 1200px;
  --content: 780px;

  /* Motion */
  --ease: cubic-bezier(.2,.7,.2,1);
  --dur-fast: 120ms;
  --dur: 220ms;
  --dur-slow: 420ms;

  /* Confidence colors — light mode */
  --c-confirmed: hsl(148 42% 32%);
  --c-partial:   hsl(37 78% 40%);
  --c-unconfirmed: hsl(6 62% 44%);
  --c-removed: hsl(30 6% 45%);
  --c-denied: hsl(6 74% 40%);
  --c-derived: hsl(220 12% 40%);

  --c-confirmed-tint: hsl(148 42% 32% / .10);
  --c-partial-tint:   hsl(37 78% 40% / .12);
  --c-unconfirmed-tint: hsl(6 62% 44% / .10);
  --c-removed-tint: hsl(30 6% 45% / .10);
  --c-denied-tint: hsl(6 74% 40% / .10);
  --c-derived-tint: hsl(220 12% 40% / .10);
}

/* ---------- LIGHT ---------- */
:root, [data-theme="light"] {
  --bg:            hsl(43 30% 95%);
  --bg-alt:        hsl(42 24% 91%);
  --bg-band:       hsl(42 20% 93%);
  --surface:       hsl(43 34% 97%);
  --surface-2:     hsl(42 20% 89%);
  --ink:           hsl(30 12% 12%);
  --ink-2:         hsl(30 10% 24%);
  --ink-3:         hsl(30 8% 38%);
  --ink-mute:      hsl(30 6% 52%);
  --rule:          hsl(30 8% 78%);
  --rule-soft:     hsl(30 8% 84%);
  --accent:        hsl(28 82% 34%);
  --accent-strong: hsl(28 82% 30%);
  --accent-tint:   hsl(28 82% 34% / .09);
  --focus-ring:    hsl(28 82% 34% / .55);

  color-scheme: light;
}

/* ---------- DARK ---------- */
[data-theme="dark"] {
  --bg:            hsl(30 10% 8%);
  --bg-alt:        hsl(30 8% 11%);
  --bg-band:       hsl(30 8% 10%);
  --surface:       hsl(30 8% 12%);
  --surface-2:     hsl(30 7% 16%);
  --ink:           hsl(40 22% 92%);
  --ink-2:         hsl(40 15% 82%);
  --ink-3:         hsl(38 10% 68%);
  --ink-mute:      hsl(38 6% 55%);
  --rule:          hsl(30 6% 26%);
  --rule-soft:     hsl(30 6% 20%);
  --accent:        hsl(32 85% 60%);
  --accent-strong: hsl(32 92% 66%);
  --accent-tint:   hsl(32 85% 60% / .13);
  --focus-ring:    hsl(32 85% 60% / .55);

  /* confidence — dark */
  --c-confirmed: hsl(148 42% 60%);
  --c-partial:   hsl(37 82% 62%);
  --c-unconfirmed: hsl(6 72% 66%);
  --c-removed: hsl(30 6% 62%);
  --c-denied: hsl(6 78% 62%);
  --c-derived: hsl(220 14% 68%);

  --c-confirmed-tint: hsl(148 42% 60% / .14);
  --c-partial-tint:   hsl(37 82% 62% / .16);
  --c-unconfirmed-tint: hsl(6 72% 66% / .14);
  --c-removed-tint: hsl(30 6% 62% / .12);
  --c-denied-tint: hsl(6 78% 62% / .14);
  --c-derived-tint: hsl(220 14% 68% / .14);

  color-scheme: dark;
}