/* Shared design tokens for the explainer-site and every explainer bundle.
   Link this before any page-specific stylesheet. One source of truth for
   palette, typography, shadows, and dark-mode overrides. */

:root {
  /* Surface + text */
  --bg: #f6f3ec;
  --paper: #fffdf7;
  --ink: #1e232b;
  --ink-soft: #4a525d;
  --ink-faint: #8b8f95;
  --rule: #d8d2c2;

  /* Accent palette (shared by all explainers; unused tokens cost nothing) */
  --nash: #c44536;
  --nash-soft: #e5a89f;
  --coop: #2b6e74;
  --coop-soft: #9ac6c8;
  --wedge: #c9801c;
  --worker: #3d4f5c;
  --owner: #8c6e3f;
  --accent: #1d4e89;
  --accent-hover: #163a6b;

  /* Chip styling (landing card tags) */
  --chip-bg: rgba(29, 78, 137, 0.08);
  --chip-ink: #1d4e89;

  /* Stroke colors surfaced as vars so app.js can read them */
  --chart-axis: #bbb;
  --chart-grid: #d8d2c2;
  --chart-grid-faint: #e5dfd0;
  --on-bar-light: #fff;
  --on-bar-dark: #1e232b;

  /* Semantic tint surfaces (soft-background callouts). */
  --tint-highlight: #fdf0c7;
  --tint-nash-bg: #fcefed;
  --tint-nash-ink: #6d1e15;
  --tint-coop-bg: #e9f2f3;
  --tint-coop-ink: #174a4f;
  --tier-low: #c0b8a5;

  /* Typography */
  --font-serif: "Literata", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* Elevation */
  --shadow-sm: 0 1px 2px rgba(30, 35, 43, 0.06);
  --shadow-md: 0 4px 16px rgba(30, 35, 43, 0.08);

  color-scheme: light;
}

[data-theme="dark"] {
  --bg: #1a1714;
  --paper: #252120;
  --ink: #e8e2d4;
  --ink-soft: #a8a196;
  --ink-faint: #6d685f;
  --rule: #3a342e;

  --nash: #e57667;
  --nash-soft: #6e3a32;
  --coop: #5fa8ae;
  --coop-soft: #2f4f52;
  --wedge: #d8a35a;
  --worker: #9aa8b5;
  --owner: #c9a875;
  --accent: #6ba3e8;
  --accent-hover: #8cb9ef;

  --chip-bg: rgba(107, 163, 232, 0.14);
  --chip-ink: #9cc3ef;

  --chart-axis: #5a544d;
  --chart-grid: #3a342e;
  --chart-grid-faint: #2e2925;
  --on-bar-light: #fffdf7;
  --on-bar-dark: #1a1714;

  --tint-highlight: #4a3d1c;
  --tint-nash-bg: #3a2422;
  --tint-nash-ink: #f0b5ac;
  --tint-coop-bg: #1f3a3d;
  --tint-coop-ink: #a8d4d6;
  --tier-low: #5a544a;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.45);

  color-scheme: dark;
}