:root {
  color-scheme: light dark;
  --ui-page: #fcfcfb;
  --ui-surface: #f4f3ef;
  --ui-surface-strong: #e9e7e0;
  --ui-text: #1d1f1e;
  --ui-text-muted: #656966;
  --ui-border: #d9d9d4;
  --ui-accent: #176e54;
  --ui-accent-text: #ffffff;
  --ui-focus: #176e54;
  --ui-font-body: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ui-font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --ui-content-width: 46rem;
  --ui-header-height: 4.25rem;
  --ui-radius: .25rem;
  --ui-space-page: clamp(1.1rem, 5vw, 4rem);
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --ui-page: #171918;
  --ui-surface: #202321;
  --ui-surface-strong: #2b2f2c;
  --ui-text: #f2f3ef;
  --ui-text-muted: #aaafa9;
  --ui-border: #343936;
  --ui-accent: #71d5b0;
  --ui-accent-text: #10261e;
  --ui-focus: #71d5b0;
}

:root[data-theme="light"] {
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ui-page: #171918;
    --ui-surface: #202321;
    --ui-surface-strong: #2b2f2c;
    --ui-text: #f2f3ef;
    --ui-text-muted: #aaafa9;
    --ui-border: #343936;
    --ui-accent: #71d5b0;
    --ui-accent-text: #10261e;
    --ui-focus: #71d5b0;
  }
}