:root {
  /* ── Global Efecty · Design Tokens oficiales ── */

  /* Fondos */
  --ge-bg-primary: #0A0A0F;
  --ge-bg-secondary: #111118;
  --ge-bg-elevated: #1A1A24;
  --ge-bg-card: #14141C;

  /* Gradiente de marca */
  --ge-gradient-start: #C026D3;
  --ge-gradient-mid: #7C3AED;
  --ge-gradient-end: #22D3EE;
  --ge-gradient-brand: linear-gradient(135deg, #C026D3 0%, #7C3AED 50%, #22D3EE 100%);

  /* Colores sólidos */
  --ge-magenta: #C026D3;
  --ge-violet: #7C3AED;
  --ge-violet-light: #A855F7;
  --ge-cyan: #22D3EE;
  --ge-cyan-light: #67E8F9;
  --ge-blue: #3B82F6;

  /* Texto */
  --ge-text-primary: #FAFAFA;
  --ge-text-secondary: #A1A1AA;
  --ge-text-muted: #71717A;
  --ge-text-inverse: #0A0A0F;

  /* UI */
  --ge-success: #22C55E;
  --ge-warning: #F59E0B;
  --ge-error: #EF4444;
  --ge-danger: #EF4444;
  --ge-border: rgba(255, 255, 255, 0.08);

  /* Tipografía */
  --ge-font: 'Inter', 'Poppins', system-ui, -apple-system, sans-serif;
  --ge-font-mono: 'JetBrains Mono', 'Fira Code', monospace;

  /* Forma */
  --ge-radius-sm: 8px;
  --ge-radius: 12px;
  --ge-radius-lg: 20px;
  --ge-radius-full: 9999px;

  /* Efectos */
  --ge-glow-magenta: 0 0 24px rgba(192, 38, 211, 0.35);
  --ge-glow-cyan: 0 0 24px rgba(34, 211, 238, 0.35);
  --ge-glow-brand: 0 0 32px rgba(124, 58, 237, 0.4);
  --ge-shadow: 0 4px 24px rgba(0, 0, 0, 0.25);
  --ge-shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.4);
  --ge-transition: 0.2s ease;

  /* Alias legacy (compatibilidad con vistas existentes) */
  --ge-navy: var(--ge-bg-primary);
  --ge-navy-light: var(--ge-bg-elevated);
  --ge-teal: var(--ge-cyan);
  --ge-teal-dark: #06B6D4;
  --ge-teal-glow: rgba(34, 211, 238, 0.25);
  --ge-bg: var(--ge-bg-primary);
  --ge-text: var(--ge-text-primary);
}