:root {
  color-scheme: light;
  --color-brand-50: #eefbfc;
  --color-brand-100: #d5f4f7;
  --color-brand-400: #34b8c4;
  --color-brand-600: #087f8c;
  --color-brand-700: #086773;
  --color-brand-900: #123f47;
  --color-accent: #dbe70f;
  --color-ink: #132f35;
  --color-muted: #557078;
  --color-surface: #ffffff;
  --color-canvas: #f6fafb;
  --color-line: #dbe7e9;
  --color-success: #176b4d;
  --shadow-sm: 0 0.5rem 1.5rem rgba(18, 63, 71, 0.08);
  --shadow-lg: 0 1.5rem 4rem rgba(18, 63, 71, 0.16);
  --radius-sm: 0.65rem;
  --radius-md: 1rem;
  --radius-lg: 1.5rem;
  --space-2xs: 0.25rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 5rem;
  --content: 74rem;
  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

[data-theme="calm"] {
  --color-brand-400: #63aeb8;
  --color-brand-600: #2b7480;
  --color-brand-700: #215e68;
  --color-accent: #cbdca5;
}

@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --color-ink: #eaf5f6;
    --color-muted: #a7c0c5;
    --color-surface: #102e34;
    --color-canvas: #0b2429;
    --color-line: #2b5057;
    --color-brand-50: #12383f;
    --color-brand-100: #19454c;
  }
}