/* Design tokens: the only place colours, type, spacing and motion are defined. */
:root {
  --color-bg: #f6f4ef;
  --color-surface: #ffffff;
  --color-text: #26302d;
  --color-muted: #6a746f;
  --color-line: #e4e0d6;
  --color-accent: #3f7d6e;
  --color-accent-soft: #e3efeb;
  --color-accent-ink: #ffffff;
  --color-save: #3f7d6e;
  --color-spend: #c28a4a;
  --color-give: #7b6fa8;
  --color-pending-bg: #f6ecd9;
  --color-pending-ink: #7a5a1f;
  --color-ok-bg: #e3efeb;

  --font-body: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --size-small: 0.85rem;
  --size-body: 1rem;
  --size-h2: 1.1rem;
  --size-hero: 3rem;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 40px;
  --radius: 14px;
  --radius-sm: 8px;
  --measure: 640px;

  --motion: 160ms ease;
}
@media (prefers-reduced-motion: reduce) { :root { --motion: 0ms; } }