:root {
  --bg: #faf8f3;
  --surface: #ffffff;
  --fg: #292721;
  --muted: #64615c;
  --brand: #9e462d;
  --brand-hover: #7c341f;
  --brand-soft: #f4e7df;
  --border: #ddd9d1;
  --focus: #175a91;
  --radius: 18px;
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 32px;
  --space-5: 48px;
  --space-6: 64px;
  --reading-width: 70ch;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #1a1714;
    --surface: #24201d;
    --fg: #f2ece5;
    --muted: #bdb5ad;
    --brand: #f29c7d;
    --brand-hover: #ffc3a8;
    --brand-soft: #3b2922;
    --border: #51473f;
    --focus: #8ac6ff;
  }
}