:root{--crema:#fdf6ec;--crema2:#f2e6d4;--tinta:#3a2f2a;--rosa:#f06292;--rosa-osc:#c2185b;--oro:#f7c948;--verde:#7ed957;--noche:#16162a;--noche2:#242440;--borde:#2b2b45}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html,body{height:100%;overscroll-behavior:none}body{background:#0d0d18;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,sans-serif;color:var(--tinta);display:flex;justify-content:center;align-items:stretch;user-select:none;-webkit-user-select:none;touch-action:manipulation}#root{width:100%;height:100%}#app{position:relative;width:100%;margin:0 auto;height:100dvh;max-height:100dvh;display:flex;flex-direction:column;background:var(--noche);overflow:hidden}@supports not (height:100dvh){#app{height:100vh}}@media(min-width:560px){#app{max-width:520px}}#hud{display:flex;align-items:center;gap:10px;padding:calc(env(safe-area-inset-top) + 8px) 12px 8px;background:linear-gradient(180deg,var(--noche2),var(--noche));border-bottom:2px solid #000;color:#fff;font-size:12px;flex:none}.hudBloque{display:flex;flex-direction:column;gap:3px;min-width:0}.hudFila{display:flex;align-items:center;gap:6px;white-space:nowrap}.insignia{background:var(--rosa);color:#fff;font-weight:800;padding:2px 8px;border-radius:999px;font-size:11px;box-shadow:0 2px 0 var(--rosa-osc)}.barra{height:7px;border-radius:99px;background:#0c0c16;overflow:hidden;box-shadow:inset 0 1px 2px #0009}.barra>div{height:100%;border-radius:99px;transition:width .35s ease}#hudXP{background:linear-gradient(90deg,#63d0ff,#3aa0e8)}#hudDiaBarra{background:linear-gradient(90deg,#ffd76e,var(--oro))}.hudChip{display:flex;align-items:center;gap:4px;font-weight:700;font-size:12px}.hudMini{font-size:10px;opacity:.65;letter-spacing:.4px}#btnMenu{margin-left:auto;flex:none;background:var(--noche2);color:#fff;border:2px solid #000;border-radius:10px;padding:7px 11px;font-size:16px;line-height:1;box-shadow:0 2px #000}#btnMenu:active{transform:translateY(2px);box-shadow:none}#escena{position:relative;flex:1 1 auto;min-height:0;overflow:hidden;background:#1b1b2a}#lienzo{display:block;image-rendering:pixelated;image-rendering:crisp-edges}#efectos{position:absolute;inset:0;pointer-events:none;overflow:hidden}.flotante{position:absolute;left:50%;top:46%;transform:translate(-50%);color:#fff;font-weight:900;font-size:19px;text-shadow:0 2px 0 #000,0 0 12px rgba(255,215,110,.8);animation:subir 1.4s ease-out forwards;white-space:nowrap}@keyframes subir{0%{opacity:0;transform:translate(-50%,10px) scale(.8)}20%{opacity:1;transform:translate(-50%,-6px) scale(1.1)}to{opacity:0;transform:translate(-50%,-60px) scale(1)}}#flash{position:absolute;inset:0;pointer-events:none;background:#fff;opacity:0}#flash.activo{animation:destello .5s ease-out}@keyframes destello{0%{opacity:.85}to{opacity:0}}.banner{position:absolute;top:10px;right:10px;max-width:72%;background:var(--noche2);color:#fff;font-weight:800;font-size:12.5px;border:2px solid #000;border-radius:11px;padding:9px 13px;box-shadow:0 3px #000;animation:bannerVaVen 4s ease-in-out forwards}@keyframes bannerVaVen{0%{opacity:0;transform:translate(14px,-8px)}8%{opacity:1;transform:translate(0)}88%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(14px,-8px)}}#dialogo{position:absolute;left:8px;right:8px;bottom:8px;background:var(--crema);border:3px solid #1d1d2e;border-radius:14px;box-shadow:0 0 0 3px var(--crema2) inset,0 8px 20px #00000073;padding:14px 16px 16px;transform:translateY(130%);opacity:0;transition:transform .22s cubic-bezier(.2,.9,.3,1.2),opacity .18s;z-index:6}#dialogo.visible{transform:translateY(0);opacity:1}#dialogo.carta{background:#fff3f7;box-shadow:0 0 0 3px #ffd8e6 inset,0 8px 20px #00000073}#dialogo.fanfarria{background:#fffaf0;box-shadow:0 0 0 3px #ffe6a8 inset,0 0 26px #f7c94880}#dlgTexto{font-size:15.5px;line-height:1.5;white-space:pre-wrap;font-weight:600;min-height:2.9em}#dlgPremio{margin-top:8px;display:none;font-weight:900;color:var(--rosa-osc);font-size:14px;letter-spacing:.3px}#dlgFlecha{position:absolute;right:14px;bottom:9px;width:0;height:0;opacity:0;border-left:7px solid transparent;border-right:7px solid transparent;border-top:9px solid var(--rosa)}#dlgFlecha.visible{opacity:1;animation:latir .7s infinite}@keyframes latir{0%,to{transform:translateY(0)}50%{transform:translateY(4px)}}#dlgOpciones{display:none;gap:8px;margin-top:12px;flex-direction:column}#dlgOpciones.visible{display:flex}.opcion{position:relative;font:inherit;font-weight:800;font-size:15px;background:#fff;border:3px solid #1d1d2e;border-radius:11px;padding:11px 14px 11px 40px;text-align:left;color:var(--tinta);box-shadow:0 3px #1d1d2e;transition:background .12s,transform .08s}.opcion:active{transform:translateY(3px);box-shadow:none}.opcion .numOp{position:absolute;left:11px;top:50%;transform:translateY(-50%);width:20px;height:20px;border-radius:6px;background:var(--crema2);color:#9a8b7e;font-size:11px;font-weight:900;display:flex;align-items:center;justify-content:center}.opcion.sel{background:#ffe9f1;border-color:var(--rosa-osc)}.opcion.sel .numOp{background:var(--rosa);color:#fff}@media(hover:none){.opcion{padding-left:14px}.opcion .numOp{display:none}.opcion.sel{background:#fff;border-color:#1d1d2e}}#controles{flex:none;display:flex;align-items:center;justify-content:space-between;padding:10px 18px calc(env(safe-area-inset-bottom) + 12px);background:linear-gradient(180deg,var(--noche),#101020);border-top:2px solid #000}#dpad{display:grid;grid-template-columns:repeat(3,46px);grid-template-rows:repeat(3,46px);gap:3px}.dbtn{background:linear-gradient(180deg,#3b3b5c,#2a2a44);border:2px solid #000;color:#cfd3e6;display:flex;align-items:center;justify-content:center;font-size:17px;border-radius:8px;box-shadow:0 3px #000}.dbtn.presionado{background:var(--rosa);color:#fff;transform:translateY(3px);box-shadow:none}#darriba{grid-area:1/2}#dizq{grid-area:2/1}#dder{grid-area:2/3}#dabajo{grid-area:3/2}#dcentro{grid-area:2/2;background:#22223a;border:2px solid #000;border-radius:8px}#botones{display:flex;align-items:center;gap:14px}.bbtn{width:62px;height:62px;border-radius:50%;border:3px solid #000;font-weight:900;font-size:20px;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 4px #000}#botA{background:linear-gradient(180deg,#ff7fa8,#e0416f)}#botB{background:linear-gradient(180deg,#7f9cff,#4159c9);width:52px;height:52px;font-size:17px}.bbtn:active,.bbtn.presionado{transform:translateY(4px);box-shadow:none;filter:brightness(1.15)}.bbtn .tecla{display:none}#ayudaTeclas{display:none;flex-wrap:wrap;justify-content:center;gap:6px 16px;padding:9px 14px calc(env(safe-area-inset-bottom) + 9px);background:#0c0c16;border-top:1px solid #23233a;color:#8b90ad;font-size:11.5px;letter-spacing:.2px}#ayudaTeclas b{color:#e8eaf6;background:#22223a;border:1px solid #34345a;border-bottom-width:2px;border-radius:5px;padding:1px 6px;margin:0 1px;font-size:11px}@media(hover:hover)and (pointer:fine){#ayudaTeclas{display:flex}.bbtn{position:relative}.bbtn .tecla{display:block;position:absolute;bottom:-7px;font-style:normal;font-size:9.5px;font-weight:800;letter-spacing:.5px;background:#0c0c16;color:#aab0cc;border:1px solid #34345a;border-radius:4px;padding:0 5px}}#titulo{position:absolute;inset:0;z-index:20;background:linear-gradient(160deg,#2b1b3d,#16162a 55%,#0f2233);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#fff;text-align:center;padding:24px;transition:opacity .45s}#titulo.oculto{opacity:0;pointer-events:none}#tituloChico{font-size:13px;letter-spacing:5px;text-transform:uppercase;opacity:.75}#tituloGrande{font-size:38px;font-weight:900;line-height:1.05;background:linear-gradient(180deg,#fff,#ffd0e0);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 4px 0 rgba(0,0,0,.35)}#tituloNombre{font-size:17px;font-weight:800;color:var(--oro)}#tituloPie{font-size:12px;opacity:.7;margin-top:2px}#tituloTocar{margin-top:18px;background:var(--rosa);color:#fff;font-weight:900;border:3px solid #000;border-radius:14px;padding:14px 28px;font-size:17px;box-shadow:0 4px #000;animation:respirar 1.8s infinite}@keyframes respirar{0%,to{transform:scale(1)}50%{transform:scale(1.04)}}#corazones{position:absolute;inset:0;overflow:hidden;pointer-events:none;opacity:.5}#corazones i{position:absolute;font-style:normal;font-size:18px;animation:flotar linear infinite}@keyframes flotar{0%{transform:translateY(110%) rotate(0)}to{transform:translateY(-120%) rotate(360deg)}}#cargando{position:absolute;inset:0;z-index:30;background:#0d0d18;color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;letter-spacing:2px}#menu{position:absolute;inset:0;z-index:25;background:#0a0a148c;display:flex;flex-direction:column;justify-content:flex-end;opacity:0;pointer-events:none;transition:opacity .2s}#menu.visible{opacity:1;pointer-events:auto}#menuCaja{background:var(--crema);border-top:4px solid #1d1d2e;border-radius:20px 20px 0 0;max-height:88%;display:flex;flex-direction:column;transform:translateY(100%);transition:transform .25s cubic-bezier(.2,.9,.3,1.05)}#menu.visible #menuCaja{transform:translateY(0)}#menuBarra{display:flex;align-items:center;gap:6px;padding:10px 10px 0;border-bottom:2px solid var(--crema2)}.tab{flex:1;font:inherit;font-weight:800;font-size:11.5px;background:none;border:none;color:#9a8b7e;padding:10px 2px;border-radius:10px 10px 0 0;white-space:nowrap}.tab.activa{background:var(--crema2);color:var(--rosa-osc)}#btnCerrarMenu{flex:none;background:none;border:none;font-size:20px;color:#9a8b7e;padding:6px 8px}#menuCuerpo{padding:14px;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-bottom:calc(env(safe-area-inset-bottom) + 18px)}.panel{background:#fff;border:2px solid var(--crema2);border-radius:14px;padding:13px;margin-bottom:12px}.panel.centro{text-align:center}.panelTitulo{font-weight:900;font-size:15px;margin-bottom:7px;color:var(--rosa-osc)}.sub{font-size:12.5px;color:#7c6f66;line-height:1.5;margin-top:4px}.barraGrande{height:12px;background:var(--crema2);border-radius:99px;overflow:hidden}.barraGrande>div{height:100%;background:linear-gradient(90deg,#ffd76e,var(--oro));transition:width .4s}.lista{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.item{display:flex;align-items:center;gap:11px;background:#fff;border:2px solid var(--crema2);border-radius:13px;padding:11px 12px}.item.ok{background:#f2fbf0;border-color:#cfe9c6}.item.caro{opacity:.55}.item .ico{font-size:22px;width:28px;text-align:center;flex:none}.item .txt{flex:1;min-width:0;font-size:14px}.item .txt b{display:block;font-weight:800}.item .txt small{display:block;font-size:11.5px;color:#8a7d73;margin-top:2px;line-height:1.35}.item .der{font-weight:900;color:var(--rosa-osc);font-size:13px;flex:none}.item.ok .der{color:#4a9a3a}.pips{display:flex;gap:4px;margin-top:5px}.pips i{width:11px;height:11px;border-radius:50%;background:var(--crema2);border:1.5px solid #ddd0be}.pips i.on{background:var(--verde);border-color:#5db347}.btnCanje{font:inherit;font-weight:900;font-size:12.5px;flex:none;background:var(--oro);border:2px solid #1d1d2e;border-radius:10px;padding:9px 11px;box-shadow:0 3px #1d1d2e;color:#3a2f2a}.btnCanje:disabled{background:#e6e0d6;box-shadow:0 3px #c9c1b4;color:#a99f93}.btnCanje:active:not(:disabled){transform:translateY(3px);box-shadow:none}.hist{display:flex;flex-direction:column;gap:5px;margin-top:6px}.histDia{display:flex;justify-content:space-between;font-size:12.5px;padding:7px 9px;background:var(--crema);border-radius:9px;font-weight:600}.fila{display:flex;justify-content:space-between;align-items:center;font-weight:700;font-size:14px;padding:6px 0}.inp{width:100%;font:inherit;font-size:14px;padding:10px 12px;margin-top:10px;border:2px solid var(--crema2);border-radius:10px;background:var(--crema)}.btnPrim{width:100%;font:inherit;font-weight:900;margin-top:9px;background:var(--rosa);color:#fff;border:2px solid #1d1d2e;border-radius:11px;padding:11px;box-shadow:0 3px #1d1d2e}.btnPeligro{width:100%;font:inherit;font-weight:800;margin-top:10px;background:#fff;color:#c23b3b;border:2px solid #e8b4b4;border-radius:11px;padding:11px}.btnPrim:disabled{opacity:.5;box-shadow:0 3px #6b6b7a}.aviso{font-size:12.5px;line-height:1.5;margin-top:8px;padding:9px 11px;color:#8a2f2f;background:#fff2f2;border:2px solid #e8b4b4;border-radius:10px}.codigoPartida{font-size:15px;font-weight:900;letter-spacing:.5px;word-break:break-all;margin:8px 0;padding:10px;text-align:center;color:var(--rosa-osc);background:var(--crema);border:2px dashed var(--crema2);border-radius:10px}.heroNum{font-size:52px;font-weight:900;line-height:1;color:var(--rosa-osc);display:flex;align-items:center;justify-content:center;gap:6px}.heroNum small{font-size:26px}.heroTxt{font-weight:800;font-size:14px;color:#7c6f66;margin-top:2px}.tira{display:flex;align-items:flex-end;gap:2px;height:96px;margin-top:10px;padding:0 2px;border-bottom:2px solid var(--crema2)}.colDia{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:stretch;gap:2px;min-width:0}.colDia .valDia{font-size:9.5px;font-weight:900;color:#8a7d73;text-align:center;height:12px;line-height:12px}.barDia{border-radius:4px 4px 0 0;min-height:4px;transition:height .4s ease}.colDia.hoy .barDia{box-shadow:0 0 0 2px var(--rosa-osc)}.colDia.hoy .valDia{color:var(--rosa-osc)}.tiraPie{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:10.5px;color:#9a8b7e;margin-top:6px}.escala{display:flex;align-items:center;gap:3px}.escala i{width:11px;height:11px;border-radius:3px;display:inline-block}.cuadricula{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}.celda{background:var(--crema);border-radius:11px;padding:10px 6px;text-align:center}.celda b{display:block;font-size:17px;font-weight:900;color:var(--rosa-osc)}.celda span{display:block;font-size:10.5px;color:#8a7d73;margin-top:3px;line-height:1.25}.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.chipAnimo{background:var(--crema);border-radius:99px;padding:6px 11px;font-size:12px;font-weight:600;color:#7c6f66}.chipAnimo b{color:var(--rosa-osc)}.bichoGrande{font-size:54px}.bichoLienzo{image-rendering:pixelated;width:96px;height:96px}@media(min-width:900px)and (min-height:700px){body{align-items:center}#app{height:min(96dvh,900px);border-radius:22px;box-shadow:0 24px 60px #0009;border:1px solid #23233a}}