@import "https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800&display=swap";*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;margin:0}body{min-height:100dvh;font-family:Nunito,sans-serif;overflow-x:hidden}#root{flex-direction:column;width:100%;min-height:100dvh;display:flex;position:relative}#root:has([data-weather=""]):before{content:"";pointer-events:none;z-index:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 200'%3E%3Cpath fill='white' fill-opacity='0.25' d='M0,100 C240,30 480,170 720,100 C960,30 1200,170 1440,100 L1440,200 L0,200 Z'/%3E%3C/svg%3E");background-repeat:repeat-x;background-size:1440px 200px;width:100%;height:200px;animation:7s linear infinite wave-scroll-back;position:absolute;bottom:0;left:0}@keyframes wave-scroll-back{0%{background-position-x:1440px}to{background-position-x:0}}#root>div{flex-direction:column;flex:1 0 auto;justify-content:center;align-items:center;gap:20px;width:100%;min-height:100dvh;padding:32px 24px;transition:background .6s;display:flex;position:relative}#root>div[data-weather=""]:before{content:"";pointer-events:none;z-index:0;background:#ffffff38;border-radius:50%;width:18px;height:18px;animation:14s linear infinite bubble-rise;position:absolute;bottom:8%;left:4%;box-shadow:110px -55px 0 3px #ffffff29,250px -15px 0 -2px #fff3,400px -130px 0 5px #ffffff21,540px -35px 0 -3px #ffffff30,690px -170px 0 2px #ffffff26,840px -75px 0 6px #ffffff1f,1000px -150px 0 -4px #ffffff2e,1160px -45px 0 3px #ffffff24,45px -270px 0 -2px #ffffff1f,190px -350px 0 4px #ffffff1a,340px -230px 0 -5px #ffffff24,470px -410px 0 2px #ffffff1c,620px -290px 0 6px #ffffff21,770px -440px 0 -3px #ffffff1a,920px -310px 0 4px #ffffff1f,1080px -380px 0 -2px #ffffff17,140px -530px 0 3px #ffffff14,310px -590px 0 -4px #ffffff1a,460px -550px 0 5px #ffffff12,630px -630px 0 -2px #ffffff17,800px -580px 0 3px #ffffff14,970px -660px 0 -5px #ffffff12,1140px -610px 0 4px #ffffff14}@keyframes bubble-rise{0%{opacity:1;transform:translateY(0)}80%{opacity:.7}to{opacity:0;transform:translateY(-105vh)}}#root>div[data-weather=""]:after{content:"";pointer-events:none;z-index:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 160'%3E%3Cpath fill='white' fill-opacity='0.45' d='M0,80 C180,20 360,140 540,80 C720,20 900,140 1080,80 C1260,20 1440,140 1440,80 L1440,160 L0,160 Z'/%3E%3C/svg%3E");background-repeat:repeat-x;background-size:1440px 160px;width:100%;height:160px;animation:4s linear infinite wave-scroll-front;position:absolute;bottom:0;left:0}@keyframes wave-scroll-front{0%{background-position-x:0}to{background-position-x:1440px}}#root>div>*{width:100%;max-width:480px}h1{text-align:center;letter-spacing:-2px;white-space:nowrap;z-index:1;background:linear-gradient(135deg,#fff 0%,#ffffffbf 100%);-webkit-text-fill-color:transparent;filter:drop-shadow(0 4px 16px #0000001f);-webkit-background-clip:text;background-clip:text;max-width:none;font-size:clamp(1.8rem,5.5vw,3.5rem);font-weight:800;line-height:1;position:relative}h1:before{content:"⛅ ";-webkit-text-fill-color:initial;background-clip:initial;-webkit-background-clip:initial}#root>div[data-weather=""] h1:after{content:"";z-index:-1;background:radial-gradient(#ffffff59 0%,#0000 65%);border-radius:50%;width:110%;height:220%;animation:3.5s ease-in-out infinite title-glow;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes title-glow{0%,to{opacity:.5;transform:translate(-50%,-50%)scale(1)}50%{opacity:1;transform:translate(-50%,-50%)scale(1.2)}}div:has(>input[type=text]){gap:10px;width:100%;display:flex}input[type=text]{color:#1a5276;background:#ffffffe0;border:none;border-radius:50px;outline:none;flex:1;padding:13px 20px;font-family:Nunito,sans-serif;font-size:1rem;transition:box-shadow .2s,background .2s;box-shadow:0 4px 16px #64b4eb59}input[type=text]::placeholder{color:#88c4e0}input[type=text]:focus{background:#fffffff7;box-shadow:0 4px 22px #2980b966}div:has(>input[type=text]) button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#2980b9,#1a5276);border:none;border-radius:50px;width:auto;padding:13px 26px;font-family:Nunito,sans-serif;font-size:1rem;font-weight:700;transition:transform .15s,box-shadow .15s;box-shadow:0 4px 16px #2980b973}div:has(>input[type=text]) button:hover{transform:translateY(-2px);box-shadow:0 8px 22px #2980b980}div:has(>input[type=text]) button:active{transform:translateY(0)}#root>div>button{color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100;background:#ffffff40;border:2px solid #ffffff80;border-radius:50px;width:auto;padding:8px 18px;font-family:Nunito,sans-serif;font-size:.85rem;font-weight:700;transition:background .2s,transform .15s;position:fixed;top:20px;right:24px}#root>div>button:hover{background:#fff6;transform:translateY(-2px)}#root>div>button:active{transform:translateY(0)}#root>div>p{color:#fff;font-size:1rem;font-weight:700}.error-message{text-align:center;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#dc35452e;border:1.5px solid #dc35458c;border-radius:14px;padding:12px 20px;color:#fff!important;font-size:.95rem!important;font-weight:600!important}#root>div:not([data-weather=""])>p{display:none}div:has(>h2){text-align:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffffd1;border-radius:24px;width:100%;padding:28px 32px;box-shadow:0 8px 32px #64b4ff38}div:has(>h2) h2{color:#1a5276;margin-bottom:4px;font-size:1.55rem;font-weight:800}div:has(>h2) img{width:80px;height:80px;margin:8px auto;display:block}div:has(>h2) p:first-of-type{color:#1a5276;margin:4px 0 6px;font-size:4rem;font-weight:800;line-height:1.1}div:has(>h2) p:last-of-type{color:#5dade2;text-transform:capitalize;font-size:1.05rem;font-weight:600}div:has(>p:first-child):not(:has(input)):not(:has(h2)){grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:12px;width:100%;display:grid}div:has(>p:first-child):not(:has(input)):not(:has(h2)) p{color:#1a5276;text-align:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffffd1;border-radius:18px;padding:18px 12px;font-size:.9rem;font-weight:700;line-height:1.5;box-shadow:0 4px 16px #64b4ff2e}#root>div[data-weather*=rain]:before,#root>div[data-weather*=drizzle]:before{content:"";pointer-events:none;z-index:0;background-image:repeating-linear-gradient(108deg,#0000 0 10px,#ffffff4d 10px 11px,#0000 11px 28px);background-size:28px 56px;animation:.55s linear infinite rain-pour;position:absolute;inset:0}@keyframes rain-pour{0%{background-position:0 0}to{background-position:28px 56px}}#root>div[data-weather*=sunny]:before,#root>div[data-weather*=clear]:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(circle,#fff050d9 0%,#ffb41e8c 30%,#ff780033 60%,#0000 75%);border-radius:50%;width:520px;height:520px;animation:3s ease-in-out infinite sun-breathe;position:absolute;top:-120px;right:-120px}#root>div[data-weather*=sunny]:after,#root>div[data-weather*=clear]:after{content:"";pointer-events:none;z-index:0;background:radial-gradient(circle,#0000 35%,#ffdc321f 50%,#0000 65%);border-radius:50%;width:640px;height:640px;animation:3s ease-in-out infinite reverse sun-rays;position:absolute;top:-160px;right:-160px}@keyframes sun-breathe{0%,to{opacity:.75;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}@keyframes sun-rays{0%,to{opacity:.5;transform:scale(1)rotate(0)}50%{opacity:1;transform:scale(1.1)rotate(15deg)}}#root>div[data-weather*=cloud]:before,#root>div[data-weather*=overcast]:before{content:"";pointer-events:none;z-index:0;background:#ffffff47;border-radius:60px;width:200px;height:60px;animation:22s linear infinite cloud-drift;position:absolute;top:10%;left:-260px;box-shadow:320px 70px 0 18px #ffffff38,620px -20px 0 28px #fff3,940px 50px 0 12px #ffffff40}#root>div[data-weather*=cloud]:after,#root>div[data-weather*=overcast]:after{content:"";pointer-events:none;z-index:0;background:#fff3;border-radius:50px;width:160px;height:46px;animation:34s linear infinite cloud-drift;position:absolute;top:52%;left:-200px;box-shadow:280px -50px 0 22px #ffffff29,580px 35px 0 10px #fff3,860px -30px 0 16px #ffffff24}@keyframes cloud-drift{0%{transform:translate(0)}to{transform:translate(130vw)}}#root>div[data-weather*=thunder]:before,#root>div[data-weather*=storm]:before{content:"";pointer-events:none;z-index:0;background-image:repeating-linear-gradient(108deg,#0000 0 5px,#ffffff47 5px 6px,#0000 6px 16px);background-size:16px 32px;animation:.3s linear infinite rain-pour;position:absolute;inset:0}#root>div[data-weather*=thunder]:after,#root>div[data-weather*=storm]:after{content:"";pointer-events:none;z-index:1;background:#c8dcff00;animation:6s ease-in-out infinite lightning;position:absolute;inset:0}@keyframes lightning{0%,82%,84%,86%,to{background:#c8dcff00}83%{background:#c8dcff73}85%{background:#c8dcff40}}#root>div[data-weather*=snow]:before,#root>div[data-weather*=blizzard]:before{content:"";pointer-events:none;z-index:0;background:#ffffffe6;border-radius:50%;width:10px;height:10px;animation:5s linear infinite snow-fall;position:absolute;top:-12px;left:2%;box-shadow:70px 0 0 1px #ffffffd9,160px 0 0 -2px #ffffffbf,260px 0 0 2px #ffffffe6,370px 0 0 -1px #fffc,470px 0 0 3px #ffffffb3,570px 0 0 -2px #ffffffd9,670px 0 0 1px #ffffffe6,770px 0 0 -3px #ffffffbf,870px 0 0 2px #fffc,970px 0 0 -1px #ffffffd9,1060px 0 0 2px #ffffffb3,1160px 0 0 -2px #ffffffe6,1260px 0 0 1px #fffc,120px 0 0 3px #fff9,310px 0 0 -1px #ffffffb3,510px 0 0 2px #ffffffa6,710px 0 0 -2px #ffffffb3,910px 0 0 1px #fff9,1110px 0 0 -3px #ffffffa6}#root>div[data-weather*=snow]:after,#root>div[data-weather*=blizzard]:after{content:"";pointer-events:none;z-index:0;background:#ffffffb3;border-radius:50%;width:7px;height:7px;animation:8s linear infinite snow-fall;position:absolute;top:-12px;left:5%;box-shadow:90px 0 0 -1px #ffffffa6,210px 0 0 2px #ffffffb3,330px 0 0 -2px #fff9,440px 0 0 1px #ffffffbf,540px 0 0 -1px #ffffffa6,650px 0 0 2px #ffffffb3,750px 0 0 -2px #fff9,850px 0 0 1px #ffffffbf,950px 0 0 -1px #ffffffa6,1050px 0 0 2px #ffffffb3,1150px 0 0 -2px #fff9,1300px 0 0 1px #ffffffb3}@keyframes snow-fall{0%{opacity:1;transform:translateY(0)translate(0)}to{opacity:.6;transform:translateY(105vh)translate(30px)}}#root>div[data-weather*=fog]:before,#root>div[data-weather*=mist]:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(90% 18% at 20% 35%,#ffffff8c 0%,#0000 70%),radial-gradient(70% 14% at 75% 60%,#ffffff73 0%,#0000 70%),radial-gradient(80% 12% at 50% 80%,#fff6 0%,#0000 70%);animation:10s ease-in-out infinite fog-drift-a;position:absolute;inset:0}#root>div[data-weather*=fog]:after,#root>div[data-weather*=mist]:after{content:"";pointer-events:none;z-index:0;background:radial-gradient(75% 16% at 65% 25%,#ffffff73 0%,#0000 70%),radial-gradient(85% 15% at 30% 70%,#ffffff80 0%,#0000 70%);animation:14s ease-in-out infinite fog-drift-b;position:absolute;inset:0}@keyframes fog-drift-a{0%,to{opacity:.85;transform:translate(0)}50%{opacity:1;transform:translate(6%)}}@keyframes fog-drift-b{0%,to{opacity:.75;transform:translate(0)}50%{opacity:1;transform:translate(-7%)}}@media (width<=900px){#root>div{padding:28px 22px}#root>div>*{max-width:560px}div:has(>h2) p:first-of-type{font-size:3.5rem}}@media (width<=600px){#root>div{justify-content:flex-start;gap:14px;padding:64px 14px 20px}#root>div>*{max-width:100%}h1{letter-spacing:-1px;font-size:clamp(1.5rem,7vw,2.2rem)}div:has(>input[type=text]){gap:8px}input[type=text]{padding:11px 16px;font-size:.95rem}div:has(>input[type=text]) button{padding:11px 18px;font-size:.88rem}#root>div>button{padding:6px 14px;font-size:.78rem;top:12px;right:12px}div:has(>h2){padding:22px 18px}div:has(>h2) h2{font-size:1.2rem}div:has(>h2) p:first-of-type{font-size:3rem}div:has(>h2) img{width:64px;height:64px}div:has(>h2) p:last-of-type{font-size:.95rem}div:has(>p:first-child):not(:has(input)):not(:has(h2)){grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:8px}div:has(>p:first-child):not(:has(input)):not(:has(h2)) p{padding:12px 6px;font-size:.75rem;line-height:1.4}}@media (width<=380px){h1{font-size:1.4rem}#root>div{gap:12px;padding:56px 12px 16px}div:has(>input[type=text]) button{padding:11px 14px;font-size:.82rem}div:has(>h2) p:first-of-type{font-size:2.6rem}div:has(>p:first-child):not(:has(input)):not(:has(h2)){grid-template-columns:repeat(2,1fr)}}@media (height<=700px) and (width<=600px){#root>div{justify-content:flex-start}}