:root {
    --brand-near-black: #0b0013;
    --brand-off-white: #f9f7fc;
    --brand-deep-purple: #25003d;
    --brand-primary-purple: #6734c2;
    --brand-soft-violet: #b493ef;

    --font-sans: "Geist", "Avenir Next", "Segoe UI", Helvetica, Arial, sans-serif;
    --font-accent: "Michroma", "Eurostile", "Bank Gothic", "Segoe UI", sans-serif;
    --font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;

    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;
    --space-16: 4rem;

    --radius-control: 6px;
    --radius-surface: 8px;
    --radius-panel: 10px;
    --border-width: 1px;
    --content-width: 72rem;
    --focus-ring: 0 0 0 3px rgba(103, 52, 194, 0.28);
}

html[data-theme="light"] {
    color-scheme: light;
    --page-background: #f9f7fc;
    --page-grid: rgba(11, 0, 19, 0.035);
    --surface-primary: #ffffff;
    --surface-secondary: #f3f1f4;
    --surface-elevated: #ffffff;
    --text-primary: #0b0013;
    --text-secondary: #504b53;
    --text-tertiary: #716b74;
    --border-subtle: #ded9e1;
    --border-strong: #bdb6c2;
    --accent: #6734c2;
    --accent-strong: #4f259b;
    --button-primary-hover: #4f259b;
    --accent-soft: #e8dcf8;
    --accent-text: #3c176f;
    --danger: #9f2135;
    --danger-surface: #f8e5e9;
    --success: #176844;
    --success-surface: #e1f2e9;
    --shadow-panel: 0 12px 30px rgba(11, 0, 19, 0.07);
    --structure-background: #0b0013;
    --drawer-background: #0b0013;
    --drawer-border: #2c2431;
    --drawer-text: #f9f7fc;
    --drawer-muted: #aaa1ae;
    --navigation-hover: rgba(249, 247, 252, 0.07);
    --navigation-active: rgba(180, 147, 239, 0.16);
    --navigation-indicator: #b493ef;
    --topbar-background: rgba(255, 255, 255, 0.94);
    --selected-surface: #f0e8fb;
    --metric-accent: #6734c2;
    --workspace-background: #f9f7fc;
    --panel-primary: #ffffff;
    --panel-secondary: #f4f3f5;
    --panel-elevated: #ffffff;
    --panel-border: #ddd9e0;
    --control-surface: #ffffff;
    --control-border: #bdb8c1;
    --metric-surface: #ffffff;
    --greeting-surface: #ffffff;
    --greeting-accent: #f1ebf8;
    --workspace-topbar: rgba(255, 255, 255, 0.94);
}

html[data-theme="dark"],
html[data-theme="system"] {
    color-scheme: dark;
    --page-background: #0b0013;
    --page-grid: rgba(249, 247, 252, 0.035);
    --surface-primary: #141217;
    --surface-secondary: #1a171d;
    --surface-elevated: #1f1b22;
    --text-primary: #f9f7fc;
    --text-secondary: #c6c1c9;
    --text-tertiary: #9d969f;
    --border-subtle: #302b35;
    --border-strong: #4b444f;
    --accent: #b493ef;
    --accent-strong: #c9adfa;
    --button-primary-hover: #7842bd;
    --accent-soft: #2c1542;
    --accent-text: #e9dcff;
    --danger: #ffadb9;
    --danger-surface: #35131e;
    --success: #78d6ad;
    --success-surface: #102d23;
    --shadow-panel: 0 18px 44px rgba(0, 0, 0, 0.28);
    --structure-background: #07040a;
    --drawer-background: #07040a;
    --drawer-border: #27222b;
    --drawer-text: #f9f7fc;
    --drawer-muted: #aaa2ad;
    --navigation-hover: rgba(249, 247, 252, 0.06);
    --navigation-active: rgba(180, 147, 239, 0.14);
    --navigation-indicator: #b493ef;
    --topbar-background: rgba(11, 0, 19, 0.94);
    --selected-surface: #24192d;
    --metric-accent: #b493ef;
    --workspace-background: #0b0a0d;
    --panel-primary: #151416;
    --panel-secondary: #1c1a1d;
    --panel-elevated: #211f22;
    --panel-border: #343137;
    --control-surface: #111012;
    --control-border: #4a464d;
    --metric-surface: #151416;
    --greeting-surface: #121113;
    --greeting-accent: #211927;
    --workspace-topbar: rgba(11, 10, 13, 0.94);
}

@media (prefers-color-scheme: light) {
    html[data-theme="system"] {
        color-scheme: light;
        --page-background: #f9f7fc;
        --page-grid: rgba(11, 0, 19, 0.035);
        --surface-primary: #ffffff;
        --surface-secondary: #f3f1f4;
        --surface-elevated: #ffffff;
        --text-primary: #0b0013;
        --text-secondary: #504b53;
        --text-tertiary: #716b74;
        --border-subtle: #ded9e1;
        --border-strong: #bdb6c2;
        --accent: #6734c2;
        --accent-strong: #4f259b;
        --button-primary-hover: #4f259b;
        --accent-soft: #e8dcf8;
        --accent-text: #3c176f;
        --danger: #9f2135;
        --danger-surface: #f8e5e9;
        --success: #176844;
        --success-surface: #e1f2e9;
        --shadow-panel: 0 12px 30px rgba(11, 0, 19, 0.07);
        --structure-background: #0b0013;
        --drawer-background: #0b0013;
        --drawer-border: #2c2431;
        --drawer-text: #f9f7fc;
        --drawer-muted: #aaa1ae;
        --navigation-hover: rgba(249, 247, 252, 0.07);
        --navigation-active: rgba(180, 147, 239, 0.16);
        --navigation-indicator: #b493ef;
        --topbar-background: rgba(255, 255, 255, 0.94);
        --selected-surface: #f0e8fb;
        --metric-accent: #6734c2;
        --workspace-background: #f9f7fc;
        --panel-primary: #ffffff;
        --panel-secondary: #f4f3f5;
        --panel-elevated: #ffffff;
        --panel-border: #ddd9e0;
        --control-surface: #ffffff;
        --control-border: #bdb8c1;
        --metric-surface: #ffffff;
        --greeting-surface: #ffffff;
        --greeting-accent: #f1ebf8;
        --workspace-topbar: rgba(255, 255, 255, 0.94);
    }
}
