/* Coloqui (acompañante y evaluación), muestrario, mando y piezas del juego en equipo */

/* ---------- Acompañante ---------- */
.cq { position: absolute; z-index: 21; right: 16px; bottom: 112px; width: 144px; height: 144px; transition: right .35s var(--ease), bottom .35s var(--ease), width .3s var(--ease), height .3s var(--ease); }
.con-panel .cq { right: 474px; }
.cq-cuerpo { position: absolute; inset: 0; border: 0; padding: 0; background: none; border-radius: 30px; cursor: pointer; }
.cq-cuerpo:focus-visible { outline: 3px solid var(--mint); outline-offset: 2px; }
.cq-char { display: block; width: 100%; height: 100%; pointer-events: none; }
.cq-plegar { position: absolute; left: 4px; top: 4px; width: 28px; height: 28px; border: 0; border-radius: 50%; background: #fff; box-shadow: var(--sombra-s); display: grid; place-items: center; opacity: 0; transition: opacity .2s; }
.cq-plegar span { width: 9px; height: 2px; background: var(--mid); border-radius: 2px; }
.cq:hover .cq-plegar, .cq-plegar:focus-visible, .cq.plegado .cq-plegar { opacity: 1; }
.cq.plegado { width: 56px; height: 56px; }
.cq.plegado .cq-plegar span { box-shadow: 0 0 0 0 var(--mid); }
.cq.plegado .cq-plegar span::after { content: ''; display: block; width: 2px; height: 9px; background: var(--mid); border-radius: 2px; margin: -3.5px 0 0 3.5px; }
.cq-burbuja { position: absolute; right: calc(100% + 4px); bottom: 34px; width: max-content; max-width: 320px; min-width: 200px; padding: 14px 16px 12px; background: #fff; color: var(--ink); border-radius: 20px 20px 6px 20px; box-shadow: 0 2px 6px rgba(9,16,14,.08), 0 18px 46px rgba(9,16,14,.18); border: 1.5px solid var(--line); font-size: .9rem; line-height: 1.45; }
.cq-burbuja.entra { animation: cqEntra .35s var(--ease); }
@keyframes cqEntra { from { opacity: 0; transform: translateY(8px) scale(.97); } }
.cq-txt p { margin: 0 26px 0 0; }
.cq-txt p + p { margin-top: 6px; }
.cq-acc { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.cq-acc:empty { display: none; }
.cq-acc .btn { min-height: 38px; padding: 6px 12px; font-size: .8rem; }
.cq-x { position: absolute; right: 4px; top: 4px; width: 36px; height: 36px; border: 0; background: none; border-radius: 50%; display: grid; place-items: center; color: var(--mid); }
.cq-x .ic { width: 16px; height: 16px; }
.cq-x:hover { background: var(--off); }
.cq-ideas { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 10px; max-height: 50vh; overflow-y: auto; }
.cq-ideas li { display: grid; grid-template-columns: 44px 1fr; gap: 10px; align-items: start; }
.cq-ideas li.hecha { opacity: .55; }
.cq-ideas img { width: 44px; height: auto; border-radius: 6px; box-shadow: var(--sombra-s); }
.cq-ideas strong { display: block; font-size: .86rem; }
.cq-ideas span { display: block; font-size: .78rem; color: var(--text); margin-top: 2px; }
.cq-ideas-b { display: flex; gap: 6px; margin-top: 6px; }
.cq-ideas-b .btn { min-height: 34px; padding: 4px 10px; font-size: .76rem; }
.cq-burbuja:has(.cq-ideas) { max-width: 360px; }
.cq-dice { display: flex; gap: 12px; align-items: center; background: var(--mint-bg); border-radius: 18px; padding: 10px 14px 10px 10px; margin-bottom: 14px; }
.cq-dice p { margin: 0 !important; font-size: .88rem !important; }
.cq-mini { width: 54px; height: 54px; flex: none; display: block; }

/* ---------- Evaluación con Coloqui ---------- */
.cqe { position: fixed; inset: 0; z-index: 75; background: var(--off); display: flex; flex-direction: column; animation: fundido .3s ease; }
.cqe-cab { display: flex; align-items: center; gap: 14px; padding: 12px 20px; border-bottom: 1px solid var(--line); background: #fff; }
.cqe-cab > img { width: 40px; height: auto; }
.cqe-tit { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.cqe-tit strong { font-size: 1rem; }
.cqe-tit span { font-size: .78rem; color: var(--mid); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cqe-pasos { list-style: none; display: flex; gap: 6px; margin: 0 auto; padding: 0; counter-reset: p; }
.cqe-pasos li { counter-increment: p; display: flex; align-items: center; gap: 6px; font-size: .78rem; font-weight: 700; color: #8a9a95; padding: 6px 12px 6px 6px; border-radius: 50px; }
.cqe-pasos li::before { content: counter(p); width: 22px; height: 22px; border-radius: 50%; background: var(--line); color: var(--mid); display: grid; place-items: center; font-size: .7rem; }
.cqe-pasos li.ahora { background: var(--ink); color: #fff; }
.cqe-pasos li.ahora::before { background: var(--mint); color: var(--ink); }
.cqe-pasos li.hecho { color: var(--mint-text); }
.cqe-pasos li.hecho::before { background: var(--mint-pale); color: var(--mint-text); }
.cqe-cuerpo { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(260px, 34%) 1fr; }
.cqe-lado { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 24px; }
.cqe-char { width: min(300px, 26vw); aspect-ratio: 1; }
.cqe-estado { min-height: 1.5em; margin: 0; font-size: .86rem; font-weight: 700; color: var(--mid); text-align: center; }
.cqe-cont { min-height: 0; overflow-y: auto; padding: 32px 40px 28px 8px; display: flex; flex-direction: column; }
.cqe-hero h1 { font-size: clamp(1.8rem, 3.4vw, 2.8rem); line-height: 1.05; letter-spacing: -.035em; font-weight: 800; margin: 0 0 10px; }
.cqe-hero p { color: var(--mid); font-size: 1.02rem; margin: 0 0 18px; max-width: 620px; }
.cqe-nota { font-size: .84rem; color: var(--mid); background: #fff; border: 1.5px dashed var(--line-2); border-radius: 14px; padding: 10px 14px; }
.cqe-bloque { display: grid; grid-template-columns: 70px 1fr; gap: 10px; padding: 20px 0; border-top: 1px solid var(--line); max-width: 760px; }
.cqe-num { font-size: 2.6rem; font-weight: 300; letter-spacing: -.04em; line-height: 1; color: var(--ink); }
.cqe-bloque h2 { margin: 0 0 8px; font-size: 1.5rem; font-weight: 800; letter-spacing: -.03em; }
.cqe-bloque p { color: var(--text); margin: 0 0 8px; }
.cqe-reto { font-size: .95rem; }
.cqe-cuenta { text-align: right; font-size: .74rem; color: var(--mid) !important; margin: 4px 0 0 !important; }
.cqe-foto { display: inline-flex; cursor: pointer; }
.cqe-foto input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.cqe-foto span { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 16px; border: 1.5px dashed var(--line-2); border-radius: 50px; font-weight: 700; font-size: .86rem; background: #fff; }
.cqe-foto small { font-weight: 500; color: var(--mid); }
.cqe-foto input:focus-visible + span { outline: 3px solid var(--mint); outline-offset: 2px; }
.cqe-foto-nota { font-size: .82rem; color: var(--mid) !important; margin-top: 8px !important; }
.cqe-pie { display: flex; justify-content: flex-end; gap: 10px; flex-wrap: wrap; margin-top: auto; padding-top: 20px; }
.cqe-h2 { font-size: clamp(1.5rem, 2.6vw, 2.2rem); letter-spacing: -.03em; font-weight: 800; margin: 0 0 18px; }
.cqe-tablero { display: grid; grid-template-columns: 1fr 1.3fr 1fr; grid-template-areas: "rie cap eva" "dis cap rec"; gap: 12px; }
.cqe-zona { background: #fff; border: 1.5px solid var(--line); border-radius: 22px; padding: 14px 16px; min-height: 120px; transition: border-color .4s, box-shadow .4s, opacity .4s; }
.cqe-zona.z-riesgos { grid-area: rie; } .cqe-zona.z-capacidades { grid-area: cap; } .cqe-zona.z-evaluacion { grid-area: eva; } .cqe-zona.z-dispositivos { grid-area: dis; } .cqe-zona.z-recursos { grid-area: rec; }
.cqe-zona.z-capacidades { background: color-mix(in srgb, var(--zc) 10%, #fff); }
.cqe-zona.pendiente { opacity: .45; }
.cqe-zona.leida { border-color: var(--zc); box-shadow: 0 0 0 3px color-mix(in srgb, var(--zc) 25%, transparent); }
.cqe-zona h3 { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font-size: .86rem; font-weight: 700; color: var(--text); }
.cqe-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.cqe-chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px 5px 5px; border-radius: 50px; background: color-mix(in srgb, var(--zc) 18%, #fff); border: 1.5px solid color-mix(in srgb, var(--zc) 55%, #fff); font-size: .84rem; animation: cqEntra .4s var(--ease) both; }
.cqe-chip b { min-width: 24px; height: 24px; padding: 0 4px; border-radius: 50px; background: #fff; display: grid; place-items: center; font-size: .72rem; }
.cqe-vacia { font-size: .82rem; color: #8a9a95; }
.cqe-log { flex: 1; min-height: 160px; overflow-y: auto; display: flex; flex-direction: column; gap: 12px; padding: 4px 4px 12px; scroll-behavior: smooth; }
.cqe-msg { max-width: 760px; }
.cqe-msg p { margin: 0; font-size: 1.02rem; line-height: 1.55; }
.cqe-quien { display: block; font-size: .7rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 4px; }
.cqe-msg.coloqui { background: #fff; border: 1.5px solid var(--line); border-radius: 6px 22px 22px 22px; padding: 14px 18px; cursor: default; }
.cqe-msg.coloqui .cqe-quien { color: var(--mint-text); }
.cqe-msg.equipo { align-self: flex-end; background: var(--ink); color: #fff; border-radius: 22px 6px 22px 22px; padding: 10px 16px; }
.cqe-msg.equipo .cqe-quien { color: var(--mint); }
.cqe-visual { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; }
.cqe-col h3 { display: flex; align-items: center; gap: 6px; font-size: .9rem; margin: 0 0 8px; }
.cqe-col ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.cqe-tar { display: grid; grid-template-columns: 30px 1fr; gap: 10px; padding: 10px 12px; border-radius: 16px; background: var(--off); font-size: .86rem; animation: cqEntra .45s var(--ease) both; }
.cqe-tar.f { background: var(--mint-bg); }
.cqe-tar.m { background: #fff6e8; }
.cqe-tar-n { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-weight: 800; background: var(--ink); color: #fff; font-size: .8rem; }
.cqe-tar.f .cqe-tar-n { background: var(--mint); color: var(--ink); }
.cqe-tar.m .cqe-tar-n { background: #E8A23B; color: var(--ink); }
.cqe-tar p { margin: 4px 0 0; font-size: .82rem; color: var(--text); }
.cqe-modelos { grid-template-columns: 1fr 1fr; }
.cqe-modelo { display: grid; grid-template-columns: 46px 1fr; gap: 10px; padding: 10px 12px; background: var(--off); border-radius: 16px; font-size: .84rem; }
.cqe-modelo img { width: 46px; height: auto; border-radius: 6px; }
.cqe-modelo p { margin: 2px 0 4px; font-size: .8rem; color: var(--text); }
.cqe-modelo ul { margin: 0; padding-left: 16px; font-size: .8rem; }
.cqe-modelos .cqe-nota { grid-column: 1 / -1; margin: 0; }
.cqe-barra { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding-top: 12px; border-top: 1px solid var(--line); }
.cqe-opc { display: flex; flex-wrap: wrap; gap: 8px; }
.cqe-opc .btn { min-height: 44px; }
.cqe-escribe { flex: 1; min-width: 240px; display: flex; gap: 6px; }
.cqe-escribe input { flex: 1; min-width: 0; min-height: 44px; padding: 8px 14px; border: 1.5px solid var(--line-2); border-radius: 50px; background: #fff; font-size: .9rem; }
.cqe-escribe input:focus { outline: none; border-color: var(--mint-text); box-shadow: 0 0 0 3px rgba(18,227,188,.25); }
.cqe-voz[aria-pressed="true"] { border-color: var(--mint-text); background: var(--mint-bg); }
.cqe-resumen { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; max-width: 820px; }
.cqe-resumen > div { background: #fff; border: 1.5px solid var(--line); border-radius: 20px; padding: 14px 18px; }
.cqe-resumen h3 { margin: 0 0 8px; font-size: .95rem; }
.cqe-resumen ol { margin: 0; padding-left: 18px; font-size: .88rem; color: var(--text); }
.cqe-resumen li { margin-bottom: 4px; }
.cqe-concl { max-width: 820px; font-weight: 600; margin: 16px 0 0; }
.cqe-pie-cierre { justify-content: flex-start; }
.cqe[data-paso="lee"] .cqe-cuerpo, .cqe[data-paso="charla"] .cqe-cuerpo { grid-template-columns: minmax(220px, 28%) 1fr; }
.cqe[data-paso="lee"] .cqe-char { width: min(220px, 22vw); }
body.cqe-abierta { overflow: hidden; }

/* ---------- Muestrario: carrusel horizontal ---------- */
.velo-muestra { z-index: 66; padding: 16px; }
.muestra { --cw: clamp(200px, min(25vw, calc((100dvh - 360px) / 1.413)), 340px); width: min(1280px, 100%); max-height: calc(100dvh - 32px); display: flex; flex-direction: column; background: var(--off); border-radius: 28px; box-shadow: 0 30px 90px rgba(0,0,0,.35); overflow: hidden; animation: visorEntra .45s var(--ease); }
.mu-cab { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; padding: 14px 20px; background: #fff; border-bottom: 1px solid var(--line); }
.mu-tit { display: flex; align-items: center; gap: 10px; }
.mu-tit h2 { margin: 0; font-size: 1.4rem; font-weight: 800; letter-spacing: -.02em; }
.mu-reloj { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.mu-reloj span { font-size: .82rem; color: var(--mid); font-weight: 600; }
.mu-acc { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.mu-tit + .mu-acc { margin-left: auto; }
.mu-coloqui { display: flex; align-items: center; gap: 12px; padding: 12px 24px 0; }
.mu-cq { width: 48px; height: 48px; flex: none; display: block; }
.mu-coloqui p { margin: 0; font-size: .92rem; color: var(--text); max-width: 760px; }
.mu-escena { position: relative; flex: none; }
.mu-carrusel { display: flex; gap: 22px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 26px calc(50% - var(--cw) / 2) 22px; perspective: 1400px; outline: none; cursor: grab; overscroll-behavior-x: contain; }
.mu-carrusel::-webkit-scrollbar { display: none; }
.mu-carrusel.arrastrando { cursor: grabbing; scroll-snap-type: none; }
.mu-carrusel:focus-visible { box-shadow: inset 0 0 0 3px var(--mint); }
.mu-carta { position: relative; flex: none; width: var(--cw); scroll-snap-align: center; transform-origin: 50% 50%; animation: muEntra .7s var(--ease) both; animation-delay: calc(min(var(--k), 5) * 70ms + 80ms); }
@keyframes muEntra { from { opacity: 0; translate: 80px 0; } }
.mu-carta .carta3d { width: 100%; }
.mu-carta .cara { pointer-events: none; -webkit-user-drag: none; }
.mu-carta.centro .carta3d .cara { box-shadow: 0 4px 10px rgba(9,16,14,.14), 0 26px 60px rgba(9,16,14,.24); }
.mu-carta.fav .carta3d .cara { outline: 4px solid #e8577d; outline-offset: -1px; }
.mu-carta.puesta { filter: saturate(.6); }
.mu-votos { position: absolute; left: 10px; top: 10px; display: flex; gap: 2px; }
.mu-voto { width: 28px; height: 28px; border-radius: 50%; color: #fff; font-size: .66rem; font-weight: 800; display: grid; place-items: center; border: 2px solid #fff; box-shadow: var(--sombra-s); }
.mu-puesta { position: absolute; right: 10px; top: 10px; padding: 3px 10px; border-radius: 50px; background: var(--ink); color: #fff; font-size: .68rem; font-weight: 700; }
.mu-flecha { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; width: 52px; height: 52px; border-radius: 50%; border: 0; background: #fff; box-shadow: var(--sombra); display: grid; place-items: center; }
.mu-flecha:hover { background: var(--mint); }
.mu-flecha.izq { left: 20px; } .mu-flecha.der { right: 20px; }
.mu-info { flex: 1; min-height: 0; overflow-y: auto; text-align: center; padding: 0 24px 22px; }
.mu-pos { margin: 0; font-size: .78rem; font-weight: 700; color: var(--mid); letter-spacing: .12em; font-variant-numeric: tabular-nums; }
.mu-nombre { margin: 4px 0 12px; font-size: 1.2rem; font-weight: 800; letter-spacing: -.02em; }
.mu-b { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.mu-b .btn { min-height: 44px; }
.mu-fav[aria-pressed="true"] { border-color: #e8577d; color: #9c1f45; background: #fff0f4; }
.mu-fav b { display: inline-grid; place-items: center; min-width: 22px; height: 22px; border-radius: 50px; background: #c2255c; color: #fff; font-size: .7rem; padding: 0 6px; }
.mu-qe { max-width: 620px; margin: 12px auto 0; font-size: .9rem; color: var(--text); background: #fff; border-radius: 16px; padding: 12px 16px; text-align: left; }
.mu-qe em { font-style: normal; font-weight: 700; color: var(--mint-text); }
body.mu-abierto { overflow: hidden; }

/* ---------- Reloj: pastillas con fondo propio (AA en cualquier fondo, sin rojo) ---------- */
.reloj-pill { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 4px 14px; border-radius: 50px; background: var(--mint-pale); color: var(--ink); font-weight: 800; font-size: 1.15rem; font-variant-numeric: tabular-nums; }
.reloj-pill.r-muestra::before { content: ''; width: 9px; height: 9px; border-radius: 50%; background: var(--mint-dim); animation: puntoLate 1.6s ease-in-out infinite; }
@keyframes puntoLate { 50% { transform: scale(1.5); opacity: .55; } }
.crono { background: #e7efec; color: var(--ink); border-color: #e7efec; }
.crono.corre { background: var(--mint); border-color: var(--mint); color: var(--ink); }
.crono.explora { background: var(--mint-pale); border-color: var(--mint-pale); color: var(--ink); }
.crono.explora .ic { color: var(--mint-text); }
.crono.poco { background: #ffd98a; border-color: #ffd98a; color: #3d2800; }
.crono.fin { background: #ffb020; border-color: #ffb020; color: var(--ink); }
.visor:has(.visor-reloj:not([hidden])) { padding-top: 64px; }
.visor-reloj { position: absolute; left: 24px; top: 16px; display: flex; align-items: center; gap: 8px; font-size: .78rem; font-weight: 600; color: var(--mid); }
.visor-reloj .reloj-pill { font-size: .95rem; min-height: 32px; }
.visor.desde { animation: visorDesde .5s var(--ease) both; transform-origin: var(--ox, 50%) var(--oy, 50%); }
@keyframes visorDesde { from { opacity: 0; transform: scale(.35); } }
.carta3d.pasa-der { animation: pasaDer .45s var(--ease); } .carta3d.pasa-izq { animation: pasaIzq .45s var(--ease); }
@keyframes pasaDer { from { opacity: 0; transform: translateX(40px); } }
@keyframes pasaIzq { from { opacity: 0; transform: translateX(-40px); } }

/* ---------- Sprint enfocado ---------- */
.chip-sprint { display: inline-flex; align-items: center; gap: 8px; min-height: 34px; padding: 0 14px; border-radius: 50px; background: #fff; color: var(--ink); font-size: .8rem; font-weight: 800; white-space: nowrap; box-shadow: inset 0 -3px 0 var(--zc, var(--mint)); }
.chip-sprint .punto { width: 12px; height: 12px; }
.zona-luz.fija { transition: none; box-shadow: 0 0 0 5px var(--ink), 0 0 0 9999px rgba(233, 239, 236, .74); }
.enfoque .o-carta.apagada { opacity: .38; filter: grayscale(.5); pointer-events: none; }
.enfoque .mazo-tab.fuera { opacity: .28; cursor: not-allowed; }
.enfoque .mazo-tab.fuera .cuenta { visibility: hidden; }

/* ---------- Recomiéndame bloqueado hasta el último minuto ---------- */
.recomiendame.bloq { color: var(--mid); background: var(--off); border-color: var(--line); cursor: help; }
.recomiendame.bloq .ic { opacity: .45; }
.recomiendame.pulsa { animation: recomPulsa 1.2s var(--ease) 2; }
@keyframes recomPulsa { 0% { box-shadow: 0 0 0 0 rgba(18, 227, 188, .7); } 100% { box-shadow: 0 0 0 16px rgba(18, 227, 188, 0); } }

/* ---------- Mazo: favoritas ---------- */
.mini-fav { position: absolute; left: 6px; top: 6px; padding: 2px 7px; border-radius: 50px; background: #c2255c; color: #fff; font-size: .66rem; font-weight: 800; box-shadow: var(--sombra-s); }
.mini.favorita img { box-shadow: 0 0 0 3px #e8577d, 0 4px 12px rgba(9,16,14,.12); }
.bandeja .mazo-muestra, .bandeja .mazo-muestra + .recomiendame { flex: 1 1 40%; padding: 6px 10px; }
.fb-muestra { min-height: 38px; padding: 6px 12px; font-size: .82rem; }

/* ---------- Mando y actividad ---------- */
.mando { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 12px; border-radius: 50px; border: 1.5px solid rgba(255,255,255,.2); background: rgba(255,255,255,.06); color: #e7efec; font-weight: 700; font-size: .78rem; white-space: nowrap; }
.mando .ic { width: 16px; height: 16px; }
.mando.mio { border-color: var(--mint); color: var(--mint); }
.menu-t { margin: 6px 12px; font-size: .8rem; color: var(--mid); }
.actividad { position: absolute; z-index: 16; right: 16px; top: calc(var(--barra-h) + 84px); list-style: none; margin: 0; padding: 8px 12px; background: rgba(255,255,255,.92); border-radius: 16px; box-shadow: var(--sombra-s); font-size: .76rem; display: grid; gap: 4px; max-width: 240px; }
.actividad li { display: flex; align-items: center; gap: 6px; }
.con-panel .actividad { right: 474px; }
.cursor { transition: transform .42s linear; }
.o.bloqueada { transition: transform .38s linear; }
.pest-mover button[aria-pressed="true"] { background: var(--ink); color: #fff; }
.pest-mover { margin: 6px 0 0; display: flex; width: 100%; }
.pest-mover button { flex: 1; padding: 0 10px; font-size: .8rem; }
.fac-ayuda { font-size: .78rem; color: var(--mid); margin: 8px 0 0; }
.fac-reloj-et { display: block; font-size: .76rem; color: var(--mid); font-weight: 600; }

/* ---------- Portada: salir y cerrar ---------- */
.pt-item { display: grid; gap: 4px; }
.pt-item-acc { display: flex; gap: 6px; padding-left: 8px; }
.pt-cerrar { min-height: 36px; padding: 0 12px; border: 0; background: none; color: #b9c9c3; font-size: .78rem; font-weight: 700; border-radius: 50px; text-decoration: underline; text-underline-offset: 3px; }
.pt-cerrar:hover { color: #fff; background: rgba(255,255,255,.06); }
.pt-cerrar.peligro { color: #ff9b9b; }

/* ---------- Móvil ---------- */
@media (max-width: 760px) {
  .cq { width: 90px; height: 90px; right: 6px; bottom: calc(var(--bandeja-h, 0px) + 128px); }
  .cq.plegado { width: 44px; height: 44px; }
  .cq-burbuja { position: fixed; left: 10px; right: 10px; top: calc(var(--barra-h) + 10px); bottom: auto; width: auto; max-width: none; min-width: 0; max-height: 58vh; overflow-y: auto; border-radius: 20px; z-index: 30; }
  .cq-ideas { max-height: none; }
  .bandeja .mazo-muestra { flex: none; width: 44px; padding: 0; }
  .bandeja .mazo-muestra span { display: none; }
  .bandeja-tit small { display: none; }
  .actividad { display: none; }
  .mando span { display: none; }
  .mando { padding: 0 9px; }
  .cqe-cab { padding: 10px 12px; gap: 10px; }
  .cqe-cab > img { width: 32px; }
  .cqe-pasos { display: none; }
  .cqe-cab .btn span { display: none; }
  .cqe-cab .btn { margin-left: auto; width: 44px; padding: 0; }
  .cqe-cuerpo, .cqe[data-paso="lee"] .cqe-cuerpo, .cqe[data-paso="charla"] .cqe-cuerpo { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .cqe-lado { flex-direction: row; justify-content: flex-start; padding: 10px 16px 0; }
  .cqe-char, .cqe[data-paso="lee"] .cqe-char { width: 84px; }
  .cqe[data-paso="prep"] .cqe-char, .cqe[data-paso="cierre"] .cqe-char { width: 110px; }
  .cqe-cont { padding: 12px 16px 16px; }
  .cqe-bloque { grid-template-columns: 1fr; gap: 2px; }
  .cqe-num { font-size: 1.6rem; }
  .cqe-tablero { grid-template-columns: 1fr; grid-template-areas: "cap" "rie" "eva" "dis" "rec"; }
  .cqe-visual, .cqe-modelos, .cqe-resumen { grid-template-columns: 1fr; }
  .cqe-msg p { font-size: .95rem; }
  .cqe-escribe { min-width: 100%; }
  .cqe-pie .btn { flex: 1 1 100%; }
  .muestra { --cw: min(72vw, calc((100dvh - 420px) / 1.413)); border-radius: 22px; max-height: calc(100dvh - 16px); }
  .velo-muestra { padding: 8px; }
  .mu-cab { padding: 12px; gap: 8px; }
  .mu-reloj { margin-left: 0; }
  .mu-acc { width: 100%; }
  .mu-acc .btn { flex: 1 1 0; min-width: 0; min-height: 44px; padding: 8px 10px; font-size: .8rem; white-space: normal; line-height: 1.2; }
  .mu-cab { flex-wrap: wrap; }
  .mu-tit h2 { font-size: 1.15rem; }
  .mu-coloqui { display: none; }
  .mu-nombre { font-size: 1.02rem; margin-bottom: 8px; }
  .enfoque .barra-titulo { display: none; }
  .mu-carrusel { gap: 12px; padding: 16px calc(50% - var(--cw) / 2) 14px; }
  .mu-flecha { display: none; }
  .mu-coloqui { padding: 10px 14px 0; }
  .mu-coloqui p { font-size: .82rem; }
  .mu-b .btn { flex: 1 1 40%; padding: 8px 10px; font-size: .8rem; }
  .mu-b [data-mu-ver] span { display: none; }
  .mu-b [data-mu-ver] { flex: 0 0 48px; }
  .chip-sprint { padding: 0 9px; font-size: .7rem; }
  .visor-reloj { left: 16px; top: 16px; }
}
.velo[data-dialogo] { z-index: 95; }

/* ---------- Evaluación: fuente (instantánea o foto) y disponibilidad ---------- */
.cqe-fuentes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 6px 0 12px; }
.cqe-fuente { position: relative; cursor: pointer; }
.cqe-fuente input { position: absolute; opacity: 0; inset: 0; }
.cqe-fuente > span { display: block; height: 100%; padding: 14px 16px; border: 1.5px solid var(--line-2); border-radius: 18px; background: #fff; transition: border-color .2s, background .2s; }
.cqe-fuente strong { display: block; font-size: .95rem; }
.cqe-fuente small { display: block; color: var(--mid); font-size: .82rem; margin-top: 2px; }
.cqe-fuente input:checked + span { border-color: var(--mint-text); background: var(--mint-bg); box-shadow: inset 0 0 0 1.5px var(--mint-text); }
.cqe-fuente input:focus-visible + span { outline: 3px solid var(--mint); outline-offset: 2px; }
.cqe-foto-caja { margin: 4px 0 12px; }
.cqe-foto-nota { font-size: .82rem; color: var(--mid) !important; margin: 8px 0 0 !important; }
.cqe-mini { margin: 0; max-width: 420px; }
.cqe-mini-img { aspect-ratio: 2000 / 1500; border-radius: 16px; background: #fff; border: 1.5px dashed var(--line-2); display: grid; place-items: center; overflow: hidden; }
.cqe-mini-img img { width: 100%; height: 100%; object-fit: contain; background: #fff; }
.cqe-mini-img span { font-size: .82rem; color: var(--mid); padding: 12px; text-align: center; }
.cqe-mini figcaption { font-size: .78rem; color: var(--mid); margin-top: 6px; }
[data-panel="asesor"].bloqueado { opacity: .75; }
[data-panel="asesor"].bloqueado .ic { opacity: .6; }
.cq-prog { display: inline-grid; place-items: center; min-width: 30px; height: 20px; padding: 0 6px; margin-left: 2px; border-radius: 50px; background: rgba(255,255,255,.14); color: #fff; font-size: .68rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.navmovil .cq-prog { background: var(--line); color: var(--ink); margin: 0; position: absolute; transform: translate(16px, -14px); }
.navmovil button { position: relative; }
@media (max-width: 760px) { .cqe-fuentes { grid-template-columns: 1fr; } .btn-barra .cq-prog { display: none; } }
@media (max-height: 760px), (max-width: 400px) { body.en-portada .pie { position: static; padding-bottom: 24px; flex-wrap: wrap; } }

/* ---------- Paso «¿Qué reto queréis resolver?»: dos tarjetas, selector y desplegable (sin scroll) ---------- */
.retos2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; }
.reto-card { position: relative; border: 1.5px solid var(--line-2); border-radius: 24px; background: #fff; transition: border-color .25s, background .25s, box-shadow .35s var(--ease); }
.reto-card.activa { border-color: var(--mint-text); background: var(--mint-bg); box-shadow: 0 14px 34px rgba(18, 227, 188, .12); }
.reto-card-cab { position: relative; display: block; cursor: pointer; padding: 20px 20px 18px 56px; }
.reto-card-cab input { position: absolute; opacity: 0; inset: 0; }
.reto-card-cab::before { content: ''; position: absolute; left: 22px; top: 23px; width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--line-2); background: #fff; transition: all .2s; }
.reto-card.activa .reto-card-cab::before { border-color: var(--mint-text); background: var(--mint); box-shadow: inset 0 0 0 3px #fff; }
.reto-card-cab:has(input:focus-visible) { outline: 3px solid var(--mint); outline-offset: 2px; border-radius: 24px; }
.reto-card-cab strong { display: block; font-size: 1.08rem; }
.reto-card-cab small { display: block; color: var(--mid); font-size: .86rem; margin-top: 2px; }
.reto-card-cuerpo { display: none; padding: 0 18px 18px; }
.reto-card.activa .reto-card-cuerpo { display: grid; gap: 12px; animation: pasoSube .45s var(--ease) both; }
.campo-s { display: block; }
.campo-s > span { display: block; font-size: .78rem; font-weight: 700; color: var(--text); margin: 0 0 5px; }
.campo-s small { font-weight: 500; color: var(--mid); }
.campo-s select, .campo-s input, .campo-s textarea { width: 100%; min-height: 46px; padding: 10px 14px; border: 1.5px solid var(--line-2); border-radius: 14px; background: #fff; font-size: .95rem; line-height: 1.4; }
.campo-s textarea { resize: none; }
.campo-s select { appearance: none; -webkit-appearance: none; padding-right: 40px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%2309100e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right 12px center / 18px no-repeat; cursor: pointer; font-weight: 600; }
.campo-s select:focus, .campo-s input:focus, .campo-s textarea:focus { outline: none; border-color: var(--mint-text); box-shadow: 0 0 0 3px rgba(18, 227, 188, .25); }
.desp { position: relative; }
.desp-btn { width: 100%; display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 8px 14px; border: 1.5px solid var(--line-2); border-radius: 14px; background: #fff; text-align: left; font-size: .95rem; }
.desp-btn:hover { border-color: var(--mint-text); }
.desp-et { font-size: .78rem; font-weight: 700; color: var(--mid); }
.desp-btn strong { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.desp-btn .ic { transform: rotate(90deg); transition: transform .3s var(--ease); width: 18px; height: 18px; }
.desp-btn[aria-expanded="true"] .ic { transform: rotate(-90deg); }
.desp-pop { position: absolute; z-index: 40; left: 0; top: calc(100% + 8px); width: min(640px, calc(100vw - 48px)); display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 12px; background: #fff; border: 1.5px solid var(--line); border-radius: 20px; box-shadow: 0 24px 60px rgba(9, 16, 14, .2); animation: visorEntra .3s var(--ease); }
.productos-mini { display: grid; gap: 6px; align-content: start; }
.prod-mini { position: relative; display: block; cursor: pointer; }
.prod-mini input { position: absolute; opacity: 0; inset: 0; }
.prod-mini > span { display: block; padding: 10px 12px 10px 36px; border-radius: 12px; border: 1.5px solid transparent; transition: background .2s, border-color .2s; }
.prod-mini > span::before { content: ''; position: absolute; left: 12px; top: 14px; width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--line-2); background: #fff; }
.prod-mini:hover > span, .prod-mini input:focus-visible + span { background: var(--off); }
.prod-mini input:focus-visible + span { border-color: var(--mint-text); }
.prod-mini input:checked + span { background: var(--mint-bg); border-color: var(--mint-text); }
.prod-mini input:checked + span::before { border-color: var(--mint-text); background: var(--mint); box-shadow: inset 0 0 0 2px #fff; }
.prod-mini strong { display: block; font-size: .9rem; }
.prod-mini small { display: block; font-size: .76rem; color: var(--mint-text); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.desp-detalle { background: var(--off); border-radius: 14px; padding: 12px 14px; font-size: .82rem; color: var(--text); line-height: 1.45; }
.desp-detalle strong { display: block; font-size: .95rem; color: var(--ink); }
.desp-detalle em { display: block; font-style: normal; font-weight: 700; color: var(--mint-text); margin: 2px 0 6px; }
.desp-detalle p { margin: 0 0 6px; }
.retos2 .reto-card:last-child .desp-pop { left: auto; right: 0; }
body.en-form .pie { display: none; }
.asist, .sala-elegir { padding-bottom: 124px; }
@media (max-width: 760px) {
  .retos2 { grid-template-columns: 1fr; gap: 10px; }
  .reto-card-cab { padding: 15px 16px 13px 50px; }
  .reto-card-cab::before { left: 18px; top: 18px; }
  .reto-card-cab strong { font-size: 1rem; }
  .reto-card-cab small { font-size: .8rem; }
  .reto-card-cuerpo { padding: 0 14px 14px; gap: 10px; }
  .desp-pop { position: fixed; left: 12px; right: 12px; top: auto; bottom: calc(96px + env(safe-area-inset-bottom)); width: auto; grid-template-columns: 1fr; max-height: calc(100dvh - 190px); overflow-y: auto; }
  .desp-detalle { font-size: .78rem; padding: 10px 12px; }
  .asist, .sala-elegir { padding-bottom: 104px; }
  .colocones-xl { grid-template-columns: repeat(5, 1fr); gap: 6px; }
  .colocones-xl .colocon img { aspect-ratio: 1; object-position: top; }
  .colocones-xl .colocon b { font-size: .64rem; padding: 4px 2px 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .colocones-xl .colocon span { border-radius: 14px; border-width: 2px; }
}
@media (max-height: 700px) {
  .asist .paso-ayuda { margin-bottom: 16px; font-size: .92rem; }
  .paso-t, .asist .paso legend.paso-t { font-size: 1.6rem; margin-bottom: 8px !important; }
  .asist, .sala-elegir { padding-top: 8px; }
}
@media (max-height: 760px) {
  .asist .campo { margin-top: 12px; }
  .asist .campo input, .asist .campo textarea { min-height: 46px; padding: 10px 14px; }
  .asist .campo > span { margin-bottom: 4px; font-size: .84rem; }
  .asist .opciones { gap: 8px; margin-top: 0; }
  .asist .opciones + .opciones { margin-top: 10px; }
  .asist .opcion > span { padding: 11px 14px 11px 44px; border-radius: 16px; }
  .asist .opcion > span::before { left: 14px; top: 14px; }
  .asist .opcion strong { font-size: .92rem; }
  .asist .opcion small { font-size: .76rem; line-height: 1.3; }
  .reto-card-cuerpo { gap: 8px; }
  .campo-s select, .campo-s input, .campo-s textarea { min-height: 42px; padding: 8px 12px; }
  .campo-s > span { margin-bottom: 3px; }
}

.mu-carrusel.animando, .mu-carrusel.arrastrando { scroll-snap-type: none; }
.mu-carrusel.moviendo .mu-carta { will-change: transform, opacity; }
.mu-info.cambia .mu-pos, .mu-info.cambia .mu-nombre { animation: infoFunde .32s var(--ease); }
@keyframes infoFunde { from { opacity: 0; transform: translateY(4px); } }
@media (max-height: 700px) { .asist, .sala-elegir { padding-bottom: 96px; } }

/* ---------- Tour de bienvenida ---------- */
.tour { position: fixed; inset: 0; z-index: 120; opacity: 0; transition: opacity .35s var(--ease); }
.tour.ver { opacity: 1; }
.tour-velo { position: absolute; inset: 0; background: rgba(9, 16, 14, .38); backdrop-filter: blur(7px) saturate(.9); -webkit-backdrop-filter: blur(7px) saturate(.9); transition: clip-path .55s var(--ease); }
.tour-aro { position: absolute; border-radius: 22px; box-shadow: 0 0 0 4px var(--aro, var(--mint)), 0 0 0 12px color-mix(in srgb, var(--aro, var(--mint)) 30%, transparent); animation: aroLate 1.8s ease-in-out infinite; pointer-events: none; transition: left .55s var(--ease), top .55s var(--ease), width .55s var(--ease), height .55s var(--ease), opacity .3s; }
.tour-caja { position: absolute; left: 0; top: 0; width: 440px; display: flex; align-items: flex-end; gap: 6px; transition: transform .55s var(--ease); }
.tour-char { width: 118px; height: 118px; flex: none; transition: width .5s var(--ease), height .5s var(--ease); }
.tour-caja.centro { width: 520px; flex-direction: column; align-items: center; text-align: center; }
.tour-caja.centro .tour-char { width: 210px; height: 210px; }
.tour-caja.centro .tour-acc { justify-content: center; }
.tour-bocadillo { flex: 1; min-width: 0; background: #fff; border-radius: 22px 22px 22px 6px; padding: 18px 20px 14px; box-shadow: 0 24px 70px rgba(0, 0, 0, .3); }
.tour-caja.centro .tour-bocadillo { border-radius: 24px; width: 100%; }
.tour-num { margin: 0; font-size: .72rem; font-weight: 800; letter-spacing: .14em; color: var(--mint-text); }
.tour-bocadillo h2 { margin: 4px 0 6px; font-size: 1.2rem; font-weight: 800; letter-spacing: -.02em; }
.tour-txt { margin: 0 0 14px; font-size: .94rem; color: var(--text); line-height: 1.5; }
.tour-acc { display: flex; gap: 8px; justify-content: flex-end; }
.tour-acc .btn { min-height: 42px; }
.tour-saltar { display: block; margin: 8px 0 0 auto; border: 0; background: none; color: var(--mid); font-size: .82rem; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; min-height: 36px; padding: 0 4px; }
.tour-caja.centro .tour-saltar { margin: 8px auto 0; }
.tour-saltar:hover { color: var(--ink); }
.cq.en-tour { opacity: 0; pointer-events: none; }
@media (max-width: 760px) {
  .tour-caja, .tour-caja.centro { width: calc(100vw - 20px); }
  .tour-char { width: 72px; height: 72px; }
  .tour-caja.centro .tour-char { width: 150px; height: 150px; }
  .tour-bocadillo { padding: 14px 16px 10px; }
  .tour-bocadillo h2 { font-size: 1.05rem; }
  .tour-txt { font-size: .88rem; }
}

/* ---------- Interruptor «Solo esta área / Todas las áreas» ---------- */
.area-ctl { display: flex; gap: 6px; margin-top: 8px; }
.area-btn { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 5px; min-height: 36px; padding: 0 8px; white-space: nowrap; border: 1.5px solid var(--line); border-radius: 50px; background: #fff; font-size: .72rem; font-weight: 700; color: var(--text); }
.area-btn .ic { width: 14px; height: 14px; }
.area-btn[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: #fff; }
.area-btn[aria-pressed="true"]::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--mint); }
.area-btn:disabled { opacity: .5; cursor: not-allowed; }

/* ---------- Reloj de la cabecera: misma forma que la etiqueta del sprint, como un conjunto ---------- */
.barra .crono { min-height: 34px; height: 34px; padding: 0 14px; gap: 6px; border-radius: 50px; border: 0; font-size: .8rem; font-weight: 800; letter-spacing: .01em; line-height: 1; box-shadow: inset 0 -3px 0 rgba(9, 16, 14, .12); }
.barra .crono .ic { width: 14px; height: 14px; }
.barra .crono output { font-variant-numeric: tabular-nums; }
.barra .chip-sprint { height: 34px; line-height: 1; }
.barra-centro .chip-sprint:not([hidden]) + .crono { margin-left: -6px; }
.barra .crono.fin { animation: latido 1.2s ease-in-out infinite; }
@media (max-width: 760px) { .barra .crono, .barra .chip-sprint { height: 30px; min-height: 30px; padding: 0 10px; font-size: .72rem; } .barra .crono .ic { width: 12px; height: 12px; } }

@keyframes aroLate { 50% { box-shadow: 0 0 0 4px var(--aro, var(--mint)), 0 0 0 20px color-mix(in srgb, var(--aro, var(--mint)) 12%, transparent); } }
/* Barra de bloque con el panel lateral abierto: compacta, sin cortes */
@media (min-width: 761px) {
  .con-panel .fasebar { gap: 10px; padding-left: 14px; }
  .con-panel .fb-txt span, .con-panel .fb-pasos { display: none; }
  .con-panel .fb-muestra .t-largo, .con-panel .fb-acc .t-largo { display: none; }
  .con-panel .fb-muestra { width: 40px; padding: 0; justify-content: center; }
  .con-panel .fb-txt strong { white-space: normal; line-height: 1.2; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
}
.campo-s select { text-overflow: ellipsis; }

/* Paso del reto en una sola columna: filas apiladas */
.retos-col { grid-template-columns: 1fr; gap: 12px; }
.retos-col .reto-card-cuerpo { padding: 0 18px 16px 56px; }
.retos-col .reto-card:not(.activa) { opacity: .7; }
.retos-col .reto-card:not(.activa):hover { opacity: 1; }
.desp.aparece { animation: pasoSube .45s var(--ease) both; }
.desp-pop.arriba { top: auto; bottom: calc(100% + 8px); }
.retos-col .desp-pop { width: 100%; }
@media (max-width: 760px) { .retos-col .reto-card-cuerpo { padding: 0 14px 14px; } }
@media (max-height: 760px) {
  .paso-t, .asist .paso legend.paso-t { font-size: clamp(1.6rem, 3.4vw, 2.3rem); }
  .reto-card-cab { padding: 13px 18px 11px 52px; }
  .reto-card-cab::before { top: 15px; left: 18px; }
  .asist .paso:has([data-reto-card="propio"].activa) .paso-ayuda { display: none; }
  .retos-col { gap: 8px; }
}

.tour-solo .tour-num, .tour-solo [data-tour-atras] { display: none; }
button.chip-sprint { border: 0; cursor: pointer; font-family: inherit; }
button.chip-sprint:hover { box-shadow: inset 0 -3px 0 var(--zc, var(--mint)), 0 0 0 2px rgba(255, 255, 255, .35); }
.barra .crono, .barra .chip-sprint { flex: none; white-space: nowrap; display: inline-flex; flex-direction: row; align-items: center; } .barra .crono[hidden], .barra .chip-sprint[hidden] { display: none; } .barra-centro { min-width: 0; }
.reto-card.activa { z-index: 2; }

/* ===== Entradas por pasos: bloque único, ritmo vertical con escala de 8 px ===== */
.asist, .sala-elegir, .sala-lista { width: 100%; max-width: 680px; margin: 0 auto; padding: clamp(24px, 7vh, 80px) 28px 40px; flex: 0 0 auto; }
.asist-top { display: flex; align-items: center; gap: 12px; margin: 0 0 16px; }
.asist-n { font-size: .74rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--mint-text); }
.asist-top .asist-prog span { width: 8px; height: 8px; }
.asist-top .asist-prog span.ahora { width: 24px; }
.paso-t, .asist .paso legend.paso-t { font-size: clamp(2rem, 3.4vw, 2.6rem); line-height: 1.08; margin: 0 0 12px !important; }
.paso-ayuda, .asist .paso-ayuda { font-size: 1.02rem; margin: 0 0 32px; }
.asist-pie { position: static; padding: 0; margin: 40px 0 0; background: none; pointer-events: auto; }
.asist-in { max-width: none; margin: 0; display: block; }
.asist-b { margin: 0; display: flex; justify-content: space-between; gap: 12px; }
.asist-b .btn { min-height: 52px; }
.asist .error { margin: 16px 0 0; min-height: 0; }
.asist .error:empty { display: none; }
.nota-s { font-size: .84rem; color: var(--mid); margin: 8px 0 0; }
.elegir-dif { margin: 24px 0 0; font-size: .92rem; color: var(--mid); line-height: 1.55; max-width: 600px; }
/* número de equipos con personas */
.num-equipos { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.num-eq { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; min-height: 72px; padding: 8px 4px; border: 1.5px solid var(--line-2); border-radius: 18px; background: #fff; }
.num-eq-ic { display: flex; flex-wrap: wrap; justify-content: center; gap: 0; max-width: 64px; color: var(--mid); }
.num-eq-ic .ic { width: 16px; height: 16px; margin: -1px; }
.num-eq b { font-size: 1.1rem; }
.num-eq[aria-checked="true"] { border-color: var(--mint-text); background: var(--mint-bg); box-shadow: inset 0 0 0 1.5px var(--mint-text); }
.num-eq[aria-checked="true"] .num-eq-ic { color: var(--mint-text); }
[data-nombres-equipos] { margin: 8px 0 16px; }
/* opciones con icono */
.opciones-ic .opcion > span { padding-left: 104px; min-height: 92px; }
.opciones-ic .opcion > span::before { left: 18px; top: 50%; margin-top: -10px; }
.op-ic { position: absolute; left: 50px; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; border-radius: 12px; background: var(--mint-pale); display: grid; place-items: center; color: var(--mint-text); font-style: normal; }
.op-ic .ic { width: 22px; height: 22px; }
.opcion input:checked + span .op-ic { background: var(--mint); color: var(--ink); }
/* ¡Sala lista! */
.lista-codigo { background: var(--ink); color: #fff; border-radius: 24px; padding: 20px 24px; text-align: center; }
.lista-codigo .ceja { color: var(--mint); }
.lista-codigo strong { display: block; font-size: clamp(2.6rem, 8vw, 4rem); letter-spacing: .22em; font-weight: 800; line-height: 1.1; margin: 4px 0; padding-left: .22em; }
.lista-url { display: block; font-size: .82rem; color: #b9c9c3; word-break: break-all; }
.lista-b { display: flex; gap: 12px; margin: 16px 0 0; flex-wrap: wrap; }
.lista-b .btn { flex: 1 1 200px; min-height: 52px; }
.lista-pasos { list-style: none; counter-reset: lp; margin: 24px 0 32px; padding: 0; display: grid; gap: 12px; }
.lista-pasos li { counter-increment: lp; position: relative; padding: 4px 0 0 44px; color: var(--text); font-size: .95rem; }
.lista-pasos li::before { content: counter(lp); position: absolute; left: 0; top: 0; width: 30px; height: 30px; border-radius: 50%; background: var(--mint); color: var(--ink); font-weight: 800; display: grid; place-items: center; font-size: .85rem; }
.sala-lista [data-lista-panel] { width: 100%; }
/* Tu panel: siguiente paso */
.fac-siguiente { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin: 16px 20px 0; padding: 14px 18px; background: var(--mint-bg); border: 1.5px solid var(--mint-text); border-radius: 20px; }
.fac-siguiente:empty { display: none; }
.fac-sig-et { font-size: .7rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--mint-text); }
.fac-siguiente p { flex: 1 1 320px; margin: 0; font-size: .95rem; color: var(--ink); }
.fac-sig-acc { display: flex; gap: 8px; }
.fac-sig-bloque { width: 100%; justify-content: center; margin: 4px 0 10px; }
@media (max-width: 760px) {
  .asist, .sala-elegir, .sala-lista { padding: 20px 20px 32px; }
  .paso-t, .asist .paso legend.paso-t { font-size: 1.8rem; }
  .paso-ayuda, .asist .paso-ayuda { margin-bottom: 24px; font-size: .96rem; }
  .asist-pie { margin-top: 32px; }
  .opciones-ic .opcion > span { padding-left: 92px; min-height: 84px; }
  .op-ic { left: 44px; width: 36px; height: 36px; }
  .num-eq { min-height: 64px; }
  .fac-siguiente { margin: 12px 12px 0; }
}
@media (max-height: 760px) {
  .asist, .sala-elegir, .sala-lista { padding-top: clamp(16px, 4vh, 32px); padding-bottom: 24px; }
  .paso-ayuda, .asist .paso-ayuda { margin-bottom: 20px; }
  .asist-pie { margin-top: 24px; }
  .asist-top { margin-bottom: 10px; }
  .lista-pasos { margin: 16px 0 20px; gap: 8px; }
  .opciones-ic .opcion > span { min-height: 76px; }
}

.fb-empezar { box-shadow: 0 0 0 0 rgba(18, 227, 188, .6); animation: recomPulsa 1.6s var(--ease) 3; font-weight: 800; }

@media (max-height: 680px) {
  .asist .paso-ayuda { display: none; }
  .paso-t, .asist .paso legend.paso-t { margin-bottom: 16px !important; }
  .sala-lista .paso-ayuda { display: none; }
  .lista-codigo { padding: 12px 16px; }
  .lista-codigo strong { font-size: 2.4rem; }
  .lista-url { display: none; }
  .lista-pasos { margin: 12px 0 16px; }
  .lista-pasos li { font-size: .86rem; }
}
@media (max-width: 760px) {
  .lista-b .btn { flex: 1 1 0; min-width: 0; padding: 8px 10px; font-size: .84rem; white-space: normal; }
}

/* Visor: la información siempre a la vista, junto a la carta */
.visor { grid-template-columns: auto minmax(320px, 440px); }
.visor-lado { display: flex; flex-direction: column; max-height: calc(100dvh - 96px); }
.visor-ayuda { overflow-y: auto; flex: 0 1 auto; margin-bottom: 14px; }
.visor-fav[aria-pressed="true"] { border-color: #e8577d; color: #9c1f45; background: #fff0f4; }
.visor-fav b { display: inline-grid; place-items: center; min-width: 20px; height: 20px; border-radius: 50px; background: #c2255c; color: #fff; font-size: .7rem; padding: 0 5px; }
@media (max-width: 760px) {
  .visor { grid-template-columns: 1fr; max-height: calc(100dvh - 20px); overflow-y: auto; }
  .visor-lado { max-height: none; }
  .visor-ayuda { overflow: visible; }
}

/* M1: en móvil, el bocadillo de Coloqui nunca tapa la barra de bloque */
@media (max-width: 760px) { .pantalla-juego:has([data-fasebar]:not([hidden])) .cq-burbuja { top: calc(var(--barra-h) + 96px); } }
/* M6: título del mazo en una línea en móvil */
@media (max-width: 760px) { .bandeja-tit > div { min-width: 0; flex: 1 1 auto; } .bandeja-tit strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: .92rem; } .bandeja .recomiendame { max-width: 52%; overflow: hidden; } .bandeja .recomiendame span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } }
/* L9: selector del sombrero entero */
.sombrero .fila-add select { max-width: none; flex: 1; margin-left: 0; }
/* L11: foco con contraste suficiente sobre blanco (tinta + halo menta) y menta sobre oscuro */
:focus-visible { outline: 3px solid #09100e; outline-offset: 2px; box-shadow: 0 0 0 6px rgba(18, 227, 188, .55); }
.barra :focus-visible, .pantalla-portada :focus-visible, .lista-codigo :focus-visible, .ctx :focus-visible, .tour-velo :focus-visible { outline-color: #12E3BC; box-shadow: none; }

/* Último minuto: rojo sólido con texto blanco (contraste 5,6:1), en cualquier fondo */
.crono.poco, .barra .crono.poco, .reloj-pill.poco, [data-fac-reloj].poco { background: #C62828 !important; border-color: #C62828 !important; color: #fff !important; animation: latidoSuave 1.6s ease-in-out infinite; }
.crono.poco .ic { color: #fff; }
.reloj-pill.poco::before { background: #fff; }
.crono.fin, .barra .crono.fin, [data-fac-reloj].fin { background: #C62828 !important; border-color: #C62828 !important; color: #fff !important; animation: latidoFuerte .8s ease-in-out infinite; }
[data-fac-reloj].poco, [data-fac-reloj].fin { display: inline-block; padding: 2px 14px; border-radius: 16px; }
@keyframes latidoSuave { 50% { box-shadow: 0 0 0 6px rgba(198, 40, 40, .25); } }
@keyframes latidoFuerte { 50% { transform: scale(1.06); box-shadow: 0 0 0 8px rgba(198, 40, 40, .35); } }

/* Cabecera: equipo y producto con etiquetas, pulsable para ver el reto */
button.barra-equipo { background: none; border: 0; border-left: 1px solid rgba(255,255,255,.14); color: inherit; text-align: left; cursor: pointer; border-radius: 0 12px 12px 0; padding: 4px 10px 4px 14px; font: inherit; transition: background .2s var(--ease); }
button.barra-equipo:hover { background: rgba(255,255,255,.07); }
.barra-titulo .bt-l1, .barra-titulo .bt-l2 { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 34vw; }
.barra-titulo .bt-l1 { font-size: .92rem; color: #fff; }
.barra-titulo .bt-l2 { font-size: .76rem; color: #b9c9c3; }
.barra-titulo .bt-l2 span { font-size: inherit; color: inherit; max-width: none; }
.barra-titulo .bt-et { font-weight: 400; color: #9fb3ac; }
.barra-titulo strong { font-weight: 800; }
.bt-corto { display: none; font-weight: 600; color: #b9c9c3; }
.bt-ic { width: 16px; height: 16px; color: var(--mint); flex: none; opacity: .85; }
@media (max-width: 760px) {
  .barra-titulo .bt-l2 { display: none; }
  .barra-titulo .bt-l1 .bt-et { display: none; }
  .bt-corto { display: inline; }
  .barra-titulo .bt-l1 { max-width: 40vw; font-size: .86rem; }
  button.barra-equipo { padding: 4px 6px 4px 8px; }
}
@media (max-height: 680px) { .asist { padding-top: 10px; } }

/* ===== Evaluación con Coloqui: pantalla completa sin scroll de página ===== */
.cqe { height: 100dvh; overflow: hidden; }
.cqe-cuerpo { overflow: hidden; }
.cqe-cont { overflow: hidden; padding: clamp(14px, 3vh, 32px) 40px clamp(12px, 2.4vh, 24px) 8px; }
.cqe-pie, .cqe-barra { flex: none; margin-top: auto; padding-top: clamp(10px, 1.8vh, 20px); background: var(--off); }
/* Preparación */
.cqe-hero h1 { font-size: clamp(1.5rem, 2.8vw + .4vh, 2.5rem); margin-bottom: 6px; }
.cqe-hero p { margin-bottom: 8px; }
.cqe-bloque { padding: clamp(8px, 1.8vh, 18px) 0; }
.cqe-bloque h2 { font-size: clamp(1.1rem, 1.4vw + .4vh, 1.5rem); margin-bottom: 4px; }
.cqe-num { font-size: clamp(1.6rem, 2.2vw + .5vh, 2.6rem); }
.cqe-bloque p { margin-bottom: 6px; }
.cqe-bloque textarea { min-height: 0; resize: none; }
.cqe-cuenta { display: none; }
.cqe-fila-fuente { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: stretch; }
.cqe-fuentes { margin: 0; }
.cqe-fuente > span { padding: 10px 14px; }
.cqe-mini { width: clamp(110px, 14vw, 170px); max-width: none; }
.cqe-mini-img { border-radius: 12px; }
.cqe-mini figcaption { display: none; }
.cqe-foto-caja { margin: 8px 0 0; }
.cqe-foto-nota { display: none; }
/* Lectura */
.cqe-h2 { font-size: clamp(1.3rem, 2vw + .5vh, 2.1rem); margin-bottom: clamp(8px, 1.6vh, 18px); }
.cqe-tablero { flex: 0 1 auto; min-height: 0; gap: 10px; }
.cqe-zona { min-height: 0; padding: 10px 12px; border-radius: 18px; overflow: hidden; }
.cqe-zona h3 { margin-bottom: 6px; font-size: .8rem; }
.cqe-chips { gap: 4px; }
.cqe-chip { font-size: .74rem; padding: 3px 9px 3px 3px; max-width: 100%; }
.cqe-chip b { min-width: 20px; height: 20px; font-size: .66rem; }
.cqe-chip { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: inline-flex; }
/* Conversación: el hilo es lo único que se desplaza */
.cqe[data-paso="charla"] .cqe-cont { padding-top: 12px; }
.cqe-log { min-height: 0; flex: 1 1 0; -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 28px); mask-image: linear-gradient(to bottom, transparent 0, #000 28px); padding-top: 24px; }
.cqe-msg.coloqui { padding: 10px 14px; }
.cqe-msg p { font-size: .96rem; line-height: 1.5; }
.cqe-visual { gap: 8px; margin-top: 8px; }
.cqe-col ol { gap: 6px; }
.cqe-tar { padding: 8px 10px; font-size: .82rem; grid-template-columns: 24px 1fr; gap: 8px; }
.cqe-tar-n { width: 24px; height: 24px; font-size: .72rem; }
.cqe-tar p { font-size: .78rem; margin-top: 2px; }
.cqe-barra { gap: 8px; }
/* Cierre */
.cqe[data-paso="cierre"] .cqe-cont { justify-content: flex-start; }
.cqe-resumen > div { padding: 10px 14px; }
.cqe-resumen ol { font-size: .84rem; }
.cqe-resumen li { margin-bottom: 2px; }
.cqe-concl { margin-top: 10px; font-size: .92rem; }
.cqe-pie-cierre { gap: 8px; }
.cqe[data-paso="cierre"] .cqe-nota { margin: 8px 0 0; padding: 6px 12px; font-size: .78rem; }
@media (max-height: 760px) and (min-width: 761px) {
  .cqe-char, .cqe[data-paso="lee"] .cqe-char { width: min(190px, 16vw); }
  .cqe-cab { padding: 8px 16px; }
  .cqe-hero p { font-size: .92rem; }
  .cqe-pie .btn-xl { min-height: 48px; padding-block: 8px; }
}
@media (max-width: 760px) {
  .cqe-cab { padding: 8px 10px 8px 64px; position: relative; min-height: 56px; }
  .cqe-cab > img { display: none; }
  .cqe-cuerpo, .cqe[data-paso="lee"] .cqe-cuerpo, .cqe[data-paso="charla"] .cqe-cuerpo { grid-template-rows: 1fr; }
  .cqe-lado { position: absolute; top: 4px; left: 8px; padding: 0; z-index: 2; width: 48px; height: 48px; }
  .cqe-char, .cqe[data-paso="lee"] .cqe-char, .cqe[data-paso="prep"] .cqe-char, .cqe[data-paso="cierre"] .cqe-char { width: 48px; }
  .cqe-estado { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .cqe-cont { padding: 10px 16px 12px; }
  .cqe-hero h1 { font-size: 1.45rem; }
  .cqe-hero p { font-size: .88rem; }
  .cqe-bloque { grid-template-columns: 1fr; padding: 8px 0; }
  .cqe-num { display: none; }
  .cqe-fila-fuente { grid-template-columns: 1fr 92px; gap: 8px; }
  .cqe-fuentes { grid-template-columns: 1fr; gap: 6px; }
  .cqe-fuente > span { padding: 7px 10px; }
  .cqe-fuente strong { font-size: .84rem; }
  .cqe-fuente small { font-size: .74rem; }
  .cqe-mini { width: 92px; }
  .cqe-pie { flex-wrap: nowrap; }
  .cqe-pie .btn { flex: 1 1 0; min-width: 0; min-height: 46px; padding: 8px 10px; font-size: .86rem; white-space: normal; }
  .cqe-tablero { grid-template-columns: 1fr 1fr; grid-template-areas: "cap cap" "rie eva" "dis rec"; gap: 6px; }
  .cqe-zona { padding: 7px 9px; border-radius: 14px; }
  .cqe-zona h3 { font-size: .74rem; margin-bottom: 4px; }
  .cqe-chip { font-size: .68rem; }
  .cqe-opc { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; width: 100%; padding-bottom: 2px; }
  .cqe-opc .btn { flex: none; min-height: 40px; }
  .cqe-barra { flex-direction: column; align-items: stretch; }
  .cqe-voz { display: none; }
  .cqe-resumen { gap: 8px; }
  .cqe-pie-cierre { flex-wrap: wrap; }
  .cqe-pie-cierre .btn { flex: 1 1 45%; min-height: 42px; font-size: .8rem; }
}
@media (max-width: 760px) and (max-height: 700px) {
  .cqe-hero p, .cqe-bloque > div > p:not(.cqe-reto) { display: none; }
  .cqe-concl { display: none; }
  .cqe[data-paso="cierre"] .cqe-nota { display: none; }
}
.cqe-resumen { flex: 0 1 auto; min-height: 0; overflow-y: auto; }

/* Recomiéndame: nunca más ancho que su columna, ni siquiera durante el pulso */
.bandeja { overflow-x: hidden; }
.bandeja .recomiendame { min-width: 0; max-width: 100%; overflow: hidden; font-variant-numeric: tabular-nums; }
.bandeja .recomiendame span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.recomiendame.pulsa { animation: recomPulsaDentro 1.2s var(--ease) 2; }
@keyframes recomPulsaDentro { 0% { box-shadow: inset 0 0 0 0 rgba(18, 227, 188, .9); background: var(--mint-bg); } 60% { box-shadow: inset 0 0 0 3px rgba(18, 227, 188, .9); } 100% { box-shadow: inset 0 0 0 0 rgba(18, 227, 188, 0); } }

/* Cerrar partida / salir de la sala: X en la esquina */
.pt-item { position: relative; }
.pt-item .pt-seguir { padding-right: 52px; }
.pt-x { position: absolute; top: 50%; right: 4px; transform: translateY(-50%); width: 44px; height: 44px; display: grid; place-items: center; border: 0; border-radius: 12px; background: none; color: #b9c9c3; cursor: pointer; transition: background .2s, color .2s; }
.pt-x .ic { width: 18px; height: 18px; }
.pt-x:hover { background: rgba(255,255,255,.1); color: #fff; }
.pt-x:focus-visible { outline: 3px solid var(--mint); outline-offset: -3px; box-shadow: none; }
.partida { position: relative; padding-right: 52px; }
.pt-x-claro { color: var(--mid); }
.pt-x-claro:hover { background: var(--off); color: var(--ink); }
.pt-x-claro:focus-visible { outline-color: var(--ink); }

/* Formulario en acordeón */
.fa-cab { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; margin: 4px 0 12px; }
.fa-prog { font-size: .84rem; color: var(--mid); }
.fa-prog b { color: var(--ink); }
.fa-barra { flex: 1 1 80px; height: 6px; border-radius: 6px; background: var(--line); overflow: hidden; }
.fa-barra i { display: block; height: 100%; background: var(--mint); border-radius: 6px; transition: width .4s var(--ease); }
.fa-cab .enlace { font-size: .8rem; min-height: 32px; }
.fa { display: grid; gap: 8px; }
.fa-sec { border: 1.5px solid var(--line); border-radius: 16px; background: #fff; overflow: hidden; transition: border-color .2s, box-shadow .2s; }
.fa-sec.ahora { border-color: var(--fc); box-shadow: 0 0 0 3px color-mix(in srgb, var(--fc) 30%, transparent); }
.fa-h { margin: 0; font-size: inherit; }
.fa-bt { width: 100%; display: flex; align-items: center; gap: 12px; padding: 10px 12px; min-height: 60px; border: 0; background: none; text-align: left; cursor: pointer; font: inherit; color: var(--ink); }
.fa-bt:hover { background: var(--off); }
.fa-ic { flex: none; width: 30px; height: 30px; border-radius: 10px; background: var(--fc); display: grid; place-items: center; color: #fff; }
.fa-ic .ic { width: 16px; height: 16px; }
.fa-tt { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.fa-tt strong { font-size: .92rem; }
.fa-tt small { font-size: .76rem; color: var(--mid); }
.fa-ahora { flex: none; font-size: .66rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; padding: 3px 8px; border-radius: 50px; background: var(--fc); color: var(--ink); }
.fa-est { flex: none; font-size: .72rem; font-weight: 700; padding: 3px 9px; border-radius: 50px; background: var(--off); color: var(--mid); }
.fa-est.medias { background: #fff3dc; color: #6b4300; }
.fa-est.hecho { background: var(--mint-pale); color: var(--mint-text); }
.fa-chev { flex: none; width: 16px; height: 16px; color: var(--mid); transform: rotate(90deg); transition: transform .3s var(--ease); }
.fa-sec.abierta .fa-chev { transform: rotate(-90deg); }
.fa-cuerpo { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .35s var(--ease); }
.fa-sec.abierta .fa-cuerpo { grid-template-rows: 1fr; }
.fa-in { min-height: 0; overflow: hidden; padding: 0 14px; }
.fa-sec.abierta .fa-in { padding-bottom: 12px; }
.fa-in .f-sec { margin: 4px 0 8px; }
@media (max-width: 760px) { .fa-tt small { display: none; } .fa-bt { min-height: 54px; } }

.clave-gen { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; }
.clave-gen-et { flex: 1 1 100%; font-size: .78rem; font-weight: 700; color: var(--mid); }
.clave-gen-v { font-size: 1.25rem; font-weight: 800; letter-spacing: .02em; padding: 6px 14px; border-radius: 12px; background: var(--mint-bg); border: 1.5px dashed var(--mint-text); font-variant-numeric: tabular-nums; }
.clave-gen-b { display: flex; align-items: center; gap: 10px; }
.lista-clave { display: block; font-size: 1.05rem; color: #fff; margin: 2px 0 4px; }
.lista-clave b { color: var(--mint); letter-spacing: .04em; }

.tour-txt p { margin: 0 0 8px; }
.tour-txt p:last-child { margin-bottom: 0; }
.tour-caja.ancha { width: 470px; }
@media (max-width: 760px) { .tour-caja.ancha { width: calc(100vw - 20px); } .tour-caja.ancha .tour-txt { max-height: 38vh; overflow-y: auto; } }

/* Cursores de compañeros: capa propia en coordenadas de pantalla, por encima de cartas, notas y la carta arrastrada,
   por debajo de la barra de bloque, Coloqui, paneles, menús y diálogos */
.capa-cursores-pantalla { position: absolute; inset: 0; z-index: 20; pointer-events: none; overflow: hidden; }
.capa-cursores-pantalla .capa-cursores { position: absolute; left: 0; top: 0; width: 0; height: 0; }
.fantasma { z-index: 19; }

/* Formulario colaborativo */
.f-escribe { display: flex; align-items: center; gap: 4px; font-size: .74rem; color: var(--mid); font-style: italic; margin: 2px 0 4px; }
.f-escribe i { width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-left: 4px; }
.f-aviso { margin: 4px 0 0; font-size: .76rem; color: var(--mint-text); font-weight: 600; }
.f-aviso .enlace { font-size: inherit; min-height: 0; padding: 0; }
textarea.f-llega { box-shadow: 0 0 0 3px rgba(18, 227, 188, .45); transition: box-shadow .4s; }

/* Coloquio por sombreros: tarjetas guía */
.som-acc { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 0 0 12px; }
.som-tuyo { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 50px; background: var(--off); font-size: .86rem; }
.som-tuyo i { width: 14px; height: 14px; border-radius: 50%; background: var(--hc); border: 1.5px solid var(--ink); }
.som-rejilla { display: grid; gap: 10px; }
.som-card { border: 1.5px solid var(--line); border-left: 6px solid var(--hc); border-radius: 16px; padding: 12px 14px; background: #fff; }
.som-card[style*="#ffffff"] { border-left-color: #c9d6d1; }
.som-card.tuyo { box-shadow: 0 0 0 3px rgba(18, 227, 188, .45); border-color: var(--mint-text); }
.som-cab { display: flex; align-items: center; gap: 10px; }
.som-gorro { width: 30px; height: 30px; border-radius: 50%; background: var(--hc); border: 2px solid var(--ink); flex: none; }
.som-cab strong { display: block; font-size: .95rem; }
.som-cab small { color: var(--mid); font-size: .78rem; }
.som-chip { margin-left: auto; font-size: .68rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; padding: 3px 9px; border-radius: 50px; background: var(--mint); color: var(--ink); }
.som-foco { margin: 8px 0 6px !important; font-size: .86rem !important; font-weight: 600; }
.som-preg { margin: 0 0 8px; padding: 0; list-style: none; display: grid; gap: 4px; }
.som-preg li { position: relative; padding-left: 20px; font-size: .84rem; color: var(--text); }
.som-preg li::before { content: '→'; position: absolute; left: 0; color: var(--mint-text); font-weight: 700; }
.som-quien { display: flex; align-items: center; gap: 8px; font-size: .78rem; color: var(--mid); }
.som-quien select { flex: 1; min-height: 40px; border-radius: 10px; border: 1.5px solid var(--line-2); padding: 4px 8px; font-size: .86rem; background: #fff; }
.som-notas { margin-top: 14px; }
.som-notas textarea { width: 100%; border: 1.5px solid var(--line-2); border-radius: 10px; padding: 8px 10px; font-size: .9rem; resize: vertical; margin-top: 4px; }

/* ===== Teléfonos ===== */
.movil-aviso { text-align: center; }
.movil-cq { display: inline-flex; gap: 10px; justify-content: center; align-items: center; width: 72px; height: 58px; border-radius: 20px; background: var(--mint); margin: 0 auto 10px; }
.movil-cq i { width: 12px; height: 7px; border: 3px solid var(--ink); border-bottom: 0; border-radius: 12px 12px 0 0; }
.movil-b { display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.girar, .cajon-bt { display: none; }
@media (pointer: coarse) and (orientation: portrait) and (max-width: 599px) {
  body:not(.sin-girar) #juego:not([hidden]) .girar { display: flex; position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(var(--nav-movil, 64px) + 10px); z-index: 22; align-items: center; gap: 8px; padding: 6px 6px 6px 12px; border-radius: 50px; background: rgba(9, 16, 14, .88); color: #fff; font-size: .78rem; width: max-content; max-width: calc(100vw - 24px); }
  .girar-ic { width: 18px; height: 18px; border: 2px solid var(--mint); border-radius: 4px; animation: girarIc 2.4s var(--ease) infinite; flex: none; }
  .girar-x { width: 32px; height: 32px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .12); color: #fff; font-size: 1.1rem; flex: none; }
}
@keyframes girarIc { 0%, 30% { transform: rotate(0); } 60%, 100% { transform: rotate(-90deg); } }
/* Teléfono en horizontal: cabecera fina, mazos en cajón lateral plegable, Coloqui mini */
@media (pointer: coarse) and (orientation: landscape) and (max-height: 500px) {
  :root { --barra-h: 46px; }
  .barra { height: var(--barra-h); padding: 0 8px; gap: 6px; }
  .barra-logo { display: none; }
  .barra-icono { display: block; }
  .barra-titulo .bt-l2 { display: none; }
  .barra .btn-barra span { display: none; }
  .barra .btn-barra { width: 40px; padding: 0; justify-content: center; }
  .bandeja { transform: translateX(calc(-100% - 20px)); transition: transform .35s var(--ease); top: calc(var(--barra-h) + 6px) !important; bottom: 6px !important; z-index: 23; }
  body.cajon-abierto .bandeja { transform: none; }
  #juego:not([hidden]) ~ .cajon-bt, body:has(#juego:not([hidden])) .cajon-bt { display: flex; position: fixed; left: 0; top: 50%; transform: translateY(-50%); z-index: 24; writing-mode: vertical-rl; rotate: 180deg; padding: 14px 8px; border: 0; border-radius: 0 12px 12px 0; background: var(--ink); color: #fff; font-weight: 800; font-size: .78rem; letter-spacing: .08em; min-width: 36px; min-height: 88px; align-items: center; justify-content: center; }
  body.cajon-abierto:has(#juego:not([hidden])) .cajon-bt { left: 286px; }
  body:has(#juego:not([hidden])) .pie { display: none; }
  .cq { transform: scale(.62); transform-origin: right bottom; }
  .fasebar { top: calc(var(--barra-h) + 4px) !important; padding: 4px 8px !important; }
  .fasebar .fb-txt span { display: none; }
  .zoom { bottom: 6px !important; right: 6px !important; }
  .herr { top: auto !important; bottom: 6px !important; left: 44px !important; flex-direction: row !important; }
  .pantalla-portada .pt-marco, .pt-marco { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto 1fr; grid-template-areas: "cab escena" "texto escena"; padding: 12px 20px 56px; min-height: 100dvh; }
  .pt-titulo { font-size: 2rem !important; margin: 8px 0 !important; }
  .pt-entradilla { display: none; }
  .pt-escena { align-self: center; max-width: none; aspect-ratio: 1.42; }
  .pt-acciones { margin-top: 12px !important; }
  .pt-btn { min-height: 46px !important; }
}

/* ===== Final en sala: escenario, cierre, cartas clave, espejo de Coloqui ===== */
.btn-linea-claro { border-color: rgba(255,255,255,.35); color: #fff; background: transparent; }
.btn-linea-claro:hover { background: rgba(255,255,255,.08); border-color: #fff; }
.enlace-claro { color: #b9c9c3; }
.escena, .cierre { position: fixed; inset: 0; z-index: 72; background: radial-gradient(120% 90% at 70% 10%, #133127 0%, #0b1712 55%, #09100e 100%); color: #fff; display: flex; flex-direction: column; height: 100dvh; overflow: hidden; }
.escena[hidden], .cierre[hidden] { display: none; }
.esc-cab, .cie-cab { flex: none; display: flex; align-items: center; gap: 16px; padding: 14px 24px; }
.esc-logo { width: 24px; height: auto; }
.esc-tit { flex: 1; min-width: 0; }
.esc-ceja { display: block; font-size: .72rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--mint); }
.esc-tit h2 { margin: 2px 0 0; font-size: clamp(1.3rem, 2.4vw, 2.1rem); font-weight: 800; letter-spacing: -.02em; line-height: 1.15; }
.esc-tit h2 strong { color: var(--mint); }
.esc-habla { font-weight: 600; color: #cfe0da; font-size: .8em; }
.esc-reloj { flex: none; min-width: 120px; text-align: center; font-size: clamp(1.8rem, 3.6vw, 2.8rem); font-weight: 800; font-variant-numeric: tabular-nums; padding: 4px 18px; border-radius: 18px; background: rgba(255,255,255,.08); border: 1.5px solid rgba(255,255,255,.18); }
.esc-reloj.corre { background: var(--mint); color: var(--ink); border-color: var(--mint); }
.esc-reloj.poco { background: #C62828; color: #fff; border-color: #C62828; animation: latidoSuave 1.6s ease-in-out infinite; }
.esc-reloj.fin { background: #C62828; color: #fff; border-color: #C62828; animation: latidoFuerte .8s ease-in-out infinite; }
.esc-cuerpo { flex: 1; min-height: 0; display: grid; grid-template-columns: 1fr minmax(220px, 300px); gap: 16px; padding: 0 24px; }
.esc-tablero { margin: 0; min-height: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.esc-tablero img { max-width: 100%; max-height: calc(100% - 28px); object-fit: contain; border-radius: 16px; box-shadow: 0 24px 60px rgba(0,0,0,.45); }
.esc-tablero figcaption { margin-top: 8px; font-weight: 700; color: var(--mint); font-size: .92rem; }
.esc-cargando { color: #b9c9c3; }
.esc-video { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; padding: 40px; border: 2px dashed rgba(255,255,255,.25); border-radius: 24px; }
.esc-video strong { font-size: 1.5rem; }
.esc-video span { color: #b9c9c3; }
.esc-lado { min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 14px; padding-bottom: 8px; }
.esc-l { margin: 0 0 6px; font-size: .7rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #9fb3ac; }
.esc-cola ol { list-style: none; margin: 0 0 10px; padding: 0; display: grid; gap: 6px; }
.esc-cola li { display: flex; align-items: center; gap: 8px; font-weight: 700; }
.esc-cola li img { border-radius: 8px; object-fit: cover; object-position: top; }
.esc-hechos { margin: 0; color: #cfe0da; font-size: .88rem; }
.esc-fac { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius: 18px; padding: 14px; display: flex; flex-direction: column; gap: 10px; }
.esc-fac[hidden] { display: none; }
.esc-fac-t { margin: 0; font-weight: 700; }
.esc-fac-b { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.esc-fac-b .btn { min-height: 44px; padding: 6px 10px; font-size: .84rem; }
.esc-mostrar { display: grid; gap: 4px; font-size: .78rem; color: #b9c9c3; }
.esc-mostrar select { min-height: 40px; border-radius: 10px; border: 1.5px solid rgba(255,255,255,.25); background: #0d1a15; color: #fff; padding: 4px 8px; }
.esc-op { display: flex; gap: 8px; align-items: center; font-size: .84rem; color: #cfe0da; }
.esc-terminado { margin: 0; padding: 8px 10px; border-radius: 10px; background: rgba(18,227,188,.15); color: #b8fbe9; font-weight: 700; font-size: .86rem; }
.esc-preg p { margin: 0 0 6px; font-size: .84rem; color: #e6efec; }
.esc-preg small { color: #9fb3ac; }
.esc-nada { color: #9fb3ac !important; }
.esc-pie { flex: none; display: flex; justify-content: center; gap: 12px; padding: 12px 24px 18px; flex-wrap: wrap; }
.esc-pie:empty { display: none; }
.esc-pie .btn { min-height: 48px; }
.esc-aplausos { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.esc-aplausos span { position: absolute; bottom: -40px; font-size: 2.4rem; animation: subeAplauso 2.2s var(--ease) forwards; }
@keyframes subeAplauso { 0% { transform: translateY(0) scale(.6); opacity: 0; } 15% { opacity: 1; } 100% { transform: translateY(-70vh) scale(1.2); opacity: 0; } }
.esc-sorteo { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; background: rgba(9,16,14,.86); gap: 10px; z-index: 2; }
.esc-sorteo[hidden] { display: none; }
.esc-sorteo p { margin: 0; color: var(--mint); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; font-size: .8rem; }
.esc-sorteo strong { font-size: clamp(2rem, 6vw, 4rem); }
.esc-sorteo ol { margin: 0; padding-left: 1.4em; text-align: left; font-size: 1.6rem; font-weight: 800; }
.esc-aviso { position: absolute; left: 50%; top: 90px; transform: translateX(-50%); margin: 0; padding: 8px 18px; border-radius: 50px; background: #f59f00; color: #2b1d00; font-weight: 800; z-index: 3; }
.esc-aviso[hidden] { display: none; }
.esc-volver { position: fixed; right: 16px; bottom: 84px; z-index: 71; box-shadow: 0 10px 30px rgba(0,0,0,.25); }
.esc-volver[hidden] { display: none; }
.cie-cab { align-items: flex-start; }
.cie-cab > div { flex: 1; }
.cie-cab h2 { margin: 4px 0 4px; font-size: clamp(1.4rem, 2.6vw, 2.2rem); font-weight: 800; letter-spacing: -.02em; }
.cie-cab p { margin: 0; color: #cfe0da; }
.cie-galeria { flex: 1; min-height: 0; overflow-y: auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; padding: 4px 24px 12px; align-content: start; }
.cie-galeria.uno { grid-template-columns: minmax(240px, 520px); justify-content: center; }
.cie-eq { background: #fff; color: var(--ink); border-radius: 18px; padding: 12px; display: flex; flex-direction: column; gap: 8px; border: 3px solid transparent; transition: transform .4s var(--ease), border-color .4s; }
.cie-eq header { display: flex; align-items: center; gap: 8px; }
.cie-eq header img { border-radius: 10px; object-fit: cover; object-position: top; }
.cie-eq header div { flex: 1; min-width: 0; line-height: 1.25; }
.cie-eq header small { display: block; color: var(--mid); font-size: .74rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cie-eq.votado { border-color: var(--mint); }
.cie-eq.ganador { border-color: #f5b400; transform: scale(1.03); box-shadow: 0 0 0 6px rgba(245,180,0,.25), 0 20px 50px rgba(0,0,0,.35); }
.cie-trofeo { font-size: 1.6rem; }
.cie-propio { margin: 0; text-align: center; font-size: .8rem; color: var(--mid); font-weight: 700; }
.cie-barra { display: flex; align-items: center; gap: 8px; }
.cie-barra i { flex: 1; height: 10px; border-radius: 10px; background: var(--line); position: relative; overflow: hidden; }
.cie-barra i::after { content: ''; position: absolute; inset: 0; width: calc(var(--v) * 100%); background: var(--mint); border-radius: 10px; }
.cierre.revela .cie-barra i::after { animation: crecerBarra 1.6s var(--ease); }
@keyframes crecerBarra { from { width: 0; } }
.cie-pie { flex: none; display: flex; justify-content: center; gap: 12px; padding: 12px 24px 18px; flex-wrap: wrap; }
.fac-eq-cq { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: .8rem; padding: 6px 0; border-top: 1px solid var(--line); }
.asomar p { margin: 0 0 8px; font-size: .9rem; }
.asomar p.eq { color: var(--mint-text); }
.orden-l { list-style: none; padding: 0; margin: 8px 0 0; display: grid; gap: 6px; }
.orden-l li { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border: 1.5px solid var(--line-2); border-radius: 12px; background: #fff; cursor: grab; }
.orden-n { width: 26px; height: 26px; border-radius: 50%; background: var(--mint); display: grid; place-items: center; font-weight: 800; font-size: .8rem; }
.orden-nom { flex: 1; font-weight: 700; }
.clave-lista { list-style: none; padding: 0; margin: 8px 0 0; display: grid; gap: 8px; }
.clave-lista li { display: flex; align-items: center; gap: 10px; padding: 6px 8px; border: 1.5px solid var(--line); border-radius: 14px; }
.clave-lista li.on { border-color: var(--mint-text); background: var(--mint-bg); }
.clave-lista img { border-radius: 6px; flex: none; }
.clave-lista span { flex: 1; min-width: 0; line-height: 1.3; font-size: .86rem; }
.clave-lista small { display: block; color: var(--mid); font-size: .74rem; }
.cqe-mini-espejo { width: min(420px, 100%) !important; margin-top: 12px; }
.cqe-esp-opc { margin: 6px 0 0; font-size: .8rem; color: var(--mid); }
.cqe-barra-espejo { justify-content: space-between; }
.cqe-props { display: grid; gap: 6px; margin: 0 0 8px; flex: none; }
.cqe-props[hidden] { display: none; }
.cqe-prop { display: flex; align-items: center; gap: 8px; padding: 6px 8px 6px 12px; border-radius: 14px; background: var(--mint-bg); border: 1.5px solid var(--mint-text); font-size: .86rem; }
.cqe-prop span { flex: 1; min-width: 0; }
@media (max-width: 900px), (max-height: 520px) {
  .esc-cab, .cie-cab { padding: 8px 12px; gap: 10px; }
  .esc-logo { display: none; }
  .esc-cuerpo { grid-template-columns: 1fr; grid-template-rows: 1fr auto; padding: 0 12px; gap: 8px; }
  .esc-lado { max-height: 34vh; }
  .esc-reloj { min-width: 84px; padding: 2px 10px; }
  .esc-pie { padding: 6px 12px 10px; gap: 8px; }
  .esc-pie .btn { min-height: 44px; padding: 6px 14px; }
  .esc-min { font-size: .76rem; }
  .cie-galeria { padding: 4px 12px 8px; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
}
@media (orientation: landscape) and (max-height: 520px) {
  .esc-cuerpo { grid-template-columns: 1fr minmax(180px, 240px); grid-template-rows: 1fr; }
  .esc-lado { max-height: none; }
  .esc-tit h2 { font-size: 1.1rem; }
  .esc-reloj { font-size: 1.4rem; }
}

/* Coloquio: sombreros plegados, uno abierto a la vez */
.som-intro { margin: 0 0 10px; }
.som-lista { display: grid; gap: 6px; margin-top: 10px; }
.som-sec { border-left: 6px solid var(--hc); }
.som-sec[style*="#ffffff"] { border-left-color: #c9d6d1; }
.som-sec.tuyo { box-shadow: 0 0 0 3px rgba(18, 227, 188, .45); }
.som-sec .fa-bt { min-height: 50px; padding: 6px 12px; }
.som-sec .som-gorro { width: 22px; height: 22px; }
.som-sec .fa-tt strong { font-size: .88rem; }
.som-notas { margin-top: 0; }
.som-notas .fa-bt { min-height: 50px; }
.som-sec .fa-in .btn { margin: 0 0 6px; }

.cq-acc .cq-sec { font-size: .78rem; min-height: 32px; padding: 0 6px; color: var(--mid); }
.cq-acc .cq-sec:first-of-type { margin-left: auto; }

/* Puerta de la comunidad */
.puerta { position: fixed; inset: 0; z-index: 95; display: grid; place-items: center; padding: 20px; background: radial-gradient(120% 90% at 70% 10%, #133127 0%, #0b1712 55%, #09100e 100%); overflow-y: auto; }
.puerta[hidden] { display: none; }
.puerta-caja { width: 100%; max-width: 520px; background: #fff; border-radius: 28px; padding: 32px 28px; box-shadow: 0 30px 80px rgba(0,0,0,.4); text-align: center; position: relative; }
.puerta-caja .movil-cq { position: absolute; top: -28px; right: 28px; }
.puerta-logo { width: 56px; height: auto; }
.puerta-caja h1 { font-size: clamp(1.4rem, 3.4vw, 1.9rem); line-height: 1.15; letter-spacing: -.02em; margin: 12px 0 8px; }
.puerta-caja p { color: var(--mid); margin: 0 0 16px; }
.puerta-caja form { text-align: left; display: grid; gap: 8px; }
.puerta-caja .btn-xl { width: 100%; }
.puerta-unirse { margin: 18px 0 0 !important; display: flex; align-items: center; justify-content: center; gap: 10px; flex-wrap: wrap; }
body.con-puerta { overflow: hidden; }

.som-sec .fa-bt { min-height: 44px; padding: 4px 12px; }
.som-sec .fa-in { padding-bottom: 6px; }
.som-sec .som-foco { margin: 2px 0 4px !important; font-size: .84rem !important; }
.som-sec .som-preg { gap: 2px; margin-bottom: 6px; }
.som-sec .som-preg li { font-size: .82rem; }
.som-sec .som-quien select { min-height: 36px; }
/* Teléfono en horizontal: lista de sombreros a la izquierda y el abierto a la derecha */
@media (orientation: landscape) and (max-height: 520px) {
  .panel:has(.som-lista) { width: min(640px, 78vw) !important; top: var(--barra-h) !important; bottom: 0 !important; }
  .som-intro { display: none; }
  .som-acc { margin-bottom: 6px; }
  .som-notas .fa-bt, .som-sec .fa-bt { min-height: 36px; padding: 2px 10px; }
  .som-notas .fa-tt small { display: none; }
  .som-lista { grid-template-columns: minmax(0, 42%) minmax(0, 1fr); column-gap: 10px; row-gap: 4px; align-items: start; margin-top: 6px; }
  .som-sec { display: contents; }
  .som-sec .fa-h { grid-column: 1; border-left: 5px solid var(--hc); border-radius: 10px; background: #fff; }
  .som-sec .fa-cuerpo { display: none; }
  .som-sec.abierta .fa-cuerpo { display: block; grid-column: 2; grid-row: 1 / span 5; }
  .som-sec.abierta .fa-h { background: var(--mint-bg); }
  .som-sec .fa-chev { display: none; }
}

/* Acordeones dentro del panel: sin el margen de los h3 del panel y más compactos */
.panel-cuerpo .fa-h { margin: 0; font-size: inherit; }
.panel-cuerpo .som-preg li { margin: 0 0 3px; font-size: .82rem; line-height: 1.4; }
.som-intro { font-size: .88rem !important; }
.panel-cuerpo:has(.som-notas.abierta) .som-intro { display: none; }
.som-notas .fa-tt small { display: none; }
.som-notas textarea { height: 64px; min-height: 0; }
.som-sec .fa-bt, .som-notas .fa-bt { min-height: 40px; padding: 2px 10px; }
.som-lista { gap: 4px; margin-top: 8px; }
.som-acc { margin: 0 0 8px; }
.som-sec [data-som-sig] { min-height: 34px; padding: 4px 12px; font-size: .8rem; }
@media (max-height: 760px) { .panel:has(.som-lista) .panel-cab { padding: 10px 12px 8px 20px; } .panel:has(.som-lista) .panel-cuerpo { padding: 12px 18px 14px; } }
@media (orientation: landscape) and (max-height: 520px) {
  .panel:has(.som-lista) .panel-cab { padding: 4px 8px 4px 14px; }
  .panel:has(.som-lista) .panel-cab h2 { font-size: .95rem; }
  .panel:has(.som-lista) .panel-cuerpo { padding: 6px 10px 8px; }
  .som-notas .fa-bt, .som-sec .fa-bt { min-height: 32px; }
  .som-notas textarea { height: 50px; }
  .som-acc .btn { min-height: 32px; padding: 2px 12px; }
  .som-sec .fa-in { padding: 0 6px 4px; }
  .panel-cuerpo .som-preg li { font-size: .76rem; margin-bottom: 2px; }
  .som-sec .som-foco { font-size: .78rem !important; }
}

.som-lleva { flex: none; max-width: 30%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .74rem; font-weight: 700; color: var(--mid); background: var(--off); border-radius: 50px; padding: 2px 9px; }
@media (orientation: landscape) and (max-height: 520px) {
  .som-acc { flex-wrap: nowrap; }
  .som-acc .som-tuyo { padding: 2px 10px; font-size: .78rem; }
  .som-lista { grid-template-columns: minmax(0, 40%) minmax(0, 1fr); }
  .som-sec .fa-tt strong { font-size: .8rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .som-lleva { display: none; }
  .som-sec .som-quien { font-size: .72rem; }
  .som-sec .som-quien select { min-height: 30px; font-size: .78rem; }
}

@media (max-height: 760px) { .som-intro { display: none; } }
@media (orientation: landscape) and (max-height: 520px) {
  .panel:has(.som-lista) .panel-cuerpo { padding: 4px 10px 4px; }
  .som-notas .fa-bt, .som-sec .fa-bt { min-height: 28px; padding: 0 8px; }
  .som-notas .fa-ic { width: 22px; height: 22px; }
  .som-sec .som-gorro { width: 16px; height: 16px; }
  .som-notas textarea { height: 34px; padding: 4px 8px; font-size: .8rem; margin-top: 2px; }
  .som-notas .fa-in { padding-bottom: 4px; }
  .som-acc { margin-bottom: 4px; }
  .som-lista { margin-top: 4px; row-gap: 3px; }
}

@media (max-height: 760px) {
  .panel:has(.som-lista) .panel-cab { padding: 8px 10px 6px 20px !important; }
  .panel:has(.som-lista) .panel-cuerpo { padding: 10px 18px 10px !important; }
  .som-notas textarea { height: 44px; }
  .som-sec .fa-bt, .som-notas .fa-bt { min-height: 36px; }
  .panel-cuerpo .som-preg li { line-height: 1.3; }
  .som-sec.tuyo .som-quien { display: none; }
  .som-acc .btn { min-height: 36px; }
}

@media (max-height: 760px) { .som-notas textarea { height: 38px; } .som-lista { gap: 3px; } }
@media (orientation: landscape) and (max-height: 520px) {
  .panel:has(.som-lista) .panel-cab { padding: 3px 8px 3px 14px !important; }
  .panel:has(.som-lista) .panel-cuerpo { padding: 4px 10px !important; }
  .som-sec .fa-bt, .som-notas .fa-bt { min-height: 28px; }
  .som-notas textarea { height: 32px; }
  .som-acc .btn { min-height: 30px; }
  .panel:has(.som-lista) .fa-sec { border-radius: 10px; }
}