/* =========================================================================
   Ball Brawl · sitio.css (todo lo que no es crítico para el primer cuadro)
   Resortes precalculados como linear() (40 muestras):
     rebote  = rigidez 420, amortiguación 22  (sobrepasa 13 %, ~450 ms)
     gelatina= rigidez 180, amortiguación 9   (sobrepasa 33 %, ~900 ms)
     piedra  = rigidez 600, amortiguación 40  (sin sobrepaso, ~250 ms)
   ========================================================================= */
:root{
  --rebote:var(--brote);
  --gelatina:var(--brote);
  --resorte-piedra:cubic-bezier(.2,.9,.3,1);
  --t-rebote:450ms;--t-gelatina:900ms;--t-piedra:250ms;
}
@supports (transition-timing-function:linear(0,1)){
  :root{
    --rebote:linear(0, 0.025, 0.09, 0.184, 0.295, 0.416, 0.536, 0.653, 0.759, 0.855, 0.935, 1.002, 1.053, 1.091, 1.116, 1.13, 1.135, 1.133, 1.125, 1.112, 1.098, 1.081, 1.065, 1.049, 1.034, 1.021, 1.01, 1.001, 0.994, 0.988, 0.985, 0.983, 0.982, 0.982, 0.983, 0.985, 0.987, 0.989, 0.991, 0.993, 1);
    --gelatina:linear(0, 0.043, 0.156, 0.318, 0.505, 0.699, 0.882, 1.041, 1.168, 1.257, 1.309, 1.327, 1.314, 1.278, 1.225, 1.164, 1.101, 1.041, 0.989, 0.947, 0.917, 0.899, 0.893, 0.897, 0.909, 0.926, 0.945, 0.966, 0.986, 1.003, 1.017, 1.027, 1.033, 1.035, 1.034, 1.03, 1.025, 1.018, 1.011, 1.005, 1);
    --resorte-piedra:linear(0, 0.011, 0.04, 0.083, 0.135, 0.194, 0.256, 0.321, 0.384, 0.447, 0.506, 0.564, 0.617, 0.667, 0.712, 0.754, 0.791, 0.824, 0.854, 0.88, 0.902, 0.922, 0.939, 0.954, 0.966, 0.976, 0.985, 0.992, 0.997, 1.001, 1.005, 1.007, 1.009, 1.01, 1.011, 1.011, 1.011, 1.011, 1.011, 1.01, 1);
  }
}

