#midterm-mapa { position: relative; background: #fff; color: #000; font-family: Roboto, Arial, sans-serif; font-size: 1rem; font-weight: 400; line-height: 1.4; }
  #midterm-mapa, #midterm-mapa * { box-sizing: border-box; }
  #midterm-mapa .cabecera { display: flex; align-items: center; gap: 12px; }
  #midterm-mapa .logo { width: 48px; height: 48px; object-fit: contain; flex: none; }
  #midterm-mapa .titulo { margin: 0; font-family: Merriweather, Georgia, serif; font-weight: 700; font-size: 1.5rem; line-height: 1.3; text-wrap: balance; }
  #midterm-mapa .subtitulo { margin: 6px 0 0; color: #6f6f6f; font-size: 1.125rem; }
  #midterm-mapa .anio { color: #cc0000; }
  #midterm-mapa .leyenda { display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 12px 0 0; padding: 0; list-style: none; }
  #midterm-mapa .leyenda li { display: flex; align-items: center; gap: 6px; padding: 2px 0; cursor: default; }
  #midterm-mapa .leyenda li:focus-visible { outline: 2px solid #cc0000; outline-offset: 2px; }
  #midterm-mapa .leyenda svg { display: block; width: 16px; height: 16px; flex: none; }
  #midterm-mapa .mapa { margin: 12px 0 0; }
  #midterm-mapa .mapa svg { display: block; width: 100%; height: auto; touch-action: manipulation; }
  #midterm-mapa .mapa [data-estado] { transition: opacity .15s; }
  #midterm-mapa .mapa .atenuado { opacity: .2; }
  #midterm-mapa .pie { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 16px; margin-top: 12px; }
  #midterm-mapa .pie p { margin: 0; }
  #midterm-mapa .estado { color: #cc0000; }
  #midterm-mapa .fuente { color: #6f6f6f; }
  #midterm-mapa .globo { position: absolute; z-index: 2; max-width: 240px; padding: 8px 10px; background: #fff; border: 1px solid #b5b5b5; line-height: 1.35; pointer-events: none; }
  #midterm-mapa .globo[hidden] { display: none; }
  #midterm-mapa .globo b { font-weight: 700; }
  #midterm-mapa .r { color: #cc0000; }
  #midterm-mapa .d { color: #1f52c4; }
  #midterm-mapa .i { color: #606060; }
  @media (prefers-reduced-motion: reduce) {
    #midterm-mapa .mapa [data-estado] { transition: none; }
  }
  @media (max-width: 400px) {
    #midterm-mapa .titulo { font-size: 1.25rem; }
    #midterm-mapa .subtitulo { font-size: 1rem; }
    #midterm-mapa .pie { flex-direction: column; }
  }
