:root {
  --color-primary: #5B6BF0;
  --color-primary-hover: #4A58D6;
  --color-accent: #7B61FF;
  --color-background: #ffffff;
  --color-surface: #f8f9fc;
  --color-surface-alt: #eef1f8;
  --color-text: #1a1d29;
  --color-muted: #6b7280;
  --color-border: #d8dee9;
  --color-success: #10b981;
  --color-error: #ef4444;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.08);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.12);
  --transition-fast: 150ms ease;
  --transition-normal: 250ms ease;
  --container-width: 1200px;
}
[data-theme="dark"] {
  --color-background: #12141c;
  --color-surface: #1a1e29;
  --color-surface-alt: #242836;
  --color-text: #eef2f6;
  --color-muted: #9aa3b2;
  --color-border: #2e3442;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.4);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.5);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.6);
}