/* ============================================================
   El Voto Brote · Estilos
   Paleta cívica / transparencia (OpenGov + Directorio Legislativo)
   ============================================================ */

:root {
  --c-bg:        #F7F8FA;
  --c-surface:   #FFFFFF;
  --c-ink:       #0E1B2C;
  --c-ink-soft:  #475569;
  --c-line:      #E2E8F0;
  --c-line-soft: #EFF2F6;
  --c-accent:    #0E4D8C;      /* azul institucional Córdoba */
  --c-accent-d:  #093661;
  --c-accent-s:  #E7EEF6;
  --c-pos:       #2F8F4F;       /* beneficia */
  --c-pos-soft:  #E5F3EA;
  --c-neg:       #C13B3B;       /* perjudica */
  --c-neg-soft:  #FAE6E6;
  --c-mix:       #A8741F;       /* mixto */
  --c-mix-soft:  #FBF1DD;
  --c-warn:      #B48311;

  --r-card:      10px;
  --r-chip:      999px;
  --shadow-sm:   0 1px 2px rgba(14,27,44,.05);
  --shadow-md:   0 4px 16px rgba(14,27,44,.08);

  --f-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --f-serif: 'Source Serif 4', 'Source Serif Pro', Georgia, 'Times New Roman', serif;

  /* ───────── v2.0 · sistema de estilo (plan-home-v2 §3) ───────── */
  /* Fondos / tinta / líneas adicionales */
  --c-surface-alt: #FAFBFC;   /* alterno suave (hero, secciones) */
  --c-ink-mute:    #94A3B8;   /* texto auxiliar / meta */
  /* Acento informativo (pendiente activo / neutral) */
  --c-info:        #3B6BB0;
  --c-info-soft:   #DCE7F4;

  /* Tipografía: familia mono para números/datos */
  --f-mono: ui-monospace, 'SF Mono', 'SFMono-Regular', Menlo, Consolas, monospace;

  /* Escala tipográfica controlada (civic-tech: no grita) */
  --t-hero:  clamp(2rem, 1.4rem + 2.4vw, 2.8rem);  /* h1 hero · serif */
  --t-h2:    1.8rem;    /* títulos de sección · serif */
  --t-h3:    1.15rem;   /* títulos de card · serif */
  --t-h4:    0.95rem;   /* sub-títulos · sans 600 */
  --t-lead:  1.08rem;   /* lead de sección */
  --t-body:  1rem;      /* párrafos */
  --t-small: 0.85rem;   /* secundario */
  --t-meta:  0.72rem;   /* etiquetas, eyebrow · mayúsculas + tracking */

  /* Espaciado base (4·8·12·16·24·32·48·72·96) */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 72px; --sp-9: 96px;

  /* Radios v2.0 (botón 6 · card 8) */
  --r-btn:  6px;
  --r-card-v2: 8px;
}

* { box-sizing: border-box; }

html, body { margin: 0; padding: 0; }

body {
  font-family: var(--f-sans);
  background: var(--c-bg);
  color: var(--c-ink);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

a {
  color: var(--c-accent);
  text-decoration: none;
  transition: color .15s ease;
}
a:hover { color: var(--c-accent-d); text-decoration: underline; }

h1, h2, h3, h4 { font-family: var(--f-serif); font-weight: 600; line-height: 1.2; color: var(--c-ink); margin: 0; }
h1 { font-size: 2.4rem; letter-spacing: -.01em; }
h2 { font-size: 1.8rem; letter-spacing: -.005em; }
h3 { font-size: 1.25rem; }
h4 { font-size: 1.05rem; }

p { margin: 0 0 .8rem; }
.lead { font-size: 1.1rem; color: var(--c-ink-soft); line-height: 1.6; }

.wrap {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}

/* ───────── Header ───────── */
.site-header {
  background: var(--c-surface);
  border-bottom: 1px solid var(--c-line);
  position: sticky; top: 0; z-index: 50;
}
.site-header .wrap {
  display: flex; align-items: center; justify-content: space-between;
  height: 64px;
}

/* Mini-header sticky (ficha de legislador / ley): aparece al scrollear, debajo del nav */
.sticky-mini {
  position: fixed; left: 0; right: 0; top: 64px; z-index: 49;
  background: var(--c-surface); border-bottom: 1px solid var(--c-line);
  box-shadow: 0 2px 8px rgba(0,0,0,.05);
  transform: translateY(-100%); opacity: 0; pointer-events: none;
  transition: transform .2s ease, opacity .2s ease;
}
.sticky-mini.visible { transform: translateY(0); opacity: 1; pointer-events: auto; }
.sticky-mini-in { display: flex; align-items: center; gap: 12px; height: 52px; }
.sticky-mini-av {
  width: 36px; height: 36px; font-size: .72rem; border-width: 1px;
}
.sticky-mini-txt { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.sticky-mini-name {
  font-weight: 700; font-size: .95rem; color: var(--c-ink);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sticky-mini-name-ley { font-family: var(--f-serif); }
.sticky-mini-meta {
  font-size: .78rem; color: var(--c-ink-soft);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
@media (max-width: 760px) {
  .sticky-mini { top: 60px; }
  .sticky-mini-in { height: 48px; gap: 10px; }
  .sticky-mini-name { font-size: .9rem; }
  .sticky-mini-meta { font-size: .74rem; }
}
.brand {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--f-serif); font-weight: 600; font-size: 1.15rem;
  color: var(--c-ink);
}
.brand:hover { text-decoration: none; color: var(--c-ink); }
.brand-mark {
  width: 36px; height: 36px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.brand-mark img,
.brand-mark svg {
  width: 100%; height: 100%;
  object-fit: contain;
  display: block;
}
/* Selector de provincia en el header */
.prov-picker {
  display: flex; align-items: center; gap: 8px;
  margin-left: auto;
  margin-right: 28px;
}
.prov-label {
  font-size: .82rem;
  color: var(--c-ink-soft);
  font-weight: 500;
}
.prov-select {
  border: 1px solid var(--c-line);
  background: var(--c-accent-s);
  color: var(--c-accent-d);
  border-radius: var(--r-chip);
  padding: 6px 14px 6px 12px;
  font: inherit;
  font-size: .88rem;
  font-weight: 600;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease;
}
.prov-select:hover { background: var(--c-surface); border-color: var(--c-accent); }
.prov-select:focus { outline: 2px solid var(--c-accent); outline-offset: 1px; }

.nav-links { display: flex; gap: 28px; align-items: center; }
.nav-links a {
  color: var(--c-ink-soft);
  font-size: .92rem;
  font-weight: 500;
  padding: 6px 0;
  border-bottom: 2px solid transparent;
}
.nav-links a.active,
.nav-links a:hover {
  color: var(--c-accent);
  text-decoration: none;
  border-bottom-color: var(--c-accent);
}

/* ───────── Nav dropdown (Poder Legislativo) ───────── */
.nav-dropdown { position: relative; }
.nav-dropdown-toggle {
  background: none;
  border: none;
  font: inherit;
  color: var(--c-ink-soft);
  cursor: pointer;
  padding: 6px 0;
  border-bottom: 2px solid transparent;
  font-weight: 500;
  font-size: .92rem;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  transition: color .12s, border-color .12s;
}
.nav-dropdown-toggle:hover,
.nav-dropdown-toggle.active {
  color: var(--c-accent);
  border-bottom-color: var(--c-accent);
}
.nav-dropdown-toggle .caret {
  display: inline-block;
  transition: transform .15s;
  font-size: .7rem;
}
.nav-dropdown.open .nav-dropdown-toggle .caret { transform: rotate(180deg); }

.nav-dropdown-menu {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  min-width: 200px;
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: 8px;
  box-shadow: 0 8px 20px rgba(14, 27, 44, 0.08), 0 2px 6px rgba(14, 27, 44, 0.04);
  padding: 4px;
  display: none;
  z-index: 100;
}
.nav-dropdown.open .nav-dropdown-menu { display: block; }
.nav-dropdown-menu a {
  display: block;
  padding: 7px 12px;
  border-radius: 5px;
  color: var(--c-ink);
  font-size: .88rem;
  font-weight: 500;
  border-bottom: none;
  line-height: 1.3;
}
.nav-dropdown-menu a:hover {
  background: var(--c-accent-s);
  color: var(--c-accent-d);
  text-decoration: none;
  border-bottom: none;
}
.nav-dropdown-menu a.active {
  background: var(--c-accent-s);
  color: var(--c-accent-d);
  border-bottom: none;
}
.nav-dropdown-menu .menu-sep {
  height: 1px;
  background: var(--c-line-soft);
  margin: 6px 4px;
}
@media (max-width: 640px) {
  .nav-dropdown-menu { right: auto; left: 0; }
}

/* ───────── Nav mobile · hamburger (≤760px) ───────── */
/* El botón lo inyecta app.js (initMobileNav). Oculto en desktop. */
.nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  width: 40px; height: 38px;
  padding: 0 9px;
  margin-left: 12px;
  border: 1px solid var(--c-line);
  border-radius: 8px;
  background: var(--c-surface);
  cursor: pointer;
}
.nav-toggle span {
  display: block; height: 2px; width: 100%;
  background: var(--c-ink); border-radius: 2px;
  transition: transform .2s ease, opacity .2s ease;
}
.nav-open .nav-toggle span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.nav-open .nav-toggle span:nth-child(2) { opacity: 0; }
.nav-open .nav-toggle span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

@media (max-width: 760px) {
  .nav-toggle { display: flex; margin-left: auto; }
  .site-header .wrap { flex-wrap: wrap; height: auto; min-height: 60px; padding-top: 10px; padding-bottom: 10px; }
  /* El selector de provincia queda SIEMPRE visible en mobile (fuera del
     hamburguesa); solo los nav-links se ocultan tras el toggle. */
  .site-header .nav-links { display: none; }
  .site-header .prov-picker {
    display: flex; order: 3; flex-basis: 100%; width: 100%;
    margin: 8px 0 0; margin-left: 0; margin-right: 0;
  }
  .site-header.nav-open .nav-links { display: flex; flex-basis: 100%; width: 100%; margin: 10px 0 0; }
  .site-header.nav-open .nav-links { flex-direction: column; align-items: flex-start; gap: 2px; }
  .site-header.nav-open .nav-links a,
  .site-header.nav-open .nav-dropdown,
  .site-header.nav-open .nav-dropdown-toggle { width: 100%; padding: 9px 0; }
  /* Dropdown "Poder Legislativo" inline dentro del panel (no flotante) */
  .site-header.nav-open .nav-dropdown-menu {
    position: static; display: none;
    box-shadow: none; border: none; padding: 0 0 4px 12px; min-width: 0;
  }
  .site-header.nav-open .nav-dropdown.open .nav-dropdown-menu { display: block; }

  /* Tooltips de hover (no usables en touch): ocultarlos para que su ancho
     sin-wrap no expanda el scroll horizontal en mobile. */
  .tl-votos-tip, .map-tile-name { display: none !important; }

  /* Tablas anchas: scroll horizontal propio en vez de desbordar la página. */
  .peso-table, .tabla-catalogo {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
  }
}

/* ───────── Hero ───────── */
.hero {
  background:
    linear-gradient(180deg, var(--c-accent-s) 0%, var(--c-bg) 100%);
  padding: 56px 0 40px;
  border-bottom: 1px solid var(--c-line);
}
.hero h1 { max-width: 820px; font-size: 2.8rem; line-height: 1.1; }
.hero h1 .muted { color: var(--c-ink-soft); font-style: italic; }
.hero .lead { max-width: 720px; margin-top: 14px; }
.eyebrow {
  display: inline-block;
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--c-accent-d);
  background: var(--c-accent-s);
  padding: 5px 12px;
  border-radius: var(--r-chip);
  margin-bottom: 16px;
}
.countdown {
  display: flex; align-items: center; gap: 18px;
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-left: 4px solid var(--c-accent);
  border-radius: var(--r-card);
  padding: 16px 22px;
  margin-top: 28px;
  max-width: 620px;
  box-shadow: var(--shadow-sm);
}
.countdown-num {
  font-family: var(--f-serif);
  font-weight: 600;
  font-size: 2.6rem;
  color: var(--c-accent);
  line-height: 1;
  letter-spacing: -.01em;
  min-width: 78px;
  text-align: right;
}
.countdown-txt strong {
  display: block;
  font-weight: 600;
  font-size: 1.02rem;
  color: var(--c-ink);
  margin-bottom: 2px;
}
.countdown-txt span {
  display: block;
  font-size: .85rem;
  color: var(--c-ink-soft);
}
/* Diferenciador editorial en el hero */
.diferenciador {
  margin-top: 32px;
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-top: 3px solid var(--c-accent);
  border-radius: var(--r-card);
  padding: 20px 24px 22px;
  max-width: 820px;
  box-shadow: var(--shadow-sm);
}
.dif-eyebrow {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--c-accent);
  margin-bottom: 8px;
}
.diferenciador p {
  margin: 0;
  font-size: 1rem;
  line-height: 1.55;
  color: var(--c-ink);
}
.diferenciador p strong { color: var(--c-accent-d); }
.diferenciador p a {
  display: inline-block;
  margin-top: 4px;
  font-weight: 600;
}

/* Banda de Modo Elección 2027 */
.eleccion-banner {
  display: flex; align-items: center; gap: 24px; flex-wrap: wrap;
  background: linear-gradient(90deg, var(--c-accent-s) 0%, var(--c-surface) 100%);
  border: 1px solid var(--c-accent);
  border-left: 4px solid var(--c-accent);
  border-radius: var(--r-card);
  padding: 18px 24px;
  margin: 24px 0 20px;
  box-shadow: var(--shadow-sm);
}
.eb-text { flex: 1; min-width: 280px; }
.eb-text > strong {
  display: block;
  color: var(--c-accent-d);
  font-size: 1.02rem;
  font-weight: 600;
  margin-bottom: 4px;
}
.eb-text > span {
  color: var(--c-ink-soft);
  font-size: .88rem;
  line-height: 1.5;
}
.eb-text > span strong { color: var(--c-ink); font-weight: 600; }
.eleccion-banner .toggle-eleccion {
  margin-left: auto;
}

.manifest {
  margin-top: 40px;
  background: var(--c-ink);
  color: white;
  border-radius: var(--r-card);
  padding: 28px 32px;
  box-shadow: var(--shadow-md);
}
.manifest h3 {
  font-family: var(--f-serif);
  font-size: 1.5rem;
  color: white;
  margin: 0 0 10px;
  display: block;
}
.manifest h3::before { display: none; }
.manifest p {
  color: rgba(255,255,255,.85);
  font-size: 1.02rem;
  line-height: 1.55;
  margin: 0;
  max-width: 760px;
}
.hero-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-top: 36px;
}
.stat {
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--r-card);
  padding: 16px 18px;
  box-shadow: var(--shadow-sm);
}
.stat-num {
  font-family: var(--f-serif);
  font-size: 1.9rem;
  font-weight: 600;
  color: var(--c-accent);
  display: block;
  line-height: 1;
}
.stat-pct { font-family: var(--f-sans, inherit); font-size: .9rem; font-weight: 600; color: var(--c-ink-soft); vertical-align: middle; }
.stat-label {
  font-size: .82rem;
  color: var(--c-ink-soft);
  margin-top: 6px;
  display: block;
}

/* ───────── Mapa nacional (tilemap) ───────── */
.mapa-nacional {
  padding: 56px 0 48px;
  background: var(--c-surface);
  border-bottom: 1px solid var(--c-line);
}
.mapa-nacional .section-head {
  margin-bottom: 28px;
  justify-content: center;
  text-align: center;
}
.mapa-nacional h2 { margin-bottom: 6px; }
.mapa-nacional .section-head p { max-width: 640px; margin: 0 auto; color: var(--c-ink-soft); }

.map-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 5px;
  max-width: 460px;
  margin: 0 auto;
}
.map-tile {
  aspect-ratio: 1;
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: white;
  text-align: center;
  cursor: pointer;
  position: relative;
  transition: transform .15s ease, box-shadow .15s ease, outline-color .15s ease;
  text-decoration: none;
  padding: 4px 2px;
  min-height: 44px;
}
.map-tile:hover { text-decoration: none; }
.map-tile.has-data:hover {
  transform: scale(1.15);
  z-index: 3;
  box-shadow: 0 6px 18px rgba(14,27,44,.28);
}
.map-tile.no-data {
  cursor: default;
  opacity: .42;
}
.map-tile.no-data:hover { transform: none; box-shadow: none; }
.map-tile-sigla {
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .04em;
  opacity: .9;
  line-height: 1;
}
.map-tile-score {
  font-family: var(--f-serif);
  font-weight: 600;
  font-size: 1rem;
  line-height: 1;
  margin-top: 3px;
}
.map-tile-name {
  position: absolute;
  bottom: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%);
  background: var(--c-ink);
  color: white;
  padding: 6px 10px;
  border-radius: 5px;
  font-family: var(--f-sans);
  font-size: .76rem;
  font-weight: 500;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity .15s ease;
  z-index: 5;
}
.map-tile:hover .map-tile-name { opacity: 1; }
.map-tile.is-current {
  outline: 3px solid var(--c-ink);
  outline-offset: 2px;
}

.map-legend {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 28px;
  font-size: .8rem;
  color: var(--c-ink-soft);
  justify-content: center;
  flex-wrap: wrap;
}
.legend-gradient {
  display: inline-block;
  width: 240px;
  height: 10px;
  border-radius: 5px;
  background: linear-gradient(to right,
    hsl(0, 65%, 42%) 0%,
    hsl(30, 65%, 45%) 25%,
    hsl(60, 65%, 50%) 50%,
    hsl(90, 65%, 45%) 75%,
    hsl(120, 65%, 42%) 100%
  );
}
.legend-gray-chip {
  display: inline-block;
  width: 14px;
  height: 14px;
  border-radius: 3px;
  background: #CBD5E1;
  vertical-align: middle;
  margin-right: 4px;
}
.legend-divider {
  width: 1px; height: 18px;
  background: var(--c-line);
  margin: 0 6px;
}

@media (max-width: 600px) {
  .map-grid { max-width: 340px; gap: 4px; }
  .map-tile-sigla { font-size: .56rem; }
  .map-tile-score { font-size: .88rem; }
}

/* ───────── Section helpers ───────── */
.section { padding: 48px 0; }
.section-head {
  display: flex; align-items: end; justify-content: space-between;
  margin-bottom: 24px;
  gap: 18px; flex-wrap: wrap;
}
.section-head h2 { margin-bottom: 4px; }
.section-head p { color: var(--c-ink-soft); margin: 0; }

