/* NOMBRE_APP · biblioteca, libro, configurar test, plan del día y estadísticas.
   El primer bloque (biblioteca, libro y configurar) es heredado de la fase 1: va con :where()
   (especificidad 0) para que libros.css (s1) y test.css (s2) manden aunque se carguen antes.
   Se puede borrar cuando entren las secciones 1 y 2.
   Toma la biblioteca y portadas de app.css (VISUAL 5), study-today.css, progress-tabs.css y
   stats-center de BomberoFlash, extrayendo solo lo usado. */

/* Portada del libro: imagen o iniciales sobre el tono de marca */
:where(.portada-libro) {
  position: relative; flex: none; width: 76px; aspect-ratio: 2 / 3; border-radius: 8px 12px 12px 8px; overflow: hidden;
  background: var(--marca-profunda); box-shadow: inset 4px 0 0 rgb(0 0 0 / .18), 0 6px 16px rgb(15 23 42 / .14);
}
:where(.portada-libro img) { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
:where(.portada-libro__marca) { position: absolute; inset: 0; display: grid; place-items: center; padding: 6px; color: rgb(255 255 255 / .92); font: 700 22px/1 var(--letra-cond); letter-spacing: .02em; text-align: center; text-transform: uppercase; }
:where(.portada-libro--grande) { width: 112px; }
:where(.portada-libro--grande .portada-libro__marca) { font-size: 30px; }

/* Lista de libros */
:where(.libros) { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 16px; }
:where(.libro-fila) {
  display: flex; gap: 16px; padding: 16px; border: 1px solid var(--linea); border-radius: var(--radio-l); background: #fff;
  box-shadow: var(--sombra); color: inherit; text-decoration: none; min-width: 0;
}
:where(a.libro-fila:hover) { border-color: var(--marca-borde); color: inherit; }
:where(.libro-fila__texto) { display: grid; align-content: start; gap: 4px; min-width: 0; }
:where(.libro-fila h3) { font-size: 17px; font-weight: 850; line-height: 1.3; overflow-wrap: anywhere; }
:where(.libro-fila p) { color: var(--tenue); font-size: 13px; line-height: 1.45; }
:where(.libro-fila .fila) { margin-top: 6px; }

/* Cabecera del libro */
:where(.libro-cabeza) { display: flex; gap: 20px; align-items: flex-start; }
:where(.libro-cabeza > div) { min-width: 0; }
:where(.libro-cabeza .titulo-pantalla) { overflow-wrap: anywhere; }
@media (max-width: 520px) { :where(.libro-cabeza) { gap: 14px; } :where(.libro-cabeza .portada-libro--grande) { width: 76px; } }
:where(.acciones-libro) { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 20px; }
:where(.libro-fila h3 a) { color: var(--tinta); text-decoration: none; }
:where(.libro-fila h3 a:hover) { color: var(--marca-fuerte); text-decoration: underline; }

/* Índice plegable: título/capítulo → artículos */
:where(.indice) { display: grid; gap: 10px; }
:where(.grupo) { border: 1px solid var(--linea); border-radius: var(--radio); background: #fff; overflow: hidden; }
:where(.grupo > summary) {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 4px 12px; min-height: 64px; padding: 12px 16px;
  cursor: pointer; list-style: none;
}
:where(.grupo > summary)::-webkit-details-marker { display: none; }
:where(.grupo > summary)::after { content: ''; grid-column: 2; grid-row: 1 / span 2; width: 10px; height: 10px; margin: 0 6px; border-right: 2px solid #64748b; border-bottom: 2px solid #64748b; transform: rotate(45deg); transition: transform 150ms; }
:where(.grupo[open] > summary)::after { transform: rotate(225deg); }
:where(.grupo > summary strong) { color: var(--tinta); font-size: 15px; font-weight: 850; overflow-wrap: anywhere; }
:where(.grupo > summary small) { grid-column: 1; color: var(--tenue); font-size: 13px; font-weight: 600; }
:where(.grupo__acciones) { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 16px 12px; }
:where(.unidades) { list-style: none; border-top: 1px solid var(--linea-suave); }
:where(.unidad) { display: grid; grid-template-columns: minmax(0, 1fr) minmax(90px, 160px) auto; align-items: center; gap: 12px; padding: 10px 16px; border-top: 1px solid var(--linea-suave); }
:where(.unidad:first-child) { border-top: 0; }
:where(.unidad__texto strong) { display: block; color: var(--tinta-2); font-size: 14px; font-weight: 750; }
:where(.unidad__texto small) { color: var(--tenue); font-size: 12px; }
:where(.unidad__medida) { display: grid; gap: 4px; }
:where(.unidad__medida small) { color: var(--tenue); font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; }
@media (max-width: 560px) {
  :where(.unidad) { grid-template-columns: minmax(0, 1fr) auto; }
  :where(.unidad__medida) { grid-column: 1 / -1; grid-row: 2; }
}

/* Configurar test */
:where(.configurar) { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, .9fr); gap: 20px; align-items: start; }
@media (max-width: 900px) { :where(.configurar) { grid-template-columns: 1fr; } }
:where(.configurar__pie) { position: sticky; bottom: 16px; display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; padding: 12px; border: 1px solid var(--linea); border-radius: var(--radio); background: #fff; box-shadow: var(--sombra); }
@media (max-width: 1023px) { :where(.configurar__pie) { bottom: calc(var(--barra-movil) + 12px + env(safe-area-inset-bottom, 0px)); } }

/* ══ Sección 3 · estudio y progreso ═══════════════════════════════════════
   Hoy, Progreso y Plazos (fase 4). Tarjetas redondeadas sobre el papel, como hojas sueltas; el
   marino solo en lo que se pulsa y en la tarjeta «Examen». Tokens propios con prefijo --s3-:
   una rampa ordinal del marino para «cuánto» (de claro a oscuro, misma tinta que --marino). */
:root {
  --s3-rampa-1: #c9d5e8;
  --s3-rampa-2: #8ca3c8;
  --s3-rampa-3: #4d6c9b;
  --s3-rampa-4: var(--marino, #1f3a63);
  --s3-pista: var(--linea-suave, #eee8de);
  --s3-radio: var(--radio-xl, 24px);
}

/* Separación usada por otras pantallas (planes, pago, cuenta, desbloquear) */
.panel-separado { margin-top: 16px; }

/* ── Hoy ──────────────────────────────────────────────────────────────── */
.hy { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-4, 16px); max-width: 1080px; }
.hy > * { min-width: 0; }
.hy__cabeza { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--esp-3, 12px) var(--esp-6, 24px); margin-bottom: var(--esp-2, 8px); }
.hy__fecha { margin-top: var(--esp-1, 4px); color: var(--tenue); font-weight: 550; }
.hy-libro { max-width: 100%; }
.hy-libro .selector { width: auto; max-width: 100%; min-height: 44px; padding-block: 8px; border-color: var(--linea); border-radius: var(--radio-pildora, 999px); background-color: var(--superficie); font-size: var(--tam-m, .875rem); font-weight: 650; }
.hy-libro--unico { color: var(--tenue); font-size: var(--tam-m, .875rem); font-weight: 600; }

.hy-tarjeta__etiqueta { display: flex; align-items: center; gap: 6px; font: 650 var(--tam-s, .8125rem)/1.3 var(--letra); letter-spacing: 0; color: var(--tenue); }
.hy-tarjeta__etiqueta svg.icono { width: 16px; height: 16px; }

/* El par de arriba: cuenta atrás y «¿Llegas?» (en 320 px, una debajo de otra) */
.hy-par { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--esp-3, 12px); }
@media (max-width: 359px) { .hy-par { grid-template-columns: minmax(0, 1fr); } }
.hy-examen, .hy-llegas { display: flex; flex-direction: column; justify-content: flex-start; gap: var(--esp-1, 4px); min-width: 0; min-height: 168px; padding: var(--esp-4, 16px) var(--esp-4, 16px) var(--esp-3, 12px); border-radius: var(--s3-radio); }
.hy-examen { background: var(--navy, #18304f); color: #fff; box-shadow: var(--sombra-suave); }
.hy-examen .hy-tarjeta__etiqueta { color: var(--navy-texto, #bccae0); }
.hy-examen__cifra { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; margin-top: var(--esp-2, 8px); color: #fff; font-size: var(--tam-base, 1rem); font-weight: 550; }
.hy-examen__n { font: 600 3rem/1 var(--letra-serif, Georgia, serif); letter-spacing: -.02em; font-variant-numeric: lining-nums proportional-nums; }
.hy-examen__n--texto { font-size: 2rem; }
.hy-examen__fecha, .hy-examen__nota { color: var(--navy-texto, #bccae0); font-size: var(--tam-s, .8125rem); line-height: 1.45; }
.hy-examen__pregunta { margin-top: var(--esp-2, 8px); color: #fff; font: 600 1.375rem/1.15 var(--letra-serif, Georgia, serif); text-wrap: balance; }
.hy-examen__cambiar {
  align-self: flex-start; display: inline-flex; align-items: center; min-height: 44px; margin-top: auto; padding: 0; border: 0; background: none;
  color: #fff; font-size: var(--tam-s, .8125rem); font-weight: 650; text-decoration: underline; text-decoration-color: rgb(255 255 255 / .5); text-underline-offset: 3px; cursor: pointer;
}
.hy-examen__cambiar:hover { text-decoration-color: #fff; text-decoration-thickness: 2px; }
.hy-examen__cambiar:focus-visible, .hy-examen__boton:focus-visible { outline-color: #fff; }
.hy-examen__boton { align-self: stretch; margin-top: auto; border-color: #fff; background: #fff; color: var(--marino, #1f3a63); white-space: normal; }
.hy-examen__boton:hover { border-color: var(--marino-suave, #ebf0f7); background: var(--marino-suave, #ebf0f7); color: var(--marino-profundo, #10223d); }

.hy-llegas { --s3-llegas: var(--tinta-2); position: relative; background: var(--crema, #f7f1e8); color: var(--s3-llegas); }
.hy-llegas__ilustracion { position: absolute; top: 10px; right: 10px; width: 44px; height: 44px; }
.hy-llegas[data-estado="llegas"] { --s3-llegas: var(--ok-tinta); background: var(--ok-suave); }
.hy-llegas[data-estado="justo"] { --s3-llegas: var(--ambar-tinta); background: var(--ambar-suave); }
.hy-llegas[data-estado="no"] { --s3-llegas: var(--mal-tinta); background: var(--mal-suave); }
.hy-llegas .hy-tarjeta__etiqueta { color: var(--s3-llegas); }
.hy-llegas__veredicto { margin-top: var(--esp-2, 8px); color: var(--s3-llegas); font: 600 2rem/1.05 var(--letra-serif, Georgia, serif); letter-spacing: -.015em; text-wrap: balance; }
.hy-llegas[data-estado="sin"] .hy-llegas__veredicto { font-size: 1.5rem; }
.hy-llegas__nota { color: var(--s3-llegas); font-size: var(--tam-s, .8125rem); line-height: 1.45; }
.hy-llegas__ritmo { margin-top: auto; padding-top: var(--esp-3, 12px); color: var(--s3-llegas); font-size: var(--tam-s, .8125rem); font-weight: 650; line-height: 1.45; }
.hy-llegas[data-estado="sin"] .hy-llegas__nota { margin-top: var(--esp-2, 8px); color: var(--texto); font-size: var(--tam-m, .875rem); }
@media (min-width: 480px) {
  .hy-examen, .hy-llegas { padding: var(--esp-5, 20px) var(--esp-5, 20px) var(--esp-4, 16px); min-height: 188px; }
  .hy-examen__n { font-size: 3.75rem; }
  .hy-llegas__veredicto { font-size: 2.5rem; }
}
.hy-aviso-memoria { color: var(--ambar-tinta); font-size: var(--tam-s, .8125rem); font-weight: 600; }

/* Siguiente y Lo de hoy: hojas blancas */
.hy-siguiente, .hy-lista, .hy-como { min-width: 0; padding: var(--esp-5, 20px); border: 1px solid var(--linea-suave); border-radius: var(--s3-radio); background: var(--superficie); box-shadow: var(--sombra-suave); }
.hy-siguiente { display: grid; align-content: start; gap: var(--esp-1, 4px); }
.hy-siguiente__que { margin-top: var(--esp-1, 4px); color: var(--tinta); font: 600 1.625rem/1.15 var(--letra-serif, Georgia, serif); letter-spacing: -.015em; text-wrap: balance; }
.hy-siguiente__nota { max-width: var(--medida, 62ch); color: var(--tenue); font-size: var(--tam-m, .875rem); line-height: 1.5; }
.hy-siguiente__acciones { display: flex; flex-wrap: wrap; gap: var(--esp-2, 8px); margin-top: var(--esp-4, 16px); }
@media (max-width: 559px) { .hy-siguiente__acciones .boton { flex: 1 1 auto; } }

.hy-lista { display: grid; gap: var(--esp-4, 16px); }
.hy-lista__titulo { color: var(--tinta); font: 600 1.375rem/1.2 var(--letra-serif, Georgia, serif); letter-spacing: -.01em; }
.hy-lista__sub { margin-top: var(--esp-2, 8px); color: var(--tinta-2); font-size: var(--tam-base, 1rem); font-weight: 650; }
.hy-meta { display: grid; gap: var(--esp-2, 8px); padding-bottom: var(--esp-4, 16px); border-bottom: 1px solid var(--linea-suave); }
.hy-meta p { color: var(--texto); font-size: .9375rem; line-height: 1.5; }
.hy-meta strong { color: var(--tinta); }
.hy-meta .barra { height: 8px; border-radius: 4px; background: var(--s3-pista); }
.hy-meta.es-cumplida .barra > span { background: var(--ok); }

.hy-como { display: grid; gap: var(--esp-3, 12px); align-self: start; background: var(--crema, #f7f1e8); border-color: transparent; box-shadow: none; }
.hy-como summary { display: flex; align-items: center; justify-content: space-between; gap: var(--esp-3, 12px); min-height: 44px; margin: -12px 0; color: var(--tinta); font-weight: 650; cursor: pointer; list-style: none; }
.hy-como summary::-webkit-details-marker { display: none; }
.hy-como summary::after { content: ''; flex: none; width: 8px; height: 8px; margin-right: 4px; border-right: 2px solid var(--tenue); border-bottom: 2px solid var(--tenue); transform: rotate(45deg); transition: transform var(--mv); }
.hy-como[open] summary::after { transform: rotate(225deg); }
.hy-como[open] summary { margin-bottom: 0; }
.hy-como p { max-width: var(--medida, 62ch); color: var(--texto); font-size: var(--tam-m, .875rem); line-height: 1.6; }

@media (min-width: 1024px) {
  .hy { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.2fr); gap: var(--esp-5, 20px); }
  .hy__cabeza, .hy-aviso-memoria { grid-column: 1 / -1; }
  .hy-par { grid-column: 1 / 3; gap: var(--esp-5, 20px); }
  .hy-siguiente { grid-column: 3; grid-row: 2; }
  .hy-lista { grid-column: 1 / 3; }
  .hy-como { grid-column: 3; }
  .hy-examen, .hy-llegas { min-height: 220px; }
}

/* Diálogo de la fecha */
.hy-form { display: grid; gap: var(--esp-5, 20px); }
.hy-form__para { display: grid; gap: 2px; margin: 0; padding: 0; border: 0; }
.hy-form__para legend { margin-bottom: var(--esp-1, 4px); padding: 0; }
.hy-form__error { color: var(--mal-tinta); font-size: var(--tam-m, .875rem); font-weight: 650; }
.hy-form__quitar { margin-right: auto; color: var(--mal-tinta); }

/* Plan del día dentro de «Lo de hoy»: frase, reparto apilado y orden (es una secuencia de verdad) */
.plan-hoy__frase { max-width: 32ch; color: var(--tinta); font: 600 1.25rem/1.3 var(--letra-serif, Georgia, serif); text-wrap: balance; }
.plan-hoy__frase strong { font-weight: 700; }
.plan-reparto { display: flex; gap: 2px; height: 10px; max-width: 560px; }
.plan-reparto__tramo { display: block; height: 100%; border-radius: 2px; min-width: 4px; background: var(--s3-tramo); }
.plan-reparto__tramo:first-child { border-radius: 5px 2px 2px 5px; }
.plan-reparto__tramo:last-child { border-radius: 2px 5px 5px 2px; }
.plan-reparto__tramo:only-child { border-radius: 5px; }
.plan-tramo--vencidas { --s3-tramo: var(--s3-rampa-4); }
.plan-tramo--aprendiendo { --s3-tramo: var(--s3-rampa-3); }
.plan-tramo--nuevas { --s3-tramo: var(--s3-rampa-2); }
.plan-orden { list-style: none; display: grid; gap: var(--esp-3, 12px); max-width: 560px; }
.plan-orden li { display: grid; grid-template-columns: 4rem minmax(0, 1fr); gap: var(--esp-3, 12px); align-items: baseline; }
.plan-orden__cifra { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; color: var(--tinta); font: 650 1.375rem/1 var(--letra-cond); font-variant-numeric: tabular-nums; }
.plan-orden__cifra::before { content: ''; flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--s3-tramo); }
.plan-orden__texto { display: grid; gap: 2px; }
.plan-orden__texto strong { color: var(--tinta-2); font-size: var(--tam-base, 1rem); font-weight: 650; }
.plan-orden__texto span { color: var(--tenue); font-size: var(--tam-m, .875rem); line-height: 1.5; }

.plan-libros { list-style: none; border-top: 1px solid var(--linea-suave); }
.plan-libro { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--esp-2, 8px) var(--esp-4, 16px); padding: var(--esp-3, 12px) 0; border-bottom: 1px solid var(--linea-suave); }
.plan-libro:last-child { border-bottom: 0; padding-bottom: 0; }
.plan-libro h3 { color: var(--tinta-2); font-size: .9375rem; font-weight: 650; line-height: 1.35; overflow-wrap: anywhere; }
.plan-libro p { margin-top: 2px; color: var(--tenue); font-size: var(--tam-s, .8125rem); }
.plan-libro__acciones { display: flex; flex-wrap: wrap; gap: var(--esp-2, 8px); justify-content: flex-end; }
.plan-libro__acciones .boton-peq { min-height: 44px; }
@media (max-width: 560px) {
  .plan-libro { grid-template-columns: 1fr; }
  .plan-libro__acciones { justify-content: stretch; }
  .plan-libro__acciones .boton { flex: 1 1 0; }
}

/* ── Progreso ─────────────────────────────────────────────────────────── */
.pg { display: grid; gap: var(--esp-4, 16px); max-width: 1080px; }
.pg > * { min-width: 0; }
.pg__panel { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-4, 16px); }
.pg__panel > * { min-width: 0; }
@media (min-width: 1024px) {
  .pg__panel { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: var(--esp-5, 20px); }
  .pg-vueltas, .pg-cifras, .pg__panel > .vacio, .pg__panel > .cargando { grid-column: 1 / -1; }
  .pg-dominio:last-child { grid-column: 1 / -1; }
}

/* Vueltas: la tarjeta marina, un tramo por vuelta del objetivo */
.pg-vueltas { display: grid; gap: var(--esp-2, 8px); padding: var(--esp-5, 20px); border-radius: var(--s3-radio); background: var(--navy, #18304f); color: #fff; box-shadow: var(--sombra-suave); }
.pg-vueltas .hy-tarjeta__etiqueta { color: var(--navy-texto, #bccae0); }
.pg-vueltas__cifra { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; font-size: var(--tam-l, 1.125rem); font-weight: 550; }
.pg-vueltas__n { font: 600 3.25rem/1 var(--letra-serif, Georgia, serif); letter-spacing: -.02em; }
.pg-vueltas__tramos { display: flex; gap: 4px; margin-top: var(--esp-1, 4px); }
.pg-vueltas__tramo { position: relative; flex: 1 1 0; height: 8px; border-radius: 4px; background: rgb(255 255 255 / .18); overflow: hidden; }
.pg-vueltas__tramo > span { position: absolute; inset: 0 auto 0 0; width: 0; border-radius: inherit; background: #fff; }
.pg-vueltas__nota { color: var(--navy-texto, #bccae0); font-size: var(--tam-m, .875rem); line-height: 1.5; }
.pg-vueltas__nota a { color: #fff; }
.pg-vueltas__nota a:focus-visible { outline-color: #fff; }
@media (min-width: 720px) { .pg-vueltas { padding: var(--esp-6, 24px) var(--esp-7, 32px); } .pg-vueltas__n { font-size: 4rem; } }

/* Hojas blancas del resto */
.pg-tarjeta { display: grid; align-content: start; gap: var(--esp-3, 12px); min-width: 0; padding: var(--esp-5, 20px); border: 1px solid var(--linea-suave); border-radius: var(--s3-radio); background: var(--superficie); box-shadow: var(--sombra-suave); }
.pg-tarjeta__titulo { color: var(--tinta); font: 650 var(--tam-base, 1rem)/1.3 var(--letra); }
.pg-grande { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; color: var(--tinta-2); font-weight: 600; }
.pg-grande__n { color: var(--tinta); font: 600 2.5rem/1 var(--letra-serif, Georgia, serif); letter-spacing: -.02em; }
.pg-clave { display: flex; align-items: center; gap: var(--esp-2, 8px); color: var(--tenue); font-size: var(--tam-s, .8125rem); font-weight: 600; }
.pg-clave__linea { flex: none; width: 22px; height: 0; border-top: 2px dashed var(--tinta-2); }

.est-seccion__cabeza { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--esp-2, 8px) var(--esp-5, 20px); }
.est-ayuda { max-width: var(--medida, 62ch); color: var(--tenue); font-size: var(--tam-m, .875rem); line-height: 1.5; }
.est-ayuda strong { color: var(--tinta-2); }

/* Cifras en rejilla, sin cajas dentro de la hoja */
.est-cifras { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: var(--esp-5, 20px) var(--esp-6, 24px); margin: 0; }
.est-cifra { display: grid; gap: 2px; align-content: start; }
.est-cifra dt { color: var(--tenue); font-size: var(--tam-m, .875rem); font-weight: 600; }
.est-cifra dd { margin: 0; display: grid; gap: 2px; }
.est-cifra__valor { color: var(--tinta); font: 650 1.75rem/1.1 var(--letra-cond); font-variant-numeric: tabular-nums; }
.est-cifra small { color: var(--tenue); font-size: var(--tam-s, .8125rem); line-height: 1.4; }
@media (max-width: 400px) { .est-cifras { grid-template-columns: 1fr 1fr; gap: var(--esp-4, 16px); } }

/* Leyenda y tramos de cobertura (rampa ordinal del marino: más oscuro, más sabido) */
.est-leyenda { list-style: none; display: flex; flex-wrap: wrap; gap: var(--esp-1, 4px) var(--esp-4, 16px); color: var(--texto); font-size: var(--tam-s, .8125rem); font-weight: 600; }
.est-leyenda li { display: inline-flex; align-items: center; gap: 6px; }
.est-muestra { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--s3-tramo); }
.est-tramo--dominadas { --s3-tramo: var(--s3-rampa-4); }
.est-tramo--vistasSinDominar { --s3-tramo: var(--s3-rampa-2); }
.est-tramo--sinVer { --s3-tramo: var(--s3-pista); }
.est-muestra.est-tramo--sinVer { box-shadow: inset 0 0 0 1px var(--linea-fuerte); }
.est-cob { display: flex; gap: 2px; height: 10px; min-width: 80px; }
.est-cob__tramo { display: block; height: 100%; min-width: 2px; border-radius: 2px; background: var(--s3-tramo); }
.est-cob__tramo:first-child { border-top-left-radius: 5px; border-bottom-left-radius: 5px; }
.est-cob__tramo:last-child { border-top-right-radius: 5px; border-bottom-right-radius: 5px; }

/* Capítulos: filas plegables dentro de la hoja */
.est-grupos { border-top: 1px solid var(--linea-suave); }
.est-grupo { border-bottom: 1px solid var(--linea-suave); }
.est-grupo:last-child { border-bottom: 0; }
.est-grupo > summary {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(120px, 34%) 20px; grid-template-areas: 'titulo barra flecha' 'datos barra flecha';
  align-items: center; gap: 2px var(--esp-5, 20px); min-height: 64px; padding: var(--esp-3, 12px) 0; cursor: pointer; list-style: none;
}
.est-grupo > summary::-webkit-details-marker { display: none; }
.est-grupo > summary::after {
  content: ''; grid-area: flecha; justify-self: center; width: 8px; height: 8px; border-right: 2px solid var(--tenue); border-bottom: 2px solid var(--tenue);
  transform: rotate(45deg) translate(-2px, -2px); transition: transform var(--mv);
}
.est-grupo[open] > summary::after { transform: rotate(225deg) translate(-2px, -2px); }
.est-grupo > summary:hover .est-grupo__titulo { color: var(--marca-fuerte); }
.est-grupo__titulo { grid-area: titulo; color: var(--tinta); font-size: .9375rem; font-weight: 650; line-height: 1.35; overflow-wrap: anywhere; }
.est-grupo__datos { grid-area: datos; color: var(--tenue); font-size: var(--tam-s, .8125rem); }
.est-grupo > summary .est-cob { grid-area: barra; }
@media (max-width: 600px) {
  .est-grupo > summary { grid-template-columns: minmax(0, 1fr) 20px; grid-template-areas: 'titulo flecha' 'barra flecha' 'datos flecha'; gap: 6px var(--esp-3, 12px); }
}
.est-tabla { margin-bottom: var(--esp-4, 16px); }
.est-tabla th[scope="row"] { background: none; color: var(--tinta-2); font-size: var(--tam-m, .875rem); font-weight: 650; }
.est-tabla td, .est-tabla th { vertical-align: middle; }
.est-col-barra { width: 28%; min-width: 90px; }
.est-de { color: var(--tenue); }
@media (max-width: 600px) { .est-tabla .est-col-barra { display: none; } }

/* Dónde más fallas: ranking (sí es un orden) */
.est-debiles { list-style: none; counter-reset: debil; }
.est-debiles li { display: grid; grid-template-columns: 1.25rem minmax(0, 1fr) auto; align-items: center; gap: var(--esp-3, 12px); padding: var(--esp-2, 8px) 0; border-top: 1px solid var(--linea-suave); counter-increment: debil; }
.est-debiles li::before { content: counter(debil); color: var(--tenue); font: 650 1.125rem/1 var(--letra-cond); font-variant-numeric: tabular-nums; }
.est-debil__texto { display: grid; gap: 2px; min-width: 0; }
.est-debil__texto strong { color: var(--tinta); font-weight: 650; }
.est-debil__texto span { color: var(--tenue); font-size: var(--tam-s, .8125rem); }
.est-debiles .boton-peq { min-height: 44px; }

/* Columnas por semana: una serie (sin leyenda) y una línea discontinua de referencia: lo que necesitas */
.est-columnas { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--esp-2, 8px); height: 200px; margin-top: var(--esp-2, 8px); }
.est-rejilla { display: flex; flex-direction: column; justify-content: space-between; padding-bottom: 22px; color: var(--tenue); font-size: var(--tam-xs, .75rem); font-variant-numeric: tabular-nums; text-align: right; }
.est-rejilla span { line-height: 1; transform: translateY(-50%); }
.est-rejilla span:last-child { transform: translateY(50%); }
.est-columnas__datos { position: relative; display: flex; align-items: stretch; }
.est-columnas__datos::before, .est-columnas__datos::after { content: ''; position: absolute; left: 0; right: 0; height: 1px; background: var(--linea-suave); }
.est-columnas__datos::before { top: 0; }
.est-columnas__datos::after { top: calc((100% - 22px) / 2); }
.est-col { position: relative; z-index: 1; flex: 1 1 0; display: grid; grid-template-rows: minmax(0, 1fr) 22px; justify-items: center; min-width: 0; }
.est-col::before { content: ''; position: absolute; left: 0; right: 0; bottom: 22px; height: 1px; background: var(--linea-fuerte); }
.est-col__barra { position: relative; align-self: end; width: min(calc(100% - 4px), 24px); min-height: 1px; border-radius: 4px 4px 0 0; background: var(--s3-rampa-2); }
.est-col.es-meta .est-col__barra { background: var(--s3-rampa-3); }
.est-col.es-actual .est-col__barra { background: var(--s3-rampa-4); }
.est-col__valor { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); padding: 1px 4px 3px; border-radius: 4px; color: var(--tinta); font-size: var(--tam-xs, .75rem); font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; opacity: 0; }
.est-col.es-actual .est-col__valor, .est-col:hover .est-col__valor { opacity: 1; }
.est-col:hover:not(.es-actual) .est-col__valor { background: var(--tinta); color: #fff; }
.est-col:hover .est-col__barra { filter: brightness(.85); }
.est-col__eje { align-self: end; color: var(--tenue); font-size: var(--tam-xs, .75rem); white-space: nowrap; }
.est-col:first-child .est-col__eje, .est-objetivo + .est-col .est-col__eje { position: absolute; left: 0; bottom: 0; line-height: 22px; }
.est-col:last-child .est-col__eje { position: absolute; right: 0; bottom: 0; line-height: 22px; }
@media (max-width: 479px) { .est-col__eje--media { visibility: hidden; } }
.est-objetivo { position: absolute; z-index: 2; left: 0; right: 0; height: 0; border-top: 2px dashed var(--tinta-2); pointer-events: none; }
.est-datos summary { display: inline-flex; align-items: center; min-height: 44px; color: var(--marca-fuerte); font-size: var(--tam-m, .875rem); font-weight: 650; cursor: pointer; }
.est-datos .tabla-envoltura { margin-top: var(--esp-2, 8px); }

/* Constancia: calendario de días */
.calendario { display: grid; grid-auto-flow: column; grid-template-rows: repeat(7, 14px); gap: 3px; }
.calendario span { width: 14px; height: 14px; border-radius: 4px; background: var(--s3-pista); }
.calendario span[data-n="1"] { background: var(--s3-rampa-1); }
.calendario span[data-n="2"] { background: var(--s3-rampa-2); }
.calendario span[data-n="3"] { background: var(--s3-rampa-3); }
.calendario span[data-n="4"] { background: var(--s3-rampa-4); }
.est-cal { display: flex; gap: 6px; max-width: 100%; overflow-x: auto; padding: 4px 0; }
.est-cal__dias { display: grid; grid-template-rows: repeat(7, 14px); gap: 3px; color: var(--tenue); font-size: 10px; font-weight: 650; line-height: 14px; }
.est-cal-leyenda { display: flex; align-items: center; gap: 3px; color: var(--tenue); font-size: var(--tam-xs, .75rem); font-weight: 600; }
.est-cal-leyenda span { width: 12px; height: 12px; border-radius: 3px; background: var(--s3-pista); }
.est-cal-leyenda span[data-n="1"] { background: var(--s3-rampa-1); } .est-cal-leyenda span[data-n="2"] { background: var(--s3-rampa-2); }
.est-cal-leyenda span[data-n="3"] { background: var(--s3-rampa-3); } .est-cal-leyenda span[data-n="4"] { background: var(--s3-rampa-4); }
@media (min-width: 400px) {
  .est-cal__rejilla { grid-template-rows: repeat(7, 18px); gap: 4px; }
  .est-cal__rejilla span { width: 18px; height: 18px; }
  .est-cal__dias { grid-template-rows: repeat(7, 18px); gap: 4px; line-height: 18px; }
}
@media (forced-colors: active) {
  .plan-reparto__tramo, .est-cob__tramo, .est-col__barra, .calendario span, .pg-vueltas__tramo > span { forced-color-adjust: none; }
}

/* Los hijos de las rejillas pueden encogerse (las tablas no empujan el ancho de la página). */
.plz > * { min-width: 0; }

/* ── Plazos y cifras: compuesto como un código, artículo y apartados ─── */
.plz { display: grid; gap: var(--esp-5, 20px); max-width: 920px; }
.plz__cabeza { display: grid; gap: var(--esp-1, 4px); }
.plz__volver { display: inline-flex; align-items: center; gap: 6px; justify-self: start; min-height: 44px; color: var(--tenue); font-size: var(--tam-m, .875rem); font-weight: 650; text-decoration: none; }
.plz__volver:hover { color: var(--marca-fuerte); text-decoration: underline; }
.plz__volver svg.icono { width: 16px; height: 16px; }
.plz__ley { color: var(--tinta-2); font: 400 1.0625rem/1.45 var(--letra-ley, Georgia, serif); font-style: italic; }

.plz-filtros { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: var(--esp-3, 12px) var(--esp-5, 20px); padding: var(--esp-5, 20px); border-radius: var(--s3-radio); background: var(--crema, #f7f1e8); }
.plz-buscar { max-width: 420px; }
.plz-tipos { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px; }
.plz-tipos button {
  display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 6px 16px; border: 1px solid var(--linea); border-radius: var(--radio-pildora, 999px);
  background: var(--superficie); color: var(--tinta-2); font-size: var(--tam-m, .875rem); font-weight: 650; cursor: pointer;
}
.plz-tipos button:hover { border-color: var(--linea-fuerte); }
.plz-tipos button span { color: var(--tenue); font-variant-numeric: tabular-nums; }
.plz-tipos button[aria-pressed="true"] { border-color: var(--marca); background: var(--marca); color: #fff; }
.plz-tipos button[aria-pressed="true"] span { color: var(--marino-borde, #c5d2e6); }
.plz-tapar { grid-row: 1; grid-column: 2; padding: 0; }
@media (max-width: 640px) { .plz-filtros { grid-template-columns: 1fr; } .plz-tapar { grid-row: auto; grid-column: 1; } .plz-buscar { max-width: none; } }
.plz-cuantos { color: var(--tenue); font-size: var(--tam-m, .875rem); }

.plz-cuerpo { display: grid; gap: var(--esp-4, 16px); }
.plz-art { display: grid; gap: var(--esp-2, 8px); padding: var(--esp-5, 20px) var(--esp-5, 20px) var(--esp-2, 8px); border: 1px solid var(--linea-suave); border-radius: var(--s3-radio, 24px); background: var(--superficie); box-shadow: var(--sombra-suave); }
.plz-art__titulo { color: var(--tinta); font: 600 1.375rem/1.2 var(--letra-serif, Georgia, serif); letter-spacing: -.01em; }
.plz-filas { margin: 0; }
.plz-fila { display: grid; grid-template-columns: 3rem minmax(0, 1fr); gap: var(--esp-3, 12px); padding: var(--esp-4, 16px) 0; border-top: 1px solid var(--linea-suave); }
.plz-fila:first-child { border-top-color: var(--linea-suave); }
.plz-fila__ap { color: var(--tenue); font: 650 1.0625rem/1.6 var(--letra-cond); font-variant-numeric: tabular-nums; text-align: right; }
.plz-fila__ap:not(:empty)::after { content: '.'; }
.plz-fila__cuerpo { display: grid; gap: var(--esp-2, 8px); margin: 0; min-width: 0; }
.plz-dato { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.plz-tipo { color: var(--tenue); font-size: var(--tam-s, .8125rem); font-weight: 650; }
.plz-valor { color: var(--tinta); font: 650 1.375rem/1.2 var(--letra-cond); }
.plz-valor:focus { outline: none; }
.plz-destapar {
  display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 6px 16px; border: 1px dashed var(--linea-fuerte); border-radius: var(--radio-pildora, 999px);
  background: var(--fondo-2); color: var(--tinta-2); font-size: var(--tam-m, .875rem); font-weight: 700; cursor: pointer;
}
.plz-destapar:hover { border-style: solid; border-color: var(--marca); color: var(--marca-fuerte); }
.plz-destapar svg.icono { width: 16px; height: 16px; }
.plz-cita { max-width: var(--medida-ley, 68ch); margin: 0; color: var(--tinta-2); font: 400 1.0625rem/var(--interlinea-ley, 1.7) var(--letra-ley, Georgia, serif); hyphens: auto; }
.plz-cita mark { padding: 0 .1em; border-radius: 2px; background: var(--marca-suave); box-shadow: inset 0 -2px var(--marca-borde); color: var(--tinta); box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.plz-hueco { display: inline-block; width: 4.5em; height: 1.1em; vertical-align: -.15em; border-bottom: 2px solid var(--linea-fuerte); background: var(--fondo-2); }
.plz-cita--oculta { color: var(--tenue); font-family: var(--letra); font-size: var(--tam-m, .875rem); }
.plz-nada { padding: var(--esp-5, 20px) 0; color: var(--texto); }
@media (max-width: 480px) {
  .plz-art { padding-inline: var(--esp-4, 16px); }
  .plz-fila { grid-template-columns: 2.25rem minmax(0, 1fr); gap: var(--esp-2, 8px); }
  .plz-cita { font-size: 1rem; }
}
@media print {
  .plz-filtros, .plz__volver, .plz-cuantos { display: none !important; }
  .plz-art { break-inside: avoid; }
}
.est-tabla tr:last-child th, .est-datos tr:last-child th { border-bottom: 0; }
