:root {
    /* Colores base */
    --color-bg: #0a0a0a;
    --color-text: #f8fafc;
    --color-text-muted: #9ca3af;
    --color-text-subtle: #4b5563;
    --color-white: #ffffff;
    --color-black: #000000;
    --color-neutral-200: #e5e7eb;

    /* Colores de acento */
    --color-accent: #6366f1;
    --color-accent-light: #818cf8;
    --color-accent-lighter: #a5b4fc;
    --color-purple: #a855f7;

    /* Superficies y bordes (efecto "glass") */
    --color-surface: rgba(255, 255, 255, 0.03);
    --color-border: rgba(255, 255, 255, 0.1);
    --color-border-strong: rgba(255, 255, 255, 0.2);
    --color-overlay-hover: rgba(255, 255, 255, 0.1);

    /* Acentos con transparencia */
    --color-accent-glow: rgba(99, 102, 241, 0.2);
    --color-accent-tint: rgba(99, 102, 241, 0.1);
    --color-accent-border: rgba(99, 102, 241, 0.2);
    --color-accent-border-hover: rgba(99, 102, 241, 0.5);

    --gradient-accent: linear-gradient(90deg, var(--color-accent), var(--color-purple));

    /* Tipografía */
    --font-sans: ui-sans-serif, system-ui, -apple-system, sans-serif;

    /* Escala de espaciado (en rem) */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;
    --space-20: 5rem;
    --space-32: 8rem;

    /* Radios */
    --radius-md: 0.5rem;
    --radius-lg: 0.75rem;
    --radius-xl: 1rem;
    --radius-2xl: 1.5rem;
    --radius-full: 9999px;

    /* Anchos de contenedor */
    --container-md: 36rem;
    --container-3xl: 48rem;
    --container-6xl: 72rem;

    /* Movimiento */
    --ease: cubic-bezier(0.4, 0, 0.2, 1);
    --transition-fast: 150ms var(--ease);
    --transition-reveal: 700ms var(--ease);
}