.weather-animation-container{pointer-events:none;width:100%;height:100%;transition:background-color .5s;position:absolute;top:0;left:0;overflow:hidden}.weather-animation-container.night-mode{background:linear-gradient(135deg,rgba(15,23,42,.7) 0%,rgba(30,41,59,.5) 100%)}.sun-container{position:absolute;top:20%;right:15%}.sun{background:radial-gradient(circle,gold 0%,#ffed4e 50%,transparent 70%);border-radius:50%;width:80px;height:80px;animation:4s ease-in-out infinite pulse;box-shadow:0 0 40px gold,0 0 60px gold}.sun-rays{background:radial-gradient(circle,transparent 40%,rgba(255,215,0,.1) 41%,transparent 42%);border-radius:50%;width:120px;height:120px;animation:20s linear infinite rotate;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.9;transform:scale(1.05)}}@keyframes rotate{0%{transform:translate(-50%,-50%)rotate(0)}to{transform:translate(-50%,-50%)rotate(360deg)}}.clouds-container{width:100%;height:100%;position:absolute;top:0;left:0}.cloud{opacity:.7;background:rgba(255,255,255,.8);border-radius:100px;position:absolute}.cloud:before,.cloud:after{content:"";background:rgba(255,255,255,.8);border-radius:50%;position:absolute}.cloud-1{width:100px;height:40px;animation:20s ease-in-out infinite float;top:20%}.cloud-1:before{width:50px;height:50px;top:-25px;left:10px}.cloud-1:after{width:60px;height:60px;top:-30px;right:10px}.cloud-2{width:120px;height:45px;animation:25s ease-in-out -5s infinite float;top:35%}.cloud-2:before{width:55px;height:55px;top:-28px;left:15px}.cloud-2:after{width:65px;height:65px;top:-33px;right:15px}.cloud-3{width:90px;height:35px;animation:22s ease-in-out -10s infinite float;top:50%}.cloud-3:before{width:45px;height:45px;top:-23px;left:12px}.cloud-3:after{width:50px;height:50px;top:-25px;right:12px}.cloud-dark,.cloud-dark:before,.cloud-dark:after{background:rgba(100,100,120,.8)}@keyframes float{0%,to{left:-150px}50%{left:calc(100% + 150px)}}.rain-container{width:100%;height:100%;position:absolute;top:0;left:0}.raindrop{background:linear-gradient(transparent,rgba(174,194,224,.6));width:2px;height:15px;animation:linear infinite fall;position:absolute;top:-10px}@keyframes fall{to{top:100%}}.snow-container{width:100%;height:100%;position:absolute;top:0;left:0}.snowflake{color:rgba(255,255,255,.8);text-shadow:0 0 5px rgba(255,255,255,.8);animation:linear infinite snowfall;position:absolute;top:-20px}@keyframes snowfall{0%{top:-20px;transform:translate(0)rotate(0)}to{top:100%;transform:translate(100px)rotate(360deg)}}.lightning-container{width:100%;height:100%;position:absolute;top:0;left:0}.lightning{background:rgba(255,255,255,0);width:2px;height:100%;animation:8s ease-in-out infinite lightning;position:absolute;top:0;left:50%}@keyframes lightning{0%,90%,92%,94%,to{opacity:0}91%,93%{opacity:1;background:rgba(255,255,255,.9);box-shadow:0 0 20px 10px rgba(255,255,255,.8)}}.moon-container{position:absolute;top:15%;right:15%}.moon{background:radial-gradient(circle at 30% 30%,#f8f8f8 0%,#e0e0e0 50%,silver 100%);border-radius:50%;width:70px;height:70px;animation:4s ease-in-out infinite moonGlow;position:relative;box-shadow:0 0 30px rgba(248,248,248,.6),0 0 60px rgba(248,248,248,.3)}.moon:before{content:"";background:rgba(180,180,180,.4);border-radius:50%;width:15px;height:15px;position:absolute;top:20%;left:25%}.moon:after{content:"";background:rgba(180,180,180,.3);border-radius:50%;width:10px;height:10px;position:absolute;bottom:30%;right:25%}@keyframes moonGlow{0%,to{box-shadow:0 0 30px rgba(248,248,248,.6),0 0 60px rgba(248,248,248,.3)}50%{box-shadow:0 0 40px rgba(248,248,248,.8),0 0 80px rgba(248,248,248,.4)}}.stars-container{width:100%;height:100%;position:absolute;top:0;left:0}.star{background:#fff;border-radius:50%;width:2px;height:2px;animation:ease-in-out infinite twinkle;position:absolute;box-shadow:0 0 3px #fff}@keyframes twinkle{0%,to{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.8)}}@media (max-width:768px){.sun{width:60px;height:60px}.sun-rays{width:90px;height:90px}.moon{width:55px;height:55px}.cloud-1,.cloud-2,.cloud-3{transform:scale(.7)}}