/**
 * Design tokens — sourced from Pencil file: twi-design.pen
 * Always use these variables. Never hardcode brand colors or fonts.
 */

:root {
  /* ── Colors ─────────────────────────────────────────── */
  --paper: #f4f1e9;
  --paper-deep: #ebe4d6;
  --ink: #16140e;
  --ink-70: #48453b;
  --ink-45: #7e796b;
  --accent: #b5542e;
  --accent-deep: #95401e;
  --dark: #17140d;
  --dark-elev: #221e15;
  --on-dark: #f4f1e9;
  --on-dark-soft: #b4ae9e;
  --hairline: #d9d3c4;
  --hairline-dark: #3b372b;

  /* Semi-transparent overlays used in design */
  --caption-bg: #16140eb8;

  /* ── Typography ─────────────────────────────────────── */
  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-body: "Inter", system-ui, -apple-system, sans-serif;

  /* ── Spacing ────────────────────────────────────────── */
  --page-margin: 100px;
  --section-y: 120px;
  --gap-lg: 40px;
  --radius: 8px;

  /* ── Layout ─────────────────────────────────────────── */
  --page-max: 1440px;
  --content-narrow: 640px;
  --content-mid: 780px;
  --content-wide: 940px;
  --content-max: 1120px;
}