/* ---------- la sala del ejercicio ----------
   Todas las reglas van prefijadas con .opr-pt-sala. Es lo único que garantiza
   que ganen al reset del núcleo (.opr * mide (0,1,0), igual que una clase
   suelta) sin depender del orden en que LiteSpeed sirva las hojas.
   Manual técnico, punto 11.1.                                              */

.opr-pt-sala{scroll-margin-top:90px !important}

.opr-pt-sala .opr-pt-panel{
  max-width:900px !important; margin:0 auto !important; overflow:hidden !important;
  box-shadow:inset 0 0 0 1px var(--borde), var(--sombra) !important;
  display:flex !important; flex-direction:column !important; min-height:560px !important;
}

/* la hoja de defs no ocupa sitio: solo guarda el escudo de la marca de agua */
svg.opr-pt-defs{position:absolute !important; width:0 !important; height:0 !important; overflow:hidden !important}

/* ---------- antes de empezar ---------- */
.opr-pt-sala .opr-pt-ajuste{
  flex:1 !important; display:flex !important; flex-direction:column !important; justify-content:center !important;
  padding:clamp(26px,3.4vw,40px) !important; gap:0 !important;
}
.opr-pt-sala .opr-pt-aj-cabeza{margin-bottom:26px !important}
.opr-pt-sala .opr-pt-aj-etq{display:block !important; font-size:.875rem !important; font-weight:600 !important; color:var(--tenue) !important}
.opr-pt-sala .opr-pt-aj-tit{margin-top:6px !important; font-size:1.6rem !important; font-weight:800 !important; letter-spacing:-.028em !important; line-height:1.12 !important}
.opr-pt-sala .opr-pt-aj-sub{margin-top:8px !important; max-width:52ch !important; font-size:.96875rem !important; line-height:1.55 !important; color:var(--suave) !important}

.opr-pt-sala .opr-pt-aj-fila{
  display:flex !important; align-items:center !important; justify-content:space-between !important; gap:16px !important;
  padding:14px 0 !important; border-top:1px solid var(--borde) !important; flex-wrap:wrap !important;
}
.opr-pt-sala .opr-pt-aj-fila.es-modo{display:block !important}
.opr-pt-sala .opr-pt-aj-rot{font-size:.9375rem !important; font-weight:700 !important; letter-spacing:-.012em !important}
.opr-pt-sala .opr-pt-aj-fila.es-modo .opr-pt-aj-rot{display:block !important; margin-bottom:11px !important}

.opr-pt-sala .opr-pt-modos{display:grid !important; grid-template-columns:1fr 1fr !important; gap:9px !important}
.opr-pt-sala .opr-pt-modos button{
  display:block !important; width:100% !important; text-align:left !important; padding:14px 16px !important; border-radius:var(--radio-s) !important;
  box-shadow:inset 0 0 0 1.5px var(--borde) !important; transition:box-shadow .15s ease, background .15s ease !important;
}
.opr-pt-sala .opr-pt-modos b{display:block !important; font-size:.9375rem !important; font-weight:700 !important; letter-spacing:-.013em !important; color:var(--suave) !important}
.opr-pt-sala .opr-pt-modos span{display:block !important; margin-top:3px !important; font-size:.8125rem !important; color:var(--tenue) !important; line-height:1.45 !important}
.opr-pt-sala .opr-pt-modos button:hover{background:var(--p50) !important; box-shadow:inset 0 0 0 1.5px var(--borde2) !important}
.opr-pt-sala .opr-pt-modos button[aria-checked="true"]{box-shadow:inset 0 0 0 2px var(--p950) !important; background:var(--p50) !important}
.opr-pt-sala .opr-pt-modos button[aria-checked="true"] b{color:var(--tinta) !important}

.opr-pt-sala .opr-pt-aj-regla{
  margin-top:16px !important; padding:12px 14px !important; border-radius:var(--radio-s) !important;
  background:var(--p50) !important; box-shadow:inset 0 0 0 1px var(--borde) !important;
  font-size:.875rem !important; line-height:1.5 !important; color:var(--suave) !important;
}
.opr-pt-sala .opr-pt-aj-botones{display:flex !important; gap:9px !important; margin-top:22px !important; flex-wrap:wrap !important}
.opr-pt-sala .opr-pt-aj-ir{flex:1 1 auto !important}
.opr-pt-sala .opr-pt-aviso{margin-top:12px !important; font-size:.875rem !important; line-height:1.5 !important; color:var(--suave) !important; min-height:1px !important}
.opr-pt-sala .opr-pt-aviso.es-mal{color:var(--no600) !important; font-weight:600 !important}

