:root {
  /* Greens */
  --primary:        #05E172;
  --primary-2:      #0CA85A;
  --primary-3:      #00683E;

  /* Semantic */
  --warning:        #FFC300;
  --success:        #05E172;
  --success-dark:   #00683E;
  --info:           #1280EA;
  --info-dark:      #1789FB;
  --error:          #F8394E;
  --error-dark:     #CC1428;

  /* Neutral */
  --bg-main:        #1f1f1f;
  --bg-elev:        #252525;
  --bg-card:        #2D2D2D;
  --bg-card-2:      #353535;
  --text:           #FCFCFC;
  --text-2:         #B0B0B0;
  --text-3:         #7A7A7A;
  --border:         rgba(255,255,255,.07);
  --border-strong:  rgba(255,255,255,.14);
  --border-btn:     rgba(255,255,255,.85);

  /* Button disabled */
  --btn-disabled-bg:    #B0B0B0;
  --btn-disabled-text:  rgba(0,0,0,.35);

  /* Severity */
  --sev-critico:    var(--error);
  --sev-alta:       var(--warning);
  --sev-media:      var(--info);
  --sev-baja:       var(--primary);

  /* Severity para comparativas visuales (mapping propio) */
  --comp-critica:   #F8394E;   /* rojo */
  --comp-alta:      #FF8A00;   /* naranja */
  --comp-media:     #FFC300;   /* amarillo */
  --comp-baja:      #1280EA;   /* azul */

  /* Radii */
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 18px;
  --r-xl: 24px;
  --r-pill: 999px;
  --r-btn:  4px;   /* botones: esquinas casi cuadradas */

  /* Spacing */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 48px;
  --s-8: 64px;

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(0,0,0,.5);
  --shadow-md: 0 8px 24px rgba(0,0,0,.35);
  --shadow-lg: 0 16px 48px rgba(0,0,0,.45);
  --glow-primary: 0 0 0 4px rgba(5,225,114,.18);
}