/* Supraide Activaciones · el panel (profesional, limpio) · tokens de la marca */
@font-face{font-family:'Montserrat';src:url(fuentes/montserrat-latin-400-normal.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Montserrat';src:url(fuentes/montserrat-latin-600-normal.woff2) format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Montserrat';src:url(fuentes/montserrat-latin-700-normal.woff2) format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Montserrat';src:url(fuentes/montserrat-latin-800-normal.woff2) format('woff2');font-weight:800;font-display:swap}
:root{--violeta:#6938EF;--violeta-osc:#3d1fa3;--noche:#241263;--rosa:#D6266F;--rosa-osc:#b01a5b;--sol:#FFCA45;--tinta:#141B35;--suave:#454b66;--fondo:#F7F9FF;--lila:#efeafc;--borde:#e2dcf5;--ok:#0b5e3b;--ok-f:#d8f5e6;--av:#6b4a00;--av-f:#FFF1C7;--err:#8f1a30;--err-f:#ffe0e6;--radio:18px}
*{box-sizing:border-box}
body{margin:0;font-family:Montserrat,system-ui,sans-serif;color:var(--tinta);background:var(--fondo);font-size:15px;line-height:1.5}
a{color:#5b2bd9}a:hover{color:var(--violeta-osc)}
:focus-visible{outline:3px solid var(--rosa-osc);outline-offset:2px;border-radius:6px}
.lado :focus-visible{outline-color:var(--sol)}
h1{font-size:28px;font-weight:800;margin:0 0 4px;line-height:1.15}
h2{font-size:19px;font-weight:800;margin:0 0 12px}
h3{font-size:16px;font-weight:800;margin:0 0 6px}
p{margin:0 0 10px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.marco{display:flex;flex-wrap:wrap;min-height:100vh}
.lado{flex:1 1 230px;max-width:250px;background:var(--noche);color:#fff;padding:22px 14px;display:flex;flex-direction:column;gap:4px}
.lado img{width:180px;height:auto;margin:0 0 20px 6px}
.lado a{color:#e6defc;text-decoration:none;font-weight:600;padding:11px 14px;border-radius:12px}
.lado a[aria-current="page"]{background:rgba(255,255,255,.14);color:#fff;font-weight:700}
.lado a:hover{background:rgba(255,255,255,.08);color:#fff}
.lado .quien{margin-top:auto;font-size:13px;color:#cfc6f2;padding:12px 6px 0;border-top:1px solid rgba(255,255,255,.12)}
.lado form{margin:8px 0 0}
.lado button{background:none;border:1px solid rgba(255,255,255,.35);color:#fff;border-radius:99px;padding:8px 14px;font:inherit;font-weight:700;cursor:pointer}
.contenido{flex:999 1 560px;min-width:0;padding:28px 36px 48px}
.ancho{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:22px}
.cab{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px}
.eti{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#5b2bd9}
.meta{color:var(--suave);font-size:14px}
.caja{background:#fff;border:1px solid var(--borde);border-radius:var(--radio);padding:20px}
.rejilla{display:grid;gap:16px}
.r2{grid-template-columns:repeat(2,minmax(0,1fr))}.r3{grid-template-columns:repeat(3,minmax(0,1fr))}.r4{grid-template-columns:repeat(4,minmax(0,1fr))}
.kpi{background:#fff;border:1px solid var(--borde);border-radius:16px;padding:14px 16px}
.kpi b{display:block;font-size:30px;font-weight:800;line-height:1.1}
.kpi span{font-size:13px;color:var(--suave);font-weight:600}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:10px 18px;border-radius:99px;font:inherit;font-weight:800;font-size:15px;text-decoration:none;border:2px solid transparent;cursor:pointer;background:var(--rosa);color:#fff}
.btn:hover{background:var(--rosa-osc);color:#fff}
.btn-2{background:#fff;color:var(--tinta);border-color:var(--tinta)}
.btn-2:hover{background:var(--lila);color:var(--tinta)}
.btn-3{background:var(--lila);color:var(--tinta)}
.btn-3:hover{background:#e0d6fb;color:var(--tinta)}
.btn-chico{min-height:36px;padding:6px 14px;font-size:14px}
.chip{display:inline-block;font-size:12px;font-weight:800;padding:4px 10px;border-radius:99px;background:var(--lila);color:var(--tinta)}
.e-activa{background:var(--ok-f);color:var(--ok)}.e-pausada,.e-lista,.e-preparacion{background:var(--av-f);color:var(--av)}.e-finalizada,.e-cancelada,.e-borrador{background:#ece9f5;color:var(--suave)}
.aviso{border-radius:14px;padding:12px 16px;font-weight:700}
.aviso-ok{background:var(--ok-f);color:var(--ok)}.aviso-err{background:var(--err-f);color:var(--err)}.aviso-av{background:var(--av-f);color:var(--av)}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:left;padding:10px 8px;border-bottom:1px solid var(--lila);vertical-align:top}
thead th{font-size:12px;color:var(--suave);border-bottom:2px solid var(--borde);text-transform:uppercase;letter-spacing:.04em}
.tabla{overflow-x:auto;position:relative}
fieldset{border:0;padding:0;margin:0;min-width:0}
.campos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px}
.campo{display:flex;flex-direction:column;gap:5px;font-weight:700;font-size:14px}
.campo small{font-weight:400;color:var(--suave);font-size:12.5px}
.ancho-todo{grid-column:1/-1}
input[type=text],input[type=email],input[type=password],input[type=number],input[type=datetime-local],select,textarea{font:inherit;font-weight:400;font-size:15px;min-height:44px;padding:9px 12px;border:2px solid #857e70;border-radius:12px;background:#fff;color:var(--tinta);width:100%}
textarea{min-height:110px;resize:vertical}
.check{display:flex;gap:10px;align-items:flex-start;font-weight:600}
.check input{width:20px;height:20px;margin-top:2px;accent-color:var(--violeta)}
.lista-ver{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.lista-ver li{display:flex;gap:10px;align-items:flex-start}
.ico{width:22px;height:22px;flex:none;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:800}
.ico-ok{background:var(--ok-f);color:var(--ok)}.ico-no{background:var(--err-f);color:var(--err)}
.fila{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.entre{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
details.editar summary{cursor:pointer;font-weight:700;color:#5b2bd9}
.qr-chico{width:96px;height:96px;background:#fff;border-radius:10px;padding:6px;border:1px solid var(--borde)}
.qr-chico svg{width:100%;height:100%;display:block}
.vacio{padding:26px;text-align:center;color:var(--suave);background:#fff;border:2px dashed var(--borde);border-radius:var(--radio)}
.solo-centro{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(135deg,#5a2ee0,#2a1475)}
.tarjeta-entrar{background:#fff;border-radius:24px;padding:30px;width:min(420px,100%);display:flex;flex-direction:column;gap:14px}
.tarjeta-entrar img{width:200px;height:auto;align-self:center;background:var(--noche);padding:10px 14px;border-radius:14px}
@media (max-width:900px){.r3,.r4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.contenido{padding:20px 16px 40px}.lado{max-width:none}.r2,.r3,.campos{grid-template-columns:1fr}.r4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media print{.lado,.no-imprimir{display:none!important}body{background:#fff}}
.centro{text-align:center}.pila{display:flex;flex-direction:column;gap:12px}.derecha{text-align:right}.chico{font-size:13px}.fuerte{font-weight:800}.m0{margin:0}
.hoja-qr{max-width:640px;margin:0 auto;padding:40px 24px;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;background:#fff;min-height:100vh}
.hoja-logo{width:260px;height:auto}
.hoja-qr h1{font-size:36px}
.hoja-sub{font-size:22px;font-weight:700;color:var(--violeta-osc)}
.hoja-codigo{width:340px;height:340px;border:6px solid var(--violeta);border-radius:24px;padding:12px;background:#fff}
.hoja-codigo svg{width:100%;height:100%;display:block}
.hoja-lugar{font-size:20px;font-weight:800}
.jugar{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:28px;color:#fff;background:radial-gradient(700px 500px at 50% 20%,#8a5cff,transparent 60%),linear-gradient(160deg,#5a2ee0,#2a1475)}
.jugar-logo{width:220px;height:auto;margin-bottom:12px}
.jugar h1{font-size:26px}
.jugar p{color:#e6defc;max-width:32ch;font-size:17px}
.jugar .jugar-grande{font-size:40px;font-weight:800;color:var(--sol);margin:0}
.ancho>*,.caja,.rejilla>*{min-width:0}
.caja h3{margin-top:18px}
.caja h3:first-child{margin-top:0}
.lado .quien a{display:inline;padding:0;color:#fff;text-decoration:underline;font-weight:700}
/* ---- el juego del participante ---- */
.jugar-titulo{font-size:22px;margin:0}
.jugar-lema{font-size:26px;font-weight:800;color:var(--sol);margin:0;line-height:1.15}
.juego{width:min(420px,100%);display:flex;flex-direction:column;align-items:center;gap:14px}
.rueda{position:relative;width:min(360px,86vw);aspect-ratio:1}
.rueda canvas{position:absolute;inset:6%;width:88%;height:88%;border-radius:50%}
.rueda-aro{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.rueda-flecha{position:absolute;left:50%;top:-4%;width:16%;height:auto;transform:translateX(-50%);pointer-events:none;filter:drop-shadow(0 4px 4px rgba(0,0,0,.3))}
.rueda-centro{position:absolute;left:50%;top:50%;width:20%;height:auto;transform:translate(-50%,-50%);pointer-events:none}
.jugar-boton{display:inline-flex;align-items:center;justify-content:center;min-height:56px;min-width:220px;padding:12px 30px;border-radius:99px;border:0;background:var(--sol);color:var(--tinta);font:inherit;font-size:22px;font-weight:800;text-decoration:none;cursor:pointer;box-shadow:0 6px 0 #c9921c}
.jugar-boton:active{transform:translateY(3px);box-shadow:0 3px 0 #c9921c}
.jugar-boton:disabled{opacity:.6;cursor:default}
.jugar-boton-2{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.6);box-shadow:none;font-size:16px;min-height:44px}
.jugar :focus-visible{outline-color:var(--sol)}
.raspa{position:relative;width:min(380px,90vw);aspect-ratio:3/2;border-radius:22px;overflow:hidden;background:#fff;border:6px solid var(--sol)}
.raspa-premio{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--tinta)}
.raspa-premio img{width:40%;height:auto}
.raspa-premio b{font-size:22px}
.raspa canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:pointer;transition:opacity .5s}
.raspa canvas.raspa-fuera{opacity:0;pointer-events:none}
.jugar-ayuda{margin:0;font-size:15px}
.resultado{background:#fff;color:var(--tinta);border-radius:22px;padding:22px;width:100%;text-align:center;display:flex;flex-direction:column;align-items:center;gap:6px;box-shadow:0 20px 40px -20px rgba(0,0,0,.5)}
.resultado[hidden]{display:none}
.resultado p{color:var(--tinta);margin:0}
.resultado-eti{font-size:15px;font-weight:800;color:var(--rosa)!important;text-transform:uppercase;letter-spacing:.06em}
.resultado-premio{font-size:28px;font-weight:800}
.resultado-codigo{font-size:18px}
.resultado-codigo b{font-size:30px;letter-spacing:.15em}
.jugar-aviso{min-height:1.4em;font-weight:700;color:#fff!important}
.jugar-pie{font-size:13px!important}
.jugar-pie a{color:#fff}
.confeti{position:fixed;top:-12px;left:var(--x);width:10px;height:16px;background:var(--c);border-radius:3px;z-index:20;pointer-events:none;animation:caer var(--d) ease-in forwards}
@keyframes caer{to{transform:translateY(105vh) rotate(var(--r))}}
.premio-tarjeta{background:#fff;color:var(--tinta);border-radius:22px;padding:24px;width:min(420px,100%);display:flex;flex-direction:column;align-items:center;gap:8px}
.premio-tarjeta p{color:var(--suave)}
.premio-codigo{font-size:46px;font-weight:800;letter-spacing:.18em;color:var(--tinta)!important;margin:0}
.premio-qr{width:180px;height:180px}
.premio-qr svg{width:100%;height:100%}
.jugar-texto{justify-content:flex-start}
.bases{background:#fff;color:var(--tinta);border-radius:18px;padding:20px;max-width:640px;text-align:left;line-height:1.6}
.bases-fijo{font-weight:700}
@media (prefers-reduced-motion:reduce){.raspa canvas,.rueda canvas{transition:none!important}}
/* ---- v0.5 · la pantalla del juego como el diseño de Franco ---- */
.jugar{position:relative;overflow:hidden;isolation:isolate}
.jugar>*{position:relative;z-index:1}
.jugar-rayos{position:absolute!important;z-index:0!important;left:50%;top:44%;width:240vmax;height:240vmax;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(255,160,255,.55) 0,rgba(180,90,255,.25) 18%,transparent 42%),repeating-conic-gradient(from 0deg,rgba(255,255,255,.08) 0 5deg,transparent 5deg 12deg);pointer-events:none}
.jugar-chispas{position:absolute!important;z-index:0!important;left:0;top:16%;width:100%;height:auto;opacity:.95;pointer-events:none}
.jugar-pantalla{min-height:100vh;min-height:100dvh;justify-content:flex-start;gap:10px;padding:12px 14px calc(12px + env(safe-area-inset-bottom))}
.jugar-pantalla .jugar-logo{width:170px;margin:0}
.cinta{display:flex;flex-direction:column;align-items:center;margin-top:2px}
.cinta-titulo{font-size:clamp(28px,8.6vw,42px);font-weight:800;color:#fff;line-height:1.05;padding:8px 26px 12px;background:linear-gradient(180deg,#a25bff,#6a1fe6);border:4px solid #fff;border-radius:26px;box-shadow:0 6px 0 #3d118f,0 12px 24px -8px rgba(20,0,60,.6);text-shadow:0 3px 0 #4b16b0;max-width:94vw}
.cinta-lema{margin:-10px 0 0!important;padding:7px 20px;font-size:clamp(15px,4.4vw,19px)!important;font-weight:800;color:#3b1380!important;background:linear-gradient(180deg,#ffe56e,#ffc21a);border:3px solid #fff;border-radius:99px;box-shadow:0 5px 0 #d1890f;transform:rotate(-2deg);max-width:none!important}
.juego{gap:12px}
.rueda{width:min(84vw,44dvh,380px);margin-top:6px}
.rueda-brillo{position:absolute;inset:-14%;border-radius:50%;background:radial-gradient(circle,rgba(255,215,120,.55),transparent 62%);pointer-events:none}
.rueda canvas{inset:7%;width:86%;height:86%}
.rueda-flecha{top:-6%;width:17%;z-index:2}
.rueda-centro{width:19%;z-index:2}
.rueda-aro{z-index:1}
.rueda-flecha{transform-origin:50% 24%}.rueda-aro{will-change:transform}
@keyframes flecha{to{transform:translateX(-50%) rotate(-9deg)}}
.jugar-boton{gap:12px;min-height:64px;min-width:min(78vw,320px);font-size:30px;color:#3b1380;background:linear-gradient(180deg,#ffe56e 0,#ffc21a 100%);border:4px solid #fff;box-shadow:0 7px 0 #d1890f,0 14px 24px -10px rgba(20,0,60,.7)}
.jugar-boton svg{width:32px;height:32px}
.jugar-boton:active{box-shadow:0 3px 0 #d1890f}
.jugar-boton:disabled{opacity:1;filter:saturate(.6) brightness(.95)}
.jugar-boton-listo{background:#efe7ff;color:#4b22c9;box-shadow:0 5px 0 #b9a6f0;font-size:22px}
.jugar-boton-listo svg{display:none}
.jugar-boton-chico{min-height:52px;min-width:0;width:100%;font-size:19px;border-width:3px}
.puedes{display:flex;justify-content:center;gap:4px;width:min(420px,96vw);background:rgba(36,10,110,.42);border:1px solid rgba(255,255,255,.18);border-radius:20px;padding:10px 6px}
.puedes-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;padding:0 4px;border-right:1px solid rgba(255,255,255,.2)}
.puedes-item:last-child{border-right:0}
.puedes-item img{width:52px;height:52px;object-fit:contain}
.puedes-item span{font-size:13px;font-weight:800;color:#fff;line-height:1.15}
.jugar-pantalla .jugar-pie{margin:0;color:#e6defc}
body.con-modal{overflow:hidden}
.modal{position:fixed!important;inset:0;z-index:30!important;background:rgba(18,6,56,.62);display:grid;place-items:center;padding:16px}
.modal[hidden]{display:none}
.modal-caja{background:#fff;border-radius:26px;padding:18px 20px 16px;width:min(360px,92vw);max-height:94dvh;overflow:auto;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;box-shadow:0 24px 50px -16px rgba(0,0,0,.6);animation:aparecer .35s cubic-bezier(.2,1.4,.4,1)}
@keyframes aparecer{from{transform:scale(.7);opacity:0}}
.modal-caja p{margin:0;color:var(--tinta)}
.modal-cinta{background:linear-gradient(180deg,#ff4fa0,#e41f7b);color:#fff!important;font-size:24px;font-weight:800;padding:6px 22px;border-radius:99px;margin-top:-4px!important;box-shadow:0 4px 0 #a5155a;text-transform:uppercase;letter-spacing:.03em}
.modal-icono{width:96px;height:96px;object-fit:contain;margin:6px 0 0}
.modal-premio{font-size:26px;font-weight:800;line-height:1.1}
.modal-desc{color:var(--suave)!important;font-size:14px}
.modal-cod-eti{margin-top:6px!important;font-size:12px;font-weight:800;color:var(--suave)!important;text-transform:uppercase;letter-spacing:.08em}
.modal-codigo{font-size:52px;font-weight:800;letter-spacing:.16em;line-height:1;color:#3b1380!important}
.modal-qr{width:132px;height:132px;margin:4px 0}
.modal-qr svg{width:100%;height:100%;display:block}
.modal-nota{font-size:13px;color:var(--suave)!important;margin-bottom:6px!important}
.modal-cerrar{background:none;border:0;color:#5b2bd9;font:inherit;font-weight:700;font-size:15px;padding:10px;cursor:pointer;text-decoration:underline}
.raspa{width:min(86vw,380px)}
@media (max-height:700px){.jugar-pantalla .jugar-logo{width:130px}.rueda{width:min(80vw,40dvh)}.puedes-item img{width:40px;height:40px}}
.premio-pagina{animation:none;margin-top:4px}
.premio-pagina .chip{margin-bottom:4px}
/* v0.5 · ajustes después de ver las capturas */
.modal-caja .modal-premio{font-size:26px;font-weight:800;line-height:1.1;max-width:none}
.modal-caja .modal-desc{font-size:14px;max-width:none}
.modal-caja .modal-cod-eti{font-size:12px;max-width:none}
.modal-caja .modal-codigo{font-size:56px;max-width:none;margin:2px 0 4px}
.modal-caja .modal-nota{font-size:13px;max-width:30ch}
.modal-caja .modal-cinta{font-size:22px;max-width:none}
.modal-botones{display:flex;gap:8px;width:100%;margin-top:6px}
.modal-botones .jugar-boton-chico{flex:1;gap:6px;font-size:16px;padding:0 10px;min-height:52px}
.modal-botones svg{width:22px;height:22px;flex:none}
.jugar-boton-blanco{background:#fff;color:#5b2bd9;border-color:#d9ccff;box-shadow:0 5px 0 #b9a6f0}
.confeti{z-index:25!important}
/* el raspa como el diseño: tarjeta rosa con rayos y marco dorado */
.juego-raspa .raspa{aspect-ratio:3/2;border-radius:24px;border:8px solid #ffc21a;box-shadow:0 0 0 3px #fff3b0 inset,0 7px 0 #d1890f,0 18px 30px -12px rgba(20,0,60,.7);background:radial-gradient(circle,rgba(255,236,140,.95) 0,rgba(255,170,60,.55) 22%,transparent 50%),repeating-conic-gradient(from 0deg at 50% 50%,#ff3f95 0 8deg,#e41f7b 8deg 16deg)}
.juego-raspa .raspa-premio{color:#fff;text-shadow:0 2px 0 rgba(90,0,50,.45)}
.juego-raspa .raspa-premio img{width:42%;filter:drop-shadow(0 6px 10px rgba(80,0,40,.4))}
.juego-raspa .raspa-premio b{font-size:22px;font-weight:800}
.raspa-pista{display:inline-flex;align-items:center;gap:8px;margin:0!important;padding:8px 18px;border-radius:99px;background:linear-gradient(180deg,#ffe56e,#ffc21a);border:3px solid #fff;box-shadow:0 4px 0 #d1890f;color:#3b1380!important;font-weight:800;font-size:16px!important;max-width:none!important}
.raspa-pista svg{width:26px;height:26px}
.raspa-pista[hidden]{display:none}
.jugar-enlace{background:none;border:0;color:#fff;font:inherit;font-weight:700;font-size:15px;text-decoration:underline;padding:10px;cursor:pointer;opacity:.85}
.jugar-enlace[hidden]{display:none}
.premio-pagina .premio-titulo{font-size:28px;font-weight:800;color:#3b1380;margin:2px 0 4px}
.premio-pagina .premio-boleto{font-size:22px;font-weight:800;color:#3b1380;max-width:none;padding:10px 22px;background:linear-gradient(180deg,#ffe56e,#ffc21a);border:3px solid #fff;border-radius:14px;box-shadow:0 0 0 2px #ffc21a,0 5px 0 #d1890f}
.premio-pagina .modal-icono{width:120px;height:120px}
.premio-volver{gap:8px;width:min(320px,86vw)}
.premio-volver svg{width:24px;height:24px}
.modal-caja{position:relative;z-index:1}
.modal-botones .jugar-boton-chico{font-size:15px;white-space:nowrap;padding:0 8px;gap:5px}
.modal-botones svg{width:20px;height:20px}
.modal .confeti{z-index:0!important}
.modal-botones{flex-wrap:wrap}
.modal-botones .jugar-boton-chico{min-width:150px}
.modal-caja:focus{outline:none}
/* v0.5.1 · todo entra en una pantalla, sin scroll */
.jugar-pantalla{height:100vh;height:100dvh;min-height:0;gap:8px;padding-top:max(10px,env(safe-area-inset-top));overflow:hidden}
.jugar-pantalla .jugar-logo{width:140px}
.jugar-pantalla .cinta-titulo{font-size:clamp(24px,7.4vw,36px);padding:6px 22px 10px}
.jugar-pantalla .cinta-lema{font-size:clamp(14px,4vw,17px)!important;padding:6px 16px}
.jugar-pantalla .rueda{width:max(200px,min(84vw,380px,calc(100dvh - 400px)))}
.jugar-pantalla .juego{gap:8px}
.jugar-pantalla .jugar-boton{min-height:58px;font-size:26px}
.jugar-pantalla .jugar-boton svg{width:26px;height:26px}
.jugar-aviso:empty{display:none}
.puedes{overflow-x:auto;scrollbar-width:none;justify-content:flex-start;padding:8px 6px;margin-top:auto}
.puedes::-webkit-scrollbar{display:none}
.puedes-item{min-width:80px}
.puedes-item img{width:40px;height:40px}
.puedes-item span{font-size:12px}
.jugar-pantalla .jugar-pie{font-size:12px!important;max-width:none}
.jugar-pantalla .raspa{width:max(220px,min(86vw,380px,calc((100dvh - 380px) * 1.5)))}
@media (max-height:700px){.jugar-pantalla .jugar-logo{width:110px}.jugar-pantalla .rueda{width:max(200px,min(84vw,calc(100dvh - 370px)))}}
.puedes{justify-content:safe center}.jugar-pantalla{overflow-x:hidden;overflow-y:auto}
/* v0.6 · canje */
.canje-form{display:flex;flex-direction:column;gap:12px;align-items:stretch}
.canje-form label{font-weight:800}
.canje-form input{font-size:44px;font-weight:800;letter-spacing:.3em;text-align:center;padding:10px;border:2px solid #cfc3f7;border-radius:16px;font-family:inherit}
.canje-form input:focus{outline:3px solid #6938EF;outline-offset:2px}
.canje-boton{min-height:56px;font-size:20px;width:100%}
.canje-res{border-width:3px}
.canje-ok{border-color:#16a34a;background:#f0fdf4}
.canje-no{border-color:#dc2626;background:#fef2f2}
.canje-sello{font-size:26px;font-weight:800;margin:0 0 10px}
.canje-ok .canje-sello{color:#15803d}.canje-no .canje-sello{color:#b91c1c}
.canje-premio{display:flex;gap:12px;align-items:center;margin-bottom:8px}
.canje-premio b{display:block;font-size:20px}
.canje-premio span{display:block;color:var(--suave);font-size:14px}
.canje-premio .canje-ojo{color:#b45309;font-weight:700}
.canje-puesto label{font-weight:700;display:block;margin-bottom:6px}
.canje-puesto select{flex:1;min-height:44px;font:inherit;padding:6px;border-radius:10px;border:1px solid #cfc3f7}
.canje-lista{list-style:none;margin:0;padding:0}
.canje-lista li{padding:8px 0;border-bottom:1px solid #eee;display:flex;gap:8px;flex-wrap:wrap}
.canje-lista span{color:var(--suave);margin-left:auto}
.equipo-caja{background:#fff;border-radius:20px;padding:14px 16px;width:min(360px,92vw);border:3px solid #16a34a;text-align:center}
.equipo-caja p{color:var(--tinta)!important;margin:0 0 8px!important;font-size:15px!important;max-width:none!important}
.equipo-caja a{color:#5b2bd9}
/* v0.6 · reporte */
.barras{width:100%;height:auto;max-height:220px}
.barras .barra{fill:#b9a6f0}.barras .barra-pico{fill:#6938EF}
.barras text{font-size:10px;fill:#6b6f86;font-family:inherit}
.barras-eje{stroke:#d9d3ef}
.lado-sub{padding-left:24px!important;font-size:14px}
.canje-kpis{grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px}
.premio-pantalla{height:auto;min-height:100vh;min-height:100dvh;overflow:visible}
.aviso-ok{font-size:17px}
/* en el teléfono, el menú es una barra corta arriba: lo importante (el código) queda a la vista */
@media (max-width:640px){
  .lado{flex:1 1 100%;flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px 6px;padding:10px 12px}
  .lado img{width:110px;margin:0 8px 0 0}
  .lado a{padding:7px 10px;font-size:14px}
  .lado .lado-sub{padding-left:10px!important}
  .lado .quien{margin:0 0 0 auto;border:0;padding:0;font-size:12px;display:flex;align-items:center;gap:8px}
  .lado .quien br{display:none}
  .lado .quien form{margin:0}
  .lado button{padding:5px 10px;font-size:13px}
}
.barras{max-width:760px;display:block;margin:0 auto}
.fila-fin{justify-content:flex-end}
/* v0.7 · recuperar el premio */
.mis-premios{display:flex;align-items:center;gap:10px;width:min(420px,94vw);padding:6px 14px 6px 8px;background:#fff;color:#3b1380;border-radius:99px;text-decoration:none;font-weight:600;font-size:14px;line-height:1.2;text-align:left;box-shadow:0 4px 0 #d1890f;border:3px solid #ffc21a;animation:aparecer .4s ease-out}
.mis-premios img{width:36px;height:36px;object-fit:contain;flex:none}
.mis-premios span:nth-of-type(1){flex:1}
.mis-premios span:last-child{font-size:24px;font-weight:800}
.jugar-pantalla.con-mis .rueda{width:max(190px,min(84vw,380px,calc(100dvh - 456px)))}
.jugar-aviso-enlace{color:#ffe56e;font-weight:800}
/* v0.7 · el color de la marca. Sin color elegido queda el violeta de Supraide. */
.jugar{--marca:#6938EF}
@supports (background:color-mix(in srgb,red,blue)){
  .jugar[data-marca]{background:radial-gradient(700px 500px at 50% 20%,color-mix(in srgb,var(--marca) 62%,#fff),transparent 60%),linear-gradient(160deg,var(--marca),color-mix(in srgb,var(--marca) 42%,#000))}
  .jugar[data-marca] .cinta-titulo{background:linear-gradient(180deg,color-mix(in srgb,var(--marca) 78%,#fff),var(--marca));box-shadow:0 6px 0 color-mix(in srgb,var(--marca) 55%,#000),0 12px 24px -8px rgba(0,0,0,.5);text-shadow:0 3px 0 color-mix(in srgb,var(--marca) 60%,#000)}
  .jugar[data-marca] .puedes{background:color-mix(in srgb,var(--marca) 45%,#000 30%)}
}
.jugar-logo-marca{width:auto!important;max-width:min(220px,60vw);max-height:72px;object-fit:contain;filter:drop-shadow(0 3px 6px rgba(0,0,0,.25))}
.jugar-pantalla .jugar-logo-marca{max-height:56px}
.marca-fila{display:flex;gap:20px;flex-wrap:wrap;align-items:flex-start}
.marca-vista{min-height:0;width:260px;padding:20px 14px;border-radius:18px;gap:10px;flex:none}
.marca-vista .cinta-titulo{font-size:22px;margin:0}
.marca-form{flex:1;min-width:240px;display:flex;flex-direction:column;gap:10px}
.marca-form input[type=color]{width:80px;height:44px;padding:2px;border-radius:10px;border:1px solid #cfc3f7}
.modal-botones .jugar-boton.jugar-boton-chico{font-size:15px;min-height:52px;min-width:150px}
.modal-botones .jugar-boton.jugar-boton-chico svg{width:20px;height:20px}
.jugar-pantalla .rueda{width:max(200px,min(84vw,380px,calc(100dvh - 415px)))}
.jugar-pantalla.con-mis .rueda{width:max(190px,min(84vw,380px,calc(100dvh - 470px)))}
/* v0.8 · demostración */
.chip-demo{background:#fff3c4;color:#7a4b00;border:1px solid #f0c24b;margin-left:6px}
.demo-cinta{margin:0!important;padding:4px 14px;border-radius:99px;background:#141B35;color:#FFCA45!important;font-weight:800;font-size:12px!important;letter-spacing:.12em;border:2px dashed #FFCA45;max-width:none!important}
.canje-demo{border-color:#f0c24b;background:#fffbea}
.canje-demo .canje-sello{color:#7a4b00}
.jugar-pantalla:has(.demo-cinta) .rueda{width:max(190px,min(84vw,380px,calc(100dvh - 445px)))}
/* v0.8 · segundo color de la marca: la cinta del título */
@supports (background:color-mix(in srgb,red,blue)){
  .jugar[data-marca2] .cinta-titulo{background:linear-gradient(180deg,color-mix(in srgb,var(--marca2) 78%,#fff),var(--marca2));box-shadow:0 6px 0 color-mix(in srgb,var(--marca2) 55%,#000),0 12px 24px -8px rgba(0,0,0,.5);text-shadow:0 3px 0 color-mix(in srgb,var(--marca2) 60%,#000)}
  .jugar[data-marca2] .puedes{background:color-mix(in srgb,var(--marca2) 50%,#000 25%)}
  .jugar[data-marca2] .modal-cinta{background:linear-gradient(180deg,color-mix(in srgb,var(--marca2) 80%,#fff),var(--marca2));box-shadow:0 4px 0 color-mix(in srgb,var(--marca2) 55%,#000)}
}
.jugar-pantalla .jugar-logo-marca{max-height:64px}
/* v0.8.1 · el logo de la marca más grande y centrado */
.jugar-logo-marca{display:block;margin-left:auto!important;margin-right:auto!important;max-width:min(340px,72vw);max-height:clamp(110px,22vh,190px)}
.jugar-pantalla .jugar-logo-marca{max-height:72px}
@media (min-height:760px){.jugar-pantalla .jugar-logo-marca{max-height:100px}}
.jugar:not(.jugar-pantalla) h1{font-size:clamp(26px,5vw,44px)}
.jugar:not(.jugar-pantalla) .jugar-grande{font-size:clamp(34px,7vw,64px)}
.jugar:not(.jugar-pantalla) p{font-size:clamp(16px,2.2vw,20px)}
/* v0.8.2 · el fondo (rayos y brillos) va pegado a la pantalla: ya no agranda la página ni deja scroll vacío */
.jugar-rayos{position:fixed!important;inset:0;width:auto;height:auto;left:0;top:0;transform:none;background:radial-gradient(circle at 50% 42%,rgba(255,160,255,.5) 0,rgba(180,90,255,.22) 22vmax,transparent 48vmax),repeating-conic-gradient(from 0deg at 50% 42%,rgba(255,255,255,.08) 0 5deg,transparent 5deg 12deg)}
.jugar-chispas{position:fixed!important;inset:0;top:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%}
html:has(.jugar){background:#2a1475}
/* en computadora o pantalla grande, el juego crece con la pantalla (sin pasarse del alto) */
@media (min-width:700px) and (min-height:700px){
  .jugar-pantalla .rueda{width:max(260px,min(560px,calc(100dvh - 430px)))}
  .jugar-pantalla.con-mis .rueda{width:max(240px,min(560px,calc(100dvh - 485px)))}
  .jugar-pantalla .jugar-boton:not(.jugar-boton-chico){min-width:360px;min-height:64px;font-size:30px}
  .jugar-pantalla .cinta-titulo{font-size:40px}
  .jugar-pantalla .cinta-lema{font-size:19px!important}
  .jugar-pantalla .puedes{width:min(560px,90vw)}
  .jugar-pantalla .raspa{width:max(260px,min(560px,calc((100dvh - 400px) * 1.5)))}
}
/* v0.8.3 · el raspa: nada se aplasta ni se mueve */
.jugar-pantalla{overscroll-behavior:none}
.jugar-pantalla>*,.jugar-pantalla .juego>*{flex-shrink:0}
.jugar-pantalla .raspa{width:max(200px,min(86vw,380px,calc((100dvh - 470px) * 1.5)))}
.jugar-pantalla.con-mis .raspa{width:max(190px,min(86vw,380px,calc((100dvh - 535px) * 1.5)))}
@media (min-width:700px) and (min-height:700px){
  .jugar-pantalla .raspa{width:max(260px,min(560px,calc((100dvh - 470px) * 1.5)))}
  .jugar-pantalla.con-mis .raspa{width:max(240px,min(560px,calc((100dvh - 535px) * 1.5)))}
}
.raspa-pista[hidden],.jugar-enlace[hidden]{display:none!important}
.jugar-pantalla .jugar-aviso{font-size:16px!important;max-width:34ch!important;margin:0}
.premio-pantalla .jugar-logo-marca{max-height:84px}
@media (max-height:620px){.jugar-pantalla.con-mis .puedes{display:none}}
/* v0.9 · destellos nítidos que titilan (la estrella de Franco). Las cintas grandes, solo en el teléfono. */
.estrellas{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.estrellas img{position:absolute;width:var(--t,28px);height:auto;opacity:.95;filter:drop-shadow(0 0 10px rgba(255,214,90,.75));animation:titilar var(--d,3.2s) ease-in-out infinite;animation-delay:var(--r,0s)}
.estrellas img:nth-child(1){left:6%;top:12%;--t:34px;--r:-.4s}
.estrellas img:nth-child(2){left:22%;top:6%;--t:22px;--r:-1.2s;--d:2.6s}
.estrellas img:nth-child(3){left:12%;top:38%;--t:44px;--r:-2s}
.estrellas img:nth-child(4){left:4%;top:66%;--t:26px;--r:-.8s;--d:3.8s}
.estrellas img:nth-child(5){left:24%;top:82%;--t:38px;--r:-2.6s}
.estrellas img:nth-child(6){left:40%;top:92%;--t:20px;--r:-1.6s;--d:2.4s}
.estrellas img:nth-child(7){right:6%;top:10%;--t:40px;--r:-1s}
.estrellas img:nth-child(8){right:22%;top:5%;--t:24px;--r:-2.2s;--d:2.8s}
.estrellas img:nth-child(9){right:10%;top:34%;--t:30px;--r:-.2s;--d:3.6s}
.estrellas img:nth-child(10){right:4%;top:60%;--t:46px;--r:-1.8s}
.estrellas img:nth-child(11){right:20%;top:84%;--t:28px;--r:-.6s;--d:2.9s}
.estrellas img:nth-child(12){left:55%;top:3%;--t:18px;--r:-2.8s;--d:2.5s}
@keyframes titilar{0%,100%{transform:scale(.7) rotate(0deg);opacity:.55}50%{transform:scale(1.08) rotate(8deg);opacity:1}}
@media (prefers-reduced-motion:reduce){.estrellas img{animation:none}}
@media (min-width:700px){.jugar-chispas{display:none}.estrellas img{width:calc(var(--t,28px) * 1.5)}}
@media (max-width:699px){.estrellas img:nth-child(n+9){display:none}}
/* v0.9.2 · el raspa: toda la tarjeta es para raspar, nada se arrastra, ni zoom ni scroll */
.raspa,.raspa *{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-user-drag:none}
.raspa img{pointer-events:none}
.raspa canvas{cursor:crosshair}
.raspa canvas.raspa-bloqueada{cursor:not-allowed}
.modal-recien .modal-caja{pointer-events:none}

/* v0.9.4 · botones del aviso del premio: uno debajo del otro, el premio primero */
.modal-botones{flex-direction:column-reverse;gap:10px;margin-top:10px}
.modal-botones .jugar-boton.jugar-boton-chico{flex:none;width:100%;min-width:0;min-height:50px;padding:0 16px;gap:8px;font-size:16px}
/* v0.9.4 · logo nuevo (más alto): se mide por alto para no empujar la rueda */
.jugar-logo:not(.jugar-logo-marca){width:auto;height:96px}
.jugar-pantalla .jugar-logo:not(.jugar-logo-marca){width:auto;height:clamp(46px,8dvh,74px);margin:0}
.premio-pantalla .jugar-logo:not(.jugar-logo-marca){height:clamp(50px,9dvh,80px)}
.lado img{width:190px}
.hoja-logo{width:300px}
.tarjeta-entrar img{width:240px;background:none;padding:0}

/* v0.10 · debajo de la plata no se ve nada hasta que llega el premio de verdad */
.raspa-premio{transition:opacity .25s}
.raspa-esperando{opacity:0}
/* v0.10 · teléfono acostado: el juego a la derecha, los textos a la izquierda; el aviso en dos columnas */
@media (orientation:landscape) and (max-height:540px){
  .jugar-pantalla{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);grid-auto-flow:row dense;align-content:center;align-items:center;justify-items:center;column-gap:18px;row-gap:6px;padding:8px 16px;overflow:hidden}
  .jugar-pantalla > *{grid-column:1}
  .jugar-pantalla > .juego{grid-column:2;grid-row:1 / span 7;align-self:center}
  .jugar-pantalla > .modal{grid-column:auto}
  .jugar-pantalla .jugar-logo:not(.jugar-logo-marca){height:clamp(36px,12dvh,58px)}
  .jugar-pantalla .jugar-logo-marca{max-height:56px!important}
  .jugar-pantalla .cinta-titulo{font-size:clamp(20px,4.6dvh + 6px,30px);padding:4px 16px 8px}
  .jugar-pantalla .cinta-lema{font-size:15px}
  .jugar-pantalla .puedes{max-width:100%}
  .jugar-pantalla .puedes-item img{width:34px;height:34px}
  .jugar-pantalla .rueda{width:min(44vw,calc(100dvh - 104px))!important}
  .jugar-pantalla #girar{min-width:0!important;min-height:48px!important;font-size:22px!important;padding:0 34px}
  .jugar-pantalla .juego-raspa .raspa{width:min(46vw,calc((100dvh - 120px) * 1.5))!important}
  .jugar-pantalla .raspa-pista{font-size:14px!important;padding:5px 14px}
  .modal-caja{display:grid;grid-template-columns:1fr 1fr;grid-auto-flow:row dense;column-gap:20px;row-gap:2px;width:min(640px,94vw);align-items:center;justify-items:center;padding:14px 18px}
  .modal-caja > *{grid-column:2}
  .modal-caja > .modal-cinta,.modal-caja > .modal-icono,.modal-caja > .modal-premio,.modal-caja > .modal-desc{grid-column:1}
  .modal-caja .modal-codigo{font-size:40px}
  .modal-qr{width:96px;height:96px}
  .modal-icono{width:84px;height:84px}
  .modal-botones .jugar-boton.jugar-boton-chico{min-height:42px}
}
@media (orientation:landscape) and (max-height:540px){
  .modal-caja > .modal-botones{grid-column:1 / -1;flex-direction:row;margin-top:8px}
  .modal-botones .jugar-boton.jugar-boton-chico{flex:1 1 0;width:auto}
}
@media (orientation:landscape) and (max-height:420px){
  .modal{padding:8px}
  .modal-caja{padding:10px 16px;row-gap:0;max-height:96dvh}
  .modal-qr{width:84px;height:84px}
  .modal-icono{width:70px;height:70px}
  .modal-caja .modal-codigo{font-size:36px}
  .modal-nota{font-size:12px!important;margin:2px 0!important}
}
/* v0.10 · datos de contacto (solo campañas de adultos, después del premio) */
.datos-abrir{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:99px;background:rgba(255,255,255,.14);border:2px solid rgba(255,255,255,.55);color:#fff;font-weight:800;font-size:15px;text-decoration:none;flex-shrink:0}
.datos-abrir svg{width:22px;height:22px}
.datos-abrir-modal{background:#f3edff;border-color:#d9c9ff;color:#4b22c9;margin:4px 0 2px;padding:8px 14px;font-size:14px}
.datos-listo{display:inline-flex;align-items:center;gap:8px;margin:0;padding:8px 16px;border-radius:14px;background:rgba(25,160,90,.92);color:#fff;font-weight:700;font-size:14px;max-width:min(360px,90vw);flex-shrink:0}
.datos-listo svg{width:20px;height:20px;flex:none}
.datos-modal{display:none!important}
.datos-modal:target,.datos-modal.datos-abierto{display:grid!important}
.datos-caja{position:relative;align-items:stretch;text-align:left;gap:8px;width:min(400px,94vw)}
.datos-caja .modal-cinta{align-self:center}
.datos-sub{margin:0;text-align:center;color:#5a5470;font-size:14px}
.datos-campo{display:flex;flex-direction:column;gap:4px;font-weight:700;font-size:14px;color:#2a1d55}
.datos-campo input{font:inherit;font-weight:600;font-size:17px;padding:11px 12px;border:2px solid #cfc6e8;border-radius:12px;color:#1b1340;background:#fff}
.datos-campo input:focus{outline:3px solid #ffd338;border-color:#6d32ff}
.datos-campo input[aria-invalid=true]{border-color:#e51d73}
.datos-permiso{display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.35;color:#3d355c;margin-top:2px}
.datos-permiso input{width:22px;height:22px;flex:none;margin:0;accent-color:#6d32ff}
.datos-err{color:#c0105a!important;font-weight:700;font-size:13px;margin:0}
.datos-cerrar{position:absolute;top:8px;right:12px;font-size:30px;line-height:1;color:#6b6290;text-decoration:none;padding:4px 8px}
.datos-caja .modal-botones{flex-direction:row}
.datos-caja .modal-botones .jugar-boton.jugar-boton-chico{flex:1 1 0;width:auto}
@media (orientation:landscape) and (max-height:540px){
  .modal-caja > .datos-abrir-modal{grid-column:1}
  .datos-caja{display:flex;max-height:94dvh}
}
.premio-pagina .datos-abrir{background:#f3edff;border-color:#d9c9ff;color:#4b22c9;margin-top:6px;padding:9px 16px;font-size:14px}
.premio-pagina .datos-listo{margin-top:6px}
/* v0.10 · reporte: fechas, embudo, contactos */
.r5{grid-template-columns:repeat(5,minmax(0,1fr))}
@media (max-width:1100px){.r5{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.r5{grid-template-columns:repeat(2,minmax(0,1fr))}}
.kpi-resalte{border-color:#6d32ff;box-shadow:0 0 0 2px #e9e0ff inset}
.filtro{display:flex;flex-wrap:wrap;align-items:center;gap:8px;background:#fff;border:1px solid var(--borde);border-radius:14px;padding:10px 12px;margin:4px 0 6px}
.filtro-eti{font-weight:800;font-size:14px}
.filtro-op{padding:7px 14px;border-radius:99px;border:1px solid var(--borde);font-weight:700;font-size:14px;text-decoration:none;color:inherit}
.filtro-si{background:#6938ef;border-color:#6938ef;color:#fff}
.filtro label{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:700}
.filtro input[type=date]{font:inherit;font-size:14px;padding:6px 8px;border:1px solid var(--borde);border-radius:10px}
.filtro-actual{margin-top:0}
.embudo{display:flex;flex-direction:column;gap:10px;max-width:820px}
.embudo-fila{display:grid;grid-template-columns:minmax(120px,210px) minmax(0,1fr) 56px 52px;align-items:center;gap:10px}
.embudo-eti{font-weight:700;font-size:14px}
.embudo-barra{display:block;height:22px;background:#f1edfb;border-radius:8px;overflow:hidden}
.embudo-lleno{display:block;height:100%;width:0;border-radius:8px;background:#b9a6f0}
.embudo-0{background:#6938ef}.embudo-1{background:#8a63f2}.embudo-2{background:#e51d73}.embudo-3{background:#ffb81c}.embudo-4{background:#19a05a}
.embudo-n{text-align:right;font-size:16px}
.embudo-pct{font-size:13px;color:var(--suave);font-weight:700}
.embudo-chico{margin-top:14px}
@media (max-width:640px){.embudo-fila{grid-template-columns:minmax(0,1fr) 48px 44px}.embudo-barra{grid-column:1 / -1;grid-row:2}}
.oculto{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* v0.10 · Encuentra la pareja */
.juego-memoria{flex:1 1 auto;min-height:0;width:100%;display:flex;flex-direction:column;align-items:center;gap:8px}
.mem-barra{display:flex;gap:10px;justify-content:center;flex-shrink:0}
.mem-dato{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:99px;background:linear-gradient(180deg,#ffe56e,#ffc21a);border:3px solid #fff;box-shadow:0 3px 0 #d1890f;color:#3b1380;font-weight:800;font-size:15px}
.mem-dato svg{width:22px;height:22px}
.mem-dato b{font-size:17px;min-width:1ch;text-align:center}
.mem-tablero{flex:1 1 auto;min-height:0;width:min(100%,760px);display:grid;grid-template-columns:repeat(var(--cols,4),var(--carta,70px));grid-auto-rows:calc(var(--carta,70px) * 4 / 3);gap:8px;justify-content:center;align-content:center;touch-action:manipulation;-webkit-user-select:none;user-select:none}
.carta{position:relative;padding:0;border:0;background:none;cursor:pointer;perspective:700px;border-radius:12px;-webkit-tap-highlight-color:transparent}
.carta:focus-visible{outline:4px solid #ffd338;outline-offset:2px}
.carta-giro{position:absolute;inset:0;display:block;transform-style:preserve-3d;transition:transform .42s cubic-bezier(.3,1.4,.5,1)}
.carta-abierta .carta-giro{transform:rotateY(180deg)}
.carta-dorso,.carta-cara{position:absolute;inset:0;display:grid;place-items:center;border-radius:12px;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;box-shadow:0 4px 0 rgba(30,8,80,.45),0 6px 14px rgba(20,0,60,.3)}
.carta-dorso{background:linear-gradient(160deg,var(--marca,#6d32ff),var(--marca2,#3b1380));border:3px solid #fff}
.carta-dorso img{width:100%;height:100%;object-fit:cover}
[data-marca] .carta-dorso img[src^="/subidas/"]{width:72%;height:auto;object-fit:contain}
.carta-cara{background:#fff;border:3px solid #ffd338;transform:rotateY(180deg)}
.carta-cara img{width:84%;height:84%;object-fit:contain}
.carta-par .carta-cara{border-color:#22c55e;box-shadow:0 0 0 3px #22c55e,0 0 18px rgba(34,197,94,.7)}
.carta-par{animation:mem-salto .5s ease}
@keyframes mem-salto{40%{transform:scale(1.08)}}
.mem-bloqueado .carta{opacity:.55;cursor:not-allowed}
.mem-listo .carta-par .carta-cara{animation:mem-brillo 1s ease infinite alternate}
@keyframes mem-brillo{to{box-shadow:0 0 0 3px #ffd338,0 0 26px rgba(255,211,56,.9)}}
@media (prefers-reduced-motion:reduce){.carta-giro{transition:none}.carta-par,.mem-listo .carta-par .carta-cara{animation:none}}
.jugar-pantalla .juego-memoria .jugar-aviso{flex-shrink:0;margin:0;min-height:0}
@media (orientation:landscape) and (max-height:540px){
  .jugar-pantalla > .juego-memoria{height:calc(100dvh - 16px)}
}
@media (max-height:760px){
  .jugar-pantalla:has(.juego-memoria) .puedes{display:none}
}
@media (max-height:700px){
  .jugar-pantalla:has(.juego-memoria) .cinta-lema{display:none}
  .jugar-pantalla:has(.juego-memoria) .cinta-titulo{font-size:clamp(20px,6vw,28px)}
}
.cartas-lista{list-style:none;padding:0;margin:8px 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:12px}
.cartas-lista li{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px;border:1px solid var(--borde);border-radius:14px;background:#fff;text-align:center;font-size:13px;font-weight:700}
.cartas-lista img{width:96px;height:96px;object-fit:contain}
.embudo + .meta{margin-top:14px}
/* v0.11 · jugadas, auditoría, en vivo */
.jugadas .cod{font-family:ui-monospace,Menlo,monospace;font-size:16px;letter-spacing:2px}
.corregir summary{list-style:none;cursor:pointer;display:inline-flex}
.corregir summary::-webkit-details-marker{display:none}
.corregir[open] summary{margin-bottom:8px}
.corregir form{display:flex;flex-direction:column;gap:8px;min-width:240px;padding:10px;border:1px solid var(--borde);border-radius:12px;background:#fff}
.paginas{display:flex;gap:12px;align-items:center;justify-content:center;margin:14px 0}
.filtro select{font:inherit;font-size:14px;padding:6px 8px;border:1px solid var(--borde);border-radius:10px;max-width:220px}
.filtro input[type=text]{font:inherit;font-size:14px;padding:6px 8px;border:1px solid var(--borde);border-radius:10px}
.vivo{display:flex;flex-direction:column;gap:16px}
.vivo:fullscreen{background:#f6f3ff;padding:24px;overflow:auto}
.vivo-cab{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.vivo-cab h1{font-size:clamp(24px,3vw,36px)}
.vivo-estado{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-weight:600}
.vivo-punto{width:12px;height:12px;border-radius:50%;background:#e51d73;box-shadow:0 0 0 0 rgba(229,29,115,.6);animation:vivo-latido 1.6s infinite}
@keyframes vivo-latido{70%{box-shadow:0 0 0 10px rgba(229,29,115,0)}100%{box-shadow:0 0 0 0 rgba(229,29,115,0)}}
.vivo-cifras{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.vivo-cifra{background:#fff;border:1px solid var(--borde);border-radius:18px;padding:16px 18px;display:flex;flex-direction:column;gap:4px}
.vivo-cifra b{font-size:clamp(34px,4.5vw,60px);line-height:1;font-weight:800;color:#1b1340}
.vivo-cifra span{font-weight:700;color:var(--suave)}
.vivo-c1{background:#6938ef;border-color:#6938ef}.vivo-c1 b,.vivo-c1 span{color:#fff}
.vivo-c2{background:#fff3c2;border-color:#ffd338}
.vivo-c3{background:#e5f7ec;border-color:#9bdbb4}
.vivo-c4{background:#ffe6f0;border-color:#f6a8c8}
.vivo-cambio{animation:vivo-sube .9s ease}
@keyframes vivo-sube{30%{color:#e51d73;transform:scale(1.08)}}
.vivo-dos{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:16px}
@media (max-width:900px){.vivo-dos{grid-template-columns:1fr}}
.vivo-col{display:flex;flex-direction:column;gap:16px}
.vivo-premios{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.vivo-premio{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--borde);border-radius:14px;background:#fff;position:relative}
.vivo-premio img{width:56px;height:auto;flex:none}
.vp-txt{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.vp-txt > b{font-size:17px}
.vp-quedan{font-weight:800;color:#4b22c9}
.vp-marca{display:none;padding:4px 10px;border-radius:99px;font-weight:800;font-size:12px;letter-spacing:.5px;text-transform:uppercase}
.vp-agotado .vp-m-agotado{display:inline-block;background:#ffe6f0;color:#c0105a}
.vp-apagado .vp-m-apagado{display:inline-block;background:#eceaf2;color:#5a5470}
.vp-apagado img,.vp-agotado img{filter:grayscale(1);opacity:.6}
.vp-agotado .vp-quedan{color:#c0105a}
.vivo-barras{display:grid;grid-template-columns:repeat(24,1fr);gap:3px;align-items:end;height:150px;padding-bottom:18px}
.vb{position:relative;height:100%;display:flex;align-items:flex-end}
.vb i{display:block;width:100%;height:0;background:#8a63f2;border-radius:4px 4px 0 0;transition:height .6s ease}
.vb small{position:absolute;bottom:-18px;left:50%;transform:translateX(-50%);font-size:11px;color:var(--suave)}
.vivo-ultimas{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.vivo-ultimas li{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap;padding:6px 0;border-bottom:1px solid #f0edf7}
.vivo-ultimas b{font-family:ui-monospace,Menlo,monospace}
.vivo-pie{text-align:center}
@media (prefers-reduced-motion:reduce){.vivo-punto,.vivo-cambio{animation:none}.vb i{transition:none}}
/* v0.11.1 · inicio de Supraide, atajos, versión */
.atajos{display:inline-flex;flex-wrap:wrap;gap:6px}
.atajo{display:inline-block;padding:5px 11px;border-radius:99px;border:1px solid var(--borde);font-weight:700;font-size:13px;text-decoration:none;color:#3b2a8a;background:#fff;white-space:nowrap}
.atajo:hover{border-color:#6938ef;background:#f3edff}
.atajo-vivo{background:#e51d73;border-color:#e51d73;color:#fff}
.atajo-vivo:hover{background:#c8105f;border-color:#c8105f}
.movs{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-direction:column;gap:6px}
.movs li{padding:6px 0;border-bottom:1px solid #f0edf7;font-size:14px}
.lado .version{opacity:.7;font-size:12px}
.r3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){.r3{grid-template-columns:1fr}}
.demo-tarjeta h2{margin-top:0}
.demo-enlace code{font-size:13px;background:#f3edff;padding:4px 8px;border-radius:8px;word-break:break-all}
/* v0.12 · trivia en el panel */
.preg-lista{margin:8px 0;padding-left:22px;display:flex;flex-direction:column;gap:12px}
.preg-lista > li{padding:10px 12px;border:1px solid var(--borde);border-radius:14px;background:#fff}
.preg-apagada{opacity:.6}
.preg-ops{list-style:none;padding:0;margin:6px 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:6px}
.preg-ops li{padding:6px 10px;border-radius:10px;background:#f6f3ff;font-size:14px}
.preg-ops li span{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#fff;font-weight:800;font-size:12px;margin-right:4px}
.preg-ops .preg-ok{background:#e5f7ec;font-weight:700}
.preg-op-fila{display:flex;gap:8px;align-items:center}
.preg-op-fila input[type=radio]{width:22px;height:22px;flex:none;accent-color:#19a05a}
.preg-op-fila input[type=text]{flex:1}
/* v0.12 · Trivia express en el teléfono */
.juego-trivia{flex:1 1 auto;min-height:0;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}
.tri{width:min(100%,600px);display:flex;flex-direction:column;align-items:stretch;gap:10px;min-height:0}
.tri-inicio[hidden]{display:none}
.tri-inicio{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;background:rgba(255,255,255,.12);border:2px solid rgba(255,255,255,.4);border-radius:24px;padding:18px 16px}
.tri-cuenta{margin:0;color:#fff;font-size:20px;font-weight:700}
.tri-cuenta b{font-size:30px;color:#ffd338}
.tri-sub{margin:0;color:#f1eaff;font-weight:600;font-size:15px}
.tri-juego{display:flex;flex-direction:column;gap:10px;min-height:0}
.tri-juego[hidden]{display:none}
.tri-barra{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.tri-reloj{height:12px;border-radius:99px;background:rgba(255,255,255,.25);overflow:hidden;border:2px solid rgba(255,255,255,.6)}
.tri-reloj i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#ffd338,#ffb81c);transform-origin:left center;transform:scaleX(1)}
.tri-reloj i.tri-apura{background:linear-gradient(90deg,#ff5fa2,#e51d73)}
.tri-pregunta{margin:0;background:#fff;color:#2a0f6b;border-radius:20px;padding:16px 18px;font-weight:800;font-size:clamp(19px,2.6dvh + 6px,28px);line-height:1.25;text-align:center;box-shadow:0 5px 0 rgba(30,8,80,.35);min-height:3.2em;display:grid;place-items:center}
.tri-ops{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.tri-ops-2,.tri-ops-3{grid-template-columns:1fr}
@media (max-width:380px) and (min-height:760px){.tri-ops{grid-template-columns:1fr}}
.tri-op{display:flex;align-items:center;gap:10px;min-height:clamp(56px,8.5dvh,84px);padding:10px 14px;border:3px solid #fff;border-radius:18px;font:inherit;font-weight:800;font-size:clamp(16px,1.6dvh + 8px,22px);color:#fff;text-align:left;cursor:pointer;box-shadow:0 5px 0 rgba(30,8,80,.4);transition:transform .15s,opacity .25s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.tri-op:active{transform:translateY(3px);box-shadow:0 2px 0 rgba(30,8,80,.4)}
.tri-op:focus-visible{outline:4px solid #ffd338;outline-offset:2px}
.tri-forma{display:grid;place-items:center;width:34px;height:34px;flex:none;border-radius:50%;background:rgba(255,255,255,.25);font-size:18px}
.tri-txt{flex:1;line-height:1.2}
.tri-op-0{background:#6d32ff}.tri-op-1{background:#e51d73}.tri-op-2{background:#ffb81c;color:#2a0f6b}.tri-op-3{background:#12a5a0}
.tri-op-2 .tri-forma{background:rgba(255,255,255,.45)}
.tri-correcta{box-shadow:0 0 0 4px #22c55e,0 0 22px rgba(34,197,94,.8);transform:scale(1.03)}
.tri-correcta .tri-txt::after{content:" ✓"}
.tri-mal{animation:tri-no .4s ease;opacity:.85}
.tri-mal .tri-txt::after{content:" ✗"}
.tri-apagada{opacity:.35}
.tri-op:disabled{cursor:default}
@keyframes tri-no{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.tri-dice{margin:0;min-height:1.5em;text-align:center;font-weight:800;font-size:18px;color:#fff}
.tri-dice-bien{color:#c8ffd9}
.tri-dice-mal{color:#ffd1e4}
@media (prefers-reduced-motion:reduce){.tri-mal{animation:none}.tri-op{transition:none}}
@media (max-height:700px){
  .jugar-pantalla:has(.juego-trivia) .puedes{display:none}
  .jugar-pantalla:has(.tri-juego:not([hidden])) .cinta-lema{display:none}
  .jugar-pantalla:has(.tri-juego:not([hidden])) .cinta-titulo{font-size:clamp(18px,5.5vw,26px)}
  .tri-pregunta{padding:10px 14px;min-height:0}
  .tri-op{min-height:52px;padding:8px 10px;gap:8px}
  .tri-forma{width:28px;height:28px;font-size:15px}
}
@media (orientation:landscape) and (max-height:540px){
  .jugar-pantalla > .juego-trivia{height:calc(100dvh - 16px)}
  .tri-pregunta{padding:10px 14px;min-height:0}
  .tri-op{min-height:46px;padding:6px 12px}
}

.jugar .tri-pregunta{color:#2a0f6b;opacity:1}
.jugar .tri-cuenta,.jugar .tri-sub,.jugar .tri-dice{opacity:1}
.jugar .tri-cuenta{color:#fff}.jugar .tri-sub{color:#f1eaff}
.jugar .tri-dice{color:#fff}.jugar .tri-dice-bien{color:#c8ffd9}.jugar .tri-dice-mal{color:#ffd1e4}
.jugar .tri-pregunta,.jugar .tri-dice,.jugar .tri-cuenta,.jugar .tri-sub{max-width:none}
.embudo-fila-larga{grid-template-columns:minmax(160px,340px) minmax(0,1fr) 56px 70px}.embudo-fila-larga .embudo-eti{font-weight:700;font-size:14px;line-height:1.3}
/* v0.12.1 · el arte de la trivia */
.jugar:has(.juego-trivia){background:#2a0d7a url(/assets/juego/fondo-trivia-v.webp) center bottom/cover no-repeat}
@media (orientation:landscape){.jugar:has(.juego-trivia){background-image:url(/assets/juego/fondo-trivia-h.webp)}}
.jugar:has(.juego-trivia) .jugar-rayos{opacity:.35}
.tri-portada{width:min(78%,330px);height:auto;margin:-6px auto -4px;filter:drop-shadow(0 8px 18px rgba(20,0,60,.45))}
@media (max-height:700px){.tri-portada{width:min(56%,200px)}}
@media (orientation:landscape) and (max-height:540px){.tri-portada{width:150px}}
.tri-reloj-fila{display:flex;align-items:center;gap:8px}
.tri-reloj-fila[hidden]{display:none}
.tri-reloj-fila img{width:34px;height:auto;flex:none;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}
.tri-reloj-fila .tri-reloj{flex:1}
.tri-forma img{width:70%;height:auto;display:block}
.tri-zona{position:relative}
.tri-ops[hidden]{display:none}
.tri-sello{position:absolute;left:50%;top:50%;width:clamp(96px,22vmin,150px);height:auto;transform:translate(-50%,-50%) scale(.3);opacity:0;pointer-events:none;filter:drop-shadow(0 8px 20px rgba(0,0,0,.4));z-index:2}
.tri-sello[hidden]{display:none}
.tri-sello-sale{animation:tri-sello 1.3s cubic-bezier(.2,1.5,.4,1) forwards}
@keyframes tri-sello{0%{opacity:0;transform:translate(-50%,-50%) scale(.3)}25%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}40%{transform:translate(-50%,-50%) scale(1)}80%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) scale(.95)}}
.tri-final{width:min(80%,320px);height:auto;margin:0 auto;filter:drop-shadow(0 10px 22px rgba(20,0,60,.45));animation:tri-sello-entra .7s cubic-bezier(.2,1.5,.4,1)}
.tri-final[hidden]{display:none}
@keyframes tri-sello-entra{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}
@media (max-height:700px){.tri-final{width:min(60%,220px)}}
@media (prefers-reduced-motion:reduce){.tri-sello-sale{animation:none;opacity:1;transform:translate(-50%,-50%)}.tri-final{animation:none}}
/* v0.13 · las temporadas (el arte llega en assets/temas/{tema}/; mientras, un dibujo en CSS) */
.jugar.tema-navidad{background:radial-gradient(900px 600px at 50% 18%,#e3324a,transparent 62%),linear-gradient(170deg,#b3122c,#5a0618 70%,#2c0310)}
.jugar.tema-clases{background:radial-gradient(900px 600px at 50% 18%,#4fa3ff,transparent 62%),linear-gradient(170deg,#2a6fe0,#173f9e 70%,#0d2766)}
.jugar.tema-verano{background:radial-gradient(700px 500px at 50% 12%,#ffe27a,transparent 55%),linear-gradient(175deg,#22b8e8 0%,#1e8fd6 45%,#ff9f43 100%)}
.jugar.tema-navidad,.jugar.tema-clases,.jugar.tema-verano{background-size:cover;background-position:center}
.jugar[data-fondo-v]{background-image:var(--tema-fondo-v);background-size:cover;background-position:center bottom}
@media (orientation:landscape){.jugar[data-fondo-h]{background-image:var(--tema-fondo-h)}}
.jugar.tema-navidad .jugar-rayos,.jugar.tema-clases .jugar-rayos,.jugar.tema-verano .jugar-rayos{opacity:.28}
.jugar[data-fondo-v] .jugar-rayos{display:none}
.tema-adorno{position:fixed;left:0;right:0;top:0;height:clamp(44px,9vmin,90px);z-index:0;pointer-events:none}
.tema-adorno img{width:100%;height:100%;object-fit:cover;object-position:center top}
.tema-adorno-navidad:empty{background:radial-gradient(circle at 50% 70%,#ffd338 0 5px,transparent 6px) 0 0/48px 100% repeat-x,radial-gradient(circle at 50% 70%,#22c55e 0 5px,transparent 6px) 24px 0/48px 100% repeat-x,linear-gradient(#1f7a3a,#1f7a3a) 0 38%/100% 6px no-repeat}
.tema-adorno-clases:empty{background:repeating-linear-gradient(90deg,#ffd338 0 40px,#ff5f6d 40px 80px,#22c55e 80px 120px,#4fa3ff 120px 160px) 0 0/100% 10px no-repeat}
.tema-adorno-verano:empty{background:linear-gradient(135deg,transparent 50%,#ff5f6d 50%) 0 0/36px 26px repeat-x,linear-gradient(225deg,transparent 50%,#ffd338 50%) 18px 0/36px 26px repeat-x}
.tema-nieve{position:fixed;inset:-100px 0 0;z-index:0;pointer-events:none;background:radial-gradient(circle,rgba(255,255,255,.95) 0 2px,transparent 3px) 0 0/90px 90px,radial-gradient(circle,rgba(255,255,255,.7) 0 1.5px,transparent 2.5px) 40px 30px/120px 120px;animation:tema-nieve 14s linear infinite}
.tema-nieve-2{background:radial-gradient(circle,rgba(255,255,255,.85) 0 3px,transparent 4px) 20px 10px/160px 160px;animation-duration:22s;opacity:.8}
@keyframes tema-nieve{from{transform:translateY(0)}to{transform:translateY(90px)}}
@media (prefers-reduced-motion:reduce){.tema-nieve{animation:none}}
.jugar-logo-tema{width:auto;height:clamp(54px,9dvh,92px);filter:drop-shadow(0 0 3px #fff) drop-shadow(0 0 8px rgba(255,255,255,.85))}
/* v0.13 · La canasta */
.juego-canasta{flex:1 1 auto;min-height:0;width:100%;display:flex;flex-direction:column;align-items:center}
.can{width:min(100%,560px);flex:1 1 auto;min-height:0;display:flex;flex-direction:column;gap:8px}
.can-campo{position:relative;flex:1 1 auto;min-height:240px;border-radius:22px;background:rgba(255,255,255,.1);border:2px solid rgba(255,255,255,.35);overflow:hidden;touch-action:none;-webkit-user-select:none;user-select:none}
.can-campo canvas{position:absolute;inset:0;display:block;touch-action:none;cursor:grab}
.can-inicio{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:16px;text-align:center;background:rgba(30,8,80,.45);backdrop-filter:blur(2px)}
.can-inicio[hidden]{display:none}
.jugar .can-titulo{margin:0;color:#fff;font-weight:800;font-size:clamp(19px,2.4dvh + 8px,26px);max-width:none;line-height:1.25}
.jugar .can-sub{margin:0;color:#f1eaff;font-weight:600;font-size:15px;max-width:none}
.jugar-pantalla:has(.juego-canasta) .puedes{display:none}
@media (max-height:700px){.jugar-pantalla:has(.juego-canasta) .cinta-lema{display:none}}
@media (orientation:landscape) and (max-height:540px){.jugar-pantalla > .juego-canasta{height:calc(100dvh - 16px)}}

/* v0.13.2 · en las demos: ver cualquier temporada */
.demo-temas{position:fixed;top:10px;right:10px;z-index:30;display:flex;flex-direction:column;gap:7px}
.demo-temas a{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.92);box-shadow:0 3px 10px rgba(20,0,60,.35);border:3px solid transparent;transition:transform .15s}
.demo-temas a:hover{transform:scale(1.08)}
.demo-temas a.activo{border-color:#ffc21a;box-shadow:0 0 0 3px rgba(255,194,26,.45),0 3px 10px rgba(20,0,60,.35)}
.demo-temas img{width:28px;height:28px;object-fit:contain}
@media (max-width:420px){.demo-temas{top:6px;right:6px;gap:5px}.demo-temas a{width:34px;height:34px}.demo-temas img{width:24px;height:24px}}

/* v0.14 · Encuentra el producto */
.bus-campo{cursor:pointer}
.bus-campo canvas{cursor:pointer}
.jugar .bus-busca{gap:6px}
.bus-busca img{width:30px;height:30px;object-fit:contain;filter:drop-shadow(0 2px 2px rgba(0,0,0,.25))}
.bus-portada{width:min(62%,260px);height:auto;max-height:22dvh;object-fit:contain;filter:drop-shadow(0 6px 10px rgba(20,0,60,.35))}
.bus-objetivo{width:min(26vw,96px);height:auto;aspect-ratio:1;object-fit:contain;padding:8px;border-radius:22px;background:rgba(255,255,255,.92);box-shadow:0 0 0 4px #ffc21a,0 8px 18px rgba(20,0,60,.4)}
.bus-temblor{animation:bus-temblor .35s ease-in-out}
@keyframes bus-temblor{20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(3px)}}
@media (max-height:700px){.bus-portada{max-height:14dvh}.bus-objetivo{width:72px}}
@media (prefers-reduced-motion:reduce){.bus-temblor{animation:none}}
.juego-busca{flex:1 1 auto;min-height:0;width:100%;display:flex;flex-direction:column;align-items:center}
.jugar-pantalla:has(.juego-busca) .puedes{display:none}
@media (max-height:700px){.jugar-pantalla:has(.juego-busca) .cinta-lema{display:none}}
@media (orientation:landscape) and (max-height:540px){.jugar-pantalla > .juego-busca{height:calc(100dvh - 16px)}}
.bus .can-inicio{gap:8px}
.bus .tri-barra{flex-wrap:nowrap}
@media (max-height:700px),(max-width:380px){
  .bus .tri-barra .mem-dato{padding:4px 10px;font-size:14px;gap:4px}
  .bus-busca img{width:24px;height:24px}
  .bus-portada{display:none}
  .bus .can-titulo{font-size:19px}
  .bus-objetivo{width:64px;padding:6px;border-radius:16px}
}
#bus-empezar[hidden],#can-empezar[hidden]{display:none}

/* v0.14 · Rompecabezas */
.juego-rompe{flex:1 1 auto;min-height:0;width:100%;display:flex;flex-direction:column;align-items:center}
.jugar-pantalla:has(.juego-rompe) .puedes{display:none}
@media (max-height:700px){.jugar-pantalla:has(.juego-rompe) .cinta-lema{display:none}}
@media (orientation:landscape) and (max-height:540px){.jugar-pantalla > .juego-rompe{height:calc(100dvh - 16px)}}
.rom-campo{display:grid;place-items:center;background:rgba(255,255,255,.06)}
.rom-tablero{position:relative;width:300px;height:300px}
.rom-tablero canvas{position:absolute;inset:8.4%;width:83.2%;height:83.2%;display:block;touch-action:none;cursor:pointer;border-radius:4px;background:rgba(20,0,60,.35)}
.rom-marco{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.rom-mano{position:absolute;width:22%;height:auto;pointer-events:none;z-index:3;filter:drop-shadow(0 4px 6px rgba(0,0,0,.35));animation:rom-mano 1s ease-in-out infinite}
.rom-mano[hidden]{display:none}
@keyframes rom-mano{50%{transform:translate(-6%,-10%) scale(.92)}}
.jugar .rom-aviso{position:absolute;left:50%;top:10px;transform:translateX(-50%);margin:0;padding:6px 16px;border-radius:999px;background:#ffc21a;color:#3b1380;font-weight:800;font-size:18px;box-shadow:0 4px 0 #d1890f;z-index:4;max-width:none;white-space:nowrap}
.rom-aviso[hidden]{display:none}
.rom .can-inicio{gap:8px}
#rom-empezar[hidden]{display:none}
@media (max-height:700px),(max-width:380px){.rom .tri-barra .mem-dato{padding:4px 10px;font-size:14px}.rom .bus-portada{display:none}.rom .can-titulo{font-size:19px}}
@media (prefers-reduced-motion:reduce){.rom-mano{animation:none}}