/* ==========================================================
   FREESPHERE UI
   Version: 0.1-alpha
   Design System
   ========================================================== */

:root{

    /* ======================================================
       BRAND
    ====================================================== */

    --fs-primary:#00E87A;
    --fs-primary-hover:#00C86A;
    --fs-primary-soft:rgba(0,232,122,.14);
    --fs-primary-border:rgba(0,232,122,.32);
    --fs-success:#16A34A;
    --fs-warning:#F59E0B;
    --fs-danger:#DC2626;
    --fs-background:#09090F;
    --fs-surface:#13131E;
    --fs-surface-elevated:#1C1C2A;
    --fs-border:rgba(255,255,255,.10);
    --fs-text:#F0F0F8;
    --fs-text-muted:#B8B8CE;

    --ws-primary:var(--fs-primary);
    --ws-primary-dark:var(--fs-primary-hover);
    --ws-primary-light:#5CFFAD;
    --ws-accent:#7C3AED;
    --ws-accent-soft:#EDE9FE;

    /* ======================================================
       COLORS
    ====================================================== */

    --ws-white:#FFFFFF;
    --ws-black:#000000;

    --ws-background:#F7F8FA;
    --ws-muted:#F3F4F6;
    --ws-surface:#FFFFFF;

    --ws-border:#E5E7EB;
    --ws-border-strong:#D1D5DB;

    --ws-text:#1F2937;
    --ws-text-light:#6B7280;
    --ws-text-muted:#9CA3AF;

    --ws-success:var(--fs-success);
    --ws-warning:var(--fs-warning);
    --ws-danger:var(--fs-danger);

    /* ======================================================
       TYPOGRAPHY
    ====================================================== */

    --ws-font-title:'Poppins',sans-serif;
    --ws-font-body:'Inter',sans-serif;
    --ws-font-code:'JetBrains Mono',monospace;

    /* ======================================================
       FONT SIZE
    ====================================================== */

    --fs-xs:.75rem;
    --fs-sm:.875rem;
    --fs-md:1rem;
    --fs-lg:1.25rem;
    --fs-xl:1.5rem;
    --fs-2xl:2rem;
    --fs-3xl:3rem;
    --fs-4xl:4rem;
    --fs-5xl:5rem;

    /* ======================================================
       FONT WEIGHT
    ====================================================== */

    --fw-light:300;
    --fw-normal:400;
    --fw-medium:500;
    --fw-semibold:600;
    --fw-bold:700;

    /* ======================================================
       SPACING
    ====================================================== */

    --space-1:4px;
    --space-2:8px;
    --space-3:12px;
    --space-4:16px;
    --space-5:24px;
    --space-6:32px;
    --space-7:48px;
    --space-8:64px;
    --space-9:96px;
    --space-10:128px;

    /* ======================================================
       BORDER RADIUS
    ====================================================== */

    --radius-sm:8px;
    --radius-md:12px;
    --radius-lg:18px;
    --radius-xl:28px;
    --radius-pill:999px;

    /* ======================================================
       SHADOWS
    ====================================================== */

    --shadow-sm:0 2px 8px rgba(17,24,39,.05);

    --shadow-md:0 12px 28px rgba(17,24,39,.08);

    --shadow-lg:0 24px 64px rgba(17,24,39,.12);

    /* ======================================================
       TRANSITIONS
    ====================================================== */

    --transition:.22s ease;

    /* ======================================================
       LAYOUT
    ====================================================== */

    --container:1280px;

}