/* ---------- Tipos comunes ---------- */
.antetitulo{margin:0 0 6px;font:800 13px/1.2 var(--f-texto);text-transform:uppercase;letter-spacing:.06em;color:#2A4A9E}
.titulo{margin:0;font:400 clamp(40px,10vw,96px)/.98 var(--f-titulo);color:#fff;letter-spacing:.01em;
  -webkit-text-stroke:.12em var(--tinta);paint-order:stroke fill;text-shadow:0 .07em 0 var(--tinta)}
.titulo--chico{font-size:clamp(32px,7.4vw,64px)}
.frase{margin:12px 0 0;font:800 clamp(17px,1.6vw,20px)/1.4 var(--f-texto);color:var(--tinta);max-width:30ch}
.frase--chica{font-size:16px;max-width:34ch}
.pista{position:absolute;left:50%;bottom:12px;z-index:3;margin:0;transform:translateX(-50%);padding:7px 14px;border-radius:999px;
  background:rgba(13,10,43,.62);color:#fff;font:800 13px/1.2 var(--f-texto);white-space:nowrap;pointer-events:none;
  transition:opacity .15s linear}
.pista.oculta{opacity:0}

/* ---------- Botón de sonido ---------- */
.boton-sonido{position:absolute;right:2px;bottom:2px;z-index:5;width:48px;height:48px;padding:4px;border:0;background:none;cursor:pointer}
.boton-sonido>span{display:block;width:40px;height:40px;border-radius:50%;background:linear-gradient(var(--panel-arriba),var(--panel-abajo));
  box-shadow:inset 0 2px 0 rgba(255,255,255,.35),0 3px 0 var(--tinta);position:relative}
.boton-sonido>span::before{content:"";position:absolute;inset:0;background:no-repeat center/22px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M3 9h4l5-4v14l-5-4H3z'/%3E%3Cpath d='M16 9l5 6M21 9l-5 6' stroke='%23fff' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E")}
.boton-sonido[aria-pressed="true"]>span::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M3 9h4l5-4v14l-5-4H3z'/%3E%3Cpath d='M15.5 8.5a5 5 0 0 1 0 7M18.5 5.5a9 9 0 0 1 0 13' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E")}
.boton-sonido:active>span{transform:translateY(2px);box-shadow:inset 0 2px 0 rgba(255,255,255,.35),0 1px 0 var(--tinta)}
@media (min-width:960px) and (min-aspect-ratio:5/4){.boton-sonido{right:14px;bottom:14px}}

/* ---------- Vista previa de la portada ---------- */
.toque{position:absolute;inset:0;z-index:3;touch-action:pan-y;cursor:pointer}
.raton .toque{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath d='M9 15V6.5a2.5 2.5 0 0 1 5 0V13h.5V4.5a2.5 2.5 0 0 1 5 0V13h.5V6a2.5 2.5 0 0 1 5 0v11c0 6-4 10-9.5 10S6 24 4.5 20.5L3 17a2.3 2.3 0 0 1 4-2.2z' fill='%23fff' stroke='%230D0A2B' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E") 12 4,pointer}
.raton .toque:active{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath d='M7 14c0-2 1.5-3.5 3.5-3.5h11C24 10.5 26 12.5 26 15v4c0 5-4 8.5-9.5 8.5S7 24 7 19z' fill='%23fff' stroke='%230D0A2B' stroke-width='1.8'/%3E%3Cpath d='M11 10.5v4M15 10.5v4M19 10.5v4' stroke='%230D0A2B' stroke-width='1.5'/%3E%3C/svg%3E") 16 16,pointer}
.agarradera{position:absolute;left:0;top:0;width:96px;height:96px;margin:-48px 0 0 -48px;z-index:4;touch-action:none;border-radius:50%;cursor:grab;display:none}
.agarradera.activa{display:block}
.agarradera:active{cursor:grabbing}
.chip-pista{position:absolute;left:50%;top:10px;z-index:3;margin:0;transform:translateX(-50%);width:max-content;padding:7px 14px;border-radius:999px;
  background:rgba(13,10,43,.6);color:#fff;font:800 13px/1.25 var(--f-texto);text-align:center;max-width:calc(100% - 24px);pointer-events:none;transition:opacity .15s linear}
.chip-pista.oculta{opacity:0}
/* en PC no debe llegar al contador (arriba a la derecha); con el Rey en escena baja una fila para no tapar su barra */
@media (min-width:960px) and (min-aspect-ratio:5/4){
  .chip-pista{max-width:calc(100% - 300px)}
  .portada__vista:has(.tarjeta-jefe:not([hidden])) .chip-pista{top:auto;bottom:18px}
}
@media not ((min-width:960px) and (min-aspect-ratio:5/4)){
  .chip-pista{top:auto;bottom:12px;max-width:calc(100% - 128px)}
}
.chip-pista.late{animation:late-pista 1.2s ease-in-out infinite alternate}
@keyframes late-pista{to{opacity:.6}}
.contador{position:absolute;right:12px;top:10px;z-index:3;margin:0;padding:6px 12px;border-radius:14px;background:linear-gradient(var(--panel-arriba),var(--panel-abajo));
  box-shadow:inset 0 2px 0 rgba(255,255,255,.3),0 3px 0 var(--tinta);color:#fff;font:400 18px/1 var(--f-titulo);letter-spacing:.02em}
.contador b{font-weight:400;color:var(--amarillo-arriba);display:inline-block}
.solo-teclado{position:absolute;left:12px;bottom:12px;z-index:5;padding:10px 14px;border:0;border-radius:14px;background:var(--tinta);color:#fff;font:800 14px/1 var(--f-texto);
  transform:translateY(calc(100% + 40px));opacity:0;pointer-events:none}
.solo-teclado:focus,.solo-teclado:focus-visible{transform:none;opacity:1;pointer-events:auto}
.municion{display:flex;gap:6px}
.municion i{width:14px;height:14px;border-radius:50%;background:var(--cian);box-shadow:inset 0 -2px 0 rgba(0,60,110,.35),0 2px 0 rgba(13,10,43,.35);transition:transform .12s var(--rodar)}
.municion i.vacia{background:transparent;box-shadow:inset 0 0 0 2.5px rgba(63,204,255,.75)}
.municion i.revienta{animation:revienta .18s ease-out}
@keyframes revienta{0%{transform:scale(1)}40%{transform:scale(1.3)}100%{transform:scale(0)}}
.municion--portada{position:absolute;left:0;top:0;z-index:3;gap:4px;pointer-events:none}
.municion--portada i{width:10px;height:10px}

/* Tarjeta del Rey sorpresa */
.tarjeta-jefe{position:absolute;left:50%;top:54px;z-index:3;width:min(92%,340px);transform:translateX(-50%);text-align:center;pointer-events:none}
.tarjeta-jefe__cinta{display:inline-block;margin:0;padding:6px 18px 8px;border-radius:12px;background:linear-gradient(var(--jefe-arriba),var(--jefe-abajo));
  box-shadow:inset 0 2px 0 rgba(255,255,255,.35),0 4px 0 #6E0E22;color:#fff;font:400 24px/1 var(--f-titulo);-webkit-text-stroke:.1em #5E0B1C;paint-order:stroke fill}
.tarjeta-jefe__nombre{margin:8px 0 0;color:#fff;font:400 26px/1 var(--f-titulo);-webkit-text-stroke:.12em var(--tinta);paint-order:stroke fill;text-shadow:0 .07em 0 var(--tinta)}
.tarjeta-jefe__sub{margin:4px 0 0;color:#fff;font:800 14px/1.2 var(--f-texto);text-shadow:0 2px 0 rgba(13,10,43,.5)}
.tarjeta-jefe__barra{display:none;gap:4px;margin:8px auto 0;width:200px;height:16px;padding:3px;border-radius:10px;background:var(--tinta)}
.tarjeta-jefe__barra i{flex:1;border-radius:6px;background:linear-gradient(#FF8AD0,#D9468F);transition:transform .25s var(--rodar),opacity .25s}
.tarjeta-jefe__barra i.perdido{transform:scaleY(.2);opacity:.2}
.tarjeta-jefe.barra .tarjeta-jefe__cinta,.tarjeta-jefe.barra .tarjeta-jefe__sub{display:none}
.tarjeta-jefe.barra .tarjeta-jefe__nombre{font-size:16px;margin:0}
.tarjeta-jefe.barra .tarjeta-jefe__barra{display:flex}
.tarjeta-jefe.barra{top:10px}

/* Botón: destello cada 6 s y pulso dorado */
.boton-descarga.destello::after{animation:destello .7s var(--rodar) 1}
@keyframes destello{from{transform:translateX(-120%)}to{transform:translateX(120%)}}
.boton-descarga.pulso{animation:pulso-oro .9s ease-out 1}
@keyframes pulso-oro{0%{filter:none}30%{filter:brightness(1.18) drop-shadow(0 0 18px #FFD24D)}100%{filter:none}}
.boton-descarga.suelto{transition:transform var(--t-rebote) var(--rebote),box-shadow .12s linear}

/* ---------- Calcomanías (capa global) ---------- */
.capa-calcos{position:absolute;left:0;top:0;width:100%;height:0;z-index:6;pointer-events:none;overflow:visible}
.calco{position:absolute;left:0;top:0;margin:0;white-space:nowrap;font:400 34px/1 var(--f-titulo);color:#fff;letter-spacing:.02em;
  -webkit-text-stroke:.14em var(--tinta);paint-order:stroke fill;text-shadow:0 .08em 0 var(--tinta);will-change:transform,opacity}
.calco--fuera{color:#FFE14D}
.calco--pum{color:#FF7A4D;font-size:46px}
.calco--crac{color:#E6E1D6;font-size:40px}
.calco--turno{color:#3FE0FF;font-size:40px}
.calco--derrotado{color:#FFD24D;font-size:42px}

/* ---------- Pastilla fija ---------- */
.pastilla{position:fixed;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));z-index:10;display:flex;align-items:center;gap:8px;
  height:44px;padding:0 16px 0 8px;border-radius:999px;text-decoration:none;background:linear-gradient(var(--amarillo-arriba),var(--amarillo-abajo));
  box-shadow:inset 0 2px 0 rgba(255,255,255,.55),0 4px 0 var(--amarillo-labio),0 8px 14px rgba(13,10,43,.2);
  font:400 19px/1 var(--f-titulo);color:#FFFDF0;-webkit-text-stroke:.12em var(--amarillo-texto);paint-order:stroke fill;transform-origin:100% 0}
.pastilla[hidden]{display:none}
.pastilla:active{transform:translateY(3px);box-shadow:inset 0 2px 0 rgba(255,255,255,.55),0 1px 0 var(--amarillo-labio)}
.pastilla__flecha{width:28px;height:28px;border-radius:50%;background:#FFFDF0;position:relative;-webkit-text-stroke:0}
.pastilla__flecha::before{content:"";position:absolute;left:50%;top:6px;width:5px;height:10px;margin-left:-2.5px;border-radius:3px;background:var(--amarillo-labio)}
.pastilla__flecha::after{content:"";position:absolute;left:50%;top:10px;width:10px;height:10px;margin-left:-5px;border-right:5px solid var(--amarillo-labio);border-bottom:5px solid var(--amarillo-labio);transform:rotate(45deg) scale(.8)}
.pastilla.acento{box-shadow:inset 0 2px 0 rgba(255,255,255,.55),0 4px 0 var(--amarillo-labio),0 0 0 3px var(--acento),0 8px 14px rgba(13,10,43,.2)}

/* ---------- Repisas ---------- */
.repisa{position:relative;display:grid;align-items:center;align-content:center;min-height:90vh;min-height:90svh;padding:72px 16px 48px;gap:20px}
.repisa__texto{position:relative;z-index:3;max-width:560px}
.repisa__escenario{position:relative;height:44vh;height:44svh;min-height:280px;touch-action:pan-y;cursor:pointer}
.repisa--goma{background:linear-gradient(#D1EDFF,#FFFFFF)}
.repisa--balas{background:linear-gradient(#FFFFFF,#E6F3FF)}
@media (min-width:960px){
  .repisa{grid-template-columns:minmax(0,5fr) minmax(0,7fr);padding:80px clamp(36px,6vw,110px);gap:40px}
  .repisa__escenario{height:64vh;min-height:420px}
  .repisa--balas{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
  .repisa--balas .repisa__texto{order:2}
  .repisa--balas .repisa__escenario{order:1}
}

/* Interruptor Goma | Piedra */
.interruptor{position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:center;width:256px;height:52px;margin-top:22px;padding:0;border:0;border-radius:999px;cursor:pointer;
  background:linear-gradient(var(--barra-arriba),var(--barra-abajo));box-shadow:inset 0 3px 0 rgba(0,0,0,.25),0 3px 0 rgba(255,255,255,.6)}
.interruptor__op{position:relative;z-index:2;text-align:center;font:400 20px/1 var(--f-titulo);color:var(--texto-tenue);transition:color .15s;padding-left:44px}
.interruptor__op--piedra{padding-left:0;padding-right:44px}
.interruptor[aria-checked="false"] .interruptor__op--goma,.interruptor[aria-checked="true"] .interruptor__op--piedra{color:#fff}
.interruptor__perilla{position:absolute;left:6px;top:6px;width:40px;height:40px;border-radius:50%;z-index:3;
  background:radial-gradient(circle at 34% 30%,#fff 0 9%,#FF7A70 14%,var(--goma) 46%,#A3201C 100%);box-shadow:0 3px 0 rgba(0,0,0,.35);
  transition:transform var(--t-rebote) var(--rebote),background .2s}
.interruptor[aria-checked="true"] .interruptor__perilla{transform:translateX(204px);
  background:radial-gradient(circle at 34% 30%,#fff 0 7%,#B3A898 13%,var(--piedra) 45%,#4E463E 100%)}
.interruptor__op--goma{grid-column:1}.interruptor__op--piedra{grid-column:2}

/* Cinco balas */
.balas__info{display:flex;align-items:center;gap:16px;margin-top:20px;flex-wrap:wrap}
.nombre-arma{margin:0;perspective:400px;font:400 26px/1 var(--f-titulo);color:#fff;-webkit-text-stroke:.12em var(--tinta);paint-order:stroke fill;text-shadow:0 .07em 0 var(--tinta)}
.nombre-arma span{display:inline-block;transform-origin:50% 50% -10px}
.nombre-arma span.voltea{animation:voltea .3s var(--rodar)}
@keyframes voltea{0%{transform:rotateX(0)}49%{transform:rotateX(90deg)}51%{transform:rotateX(-90deg)}100%{transform:rotateX(0)}}

/* ---------- Secciones fijas (sticky) ---------- */
.fija{position:relative;height:calc(100vh + (var(--pasos) - 1) * 42vh);height:calc(100svh + (var(--pasos) - 1) * 42svh)}
.fija__pantalla{position:sticky;top:0;z-index:3;height:100vh;height:100svh;overflow:clip}
.fija--mundos{background:linear-gradient(#4C94FA,#D1EDFF 30%,#380A0D 32%,#F2732E 46%,#291247 48%,#8CC254 60%,#0A4780 62%,#6BDBEB 72%,#546EBD 74%,#05081A 86%,#0A0314 88%,#381A47)}
.fija--jefes{height:calc(100vh + 150vh);height:calc(100svh + 150svh);background:var(--marino)}
@media (min-width:960px){
  .fija{height:calc(100vh + (var(--pasos) - 1) * 38vh)}
  .fija--jefes{height:250vh}
}
.mundos__escenario,.jefes__escenario{position:absolute;inset:0;touch-action:pan-y}
.mundos__cabeza,.jefes__cabeza{position:absolute;left:16px;right:16px;top:max(64px,calc(env(safe-area-inset-top) + 56px));text-align:center;pointer-events:none}
.mundos__cabeza .antetitulo,.jefes__cabeza .antetitulo{color:#fff;text-shadow:0 2px 0 rgba(13,10,43,.45)}
.mundos__cabeza .frase,.jefes__cabeza .frase{color:#fff;margin:6px auto 0;text-shadow:0 2px 0 rgba(13,10,43,.5)}
.mundos__tarjeta{position:absolute;left:16px;right:16px;bottom:max(46px,calc(env(safe-area-inset-bottom) + 40px));max-width:440px;margin:0 auto;padding:16px 18px 18px;border-radius:var(--radio);
  background:linear-gradient(rgba(51,69,168,.92),rgba(33,43,120,.92));border:3px solid var(--acento);box-shadow:0 5px 0 var(--tinta);text-align:center;pointer-events:none;perspective:600px}
.mundos__tarjeta>*{transform-origin:50% 50%}
.mundos__tarjeta.voltea>*{animation:voltea .3s var(--rodar)}
.mundos__ante{color:var(--acento);margin:0}
.mundos__nombre{margin:4px 0 0;font:400 clamp(44px,13vw,168px)/.95 var(--f-titulo);color:var(--acento);-webkit-text-stroke:.1em var(--tinta);paint-order:stroke fill;text-shadow:0 .06em 0 var(--tinta);white-space:nowrap}
.mundos__nombre.largo{font-size:clamp(30px,8.6vw,64px);white-space:normal;line-height:1}
.mundos__frase{color:#fff;margin:8px auto 0}
.mundos__indice{position:absolute;left:0;right:0;bottom:max(18px,calc(env(safe-area-inset-bottom) + 12px));display:flex;justify-content:center;gap:8px;margin:0;padding:0;list-style:none;pointer-events:none}
.mundos__indice li{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.4);transition:transform .3s var(--rebote),background .2s}
.mundos__indice li.activo{background:var(--acento);transform:scale(1.4);box-shadow:0 0 0 2px var(--tinta)}
.mundos__botones{display:none}
.etiqueta-enemigo{position:absolute;left:0;top:0;z-index:4;margin:0;padding:6px 12px;border-radius:999px;background:var(--tinta);color:#fff;font:400 18px/1 var(--f-titulo);white-space:nowrap;pointer-events:none;
  box-shadow:0 3px 0 rgba(0,0,0,.3)}
.mundos__lista{position:absolute;left:16px;right:16px;bottom:16px;color:#fff;font-size:14px}
@media (min-width:960px){
  .mundos__cabeza,.jefes__cabeza{text-align:left;left:clamp(36px,6vw,110px);right:auto;top:88px;max-width:520px}
  .mundos__cabeza .frase,.jefes__cabeza .frase{margin-left:0}
  .mundos__tarjeta{left:clamp(36px,6vw,110px);right:auto;top:50%;bottom:auto;width:min(40vw,560px);max-width:none;transform:translateY(-10%);text-align:left;padding:22px 26px 24px}
  .mundos__nombre{font-size:clamp(52px,6.4vw,120px)}
  .mundos__nombre.largo{font-size:clamp(38px,3.7vw,64px)}
  .mundos__frase{margin-left:0}
  .mundos__indice{left:auto;right:clamp(28px,4vw,64px);top:50%;bottom:auto;flex-direction:column;transform:translateY(-50%)}
}

/* Jefes */
.jefes__cabeza .antetitulo{color:#FFB26B}
.jefes__tarjetas{position:absolute;left:16px;right:16px;bottom:max(24px,calc(env(safe-area-inset-bottom) + 16px));max-width:440px;margin:0 auto;pointer-events:none}
.tarjeta-boss{position:absolute;left:0;right:0;bottom:0;padding:14px 18px 16px;border-radius:var(--radio);background:linear-gradient(rgba(51,69,168,.94),rgba(33,43,120,.94));border:3px solid #9B5CF0;
  box-shadow:0 5px 0 var(--tinta);opacity:0;transform:translateY(30px) scale(.9);transition:opacity .15s linear,transform .3s var(--rodar)}
.tarjeta-boss.visible{opacity:1;transform:none;transition:opacity .15s linear,transform var(--t-rebote) var(--rebote)}
.tarjeta-boss--golem{border-color:#FF5A1F}
.tarjeta-boss__cinta{display:inline-block;margin:0;padding:5px 12px 6px;border-radius:10px;background:linear-gradient(var(--jefe-arriba),var(--jefe-abajo));color:#fff;font:800 13px/1 var(--f-texto);text-transform:uppercase;letter-spacing:.05em}
.tarjeta-boss__nombre{margin:8px 0 0;font:400 clamp(30px,8vw,52px)/1 var(--f-titulo);color:#fff;-webkit-text-stroke:.12em var(--tinta);paint-order:stroke fill;text-shadow:0 .07em 0 var(--tinta)}
.tarjeta-boss__texto{margin:6px 0 0;color:var(--texto-tenue);font:800 15px/1.4 var(--f-texto)}
@media (min-width:960px){
  .jefes__tarjetas{left:clamp(36px,6vw,110px);right:auto;top:50%;bottom:auto;width:min(36vw,500px);max-width:none;margin:0}
  .tarjeta-boss{top:0;bottom:auto;padding:22px 26px 24px}
  .tarjeta-boss__texto{font-size:17px}
}

/* ---------- Carrusel de cinco jefes ---------- */
.repisa--carrusel{background:linear-gradient(var(--marino),#1A1F5E);grid-template-columns:100%;align-content:start;padding-left:0;padding-right:0}
.carrusel__cabeza{position:relative;z-index:3;padding:0 16px;text-align:center}
.carrusel__cuerpo{display:grid;gap:8px}
.carrusel__escenario{position:relative;height:46vh;height:46svh;min-height:280px;touch-action:pan-y;cursor:pointer}
.carrusel__lado{position:relative;z-index:3;min-width:0}
.carrusel{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 9vw 14px;scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.carrusel::-webkit-scrollbar{display:none}
.carrusel:focus-visible{outline-offset:-3px}
.carta-jefe{flex:0 0 82vw;max-width:360px;scroll-snap-align:center;padding:16px 18px 18px;border-radius:var(--radio);background:linear-gradient(var(--panel-arriba),var(--panel-abajo));
  border:3px solid var(--borde-panel);box-shadow:0 5px 0 var(--tinta);color:#fff;transition:transform .3s var(--rodar),border-color .2s}
.carta-jefe.activa{border-color:var(--c);transform:translateY(-4px)}
.carta-jefe__cap{margin:0;color:var(--c);font:800 13px/1 var(--f-texto);letter-spacing:.06em}
.carta-jefe__nombre{margin:6px 0 0;font:400 30px/1 var(--f-titulo);-webkit-text-stroke:.12em var(--tinta);paint-order:stroke fill;text-shadow:0 .07em 0 var(--tinta)}
.carta-jefe__sub{margin:4px 0 0;color:var(--texto-tenue);font:800 14px/1.2 var(--f-texto)}
.carta-jefe__texto{margin:8px 0 0;font:700 15px/1.4 var(--f-texto)}
.carrusel__nav{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:6px}
.carrusel__flecha{display:none;width:48px;height:48px;border:0;border-radius:50%;cursor:pointer;background:linear-gradient(var(--panel-arriba),var(--panel-abajo));box-shadow:inset 0 2px 0 rgba(255,255,255,.3),0 4px 0 var(--tinta)}
.carrusel__flecha span{display:block;width:14px;height:14px;margin:0 auto;border-left:4px solid #fff;border-bottom:4px solid #fff;transform:translateX(3px) rotate(45deg)}
.carrusel__flecha--sig span{transform:translateX(-3px) rotate(-135deg)}
.carrusel__flecha:active{transform:translateY(3px);box-shadow:inset 0 2px 0 rgba(255,255,255,.3),0 1px 0 var(--tinta)}
.carrusel__puntos{display:flex;gap:8px}
.carrusel__puntos i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.35);transition:transform .3s var(--rebote),background .2s}
.carrusel__puntos i.activo{background:#fff;transform:scale(1.35)}
@media (min-width:960px){
  .carrusel__cabeza{padding:0 clamp(36px,6vw,110px);text-align:left}
  .carrusel__cuerpo{grid-template-columns:minmax(0,6fr) minmax(0,5fr);align-items:center;padding:0 clamp(20px,4vw,80px) 0 0}
  .carrusel__escenario{height:62vh;min-height:420px}
  .carrusel{padding:6px calc(50% - 180px) 14px}
  .carta-jefe{flex-basis:360px}
  .carrusel__flecha{display:block}
}

/* ---------- Vitrina ---------- */
.repisa--vitrina{min-height:120vh;min-height:120svh;grid-template-columns:100%;align-content:start;background:linear-gradient(var(--noche-arriba),var(--noche-abajo));color:#fff;overflow:clip}
.estrellas{position:absolute;inset:0;pointer-events:none;opacity:.8;
  background-image:radial-gradient(1.5px 1.5px at 12% 18%,#fff 98%,transparent),radial-gradient(1px 1px at 28% 62%,#fff 98%,transparent),radial-gradient(2px 2px at 44% 30%,#FFE9A8 98%,transparent),
  radial-gradient(1px 1px at 63% 12%,#fff 98%,transparent),radial-gradient(1.5px 1.5px at 78% 48%,#fff 98%,transparent),radial-gradient(1px 1px at 90% 80%,#fff 98%,transparent),
  radial-gradient(1.5px 1.5px at 8% 86%,#C9D2FF 98%,transparent),radial-gradient(1px 1px at 52% 92%,#fff 98%,transparent),radial-gradient(2px 2px at 86% 22%,#fff 98%,transparent);
  background-size:420px 420px;animation:titila 4s ease-in-out infinite alternate}
@keyframes titila{to{opacity:.45}}
.vitrina__cabeza{position:relative;z-index:3;text-align:center;max-width:720px;margin:0 auto}
.vitrina__cabeza .antetitulo{color:#FFD24D}
.vitrina__cabeza .frase{color:var(--texto-tenue);margin-left:auto;margin-right:auto}
.vitrina__escenario{position:relative;height:52vh;height:52svh;min-height:300px;touch-action:pan-y;cursor:pointer}
.rarezas{position:relative;z-index:3;display:flex;justify-content:center;gap:10px;margin:0;padding:0;list-style:none}
.carta-rareza{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:132px;min-height:64px;padding:10px 14px;border:0;border-radius:16px;cursor:pointer;text-align:left;
  background:linear-gradient(var(--a),var(--b));box-shadow:inset 0 2px 0 rgba(255,255,255,.45),0 4px 0 rgba(0,0,0,.35);color:#fff;transform-origin:50% 0;position:relative;overflow:hidden}
.carta-rareza__etq{font:800 11px/1 var(--f-texto);letter-spacing:.08em;opacity:.95;position:relative}
.carta-rareza__nombre{font:400 21px/1.05 var(--f-titulo);-webkit-text-stroke:.12em rgba(13,10,43,.75);paint-order:stroke fill;position:relative}
.carta-rareza--comun{--a:var(--comun-a);--b:var(--comun-b)}
.carta-rareza--raro{--a:var(--raro-a);--b:var(--raro-b)}
.carta-rareza--ultra{--a:var(--ultra-a);--b:var(--ultra-b)}
.carta-rareza--legen{--a:var(--legen-a);--b:var(--legen-b)}
.carta-rareza--divino{--a:var(--divino-a);--b:var(--divino-b)}
@property --angulo{syntax:"<angle>";inherits:false;initial-value:0deg}
.carta-rareza--divino::before{content:"";position:absolute;inset:0;opacity:.55;mix-blend-mode:screen;
  background:conic-gradient(from var(--angulo),var(--holo-1),var(--holo-2),var(--holo-3),var(--holo-4),var(--holo-5),var(--holo-1));animation:holo 6s linear infinite}
@keyframes holo{to{--angulo:360deg}}
.carta-rareza.columpio{animation:columpio .9s var(--gelatina)}
@keyframes columpio{0%{transform:rotate(0)}20%{transform:rotate(6deg)}45%{transform:rotate(-4deg)}70%{transform:rotate(2deg)}100%{transform:rotate(0)}}
.carta-rareza.activa{outline:3px solid #fff;outline-offset:2px}
@media (max-width:959px){
  .rarezas{display:grid;justify-items:center;height:72px}
  .rarezas li{grid-area:1/1;transition:opacity .15s linear,transform .3s var(--rodar)}
  .rarezas li:not(.cerca){opacity:0;transform:translateY(8px) scale(.94);pointer-events:none}
  .carta-rareza{min-width:200px}
}
.pase{position:relative;z-index:3;max-width:720px;width:100%;margin:28px auto 0;padding:0 16px 40px;text-align:center}
.pase__titulo{margin:0 0 30px;font:400 24px/1 var(--f-titulo);color:#fff;-webkit-text-stroke:.12em var(--tinta);paint-order:stroke fill}
.pase__riel{position:relative;height:22px;border-radius:999px;background:linear-gradient(var(--barra-arriba),var(--barra-abajo));box-shadow:inset 0 3px 0 rgba(0,0,0,.3),0 2px 0 rgba(255,255,255,.18);margin:0 14px}
.pase__relleno{position:absolute;left:3px;top:3px;bottom:3px;width:calc((100% - 6px) * var(--p,0));border-radius:999px;background:linear-gradient(var(--amarillo-arriba),var(--amarillo-abajo))}
.pase__bolita{position:absolute;top:50%;left:calc((100% - 6px) * var(--p,0) + 3px);width:28px;height:28px;margin:-14px 0 0 -14px;border-radius:50%;
  background:radial-gradient(circle at 34% 30%,#fff 0 9%,#FF7A70 14%,var(--goma) 46%,#A3201C 100%);box-shadow:0 3px 0 rgba(0,0,0,.35);transform:rotate(var(--giro,0deg))}
.pase__bolita::after{content:"";position:absolute;left:5px;top:12px;width:6px;height:4px;border-radius:50%;background:#FFD9D9}
.pase__bandera{position:absolute;right:-6px;bottom:100%;width:4px;height:30px;background:#E6E1D6;border-radius:2px;transform-origin:50% 100%;transform:scaleY(.25);transition:transform var(--t-rebote) var(--rebote)}
.pase__bandera::after{content:"";position:absolute;left:4px;top:0;width:22px;height:14px;background:linear-gradient(var(--holo-1),var(--holo-2));clip-path:polygon(0 0,100% 50%,0 100%)}
.pase.completo .pase__bandera{transform:none}
.pase__hito{position:absolute;top:30px;left:calc(var(--x) * 100%);transform:translateX(-50%) scale(.4);opacity:0;white-space:nowrap;padding:5px 9px;border-radius:10px;
  background:linear-gradient(var(--panel-arriba),var(--panel-abajo));box-shadow:0 3px 0 var(--tinta);font:800 11px/1.2 var(--f-texto);color:var(--texto-tenue);
  transition:opacity .15s linear,transform var(--t-rebote) var(--rebote)}
.pase__hito b{color:#fff;font-weight:800}
.pase__hito:nth-of-type(even){top:auto;bottom:30px}
.pase__hito.brota{opacity:1;transform:translateX(-50%) scale(1)}
.pase__nivel{margin:76px 0 0;font:400 30px/1 var(--f-titulo);color:#fff;-webkit-text-stroke:.12em var(--tinta);paint-order:stroke fill}
.pase__nivel b{font-weight:400;color:var(--amarillo-arriba)}
.pase__nota{margin:8px auto 0;color:var(--texto-tenue);font:800 14px/1.4 var(--f-texto)}
@media (max-width:600px){.pase__hito{font-size:10px;padding:4px 6px}}
.pase__hito[style="--x:0"]{transform:translateX(-14px) scale(.4);transform-origin:0 50%}
.pase__hito[style="--x:0"].brota{transform:translateX(-14px)}
.pase__hito[style="--x:1"]{transform:translateX(calc(-100% + 14px)) scale(.4);transform-origin:100% 50%}
.pase__hito[style="--x:1"].brota{transform:translateX(calc(-100% + 14px))}
@media (min-width:960px){
  .vitrina__escenario{height:60vh;min-height:420px}
}

/* ---------- Cierre ---------- */
.repisa--final{min-height:100vh;min-height:100svh;grid-template-columns:100%;grid-template-rows:minmax(0,1fr) auto;padding:24px 16px max(28px,env(safe-area-inset-bottom));background:linear-gradient(var(--cielo-arriba),var(--cielo-abajo))}
.final__escenario{position:absolute;inset:0;touch-action:pan-y}
.final__texto{position:relative;z-index:3;grid-row:2;display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px}
.final__texto .frase{margin:0;color:var(--tinta)}
.fichas-modo{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:6px 0 10px;padding:0;list-style:none}
.fichas-modo li{position:relative;padding:8px 14px;border-radius:999px;background:#fff;color:var(--tinta);font:800 14px/1 var(--f-texto);box-shadow:0 3px 0 rgba(13,10,43,.25)}
.calco-pronto{position:absolute;right:-10px;top:-12px;padding:3px 7px;border-radius:8px;background:var(--amarillo-arriba);color:var(--amarillo-texto);font:400 12px/1 var(--f-titulo);transform:rotate(8deg);box-shadow:0 2px 0 var(--amarillo-labio)}
.boton-descarga--final{margin-top:34px}
@media (min-width:960px) and (min-aspect-ratio:5/4){
  .repisa--final{grid-template-columns:42% 58%;grid-template-rows:100%;padding:24px 0}
  .final__texto{grid-row:1;grid-column:1;align-items:flex-start;text-align:left;padding-left:clamp(36px,5vw,84px)}
  .fichas-modo{justify-content:flex-start}
  .boton-descarga--final{width:320px;height:72px}
}

/* ---------- Pie ---------- */
.pie{position:relative;z-index:3;padding:40px 16px max(40px,env(safe-area-inset-bottom));background:var(--tinta);color:var(--texto-tenue);font:700 14px/1.5 var(--f-texto);text-align:center}
.pie p{margin:4px 0}
.pie__plataformas{margin-bottom:20px}
.pie__titulo{font:400 22px/1 var(--f-titulo)!important;color:#fff}
.pie__plataformas ul{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:12px 0 0;padding:0;list-style:none}
.pie__plataformas li{padding:6px 12px;border-radius:999px;background:var(--tinta-2);color:#fff;border:2px solid #2E2A5A}
.pie__interruptores{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:18px}
.pie__estudio{margin:0 0 10px!important;color:#fff}
.pie__estudio a{color:#fff;text-decoration:underline;text-decoration-color:rgba(255,255,255,.45);text-underline-offset:3px;border-radius:4px}
.pie__estudio a:hover{text-decoration-color:#fff}
.mini-interruptor{display:flex;align-items:center;gap:10px;min-height:48px;padding:8px 16px 8px 8px;border:2px solid #2E2A5A;border-radius:999px;background:var(--tinta-2);color:#fff;font:800 14px/1 var(--f-texto);cursor:pointer}
.mini-interruptor::before{content:"";width:40px;height:24px;border-radius:999px;background:#3A3570 radial-gradient(circle at 12px 12px,#fff 8px,transparent 9px) no-repeat;transition:background-position .3s var(--rebote),background-color .2s}
.mini-interruptor[aria-checked="true"]::before{background-color:var(--verde);background-position:16px 0}

/* ---------- Hoja de descarga ---------- */
.hoja{padding:0;border:0;background:transparent;max-width:none;max-height:none;overflow:visible;color:#fff}
.hoja::backdrop{background:rgba(13,10,43,.55)}
.hoja[open]::backdrop{animation:fundido .2s linear}
@keyframes fundido{from{opacity:0}}
.hoja__caja{position:relative;padding:14px 18px max(20px,env(safe-area-inset-bottom));background:linear-gradient(var(--panel-arriba),var(--panel-abajo));border:3px solid var(--borde-panel);box-shadow:0 6px 0 var(--tinta)}
.hoja__asa{width:48px;height:6px;margin:0 auto 10px;border-radius:3px;background:rgba(255,255,255,.45)}
.hoja__titulo{margin:4px 0 14px;text-align:center;font:400 30px/1 var(--f-titulo);-webkit-text-stroke:.12em var(--tinta);paint-order:stroke fill;text-shadow:0 .07em 0 var(--tinta)}
.hoja__fichas{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0;padding:0;list-style:none}
.ficha{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;min-height:116px;padding:16px 10px 12px;border-radius:18px;background:#fff;color:var(--tinta);text-decoration:none;
  box-shadow:inset 0 -4px 0 rgba(13,10,43,.12),0 4px 0 var(--tinta);transform:rotate(var(--giro,0deg))}
a.ficha:active{transform:rotate(var(--giro,0deg)) translateY(3px)}
.ficha svg{width:44px;height:44px}
.ficha__nombre{font:400 22px/1 var(--f-titulo)}
.ficha__calco{padding:4px 9px;border-radius:8px;background:var(--amarillo-arriba);color:var(--amarillo-texto);font:400 14px/1 var(--f-titulo);transform:rotate(-3deg)}
.ficha__detalle{font:800 12px/1.2 var(--f-texto);color:#3A4580;text-align:center}
.ficha__tuyo{position:absolute;left:-6px;top:-10px;padding:4px 9px;border-radius:9px;background:var(--verde);color:#0E3B12;font:800 12px/1 var(--f-texto);transform:rotate(-6deg);box-shadow:0 2px 0 #2C8A2A}
.hoja__nota{margin:14px 4px 0;text-align:center;color:var(--texto-tenue);font:800 14px/1.4 var(--f-texto)}
.hoja__cerrar{display:block;width:100%;min-height:52px;margin:14px 0 0;border:0;border-radius:16px;background:var(--tinta);color:#fff;font:400 22px/1 var(--f-titulo);cursor:pointer;box-shadow:0 4px 0 #000}
.hoja__cerrar:active{transform:translateY(3px);box-shadow:0 1px 0 #000}
@media (max-width:639px){
  .hoja{margin:auto 0 0;width:100%;}
  .hoja__caja{border-radius:28px 28px 0 0;border-bottom:0;box-shadow:none}
  .hoja[open] .hoja__caja{animation:sube .45s var(--rebote)}
}
@keyframes sube{from{transform:translateY(100%)}}
@media (min-width:640px){
  .hoja{margin:auto;width:min(520px,calc(100% - 32px))}
  .hoja__caja{border-radius:var(--radio-grande);padding:18px 24px 24px}
  .hoja__asa{display:none}
  .hoja[open] .hoja__caja{animation:globo .45s var(--rebote)}
  .hoja__fichas{grid-template-columns:repeat(4,1fr)}
  .ficha{min-height:132px}
}
@keyframes globo{from{transform:scale(.7)}}
.ficha.entra{animation:ficha-entra .45s var(--rebote) both;animation-delay:calc(var(--i) * 50ms + 80ms)}
@keyframes ficha-entra{from{transform:translate(var(--dx,0),var(--dy,40px)) scale(.6) rotate(0)}}

/* ---------- Entradas de sección (solo con JS) ---------- */
.por-entrar{transform:translateY(-36px);opacity:0}
.entra{animation:cae .5s var(--rebote) both}
@keyframes cae{from{transform:translateY(-36px);opacity:0}to{transform:none;opacity:1}}

/* ---------- Depuración ---------- */
.depurar{position:fixed;left:8px;bottom:8px;z-index:20;padding:6px 8px;border-radius:8px;background:rgba(0,0,0,.72);color:#9CFF6B;font:12px/1.35 ui-monospace,monospace;white-space:pre;pointer-events:none}

/* ---------- Menos movimiento ---------- */
@media (prefers-reduced-motion:reduce){
  .envase::after,.bajar::before,.estrellas,.carta-rareza--divino::before{animation:none!important}
}
.menos-movimiento .envase::after,.menos-movimiento .bajar::before,.menos-movimiento .estrellas,.menos-movimiento .carta-rareza--divino::before,
.menos-movimiento .boton-descarga::after{animation:none!important}
.menos-movimiento .por-entrar{transform:none;opacity:1}
.menos-movimiento .entra{animation:none}
.menos-movimiento .fija{height:auto}
.menos-movimiento .fija__pantalla{position:relative;height:100vh;height:100svh}
.menos-movimiento .mundos__botones{position:absolute;left:0;right:0;bottom:max(18px,calc(env(safe-area-inset-bottom) + 10px));z-index:4;display:flex;justify-content:center;gap:3px;flex-wrap:wrap;padding:0 8px}
.menos-movimiento .mundos__botones button{width:min(48px,calc((100vw - 34px) / 7));height:48px;flex:none;border:0;border-radius:50%;cursor:pointer;background:linear-gradient(var(--panel-arriba),var(--panel-abajo));color:#fff;font:400 20px/1 var(--f-titulo);box-shadow:0 3px 0 var(--tinta)}
.menos-movimiento .mundos__botones button[aria-pressed="true"]{background:var(--acento);color:var(--tinta)}
.menos-movimiento .mundos__indice{display:none}
@media (max-width:959px){.menos-movimiento .mundos__tarjeta{bottom:max(80px,calc(env(safe-area-inset-bottom) + 76px))}}
/* vitrina sin paneo: las cinco tarjetas a la vista (en celular se apilaban en la misma casilla) */
.menos-movimiento .rarezas{display:flex;flex-wrap:wrap;justify-content:center;height:auto;padding:0 8px}
.menos-movimiento .rarezas li{grid-area:auto;opacity:1;transform:none;pointer-events:auto}
@media (max-width:959px){.menos-movimiento .carta-rareza{min-width:0;width:auto;padding:8px 12px;min-height:56px}.menos-movimiento .carta-rareza__nombre{font-size:18px}}
.menos-movimiento .mundos__tarjeta.voltea>*{animation:none}
.menos-movimiento .fija--jefes .tarjeta-boss{opacity:1;transform:none;position:relative}
.menos-movimiento .jefes__tarjetas{display:grid;gap:10px}
@media (min-width:960px){.menos-movimiento .mundos__botones{left:clamp(36px,6vw,110px);right:auto;justify-content:flex-start}}

/* ---------- Rey sorpresa: el cielo de la caja baja de brillo ---------- */
.envase{transition:background-color .5s linear}
.portada.con-jefe .envase{background-color:rgba(13,10,43,.16)}

/* ---------- Modo póster (index.html?poster=720) ---------- */
.modo-poster body{background:transparent}
.modo-poster main>*:not(#portada),.modo-poster .pie,.modo-poster .pastilla,.modo-poster .portada>*{display:none!important}
.modo-poster .portada{background:none;position:fixed;inset:0;height:100vh;min-height:0;padding:0}
.modo-poster html,.modo-poster{background:transparent}

/* ---------- Capturas (?toma=) ---------- */
.toma .por-entrar{transform:none;opacity:1}

/* ---------- Sin JavaScript: se ocultan los controles que no harían nada ---------- */
html:not(.js) .chip-pista,html:not(.js) .boton-sonido,html:not(.js) .solo-teclado,html:not(.js) .pie__interruptores,
html:not(.js) .carrusel__flecha,html:not(.js) .interruptor,html:not(.js) .pista,html:not(.js) .mundos__indice,html:not(.js) .mundos__botones{display:none!important}
html:not(.js) .fija{height:auto}
html:not(.js) .fija__pantalla{position:relative}

/* ---------- Escenarios 3D a todo lo ancho en celular (sin cortes en la orilla) ---------- */
@media (max-width:959px){
  .repisa__escenario,.vitrina__escenario{margin-left:-16px;margin-right:-16px}
  /* «Cinco balas» es una escena ancha y baja: en vertical su escenario no necesita tanto alto (quedaba un hueco arriba) */
  .repisa--balas .repisa__escenario{height:min(44svh,66vw);min-height:220px}
}
@media (min-width:960px){
  .vitrina__escenario{height:50vh;min-height:380px}
}

/* =========================================================================
   Celular en horizontal (alto ≤ 500 px): dos columnas como en PC, para que la tarjeta y el título no tapen el 3D.
   Los escenarios de Mundos, Jefes y Cierre usan la misma consulta para su encuadre (js).
   ========================================================================= */
@media (orientation:landscape) and (max-height:500px){
  .titulo{font-size:min(10vw,12vh,56px)}
  .titulo--chico{font-size:min(7vw,8.5vh,40px)}
  .frase{font-size:15px;margin-top:8px}
  .frase--chica{font-size:13px}
  .antetitulo{font-size:12px;margin-bottom:4px}
  .repisa--goma,.repisa--balas{grid-template-columns:minmax(0,5fr) minmax(0,7fr);min-height:100svh;padding:20px max(20px,env(safe-area-inset-right)) 20px max(20px,env(safe-area-inset-left));gap:20px}
  .repisa__escenario{height:82svh;min-height:0;margin:0}
  .repisa--balas{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
  .repisa--balas .repisa__texto{order:2}
  .repisa--balas .repisa__escenario{order:1}
  .interruptor{margin-top:14px;height:48px}
  .interruptor__perilla{width:36px;height:36px}
  .balas__info{margin-top:12px}
  /* mundos y jefes: cabeza arriba a la izquierda, tarjeta abajo a la izquierda, 3D a la derecha */
  .mundos__cabeza,.jefes__cabeza{left:max(20px,env(safe-area-inset-left));right:auto;top:14px;max-width:40%;text-align:left}
  .mundos__cabeza .frase,.jefes__cabeza .frase{margin-left:0}
  .mundos__tarjeta{left:max(20px,env(safe-area-inset-left));right:auto;top:auto;bottom:16px;width:40%;max-width:380px;margin:0;padding:10px 14px 12px;text-align:left;transform:none}
  .mundos__nombre{font-size:min(5vw,9vh,40px)}
  .mundos__nombre.largo{font-size:min(3.4vw,6.4vh,28px)}
  .mundos__frase{font-size:13px;margin:4px 0 0}
  .mundos__indice{left:auto;right:max(14px,env(safe-area-inset-right));top:50%;bottom:auto;flex-direction:column;transform:translateY(-50%)}
  .jefes__tarjetas{left:max(20px,env(safe-area-inset-left));right:auto;top:auto;bottom:14px;width:40%;max-width:380px;margin:0}
  .tarjeta-boss{padding:10px 14px 12px}
  .tarjeta-boss__nombre{font-size:min(4vw,8vh,32px);margin-top:6px}
  .tarjeta-boss__texto{font-size:12px;line-height:1.35}
  .menos-movimiento .mundos__botones{left:max(20px,env(safe-area-inset-left));right:auto;bottom:auto;top:50%;transform:translateY(-50%);justify-content:flex-start;width:40%;padding:0}
  .menos-movimiento .mundos__botones button{width:44px;height:44px}
  .menos-movimiento .mundos__tarjeta{bottom:12px}
  .menos-movimiento .mundos__cabeza .frase{display:none}
  .menos-movimiento .jefes__tarjetas{gap:6px}
  .menos-movimiento .jefes__cabeza .frase{display:none}
  /* carrusel: 3D a la izquierda, tarjetas a la derecha */
  .repisa--carrusel{min-height:100svh;padding:16px 0}
  .carrusel__cabeza{padding:0 max(20px,env(safe-area-inset-left));text-align:left}
  .carrusel__cuerpo{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:center}
  .carrusel__escenario{height:72svh;min-height:0}
  .carrusel{padding:6px calc(50% - 150px) 10px}
  .carta-jefe{flex-basis:300px;padding:12px 14px 14px}
  .carta-jefe__nombre{font-size:24px}
  .carta-jefe__texto{font-size:13px}
  .carrusel__flecha{display:block}
  /* vitrina */
  .vitrina__escenario{height:60svh;min-height:0}
  .rarezas{height:auto}
  /* cierre: texto a la izquierda, isla a la derecha (como la portada) */
  .repisa--final{grid-template-columns:44% 56%;grid-template-rows:100%;padding:16px 0}
  .final__texto{grid-row:1;grid-column:1;align-items:flex-start;text-align:left;padding-left:max(20px,env(safe-area-inset-left));gap:6px}
  .fichas-modo{justify-content:flex-start;margin:2px 0 4px}
  .fichas-modo li{padding:7px 11px;font-size:13px}
  .boton-descarga--final{margin-top:32px}
}

/* =========================================================================
   Pantallas grandes (1800 px o más de ancho): la interfaz crece con la pantalla para no quedarse chica junto al 3D.
   ========================================================================= */
@media (min-width:1800px) and (min-height:950px){
  .antetitulo{font-size:16px}
  .titulo{font-size:min(6vw,150px)}
  .titulo--chico{font-size:min(4vw,100px)}
  .frase{font-size:24px}
  .frase--chica{font-size:20px}
  .pista{font-size:15px;padding:8px 16px}
  .repisa__texto{max-width:780px}
  .interruptor{width:300px;height:60px}
  .interruptor__op{font-size:24px;padding-left:52px}
  .interruptor__op--piedra{padding-left:0;padding-right:52px}
  .interruptor__perilla{width:48px;height:48px}
  .interruptor[aria-checked="true"] .interruptor__perilla{transform:translateX(240px)}
  .municion i{width:18px;height:18px}
  .nombre-arma{font-size:34px}
  .mundos__cabeza,.jefes__cabeza{top:120px;max-width:780px}
  .mundos__tarjeta{width:min(36vw,760px);padding:30px 34px 32px}
  .mundos__nombre{font-size:min(6.4vw,170px)}
  .mundos__nombre.largo{font-size:min(4vw,96px)}
  .mundos__frase{font-size:22px}
  .jefes__tarjetas{width:min(32vw,680px)}
  .tarjeta-boss{padding:30px 34px 32px}
  .tarjeta-boss__cinta{font-size:16px;padding:7px 14px 8px}
  .tarjeta-boss__nombre{font-size:min(3.4vw,80px)}
  .tarjeta-boss__texto{font-size:21px}
  .carrusel{padding:6px calc(50% - 230px) 14px}
  .carta-jefe{flex-basis:460px;padding:22px 26px 24px}
  .carta-jefe__cap{font-size:16px}
  .carta-jefe__nombre{font-size:40px}
  .carta-jefe__sub{font-size:17px}
  .carta-jefe__texto{font-size:18px}
  .carrusel__flecha{width:60px;height:60px}
  .carta-rareza{min-width:180px;min-height:80px;padding:14px 18px}
  .carta-rareza__etq{font-size:13px}
  .carta-rareza__nombre{font-size:28px}
  .pase{max-width:980px}
  .pase__titulo{font-size:32px}
  .pase__hito{font-size:14px}
  .pase__nivel{font-size:40px}
  .pase__nota{font-size:17px}
  .fichas-modo li{font-size:18px;padding:11px 18px}
  .calco-pronto{font-size:15px}
  .pastilla{height:54px;font-size:23px;padding:0 20px 0 10px}
  .pastilla__flecha{transform:scale(1.2)}
  .chip-pista{font-size:16px;padding:9px 18px}
  .contador{font-size:24px;padding:8px 16px}
  .pie{font-size:16px}
}
@media (min-width:1800px) and (min-height:950px) and (min-aspect-ratio:5/4){
  .boton-descarga--final{width:420px;height:92px;font-size:36px}
}