:root {
  /* Brand palette */
  --colour-turquoise: #55cfc7;
  --colour-turquoise-deep: #35aaa4;
  --colour-turquoise-light: #e2f7f6;
  --colour-lavender: #eee6ff;
  --colour-lavender-deep: #7a61c9;
  --colour-peach: #ffd8c8;
  --colour-rose: #ff8fa3;
  --colour-mint: #e9fff8;
  --colour-sky: #edf7ff;

  /* Semantic colours */
  --colour-bg: #fbf9ff;
  --colour-surface: #ffffff;
  --colour-surface-soft: #f8f4ff;
  --colour-ink: #1b1640;
  --colour-muted: #706c89;
  --colour-line: #ece7f7;
  --colour-primary: var(--colour-turquoise);
  --colour-primary-strong: var(--colour-turquoise-deep);
  --colour-present: var(--colour-turquoise-deep);
  --colour-missing: #e46977;
  --colour-uncertain: #e5a444;

  /* Shape */
  --radius-small: 14px;
  --radius-medium: 22px;
  --radius-large: 34px;
  --radius-pill: 999px;

  /* Spacing */
  --space-1: 6px;
  --space-2: 10px;
  --space-3: 14px;
  --space-4: 18px;
  --space-5: 24px;
  --space-6: 32px;

  /* Type */
  --font-body: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-size-small: 0.82rem;
  --font-size-body: 1rem;
  --font-size-large: 1.18rem;
  --font-size-title: 1.65rem;

  /* Motion */
  --motion-fast: 160ms ease-out;

  /* Layout */
  --content-max-width: 520px;
  --thumb-zone-bottom: 96px;

  /* Shadow */
  --shadow-soft: 0 16px 42px rgba(91, 78, 138, 0.13);
  --shadow-button: 0 14px 28px rgba(53, 170, 164, 0.26);
  --shadow-button-lavender: 0 14px 28px rgba(91, 78, 138, 0.26);
  --shadow-button-danger: 0 14px 28px rgba(228, 105, 119, 0.22);
}