:root{--paper:#f8f7f4;--ink:#121723;--orange:#ff6b35;--muted:#56616a;--line:#dadcd5;--graph:#22c5a0;--aqua:#5096ff;--violet:#8b5cf6;--rose:#f43f5e;font-family:Poppins,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:wait;opacity:.6}button,a,input{touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible,canvas:focus-visible{outline:3px solid #155ca6;outline-offset:4px}[hidden]{display:none!important}.masthead,main,footer{max-width:1512px;margin:auto;padding:0 54px}.masthead{height:108px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.wordmark{display:flex;gap:10px;align-items:center;text-decoration:none;color:inherit;font:600 42px Outfit,sans-serif}.wordmark>span:last-child{font:600 16px Outfit,sans-serif;letter-spacing:2px;margin-left:9px}.wordmark small{font-size:8px;letter-spacing:1.1px}.orbit{color:#bf461e;font-size:42px;margin-left:-13px}.edition{font-size:9px;letter-spacing:1.5px;color:var(--muted)}.edition b{display:block;text-align:right;color:var(--ink);margin-top:6px}.entrance{display:grid;grid-template-columns:1.2fr 1fr;gap:90px;padding:56px 0 40px}.eyebrow{font-size:10px;letter-spacing:1.5px;font-weight:600;margin:0 0 20px}.eyebrow>span{display:inline-block;background:var(--orange);width:8px;height:8px;border-radius:50%;margin-right:6px}h1,h2{font-family:Outfit,sans-serif;letter-spacing:-1.4px;font-weight:500}h1{font-size:72px;line-height:1.03;margin:0 0 22px}h1 em{font-style:normal;color:#b84019}.lede{font-size:14px;line-height:1.9;color:var(--muted);max-width:485px}.entry-map{height:245px;overflow:hidden;position:relative;margin-top:24px;border:1px solid var(--line);border-radius:3px;background:#ecefe5}.entry-map canvas{width:100%;height:100%;object-fit:cover;opacity:.95}.entry-map>span{position:absolute;bottom:12px;left:12px;background:var(--paper);padding:9px 12px;font-size:9px;letter-spacing:1px;box-shadow:0 2px 8px #253d2020}.entry-map b{margin-left:35px;font-size:15px}.brands{display:flex;align-items:center;gap:20px;margin-top:24px}.brands img{width:106px;height:46px;object-fit:contain;mix-blend-mode:multiply}.brands span{font-size:15px;color:var(--muted)}.entry-form{padding:32px 34px;background:#fff;border:1px solid var(--line);box-shadow:8px 8px 0 #eaece4;align-self:center}.entry-form h2{font-size:32px;margin:0 0 28px;letter-spacing:-.7px}.entry-form label,legend{font-size:12px;font-weight:500}.entry-form input[type=text],#nombre{display:block;width:100%;border:1px solid #b9c0ba;background:#fcfcfa;padding:13px 14px;margin:9px 0 25px;border-radius:3px;font-size:13px}fieldset{padding:0;border:0;margin:0 0 24px}legend{margin-bottom:11px}.characters{display:grid;grid-template-columns:repeat(6,1fr);gap:7px}.character{position:relative;display:block;text-align:center;padding:10px 0;border:1px solid var(--line);border-radius:4px;background:#f8f9f5;cursor:pointer}.character:has(input:checked){background:#fff0e9;border:2px solid #be471e;padding:9px 0}.character:has(input:focus-visible){outline:3px solid #155ca6;outline-offset:3px}.character input{position:absolute;opacity:0;width:1px;height:1px}.character canvas{width:40px;height:54px;display:block;margin:auto}.primary{border:1px solid var(--ink);background:var(--ink);color:white;padding:15px 20px;font-size:13px;border-radius:3px}.primary:hover{background:#303d41}.enter{width:100%;display:flex;justify-content:space-between}.entry-note{font-size:10px;text-align:center;color:var(--muted);margin:14px 0 25px}.entry-instructions{display:flex;gap:13px;align-items:center;border-top:1px solid #eceee9;padding-top:13px;margin-top:13px}.entry-instructions>span{font:400 21px Outfit,sans-serif;color:#64706b}.entry-instructions p{font-size:10px;color:var(--muted);line-height:1.9;margin:0}.entry-instructions b{font-size:11px;color:var(--ink);font-weight:500}.small{font-size:11px;color:#805000}.world-heading{display:flex;align-items:center;justify-content:space-between;padding:32px 0 24px;gap:20px}.world-heading h1{font-size:34px;letter-spacing:-.8px;margin:0}.world-heading .eyebrow{margin-bottom:10px}.secondary{border:1px solid #b5beb5;background:transparent;color:var(--ink);padding:10px 15px;font-size:11px;border-radius:3px}.secondary:hover{background:#e9ece3}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:24px}.world-pane{min-width:0}.world-top{border:1px solid var(--line);border-bottom:none;display:flex;justify-content:space-between;padding:14px 16px;font-size:9px;letter-spacing:.7px;background:white}.dot{display:inline-block;background:#297259;width:6px;height:6px;border-radius:50%;margin-right:7px}#mundo{display:block;width:100%;aspect-ratio:14/9;border:1px solid #aebba7;background:#e8eedf}#mundo:focus-visible{outline-offset:0}.world-bottom{display:flex;justify-content:space-between;gap:15px;padding:12px 0;font-size:9px;color:var(--muted)}kbd{font:inherit;background:#ebeee6;border:1px solid #cdd2c7;border-radius:3px;padding:2px 4px;color:#374b3d}.connection{display:flex;gap:12px;justify-content:space-between;align-items:center;padding:8px 12px;background:#ecefe6;border-left:3px solid #54765f}.connection.offline{background:#fff1de;border-color:#9d641c}.connection p{font-size:10px;line-height:1.7;margin:0}.text-button{font-size:10px;padding:8px 0;border:0;background:none;color:#4a5960;text-decoration:underline;text-underline-offset:4px}.sidebar{border-top:2px solid var(--ink)}.roster-heading{display:flex;justify-content:space-between;align-items:center;padding:13px 0}.roster-heading h2{font-size:20px;letter-spacing:-.3px;margin:0}.roster-heading>span{border:1px solid #bbc3b9;padding:2px 8px;border-radius:20px;font-size:10px}#roster{padding:0;margin:0;list-style:none;max-height:230px;overflow:auto}#roster li{padding:10px 0;border-bottom:1px solid var(--line);display:flex;gap:10px;align-items:center;font-size:12px}#roster .avatar-dot{width:28px;height:28px;border-radius:50%;flex-shrink:0;border:4px solid white;outline:1px solid #bdc8bb}#roster small{display:block;color:var(--muted);font-size:9px;margin-top:4px}.signals{margin-top:28px}.signals .eyebrow{margin-bottom:12px}.signals button{display:flex;align-items:center;gap:10px;padding:10px 0;width:100%;border:0;border-bottom:1px solid var(--line);color:var(--ink);background:transparent;font-size:15px}.signals button:hover{background:#e8ece2}.signals span{font-size:10px;flex:1;text-align:left}.signals kbd{font-size:9px}.field-note{background:#e5eadd;padding:18px 20px;margin-top:24px;position:relative;overflow:hidden}.field-note>span{font-size:8px;letter-spacing:1.5px}.field-note p{font:400 21px/1.3 Outfit,sans-serif;margin:12px 0 32px;max-width:160px}.note-orbit{position:absolute;right:10px;bottom:-18px;font-size:100px;color:#72886850;line-height:1}footer{display:flex;justify-content:space-between;padding-top:28px;padding-bottom:22px;font-size:8px;letter-spacing:1px;color:var(--muted);margin-top:30px;border-top:1px solid var(--line)}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:1500px){.entrance{gap:120px}.entry-map{height:285px}}@media(max-width:1100px){.masthead,main,footer{padding-left:28px;padding-right:28px}.entrance{gap:35px}h1{font-size:58px}.entry-form{padding:25px}.workspace{grid-template-columns:minmax(0,1fr) 215px;gap:18px}.world-bottom{flex-direction:column;gap:7px}.characters{grid-template-columns:repeat(3,1fr)}.character{padding:4px}.character:has(input:checked){padding:3px}}@media(max-width:760px){.masthead{height:85px}.edition{display:none}.entrance{grid-template-columns:1fr;padding-top:30px;gap:24px}.intro h1{font-size:54px}.entry-map{display:none}.brands{margin-top:20px}.world-heading{align-items:flex-start;flex-direction:column}.world-heading h1{font-size:30px}.workspace{grid-template-columns:1fr}.sidebar{display:grid;grid-template-columns:1fr 1fr;gap:10px 24px}.roster-heading{grid-column:1/-1}.signals{margin-top:0}.field-note{display:none}footer span{display:none}.characters{grid-template-columns:repeat(6,1fr)}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

/* Segunda dirección visual: patio arquitectónico, luz de tarde y figuras humanas. */
.entry-map{height:auto;aspect-ratio:1.7;margin-top:25px;border-color:#b6a48e;box-shadow:0 10px 25px #72522717}.entry-map canvas{object-fit:cover}.entry-map>span{background:#fffaf0ed;color:#493c2b}.characters{grid-template-columns:repeat(3,1fr);gap:9px}.character{padding:7px 4px 8px;background:linear-gradient(#f3efe8,#e7e2d8);border-color:#d2c8b9}.character:has(input:checked){padding:6px 3px 7px;background:linear-gradient(#fff0df,#eed3b5);border-color:#a65026}.character canvas{width:64px;height:104px}.character-caption{display:block;font-size:9px;line-height:1.5;color:#443a31;margin-top:3px}.entry-form{box-shadow:8px 8px 0 #e9e3d8}.entry-form h2{margin-bottom:23px}.entry-form fieldset{margin-bottom:19px}.entry-instructions{margin-top:10px;padding-top:10px}.world-actions{display:flex;gap:8px}.world-top{background:#332b23;color:#fff1d9;border-color:#4e4132}.world-top .dot{background:#dab871}.world-pane #mundo{border-color:#74634c}.connection{background:#f0eadf;border-color:#907b51}.field-note{background:#eee4d3}.field-note .note-orbit{color:#9b794142}.roster-heading h2{font-size:19px}.world-heading{padding-top:24px;padding-bottom:20px}.world-pane:fullscreen{background:#211c16;padding:14px;display:flex;flex-direction:column;align-items:center;justify-content:center}.world-pane:fullscreen #mundo{height:calc(100vh - 120px);width:auto;max-width:100%;object-fit:contain}.world-pane:fullscreen .world-top,.world-pane:fullscreen .world-bottom,.world-pane:fullscreen .connection{width:min(100%,calc((100vh - 120px)*14/9))}.world-pane:fullscreen .world-bottom{color:#fbefd7}.world-pane:fullscreen .world-bottom kbd{color:#332b23}@media(max-width:760px){.world-actions{flex-wrap:wrap}.characters{grid-template-columns:repeat(3,1fr)}.entry-map{display:block;aspect-ratio:1.8}.world-heading h1{font-size:28px}}@media(min-width:1100px){body:has(#experiencia:not([hidden])) .masthead{height:78px}body:has(#experiencia:not([hidden])) footer{margin-top:22px}.entrance{align-items:center;padding-top:38px;padding-bottom:26px}.entry-form{padding-top:25px;padding-bottom:25px}}

.room-controls{padding:16px 0 10px;border-bottom:1px solid var(--line)}.room-controls button{width:100%;font-size:11px;padding:11px 8px}.room-controls p{font-size:10px;line-height:1.7;color:#574635;margin:10px 0 0}.room-controls #estado-ronda{color:#8a381b}#acceso-estaciones{font-size:11px;padding:12px 0;border-bottom:1px solid var(--line)}#acceso-estaciones summary{cursor:pointer}#atajos-estaciones{display:grid;grid-template-columns:1fr 1fr;gap:5px;padding-top:10px}#atajos-estaciones button{font-size:9px;border:1px solid #c6b89f;background:#f7f0e4;padding:6px}.sidebar .field-note{margin-top:18px}.sidebar .field-note p{font-size:18px}#reloj{font-variant-numeric:tabular-nums;font-size:12px}.world-top{align-items:center;gap:6px}dialog{border:1px solid #b6a082;background:#fffcf5;color:var(--ink);border-radius:10px;padding:25px;width:min(660px,94vw);max-height:92dvh;overflow:auto;box-shadow:0 24px 100px #100c0980}dialog::backdrop{background:#1c211ab5;backdrop-filter:blur(3px)}.dialog-top{display:flex;align-items:center;justify-content:space-between;gap:14px}.dialog-top .eyebrow{font-size:9px;margin:0}.dialog-top button{font-size:26px;border:0;background:none;padding:0 5px;color:#463826}.question-image{margin:14px 0 18px;border:1px solid #dfd4c0;border-radius:5px;overflow:hidden}.question-image canvas,.question-image img{width:100%;height:145px;object-fit:cover;display:block}#pregunta h2{font-size:24px;line-height:1.25;letter-spacing:-.3px;margin:0 0 12px}#pregunta h2:focus{outline:none}.question-instruction{font-size:12px;color:#745131}#opciones{display:grid;gap:7px}#opciones label{display:flex;align-items:center;gap:10px;border:1px solid #c4bcae;padding:10px 12px;font-size:12px;border-radius:4px;cursor:pointer}#opciones label:has(input:checked){border-color:#945125;background:#f4e2c8}#opciones label:has(input:focus-visible){outline:3px solid #216bad;outline-offset:2px}#opciones input{accent-color:#924b23}#respuesta-form fieldset{margin-bottom:13px}#respuesta-estado{font-size:11px;line-height:1.7;color:#5c4b37}#revelacion{border-top:2px solid #7c975c;background:#eef2e5;padding:17px;margin-top:15px}#revelacion .eyebrow{margin-bottom:10px}#criterio-correcto{font:500 19px Outfit;margin:0 0 10px}#explicacion{font-size:12px;line-height:1.8;margin:0}#resultado-personal{font-size:11px;font-weight:500;margin-bottom:0}.local-notice{background:#fff0d8;padding:12px 17px;font-size:12px;border-left:3px solid #b18130}.teacher-layout{display:grid;grid-template-columns:260px 1fr;gap:28px;margin-top:25px}.teacher-controls{align-self:start;position:sticky;top:18px;background:#efe9de;padding:20px}.teacher-controls h2{font-size:23px;letter-spacing:-.5px;margin:0 0 20px}.teacher-controls h2:not(:first-child){margin-top:25px}.teacher-controls label{font-size:11px}.teacher-controls input{width:100%;padding:9px;border:1px solid #b4a58c;margin:7px 0 12px}.teacher-controls button{width:100%;margin-bottom:8px;padding:10px 8px;border:1px solid #b4a58c;font-size:11px;background:#fffaf1;color:#30271d;border-radius:3px}.teacher-controls .primary{background:#242b24;color:#fffaf1}.teacher-controls ul{padding-left:15px;font-size:11px;line-height:1.8}.teacher-questions{display:grid;grid-template-columns:1fr 1fr;gap:14px}.teacher-question{background:#fffdf8;border:1px solid #d5c9b5;padding:17px}.teacher-question h3{font:500 17px Outfit;margin:0 0 9px}.teacher-question>p{font-size:12px;line-height:1.7}.teacher-question .counts{font-size:10px;line-height:1.8;color:#625237}.teacher-question button{border:1px solid #8a6c42;background:#f8edda;color:#35291b;padding:7px 12px;margin-top:12px;border-radius:3px}#reloj-maestro{font:500 32px Outfit;font-variant-numeric:tabular-nums;color:#8a481e}@media(max-width:900px){.teacher-layout{grid-template-columns:220px 1fr;gap:15px}.teacher-questions{grid-template-columns:1fr}.world-top{font-size:8px}#reloj{font-size:10px}}@media(max-width:760px){.teacher-layout{grid-template-columns:1fr}.teacher-controls{position:static}.room-controls{grid-column:1/-1}#acceso-estaciones{grid-column:1/-1}dialog{padding:18px}.question-image canvas,.question-image img{height:115px}#pregunta h2{font-size:20px}#opciones label{font-size:11px;padding:9px}#mundo{touch-action:manipulation}}

/* El alto para mirar el reparto del grupo */
#reparto{margin-top:18px;padding:16px 18px;border:1px solid var(--line,#e4ddcd);border-radius:14px;background:var(--panel,#fff)}
#reparto h2{margin:0 0 4px;font-size:1.05rem}
.reparto-fila{padding:10px 0;border-top:1px solid var(--line,#e4ddcd)}
.reparto-fila:first-child{border-top:0}
.reparto-fila h3{margin:0 0 4px;font-size:.95rem}
.reparto-fila p{margin:2px 0}

/* La vista de conducción, por recintos */
.teacher-room{margin-bottom:26px}
.teacher-room-head{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px 0 8px;border-bottom:2px solid var(--line,#e4ddcd);margin-bottom:12px}
.teacher-room-head h2{margin:0;font-size:1rem}
.retro-recinto{margin:0 0 14px;color:var(--signal-txt,#bd4d25);font-weight:600}
#reparto h3{margin:16px 0 6px;font-size:.98rem}
#reparto h3:first-child{margin-top:0}
#reparto details{margin-top:12px}
#reparto details summary{cursor:pointer;font-size:.86rem}

/* Niveles e insignias */
#insignias{margin-top:18px;padding-top:14px;border-top:1px solid var(--line,#e4ddcd)}
#insignias-resumen{margin:0 0 10px;font-weight:600;color:var(--text,#121723)}
#insignias-lista{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.insignia{padding:9px 11px;border-radius:10px;border:1px solid var(--line,#e4ddcd);background:var(--panel,#fff)}
.insignia b{display:block;font-size:.88rem}
.insignia span{display:block;font-size:.78rem;color:var(--muted,#5b6472);margin-top:2px}
.insignia-recorrido{border-left:4px solid #5096ff}
.insignia-acierto{border-left:4px solid #22c5a0}

/* Las dos marcas en la cabecera del mundo */
.marcas{display:flex;align-items:center;gap:20px;text-decoration:none;padding:4px 0}
.marcas .logo-maryam{height:58px;width:auto;display:block}
.marcas .logo-mm{height:46px;width:auto;display:block;border-radius:10px}
.marcas-sep{width:1px;height:40px;background:var(--line,#e4ddcd);display:block}
@media (max-width:760px){
  .marcas{gap:14px}
  .marcas .logo-maryam{height:42px}
  .marcas .logo-mm{height:34px}
  .marcas-sep{height:30px}
}
@media (max-width:480px){
  .marcas .logo-maryam{height:34px}
  .marcas .logo-mm{height:27px}
}

/* Los diálogos de los recintos 2 y 3 se peinan igual que el del 1: las opciones
   van una debajo de otra, que es como se responde sin equivocarse de casilla. */
#itin-opciones,#orient-opciones{display:grid;gap:7px}
#itin-opciones label,#orient-opciones label{display:flex;align-items:flex-start;gap:10px;
  border:1px solid #c4bcae;padding:11px 12px;font-size:12.5px;line-height:1.4;
  border-radius:4px;cursor:pointer;background:#fffdf8}
#itin-opciones label:has(input:checked),#orient-opciones label:has(input:checked){
  border-color:#945125;background:#f4e2c8;font-weight:600}
#itin-opciones label:has(input:disabled),#orient-opciones label:has(input:disabled){cursor:default;opacity:.85}
#itin-opciones label:has(input:focus-visible),#orient-opciones label:has(input:focus-visible){
  outline:3px solid #216bad;outline-offset:2px}
#itin-opciones input,#orient-opciones input{accent-color:#924b23;margin-top:2px;flex:none}

#pregunta-itin h2,#pregunta-orient h2{font-size:24px;line-height:1.25;letter-spacing:-.3px;margin:0 0 12px}
#pregunta-itin h2:focus,#pregunta-orient h2:focus{outline:none}
#respuesta-itin fieldset,#respuesta-orient fieldset{margin-bottom:13px}
#itin-paso,#pregunta-orient>.small{font-size:12px;color:#745131;margin:0 0 10px}
#itin-estado,#orient-estado{font-size:11px;line-height:1.7;color:#5c4b37}

#itin-revelacion,#orient-revelacion{border-top:2px solid #7c975c;background:#eef2e5;
  padding:17px;margin-top:15px}
#itin-revelacion .eyebrow,#orient-revelacion .eyebrow{margin-bottom:10px}
#itin-correcto,#orient-correcto{font:500 19px Outfit;margin:0 0 10px}
#itin-explicacion,#orient-explicacion{font-size:12px;line-height:1.8;margin:0}
#itin-personal,#orient-personal{font-size:11px;font-weight:500;margin-bottom:0}

@media(max-width:760px){
  #pregunta-itin h2,#pregunta-orient h2{font-size:20px}
  #itin-opciones label,#orient-opciones label{font-size:11.5px;padding:10px}
}

/* Un gesto puesto se ve puesto, y el botón dice cómo quitarlo. */
.signals [data-emote].activo{border-color:#8a481e;background:#f8e6cd;font-weight:600}
.teacher-controls li button.atender{width:auto;display:inline-block;margin:4px 0 0;padding:3px 9px;font-size:10px;border-radius:999px}

/* La barra de conducción se queda fija, pero con varias personas la lista se
   cortaba por abajo. Ahora tiene su propio desplazamiento. */
.teacher-controls{max-height:calc(100dvh - 30px);overflow:auto}
.teacher-controls ul{list-style:none;padding-left:0}
.teacher-controls li{padding:7px 0;border-bottom:1px solid rgba(180,165,140,.45)}
.teacher-controls li:last-child{border-bottom:0}

/* Con diez o más conectados la lista se comía la pantalla y los botones de
   conducción quedaban fuera de vista. Ahora la lista tiene su propio alto. */
#maestro-personas{max-height:40vh;overflow:auto;margin-bottom:6px}

#maestro-personas li.ausente{opacity:.55}

/* Lo que aún no se ha ganado se ve, pero apagado. */
.insignia-pendiente{opacity:.45}

/* Recinto 4 · el escritorio de los doce fenómenos. */
.escritorio-acciones{display:flex;gap:9px;flex-wrap:wrap;margin:14px 0 4px}
.escritorio-acciones a,.escritorio-acciones button{display:inline-block;width:auto;margin:0;padding:10px 15px;border:1px solid #8a6c42;border-radius:3px;background:#242b24;color:#fffaf1;font-size:12px;text-decoration:none;font-family:inherit;cursor:pointer}
#escritorio-rq{line-height:1.7}
#escritorio-pasos{margin-top:16px;border-top:1px solid #d5c9b5;padding-top:12px}
#escritorio-pasos .eyebrow{margin:12px 0 6px}
.pasos-lista{display:grid;gap:8px}
.pasos-lista label{display:flex;align-items:flex-start;gap:10px;border:1px solid #c4bcae;padding:10px 12px;border-radius:4px;font-size:12px;line-height:1.6;cursor:pointer}
.pasos-lista label:has(input:checked){border-color:#35613c;background:#eaf4e6}
.pasos-lista input{margin-top:3px;flex:none;accent-color:#35613c}
.pasos-lista b{display:block;margin-bottom:4px}
.pasos-lista p b{display:inline;margin:0}
.pasos-lista p{margin:4px 0 0;color:#5c4b37}

/* Recinto 3 · las dos preguntas, escritas o dichas. */
#plenaria-texto{width:100%;padding:11px;border:1px solid #b4a58c;border-radius:4px;font:inherit;font-size:12px;line-height:1.7;background:#fffdf8;color:inherit;resize:vertical}
.plenaria-acciones{display:flex;gap:9px;flex-wrap:wrap;margin:12px 0 6px}
.plenaria-acciones button{width:auto;margin:0;padding:10px 15px;border:1px solid #8a6c42;border-radius:3px;background:#fffaf1;color:#30271d;font-size:12px;cursor:pointer;font-family:inherit}
.plenaria-acciones .primary{background:#242b24;color:#fffaf1}
#plenaria-nivel{width:100%;height:6px;margin:2px 0 4px}
#plenaria-mi-audio{width:100%;margin:6px 0 2px}
#plenaria-explicacion p{font-size:12px;line-height:1.8}
.voz-galeria{margin-top:16px;border-top:2px solid #7c975c;padding-top:12px;display:grid;gap:10px}
.voz-ficha{border:1px solid #d5c9b5;border-radius:5px;padding:11px 13px;background:#fffdf8}
.voz-ficha b{display:block;margin-bottom:5px;font-size:12px}
.voz-ficha p{margin:0 0 7px;font-size:12px;line-height:1.7}
.voz-ficha audio{width:100%}

/* El panel de las grabaciones, en la vista de conducción. */
.teacher-panel{display:grid;gap:22px;align-content:start;min-width:0}
.voces-panel{background:#fffdf8;border:1px solid #d5c9b5;padding:18px}
.voces-cabeza{display:flex;align-items:baseline;justify-content:space-between;gap:14px;flex-wrap:wrap}
.voces-cabeza h2{font-size:20px;letter-spacing:-.4px;margin:0}
.voces-cabeza button{width:auto;margin:0;padding:8px 14px;border:1px solid #8a6c42;border-radius:3px;
  background:#242b24;color:#fffaf1;font-size:11px;cursor:pointer;font-family:inherit}
.voces-cabeza button[disabled]{opacity:.6;cursor:default}
.voces-pregunta{font:500 14px Outfit, sans-serif;margin:18px 0 4px;padding-top:12px;border-top:1px solid #e3d9c6}
.voz-fila{border:1px solid #d5c9b5;border-radius:5px;padding:11px 13px;margin-top:9px;background:#fffaf1}
.voz-fila.compartida{border-color:#35613c;background:#eaf4e6}
.voz-fila b{display:block;font-size:12px;margin-bottom:6px}
.voz-fila p{margin:0 0 8px;font-size:12px;line-height:1.7}
.voz-fila audio{width:100%;margin-bottom:8px}
.voz-fila button.compartir{width:auto;margin:0;padding:5px 12px;font-size:11px;border-radius:999px;
  border:1px solid #8a6c42;background:#fffdf8;color:#30271d;cursor:pointer;font-family:inherit}
.voz-fila.compartida button.compartir{background:#35613c;color:#fffaf1;border-color:#35613c}
.voces-panel .voces-cabeza h3.voces-pregunta{flex:1;min-width:220px}
.voces-cabeza button{white-space:nowrap}

/* El taller y el mundo son el mismo sitio: la vuelta tiene que verse. */
.masthead{position:relative}
/* Encima de los logos y en el flujo: pegada a una esquina tapaba la marca. */
.volver-taller{order:-1;flex-basis:100%;align-self:flex-start;width:auto;max-width:fit-content;
  margin:0 0 10px;font-size:11px;letter-spacing:.06em;
  text-transform:uppercase;text-decoration:none;color:#5c4b37;border:1px solid #c6b89f;
  border-radius:999px;padding:5px 11px;background:#fffaf1}
.volver-taller:hover{border-color:#30271d;color:#30271d}
@media(max-width:760px){.volver-taller{position:static;display:inline-block;margin:10px 0 0}}

#reenviar-plenaria{border-color:#8a481e;color:#8a481e}

/* La lámina de la presentación y su mando. */
dialog.lamina{width:min(760px,94vw)}
dialog.lamina h2{font-size:27px;line-height:1.2;letter-spacing:-.4px;margin:0 0 10px}
.lamina-entradilla{font-size:14px;line-height:1.7;color:#745131;margin:0 0 16px}
.lamina-puntos{margin:0;padding-left:20px;display:grid;gap:10px}
.lamina-puntos li{font-size:14px;line-height:1.65}
#lamina-nota{margin-top:16px;padding-top:10px;border-top:1px solid #ddd0b8;color:#6d5139}
#mando-laminas{margin-bottom:22px}
#mando-laminas .eyebrow{margin:0 0 4px}
#lamina-actual-titulo{margin:0 0 10px;font-weight:500;color:#30271d}
.mando-pasar{display:flex;gap:6px}
.mando-pasar button{margin-bottom:8px}
#lamina-salto{width:100%;padding:8px;border:1px solid #b4a58c;margin-bottom:8px;font:inherit;font-size:11px;background:#fffaf1;color:#30271d}

/* Las ilustraciones son de 1280 × 600 y se mostraban en una franja de 145 px:
   se veía la mitad del dibujo y se perdía lo que importa —en las dos del sol,
   el sol—. Ahora se ven con su proporción, con un tope para que el cuadro de la
   pregunta no crezca de más en pantallas grandes. */
.question-image canvas,.question-image img{height:auto;aspect-ratio:1280/600;max-height:260px}
@media(max-width:760px){.question-image canvas,.question-image img{height:auto;max-height:190px}}
.lamina-imagen{display:block;width:100%;aspect-ratio:1280/400;object-fit:cover;border-radius:5px;margin:4px 0 18px}

/* Las placas: lo que escribe un docente, publicado en el estilo del mundo. */
.placa{position:relative;background:
    radial-gradient(120% 90% at 20% 10%,#fffaf0 0,#f7eedb 60%,#efe2c8 100%);
  color:#2b221a;padding:26px 28px 20px;border:1px solid #8a4b22;
  box-shadow:inset 0 0 0 5px #fbf5e8,inset 0 0 0 6px #b98b5e,0 10px 26px #3a281633;
  animation:placa-entra .9s cubic-bezier(.2,.7,.2,1) both;
  animation-delay:calc(var(--orden,0) * .35s)}
.placa-cabeza{margin:0 0 12px;font:600 10px Outfit,sans-serif;letter-spacing:.16em;
  text-transform:uppercase;color:#8a6c42}
.placa-texto{margin:0;font:500 19px/1.5 'Cormorant Garamond',Georgia,serif;color:#2b221a;
  quotes:'\201C' '\201D'}
.placa-texto::before{content:open-quote;float:left;font:600 54px/.8 'Cormorant Garamond',Georgia,serif;
  color:#b5562c;margin:4px 8px 0 -4px}
.placa-filete{display:block;height:9px;margin:16px auto 10px;width:60%;
  background:linear-gradient(#b98b5e,#b98b5e) center/100% 1px no-repeat}
.placa-filete::after{content:'';display:block;width:9px;height:9px;margin:0 auto;
  background:#fbf5e8;border:1px solid #b98b5e;transform:rotate(45deg)}
.placa-firma{margin:0;text-align:right;font:italic 500 16px 'Cormorant Garamond',Georgia,serif;color:#6d5139}
.placa-firma::before{content:'— '}
@keyframes placa-entra{
  from{opacity:0;filter:blur(6px) sepia(1);transform:translateY(10px) scale(.985)}
  to{opacity:1;filter:none;transform:none}}
@media(prefers-reduced-motion:reduce){.placa{animation:none}}
dialog.galeria{width:min(1020px,96vw);background:#f3ead8}
dialog.galeria h2{font:600 34px 'Cormorant Garamond',Georgia,serif;margin:0 0 18px;color:#2b221a}
.galeria-rejilla{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px}
.galeria-vacia{color:#6d5139;font-size:13px}
#plenaria-galeria{gap:16px}
.voces-botones{display:flex;gap:6px;flex-wrap:wrap}
.voces-cabeza button.secundario{background:#fffaf1;color:#30271d}

/* La galería: si llega el muro de Codex, las placas quedan colgadas en un
   lugar del mundo. Si no, se queda el crema liso de siempre. El velo encima
   mantiene el muro en segundo plano para que manden las placas. */
/* La primera versión de Codex, con faroles y flores: con la lisa, el velo la
   dejaba igual que no tener fondo. JPEG de 270 KB para que llegue a tiempo al
   abrir la galería aunque la conexión sea mala. */
dialog.galeria{background:#f3ead8}

/* El muro con las placas colgadas. La escena guarda la proporción de la
   lámina, así que los huecos en porcentaje caen siempre sobre el estuco. */
.galeria-ayuda{margin:-8px 0 14px;font-size:12px;color:#6d5139}
.galeria-muro{position:relative;width:100%;aspect-ratio:1586/992;border-radius:6px;overflow:hidden;
  box-shadow:0 14px 40px #2a1a0d40;container-type:inline-size}
.muro-fondo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.placa-colgada{position:absolute;padding:0;margin:0;border:0;background:none;cursor:zoom-in;
  animation:colgar .9s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--orden,0) * .3s);
  transform-origin:50% -10px}
/* El clavo de bronce y su sombra. */
.placa-colgada::before{content:'';position:absolute;left:50%;top:-7px;width:7px;height:7px;
  margin-left:-3.5px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f3d49a,#8a6534 70%);
  box-shadow:0 2px 3px #0005;z-index:2}
.placa-colgada:hover .placa-mini,.placa-colgada:focus-visible .placa-mini{transform:translateY(-3px);
  box-shadow:inset 0 0 0 4px #fbf5e8,inset 0 0 0 5px #b98b5e,0 14px 26px #3a281666}
.placa-colgada:focus-visible{outline:3px solid #216bad;outline-offset:4px}
/* En el muro, la placa se ve en pequeño: el mismo diseño, escalado al hueco. */
.placa-mini{height:100%;overflow:hidden;animation:none;padding:7% 8% 6%;transition:transform .2s,box-shadow .2s;
  box-shadow:inset 0 0 0 4px #fbf5e8,inset 0 0 0 5px #b98b5e,0 8px 16px #3a281655;display:flex;flex-direction:column}
.placa-mini .placa-cabeza{font-size:clamp(6px,.85cqi,10px);margin-bottom:5%}
/* En pequeño, cuatro renglones enteros y puntos suspensivos: nunca media
   línea cortada. Ni comillas grandes ni resumen, que en miniatura estorban. */
.placa-mini .placa-resumen{display:none}
.placa-mini .placa-texto{font-size:clamp(8px,1.45cqi,16px);line-height:1.35;overflow:hidden;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:var(--renglones,4);margin-bottom:auto}
.placa-mini .placa-texto::before{display:none}
.placa-mini .placa-filete{margin:4% auto 3%;transform:scale(.7)}
.placa-mini .placa-firma{font-size:clamp(8px,1.3cqi,15px)}
@keyframes colgar{
  0%{opacity:0;transform:translateY(-14px) rotate(-3deg);filter:blur(4px) sepia(1)}
  60%{opacity:1;transform:translateY(0) rotate(1.2deg);filter:none}
  100%{transform:rotate(0)}}
@media(prefers-reduced-motion:reduce){.placa-colgada{animation:none}}
.galeria-vacia{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);margin:0;
  font:italic 500 20px 'Cormorant Garamond',Georgia,serif;color:#6d5139}

/* El acercamiento: la placa a tamaño de lectura, encima del muro. */
.galeria-zoom{position:absolute;inset:0;background:#241a12b8;backdrop-filter:blur(2px);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:4%;z-index:5}
.galeria-zoom[hidden]{display:none}
.zoom-placa{width:min(620px,92%);max-height:78%;overflow:auto}
.zoom-placa .placa{animation:acercar .35s cubic-bezier(.2,.7,.2,1) both}
.zoom-placa .placa-texto{font-size:clamp(17px,2.4cqi,24px)}
@keyframes acercar{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}
.zoom-mando{display:flex;align-items:center;gap:10px;margin:0}
.zoom-mando button{width:auto;margin:0;padding:8px 14px;border:1px solid #d9c3a0;border-radius:999px;
  background:#fbf5e8;color:#30271d;font:500 13px Outfit,sans-serif;cursor:pointer}
.zoom-cuenta{color:#fbf5e8;font:500 13px Outfit,sans-serif;min-width:54px;text-align:center}
@media(prefers-reduced-motion:reduce){.zoom-placa .placa{animation:none}}

.galeria-pestanas{display:flex;gap:6px;margin:0 0 12px}
.galeria-pestanas[hidden]{display:none}
.galeria-pestanas button{width:auto;margin:0;padding:7px 14px;border:1px solid #c6ad86;border-radius:999px;background:#fbf5e8;color:#6d5139;font:500 12px Outfit,sans-serif;cursor:pointer}
.galeria-pestanas button.activa{background:#30271d;border-color:#30271d;color:#fbf5e8}

/* El foco del teclado cae en el título al abrir un cuadro, para que el lector
   de pantalla empiece por ahí; no hace falta pintarlo. */
dialog h2[tabindex="-1"]:focus{outline:none}
/* La imagen de sección, más baja: en un portátil las láminas largas pedían
   bajar para leer la última línea. */
.lamina-imagen{max-height:150px;margin-bottom:14px}
dialog.lamina h2{font-size:25px;margin-bottom:8px}
.lamina-entradilla{margin-bottom:12px}
.lamina-puntos{gap:8px}

/* Una tabla en una lámina: el antes y el después de los criterios. */
.lamina-tabla table{width:100%;border-collapse:collapse;font-size:12.5px;line-height:1.45;margin:4px 0 10px}
.lamina-tabla th{text-align:left;font:600 11px Outfit,sans-serif;letter-spacing:.04em;color:#6d5139;padding:7px 9px;border-bottom:2px solid #d6c4a4;background:#f6efe2}
.lamina-tabla td{padding:7px 9px;border-bottom:1px solid #e6dac6;vertical-align:top}
.lamina-tabla td:last-child{color:#5c4b37}
/* La tabla de los criterios, como en el taller: antes en gris, ahora en negrita,
   el Criterio D resaltado y la fila del criterio que sale, en cursiva. */
.lamina-tabla.tabla-criterios{border:1px solid #e3d4ba;border-radius:12px;overflow:hidden;background:#fffaf1;margin:4px 0 12px}
.lamina-tabla.tabla-criterios table{margin:0;font-size:13.5px}
.lamina-tabla.tabla-criterios th{padding:10px 12px;font-size:11.5px}
.lamina-tabla.tabla-criterios td{padding:10px 12px}
.lamina-tabla.tabla-criterios tr:last-child td{border-bottom:0}
.lamina-tabla.tabla-criterios td:first-child{color:#8a7a66}
.lamina-tabla.tabla-criterios td:nth-child(2){font-weight:600;color:#30271d}
.lamina-tabla.tabla-criterios .peso{color:#b4531f;font-weight:700}
.lamina-tabla.tabla-criterios tr:nth-child(4) td:nth-child(2){font-weight:500;font-style:italic;color:#8a7a66}

/* Tarjetas numeradas en una lámina, y la franja de lo que acompaña. */
.lamina-rejilla{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin:4px 0 12px}
.lamina-tarjeta{background:#fffaf1;border:1px solid #e3d4ba;border-left:4px solid #c8642c;border-radius:12px;padding:12px 14px 14px}
.lamina-tarjeta-n{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:6px;background:#c8642c;color:#fff;font:700 12px Outfit,sans-serif;margin-bottom:8px}
.lamina-tarjeta-t{margin:0 0 5px;font:600 14.5px/1.35 Outfit,sans-serif;color:#30271d}
.lamina-tarjeta-x{margin:0;font-size:13px;line-height:1.55;color:#5c4b37}
.lamina-franja{background:#f1e8d8;border:1px solid #e0d0b4;border-radius:12px;padding:10px 14px 12px;margin:0 0 6px}
.lamina-franja-t{margin:0 0 6px;font:600 13.5px Outfit,sans-serif;color:#30271d}
.lamina-franja-items{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:6px 16px}
.lamina-franja-items p{margin:0;font-size:13px;line-height:1.5;color:#5c4b37}
.lamina-franja-items b{color:#30271d}

/* Las láminas de uso —cómo se usa el mundo— van en oscuro: son una pausa de
   instrucciones, no parte del temario, y no se tienen que confundir con él. */
dialog.lamina.lamina-uso,.visor-lamina.lamina-uso{background:#2b221a;color:#efe3cf;border-color:#6d5139}
.lamina-uso .eyebrow{color:#d9b27c}
.lamina-uso h2{color:#fbf5e8}
.lamina-uso .lamina-entradilla{color:#d9c3a0}
.lamina-uso .lamina-puntos li{color:#efe3cf}
.lamina-uso .lamina-puntos li::marker{color:#d9b27c}
dialog.lamina-uso .dialog-top button{color:#efe3cf}
dialog.lamina-uso::backdrop{background:#120d09cc}
/* El rótulo de arriba, legible sobre el fondo oscuro (el visor tiene su propio
   color para el rótulo y ganaba por orden). */
.visor-lamina.lamina-uso .eyebrow,dialog.lamina.lamina-uso .eyebrow{color:#e0bb82}

/* La galería de orientación salió del recorrido: sus botones no se
   muestran, aunque el código de la sala sigue ahí. */
#entrar-orientacion,#llevar-orientacion{display:none!important}
.volver-taller{white-space:nowrap}

.boton-presentadora{display:block;margin:0 0 8px;padding:10px 8px;text-align:center;border:1px solid #8a481e;border-radius:3px;background:#8a481e;color:#fffaf1;font-size:11px;text-decoration:none}

/* Aviso visible sobre el mundo: dónde estás y qué hacer. */
.world-pane{position:relative}
.aviso-mundo{position:absolute;left:50%;top:64px;transform:translateX(-50%);z-index:5;max-width:min(560px,90%);margin:0;padding:11px 16px;border-radius:6px;background:#211b16f0;color:#fff3d9;font:500 13px/1.45 Outfit,sans-serif;text-align:center;box-shadow:0 8px 22px #0005;pointer-events:none}

/* El recurso plegado de cada pregunta: para quien no ha supervisado. */
.ayuda-pregunta{margin:4px 0 12px;border:1px solid #d9c7a8;border-radius:5px;background:#fbf4e6;font-size:12.5px;line-height:1.5;color:#3d3024}
.ayuda-pregunta summary{cursor:pointer;padding:8px 12px;font-weight:600;color:#8a481e}
.ayuda-pregunta ul{margin:0;padding:0 14px 10px 30px}
.ayuda-pregunta li{margin:5px 0}

/* El recuadro «Un ejemplo» de las láminas. */
.lamina-ejemplo{margin:14px 0 4px;padding:10px 14px 12px;border-left:3px solid #b8662f;border-radius:0 5px 5px 0;background:#f7ecda}
.lamina-ejemplo .eyebrow{margin:0 0 4px;color:#8a481e}
.lamina-ejemplo p:last-child{margin:0;font-size:14px;line-height:1.6;color:#3d3024}
.lamina-uso .lamina-ejemplo{background:#3a2e23}
.lamina-uso .lamina-ejemplo p:last-child{color:#efe3cf}

/* Contexto y significado de cada opción: la pregunta se entiende sola. */
.contexto-pregunta{margin:4px 0 6px;font-size:12.5px;line-height:1.5;color:#6d5139}
#opciones label small,#itin-opciones label small{display:block;margin-top:2px;font-size:11.5px;line-height:1.45;color:#6d5f4f;font-weight:400}

/* Menos ruido en la columna de la derecha: el cierre en letra normal, las
   insignias por ganar solo con su nombre, sin notas que repiten las láminas. */
.sidebar .field-note{display:none}
#reparto{padding:12px 14px}
#reparto-lista{font-size:12.5px;line-height:1.5}
#reparto-lista p,#reparto-lista li{font-size:12.5px;line-height:1.5}
#reparto-lista h3{font-size:13px}
#reparto-lista ul{padding-left:18px;margin:4px 0}
.insignia-pendiente{padding:5px 11px}
.insignia-pendiente span{display:none}

/* Desempeño por profesor, en el tablero de quien conduce. */
.desempeno{overflow-x:auto;margin-bottom:18px}
.desempeno table{width:100%;border-collapse:collapse;font-size:12px;line-height:1.45}
.desempeno th{text-align:left;font:600 11px Outfit,sans-serif;color:#6d5139;padding:6px 8px;border-bottom:2px solid #d6c4a4;background:#f6efe2}
.desempeno td{padding:6px 8px;border-bottom:1px solid #e6dac6;vertical-align:top}
.desempeno td:first-child{font-weight:600}
.desempeno tr.ausente td{opacity:.55}

/* La guía de la visita: lo que se entrega a la entrada, como en un museo. */
.world-actions #abrir-guia{border-color:#a65026;color:#8a381b;background:#fff4e6}
.world-actions #abrir-guia:hover{background:#fbe6cf}
dialog.guia-visita{width:min(1000px,96vw);padding:24px 28px 20px;background:#fffcf5 radial-gradient(circle at 100% 0,#f8e6cc 0,transparent 42%)}
.guia-cabeza h2{font-size:30px;line-height:1.15;letter-spacing:-.6px;margin:10px 0 8px}
.guia-cabeza h2:focus{outline:none}
.guia-cabeza p{font-size:14px;line-height:1.7;color:#5c4b37;margin:0 0 18px;max-width:640px}
.guia-cuerpo{display:grid;grid-template-columns:1.25fr 1fr;gap:26px}
.guia-subt{font:600 11px Outfit,sans-serif;letter-spacing:1.4px;text-transform:uppercase;color:#a65026;margin:0 0 10px}
.guia-ruta{list-style:none;margin:0;padding:0;position:relative}
.guia-ruta::before{content:"";position:absolute;left:13px;top:16px;bottom:16px;border-left:2px dashed #d3b690}
.guia-parada{position:relative;display:grid;grid-template-columns:28px 92px 1fr;gap:12px;align-items:center;padding:6px 0}
.guia-pin{position:relative;z-index:1;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#c8642c;color:#fff;font:700 13px Outfit,sans-serif;box-shadow:0 0 0 4px #fffcf5}
.guia-foto{width:92px;height:62px;object-fit:cover;border-radius:8px;border:1px solid #e0cfb3;box-shadow:0 4px 10px #6b4a2420}
.guia-parada-texto p{margin:0}
.guia-lugar{font:600 10px Outfit,sans-serif;letter-spacing:1px;text-transform:uppercase;color:#8a7a66}
.guia-titulo{font:600 15.5px/1.3 Outfit,sans-serif;color:#30271d;margin:2px 0 3px!important}
.guia-texto{font-size:12.5px;line-height:1.5;color:#5c4b37}
.guia-vuelta{position:relative;margin:0 0 0 40px;padding:2px 0;font-size:11px;color:#a65026;font-style:italic}
.guia-reglas{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.guia-regla{display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:start;background:#fffaf1;border:1px solid #eadcc4;border-radius:10px;padding:9px 12px}
.guia-icono{font-size:20px;line-height:1.3;text-align:center}
.guia-regla p{margin:0}
.guia-regla-t{font:600 13.5px Outfit,sans-serif;color:#30271d}
.guia-regla-x{font-size:12px;line-height:1.5;color:#5c4b37;margin-top:2px!important}
.guia-lista{font-size:12px;color:#5c4b37;margin:12px 0 0}
.guia-lista a{color:#8a381b}
.guia-pie{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:20px;padding-top:14px;border-top:1px solid #e6d8c0;font-size:12px;color:#6d5139}
@media(max-width:760px){.guia-cuerpo{grid-template-columns:1fr}.guia-parada{grid-template-columns:28px 70px 1fr}.guia-foto{width:70px;height:50px}.guia-cabeza h2{font-size:24px}.guia-pie{flex-direction:column;align-items:stretch}}

/* Variantes de las tarjetas: etiqueta en lugar de número, icono, ventaja,
   riesgo y ejemplos. Dos tarjetas van siempre lado a lado. */
.lamina-rejilla.dos{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.lamina-tarjeta-n.etiqueta{width:auto;padding:0 9px;font-size:11px;letter-spacing:.3px}
.lamina-tarjeta-icono{display:block;font-size:24px;line-height:1;margin-bottom:8px}
.lamina-tarjeta-pie{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.lamina-pro,.lamina-contra,.lamina-chip{font-size:11.5px;line-height:1.3;border-radius:999px;padding:4px 10px}
.lamina-pro{background:#e6efdc;color:#35562a}
.lamina-contra{background:#fbe3d4;color:#8a381b}
.lamina-chip{background:#f3eadb;color:#5c4b37;border:1px solid #e3d4ba}

/* Énfasis en las láminas: el color de cada criterio (el mismo del taller),
   las negritas y la fila que hay que mirar primero. */
.crit{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:7px;vertical-align:1px}
.critA{background:#5096ff}.critB{background:#22c5a0}.critC{background:#ff6b35}.critD{background:#f43f5e}.critE{background:#8b5cf6}
.lamina-tabla td b,.lamina-puntos b,.lamina-tarjeta-x b,.lamina-ejemplo b{font-weight:700;color:#30271d}
.lamina-tabla tr.resaltada td{background:#fdeee6}
.lamina-tabla tr.resaltada td:first-child{box-shadow:inset 4px 0 0 #f43f5e}
.lamina-tabla td.cifra{font:700 18px Outfit,sans-serif;color:#30271d;text-align:center}
.lamina-uso .lamina-puntos b{color:#fff4df}

/* Láminas de sala: se pasa a la acción. Llevan el color de su puerta, la
   ilustración de la sala y la pregunta que se responde adentro, destacada. */
.lamina-sala{border-top:6px solid var(--sala)!important}
.lamina-sala #lamina-numero,.lamina-sala #numero{display:inline-block;background:var(--sala);color:#fff;padding:5px 11px;border-radius:999px;letter-spacing:1.2px}
.lamina-sala .lamina-imagen{max-height:180px;width:100%;object-fit:cover;border-radius:10px}
.lamina-sala h2{font-size:30px}
.lamina-mision{background:var(--sala);color:#fff;border-radius:12px;padding:14px 18px 16px;margin:4px 0 14px;box-shadow:0 8px 20px #30271d26}
.lamina-mision p{margin:0}
.lamina-mision-r{font:600 10.5px Outfit,sans-serif;letter-spacing:1.4px;text-transform:uppercase;opacity:.85;margin-bottom:6px!important}
.lamina-mision-p{font:600 19px/1.35 Outfit,sans-serif}
.lamina-sala .lamina-tarjeta{border-left-color:var(--sala)}
.lamina-sala .lamina-rejilla{grid-template-columns:repeat(4,1fr);gap:10px}
.lamina-sala .lamina-tarjeta{padding:11px 12px 12px}
@media(max-width:700px){.lamina-sala .lamina-rejilla{grid-template-columns:repeat(2,1fr)}}

/* Recordatorio para el supervisor: nota al margen del tema en curso, no un
   tema nuevo. Sin ilustración, fondo de nota y título más discreto. */
.lamina-recordatorio{background:#fbf4e3!important;border:1px dashed #d8c09a!important}
.lamina-recordatorio #lamina-numero,.lamina-recordatorio #numero{display:inline-block;border:1px solid #c9a676;color:#7a5a2e;background:#fff8ea;padding:4px 10px;border-radius:999px;letter-spacing:1.1px}
.lamina-recordatorio h2{font-size:22px!important;color:#4a3a28}
.lamina-recordatorio .lamina-tarjeta{background:#fffdf7;border-left-color:#c9a676}
.lamina-recordatorio .lamina-tarjeta-n.etiqueta{background:#c9a676}
.lamina-recordatorio .lamina-tarjeta-t{font-size:14px;font-weight:500}
.lamina-rejilla:has(> :nth-child(3):last-child){grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.hueco{display:inline;background:#f6e3c4;color:#7a4a1a;border-radius:4px;padding:0 4px;font-weight:600;white-space:normal}
/* Ocho tarjetas, como la lista de chequeo: dos filas de cuatro. */
.lamina-rejilla:has(> :nth-child(8):last-child){grid-template-columns:repeat(4,1fr);gap:10px}
.lamina-rejilla:has(> :nth-child(8):last-child) .lamina-tarjeta{padding:10px 11px 12px}
@media(max-width:700px){.lamina-rejilla:has(> :nth-child(8):last-child){grid-template-columns:repeat(2,1fr)}}
/* Una lista corta dentro de una tarjeta. */
.lamina-tarjeta-lista{margin:4px 0 0;padding-left:16px;display:grid;gap:5px}
.lamina-tarjeta-lista li{font-size:12.5px;line-height:1.5;color:#5c4b37}
.lamina-tarjeta-lista b{color:#30271d}
.lamina-rejilla.tres{grid-template-columns:repeat(3,1fr)}
@media(max-width:700px){.lamina-rejilla.tres{grid-template-columns:1fr 1fr}}
.lamina-tarjeta.es-nota{background:#fbf4e3;border:1px dashed #d8c09a;border-left:4px solid #c9a676}
.lamina-tarjeta.es-nota .lamina-tarjeta-n{background:#c9a676}
/* Cuatro columnas de tarjetas cortas, como la lista de los doce temas. */
.lamina-rejilla.cuatro{grid-template-columns:repeat(4,1fr);gap:8px}
.lamina-rejilla.cuatro .lamina-tarjeta{padding:10px 11px}
.lamina-rejilla.cuatro .lamina-tarjeta-icono{font-size:20px;margin-bottom:6px}
.lamina-rejilla.cuatro .lamina-tarjeta-t{font-size:13px;margin:0!important}
@media(max-width:700px){.lamina-rejilla.cuatro{grid-template-columns:repeat(2,1fr)}}
/* En los tips la imagen va más baja: acompaña la nota, no abre un tema. */
.lamina-recordatorio .lamina-imagen{max-height:150px!important;width:100%;object-fit:cover;border-radius:8px;opacity:.92}

/* Tu reconocimiento: se ve de lejos y celebra al subir de nivel. */
#insignias{margin-top:22px}
#insignias-titulo{margin-bottom:10px;color:#8a481e}
.reconocimiento-tarjeta{position:relative;background:linear-gradient(160deg,#fff6e6,#f7e9cf);border:1px solid #e0cba6;
  border-radius:14px;padding:14px 16px 16px;box-shadow:0 6px 18px #8a5a2318;overflow:hidden}
.reconocimiento-medalla{position:absolute;right:10px;top:8px;font-size:30px;line-height:1;opacity:.9}
.reconocimiento-nivel{margin:0;font:600 26px/1.1 Outfit,sans-serif;letter-spacing:-.4px;color:#30271d}
.reconocimiento-nivel.sube{animation:sube-nivel .9s ease}
@keyframes sube-nivel{0%{transform:scale(1)}30%{transform:scale(1.14);color:#b4531f}100%{transform:scale(1)}}
.reconocimiento-detalle{margin:4px 0 0;font-size:12px;color:#6d5139;font-variant-numeric:tabular-nums}
.reconocimiento-barra{margin-top:10px;height:7px;border-radius:99px;background:#e6d3b4;overflow:hidden}
.reconocimiento-barra span{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,#c8642c,#e0a45c);transition:width .6s ease}
.reconocimiento-siguiente{margin:7px 0 0;font-size:11px;letter-spacing:.02em;color:#8a7a66}
@media(prefers-reduced-motion:reduce){.reconocimiento-nivel.sube{animation:none}.reconocimiento-barra span{transition:none}}
/* Cerrar una pregunta: además de la ×, un botón con texto al pie. */
.pie-dialogo{margin:16px 0 0;padding-top:12px;border-top:1px solid #e4d8c2;text-align:right}
.cerrar-pie{font:inherit;font-size:12.5px;padding:9px 16px;border-radius:999px;border:1px solid #b6a082;background:#fffaf1;color:#30271d;cursor:pointer}
.cerrar-pie:hover{background:#f3e7d3;border-color:#8a6c42}
/* Los gestos de los docentes, arriba de la vista de conducción. */
.avisos-docentes{margin:12px 0 0;padding:12px 16px;border-radius:12px;background:#fff1de;border:1px solid #e0b877;display:grid;gap:8px}
.aviso-docente{margin:0;font-size:14px;color:#6b4a12;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.avisos-docentes .atender{width:auto;font:inherit;font-size:12px;padding:5px 14px;border-radius:999px;border:1px solid #8a6c42;background:#fffaf1;color:#30271d;cursor:pointer}
.avisos-docentes .atender:hover{background:#f3e7d3}
/* El cierre del recinto, plegado: el detalle es largo y empuja el resto. */
#reparto{margin-top:18px}
#reparto-detalle{border:1px solid var(--line,#e4ddcd);border-radius:12px;background:#fffaf1;padding:10px 12px}
#reparto-detalle > summary{cursor:pointer;font:600 15px Outfit,sans-serif;color:#30271d;list-style-position:inside}
#reparto-detalle #reparto-resumen{font-weight:400;color:#6d5139}
#reparto-detalle[open] > summary{margin-bottom:8px}

/* Todo en una pantalla, sin desplazar la página. Jairo, en el ensayo: «es mejor
   que no haya scroll». El mundo se ajusta al alto disponible y, si la columna
   de la derecha no cabe, se desplaza ella sola, no la página entera. */
@media (min-width:1000px){
  body:has(#experiencia:not([hidden])){overflow:hidden}
  body:has(#experiencia:not([hidden])) main{display:flex;flex-direction:column;height:calc(100dvh - 78px);padding-bottom:0}
  body:has(#experiencia:not([hidden])) footer{display:none}
  body:has(#experiencia:not([hidden])) .world-heading{padding:14px 0 10px}
  body:has(#experiencia:not([hidden])) .world-heading h1{font-size:26px}
  #experiencia{display:flex;flex-direction:column;min-height:0;flex:1}
  #experiencia .workspace{flex:1;min-height:0;align-items:stretch}
  .world-pane{display:flex;flex-direction:column;min-height:0}
  .world-pane #mundo{flex:1;min-height:0;height:auto;width:auto;max-width:100%;align-self:center;aspect-ratio:14/9}
  .sidebar{min-height:0;overflow:auto;padding-right:6px;scrollbar-width:thin}
}
/* Insignias compactas: en la barra lateral, tres tarjetas altas empujaban el
   resto fuera de la pantalla. */
#insignias-lista{gap:5px;margin-top:10px}
#insignias-lista .insignia{padding:6px 10px;border-radius:8px}
#insignias-lista .insignia b{font-size:.8rem}
#insignias-lista .insignia span{font-size:.72rem;line-height:1.35;margin-top:1px}
.signals{margin-top:16px}
.signals button{padding:7px 0}
/* El resultado propio, visible de una. */
.marca-acierto,.marca-fallo,.marca-media,.marca-vacia{display:inline-block;margin-top:10px;padding:8px 14px;border-radius:999px;font:600 14px Outfit,sans-serif}
.marca-acierto{background:#e2efd9;color:#2f5c22;border:1px solid #9cc487}
.marca-fallo{background:#fbe0d6;color:#8a331b;border:1px solid #dda48d}
.marca-media{background:#fcf0d6;color:#7a5410;border:1px solid #ddc48d}
.marca-vacia{background:#eee9e0;color:#5c4b37;border:1px solid #d6cab5}
#opciones label.opcion-correcta,#itin-opciones label.opcion-correcta{border-color:#5f9245;background:#eef6e8;box-shadow:inset 3px 0 0 #5f9245}
#opciones label.opcion-fallada,#itin-opciones label.opcion-fallada{border-color:#b4531f;background:#fbe9e0;box-shadow:inset 3px 0 0 #b4531f}

/* Modo inmersivo: el Jardín ocupa la ventana; lo demás se recoge. Se sale con
   el botón o con Escape. */
body.inmersivo .masthead,body.inmersivo .world-heading .eyebrow,body.inmersivo .world-heading h1,
body.inmersivo .sidebar,body.inmersivo footer{display:none}
body.inmersivo main{padding:0!important;height:100dvh!important;max-width:none}
body.inmersivo .world-heading{padding:8px 14px 6px;justify-content:flex-end}
body.inmersivo .workspace{grid-template-columns:minmax(0,1fr)!important;gap:0;height:calc(100dvh - 48px)!important}
body.inmersivo .world-pane{align-items:center}
body.inmersivo .world-pane{flex:1;min-height:0;justify-content:center}
body.inmersivo .world-pane #mundo{flex:0 1 auto!important;height:calc(100dvh - 120px)!important;width:auto!important;max-width:100%!important;max-height:none!important}
body.inmersivo .world-top,body.inmersivo .world-bottom{width:min(100%,calc((100dvh - 120px)*14/9))}
body.inmersivo .connection{width:min(100%,calc((100dvh - 120px)*14/9));margin:0 auto}
body.inmersivo #inmersivo{border-color:#a65026;color:#8a381b;background:#fff4e6}
/* Si la ronda pierde la conexión, quien conduce tiene que verlo. */
#aviso-ronda.aviso-caido{background:#fbe0d6;border-left-color:#b4531f;color:#8a331b;font-weight:600}