:root {
  /* Typography — all Inter. Serif reserved for accent (numbers, key titles). */
  --font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-display: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-accent: 'Instrument Serif', 'Iowan Old Style', 'Apple Garamond', 'Times New Roman', serif;

  /* Surfaces */
  --c-bg: #FBFAF7;            /* very soft warm white — Notion-ish */
  --c-bg-soft: #F4F2ED;       /* hover / subtle fill */
  --c-bg-elev: #FFFFFF;
  --c-text: #14131A;          /* near black with warm undertone */
  --c-text-muted: #56525F;
  --c-text-soft: #8E8A97;
  --c-border: #EAE7DF;
  --c-border-strong: #D7D2C7;
  --c-border-subtle: #F2EFE9;

  /* Brand — restrained indigo */
  --c-primary: #3C37B3;
  --c-primary-dark: #2A256B;
  --c-primary-soft: #EEEDF9;

  /* Accent/state — muted */
  --c-success: #1F8A4D;
  --c-success-soft: #E7F2EC;
  --c-warning: #B67A16;
  --c-warning-soft: #F6ECD7;
  --c-danger: #B83B3B;
  --c-danger-soft: #F5E4E4;

  /* Phase palette — refined, museum-like, not candy */
  --c-p1: #3A7DB3;  --c-p1-dark: #295881;  --c-p1-soft: #E8EFF5;
  --c-p2: #0E847C;  --c-p2-dark: #0A5F59;  --c-p2-soft: #E1EFED;
  --c-p3: #2E8A4E;  --c-p3-dark: #1A6533;  --c-p3-soft: #E5F0E9;
  --c-p4: #B37A12;  --c-p4-dark: #815606;  --c-p4-soft: #F3EADA;
  --c-p5: #B35F2A;  --c-p5-dark: #7F4013;  --c-p5-soft: #F2E6DB;
  --c-p6: #A63A3A;  --c-p6-dark: #7A1F1F;  --c-p6-soft: #F1E0E0;
  --c-p7: #5841A8;  --c-p7-dark: #3E2C82;  --c-p7-soft: #EBE7F5;

  /* Radii — Apple/Obsidian-ish, crisp */
  --r-xs: 4px;
  --r-sm: 6px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-xl: 16px;
  --r-pill: 999px;

  /* Shadows — minimal, paper-like */
  --sh-xs: 0 1px 0 rgba(0, 0, 0, 0.04);
  --sh-sm: 0 1px 2px rgba(20, 19, 26, 0.05), 0 0 0 1px rgba(20, 19, 26, 0.02);
  --sh-md: 0 2px 8px -2px rgba(20, 19, 26, 0.08), 0 0 0 1px rgba(20, 19, 26, 0.03);
  --sh-lg: 0 8px 28px -8px rgba(20, 19, 26, 0.14), 0 0 0 1px rgba(20, 19, 26, 0.04);

  /* Motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.26, 0.64, 1);
  --dur-fast: 100ms;
  --dur: 180ms;
  --dur-slow: 320ms;

  --maxw: 740px;
  --maxw-wide: 960px;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 0ms;
    --dur: 0ms;
    --dur-slow: 0ms;
  }
  *, *::before, *::after {
    animation-duration: 0ms !important;
    animation-delay: 0ms !important;
    transition-duration: 0ms !important;
  }
}