:root {
  /* PALETA PREMIUM (Nvidia-inspired Industrial Tech) */
  --gray-50: #F8FAFC;
  --gray-100: #F1F5F9;
  --gray-200: #E2E8F0;
  --gray-300: #CBD5E1;
  --gray-400: #94A3B8;
  --gray-500: #64748B;
  --gray-600: #475569;
  --gray-700: #334155;
  --gray-800: #1E293B;
  --gray-900: #0F172A;

  /* BRAND COLORS - Deep Tech Blue */
  --brand-primary: #3B82F6;
  --brand-secondary: #6366F1;
  --brand-accent: #0EA5E9;
  
  /* ESTADOS MÁQUINA (Vibrant & Clear) */
  --state-productive: #10B981; /* Emerald */
  --state-stopped: #EF4444;    /* Red */
  --state-warning: #F59E0B;    /* Amber */
  --state-idle: #64748B;       /* Slate */
  --state-setup: #3B82F6;      /* Blue */

  /* ACCIONES */
  --action-primary: var(--brand-primary);
  --action-primary-hover: #2563EB;
  --action-danger: #DC2626;
  --action-secondary-bg: #F1F5F9;

  /* TIPOGRAFÍA - Modern Stack */
  --font-sans: "Inter", system-ui, -apple-system, sans-serif;
  --font-mono: "JetBrains Mono", monospace;
  
  --text-xs: 0.75rem;   /* 12px */
  --text-sm: 0.875rem;  /* 14px */
  --text-base: 1rem;    /* 16px */
  --text-lg: 1.125rem;  /* 18px */
  --text-xl: 1.25rem;   /* 20px */
  --text-2xl: 1.5rem;   /* 24px */
  --text-3xl: 1.875rem; /* 30px */
  --text-4xl: 2.25rem;  /* 36px */

  /* ESPACIADO */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;

  /* BORDES & RADIUS */
  --radius-sm: 0.375rem;
  --radius-base: 0.5rem;
  --radius-md: 0.75rem;
  --radius-lg: 1rem;
  --radius-xl: 1.5rem;
  --radius-full: 9999px;

  /* SOMBRAS (Elevation System) */
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  --shadow-glow: 0 0 15px rgba(59, 130, 246, 0.5);

  /* GLASSMORPHISM */
  --glass-bg: rgba(255, 255, 255, 0.7);
  --glass-border: rgba(255, 255, 255, 0.5);
  --glass-blur: blur(12px);

  /* SEMANTIC MAPPING */
  --surface-ground: #F8FAFC;
  --surface-card: #FFFFFF;
  --surface-hover: #F1F5F9;
  
  --text-primary: #0F172A;
  --text-secondary: #475569;
  --text-tertiary: #94A3B8;
  
  --border-color: #E2E8F0;
  
  --primary-color: var(--brand-primary);
  --primary-light: #DBEAFE;
  --primary-rgb: 59, 130, 246;
  
  --danger-color: var(--state-stopped);
  --warning-color: var(--state-warning);
  --success-color: var(--state-productive);
  
  --status-success: var(--state-productive);
  --status-success-bg: #DCFCE7;
  
  --status-danger: var(--state-stopped);
  --status-danger-bg: #FEE2E2;
  
  --status-warning: var(--state-warning);
  --status-warning-bg: #FEF3C7;
  --status-warning-text: #92400E;
  
  /* ALIASES */
  --spacing-xs: var(--space-1);
  --spacing-sm: var(--space-2);
  --spacing-md: var(--space-4);
  --spacing-lg: var(--space-6);
  --spacing-xl: var(--space-10);
  --spacing-2xl: var(--space-12);
  
  --font-size-xs: var(--text-xs);
  --font-size-sm: var(--text-sm);
  --font-size-md: var(--text-base);
  --font-size-lg: var(--text-lg);
  --font-size-xl: var(--text-xl);
  --font-size-2xl: var(--text-2xl);
  
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  
  --transition-fast: 0.15s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-normal: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  
  /* LEGACY ALIASES (compatibility with older pages like pairing, calidad) */
  --bg-color: var(--surface-ground);
  --surface-color: var(--surface-card);
  --font-size-3xl: var(--text-3xl);
}