/* ───────── Filtros ───────── */
.filters {
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--r-card);
  padding: 14px 18px;
  display: flex; align-items: center; gap: 18px; flex-wrap: wrap;
  margin-bottom: 24px;
  box-shadow: var(--shadow-sm);
}
.filter-group {
  display: flex; align-items: center; gap: 8px;
  font-size: .9rem;
}
.filter-group label {
  color: var(--c-ink-soft); font-weight: 500;
}
.filter-group select,
.filter-group input[type=search] {
  border: 1px solid var(--c-line);
  border-radius: 6px;
  padding: 7px 10px;
  font: inherit;
  font-size: .9rem;
  background: var(--c-bg);
  color: var(--c-ink);
}
.filter-group input[type=search] { min-width: 220px; }

/* ───────── Tarjetas de legislador ───────── */
.grid-legisladores {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 18px;
}
.card-leg {
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--r-card);
  padding: 18px;
  display: flex; flex-direction: column;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
  box-shadow: var(--shadow-sm);
}
.card-leg:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
  text-decoration: none;
  border-color: var(--c-accent);
}
.card-leg-head {
  display: flex; align-items: center; gap: 14px;
  margin-bottom: 12px;
}
.avatar {
  width: 60px; height: 60px;
  border-radius: 50%;
  color: white;
  display: flex; align-items: center; justify-content: center;
  font-weight: 600; font-size: 1.15rem;
  font-family: var(--f-serif);
  border: 2px solid var(--c-surface);
  box-shadow: 0 0 0 1px var(--c-line);
  flex-shrink: 0;
  position: relative;
  overflow: hidden;
}
.avatar img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  border-radius: inherit;
}
.card-leg-name {
  font-family: var(--f-serif);
  font-weight: 600;
  font-size: 1.08rem;
  color: var(--c-ink);
  line-height: 1.2;
}
.card-leg-role {
  font-size: .82rem;
  color: var(--c-ink-soft);
  margin-top: 2px;
}
.card-leg-tiempo {
  font-size: .76rem;
  color: var(--c-ink-soft);
  margin-top: 4px;
  opacity: .8;
  font-style: italic;
}
.card-mandato-tag {
  display: inline-block;
  margin-left: 6px;
  font-size: .68rem;
  font-weight: 500;
  padding: 2px 7px;
  border-radius: var(--r-chip);
  background: var(--c-line-soft);
  color: var(--c-ink-soft);
  vertical-align: middle;
  font-family: var(--f-sans);
}
.card-leg.card-leg-terminado {
  opacity: .72;
  background: linear-gradient(180deg, var(--c-bg) 0%, var(--c-surface) 100%);
}
.card-leg.card-leg-terminado:hover { opacity: 1; }
.card-leg.card-leg-terminado .card-leg-tiempo {
  color: var(--c-mix);
  font-weight: 500;
  font-style: normal;
}

/* Tags de mandato en ficha individual */
.leg-mandato-tag {
  display: inline-block;
  margin-left: 12px;
  font-size: .8rem;
  font-weight: 500;
  padding: 4px 12px;
  border-radius: var(--r-chip);
  background: var(--c-accent-s);
  color: var(--c-accent-d);
  vertical-align: middle;
  font-family: var(--f-sans);
}
.voto-mandato-tag {
  display: inline-block;
  margin-left: 6px;
  font-size: .68rem;
  color: var(--c-ink-soft);
  font-style: italic;
  font-weight: 400;
}
.voto-cargo-chip {
  display: inline-block;
  margin-left: 8px;
  padding: 1px 7px;
  background: var(--c-accent-s);
  color: var(--c-accent-d);
  font-size: .68rem;
  font-weight: 600;
  letter-spacing: .02em;
  border-radius: 4px;
  vertical-align: 2px;
  white-space: nowrap;
}

/* Filtros secundarios */
.filtros-secundarios {
  margin: 0 0 18px;
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}
#legisladores.section { padding-top: 24px; }
.filtros-secundarios .toggle-eleccion { margin-left: auto; }
.modo-eleccion-leyenda { margin: 0 0 14px; font-size: .85rem; font-weight: 600; color: var(--c-accent-d); }
.modo-eleccion-leyenda[hidden] { display: none; }
.toggle-secundario {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: .82rem;
  color: var(--c-ink-soft);
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 6px;
  user-select: none;
}
.toggle-secundario:hover { background: var(--c-line-soft); color: var(--c-ink); }
.toggle-secundario input[type=checkbox] {
  accent-color: var(--c-accent);
  cursor: pointer;
}
.chip {
  display: inline-flex; align-items: center;
  padding: 3px 10px;
  border-radius: var(--r-chip);
  font-size: .75rem;
  font-weight: 500;
  background: var(--c-line-soft);
  color: var(--c-ink-soft);
  border: 1px solid var(--c-line);
}
.chip-bloque {
  border-left: 3px solid var(--bloque-color, var(--c-accent));
  background: var(--c-line-soft);
  padding-left: 8px;
}
.card-leg-meta {
  display: flex; gap: 6px; flex-wrap: wrap;
  margin-bottom: 14px;
}
.score-bar {
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid var(--c-line-soft);
}
.score-bar-coh {
  margin-top: 0;
  padding-top: 10px;
  border-top: none;
}
.score-label {
  display: flex; justify-content: space-between;
  font-size: .78rem;
  color: var(--c-ink-soft);
  margin-bottom: 4px;
}
.score-track {
  height: 6px;
  background: var(--c-line-soft);
  border-radius: 3px;
  overflow: hidden;
  display: flex;
}
.score-pos { background: var(--c-pos); }
.score-neg { background: var(--c-neg); }
.score-fill {
  background: var(--c-accent);
  border-radius: 3px;
  transition: width .25s ease;
}
.score-num {
  font-weight: 600;
  font-family: var(--f-serif);
  color: var(--c-ink);
}

/* ───────── Ficha individual ───────── */
.leg-profile {
  background: var(--c-surface);
  border-bottom: 1px solid var(--c-line);
  padding: 40px 0 32px;
}
.leg-profile-row {
  display: grid;
  grid-template-columns: 140px 1fr auto;
  gap: 28px;
  align-items: start;
}
/* Dos copias de la réplica: .leg-rep-desk (dentro de la columna de info, desktop) y
   .leg-rep-mob (hija directa del profile-row, full-width debajo del score en mobile).
   Desktop: se muestra la de info y se oculta la mobile. */
.leg-profile-row .leg-rep-mob { display: none; }
/* Columna del score: score + (réplica mobile) + share viajan como UN bloque.
   En WEB se levanta hacia el espacio vacío de arriba-derecha (junto al badge IA), para no
   dejar blanco; en MOBILE va full-width debajo del perfil (score → réplica → share).
   Etiqueta + botones del share EN UNA MISMA FILA (no apilados). */
.leg-profile-row .leg-score-col { grid-column: 3; display: flex; flex-direction: column; gap: 14px; margin-top: -40px; }
/* Share: copia WEB dentro de .leg-score-col (sube con el score); copia MOBILE como fila
   aparte al pie del módulo perfil. Cada una se muestra en su breakpoint. */
.leg-profile-row .leg-share-mob { display: none; }
.leg-share-block, .ley-share-block { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.leg-share-block .share-row-label, .ley-share-block .share-row-label { margin: 0; white-space: nowrap; }
.leg-share-block .leg-share-row, .ley-share-block .ley-share-row { margin-top: 0; }
.ley-share-block { margin-top: 14px; }
.ley-share-row .share-btn, .ley-share-row .tw-btn, .ley-share-row .story-btn, .ley-share-row .wa-btn { margin-top: 0; }
.leg-name-row {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.leg-name-row .share-btn { margin-top: 0; }
.avatar-lg {
  width: 140px; height: 140px;
  border-radius: 50%;
  color: white;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--f-serif);
  font-weight: 600;
  font-size: 2.6rem;
  border: 3px solid var(--c-surface);
  box-shadow: 0 0 0 1px var(--c-line);
  position: relative;
  overflow: hidden;
}
.avatar-lg img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  border-radius: inherit;
}
.leg-name {
  font-family: var(--f-serif);
  font-size: 2.2rem;
  font-weight: 600;
  letter-spacing: -.005em;
  margin: 0 0 4px;
}
.leg-cargo {
  color: var(--c-ink-soft);
  font-size: 1.05rem;
  margin-bottom: 6px;
}
.leg-mandato {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  font-size: .9rem;
  color: var(--c-ink-soft);
  margin-bottom: 14px;
}
.leg-mandato strong { color: var(--c-ink); font-weight: 600; }
.leg-mandato .dot { color: var(--c-line); }
.leg-tags { display: flex; gap: 8px; flex-wrap: wrap; }
.leg-score-card {
  background: var(--c-accent-s);
  border: 1px solid var(--c-accent);
  border-radius: var(--r-card);
  padding: 18px 22px;
  text-align: center;
  min-width: 200px;
}
.leg-score-card .big {
  font-family: var(--f-serif);
  font-size: 2.6rem;
  font-weight: 600;
  color: var(--c-accent-d);
  line-height: 1;
}
.leg-score-card .lbl {
  font-size: .82rem;
  color: var(--c-accent-d);
  margin-top: 4px;
}
/* Enfoque real para el país (mirada con la que vota de verdad, ≠ la declarada) */
.enfoque-real { margin-top: 10px; text-align: center; }
.enfoque-real .er-lbl { display: block; font-size: .62rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--c-accent-d); opacity: .7; }
.enfoque-real strong { display: inline-block; margin-top: 4px; padding: 2px 12px; border-radius: 999px; font-size: .84rem; font-weight: 700; }
.enfoque-desarrollista strong { background: var(--c-accent-soft, #e8f1ff); color: var(--c-accent-d); }
.enfoque-liberal strong { background: #f4ede0; color: var(--c-mix); }
.enfoque-mixto strong { background: var(--c-line-soft); color: var(--c-ink-soft); }
/* Ideas transversales (ficha del legislador · panel derecho) */
.it-dim { border-top: 1px solid var(--c-line-soft); }
.it-dim:first-of-type { border-top: none; }
.it-dim-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 0; cursor: pointer; font-weight: 600; font-size: .92rem; color: var(--c-ink); list-style: none; }
.it-dim-head::-webkit-details-marker { display: none; }
.it-dim-head::after { content: '+'; color: var(--c-ink-soft); font-weight: 400; }
.it-dim[open] .it-dim-head::after { content: '−'; }
.it-dim-count { margin-left: auto; font-size: .7rem; font-weight: 600; color: var(--c-ink-soft); background: var(--c-line-soft); border-radius: 999px; padding: 2px 8px; }
.it-dim-pos { background: var(--c-pos-soft); color: var(--c-pos); }
.it-dim-neg { background: var(--c-neg-soft); color: var(--c-neg); }
.it-dim-neu { background: var(--c-line-soft); color: var(--c-ink-soft); }
.it-subs { padding: 0 0 10px; }
.it-sub { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 5px 0; font-size: .82rem; }
.it-sub-name { color: var(--c-ink-soft); min-width: 0; }
.it-sub-val { font-weight: 600; white-space: nowrap; flex-shrink: 0; font-size: .76rem; }
.it-pos { color: var(--c-pos); }
.it-neg { color: var(--c-neg); }
.it-neu { color: var(--c-ink-soft); }
.leg-score-card .ratio {
  font-size: .82rem;
  color: var(--c-ink-soft);
  margin-top: 12px;
}
.score-mini {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(14,77,140,.2);
}
.score-mini.score-mini-4 {
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
}
.score-mini.score-mini-4 strong { font-size: .98rem; }
.score-mini.score-mini-4 span { font-size: .62rem; }
.score-mini span {
  display: flex; flex-direction: column;
  font-size: .68rem;
  color: var(--c-ink-soft);
  align-items: center;
  text-align: center;
}
.score-mini strong {
  display: block;
  font-family: var(--f-serif);
  font-size: 1.1rem;
  color: var(--c-accent-d);
  font-weight: 600;
  line-height: 1.1;
  margin-bottom: 2px;
}

/* Score breakdown en sidebar */
.score-breakdown {
  display: grid;
  gap: 8px;
}
.sb-row {
  display: flex; justify-content: space-between;
  font-size: .9rem;
  padding: 4px 0;
}
.sb-row .sb-label { color: var(--c-ink-soft); }
.sb-row .sb-value { font-weight: 600; font-family: var(--f-serif); }
.sb-row.total {
  border-top: 1px solid var(--c-line);
  padding-top: 10px;
  margin-top: 4px;
}
.sb-row.total .sb-label { color: var(--c-ink); font-weight: 600; }
.sb-row.total .sb-value {
  color: var(--c-accent);
  font-size: 1.1rem;
}
.sb-explicacion {
  margin: 8px 0 0;
  padding: 8px 12px;
  background: var(--c-bg);
  border-radius: 6px;
  font-size: .82rem;
  line-height: 1.55;
  color: var(--c-ink-soft);
}
.sb-explicacion strong { color: var(--c-ink); font-weight: 600; }

/* "Cómo se compone el score": bullets + mini-tags de color */
.score-explica { margin-top: 14px; }
.score-explica-lead {
  font-size: .86rem; line-height: 1.5; color: var(--c-ink); margin: 0 0 10px;
}
.score-explica-lead strong { font-weight: 700; }
.score-explica-list, .score-explica-notas {
  list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column;
}
.score-explica-list { gap: 9px; }
.score-explica-list li {
  font-size: .82rem; line-height: 1.45; color: var(--c-ink-soft);
}
.score-tag {
  display: inline-block; margin-right: 6px; font-size: .68rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .03em; padding: 1px 7px; border-radius: 999px;
  vertical-align: baseline;
}
.score-tag-coh { background: var(--c-pos-soft); color: var(--c-pos); }
.score-tag-asi { background: rgba(14,77,140,.12); color: var(--c-accent); }
.score-tag-dec { background: var(--c-mix-soft); color: var(--c-mix); }

/* 3 tarjetas de factores del score: qué mide + cómo se calcula con números reales */
.sf-cards { display: flex; flex-direction: column; gap: 8px; margin: 4px 0 0; }
.sf-card {
  padding: 9px 11px; border-radius: 8px;
  background: var(--c-surface); border: 1px solid var(--c-line);
  border-left: 3px solid var(--c-line);
}
.sf-card-coh { border-left-color: var(--c-pos); }
.sf-card-asi { border-left-color: var(--c-accent); }
.sf-card-dec { border-left-color: var(--c-mix); }
.sf-card-top { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.sf-card > summary.sf-card-top { list-style: none; cursor: pointer; }
.sf-card > summary.sf-card-top::-webkit-details-marker { display: none; }
.sf-card > summary.sf-card-top .sf-card-name { flex: 1; }
.sf-card-caret { display: none; }
.sf-card > summary.sf-card-top::before { content: '\25B6'; color: var(--c-ink-soft); font-size: .8rem; line-height: 1; flex-shrink: 0; font-weight: 400; align-self: center; }
.sf-card[open] > summary.sf-card-top::before { content: '\25BC'; color: var(--c-accent); }
.sf-card[open] > summary.sf-card-top { margin-bottom: 7px; }
.sf-card-name { font-size: .82rem; font-weight: 700; color: var(--c-ink); }
.sf-card-val { font-size: 1.15rem; font-weight: 700; font-family: var(--f-serif); line-height: 1; }
.sf-val-coh { color: var(--c-pos); }
.sf-val-asi { color: var(--c-accent); }
.sf-val-dec { color: var(--c-mix); }
.sf-card-mide { margin: 5px 0 0; font-size: .76rem; line-height: 1.4; color: var(--c-ink-soft); }
.sf-card-real { margin: 4px 0 0; font-size: .76rem; line-height: 1.4; color: var(--c-ink-soft); }
.sf-card-real strong { color: var(--c-ink); font-weight: 700; }
.sf-bar {
  margin-top: 7px; height: 4px; border-radius: 999px; background: var(--c-line-soft); overflow: hidden;
}
.sf-bar-fill { display: block; height: 100%; border-radius: 999px; }
.sf-bar-coh { background: var(--c-pos); }
.sf-bar-asi { background: var(--c-accent); }
.sf-bar-dec { background: var(--c-mix); }
.sf-detail { margin-top: 8px; }
.sf-detail-head {
  cursor: pointer; list-style: none;
  font-size: .74rem; font-weight: 600; color: var(--c-ink-soft);
  transition: color .15s ease;
}
.sf-detail-head::-webkit-details-marker { display: none; }
.sf-detail-head::before { content: '\25B6  '; font-weight: 400; }
.sf-detail[open] .sf-detail-head::before { content: '\25BC  '; color: var(--c-accent); }
.sf-detail-head:hover { color: var(--c-accent); }
.sf-detail[open] .sf-detail-head { color: var(--c-accent-d); }
.sf-detail-body {
  margin-top: 6px; padding-left: 10px; border-left: 2px solid var(--c-line);
  font-size: .78rem; line-height: 1.55; color: var(--c-ink-soft);
}
.sf-detail-body strong { color: var(--c-ink); font-weight: 700; }
.sf-final {
  margin: 10px 0 0; padding: 8px 11px; border-radius: 8px;
  background: var(--c-bg); font-size: .82rem; line-height: 1.5; color: var(--c-ink-soft);
}
.sf-final strong { color: var(--c-ink); font-weight: 700; }
.sf-final-val { color: var(--c-accent); font-family: var(--f-serif); font-size: 1rem; }
.score-explica-notas {
  gap: 7px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--c-line-soft);
}
.score-explica-notas li {
  position: relative; padding-left: 14px;
  font-size: .8rem; line-height: 1.5; color: var(--c-ink-soft);
}
.score-explica-notas li::before {
  content: '·'; position: absolute; left: 4px; top: -1px; font-weight: 700; color: var(--c-ink-mute);
}
.score-explica-notas strong, .score-explica-list strong { color: var(--c-ink); font-weight: 600; }
.sb-detail {
  border-bottom: 1px solid var(--c-line-soft);
}
.sb-detail:last-of-type { border-bottom: none; }
.sb-detail > summary {
  cursor: pointer;
  list-style: none;
  padding: 10px 0;
  position: relative;
  padding-right: 22px;
  transition: color .15s ease;
}
.sb-detail > summary::-webkit-details-marker { display: none; }
.sb-detail > summary::after {
  content: '+';
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.2rem;
  font-weight: 400;
  color: var(--c-ink-soft);
  transition: transform .2s ease;
  line-height: 1;
}
.sb-detail[open] > summary::after {
  content: '−';
  color: var(--c-accent);
}
.sb-detail > summary:hover .sb-label { color: var(--c-accent); }
.sb-detail[open] > summary .sb-label { color: var(--c-accent-d); font-weight: 600; }

.sb-note {
  font-size: .82rem;
  color: var(--c-ink-soft);
  padding: 4px 0 12px 12px;
  border-left: 2px solid var(--c-line);
  margin-left: 4px;
  line-height: 1.55;
}
.sb-note-accent {
  border-left-color: var(--c-accent);
  color: var(--c-accent-d);
}
.sb-warning {
  background: #FFF8E5;
  border: 1px solid #F2D58A;
  color: #6B5119;
  border-radius: 6px;
  padding: 10px 14px;
  font-size: .85rem;
  margin-top: 12px;
  line-height: 1.5;
}
.sb-warning strong { color: #4B3408; }

/* Índice cívico */
.civico-head {
  display: flex; align-items: center; gap: 14px;
  margin-bottom: 14px;
}
.civico-checks {
  font-family: var(--f-serif);
  font-size: 1.8rem;
  font-weight: 600;
  color: var(--c-ink);
  line-height: 1;
}
.civico-nivel {
  display: inline-block;
  margin-top: 4px;
  font-size: .75rem;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: var(--r-chip);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.civico-alto  { background: var(--c-pos-soft); color: var(--c-pos); }
.civico-medio { background: var(--c-mix-soft); color: var(--c-mix); }
.civico-bajo  { background: var(--c-neg-soft); color: var(--c-neg); }
.civico-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; }
.civico-list li {
  font-size: .88rem;
  padding-left: 22px;
  position: relative;
  line-height: 1.4;
}
.civico-list li::before {
  position: absolute;
  left: 0; top: 0;
  width: 16px; height: 16px;
  border-radius: 4px;
  display: flex; align-items: center; justify-content: center;
  font-size: .72rem;
  font-weight: 700;
  color: white;
}
.civico-ok { color: var(--c-ink); }
.civico-ok::before { content: '✓'; background: var(--c-pos); }
.civico-no { color: var(--c-ink-soft); }
.civico-no::before { content: '✕'; background: var(--c-neg); }
.civico-na { color: var(--c-ink-soft); opacity: .7; }
.civico-na::before { content: '—'; background: var(--c-line); color: var(--c-ink-soft); }
.civico-pend { color: var(--c-ink-soft); display: flex; align-items: center; }
.civico-pend::before { content: ''; background: var(--c-line); }
.civico-pend-tag {
  font-size: .66rem; text-transform: uppercase; letter-spacing: .05em;
  color: var(--c-ink-soft); background: var(--c-line-soft);
  padding: 2px 8px; border-radius: var(--r-chip); margin-left: 8px; flex-shrink: 0;
}
.civico-titulo { display: flex; align-items: center; flex-wrap: wrap; }
.civico-chip-rojo {
  font-size: .68rem; font-weight: 600; letter-spacing: .03em;
  color: var(--c-neg); background: var(--c-neg-soft);
  padding: 2px 9px; border-radius: var(--r-chip); margin-left: 8px; flex-shrink: 0;
}
.civico-grupo .civico-pend-tag { vertical-align: middle; }
.civico-fuente { color: var(--c-accent-d); text-decoration: none; }
.civico-fuente:hover { text-decoration: underline; }
.civico-pendiente { background: var(--c-line-soft); color: var(--c-ink-soft); }
.civico-grupo {
  font-size: .72rem; text-transform: uppercase; letter-spacing: .05em;
  color: var(--c-ink-soft); margin: 16px 0 7px;
}
.btn-civico-rep {
  display: inline-flex; align-items: center; justify-content: center; width: 100%;
  margin-top: 16px; padding: 9px 14px; font-size: .88rem;
  background: transparent; color: var(--c-accent);
  border: 1px solid var(--c-line); border-radius: 10px;
  transition: background .15s ease, border-color .15s ease;
}
.btn-civico-rep:hover { background: var(--c-accent-s); border-color: var(--c-accent); }

/* Fórmula del score en metodología */
.score-formula {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  background: var(--c-accent-s);
  border: 1px solid var(--c-accent);
  border-radius: 10px;
  padding: 18px 22px;
  margin: 18px 0 6px;
  font-size: 1rem;
  color: var(--c-accent-d);
  font-weight: 500;
}
.score-formula > span:first-child {
  font-family: var(--f-serif);
  font-weight: 700;
  font-size: 1.15rem;
}
.formula-op {
  color: var(--c-ink-soft);
  font-weight: 400;
  font-family: var(--f-serif);
  font-size: 1.2rem;
}
.formula-term {
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--r-chip);
  padding: 6px 14px;
  font-size: .9rem;
  color: var(--c-ink);
  font-weight: 600;
}

/* ───────── Análisis estructural (Marco Editorial v0) ───────── */

/* Resumen / Score editorial de la ley */
.ae-summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  padding: 18px 22px;
  margin: 0 0 18px;
  border-radius: 10px;
  border: 1px solid var(--c-line);
  background: var(--c-surface);
  flex-wrap: wrap;
}
.ae-summary-pos { border-left: 4px solid var(--c-pos); background: var(--c-pos-soft); }
.ae-summary-neg { border-left: 4px solid var(--c-neg); background: var(--c-neg-soft); }
.ae-summary-neu { border-left: 4px solid var(--c-line); }
.ae-summary-label {
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--c-ink-soft);
  margin-bottom: 4px;
}
.ae-summary-score {
  font-family: var(--f-serif);
  font-weight: 600;
  font-size: 1.8rem;
  line-height: 1.1;
  color: var(--c-ink);
}
.ae-summary-pos .ae-summary-score { color: var(--c-pos); }
.ae-summary-neg .ae-summary-score { color: var(--c-neg); }
.ae-summary-breakdown {
  font-size: .82rem;
  color: var(--c-ink-soft);
  margin-top: 4px;
}
.ae-summary-dots {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.ae-dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 6px;
  font-family: var(--f-serif);
  font-weight: 700;
  font-size: 1rem;
  cursor: help;
}
.ae-dot-pos { background: var(--c-pos); color: white; }
.ae-dot-neg { background: var(--c-neg); color: white; }
.ae-dot-neu { background: var(--c-line); color: var(--c-ink-soft); }

