.puni-page{touch-action:pan-y;-webkit-text-size-adjust:100%}.puni-total{text-align:center;background:#fff;border:2px solid #25170f;border-radius:1rem;min-width:5.25rem;padding:.35rem .65rem;line-height:1;display:grid;box-shadow:3px 3px #25170f}.puni-total strong{font-size:1.35rem;font-weight:900}.puni-total span{color:#80694f;margin-top:.2rem;font-size:.72rem;font-weight:700}.puni-grid{touch-action:pan-y;overscroll-behavior-x:none;-webkit-user-select:none;user-select:none;cursor:grab;background:linear-gradient(#fff7cf,#ffeeb2);border:0;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1.75rem,7vw,4rem) clamp(0px,.8vw,8px);width:100%;margin:0;padding:1rem .15rem 2rem;display:grid;position:relative;overflow:visible}.puni-grid:active{cursor:grabbing}.puni-bottle{aspect-ratio:2/3;width:100%;cursor:inherit;-webkit-tap-highlight-color:transparent;background:0 0;border:0;padding:0;position:relative;overflow:visible}.puni-bottle:focus-visible{outline-offset:2px;border-radius:1rem;outline:4px solid #e65053}.puni-jar{z-index:3;object-fit:contain;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.puni-creature{--puni-hue:0deg;z-index:2;pointer-events:none;transform-origin:50% 90%;width:80%;height:82%;position:absolute;bottom:7%;left:10%}.puni-creature img{object-fit:contain;width:100%;height:100%;filter:hue-rotate(var(--puni-hue)) saturate(1.08);pointer-events:none;transform-origin:50% 90%;animation:2.2s ease-in-out infinite alternate puni-idle}.puni-creature.is-rainbow img{animation:2.2s ease-in-out infinite alternate puni-idle,.72s linear infinite puni-rainbow}.puni-creature.is-rainbow:before{content:"";z-index:-1;opacity:.88;filter:blur(2px);background:conic-gradient(#ff4f87,#ffdd45,#69f47b,#4bdcff,#8c6cff,#ff4fca,#ff4f87);border:3px solid #ffffffe0;border-radius:48%;animation:.9s linear infinite puni-rainbow-halo;position:absolute;inset:4% 1% 0;box-shadow:0 0 9px 4px #ffffffe0,0 0 18px 8px #65e2ffbd}.puni-creature.is-rainbow.is-pulling:before,.puni-creature.is-rainbow.is-waiting:before,.puni-creature.is-gold.is-pulling:before,.puni-creature.is-gold.is-waiting:before,.puni-creature.is-galaxy.is-pulling:before,.puni-creature.is-galaxy.is-waiting:before,.puni-creature.is-bubble.is-pulling:before,.puni-creature.is-bubble.is-waiting:before{opacity:0;animation:none}.puni-creature.is-gold img{animation:2.2s ease-in-out infinite alternate puni-idle,.85s ease-in-out infinite alternate puni-gold}.puni-creature.is-gold:before{content:"";z-index:-1;background:conic-gradient(from 20deg,#fff7a8,#ffbf1f,#fffde0,#ed8f09,#fff7a8);border:3px solid #fff8c5;border-radius:46%;animation:.8s ease-in-out infinite alternate puni-gold-halo;position:absolute;inset:2% -2% 0;box-shadow:0 0 10px 4px #fff499eb,0 0 20px 8px #ffab149e}.puni-creature.is-galaxy img{animation:2.2s ease-in-out infinite alternate puni-idle,1.1s ease-in-out infinite alternate puni-galaxy}.puni-creature.is-galaxy:before{content:"";z-index:-1;background:radial-gradient(circle at 28% 25%,#fff 0 2px,#0000 3px),radial-gradient(circle at 72% 36%,#8ce9ff 0 2px,#0000 3px),radial-gradient(circle at 44% 72%,#ff79cf 0 2px,#0000 3px),radial-gradient(circle,#7544cb,#151447 68%);border:3px solid #bbd6ffe0;border-radius:49%;animation:1.8s linear infinite puni-galaxy-halo;position:absolute;inset:1% -3% 0;box-shadow:0 0 12px 5px #8a70ffc2,0 0 22px 9px #44d4ff6b}.puni-creature.is-bubble img{opacity:.9;animation:2.2s ease-in-out infinite alternate puni-idle,.95s ease-in-out infinite alternate puni-bubble}.puni-creature.is-bubble:before{content:"";z-index:-1;background:radial-gradient(circle at 23% 25%,#0000 0 7%,#fff 8% 10%,#0000 11%),radial-gradient(circle at 72% 35%,#0000 0 10%,#c5f8ff 11% 14%,#0000 15%),radial-gradient(circle at 48% 78%,#0000 0 8%,#efd8ff 9% 12%,#0000 13%),linear-gradient(145deg,#b2faffc7,#8ba9ff85);border:3px solid #ffffffe6;border-radius:49%;animation:1.15s ease-in-out infinite alternate puni-bubble-halo;position:absolute;inset:0 -4% -1%;box-shadow:0 0 10px 4px #fffc,0 0 21px 8px #5fe2ff8f}.puni-creature.is-pulling{z-index:5}.puni-creature.is-pulling img{animation:.52s linear forwards puni-pull-up}.puni-creature.is-waiting{opacity:0}.puni-creature.is-growing img{animation:.55s cubic-bezier(.18,.85,.24,1.28) both puni-return}.puni-glass-glare{z-index:4;pointer-events:none;background:linear-gradient(105deg,#ffffff2e,#0000 18% 78%,#ffffff1a);border-radius:45%;position:absolute;inset:20% 17% 9%}@keyframes puni-idle{0%{transform:translateY(1px)scaleY(.98)}to{transform:translateY(-2px)scale(.98,1.03)}}@keyframes puni-rainbow{0%{filter:hue-rotate(var(--puni-hue)) saturate(2.15) brightness(1.12) drop-shadow(0 0 3px #fff) drop-shadow(0 0 8px #ff45bd)}50%{filter:hue-rotate(calc(var(--puni-hue) + 180deg)) saturate(2.3) brightness(1.28) drop-shadow(0 0 4px #fff) drop-shadow(0 0 11px #49e7ff)}to{filter:hue-rotate(calc(var(--puni-hue) + 360deg)) saturate(2.15) brightness(1.12) drop-shadow(0 0 3px #fff) drop-shadow(0 0 8px #ff45bd)}}@keyframes puni-rainbow-halo{0%{opacity:.72;transform:rotate(0)scale(.96)}50%{opacity:1;transform:rotate(180deg)scale(1.08)}to{opacity:.72;transform:rotate(360deg)scale(.96)}}@keyframes puni-gold{0%{filter:sepia()saturate(2.8)brightness(1.1)drop-shadow(0 0 4px #fffbd1)drop-shadow(0 0 8px #ffb20f)}to{filter:sepia()saturate(4)brightness(1.45)drop-shadow(0 0 6px #fff)drop-shadow(0 0 13px #ffcf33)}}@keyframes puni-gold-halo{0%{opacity:.74;transform:rotate(-5deg)scale(.96)}to{opacity:1;transform:rotate(8deg)scale(1.1)}}@keyframes puni-galaxy{0%{filter:hue-rotate(225deg)saturate(2.2)brightness(.8)drop-shadow(0 0 5px #b892ff)}to{filter:hue-rotate(275deg)saturate(2.7)brightness(1.15)drop-shadow(0 0 7px #fff)drop-shadow(0 0 13px #54dfff)}}@keyframes puni-galaxy-halo{to{transform:rotate(360deg)scale(1.05)}}@keyframes puni-bubble{0%{filter:hue-rotate(145deg)saturate(1.6)brightness(1.18)drop-shadow(0 0 4px #fff)}to{filter:hue-rotate(195deg)saturate(2)brightness(1.42)drop-shadow(0 0 9px #8cecff)}}@keyframes puni-bubble-halo{0%{opacity:.7;transform:translateY(1px)scale(.95)}to{opacity:1;transform:translateY(-4px)scale(1.08)}}.rainbow-firework{z-index:60;pointer-events:none;animation:2.25s ease-in-out both firework-night;position:fixed;inset:0;overflow:hidden}.rainbow-firework.special-effect--gold{animation-name:special-gold-light}.rainbow-firework.special-effect--galaxy{animation-name:special-galaxy-night}.rainbow-firework.special-effect--bubble{animation-name:special-bubble-light}.rainbow-firework-canvas{z-index:2;width:100%;height:100%;position:absolute;inset:0}@keyframes firework-night{0%,to{background:#180c3400}18%,72%{background:radial-gradient(circle,#5227946b,#100826c7 78%)}}@keyframes special-gold-light{0%,to{background:#ffea7c00}18%,76%{background:radial-gradient(circle,#fffdda9e,#ffb41f70 70%,#5e300080)}}@keyframes special-galaxy-night{0%,to{background:#06052600}15%,82%{background:radial-gradient(circle,#6b3dcbad,#050723eb 78%)}}@keyframes special-bubble-light{0%,to{background:#a0f6ff00}18%,78%{background:linear-gradient(#dcfbff9e,#56c7ff7a,#cdaaff6b)}}@keyframes puni-pull-up{0%{transform:translateY(0)scale(1)}24%{transform:translateY(-18%)scale(.82,1.28)}47%{transform:translateY(-46%)scale(.48,1.62)}61%{transform:translateY(-65%)scale(.42,1.5)}73%{transform:translateY(-85%)scale(1.26,.78)}83%{transform:translateY(-94%)scale(.9,1.16)}92%{transform:translateY(-102%)scale(1.1,.9)}to{opacity:0;transform:translateY(-132%)scale(.8,.84)}}@keyframes puni-return{0%{opacity:0;transform:translateY(55%)scale(.28,.14)}to{opacity:1;transform:translateY(0)scale(1)}}@media (min-width:640px){.puni-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}@media (min-width:960px){.puni-grid{grid-template-columns:repeat(8,minmax(0,1fr))}}@media (prefers-reduced-motion:reduce){.puni-creature img{animation-duration:1ms}.puni-creature.is-pulling img{animation:.18s ease-out forwards puni-pull-reduced}.puni-creature.is-rainbow:before,.puni-creature.is-gold:before,.puni-creature.is-galaxy:before,.puni-creature.is-bubble:before{animation:none}.rainbow-firework{animation-duration:.9s}.puni-creature.is-growing img{animation:1ms linear both puni-return}}@keyframes puni-pull-reduced{to{opacity:0;transform:translateY(-105%)}}