/* Workspace Power Tools — design tokens
   Linear-leaning palette (cool neutrals + indigo-violet accent)
   Edit values here to retheme the homepage globally. */

:root {
    color-scheme: light;

    /* Surface & background (blue-gold light) */
    --wpt-bg: #f5f7fb;
    --wpt-bg-strong: #ffffff;
    --wpt-bg-soft: #eaeff6;
    --wpt-surface: rgba(255, 255, 255, 0.78);
    --wpt-surface-strong: #ffffff;

    /* Text */
    --wpt-text: #00017C;
    --wpt-text-muted: #0038A7;
    --wpt-text-subtle: #4a6fa5;

    /* Borders */
    --wpt-border: rgba(0, 1, 124, 0.10);
    --wpt-border-strong: rgba(0, 56, 167, 0.18);

    /* Accent */
    --wpt-accent: #0074D6;
    --wpt-accent-strong: #0038A7;
    --wpt-accent-soft: rgba(0, 116, 214, 0.10);
    --wpt-accent-contrast: #ffffff;

    /* Semantic */
    --wpt-success: #16a34a;
    --wpt-warning: #FFB400;
    --wpt-danger: #dc2626;

    /* Legacy alias kept so unmigrated components keep working */
    --wpt-amber: #FFB400;
    --wpt-coral: #c4523e;
    --wpt-ink: #00017C;

    /* Shadows */
    --wpt-shadow-xs: 0 1px 2px rgba(0, 1, 124, 0.04);
    --wpt-shadow-sm: 0 4px 12px rgba(0, 1, 124, 0.06);
    --wpt-shadow-md: 0 12px 32px rgba(0, 1, 124, 0.08);
    --wpt-shadow-lg: 0 24px 64px rgba(0, 1, 124, 0.10);
    --wpt-shadow-card: var(--wpt-shadow-sm);
    --wpt-shadow-soft: var(--wpt-shadow-lg);

    /* Hero glow (radial accent orb) */
    --wpt-glow-accent: radial-gradient(60% 60% at 30% 30%, rgba(0, 116, 214, 0.22), transparent 70%);

    /* Radii */
    --wpt-radius-sm: 8px;
    --wpt-radius-md: 12px;
    --wpt-radius-lg: 18px;

    /* Spacing (8px base) */
    --wpt-space-1: 4px;
    --wpt-space-2: 8px;
    --wpt-space-3: 12px;
    --wpt-space-4: 16px;
    --wpt-space-5: 24px;
    --wpt-space-6: 32px;
    --wpt-space-7: 40px;
    --wpt-space-8: 48px;
    --wpt-space-9: 64px;
    --wpt-space-10: 80px;
    --wpt-space-11: 96px;
    --wpt-space-12: 128px;

    /* Type scale (aligned with Launch UI sizing — body 18px base) */
    --wpt-font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --wpt-font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    --wpt-font-display: clamp(3rem, 5.5vw, 4.5rem);
    --wpt-font-h1: clamp(2.75rem, 4.8vw, 4rem);
    --wpt-font-h2: clamp(2rem, 3.2vw, 2.75rem);
    --wpt-font-h3: clamp(1.375rem, 1.8vw, 1.75rem);
    --wpt-font-h4: 1.1875rem;
    --wpt-font-body: 1.125rem;
    --wpt-font-small: 1rem;
    --wpt-font-xs: 0.875rem;

    /* Line height */
    --wpt-leading-tight: 1.1;
    --wpt-leading-snug: 1.3;
    --wpt-leading-normal: 1.55;
    --wpt-leading-loose: 1.7;

    /* Letter spacing */
    --wpt-tracking-tight: -0.02em;
    --wpt-tracking-normal: 0;
    --wpt-tracking-wide: 0.12em;

    /* Motion */
    --wpt-transition-fast: 120ms ease;
    --wpt-transition-base: 180ms ease;
    --wpt-transition-slow: 280ms cubic-bezier(0.16, 1, 0.3, 1);

    /* Z-index */
    --wpt-z-base: 1;
    --wpt-z-elevated: 10;
    --wpt-z-sticky: 50;
    --wpt-z-overlay: 100;
    --wpt-z-modal: 200;

    /* Layout */
    --wpt-shell: 1240px;

    /* Navbar offset for anchor scroll */
    --wpt-navbar-height: 90px;
}

html {
    scroll-padding-top: var(--wpt-navbar-height);
}

@media (prefers-color-scheme: dark) {
    :root {
        color-scheme: dark;
        --wpt-bg: #0b0d12;
        --wpt-bg-strong: #10131a;
        --wpt-bg-soft: #15191f;
        --wpt-surface: rgba(20, 23, 30, 0.72);
        --wpt-surface-strong: #181c24;

        --wpt-text: #e6e7ea;
        --wpt-text-muted: #a0a4ae;
        --wpt-text-subtle: #6f747e;

        --wpt-border: rgba(230, 231, 234, 0.10);
        --wpt-border-strong: rgba(230, 231, 234, 0.18);

        --wpt-accent: #8b85ff;
        --wpt-accent-strong: #a6a0ff;
        --wpt-accent-soft: rgba(139, 133, 255, 0.14);
        --wpt-accent-contrast: #0b0d12;

        --wpt-success: #4ade80;
        --wpt-warning: #fbbf24;
        --wpt-danger: #f87171;

        --wpt-amber: #e0b05e;
        --wpt-coral: #df846f;
        --wpt-ink: #e6e7ea;

        --wpt-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.3);
        --wpt-shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.32);
        --wpt-shadow-md: 0 12px 32px rgba(0, 0, 0, 0.38);
        --wpt-shadow-lg: 0 24px 64px rgba(0, 0, 0, 0.45);
        --wpt-shadow-card: var(--wpt-shadow-sm);
        --wpt-shadow-soft: var(--wpt-shadow-lg);

        --wpt-glow-accent: radial-gradient(60% 60% at 30% 30%, rgba(139, 133, 255, 0.28), transparent 70%);
    }
}

