.penales{--si:#6fd08c;--no:#ff6b64}.penales-top{justify-content:space-between;align-items:flex-start;gap:1rem;display:flex}.penales-botones{gap:.5rem;display:flex}.marcador{gap:.45rem;padding:.7rem .9rem;display:grid}.m-fila{grid-template-columns:4.2rem minmax(0,1fr) auto;align-items:center;gap:.6rem;display:grid}.m-quien{font-family:var(--font-display);text-transform:uppercase;color:var(--color-crema);font-size:1.15rem;font-weight:900}.m-puntos{flex-wrap:wrap;gap:.35rem;display:flex}.m-goles{font-family:var(--font-display);color:var(--color-crema);text-align:right;min-width:1.4rem;font-size:2rem;font-weight:900;line-height:1}.m-goles.sube{animation:.52s cubic-bezier(.2,1.8,.4,1) sube-gol}@keyframes sube-gol{0%{color:#fff;transform:scale(1.9)}}.punto{filter:url(#tiza);border:2.5px dashed #f1d6ac80;border-radius:50%;place-items:center;width:1.45rem;height:1.45rem;display:grid}.punto svg{fill:none;stroke:#06182f;stroke-width:3px;stroke-linecap:round;stroke-linejoin:round;width:70%;height:70%}.punto.gol{background:var(--si);border:2.5px solid var(--si);box-shadow:0 0 10px #6fd08c80}.punto.fallo{background:var(--no);border:2.5px solid var(--no);box-shadow:0 0 10px #ff6b6466}.punto.parada{background:var(--color-crema);border:2.5px solid var(--color-crema);box-shadow:0 0 10px #f1d6ac80}.punto.ahora{border-style:solid;border-color:var(--color-crema);animation:.9s ease-in-out infinite late}.punto.nuevo{animation:.52s cubic-bezier(.2,1.8,.4,1) punto-entra}@keyframes late{50%{transform:scale(1.18);box-shadow:0 0 12px #f1d6ac99}}@keyframes punto-entra{0%{transform:scale(.2)rotate(-40deg)}}.subita-marca{font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--no);align-self:center;font-size:.62rem}.escena-caja{background:radial-gradient(120% 90% at 50% 100%,#6fd08c1a,#0000 60%),#00132d8c;border-radius:6px 22px 8px 18px/18px 8px 22px 6px;position:relative;overflow:hidden}.escena{width:100%;height:auto;max-height:min(40vh,21rem);margin:0 auto;display:block}.escena .linea{stroke:var(--color-crema);fill:none;stroke-linecap:round;stroke-linejoin:round}.escena .poste{stroke-width:4.5px}.escena .red{stroke-width:1px;opacity:.32;transform-box:view-box;transform-origin:180px 100px}.escena .red.sacude{animation:.62s cubic-bezier(.2,1.4,.4,1) red-sacude}@keyframes red-sacude{25%{opacity:.7;transform:scale(1.06,1.1)translateY(-3px)}55%{transform:scale(.98,.97)}}.escena .suelo{stroke-width:2px;opacity:.5}.escena .area{stroke-width:1.6px;opacity:.35}#portero{--c:var(--color-crema);transform-box:view-box;transform-origin:180px 150px;transition:transform .46s cubic-bezier(.2,.9,.3,1.1)}#portero .cuerpo{stroke:var(--c);stroke-width:4px;fill:none;stroke-linecap:round}#portero .cabeza{fill:var(--c)}#portero .guante{fill:var(--c);stroke:#06182f;stroke-width:1.2px}#portero.tuyo{--c:var(--si)}#balon{transform-box:view-box;transform-origin:180px 200px;transition:transform .47s cubic-bezier(.25,.6,.35,1)}#balon .bola{fill:#fffaf0;stroke:#06182f;stroke-width:1.4px}#balon .parche{fill:#06182f}#balon.carrera{animation:.2s ease-in-out 2 alternate carrera}@keyframes carrera{to{transform:translateY(2px)scale(1.06)}}#tirador{transition:opacity .3s}#tirador .aro{fill:none;stroke:var(--no);stroke-width:2.5px}.escena .rotulo-svg{fill:var(--color-crema);font-family:var(--font-display);letter-spacing:.08em;text-transform:uppercase;font-size:13px;font-weight:900}.sin-anim,.sin-anim *{transition:none!important}.rotulo{pointer-events:none;text-align:center;place-items:center;margin:0;padding:0 1rem;display:grid;position:absolute;inset:0}.rotulo .grito{text-shadow:0 5px #00000073,0 0 24px #00132de6;font-size:clamp(2.4rem,12vw,4.4rem)}.rotulo .grito.bueno{color:var(--si)}.rotulo .grito.malo{color:var(--no)}.rotulo .grito.chico{font-size:clamp(1.6rem,7vw,2.6rem)}.rotulo .sale{animation:.35s ease-in forwards rotulo-sale}@keyframes rotulo-sale{to{opacity:0;transform:scale(1.3)}}.banner-subita{text-align:center;font-family:var(--font-display);text-transform:uppercase;letter-spacing:.06em;color:var(--no);margin:0;font-size:1rem;font-weight:900;animation:.9s ease-in-out infinite late;position:absolute;top:.5rem;left:0;right:0}.panel{align-content:start;gap:.8rem;min-height:14rem;display:grid}.reloj{background:#f1d6ac1f;border:1.5px solid #f1d6ac4d;border-radius:99px;height:.7rem;overflow:hidden}.reloj span{background:var(--color-crema);transform-origin:0;border-radius:99px;width:100%;height:100%;display:block}.reloj.apura span{background:var(--no);box-shadow:0 0 10px #ff6b64b3}.reloj.apura{animation:.28s cubic-bezier(.36,.07,.19,.97) infinite tiembla}.pregunta{align-items:center;gap:.9rem;display:flex}.pregunta .p-texto{gap:.2rem;min-width:0;display:grid}.pregunta .p-quien{margin:0}.pregunta h2{font-family:var(--font-display);text-transform:uppercase;color:var(--color-crema);overflow-wrap:anywhere;margin:0;font-size:clamp(1.5rem,6.4vw,2.2rem);font-weight:900;line-height:.95}.p-escudo{object-fit:contain;vertical-align:-.2rem;width:1.3rem;height:1.3rem;margin-left:.3rem}.cara-circulo{width:4.8rem;height:4.8rem;box-shadow:0 0 0 3px var(--color-crema);background:#16294a;border-radius:50%;flex:none;position:relative;overflow:hidden}.cara-circulo img{width:150%;max-width:none;position:absolute;top:0;left:50%;transform:translate(-50%)}.cara-circulo.grande{width:6.4rem;height:6.4rem}.cara-circulo.rival{box-shadow:0 0 0 3px var(--no)}.opciones{grid-template-columns:1fr 1fr;gap:.6rem;display:grid}.opcion{cursor:pointer;min-height:4.1rem;font-family:var(--font-display);text-transform:uppercase;color:var(--color-crema);text-align:center;background:#00132dbf;border:2.5px solid #f1d6ac8c;border-radius:5px 16px 6px 13px/13px 6px 16px 5px;justify-content:center;align-items:center;gap:.5rem;padding:.5rem .7rem;font-size:1.15rem;font-weight:900;line-height:1;transition:transform .12s,background .16s,border-color .16s;display:flex;position:relative;box-shadow:0 .3rem #0006}.opcion:hover{border-color:var(--color-crema);background:#f1d6ac1a}.opcion:active{transform:translateY(.25rem);box-shadow:0 .05rem #0006}.opcion img{object-fit:contain;flex:none;width:2rem;height:2rem}.opcion img.bandera{object-fit:cover;border-radius:3px;width:2.2rem;height:1.5rem}.opcion .num{font-size:2.1rem}.opcion .tecla{font-family:var(--font-mono);color:var(--tiza-suave);font-size:.6rem;position:absolute;top:.25rem;left:.45rem}.opciones.cerradas .opcion{cursor:default}.opcion.elegida{border-color:var(--color-crema);background:#f1d6ac2e}.opcion.buena{background:var(--si);border-color:var(--si);color:#06240f;box-shadow:0 0 14px #6fd08c99}.opcion.mala{background:var(--no);border-color:var(--no);color:#2b0606}.opciones.cerradas .opcion:not(.buena):not(.mala){opacity:.45}.error-p{color:#ff9d98;min-height:1.1rem;margin:0}.empezar{justify-items:start;gap:1rem;display:grid}.empezar .boton-juego{font-size:2rem}.final-p{gap:.9rem;scroll-margin-top:6.5rem;display:grid}.final-p .resultado{flex-wrap:wrap;align-items:baseline;gap:.8rem;display:flex}.final-p .tanteo{font-family:var(--font-display);color:var(--color-crema);font-size:clamp(2.6rem,12vw,4rem);font-weight:900;line-height:.9}.grito.perdio{color:var(--no)}.hechos{grid-template-columns:repeat(auto-fill,minmax(10.5rem,1fr));gap:.45rem;margin:0;padding:0;list-style:none;display:grid}.hecho{border-left:4px solid var(--no);background:#f1d6ac0f;border-radius:8px;align-items:center;gap:.5rem;padding:.35rem .5rem;display:flex}.hecho.bueno{border-left-color:var(--si)}.hecho .cara-circulo{width:2.3rem;height:2.3rem;box-shadow:none}.hecho p{min-width:0;margin:0;font-size:.8rem;line-height:1.2}.hecho strong{font-family:var(--font-display);text-transform:uppercase;color:var(--color-crema);text-overflow:ellipsis;white-space:nowrap;font-size:.95rem;font-weight:900;display:block;overflow:hidden}.hecho span{font-family:var(--font-mono);color:var(--tiza-suave);font-size:.64rem}.final-botones{flex-wrap:wrap;gap:.6rem;display:flex}.final-botones .boton-juego{font-size:1.3rem}@media (width>=60rem){.penales{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:start;column-gap:2rem}.penales-top{grid-column:1/-1}.marcador,.escena-caja{grid-column:1}.panel{grid-area:2/2/span 2}.escena{max-height:none}}@media (prefers-reduced-motion:reduce){#portero,#balon,#tirador{transition:none}.punto.ahora,.punto.nuevo,.m-goles.sube,.escena .red.sacude,#balon.carrera,.reloj.apura,.banner-subita,.rotulo .sale{animation:none}}
