:root {
  --color-primary: #2f5fd9;
  --color-primary-hover: #2650b8;
  --color-primary-light: #eaf0fd;
  --color-primary-text: #ffffff;

  --color-success: #17864f;
  --color-success-light: #e6f6ee;
  --color-danger: #d33d3d;
  --color-danger-light: #fbeaea;
  --color-warning: #b5740b;
  --color-warning-light: #fdf3e2;
  --color-info: #0b7ea6;
  --color-info-light: #e6f5fa;

  --color-bg: #f4f5f7;
  --color-surface: #ffffff;
  --color-surface-alt: #eef0f3;
  --color-border: #d8dce3;
  --color-border-strong: #b8bfcc;

  --color-text: #1b1f27;
  --color-text-secondary: #5c6370;
  --color-text-muted: #6b7280;
  --color-text-inverse: #ffffff;

  --sidebar-bg: #171b26;
  --sidebar-text: #b6bcca;
  --sidebar-text-active: #ffffff;
  --sidebar-active-bg: #262c3d;
  --sidebar-border: #262c3a;

  --radius-sm: 5px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-full: 999px;

  --shadow-xs: 0 1px 2px rgba(20, 24, 33, 0.06);
  --shadow-sm: 0 1px 3px rgba(20, 24, 33, 0.08), 0 1px 2px rgba(20, 24, 33, 0.05);
  --shadow-md: 0 4px 12px rgba(20, 24, 33, 0.10);
  --shadow-lg: 0 12px 32px rgba(20, 24, 33, 0.16);

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 28px;
  --space-7: 36px;
  --space-8: 48px;

  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Inter", Helvetica, Arial, sans-serif;
  --font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;

  --text-xs: 0.75rem;
  --text-sm: 0.8125rem;
  --text-base: 0.9375rem;
  --text-md: 1.0625rem;
  --text-lg: 1.25rem;
  --text-xl: 1.5rem;
  --text-2xl: 1.875rem;

  --header-h: 60px;
  --sidebar-w: 232px;
  --transition-fast: 120ms ease;
  --transition-base: 180ms ease;

  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-bg: #12141a;
    --color-surface: #1a1d25;
    --color-surface-alt: #21242e;
    --color-border: #2b2f3a;
    --color-border-strong: #3a3f4c;

    --color-text: #e9eaee;
    --color-text-secondary: #a3a8b5;
    --color-text-muted: #767c8a;

    --color-primary-light: #1c2740;
    --color-success-light: #12291f;
    --color-danger-light: #331c1c;
    --color-warning-light: #332a15;
    --color-info-light: #122a33;

    --sidebar-bg: #0d0f15;
    --sidebar-border: #1f232d;

    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --color-bg: #12141a;
  --color-surface: #1a1d25;
  --color-surface-alt: #21242e;
  --color-border: #2b2f3a;
  --color-border-strong: #3a3f4c;

  --color-text: #e9eaee;
  --color-text-secondary: #a3a8b5;
  --color-text-muted: #767c8a;

  --color-primary-light: #1c2740;
  --color-success-light: #12291f;
  --color-danger-light: #331c1c;
  --color-warning-light: #332a15;
  --color-info-light: #122a33;

  --sidebar-bg: #0d0f15;
  --sidebar-border: #1f232d;

  color-scheme: dark;
}