:root {
  /* Color */
  --paper:        #F4EFE6;
  --ink:          #1A1611;
  --ink-muted:    #6B6357;
  --accent:       #7A1C1C;
  --highlight:    #E8DCC4;
  --rule:         #C9C0B0;

  /* Typography */
  --font-display: 'Newsreader', Georgia, 'Times New Roman', serif;
  --font-body:    'Newsreader', Georgia, 'Times New Roman', serif;
  --font-meta:    'IBM Plex Mono', ui-monospace, monospace;

  /* Type scale */
  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1.0625rem;
  --text-lg:   1.375rem;
  --text-xl:   1.75rem;
  --text-2xl:  2.25rem;
  --text-3xl:  3rem;

  /* Leading */
  --leading-tight:   1.1;
  --leading-normal:  1.45;
  --leading-relaxed: 1.65;

  /* Spacing */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2rem;
  --space-6: 3rem;
  --space-7: 5rem;

  /* Layout */
  --measure:       65ch;
  --measure-wide:  100ch;
  --radius:        0;
  --rule-thin:     1px;
  --rule-heavy:    3px;
}

/* ── Dark theme: "manuscript at night on dark warm paper" ────────────
   Overrides only the 6 color tokens. All other tokens (type, spacing,
   layout) are inherited from :root. Because every color in app.css
   uses var(--...), redeclaring these 6 tokens here is sufficient to
   repaint the entire UI. No hardcoded hex should exist in app.css.
   ──────────────────────────────────────────────────────────────────── */
body.theme-dark {
  --paper:      #1A1714;  /* very dark warm brown-black */
  --ink:        #E8DCC4;  /* cream — same value as light-theme --highlight */
  --ink-muted:  #9C9180;  /* warm gray-brown for meta info */
  --accent:     #C94B4B;  /* oxblood lifted for legibility on dark paper */
  --highlight:  #3A3328;  /* dim warm brown for hover states */
  --rule:       #3D3631;  /* barely-lighter than paper for dividers */
}