/* Beetzee design-system foundation. Keep legacy tokens intact until each page migrates. */
:root {
    --bz-bg-canvas: #070910;
    --bz-bg-sidebar: #090c14;
    --bz-bg-surface: #0d111b;
    --bz-bg-surface-raised: #121725;
    --bz-bg-surface-hover: #171d2d;
    --bz-bg-input: #0a0e17;

    --bz-border-subtle: rgba(255, 255, 255, 0.07);
    --bz-border-default: rgba(255, 255, 255, 0.11);
    --bz-border-strong: rgba(255, 255, 255, 0.17);

    --bz-text-primary: #f5f7fb;
    --bz-text-secondary: #a8b0c2;
    --bz-text-tertiary: #717b91;
    --bz-text-disabled: #4f586b;

    --bz-brand: #8b5cf6;
    --bz-brand-hover: #9d73ff;
    --bz-brand-soft: rgba(139, 92, 246, 0.14);
    --bz-accent: #d946ef;
    --bz-accent-soft: rgba(217, 70, 239, 0.12);
    --bz-success: #34d399;
    --bz-success-soft: rgba(52, 211, 153, 0.12);
    --bz-warning: #fbbf24;
    --bz-warning-soft: rgba(251, 191, 36, 0.12);
    --bz-danger: #fb7185;
    --bz-danger-soft: rgba(251, 113, 133, 0.12);
    --bz-info: #38bdf8;
    --bz-info-soft: rgba(56, 189, 248, 0.12);
    --bz-focus-ring: #c4b5fd;

    --bz-space-1: 4px;
    --bz-space-2: 8px;
    --bz-space-3: 12px;
    --bz-space-4: 16px;
    --bz-space-5: 20px;
    --bz-space-6: 24px;
    --bz-space-8: 32px;
    --bz-space-10: 40px;
    --bz-space-12: 48px;

    --bz-radius-sm: 8px;
    --bz-radius-md: 12px;
    --bz-radius-lg: 16px;
    --bz-radius-xl: 20px;
    --bz-radius-pill: 999px;

    --bz-shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.16);
    --bz-shadow-md: 0 10px 28px rgba(0, 0, 0, 0.22);
    --bz-shadow-lg: 0 18px 48px rgba(0, 0, 0, 0.28);

    --bz-font-body: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --bz-text-body: 14px;
    --bz-text-supporting: 12px;
    --bz-text-page-title: 28px;
    --bz-text-section-title: 18px;
}