/* ---------- cabecera y pie del ejercicio ---------- */
.opr-pt-sala .opr-pt-test{display:flex !important; flex-direction:column !important; flex:1 !important}
.opr-pt-sala .opr-pt-cabecera{
  display:flex !important; align-items:center !important; justify-content:space-between !important; gap:14px !important;
  padding:14px 22px !important; border-bottom:1px solid var(--borde) !important; background:#FBFCFD !important;
}
.opr-pt-sala .opr-pt-donde{display:flex !important; align-items:baseline !important; gap:9px !important; min-width:0 !important}
.opr-pt-sala .opr-pt-donde b{font-size:.9375rem !important; font-weight:700 !important; letter-spacing:-.014em !important; flex:none !important}
/* Encoge y se corta con puntos suspensivos. En el simulacro la cabecera lleva
   DOS nombres —el ejercicio de las bases y el subtipo que ha tocado— y en un
   móvil no caben los dos: sin esto, el segundo se montaba encima del primero.
   El que se corta es el subtipo, que es el dato menor. */
.opr-pt-sala .opr-pt-donde-dif{
  font-size:.8125rem !important; color:var(--tenue) !important;
  min-width:0 !important; overflow:hidden !important; text-overflow:ellipsis !important; white-space:nowrap !important;
}
.opr-pt-sala .opr-pt-medidas{display:flex !important; align-items:center !important; gap:14px !important; flex:none !important}
.opr-pt-sala .opr-pt-reloj{
  padding:5px 11px !important; border-radius:999px !important; background:var(--p100) !important;
  font-size:.84375rem !important; font-weight:700 !important; color:var(--suave) !important;
}
.opr-pt-sala .opr-pt-contador{font-size:.84375rem !important; font-weight:700 !important; white-space:nowrap !important}

/* El panel mantiene el alto en todos los ejercicios —así el enunciado no salta
   de sitio al pasar de uno a otro—, y el contenido se centra: los verbales no
   dibujan y sin esto se quedaban pegados arriba con medio panel vacío. */
.opr-pt-sala .opr-pt-cuerpo{padding:22px !important; display:flex !important; flex-direction:column !important; flex:1 !important; justify-content:center !important}
.opr-pt-sala .opr-pt-enunciado{
  font-size:1.125rem !important; font-weight:700 !important; line-height:1.38 !important; letter-spacing:-.014em !important;
  text-wrap:pretty !important; text-align:center !important;
}

.opr-pt-sala .opr-pt-leyenda{
  display:flex !important; justify-content:center !important; flex-wrap:wrap !important; gap:10px !important; margin-top:14px !important;
}
.opr-pt-sala .opr-pt-ley{
  display:flex !important; align-items:center !important; gap:9px !important; padding:8px 14px 8px 10px !important;
  border-radius:999px !important; box-shadow:inset 0 0 0 1px var(--borde) !important; background:var(--superficie) !important;
}
.opr-pt-sala .opr-pt-ley.es-objetivo{box-shadow:inset 0 0 0 1.5px var(--p950) !important}
.opr-pt-sala .opr-pt-ley b{display:block !important; font-size:.84375rem !important; font-weight:700 !important; letter-spacing:-.012em !important}
.opr-pt-sala .opr-pt-ley span{display:block !important; font-size:.75rem !important; color:var(--tenue) !important}
.opr-pt-sala .opr-pt-ley svg{width:26px !important; height:26px !important; flex:none !important; color:var(--tinta) !important; fill:none !important; stroke:currentColor !important; stroke-width:1.7 !important; stroke-linecap:round !important; stroke-linejoin:round !important}

.opr-pt-sala .opr-pt-escena{
  margin-top:16px !important; padding:14px !important; border-radius:var(--radio-s) !important;
  background:var(--superficie) !important; box-shadow:inset 0 0 0 1px var(--borde) !important;
  display:flex !important; align-items:center !important; justify-content:center !important; overflow-x:auto !important;
}
.opr-pt-sala .opr-pt-escena svg.opr-pt-lienzo{
  display:block !important; width:100% !important; max-width:640px !important; height:auto !important; max-height:52vh !important;
}
.opr-pt-sala .opr-pt-nota-ej{margin-top:9px !important; text-align:center !important; font-size:.8125rem !important; color:var(--tenue) !important}

