:root {
  color-scheme: light;
  --color-primary: #2756a8;
  --color-primary-hover: #1f478e;
  --color-primary-soft: #eaf0fb;
  --color-background: #f4f6f9;
  --color-surface: #fff;
  --color-surface-secondary: #f8fafc;
  --table-row-odd: var(--color-surface);
  --table-row-even: #f0f3f8;
  --table-row-hover: #e4eaf2;
  --color-text: #172033;
  --color-text-muted: #657189;
  --color-border: #dfe5ed;
  --color-success: #17794f;
  --color-success-soft: #e8f5ed;
  --color-warning: #956000;
  --color-warning-soft: #fff4da;
  --color-danger: #b33a42;
  --color-danger-soft: #fdebed;
  --color-info: #27658f;
  --color-info-soft: #e9f4fb;
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --radius-sm: .375rem;
  --radius-md: .625rem;
  --radius-lg: .875rem;
  --radius-xl: 1.125rem;
  --shadow-sm: 0 1px 2px rgb(20 35 60 / 5%);
  --shadow-md: 0 8px 24px rgb(20 35 60 / 9%);
  --font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-size-xs: .75rem;
  --font-size-sm: .875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.375rem;
  --font-size-2xl: 1.75rem;
  --transition-fast: 140ms ease;
  --transition-normal: 220ms ease;
  --sidebar-width: 16.5rem;
  --topbar-height: 3.5rem;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --color-primary: #91b5ff;
  --color-primary-hover: #b1caff;
  --color-primary-soft: #263956;
  --color-background: #111722;
  --color-surface: #192230;
  --color-surface-secondary: #202b3b;
  --table-row-odd: var(--color-surface);
  --table-row-even: #202b3b;
  --table-row-hover: #29374a;
  --color-text: #edf2fb;
  --color-text-muted: #a2aec2;
  --color-border: #344155;
  --color-success: #75d6a7;
  --color-success-soft: #1c3b31;
  --color-warning: #f2c46c;
  --color-warning-soft: #42351e;
  --color-danger: #ff9da2;
  --color-danger-soft: #48272d;
  --color-info: #8dcaf0;
  --color-info-soft: #203a4c;
  --shadow-sm: 0 1px 2px rgb(0 0 0 / 20%);
  --shadow-md: 0 8px 24px rgb(0 0 0 / 28%);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --color-primary: #91b5ff;
    --color-primary-hover: #b1caff;
    --color-primary-soft: #263956;
    --color-background: #111722;
    --color-surface: #192230;
    --color-surface-secondary: #202b3b;
    --table-row-odd: var(--color-surface);
    --table-row-even: #202b3b;
    --table-row-hover: #29374a;
    --color-text: #edf2fb;
    --color-text-muted: #a2aec2;
    --color-border: #344155;
    --color-success: #75d6a7;
    --color-success-soft: #1c3b31;
    --color-warning: #f2c46c;
    --color-warning-soft: #42351e;
    --color-danger: #ff9da2;
    --color-danger-soft: #48272d;
    --color-info: #8dcaf0;
    --color-info-soft: #203a4c;
  }
}