/* Design tokens — the single source of truth for colour, type and spacing. */
:root {
  /* Brand colours */
  --cream: #F2EDE5;
  --panel: #ffffff;
  --panel-alt: #FAF5F5;
  --ink: #1c1a16;
  --text-soft: #45413a;
  --text-mute: #5b564c;
  --muted: #8a8475;
  --muted-2: #9a9384;

  --red: #8B1A28;
  --red-dark: #5A0D1A;
  --gold: #B8904C;
  --gold-light: #D4AA6A;
  --gold-ink: #a07c1f;

  --maroon: #1C0810;   /* dark sections */
  --maroon-2: #120608; /* footer */
  --cream-dim: #C4AAAA; /* light text on dark */

  --border: #E5D5D5;
  --border-2: #D4C4C4;
  --green: #1a7d5a;
  --amber: #B8681A;

  /* Type families */
  --serif: 'Spectral', Georgia, serif;
  --sans: 'IBM Plex Sans', system-ui, -apple-system, sans-serif;
  --mono: 'IBM Plex Mono', monospace;
  --display: 'Cinzel', serif;

  /* Radii */
  --r-sm: 8px;
  --r: 12px;
  --r-lg: 16px;

  /* Layout widths */
  --container: 1180px;
  --narrow: 820px;

  /* Accent (was a Design Component prop) */
  --accent: var(--gold);
}