:root {
  --color-primary: #111111;
  --color-primary-text: #FFFFFF;
  --color-background: #FFFFFF;
  --color-surface: #F7F7F8;
  --color-border: #E5E5E7;
  --color-text: #1A1A1A;
  --color-text-muted: #6B6B70;
  --color-accent: #2563EB;
  --color-success: #16A34A;
  --color-warning: #D97706;
  --color-danger: #DC2626;
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --shadow-card: 0 1px 2px rgba(0,0,0,0.04), 0 1px 8px rgba(0,0,0,0.03);
  --font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color-scheme: light;
}

html[data-theme="dark"] {
  --color-primary: #FFFFFF;
  --color-primary-text: #111111;
  --color-background: #0B0B0C;
  --color-surface: #18181B;
  --color-border: #2A2A2E;
  --color-text: #F2F2F3;
  --color-text-muted: #9A9AA0;
  --color-accent: #60A5FA;
  --color-success: #4ADE80;
  --color-warning: #FBBF24;
  --color-danger: #F87171;
  --shadow-card: 0 1px 2px rgba(0,0,0,0.3), 0 1px 8px rgba(0,0,0,0.2);
  color-scheme: dark;
}

body {
  transition: background-color 0.15s ease, color 0.15s ease;
}