.ae-grid {
  display: grid;
  gap: 12px;
}
.ae-card {
  border: 1px solid var(--c-line);
  border-left-width: 4px;
  border-radius: 10px;
  overflow: hidden;
  background: var(--c-surface);
}
/* Cuando es <details> y está cerrado, ocultar el contenido excepto el summary */
.ae-card[open] {
  box-shadow: var(--shadow-sm);
}
.ae-card > summary.ae-head {
  cursor: pointer;
  list-style: none;
}
.ae-card > summary.ae-head::-webkit-details-marker { display: none; }
.ae-card > summary.ae-head::after {
  content: '\25B6  Ver más detalles';
  display: block; flex-basis: 100%; grid-column: 1 / -1;
  margin-top: 10px;
  font-size: .72rem;
  font-weight: 600;
  color: var(--c-ink-soft);
  line-height: 1.2;
}
.ae-card[open] > summary.ae-head::after {
  content: '\25BC  Ver más detalles';
  color: var(--c-accent-d);
}
.ae-card > summary.ae-head { position: relative; padding-right: 20px !important; }
.ae-card.ae-pos { border-left-color: var(--c-pos); }
.ae-card.ae-neg { border-left-color: var(--c-neg); }
.ae-card.ae-neu { border-left-color: var(--c-line); }

.ae-head {
  display: grid;
  grid-template-columns: 48px 1fr auto;
  gap: 16px;
  align-items: center;
  padding: 18px 22px 14px;
}
.ae-icon {
  width: 40px; height: 40px;
  border-radius: 50%;
  background: var(--c-accent-s);
  color: var(--c-accent-d);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem;
}
.ae-pos .ae-icon { background: var(--c-pos-soft); color: var(--c-pos); }
.ae-neg .ae-icon { background: var(--c-neg-soft); color: var(--c-neg); }

/* Chip de capa por dimensión (Desarrollista / Liberal / Transversal) */
.ae-capa-chip {
  display: inline-block;
  font-size: .62rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
  padding: 2px 8px; border-radius: 999px; margin-bottom: 6px;
}
.ae-capa-desarrollista { background: var(--c-accent-s); color: var(--c-accent-d); }
.ae-capa-liberal       { background: #F5EAD7; color: var(--c-mix); }
.ae-capa-transversal   { background: var(--c-line-soft); color: var(--c-ink-soft); }

.ae-titles h4 {
  font-family: var(--f-serif);
  font-size: 1.18rem;
  margin: 0 0 4px;
  font-weight: 600;
  color: var(--c-ink);
}
.ae-pregunta {
  margin: 0;
  font-size: .88rem;
  color: var(--c-ink-soft);
  line-height: 1.45;
}

.ae-resp {
  text-align: right;
  display: flex; flex-direction: column;
  align-items: flex-end; gap: 4px;
}
.ae-binario {
  font-family: var(--f-serif);
  font-weight: 600;
  font-size: .95rem;
  padding: 4px 12px;
  border-radius: var(--r-chip);
  line-height: 1.2;
  white-space: nowrap;
}
.ae-binario-pos { background: var(--c-pos-soft); color: var(--c-pos); }
.ae-binario-neg { background: var(--c-neg-soft); color: var(--c-neg); }
.ae-binario-neu { background: var(--c-line-soft); color: var(--c-ink-soft); }
.ae-score {
  font-family: var(--f-serif);
  font-size: .82rem;
  font-weight: 500;
  color: var(--c-ink-soft);
}

.ae-bar {
  height: 4px;
  background: var(--c-line-soft);
  margin: 0 22px;
  border-radius: 2px;
  overflow: hidden;
}
.ae-fill {
  height: 100%;
  transition: width .3s ease;
}
.ae-fill-pos { background: var(--c-pos); }
.ae-fill-neg { background: var(--c-neg); }
.ae-fill-neu { background: var(--c-ink-soft); opacity: .3; }

.ae-subdims {
  padding: 6px 22px 18px;
}

.ae-subdim {
  border-top: 1px solid var(--c-line-soft);
  padding: 2px 0;
}
.ae-subdim[open] {
  background: var(--c-bg);
  margin: 4px -10px;
  padding: 4px 10px;
  border-radius: 6px;
  border-top: 1px solid transparent;
}
.ae-subdim.ae-subdim-empty {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  font-size: .88rem;
  color: var(--c-ink-soft);
  opacity: .55;
}
.ae-sub-head {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 12px 0;
  cursor: pointer;
  font-size: .92rem;
  list-style: none;
  user-select: none;
}
.ae-sub-head::-webkit-details-marker { display: none; }
.ae-sub-head:hover { color: var(--c-accent); }
.ae-sub-head::after {
  content: '\25B6  Ver más detalles';
  grid-column: 1 / -1;
  margin-top: 6px;
  font-size: .72rem; font-weight: 600; line-height: 1.2;
  color: var(--c-ink-soft);
}
.ae-subdim[open] > .ae-sub-head::after {
  content: '\25BC  Ver más detalles';
  color: var(--c-accent-d);
}

.ae-sub-id {
  font-family: var(--f-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
  font-size: .8rem;
  font-weight: 600;
  background: var(--c-line-soft);
  color: var(--c-ink-soft);
  padding: 3px 8px;
  border-radius: 4px;
  letter-spacing: .04em;
  text-align: center;
}
.ae-sub-name { line-height: 1.35; }
.ae-sub-val {
  font-family: var(--f-serif);
  font-weight: 700;
  font-size: .82rem;
  padding: 3px 12px;
  border-radius: var(--r-chip);
  min-width: 44px;
  text-align: center;
  white-space: nowrap;
}
.ae-sub-val-pos { background: var(--c-pos-soft); color: var(--c-pos); }
.ae-sub-val-neg { background: var(--c-neg-soft); color: var(--c-neg); }
.ae-sub-val-neu { background: var(--c-line-soft); color: var(--c-ink-soft); }

/* Detalle de sub-dimensión como diálogo: globos a izquierda y derecha, dos colores */
.ae-sub-body.ae-dialogo {
  padding: 10px 2px 18px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.ae-msg {
  display: flex;
  flex-direction: column;
  max-width: 86%;
}
.ae-msg-izq { align-self: flex-start; align-items: flex-start; }
.ae-msg-der { align-self: flex-end; align-items: flex-end; }
.ae-msg-label {
  font-size: .66rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--c-ink-soft);
  margin: 0 10px 4px;
}
.ae-burbuja {
  font-size: .9rem;
  line-height: 1.55;
  padding: 10px 14px;
  border-radius: 16px;
}
/* Color 1 · izquierda (sistema / EVB) */
.ae-msg-izq .ae-burbuja {
  background: var(--c-surface-alt);
  color: var(--c-ink);
  border: 1px solid var(--c-line);
  border-bottom-left-radius: 4px;
}
/* Color 2 · derecha (respuesta / contraparte) */
.ae-msg-der .ae-burbuja {
  background: var(--c-accent-s);
  color: var(--c-accent-d);
  border: 1px solid var(--c-accent-s);
  border-bottom-right-radius: 4px;
}
.ae-burbuja strong { color: inherit; }
/* Prefijo "Justificación:" dentro de la burbuja de respuesta */
.ae-just-pref { font-weight: 700; }
/* Burbuja-CTA: continúa la conversación con el agente (como un mensaje más del diálogo) */
.ae-msg-cta { margin-top: 2px; }
.ae-dialogo .ae-burbuja.ae-cta-continuar {
  display: inline-flex; align-items: center; gap: 7px;
  background: var(--c-accent-d); color: #fff; border-color: var(--c-accent-d);
  text-decoration: none; font-weight: 600; cursor: pointer;
  transition: filter .15s;
}
.ae-dialogo .ae-burbuja.ae-cta-continuar:hover { filter: brightness(1.12); text-decoration: none; }
.ae-cta-continuar svg { width: 16px; height: 16px; flex-shrink: 0; }

@media (max-width: 700px) {
  .ae-head {
    grid-template-columns: 38px 1fr;
    grid-template-rows: auto auto;
  }
  .ae-resp {
    grid-column: 1 / -1;
    align-items: flex-start;
    flex-direction: row;
    justify-content: space-between;
  }
  .ae-sub-head { grid-template-columns: 1fr auto; }
}

/* Score-mini con 5 columnas */
.score-mini.score-mini-5 {
  grid-template-columns: repeat(5, 1fr);
  gap: 4px;
}
.score-mini.score-mini-5 strong { font-size: .9rem; }
.score-mini.score-mini-5 span { font-size: .58rem; }

.score-mini.score-mini-6 {
  grid-template-columns: repeat(6, 1fr);
  gap: 4px;
}
.score-mini.score-mini-6 strong { font-size: .82rem; }
.score-mini.score-mini-6 span { font-size: .54rem; }
@media (max-width: 560px) {
  .score-mini.score-mini-6 { grid-template-columns: repeat(3, 1fr); row-gap: 10px; }
}

/* ───────── Fuentes consultadas (acordeón) ───────── */
.fuentes-list {
  display: grid;
  gap: 8px;
}
.fuente-cat {
  border: 1px solid var(--c-line);
  border-radius: 8px;
  overflow: hidden;
  background: var(--c-surface);
}
.fuente-cat[open] {
  border-color: var(--c-accent);
  box-shadow: var(--shadow-sm);
}
.fuente-head {
  cursor: pointer;
  list-style: none;
  padding: 14px 18px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 14px;
  position: relative;
}
.fuente-head::-webkit-details-marker { display: none; }
.fuente-head::marker { content: ''; }
.fuente-head::before {
  content: '\25B6';
  font-size: .8rem;
  color: var(--c-ink-soft);
  font-weight: 400;
  line-height: 1;
  flex-shrink: 0;
  width: 16px;
  text-align: center;
}
.fuente-cat[open] .fuente-head::before { content: '\25BC'; color: var(--c-accent); }
.fuente-cat:hover .fuente-head { background: var(--c-bg); }

/* "Fuentes consultadas" colapsable: el título queda visible y debajo el afford de despliegue */
.fuentes-exp { margin-top: 2px; }
.fuentes-exp-sum {
  list-style: none; cursor: pointer; user-select: none;
  display: inline-block;
  font-size: .72rem; font-weight: 600; color: var(--c-ink-soft);
  padding: 2px 0 14px;
}
.fuentes-exp-sum::-webkit-details-marker { display: none; }
.fuentes-exp-sum::before { content: '\25B6  '; }
details[open] > .fuentes-exp-sum { color: var(--c-accent-d); }
details[open] > .fuentes-exp-sum::before { content: '\25BC  '; }
.proy-clasif { font-size: .72rem; margin-bottom: 0; }
.proy-cats-exp { margin-top: 4px; }
.fuente-titles strong {
  display: block;
  font-size: 1rem;
  color: var(--c-ink);
  margin-bottom: 2px;
}
.fuente-cat[open] .fuente-titles strong { color: var(--c-accent-d); }
.fuente-desc {
  font-size: .82rem;
  color: var(--c-ink-soft);
}
.fuente-count {
  font-size: .8rem;
  color: var(--c-ink-soft);
  background: var(--c-line-soft);
  padding: 4px 12px;
  border-radius: var(--r-chip);
  font-weight: 500;
}
.fuente-items {
  list-style: none;
  padding: 4px 18px 18px;
  margin: 0;
  display: grid;
  gap: 12px;
}
.fuente-item {
  padding-left: 14px;
  border-left: 2px solid var(--c-accent-s);
}
.fuente-link {
  display: block;
  font-weight: 600;
  color: var(--c-accent-d);
  font-size: .92rem;
  margin-bottom: 4px;
}
.fuente-link:hover { text-decoration: underline; color: var(--c-accent); }
.fuente-item-desc {
  display: block;
  font-size: .85rem;
  color: var(--c-ink-soft);
  line-height: 1.5;
}

/* Tabla de pesos en metodología */
.peso-table {
  width: 100%;
  border-collapse: collapse;
  margin: 12px 0;
  font-size: .92rem;
}
.peso-table th, .peso-table td {
  padding: 10px 14px;
  text-align: left;
  border-bottom: 1px solid var(--c-line-soft);
}
.peso-table th {
  background: var(--c-line-soft);
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--c-ink-soft);
  font-weight: 600;
}
.peso-table td strong { font-family: var(--f-serif); font-size: 1.05rem; }
.peso-table tbody tr:last-child td { border-bottom: none; }

/* Defensas (contra-argumento) en página de ley */
.votos-list { display: grid; gap: 10px; }
.voto-row {
  border: 1px solid var(--c-line);
  border-radius: 8px;
  overflow: hidden;
  background: var(--c-surface);
}
.voto-row .voto-card {
  background: var(--c-surface);
  border: none;
  border-radius: 0;
  border-bottom: 1px solid var(--c-line-soft);
}
.voto-row .voto-card:hover { background: var(--c-bg); }
.voto-row:not(:has(.voto-defensa)) .voto-card { border-bottom: none; }
.voto-defensa {
  background: var(--c-line-soft);
  padding: 12px 16px 14px 60px;
  border-left: 3px solid var(--c-accent);
  font-size: .88rem;
}
.defensa-label {
  font-size: .72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--c-ink-soft);
  margin-bottom: 4px;
}
.voto-defensa p { margin: 0; line-height: 1.5; color: var(--c-ink); }

