/* Design tokens: colors, radius, font. Every other stylesheet uses these. */
:root {
  --bg: #f6f6f4;
  --surface: #ffffff;
  --surface-2: #f0f0ec;
  --border: #e2e2dc;
  --text: #1c1c1a;
  --muted: #6b6b66;
  --accent: #2f5bea;
  --accent-soft: #e6ecfd;
  --on-accent: #ffffff;
  --ok: #1f8a4c;
  --warn: #c7860e;
  --bad: #c43d3d;
  --male: #2f7fd1;
  --female: #d1457a;
  --img: #8a5cd6;
  --video: #2f5bea;
  --radius: 10px;
  --radius-sm: 8px;
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, sans-serif;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #131312;
    --surface: #1c1c1a;
    --surface-2: #252523;
    --border: #33332f;
    --text: #ededea;
    --muted: #9a9a94;
    --accent: #6f8ff5;
    --accent-soft: #232b45;
  }
}