:root{--primary-blue:#0284c7;--sky-blue:#38bdf8;--gold-border:#fbbf24;--dark-purple:#1e1b4b;--purple-btn:#7c3aed;--purple-btn-hover:#6d28d9;--green-btn:#22c55e;--green-btn-hover:#16a34a;--text-dark:#1e293b}*{box-sizing:border-box;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;margin:0;padding:0;font-family:Fredoka,Outfit,Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}html,body{background-color:#38bdf8;justify-content:center;align-items:center;width:100vw;height:100dvh;display:flex;position:fixed;overflow:hidden}#game-container{background:#38bdf8;width:100vw;height:100dvh;margin:0;padding:0;position:relative;overflow:hidden}#canvas3d{touch-action:none;width:100vw;height:100dvh;display:block;position:absolute;top:0;left:0}.start-screen-overlay{-webkit-backdrop-filter:blur(5px);z-index:200;pointer-events:auto;background:#0f172a73;flex-direction:column;justify-content:center;align-items:center;padding:20px;transition:opacity .35s,transform .35s cubic-bezier(.175,.885,.32,1.275);display:flex;position:absolute;inset:0}.start-screen-overlay.hidden{opacity:0;pointer-events:none;display:none;transform:scale(1.08)}.start-card-container{text-align:center;flex-direction:column;align-items:center;gap:clamp(14px,3vh,22px);animation:3s ease-in-out infinite alternate float-start-card;display:flex}@keyframes float-start-card{0%{transform:translateY(0)}to{transform:translateY(-8px)}}.game-logo-container{flex-direction:column;align-items:center;display:flex}.logo-water-droplet{filter:drop-shadow(0 6px 12px #0284c799);font-size:clamp(38px,10vw,52px);animation:2s ease-in-out infinite bounce-drop}@keyframes bounce-drop{0%,to{transform:translateY(0)scale(1)}50%{transform:translateY(-10px)scale(1.1)}}.game-main-title{color:#fff;letter-spacing:1.5px;text-transform:uppercase;background:linear-gradient(#fff 0%,#bae6fd 60%,#38bdf8 100%);-webkit-text-fill-color:transparent;filter:drop-shadow(0 6px #0284c7)drop-shadow(0 12px 20px #00000080);-webkit-background-clip:text;margin:0;font-size:clamp(36px,10vw,56px);font-weight:900}.logo-sub-tagline{color:#facc15;letter-spacing:2px;text-shadow:0 2px 6px #0009,0 1px #78350f;margin-top:-2px;font-size:clamp(11px,3vw,14px);font-weight:900}.start-level-badge{color:#fff;letter-spacing:1px;background:linear-gradient(#0284c7 0%,#0369a1 100%);border:2.5px solid #facc15;border-radius:20px;align-items:center;gap:8px;padding:6px 20px;font-size:clamp(14px,3.8vw,17px);font-weight:900;display:flex;box-shadow:0 6px 14px #0006,inset 0 2px 2px #fff6,0 3px #0369a1}.start-level-badge .star-icon{color:#facc15;font-size:14px}.btn-giant-play{color:#fff;letter-spacing:2px;cursor:pointer;background:linear-gradient(#4ade80 0%,#22c55e 65%,#16a34a 100%);border:3.5px solid #fff;border-radius:40px;justify-content:center;align-items:center;gap:12px;padding:clamp(12px,2.8vh,16px) clamp(38px,11vw,56px);font-size:clamp(24px,6.5vw,32px);font-weight:900;transition:transform .15s,box-shadow .15s;animation:1.8s ease-in-out infinite pulse-giant-play;display:flex;box-shadow:0 10px 25px #16a34a80,inset 0 3px 4px #ffffffb3,0 6px #15803d}.btn-giant-play:hover{transform:scale(1.05);box-shadow:0 14px 30px #16a34aa6,inset 0 3px 4px #fffc,0 6px #15803d}.btn-giant-play:active{transform:translateY(4px)scale(.97);box-shadow:0 4px 10px #16a34a66,inset 0 2px 2px #ffffff80,0 2px #15803d}.play-triangle{filter:drop-shadow(0 2px 4px #0000004d);font-size:clamp(20px,5.5vw,26px)}@keyframes pulse-giant-play{0%,to{transform:scale(1)}50%{transform:scale(1.04)}}#hud-overlay{pointer-events:none;z-index:50;flex-direction:column;display:flex;position:absolute;inset:0}.top-bar{pointer-events:auto;z-index:70;justify-content:space-between;align-items:flex-start;width:100%;max-width:680px;margin:0 auto;padding:clamp(8px,2vh,14px) clamp(10px,2.8vw,16px);display:flex}.coin-badge{background:linear-gradient(#fff 0%,#fffbeb 60%,#fef3c7 100%);border:2.5px solid #f59e0b;border-radius:28px;align-items:center;gap:6px;padding:3px 6px 3px 4px;transition:transform .1s;display:flex;box-shadow:0 5px 12px #00000059,inset 0 2px 2px #ffffffe6,0 3px #b45309}.coin-icon{color:#fff;background:linear-gradient(#fde047 0%,#f59e0b 70%,#d97706 100%);border:2px solid #fef08a;border-radius:50%;justify-content:center;align-items:center;width:clamp(24px,6vw,28px);height:clamp(24px,6vw,28px);font-size:clamp(12px,3.2vw,14px);font-weight:900;display:flex;box-shadow:0 2px 4px #00000040,inset 0 1px 1px #fffc}.coin-count{color:#78350f;letter-spacing:.3px;padding:0 2px;font-size:clamp(15px,4vw,18px);font-weight:900}.coin-add-btn{color:#fff;cursor:pointer;background:linear-gradient(#4ade80 0%,#22c55e 70%,#16a34a 100%);border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;width:clamp(22px,5.5vw,26px);height:clamp(22px,5.5vw,26px);font-size:clamp(14px,3.8vw,16px);font-weight:900;transition:transform .1s;display:flex;box-shadow:0 2px 5px #16a34a66,inset 0 1px 1px #fff9,0 2px #15803d}.coin-add-btn:active{transform:scale(.9)}.level-info-center{flex-direction:column;align-items:center;gap:3px;display:flex}.level-title-3d{color:#fff;letter-spacing:1px;text-shadow:0 3px 6px #0f172acc,0 0 10px #38bdf8e6;font-size:clamp(18px,4.8vw,22px);font-weight:900}.star-progress-capsule{background:#0f172a73;border:2px solid #38bdf8;border-radius:12px;justify-content:space-around;align-items:center;width:clamp(90px,24vw,115px);height:16px;padding:0 4px;display:flex;position:relative;overflow:hidden;box-shadow:inset 0 2px 4px #00000080,0 2px 4px #00000040}.star-progress-fill{z-index:1;background:linear-gradient(90deg,#38bdf8 0%,#60a5fa 100%);border-radius:10px;height:100%;transition:width .3s;position:absolute;top:0;left:0}.star-pill-icon{color:#64748b;z-index:2;text-shadow:0 1px 2px #00000080;font-size:11px;transition:color .2s,transform .2s}.star-pill-icon.active{color:#facc15;filter:drop-shadow(0 0 4px #facc15);transform:scale(1.15)}.time-capsule{background:linear-gradient(#0284c7 0%,#0369a1 100%);border:2px solid #7dd3fc;border-radius:20px;align-items:center;gap:5px;padding:2px clamp(10px,2.8vw,14px);display:flex;box-shadow:0 4px 8px #0000004d,inset 0 1px 2px #fff6,0 3px #0284c7}.clock-icon{font-size:12px}.time-label{color:#bae6fd;letter-spacing:.5px;font-size:11px;font-weight:800}.time-val{color:#fff;letter-spacing:.5px;font-size:13px;font-weight:900}.time-capsule.danger{background:linear-gradient(#ef4444 0%,#b91c1c 100%);border-color:#fca5a5;animation:.5s infinite alternate pulse-danger;box-shadow:0 4px 8px #0000004d,inset 0 1px 2px #fff6,0 3px #991b1b}.top-right-stack{z-index:80;flex-direction:column;align-items:center;gap:clamp(6px,1.2vh,8px);display:flex;position:relative}.settings-sub-menu{opacity:0;pointer-events:none;flex-direction:column;align-items:center;gap:clamp(6px,1.2vh,8px);max-height:0;transition:opacity .25s cubic-bezier(.175,.885,.32,1.275),transform .25s cubic-bezier(.175,.885,.32,1.275),max-height .3s;display:flex;overflow:hidden;transform:translateY(-12px)scale(.8)}.settings-sub-menu.open{opacity:1;pointer-events:auto;max-height:220px;overflow:visible;transform:translateY(0)scale(1)}.side-circle-btn{cursor:pointer;color:#fff;border:2.5px solid #fff;border-radius:50%;justify-content:center;align-items:center;width:clamp(36px,9vw,42px);height:clamp(36px,9vw,42px);transition:transform .2s cubic-bezier(.175,.885,.32,1.275);display:flex}.side-circle-btn.blue{background:linear-gradient(#38bdf8 0%,#0284c7 70%,#0369a1 100%);box-shadow:0 4px 10px #0284c766,inset 0 2px 2px #fff9,0 3px #0284c7}.side-circle-btn.blue.active{transform:rotate(90deg)}.side-circle-btn.green{background:linear-gradient(#4ade80 0%,#22c55e 70%,#16a34a 100%);box-shadow:0 4px 10px #16a34a66,inset 0 2px 2px #fff9,0 3px #15803d}.side-circle-btn.green.off{background:linear-gradient(#94a3b8 0%,#64748b 100%);box-shadow:0 4px 10px #0000004d,inset 0 2px 2px #ffffff4d,0 3px #475569}.side-circle-btn.pink{background:linear-gradient(#f472b6 0%,#ec4899 70%,#db2777 100%);box-shadow:0 4px 10px #ec489966,inset 0 2px 2px #fff9,0 3px #be185d}.side-circle-btn.pink.off{background:linear-gradient(#94a3b8 0%,#64748b 100%);box-shadow:0 4px 10px #0000004d,inset 0 2px 2px #ffffff4d,0 3px #475569}.side-circle-btn.orange{background:linear-gradient(#fb923c 0%,#f97316 70%,#ea580c 100%);box-shadow:0 4px 10px #f9731666,inset 0 2px 2px #fff9,0 3px #c2410c}.balloons-card{text-align:center;pointer-events:auto;background:linear-gradient(#0284c7 0%,#0369a1 100%);border:clamp(2px,.6vw,3px) solid #facc15;border-radius:14px;width:clamp(62px,15vw,74px);position:absolute;top:clamp(62px,9.8vh,78px);left:max(14px,50% - 320px);overflow:visible;box-shadow:0 6px 14px #0006,inset 0 2px 4px #ffffff59,0 4px #0369a1}.balloons-header{color:#bae6fd;text-transform:capitalize;background:#0f172a73;border-bottom:1px solid #facc1566;border-radius:11px 11px 0 0;padding:3px 0;font-size:clamp(9px,2.4vw,11px);font-weight:800}.balloons-count{color:#fff;text-shadow:0 2px 4px #0006;padding:2px 0 0;font-size:clamp(22px,5.8vw,28px);font-weight:900}.balloon-water-icon{justify-content:center;align-items:center;padding-bottom:7px;display:flex}.balloon-water-icon svg{filter:drop-shadow(0 2px 4px #0000004d)}.tutorial-pill-bottom{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:none;z-index:60;background:#0f172abf;border:1.5px solid #38bdf880;border-radius:20px;align-items:center;gap:6px;padding:4px 12px 4px 6px;animation:2s ease-in-out infinite pulse-tutorial;display:flex;position:absolute;bottom:clamp(10px,1.8vh,16px);left:clamp(10px,2.5vw,14px);box-shadow:0 4px 12px #00000059}@keyframes pulse-tutorial{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.tap-hand-icon{background:#38bdf859;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;display:flex}.tutorial-text{color:#fff;letter-spacing:.3px;text-shadow:0 1px 3px #00000080;font-size:clamp(11px,2.8vw,13px);font-weight:800}.side-circle-btn svg{width:clamp(18px,4.5vw,22px);height:clamp(18px,4.5vw,22px)}.side-circle-btn:active{transform:scale(.9)}.side-circle-btn.green{background:linear-gradient(#4ade80 0%,#16a34a 100%)}.side-circle-btn.green.off{background:linear-gradient(#94a3b8 0%,#475569 100%)}.side-circle-btn.red{background:linear-gradient(#f87171 0%,#dc2626 100%)}.big-center-alert{color:#fff;text-align:center;text-shadow:0 4px 12px #000c,0 0 16px #ef444499;opacity:0;pointer-events:none;z-index:120;width:90%;font-size:clamp(24px,7vw,34px);font-weight:900;transition:opacity .3s,transform .3s cubic-bezier(.175,.885,.32,1.275);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(.6)}.big-center-alert.visible{opacity:1;transform:translate(-50%,-50%)scale(1)}.modal-backdrop{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:200;opacity:0;pointer-events:none;background:#0f172ad9;justify-content:center;align-items:center;padding:16px;transition:opacity .3s;display:flex;position:absolute;inset:0}.modal-backdrop.active{opacity:1;pointer-events:auto}.sunburst-rays{pointer-events:none;z-index:-1;background:repeating-conic-gradient(#facc152e 0deg 15deg,#0000 15deg 30deg);border-radius:50%;width:500px;height:500px;animation:20s linear infinite rotate-sunburst;position:absolute}@keyframes rotate-sunburst{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.game-modal-3d{text-align:center;background:linear-gradient(#fff 0%,#eff6ff 70%,#dbeafe 100%);border:4px solid #0284c7;border-radius:28px;width:90%;max-width:350px;padding:clamp(24px,5vh,32px) clamp(16px,4vw,22px) clamp(18px,4vh,24px);transition:transform .4s cubic-bezier(.34,1.56,.64,1);position:relative;transform:scale(.6)translateY(40px);box-shadow:0 20px 40px #0009,inset 0 3px #fff,0 8px #0369a1}.modal-backdrop.active .game-modal-3d{transform:scale(1)translateY(0)}.modal-header-ribbon{color:#78350f;letter-spacing:.5px;text-shadow:0 1px 2px #fffc;white-space:nowrap;background:linear-gradient(#facc15 0%,#f59e0b 70%,#d97706 100%);border:3px solid #fef08a;border-radius:30px;padding:6px 28px;font-size:clamp(17px,4.5vw,21px);font-weight:900;position:absolute;top:-24px;left:50%;transform:translate(-50%);box-shadow:0 6px 14px #00000059,inset 0 2px 2px #fff9,0 4px #b45309}.modal-header-ribbon.defeat{color:#fff;text-shadow:0 2px 4px #0006;background:linear-gradient(#f87171 0%,#ef4444 70%,#dc2626 100%);border-color:#fecaca;box-shadow:0 6px 14px #00000059,inset 0 2px 2px #fff6,0 4px #991b1b}.modal-stars-3d{justify-content:center;align-items:center;gap:12px;height:60px;margin:16px 0 18px;display:flex}.star-3d{color:#cbd5e1;filter:drop-shadow(0 2px 4px #00000040);font-size:clamp(34px,9vw,44px);transition:transform .2s;display:inline-block}.star-3d.slam{animation:.45s cubic-bezier(.175,.885,.32,1.275) forwards star-slam-impact}@keyframes star-slam-impact{0%{opacity:0;transform:scale(3)rotate(-25deg)}60%{opacity:1;transform:scale(.8)rotate(10deg)}85%{transform:scale(1.25)rotate(-5deg)}to{color:#facc15;filter:drop-shadow(0 4px 10px #facc15e6);transform:scale(1.1)rotate(0)}}.modal-stat-board{background:#e0f2fe;border:2px solid #bae6fd;border-radius:16px;justify-content:space-around;margin-bottom:20px;padding:10px 14px;display:flex;box-shadow:inset 0 2px 4px #0000000f}.modal-stat-column{flex-direction:column;align-items:center;display:flex}.stat-label-3d{color:#0369a1;text-transform:uppercase;letter-spacing:.5px;font-size:11px;font-weight:800}.stat-val-3d{color:#0f172a;margin-top:2px;font-size:clamp(17px,4.8vw,21px);font-weight:900}.btn-3d-group{flex-direction:column;gap:10px;display:flex}.btn-3d-green{color:#fff;cursor:pointer;background:linear-gradient(#4ade80 0%,#22c55e 70%,#16a34a 100%);border:2px solid #86efac;border-radius:16px;padding:clamp(10px,2.2vh,13px) 0;font-size:clamp(16px,4.2vw,18px);font-weight:900;transition:transform 80ms,box-shadow 80ms;box-shadow:0 6px 14px #16a34a66,inset 0 2px 2px #fff9,0 5px #15803d}.btn-3d-green:active{transform:translateY(4px);box-shadow:0 2px 6px #16a34a66,inset 0 2px 2px #fff9,0 1px #15803d}.btn-3d-blue{color:#fff;cursor:pointer;background:linear-gradient(#38bdf8 0%,#0284c7 70%,#0369a1 100%);border:2px solid #bae6fd;border-radius:16px;padding:clamp(9px,2vh,11px) 0;font-size:clamp(14px,3.8vw,16px);font-weight:800;transition:transform 80ms,box-shadow 80ms;box-shadow:0 4px 10px #0284c759,inset 0 2px 2px #fff9,0 4px #0284c7}.btn-3d-blue:active{transform:translateY(3px);box-shadow:0 2px 4px #0284c759,inset 0 2px 2px #fff9,0 1px #0284c7}.btn-3d-gold{color:#78350f;cursor:pointer;background:linear-gradient(#fde047 0%,#eab308 70%,#ca8a04 100%);border:2.5px solid #fef08a;border-radius:16px;padding:clamp(10px,2.2vh,13px) 14px;font-size:clamp(15px,4vw,17px);font-weight:900;transition:transform 80ms,box-shadow 80ms;box-shadow:0 6px 14px #eab30873,inset 0 2px 2px #fffc,0 5px #a16207}.btn-3d-gold:active{transform:translateY(4px);box-shadow:0 2px 6px #eab30873,inset 0 2px 2px #fffc,0 1px #a16207}.buy-btn-content{justify-content:space-between;align-items:center;width:100%;display:flex}.price-pill{color:#fef08a;background:#78350f;border-radius:20px;padding:3px 10px;font-size:14px;font-weight:900;box-shadow:inset 0 1px 2px #0006}.shake-error{animation:.4s ease-in-out shake}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-8px)}40%,80%{transform:translate(8px)}}.duck-intro-content{text-align:center;flex-direction:column;align-items:center;padding:24px 16px;display:flex}.duck-intro-subtitle{color:#facc15;text-shadow:0 3px 6px #00000080;margin-bottom:4px;font-size:clamp(22px,6vw,28px);font-weight:900}.duck-intro-title{color:#78350f;text-shadow:0 2px 4px #fffc;margin-bottom:16px;font-size:clamp(28px,8vw,36px);font-weight:900}.duck-avatar-glow{background:radial-gradient(circle,#facc1566 0%,#facc1500 70%);border-radius:50%;justify-content:center;align-items:center;width:clamp(100px,26vw,140px);height:clamp(100px,26vw,140px);margin-bottom:18px;animation:2s infinite pulse-glow;display:flex}@keyframes pulse-glow{0%,to{transform:scale(1)}50%{filter:drop-shadow(0 0 20px #facc15);transform:scale(1.1)}}.duck-avatar-svg{filter:drop-shadow(0 8px 16px #0006);width:clamp(80px,20vw,110px);height:clamp(80px,20vw,110px)}.duck-intro-desc{color:#fff;text-shadow:0 2px 6px #000000b3;margin-bottom:22px;font-size:clamp(16px,4.5vw,20px);font-weight:800}.duck-continue-btn{color:#fef08a;text-shadow:0 2px 6px #0009;cursor:pointer;background:0 0;border:none;font-size:clamp(18px,5vw,22px);font-weight:900;animation:1.5s infinite bounce-text}@keyframes bounce-text{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}#tutorial-container,.tutorial-pill-bottom{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:none;z-index:60;background:#0f172ac7;border:2px solid #38bdf899;border-radius:24px;flex-direction:row;align-items:center;gap:8px;width:auto;max-width:250px;padding:5px 14px 5px 8px;animation:2s ease-in-out infinite pulse-tutorial;display:flex;position:absolute;inset:auto auto clamp(18px,3vh,26px) max(14px,50% - 320px);transform:none;box-shadow:0 6px 16px #00000073}.tap-hand-icon{background:#38bdf866;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:26px;height:26px;display:flex}.tutorial-text{color:#fff;letter-spacing:.3px;text-shadow:0 1px 3px #0009;white-space:nowrap;font-size:clamp(11px,2.8vw,13px);font-weight:800}.combo-popup{color:#78350f;pointer-events:none;z-index:80;background:linear-gradient(#facc15 0%,#f59e0b 100%);border:3px solid #fff;border-radius:30px;padding:6px 18px;font-size:clamp(18px,5vw,22px);font-weight:900;animation:1s ease-out forwards combo-pop;position:absolute;top:45%;left:50%;transform:translate(-50%,-50%)scale(.5);box-shadow:0 10px 25px #f59e0b99}@keyframes combo-pop{0%{opacity:0;transform:translate(-50%,-50%)scale(.3)}30%{opacity:1;transform:translate(-50%,-65%)scale(1.15)}70%{opacity:1;transform:translate(-50%,-75%)scale(1)}to{opacity:0;transform:translate(-50%,-95%)scale(.8)}}