:root {
    /* Color Palette - Kinochiaka Cinematic Dark Identity */
    --bg-base: #07090e;
    --bg-surface: #0f131c;
    --bg-surface-elevated: #171c28;
    --bg-card: #131722;
    --bg-card-hover: #1b2130;
    --bg-glass: rgba(15, 19, 28, 0.78);
    --bg-glass-card: rgba(23, 28, 40, 0.65);

    /* Accents */
    --primary: #e50914;
    --primary-hover: #f41e29;
    --primary-glow: rgba(229, 9, 20, 0.35);
    
    --accent-gold: #f59e0b;
    --accent-gold-glow: rgba(245, 158, 11, 0.25);
    --accent-cyan: #06b6d4;

    /* Text Colors */
    --text-main: #f8fafc;
    --text-muted: #94a3b8;
    --text-subtle: #64748b;
    --text-disabled: #475569;

    /* Status Colors */
    --status-ready: #10b981;
    --status-degraded: #f59e0b;
    --status-blocked: #ef4444;
    --status-offline: #6b7280;

    /* Borders & Dividers */
    --border-subtle: rgba(255, 255, 255, 0.08);
    --border-focus: rgba(229, 9, 20, 0.5);
    --border-hover: rgba(255, 255, 255, 0.16);

    /* Shadows */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.4);
    --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.5);
    --shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.65);
    --shadow-glow: 0 0 30px var(--primary-glow);

    /* Border Radius */
    --radius-xs: 4px;
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 24px;
    --radius-full: 9999px;

    /* Typography */
    --font-sans: 'Outfit', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-heading: 'Outfit', -apple-system, BlinkMacSystemFont, sans-serif;

    /* Transitions */
    --transition-fast: 150ms cubic-bezier(0.16, 1, 0.3, 1);
    --transition-normal: 250ms cubic-bezier(0.16, 1, 0.3, 1);
    --transition-smooth: 400ms cubic-bezier(0.16, 1, 0.3, 1);

    /* Layout Constraints */
    --container-width: 1440px;
    --header-height: 72px;
}