/* Design tokens. Dark is the default; [data-theme="light"] overrides. */

:root {
    --color-bg: #0e1116;
    --color-bg-elevated: #151a21;
    --color-bg-elevated-hover: #1a2029;
    --color-bg-inset: #0a0d12;
    --color-border: #232b36;
    --color-border-strong: #303a47;

    --color-text: #dde3ea;
    --color-text-muted: #8d99a7;
    --color-text-faint: #5f6b79;

    --color-accent: #5b9dd9;
    --color-accent-strong: #82b6e4;
    --color-accent-muted: rgba(91, 157, 217, 0.10);
    --color-accent-border: rgba(91, 157, 217, 0.35);

    --color-success: #4cae7f;
    --color-warning: #cfa14e;
    --color-danger: #d4595e;
    --color-info: #5b9dd9;

    --color-success-bg: rgba(76, 174, 127, 0.12);
    --color-warning-bg: rgba(207, 161, 78, 0.12);
    --color-danger-bg: rgba(212, 89, 94, 0.12);
    --color-info-bg: rgba(91, 157, 217, 0.12);

    --shadow-elevated: 0 8px 24px rgba(0, 0, 0, 0.4);
    --shadow-overlay: 0 16px 48px rgba(0, 0, 0, 0.55);

    --font-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --font-mono: ui-monospace, "Cascadia Code", "JetBrains Mono", Consolas, Menlo, monospace;
    --font-display: "Chakra Petch", "Segoe UI", -apple-system, sans-serif;

    --font-size-xs: 11px;
    --font-size-sm: 12px;
    --font-size-base: 13px;
    --font-size-md: 15px;
    --font-size-lg: 18px;
    --font-size-xl: 24px;

    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 24px;
    --space-6: 32px;
    --space-7: 48px;

    --radius-sm: 4px;
    --radius-md: 7px;
    --radius-lg: 10px;
    --radius-full: 999px;

    --transition-fast: 0.12s ease;
    --transition-base: 0.2s ease;

    --rail-width: 240px;
    --header-height: 48px;
    --z-header: 100;
    --z-sidebar: 90;
    --z-toast: 300;
    --z-palette: 400;
}

html[data-theme="light"] {
    --color-bg: #f5f6f8;
    --color-bg-elevated: #ffffff;
    --color-bg-elevated-hover: #f0f2f4;
    --color-bg-inset: #eef0f3;
    --color-border: #dde2e8;
    --color-border-strong: #c5cdd6;

    --color-text: #1a2027;
    --color-text-muted: #505b66;
    --color-text-faint: #7e8892;

    --color-accent: #2b6cb0;
    --color-accent-strong: #1f568c;
    --color-accent-muted: rgba(43, 108, 176, 0.08);
    --color-accent-border: rgba(43, 108, 176, 0.35);

    --color-success: #2e8b60;
    --color-warning: #9c7420;
    --color-danger: #bb3f44;
    --color-info: #2b6cb0;

    --color-success-bg: rgba(46, 139, 96, 0.10);
    --color-warning-bg: rgba(156, 116, 32, 0.10);
    --color-danger-bg: rgba(187, 63, 68, 0.10);
    --color-info-bg: rgba(43, 108, 176, 0.10);

    --shadow-elevated: 0 8px 24px rgba(20, 24, 28, 0.10);
    --shadow-overlay: 0 16px 48px rgba(20, 24, 28, 0.16);
}