:root {
  /* Colour */
  --bg: #faf6ef;
  --card: #fff;
  --fill-soft: #f3eee5;
  --ink: #2a2522;
  --ink-body: #5e554d;
  --muted: #8a7f75;
  --faint: #b2a89c;
  --disabled: #d4cbbe;
  --chevron: #c9bfb1;
  --good: #4f9d69;
  --bad: #d9634b;
  --none: #e3dbcd;
  --on-ink: #faf6ef;

  /* Typography */
  --font-sans: "Figtree", system-ui, sans-serif;
  --text-display: 36px;
  --text-title: 30px;
  --text-h2: 24px;
  --text-section: 17px;
  --text-metric: 15px;
  --text-body: 17px;
  --text-small: 13px;
  --text-micro: 12px;
  --text-label: 11px;
  --text-tiny: 10px;
  --text-note: 14px;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-black: 800;
  --tracking-display: -0.03em;
  --tracking-title: -0.02em;
  --tracking-label: 0.04em;
  --leading-tight: 1.1;
  --leading-body: 1.45;
  --leading-input: 24px;

  /* Spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-10: 40px;
  --space-6px: 6px;
  --space-10px: 10px;
  --space-14px: 14px;
  --space-18px: 18px;
  --space-22px: 22px;
  --screen-gutter: 20px;
  --screen-gutter-login: 24px;
  --space-2px: 2px;
  --space-3px: 3px;
  --space-1px: 1px;
  --space-5px: 5px;
  --login-bottom-space: 28vh;

  /* Radii */
  --radius-cell: 3px;
  --radius-button: 14px;
  --radius-card: 16px;
  --radius-card-lg: 18px;
  --radius-logo: 28px;
  --radius-round: 999px;

  /* Sizes */
  --tap-target: 44px;
  --control-round: 48px;
  --control-cta: 56px;
  --thumb-width: 60px;
  --thumb-height: 56px;
  --strip-cell-height: 30px;
  --strip-cell-gap: 3px;
  --logo-tile: 88px;
  --logo-mark: 20px;
  --logo-mark-large: 52px;
  --glyph-close: 22px;
  --glyph-arrow: 20px;
  --legend-swatch: 9px;
  --note-dot: 5px;
  --note-row-when-width: 52px;
  --glyph-chevron: 18px;
  --note-min-height: 64px;

  /* Shadows and rings */
  --shadow-card: 0 1px 0 rgba(42, 37, 34, 0.06);
  --shadow-cta: 0 8px 24px rgba(42, 37, 34, 0.18);
  --ring-today: 0 0 0 2px var(--bg), 0 0 0 3.5px var(--ink);
  --ring-focus: 0 0 0 2px var(--ink);
  --ring-error: 0 0 0 2px var(--bad);

  /* Motion */
  --transition-fill: background-color 150ms ease;
  --transition-press: transform 120ms ease;
  --press-scale: 0.98;
}