/*
 * Design tokens.
 *
 * Every colour, size and font in the product resolves through a variable defined here. A
 * different deployment retargeting at a different audience swaps this one file — that is the
 * whole point of keeping the codebase niche-neutral, and it stops "just this once" hardcoded
 * values accumulating until a rebrand means touching every screen.
 *
 * The palette is the same Broadsheet one the issue template uses, so the site and the newspaper
 * it produces look like they belong to each other.
 */

:root {
  /* Broadsheet palette — newsprint grounds, ink-dark text, a muted rule */
  --page: #f4f1ea;
  --surface: #fbfaf6;
  --surface-raised: #ffffff;
  --ink: #1a1a1a;
  --ink-body: #2b2b2b;
  --ink-muted: #6b6b6b;
  --rule: #c9c2b4;
  --rule-strong: #a9a08c;

  --accent: #2f4f4f;
  --accent-text: #ffffff;
  --danger: #8b2f2f;
  --success: #2f6b3f;

  /* Georgia for anything editorial, a system stack for controls */
  --font-editorial: Georgia, "Times New Roman", serif;
  --font-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;

  --text-xs: 11px;
  --text-sm: 13px;
  --text-base: 15px;
  --text-lg: 18px;
  --text-xl: 24px;
  --text-masthead: 34px;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;

  --radius: 3px;
  --border: 1px solid var(--rule);
  --measure: 640px;

  --shadow-soft: 0 1px 2px rgba(26, 26, 26, 0.06);
}