:root{--orange:#ff7a00;--yellow:#ffd400;--pink:#ff4fa3;--blue:#2f7bff;--green:#35d461;--ink:#1b1030;--panel:#fffffff0;font-family:Fredoka,"Baloo 2",Nunito,Segoe UI,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}html,body{height:100%;color:var(--ink);touch-action:none;-webkit-user-select:none;user-select:none;background:#8fd3ff;margin:0;overflow:hidden}canvas#game{width:100%;height:100%;display:block;position:fixed;inset:0}.layer{pointer-events:none;position:fixed;inset:0}.hidden{display:none!important}button{font:inherit;cursor:pointer}.label{white-space:nowrap;color:#fff;text-shadow:0 2px #000,0 0 10px #00000080;will-change:transform;font-size:22px;font-weight:900;position:absolute;top:0;left:0}.label.popup{color:var(--yellow);font-size:30px;animation:.35s cubic-bezier(.2,1.6,.4,1) both pop}.label.popup.rare{color:#ff8cf0;font-size:36px}.label.popup.mega{color:#ff3b1f;font-size:44px}.label.popup.chain{color:#7ef7ff;font-size:26px}.label.live{color:#fff;text-shadow:none;background:#00000073;border-radius:999px;padding:2px 10px;font-size:20px}.label.live.rare{color:#ff8cf0}@keyframes pop{0%{transform:scale(.2)}}#hud{flex-direction:column;display:flex}.hud-top{justify-content:space-between;align-items:flex-start;gap:12px;padding:12px;display:flex}.score-card{background:var(--panel);border-radius:18px;min-width:240px;padding:10px 16px;box-shadow:0 6px #00000026}.score-label{opacity:.8;font-size:15px;font-weight:800}.score-value{color:var(--orange);letter-spacing:-1px;font-size:40px;font-weight:900;line-height:1.05}.score-value.bump{animation:.25s ease-out bump}@keyframes bump{40%{transform:scale(1.2)}}.progress{background:#e6e2f0;border-radius:999px;height:18px;margin-top:6px;position:relative;overflow:hidden}.progress-fill{background:linear-gradient(90deg, var(--green), var(--yellow));border-radius:999px;width:0;height:100%;transition:width .3s ease-out}.progress-text{text-align:center;font-size:12px;font-weight:800;line-height:18px;position:absolute;inset:0}.hud-right{pointer-events:auto;gap:8px;display:flex}.icon-btn{background:var(--panel);border:0;border-radius:14px;width:48px;height:48px;font-size:22px;box-shadow:0 4px #00000026}.icon-btn:active{transform:translateY(2px);box-shadow:0 2px #00000026}.powerups{flex-direction:column;gap:6px;display:flex;position:absolute;top:110px;left:12px}.powerup{background:#ffffffe6;border-radius:999px;align-items:center;gap:8px;padding:4px 12px 4px 6px;font-size:14px;font-weight:800;animation:.3s both pop;display:flex;box-shadow:0 3px #00000026}.powerup .ring{background:conic-gradient(var(--c) calc(var(--p) * 1%), #ddd 0);border-radius:50%;place-items:center;width:30px;height:30px;font-size:16px;display:grid}.powerup .ring span{background:#fff;border-radius:50%;place-items:center;width:24px;height:24px;display:grid}.hint{color:#fff;white-space:nowrap;opacity:0;text-overflow:ellipsis;background:#1b1030bf;border-radius:999px;max-width:92vw;padding:8px 18px;font-size:18px;font-weight:800;transition:opacity .2s;position:absolute;bottom:120px;left:50%;overflow:hidden;transform:translate(-50%)}.hint.show{opacity:1}.banner{color:var(--yellow);-webkit-text-stroke:3px #7a2b00;text-shadow:0 8px #00000040;opacity:0;white-space:nowrap;font-size:clamp(40px,9vw,96px);font-weight:900;position:absolute;top:24%;left:50%;transform:translate(-50%,-50%)scale(.3)}.banner.show{animation:1.6s cubic-bezier(.2,1.5,.4,1) both banner}@keyframes banner{0%{opacity:0;transform:translate(-50%,-50%)scale(.3)rotate(-8deg)}15%{opacity:1;transform:translate(-50%,-50%)scale(1.1)rotate(3deg)}25%{transform:translate(-50%,-50%)scale(1)rotate(-2deg)}80%{opacity:1}to{opacity:0;transform:translate(-50%,-70%)scale(1)}}.combo{color:#7ef7ff;-webkit-text-stroke:2px #063a5c;opacity:0;font-size:clamp(26px,5vw,48px);font-weight:900;position:absolute;top:36%;right:6vw;transform:rotate(8deg)}.combo.show{animation:.9s ease-out both combo}@keyframes combo{0%{opacity:0;transform:scale(.3)rotate(8deg)}20%{opacity:1;transform:scale(1.2)rotate(8deg)}to{opacity:1;transform:scale(1)rotate(8deg)}}.charge{text-align:center;width:min(420px,70vw);position:absolute;bottom:44px;left:50%;transform:translate(-50%)}.charge-track{background:#1b103099;border:3px solid #fff;border-radius:999px;height:28px;overflow:hidden;box-shadow:0 4px #0003}.charge-fill{background:linear-gradient(90deg, var(--yellow), var(--orange), #ff2d2d);border-radius:999px;width:0;height:100%}.charge.max .charge-track{animation:.25s infinite alternate maxflash}@keyframes maxflash{to{border-color:var(--yellow);box-shadow:0 0 24px var(--yellow)}}.charge-text{color:#fff;text-shadow:0 2px #000;margin-top:6px;font-size:20px;font-weight:900}.touch-controls{display:none;position:absolute;inset:0}body.touch .touch-controls{display:block}body.touch .charge{bottom:calc(150px + env(safe-area-inset-bottom));width:min(360px,52vw)}body.touch .hint{bottom:calc(215px + env(safe-area-inset-bottom));font-size:16px}.stick{left:calc(30px + env(safe-area-inset-left));bottom:calc(30px + env(safe-area-inset-bottom));opacity:.7;background:#fff3;border:3px solid #ffffff8c;border-radius:50%;width:130px;height:130px;transition:opacity .15s;position:absolute}.stick.active{opacity:1;background:#ffffff47;transition:none}.stick-knob{background:#ffffffe6;border-radius:50%;width:58px;height:58px;margin:-29px;position:absolute;top:50%;left:50%;box-shadow:0 3px #0003}.touch-buttons{right:calc(24px + env(safe-area-inset-right));bottom:calc(30px + env(safe-area-inset-bottom));pointer-events:auto;align-items:flex-end;gap:16px;display:flex;position:absolute}.touch-btn{color:#fff;text-shadow:0 2px #0000004d;touch-action:none;-webkit-tap-highlight-color:transparent;border:4px solid #fff;border-radius:50%;padding:0;font-weight:900;box-shadow:0 6px #00000040}.touch-btn.jump{background:var(--blue);width:84px;height:84px;margin-bottom:70px;font-size:16px}.touch-btn.yeet{background:var(--orange);width:120px;height:120px;font-size:26px}.touch-btn:active{filter:brightness(1.15);transform:translateY(3px);box-shadow:0 3px #00000040}.howto.touch-only{display:none}body.touch .howto.touch-only{display:grid}body.touch .howto.keys-only{display:none}body.touch .hud-top{padding-left:calc(12px + env(safe-area-inset-left));padding-right:calc(12px + env(safe-area-inset-right))}button,.touch-controls{-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.screen{touch-action:pan-y;-webkit-overflow-scrolling:touch;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#1b10308c;place-items:center;padding:16px;display:grid;position:fixed;inset:0;overflow:auto}#screen-title{-webkit-backdrop-filter:none;backdrop-filter:none;background:radial-gradient(circle at 30% 20%,#ffb34780,#ff7a0047 40%,#ff4fa34d 80%,#7b2cff6b)}#screen-levels{-webkit-backdrop-filter:blur(1.5px);backdrop-filter:blur(1.5px);background:#1b10306b}.panel{background:var(--panel);text-align:center;border-radius:28px;width:100%;max-width:720px;padding:28px 32px;animation:.45s cubic-bezier(.2,1.5,.4,1) both pop;position:relative;overflow:hidden;box-shadow:0 12px #0003}.panel.small{max-width:460px}.panel h2{color:var(--orange);margin:0 0 16px;font-size:36px;font-weight:900}.logo{letter-spacing:-2px;flex-wrap:wrap;justify-content:center;margin:0 0 8px;font-size:clamp(44px,9vw,92px);font-weight:900;line-height:1;display:flex}.logo span{color:var(--orange);-webkit-text-stroke:2px #7a2b00;text-shadow:0 6px #7a2b00;animation:1.6s ease-in-out infinite wobble;display:inline-block}.logo span.gap{width:.3em}.logo span:nth-child(odd){color:var(--yellow)}.logo span:nth-child(3n){animation-delay:-.4s}.logo span:nth-child(3n+1){animation-delay:-.8s}@keyframes wobble{0%,to{transform:translateY(0)rotate(-3deg)}50%{transform:translateY(-6px)rotate(3deg)}}.tagline{margin:4px 0 20px;font-size:20px;font-weight:700}.big-btn{background:var(--green);color:#fff;text-shadow:0 2px #00000040;border:0;border-radius:999px;margin:8px auto;padding:16px 44px;font-size:30px;font-weight:900;transition:transform .1s;display:block;box-shadow:0 8px #1f9a42}.big-btn:hover{transform:scale(1.05)}.big-btn:active{transform:translateY(4px);box-shadow:0 4px #1f9a42}.text-btn{color:var(--blue);background:0 0;border:0;border-radius:999px;margin:8px auto 0;padding:8px 14px;font-size:18px;font-weight:800;display:block}.text-btn:hover{background:#2f7bff1a}.howto{text-align:left;grid-template-columns:repeat(2,1fr);gap:8px 18px;margin-top:20px;font-weight:700;display:grid}.howto-item{align-items:center;gap:10px;display:flex}.key{background:var(--ink);color:#fff;white-space:nowrap;border-radius:8px;padding:4px 10px;font-size:14px;font-weight:900;box-shadow:0 3px #000}.level-cards{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:8px 0 12px;display:grid}.level-card{background:linear-gradient(160deg, var(--a), var(--b));color:#fff;text-shadow:0 2px #0000004d;border:0;border-radius:20px;padding:16px 12px;font-weight:900;transition:transform .1s;box-shadow:0 6px #0003}.level-card:hover:not(:disabled){transform:scale(1.05)}.level-card .icon{font-size:44px;display:block}.level-card .name{font-size:20px;display:block}.level-card .sub{opacity:.9;font-size:12px;font-weight:700;display:block}.level-card .best{background:#00000040;border-radius:999px;margin-top:6px;padding:2px 8px;font-size:13px;display:block}.level-card:disabled{filter:grayscale(.9);opacity:.6;cursor:not-allowed}.pause-tips{opacity:.8;margin-top:18px;font-weight:700}.stars{margin:6px 0;font-size:46px;animation:.5s .2s both pop}.complete-score{margin:4px 0;font-size:26px;font-weight:800}.complete-score b{color:var(--orange);font-size:34px}.complete-best{color:var(--pink);min-height:1.2em;margin:0 0 8px;font-weight:800}.celebrate h2{font-size:40px;animation:.6s ease-out infinite alternate bump}.confetti{pointer-events:none;position:absolute;inset:0;overflow:hidden}.confetti i{background:var(--c);width:10px;height:16px;animation:fall var(--d) linear infinite;animation-delay:var(--delay);top:-12px;left:var(--x);border-radius:2px;position:absolute}@keyframes fall{to{transform:translateY(600px)rotate(720deg)}}.rotate-hint{color:#fff;background:#0009;border-radius:999px;padding:6px 14px;font-size:14px;font-weight:800;position:fixed;bottom:10px;left:50%;transform:translate(-50%)}@media (width<=640px){.panel{padding:20px 16px}.howto{grid-template-columns:1fr}.score-card{min-width:190px;padding:8px 12px}.score-value{font-size:30px}}.label.popup.shout{color:#fff;text-shadow:none;background:#ff4fa3;border-radius:14px;padding:2px 12px;font-size:26px;box-shadow:0 3px #00000040}.label small{opacity:.9;font-size:.6em}.loading{z-index:50;text-align:center;color:#fff;text-shadow:0 3px #00000040;background:radial-gradient(circle at 50% 38%,#ffb347f7,#ff4fa3f7 70%,#7b2cfff7);place-content:center;justify-items:center;gap:12px;padding:24px;display:grid;position:fixed;inset:0}.loading .yeeter{font-size:72px;animation:.6s ease-in-out infinite alternate yeetbounce}.loading-text{font-size:clamp(26px,5vw,40px);font-weight:900}.loading-tip{opacity:.95;max-width:560px;font-size:clamp(15px,2.6vw,20px);font-weight:800}@keyframes yeetbounce{0%{transform:translateY(10px)rotate(-10deg)}to{transform:translateY(-16px)rotate(10deg)}}@media (height<=500px){.hud-top{padding:8px}.score-card{border-radius:14px;min-width:170px;padding:6px 12px}.score-label{font-size:13px}.score-value{font-size:26px}.progress{height:14px;margin-top:4px}.progress-text{font-size:10px;line-height:14px}.icon-btn{border-radius:12px;width:40px;height:40px;font-size:18px}.powerups{top:86px}.stick{width:110px;height:110px;left:calc(20px + env(safe-area-inset-left));bottom:calc(18px + env(safe-area-inset-bottom))}.touch-buttons{right:calc(16px + env(safe-area-inset-right));bottom:calc(18px + env(safe-area-inset-bottom));gap:12px}.touch-btn.yeet{width:104px;height:104px;font-size:22px}.touch-btn.jump{width:74px;height:74px;margin-bottom:56px;font-size:14px}body.touch .charge{bottom:calc(18px + env(safe-area-inset-bottom));width:min(300px,100vw - 420px)}body.touch .hint{bottom:calc(96px + env(safe-area-inset-bottom));white-space:normal;text-align:center;border-radius:18px;max-width:calc(100vw - 440px);padding:6px 14px;font-size:15px;line-height:1.25}body.touch .charge-text{white-space:nowrap;text-overflow:ellipsis;margin:4px -60px 0;font-size:14px;overflow:hidden}.charge-track{height:22px}.charge-text{font-size:15px}.banner{top:30%}.panel{border-radius:22px;padding:16px 20px}.panel h2{margin-bottom:8px;font-size:26px}.logo{font-size:clamp(36px,8vw,60px)}.tagline{margin:2px 0 10px;font-size:16px}.big-btn{padding:10px 34px;font-size:24px}.howto{gap:6px 14px;margin-top:10px;font-size:14px}.level-cards{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px}.level-card{padding:10px 8px}.level-card .icon{font-size:32px}.level-card .name{font-size:17px}.stars{font-size:34px}.celebrate h2{font-size:30px}}@media (orientation:portrait) and (width<=640px){.touch-buttons{flex-direction:column;align-items:center;gap:12px}.touch-btn.jump{margin-bottom:0}body.touch .charge{bottom:calc(260px + env(safe-area-inset-bottom));width:80vw}body.touch .hint{bottom:calc(320px + env(safe-area-inset-bottom));white-space:normal;text-align:center}.rotate-hint{top:120px;bottom:auto}}
