:root {
  /* ---- Canvas & ink ---- */
  --paper: #FAF8F4;
  --paper-raised: #FFFFFF;
  --ink: #1C1A16;
  --ink-soft: #57534A;
  --ink-faint: #8C8678;
  --hairline: #E4DFD4;
  --hairline-strong: #D2CBBB;

  /* ---- Accent (quiet matcha) ---- */
  --accent: #5C7A52;
  --accent-deep: #435C3B;
  --accent-tint: #EAEFE3;

  /* ---- Semantic ---- */
  --success: #4C7A4F;
  --warn: #B9793B;
  --danger: #B8493C;

  /* ---- Type ---- */
  --font-display: "Fraunces", "Iowan Old Style", Georgia, serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  /* ---- Type scale (fluid) ---- */
  --fs-xs: 0.8125rem;
  --fs-sm: 0.9375rem;
  --fs-base: 1rem;
  --fs-md: 1.125rem;
  --fs-lg: 1.375rem;
  --fs-xl: clamp(1.75rem, 1.5rem + 1.2vw, 2.5rem);
  --fs-2xl: clamp(2.25rem, 1.8rem + 2vw, 3.5rem);
  --fs-3xl: clamp(2.75rem, 2rem + 3.5vw, 5.25rem);

  /* ---- Spacing (8pt-ish scale) ---- */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 3rem;
  --sp-8: 4.5rem;
  --sp-9: 6.5rem;
  --sp-10: 9rem;

  /* ---- Layout ---- */
  --content-max: 1240px;
  --content-narrow: 760px;
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 22px;
  --radius-pill: 999px;

  /* ---- Motion ---- */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-soft: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast: 180ms;
  --dur-med: 420ms;
  --dur-slow: 720ms;

  /* ---- Shadow (used sparingly) ---- */
  --shadow-sm: 0 1px 2px rgba(28, 26, 22, 0.06);
  --shadow-md: 0 8px 30px rgba(28, 26, 22, 0.08);
  --shadow-lg: 0 24px 60px rgba(28, 26, 22, 0.12);

  color-scheme: light;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 0ms;
    --dur-med: 0ms;
    --dur-slow: 0ms;
  }
}