/*
 * FitUI V2 — Design Tokens
 * Official visual language extracted from Dashboard V2.
 * Tokens are the only source of truth for shared visual values.
 */

:root {
    color-scheme: dark;

    /* Brand */
    --fit-gold-rgb: 200, 162, 74;
    --fit-gold: #c8a24a;
    --fit-gold-light: #ead79a;
    --fit-gold-deep: #8f6d26;
    --fit-on-gold: #08090d;

    /* Backgrounds */
    --fit-bg: #080a0f;
    --fit-bg-deep: #040609;
    --fit-bg-soft: #0c0e12;
    --fit-bg-elevated: #101216;

    /* Surfaces */
    --fit-surface: #111318;
    --fit-surface-soft: #15171c;
    --fit-surface-strong: #1a1c21;
    --fit-surface-glass: rgba(17, 19, 21, .78);
    --fit-surface-glass-soft: rgba(255, 255, 255, .027);
    --fit-surface-inset: rgba(0, 0, 0, .13);

    /* Text */
    --fit-text: #f7f8fb;
    --fit-text-soft: rgba(255, 255, 255, .78);
    --fit-text-muted: #a9b0bb;
    --fit-text-subtle: rgba(255, 255, 255, .42);
    --fit-text-faint: rgba(255, 255, 255, .32);

    /* Borders */
    --fit-border: rgba(255, 255, 255, .08);
    --fit-border-soft: rgba(255, 255, 255, .05);
    --fit-border-strong: rgba(255, 255, 255, .12);
    --fit-border-gold: rgba(var(--fit-gold-rgb), .34);
    --fit-border-gold-soft: rgba(var(--fit-gold-rgb), .16);

    /* Functional colors */
    --fit-success: #78e39b;
    --fit-success-rgb: 120, 227, 155;
    --fit-info: #8ec3ff;
    --fit-info-rgb: 142, 195, 255;
    --fit-warning: #f6c760;
    --fit-warning-rgb: 246, 199, 96;
    --fit-danger: #ff7a7a;
    --fit-danger-rgb: 255, 122, 122;

    /* Typography */
    --fit-font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --fit-font-display: var(--fit-font-sans);
    --fit-weight-regular: 400;
    --fit-weight-medium: 600;
    --fit-weight-bold: 800;
    --fit-weight-black: 900;
    --fit-leading-tight: 1.05;
    --fit-leading-heading: 1.15;
    --fit-leading-body: 1.65;
    --fit-tracking-tight: -.04em;
    --fit-tracking-wide: .12em;

    /* Type scale — 12px is the minimum readable metadata size. */
    --fit-text-xs: .75rem;
    --fit-text-sm: .8125rem;
    --fit-text-md: .875rem;
    --fit-text-base: 1rem;
    --fit-text-lg: 1.125rem;
    --fit-text-xl: 1.25rem;
    --fit-text-2xl: 1.5rem;
    --fit-heading-sm: clamp(1.5rem, 2.2vw, 2rem);
    --fit-heading-md: clamp(2rem, 3.6vw, 3rem);
    --fit-heading-lg: clamp(2.5rem, 5vw, 4.5rem);
    --fit-heading-hero: clamp(3.25rem, 7vw, 6.5rem);

    /* Spacing */
    --fit-space-1: 4px;
    --fit-space-2: 8px;
    --fit-space-3: 12px;
    --fit-space-4: 16px;
    --fit-space-5: 20px;
    --fit-space-6: 24px;
    --fit-space-7: 32px;
    --fit-space-8: 40px;
    --fit-space-9: 48px;
    --fit-space-10: 64px;
    --fit-space-11: 80px;
    --fit-space-12: 112px;

    /* Radius */
    --fit-radius-xs: 8px;
    --fit-radius-sm: 12px;
    --fit-radius-md: 20px;
    --fit-radius-lg: 30px;
    --fit-radius-xl: 40px;
    --fit-radius-pill: 999px;

    /* Shadows */
    --fit-shadow-sm: 0 10px 30px rgba(0, 0, 0, .20);
    --fit-shadow-card: 0 20px 60px rgba(0, 0, 0, .30);
    --fit-shadow-panel: 0 30px 90px rgba(0, 0, 0, .42);
    --fit-shadow-float: 0 38px 120px rgba(0, 0, 0, .46);
    --fit-shadow-inset: inset 0 1px 0 rgba(255, 255, 255, .04);
    --fit-glow-gold: 0 0 38px rgba(var(--fit-gold-rgb), .13);
    --fit-glow-gold-strong: 0 0 60px rgba(var(--fit-gold-rgb), .20);

    /* Blur */
    --fit-blur-sm: blur(10px);
    --fit-blur-panel: blur(18px);
    --fit-blur-strong: blur(24px);

    /* Layout */
    --fit-container: 1480px;
    --fit-container-wide: 1700px;
    --fit-gutter: clamp(20px, 4vw, 48px);
    --fit-section-space: clamp(72px, 9vw, 128px);

    /* Motion */
    --fit-duration-fast: 160ms;
    --fit-duration: 240ms;
    --fit-duration-slow: 520ms;
    --fit-ease: cubic-bezier(.2, .75, .25, 1);
    --fit-ease-out: cubic-bezier(.16, 1, .3, 1);

    /* Layering */
    --fit-z-base: 1;
    --fit-z-raised: 10;
    --fit-z-header: 100;
    --fit-z-modal: 1000;
}