*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;background:#8fd3ff;font-family:Nunito,"Baloo 2",Segoe UI Rounded,Comic Sans MS,system-ui,-apple-system,sans-serif;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:none;overscroll-behavior:none}#app{position:fixed;inset:0}#game-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}#hud{position:absolute;inset:0;pointer-events:none;overflow:hidden}#boot-screen{position:absolute;inset:0;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;background:linear-gradient(180deg,#9fdcff,#cdeeff 60%,#eafaff);transition:opacity .35s ease}#boot-screen.hidden{opacity:0;pointer-events:none}.boot-logo{width:min(78vw,430px);height:auto;filter:drop-shadow(0 10px 24px rgba(30,90,140,.35));animation:boot-bounce 1.1s ease-in-out infinite alternate}.boot-loading{font-size:14px;font-weight:700;color:#5a86a8;letter-spacing:2px}@keyframes boot-bounce{0%{transform:translateY(0) rotate(-6deg)}to{transform:translateY(-18px) rotate(6deg)}}.hud-score-wrap{position:absolute;top:max(14px,env(safe-area-inset-top));left:0;right:0;display:flex;justify-content:center;pointer-events:none}.hud-score{font-size:clamp(34px,7vw,52px);font-weight:900;color:#fff;text-shadow:0 3px 0 rgba(70,120,160,.55),0 6px 16px rgba(20,60,100,.35);letter-spacing:1px}.hud-distance{position:absolute;top:max(64px,calc(env(safe-area-inset-top) + 50px));left:0;right:0;text-align:center;font-size:15px;font-weight:800;color:#eaf7ff;text-shadow:0 2px 4px rgba(20,60,100,.45);letter-spacing:2px}.hud-combo{position:absolute;top:max(92px,calc(env(safe-area-inset-top) + 78px));left:0;right:0;text-align:center;font-size:clamp(20px,4vw,26px);font-weight:900;letter-spacing:2px;color:#ffe066;text-shadow:0 2px 0 #b8860b,0 4px 12px rgba(255,190,40,.6);transition:opacity .2s ease}.hud-combo.gone{opacity:0}.hud-combo.pop{animation:combo-pop .35s cubic-bezier(.2,1.8,.4,1)}@keyframes combo-pop{0%{transform:scale(.5) rotate(-4deg)}60%{transform:scale(1.25) rotate(2deg)}to{transform:scale(1) rotate(0)}}.hud-coins{position:absolute;top:max(16px,env(safe-area-inset-top));right:max(14px,env(safe-area-inset-right));padding:7px 14px;border-radius:999px;background:#ffffffd1;box-shadow:0 3px 10px #143c6440;font-size:17px;font-weight:900;color:#8a5a00;letter-spacing:1px}.hud-mute{position:absolute;top:max(14px,env(safe-area-inset-top));left:max(14px,env(safe-area-inset-left));width:44px;height:44px;border:none;border-radius:14px;background:#ffffffd1;box-shadow:0 3px 10px #143c6440;font-size:20px;line-height:1;cursor:pointer;pointer-events:auto;z-index:25;transition:transform .08s ease}.hud-mute:active{transform:scale(.92)}.hud-pause{position:absolute;top:calc(max(14px,env(safe-area-inset-top)) + 54px);left:max(14px,env(safe-area-inset-left));width:44px;height:44px;border:none;border-radius:14px;background:#ffffffd1;box-shadow:0 3px 10px #143c6440;font-size:17px;line-height:1;cursor:pointer;pointer-events:auto;z-index:25;transition:transform .08s ease}.hud-pause:active{transform:scale(.92)}.hud-wind{position:absolute;left:0;right:0;bottom:max(120px,calc(env(safe-area-inset-bottom) + 104px));text-align:center;font-size:clamp(16px,3vw,20px);font-weight:900;letter-spacing:2px;color:#fff;text-shadow:0 2px 0 rgba(70,120,160,.65),0 4px 10px rgba(20,60,100,.4);animation:hint-pulse 1.4s ease-in-out infinite}.hud-wind.gone{display:none}.wind-arrow{display:inline-block}.wind-arrow.down{color:#ffd23e}.hud-hint{position:absolute;left:0;right:0;bottom:max(56px,calc(env(safe-area-inset-bottom) + 40px));text-align:center;font-size:clamp(17px,3.4vw,22px);font-weight:900;color:#fff;text-shadow:0 2px 0 rgba(70,120,160,.6),0 4px 12px rgba(20,60,100,.4);letter-spacing:1.5px;animation:hint-pulse 1.4s ease-in-out infinite}.hud-hint.gone{display:none}@keyframes hint-pulse{0%,to{transform:translateY(0);opacity:.92}50%{transform:translateY(-8px);opacity:1}}.score-popup{position:absolute;transform:translate(-50%,-50%);font-weight:900;font-size:26px;color:#fff;text-shadow:0 2px 0 rgba(70,120,160,.65),0 4px 10px rgba(20,60,100,.4);white-space:nowrap;animation:popup-rise .95s cubic-bezier(.2,.7,.3,1) forwards}.score-popup.perfect{color:#ffe066;font-size:34px;text-shadow:0 3px 0 #b8860b,0 6px 18px rgba(255,190,40,.75)}.score-popup.great{color:#9fe8ff;font-size:30px;text-shadow:0 3px 0 #1a6a9e,0 6px 18px rgba(120,220,255,.7)}.score-popup.coin{color:#ffd23e;font-size:22px;text-shadow:0 2px 0 #8a5a00,0 4px 12px rgba(255,200,40,.6)}@keyframes popup-rise{0%{opacity:0;transform:translate(-50%,-30%) scale(.5)}18%{opacity:1;transform:translate(-50%,-70%) scale(1.15)}32%{transform:translate(-50%,-80%) scale(1)}to{opacity:0;transform:translate(-50%,-210%) scale(.95)}}.overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:radial-gradient(ellipse at center,#143c6440,#0f2d509e);backdrop-filter:blur(3px);pointer-events:auto;z-index:20}.overlay.hidden{display:none}.menu-logo{width:min(86vw,470px);height:auto;margin-bottom:8px;filter:drop-shadow(0 12px 26px rgba(20,60,110,.45));animation:logo-float 2.6s ease-in-out infinite;-webkit-user-drag:none}@keyframes logo-float{0%,to{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-10px) rotate(1deg)}}.game-logo{font-size:clamp(38px,9vw,64px);font-weight:900;letter-spacing:6px;color:#ffb02e;text-shadow:0 4px 0 #c96f00,0 8px 24px rgba(255,170,40,.5)}.game-logo .fish-icon{display:block;text-align:center;font-size:1.5em;margin-bottom:2px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.25))}.stat-label{margin-top:14px;font-size:14px;font-weight:800;letter-spacing:3px;color:#cfe9ff}.stat-value{font-size:clamp(30px,6vw,44px);font-weight:900;color:#fff;text-shadow:0 3px 0 rgba(40,90,130,.6)}.stat-row{display:flex;gap:34px;margin-top:8px}.new-best{margin-top:6px;padding:5px 16px;border-radius:999px;background:linear-gradient(90deg,#ffd54d,#ffab2e);color:#7a4b00;font-weight:900;font-size:15px;letter-spacing:2px;box-shadow:0 4px 14px #ffaa288c;animation:best-pop .5s cubic-bezier(.2,1.6,.4,1) both}@keyframes best-pop{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.over-news{margin-top:8px;padding:5px 14px;border-radius:999px;background:#e8f6ff;color:#0d6da8;font-weight:900;font-size:13px;letter-spacing:1px;box-shadow:0 3px 10px #1e82c840}.btn-primary{margin-top:26px;min-width:min(320px,74vw);padding:18px 42px;border:none;border-radius:999px;font-family:inherit;font-size:clamp(22px,4.5vw,28px);font-weight:900;letter-spacing:3px;color:#fff;cursor:pointer;background:linear-gradient(180deg,#ffc94d,#ff9d2e 55%,#f97f1f);box-shadow:0 6px #c9641a,0 12px 28px #f97f1f73;text-shadow:0 2px 0 rgba(150,70,0,.5);transition:transform .08s ease,box-shadow .08s ease,filter .15s ease;animation:btn-breath 1.6s ease-in-out infinite}.btn-primary:active{transform:translateY(4px) scale(.98);box-shadow:0 2px #c9641a,0 6px 14px #f97f1f66}.btn-primary:hover{filter:brightness(1.06)}@keyframes btn-breath{0%,to{transform:scale(1)}50%{transform:scale(1.04)}}.menu-row{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap;justify-content:center}.btn-daily{display:flex;flex-direction:column;align-items:center;gap:2px;padding:9px 22px;border:none;border-radius:999px;font-family:inherit;cursor:pointer;color:#fff;background:linear-gradient(180deg,#ffd54d,#f5a623);box-shadow:0 4px #b97a10,0 8px 18px #dc961473;text-shadow:0 1px 0 rgba(140,85,0,.55);transition:transform .08s ease,box-shadow .08s ease}.btn-daily:active{transform:translateY(3px) scale(.97);box-shadow:0 1px #b97a10,0 4px 10px #dc961459}.btn-daily-top{font-size:clamp(14px,3vw,17px);font-weight:900;letter-spacing:1px}.btn-daily-sub{font-size:11px;font-weight:800;letter-spacing:1.5px;opacity:.92}.btn-gear{width:46px;padding:12px 0;border:none;border-radius:999px;font-family:inherit;font-size:18px;line-height:1;cursor:pointer;color:#fff;background:linear-gradient(180deg,#8fb6c9,#5d8aa3);box-shadow:0 4px #40606f,0 8px 18px #3c647d66;text-shadow:0 1px 0 rgba(30,60,80,.5);transition:transform .08s ease,box-shadow .08s ease}.btn-gear:active{transform:translateY(3px) scale(.95);box-shadow:0 1px #40606f,0 4px 10px #3c647d59}.btn-secondary{padding:12px 18px;border:none;border-radius:999px;font-family:inherit;font-size:clamp(14px,3vw,17px);font-weight:900;letter-spacing:1px;color:#fff;cursor:pointer;background:linear-gradient(180deg,#6fc9ff,#3f9de8);box-shadow:0 4px #2a6fa8,0 8px 18px #286eaa66;text-shadow:0 1px 0 rgba(20,60,110,.5);transition:transform .08s ease,box-shadow .08s ease}.btn-secondary:active{transform:translateY(3px) scale(.97);box-shadow:0 1px #2a6fa8,0 4px 10px #286eaa59}.btn-secondary{position:relative}.btn-revive{background:linear-gradient(180deg,#8f7bff,#5b48d6);box-shadow:0 4px #3c2f9e,0 8px 18px #503cc873;text-shadow:0 1px 0 rgba(30,20,90,.55)}.btn-revive:active{box-shadow:0 1px #3c2f9e,0 4px 10px #503cc866}.btn-badge{position:absolute;top:-7px;right:-7px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:#ff3b5c;color:#fff;font-size:12px;font-weight:900;line-height:20px;text-align:center;box-shadow:0 2px 6px #b4143280;animation:badge-pop .4s cubic-bezier(.2,1.6,.4,1) both}@keyframes badge-pop{0%{transform:scale(0)}to{transform:scale(1)}}.panel{position:absolute;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;background:#0c26428c;backdrop-filter:blur(3px);pointer-events:auto;animation:panel-in .22s ease}.panel.hidden{display:none}@keyframes panel-in{0%{opacity:0;transform:scale(1.04)}to{opacity:1;transform:scale(1)}}.panel-card{width:min(92vw,560px);max-height:min(78vh,640px);display:flex;flex-direction:column;border-radius:22px;background:linear-gradient(180deg,#eaf8ff,#d5efff);box-shadow:0 18px 50px #0a285073,inset 0 2px #ffffffb3;overflow:hidden}.panel-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px 10px}.panel-title{font-size:clamp(20px,4.5vw,26px);font-weight:900;letter-spacing:2px;color:#14639e}.panel-close{width:40px;height:40px;border:none;border-radius:12px;background:#14639e1f;color:#14639e;font-size:18px;font-weight:900;cursor:pointer;transition:transform .08s ease,background .15s ease}.panel-close:hover{background:#14639e33}.panel-close:active{transform:scale(.9)}.panel-body{padding:4px 16px 18px;overflow-y:auto;-webkit-overflow-scrolling:touch}.wallet{text-align:right;font-weight:900;font-size:17px;color:#8a5a00;padding:2px 4px 10px}.shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:12px}.shop-card{display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 8px 10px;border-radius:16px;background:#ffffffbf;box-shadow:0 3px 10px #143c6424}.shop-card.equipped{outline:3px solid #ffb02e;background:#fff7e6}.shop-card.locked{opacity:.72;background:#d2e0eea6}.shop-section-title{font-size:13px;font-weight:900;letter-spacing:2px;color:#23506e;padding:14px 4px 8px}.skin-swatch.mystery{display:flex;align-items:center;justify-content:center;font-size:20px;background:linear-gradient(160deg,#9fb4c6,#5d7488)}.skin-swatch{width:52px;height:52px;border-radius:50%;box-shadow:inset -4px -6px 10px #1e3c5a40,0 3px 8px #143c6440}.skin-name{font-size:13px;font-weight:800;color:#23506e;text-align:center}.btn-skin{border:none;border-radius:999px;padding:7px 14px;font-family:inherit;font-size:13px;font-weight:900;letter-spacing:1px;cursor:pointer;color:#fff;background:linear-gradient(180deg,#ffc94d,#f97f1f);box-shadow:0 3px #c9641a;transition:transform .08s ease}.btn-skin:disabled{cursor:default;filter:grayscale(.35);opacity:.75}.btn-skin:not(:disabled):active{transform:translateY(2px);box-shadow:0 1px #c9641a}.list{display:flex;flex-direction:column;gap:10px}.list-row{padding:12px 14px;border-radius:14px;background:#ffffffc7;box-shadow:0 2px 8px #143c641f}.list-row.done{background:#fff6df}.row-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:8px}.row-label{font-size:15px;font-weight:800;color:#1c4a68}.row-reward{font-size:14px;font-weight:900;color:#b07a00;white-space:nowrap}.bar{height:10px;border-radius:999px;background:#14639e24;overflow:hidden}.bar-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,#ffd54d,#ff9d2e);transition:width .3s ease}.list-row.ach{display:flex;gap:12px;align-items:center}.list-row.ach .row-label{margin-bottom:2px}.ach-icon{font-size:22px;filter:grayscale(1);opacity:.55}.list-row.ach.done .ach-icon{filter:none;opacity:1}.ach-text{flex:1}.ach-desc{font-size:12.5px;font-weight:700;color:#5a86a8}.mode-badge{padding:5px 16px;border-radius:999px;background:linear-gradient(90deg,#ffd54d,#f5a623);color:#7a4b00;font-weight:900;font-size:14px;letter-spacing:2px;box-shadow:0 4px 14px #dc961480}.settings-row{display:flex;justify-content:space-between;align-items:center;gap:12px}.settings-row .row-label{margin-bottom:0}.btn-toggle{min-width:74px;border:none;border-radius:999px;padding:8px 0;font-family:inherit;font-size:13px;font-weight:900;letter-spacing:1px;cursor:pointer;color:#fff;background:linear-gradient(180deg,#7ed957,#3fa34d);box-shadow:0 3px #2c7536;transition:transform .08s ease}.btn-toggle.off{background:linear-gradient(180deg,#a9bfd0,#7492ab);box-shadow:0 3px #54708a}.btn-toggle:active{transform:translateY(2px);box-shadow:0 1px #00000040}.settings-hint{text-align:center;font-size:11.5px;font-weight:800;letter-spacing:2px;color:#8fb3cc;padding-top:14px}.toast{position:absolute;top:calc(max(64px,env(safe-area-inset-top) + 50px) + 44px);left:50%;transform:translate(-50%);z-index:45;padding:10px 22px;border-radius:999px;background:linear-gradient(180deg,#ffe08a,#ffb02e);color:#6b4300;font-size:clamp(13px,3vw,16px);font-weight:900;letter-spacing:1px;white-space:nowrap;box-shadow:0 6px 18px #c8821473;pointer-events:none;animation:toast-in .3s cubic-bezier(.2,1.6,.4,1) both}.toast.out{opacity:0;transition:opacity .32s ease}@keyframes toast-in{0%{opacity:0;transform:translate(-50%) translateY(-16px) scale(.85)}to{opacity:1;transform:translate(-50%) translateY(0) scale(1)}}.debug-panel{position:absolute;top:max(10px,env(safe-area-inset-top));left:10px;padding:8px 10px;border-radius:10px;background:#0a1928b8;color:#9fe8ff;font-family:ui-monospace,Cascadia Code,Menlo,Consolas,monospace;font-size:11px;line-height:1.55;white-space:pre;pointer-events:none;z-index:30}.debug-panel.hidden{display:none}.tut-card{display:flex;flex-direction:column;align-items:center;gap:12px;padding:20px clamp(18px,5vw,34px) 22px;border-radius:26px;background:linear-gradient(180deg,#fff,#eef7ff);box-shadow:0 18px 44px #0a285073,inset 0 -3px #8cbee659}.tut-card .game-logo{font-size:clamp(26px,6.5vw,38px);letter-spacing:3px;text-shadow:0 3px 0 #c96f00}.tut-stage{position:relative;width:min(64vw,240px);height:min(58vw,210px);overflow:hidden}.tut-fish{position:absolute;left:50%;bottom:14px;width:44%;transform:translate(-50%);filter:drop-shadow(0 8px 16px rgba(180,120,0,.35));animation:tut-fish 2.8s ease-in-out infinite;pointer-events:none}.tut-hand{position:absolute;left:50%;bottom:0;width:34%;transform:translate(-50%);transform-origin:50% 85%;filter:drop-shadow(0 6px 12px rgba(0,0,0,.28));animation:tut-hand 2.8s ease-in-out infinite;pointer-events:none}@keyframes tut-hand{0%,4%{opacity:0;transform:translate(-50%) translateY(0) scale(1)}9%{opacity:1;transform:translate(-50%) translateY(0) scale(.88)}46%{opacity:1;transform:translate(-50%) translateY(-76px) scale(.92)}55%{opacity:1;transform:translate(-50%) translateY(-80px) scale(.92)}64%,to{opacity:0;transform:translate(-50%) translateY(-60px) scale(1)}}@keyframes tut-fish{0%,6%{opacity:0;transform:translate(-50%) translateY(0) rotate(0)}13%{opacity:1;transform:translate(-50%) translateY(-3px) rotate(-2deg)}24%{transform:translate(-50%) translateY(2px) rotate(2deg)}36%{transform:translate(-50%) translateY(-3px) rotate(-2deg)}48%{opacity:1;transform:translate(-50%) translateY(1px) rotate(1deg)}58%{transform:translate(-50%) translateY(-26px) rotate(-7deg)}76%{opacity:1;transform:translate(-50%) translateY(-92px) rotate(-18deg)}84%{transform:translate(-50%) translateY(-104px) rotate(-21deg)}92%,to{opacity:0;transform:translate(-50%) translateY(-112px) rotate(-23deg)}}.tut-steps{display:flex;flex-direction:column;align-items:center;gap:4px}.tut-step{font-size:clamp(13px,3.6vw,17px);font-weight:900;letter-spacing:1px;color:#23557c}.hud-level{position:absolute;top:max(64px,calc(env(safe-area-inset-top) + 50px));left:0;right:0;display:flex;justify-content:center;align-items:center;gap:8px;padding:3px 0;color:#eaf6ff;font-size:clamp(12px,3vw,15px);font-weight:900;letter-spacing:1.5px;text-shadow:0 2px 4px rgba(20,60,100,.45);z-index:12;pointer-events:none}.hud-level.gone{display:none}.star-pip{font-size:1.05em;color:#ffffff47;transition:color .25s ease,text-shadow .25s ease,transform .25s ease}.star-pip.lit{color:#ffd23e;text-shadow:0 0 8px rgba(255,210,62,.9);transform:scale(1.15)}.lvdone-card{display:flex;flex-direction:column;align-items:center;gap:10px;padding:26px clamp(20px,6vw,44px) 24px;border-radius:28px;background:linear-gradient(180deg,#10345ceb,#0a2240f2);box-shadow:0 22px 60px #04142a99,inset 0 -4px #78bef02e}.lvdone-title{font-size:clamp(26px,7vw,44px);letter-spacing:3px}.lvdone-stars{display:flex;gap:clamp(10px,4vw,26px);margin:6px 0 2px}.lvdone-star{font-size:clamp(38px,11vw,66px);line-height:1;color:#ffffff29;text-shadow:none}.lvdone-star.earned{color:#ffd23e;text-shadow:0 0 14px rgba(255,210,62,.85),0 4px 0 #b57e00}@keyframes star-pop{0%{opacity:0;transform:scale(2.1) rotate(-25deg)}60%{opacity:1;transform:scale(.85) rotate(6deg)}to{opacity:1;transform:scale(1) rotate(0)}}.lvdone-star.pop-in{animation:star-pop .55s cubic-bezier(.2,1.4,.4,1) both}.lvdone-score{font-size:clamp(30px,8vw,48px)}.lvdone-stats{font-size:clamp(11px,3vw,14px);font-weight:800;letter-spacing:1px;color:#bfe6ff}.lvdone-coins{font-size:clamp(13px,3.4vw,17px);font-weight:900;letter-spacing:1px;color:#ffe08a}.map-world-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin:14px 0 8px;padding-bottom:6px;border-bottom:1px solid rgba(140,200,255,.18)}.map-world-head.locked{opacity:.5}.map-world-name{font-size:14px;font-weight:900;letter-spacing:2px;color:#ffd88a}.map-world-stars{font-size:13px;font-weight:800;color:#ffd23e;white-space:nowrap}.map-locked-note{margin:-2px 0 10px;font-size:11px;letter-spacing:1px;color:#dcf0ff73}.map-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.map-level{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px;border-radius:12px;border:1px solid rgba(140,200,255,.2);background:#1e508259;cursor:pointer}.map-level .lv-num{font-size:17px;font-weight:900;color:#eaf6ff}.map-level .lv-stars{font-size:10px;letter-spacing:2px;color:#ffffff4d}.map-level.done{background:#326e5059;border-color:#8ce6aa59}.map-level.done .lv-stars{color:#ffd23e}.map-level.next{box-shadow:0 0 0 2px #ffd23eb3;animation:map-next-pulse 1.4s ease-in-out infinite}@keyframes map-next-pulse{0%,to{box-shadow:0 0 0 2px #ffd23ebf}50%{box-shadow:0 0 0 4px #ffd23e59}}.map-level.sealed{opacity:.35;cursor:default}
