/* ESTUDIO v4 — pantallas de estudio con el lenguaje de la portada:
   azul noche, foto en la cabecera, serif con cursiva. Las tarjetas de lectura siguen claras. */
body[class*="sec-"]:not(.sec-panel):not(.sec-bienvenida){background:#0a1b30}
body.sec-civismo{--foto-h:url("../images/fotos/civismo.webp")}
body.sec-comandos{--foto-h:url("../images/fotos/comandos.webp")}
body.sec-n400{--foto-h:url("../images/fotos/n400.webp")}
body.sec-lectura{--foto-h:url("../images/fotos/lectura.webp")}
body.sec-examen{--foto-h:url("../images/fotos/examen.webp")}
body.sec-oath{--foto-h:url("../images/fotos/oath.webp")}
body.sec-progreso{--foto-h:url("../images/fotos/progreso.webp")}

/* Cabecera con foto */
body[class*="sec-"]:not(.sec-panel):not(.sec-bienvenida) .cabecera{position:relative;min-height:300px;display:flex;flex-direction:column;justify-content:flex-end;
  padding:90px 24px 30px;background:#0a1b30;overflow:hidden;border:0;text-align:left}
body[class*="sec-"]:not(.sec-panel):not(.sec-bienvenida) .cabecera::before{content:"";display:block !important;position:absolute;inset:0;
  background:linear-gradient(0deg,#0a1b30 0%,rgba(10,27,48,.35) 50%,rgba(10,27,48,.7) 100%),var(--foto-h,url("../images/portada/capitolio-escaleras.webp")) center 28%/cover no-repeat;
  mix-blend-mode:normal;z-index:0;left:0;right:0;top:0;bottom:0;width:100%;height:100%}
body[class*="sec-"]:not(.sec-panel):not(.sec-bienvenida) .cabecera>*{position:relative;z-index:1}
body[class*="sec-"]:not(.sec-panel):not(.sec-bienvenida) .cabecera h1{max-width:1120px;width:100%;margin:0 auto 8px;padding:0;font-family:"Fraunces",Georgia,serif;font-weight:400;
  font-size:clamp(1.9rem,4.4vw,3rem);line-height:1.07;color:#fff;letter-spacing:-.012em;text-align:left}
body[class*="sec-"]:not(.sec-panel):not(.sec-bienvenida) .cabecera p{max-width:1120px;width:100%;margin:0 auto;color:#d3dbe8;font-size:1rem;text-align:left}
body[class*="sec-"]:not(.sec-panel):not(.sec-bienvenida) .cabecera .btn-inicio{position:absolute;top:16px;left:16px;z-index:2;
  background:rgba(10,27,48,.55) !important;border:1px solid rgba(255,255,255,.5) !important;color:#fff !important;border-radius:3px !important}
#btn-salir{background:rgba(10,27,48,.55) !important;color:#fff !important}

/* Texto que queda fuera de las tarjetas */
body[class*="sec-"]:not(.sec-panel):not(.sec-bienvenida) .volver{color:#fff}
body[class*="sec-"]:not(.sec-panel):not(.sec-bienvenida) .seleccion-titulo{font-family:"Fraunces",serif;font-weight:400;color:#fff;font-size:clamp(1.6rem,3vw,2.2rem)}
body[class*="sec-"]:not(.sec-panel):not(.sec-bienvenida) .nota-nivel,
body[class*="sec-"]:not(.sec-panel):not(.sec-bienvenida) .aviso-linea{color:#9fb0c8}

/* Menú de niveles: tarjetas con foto arriba y bloque sólido debajo (igual que el panel) */
body.sec-civismo .niveles{list-style:none;margin:18px 0 8px;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
body.sec-civismo .niveles li{margin:0;display:block}
body.sec-civismo .nivel-btn{position:relative;display:flex !important;flex-direction:column;align-items:stretch;width:100%;padding:0 !important;border:1px solid rgba(255,255,255,.1) !important;
  border-radius:4px !important;overflow:hidden;background:#102845 !important;box-shadow:none !important;text-align:left;cursor:pointer;transition:transform .25s ease}
body.sec-civismo .nivel-btn::before{content:"";display:block;height:170px;background:#07131f center 35%/cover no-repeat;transition:transform .7s ease}
body.sec-civismo .nivel-btn:hover{transform:translateY(-3px)}
body.sec-civismo .nivel-btn.n-basico::before{background-image:url("../images/fotos/civismo.webp")}
body.sec-civismo .nivel-btn.n-intermedio::before{background-image:url("../images/fotos/lectura.webp")}
body.sec-civismo .nivel-btn.n-avanzado::before{background-image:url("../images/fotos/examen.webp")}
body.sec-civismo .nivel-btn.n-todas::before{background-image:url("../images/fotos/oath.webp")}
body.sec-civismo .nivel-btn .nivel-nombre,body.sec-civismo .nivel-btn .nivel-conteo{display:block;padding-left:20px;padding-right:20px}
body.sec-civismo .nivel-btn .nivel-nombre{padding-top:16px;font-family:"Fraunces",serif;font-weight:400;font-size:1.45rem;color:#fff !important}
body.sec-civismo .nivel-btn .nivel-conteo{padding-top:4px;padding-bottom:18px;background:none !important;border:0 !important;border-radius:0 !important;font-size:.88rem;font-weight:500;color:#c9d3e3 !important;width:auto}
@media(max-width:700px){body.sec-civismo .niveles{grid-template-columns:1fr}body.sec-civismo .nivel-btn::before{height:150px}}

/* Contraste de lo que queda sobre el fondo azul noche */
body.sec-oath .btn-bocina,body.sec-oath .velocidad button:not(.activa){color:#fff !important;background:rgba(255,255,255,.1) !important;border:1px solid rgba(255,255,255,.35) !important}
body.sec-oath .velocidad{background:transparent !important;border-color:rgba(255,255,255,.3) !important}
body.sec-oath .oath-intro{background:rgba(255,255,255,.08) !important;color:#d3dbe8 !important}
body.sec-oath .repaso-nota,body.sec-oath .repaso-wrap p{color:#b9c4d6 !important}
body.sec-oath .aviso-fino,body.sec-oath .aclaracion{color:#5c4a1a}
body.sec-n400 .p9-abogado,body.sec-n400 .contenedor>p,body.sec-n400 main>p,body.sec-n400 .intro,body.sec-n400 .aviso{color:#c9d3e3}
body[class*="sec-"]:not(.sec-panel) .contador,body[class*="sec-"]:not(.sec-panel) .etiqueta-seccion,
body.sec-lectura .titulo-menu,body.sec-lectura h2{color:#c9d3e3}
body.sec-oath .oath-intro ~ p,body.sec-oath .contenedor>p{color:#c9d3e3}

/* Niveles con iconos (sin fotos) */
body.sec-civismo .nivel-btn{display:grid !important;grid-template-columns:92px 1fr;grid-template-rows:1fr auto auto 1fr;align-items:center;min-height:108px}
body.sec-civismo .nivel-btn::before{grid-column:1;grid-row:1/5;height:auto;align-self:stretch;background-color:#173a63;background-size:46px 46px;background-position:center;background-repeat:no-repeat;transition:background-color .25s}
body.sec-civismo .nivel-btn:hover::before{background-color:#7c1c2c}
body.sec-civismo .nivel-btn .nivel-nombre{grid-column:2;grid-row:2;padding:0 20px !important}
body.sec-civismo .nivel-btn .nivel-conteo{grid-column:2;grid-row:3;padding:2px 20px 0 !important}
body.sec-civismo .nivel-btn.n-basico::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-width%3D%222.4%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%2210%22%20y%3D%2230%22%20width%3D%228%22%20height%3D%228%22%20rx%3D%222%22%20fill%3D%22%23fff%22%2F%3E%3Crect%20x%3D%2221%22%20y%3D%2222%22%20width%3D%228%22%20height%3D%2216%22%20rx%3D%222%22%20stroke-opacity%3D%22.4%22%2F%3E%3Crect%20x%3D%2232%22%20y%3D%2214%22%20width%3D%228%22%20height%3D%2224%22%20rx%3D%222%22%20stroke-opacity%3D%22.4%22%2F%3E%3C%2Fsvg%3E")}
body.sec-civismo .nivel-btn.n-intermedio::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-width%3D%222.4%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%2210%22%20y%3D%2230%22%20width%3D%228%22%20height%3D%228%22%20rx%3D%222%22%20fill%3D%22%23fff%22%2F%3E%3Crect%20x%3D%2221%22%20y%3D%2222%22%20width%3D%228%22%20height%3D%2216%22%20rx%3D%222%22%20fill%3D%22%23fff%22%2F%3E%3Crect%20x%3D%2232%22%20y%3D%2214%22%20width%3D%228%22%20height%3D%2224%22%20rx%3D%222%22%20stroke-opacity%3D%22.4%22%2F%3E%3C%2Fsvg%3E")}
body.sec-civismo .nivel-btn.n-avanzado::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-width%3D%222.4%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%2210%22%20y%3D%2230%22%20width%3D%228%22%20height%3D%228%22%20rx%3D%222%22%20fill%3D%22%23fff%22%2F%3E%3Crect%20x%3D%2221%22%20y%3D%2222%22%20width%3D%228%22%20height%3D%2216%22%20rx%3D%222%22%20fill%3D%22%23fff%22%2F%3E%3Crect%20x%3D%2232%22%20y%3D%2214%22%20width%3D%228%22%20height%3D%2224%22%20rx%3D%222%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E")}
body.sec-civismo .nivel-btn.n-todas::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-width%3D%222.4%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%229%22%20y%3D%229%22%20width%3D%2212%22%20height%3D%2212%22%20rx%3D%222%22%2F%3E%3Crect%20x%3D%2227%22%20y%3D%229%22%20width%3D%2212%22%20height%3D%2212%22%20rx%3D%222%22%2F%3E%3Crect%20x%3D%229%22%20y%3D%2227%22%20width%3D%2212%22%20height%3D%2212%22%20rx%3D%222%22%2F%3E%3Crect%20x%3D%2227%22%20y%3D%2227%22%20width%3D%2212%22%20height%3D%2212%22%20rx%3D%222%22%2F%3E%3C%2Fsvg%3E")}
@media(max-width:700px){body.sec-civismo .nivel-btn{grid-template-columns:76px 1fr;min-height:92px}}

/* TARJETAS BLANCAS (en lugar de beige): se cambian los tokens y las etiquetas fijas */
body[class*="sec-"]:not(.sec-panel):not(.sec-bienvenida){--tarjeta:#ffffff;--papel-2:#eaf0f8;--acento-suave:#eaf0f8;--linea:#dde3ec}
body[class*="sec-"] .cabecera-tarjeta .pastilla.categoria,body[class*="sec-"] .pastilla.categoria{background:#eaf0f8 !important;color:#2c4263 !important;border:1px solid #d5deea !important}

/* ═══ TARJETA DE PREGUNTA — versión moderna ═══
   Esquinas grandes, sombra profunda, pregunta en sans gruesa, opciones como botones redondeados con letra en círculo. */
body[class*="sec-"]:not(.sec-panel) .cara{border:0 !important;border-radius:24px !important;box-shadow:0 34px 70px -28px rgba(0,0,0,.65) !important;background:#fff}
body[class*="sec-"]:not(.sec-panel) .cara-cuerpo{padding:30px 32px 26px}
body[class*="sec-"]:not(.sec-panel) .cabecera-tarjeta{gap:8px}
body[class*="sec-"]:not(.sec-panel) .pastilla{font:600 .7rem/1 "IBM Plex Mono",monospace !important;letter-spacing:.12em;text-transform:uppercase;padding:7px 11px !important;border-radius:999px !important}
body[class*="sec-"] .pastilla.dificultad{background:#fdecef !important;color:#7c1c2c !important;border:0 !important}
body[class*="sec-"] .pastilla.categoria{border:0 !important}
body .num-pregunta{font:600 .72rem "IBM Plex Mono",monospace;letter-spacing:.14em;text-transform:uppercase;color:#6b7a92;margin-top:18px}
body .pregunta-en,body .p9-en,body .oracion-grande{font-family:"Instrument Sans","Public Sans",system-ui,sans-serif !important;font-weight:700 !important;font-size:clamp(1.45rem,3.2vw,2.05rem) !important;line-height:1.18 !important;letter-spacing:-.02em;color:#0d1b2e}
body .tema-img{width:84px !important;height:84px !important;border-radius:50% !important;border:0 !important;box-shadow:none !important;background:#eaf0f8 !important;mix-blend-mode:multiply;object-fit:cover;padding:0}
body .btn-espanol{border:0 !important;background:#eaf0f8 !important;color:#1d3f63 !important;border-radius:999px !important;padding:8px 16px !important;font-weight:600;font-size:.85rem;text-decoration:none !important;margin-top:14px}
body .btn-espanol:hover{background:#dbe6f4 !important}
body .opciones{gap:12px !important;margin-top:26px !important}
body .opcion{border:2px solid #e3e9f2 !important;background:#fff !important;border-radius:16px !important;min-height:62px;box-shadow:none;transition:border-color .2s,background .2s,transform .2s,box-shadow .2s}
body .opcion::before{width:36px !important;height:36px !important;min-width:36px;border-radius:50% !important;margin-left:14px;background:#eaf0f8 !important;color:#14253d !important;font-weight:700;border:0 !important;display:grid;place-items:center}
body .opcion:hover{border-color:#1d3f63 !important;background:#f6f9fd !important;transform:translateY(-2px);box-shadow:0 12px 24px -14px rgba(20,37,61,.5)}
body .opcion:hover::before{background:#14253d !important;color:#fff !important}
body .opcion .elegir{font-weight:600;font-size:1.02rem;padding-left:14px}
body .opcion .audio-resp{border-radius:50%;width:34px;height:34px;margin-right:10px;background:#f1f4f9;opacity:1;color:#52627c}
body .fila-audio{border-top:0 !important;padding-top:6px}
body .btn-bocina{border-radius:999px !important;border:0 !important;background:#eaf0f8 !important;color:#14253d !important}
body .velocidad{border-radius:999px !important;border:0 !important;background:#f1f4f9 !important;overflow:hidden}
body .velocidad button.activa{background:#14253d !important;color:#fff !important}
/* navegación */
body #prev,body #next,body .nav-botones button{border-radius:999px !important;min-height:54px;font-weight:700;letter-spacing:.01em}
body #prev{background:transparent !important;border:1.5px solid rgba(255,255,255,.4) !important;color:#fff !important;box-shadow:none !important}
body #prev:disabled{opacity:.35}
body #next{background:#7c1c2c !important;box-shadow:0 14px 30px -12px rgba(124,28,44,.9) !important}
/* progreso */
body .contador{color:#b9c4d6}
body .barra-prog,body .contador+*{border-radius:999px}
@media(max-width:600px){body[class*="sec-"] .cara-cuerpo{padding:22px 18px 20px}body .tema-img{width:64px !important;height:64px !important}}
body .opcion{align-items:center !important;min-height:64px !important;padding:8px 0}
body .opcion::before{align-self:center;flex:0 0 36px !important}
body .opcion .elegir{align-self:stretch;display:flex;align-items:center;text-align:left;flex:1}
/* Miniatura sin crema: el grabado pasa a grises y se funde con un azul frío */
body .tema-img{filter:grayscale(1) contrast(1.08) brightness(1.04);background:#dbe6f4 !important;mix-blend-mode:multiply}
/* Fondo de tarjeta en blanco frío (sin matiz cálido, también con True Tone / Night Shift) */
body[class*="sec-"]:not(.sec-panel):not(.sec-bienvenida){--tarjeta:#f6f9fd}
body[class*="sec-"]:not(.sec-panel) .cara,body[class*="sec-"]:not(.sec-panel) .cara-frente,body[class*="sec-"]:not(.sec-panel) .cara-trasera{background:#f6f9fd !important}
body[class*="sec-"]:not(.sec-panel) .opcion{background:#fff !important}

/* Lectura y escritura: menú igual que los niveles (icono + nombre), en dos columnas */
body.sec-lectura #opciones-le{list-style:none;margin:18px 0 8px;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
body.sec-lectura #opciones-le li{margin:0;display:block}
body.sec-lectura #opciones-le .nivel-btn{position:relative;display:grid !important;grid-template-columns:92px 1fr;grid-template-rows:1fr auto auto 1fr;align-items:center;width:100%;min-height:108px;padding:0 !important;
  border:1px solid rgba(255,255,255,.1) !important;border-radius:4px !important;overflow:hidden;background:#102845 !important;box-shadow:none !important;text-align:left;cursor:pointer;transition:transform .25s ease}
body.sec-lectura #opciones-le .nivel-btn::before{content:"";grid-column:1;grid-row:1/5;align-self:stretch;background:#173a63 center/46px 46px no-repeat;transition:background-color .25s}
body.sec-lectura #opciones-le .nivel-btn:hover{transform:translateY(-3px)}
body.sec-lectura #opciones-le .nivel-btn:hover::before{background-color:#7c1c2c}
body.sec-lectura #opciones-le .nivel-btn[data-key="lectura"]::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-width%3D%222.4%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M24%2012c-4-3-10-4-15-3v26c5-1%2011%200%2015%203%204-3%2010-4%2015-3V9c-5-1-11%200-15%203z%22%2F%3E%3Cpath%20d%3D%22M24%2012v26%22%2F%3E%3C%2Fsvg%3E")}
body.sec-lectura #opciones-le .nivel-btn[data-key="escritura"]::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-width%3D%222.4%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M34%208l6%206-20%2020-8%202%202-8z%22%2F%3E%3Cpath%20d%3D%22M29%2013l6%206%22%2F%3E%3Cpath%20d%3D%22M10%2041h28%22%2F%3E%3C%2Fsvg%3E")}
body.sec-lectura #opciones-le .nivel-nombre{grid-column:2;grid-row:2;display:block;padding:0 20px;font-family:"Fraunces",serif;font-weight:400;font-size:1.45rem;color:#fff !important}
body.sec-lectura #opciones-le .nivel-conteo{grid-column:2;grid-row:3;display:block;padding:2px 20px 0;background:none !important;border:0 !important;border-radius:0 !important;font-size:.88rem;font-weight:500;color:#c9d3e3 !important}
body.sec-lectura .le-titulo{font-family:"Fraunces",serif;font-weight:400;font-size:clamp(1.6rem,3vw,2.2rem);letter-spacing:0;text-transform:none;text-align:left;color:#fff}
@media(max-width:700px){body.sec-lectura #opciones-le{grid-template-columns:1fr}body.sec-lectura #opciones-le .nivel-btn{grid-template-columns:76px 1fr;min-height:92px}}

/* ═══ JERARQUÍA TIPOGRÁFICA — lectura y escritura ═══
   1) etiqueta pequeña en mono · 2) la oración como protagonista (serif grande) · 3) controles · 4) datos y ayuda en pequeño y apagado */
body.sec-lectura .cara-cuerpo{padding:30px 34px 22px}
body.sec-lectura .oracion-grande{font-family:"Fraunces",Georgia,serif !important;font-weight:500 !important;font-optical-sizing:auto;
  font-size:clamp(2.3rem,6.2vw,4.1rem) !important;line-height:1.06 !important;letter-spacing:-.025em;color:#0d1b2e;margin:20px 0 28px;max-width:14em}
body.sec-lectura .tema-img{align-self:flex-start}
body.sec-lectura .fila-audio{margin-top:6px}
body.sec-lectura .repro-conteo,body.sec-lectura .sesion-conteo{display:inline-block;margin:18px 0 0;font:500 .7rem/1.2 "IBM Plex Mono",monospace !important;letter-spacing:.12em;text-transform:uppercase;color:#7a8aa3;text-align:left}
body.sec-lectura .sesion-conteo{float:right}
body.sec-lectura .cara-cuerpo::after{content:"";display:block;clear:both}
body.sec-lectura .panel-instrucciones{display:flex;gap:12px;align-items:flex-start;background:rgba(255,255,255,.07) !important;border:1px solid rgba(255,255,255,.16) !important;border-radius:16px !important;padding:16px 18px}
body.sec-lectura .panel-instrucciones p{margin:0;font-size:.9rem !important;line-height:1.6;color:#c9d3e3 !important}
body.sec-lectura .panel-instrucciones .info-ico{color:#9fb6d6}
body.sec-lectura .panel-instrucciones .ocultar{color:#fff !important;font-size:.78rem;font-weight:600;opacity:.8;background:none;border:0;text-decoration:underline}
@media(max-width:600px){body.sec-lectura .oracion-grande{font-size:clamp(2rem,9vw,2.6rem) !important}}
body.sec-lectura .cara,body.sec-lectura .cara-frente{border-radius:30px !important}

/* ═══ AJUSTES: marco redondeado, pregunta en una línea, aviso plegable, Escuchar visible, velocidad en menú ═══ */
body[class*="sec-"]:not(.sec-panel) .flashcard,body[class*="sec-"]:not(.sec-panel) .flashcard-inner{border-radius:30px !important}
body[class*="sec-"]:not(.sec-panel) .cara,body[class*="sec-"]:not(.sec-panel) .cara-frente,body[class*="sec-"]:not(.sec-panel) .cara-trasera{border-radius:30px !important}
body.sec-lectura .oracion-grande{font-size:clamp(1.5rem,3.4vw,2.35rem) !important;max-width:none;margin:18px 0 22px;letter-spacing:-.02em;line-height:1.15 !important}
/* Escuchar: botón principal bien visible */
body .btn-bocina{background:#14253d !important;color:#fff !important;padding:12px 22px !important;font-size:.95rem !important;font-weight:700;box-shadow:0 10px 22px -12px rgba(20,37,61,.9)}
body .btn-bocina svg{width:18px;height:18px;fill:currentColor}
body .btn-bocina:hover{background:#7c1c2c !important}
/* Velocidad: un solo botón "1x"; al tocarlo se despliegan las opciones */
body .velocidad{display:inline-flex;gap:4px;padding:3px;vertical-align:middle}
body .velocidad:not(.abierta) button:not(.activa){display:none}
body .velocidad:not(.abierta) button.activa{background:#eaf0f8 !important;color:#14253d !important;border-radius:999px !important;padding:9px 14px 9px 16px;cursor:pointer}
body .velocidad:not(.abierta) button.activa::after{content:" ▾";font-size:.7em;opacity:.7}
body .velocidad.abierta button{border-radius:999px !important;padding:9px 14px}
/* Aviso plegable de instrucciones */
body.sec-lectura .ver-instrucciones{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.28);color:#fff;border-radius:999px;padding:9px 16px 9px 12px;font:600 .85rem "Instrument Sans","Public Sans",sans-serif;cursor:pointer}
body.sec-lectura .ver-instrucciones:hover{background:rgba(255,255,255,.16)}
body.sec-lectura .ver-instrucciones .info-ico{display:inline-flex;width:18px;height:18px;color:#c9d3e3}
body.sec-lectura .ver-instrucciones .info-ico svg{width:18px;height:18px}
body.sec-lectura #panel-instrucciones{margin:14px 0 4px}
body.sec-lectura .ver-instrucciones{text-decoration:none !important}

/* Escritura: caja de texto y botón Comprobar */
body.sec-lectura .btn-principal-card{display:block;width:100%;background:#7c1c2c !important;color:#fff !important;border:0 !important;border-radius:999px !important;min-height:54px;font-weight:700;font-size:1rem;box-shadow:0 14px 28px -14px rgba(124,28,44,.9) !important;cursor:pointer}
body.sec-lectura .btn-principal-card:hover{background:#651524 !important}
body.sec-lectura .btn-principal-card:disabled{opacity:.45;cursor:default}
body.sec-lectura .respuesta-escritura{border:2px solid #dde5f0 !important;border-radius:18px !important;background:#fff !important;padding:16px 18px;font:500 1.05rem "Instrument Sans","Public Sans",sans-serif;color:#0d1b2e;min-height:120px}
body.sec-lectura .respuesta-escritura:focus{outline:0;border-color:#1d3f63 !important;box-shadow:0 0 0 4px rgba(29,63,99,.15)}
body .velocidad:not(.abierta) button.activa{background:#e3ebf6 !important}
/* Al mostrar el resultado la tarjeta ya trae su "Siguiente": se oculta el de abajo para no duplicarlo */
body.sec-lectura:has(#btn-siguiente) #next{display:none}
body.sec-lectura:has(#btn-siguiente) .nav{grid-template-columns:1fr}

/* ═══ SIN TIPOGRAFÍA DE MÁQUINA DE ESCRIBIR ═══
   Las etiquetas en mono + mayúsculas se leen como "documento antiguo". Pasan a sans, en minúsculas normales y semi-negrita. */
body[class*="sec-"]:not(.sec-panel) .pastilla,
body .num-pregunta,body .contador,body .repro-conteo,body .sesion-conteo,body .estado-memoria,
body .oficial-box .etq,body .bloque-correcta .etq,body .le-titulo,body .seleccion-titulo{
  font-family:"Instrument Sans","Public Sans",system-ui,sans-serif !important;text-transform:none !important;letter-spacing:.005em !important;font-weight:600 !important}
body .pastilla{font-size:.8rem !important;padding:6px 12px !important}
body .num-pregunta{font-size:.85rem;color:#6b7a92}
body .contador{font-size:.9rem;color:#c9d3e3}
body.sec-lectura .repro-conteo,body.sec-lectura .sesion-conteo{font-size:.82rem !important;color:#6b7a92}

/* ═══ PANTALLA DE RESULTADO ═══ */
body .resultado{display:flex;align-items:center;gap:14px;background:none !important;border:0 !important;padding:6px 0 4px !important;margin:6px 0 14px;
  font:700 clamp(1.7rem,4vw,2.3rem)/1.1 "Instrument Sans","Public Sans",sans-serif !important;letter-spacing:-.02em;text-transform:none}
body .resultado::before{content:"";flex:0 0 52px;height:52px;border-radius:50%;background:center/26px no-repeat}
body .resultado.mal{color:#b3263a !important}
body .resultado.mal::before{background-color:#b3263a;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E")}
body .resultado.ok{color:#17803f !important}
body .resultado.ok::before{background-color:#17803f;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E")}
body .resultado svg{display:none}
body .escribiste{margin:0 0 12px;font-size:.9rem;font-weight:600;color:#6b7a92}
body .escribiste strong{display:block;margin-top:6px;padding:14px 16px;border-radius:14px;background:#fdf0f2;color:#9b2335;font-size:1.15rem;font-weight:600;text-decoration:line-through;text-decoration-color:rgba(155,35,53,.5)}
body .oficial-box{border:0 !important;border-radius:16px !important;background:#e9f7ef !important;padding:16px 18px !important}
body .oficial-box .etq{font-size:.82rem !important;color:#17803f !important;margin-bottom:6px}
body .oficial-box .txt{font:700 clamp(1.3rem,3vw,1.7rem)/1.2 "Instrument Sans","Public Sans",sans-serif !important;color:#0d1b2e;letter-spacing:-.015em}
body .estado-memoria{display:inline-block;margin:16px 0 0;padding:7px 14px;border-radius:999px;background:#eaf0f8;color:#2c4263;font-size:.82rem !important}
body .btn-siguiente{display:block;width:100%;margin-top:18px;background:#7c1c2c !important;color:#fff !important;border:0 !important;border-radius:999px !important;min-height:54px;font-weight:700;font-size:1rem;box-shadow:0 14px 28px -14px rgba(124,28,44,.9) !important;cursor:pointer}
body .btn-siguiente:hover{background:#651524 !important}
body .resultado::before{-webkit-mask:none !important;mask:none !important;width:52px;height:52px;background-size:26px 26px;background-position:center;background-repeat:no-repeat}
/* Respuesta correcta: misma caja verde que la "oración oficial" (sin la barra lateral antigua) */
body .bloque-correcta{border:0 !important;border-radius:16px !important;background:#e9f7ef !important;padding:14px 18px !important;margin:0 0 16px !important}
body .bloque-correcta .etq{font-size:.82rem !important;color:#17803f !important}
body .bloque-correcta .txt{font:700 clamp(1.3rem,3vw,1.6rem)/1.2 "Instrument Sans","Public Sans",sans-serif !important;color:#0d1b2e;letter-spacing:-.015em}
body .elegiste{font-size:.9rem;font-weight:600;color:#6b7a92}

/* ═══ ÓRDENES DEL OFICIAL — misma estructura que civismo: orden a la izquierda, miniatura a la derecha, audio abajo ═══ */
body.sec-comandos .cara-frente .cara-cuerpo{display:grid;grid-template-columns:1fr auto;column-gap:18px;align-items:start;text-align:left}
body.sec-comandos .orden-icono{grid-column:2;grid-row:1;margin:0}
body.sec-comandos .orden-en{grid-column:1;grid-row:1;align-self:center;text-align:left !important;margin:0 !important;
  font:700 clamp(1.5rem,3.4vw,2.2rem)/1.15 "Instrument Sans","Public Sans",sans-serif !important;letter-spacing:-.02em;color:#0d1b2e}
body.sec-comandos .instruccion-opciones{grid-column:1/-1;grid-row:2;margin:20px 0 0 !important;text-align:left !important;font-size:.92rem;font-weight:600;color:#6b7a92}
body.sec-comandos .opciones{grid-column:1/-1;grid-row:3;margin-top:12px !important}
body.sec-comandos .fila-audio{grid-column:1/-1;grid-row:4;margin-top:18px}
body.sec-comandos .cara-frente .cara-cuerpo>*{min-width:0}
@media(max-width:600px){body.sec-comandos .orden-icono .tema-img{width:56px !important;height:56px !important}}
body.sec-comandos .fila-audio{justify-content:flex-start !important}
body.sec-comandos .cara-trasera .cara-cuerpo{display:block}
body.sec-comandos .cara-trasera .elegiste,body.sec-comandos .cara-trasera .orden-en,body.sec-comandos .cara-trasera p{text-align:left}

/* ═══ N-400 PARTE 9 — misma estructura que civismo ═══ */
body.sec-n400 .p9-card{position:relative;background:#f6f9fd !important;border:0 !important;border-radius:30px !important;box-shadow:0 34px 70px -28px rgba(0,0,0,.65) !important;padding:30px 32px 26px !important}
body.sec-n400 .p9-card .tema-img{float:right;margin:0 0 8px 16px}
body.sec-n400 .p9-label{margin-top:16px;font:600 .85rem "Instrument Sans","Public Sans",sans-serif !important;text-transform:none !important;letter-spacing:.005em !important;color:#6b7a92}
body.sec-n400 .p9-en{margin:6px 0 0 !important;text-align:left}
body.sec-n400 .fila-audio{clear:both;justify-content:flex-start !important;margin-top:20px}
body.sec-n400 .btn-ver-es{border:0 !important;background:#eaf0f8 !important;color:#1d3f63 !important;border-radius:999px !important;padding:9px 18px !important;font:600 .88rem "Instrument Sans","Public Sans",sans-serif;margin-top:14px;cursor:pointer}
body.sec-n400 .btn-ver-es:hover{background:#dbe6f4 !important}
body.sec-n400 .p9-es{margin:14px 0 0;padding:14px 16px;border-radius:14px;background:#fff;font-size:.98rem;line-height:1.55;color:#33435c}
body.sec-n400 .p9-pensar{margin:22px 0 0;padding:16px 18px;border-radius:16px;background:#fff;font-size:.95rem;line-height:1.9;color:#33435c}
body.sec-n400 .p9-pensar span{display:inline-block;font-size:.95rem !important;font-weight:800 !important;letter-spacing:.04em;color:#fff !important;background:#14253d;border-radius:999px;padding:2px 14px;line-height:1.6;margin:0 2px}
body.sec-n400 .p9-abogado{color:#c9d3e3 !important;font-size:.9rem;line-height:1.55}
/* Examen: etiqueta de la tarjeta de introducción en sans */
body.sec-examen .cara-cuerpo .etq,body.sec-examen [class*="etq"],body.sec-examen [class*="label"]{font-family:"Instrument Sans","Public Sans",sans-serif !important;text-transform:none !important;letter-spacing:.005em !important;font-weight:700 !important;font-size:.9rem !important;color:#6b7a92}

/* ═══ MODO EXAMEN ═══ */
body.sec-examen .examen-card{background:#f6f9fd !important;border:0 !important;border-radius:30px !important;box-shadow:0 34px 70px -28px rgba(0,0,0,.65) !important;padding:30px 32px 26px !important}
body.sec-examen .examen-pregunta{font:700 clamp(1.4rem,3.2vw,2rem)/1.2 "Instrument Sans","Public Sans",sans-serif !important;letter-spacing:-.02em;color:#0d1b2e;margin:0 0 6px}
body.sec-examen .examen-card .fila-audio{margin:18px 0 0;order:3}
body.sec-examen .examen-progreso{font:600 .95rem "Instrument Sans","Public Sans",sans-serif !important;text-transform:none !important;letter-spacing:.005em !important;color:#c9d3e3 !important}
body.sec-examen .examen-timer{font:700 1.15rem "Instrument Sans","Public Sans",sans-serif !important;font-variant-numeric:tabular-nums;background:#fff !important;color:#0d1b2e !important;border:0 !important;border-radius:999px !important;padding:8px 18px !important;box-shadow:0 10px 24px -12px rgba(0,0,0,.6)}
body.sec-examen .examen-barra{align-items:center}
body.sec-examen .intro-examen{background:#f6f9fd !important;border:0 !important;border-radius:30px !important;box-shadow:0 34px 70px -28px rgba(0,0,0,.65) !important;padding:32px 34px !important}
body.sec-examen .intro-titulo{font:700 clamp(1.7rem,4vw,2.4rem)/1.1 "Instrument Sans","Public Sans",sans-serif !important;text-transform:none !important;letter-spacing:-.025em !important;color:#0d1b2e !important;margin:0 0 16px}
body.sec-examen .intro-lista{list-style:none;padding:0;margin:0 0 16px;display:grid;gap:10px}
body.sec-examen .intro-lista li{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:14px;background:#fff;font-size:1rem;color:#33435c}
body.sec-examen .intro-lista li::before{content:"";flex:0 0 10px;height:10px;border-radius:50%;background:#7c1c2c}
body.sec-examen .intro-detalle{color:#33435c;line-height:1.6}
body.sec-examen .intro-nota{border:0 !important;border-radius:14px !important;background:#eaf0f8 !important;color:#2c4263 !important;font-style:normal !important;font-size:.88rem;padding:12px 16px !important}
body.sec-examen .intro-examen .principal,body.sec-examen .intro-examen button{border-radius:999px !important;min-height:54px}

/* ═══ N-400 PARTE 9 — simulación de la estructura del formulario ═══
   Barra de parte, número de pregunta en cuadro, texto en inglés y casillas Yes / No. Solo visual: nada se guarda. */
body.sec-n400 .p9-form{padding:0 !important;overflow:hidden}
body.sec-n400 .p9-form .tema-img,body.sec-n400 .p9-form .p9-label{display:none !important}
body.sec-n400 .p9-form-cab{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 28px;background:#14253d;color:#fff}
body.sec-n400 .p9-form-parte{font:700 1rem "Instrument Sans","Public Sans",sans-serif}
body.sec-n400 .p9-form-parte em{font-style:normal;font-weight:500;opacity:.8}
body.sec-n400 .p9-form-nota{font:500 .78rem "Instrument Sans","Public Sans",sans-serif;opacity:.7}
body.sec-n400 .p9-form>:not(.p9-form-cab){margin-left:28px;margin-right:28px}
body.sec-n400 .p9-form .cabecera-tarjeta{margin-top:22px}
body.sec-n400 .p9-form .p9-stem{margin-top:14px}
body.sec-n400 .p9-fila{display:grid;grid-template-columns:52px 1fr auto;gap:18px;align-items:start;margin-top:16px;padding:20px 0;border-top:1px solid #d3dbe7;border-bottom:1px solid #d3dbe7}
body.sec-n400 .p9-num{width:52px;height:52px;border:2px solid #14253d;border-radius:10px;display:grid;place-items:center;font:700 1.05rem "Instrument Sans","Public Sans",sans-serif;color:#14253d;background:#fff}
body.sec-n400 .p9-form .p9-en{float:none;margin:2px 0 0 !important;font-size:clamp(1.15rem,2.5vw,1.55rem) !important;line-height:1.25 !important}
body.sec-n400 .p9-form .btn-ver-es{margin-top:12px}
body.sec-n400 .p9-sino{display:flex;gap:10px}
body.sec-n400 .p9-casilla{display:flex;align-items:center;gap:10px;padding:10px 16px;border:2px solid #14253d;border-radius:10px;background:#fff;color:#14253d;font:700 .95rem "Instrument Sans","Public Sans",sans-serif;cursor:pointer;transition:background .15s,color .15s,transform .15s}
body.sec-n400 .p9-casilla:hover{transform:translateY(-1px);background:#eaf0f8}
body.sec-n400 .p9-casilla i{width:20px;height:20px;border:2px solid currentColor;border-radius:5px;display:block;background:center/14px no-repeat}
body.sec-n400 .p9-casilla[aria-pressed="true"]{background:#14253d;color:#fff}
body.sec-n400 .p9-casilla[aria-pressed="true"] i{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E")}
body.sec-n400 .p9-form .fila-audio{margin-top:18px;margin-bottom:0}
body.sec-n400 .p9-form .p9-pensar{margin-top:16px;margin-bottom:24px;background:none;padding:0;font-size:.85rem;color:#6b7a92}
body.sec-n400 .p9-form .p9-pensar b{color:#14253d}
@media(max-width:640px){
  body.sec-n400 .p9-fila{grid-template-columns:44px 1fr}
  body.sec-n400 .p9-num{width:44px;height:44px}
  body.sec-n400 .p9-sino{grid-column:1/-1}
  body.sec-n400 .p9-form>:not(.p9-form-cab){margin-left:18px;margin-right:18px}
  body.sec-n400 .p9-form-cab{padding:12px 18px}
}

/* Sin casillas de respuesta: la fila queda como número + pregunta (no se pide ningún dato personal) */
body.sec-n400 .p9-fila{grid-template-columns:52px 1fr}
body.sec-n400 .p9-sino,body.sec-n400 .p9-casilla{display:none !important}

/* ═══ N-400 PARTE 9 — la hoja, como el formulario: barra gris con el título, preguntas numeradas en serif, sin casillas ═══ */
body.sec-n400 .p9-form{background:#fff !important;border-radius:18px !important;border:1px solid #cdd5e1 !important;box-shadow:0 34px 70px -28px rgba(0,0,0,.65) !important;padding:26px 30px 0 !important;overflow:hidden}
body.sec-n400 .p9-form>:not(.p9-pie){margin-left:0 !important;margin-right:0 !important}
body.sec-n400 .p9-hoja-titulo{display:flex;flex-direction:column;gap:2px;background:#e6e9ee;border:1.5px solid #14253d;border-radius:6px;padding:11px 16px;margin:0 0 18px !important}
body.sec-n400 .p9-hoja-titulo strong{font:700 1.08rem/1.25 "Fraunces",Georgia,serif;color:#0d1b2e}
body.sec-n400 .p9-hoja-titulo span{font:500 .85rem "Instrument Sans","Public Sans",sans-serif;color:#4a5a73}
body.sec-n400 .p9-ever{margin:0 0 16px;font:italic 400 .98rem/1.55 "Fraunces",Georgia,serif;color:#33435c}
body.sec-n400 .p9-ever b{font-style:normal;font-weight:700;color:#0d1b2e}
body.sec-n400 .p9-form .cabecera-tarjeta{margin:0 0 6px}
body.sec-n400 .p9-form .p9-stem{margin:10px 0 0}
body.sec-n400 .p9-form .p9-stem-en{font:600 1.15rem/1.4 "Fraunces",Georgia,serif;color:#0d1b2e;margin:0}
body.sec-n400 .p9-form .p9-stem-es{font-size:.9rem;color:#5a6a82;margin:4px 0 0}
body.sec-n400 .p9-fila{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:baseline;margin:16px 0 0;padding:6px 0 18px;border:0}
body.sec-n400 .p9-num{width:auto;height:auto;border:0;border-radius:0;background:none;display:block;min-width:2.1em;font:700 1.3rem "Fraunces",Georgia,serif;color:#0d1b2e}
body.sec-n400 .p9-form .p9-en{font:400 clamp(1.3rem,2.8vw,1.75rem)/1.35 "Fraunces",Georgia,serif !important;letter-spacing:0 !important;color:#0d1b2e;margin:0 !important}
body.sec-n400 .p9-form .p9-en::first-letter{letter-spacing:0}
body.sec-n400 .p9-form .btn-ver-es{margin-top:14px}
body.sec-n400 .p9-form .fila-audio{margin:4px 0 0}
body.sec-n400 .p9-form .p9-pensar{margin:16px 0 20px;padding:0;background:none;font-size:.85rem;color:#6b7a92}
body.sec-n400 .p9-pie{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 -30px !important;padding:11px 30px;border-top:1px solid #cdd5e1;background:#f4f6f9;font:500 .78rem "Instrument Sans","Public Sans",sans-serif;color:#5a6a82}
body.sec-n400 .p9-form-cab,body.sec-n400 .p9-sino,body.sec-n400 .p9-casilla{display:none !important}
@media(max-width:640px){body.sec-n400 .p9-form{padding:20px 18px 0 !important}body.sec-n400 .p9-pie{margin:0 -18px !important;padding:10px 18px}body.sec-n400 .p9-fila{grid-template-columns:auto 1fr;gap:10px}}

/* "Cómo practicar": indicación visible, con pasos */
body.sec-n400 .p9-form .p9-pensar{margin:20px 0 22px;padding:16px 18px;background:#eaf0f8;border-radius:14px;font-size:1rem;color:#1f2f46}
body.sec-n400 .p9-pensar-t{margin:0 0 8px;font:700 1rem "Instrument Sans","Public Sans",sans-serif;color:#0d1b2e}
body.sec-n400 .p9-pasos{margin:0;padding-left:1.3em;display:grid;gap:6px;font-size:1rem;line-height:1.45}
body.sec-n400 .p9-pasos li::marker{font-weight:700;color:#7c1c2c}
body.sec-n400 .p9-pasos b{color:#0d1b2e}
body.sec-n400 .p9-pensar-p{margin:10px 0 0;font-size:.85rem;color:#5a6a82}

/* Nota de práctica: una línea, resaltada con asterisco y negritas (sin recuadro) */
body.sec-n400 .p9-form .p9-pensar{margin:18px 0 22px;padding:0;background:none;font-size:1rem;line-height:1.55;color:#1f2f46}
body.sec-n400 .p9-form .p9-pensar b{color:#0d1b2e;font-weight:700}
body.sec-n400 .p9-form .p9-pensar .p9-ast{color:#7c1c2c;font-size:1.15em}
body.sec-n400 .p9-form .p9-pensar em{color:#4a5a73}

/* ═══ ÓRDENES DEL OFICIAL — misma hoja que la Parte 9 del N-400 ═══ */
body.sec-comandos .cara-frente .cara-cuerpo,body.sec-comandos .cara-trasera .cara-cuerpo{display:block;padding:26px 30px 0}
body.sec-comandos .cara-cuerpo>.orden-icono,body.sec-comandos .cara-cuerpo .orden-icono{display:none !important}
body.sec-comandos .p9-hoja-titulo{display:flex;flex-direction:column;gap:2px;background:#e6e9ee;border:1.5px solid #14253d;border-radius:6px;padding:11px 16px;margin:0 0 18px}
body.sec-comandos .p9-hoja-titulo strong{font:700 1.08rem/1.25 "Fraunces",Georgia,serif;color:#0d1b2e}
body.sec-comandos .p9-hoja-titulo span{font:500 .85rem "Instrument Sans","Public Sans",sans-serif;color:#4a5a73}
body.sec-comandos .p9-fila{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:baseline;margin:6px 0 0;padding:6px 0 14px}
body.sec-comandos .p9-num{min-width:2.1em;font:700 1.3rem "Fraunces",Georgia,serif;color:#0d1b2e}
body.sec-comandos .cara-cuerpo .orden-en{grid-column:auto;grid-row:auto;margin:0 !important;text-align:left !important;font:400 clamp(1.5rem,3.2vw,2rem)/1.3 "Fraunces",Georgia,serif !important;letter-spacing:0 !important;color:#0d1b2e}
body.sec-comandos .instruccion-opciones{margin:6px 0 0 !important;font:600 .92rem "Instrument Sans","Public Sans",sans-serif;color:#5a6a82;text-align:left}
body.sec-comandos .cara-frente .opciones{margin-top:12px !important}
body.sec-comandos .cara-frente .fila-audio{margin:20px 0 22px;justify-content:flex-start}
body.sec-comandos .p9-pie{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 -30px;padding:11px 30px;border-top:1px solid #cdd5e1;background:#f4f6f9;font:500 .78rem "Instrument Sans","Public Sans",sans-serif;color:#5a6a82}
body.sec-comandos .cara-trasera .p9-pie{margin-top:18px}
body.sec-comandos .cara-frente,body.sec-comandos .cara-trasera{background:#fff !important}
@media(max-width:640px){body.sec-comandos .cara-frente .cara-cuerpo,body.sec-comandos .cara-trasera .cara-cuerpo{padding:20px 18px 0}body.sec-comandos .p9-pie{margin:0 -18px;padding:10px 18px}}

/* ═══ MODO EXAMEN — cuadernillo: cabecera de parte, navegador de preguntas, respuestas tipo hoja de opciones ═══ */
body.sec-examen .ex-nav{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 16px}
body.sec-examen .ex-n{min-width:34px;height:34px;padding:0 6px;display:grid;place-items:center;border-radius:8px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:#aebbd0;font:600 .85rem "Instrument Sans","Public Sans",sans-serif;transition:background .2s}
body.sec-examen .ex-n.hecha{background:#fff;color:#14253d;border-color:#fff}
body.sec-examen .ex-n.actual{background:#7c1c2c;color:#fff;border-color:#7c1c2c;box-shadow:0 8px 18px -8px rgba(124,28,44,.9)}
body.sec-examen .ex-n-txt{padding:0 12px;font-size:.8rem}
body.sec-examen .examen-card{padding:0 !important;overflow:hidden}
body.sec-examen .ex-hoja-cab{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;background:#14253d;color:#fff;padding:13px 28px}
body.sec-examen .ex-hoja-cab strong{font:700 .98rem "Instrument Sans","Public Sans",sans-serif}
body.sec-examen .ex-hoja-cab span{font:500 .8rem "Instrument Sans","Public Sans",sans-serif;opacity:.75}
body.sec-examen .examen-card>:not(.ex-hoja-cab){margin-left:30px;margin-right:30px}
body.sec-examen .ex-fila{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:baseline;margin-top:24px}
body.sec-examen .ex-num{min-width:2.1em;font:700 1.35rem "Fraunces",Georgia,serif;color:#0d1b2e}
body.sec-examen .examen-pregunta{font:400 clamp(1.4rem,3vw,1.9rem)/1.3 "Fraunces",Georgia,serif !important;letter-spacing:0 !important;color:#0d1b2e;margin:0}
body.sec-examen .examen-card .fila-audio{margin-top:18px}
body.sec-examen .examen-card .opciones{margin:22px 30px 28px !important}
body.sec-examen .examen-card .opcion{border-radius:12px !important;border:1.5px solid #cdd5e1 !important}
body.sec-examen .examen-card .opcion::before{background:#fff !important;border:2px solid #14253d !important;color:#14253d !important;width:34px !important;height:34px !important;min-width:34px}
body.sec-examen .examen-card .opcion:hover{background:#eaf0f8 !important;border-color:#14253d !important}
body.sec-examen .examen-card .opcion:hover::before{background:#14253d !important;color:#fff !important}
body.sec-examen .examen-card>*:last-child:not(.opciones){margin-bottom:26px}
body.sec-examen .examen-instr,body.sec-examen .examen-lectura-oracion{margin-top:22px}
body.sec-examen .intro-real{margin:6px 0 16px;padding:14px 16px;border-radius:14px;background:#fff;border:1px solid #cdd5e1}
body.sec-examen .intro-real strong{display:block;margin-bottom:4px;font:700 1rem "Instrument Sans","Public Sans",sans-serif;color:#0d1b2e}
body.sec-examen .intro-real p{margin:0;font-size:.95rem;line-height:1.55;color:#33435c}
@media(max-width:640px){body.sec-examen .ex-hoja-cab{padding:12px 18px}body.sec-examen .examen-card>:not(.ex-hoja-cab){margin-left:18px;margin-right:18px}body.sec-examen .examen-card .opciones{margin:18px 18px 22px !important}}
body.sec-examen .examen-card>:not(.ex-hoja-cab){box-sizing:border-box;max-width:calc(100% - 60px)}
body.sec-examen .examen-card>.btn-examen-principal,body.sec-examen .examen-card>button{width:calc(100% - 60px)}
body.sec-examen .examen-card>:last-child{margin-bottom:26px}
@media(max-width:640px){body.sec-examen .examen-card>:not(.ex-hoja-cab){max-width:calc(100% - 36px)}body.sec-examen .examen-card>.btn-examen-principal,body.sec-examen .examen-card>button{width:calc(100% - 36px)}}

/* Simplificación: tres pasos en lugar de 22 casillas */
body.sec-examen .ex-nav{display:flex;align-items:center;gap:10px;margin:2px 0 18px}
body.sec-examen .ex-paso{display:flex;align-items:center;gap:8px;color:#8fa0ba;font:600 .9rem "Instrument Sans","Public Sans",sans-serif}
body.sec-examen .ex-paso i{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:.8rem;border:1.5px solid rgba(255,255,255,.3)}
body.sec-examen .ex-paso.actual{color:#fff}
body.sec-examen .ex-paso.actual i{background:#7c1c2c;border-color:#7c1c2c;color:#fff}
body.sec-examen .ex-paso.hecha{color:#c9d3e3}
body.sec-examen .ex-paso.hecha i{background:#fff;border-color:#fff;color:#14253d}
body.sec-examen .ex-sep{flex:1;height:1.5px;background:rgba(255,255,255,.22);min-width:14px;max-width:80px}
body.sec-examen .ex-n{display:none}

/* ═══ CELULAR: menos aire lateral, listas en una columna, espacio para el dock ═══ */
body.sec-examen .intro-lista li{display:block !important;position:relative;padding:12px 14px 12px 34px}
body.sec-examen .intro-lista li::before{position:absolute;left:14px;top:1.15em}
@media(max-width:640px){
  body[class*="sec-"]:not(.sec-panel):not(.sec-bienvenida){padding-bottom:110px}
  body[class*="sec-"]:not(.sec-panel):not(.sec-bienvenida) .contenedor{padding-left:14px !important;padding-right:14px !important}
  body[class*="sec-"]:not(.sec-panel):not(.sec-bienvenida) .cabecera{min-height:250px;padding:84px 18px 22px}
  body[class*="sec-"]:not(.sec-panel):not(.sec-bienvenida) .cabecera h1{font-size:clamp(1.7rem,8vw,2.1rem)}
  body[class*="sec-"]:not(.sec-panel):not(.sec-bienvenida) .cabecera p{font-size:.95rem}
  body.sec-examen .intro-examen{padding:22px 16px !important}
  body.sec-examen .intro-titulo{font-size:1.6rem !important}
  body.sec-examen .intro-lista li{padding:10px 12px 10px 30px;font-size:.95rem}
  body.sec-examen .intro-lista li::before{left:12px}
  body.sec-examen .intro-real{padding:12px 14px}
  body.sec-examen .intro-real p{font-size:.9rem}
  body.sec-examen .intro-detalle{font-size:.95rem}
  body.sec-examen .ex-nav{gap:6px}
  body.sec-examen .ex-paso{font-size:.8rem;gap:5px}
  body.sec-examen .ex-paso i{width:22px;height:22px;font-size:.7rem}
  body.sec-examen .ex-sep{min-width:8px}
  body.sec-examen .examen-timer{font-size:1rem;padding:6px 14px}
  .p9-fila{grid-template-columns:auto 1fr}
}
body.sec-examen .intro-lista li::before{display:block;width:10px;height:10px}
/* Celular: el audio no se estira a todo el ancho; el número no roba espacio a la pregunta */
body .fila-audio{display:flex !important;flex-direction:row !important;flex-wrap:wrap;align-items:center;gap:10px}
body .fila-audio .btn-bocina,body .fila-audio .velocidad{width:auto !important;flex:0 0 auto !important;max-width:none}
@media(max-width:640px){
  body.sec-examen .ex-fila{gap:6px}
  body.sec-examen .ex-num{min-width:1.5em;font-size:1.2rem}
  body.sec-n400 .p9-num,body.sec-comandos .p9-num{min-width:1.6em}
  body.sec-n400 .p9-fila,body.sec-comandos .p9-fila{gap:6px}
}

/* ═══ EL JURAMENTO — hoja con la estructura del formulario ═══ */
body.sec-oath .oath-hoja{background:#f6f9fd;border-radius:30px;box-shadow:0 34px 70px -28px rgba(0,0,0,.65);padding:26px 30px 0;overflow:hidden}
body.sec-oath .p9-hoja-titulo{display:flex;flex-direction:column;gap:2px;background:#e6e9ee;border:1.5px solid #14253d;border-radius:6px;padding:11px 16px;margin:0 0 18px}
body.sec-oath .p9-hoja-titulo strong{font:700 1.08rem/1.25 "Fraunces",Georgia,serif;color:#0d1b2e}
body.sec-oath .p9-hoja-titulo span{font:500 .85rem "Instrument Sans","Public Sans",sans-serif;color:#4a5a73}
body.sec-oath .p9-pie{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:18px -30px 0;padding:11px 30px;border-top:1px solid #cdd5e1;background:#f4f6f9;font:500 .78rem "Instrument Sans","Public Sans",sans-serif;color:#5a6a82}
/* avisos: uno principal; el resto, texto suave */
body.sec-oath .oath-hoja .oath-disclaimer{background:#eaf0f8 !important;border:0 !important;border-left:4px solid #14253d !important;border-radius:0 12px 12px 0 !important;padding:14px 16px;color:#1f2f46}
body.sec-oath .oath-hoja .oath-disclaimer p{color:#1f2f46 !important;font-size:.98rem;line-height:1.55;margin:0}
body.sec-oath .oath-hoja .oath-felicidades{background:none !important;border:0 !important;padding:14px 0 0;color:#33435c}
body.sec-oath .oath-hoja .oath-felicidades p{margin:0;font-size:.98rem;color:#33435c !important}
body.sec-oath .oath-hoja .oath-fel-ico,body.sec-oath .oath-hoja .aviso-ico{display:none}
body.sec-oath .oath-hoja .oath-intro{background:none !important;border:0 !important;padding:6px 0 0;margin:8px 0 0;text-align:left;font:600 .92rem "Instrument Sans","Public Sans",sans-serif;color:#5a6a82 !important}
body.sec-oath .oath-hoja .oath-audio{display:flex;flex-wrap:wrap;align-items:center;gap:10px;justify-content:flex-start;margin:14px 0 0}
body.sec-oath .oath-hoja #trad-toggle{margin:14px 0 0}
body.sec-oath .oath-hoja .btn-ver-es{border:0 !important;background:#eaf0f8 !important;color:#1d3f63 !important;border-radius:999px !important;padding:9px 18px !important;font:600 .88rem "Instrument Sans","Public Sans",sans-serif;cursor:pointer}
/* cláusulas como renglones de formulario */
body.sec-oath .oath-hoja .clausulas{list-style:none;margin:18px 0 0;padding:0;border-top:1px solid #d3dbe7}
body.sec-oath .oath-hoja .clausula{display:grid;grid-template-columns:2.2em 1fr;gap:6px;align-items:baseline;background:none !important;border:0 !important;border-bottom:1px solid #d3dbe7 !important;border-radius:0 !important;box-shadow:none !important;padding:18px 0 !important}
body.sec-oath .oath-hoja .clausula-num{width:auto;height:auto;background:none !important;border:0 !important;border-radius:0;font:700 1.3rem "Fraunces",Georgia,serif;color:#0d1b2e}
body.sec-oath .oath-hoja .clausula-num::after{content:"."}
body.sec-oath .oath-hoja .clausula-en{font:400 clamp(1.2rem,2.7vw,1.6rem)/1.4 "Fraunces",Georgia,serif !important;color:#0d1b2e;margin:0}
body.sec-oath .oath-hoja .clausula-es{margin:10px 0 0;font:400 1rem/1.55 "Instrument Sans","Public Sans",sans-serif;color:#33435c;padding:12px 14px;background:#fff;border-radius:12px}
body.sec-oath .oath-hoja #modificaciones,body.sec-oath .oath-hoja #repaso{margin-top:18px}
body.sec-oath .oath-hoja .aclaracion{margin:20px 0 0;background:none !important;border:0 !important;padding:0;font-size:.85rem;color:#6b7a92 !important}
@media(max-width:640px){body.sec-oath .oath-hoja{padding:20px 18px 0}body.sec-oath .p9-pie{margin:18px -18px 0;padding:10px 18px}}
/* El Juramento: los controles viven ahora sobre la hoja clara */
body.sec-oath .oath-hoja .btn-bocina{background:#14253d !important;color:#fff !important;border:0 !important}
body.sec-oath .oath-hoja .velocidad{background:#eaf0f8 !important;border:0 !important}
body.sec-oath .oath-hoja .velocidad button:not(.activa){color:#14253d !important;background:transparent !important;border:0 !important}
body.sec-oath .oath-hoja .velocidad button.activa{background:#14253d !important;color:#fff !important}
body.sec-oath .oath-hoja #trad-toggle{text-align:left}
body.sec-oath .oath-hoja .oath-felicidades p{font-weight:400}

/* ═══ MI PROGRESO — tablero en tarjetas ═══ */
body.sec-progreso .contenedor{max-width:980px !important}
body.sec-progreso #app{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:stretch}
body.sec-progreso #app>.barra-superior,body.sec-progreso #app>.prog-nota-sesion{grid-column:1/-1}
body.sec-progreso #app>section:nth-child(3){order:1}                     /* civismo */
body.sec-progreso #app>section:nth-child(6){order:2}                     /* dictado */
body.sec-progreso #app>section:nth-child(4){order:3;grid-column:1/-1}    /* categorías */
body.sec-progreso #app>section:nth-child(7){order:4}                     /* fallas */
body.sec-progreso #app>section:nth-child(8){order:5}                     /* simulacros */
body.sec-progreso #app>section:nth-child(5){order:6;grid-column:1/-1}    /* racha */
body.sec-progreso .prog-card{background:#f6f9fd !important;border:0 !important;border-radius:28px !important;box-shadow:0 30px 60px -32px rgba(0,0,0,.6) !important;padding:24px 26px !important;margin:0 !important}
body.sec-progreso .prog-titulo{font:700 1.05rem "Instrument Sans","Public Sans",sans-serif !important;text-transform:none !important;letter-spacing:0 !important;color:#6b7a92 !important;margin:0 0 14px}
body.sec-progreso .prog-general{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
body.sec-progreso .prog-pct{font:700 clamp(3rem,7vw,4.2rem)/1 "Instrument Sans","Public Sans",sans-serif !important;letter-spacing:-.04em;color:#0d1b2e}
body.sec-progreso .prog-pct span{font-size:.4em;margin-left:2px}
body.sec-progreso .prog-general-txt{font-size:1rem;color:#33435c}
body.sec-progreso .prog-barra{height:12px !important;border-radius:999px !important;background:#dde5f0 !important;overflow:hidden;margin-top:14px}
body.sec-progreso .prog-barra span{display:block;height:100%;border-radius:999px;background:#14253d !important;min-width:6px}
body.sec-progreso .prog-cat{margin:0 0 16px}
body.sec-progreso .prog-cat-fila{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:2px}
body.sec-progreso .prog-cat-label{font:600 1rem "Instrument Sans","Public Sans",sans-serif !important;text-transform:none !important;letter-spacing:0 !important;color:#0d1b2e !important}
body.sec-progreso .prog-cat-num{font:700 .95rem "Instrument Sans","Public Sans",sans-serif !important;color:#33435c;background:#eaf0f8 !important;border-radius:999px;padding:3px 12px}
body.sec-progreso .prog-chip{border-radius:999px !important;font:600 .8rem "Instrument Sans","Public Sans",sans-serif !important;text-transform:none !important;letter-spacing:0 !important}
body.sec-progreso .prog-lista,body.sec-progreso .prog-hist{list-style:none;margin:0;padding:0}
body.sec-progreso .prog-lista li,body.sec-progreso .prog-hist li{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #dde5f0}
body.sec-progreso .prog-lista li:last-child,body.sec-progreso .prog-hist li:last-child{border-bottom:0}
body.sec-progreso .prog-lista-txt{font-size:.98rem;line-height:1.4;color:#0d1b2e}
body.sec-progreso .prog-hist-fecha{font:600 .88rem "Instrument Sans","Public Sans",sans-serif !important;text-transform:none !important;letter-spacing:0 !important;color:#6b7a92}
body.sec-progreso .prog-vacio{display:flex;align-items:center;gap:18px}
body.sec-progreso .prog-vacio-num{font:700 2.2rem "Instrument Sans",sans-serif;color:#9fb0c8}
body.sec-progreso .prog-vacio p{margin:0;color:#5a6a82}
body.sec-progreso .prog-nota-sesion{margin:0 0 4px !important;border-radius:14px !important}
@media(max-width:760px){body.sec-progreso #app{grid-template-columns:1fr}body.sec-progreso #app>section{grid-column:auto !important}body.sec-progreso .prog-card{padding:20px 18px !important}}
/* La frase de ánimo va arriba, a todo lo ancho, como texto sobre el fondo */
body.sec-progreso .prog-frase{order:0;grid-column:1/-1;margin:4px 0 6px !important;padding:0 !important;background:none !important;border:0 !important;box-shadow:none !important;font:600 clamp(1.1rem,2.4vw,1.4rem)/1.4 "Instrument Sans","Public Sans",sans-serif !important;color:#fff !important}

/* ═══ EXAMEN — paso de lectura y resumen final ═══ */
body.sec-examen .examen-instr{border:0 !important;border-radius:12px !important;background:#eaf0f8 !important;color:#1f2f46 !important;font:600 .95rem "Instrument Sans","Public Sans",sans-serif !important;padding:12px 16px !important}
body.sec-examen .examen-lectura-oracion{text-align:left !important;font:400 clamp(1.6rem,3.6vw,2.3rem)/1.25 "Fraunces",Georgia,serif !important;color:#0d1b2e !important;margin:18px 30px 6px !important}
body.sec-examen .examen-card [class*="pide"],body.sec-examen .examen-reporte-instr{text-align:left !important;font:600 .95rem "Instrument Sans","Public Sans",sans-serif;color:#5a6a82}
body.sec-examen .btn-reporte-si,body.sec-examen .btn-reporte-no{display:block;width:100%;border-radius:999px !important;min-height:52px;font:700 1rem "Instrument Sans","Public Sans",sans-serif !important;cursor:pointer;margin-top:10px}
body.sec-examen .btn-reporte-si{background:#14253d !important;color:#fff !important;border:0 !important}
body.sec-examen .btn-reporte-no{background:#fff !important;color:#14253d !important;border:2px solid #14253d !important}
body.sec-examen .examen-card [class*="reporte"]:not(button){border:0 !important;background:none !important;padding:0 !important}
body.sec-examen .resumen{background:#f6f9fd !important;border:0 !important;border-radius:30px !important;box-shadow:0 34px 70px -28px rgba(0,0,0,.65) !important;padding:32px 30px !important}
body.sec-examen .resumen-titulo{font:700 clamp(1.5rem,3.4vw,2rem)/1.15 "Instrument Sans","Public Sans",sans-serif !important;text-transform:none !important;letter-spacing:-.02em !important;color:#0d1b2e !important;margin:0 0 18px !important;text-align:left !important}
body.sec-examen .resumen-bloque{text-align:left !important;background:#fff;border-radius:20px;padding:20px 24px;margin:0 0 14px}
body.sec-examen .resumen-num{font:700 clamp(3.6rem,9vw,5rem)/1 "Instrument Sans","Public Sans",sans-serif !important;letter-spacing:-.04em;color:#0d1b2e !important}
body.sec-examen .resumen-num span{font-size:.38em;color:#6b7a92;font-weight:600;letter-spacing:0}
body.sec-examen .resumen-lbl{font:600 1rem "Instrument Sans","Public Sans",sans-serif !important;text-transform:none !important;letter-spacing:0 !important;color:#5a6a82 !important;margin-top:4px}
body.sec-examen .resumen-lectura,body.sec-examen .resumen-escritura{border:0 !important;border-radius:20px !important;padding:18px 22px !important;margin:0 0 14px !important}
body.sec-examen .resumen-lectura.bien{background:#e9f7ef !important}
body.sec-examen .resumen-lectura.mal,body.sec-examen .resumen-escritura.mal{background:#fdecef !important}
body.sec-examen .resumen-escritura.ok,body.sec-examen .resumen-escritura.bien{background:#e9f7ef !important}
body.sec-examen .resumen .etq{font:600 .88rem "Instrument Sans","Public Sans",sans-serif !important;text-transform:none !important;letter-spacing:0 !important;color:#5a6a82 !important}
body.sec-examen .resumen .val{font:700 1.35rem "Instrument Sans","Public Sans",sans-serif !important;color:#0d1b2e}
body.sec-examen .resumen-lectura.bien .val,body.sec-examen .resumen-escritura.ok .val{color:#17803f}
body.sec-examen .resumen-lectura.mal .val,body.sec-examen .resumen-escritura.mal .val{color:#b3263a}
body.sec-examen .resumen-msg{font:600 1.15rem/1.45 "Instrument Sans","Public Sans",sans-serif !important;color:#0d1b2e !important;margin:18px 0 8px !important}
body.sec-examen .resumen-nota{font-style:normal !important;font-size:.88rem !important;color:#6b7a92 !important}
body.sec-examen .resumen .btn-examen-principal,body.sec-examen .resumen button{display:block;width:100%;opacity:1 !important;background:#7c1c2c !important;color:#fff !important;border:0 !important;border-radius:999px !important;min-height:54px;font:700 1rem "Instrument Sans","Public Sans",sans-serif !important;box-shadow:0 14px 28px -14px rgba(124,28,44,.9) !important;margin-top:16px}
body.sec-examen .lectura-reporte-msg{text-align:left !important;font:600 .95rem "Instrument Sans","Public Sans",sans-serif !important;color:#5a6a82 !important;margin-top:18px}
body.sec-examen .lectura-reporte{border:0 !important;background:none !important;padding:0 !important;margin-bottom:26px}

/* Órdenes — resumen de la sesión (mismo estilo que el resumen del examen) */
body[class*="sec-"] .resumen-cmd{display:block !important;padding:30px 28px 28px !important;text-align:left}
body[class*="sec-"] .resumen-cmd .resumen-titulo{font:700 clamp(1.5rem,3.4vw,2rem)/1.15 "Instrument Sans","Public Sans",sans-serif;letter-spacing:-.02em;color:#0d1b2e;margin:0 0 18px}
body[class*="sec-"] .resumen-cmd .resumen-bloque{background:#fff;border-radius:20px;padding:20px 24px;margin:0 0 14px}
body[class*="sec-"] .resumen-cmd .resumen-num{font:700 clamp(3.4rem,9vw,4.6rem)/1 "Instrument Sans","Public Sans",sans-serif;letter-spacing:-.04em;color:#0d1b2e}
body[class*="sec-"] .resumen-cmd .resumen-num span{font-size:.38em;color:#6b7a92;font-weight:600;letter-spacing:0}
body[class*="sec-"] .resumen-cmd .resumen-lbl{font:600 1rem "Instrument Sans","Public Sans",sans-serif;color:#5a6a82;margin-top:4px}
body[class*="sec-"] .resumen-cmd .resumen-detalle{margin:10px 0 0;font:700 1rem "Instrument Sans","Public Sans",sans-serif;color:#0d1b2e}
body[class*="sec-"] .resumen-cmd .resumen-msg{font:600 1.1rem/1.45 "Instrument Sans","Public Sans",sans-serif;color:#0d1b2e;margin:18px 0 6px}
body[class*="sec-"] .resumen-cmd .btn-siguiente{display:block;width:100%;margin-top:16px}
body[class*="sec-"] .resumen-cmd .resumen-volver{display:block;margin-top:16px;text-align:center;font:600 .95rem "Instrument Sans","Public Sans",sans-serif;color:#1d3f63;text-decoration:underline;text-underline-offset:3px}
body[class*="sec-"] .resumen-cmd .resumen-titulo,body[class*="sec-"] .resumen-cmd .resumen-lbl{text-transform:none !important;letter-spacing:-.01em !important}
body[class*="sec-"] .resumen-cmd .resumen-lbl{letter-spacing:0 !important}