/* tokens.css — Design tokens (single source of truth, mirrors DESIGN.md) */

:root {
    /* Background */
    --bg-base: #08090a;
    --bg-surface: #0e0f10;
    --bg-elevated: #141516;
    --bg-overlay: #1a1b1c;
    --bg-input: #0a0b0c;

    /* Border */
    --border-default: rgba(255, 255, 255, 0.06);
    --border-strong: rgba(255, 255, 255, 0.10);
    --border-accent: rgba(94, 106, 210, 0.40);

    /* Text */
    --text-primary: #f7f8f8;
    --text-secondary: #b4b8be;
    --text-tertiary: #8a8f98;
    --text-muted: #62666d;
    --text-disabled: #3e4145;

    /* Accent */
    --accent: #5e6ad2;
    --accent-hover: #7170ff;
    --accent-active: #4f5bc4;
    --accent-soft: rgba(94, 106, 210, 0.12);

    /* Status */
    --success: #4cb782;
    --success-soft: rgba(76, 183, 130, 0.12);
    --danger: #eb5757;
    --danger-soft: rgba(235, 87, 87, 0.12);
    --warning: #f2c94c;
    --warning-soft: rgba(242, 201, 76, 0.12);
    --info: #56a8f5;
    --info-soft: rgba(86, 168, 245, 0.12);

    /* Typography */
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
    --font-mono: 'JetBrains Mono', 'SF Mono', Consolas, 'Cascadia Code', monospace;
    --text-xs: 11px;
    --text-sm: 12px;
    --text-base: 13px;
    --text-md: 14px;
    --text-lg: 16px;
    --text-xl: 20px;
    --text-2xl: 28px;
    --weight-normal: 400;
    --weight-medium: 500;
    --weight-semibold: 600;

    /* Spacing (4px grid) */
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;
    --space-10: 40px;

    /* Layout */
    --sidebar-width: 232px;
    --sidebar-collapsed: 56px;
    --topbar-height: 48px;
    --container-max: 1200px;
    --gate-panel-width: 280px;

    /* Radius */
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 8px;
    --radius-xl: 12px;
    --radius-full: 9999px;

    /* Elevation (flat) */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.5);
}

/* Light theme overrides (polished contrast) */
[data-theme="light"] {
    --bg-base: #f7f7f8;
    --bg-surface: #ffffff;
    --bg-elevated: #f0f0f2;
    --bg-overlay: #ffffff;
    --bg-input: #fafafa;
    --border-default: rgba(10, 10, 10, 0.10);
    --border-strong: rgba(10, 10, 10, 0.18);
    --border-accent: rgba(94, 106, 210, 0.50);
    --text-primary: #0a0a0c;
    --text-secondary: #3f3f46;
    --text-tertiary: #52525b;
    --text-muted: #71717a;
    --text-disabled: #d4d4d8;
    --accent: #4f56d2;
    --accent-hover: #3d44c4;
    --accent-active: #2f36a8;
    --accent-soft: rgba(79, 86, 210, 0.10);
    --success: #2f8f5e;
    --success-soft: rgba(47, 143, 94, 0.12);
    --danger: #d63d3d;
    --danger-soft: rgba(214, 61, 61, 0.10);
    --warning: #c79a2a;
    --warning-soft: rgba(199, 154, 42, 0.14);
    --info: #2c7fd8;
    --info-soft: rgba(44, 127, 216, 0.10);
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06);
    --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.08);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12);
}