:root{--navy:#073757;--ink:#145478;--mint:#a6fff0;--cream:#fffef1;--orange:#ffba83}*{box-sizing:border-box}html,body{min-height:100%}body{margin:0;color:#fff;background:radial-gradient(ellipse at 50% 0%,#2279a5,#073659 68%,#08243f);font-family:'Trebuchet MS',Arial,sans-serif}.site-shell{width:min(1150px,calc(100% - 28px));margin:0 auto}.topbar{min-height:112px;display:flex;justify-content:space-between;align-items:center;gap:20px}.brand{display:flex;align-items:center;gap:14px}.brand-mark{font-size:60px;filter:drop-shadow(0 7px #053452)}.brand-mini{color:#a9e9f6;font:800 10px 'Courier New',monospace;letter-spacing:2px}.brand h1{font:900 clamp(34px,5vw,58px) Impact,'Arial Black',sans-serif;margin:0;letter-spacing:1.5px;text-shadow:3px 5px #083d66}.brand h1 span{color:#9cffe4}.back-link{color:white;text-decoration:none;border:1px solid #77e3e5a1;border-radius:30px;background:#0a5779;padding:11px 15px;font-size:12px;font-weight:800}.back-link:hover{background:#1883a4}.game{background:#073657;border:3px solid #83d8ea;border-radius:26px;box-shadow:0 0 0 6px #114c6a,0 25px 65px #04152f9c;overflow:hidden}.status{background:#0b4266;padding:13px 19px;display:flex;justify-content:space-between;align-items:center;gap:7px}.stat{display:flex;flex-direction:column;gap:4px}.stat small{font:700 10px 'Courier New',monospace;letter-spacing:1.3px;color:#9fd5e2}.stat strong{font:900 clamp(13px,1.7vw,21px) 'Trebuchet MS',sans-serif;white-space:nowrap}.stat .hearts{color:#ffa6ad;letter-spacing:5px}.sound{border:1px solid #88def1;background:#246e91;color:white;border-radius:10px;padding:9px;cursor:pointer;font-weight:900}.timer-track{height:9px;background:#072a47}.timer-track>div{height:100%;width:100%;background:linear-gradient(90deg,#ffe49e,#a4f7cb,#7bf4ec);transition:width .08s linear}.ocean{height:650px;position:relative;overflow:hidden;isolation:isolate;background:linear-gradient(180deg,#52c7e5 0%,#0b90c0 38%,#07547f 100%);transition:background .7s}.ocean-1{background:linear-gradient(180deg,#2e9dbb,#087a9a 42%,#084b6b)}.ocean-2{background:linear-gradient(180deg,#3d9cae,#12697f 40%,#0a3e64)}.ocean-3{background:linear-gradient(180deg,#17799c,#076a94 42%,#062f5f)}.ocean-4{background:linear-gradient(180deg,#215486,#103d80 40%,#111d54)}.sunbeams{pointer-events:none;position:absolute;inset:0;background:repeating-conic-gradient(from 174deg at 48% -15%,#eaffff19 0deg 8deg,transparent 9deg 24deg);animation:shimmer 7s ease-in-out infinite alternate}.silt{position:absolute;inset:0;background-image:radial-gradient(circle,#ddfaffc0 2px,transparent 3px),radial-gradient(circle,#b5efff98 1.6px,transparent 2.5px);background-size:130px 117px,91px 103px;background-position:12px 10px,45px 69px;opacity:.35;animation:drift 17s linear infinite;pointer-events:none}.sea-floor{position:absolute;bottom:0;width:100%;height:145px;pointer-events:none}.mound{position:absolute;bottom:-85px;width:70%;height:160px;background:#e6bc83;border-radius:50% 50% 0 0;filter:drop-shadow(0 -8px #f9e2a660)}.mound.one{left:-13%;transform:rotate(-5deg)}.mound.two{right:-19%;background:#dbad7a;transform:rotate(8deg)}.reef{position:absolute;bottom:10px;width:75px;height:130px;border-radius:70% 40% 20% 10%;border:15px solid #ff8d92;border-bottom:0;transform:rotate(22deg)}.reef:before,.reef:after{content:'';position:absolute;width:24px;height:70px;border-radius:30px;border-left:14px solid #ff8d92;left:-32px;top:22px;transform:rotate(-34deg)}.reef:after{left:39px;top:41px;transform:rotate(36deg);height:50px}.reef-a{left:10%}.reef-b{right:12%;height:99px;transform:rotate(-18deg);border-color:#f8ad60}.reef-b:before,.reef-b:after{border-color:#f8ad60}.weed{position:absolute;bottom:0;height:112px;width:14px;border-radius:50% 50% 0 0;background:#3fd5a5;transform:rotate(-12deg);box-shadow:19px -8px 0 -1px #53d8af,37px 0 0 -3px #2ac195}.weed-a{left:25%}.weed-b{right:27%;height:153px}.weed-c{right:4%;height:93px}.scene-title{position:absolute;left:24px;top:17px;display:flex;flex-direction:column;gap:4px;text-shadow:1px 3px #07527a;z-index:2}.scene-title span{font:900 24px Impact,'Arial Black',sans-serif;letter-spacing:1px}.scene-title small{font-size:12px;font-weight:700;color:#d2ffff}.sea-friend{position:absolute;z-index:2;filter:drop-shadow(0 8px 2px #06395b50);animation:float 4s ease-in-out infinite}.friend-left{bottom:75px;left:5%;font-size:75px}.friend-right{bottom:100px;right:6%;font-size:80px;animation-delay:-1.9s}.question-shell{position:absolute;z-index:5;left:50%;top:82px;translate:-50% 0;width:min(590px,78%);padding:22px 29px 18px;border:5px solid white;border-radius:35px;background:linear-gradient(160deg,#fffef7,#dffeff);box-shadow:0 12px #04739e,0 20px 35px #004d7175;color:#125777;text-align:center}.question-shell:after{content:'';position:absolute;bottom:-20px;left:18%;width:30px;height:30px;transform:rotate(45deg);background:#e3feff;border-right:5px solid white;border-bottom:5px solid white}.question-top{display:flex;justify-content:space-between;font:900 13px 'Courier New',monospace;color:#2087a4}.question{font:900 clamp(35px,5vw,61px) 'Trebuchet MS',Arial,sans-serif;letter-spacing:-1px;color:#13537b;margin:7px 0 2px}.question-hint{font-weight:700;font-size:13px;color:#5390a3}.answer-field{position:absolute;z-index:6;inset:0;pointer-events:none}.bubble{position:absolute;display:grid;place-items:center;isolation:isolate;pointer-events:auto;width:155px;height:155px;border:5px solid #e9ffffd9;border-radius:50%;background:radial-gradient(circle at 29% 18%,#fff 0 4%,#e1ffff88 5% 14%,#b9fbff9e 31%,#61d9ecd1 64%,#2796d2d6 100%);box-shadow:inset -12px -12px 17px #1685a455,0 12px 23px #06406b82,0 0 21px #bdffff91;cursor:pointer;color:#094d75;font:900 38px 'Trebuchet MS',sans-serif;transition:filter .15s,scale .15s;animation:bob 4s ease-in-out infinite}.bubble:hover:not(:disabled),.bubble:focus-visible{scale:1.09;filter:brightness(1.15);outline:none}.bubble:disabled{cursor:default}.bubble.correct{background:radial-gradient(circle at 30% 20%,#fff,#b6ffb5,#36d88c);border-color:#edffb7}.bubble.wrong{background:radial-gradient(circle at 30% 20%,#fff,#ffc3b5,#f77783);border-color:#ffe5e4}.bubble-key{position:absolute;top:15px;left:24px;font:900 13px 'Courier New',monospace;color:#226d95;border:2px solid #efffff9c;border-radius:50%;width:25px;height:25px;display:grid;place-items:center}.bubble-one{left:13%;top:340px;animation-delay:-.5s}.bubble-two{left:37%;top:280px;animation-delay:-2s}.bubble-three{right:13%;top:360px;animation-delay:-1.1s}.bubble-four{left:42%;top:459px;animation-delay:-3s}.feedback{position:absolute;z-index:9;bottom:9px;left:20%;right:20%;min-height:38px;text-align:center;font-weight:900;opacity:0;transition:opacity .15s;text-shadow:0 2px 4px #124e69}.feedback.show{opacity:1}.feedback.good{color:#eaffb9}.feedback.bad{color:#ffe7d8}.bottom-bar{padding:14px 19px;background:#104c70;display:flex;justify-content:space-between;font:800 11px 'Courier New',monospace;color:#b5eaf3;letter-spacing:1px}footer{color:#a5d5e5;text-align:center;font-size:12px;padding:23px}footer a{color:#b1fff0}.overlay{position:absolute;inset:0;z-index:30;display:none;align-items:center;justify-content:center;padding:20px;background:#032f53a6;backdrop-filter:blur(5px)}.overlay.active{display:flex}.overlay-card{width:min(610px,100%);padding:34px 34px 26px;background:linear-gradient(160deg,#fffdf0,#d2fff8);color:#185876;border:6px solid #fff;border-radius:34px;box-shadow:0 15px #087b9d,0 24px 65px #012949a8;text-align:center}.overlay-kicker{font:900 13px 'Courier New',monospace;color:#128c9b;letter-spacing:2px}.overlay h2{margin:13px 0;font:900 clamp(35px,5vw,58px) Impact,'Arial Black',sans-serif;color:#0a6187;line-height:1.05}.overlay h2 em{font-style:normal;color:#f280a0}.overlay p{font-size:17px;line-height:1.5;font-weight:700}.play{background:#ffad74;color:#753952;border:0;cursor:pointer;font:900 21px Impact,'Arial Black',sans-serif;padding:15px 40px;border-radius:25px;box-shadow:0 7px #d67862;margin:12px auto 18px}.play:hover{background:#ffca82;transform:translateY(-2px)}.overlay-card>small{display:block;color:#548699;font-weight:700;font-size:11px}.bonus-celebration{position:absolute;inset:0;z-index:20;pointer-events:none;opacity:0;display:grid;place-items:center}.bonus-celebration.show{animation:bonus-pop 3s ease-in-out both}.bonus-card{text-align:center;transform:rotate(-4deg);width:min(660px,91%);border:6px solid #fff5b4;border-radius:40px;background:linear-gradient(140deg,#ffd77c,#ff9a9b 60%,#fbc4ff);padding:36px 12px;box-shadow:0 14px #c66a89,0 20px 60px #03436d;color:#884c72}.bonus-title{font:900 clamp(24px,4vw,40px) Impact,'Arial Black',sans-serif}.bonus-card strong{display:block;color:#fff;font:900 105px Impact,'Arial Black',sans-serif;text-shadow:3px 5px #c56f8e}.bonus-card small{font:900 17px 'Courier New',monospace;letter-spacing:1px}.bonus-spark{position:absolute;font-size:80px;animation:float 2s ease-in-out infinite}.bonus-spark.a{left:5%;top:25%}.bonus-spark.b{right:8%;top:13%}.bonus-spark.c{right:10%;bottom:12%}.bonus-spark.d{left:9%;bottom:14%}@keyframes bonus-pop{0%{opacity:0;transform:scale(.5)}18%,79%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.13)}}@keyframes bob{50%{transform:translateY(-16px)}}@keyframes float{50%{transform:translateY(-18px) rotate(4deg)}}@keyframes drift{to{background-position:12px 120px,45px 172px}}@keyframes shimmer{to{opacity:.42;transform:translateX(20px)}}
@media(max-width:760px){.topbar{min-height:92px}.brand-mark{font-size:41px}.back-link{max-width:145px;font-size:10px}.status{flex-wrap:wrap;justify-content:space-around}.stat small{font-size:8px}.stat strong{font-size:13px}.ocean{height:710px}.question-shell{width:88%;top:91px}.bubble{height:137px;width:137px}.bubble-one{left:8%;top:350px}.bubble-two{left:auto;right:8%;top:320px}.bubble-three{left:8%;right:auto;top:511px}.bubble-four{left:auto;right:8%;top:502px}.friend-left{font-size:54px;bottom:42px}.friend-right{font-size:55px;bottom:54px}.scene-title span{font-size:19px}}
@media(max-width:460px){.site-shell{width:100%}.topbar{padding:10px;gap:5px}.brand{gap:6px}.brand-mark{font-size:32px}.brand-mini{font-size:7px;letter-spacing:0}.brand h1{font-size:29px}.back-link{max-width:118px;padding:7px;font-size:9px}.game{border:0;border-radius:0}.status{padding:11px 4px;gap:12px}.stat strong{font-size:12px}.stat small{font-size:7px}.sound{padding:7px;font-size:11px}.question-shell{width:93%;padding:20px 12px}.question{font-size:45px}.question-hint{font-size:11px}.bubble{width:125px;height:125px;font-size:35px}.bubble-one{left:5%}.bubble-two{right:5%}.bubble-three{left:5%}.bubble-four{right:5%}.bubble-key{top:10px;left:17px}.scene-title{left:15px}.scene-title span{font-size:17px}.scene-title small{font-size:10px}.overlay-card{padding:24px 17px}.overlay p{font-size:14px}.bonus-card{padding:25px 6px}.bonus-card strong{font-size:76px}.bonus-card small{font-size:10px}.bonus-spark{font-size:49px}.bottom-bar{font-size:9px}.bottom-bar span:last-child{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.bonus-celebration.show{opacity:1}}