:root{color-scheme:dark;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{margin:0;min-height:100vh;overflow:hidden}.scene{position:relative;width:100vw;height:100vh;overflow:hidden;transition:background 2s ease;cursor:crosshair}.celestial-body{position:absolute;border-radius:50%;transition:all 2s ease;pointer-events:none;z-index:1}.star{position:absolute;border-radius:50%;background:#fff;animation:twinkle 2s ease-in-out infinite alternate;pointer-events:none;z-index:1}@keyframes twinkle{0%{opacity:.2;transform:scale(.8)}to{opacity:1;transform:scale(1.2)}}.clouds{position:absolute;top:0;left:0;width:100%;height:40%;pointer-events:none;z-index:2}.cloud{position:absolute;background:#ffffffb3;border-radius:50px;filter:blur(8px)}.cloud:before,.cloud:after{content:"";position:absolute;background:inherit;border-radius:50%}.cloud-1{width:180px;height:50px;top:12%;animation:cloud-drift 35s linear infinite}.cloud-1:before{width:80px;height:80px;top:-35px;left:30px}.cloud-1:after{width:60px;height:60px;top:-25px;left:90px}.cloud-2{width:140px;height:40px;top:20%;animation:cloud-drift 45s linear infinite;animation-delay:-15s;opacity:.5}.cloud-2:before{width:60px;height:60px;top:-28px;left:25px}.cloud-2:after{width:50px;height:50px;top:-20px;left:70px}.cloud-3{width:200px;height:55px;top:8%;animation:cloud-drift 55s linear infinite;animation-delay:-25s;opacity:.6}.cloud-3:before{width:90px;height:90px;top:-40px;left:40px}.cloud-3:after{width:70px;height:70px;top:-30px;left:110px}@keyframes cloud-drift{0%{left:-20%}to{left:110%}}.time-night .cloud{background:#1e1e3c80}.stormy .cloud{background:#3c3c50cc;filter:blur(4px)}.light-ray{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:3;transition:background .3s ease}.water{position:absolute;bottom:0;left:0;width:100%;height:60%;z-index:5;overflow:hidden;transition:background 2s ease}@keyframes wave-slide{0%{transform:translate(0)}to{transform:translate(-50%)}}.bubble{position:absolute;bottom:-20px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#fff6,#ffffff0d);border:1px solid rgba(255,255,255,.15);animation:bubble-rise linear infinite;pointer-events:none}@keyframes bubble-rise{0%{bottom:-20px;transform:translate(0);opacity:.8}50%{transform:translate(var(--wobble, 20px))}to{bottom:105%;transform:translate(calc(var(--wobble, 20px) * -1));opacity:0}}.fish{position:absolute;left:-10%;animation:fish-swim linear infinite;pointer-events:none;z-index:10}@keyframes fish-swim{0%{left:-10%}to{left:110%}}.dolphin{position:absolute;bottom:55%;animation:dolphin-jump 12s ease-in-out infinite;pointer-events:none;z-index:15}@keyframes dolphin-jump{0%{left:-15%;transform:translateY(0) rotate(0)}15%{transform:translateY(-80px) rotate(-20deg)}30%{transform:translateY(-120px) rotate(-10deg)}45%{transform:translateY(-80px) rotate(10deg)}60%{transform:translateY(0) rotate(20deg)}61%{transform:translateY(0) rotate(0)}to{left:110%;transform:translateY(0) rotate(0)}}.jellyfish{position:absolute;animation:jelly-float 10s ease-in-out infinite;pointer-events:none;z-index:10}.jelly-bell{width:40px;height:35px;background:radial-gradient(ellipse at center,#c896ff99,#9664dc33);border-radius:50% 50% 30% 30%;animation:jelly-pulse 2s ease-in-out infinite}.jelly-tentacles{display:flex;justify-content:space-around;padding:0 5px}.tentacle{width:2px;height:40px;background:linear-gradient(to bottom,rgba(180,140,255,.5),transparent);border-radius:0 0 2px 2px;animation:tentacle-wave 1.5s ease-in-out infinite alternate}@keyframes jelly-float{0%,to{transform:translateY(0) translate(0)}25%{transform:translateY(-30px) translate(15px)}50%{transform:translateY(-10px) translate(-10px)}75%{transform:translateY(-40px) translate(5px)}}@keyframes jelly-pulse{0%,to{transform:scaleX(1) scaleY(1)}50%{transform:scaleX(1.15) scaleY(.85)}}@keyframes tentacle-wave{0%{transform:rotate(-10deg) translate(-2px)}to{transform:rotate(10deg) translate(2px)}}.seaweed{position:absolute;display:flex;flex-direction:column-reverse;z-index:8;pointer-events:none}.seaweed-segment{width:12px;border-radius:6px;animation:seaweed-sway 3s ease-in-out infinite alternate;transform-origin:bottom center}@keyframes seaweed-sway{0%{transform:rotate(-8deg)}to{transform:rotate(8deg)}}.coral{position:absolute;bottom:0;z-index:7;pointer-events:none}.coral-1{left:22%;width:60px;height:50px;background:radial-gradient(ellipse at bottom,#e74c3c,#c0392b);border-radius:50% 50% 10% 10%;opacity:.7}.coral-2{left:45%;width:45px;height:65px;background:radial-gradient(ellipse at bottom,#e67e22,#d35400);border-radius:40% 40% 5% 5%;opacity:.6}.coral-3{left:68%;width:55px;height:45px;background:radial-gradient(ellipse at bottom,#9b59b6,#8e44ad);border-radius:50% 50% 10% 10%;opacity:.6}.ocean-floor{position:absolute;bottom:0;left:0;width:100%;height:30px;background:linear-gradient(to top,#1a1209,#2a1f0f);z-index:6}.storm-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:50;pointer-events:none}.lightning{position:absolute;top:0;right:0;bottom:0;left:0;animation:lightning-flash 4s infinite}@keyframes lightning-flash{0%,to{background:transparent}92%{background:transparent}93%{background:#fff9}94%{background:transparent}96%{background:#ffffff4d}97%{background:transparent}}.stormy .water{animation:storm-chop .5s ease-in-out infinite alternate}@keyframes storm-chop{0%{transform:translateY(0) skew(0)}to{transform:translateY(-5px) skew(.5deg)}}.stormy .fish{animation-duration:5s!important}.stormy .bubble{animation-duration:2s!important}.controls{position:fixed;top:1.5rem;right:1.5rem;display:flex;gap:.5rem;z-index:100}.btn{background:#00000059;color:#fff;border:1px solid rgba(255,255,255,.2);padding:.5rem 1rem;border-radius:8px;font-size:.85rem;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .2s;font-family:inherit}.btn:hover{background:#ffffff26;border-color:#fff6}.btn.active{background:#e9456066;border-color:#e9456099}.poem{position:fixed;bottom:2rem;left:50%;transform:translate(-50%);text-align:center;z-index:100;pointer-events:none}.poem p{margin:.2rem 0;font-size:.9rem;color:#ffffffb3;font-style:italic;text-shadow:0 1px 8px rgba(0,0,0,.5);animation:poem-fade 4s ease-in-out infinite alternate}.poem p:nth-child(2){animation-delay:.5s}.poem p:nth-child(3){animation-delay:1s}.poem p:nth-child(4){animation-delay:1.5s}@keyframes poem-fade{0%{opacity:.4}to{opacity:.9}}
