:root, :root[data-theme="light"] {
  color-scheme: light;
  --color-brand: #0f6cbd;
  --color-brand-hover: #115ea3;
  --color-brand-strong: #0a4a82;
  --color-accent: #4f6bed;
  --color-bg: #f7f9fc;
  --color-surface: #ffffff;
  --color-surface-secondary: #eef2f8;
  --color-text: #1b1a19;
  --color-text-secondary: #605e5c;
  --color-border: #e1e4ea;
  --color-success: #107c10;
  --color-focus: #0f6cbd;
  --shadow-1: 0 1px 2px rgba(0,0,0,.08);
  --shadow-2: 0 4px 16px rgba(15,108,189,.10);
  --shadow-3: 0 12px 32px rgba(15,108,189,.14);
  --radius-small: 4px;
  --radius-medium: 8px;
  --radius-large: 12px;
  --spacing-1: .25rem;
  --spacing-2: .5rem;
  --spacing-3: .75rem;
  --spacing-4: 1rem;
  --spacing-6: 1.5rem;
  --spacing-8: 2rem;
  --spacing-12: 3rem;
  --spacing-16: 4rem;
  --font-stack: "Segoe UI", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  --max-width: 1160px;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --color-bg: #111418;
  --color-surface: #1b1e24;
  --color-surface-secondary: #252a33;
  --color-text: #f3f4f6;
  --color-text-secondary: #b8bcc4;
  --color-border: #2f3540;
  --shadow-1: 0 1px 2px rgba(0,0,0,.4);
  --shadow-2: 0 4px 16px rgba(0,0,0,.4);
  --shadow-3: 0 12px 32px rgba(0,0,0,.5);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]):not([data-theme="dark"]) {
    color-scheme: dark;
    --color-bg: #111418;
    --color-surface: #1b1e24;
    --color-surface-secondary: #252a33;
    --color-text: #f3f4f6;
    --color-text-secondary: #b8bcc4;
    --color-border: #2f3540;
    --shadow-1: 0 1px 2px rgba(0,0,0,.4);
    --shadow-2: 0 4px 16px rgba(0,0,0,.4);
    --shadow-3: 0 12px 32px rgba(0,0,0,.5);
  }
}