/* ---------- las opciones ---------- */
.opr-pt-sala .opr-pt-opciones{margin-top:16px !important; display:grid !important; gap:9px !important; grid-template-columns:repeat(4,minmax(0,1fr)) !important}
.opr-pt-sala .opr-pt-opciones.es-largo{grid-template-columns:1fr !important}
.opr-pt-sala .opr-pt-opcion{
  position:relative !important; display:flex !important; align-items:center !important; justify-content:center !important; gap:10px !important;
  min-height:56px !important; padding:13px 14px !important; border-radius:var(--radio-s) !important;
  background:var(--superficie) !important; box-shadow:inset 0 0 0 1.5px var(--borde) !important;
  font-size:1rem !important; font-weight:600 !important; line-height:1.35 !important; text-align:center !important;
  transition:box-shadow .14s ease, background .14s ease, transform .1s ease !important;
}
.opr-pt-sala .opr-pt-opciones.es-largo .opr-pt-opcion{justify-content:flex-start !important; text-align:left !important}
.opr-pt-sala .opr-pt-opcion:hover:not(:disabled){box-shadow:inset 0 0 0 1.5px var(--borde2) !important; background:#FAFBFD !important}
.opr-pt-sala .opr-pt-opcion:active:not(:disabled){transform:translateY(1px) !important}
.opr-pt-sala .opr-pt-opcion:disabled{cursor:default !important}
.opr-pt-sala .opr-pt-letra{
  position:absolute !important; top:6px !important; left:8px !important; font-size:.6875rem !important; font-weight:700 !important; color:var(--tenue) !important;
}
.opr-pt-sala .opr-pt-opcion svg.opr-pt-ficha{width:auto !important; height:84px !important; display:block !important}
.opr-pt-sala .opr-pt-opcion.es-ok{background:var(--ok100) !important; box-shadow:inset 0 0 0 2px var(--ok600) !important; color:var(--ok900) !important}
.opr-pt-sala .opr-pt-opcion.es-no{background:var(--no100) !important; box-shadow:inset 0 0 0 2px var(--no600) !important; color:var(--no900) !important}
.opr-pt-sala .opr-pt-opcion.es-marcada{box-shadow:inset 0 0 0 2px var(--p950) !important}
.opr-pt-sala .opr-pt-opcion.es-apagada{opacity:.5 !important}

.opr-pt-sala .opr-pt-expl{max-height:0 !important; overflow:hidden !important; opacity:0 !important; margin-top:0 !important;
  transition:max-height .3s ease, opacity .24s ease .06s, margin-top .3s ease !important}
.opr-pt-sala .opr-pt-expl.visible{max-height:260px !important; opacity:1 !important; margin-top:12px !important}
.opr-pt-sala .opr-pt-expl > div{
  padding:13px 15px !important; border-radius:var(--radio-s) !important; border-left:3px solid var(--borde2) !important;
  font-size:.90625rem !important; line-height:1.55 !important;
}
.opr-pt-sala .opr-pt-expl.es-ok > div{background:var(--ok100) !important; border-left-color:var(--ok600) !important; color:var(--ok900) !important}
.opr-pt-sala .opr-pt-expl.es-no > div{background:var(--no100) !important; border-left-color:var(--no600) !important; color:var(--no900) !important}
.opr-pt-sala .opr-pt-veredicto{display:block !important; font-weight:700 !important; margin-bottom:4px !important}

.opr-pt-sala .opr-pt-pie{
  display:flex !important; align-items:center !important; justify-content:space-between !important; gap:14px !important;
  padding:14px 22px !important; border-top:1px solid var(--borde) !important; background:#FBFCFD !important;
}
.opr-pt-sala .opr-pt-salir{padding:10px 16px !important; font-size:.875rem !important}
.opr-pt-sala .opr-pt-siguiente{padding:12px 20px !important; font-size:.9375rem !important}
.opr-pt-sala .opr-pt-puntos{display:flex !important; gap:5px !important; align-items:center !important; flex-wrap:wrap !important; justify-content:center !important; flex:1 !important}
.opr-pt-sala .opr-pt-punto{width:8px !important; height:8px !important; border-radius:999px !important; background:var(--p300) !important; transition:all .24s ease !important}
.opr-pt-sala .opr-pt-punto.es-activo{width:22px !important; background:var(--p950) !important}
.opr-pt-sala .opr-pt-punto.es-hecha{background:var(--p600) !important}
.opr-pt-sala .opr-pt-punto.es-ok{background:var(--ok600) !important}
.opr-pt-sala .opr-pt-punto.es-no{background:var(--no600) !important}

/* ---------- el resultado ---------- */
.opr-pt-sala .opr-pt-final{
  flex:1 !important; padding:30px 22px 24px !important; display:flex !important; flex-direction:column !important;
  align-items:center !important; text-align:center !important; gap:12px !important; overflow-y:auto !important;
}
.opr-pt-sala .opr-pt-marcador{display:flex !important; align-items:baseline !important; gap:8px !important}
.opr-pt-sala .opr-pt-marcador b{font-size:3rem !important; font-weight:800 !important; line-height:1 !important; letter-spacing:-.04em !important}
.opr-pt-sala .opr-pt-marcador span{font-size:.9375rem !important; font-weight:600 !important; color:var(--tenue) !important}
.opr-pt-sala .opr-pt-nota{
  display:grid !important; grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:10px !important;
  width:100% !important; margin-top:6px !important;
}
.opr-pt-sala .opr-pt-nota > div{
  padding:13px 8px !important; border-radius:var(--radio-s) !important; background:var(--p50) !important;
  box-shadow:inset 0 0 0 1px var(--borde) !important;
  display:flex !important; flex-direction:column !important; align-items:center !important; gap:3px !important;
}
.opr-pt-sala .opr-pt-nota b{font-size:1.375rem !important; font-weight:800 !important; letter-spacing:-.03em !important; line-height:1 !important}
.opr-pt-sala .opr-pt-nota span{font-size:.71875rem !important; color:var(--tenue) !important; line-height:1.35 !important; text-align:center !important}
.opr-pt-sala .opr-pt-final-txt{max-width:46ch !important; font-size:.9375rem !important; color:var(--suave) !important; text-wrap:pretty !important}

.opr-pt-sala .opr-pt-repaso{width:100% !important; display:flex !important; flex-direction:column !important; gap:6px !important; text-align:left !important}
.opr-pt-sala .opr-pt-item{border-radius:var(--radio-s) !important; background:var(--p50) !important; box-shadow:inset 0 0 0 1px var(--borde) !important}
.opr-pt-sala .opr-pt-item summary{
  display:flex !important; align-items:flex-start !important; gap:10px !important; padding:11px 13px !important; cursor:pointer !important;
  font-size:.84375rem !important; line-height:1.45 !important; color:var(--suave) !important;
}
.opr-pt-sala .opr-pt-item summary::-webkit-details-marker{display:none !important}
.opr-pt-sala .opr-pt-item summary i{flex:none !important; width:7px !important; height:7px !important; margin-top:.45em !important; border-radius:2px !important; background:var(--no600) !important; display:block !important}
.opr-pt-sala .opr-pt-item.es-ok summary i{background:var(--ok600) !important}
.opr-pt-sala .opr-pt-item-cuerpo{padding:0 13px 13px 30px !important; font-size:.84375rem !important; line-height:1.5 !important; color:var(--suave) !important}
.opr-pt-sala .opr-pt-item-cuerpo b{color:var(--tinta) !important; font-weight:700 !important}
.opr-pt-sala .opr-pt-final-btns{display:flex !important; flex-wrap:wrap !important; gap:9px !important; justify-content:center !important; margin-top:6px !important; width:100% !important}
.opr-pt-sala .opr-pt-final-btns .opr-btn{flex:1 1 auto !important; padding:12px 18px !important; font-size:.90625rem !important}

@media (max-width:640px){
  .opr-pt-sala .opr-pt-panel{min-height:0 !important}
  .opr-pt-sala .opr-pt-ajuste{padding:22px 18px !important}
  .opr-pt-sala .opr-pt-aj-fila{align-items:flex-start !important; flex-direction:column !important; gap:10px !important}
  .opr-pt-sala .opr-pt-modos{grid-template-columns:1fr !important}
  .opr-pt-sala .opr-pt-cabecera{padding:12px 16px !important}
  .opr-pt-sala .opr-pt-cuerpo{padding:18px 16px !important}
  .opr-pt-sala .opr-pt-pie{padding:12px 16px !important}
  .opr-pt-sala .opr-pt-enunciado{font-size:1.0625rem !important}
  .opr-pt-sala .opr-pt-opciones{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .opr-pt-sala .opr-pt-opciones.es-largo{grid-template-columns:1fr !important}
  .opr-pt-sala .opr-pt-nota{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .opr-pt-sala .opr-pt-final-btns .opr-btn{flex:1 1 100% !important}
  .opr-pt-sala .opr-pt-escena svg.opr-pt-lienzo{max-height:44vh !important}
  .opr-pt-sala .opr-pt-opcion svg.opr-pt-ficha{height:66px !important}

  /* EL ÍNDICE DEL SIMULACRO, EN SU PROPIA LÍNEA. Son dieciséis puntos y el pie
     ya lleva tres botones: metidos en la misma fila, `flex-wrap` los apilaba en
     una columna de dieciséis y el pie se comía media pantalla. Con `order:-1` y
     ancho completo van arriba, en una fila, y el pie sigue siendo un pie. */
  .opr-pt-sala .opr-pt-pie{flex-wrap:wrap !important; row-gap:10px !important}
  .opr-pt-sala .opr-pt-puntos.es-ir{order:-1 !important; flex:0 0 100% !important; flex-wrap:nowrap !important; overflow-x:auto !important}
  .opr-pt-sala .opr-pt-puntos.es-ir .opr-pt-punto{flex:none !important; width:9px !important; height:9px !important}
  .opr-pt-sala .opr-pt-puntos.es-ir .opr-pt-punto.es-activo{width:20px !important}
  .opr-pt-sala .opr-pt-anterior span{display:none !important}
  .opr-pt-sala .opr-pt-anterior{padding:10px 12px !important}
}

/* ---------- en papel ----------
   La hoja imprimible es la misma sala: se quitan los botones y los fondos, se
   deja el dibujo y la marca de agua, y cada ejercicio empieza en su sitio.  */
@media print{
  .opr-pt-sala .opr-pt-pie,
  .opr-pt-sala .opr-pt-cabecera .opr-pt-reloj,
  .opr-pt-sala .opr-pt-expl{display:none !important}
  .opr-pt-sala .opr-pt-panel{box-shadow:none !important; min-height:0 !important}
  .opr-pt-sala .opr-pt-escena{box-shadow:none !important}
}


/* ---------- la sala, a pantalla completa ----------
   Mientras se hace un ejercicio, la sala ES la página: fija, sobre todo lo
   demás y del alto de la ventana. Antes era una tarjeta más debajo de la
   rejilla y en un móvil había que deslizar dos veces —una para llegar y otra
   para ver las opciones—.

   El reparto es el del lector de temas: la cabecera y el pie no encogen nunca,
   y lo que cede cuando falta alto es el DIBUJO, no las opciones. El enunciado
   y las cuatro opciones están siempre enteros en pantalla.                  */

.opr-pt-sala.es-abierta{
  position:fixed !important; left:0 !important; right:0 !important; bottom:0 !important; top:var(--opr-pt-arriba,0px) !important;
  z-index:1000 !important; padding:0 !important; overflow:hidden !important; scroll-margin-top:0 !important;
  margin:0 !important; max-width:none !important; background:var(--superficie) !important;
}
.opr-pt-sala.es-abierta > .opr-caja{max-width:none !important; height:100% !important}
.opr-pt-sala.es-abierta .opr-pt-panel{
  max-width:none !important; width:100% !important; height:100% !important; min-height:0 !important;
  border-radius:0 !important; box-shadow:none !important;
}

/* En pantallas anchas la sala no se pega a los bordes: sigue ocupando la
   ventana, pero el panel queda centrado y con su tarjeta, como en el resto del
   sitio. La ventana de trabajo de Sergio es 1280 × 609, así que el aire
   vertical es poco a propósito: lo que sobra tiene que ir al ejercicio. */
@media (min-width:921px){
  .opr-pt-sala.es-abierta{padding:clamp(10px,2vh,26px) clamp(18px,4vw,48px) !important; background:var(--p100) !important}
  .opr-pt-sala.es-abierta .opr-pt-panel{
    max-width:960px !important; margin:0 auto !important; border-radius:var(--radio) !important;
    box-shadow:inset 0 0 0 1px var(--borde), var(--sombra) !important;
  }
}

/* --- antes de empezar y el resultado: si no caben, se deslizan ellos --- */
.opr-pt-sala.es-abierta .opr-pt-ajuste,
.opr-pt-sala.es-abierta .opr-pt-final{flex:1 !important; min-height:0 !important; overflow-y:auto !important}
.opr-pt-sala.es-abierta .opr-pt-ajuste{justify-content:flex-start !important}
@media (min-height:680px){
  .opr-pt-sala.es-abierta .opr-pt-ajuste{justify-content:center !important}
}

/* --- el ejercicio, repartido en tres franjas --- */
.opr-pt-sala.es-abierta .opr-pt-test{flex:1 !important; min-height:0 !important}
.opr-pt-sala.es-abierta .opr-pt-cabecera,
.opr-pt-sala.es-abierta .opr-pt-pie{flex:none !important}

/* El cuerpo sigue centrando lo que hay dentro. Con dibujo da igual —la escena
   se come todo lo que sobra—, pero los verbales no dibujan: con el reparto
   pegado arriba, «palabra intrusa» dejaba media pantalla en blanco debajo de
   las cuatro opciones. */
.opr-pt-sala.es-abierta .opr-pt-cuerpo{
  flex:1 !important; min-height:0 !important; overflow:hidden !important; justify-content:center !important;
}
.opr-pt-sala.es-abierta .opr-pt-enunciado,
.opr-pt-sala.es-abierta .opr-pt-leyenda,
.opr-pt-sala.es-abierta .opr-pt-nota-ej,
.opr-pt-sala.es-abierta .opr-pt-opciones{flex:none !important}

/* El dibujo es lo único que da de sí. `flex:1 1 0` con `min-height:0` deja que
   encoja cuando se abre la explicación, en vez de empujar las opciones fuera
   de la ventana. El SVG lleva viewBox y `preserveAspectRatio="meet"`, así que
   al darle la caja entera se centra dentro sin deformarse. */
.opr-pt-sala.es-abierta .opr-pt-escena{
  flex:1 1 0 !important; min-height:64px !important; align-items:stretch !important; overflow:hidden !important;
}
.opr-pt-sala.es-abierta .opr-pt-escena svg.opr-pt-lienzo{
  width:100% !important; height:100% !important; max-width:none !important; max-height:none !important;
}

/* La explicación tiene techo y su propia barra: es lo que se lee después de
   contestar, no lo que hay que ver para contestar. */
.opr-pt-sala.es-abierta .opr-pt-expl.visible{max-height:min(240px,26vh) !important}
.opr-pt-sala.es-abierta .opr-pt-expl{overflow-y:auto !important}

@media (max-width:640px){
  .opr-pt-sala.es-abierta .opr-pt-cuerpo{padding:14px 14px 16px !important}
  .opr-pt-sala.es-abierta .opr-pt-ajuste{padding:20px 16px !important}
  .opr-pt-sala.es-abierta .opr-pt-escena{padding:10px !important}
}

/* En papel no hay ventana que llenar: la sala vuelve a ser un bloque. */
@media print{
  .opr-pt-sala.es-abierta{position:static !important; padding:0 !important; background:none !important}
  .opr-pt-sala.es-abierta .opr-pt-panel{height:auto !important}
  .opr-pt-sala.es-abierta .opr-pt-cuerpo{overflow:visible !important}
  .opr-pt-sala.es-abierta .opr-pt-escena{overflow:visible !important; min-height:0 !important}
}


/* =====================================================================
   EL SIMULACRO
   ---------------------------------------------------------------------
   Reaprovecha casi todo del ejercicio suelto —cabecera, cuerpo, opciones,
   pie— y añade cuatro cosas: la pantalla del tiempo, el relevo entre bloques,
   la cuenta atrás y el desglose por bloque del resultado.
   ===================================================================== */

/* --- la línea del tiempo por ejercicio, que es lo que se pidió: al elegir el
       total, ver de un vistazo cuánto sale por ejercicio --- */
.opr-pt-sala .opr-pt-ex-linea{
  margin-top:14px !important; padding:12px 14px !important; border-radius:var(--radio-s) !important;
  background:var(--p50) !important; box-shadow:inset 0 0 0 1px var(--borde) !important;
  font-size:.9375rem !important; line-height:1.5 !important; color:var(--suave) !important;
}
.opr-pt-sala .opr-pt-ex-linea b{color:var(--tinta) !important; font-weight:800 !important}

/* --- el historial de simulacros, en la pantalla del tiempo --- */
.opr-pt-sala .opr-pt-ex-hist{
  margin-top:14px !important; padding:12px 14px !important; border-radius:var(--radio-s) !important;
  background:var(--superficie) !important; box-shadow:inset 0 0 0 1px var(--borde) !important;
}
.opr-pt-sala .opr-pt-ex-hist-cab{
  display:flex !important; align-items:baseline !important; justify-content:space-between !important; gap:12px !important;
  padding-bottom:8px !important; border-bottom:1px solid var(--borde) !important;
  font-size:.8125rem !important; color:var(--tenue) !important;
}
.opr-pt-sala .opr-pt-ex-hist-cab b{font-size:.875rem !important; font-weight:800 !important; color:var(--tinta) !important}
.opr-pt-sala .opr-pt-ex-hist ul{display:flex !important; flex-direction:column !important}
.opr-pt-sala .opr-pt-ex-hist li{
  display:flex !important; align-items:baseline !important; gap:10px !important; padding:7px 0 !important;
  font-size:.84375rem !important; color:var(--suave) !important;
}
.opr-pt-sala .opr-pt-ex-hist li + li{border-top:1px solid var(--p100) !important}
.opr-pt-sala .opr-pt-ex-hist li > span:first-child{flex:none !important; min-width:8.5em !important}
.opr-pt-sala .opr-pt-ex-hist li > span:nth-child(2){flex:1 !important; color:var(--tenue) !important; font-size:.8125rem !important}
.opr-pt-sala .opr-pt-ex-hist li b{flex:none !important; font-weight:800 !important; color:var(--tinta) !important}
.opr-pt-sala .opr-pt-ex-borrar{
  flex:none !important; width:24px !important; height:24px !important; border-radius:7px !important; color:var(--p400) !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  transition:background .15s ease, color .15s ease, width .15s ease !important;
}
.opr-pt-sala .opr-pt-ex-borrar svg{width:13px !important; height:13px !important}
.opr-pt-sala .opr-pt-ex-borrar:hover{background:var(--p100) !important; color:var(--tinta) !important}
.opr-pt-sala .opr-pt-ex-borrar.es-seguro{
  width:auto !important; padding:0 10px !important; background:var(--no100) !important; color:var(--no900) !important;
  font-size:.75rem !important; font-weight:700 !important;
}
.opr-pt-sala .opr-pt-ex-borrar:disabled{opacity:.5 !important}

/* --- la comparación con el simulacro anterior, en el resultado --- */
.opr-pt-sala .opr-pt-ex-compara{
  padding:11px 14px !important; border-radius:var(--radio-s) !important; text-align:left !important;
  background:var(--p50) !important; box-shadow:inset 0 0 0 1px var(--borde) !important;
  font-size:.875rem !important; line-height:1.5 !important; color:var(--suave) !important;
}
.opr-pt-sala .opr-pt-ex-compara b{font-weight:800 !important; color:var(--tinta) !important}

.opr-pt-sala .opr-pt-ex-reglas{
  margin-top:14px !important; display:flex !important; flex-direction:column !important; gap:7px !important;
  font-size:.875rem !important; line-height:1.5 !important; color:var(--suave) !important;
}
/* El punto va con ::before ABSOLUTO, no como hermano dentro de un flex. Con
   `display:flex` en el <li>, cada trozo de texto y cada <b> pasan a ser
   elementos del flex y el `gap` mete un hueco entre ellos: la frase sale con
   espacios raros alrededor de las negritas. */
.opr-pt-sala .opr-pt-ex-reglas li{position:relative !important; padding-left:15px !important}
.opr-pt-sala .opr-pt-ex-reglas li::before{
  content:'' !important; position:absolute !important; left:0 !important; top:.55em !important; width:5px !important; height:5px !important;
  border-radius:999px !important; background:var(--p400) !important;
}

/* Cuatro tiempos no caben en una fila estrecha: el segmentado se parte. */
@media (max-width:560px){
  .opr-pt-sala #opr-pt-tiempo{width:100% !important}
  .opr-pt-sala #opr-pt-tiempo button{flex:1 1 0 !important; padding-left:0 !important; padding-right:0 !important}
}

/* --- el relevo entre bloques --- */
.opr-pt-sala .opr-pt-relevo{
  flex:1 !important; display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:center !important;
  gap:10px !important; text-align:center !important; padding:clamp(26px,3.4vw,40px) !important;
}
.opr-pt-sala .opr-pt-relevo .opr-pt-aj-sub{max-width:44ch !important}
.opr-pt-sala .opr-pt-relevo-marca{
  display:flex !important; gap:7px !important; margin:6px 0 4px !important;
}
.opr-pt-sala .opr-pt-relevo-marca span{
  width:34px !important; height:6px !important; border-radius:999px !important; background:var(--p200) !important;
}
.opr-pt-sala .opr-pt-relevo-marca span.es-hecho{background:var(--p600) !important}
.opr-pt-sala .opr-pt-relevo-marca span.es-ahora{background:var(--p950) !important}
.opr-pt-sala .opr-pt-relevo .opr-pt-ex-linea{margin-top:4px !important}
/* `flex:none` porque .opr-pt-aj-ir lleva `flex:1 1 auto` para repartirse la
   fila de botones de los ajustes. Aquí el contenedor es una columna, así que
   ese mismo `flex` estiraba el botón a lo alto: una cápsula de medio panel. */
.opr-pt-sala .opr-pt-relevo .opr-btn{margin-top:12px !important; flex:none !important; min-width:220px !important; justify-content:center !important}

/* --- la cuenta atrás. El reloj es el mismo trozo de la cabecera; lo que
       cambia es el color cuando queda poco. No es adorno: en el examen el
       tiempo se acaba sin avisar y aquí sí avisa. --- */
.opr-pt-sala .opr-pt-reloj.es-poco{background:var(--av100) !important; color:var(--av900) !important}
.opr-pt-sala .opr-pt-reloj.es-nada{background:var(--no100) !important; color:var(--no900) !important}

.opr-pt-sala .opr-pt-anterior{padding:10px 14px !important; font-size:.875rem !important; display:inline-flex !important; align-items:center !important; gap:6px !important}
.opr-pt-sala .opr-pt-anterior svg{width:15px !important; height:15px !important}
.opr-pt-sala .opr-pt-anterior:disabled{opacity:.4 !important}

/* Con dieciséis por bloque los puntos son además el índice: se pulsan para ir
   a uno concreto, que es lo que se hace en un examen de papel. */
.opr-pt-sala .opr-pt-puntos.es-ir .opr-pt-punto{cursor:pointer !important; width:10px !important; height:10px !important}
.opr-pt-sala .opr-pt-puntos.es-ir .opr-pt-punto.es-activo{width:24px !important}

/* --- el resultado del simulacro --- */
.opr-pt-sala .opr-pt-ex-final{width:100% !important; display:flex !important; flex-direction:column !important; gap:14px !important}
.opr-pt-sala .opr-pt-ex-120{
  display:flex !important; align-items:center !important; gap:16px !important; text-align:left !important;
  padding:14px 16px !important; border-radius:var(--radio-s) !important;
  background:var(--p950) !important; color:#fff !important;
}
.opr-pt-sala .opr-pt-ex-120 > div{flex:none !important; display:flex !important; flex-direction:column !important; gap:2px !important; align-items:center !important}
/* El `>` no sobra: sin él, la negrita de la frase de al lado también se pondría
   a 2rem y la explicación se leería como el titular. */
.opr-pt-sala .opr-pt-ex-120 > div > b{font-size:2rem !important; font-weight:800 !important; line-height:1 !important; letter-spacing:-.035em !important}
.opr-pt-sala .opr-pt-ex-120 > div > span{font-size:.6875rem !important; color:var(--p400) !important; text-align:center !important; max-width:11ch !important; line-height:1.3 !important}
.opr-pt-sala .opr-pt-ex-120 p{font-size:.8125rem !important; line-height:1.5 !important; color:var(--p300) !important; text-wrap:pretty !important}
.opr-pt-sala .opr-pt-ex-120 p b{font-size:inherit !important; font-weight:700 !important; color:#fff !important}

.opr-pt-sala .opr-pt-ex-tabla{width:100% !important; border-collapse:collapse !important; font-size:.875rem !important}
.opr-pt-sala .opr-pt-ex-tabla th,
.opr-pt-sala .opr-pt-ex-tabla td{padding:9px 8px !important; text-align:right !important; border-bottom:1px solid var(--borde) !important}
.opr-pt-sala .opr-pt-ex-tabla th:first-child,
.opr-pt-sala .opr-pt-ex-tabla td:first-child{text-align:left !important}
.opr-pt-sala .opr-pt-ex-tabla thead th{font-size:.71875rem !important; font-weight:700 !important; color:var(--tenue) !important}
.opr-pt-sala .opr-pt-ex-tabla tbody td{font-weight:600 !important; color:var(--suave) !important}
.opr-pt-sala .opr-pt-ex-tabla tbody td:first-child{font-weight:700 !important; color:var(--tinta) !important}
.opr-pt-sala .opr-pt-ex-tabla tbody td:last-child{font-weight:800 !important; color:var(--tinta) !important}
.opr-pt-sala .opr-pt-ex-tabla tfoot td{font-weight:800 !important; color:var(--tinta) !important}

@media (max-width:560px){
  .opr-pt-sala .opr-pt-ex-120{flex-direction:column !important; align-items:flex-start !important; text-align:left !important}
  .opr-pt-sala .opr-pt-ex-120 > div{flex-direction:row !important; align-items:baseline !important; gap:8px !important}
  .opr-pt-sala .opr-pt-ex-120 > div > span{max-width:none !important}
  .opr-pt-sala .opr-pt-ex-tabla{font-size:.8125rem !important}
  .opr-pt-sala .opr-pt-ex-tabla th,
  .opr-pt-sala .opr-pt-ex-tabla td{padding:8px 4px !important}
}

/* El relevo y la pantalla del tiempo, en pantalla completa, se deslizan solos
   igual que los ajustes y el resultado. */
.opr-pt-sala.es-abierta .opr-pt-relevo{flex:1 !important; min-height:0 !important; overflow-y:auto !important}

/* ---------- el atributo hidden ----------
   Es la trampa nº 4 del manual técnico, y aquí muerde dos veces.

   · La sección ES `.opr`, y `.opr{display:block !important}` del núcleo —blindado, o sea
     con !important— gana al display:none que el navegador le da a [hidden].
     `.opr-pt-sala[hidden]` mide (0,2,0) y lo arregla.

   · Dentro, `.opr [hidden]` del núcleo mide (0,2,0), lo mismo que
     `.opr-pt-sala .opr-pt-ajuste{display:flex !important}`, y el desempate lo decide el
     ORDEN de las hojas. Con `.opr-pt-sala .opr-pt-panel [hidden]`, que mide
     (0,3,0), gana siempre y da igual cómo las sirva LiteSpeed.

   OJO: un selector de atributo pesa lo mismo que una clase, no más. Poner
   `.opr-pt-sala [hidden]` no basta: empata y pierde por ir antes en la hoja.
   Este bloque va al final del fichero a propósito.                          */
.opr-pt-sala[hidden],
.opr-pt-sala.es-abierta[hidden],
.opr-pt-sala .opr-pt-panel [hidden]{display:none !important}