@font-face{font-family:Fraunces;font-style:normal;font-display:swap;font-weight:100 900;src:url(/apps/burbujas-musicales/assets/fraunces-latin-standard-normal-DihXLNYH.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Space Grotesk;font-style:normal;font-display:swap;font-weight:300 700;src:url(/apps/burbujas-musicales/assets/space-grotesk-latin-wght-normal-BhU9QXUp.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}*{box-sizing:border-box;margin:0;-webkit-tap-highlight-color:transparent}.app{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;font-family:Space Grotesk,system-ui,sans-serif;color:#f4efff;background:radial-gradient(1200px 700px at 80% -10%,#3A2A7A 0%,transparent 55%),radial-gradient(900px 600px at 10% 110%,#144a5e 0%,transparent 50%),linear-gradient(180deg,#171033,#221650 55%,#1b123f);-webkit-user-select:none;user-select:none;touch-action:none}@supports (height: 100dvh){.app{bottom:auto;height:100dvh}}.deco{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.deco span{position:absolute;border-radius:50%;background:radial-gradient(circle at 32% 30%,#ffffff80,#ffffff0d 60%);opacity:.3;animation:flo linear infinite alternate}@keyframes flo{0%{transform:translateY(0)}to{transform:translateY(-26px)}}.menu{position:relative;height:100%;display:flex;flex-direction:column;padding:calc(22px + env(safe-area-inset-top,0px)) 16px 10px;overflow-y:auto;touch-action:pan-y}.cab{text-align:center;margin-bottom:14px;position:relative}.titulo{font-family:Fraunces,serif;font-weight:800;font-size:clamp(38px,11vw,54px);line-height:.95;background:linear-gradient(90deg,#ff9a9e,#ffd3a5,#a8edea,#a6c1ee,#fbc2eb);-webkit-background-clip:text;background-clip:text;color:transparent}.lema{margin-top:8px;letter-spacing:.16em;text-transform:uppercase;font-size:11px;color:#c9bff5}.marcador{margin-top:12px;display:flex;gap:10px;justify-content:center;align-items:center}.estrellaTot{color:#dca52b;font-weight:700}.tagFull{font-size:11px;border:1px solid #DCA52B;color:#dca52b;border-radius:999px;padding:3px 10px}.btnMini{font:600 12px Space Grotesk;color:#171033;background:#dca52b;border:0;border-radius:999px;padding:6px 12px}.marcador{flex-wrap:wrap}.btnMini.sec{background:#ffffff14;color:#ede9fb;border:1px solid rgba(255,255,255,.22)}.panelWeb{text-align:left;-webkit-user-select:text;user-select:text;--surface-2: rgba(255,255,255,.1);--line: rgba(255,255,255,.18);--ink: #EDE9FB;--ink-3: #C9BFF5;--a2-ink: #8FD14F;--error: #FF9A9E;--surface: #171033}.panelWeb textarea{-webkit-user-select:text;user-select:text;border-radius:10px;padding:8px}.rejilla{display:grid;grid-template-columns:1fr 1fr;gap:10px}.carta{text-align:left;border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:12px;background:#ffffff0f;color:inherit;font-family:inherit;display:flex;flex-direction:column;gap:3px}.carta:active{transform:scale(.97)}.carta.bloq{background:#ffffff06}.carta.hecha{border-color:#dca52b99}.num{font-family:Fraunces,serif;font-weight:800;font-size:20px;color:#dca52b}.cn{font-weight:700;font-size:14px}.tagVoz{margin-left:6px;font-style:normal;font-size:11px}.cs{font-size:11.5px;color:#c9bff5}.cpie{margin-top:5px;font-size:11px;color:#9d92cf;letter-spacing:.03em}.carta.hecha .cpie{color:#dca52b;letter-spacing:.18em}.pieMenu{margin-top:auto;padding:16px 4px 8px;text-align:center;font-size:10.5px;line-height:1.7;color:#8d83c2}.juego{position:relative;height:100%;display:flex;flex-direction:column}.hud{display:flex;align-items:center;gap:10px;padding:calc(10px + env(safe-area-inset-top,0px)) 12px 6px}.hbtn{border:1px solid rgba(255,255,255,.2);background:#ffffff14;color:#fff;border-radius:12px;width:36px;height:36px;font-size:14px;flex:none}.hlv{flex:1;min-width:0}.hn{font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}.barra{height:6px;border-radius:99px;background:#ffffff24;margin-top:4px;overflow:hidden}.barra span{display:block;height:100%;background:linear-gradient(90deg,#8fd14f,#39c6a5,#2fb8de);transition:width .3s}.hdatos{display:flex;align-items:center;gap:8px}.hpts{font-family:Fraunces,serif;font-weight:800;font-size:18px;color:#dca52b}.hracha{font-size:12px;font-weight:700;color:#ffb25e}.hfondo{font-size:11px;color:#c9bff5}.hfondo.peligro{color:#ff7a7a;font-weight:700}.area{position:relative;flex:1;overflow:hidden}.lineaFondo{position:absolute;left:0;right:0;bottom:0;height:3px;background:#ffffff26}.lineaFondo.peligro{background:#ff5a5a;box-shadow:0 0 14px #ff5a5a}.bub{position:absolute;top:0;left:0;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:inset -6px -10px 18px #0000002e,0 6px 18px #00000059}.bub .brillo{position:absolute;top:14%;left:18%;width:26%;height:16%;border-radius:50%;background:#ffffffd9;filter:blur(1px);transform:rotate(-24deg)}.bub .icono{font-size:20px;color:#140a32a6;text-shadow:0 1px 0 rgba(255,255,255,.4)}.bub.on{outline:3px solid rgba(255,255,255,.9);outline-offset:3px;box-shadow:inset -6px -10px 18px #0000002e,0 0 26px #ffffff8c;z-index:3}.bub.set{transition:transform .35s ease}.bub.pop{animation:pop .4s ease forwards;pointer-events:none}.bub.shake{animation:shk .45s ease}@keyframes pop{60%{transform:scale(1.35);opacity:.85}to{transform:scale(2);opacity:0}}@keyframes shk{25%{margin-left:-7px}50%{margin-left:6px}75%{margin-left:-4px}}.toast{position:absolute;left:50%;top:34%;transform:translate(-50%);font-family:Fraunces,serif;font-weight:800;font-size:clamp(26px,7vw,38px);text-shadow:0 2px 14px rgba(0,0,0,.55),0 0 26px currentColor;animation:tst 1.25s ease forwards;pointer-events:none;white-space:nowrap;z-index:5}@keyframes tst{0%{opacity:0;transform:translate(-50%) scale(.6)}18%{opacity:1;transform:translate(-50%) scale(1.06)}75%{opacity:1}to{opacity:0;transform:translate(-50%) scale(1)}}.franja{display:flex;align-items:center;gap:8px;padding:7px 12px;background:#00000047;border-top:1px solid rgba(255,255,255,.1);min-height:46px}.chip{font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;border:1.5px solid;border-radius:999px;padding:3px 9px;flex:none}.instr{font-size:12px;flex:1;min-width:0;line-height:1.25}.instr.suave{color:#b7ace6;text-align:center}.puntos{display:flex;gap:4px;flex:none}.puntos i{width:9px;height:9px;border-radius:50%;border:1.5px solid #C9BFF5}.puntos i.ok{background:#8fd14f;border-color:#8fd14f}.btnRep{flex:none;font:600 12px Space Grotesk;color:#171033;background:#e8e2ff;border:0;border-radius:999px;padding:7px 12px}.entradaBar{display:flex;gap:6px;padding:6px 12px 0}.eBtn{flex:1;font:600 12px Space Grotesk;color:#c9bff5;background:#ffffff0f;border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:7px}.eBtn.on{color:#171033;background:linear-gradient(90deg,#dca52b,#f2c14e);border-color:transparent}.panelVoz{margin:6px 12px 0;padding:8px 10px;border-radius:14px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column;gap:8px}.vozTop{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}.vozModos{display:flex;gap:6px}.modoBtn{font:600 11px Space Grotesk;color:#c9bff5;background:#ffffff0f;border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:5px 11px}.modoBtn.on{color:#171033;background:#8fd14f;border-color:transparent}.vozAyuda{font-size:10.5px;color:#9d92cf}.btnMic{font:700 13px Space Grotesk;color:#171033;background:linear-gradient(90deg,#dca52b,#f2c14e);border:0;border-radius:12px;padding:10px}.afinador{display:flex;flex-direction:column;align-items:center;gap:6px;padding:4px 0}.afNota{font-family:Fraunces,serif;font-weight:800;font-size:26px;color:#ede9fb}.afinador.enTono .afNota{color:#8fd14f;text-shadow:0 0 16px rgba(143,209,79,.65)}.afBarra{position:relative;width:100%;max-width:260px;height:8px;border-radius:99px;background:#ffffff1f}.afCentro{position:absolute;left:50%;top:-3px;width:2px;height:14px;background:#c9bff5;opacity:.6}.afAguja{position:absolute;top:-4px;width:16px;height:16px;border-radius:50%;transform:translate(-50%);background:#e8e2ff;box-shadow:0 0 6px #0006;transition:left .08s linear,background .15s}.afinador.enTono .afAguja{background:#8fd14f;box-shadow:0 0 12px #8fd14f}.afHz{font-size:11px;color:#9d92cf}.vozErrMsg{font-size:11.5px;color:#ff9a9e;text-align:center}.teclado{position:relative;height:clamp(112px,19vh,150px);height:clamp(112px,19dvh,150px);display:flex;background:#0e0a24;padding:5px 5px calc(6px + env(safe-area-inset-bottom,0px));gap:2px}.tb{flex:1;position:relative;border-radius:0 0 8px 8px;border:1px solid #cfc8e8;background:linear-gradient(180deg,#fff,#ede9fb);display:flex;flex-direction:column;justify-content:flex-end;align-items:center;padding-bottom:7px;gap:5px}.tb:active{background:linear-gradient(180deg,#f2eefc,#ddd5f2)}.tb .pto{width:11px;height:11px;border-radius:50%;box-shadow:0 0 6px #00000040}.tb .etq{font-size:12px;font-weight:700;color:#2a1b5e}.tn{position:absolute;top:5px;width:8.2%;height:56%;z-index:2;border-radius:0 0 6px 6px;border:1px solid #000;background:linear-gradient(180deg,#33304a,#14111f);display:flex;align-items:flex-end;justify-content:center;padding-bottom:5px}.tn:active{background:linear-gradient(180deg,#4a4568,#201c33)}.etqN{font-size:8.5px;font-weight:700;color:#ede9fb;text-align:center;line-height:1.15}.etqN small{font-size:7px;color:#a79ecf;font-weight:500}.pista{animation:pls .55s ease-in-out 2}@keyframes pls{50%{box-shadow:0 0 0 4px #dca52b,0 0 24px #dca52b}}.velo{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;background:#0c081eb8;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;padding:22px}.caja{width:min(400px,100%);background:linear-gradient(180deg,#2a1b5e,#1c1244);border:1px solid rgba(255,255,255,.16);border-radius:22px;padding:22px 20px;display:flex;flex-direction:column;gap:12px;text-align:center;box-shadow:0 24px 60px #00000080}.caja h2{font-family:Fraunces,serif;font-weight:800;font-size:24px}.caja p{font-size:13.5px;line-height:1.55;color:#dcd4f8}.caja .pie{font-size:11.5px;color:#9d92cf}.precio{font-family:Fraunces,serif;font-weight:800;font-size:22px;color:#dca52b}.btn{font:700 14px Space Grotesk;border:0;border-radius:14px;padding:13px;background:linear-gradient(90deg,#dca52b,#f2c14e);color:#171033}.btn:active{transform:scale(.97)}.btn.sec{background:#ffffff1a;color:#ede9fb;border:1px solid rgba(255,255,255,.18)}.estrellas{font-size:40px;letter-spacing:6px;color:#ffffff2e}.estrellas .on{color:#dca52b;text-shadow:0 0 18px rgba(220,165,43,.6)}button{font-family:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.5}.carta:disabled{opacity:1}button:focus-visible,input:focus-visible{outline:3px solid #A8EDEA;outline-offset:3px}.bub{border:0;padding:0}.selectorPractica{display:flex;gap:8px;margin:0 0 8px}.ayudaPractica{color:#c9bff5;font-size:12px;line-height:1.5;text-align:center;margin-bottom:12px}.caja{max-height:100%;overflow-y:auto;touch-action:pan-y}.tb{min-width:0}@media (max-width: 380px){.hud{gap:5px;padding-left:8px;padding-right:8px}.hdatos{gap:4px}.franja{flex-wrap:wrap;gap:5px}.chip{font-size:9px;padding:3px 6px}.hpts{font-size:15px}}@media (max-height: 600px){.juego{overflow-y:auto;touch-action:pan-y}.area{flex:1 0 180px}.teclado{flex-shrink:0}}.controles{display:contents}.velocidad{display:flex;flex-direction:column;gap:6px;margin:0 0 12px}.velTit{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#c9bff5;text-align:center}.velBtns{display:flex;gap:4px}.velBtn{flex:1;min-width:0;min-height:40px;font:600 11.5px Space Grotesk;color:#c9bff5;background:#ffffff0f;border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:4px 2px}.velBtn.on{color:#171033;background:linear-gradient(90deg,#dca52b,#f2c14e);border-color:transparent}.caja .velocidad{margin:4px 0 14px}@media (orientation: landscape) and (max-height: 600px){.juego{display:grid;overflow:hidden;touch-action:none;grid-template-columns:minmax(190px,32%) 1fr;grid-template-rows:auto minmax(0,1fr) auto;grid-template-areas:"hud area" "controles area" "teclado teclado";padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}.hud{grid-area:hud;flex-wrap:wrap;row-gap:4px;padding:calc(6px + env(safe-area-inset-top,0px)) 8px 4px}.hlv{order:3;flex-basis:100%}.hdatos{margin-left:auto}.area{grid-area:area;min-height:0}.controles{grid-area:controles;display:flex;flex-direction:column;gap:6px;min-height:0;overflow-y:auto;touch-action:pan-y;padding-bottom:6px}.franja{flex-wrap:wrap;min-height:0;margin:0 8px;padding:6px 8px;border:0;border-radius:12px}.entradaBar{padding:0 8px}.panelVoz{margin:0 8px}.teclado{grid-area:teclado;height:clamp(112px,42vh,200px);height:clamp(112px,42dvh,200px)}.tb .etq{font-size:13px}}@media (prefers-reduced-motion: reduce){.deco span,.toast,.bub.pop,.bub.shake,.pista{animation:none}.bub.pop{opacity:0}.bub.set,.afAguja,.barra span{transition:none}}
