:root {
    /* Superficie */
    --color-black-950: #08080a;
    --color-black-900: #0d0d10;
    --color-black-800: #131317;
    --color-black-700: #1a1a1f;
    --color-black-600: #212127;
    --color-black-500: #2b2b32;
    --color-line: #26262d;
    --color-line-soft: #1d1d22;

    /* Marca */
    --color-red-700: #7f0f19;
    --color-red-600: #a3121e;
    --color-red-500: #d81b2c;
    --color-red-400: #f0374a;
    --color-red-300: #ff6b78;
    --color-red-glow: rgba(216, 27, 44, 0.35);

    /* Texto (sobre fondos oscuros, ej. sidebar) */
    --color-white: #f7f7f8;
    --color-text: #eceef1;
    --color-text-muted: #9b9ba5;
    --color-text-faint: #6b6b74;

    /* Zona clara: contenido principal */
    --color-page-bg: #f3f3f6;
    --color-surface: #ffffff;
    --color-surface-alt: #f6f6f9;
    --color-border-light: #e6e6ec;
    --color-ink: #17171b;
    --color-ink-muted: #6c6c78;
    --color-ink-faint: #9b9ba7;

    /* Estado */
    --color-success: #21c17a;
    --color-success-text: #15803d;
    --color-success-bg: rgba(33, 193, 122, 0.12);
    --color-danger: #ff5468;
    --color-danger-text: #dc2626;
    --color-danger-bg: rgba(255, 84, 104, 0.12);

    /* Forma */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 18px;
    --radius-pill: 999px;

    /* Elevación */
    --shadow-elevated: 0 20px 45px -20px rgba(0, 0, 0, 0.6);
    --shadow-soft: 0 8px 24px -12px rgba(0, 0, 0, 0.5);
    --shadow-card: 0 1px 2px rgba(17, 17, 23, 0.04), 0 12px 28px -16px rgba(17, 17, 23, 0.14);

    /* Tipografía */
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-mono: 'JetBrains Mono', 'Courier New', monospace;

    /* Layout */
    --sidebar-width: 264px;
    --topbar-height: 72px;
}