/* New blue-gold light theme (colors: #00017C #0038A7 #0074D6 #FFB400 #FFDA00) */
[data-theme="light"],
.theme-light {
    color-scheme: light;
    --wpt-bg: #f5f7fb;
    --wpt-bg-strong: #ffffff;
    --wpt-bg-soft: #eaeff6;
    --wpt-surface: rgba(255, 255, 255, 0.78);
    --wpt-surface-strong: #ffffff;
    --wpt-text: #00017C;
    --wpt-text-muted: #0038A7;
    --wpt-text-subtle: #4a6fa5;
    --wpt-border: rgba(0, 1, 124, 0.10);
    --wpt-border-strong: rgba(0, 56, 167, 0.18);
    --wpt-accent: #0074D6;
    --wpt-accent-strong: #0038A7;
    --wpt-accent-soft: rgba(0, 116, 214, 0.10);
    --wpt-accent-contrast: #ffffff;
    --wpt-success: #16a34a;
    --wpt-warning: #FFB400;
    --wpt-danger: #dc2626;
    --wpt-amber: #FFB400;
    --wpt-coral: #c4523e;
    --wpt-ink: #00017C;
    --wpt-shadow-xs: 0 1px 2px rgba(0, 1, 124, 0.04);
    --wpt-shadow-sm: 0 4px 12px rgba(0, 1, 124, 0.06);
    --wpt-shadow-md: 0 12px 32px rgba(0, 1, 124, 0.08);
    --wpt-shadow-lg: 0 24px 64px rgba(0, 1, 124, 0.10);
    --wpt-shadow-card: var(--wpt-shadow-sm);
    --wpt-shadow-soft: var(--wpt-shadow-lg);
    --wpt-glow-accent: radial-gradient(60% 60% at 30% 30%, rgba(0, 116, 214, 0.22), transparent 70%);
}

/* Original light theme (preserved, not active — use .theme-light-classic to re-enable) */
.theme-light-classic {
    color-scheme: light;
    --wpt-bg: #fafafb;
    --wpt-bg-strong: #ffffff;
    --wpt-bg-soft: #f3f4f7;
    --wpt-surface: rgba(255, 255, 255, 0.72);
    --wpt-surface-strong: #ffffff;
    --wpt-text: #16181d;
    --wpt-text-muted: #5c616b;
    --wpt-text-subtle: #878c95;
    --wpt-border: rgba(22, 24, 29, 0.08);
    --wpt-border-strong: rgba(22, 24, 29, 0.14);
    --wpt-accent: #6e66ff;
    --wpt-accent-strong: #5851e6;
    --wpt-accent-soft: rgba(110, 102, 255, 0.10);
    --wpt-accent-contrast: #ffffff;
    --wpt-success: #16a34a;
    --wpt-warning: #d97706;
    --wpt-danger: #dc2626;
    --wpt-amber: #b87913;
    --wpt-coral: #c4523e;
    --wpt-ink: #16181d;
    --wpt-shadow-xs: 0 1px 2px rgba(22, 24, 29, 0.04);
    --wpt-shadow-sm: 0 4px 12px rgba(22, 24, 29, 0.06);
    --wpt-shadow-md: 0 12px 32px rgba(22, 24, 29, 0.08);
    --wpt-shadow-lg: 0 24px 64px rgba(22, 24, 29, 0.10);
    --wpt-shadow-card: var(--wpt-shadow-sm);
    --wpt-shadow-soft: var(--wpt-shadow-lg);
    --wpt-glow-accent: radial-gradient(60% 60% at 30% 30%, rgba(110, 102, 255, 0.22), transparent 70%);
}

[data-theme="dark"],
.theme-dark {
    color-scheme: dark;
    --wpt-bg: #0b0d12;
    --wpt-bg-strong: #10131a;
    --wpt-bg-soft: #15191f;
    --wpt-surface: rgba(20, 23, 30, 0.72);
    --wpt-surface-strong: #181c24;
    --wpt-text: #e6e7ea;
    --wpt-text-muted: #a0a4ae;
    --wpt-text-subtle: #6f747e;
    --wpt-border: rgba(230, 231, 234, 0.10);
    --wpt-border-strong: rgba(230, 231, 234, 0.18);
    --wpt-accent: #8b85ff;
    --wpt-accent-strong: #a6a0ff;
    --wpt-accent-soft: rgba(139, 133, 255, 0.14);
    --wpt-accent-contrast: #0b0d12;
    --wpt-success: #4ade80;
    --wpt-warning: #fbbf24;
    --wpt-danger: #f87171;
    --wpt-amber: #e0b05e;
    --wpt-coral: #df846f;
    --wpt-ink: #e6e7ea;
    --wpt-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.3);
    --wpt-shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.32);
    --wpt-shadow-md: 0 12px 32px rgba(0, 0, 0, 0.38);
    --wpt-shadow-lg: 0 24px 64px rgba(0, 0, 0, 0.45);
    --wpt-shadow-card: var(--wpt-shadow-sm);
    --wpt-shadow-soft: var(--wpt-shadow-lg);
    --wpt-glow-accent: radial-gradient(60% 60% at 30% 30%, rgba(139, 133, 255, 0.28), transparent 70%);
}
