@import"https://fonts.googleapis.com/css2?family=Baloo+2:wght@600;700;800&family=Barlow+Condensed:ital,wght@1,800&display=swap";:root{font-family:"Baloo 2",system-ui,sans-serif;color:#fff;background:#142b3b;font-synthesis:none}*{box-sizing:border-box}html,body,#app{margin:0;position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;touch-action:none;overscroll-behavior:none}button{font:inherit}#game-root{position:fixed;left:0;top:0;overflow:hidden;background:radial-gradient(circle at 50% 30%,#5f6c68,#18374c 70%)}#game-stage{position:absolute;left:0;top:0;transform-origin:top left;overflow:hidden;box-shadow:0 0 80px #07141c88}canvas{position:absolute;top:0;right:0;bottom:0;left:0;display:block;touch-action:none}.screen,.hud{position:absolute;top:0;right:0;bottom:0;left:0;display:none;pointer-events:none}.screen.visible,.hud.visible{display:block}.screen.visible .btn,.hud.visible .icon-btn{pointer-events:auto}.title-screen{padding:86px 52px;text-align:center;background:linear-gradient(180deg,#05192c66 0%,transparent 38%,#092236d9 74%,#071723f5 100%);pointer-events:auto}.brand-kicker{display:inline-block;background:#e61b27;padding:4px 22px;border-radius:7px;transform:rotate(-3deg);font-size:23px;font-weight:800;letter-spacing:8px;box-shadow:0 5px #891621}.brand h1{font-size:70px;line-height:.86;margin:24px 0 18px;letter-spacing:-2px;text-transform:uppercase;text-shadow:0 5px 0 #073861,0 9px 22px #0008}.brand p{font-size:25px;line-height:1.15;margin:0 auto;max-width:500px;text-shadow:0 2px 4px #000}.best-chip{position:absolute;left:50%;bottom:300px;transform:translate(-50%);font-size:25px;padding:7px 26px;border:2px solid #ffffff55;border-radius:30px;background:#082238b8;white-space:nowrap}.btn{display:block;width:100%;min-height:92px;margin:16px 0;padding:13px 24px;border:2px solid #ffffff4a;border-radius:20px;color:#fff;background:#23455a;font-size:26px;font-weight:800;line-height:1.05;cursor:pointer;box-shadow:0 6px #0c2333;transition:transform .08s,filter .1s}.btn:hover{filter:brightness(1.1)}.btn:active{transform:translateY(4px);box-shadow:0 2px #0c2333}.btn:disabled{opacity:.45;pointer-events:none}.btn.primary{color:#17232b;background:linear-gradient(#ffe875,#ffc93e);border-color:#fff4b7;box-shadow:0 7px #b77a19}.btn.secondary{background:#164f74}.play{position:absolute;left:110px;bottom:180px;width:500px;font-size:34px;min-height:96px;border-radius:28px}.icon-btn{position:absolute;border:2px solid #ffffff55;background:#08283fc9;color:#fff;border-radius:18px;width:92px;height:92px;font-size:30px;cursor:pointer;box-shadow:0 3px #00111c66}.title-sound{right:28px;top:28px;width:auto;min-width:92px;min-height:92px;padding:0 18px;font-size:18px}.hits{position:absolute;left:480px;top:710px;color:#fff5dc;font:italic 800 47px Barlow Condensed,sans-serif;letter-spacing:-1px;-webkit-text-stroke:7px #9b2025;paint-order:stroke fill;transform:rotate(-2deg);text-shadow:0 3px 0 #681317}.combo{position:absolute;left:435px;top:654px;font-size:26px;color:#ffe45c;text-shadow:0 3px 0 #8c4b15,0 0 8px #000}.milestone-progress{position:absolute;left:50%;top:28px;transform:translate(-50%);padding:8px 22px;border-radius:22px;background:#062238c7;border:1px solid #ffffff55;white-space:nowrap;font-size:20px}.pause-btn{left:24px;top:24px}.sound-btn{right:24px;top:24px;width:92px;font-size:30px}.milestone-banner{position:absolute;left:50%;top:360px;transform:translate(-50%,-20px) scale(.8);opacity:0;padding:12px 30px;background:#ffe45c;color:#282c31;border:4px solid #fff5bd;border-radius:18px;font-size:35px;font-weight:800;white-space:nowrap;transition:.2s}.milestone-banner.visible{opacity:1;transform:translate(-50%) scale(1)}.tutorial{position:absolute;left:50%;bottom:350px;transform:translate(-50%);display:none;width:570px;min-height:96px;padding:20px 90px 20px 26px;border-radius:24px;background:#08283ee8;border:3px solid #ffe45c;box-shadow:0 7px 25px #0007}.tutorial.visible{display:block}.tutorial-text{font-size:24px;line-height:1.12}.tutorial-gesture{position:absolute;right:8px;bottom:0;width:90px;height:90px;object-fit:contain;animation:gesture 1s ease-in-out infinite}@keyframes gesture{50%{transform:translate(-10px,-15px) rotate(-8deg)}}.modal{background:#04101bbd;pointer-events:auto;display:none;place-items:center}.modal.visible{display:grid}.card{width:540px;padding:38px 44px;background:linear-gradient(160deg,#153e59f5,#0b263af8);border:3px solid #ffffff45;border-radius:32px;box-shadow:0 18px 70px #0008;text-align:center;pointer-events:auto}.card h2{font-size:48px;margin:0 0 20px}.card p{font-size:23px;line-height:1.25}.gameover{background:#10141855;pointer-events:auto}.lose-title{position:absolute;left:0;right:0;top:555px;text-align:center;font-size:78px;line-height:1;color:#ffe45c;font-weight:800;letter-spacing:-3px;-webkit-text-stroke:10px #16191c;paint-order:stroke fill;transform:rotate(-2deg)}.over-card{position:absolute;left:90px;top:800px;width:540px;padding:22px 34px;background:#0b263aee}.stats{display:grid;grid-template-columns:1fr 1fr;gap:8px}.stats>div{display:flex;justify-content:space-between;font-size:20px}.stats b{color:#ffe45c;font-size:24px}.stats .reason,.stats .rank{grid-column:1/3;justify-content:center;font-size:19px;color:#ffb6aa}.stats .rank{color:#d9e9f2}.over-buttons{display:grid;grid-template-columns:1fr 1fr;gap:16px}.over-buttons .btn{font-size:23px;margin:12px 0 0}.countdown{text-align:center;font-size:32px;text-shadow:0 4px 10px #000}.countdown b{display:block;font-size:130px;color:#ffe45c}.rotate-prompt{display:none;position:absolute;top:0;right:0;bottom:0;left:0;z-index:100;background:#0b263af5;place-items:center;text-align:center;padding:60px;font-size:32px}.rotate-prompt.visible{display:grid}.toast{position:absolute;left:50%;bottom:120px;transform:translate(-50%);padding:12px 24px;background:#071b29e8;border-radius:20px;opacity:0;transition:.2s;z-index:110;white-space:nowrap}.toast.visible{opacity:1}[hidden]{display:none!important}