/* Acordeón de voto por legislador (ficha de ley) */
.voto-acordeon {
  border: 1px solid var(--c-line);
  border-radius: 8px;
  overflow: hidden;
  background: var(--c-surface);
}
.voto-acordeon > summary.voto-card {
  cursor: pointer;
  list-style: none;
  border: none;
  border-radius: 0;
  flex-wrap: wrap;
}
.voto-acordeon > summary.voto-card::-webkit-details-marker { display: none; }
.voto-acordeon > summary.voto-card:hover { background: var(--c-bg); }
.voto-acordeon-caret {
  color: var(--c-ink-soft);
  font-size: .8rem;
  flex-shrink: 0;
  transition: transform .2s ease;
}
.voto-acordeon[open] > summary .voto-acordeon-caret { transform: rotate(180deg); }
.voto-acordeon[open] > summary.voto-card { border-bottom: 1px solid var(--c-line-soft); }
.voto-acordeon > summary.voto-card::after {
  content: '\25B6  ¿Por qué votó así?';
  flex-basis: 100%;
  margin-top: 4px;
  font-size: .72rem; font-weight: 600; line-height: 1.2;
  color: var(--c-ink-soft);
}
.voto-acordeon[open] > summary.voto-card::after {
  content: '\25BC  ¿Por qué votó así?';
  color: var(--c-accent-d);
}
.voto-acordeon-body {
  padding: 14px 16px 16px;
  background: var(--c-line-soft);
  border-left: 3px solid var(--c-accent);
}
.voto-acordeon-texto { margin-bottom: 14px; }
.voto-defensa-text { margin: 0; line-height: 1.5; color: var(--c-ink); }
.voto-defensa-placeholder { margin: 0; line-height: 1.6; color: var(--c-ink-soft); font-family: var(--f-serif); font-style: italic; font-size: .88rem; }
.voto-acordeon-acciones {
  display: flex; gap: 10px; align-items: center;
  justify-content: space-between; flex-wrap: wrap;
}
.voto-acordeon-ficha { font-size: .85rem; color: var(--c-accent-d); white-space: nowrap; }
.btn-justificar { font-size: .85rem; }

/* Toggle Modo Elección */
.toggle-eleccion {
  display: flex; align-items: center; gap: 8px;
  font-size: .85rem;
  color: var(--c-ink-soft);
  cursor: pointer;
  padding: 6px 12px;
  background: var(--c-accent-s);
  border: 1px solid var(--c-accent);
  border-radius: var(--r-chip);
  user-select: none;
}
.toggle-eleccion strong { color: var(--c-accent-d); }
.toggle-eleccion input[type=checkbox] {
  appearance: none;
  width: 32px; height: 18px;
  background: var(--c-line);
  border-radius: 9px;
  position: relative;
  cursor: pointer;
  transition: background .15s ease;
  margin: 0;
}
.toggle-eleccion input[type=checkbox]::after {
  content: '';
  position: absolute;
  top: 2px; left: 2px;
  width: 14px; height: 14px;
  border-radius: 50%;
  background: white;
  transition: transform .15s ease;
}
.toggle-eleccion input[type=checkbox]:checked {
  background: var(--c-accent);
}
.toggle-eleccion input[type=checkbox]:checked::after {
  transform: translateX(14px);
}

/* Tarjeta del votante */
.tarjeta-card {
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: 14px;
  box-shadow: var(--shadow-md);
  overflow: hidden;
}
.tarjeta-header {
  background: var(--c-ink);
  color: white;
  padding: 28px 32px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
  flex-wrap: wrap;
}
.tarjeta-eyebrow {
  font-size: .72rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(255,255,255,.6);
  margin-bottom: 8px;
}
.tarjeta-title {
  color: white;
  font-family: var(--f-serif);
  font-size: 1.8rem;
  font-weight: 600;
  margin: 0;
  line-height: 1.1;
}
.tarjeta-countdown {
  margin-top: 14px;
  color: rgba(255,255,255,.7);
  font-size: .9rem;
}
.tarjeta-countdown strong {
  color: white;
  font-size: 1.4rem;
  font-family: var(--f-serif);
  margin-right: 4px;
}
.tarjeta-qr {
  background: white;
  padding: 8px;
  border-radius: 8px;
  text-align: center;
}
.tarjeta-qr canvas { display: block; border-radius: 4px; }
.qr-cta {
  font-size: .68rem;
  color: var(--c-ink-soft);
  margin-top: 6px;
  font-weight: 500;
}
.tarjeta-list { padding: 12px 24px 24px; }
.tarjeta-row {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 0;
  border-bottom: 1px solid var(--c-line-soft);
  text-decoration: none;
  color: inherit;
}
.tarjeta-row:last-child { border-bottom: none; }
.tarjeta-row:hover { background: var(--c-bg); text-decoration: none; color: inherit; }
.tarjeta-score {
  width: 56px; height: 56px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: white;
  font-family: var(--f-serif);
  font-weight: 600;
  font-size: 1.1rem;
  flex-shrink: 0;
}
/* Fila de la tarjeta del votante: score · nombre · cargo · bloque · coherencia, distribuido */
.tr-name { flex: 2 1 0; min-width: 0; font-weight: 600; font-size: 1rem; }
.tr-cargo { flex: 1 1 0; min-width: 0; color: var(--c-ink-soft); font-size: .82rem; }
.tr-bloque { flex: 2 1 0; min-width: 0; color: var(--c-ink-soft); font-size: .82rem; }
.tr-coh { flex: 0 0 auto; margin-left: 8px; text-align: right; display: flex; flex-direction: column; line-height: 1.05; }
.tr-coh-lbl { font-size: .62rem; text-transform: uppercase; letter-spacing: .05em; color: var(--c-ink-soft); }
.tr-coh strong { font-size: 1.05rem; font-family: var(--f-serif); }
@media (max-width: 640px) {
  .tr-cargo { display: none; }
  .tr-name { flex: 2 1 0; }
}
.tarjeta-footer {
  background: var(--c-line-soft);
  padding: 12px 24px;
  display: flex; justify-content: space-between;
  font-size: .78rem;
  color: var(--c-ink-soft);
  flex-wrap: wrap;
  gap: 8px;
}

.tarjeta-acciones {
  display: flex; gap: 12px; flex-wrap: wrap;
  margin-top: 22px;
}
.btn-tarjeta {
  appearance: none;
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  padding: 13px 22px;
  border: 1px solid var(--c-line); border-radius: 12px;
  background: var(--c-surface); color: var(--c-ink);
  font: inherit; font-size: .96rem; font-weight: 600;
  cursor: pointer; transition: background .15s, border-color .15s, opacity .15s;
}
.btn-tarjeta:hover { background: var(--c-bg); border-color: var(--c-ink-soft); }
.btn-tarjeta:disabled { opacity: .6; cursor: progress; }
.btn-tarjeta svg { flex: none; }
.btn-tarjeta-primary {
  background: var(--c-ink); color: #fff; border-color: var(--c-ink);
}
.btn-tarjeta-primary:hover { background: var(--c-brand, #0e4d8c); border-color: var(--c-brand, #0e4d8c); }
.tarjeta-acciones-hint {
  margin: 10px 2px 0; font-size: .82rem; color: var(--c-ink-soft); line-height: 1.45;
}

@media (max-width: 600px) {
  .tarjeta-header { padding: 20px 22px; }
  .tarjeta-title { font-size: 1.4rem; }
  .tarjeta-acciones { flex-direction: column; }
  .btn-tarjeta { width: 100%; }
}

/* ───────── Layout interno ficha ───────── */
.leg-body {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 36px;
  padding: 36px 0 64px;
}
/* Columnas en flex para poder ordenar los módulos por CSS `order` (ver renderLegislador). */
.leg-main { min-width: 0; display: flex; flex-direction: column; }
.leg-side { min-width: 0; display: flex; flex-direction: column; }
/* Los módulos envueltos en .leg-mod necesitan su propio margen (el .block interno lo pierde),
   si no, en la columna quedan pegados al módulo siguiente. */
.leg-mod { min-width: 0; margin-bottom: 20px; }
.leg-mod > .block { margin-bottom: 0; }
/* Fila de botones de compartir, debajo del nombre (en web no se cortan al lado del título). */
.leg-share-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.leg-share-row .share-btn, .leg-share-row .tw-btn, .leg-share-row .story-btn { margin-top: 0; }

.block {
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--r-card);
  padding: 22px 24px;
  margin-bottom: 20px;
  box-shadow: var(--shadow-sm);
}
.block h3 {
  font-family: var(--f-serif);
  font-size: 1.15rem;
  margin: 0 0 14px;
  display: flex; align-items: center; gap: 8px;
}
.block h3::before {
  content: '';
  width: 4px; height: 18px;
  background: var(--c-accent);
  border-radius: 2px;
}

/* Contacto */
.contact-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.contact-list li { display: flex; gap: 10px; align-items: center; font-size: .92rem; }
.contact-list .ico {
  width: 28px; height: 28px;
  background: var(--c-accent-s);
  color: var(--c-accent);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: .85rem;
  flex-shrink: 0;
}
.btn-datos, .btn-avisame {
  display: inline-flex; align-items: center;
  margin-top: 14px; font-size: .88rem; padding: 9px 14px;
  appearance: none; -webkit-appearance: none; cursor: pointer;
  background: transparent; color: var(--c-accent);
  border: 1px solid var(--c-line); border-radius: 10px;
  transition: background .15s ease, border-color .15s ease;
}
.btn-datos:hover, .btn-avisame:hover { background: var(--c-accent-s); border-color: var(--c-accent); }
.btn-datos { width: 100%; justify-content: center; }
/* Bloque "Hablá con el Agente de …" */
/* El header es sticky (64px); sin esto, saltar a #sec-agente deja el título
   escondido detrás del nav. scroll-margin-top frena el ancla más abajo. */
#sec-agente { scroll-margin-top: 80px; }
.agente-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.agente-head h3 { margin: 0; }
.agente-ico {
  flex-shrink: 0; width: 42px; height: 42px; border-radius: 50%;
  background: var(--c-accent-s); color: var(--c-accent-d);
  display: flex; align-items: center; justify-content: center;
  animation: agente-pulso 2.6s ease-in-out infinite;
}
.agente-ico svg { width: 23px; height: 23px; }
@keyframes agente-pulso {
  0%, 100% { box-shadow: 0 0 0 0 rgba(14, 77, 140, .30); }
  50%      { box-shadow: 0 0 0 7px rgba(14, 77, 140, 0); }
}
@media (prefers-reduced-motion: reduce) { .agente-ico { animation: none; } }

/* Ícono del chat al lado del nombre → ancla al módulo del agente (columna derecha) */
.leg-name-agente {
  flex-shrink: 0; width: 34px; height: 34px; border-radius: 50%;
  background: var(--c-accent-s); color: var(--c-accent-d);
  display: inline-flex; align-items: center; justify-content: center;
  text-decoration: none;
  animation: agente-pulso 2.6s ease-in-out infinite;
  transition: transform .15s;
}
.leg-name-agente:hover { transform: scale(1.08); }
.leg-name-agente svg { width: 19px; height: 19px; }
@media (prefers-reduced-motion: reduce) { .leg-name-agente { animation: none; } }
html { scroll-behavior: smooth; }
.agente-pronto { margin: 0 0 10px; }
.agente-pronto-tag {
  display: inline-flex; align-items: center;
  padding: 4px 12px; border-radius: var(--r-chip);
  background: var(--c-accent-s); color: var(--c-accent-d);
  font-size: .78rem; font-weight: 600; letter-spacing: .02em;
  text-transform: uppercase;
}
.btn-avisame { width: 100%; justify-content: center; }

/* Modal "Avisame cuando esté el Agente" · z-index por encima de la nav (1200) y del copilot (1000) */
.modal-overlay {
  position: fixed; inset: 0; z-index: 2000;
  background: rgba(14, 27, 44, .55);
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
}
.modal-overlay[hidden] { display: none; }
.modal-card {
  position: relative;
  background: var(--c-surface); color: var(--c-ink);
  border-radius: 14px; padding: 28px 26px 26px;
  width: 100%; max-width: 420px;
  box-shadow: 0 18px 50px rgba(14, 27, 44, .3);
}
.modal-card h3 { margin: 0 0 6px; padding-right: 28px; }
.modal-close {
  position: absolute; top: 12px; right: 14px;
  background: none; border: none; cursor: pointer;
  font-size: 1.5rem; line-height: 1; color: var(--c-ink-soft);
}
.modal-close:hover { color: var(--c-ink); }
.modal-sub { color: var(--c-ink-soft); font-size: .92rem; line-height: 1.45; margin: 0 0 16px; }
.aviso-form { display: flex; flex-direction: column; gap: 10px; }
.aviso-form input[type=email] {
  width: 100%; padding: 11px 13px;
  border: 1px solid var(--c-line); border-radius: 8px;
  font-size: 1rem; font-family: inherit;
}
.aviso-form input[type=email]:focus { outline: none; border-color: var(--c-accent); }
.aviso-form .btn { justify-content: center; }
.aviso-msg { margin: 14px 0 0; font-size: .92rem; line-height: 1.45; }
.aviso-msg.ok  { color: var(--c-pos); }
.aviso-msg.err { color: var(--c-neg); }

/* ───────── Timeline ───────── */
.timeline {
  position: relative;
  padding: 8px 0 0;
  margin: 8px 0 0;
}
.timeline::before {
  content: '';
  position: absolute;
  left: 9px; top: 0; bottom: 0;
  width: 2px;
  background: var(--c-line);
}
.tl-item {
  position: relative;
  padding: 0 0 18px 32px;
}
.tl-item::before {
  content: '';
  position: absolute;
  left: 4px; top: 6px;
  width: 12px; height: 12px;
  border-radius: 50%;
  background: var(--c-surface);
  border: 2px solid var(--c-accent);
}
.tl-item.pos::before { border-color: var(--c-pos); background: var(--c-pos); }
.tl-item.neg::before { border-color: var(--c-neg); background: var(--c-neg); }
.tl-item.mix::before { border-color: var(--c-mix); background: var(--c-mix); }
.tl-year {
  font-size: .8rem;
  color: var(--c-ink-soft);
  font-weight: 500;
  letter-spacing: .03em;
}
.tl-content { font-size: .94rem; color: var(--c-ink); }
.tl-content strong { font-weight: 600; }

/* Timeline gráfica de votos */
.tl-votos {
  position: relative;
  padding: 36px 0 36px;
  border-top: 1px solid var(--c-line);
  border-bottom: 1px solid var(--c-line);
  margin: 6px 0;
}
.tl-votos-rail {
  height: 2px; background: var(--c-line);
  position: relative;
  margin: 24px 0;
}
.tl-votos-node {
  position: absolute;
  top: -10px;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--c-surface);
  border: 3px solid var(--c-accent);
  cursor: pointer;
  transition: transform .15s ease;
  display: flex; align-items: center; justify-content: center;
  font-size: .7rem;
  font-weight: 700;
  color: var(--c-surface);
}
.tl-votos-node.pos { background: var(--c-pos); border-color: var(--c-pos); }
.tl-votos-node.neg { background: var(--c-neg); border-color: var(--c-neg); }
.tl-votos-node.mix { background: var(--c-mix); border-color: var(--c-mix); }
.tl-votos-node.abs { background: var(--c-surface); border-color: var(--c-ink-soft); }
.tl-votos-node.aus { background: var(--c-surface); border-color: var(--c-line); }
.tl-votos-node.na  { background: var(--c-surface); border-color: var(--c-line); opacity: .55; }
.tl-votos-node:hover { transform: scale(1.25); z-index: 2; }
.tl-votos-tip {
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%; transform: translateX(-50%);
  background: var(--c-ink);
  color: white;
  padding: 8px 12px;
  border-radius: 6px;
  font-size: .78rem;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity .15s ease;
}
.tl-votos-node:hover .tl-votos-tip { opacity: 1; }
.tl-axis {
  display: flex; justify-content: space-between;
  font-size: .72rem;
  color: var(--c-ink-soft);
  margin-top: 4px;
}

/* ───────── Tabla de leyes ───────── */
.tabla-leyes {
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--r-card);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}
.tabla-leyes-row {
  display: grid;
  grid-template-columns: 100px 1fr 140px 100px 140px;
  gap: 14px;
  padding: 14px 20px;
  border-bottom: 1px solid var(--c-line-soft);
  align-items: center;
  font-size: .92rem;
}
/* Tabla de la ficha del legislador: 4 columnas (Fecha · Ley · Impacto · Voto) */
.tabla-leyes-4col .tabla-leyes-row {
  grid-template-columns: 92px 1fr 150px 150px;
}
/* Tabla v0.4: dos miradas lado a lado (Ley · Desarrollista · Liberal · [Voto]).
   En la ficha del legislador la 4ª columna es el Voto; en la lista de leyes son solo las dos miradas. */
.tabla-leyes-mir .tabla-leyes-row {
  grid-template-columns: 1fr 150px 150px 140px;
}
.tabla-leyes-mir-leyes .tabla-leyes-row {
  grid-template-columns: 1fr 150px 150px;
}
/* Ficha del legislador: miradas ocultas → solo Ley · Votó. Ley toma el ancho;
   Votó se ajusta a su contenido y queda alineado a la derecha (sin espacio sobrante). */
.tabla-leyes-voto2 .tabla-leyes-row {
  grid-template-columns: 1fr auto;
}
.tabla-leyes-voto2 .tabla-leyes-row > :last-child {
  justify-content: flex-end;
  text-align: right;
}
.tabla-leyes-row:last-child { border-bottom: none; }

.mirada-hint {
  font-size: .82rem; color: var(--c-ink-soft);
  margin: 0 0 12px; line-height: 1.5;
}
/* Mirada declarada del legislador: subrayado sutil del header de su columna en la tabla. */
.mirada-subrayada { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; text-decoration-color: rgba(90,100,115,.5); }
.mir-cell { display: flex; align-items: center; gap: 6px; min-width: 0; }
.mir-prefijo { display: none; font-size: .78rem; color: var(--c-ink-soft); font-weight: 600; }
/* Etiqueta de la mirada por ley (Beneficia / No beneficia / Neutral) */
.mirada-chip {
  display: inline-flex; align-items: center;
  font-size: .82rem; font-weight: 600;
  padding: 3px 10px; border-radius: 999px;
  white-space: nowrap;
}
.mirada-chip-pos { background: var(--c-pos-soft); color: var(--c-pos); }
.mirada-chip-neg { background: var(--c-neg-soft); color: var(--c-neg); }
.mirada-chip-neu { background: var(--c-line-soft); color: var(--c-ink-soft); }
.tabla-leyes-row.header {
  background: var(--c-line-soft);
  font-weight: 600;
  font-size: .8rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--c-ink-soft);
}
.tabla-leyes-row:hover:not(.header) {
  background: var(--c-bg);
}
.ley-nombre { font-weight: 500; color: var(--c-ink); }
.ley-nombre small { display: block; color: var(--c-ink-soft); font-weight: 400; font-size: .82rem; margin-top: 2px;}
.ley-fecha { font-size: .82rem; color: var(--c-ink-soft); }

