/* =====================================================================
   Observatorio legislativo (público)
   Depende de mr.css. Prefijo: .obs-
   ===================================================================== */

/* Colores del semáforo como variables locales ------------------------ */
.obs-aprobada    { --obs-c: var(--mr-verde); --obs-cc: var(--mr-verde-claro); }
.obs-dictaminada { --obs-c: var(--mr-azul);  --obs-cc: var(--mr-azul-claro); }
.obs-tramite     { --obs-c: var(--mr-azul);  --obs-cc: var(--mr-azul-claro); }
.obs-ambar       { --obs-c: var(--mr-ambar); --obs-cc: var(--mr-ambar-claro); }
.obs-congeladora { --obs-c: var(--mr-rojo);  --obs-cc: var(--mr-rojo-claro); }
.obs-cerrada     { --obs-c: #57505f;         --obs-cc: #eeecf1; }

.text-verde { color: var(--mr-verde) !important; }
.text-rojo  { color: var(--mr-rojo) !important; }
.text-ambar { color: var(--mr-ambar) !important; }
.text-azul  { color: var(--mr-azul) !important; }

/* Señal: icono + texto, nunca solo color */
.obs-senal {
  display: inline-flex; align-items: center; gap: .45rem;
  font-size: .86rem; font-weight: 650; line-height: 1.15;
  padding: .42rem .72rem .42rem .6rem; border-radius: 8px;
  background: var(--mr-morado-claro); color: var(--mr-morado-2);
  border: 1px solid transparent;
}
.obs-senal i { font-size: .95em; }
.obs-senal.verde { background: var(--mr-verde-claro); color: #17613f; border-color: #c4e5d6; }
.obs-senal.azul  { background: var(--mr-azul-claro);  color: var(--mr-azul); border-color: #cddcf1; }
.obs-senal.ambar { background: var(--mr-ambar-claro); color: #8a4d04; border-color: #f1d9ae; }
.obs-senal.rojo  { background: var(--mr-rojo-claro);  color: #9c1d14; border-color: #f2c7c2; }
.obs-senal.gris  { background: #eeecf1; color: #4c4554; border-color: #dedae4; }
.obs-senal-grande { font-size: 1rem; padding: .6rem .95rem .6rem .8rem; border-radius: 10px; }

/* Secciones con borde superior: recuperan su aire aunque sigan a otra sección. */
.seccion + .seccion.seccion-borde { padding-top: clamp(3rem, 7vw, 5.5rem); }
.obs-seccion-semaforo { padding-top: clamp(2.5rem, 5vw, 3.5rem); }

/* Encabezado ---------------------------------------------------------- */
.obs-encabezado h1 { max-width: 18ch; }
.obs-subnav { display: grid; gap: .15rem; border-left: 2px solid var(--mr-linea); padding-left: 1rem; }
.obs-subnav a { display: flex; gap: .6rem; align-items: center; padding: .35rem 0; font-weight: 600; text-decoration: none; }
.obs-subnav a:hover { text-decoration: underline; }
.obs-subnav i { width: 1.15rem; text-align: center; color: var(--mr-cempa-texto); }
.obs-actualizado { margin: 1.75rem 0 0; font-size: .9rem; color: var(--mr-piedra); }
.obs-actualizado i { color: var(--mr-piedra-2); margin-right: .25rem; }

/* Cifras -------------------------------------------------------------- */
.obs-cifras {
  display: grid; gap: 1px; margin: 0;
  background: var(--mr-linea); border: 1px solid var(--mr-linea); border-radius: var(--mr-radio-lg); overflow: hidden;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (min-width: 992px) { .obs-cifras { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 459.98px) { .obs-cifras { grid-template-columns: 1fr; } }
.obs-cifras > div { background: #fff; padding: 1.35rem 1.4rem 1.4rem; }
.obs-cifras dt { font-size: .92rem; font-weight: 600; color: var(--mr-piedra); display: flex; gap: .45rem; align-items: center; }
.obs-cifras dd { margin: 0; }
.obs-cifras .cifra { margin-top: .6rem; }
.obs-unidad { font-family: var(--mr-sans); font-size: 1rem; font-weight: 500; color: var(--mr-piedra); letter-spacing: 0; }
.obs-cifra-nota { margin-top: .5rem !important; font-size: .86rem; color: var(--mr-piedra); line-height: 1.4; }

/* Panorama del semáforo */
.obs-panorama { margin-top: 1.75rem; }
.obs-panorama-titulo { font-family: var(--mr-sans); font-size: 1rem; font-weight: 650; letter-spacing: 0; margin-bottom: .75rem; }
.obs-panorama-barra { display: flex; gap: 3px; height: 14px; border-radius: 999px; overflow: hidden; background: var(--mr-linea); }
.obs-panorama-barra span { display: block; flex-basis: 0; min-width: 6px; background: var(--obs-c); }
.obs-panorama-leyenda { list-style: none; padding: 0; margin: 1rem 0 0; display: flex; flex-wrap: wrap; gap: .6rem 1.25rem; }
.obs-panorama-leyenda a { display: inline-flex; align-items: center; gap: .5rem; text-decoration: none; color: var(--mr-tinta); font-size: .95rem; }
.obs-panorama-leyenda a:hover strong { text-decoration: underline; }
.obs-panorama-leyenda .obs-senal { font-size: .8rem; padding: .3rem .55rem .3rem .45rem; }

/* Filtros ------------------------------------------------------------- */
.obs-filtros {
  display: grid; gap: .9rem .75rem; align-items: end;
  grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
  background: #fff; border: 1px solid var(--mr-linea); border-radius: var(--mr-radio-lg);
  padding: 1.15rem 1.15rem 1.25rem; margin-bottom: 1.25rem;
}
.obs-filtros .form-label { font-size: .88rem; margin-bottom: .3rem; }
.obs-filtros .form-select, .obs-filtros .form-control { font-size: .95rem; padding-block: .58rem; }
.obs-filtro-buscar { grid-column: span 2; }
@media (min-width: 1200px) {
  .obs-filtros { grid-template-columns: minmax(15rem, 2fr) repeat(5, minmax(0, 1fr)); }
  .obs-filtro-buscar { grid-column: auto; }
}
@media (max-width: 575.98px) { .obs-filtro-buscar { grid-column: 1 / -1; } }
.obs-filtro-acciones { grid-column: 1 / -1; display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.obs-buscar { position: relative; }
.obs-buscar i { position: absolute; left: .9rem; top: 50%; transform: translateY(-50%); color: var(--mr-piedra-2); pointer-events: none; }
.obs-buscar .form-control { padding-left: 2.4rem; }
.obs-conteo { color: var(--mr-piedra); font-size: .95rem; margin-bottom: .9rem; min-height: 1.5em; }
.obs-conteo strong { color: var(--mr-tinta); }

/* Lista del semáforo -------------------------------------------------- */
.obs-lista {
  list-style: none; margin: 0; padding: 0;
  background: #fff; border: 1px solid var(--mr-linea); border-radius: var(--mr-radio-lg); overflow: hidden;
}
.obs-fila {
  position: relative; display: grid; gap: .75rem 1.75rem;
  grid-template-columns: 1fr;
  padding: 1.2rem 1.15rem 1.25rem 1.4rem;
  border-bottom: 1px solid var(--mr-linea);
  scroll-margin-top: 6rem;
}
.obs-fila:last-child { border-bottom: 0; }
.obs-fila::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--obs-c, var(--mr-linea-2)); }
.obs-fila:hover { background: #fcfbfd; }
@media (min-width: 768px) {
  .obs-fila { grid-template-columns: minmax(0, 1fr) 13rem; padding: 1.35rem 1.5rem 1.4rem 1.75rem; }
}
@media (min-width: 1100px) { .obs-fila { grid-template-columns: minmax(0, 1fr) 15rem; gap: 1rem 3rem; } }
.obs-fila-tipo { font-size: .86rem; color: var(--mr-piedra); margin: 0 0 .55rem; display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .75rem; }
.obs-fila-tipo .obs-senal { font-size: .8rem; padding: .3rem .6rem .3rem .5rem; }
.obs-fila-titulo { font-size: 1.2rem; line-height: 1.3; margin: 0; }
.obs-fila-titulo a { color: var(--mr-tinta); text-decoration: none; }
.obs-fila-titulo a:hover { color: var(--mr-morado); text-decoration: underline; }
.obs-fila-titulo a::after { content: ""; position: absolute; inset: 0; } /* fila completa clicable */
.obs-fila-oficial { font-size: .92rem; color: var(--mr-piedra); margin: .4rem 0 0; line-height: 1.45; max-width: 68ch; }
.obs-fila-meta { display: flex; flex-wrap: wrap; gap: .3rem 1.25rem; margin: .65rem 0 0; font-size: .88rem; color: #4a4255; }
.obs-fila-meta > div { display: flex; gap: .45rem; align-items: baseline; }
.obs-fila-meta dt { color: var(--mr-piedra-2); font-weight: 400; }
.obs-fila-meta dd { margin: 0; }
.obs-fila-tiempo { align-self: center; }
.obs-dias { margin: 0 0 .55rem; font-size: .9rem; color: var(--mr-piedra); }
.obs-dias strong { font-family: var(--mr-serif); font-size: 1.45rem; font-weight: 600; color: var(--obs-c, var(--mr-tinta)); margin-right: .1rem; }
.obs-dias-fin { margin: 0; font-weight: 600; color: var(--obs-c, var(--mr-tinta)); }

/* Riel de días: 0 → 365+, con marcas en 90 y 180 */
.obs-riel { position: relative; height: 8px; border-radius: 999px; background: #efecf3; }
.obs-riel-avance { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 999px; background: var(--obs-c, var(--mr-morado)); min-width: 8px; }
.obs-riel-marca { position: absolute; top: -4px; width: 2px; height: 16px; margin-left: -1px; background: #fff; box-shadow: 0 0 0 1px var(--mr-piedra-2); border-radius: 1px; }
.obs-riel-escala { position: relative; height: 1.1rem; margin-top: .3rem; font-size: .72rem; color: var(--mr-piedra-2); font-variant-numeric: tabular-nums; }
.obs-riel-escala span { position: absolute; top: 0; transform: translateX(-50%); }
.obs-riel-escala span:last-child { transform: translateX(-100%); }

.obs-mas { display: flex; justify-content: center; margin-top: 1.25rem; }

/* Productividad ------------------------------------------------------- */
.obs-subtitulo { font-family: var(--mr-sans); font-size: 1.15rem; font-weight: 650; letter-spacing: -.005em; margin-bottom: .35rem; }
.obs-ranking { list-style: none; padding: 0; margin: 1rem 0 0; }
.obs-ranking li { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: .85rem; align-items: center; padding: .6rem 0; border-top: 1px solid var(--mr-linea); }
.obs-ranking-nombre { margin: 0 0 .4rem; font-weight: 600; line-height: 1.3; }
.obs-ranking-nombre a { color: var(--mr-tinta); text-decoration: none; }
.obs-ranking-nombre a:hover { color: var(--mr-morado); text-decoration: underline; }
.obs-ranking-cifra { margin: 0; font-family: var(--mr-serif); font-size: 1.35rem; min-width: 2ch; text-align: right; }
.obs-barra { height: 6px; border-radius: 999px; background: #f0edf4; overflow: hidden; }
.obs-barra span { display: block; height: 100%; border-radius: 999px; background: var(--mr-morado); }
.obs-barra-suave span { background: #a77fd0; }
.obs-partido {
  display: inline-block; font-family: var(--mr-sans); font-size: .76rem; font-weight: 550; color: var(--mr-piedra);
  border: 1px solid var(--mr-linea-2); border-radius: 999px; padding: .02rem .5rem; margin-left: .3rem; white-space: nowrap; vertical-align: .1em;
}

/* Avatar: iniciales debajo, foto encima si carga */
.obs-avatar {
  position: relative; display: inline-grid; place-items: center; flex: none;
  width: 44px; height: 44px; border-radius: 50%; overflow: hidden;
  background: var(--mr-noche-2); color: #fff;
}
.obs-avatar .obs-iniciales { font-family: var(--mr-serif); font-weight: 600; font-size: 1rem; letter-spacing: .02em; }
.obs-avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 20%; }
.obs-avatar.grande { width: 96px; height: 96px; }
.obs-avatar.grande .obs-iniciales { font-size: 2rem; }
.obs-avatar.retrato { width: 100%; height: auto; aspect-ratio: 4 / 5; border-radius: var(--mr-radio-lg); }
.obs-avatar.retrato .obs-iniciales { font-size: clamp(2.5rem, 7vw, 4rem); color: rgba(255,255,255,.7); }

/* Gráfica y tabla alternativa */
.obs-grafica { position: relative; min-height: 220px; margin-top: 1rem; }
.obs-tabla-alt { margin-top: 1rem; }
.obs-tabla-alt > summary { cursor: pointer; font-weight: 600; color: var(--mr-morado); width: fit-content; padding: .25rem 0; }
.obs-tabla-alt[open] > summary { margin-bottom: .5rem; }
.obs-tabla th[scope="row"] { font-weight: 550; }
.obs-tabla td { font-variant-numeric: tabular-nums; }

/* Metodología --------------------------------------------------------- */
.obs-metodo { list-style: none; margin: 0; padding: 0; display: grid; gap: 1px; background: var(--mr-linea); border: 1px solid var(--mr-linea); border-radius: var(--mr-radio-lg); overflow: hidden; }
@media (min-width: 768px) { .obs-metodo { grid-template-columns: 1fr 1fr; } }
.obs-metodo li { background: #fff; padding: 1.15rem 1.25rem; box-shadow: inset 3px 0 0 var(--obs-c); }
.obs-metodo p { margin: .65rem 0 0; color: var(--mr-piedra); font-size: .95rem; line-height: 1.5; }

/* Cierre -------------------------------------------------------------- */
.obs-cierre {
  background: var(--mr-noche); color: #d6cde4; border-radius: var(--mr-radio-lg);
  padding: clamp(1.75rem, 4vw, 2.75rem); display: flex; gap: 1.5rem; align-items: center; justify-content: space-between; flex-wrap: wrap;
}
.obs-cierre h2 { color: #fff; margin: 0 0 .5rem; }
.obs-cierre p { margin: 0; }
@media (max-width: 575.98px) {
  .obs-tabla > :not(caption) > * > * { padding: .65rem .5rem; }
  .obs-tabla thead th { white-space: normal; }
}

/* =====================================================================
   Ficha de iniciativa
   ===================================================================== */
.obs-ficha-cabecera h1 { font-size: clamp(2rem, 4vw, 3.1rem); max-width: 22ch; margin: 0; }
.obs-ficha-tipo { display: flex; flex-wrap: wrap; gap: .5rem .9rem; align-items: center; margin: 0 0 1.1rem; color: var(--mr-piedra); font-weight: 550; }
.obs-ficha-oficial { font-family: var(--mr-serif); font-size: 1.12rem; line-height: 1.55; color: #4a4255; margin: 1.1rem 0 0; max-width: 62ch; }
.obs-ficha-datos { display: flex; flex-wrap: wrap; gap: 1rem 2.25rem; margin: 1.75rem 0 0; }
.obs-ficha-datos dt { font-size: .82rem; font-weight: 500; color: var(--mr-piedra); }
.obs-ficha-datos dd { margin: .1rem 0 0; font-weight: 600; }
.obs-ficha-imagen { margin: 0; border-radius: var(--mr-radio-lg); overflow: hidden; aspect-ratio: 4 / 3; background: var(--mr-noche-2); box-shadow: var(--mr-sombra); }
.obs-ficha-imagen img { width: 100%; height: 100%; object-fit: cover; display: block; }

.obs-bloque { padding-block: 2rem; border-top: 1px solid var(--mr-linea); }
.obs-bloque:first-child { border-top: 0; padding-top: .5rem; }
.obs-bloque-titulo { font-size: clamp(1.45rem, 2.4vw, 1.8rem); margin-bottom: .85rem; }
.obs-resumen { font-size: 1.1rem; }

/* Línea de tiempo vertical */
.obs-linea { list-style: none; margin: 1.5rem 0 0; padding: 0; }
.obs-etapa { position: relative; display: grid; grid-template-columns: 2rem 1fr; gap: 1rem; padding-bottom: 1.4rem; }
.obs-etapa:last-child { padding-bottom: 0; }
.obs-etapa::before { content: ""; position: absolute; left: calc(1rem - 1px); top: 2rem; bottom: 0; width: 2px; background: var(--mr-linea-2); }
.obs-etapa:last-child::before { display: none; }
.obs-etapa.hecha::before { background: var(--mr-morado); }
.obs-etapa-punto {
  width: 2rem; height: 2rem; border-radius: 50%; display: grid; place-items: center; font-size: .85rem;
  background: #fff; border: 2px solid var(--mr-linea-2); color: var(--mr-piedra-2); position: relative; z-index: 1;
}
.obs-etapa.hecha .obs-etapa-punto { background: var(--mr-morado); border-color: var(--mr-morado); color: #fff; }
.obs-etapa.actual .obs-etapa-punto { background: var(--mr-cempa-claro); border-color: var(--mr-cempa); color: var(--mr-cempa-texto); box-shadow: 0 0 0 4px rgba(232, 137, 12, .15); }
.obs-etapa.detenida .obs-etapa-punto { background: #eeecf1; border-color: #8f889b; color: #4c4554; }
.obs-etapa-texto { padding-top: .2rem; }
.obs-etapa-nombre { margin: 0; font-weight: 650; display: flex; flex-wrap: wrap; gap: .2rem .75rem; align-items: baseline; }
.obs-etapa.pendiente .obs-etapa-nombre { color: var(--mr-piedra); }
.obs-etapa-estado { font-weight: 500; font-size: .88rem; color: var(--mr-piedra); }
.obs-etapa.actual .obs-etapa-estado { color: var(--mr-cempa-texto); font-weight: 650; }
.obs-etapa-detalle { margin: .2rem 0 0; font-size: .93rem; color: var(--mr-piedra); }

/* Votación */
.obs-votos-barra { display: flex; gap: 3px; height: 18px; border-radius: 6px; overflow: hidden; background: var(--mr-linea); margin: 1rem 0; }
.obs-votos-barra .verde { background: var(--mr-verde); }
.obs-votos-barra .rojo { background: var(--mr-rojo); }
.obs-votos-barra .gris { background: #9a93a5; }
.obs-votos { display: flex; flex-wrap: wrap; gap: 1rem 2.5rem; margin: 0; }
.obs-votos dt { font-size: .88rem; font-weight: 600; display: flex; gap: .4rem; align-items: center; }
.obs-votos .verde dt { color: var(--mr-verde); }
.obs-votos .rojo dt { color: var(--mr-rojo); }
.obs-votos .gris dt { color: #57505f; }
.obs-votos dd { margin: .15rem 0 0; color: var(--mr-piedra); }
.obs-votos dd strong { font-family: var(--mr-serif); font-size: 1.6rem; color: var(--mr-tinta); font-weight: 600; }

/* Personas (autorías, adhesiones, integrantes) */
.obs-personas { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; }
.obs-personas-rejilla { grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); margin-top: 1rem; gap: 1rem 1.5rem; }
.obs-personas-compactas { gap: .55rem; }
.obs-personas-compactas .obs-avatar { width: 34px; height: 34px; }
.obs-personas-compactas .obs-avatar .obs-iniciales { font-size: .8rem; }
.obs-persona { display: flex; gap: .75rem; align-items: center; min-width: 0; }
.obs-persona-texto { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.obs-persona-texto a, .obs-persona-texto > span { font-weight: 600; color: var(--mr-tinta); text-decoration: none; }
.obs-persona-texto a:hover { color: var(--mr-morado); text-decoration: underline; }
.obs-persona-texto small { color: var(--mr-piedra); font-size: .84rem; }

/* Posicionamientos */
.obs-posiciones { list-style: none; margin: 0 0 1rem; padding: 0; border-top: 1px solid var(--mr-linea); }
.obs-posiciones li { border-bottom: 1px solid var(--mr-linea); }
.obs-posiciones a { display: grid; grid-template-columns: 1fr auto; gap: .1rem 1rem; align-items: center; padding: .9rem .25rem; text-decoration: none; color: inherit; }
.obs-posiciones a:hover { background: #fff; }
.obs-posiciones a:hover .obs-posicion-org { color: var(--mr-morado); text-decoration: underline; }
.obs-posicion-org { font-weight: 650; grid-column: 1; }
.obs-posicion-meta { font-size: .88rem; color: var(--mr-piedra); grid-column: 1; }
.obs-posiciones i { grid-column: 2; grid-row: 1 / span 2; color: var(--mr-piedra-2); }

/* Cuerpo de la ficha: estado arriba en móvil; columna lateral en escritorio */
.obs-ficha-cuerpo { display: grid; gap: 2rem; grid-template-columns: minmax(0, 1fr); grid-template-areas: "estado" "principal" "personas"; }
.obs-principal { grid-area: principal; min-width: 0; }
.obs-lateral-estado { grid-area: estado; }
.obs-lateral-personas { grid-area: personas; border-top: 1px solid var(--mr-linea); padding-top: 2rem; }
@media (min-width: 992px) {
  .obs-ficha-cuerpo { grid-template-columns: minmax(0, 1fr) 21rem; grid-template-rows: auto 1fr; grid-template-areas: "principal estado" "principal personas"; column-gap: clamp(2.5rem, 5vw, 4.5rem); row-gap: 1.75rem; }
  .obs-lateral-personas { border-top: 0; padding-top: 0; align-self: start; }
}

/* Lateral */
.obs-lateral { display: grid; gap: 1.75rem; align-content: start; }
.obs-lateral-titulo { font-weight: 650; margin: 0 0 .75rem; }
.obs-estado {
  background: #fff; border: 1px solid var(--mr-linea); border-radius: var(--mr-radio-lg);
  padding: 1.35rem 1.4rem; box-shadow: inset 0 4px 0 var(--obs-c, var(--mr-linea-2));
}
.obs-estado-etiqueta { font-size: .85rem; color: var(--mr-piedra); font-weight: 600; margin: 0 0 .6rem; }
.obs-estado .obs-senal { font-size: .95rem; padding: .5rem .85rem .5rem .7rem; }
.obs-estado-dias { margin: 1.1rem 0 0; color: var(--mr-piedra); line-height: 1.4; }
.obs-estado-dias strong { display: block; font-family: var(--mr-serif); font-size: 2.6rem; line-height: 1; font-weight: 600; color: var(--obs-c, var(--mr-tinta)); margin-bottom: .2rem; }
.obs-estado-nota { margin: .85rem 0 0; font-size: .9rem; color: #4a4255; padding-top: .85rem; border-top: 1px solid var(--mr-linea); }
.obs-estado-ayuda { display: inline-block; margin-top: .85rem; font-size: .9rem; font-weight: 600; }
.obs-relacionadas .fila-enlace { display: grid; grid-template-columns: minmax(0, 1fr); gap: .55rem 1.25rem; align-items: center; }
.obs-relacionadas .obs-senal { justify-self: start; white-space: nowrap; }
@media (min-width: 576px) {
  .obs-relacionadas .fila-enlace { grid-template-columns: minmax(0, 1fr) 11.5rem; }
  .obs-relacionadas .obs-senal { justify-self: end; }
}
.obs-etapa.implicita::before { background: var(--mr-morado); opacity: .45; }
.obs-etapa.implicita .obs-etapa-punto { background: var(--mr-morado-claro); border-color: #b9a2d6; color: var(--mr-morado); }

/* =====================================================================
   Directorio del Congreso
   ===================================================================== */
.obs-claves { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: .45rem; font-size: .92rem; }
.obs-claves li { display: flex; align-items: center; gap: .55rem; }
.obs-clave { width: .95rem; height: .95rem; border-radius: 3px; flex: none; }
.obs-clave.presento, .obs-apilada .presento { background: var(--mr-morado); }
.obs-clave.adhirio, .obs-apilada .adhirio { background: #b48fd9; }
.obs-clave.sin, .obs-apilada .sin { background: #dcd7e3; }
.obs-composicion th[scope="row"] { white-space: nowrap; }
.obs-composicion th[scope="row"] a { color: var(--mr-tinta); text-decoration: none; }
.obs-composicion th[scope="row"] a:hover { color: var(--mr-morado); text-decoration: underline; }
.obs-col-barra { width: 42%; min-width: 7rem; }
.obs-apilada { display: flex; gap: 2px; height: 12px; border-radius: 4px; overflow: hidden; }
.obs-apilada span { display: block; flex-basis: 0; }
@media (max-width: 575.98px) { .obs-col-barra { display: none; } }

.obs-vistas { display: inline-flex; background: #fff; border: 1px solid var(--mr-linea-2); border-radius: 999px; padding: 3px; gap: 2px; }
.obs-vistas a { display: inline-flex; align-items: center; gap: .45rem; padding: .45rem .95rem; border-radius: 999px; text-decoration: none; font-weight: 600; font-size: .92rem; color: var(--mr-piedra); }
.obs-vistas a:hover { color: var(--mr-morado); background: var(--mr-morado-claro); }
.obs-vistas a[aria-current="page"] { background: var(--mr-morado); color: #fff; }

@media (min-width: 768px) { .obs-filtros-congreso { grid-template-columns: minmax(0, 14rem) minmax(0, 24rem) 1fr; } .obs-filtros-congreso .obs-filtro-acciones { grid-column: auto; } }

.obs-directorio { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); }
.obs-tarjeta {
  position: relative; display: flex; flex-direction: column; gap: .9rem;
  background: #fff; border: 1px solid var(--mr-linea); border-radius: var(--mr-radio-lg); padding: 1.15rem 1.2rem 1.1rem;
  transition: border-color .2s, box-shadow .2s;
}
.obs-tarjeta:hover { border-color: var(--mr-linea-2); box-shadow: var(--mr-sombra); }
.obs-tarjeta-cabeza { display: flex; gap: .9rem; align-items: center; }
.obs-avatar.mediano { width: 64px; height: 64px; }
.obs-avatar.mediano .obs-iniciales { font-size: 1.35rem; }
.obs-tarjeta-nombre { font-size: 1.12rem; line-height: 1.25; margin: 0; }
.obs-tarjeta-nombre a { color: var(--mr-tinta); text-decoration: none; }
.obs-tarjeta-nombre a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.obs-tarjeta:hover .obs-tarjeta-nombre a { color: var(--mr-morado); }
.obs-tarjeta-meta { margin: .25rem 0 0; font-size: .9rem; color: var(--mr-piedra); }
.obs-tarjeta-comisiones { list-style: none; margin: 0; padding: .8rem 0 0; border-top: 1px solid var(--mr-linea); display: grid; gap: .3rem; font-size: .88rem; color: #4a4255; }
.obs-tarjeta-comisiones strong { color: var(--mr-tinta); font-weight: 650; }
.obs-tarjeta-agenda { margin: auto 0 0; display: flex; flex-wrap: wrap; gap: .35rem 1rem; font-size: .86rem; font-weight: 600; color: var(--mr-morado-2); }
.obs-tarjeta-agenda i { color: var(--mr-cempa-texto); margin-right: .15rem; }
.obs-tarjeta-agenda .text-piedra { font-weight: 500; }

.obs-comisiones { display: grid; gap: 1rem; }
.obs-comision { background: #fff; border: 1px solid var(--mr-linea); border-radius: var(--mr-radio-lg); padding: clamp(1.15rem, 3vw, 1.6rem); }
.obs-comision-cabecera { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; align-items: baseline; justify-content: space-between; margin-bottom: 1.1rem; }
.obs-comision h3 { font-size: 1.3rem; margin: 0; }
.obs-comision-cifras { display: flex; flex-wrap: wrap; gap: .5rem .75rem; align-items: center; margin: 0; font-size: .92rem; font-weight: 600; }
.obs-comision-cifras .obs-senal { font-size: .8rem; padding: .28rem .55rem .28rem .45rem; }
.obs-con-cargo .obs-persona-texto small strong { color: var(--mr-cempa-texto); font-weight: 650; }
@media (max-width: 575.98px) {
  .obs-composicion { font-size: .92rem; }
  .obs-composicion th[scope="row"] { white-space: normal; }
  .obs-composicion thead th { font-size: .76rem; }
}

/* =====================================================================
   Perfil de diputación
   ===================================================================== */
.obs-perfil { display: grid; gap: 1.5rem; grid-template-columns: 7rem minmax(0, 1fr); align-items: start; }
@media (min-width: 768px) { .obs-perfil { grid-template-columns: 13rem minmax(0, 1fr); gap: 2.5rem; } }
.obs-perfil h1 { font-size: clamp(1.9rem, 4vw, 3rem); max-width: 20ch; margin: 0; }
.obs-perfil-meta { margin: .6rem 0 0; color: var(--mr-piedra); font-size: 1.05rem; font-weight: 500; }
@media (max-width: 575.98px) {
  .obs-perfil-texto { grid-column: 1 / -1; }
  .obs-perfil .obs-avatar.retrato { max-width: 7rem; }
}
.obs-lista-comisiones { list-style: none; padding: 0; margin: .75rem 0 0; }
.obs-lista-comisiones li { display: flex; justify-content: space-between; gap: .75rem; align-items: baseline; padding: .65rem 0; border-top: 1px solid var(--mr-linea); }
.obs-lista-comisiones a { font-weight: 600; color: var(--mr-tinta); text-decoration: none; }
.obs-lista-comisiones a:hover { color: var(--mr-morado); text-decoration: underline; }
.obs-cargo { flex: none; font-size: .82rem; color: var(--mr-piedra); }
.obs-cargo.destacado { color: var(--mr-cempa-texto); font-weight: 650; }