:root {
    /* Light theme (default) */
    --bg: #FAFAFB;
    --panel: #ffffff;
    --panel-2: #F7F8FA;
    --elev: #ffffff;
    --text: #111827;
    --muted: #667085;
    --accent: #2F5BFF;
    --accent-2: #244BE6;
    --ok: #22c55e;
    --warn: #f59e0b;
    --danger: #ef4444;
    --chip: #EEF2FF;
    --border: #E7EAF0;
    --border-2: #E7EAF0;
    --input-bg: #ffffff;
    --hover: #EEF2FF;
    --hover-strong: #E7EAF0;
    --focus-border: #2F5BFF;
    --focus-ring: rgba(47, 91, 255, 0.18);
    --button-bg: #F5F7FA;
    --button-hover: #ECEEF3;
    --accent-border: rgba(47, 91, 255, 0.22);

    --shadow: 0 1px 3px rgba(16, 24, 40, 0.06), 0 4px 12px rgba(16, 24, 40, 0.04);
    --shadow-md: 0 4px 20px rgba(16, 24, 40, 0.08), 0 1px 4px rgba(16, 24, 40, 0.04);
    --radius: 12px;
    --radius-sm: 9px;
    --radius-xs: 7px;
}

/* Dark theme */
:root[data-theme="dark"] {
    --bg: #0f1216;
    --panel: #141922;
    --panel-2: #171d27;
    --elev: #0c1016;
    --muted: #a9b1bc;
    --text: #e9edf3;
    --accent: #4e9cff;
    --accent-2: #6dd6ff;
    --ok: #2ec27e;
    --warn: #e5b567;
    --danger: #ff6b6b;
    --chip: #1e2531;
    --border: #1e2633;
    --border-2: #202a3a;
    --input-bg: #0f141c;
    --hover: #1a2230;
    --hover-strong: #141b27;
    --focus-border: #385275;
    --focus-ring: rgba(78, 156, 255, 0.18);
    --button-bg: #1a2230;
    --button-hover: #1f2938;
    --accent-border: rgba(78, 156, 255, 0.35);

    --shadow: 0 1px 2px rgb(0 0 0 / 0.4), 0 8px 28px rgb(0 0 0 / 0.3);
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    font-family: ui-sans-serif, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
    color: var(--text);
    background: var(--bg);
}

html[data-theme="dark"] body {
    background: radial-gradient(1200px 800px at 10% -10%, #19202b 0%, transparent 60%) no-repeat, var(--bg);
}

:root:not([data-theme="dark"]) .app-brand .st2 {
    fill: #121D3D;
}

:root[data-theme="light"] {
    /* Redundant when light is default, kept for clarity */
    --bg: #FAFAFB;
    --panel: #ffffff;
    --panel-2: #F7F8FA;
    --elev: #ffffff;
    --text: #111827;
    --muted: #667085;
    --chip: #EEF2FF;
    --border: #E7EAF0;
    --border-2: #E7EAF0;
    --input-bg: #ffffff;
    --hover: #EEF2FF;
    --hover-strong: #E7EAF0;
    --focus-border: #2F5BFF;
    --focus-ring: rgba(47, 91, 255, 0.18);
    --button-bg: #F5F7FA;
    --button-hover: #ECEEF3;
    --accent: #2F5BFF;
    --accent-2: #244BE6;
    --accent-border: rgba(47, 91, 255, 0.22);
}