:root {
  /* Accent — oklch hue drives all colors */
  color-scheme: light;
  --accent-h: 262;
  --accent-c: 0.2;

  /* Colors — just ink, bg, and their variants */
  --color-ink:      light-dark(#233a7e, oklch(0.90 0.03 var(--accent-h)));
  --color-bg:       light-dark(#f8f8f6, oklch(0.40 var(--accent-c) var(--accent-h)));
  --color-bg-alt:   light-dark(oklch(1.00 0 0), oklch(0.45 0.15 var(--accent-h)));
  /* Code plate — the index's navy plate and its token palette (index.html :root) */
  --plate-bg:       #0f1a3e;
  --plate-edge:     rgb(238 244 255 / 26%);
  --plate-ink:      #eef2fc;
  --plate-dim:      #9fb0d8;
  --plate-faint:    #8093c5;
  --plate-lit:      #dfe7fa;
  --plate-hi:       #ffffff;
  --accent-cyan:    #7ed8fa;
  --accent-mint:    #b0ecd0;

  /* Footer band, as on the index */
  --paper:          #e2e2e2;
  --footer-mist:    rgb(79 129 222 / 22%);
  --color-overlay:  oklch(0 0 0 / 40%);

  /* Alpha variants of ink */
  --alpha-10: oklch(from var(--color-ink) l c h / 10%);
  --alpha-20: oklch(from var(--color-ink) l c h / 20%);
  --alpha-50: oklch(from var(--color-ink) l c h / 50%);

  accent-color: var(--color-ink);

  /* Typography */
  --font-sans: 'IBM Plex Sans', ui-sans-serif, system-ui, sans-serif;
  --font-display: Geist, ui-sans-serif, system-ui, sans-serif;
  --font-mono: 'Monaspace Neon', ui-monospace, monospace;
  --font-base: 100%;

  /* Type scale — the index's 1.25 modular scale */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-md: 1.25rem;
  --text-lg: 1.5625rem;
  --text-xl: 1.953rem;
  --text-2xl: clamp(2.441rem, 5vw, 3.052rem);

  /* Font weights */
  --weight-normal: 400;
  --weight-heading: 450;
  --weight-medium: 500;
  --weight-bold: 700;
  --weight-black: 900;

  /* Line height — one token everywhere */
  --leading: 1.5;

  /* Code, as on the index */
  --code-font: var(--weight-medium) var(--text-sm)/1.7 var(--font-mono);
  --inline-code-font: var(--weight-medium) 0.92em/1.5 var(--font-mono);
  --label-font: var(--weight-medium) var(--text-md)/1.3 var(--font-display);
  --caption-font: var(--weight-normal) var(--text-sm)/1.5 var(--font-sans);

  /* Spacing scale — 4px base */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-8: 3rem;

  /* Border — one width, one color everywhere */
  --border: var(--border-w) solid var(--color-ink);
  --border-w: 3px;
  --border-w-thin: 1px;

  /* Layout — the index shell: 1080px, ten columns */
  --shell: min(1080px, 100vw - var(--sp-8));
  --content-w: 48rem;
  --topbar: 5rem;
  --tap: 2.75rem;

  /* Transitions */
  --ease: 0.15s;
  --ease-slow: 0.3s;

  /* Radii */
  --radius-pill: 90rem;
  --radius-sm: var(--radius-pill);
  --radius-plate: 0.75rem;
}