@property --sky-1{syntax:"<color>";inherits:true;initial-value:#3a4a5e}@property --sky-2{syntax:"<color>";inherits:true;initial-value:#556678}@property --sky-3{syntax:"<color>";inherits:true;initial-value:#71808f}@property --ink{syntax:"<color>";inherits:true;initial-value:#f4f8ff}@property --ink-2{syntax:"<color>";inherits:true;initial-value:#c9d6e6}@property --accent{syntax:"<color>";inherits:true;initial-value:#8fbaff}@property --cloud{syntax:"<color>";inherits:true;initial-value:#e9eef5}:root{--ease-out:cubic-bezier(.22, 1, .36, 1);--ease-back:cubic-bezier(.34, 1.4, .5, 1);--morph:.9s var(--ease-out)}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{color:#fff;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;background:radial-gradient(130% 100% at 50% -20%,#23262f 0%,#0000 55%),radial-gradient(120% 90% at 80% 120%,#191b22 0%,#0000 50%),#0b0c11;place-items:center;min-height:100dvh;font-family:Poppins,system-ui,sans-serif;display:grid;overflow:hidden}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.app{flex-direction:column;align-items:center;gap:1.1rem;padding:4vh 4vw;display:flex}.wcard{aspect-ratio:20/29;isolation:isolate;cursor:default;width:min(90vw,380px);max-height:86dvh;transition:--sky-1 var(--morph), --sky-2 var(--morph), --sky-3 var(--morph), --ink var(--morph), --ink-2 var(--morph), --accent var(--morph), --cloud var(--morph);border-radius:30px;position:relative;overflow:hidden;box-shadow:inset 0 1px 0 1px #ffffff1a,0 40px 80px -30px #000000d9,0 10px 30px -12px #0009}.wcard[data-cond=sun]{--sky-1:#2f8dff;--sky-2:#63aeff;--sky-3:#bfe4ff;--ink:#0f2544;--ink-2:#2d4b74;--accent:#ffb43e;--cloud:#fff}.wcard[data-cond=cloud]{--sky-1:#6f7f92;--sky-2:#93a2b4;--sky-3:#c2ccd8;--ink:#1b2c40;--ink-2:#42546b;--accent:#9fb2c9;--cloud:#f2f5f9}.wcard[data-cond=rain]{--sky-1:#37475b;--sky-2:#4b5c70;--sky-3:#67788b;--ink:#eef4fb;--ink-2:#bccadd;--accent:#7fa8d8;--cloud:#c3ccd8}.wcard[data-cond=storm]{--sky-1:#191f2b;--sky-2:#28303f;--sky-3:#3b4557;--ink:#eef2fa;--ink-2:#aab6cb;--accent:#ffd54a;--cloud:#8b95a6}.wcard[data-cond=snow]{--sky-1:#88a0bd;--sky-2:#b3c5da;--sky-3:#e2ecf5;--ink:#22364d;--ink-2:#4a6079;--accent:#dceaf7;--cloud:#fff}.scene{z-index:0;position:absolute;inset:0;overflow:hidden}.sky{background:linear-gradient(180deg, var(--sky-1) 0%, var(--sky-2) 52%, var(--sky-3) 100%);position:absolute;inset:0}.sun{filter:blur(.5px);opacity:0;width:120px;height:120px;transition:opacity var(--morph), transform var(--morph);will-change:transform, opacity;background:radial-gradient(circle at 45% 42%,#fffbe8 0%,#ffe27a 40%,#ffb43e 72%,#ff962800 74%);border-radius:50%;position:absolute;top:16%;left:50%;transform:translate(-50%)}.sun__rays{background:conic-gradient(#ffd6788c 0deg 6deg,#0000 6deg 45deg,#ffd6788c 45deg 51deg,#0000 51deg 90deg,#ffd6788c 90deg 96deg,#0000 96deg 135deg,#ffd6788c 135deg 141deg,#0000 141deg 180deg,#ffd6788c 180deg 186deg,#0000 186deg 225deg,#ffd6788c 225deg 231deg,#0000 231deg 270deg,#ffd6788c 270deg 276deg,#0000 276deg 315deg,#ffd6788c 315deg 321deg,#0000 321deg 360deg);border-radius:50%;animation:60s linear infinite spin;position:absolute;inset:-46px;-webkit-mask:radial-gradient(circle,#0000 46%,#000 47% 62%,#0000 72%);mask:radial-gradient(circle,#0000 46%,#000 47% 62%,#0000 72%)}@keyframes spin{to{transform:rotate(360deg)}}.wcard[data-cond=sun] .sun{opacity:1;transform:translate(-50%)scale(1)}.wcard[data-cond=cloud] .sun{opacity:.8;transform:translate(-96px,-14px)scale(.7)}.clouds{opacity:0;transition:opacity var(--morph);pointer-events:none;position:absolute;inset:0}.cloud{background:var(--cloud);filter:blur(2px);will-change:transform;border-radius:100px;position:absolute}.cloud:before,.cloud:after{content:"";background:inherit;border-radius:50%;position:absolute}.cloud:before{width:60%;height:150%;top:-55%;left:14%}.cloud:after{width:42%;height:120%;top:-34%;right:12%}.c1{width:150px;height:44px;animation:34s linear infinite drift;top:14%;left:-30%}.c2{opacity:.92;width:200px;height:56px;animation:46s linear -12s infinite drift;top:30%;left:-40%}.c3{opacity:.8;width:120px;height:36px;animation:40s linear -26s infinite drift;top:46%;left:-25%}@keyframes drift{to{transform:translate(180%)}}.wcard[data-cond=cloud] .clouds,.wcard[data-cond=rain] .clouds,.wcard[data-cond=storm] .clouds,.wcard[data-cond=snow] .clouds{opacity:1}.wcard[data-cond=sun] .clouds{opacity:.5}.rain,.snow{pointer-events:none;opacity:0;transition:opacity .5s var(--ease-out);--fall:620px;position:absolute;inset:0;overflow:hidden}.rain{--spd:1}.wcard[data-cond=rain] .rain{opacity:1}.wcard[data-cond=storm] .rain{opacity:1;--spd:.62;transform:rotate(9deg)scale(1.3)}.wcard[data-cond=snow] .snow{opacity:1}.streak{width:1.4px;height:46px;animation-name:rainfall;animation-timing-function:linear;animation-iteration-count:infinite;animation-duration:calc(var(--d) * var(--spd) * 1s);will-change:transform;background:linear-gradient(#c8e1ff00,#c8e1ffbf);border-radius:2px;position:absolute;top:-12%}@keyframes rainfall{to{transform:translateY(var(--fall))}}.flake{animation:linear infinite snowfall;animation-duration:calc(var(--d) * 1s);will-change:transform;background:#fff;border-radius:50%;position:absolute;top:-6%;box-shadow:0 0 5px #ffffffb3}@keyframes snowfall{0%{transform:translateY(-20px)rotate(0)}to{transform:translate(var(--sway), var(--fall)) rotate(360deg)}}.snowpile{filter:blur(3px);opacity:0;height:20%;transition:opacity 1.2s var(--ease-out), transform 1.2s var(--ease-out);background:radial-gradient(60% 120% at 50% 100%,#fff 0%,#ffffffd9 55%,#fff0 100%);position:absolute;bottom:-8%;left:-4%;right:-4%;transform:translateY(30%)}.wcard[data-cond=snow] .snowpile{opacity:1;transform:translateY(0)}.flash{opacity:0;pointer-events:none;mix-blend-mode:screen;background:#eaf1ff;position:absolute;inset:0}.bolt{fill:#fff6cf;opacity:0;pointer-events:none;filter:drop-shadow(0 0 10px #fff0aae6);width:46px;height:auto;position:absolute;top:6%;left:58%}.flash.on{animation:.55s ease-out flash}.bolt.on{animation:.55s ease-out boltflash}@keyframes flash{0%{opacity:0}6%{opacity:.9}12%{opacity:.15}20%{opacity:.8}34%{opacity:0}to{opacity:0}}@keyframes boltflash{0%{opacity:0}6%{opacity:1}24%{opacity:.2}32%{opacity:.9}55%{opacity:0}to{opacity:0}}.scrim{pointer-events:none;background:linear-gradient(#00000038 0%,#0000 22%),linear-gradient(#0000 66%,#00000057 100%);position:absolute;inset:0}.glass{z-index:1;pointer-events:none;background:linear-gradient(125deg,#ffffff29 0%,#fff0 30%),radial-gradient(120% 80% at 78% 6%,#ffffff24,#0000 46%);position:absolute;inset:0;box-shadow:inset 0 0 0 1.5px #ffffff24}.glass:after{content:"";border-radius:inherit;opacity:0;transition:opacity var(--morph);background:radial-gradient(120% 120%,#0000 52%,#ffffff80 100%);position:absolute;inset:0}.wcard[data-cond=snow] .glass:after{opacity:.85}.drops{z-index:2;pointer-events:none;opacity:0;transition:opacity .5s var(--ease-out);position:absolute;inset:0;overflow:hidden}.wcard[data-cond=rain] .drops,.wcard[data-cond=storm] .drops{opacity:1}.drop{will-change:transform, opacity;background:radial-gradient(45% 40% at 38% 30%,#ffffffd9,#fff0 60%),radial-gradient(120% 120% at 65% 78%,#7896be4d,#7896be00 70%);border-radius:50%;position:absolute;box-shadow:inset 0 -1px 2px #fff6,inset 0 1px 1px #1e325040}.ui{z-index:3;color:var(--ink);transition:color var(--morph);flex-direction:column;padding:clamp(18px,5.2%,26px);display:flex;position:absolute;inset:0}.ui__top{justify-content:space-between;align-items:center;display:flex}.loc{align-items:center;gap:.35rem;font-size:1rem;font-weight:600;display:flex}.loc__pin{width:16px;height:16px;fill:var(--accent);transition:fill var(--morph)}.clock{color:var(--ink-2);font-variant-numeric:tabular-nums;transition:color var(--morph);font-size:.85rem;font-weight:500}.ui__main{justify-content:space-between;align-items:center;margin-top:auto;display:flex}.temp{align-items:flex-start;line-height:.86;display:flex}.temp__num{letter-spacing:-.04em;font-variant-numeric:tabular-nums;font-size:clamp(4.2rem,20vw,5.6rem);font-weight:700}.temp__deg{opacity:.8;margin-top:.35em;font-size:clamp(1.6rem,7vw,2.2rem);font-weight:500}.cond{letter-spacing:-.01em;margin-top:.1rem;font-size:1.35rem;font-weight:600}.stats{grid-template-columns:repeat(3,1fr);gap:8px;margin-top:clamp(14px,3.5%,20px);display:grid}.stat{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#ffffff1f;border:1px solid #ffffff24;border-radius:13px;flex-direction:column;gap:2px;padding:9px 11px;display:flex}.stat__k{text-transform:uppercase;letter-spacing:.08em;color:var(--ink-2);transition:color var(--morph);font-size:.64rem;font-weight:600}.stat__v{font-size:1rem;font-weight:600}.stat__v small{opacity:.7;margin-left:1px;font-size:.58em;font-weight:500}.forecast{grid-template-columns:repeat(5,1fr);gap:6px;margin-top:clamp(12px,3%,18px);display:grid}.day{cursor:pointer;color:var(--ink);transition:background .3s var(--ease-out), transform .3s var(--ease-back), box-shadow .3s;background:#ffffff12;border:0;border-radius:15px;flex-direction:column;align-items:center;gap:4px;padding:9px 2px 8px;font-family:inherit;display:flex}.day__name{opacity:.78;letter-spacing:.02em;font-size:.66rem;font-weight:600}.day__ico{fill:currentColor;stroke:currentColor;width:24px;height:24px}.day__ico line,.day__ico path[stroke]{fill:none}.day__t{font-variant-numeric:tabular-nums;font-size:.74rem;font-weight:700}.day:hover{background:#ffffff29;transform:translateY(-2px)}.day:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.day.active{color:#1a2636;background:#ffffffe6;box-shadow:0 8px 20px -8px #00000080}.day.active .day__name{opacity:1}.wc-icon{flex:none;width:92px;height:92px;position:relative}.wc-icon>span{opacity:0;transition:opacity .45s var(--ease-out);position:absolute}.ic-sun{background:radial-gradient(circle at 42% 40%,#fffbe8,#ffdf72 46%,#ffb23a 78%);border-radius:50%;width:60px;height:60px;top:8px;left:8px;box-shadow:0 0 22px #ffbe4699}.ic-sun i{background:conic-gradient(from 0deg, #ffce56 0 7deg, transparent 7deg 45deg, #ffce56 45deg 52deg, transparent 52deg 90deg, #ffce56 90deg 97deg, transparent 97deg 135deg, #ffce56 135deg 142deg, transparent 142deg 180deg, #ffce56 180deg 187deg, transparent 187deg 225deg, #ffce56 225deg 232deg, transparent 232deg 270deg, #ffce56 270deg 277deg, transparent 277deg 315deg, #ffce56 315deg 322deg, transparent 322deg 360deg);border-radius:50%;animation:22s linear infinite spin;position:absolute;inset:-16px;-webkit-mask:radial-gradient(circle,#0000 50%,#000 51% 66%,#0000 74%);mask:radial-gradient(circle,#0000 50%,#000 51% 66%,#0000 74%)}.ic-cloud{background:#fbfdff;border-radius:40px;width:78px;height:40px;animation:4s ease-in-out infinite bob;top:30px;left:6px;box-shadow:0 6px 14px #14284640}.ic-cloud:before{content:"";background:inherit;border-radius:50%;width:40px;height:40px;position:absolute;top:-20px;left:12px}.ic-cloud:after{content:"";background:inherit;border-radius:50%;width:30px;height:30px;position:absolute;top:-13px;right:12px}@keyframes bob{50%{transform:translateY(-4px)}}.ic-rain,.ic-snow{width:78px;height:28px;top:62px;left:6px}.ic-rain i,.ic-snow i{position:absolute;top:0}.ic-rain i{background:#bcd6f5;border-radius:2px;width:3px;height:12px;animation:.9s linear infinite minidrop}.ic-rain i:first-child{animation-delay:0s;left:18px}.ic-rain i:nth-child(2){animation-delay:.3s;left:38px}.ic-rain i:nth-child(3){animation-delay:.6s;left:58px}@keyframes minidrop{0%{opacity:0;transform:translateY(-4px)}20%{opacity:1}to{opacity:0;transform:translateY(22px)}}.ic-snow i{background:#fff;border-radius:50%;width:7px;height:7px;animation:2.4s linear infinite miniflake;box-shadow:0 0 4px #fffc}.ic-snow i:first-child{animation-delay:0s;left:16px}.ic-snow i:nth-child(2){animation-delay:.8s;left:36px}.ic-snow i:nth-child(3){animation-delay:1.6s;left:56px}@keyframes miniflake{0%{opacity:0;transform:translateY(-4px)}20%{opacity:1}to{opacity:0;transform:translate(6px,24px)}}.ic-bolt{clip-path:polygon(58% 0,12% 58%,46% 58%,34% 100%,88% 40%,52% 40%);filter:drop-shadow(0 0 8px #ffd250cc);background:#ffd54a;width:26px;height:34px;top:58px;left:30px}@keyframes pulse{0%,to{opacity:1}50%{opacity:.55}}.wcard[data-cond=sun] .ic-sun,.wcard[data-cond=cloud] .ic-cloud{opacity:1}.wcard[data-cond=cloud] .ic-sun{opacity:1;width:40px;height:40px;top:0;left:40px}.wcard[data-cond=rain] .ic-cloud,.wcard[data-cond=rain] .ic-rain{opacity:1}.wcard[data-cond=storm] .ic-cloud{opacity:1;background:#cfd6e0}.wcard[data-cond=storm] .ic-bolt{opacity:1;animation:2.6s ease-in-out infinite pulse}.wcard[data-cond=snow] .ic-cloud,.wcard[data-cond=snow] .ic-snow{opacity:1}.hint{letter-spacing:.12em;text-transform:uppercase;color:#8a90a0;opacity:.8;font-size:.74rem;font-weight:600}.chip-btn{z-index:60;color:#fff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);cursor:pointer;width:42px;height:42px;transition:transform .2s var(--ease-back), background .2s, opacity .2s;background:#ffffff14;border:1px solid #ffffff29;border-radius:50%;place-items:center;font-size:1rem;display:grid;position:fixed;top:1rem}#sound-toggle{right:1rem}#auto-toggle{right:calc(1rem + 52px)}.chip-btn:hover{background:#ffffff29;transform:scale(1.08)}.chip-btn:focus-visible{outline-offset:2px;outline:2px solid #fff}.chip-btn[aria-pressed=false]{opacity:.55}#auto-toggle[aria-pressed=true]{opacity:1;background:#ffffff38}@media (prefers-reduced-motion:reduce){.cloud,.sun__rays,.streak,.flake,.ic-sun i,.ic-cloud,.ic-rain i,.ic-snow i,.ic-bolt{animation:none!important}.streak,.flake{display:none}.wcard,.sun,.clouds,.ui,.glass:after{transition-duration:.001ms}}