:root{

    /*==================================
    Colors
    ==================================*/

    --color-background:#0d1117;
    --color-surface:#161b22;
    --color-card:#1f2632;

    --color-primary:#ffbd39;
    --color-primary-hover:#ffca5f;
    --color-primary-dark:#e6a800;

    --color-text:#ffffff;
    --color-text-light:#d1d5db;
    --color-text-muted:#8b949e;

    --color-border:#30363d;

    /*==================================
    Glow
    ==================================*/

    --color-glow:rgba(255,189,57,.25);
    --color-glow-strong:rgba(255,189,57,.45);

    /*==================================
    Glass
    ==================================*/

    --glass-background:rgba(255,255,255,.05);
    --glass-border:rgba(255,255,255,.08);

    /*==================================
    Overlay
    ==================================*/

    --overlay-light:rgba(255,255,255,.04);
    --overlay-dark:rgba(0,0,0,.25);

    /*==================================
    Blur
    ==================================*/

    --blur-sm:8px;
    --blur-md:16px;
    --blur-lg:24px;

    /*==================================
    Radius
    ==================================*/

    --radius-sm:8px;
    --radius-md:12px;
    --radius-lg:18px;
    --radius-xl:24px;
    --radius-round:999px;

    /*==================================
    Spacing
    ==================================*/

    --space-xs:8px;
    --space-sm:16px;
    --space-md:24px;
    --space-lg:32px;
    --space-xl:48px;
    --space-2xl:64px;
    --space-3xl:96px;

    /*==================================
    Header
    ==================================*/

    --header-height:80px;

    /*==================================
    Transition
    ==================================*/

    --transition-fast:.2s ease;
    --transition:.3s ease;
    --transition-slow:.45s ease;

}

[data-theme="dark"]{

    --color-background:#0d1117;
    --color-surface:#161b22;
    --color-card:#1f2632;

    --color-primary:#ffbd39;
    --color-primary-hover:#ffca5f;
    --color-primary-dark:#e6a800;

    --color-text:#ffffff;
    --color-text-light:#d1d5db;
    --color-text-muted:#8b949e;

    --color-border:#30363d;

    --color-glow:rgba(255,189,57,.25);
    --color-glow-strong:rgba(255,189,57,.45);

}

[data-theme="light"]{

    --color-background:#f8fafc;
    --color-surface:#ffffff;
    --color-card:#ffffff;

    --color-primary:#ffbd39;
    --color-primary-hover:#ffca5f;
    --color-primary-dark:#e6a800;

    --color-text:#111827;
    --color-text-light:#374151;
    --color-text-muted:#6b7280;

    --color-border:#d1d5db;

    --color-glow:rgba(255,189,57,.25);
    --color-glow-strong:rgba(255,189,57,.45);

}

[data-theme="amber"]{

    --color-background:#15120b;
    --color-surface:#201b10;
    --color-card:#2b2415;

    --color-primary:#ffbd39;
    --color-primary-hover:#ffd05f;
    --color-primary-dark:#d79b00;

    --color-text:#f8f5ef;
    --color-text-light:#ddd6c5;
    --color-text-muted:#9e947f;

    --color-border:#4b4028;

    --color-glow:rgba(255,189,57,.25);
    --color-glow-strong:rgba(255,189,57,.45);

}
[data-theme="ocean"]{

    --color-background:#07131d;
    --color-surface:#0d1f2d;
    --color-card:#14293c;

    --color-primary:#4db8ff;
    --color-primary-hover:#72c8ff;
    --color-primary-dark:#2e98df;

    --color-text:#f4f8fb;
    --color-text-light:#c8d8e5;
    --color-text-muted:#8fa6b8;

    --color-border:#284559;

    --color-glow:rgba(77,184,255,.25);
    --color-glow-strong:rgba(77,184,255,.45);

}

[data-theme="emerald"]{

    --color-background:#0b1610;
    --color-surface:#142018;
    --color-card:#1a2b20;

    --color-primary:#57d37d;
    --color-primary-hover:#73df93;
    --color-primary-dark:#37b45f;

    --color-text:#f5faf6;
    --color-text-light:#d4e4d8;
    --color-text-muted:#95ad9a;

    --color-border:#31513b;

    --color-glow:rgba(87,211,125,.25);
    --color-glow-strong:rgba(87,211,125,.45);

}