*{box-sizing:border-box}html,body{margin:0;height:100%;background:#0e1a2c;overflow:hidden;font-family:system-ui,Segoe UI,Arial,sans-serif}#app{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);overflow:hidden;background:#0b5f8f}#app canvas{display:block;width:100%;height:100%;touch-action:none}.f{font-family:Lilita One,system-ui,sans-serif;letter-spacing:.5px}@keyframes pulse{50%{transform:scale(1.07)}}#hud{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}#logo{position:absolute;left:12px;top:10px;line-height:.86;transform:rotate(-4deg)}#logo .a{font-size:34px;color:#55ecd2;-webkit-text-stroke:6px #1f3f78;paint-order:stroke fill;text-shadow:0 3px 0 #1f3f78}#logo .b{font-size:21px;color:#ffcf3a;-webkit-text-stroke:5px #7a3f12;paint-order:stroke fill;text-shadow:0 3px 0 #7a3f12;margin-left:10px}#shots{position:absolute;right:12px;top:16px;background:#fff;color:#4b3596;border-radius:16px;padding:3px 14px 3px 8px;font-size:22px;box-shadow:0 3px #0003;display:flex;gap:6px;align-items:center;transition:transform .12s}#shots.pop{transform:scale(1.2)}#tapTxt{position:absolute;left:0;right:0;bottom:30%;text-align:center;font-size:34px;color:#fff;-webkit-text-stroke:7px #3b2a80;paint-order:stroke fill;text-shadow:0 4px 0 #3b2a80;animation:pulse 1s ease-in-out infinite;transition:opacity .3s}#play{position:absolute;left:12px;bottom:14px;pointer-events:auto;border:0;border-radius:14px;padding:10px 18px 12px;font-size:19px;color:#fff;background:linear-gradient(#7be36c,#3fb63a);box-shadow:0 5px #24862a,0 8px 16px #0004;-webkit-text-stroke:4px #1f6b26;paint-order:stroke fill;cursor:pointer;animation:pulse 1.2s ease-in-out infinite}#hud.ended #play{display:none}#end{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:90px 0 130px;opacity:0;transition:opacity .4s}#end.on{opacity:1}#end .rib{font-size:44px;color:#ffd84a;-webkit-text-stroke:8px #3b2a80;paint-order:stroke fill;text-shadow:0 5px 0 #3b2a80;background:linear-gradient(#9b7cff,#6c49d6);padding:6px 30px 10px;border-radius:18px;box-shadow:0 6px #3b2a80;transform:scale(0);transition:transform .5s cubic-bezier(.34,1.56,.64,1)}#end.on .rib{transform:scale(1)}#end .big{pointer-events:auto;border:0;border-radius:20px;padding:14px 40px 18px;font-size:30px;color:#fff;background:linear-gradient(#7be36c,#3fb63a);box-shadow:0 7px #24862a,0 12px 24px #0005;-webkit-text-stroke:5px #1f6b26;paint-order:stroke fill;animation:pulse 1s ease-in-out infinite}#end:not(.on) .big{pointer-events:none}#end .cta{display:flex;flex-direction:column;align-items:center;gap:12px}#end .claim{font-size:19px;color:#fff;-webkit-text-stroke:5px #3b2a80;paint-order:stroke fill;text-align:center;padding:0 20px}#mute{position:absolute;right:12px;bottom:16px;pointer-events:auto;width:44px;height:44px;border:0;border-radius:50%;background:#ffffffd9;font-size:22px;box-shadow:0 3px #0003;cursor:pointer}
