*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;background:#7ec8ff;font-family:Segoe UI,Nunito,system-ui,-apple-system,sans-serif;user-select:none;-webkit-user-select:none}#app{position:fixed;inset:0}#game{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}#game:active{cursor:grabbing}#vignette{position:absolute;inset:0;pointer-events:none;z-index:5;background:radial-gradient(ellipse at center,transparent 60%,rgba(10,30,60,.24) 100%)}#touch-controls{position:absolute;inset:0;z-index:15;pointer-events:none}#stick-zone{position:absolute;left:0;bottom:0;width:48%;height:55%;pointer-events:auto;touch-action:none}#stick-base{position:absolute;left:30px;bottom:30px;width:128px;height:128px;border-radius:50%;background:#ffffff29;border:2px solid rgba(255,255,255,.4);display:flex;align-items:center;justify-content:center}#stick-knob{width:56px;height:56px;border-radius:50%;background:#ffffffc7;box-shadow:0 3px 10px #0a285a59}.touch-btn{position:absolute;pointer-events:auto;touch-action:none;border-radius:50%;border:2px solid rgba(255,255,255,.55);font-family:inherit;font-weight:900;letter-spacing:.5px;color:#fff;background:#2f7bff8c;box-shadow:0 4px 14px #0a285a4d}#btn-jump{right:26px;bottom:30px;width:94px;height:94px;font-size:15px}#btn-punch{right:132px;bottom:86px;width:70px;height:70px;font-size:11px;background:#ff5a5a8c}#btn-spin{right:34px;bottom:138px;width:66px;height:66px;font-size:11px;background:#965aff8c}.touch-btn:active{transform:scale(.92)}.hidden{display:none!important}#hud{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:flex-start;padding:16px 18px;pointer-events:none;z-index:10}.hud-right{display:flex;gap:10px;align-items:center;pointer-events:auto}.pill{display:inline-flex;align-items:center;gap:8px;background:#ffffffeb;border-radius:999px;padding:8px 16px;box-shadow:0 4px 14px #143c7840,inset 0 -3px #a0bedc59;font-weight:800;font-size:20px;color:#1d3557;letter-spacing:.5px}.pill .ico{width:26px;height:26px;display:block}#hearts{gap:4px;padding:9px 14px}#hearts svg{width:24px;height:24px;display:block;transition:transform .2s}#hearts svg path{fill:#ff5a6e;stroke:#d63a52;stroke-width:1}#hearts svg.lost path{fill:#c9d6e4;stroke:#a9bccf}#hearts svg.pop{animation:heart-pop .35s ease}@keyframes heart-pop{0%{transform:scale(1)}40%{transform:scale(1.45)}to{transform:scale(1)}}.icon-btn{pointer-events:auto;cursor:pointer;border:none;font-size:19px;padding:8px 13px;transition:transform .12s}.icon-btn:hover{transform:scale(1.1)}.icon-btn:active{transform:scale(.94)}#toast{position:absolute;top:17%;left:50%;transform:translate(-50%) scale(0);z-index:20;font-size:clamp(24px,4.5vw,44px);font-weight:900;letter-spacing:1px;color:#fff;text-shadow:0 3px 0 #2f7bff,0 6px 18px rgba(20,60,120,.5);pointer-events:none;white-space:nowrap}#toast.show{animation:toast-pop 1.8s ease forwards}@keyframes toast-pop{0%{transform:translate(-50%) scale(0)}12%{transform:translate(-50%) scale(1.15)}20%{transform:translate(-50%) scale(1)}80%{transform:translate(-50%) scale(1);opacity:1}to{transform:translate(-50%) scale(.9);opacity:0}}#hint{position:absolute;bottom:14px;left:50%;transform:translate(-50%);z-index:10;background:#0f285073;color:#eaf6ff;border-radius:999px;padding:8px 20px;font-size:13.5px;backdrop-filter:blur(4px);pointer-events:none;white-space:nowrap}#hint b{color:#ffd23f}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:30;background:radial-gradient(ellipse at 50% 35%,#8cc8ff2e,#0f2d5f80);backdrop-filter:blur(3px);animation:fade-in .35s ease}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.title-card{display:flex;flex-direction:column;align-items:center;gap:18px;padding:32px 40px;max-width:min(92vw,560px);text-align:center}.logo{font-size:clamp(48px,10vw,92px);font-weight:900;line-height:.95;letter-spacing:3px;color:#fff;text-shadow:0 4px 0 #2f7bff,0 8px 0 #1d5fd6,0 12px 26px rgba(10,40,90,.55);transform:rotate(-2.5deg);animation:logo-bob 2.6s ease-in-out infinite}.logo span{display:block;color:#7fe8ff;text-shadow:0 4px 0 #1d8fbf,0 8px 0 #14719c,0 12px 26px rgba(10,40,90,.55);font-size:.62em;letter-spacing:10px}@keyframes logo-bob{0%,to{transform:rotate(-2.5deg) translateY(0)}50%{transform:rotate(-1.5deg) translateY(-9px)}}.tagline{color:#eaf6ff;font-weight:700;font-size:17px;letter-spacing:2.5px;text-transform:uppercase;text-shadow:0 2px 8px rgba(10,40,90,.6)}.small-logo{font-size:clamp(38px,7vw,64px);font-weight:900;letter-spacing:3px;color:#fff;text-shadow:0 4px 0 #2f7bff,0 9px 22px rgba(10,40,90,.55)}.small-logo.clear{color:#ffd23f;text-shadow:0 4px 0 #e08900,0 9px 22px rgba(10,40,90,.55)}.big-btn{border:none;cursor:pointer;background:linear-gradient(180deg,#47c2ff,#2f7bff);color:#fff;font-family:inherit;font-size:24px;font-weight:900;letter-spacing:2px;padding:16px 46px;border-radius:999px;box-shadow:0 6px #1d5fd6,0 12px 26px #0a285a73;transition:transform .12s,box-shadow .12s;animation:btn-breathe 1.8s ease-in-out infinite}@keyframes btn-breathe{0%,to{transform:scale(1)}50%{transform:scale(1.045)}}.big-btn:hover{transform:scale(1.08);animation:none}.big-btn:active{transform:scale(.96) translateY(4px);box-shadow:0 2px #1d5fd6,0 6px 14px #0a285a66}.ghost-btn{border:none;cursor:pointer;background:transparent;color:#dbeeff;font-family:inherit;font-size:15px;font-weight:700;letter-spacing:1px;text-decoration:underline;opacity:.85}.ghost-btn:hover{opacity:1}.controls-card{display:flex;flex-direction:column;gap:7px;background:#ffffffe6;border-radius:20px;padding:16px 24px;box-shadow:0 8px 24px #0a285a59;color:#274060;font-size:14.5px;font-weight:600;text-align:left}kbd{display:inline-block;background:#eef4fb;border:1px solid #c4d5e8;border-bottom-width:3px;border-radius:7px;padding:1px 8px;font-family:inherit;font-weight:800;font-size:12.5px;color:#1d3557}.collect-hint{color:#eaf6ff;font-size:14px;font-weight:600;text-shadow:0 2px 8px rgba(10,40,90,.7)}.win-stats{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}.pill.stat.big{flex-direction:column;gap:2px;padding:12px 22px;font-size:24px}.pill.stat.big .lbl{font-size:11px;text-transform:uppercase;letter-spacing:1.5px;color:#6b83a0}@media(max-width:640px){#hint{display:none!important}.pill{font-size:16px;padding:6px 12px}#hearts svg{width:22px;height:22px}.controls-card{font-size:12.5px;padding:12px 16px}}