:root {
    /* Colors — Dark space theme */
    --color-primary:     #96BFD9;
    --color-primary-dark:#7aa8c4;
    --color-secondary:   #b8d4e8;
    --color-accent:      #c9a96e;

    --color-bg:          #080b13;
    --color-bg-alt:      #071424;
    --color-surface:     #1a1e28;
    --color-text:        #e8eaf0;
    --color-text-muted:  #8a92a8;
    --color-border:      #2a2f3d;
    --color-shadow:      rgba(0, 0, 0, 0.4);

    --color-success:     #4ade80;
    --color-error:       #f87171;

    /* Typography — Lato + Caveat */
    --font-sans:    'Lato', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --font-display: 'Caveat', cursive;
    --font-mono:    'Cascadia Code', 'Fira Code', Consolas, monospace;

    --text-xs:    clamp(0.75rem,  0.7rem  + 0.25vw, 0.875rem);
    --text-sm:    clamp(0.875rem, 0.825rem + 0.25vw, 1rem);
    --text-base:  clamp(1rem,     0.95rem  + 0.25vw, 1.125rem);
    --text-lg:    clamp(1.125rem, 1rem     + 0.5vw,  1.375rem);
    --text-xl:    clamp(1.25rem,  1.1rem   + 0.75vw, 1.75rem);
    --text-2xl:   clamp(1.5rem,   1.25rem  + 1vw,    2.25rem);
    --text-3xl:   clamp(1.875rem, 1.5rem   + 1.5vw,  3rem);
    --text-4xl:   clamp(2.25rem,  1.75rem  + 2vw,    4rem);

    --leading-tight:  1.2;
    --leading-normal: 1.6;

    --weight-light:    300;
    --weight-normal:   400;
    --weight-medium:   500;
    --weight-semibold: 600;
    --weight-bold:     700;
    --weight-black:    900;

    /* Spacing scale */
    --space-xs:   0.25rem;
    --space-sm:   0.5rem;
    --space-md:   1rem;
    --space-lg:   1.5rem;
    --space-xl:   2rem;
    --space-2xl:  3rem;
    --space-3xl:  4rem;
    --space-4xl:  6rem;
    --space-5xl:  8rem;

    /* Layout */
    --container-sm:  40rem;
    --container-md:  48rem;
    --container-lg:  64rem;
    --container-xl:  80rem;

    /* Borders & Shapes */
    --radius-sm:  0.25rem;
    --radius-md:  0.5rem;
    --radius-lg:  1rem;
    --radius-full: 9999px;

    /* Shadows */
    --shadow-sm:  0 1px 2px var(--color-shadow);
    --shadow-md:  0 4px 6px -1px var(--color-shadow), 0 2px 4px -2px var(--color-shadow);
    --shadow-lg:  0 10px 15px -3px var(--color-shadow), 0 4px 6px -4px var(--color-shadow);
    --shadow-xl:  0 20px 25px -5px var(--color-shadow), 0 8px 10px -6px var(--color-shadow);

    /* Transitions */
    --transition-fast:   150ms ease;
    --transition-normal: 250ms ease;
    --transition-slow:   350ms ease;
}