:root {
  /* Base palette: near-black with a subtle cool tint, layered surfaces. */
  --bg: #0a0d12;
  --bg-tint: #0d1119;
  --surface: #12161f;
  --surface-2: #1a1f2b;
  --surface-3: #222838;
  --border: #2a3142;
  --border-soft: #202836;
  --text: #e8edf6;
  --text-dim: #98a4ba;
  --text-faint: #6b7689;

  /* Restrained clinical accent. */
  --accent: #5aa9e6;
  --accent-2: #7cc4f0;
  --accent-ink: #04141f;

  /* Evidence tiers (names referenced by graphic.js via var()). */
  --tier-strong: #43c08f;
  --tier-moderate: #dba43e;
  --tier-limited: #8a93a6;
  --danger: #e1654f;

  /* Type. */
  --font: "Inter", -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-serif: "Newsreader", Georgia, "Times New Roman", serif;

  /* Modular type scale (1.25 ratio, base 17px). */
  --fs-xs: 0.72rem;
  --fs-sm: 0.84rem;
  --fs-base: 1rem;
  --fs-md: 1.15rem;
  --fs-lg: 1.5rem;
  --fs-xl: 2rem;
  --fs-2xl: 2.75rem;
  --fs-3xl: 3.6rem;

  /* Spacing. */
  --space-1: 4px; --space-2: 8px; --space-3: 16px; --space-4: 24px;
  --space-5: 40px; --space-6: 64px; --space-7: 96px;

  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --maxw: 1100px;
  --measure: 68ch;

  /* Depth: soft, low-opacity, large-blur shadows. */
  --shadow-sm: 0 1px 2px rgba(0,0,0,.4);
  --shadow-md: 0 8px 24px -8px rgba(0,0,0,.55);
  --shadow-lg: 0 24px 64px -16px rgba(0,0,0,.65);

  /* Focus ring + accent glow + hero radial glow. */
  --ring: 0 0 0 2px var(--bg), 0 0 0 4px var(--accent);
  --glow: 0 0 24px -4px rgba(90,169,230,.35);
  --hero-glow: radial-gradient(60% 55% at 50% 38%, rgba(90,169,230,.14), rgba(90,169,230,.04) 45%, transparent 72%);
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
