:root,
[data-theme="light"] {
    color-scheme: light;

    --color-bg: #ffffff;
    --color-bg-soft: #f8fafc;
    --color-bg-muted: #f1f5f9;
    --color-surface: #ffffff;
    --color-surface-alt: #f8fafc;
    --color-surface-raised: #eef2ff;

    --color-text: #1e293b;
    --color-text-secondary: #64748b;
    --color-text-muted: #94a3b8;
    --color-text-inverse: #ffffff;

    --color-border: #e2e8f0;
    --color-border-strong: #cbd5e1;

    --color-primary: #6366f1;
    --color-primary-hover: #4f46e5;
    --color-primary-soft: #e0e7ff;
    --color-secondary: #ec4899;
    --color-accent: #4ecdc4;
    --color-success: #22c55e;
    --color-warning: #f59e0b;
    --color-danger: #ef4444;
}

[data-theme="dark"] {
    color-scheme: dark;

    --color-bg: #0f172a;
    --color-bg-soft: #111c34;
    --color-bg-muted: #1e293b;
    --color-surface: #1e293b;
    --color-surface-alt: #243247;
    --color-surface-raised: #312e81;

    --color-text: #f8fafc;
    --color-text-secondary: #cbd5e1;
    --color-text-muted: #94a3b8;
    --color-text-inverse: #0f172a;

    --color-border: #334155;
    --color-border-strong: #475569;

    --color-primary: #818cf8;
    --color-primary-hover: #a78bfa;
    --color-primary-soft: rgba(99, 102, 241, 0.18);
    --color-secondary: #f472b6;
    --color-accent: #2dd4bf;
    --color-success: #34d399;
    --color-warning: #fbbf24;
    --color-danger: #f87171;
}