/* ───────── Proyectos presentados (ficha) ───────── */
.proy-cargando { color: var(--c-ink-soft); font-size: .9rem; margin: 0; }
.proy-total { font-size: .95rem; color: var(--c-ink); margin: 0 0 6px; }
.proy-total strong { font-size: 1.1rem; color: var(--c-accent-d); }
.proy-leyenda { font-size: .8rem; color: var(--c-ink-soft); margin: 0 0 14px; }
/* Disclaimer del último scrape de proyectos: UNA fecha global, chico y discreto (más tenue que la leyenda). */
.proy-actualizado { font-size: .72rem; color: var(--c-ink-mute); margin: -8px 0 14px; }
.proy-leyenda a { color: var(--c-accent-d); text-decoration: none; font-weight: 600; }
.proy-leyenda a:hover { text-decoration: underline; }
.proy-cats { display: grid; gap: 8px; }
.proy-cat { border: 1px solid var(--c-line); border-radius: 10px; overflow: hidden; }
.proy-cat-head {
  display: flex; align-items: center; gap: 10px;
  padding: 11px 14px; cursor: pointer; font-weight: 600; color: var(--c-ink);
  list-style: none; background: var(--c-line-soft);
}
.proy-cat-head::-webkit-details-marker { display: none; }
.proy-cat-head::before { content: '\25B6'; color: var(--c-ink-soft); font-weight: 400; font-size: .8rem; line-height: 1; flex-shrink: 0; }
.proy-cat[open] .proy-cat-head::before { content: '\25BC'; color: var(--c-accent); }
.proy-cat-nombre { display: flex; align-items: center; gap: 8px; font-weight: 600; }
.proy-lista { display: grid; }
/* Paginación de la lista: las filas más allá de las primeras 10 arrancan ocultas y las
   revela el botón "Ver más" de a 10 (ver PROY_PAGE en app.js).
   OJO: el selector va COMPUESTO (.proy-row.proy-row-oculta, especificidad 0-2-0) a propósito.
   Con `.proy-row-oculta` solo (0-1-0) empata con `.proy-row { display: grid }` de abajo y gana
   la de después por orden → las filas seguían ocupando lugar (ficha de 57.000px de alto). */
