/* GENERATED by tools/build_site.py from design/tokens.json. Do not edit by hand. */
:root {
  --surface-page: #F6F3EC;
  --surface-card: #FFFDF8;
  --surface-sunken: #ECE6D8;
  --border-hairline: #E2DBCB;
  --text-primary: #1C1B18;
  --text-secondary: #5E594F;
  --text-on-action: #F6F3EC;
  --text-on-together: #FFFFFF;
  --action-primary: #1E2A28;
  --person-you: #1E2A28;
  --person-partner: #4A6A8A;
  --together: #B5502E;
  --together-text: #8F3E22;
  --together-tint: #F3DDD2;
  --recovery-tint: #DDE6DA;
  --recovery-text: #1E2A28;
  --mark-miss: #7C766A;
  --waiting-outline: #5E594F;
  --focus-ring: #4A6A8A;
  --error-system: #8C3B2E;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-pill: 999px;
  --border-width: 1px;
  --size-button: 56px;
  --body-size: 17px;
  --body-line: 1.412;
  --small-size: 15px;
  --small-line: 1.333;
  --title-size: 28px;
  --title-line: 1.214;
}
@media (prefers-color-scheme: dark) {
  :root {
    --surface-page: #141513;
    --surface-card: #1D1F1C;
    --surface-sunken: #262923;
    --border-hairline: #34372F;
    --text-primary: #EDE8DD;
    --text-secondary: #B3AC9F;
    --text-on-action: #141513;
    --text-on-together: #141513;
    --action-primary: #EDE8DD;
    --person-you: #EDE8DD;
    --person-partner: #9FB7D0;
    --together: #E08A64;
    --together-text: #E8A98A;
    --together-tint: #2B1F19;
    --recovery-tint: #233128;
    --recovery-text: #CFE0D2;
    --mark-miss: #807A6D;
    --waiting-outline: #B3AC9F;
    --focus-ring: #9FB7D0;
    --error-system: #E8A090;
  }
}