/* Tokens de diseño de SimulacionEcoWeb — derivados del sistema Broadsheet (papel de periódico, tinta casi negra, cian y magenta como tintas planas). */
:root {
  --color-bg: #f3f2f2;
  --color-surface: #eae9e9;
  --color-text: #201e1d;
  --color-text-2: #605d5d;
  --color-accent: #0088b0;
  --color-accent-2: #d6006c;
  --color-process-yellow: #edbb00;
  --color-divider: rgba(32, 30, 29, 0.16);

  --color-neutral-100: #f8f4f4;
  --color-neutral-200: #eae7e7;
  --color-neutral-300: #d7d3d3;
  --color-neutral-400: #bab6b6;
  --color-neutral-500: #9b9797;
  --color-neutral-600: #7d7979;
  --color-neutral-700: #605d5d;
  --color-neutral-800: #444141;
  --color-neutral-900: #2d2b2b;

  --color-accent-100: #e9f8ff;
  --color-accent-200: #cbeeff;
  --color-accent-300: #99e0ff;
  --color-accent-400: #62c5ee;
  --color-accent-500: #38a6cf;
  --color-accent-600: #1186ac;
  --color-accent-700: #006786;
  --color-accent-800: #004961;
  --color-accent-900: #0a303e;

  --color-accent-2-100: #fff1f4;
  --color-accent-2-200: #ffdee6;
  --color-accent-2-300: #ffc0d0;
  --color-accent-2-600: #d82071;
  --color-accent-2-700: #aa0b56;
  --color-accent-2-800: #790e3d;

  /* Estados */
  --color-exito: #006786;
  --color-exito-fondo: #e9f8ff;
  --color-alerta: #6b5200;
  --color-alerta-fondo: #f8ecc2;
  --color-error: #aa0b56;
  --color-error-fondo: #fff1f4;

  /* Paleta de series (se combina con trazos y marcadores distintos) */
  --serie-1: #0088b0;
  --serie-2: #d6006c;
  --serie-3: #201e1d;
  --serie-4: #a67c00;
  --serie-5: #004961;
  --serie-6: #7d7979;
  --serie-7: #aa0b56;

  /* Tipografía: serif del sistema, sin descargas externas */
  --font-heading: "Source Serif 4", "Source Serif Pro", Georgia, "Times New Roman", serif;
  --font-heading-weight: 600;
  --font-body: "Source Serif 4", "Source Serif Pro", Georgia, "Times New Roman", serif;

  /* Espaciado (densidad 1.25×) */
  --space-1: 5px;
  --space-2: 10px;
  --space-3: 15px;
  --space-4: 20px;
  --space-6: 30px;
  --space-8: 40px;
  --space-12: 60px;

  --radius-sm: 1px;
  --radius-md: 2px;
  --radius-lg: 4px;

  --shadow-sm: 0 1px 2px rgba(45, 43, 43, 0.14);
  --shadow-md: 0 3px 10px rgba(45, 43, 43, 0.16);
  --shadow-lg: 0 12px 32px rgba(45, 43, 43, 0.22);
}