.proy-row.proy-row-oculta { display: none; }
.proy-mas {
  display: block; width: 100%; padding: 10px 14px;
  border: 0; border-top: 1px solid var(--c-line-soft); background: var(--c-line-soft);
  font: inherit; font-size: .86rem; font-weight: 600; color: var(--c-accent-d);
  text-align: center; cursor: pointer;
}
.proy-mas:hover { background: var(--c-line); }
.proy-mas-n { font-weight: 400; color: var(--c-ink-mute); }
.proy-row {
  display: grid; grid-template-columns: 1fr 86px 104px; gap: 10px; align-items: center;
  padding: 9px 14px; border-top: 1px solid var(--c-line-soft); font-size: .86rem;
  color: inherit; text-decoration: none;
}
.proy-row:hover:not(.proy-row-head) { background: var(--c-bg); }
.proy-row-head { font-size: .7rem; text-transform: uppercase; letter-spacing: .04em; color: var(--c-ink-soft); font-weight: 600; }
.proy-sum { color: var(--c-ink); display: flex; align-items: baseline; gap: 7px; min-width: 0; }
.proy-sum-txt { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.proy-sum.abierto .proy-sum-txt { white-space: normal; overflow: visible; }
/* "ir..." al final del sumario: solo visible al expandir; es el ÚNICO link al proyecto. */
.proy-sum:not(.abierto) .proy-ir { display: none; }
.proy-ir { font-size: .82rem; color: var(--c-accent); white-space: nowrap; font-weight: 600; margin-left: 4px; }
.proy-ir:hover { color: var(--c-accent-d); text-decoration: underline; }
/* Cards de estadísticas de proyectos (proy/mes, promedio cámara, % vs promedio, ranking). */
.proy-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 14px 0 16px; }
.proy-stat { background: var(--c-surface); border: 1px solid var(--c-line); border-radius: 10px; padding: 11px 8px; text-align: center; }
.proy-stat-num { font-family: var(--f-serif); font-size: 1.4rem; font-weight: 700; color: var(--c-accent-d); line-height: 1.05; }
.proy-stat-num.proy-stat-pos, .proy-stat-sub.proy-stat-pos { color: var(--c-pos, #2F8F4F); }
.proy-stat-num.proy-stat-neg, .proy-stat-sub.proy-stat-neg { color: var(--c-neg, #C13B3B); }
.proy-stat-pct { font-family: var(--f-sans, inherit); font-size: .82rem; font-weight: 600; color: var(--c-ink-soft); }
.proy-vacio { color: var(--c-ink-soft); font-size: .92rem; line-height: 1.5; margin: 4px 0 0; }
.proy-cat-aut { font-weight: 500; font-size: .82rem; color: var(--c-ink-soft); }
.form-aviso-legislador { margin: -4px 0 16px; padding: 10px 14px; background: var(--c-accent-s, #eef3f9); border-radius: 8px; }
.form-aviso-legislador p { margin: 0; font-size: .9rem; color: var(--c-ink); }
.proy-stat-top { font-size: .7rem; color: var(--c-ink-soft); line-height: 1.2; margin-bottom: 3px; }
.proy-stat-sub { font-size: .66rem; color: var(--c-ink-soft); margin-top: 3px; line-height: 1.2; }
@media (max-width: 560px) { .proy-stats { grid-template-columns: repeat(2, 1fr); } }
.proy-fecha { color: var(--c-ink-soft); white-space: nowrap; }
/* Estado del trámite del proyecto (dato duro HCDN) · 4 categorías */
.proy-est { border-radius: 999px; padding: 2px 9px; font-size: .72rem; white-space: nowrap; font-weight: 600; text-transform: capitalize; }
.proy-est-pos { background: #e6f4ea; color: #1e7a3d; }
.proy-est-neu { background: var(--c-line-soft); color: var(--c-ink-soft); }
.proy-est-neg { background: #fde8e8; color: #b42318; }
.proy-est-cad { background: var(--c-line-soft); color: var(--c-ink-mute); }
.proy-vermas { display: inline-block; margin-top: 14px; font-size: .9rem; color: var(--c-accent-d); font-weight: 600; text-decoration: none; }
.proy-vermas:hover { text-decoration: underline; }
@media (max-width: 760px) {
  .proy-row { grid-template-columns: 1fr auto; gap: 2px 10px; padding: 10px 12px; }
  .proy-row .proy-sum { grid-column: 1 / -1; white-space: normal; order: 1; }
  .proy-row .proy-fecha { order: 2; }
  .proy-row .proy-estado { order: 3; justify-self: end; }
  .proy-row-head { display: none; }
}

/* ───────── Votos ───────── */
.voto {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px;
  border-radius: var(--r-chip);
  font-size: .8rem;
  font-weight: 500;
}
.voto-si  { background: var(--c-pos-soft); color: var(--c-pos); }
.voto-no  { background: var(--c-neg-soft); color: var(--c-neg); }
.voto-abs { background: var(--c-mix-soft); color: var(--c-mix); }
.voto-mix { background: #e8edf5; color: #4a5876; }
.voto-aus { background: var(--c-line-soft); color: var(--c-ink-soft); }
.voto-na  { background: transparent; color: var(--c-ink-soft); font-style: italic; opacity: .6; }

.voto-dot {
  width: 9px; height: 9px; border-radius: 50%; display: inline-block;
}

/* ───────── Impacto chips ───────── */
.impacto {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 6px 14px;
  border-radius: var(--r-chip);
  font-size: .85rem;
  font-weight: 500;
}
.impacto-pos { background: var(--c-pos-soft); color: var(--c-pos); }
.impacto-neg { background: var(--c-neg-soft); color: var(--c-neg); }
.impacto-mix { background: var(--c-mix-soft); color: var(--c-mix); }
.impacto-na  { background: var(--c-line-soft); color: var(--c-ink-soft); }
.impacto::before {
  content: '';
  width: 8px; height: 8px;
  border-radius: 50%;
  background: currentColor;
  flex-shrink: 0;
}

/* Chip de conclusión editorial (al lado del título · serif chico, tipo Times) */
.editorial-h4 { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px; }
.conclusion-chip {
  display: inline-block;
  font-family: var(--f-serif);
  font-style: italic;
  font-weight: 600;
  font-size: .72rem;
  line-height: 1.3;
  padding: 2px 9px;
  border-radius: 999px;
  white-space: nowrap;
}
.conclusion-pos { background: var(--c-pos-soft); color: var(--c-pos); }
.conclusion-neg { background: var(--c-neg-soft); color: var(--c-neg); }
.conclusion-mix { background: var(--c-mix-soft); color: var(--c-mix); }
.conclusion-neu { background: var(--c-line-soft); color: var(--c-ink-soft); }

/* ───────── Página de ley ───────── */
.ley-hero {
  background: var(--c-surface);
  border-bottom: 1px solid var(--c-line);
  padding: 40px 0 30px;
}
.ley-meta-row {
  display: flex; gap: 14px; flex-wrap: wrap; align-items: center;
  font-size: .9rem; color: var(--c-ink-soft);
  margin-bottom: 14px;
}
.ley-meta-row strong { color: var(--c-ink); font-weight: 600; }
.ley-title-row { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 10px; }
.ley-title-row .ley-title { margin-bottom: 0; }
.ley-title { font-size: 2rem; font-family: var(--f-serif); margin-bottom: 10px; max-width: 880px; }

/* Chip "Debatí esta ley con el Agente" al lado del título → ancla a la sección del agente */
.ley-name-agente {
  flex-shrink: 0; border-radius: 999px; padding: 7px 14px 7px 11px; gap: 7px;
  background: var(--c-accent-s); color: var(--c-accent-d);
  display: inline-flex; align-items: center; justify-content: center;
  text-decoration: none; font-size: .82rem; font-weight: 600; line-height: 1;
  animation: agente-pulso 2.6s ease-in-out infinite;
  transition: transform .15s;
}
.ley-name-agente:hover { transform: scale(1.04); }
.ley-name-agente svg { width: 18px; height: 18px; flex-shrink: 0; }
.ley-name-agente-txt { white-space: nowrap; }
@media (prefers-reduced-motion: reduce) { .ley-name-agente { animation: none; } }

.two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin: 22px 0;
}

.objetivo, .editorial {
  border-radius: var(--r-card);
  padding: 20px 22px;
  min-width: 0;
  overflow-wrap: anywhere;
}
.objetivo {
  background: var(--c-line-soft);
  border: 1px solid var(--c-line);
}
.objetivo h4, .editorial h4 {
  font-family: var(--f-sans);
  text-transform: uppercase;
  font-size: .75rem;
  letter-spacing: .08em;
  color: var(--c-ink-soft);
  margin: 0 0 8px;
  font-weight: 600;
}
.editorial {
  background: var(--c-accent-s);
  border: 1px solid var(--c-accent);
}
.editorial p { color: var(--c-ink); }
.editorial h4 { color: var(--c-accent-d); }

/* Resumen expandible: 2 líneas + "expandir" → resumen completo + dato objetivo + link al texto */
.resumen-exp { margin: 0; }
.resumen-sum { list-style: none; cursor: pointer; }
.resumen-sum::-webkit-details-marker { display: none; }
.resumen-corto {
  margin: 0; font-size: .92rem; line-height: 1.55; color: var(--c-ink-soft);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.resumen-exp[open] .resumen-corto { display: none; }
.resumen-toggle {
  display: inline-block; margin-top: 6px; font-size: .72rem; font-weight: 600;
  color: var(--c-ink-soft);
}
.resumen-toggle::after { content: '\25B6  expandir'; }
.resumen-exp[open] .resumen-toggle { color: var(--c-accent-d); }
.resumen-exp[open] .resumen-toggle::after { content: '\25BC  contraer'; }
.resumen-full > p { margin: 0 0 12px; font-size: .92rem; line-height: 1.55; color: var(--c-ink-soft); }
.resumen-link { margin-top: 4px !important; }
.resumen-link a { font-weight: 600; color: var(--c-accent-d); text-underline-offset: 2px; }

/* Grilla de votos por legislador en página de ley */
.votos-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 10px;
}
.voto-card {
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: 8px;
  padding: 12px 14px;
  display: flex; align-items: center; gap: 12px;
  font-size: .88rem;
}
.voto-card .avatar { width: 36px; height: 36px; font-size: .85rem; }
.voto-card-name { font-weight: 500; line-height: 1.2; }
.voto-card-bloque { font-size: .75rem; color: var(--c-ink-soft); }
.voto-card .voto { margin-left: auto; }

/* ───────── Footer ───────── */
.site-footer {
  background: var(--c-ink);
  color: rgba(255,255,255,.7);
  padding: 36px 0 28px;
  margin-top: 60px;
  font-size: .88rem;
}
.site-footer h4 { color: white; font-family: var(--f-sans); font-size: .95rem; margin-bottom: 10px; font-weight: 600; }
.site-footer a { color: rgba(255,255,255,.85); }
.site-footer a:hover { color: white; }
.footer-cols {
  display: grid;
  grid-template-columns: 1.7fr 1fr 1fr 1.1fr;
  gap: 32px;
  margin-bottom: 22px;
}
@media (max-width: 880px) { .footer-cols { grid-template-columns: 1fr 1fr; } }
.footer-bottom {
  border-top: 1px solid rgba(255,255,255,.15);
  padding-top: 18px;
  display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px;
  font-size: .82rem;
  color: rgba(255,255,255,.55);
}
.footer-mail a {
  color: inherit;
  text-decoration: none;
}
.footer-mail a:hover { color: #fff; }

/* ───────── Misc ───────── */
.disclaimer {
  background: #FFF8E5;
  border: 1px solid #F2D58A;
  color: #6B5119;
  border-radius: var(--r-card);
  padding: 14px 18px;
  font-size: .88rem;
  margin: 18px 0;
}
.disclaimer strong { color: #4B3408; }

.breadcrumb {
  font-size: .85rem;
  color: var(--c-ink-soft);
  margin-bottom: 8px;
}
.breadcrumb a { color: var(--c-ink-soft); }
.breadcrumb a:hover { color: var(--c-accent); }

.btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 18px;
  border-radius: 6px;
  font-weight: 500;
  background: var(--c-accent);
  color: white;
  font-size: .9rem;
  border: 1px solid var(--c-accent);
  cursor: pointer;
  transition: background .15s ease;
}
.btn:hover { background: var(--c-accent-d); text-decoration: none; color: white; }
.btn-ghost {
  background: transparent;
  color: var(--c-accent);
}
.btn-ghost:hover { background: var(--c-accent-s); color: var(--c-accent-d); }

/* ───────── Poder Ejecutivo · cards de figuras destacadas (Presidencia) ───────── */
.cards-figuras {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
  margin: 0 0 32px;
}
.card-figura {
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-top: 3px solid var(--c-accent);
  border-radius: var(--r-card);
  padding: 22px 22px 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  text-decoration: none;
  color: var(--c-ink);
  box-shadow: var(--shadow-sm);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.card-figura:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
  border-color: var(--c-accent);
  text-decoration: none;
  color: var(--c-ink);
}
.card-figura-avatar {
  width: 64px; height: 64px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: white;
  font-family: var(--f-serif);
  font-weight: 600;
  font-size: 1.4rem;
  box-shadow: 0 0 0 1px var(--c-line);
}
.card-figura-rol {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--c-accent-d);
  margin-bottom: 4px;
}
.card-figura-nombre {
  font-family: var(--f-serif);
  font-weight: 600;
  font-size: 1.2rem;
  line-height: 1.2;
  color: var(--c-ink);
  margin-bottom: 4px;
}
.card-figura-tiempo {
  font-size: .82rem;
  color: var(--c-ink-soft);
  line-height: 1.45;
}

/* ───────── Responsive ───────── */
@media (max-width: 900px) {
  h1 { font-size: 1.9rem; }
  .hero-stats { grid-template-columns: repeat(2, 1fr); }
  .leg-profile-row { grid-template-columns: 100px 1fr; }
  .avatar-lg { width: 100px; height: 100px; font-size: 1.9rem; }
  /* La columna del score (score + réplica) pasa a full-width y SIN lift. */
  .leg-profile-row .leg-score-col { grid-column: 1 / -1; margin-top: 0; }
  /* En mobile: ocultar la réplica de la columna de info y mostrar la copia DEBAJO del score. */
  .leg-profile-row .leg-rep-desk { display: none; }
  .leg-profile-row .leg-rep-mob { display: inline-flex; align-self: flex-start; margin-top: 0; }
  /* Share: ocultar la copia web (dentro del score-col) y mostrar la copia mobile como
     fila full-width al pie del módulo perfil. */
  .leg-profile-row .leg-share-desk { display: none; }
  .leg-profile-row .leg-share-mob { display: flex; grid-column: 1 / -1; margin-top: 16px; }
  /* Mobile: una sola columna con TODOS los módulos interleaveados por `order`.
     display:contents promueve los hijos de main/side a items flex de .leg-body. */
  .leg-body { display: flex; flex-direction: column; gap: 0; }
  .leg-main, .leg-side { display: contents; }
  .two-col { grid-template-columns: 1fr; }
  .tabla-leyes-row,
  .tabla-leyes-4col .tabla-leyes-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  /* v0.4: las dos miradas apilan — Ley arriba, luego Des / Lib / Voto en líneas */
  .tabla-leyes-mir .tabla-leyes-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .tabla-leyes-mir .mir-prefijo { display: inline; }
  .tabla-leyes-mir .ley-nombre { margin-bottom: 2px; }
  .tabla-leyes-row.header { display: none; }
  .footer-cols { grid-template-columns: 1fr; gap: 22px; }
  .nav-links { gap: 16px; font-size: .85rem; }
  .prov-picker { margin-right: 14px; }
  .prov-label { display: none; }
  .site-header .wrap { height: auto; padding-top: 10px; padding-bottom: 10px; flex-wrap: wrap; }
}

@media (max-width: 600px) {
  .wrap { padding: 0 16px; }
  .hero { padding: 36px 0 28px; }
  .hero-stats { grid-template-columns: 1fr 1fr; gap: 10px; }
  .leg-profile-row { grid-template-columns: 80px 1fr; gap: 16px; }
  .avatar-lg { width: 80px; height: 80px; font-size: 1.5rem; }
  .leg-name { font-size: 1.6rem; }
}

/* ============================================================
   Camino de la ley · stepper visual del trámite parlamentario
   ============================================================ */
.camino-card {
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--r-card);
  padding: 18px 24px 14px;
  margin: 14px 0 22px;
}
.camino-card-titulo {
  font-family: var(--f-sans);
  font-size: .72rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--c-ink-soft);
  font-weight: 600;
  margin: 0 0 14px;
}
.camino-stepper {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 2px;
  position: relative;
}
.camino-paso {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  position: relative;
  min-width: 0;
  padding: 0 4px;
  cursor: help;
}
.camino-fila {
  margin-bottom: 14px;
}
.camino-fila:last-child { margin-bottom: 0; }
.camino-fila-titulo {
  font-family: var(--f-sans);
  font-size: .64rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--c-ink-soft);
  font-weight: 600;
  margin: 0 0 10px;
  opacity: .8;
}
.camino-sub {
  font-size: .64rem;
  color: var(--c-ink-soft);
  font-weight: 500;
  margin-top: 2px;
  line-height: 1.2;
  letter-spacing: .02em;
}
.camino-paso:hover .camino-nodo { transform: scale(1.15); }

/* Tooltip propio · aparece instantáneamente y se ve mejor que el del browser */
.camino-tip {
  position: absolute;
  bottom: calc(100% + 12px);
  left: 50%;
  transform: translateX(-50%);
  background: var(--c-ink);
  color: #fff;
  padding: 10px 14px;
  border-radius: 8px;
  font-size: .78rem;
  line-height: 1.45;
  white-space: nowrap;
  display: none;
  flex-direction: column;
  gap: 2px;
  z-index: 100;
  box-shadow: 0 6px 20px rgba(14,27,44,.18);
  pointer-events: none;
}
.camino-tip strong {
  font-weight: 700;
  margin-bottom: 4px;
  border-bottom: 1px solid rgba(255,255,255,.2);
  padding-bottom: 4px;
}
.camino-tip em {
  font-style: normal;
  color: rgba(255,255,255,.65);
  margin-right: 4px;
}
/* Flechita debajo del tooltip apuntando al nodo */
.camino-tip::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 6px solid transparent;
  border-top-color: var(--c-ink);
}
.camino-paso:hover .camino-tip { display: flex; }
/* Suprime el title nativo del browser cuando ya hay tooltip propio */
.camino-paso:hover { /* sigue mostrando el title como fallback de accesibilidad */ }
/* Conector entre nodos — siempre visible como "ruta base" en gris.
   Se pinta de color sólo cuando el paso anterior es cumplido/parcial/veto. */
.camino-paso + .camino-paso::before {
  content: '';
  position: absolute;
  top: 14px;
  left: -50%;
  right: 50%;
  height: 2px;
  background: var(--c-line);
  z-index: 0;
}
.camino-paso.con-prev-cumplido::before { background: var(--c-pos); }
.camino-paso.con-prev-parcial::before  { background: var(--c-mix); }
.camino-paso.con-prev-veto::before     { background: var(--c-neg); }
.camino-nodo {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 2px solid var(--c-line);
  background: var(--c-surface);
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .78rem;
  font-weight: 700;
  color: var(--c-ink-soft);
  position: relative;
  cursor: help;
  transition: transform .15s;
}
.camino-nodo:hover { transform: scale(1.12); }
.camino-paso.cumplido .camino-nodo {
  background: var(--c-pos);
  border-color: var(--c-pos);
  color: #fff;
}
.camino-paso.curso .camino-nodo {
  background: var(--c-accent);
  border-color: var(--c-accent);
  color: #fff;
}
.camino-paso.veto .camino-nodo {
  background: var(--c-neg);
  border-color: var(--c-neg);
  color: #fff;
}
.camino-paso.parcial .camino-nodo {
  background: var(--c-mix);
  border-color: var(--c-mix);
  color: #fff;
}
/* auto = hito estimado por regla/fuente (no curado a mano): ámbar con borde punteado e itálica */
.camino-paso.auto .camino-nodo {
  background: var(--c-mix);
  border-color: var(--c-mix);
  color: #fff;
  border-style: dashed;
}
.camino-paso.auto .camino-label,
.camino-paso.auto .camino-fecha { font-style: italic; }
.camino-paso.pendiente .camino-nodo {
  background: var(--c-line-soft);
  border-color: var(--c-line);
  color: var(--c-ink-soft);
  opacity: .7;
}
.camino-paso.no-aplica .camino-nodo {
  background: var(--c-line-soft);
  border-color: var(--c-line);
  color: var(--c-ink-soft);
  opacity: .35;
  border-style: dashed;
}
.camino-paso.no-aplica .camino-label,
.camino-paso.no-aplica .camino-fecha { opacity: .45; }
.camino-mini-nodo.no-aplica {
  background: var(--c-line-soft);
  border-color: var(--c-line);
  opacity: .35;
}
.camino-label {
  font-size: .72rem;
  font-weight: 600;
  color: var(--c-ink);
  margin-top: 10px;
  line-height: 1.2;
}
.camino-fecha {
  font-size: .67rem;
  color: var(--c-ink-soft);
  margin-top: 3px;
  line-height: 1.2;
}
.camino-paso.pendiente .camino-label,
.camino-paso.pendiente .camino-fecha {
  opacity: .55;
}
.camino-paso.veto .camino-label,
.camino-paso.parcial .camino-label {
  color: var(--c-ink);
}

/* Leyenda debajo del stepper */
.camino-legenda {
  display: flex;
  gap: 10px 20px;
  flex-wrap: wrap;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--c-line-soft);
  font-size: .72rem;
  color: var(--c-ink-soft);
}
.camino-legenda-item { display: inline-flex; align-items: center; gap: 8px; }

.camino-leg-dot {
  width: 14px; height: 14px; border-radius: 50%;
  display: inline-block;
  flex: 0 0 auto;
  border: 1.5px solid var(--c-line);
  background: var(--c-surface);
}
.camino-leg-dot.cumplido  { background: var(--c-pos); border-color: var(--c-pos); }
.camino-leg-dot.curso     { background: var(--c-accent); border-color: var(--c-accent); }
.camino-leg-dot.veto      { background: var(--c-neg); border-color: var(--c-neg); }
.camino-leg-dot.parcial   { background: var(--c-mix); border-color: var(--c-mix); }

/* ────── Versión mini para listado de leyes ────── */
.camino-mini {
  display: flex;
  align-items: center;
  gap: 0;
  margin-top: 6px;
  flex-wrap: wrap;
}
.camino-mini-nodo {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  border: 1.4px solid var(--c-line);
  background: var(--c-surface);
  flex-shrink: 0;
}
.camino-mini-nodo.cumplido  { background: var(--c-pos); border-color: var(--c-pos); }
.camino-mini-nodo.curso     { background: var(--c-accent); border-color: var(--c-accent); }
.camino-mini-nodo.veto      { background: var(--c-neg); border-color: var(--c-neg); }
.camino-mini-nodo.parcial   { background: var(--c-mix); border-color: var(--c-mix); }
.camino-mini-nodo.auto      { background: var(--c-mix); border-color: var(--c-mix); opacity: .8; }

/* ── Stepper unificado de 7 hitos (mismo diseño en sitio y admin) ── */
.camino7-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px 8px;
  margin-top: 12px;
}
@media (max-width: 560px) { .camino7-grid { grid-template-columns: repeat(3, 1fr); } }
/* 9 pasos → 3 filas de 3 (ej. ley vetada que terminó promulgada) */
.camino7-grid.camino7-cols3 { grid-template-columns: repeat(3, 1fr); }
.camino7-grid.camino7-cols3 .camino7-paso::before { display: block; }
.camino7-grid.camino7-cols3 .camino7-paso:not(.con-v):not(.con-g)::before { display: none; }
.camino7-grid.camino7-cols3 .camino7-paso:nth-child(3n+1)::before { display: none; }
.camino7-paso { position: relative; text-align: center; min-width: 0; }
.camino7-nodo {
  position: relative; z-index: 1;
  width: 30px; height: 30px; margin: 0 auto;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%; font-weight: 700; font-size: .82rem;
  background: transparent; border: 1.5px solid var(--c-line); color: var(--c-ink-soft);
}
.camino7-label { margin-top: 7px; font-size: .72rem; font-weight: 600; color: var(--c-ink); line-height: 1.2; }
.camino7-fecha { font-size: .66rem; color: var(--c-ink-soft); margin-top: 2px; }
.camino7-desc {
  font-size: .6rem; color: var(--c-ink-soft); margin-top: 3px; line-height: 1.25;
  display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;
}
/* conector entre nodos (centro a centro): verde si el paso anterior está completo, gris si no */
.camino7-paso::before {
  content: ''; position: absolute; z-index: 0;
  top: 14px; right: calc(50% + 15px); left: calc(-50% + 7px); height: 2px;
  background: var(--c-line);
}
.camino7-paso.con-v::before { background: var(--c-pos); }
.camino7-paso.con-g::before { background: var(--c-line); }
.camino7-paso:not(.con-v):not(.con-g)::before { display: none; }   /* primer nodo: sin conector */
.camino7-paso:nth-child(4n+1)::before { display: none; }           /* arranque de cada fila (4 col) */
@media (max-width: 560px) {
  .camino7-paso:nth-child(4n+1)::before { display: block; }
  .camino7-paso:not(.con-v):not(.con-g)::before { display: none; }
  .camino7-paso:nth-child(3n+1)::before { display: none; }         /* arranque de cada fila (3 col) */
}
.camino7-paso.completo  .camino7-nodo { background: var(--c-pos); border-color: var(--c-pos); color: #fff; }
.camino7-paso.actual    .camino7-nodo { background: transparent; border: 2px dashed var(--c-pos); color: var(--c-pos); }
.camino7-paso.estimado  .camino7-nodo { background: transparent; border: 2px dashed var(--c-mix); color: var(--c-mix); font-size: .68rem; letter-spacing: .02em; }
.camino7-paso.estimado  .camino7-label,
.camino7-paso.estimado  .camino7-fecha { font-style: italic; }
.camino7-paso.disputa   .camino7-nodo { background: var(--c-mix); border-color: var(--c-mix); color: #fff; }
.camino7-paso.disputa   .camino7-label,
.camino7-paso.disputa   .camino7-fecha { font-style: italic; }
.camino7-paso.veto      .camino7-nodo { background: var(--c-neg); border-color: var(--c-neg); color: #fff; }
.camino7-paso.pendiente .camino7-nodo { background: var(--c-ink-soft); border-color: var(--c-ink-soft); color: #fff; opacity: .85; }
.camino7-paso.pendiente .camino7-label,
.camino7-paso.pendiente .camino7-fecha { opacity: .6; }
/* leyenda */
.camino-leg-dot.completo  { background: var(--c-pos); }
.camino-leg-dot.actual    { background: transparent; border: 1.5px dashed var(--c-pos); }
.camino-leg-dot.estimado  { background: transparent; border: 1.5px dashed var(--c-mix); }
.camino-leg-dot.disputa   { background: var(--c-mix); }
.camino-leg-dot.veto      { background: var(--c-neg); }
.camino-leg-dot.pendiente { background: var(--c-ink-soft); }
.camino-mini-conector {
  width: 10px;
  height: 1.5px;
  background: var(--c-line);
  flex-shrink: 0;
}
.camino-mini-conector.cumplido { background: var(--c-pos); }
.camino-mini-conector.parcial  { background: var(--c-mix); }
.camino-mini-conector.veto     { background: var(--c-neg); }
.camino-mini-conector.oculto   { background: var(--c-line); }
.camino-mini-label {
  margin-left: 8px;
  font-size: .72rem;
  color: var(--c-ink-soft);
  font-weight: 500;
}

/* Mobile responsive */
@media (max-width: 720px) {
  .camino-card { padding: 14px 12px 12px; }
  .camino-paso { padding: 0 2px; }
  .camino-nodo { width: 24px; height: 24px; font-size: .68rem; }
  .camino-paso + .camino-paso::before { top: 11px; }
  .camino-label { font-size: .64rem; margin-top: 7px; }
  .camino-fecha { font-size: .58rem; }
}

/* ============================================================
   Disclaimer IA · footer expandido + badge contextual
   ============================================================ */
.footer-disclaimer-ai {
  background: rgba(255,255,255,.04);
  border-radius: 8px;
  padding: 14px 18px;
  margin-bottom: 14px;
  font-size: .8rem;
  line-height: 1.55;
  color: #cbd5e1;
}

/* Banda de disclaimer IA · sobre fondo blanco, arriba del footer */
.ai-band {
  padding: 8px 0 28px;
}
.ai-band-box {
  background: var(--c-line-soft, #f1efe8);
  border: 1px solid var(--c-line);
  border-radius: 10px;
  padding: 16px 20px;
  font-size: .85rem;
  line-height: 1.6;
  color: var(--c-ink-soft);
}
.ai-band-box strong {
  display: block;
  margin-bottom: 4px;
  color: var(--c-ink);
  font-size: .9rem;
}
.ai-band-box a {
  color: var(--c-accent-d);
  text-decoration: underline;
  font-weight: 600;
}
.footer-disclaimer-ai strong { color: #fff; display: block; margin-bottom: 4px; font-size: .85rem; }
.footer-disclaimer-ai a { color: #fff; text-decoration: underline; }
.footer-disclaimer-ai a:hover { color: var(--c-accent-s); }

/* Badge IA contextual · arriba de cada ficha individual */
.ai-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: .72rem;
  font-weight: 500;
  padding: 4px 12px;
  border-radius: 999px;
  background: var(--c-accent-s);
  color: var(--c-accent-d);
  border: 1px solid var(--c-accent);
  text-decoration: none;
  margin-bottom: 12px;
  transition: background .12s;
}
.ai-badge:hover {
  background: var(--c-accent);
  color: #fff;
  text-decoration: none;
}
/* Variante informativa (no clickeable) */
.ai-badge.ai-badge-static { cursor: default; }
.ai-badge.ai-badge-static:hover { background: var(--c-accent-s); color: var(--c-accent-d); }

/* ============================================================
   Visión Nacional · desglose informativo por ley (diputados)
   ============================================================ */
.vision-desglose {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.vision-ley {
  border: 1px solid var(--c-line);
  border-radius: 8px;
  background: var(--c-surface);
  overflow: hidden;
}
.vision-ley details summary {
  list-style: none;
  cursor: pointer;
  padding: 10px 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  background: var(--c-bg);
  transition: background .12s;
}
.vision-ley details summary::-webkit-details-marker { display: none; }
.vision-ley details summary:hover { background: var(--c-line-soft); }
.vision-ley details[open] summary { background: var(--c-accent-s); border-bottom: 1px solid var(--c-line); }
.vision-ley-nombre {
  font-weight: 600;
  font-size: .9rem;
  color: var(--c-ink);
  flex: 1;
  min-width: 0;
}
.vision-ley-meta {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  flex-shrink: 0;
}
.voto-mini, .score-mini {
  font-size: .72rem;
  padding: 3px 8px;
  border-radius: 999px;
  font-weight: 600;
  white-space: nowrap;
}
.voto-mini.voto-afirmativo { background: var(--c-pos-soft); color: var(--c-pos); }
.voto-mini.voto-negativo   { background: var(--c-neg-soft); color: var(--c-neg); }
.voto-mini.voto-abstencion { background: var(--c-mix-soft); color: var(--c-mix); }
.score-mini.score-pos { background: var(--c-pos-soft); color: var(--c-pos); }
.score-mini.score-neg { background: var(--c-neg-soft); color: var(--c-neg); }
.score-mini.score-neu { background: var(--c-line-soft); color: var(--c-ink-soft); }

.vision-dim-list {
  list-style: none;
  padding: 8px 14px;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.vision-dim {
  display: grid;
  grid-template-columns: 1.4fr 1.2fr 1fr;
  gap: 8px;
  font-size: .83rem;
  padding: 5px 0;
  border-bottom: 1px dashed var(--c-line-soft);
}
.vision-dim:last-child { border-bottom: none; }
.vd-name { color: var(--c-ink); font-weight: 500; }
.vd-signo { color: var(--c-ink-soft); font-size: .78rem; }
.vision-dim.signo-pos .vd-signo { color: var(--c-pos); font-weight: 600; }
.vision-dim.signo-neg .vd-signo { color: var(--c-neg); font-weight: 600; }
.vd-alin { font-size: .78rem; font-weight: 600; text-align: right; }
.alin-pos    { color: var(--c-pos); }
.alin-neg    { color: var(--c-neg); }
.alin-mid    { color: var(--c-mix); }
.alin-neutro { color: var(--c-ink-soft); font-weight: 400; }
.vision-dim.sin-datos { opacity: .5; }

.vision-ley-link {
  padding: 8px 14px 12px;
  border-top: 1px solid var(--c-line-soft);
  font-size: .83rem;
}
.vision-ley-link a {
  color: var(--c-accent);
  font-weight: 500;
}

/* Chip "Bien nacional" en la tabla de leyes */
.bien-nacional {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 56px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: .82rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.bien-nacional.pos { background: var(--c-pos-soft); color: var(--c-pos); }
.bien-nacional.neg { background: var(--c-neg-soft); color: var(--c-neg); }
.bien-nacional.neu { background: var(--c-line-soft); color: var(--c-ink-soft); }
.bien-nacional.sin-datos { background: var(--c-line-soft); color: var(--c-ink-soft); opacity: .5; }

/* ============================================================
   Análisis estructural · marcos editoriales múltiples (v0.2)
   Render lado a lado de marco desarrollista + marco liberal
   ============================================================ */
.ae-marco-card {
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: 12px;
  padding: 18px 20px;
  position: relative;
}
.ae-marco-card.ae-marco-desarrollista { border-left: 4px solid var(--c-accent); }
.ae-marco-card.ae-marco-liberal       { border-left: 4px solid var(--c-mix); }
.ae-marco-card.ae-marco-general {
  border-left: 6px solid var(--c-ink);
  background: var(--c-surface);
  padding: 22px 24px;
}
.ae-marco-card.ae-marco-general .ae-marco-eyebrow {
  font-size: .78rem;
  color: var(--c-ink);
  letter-spacing: .14em;
}
.ae-marco-card.ae-marco-general .ae-summary-score {
  font-size: 2.8rem;
}

/* Evaluación general como gran desplegable; cada mirada, un desplegable interno con sus dimensiones */
.ae-general-exp { margin-top: 4px; }
.ae-mirada-exp { margin-top: 12px; }
.ae-exp-sum { list-style: none; cursor: pointer; display: block; position: relative; }
.ae-exp-sum::-webkit-details-marker { display: none; }
.ae-exp-sum .ae-marco-card { margin: 0; transition: box-shadow .15s; }
.ae-exp-sum:hover .ae-marco-card { box-shadow: 0 2px 12px rgba(0,0,0,.07); }
/* Indicador "Ver más detalles" para que se note que se expande */
.ae-exp-sum > .ae-marco-card::after {
  content: '\25B6  Ver más detalles';
  display: block; margin-top: 12px;
  font-size: .72rem; font-weight: 600; line-height: 1.2;
  color: var(--c-ink-soft); pointer-events: none;
}
details[open] > .ae-exp-sum > .ae-marco-card::after {
  content: '\25BC  Ver más detalles'; color: var(--c-accent-d);
}
.ae-general-body { margin-top: 14px; padding-left: 14px; border-left: 2px solid var(--c-line); }
.ae-general-body .ae-sub-eyebrow { margin-top: 0; }
.ae-mirada-exp > .ae-exp-body { margin-top: 12px; padding-left: 14px; border-left: 2px solid var(--c-line); }

/* Eyebrow que introduce las sub-evaluaciones */
.ae-sub-eyebrow {
  font-family: var(--f-sans);
  font-size: .72rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--c-ink-soft);
  margin: 0 0 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--c-line-soft);
}

.ae-marco-eyebrow {
  font-family: var(--f-sans);
  font-size: .68rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--c-ink);
  margin-bottom: 4px;
}
.ae-marco-card.ae-marco-desarrollista .ae-marco-eyebrow { color: var(--c-accent-d); }
.ae-marco-card.ae-marco-liberal       .ae-marco-eyebrow { color: var(--c-mix); }

.ae-marco-desc {
  font-size: .8rem;
  color: var(--c-ink-soft);
  margin-bottom: 12px;
  line-height: 1.4;
}
.ae-summary-score {
  font-family: var(--f-serif);
  font-size: 2.2rem;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 4px;
}
.ae-summary-score.ae-summary-score-pos { color: var(--c-pos); }
.ae-summary-score.ae-summary-score-neg { color: var(--c-neg); }
.ae-summary-score.ae-summary-score-neu { color: var(--c-ink-soft); }

/* ─── Banda transversal (v0.3): atraviesa a las dos miradas, full-width ─── */
.ae-transversal-wrap { margin: 6px 0 18px; }
/* Cuando la banda transversal va al final (debajo del detalle de las 10 dims), sin bracket. */
.ae-transversal-standalone { margin-top: 26px; padding-top: 22px; border-top: 1px dashed var(--c-line); }

/* La banda transversal usa el MISMO formato de card que la evaluación general
   (eyebrow · texto · score grande · breakdown · cubitos). */
/* Transversal: misma jerarquía visual que desarrollista/liberal (borde 4px, score normal) */
.ae-marco-card.ae-marco-transversal { border-left: 4px solid var(--c-ink); }
.ae-marco-card.ae-marco-transversal .ae-marco-eyebrow { color: var(--c-ink); }
.ae-transversal-dims { margin-top: 4px; }
.ae-transversal-body { margin-top: 14px; }

/* Columnas paralelas para el detalle de dimensiones */
.ae-columnas {
  display: grid;
  gap: 22px;
}
.ae-columnas-single { grid-template-columns: 1fr; }
.ae-columnas-dual   { grid-template-columns: 1fr 1fr; }
@media (max-width: 900px) {
  .ae-columnas-dual { grid-template-columns: 1fr; }
}
.ae-columna { display: flex; flex-direction: column; gap: 10px; }
.ae-columna-titulo {
  font-family: var(--f-sans);
  font-size: .72rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--c-ink-soft);
  margin: 0 0 4px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--c-line-soft);
}
.ae-columna.ae-columna-desarrollista .ae-columna-titulo {
  color: var(--c-accent-d);
  border-bottom-color: var(--c-accent);
}
.ae-columna.ae-columna-liberal .ae-columna-titulo {
  color: var(--c-mix);
  border-bottom-color: var(--c-mix);
}
.ae-grid-singlecol { grid-template-columns: 1fr; }

/* ─────────────────────────────────────────────────────────
   Coherencia ideológica (v0.2) · ficha del legislador
   ───────────────────────────────────────────────────────── */
.ci-bloque-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 16px;
  font-size: .95rem;
}
.ci-bloque-label {
  color: var(--c-ink-soft);
  font-size: .85rem;
}

/* Chip de ideología asignada */
.ci-chip {
  position: relative;
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 14px;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .05em;
  cursor: help;
  border: 1px solid transparent;
  transition: background .15s, color .15s;
}
.ci-chip::after {
  content: "ⓘ";
  margin-left: 6px;
  font-size: .72rem;
  opacity: .55;
}
.ci-chip-desarrollista {
  background: var(--c-accent-soft, #e8f1ff);
  color: var(--c-accent-d);
  border-color: var(--c-accent);
}
.ci-chip-liberal {
  background: #f4ede0;
  color: var(--c-mix);
  border-color: var(--c-mix);
}
.ci-chip-sin {
  background: var(--c-surface-2, #f5f5f0);
  color: var(--c-ink-soft);
  border-color: var(--c-line);
}

/* Tooltip que se expande al hover/focus del chip */
.ci-chip-tooltip {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  width: 280px;
  background: var(--c-ink);
  color: var(--c-surface);
  padding: 10px 12px;
  border-radius: 8px;
  font-size: .78rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.5;
  visibility: hidden;
  opacity: 0;
  transform: translateY(-4px);
  transition: opacity .15s, transform .15s, visibility .15s;
  pointer-events: none;
  z-index: 10;
  text-transform: none;
}
.ci-chip-tooltip strong { color: var(--c-surface); }
.ci-chip:hover .ci-chip-tooltip,
.ci-chip:focus .ci-chip-tooltip {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}

/* Disciplina de bloque (informativa) */
.disciplina-dato {
  background: var(--c-line-soft, #f5f5f0);
  border-radius: 10px;
  padding: 14px 16px;
  font-size: .95rem;
  line-height: 1.55;
  color: var(--c-ink);
}

/* Chip ideológico en el header del legislador */
.chip-ideo-desarrollista {
  background: var(--c-accent-soft, #e8f1ff);
  color: var(--c-accent-d);
}
.chip-ideo-liberal {
  background: #f4ede0;
  color: var(--c-mix);
}

/* Desglose de la conclusión de la alineación */
.dg-conclusion {
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--c-line-soft, #eee);
}
.dg-intro { margin: 0 0 8px; font-weight: 400; color: var(--c-ink); }
.dg-list { margin: 0; padding-left: 18px; line-height: 1.7; }
.dg-efecto { font-weight: 700; font-size: .85em; }
.dg-suma  { color: var(--c-pos); }
.dg-resta { color: var(--c-neg); }
.dg-media { color: var(--c-ink-soft); }
/* Desglose de alineación · modelo B (cálculo visible + "no computan") */
.dg-calc { display: flex; gap: 18px; margin: 6px 0 4px; font-size: .9rem; }
.dg-ok  { color: var(--c-pos); font-weight: 600; }
.dg-bad { color: var(--c-neg); font-weight: 600; }
.dg-formula { font-size: .92rem; color: var(--c-ink); }
.dg-nocomputa { margin: 12px 0; padding-top: 10px; border-top: 1px solid var(--c-line-soft, #eee); }
.dg-sub { margin: 0 0 6px; font-weight: 600; color: var(--c-ink-soft); font-size: .85rem; }
.dg-nocomputa .dg-list { list-style: none; padding-left: 0; line-height: 1.4; }
.dg-cat { font-size: .88rem; }
.dg-cat > summary { cursor: pointer; color: var(--c-ink-soft); padding: 3px 0; list-style: none; }
.dg-cat > summary::-webkit-details-marker { display: none; }
.dg-ver { color: var(--c-accent); font-size: .8em; margin-left: 4px; }
.dg-cat[open] > summary .dg-ver { opacity: .5; }
.dg-cat-leyes { padding: 3px 0 8px 14px; color: var(--c-ink-soft); font-size: .85rem; line-height: 1.5; }
.dg-foot { margin: 10px 0 0; font-size: .82rem; color: var(--c-ink-soft); line-height: 1.5; }

/* Gauges divergentes (escala −100 / +100, 0 al centro) */
.ci-gauges {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 18px;
}
.ci-gauge-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 6px;
}
.ci-gauge-label {
  font-size: .82rem;
  font-weight: 600;
  color: var(--c-ink-soft);
}
.ci-gauge-desarrollista .ci-gauge-label { color: var(--c-accent-d); }
.ci-gauge-liberal       .ci-gauge-label { color: var(--c-mix); }
.ci-gauge-val {
  font-family: var(--f-serif);
  font-size: 1.3rem;
  font-weight: 700;
}
.ci-gauge-desarrollista .ci-gauge-val { color: var(--c-accent-d); }
.ci-gauge-liberal       .ci-gauge-val { color: var(--c-mix); }
.ci-gauge-val-na { color: var(--c-ink-soft); }

.ci-gauge-track {
  position: relative;
  height: 12px;
  background: var(--c-line-soft, #eee);
  border-radius: 6px;
}
.ci-gauge-zero {
  position: absolute;
  left: 50%;
  top: -2px;
  bottom: -2px;
  width: 1px;
  background: var(--c-ink-soft);
  opacity: .5;
}
.ci-gauge-fill {
  position: absolute;
  top: 0;
  bottom: 0;
  border-radius: 3px;
}
.ci-gauge-desarrollista .ci-gauge-fill { background: var(--c-accent); }
.ci-gauge-liberal       .ci-gauge-fill { background: var(--c-mix); }
.ci-gauge-foot {
  font-size: .76rem;
  color: var(--c-ink-soft);
  margin-top: 5px;
}

/* Frase narrativa */
.ci-frase {
  padding: 14px 18px;
  border-radius: 10px;
  font-size: 1rem;
  line-height: 1.5;
  font-weight: 500;
  border-left: 4px solid var(--c-ink);
  background: var(--c-surface-2, #f8f8f4);
}
.ci-frase-coherente   { border-left-color: var(--c-pos); background: #ecf6ec; }
.ci-frase-incoherente { border-left-color: var(--c-neg); background: #fbecec; }
.ci-frase-mixto       { border-left-color: var(--c-ink-soft); background: var(--c-surface-2, #f5f5f0); }
.ci-frase-sin-ideologia { border-left-color: var(--c-ink-soft); background: var(--c-surface-2, #f5f5f0); }
.ci-frase-sin-datos   { border-left-color: var(--c-line); background: var(--c-surface); color: var(--c-ink-soft); font-style: italic; }
.ci-grado-nota {
  margin-top: 12px;
  font-size: .85rem;
  line-height: 1.5;
  color: var(--c-ink-soft);
}
.ci-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ci-tag {
  display: inline-block; padding: 3px 11px; border-radius: 999px;
  font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em;
  line-height: 1.4; vertical-align: middle;
}
.ci-tag-coherente     { background: #ecf6ec; color: #2f6b3a; }
.ci-tag-incoherente   { background: #fbecec; color: #9a1f2e; }
.ci-tag-mixto         { background: var(--c-line-soft); color: var(--c-ink-soft); }
.ci-tag-sin-ideologia { background: var(--c-line-soft); color: var(--c-ink-soft); }
.ci-tag-sin-datos     { background: var(--c-line-soft); color: var(--c-ink-soft); }

/* ──────────────────────────────────────────────
   Coherencia ideológica · display sub-dimensión (v0.4)
   ────────────────────────────────────────────── */
.ci-band-tag.ci-band-coincide-fuerte  { background: var(--c-pos-soft); color: #1f5e32; }
.ci-band-tag.ci-band-coincide         { background: var(--c-pos-soft); color: #2f6b3a; }
.ci-band-tag.ci-band-mixto            { background: var(--c-line-soft); color: var(--c-ink-soft); }
.ci-band-tag.ci-band-se-aparta        { background: var(--c-neg-soft); color: #9a1f2e; }
.ci-band-tag.ci-band-se-aparta-fuerte { background: var(--c-neg-soft); color: #7e1622; }
.ci-band-tag.ci-band-sindatos         { background: var(--c-line-soft); color: var(--c-ink-soft); }

/* Barra protagonista con signo (−100 … 0 … +100) */
.coh-bar { margin: 4px 0 6px; }
.coh-bar-head {
  display: flex; align-items: baseline; justify-content: space-between; gap: 8px;
  margin-bottom: 7px;
}
.coh-bar-axis-min, .coh-bar-axis-max {
  font-size: .68rem; font-weight: 700; color: var(--c-ink-mute); flex-shrink: 0;
}
.coh-band-name {
  font-size: .82rem; font-weight: 600; color: var(--c-ink-soft); text-align: center;
  flex: 1; min-width: 0;
}
.coh-band-name strong { color: var(--c-ink); font-family: var(--f-serif); }
.coh-band-name.coh-band-coincide-fuerte,
.coh-band-name.coh-band-coincide { color: var(--c-pos); }
.coh-band-name.coh-band-coincide-fuerte strong,
.coh-band-name.coh-band-coincide strong { color: var(--c-pos); }
.coh-band-name.coh-band-se-aparta,
.coh-band-name.coh-band-se-aparta-fuerte { color: var(--c-neg); }
.coh-band-name.coh-band-se-aparta strong,
.coh-band-name.coh-band-se-aparta-fuerte strong { color: var(--c-neg); }
.coh-band-name.coh-band-mixto { color: var(--c-mix); }
.coh-band-name.coh-band-mixto strong { color: var(--c-mix); }

.coh-bar-track {
  position: relative; height: 16px; border-radius: 8px;
  background: var(--c-line-soft);
}
.coh-bar-zones {
  position: absolute; inset: 0; border-radius: 8px;
  background: linear-gradient(90deg,
    var(--c-neg-soft)   0%, var(--c-neg-soft)   20%,
    var(--c-line-soft) 20%, var(--c-line-soft) 40%,
    var(--c-line-soft) 40%, var(--c-line-soft) 60%,
    var(--c-line-soft) 60%, var(--c-line-soft) 80%,
    var(--c-pos-soft)  80%, var(--c-pos-soft) 100%);
  opacity: .9;
}
.coh-marker {
  position: absolute; top: 50%; width: 14px; height: 14px;
  transform: translate(-50%, -50%);
  background: var(--c-ink); border: 2px solid var(--c-surface);
  border-radius: 50%; box-shadow: 0 1px 3px rgba(14,27,44,.35);
}
.coh-bar-foot { font-size: .78rem; color: var(--c-ink-soft); margin-top: 6px; }

.coh-fraccion {
  font-size: .9rem; line-height: 1.55; color: var(--c-ink-soft);
  margin: 8px 0 0;
}

/* Detalle desplegable */
.coh-detalle { margin-top: 14px; border-top: 1px solid var(--c-line); padding-top: 8px; }
.coh-detalle-head {
  cursor: pointer; font-size: .86rem; font-weight: 600; color: var(--c-accent-d);
  list-style: none; padding: 6px 0;
}
.coh-detalle-head::-webkit-details-marker { display: none; }
.coh-detalle-head::after { content: ' +'; color: var(--c-ink-soft); font-weight: 400; }
.coh-detalle[open] .coh-detalle-head::after { content: ' −'; }
.coh-detalle-body { padding-top: 6px; }
.coh-sub-title {
  font-size: .92rem; margin: 16px 0 2px; color: var(--c-ink);
}
.coh-detalle-body > .coh-sub-title:first-child { margin-top: 6px; }
.coh-sub-help { font-size: .8rem; color: var(--c-ink-soft); line-height: 1.5; margin: 0 0 10px; }

/* ── Brújula 2D (mapa de posición): Desarrollista horizontal · Liberal vertical ── */
/* Etiquetas FUERA del cuadro: Liberal arriba/abajo (horizontal), Desarrollista a los lados (vertical) */
.coh-brujula-wrap {
  max-width: 300px; margin: 10px auto 4px;
  display: flex; flex-direction: column; align-items: center; gap: 6px;
}
.coh-brujula-mid {
  display: flex; align-items: stretch; justify-content: center; gap: 6px; width: 100%;
}
.coh-brujula {
  position: relative; flex: 1; max-width: 260px; aspect-ratio: 1 / 1;
  border: 1px solid var(--c-line); border-radius: 10px;
  background: var(--c-surface); overflow: hidden;
}
/* cuadrantes con tinte muy sutil → se lee como mapa */
.coh-quad { position: absolute; width: 50%; height: 50%; z-index: 0; }
.coh-quad-tl { top: 0; left: 0;  background: var(--c-line-soft); opacity: .55; }
.coh-quad-tr { top: 0; right: 0; background: var(--c-bg); }
.coh-quad-bl { bottom: 0; left: 0; background: var(--c-bg); }
.coh-quad-br { bottom: 0; right: 0; background: var(--c-line-soft); opacity: .55; }
/* grilla fina (líneas tenues cada 25%) */
.coh-grid {
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background:
    repeating-linear-gradient(to right,  transparent 0, transparent calc(25% - 1px), var(--c-line-soft) calc(25% - 1px), var(--c-line-soft) 25%),
    repeating-linear-gradient(to bottom, transparent 0, transparent calc(25% - 1px), var(--c-line-soft) calc(25% - 1px), var(--c-line-soft) 25%);
}
/* líneas de los ejes en 0 (cruz central), un poco más visibles */
.coh-axis-line { position: absolute; background: var(--c-line); z-index: 1; }
.coh-axis-v { left: 50%; top: 4%; bottom: 4%; width: 1.5px; transform: translateX(-.75px); }
.coh-axis-h { top: 50%; left: 4%; right: 4%; height: 1.5px; transform: translateY(-.75px); }
/* etiquetas externas de extremos */
.coh-brujula-lbl {
  font-size: .62rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
  color: var(--c-ink-mute); line-height: 1.2; white-space: nowrap; text-align: center;
}
.coh-brujula-side {
  display: flex; align-items: center; justify-content: center;
  font-size: .62rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
  color: var(--c-ink-mute); line-height: 1.2; white-space: nowrap;
}
/* texto vertical legible de abajo hacia arriba */
.coh-brujula-side-left  { writing-mode: vertical-rl; transform: rotate(180deg); }
.coh-brujula-side-right { writing-mode: vertical-rl; }
.coh-brujula-point {
  position: absolute; z-index: 3; width: 14px; height: 14px;
  transform: translate(-50%, -50%);
  background: var(--c-accent); border: 2px solid var(--c-surface); border-radius: 50%;
  box-shadow:
    0 0 0 6px rgba(14,77,140,.14),
    0 0 0 11px rgba(14,77,140,.07),
    0 1px 5px rgba(14,27,44,.45);
}
.coh-brujula-nodato {
  position: absolute; inset: 0; z-index: 3; display: flex; align-items: center; justify-content: center;
  padding: 16px; text-align: center; font-size: .76rem; color: var(--c-ink-soft);
}
/* línea de lectura bajo el mapa */
.coh-brujula-lectura {
  margin: 8px 0 0; font-size: .78rem; color: var(--c-ink-soft); text-align: center; line-height: 1.4;
}
.coh-brujula-lectura strong { color: var(--c-ink); }

/* ── Desglose por mirada: dos colapsables (declarada / contraria) ── */
.coh-mirada {
  margin-top: 12px; border: 1px solid var(--c-line); border-radius: 10px;
  background: var(--c-surface); overflow: hidden;
}
.coh-mirada-head {
  cursor: pointer; list-style: none; padding: 11px 14px;
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px;
}
.coh-mirada-head::-webkit-details-marker { display: none; }
.coh-mirada-head::before {
  content: '\25B6'; color: var(--c-ink-soft); font-weight: 400; font-size: .8rem; align-self: center; flex-shrink: 0;
}
.coh-mirada[open] > .coh-mirada-head::before { content: '\25BC'; }
.coh-mirada-title { font-size: .94rem; font-weight: 700; color: var(--c-ink); }
.coh-mirada-sub { font-size: .76rem; color: var(--c-ink-soft); }
.coh-mirada-body { padding: 2px 14px 12px; }

/* "¿Cómo se evalúa la coherencia?" — toggle dentro del mapa que abre los dos desgloses por mirada */
.coh-como { margin-top: 14px; border-top: 1px solid var(--c-line-soft); padding-top: 12px; }
.coh-como-head {
  cursor: pointer; list-style: none; font-size: .86rem; font-weight: 600;
  color: var(--c-accent-d); display: inline-flex; align-items: center; gap: 6px;
}
.coh-como-head::-webkit-details-marker { display: none; }
.coh-como-head::before { content: '\25B6'; color: var(--c-ink-soft); font-weight: 400; font-size: .8rem; flex-shrink: 0; }
.coh-como[open] .coh-como-head::before { content: '\25BC'; color: var(--c-accent); }
.coh-como-body { padding-top: 6px; }
/* desgloses anidados: sin doble margen superior */
.coh-mirada-nested:first-of-type { margin-top: 8px; }

/* grupo de dimensión: header plano (no colapsable) */
.coh-dimgrp { padding-top: 12px; }
.coh-dimgrp + .coh-dimgrp { border-top: 1px solid var(--c-line-soft); }
.coh-dim-head {
  margin: 0 0 6px; font-size: .7rem; font-weight: 700; letter-spacing: .04em;
  text-transform: uppercase; color: var(--c-ink-mute);
}
.coh-sds { display: flex; flex-direction: column; gap: 9px; }

/* separador hairline muy fino entre sub-dim y sub-dim (no en la primera) */
.coh-sds > .coh-sd + .coh-sd { border-top: 1px solid var(--c-line-soft); padding-top: 9px; }

/* fila de sub-dim: nombre + badge de conteo */
.coh-sd-row { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.coh-sd-name { font-size: .9rem; color: var(--c-ink); line-height: 1.4; }
.coh-sd-badge {
  flex-shrink: 0; font-size: .72rem; font-weight: 700; white-space: nowrap;
  padding: 1px 8px; border-radius: 999px; background: var(--c-line-soft); color: var(--c-ink-soft);
}
.coh-sd-pos { background: var(--c-pos-soft); color: var(--c-pos); }
.coh-sd-neg { background: var(--c-neg-soft); color: var(--c-neg); }
.coh-sd-neu { background: var(--c-line-soft); color: var(--c-ink-soft); }

/* pregunta de la sub-dim: gris, chica */
.coh-sd-pregunta {
  margin: 2px 0 0; font-size: .78rem; line-height: 1.45; color: var(--c-ink-soft);
}

/* disclosure de leyes por sub-dim (segundo y último nivel de colapsable) */
.coh-leyes { margin-top: 5px; }
.coh-leyes-head {
  cursor: pointer; list-style: none; font-size: .76rem; font-weight: 600;
  color: var(--c-accent-d); padding: 1px 0;
}
.coh-leyes-head::-webkit-details-marker { display: none; }
.coh-leyes-head::after { content: ' +'; color: var(--c-ink-soft); font-weight: 400; }
.coh-leyes[open] .coh-leyes-head::after { content: ' −'; }
.coh-leyes-list { list-style: none; margin: 6px 0 0; padding: 0; display: flex; flex-direction: column; gap: 5px; }
.coh-ley {
  display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
  font-size: .8rem; padding-left: 8px; border-left: 2px solid var(--c-line);
}
.coh-leyes-list .coh-ley + .coh-ley { border-top: 1px solid var(--c-line-soft); padding-top: 5px; }
/* pregunta de la sub-dim, debajo del "Leyes que la formaron", entre dos líneas (letra chica) */
.coh-leyes-pregunta {
  margin: 7px 0 0; padding: 7px 0;
  border-top: 1px solid var(--c-line-soft); border-bottom: 1px solid var(--c-line-soft);
  font-size: .72rem; line-height: 1.45; color: var(--c-ink-soft); font-style: italic;
}
.coh-ley-name { color: var(--c-ink); line-height: 1.35; }
.coh-ley-meta { display: flex; align-items: baseline; gap: 6px; flex-shrink: 0; white-space: nowrap; }
.coh-ley-voto { font-size: .74rem; color: var(--c-ink-soft); }
.coh-ley-flag { font-size: .72rem; font-weight: 700; }
.coh-ley-pos { color: var(--c-pos); }
.coh-ley-neg { color: var(--c-neg); }
.coh-ley-neu { color: var(--c-ink-soft); }

@media (max-width: 480px) {
  .coh-ley { flex-direction: column; gap: 1px; }
  .coh-ley-meta { gap: 8px; }
  .coh-mirada-sub { width: 100%; }
}

/* ──────────────────────────────────────────────
   Formulario de derecho a réplica
   ────────────────────────────────────────────── */
.form-replica {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.form-row {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.form-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.form-replica label {
  font-size: .88rem;
  font-weight: 600;
  color: var(--c-ink);
  letter-spacing: .01em;
}
.form-replica .req {
  color: #c5253b;
  font-weight: 700;
  margin-left: 2px;
}
.form-replica .opt {
  color: var(--c-ink-soft);
  font-weight: 400;
  font-size: .82rem;
  margin-left: 2px;
}
.form-replica .form-hint {
  font-size: .78rem;
  color: var(--c-ink-soft);
  margin-top: 2px;
}
.form-replica input[type="text"],
.form-replica input[type="email"],
.form-replica input[type="tel"],
.form-replica select,
.form-replica textarea {
  width: 100%;
  border: 1px solid var(--c-line);
  border-radius: 8px;
  padding: 10px 12px;
  font: inherit;
  font-size: .95rem;
  color: var(--c-ink);
  background: var(--c-surface);
  transition: border-color .15s, box-shadow .15s;
}
.form-replica input:focus,
.form-replica select:focus,
.form-replica textarea:focus {
  outline: none;
  border-color: var(--c-accent);
  box-shadow: 0 0 0 3px rgba(0, 100, 200, .12);
}
.form-replica textarea {
  resize: vertical;
  min-height: 140px;
  font-family: inherit;
}
.form-replica select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23666' d='M6 8L0 0h12z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 36px;
}
.form-consent {
  background: var(--c-bg);
  border: 1px solid var(--c-line-soft);
  border-radius: 8px;
  padding: 12px 14px;
}
.form-consent .checkbox-row {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: .88rem;
  font-weight: 400;
  color: var(--c-ink);
  line-height: 1.5;
  cursor: pointer;
}
.form-consent input[type="checkbox"] {
  margin-top: 3px;
  flex-shrink: 0;
}
.form-actions {
  margin-top: 8px;
}
.btn-primary {
  display: inline-block;
  background: var(--c-accent);
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 12px 24px;
  font: inherit;
  font-size: .95rem;
  font-weight: 600;
  letter-spacing: .01em;
  cursor: pointer;
  transition: background .15s, transform .05s;
}
.btn-primary:hover { background: var(--c-accent-d); }
.btn-primary:active { transform: translateY(1px); }

@media (max-width: 720px) {
  .form-grid-2 { grid-template-columns: 1fr; }
}

/* Mensajes inline del formulario (éxito / error de Formspree) */
.form-mensaje-exito,
.form-mensaje-error {
  padding: 14px 18px;
  border-radius: 8px;
  margin-bottom: 18px;
  font-size: .95rem;
  line-height: 1.55;
}
.form-mensaje-exito {
  background: #ecf6ec;
  border: 1px solid #6caa6f;
  color: #2f6b3a;
}
.form-mensaje-error {
  background: #fbecec;
  border: 1px solid #c5253b;
  color: #9a1f2e;
}
.form-mensaje-exito strong,
.form-mensaje-error strong { display: block; margin-bottom: 4px; font-size: 1rem; }
.form-mensaje-exito p,
.form-mensaje-error p { margin: 0; }
.form-mensaje-error a { color: inherit; text-decoration: underline; }
.btn-primary:disabled {
  background: var(--c-ink-soft);
  cursor: wait;
}

/* Link "Derecho a réplica" en ficha del legislador */
.leg-replica-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 12px;
  padding: 6px 12px;
  background: var(--c-bg);
  border: 1px solid var(--c-line);
  border-radius: 999px;
  font-size: .82rem;
  color: var(--c-ink-soft);
  text-decoration: none;
  transition: background .15s, color .15s;
}
.leg-replica-link:hover {
  background: var(--c-line-soft);
  color: var(--c-ink);
}

/* ───────── Comparador (comparar.html) ───────── */
.cmp-selectores { display: flex; gap: 14px; align-items: flex-end; flex-wrap: wrap; }
.cmp-selectores .filter-group { flex: 1; min-width: 200px; display: flex; flex-direction: column; gap: 6px; }
.cmp-selectores select { width: 100%; }
.cmp-vs { padding-bottom: 10px; font-weight: 600; color: var(--c-ink-soft); }
.cmp-empty { color: var(--c-ink-soft); padding: 28px 0; text-align: center; }
.cmp-resumen { margin: 20px 0 0; font-size: .95rem; color: var(--c-ink); text-align: center; }
.cmp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 14px; }
.cmp-card { border: 1px solid var(--c-line); border-radius: 12px; padding: 16px; background: var(--c-surface); }
.cmp-card-head { display: flex; gap: 12px; align-items: center; text-decoration: none; color: inherit; }
.cmp-card-name { font-weight: 600; line-height: 1.2; }
.cmp-card-sub { font-size: .8rem; color: var(--c-ink-soft); margin-top: 4px; }
.cmp-score { font-size: 1.6rem; font-weight: 700; margin: 14px 0 6px; display: flex; align-items: baseline; gap: 8px; }
.cmp-score span { font-size: .7rem; font-weight: 500; color: var(--c-ink-soft); text-transform: uppercase; letter-spacing: .04em; }
.cmp-factor { margin-top: 10px; }
.cmp-factor-top { display: flex; justify-content: space-between; font-size: .78rem; color: var(--c-ink-soft); margin-bottom: 4px; }
.cmp-table-wrap { overflow-x: auto; }
.cmp-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.cmp-table th, .cmp-table td { padding: 9px 10px; border-bottom: 1px solid var(--c-line-soft); text-align: left; vertical-align: middle; }
.cmp-table th { font-size: .76rem; color: var(--c-ink-soft); text-transform: uppercase; letter-spacing: .04em; }
.cmp-table th:not(:first-child), .cmp-voto { text-align: center; width: 92px; }
.cmp-ley a { color: inherit; text-decoration: none; }
.cmp-ley a:hover { color: var(--c-accent-d); }
.cmp-difiere { background: var(--c-mix-soft); }
@media (max-width: 640px) {
  .cmp-grid { grid-template-columns: 1fr; }
  .cmp-vs { display: none; }
  .cmp-table th:not(:first-child), .cmp-voto { width: 60px; }
  .cmp-table th, .cmp-table td { padding: 8px 6px; font-size: .82rem; }
}

/* Combobox del comparador + buscador de leyes */
.cmp-search, .leyes-buscador input {
  padding: 10px 12px; border: 1px solid var(--c-line); border-radius: 8px;
  font-size: .95rem; font-family: inherit; background: var(--c-surface); color: var(--c-ink); width: 100%;
}
.cmp-search:focus, .leyes-buscador input:focus { outline: none; border-color: var(--c-accent); }
/* El comparador precarga dos legisladores → los campos deben verse claramente editables
   (combobox): lupa a la izquierda, caret a la derecha, hover resaltado, foco con halo. */
.filter-group input[type=search].cmp-search {
  border-width: 1.5px; cursor: pointer;
  padding-left: 38px; padding-right: 34px;
  background-color: var(--c-surface);
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='7' cy='7' r='5'/%3E%3Cline x1='15' y1='15' x2='11' y2='11'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='2,4 6,8 10,4'/%3E%3C/svg%3E");
  background-repeat: no-repeat, no-repeat;
  background-position: 13px center, right 13px center;
  background-size: 16px, 12px;
  transition: border-color .15s, box-shadow .15s, background-color .15s;
}
.filter-group input[type=search].cmp-search:hover { border-color: var(--c-accent); background-color: var(--c-accent-s); }
.filter-group input[type=search].cmp-search:focus { cursor: text; box-shadow: 0 0 0 3px var(--c-accent-s); }
.cmp-hint { text-align: center; margin: 12px 0 0; font-size: .85rem; color: var(--c-ink-soft); }
.cmp-combo { position: relative; }
.cmp-options {
  position: absolute; z-index: 50; left: 0; right: 0; top: calc(100% + 4px);
  margin: 0; padding: 4px; list-style: none;
  background: var(--c-surface); border: 1px solid var(--c-line); border-radius: 10px;
  box-shadow: 0 12px 30px rgba(14, 27, 44, .16);
  max-height: 280px; overflow-y: auto;
}
.cmp-options[hidden] { display: none; }
.cmp-options li { padding: 8px 10px; border-radius: 7px; cursor: pointer; display: flex; flex-direction: column; gap: 1px; }
.cmp-options li:hover { background: var(--c-bg); }
.cmp-opt-name { font-size: .92rem; }
.cmp-opt-sub { font-size: .76rem; color: var(--c-ink-soft); }
.cmp-opt-empty { padding: 10px; color: var(--c-ink-soft); font-size: .88rem; }
.leyes-buscador { margin: 0 0 16px; }
.leyes-buscador input { max-width: 460px; }
.leyes-sin-resultados { padding: 20px; color: var(--c-ink-soft); }

/* Proyectos · "ver más" para expandir el sumario de 1 línea a texto completo wrappeado. */
.proy-sum-ver { flex-shrink: 0; font-size: .72rem; color: var(--c-accent); cursor: pointer; white-space: nowrap; font-weight: 600; }
.proy-sum-ver:hover { color: var(--c-accent-d); text-decoration: underline; }

/* ── Compartir · botón + modal de redes ─────────────────────── */
/* Botón de compartir: SOLO en mobile (usa la hoja nativa del SO). En desktop se oculta. */
.share-btn {
  appearance: none;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 8px; margin-top: 10px;
  border: 1px solid var(--c-line); border-radius: 10px;
  background: var(--c-surface); color: var(--c-ink);
  font: inherit; cursor: pointer; transition: background .15s, border-color .15s;
  line-height: 0;
}
.share-btn:hover { background: var(--c-bg); border-color: var(--c-ink-soft); }
.share-btn svg { flex: none; color: var(--c-brand, #0e4d8c); }
.share-btn-mini { padding: 6px; margin-top: 0; }
.dash-share-row { display: block; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--c-line); }
.cmp-resumen .share-btn-mini { margin-left: 10px; vertical-align: middle; }

/* Botón "Historia" (story 9:16) · mismo criterio mobile-only que compartir. */
/* Botón "historia de Instagram": solo ícono, SOLO en mobile (se muestra en @media abajo). */
.story-btn {
  appearance: none;
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  padding: 8px; margin-top: 10px;
  border: 1px solid var(--c-line); border-radius: 10px;
  background: var(--c-surface); color: var(--c-ink);
  font: inherit; cursor: pointer; line-height: 0;
  transition: background .15s, border-color .15s, opacity .15s;
}
.story-btn:hover { background: var(--c-bg); border-color: var(--c-ink-soft); }
.story-btn:disabled { opacity: .6; cursor: progress; }
.story-btn .story-ico { display: inline-flex; color: var(--c-brand, #0e4d8c); }
.story-ico-load { display: inline-block; animation: tw-spin .8s linear infinite; font-size: 1rem; }
@keyframes tw-spin { to { transform: rotate(360deg); } }
.story-btn-mini { padding: 7px; margin-top: 0; }
.leg-name-row .story-btn { margin-top: 0; }

/* Botón "compartir en X (Twitter)": ícono solo, visible también en escritorio. */
.tw-btn {
  appearance: none;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 8px; margin-top: 10px;
  border: 1px solid var(--c-line); border-radius: 10px;
  background: var(--c-surface); color: var(--c-ink);
  cursor: pointer; line-height: 0; text-decoration: none;
  transition: background .15s, border-color .15s;
}
.tw-btn:hover { background: var(--c-bg); border-color: var(--c-ink-soft); }
.tw-btn svg { color: var(--c-ink); }
.tw-btn-mini { padding: 7px; margin-top: 0; }
.leg-name-row .tw-btn { margin-top: 0; }
.cmp-resumen .tw-btn-mini, .cmp-resumen .story-btn-mini, .cmp-resumen .wa-btn-mini { margin-left: 8px; vertical-align: middle; }

/* Botón "compartir por WhatsApp": manda la historia (imagen) a WhatsApp vía la hoja nativa. */
.wa-btn {
  appearance: none;
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  padding: 8px; margin-top: 10px;
  border: 1px solid var(--c-line); border-radius: 10px;
  background: var(--c-surface); color: var(--c-ink);
  font: inherit; cursor: pointer; line-height: 0;
  transition: background .15s, border-color .15s, opacity .15s;
}
.wa-btn:hover { background: var(--c-bg); border-color: var(--c-ink-soft); }
.wa-btn:disabled { opacity: .6; cursor: progress; }
.wa-btn .wa-ico { display: inline-flex; color: var(--c-brand, #0e4d8c); }
.wa-btn-mini { padding: 7px; margin-top: 0; }
.leg-name-row .wa-btn { margin-top: 0; }

/* Etiqueta chica arriba (o al lado) de los botones de compartir. */
.share-row-label { font-size: .72rem; color: var(--c-ink-soft); font-weight: 600; letter-spacing: .02em; margin: 0 0 6px; }
.cmp-share-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
.cmp-share-row .share-row-label { margin: 0; }

/* Modal "Tu historia está lista" (escritorio · sin compartir nativo) */
.historia-card { max-width: 360px; text-align: center; }
.historia-card h3 { margin: 0 0 14px; }
.historia-img { display: block; width: 100%; max-width: 264px; margin: 0 auto 16px; border-radius: 14px; box-shadow: 0 10px 34px rgba(14, 27, 44, .28); }
.historia-acciones { display: flex; gap: 10px; }
.historia-acciones .btn-tarjeta { flex: 1; justify-content: center; }
.historia-nota { margin: 12px 0 0; }

@media (max-width: 760px) {
  .share-btn { display: inline-flex; }
  .dash-share-row { display: block; }
  .story-btn { display: none; }   /* historia (imagen) solo en desktop */
}

.share-modal .share-preview {
  font-style: italic; color: var(--c-ink);
  background: var(--c-bg); border-radius: 10px; padding: 11px 13px;
}
.share-opts { display: flex; flex-direction: column; gap: 9px; margin-top: 4px; }
.share-opt {
  display: flex; align-items: center; gap: 11px;
  padding: 12px 14px; border: 1px solid var(--c-line); border-radius: 11px;
  background: var(--c-surface); color: var(--c-ink); text-decoration: none;
  font: inherit; font-size: .96rem; font-weight: 600; cursor: pointer;
  text-align: left; width: 100%;
}
.share-opt:hover { background: var(--c-bg); border-color: var(--c-ink-soft); }
.share-opt-ico { font-size: 1.15rem; width: 24px; text-align: center; flex: none; }