/* BinaryPH AI SEO — Design tokens (light, refined) */
:root {
    color-scheme: light;

    /* Brand */
    --bps-primary: #2563eb;
    --bps-primary-hover: #1d4ed8;
    --bps-primary-soft: #eff5ff;
    --bps-primary-fg: #ffffff;
    --bps-accent: #7c3aed;
    --bps-accent-hover: #6d28d9;
    --bps-accent-soft: #f5f0ff;

    /* Semantic */
    --bps-success: #15803d;
    --bps-success-soft: #e7f6ec;
    --bps-warning: #b45309;
    --bps-warning-soft: #fdf3d4;
    --bps-error: #b91c1c;
    --bps-error-soft: #fbe9e9;
    --bps-info: #1d4ed8;
    --bps-info-soft: #eff5ff;

    /* Surfaces */
    --bps-bg: #f4f5f7;
    --bps-surface: #ffffff;
    --bps-surface-2: #f7f8fb;
    --bps-surface-3: #eef0f5;
    --bps-surface-tint: #fbfbfd;
    --bps-border: #e2e4ea;
    --bps-border-strong: #c8ccd4;
    --bps-divider: #eceef2;

    /* Text */
    --bps-text: #0f172a;
    --bps-text-muted: #475569;
    --bps-text-subtle: #94a3b8;
    --bps-link: var(--bps-primary);

    /* Spacing */
    --bps-s-1: 4px;
    --bps-s-2: 8px;
    --bps-s-3: 12px;
    --bps-s-4: 16px;
    --bps-s-5: 24px;
    --bps-s-6: 32px;
    --bps-s-7: 48px;
    --bps-s-8: 64px;

    /* Type */
    --bps-fs-xs: 11px;
    --bps-fs-sm: 12px;
    --bps-fs-md: 13px;
    --bps-fs-lg: 16px;
    --bps-fs-xl: 20px;
    --bps-fs-2xl: 26px;
    --bps-fs-3xl: 34px;
    --bps-lh: 1.55;
    --bps-font: -apple-system, BlinkMacSystemFont, "Segoe UI", "Inter", Roboto, "Helvetica Neue", Arial, sans-serif;

    /* Radius */
    --bps-radius-sm: 6px;
    --bps-radius-md: 10px;
    --bps-radius-lg: 14px;
    --bps-radius-xl: 18px;
    --bps-radius-pill: 999px;

    /* Shadows — layered, soft */
    --bps-shadow-1: 0 1px 2px rgba(15, 23, 42, .04), 0 1px 3px rgba(15, 23, 42, .06);
    --bps-shadow-2: 0 6px 18px rgba(15, 23, 42, .06), 0 2px 6px rgba(15, 23, 42, .04);
    --bps-shadow-3: 0 24px 48px rgba(15, 23, 42, .12), 0 6px 16px rgba(15, 23, 42, .06);
    --bps-shadow-glow-primary: 0 8px 28px rgba(37, 99, 235, .22);
    --bps-shadow-glow-accent: 0 8px 28px rgba(124, 58, 237, .25);

    /* Gradients */
    --bps-grad-brand: linear-gradient(135deg, #2563eb 0%, #7c3aed 100%);
    --bps-grad-soft: linear-gradient(135deg, #eff5ff 0%, #f5f0ff 100%);
    --bps-grad-success: linear-gradient(135deg, #15803d 0%, #22c55e 100%);

    /* Focus / motion */
    --bps-focus-ring: 0 0 0 2px #fff, 0 0 0 4px var(--bps-primary);
    --bps-motion-fast: 120ms;
    --bps-motion-med: 200ms;
    --bps-motion-slow: 320ms;

    --bps-z-toast: 100000;
    --bps-z-modal: 100100;
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --bps-motion-fast: 1ms;
        --bps-motion-med: 1ms;
        --bps-motion-slow: 1ms;
    }
}
