@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--bg:#101113;--panel:#1b1d20;--text:#f4f4f1;--muted:#94989e;--line:#303236;--red:#f04445;--soft:#25272b;--font:'DM Sans',Arial,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);transition:background .4s,color .4s}button,input{font:inherit}button,a,input{ -webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit;background:none;border:1px solid var(--line);border-radius:9px;padding:9px 13px}button:hover{border-color:var(--red)}button:focus-visible,a:focus-visible{outline:3px solid var(--red);outline-offset:4px}.conceptbar{padding:13px 4%;display:flex;justify-content:space-between;align-items:center;background:#08090b;color:#bbb;font-size:10px;letter-spacing:1.4px;border-bottom:1px solid #292b30;gap:15px}.conceptbar i{color:#555;margin:0 12px}.switch{display:flex;background:#202226;border-radius:9px;padding:4px;gap:3px}.switch button{border:0;font-size:12px;letter-spacing:0;color:#b7b7bd;padding:9px 21px}.switch .active{background:#f0efeb;color:#171819}.demo{border:1px solid #3b3b40;border-radius:20px;padding:6px 12px}.shell{max-width:1600px;margin:auto;padding:0 4%}header{display:flex;justify-content:space-between;align-items:center;padding:24px 0;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:23px;font-weight:600;font-size:14px}.brand img{width:98px;height:77px;object-fit:contain;background:#eee;border-radius:7px;padding:5px}.divider{height:37px;width:1px;background:var(--line)}small{font-size:12px;font-weight:400}.brand small{display:block;color:var(--muted);margin-top:6px}.headerRight{display:flex;align-items:center;gap:22px;font-size:12px;color:var(--muted)}#date{max-width:140px;text-align:right;line-height:1.6}#clock{font-size:25px;font-weight:500;color:var(--text);font-variant-numeric:tabular-nums}.greeting{display:flex;justify-content:space-between;align-items:center;padding:34px 0 27px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;color:var(--muted)}h1,h2,.temperature,.rate{font-family:Manrope,var(--font)}h1{font-size:clamp(26px,3vw,42px);letter-spacing:-1.6px;margin:9px 0 0;font-weight:500}h1 span{color:var(--red)}.edition{text-align:right;letter-spacing:2px;font-size:9px;line-height:2;color:var(--muted)}.edition b{color:var(--red)}.dashboard{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px}.weather{position:relative;overflow:hidden;border-radius:20px;min-height:448px;color:white;background:#62778a;isolation:isolate;box-shadow:0 18px 60px #0002}.scene{position:absolute;inset:0;z-index:-2;background:linear-gradient(120deg,#44596b,#8b9ba4 55%,#eac6a0);transition:background .8s}.weather:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#07152170,transparent 70%),linear-gradient(0deg,#0a1b2df0,transparent 65%);z-index:-1}.sun{position:absolute;right:22%;top:40px;width:125px;height:125px;border-radius:50%;background:#fff2c8;box-shadow:0 0 70px 30px #ffe5ab55,0 0 160px 70px #ffe5ab22;animation:breathe 8s ease-in-out infinite}.cloud{position:absolute;width:400px;height:76px;border-radius:50%;background:#e7e9e785;filter:blur(12px);animation:drift 35s ease-in-out infinite alternate}.cloud:before,.cloud:after{content:'';position:absolute;background:inherit;border-radius:50%;width:180px;height:100px;top:-30px;left:50px}.cloud:after{width:230px;left:140px;top:-15px}.c1{top:150px;right:10%;opacity:.65}.c2{top:65px;left:5%;opacity:.3;transform:scale(.7);animation-delay:-15s}.mountains{position:absolute;bottom:0;width:100%;height:65%;opacity:.8}.weatherTop{display:flex;justify-content:space-between;align-items:center;padding:24px 28px}.weatherlabel{font-size:10px;letter-spacing:2px;font-weight:700}.weatherTop button{background:#ffffff14;border-color:#ffffff38;color:white;font-size:11px;border-radius:20px}.weatherBody{display:flex;justify-content:space-between;padding:5px 30px 22px}.location{font-size:25px;letter-spacing:-.5px;padding:0;border:0;font-weight:500}.location span{font-size:20px;opacity:.6;padding-left:10px}.weatherBody p{font-size:11px;opacity:.65;margin:7px 0}.temperature{font-size:100px;line-height:1.15;font-weight:400;letter-spacing:-7px;margin-top:14px}.temperature span{font-size:70px;vertical-align:top}.highlow{font-size:11px;margin-top:10px;opacity:.7}.highlow span{padding:0 8px}.weatherAside{text-align:right;align-self:center;font-size:10px;letter-spacing:3px;line-height:1.8;color:#fff9}.weatherAside p{font-size:22px;letter-spacing:-.3px;line-height:1.5;opacity:.9}.weatherStats{display:flex;margin:0 30px;border-top:1px solid #ffffff30;padding:19px 0;gap:32px}.weatherStats div{min-width:70px}.weatherStats span{font-size:8px;letter-spacing:1.6px;color:#c3cdd5;display:block;margin-bottom:6px}.weatherStats b{font-size:18px;font-weight:500}.weatherStats small{font-size:10px;color:#bbc8d1}.sceneTools{padding:10px 25px;background:#0c1a27a0;display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#acb9c4;gap:10px}.sceneTools div{display:flex;gap:3px}.sceneTools button{font-size:10px;border:0;padding:6px 8px;border-radius:5px;color:#ccc}.sceneTools button.active{background:#ffffff23;color:#fff}.sectionTitle{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:20px}h2{font-size:18px;font-weight:600;letter-spacing:-.5px;margin:0}.sectionTitle button{font-size:11px}.apps{display:flex;flex-direction:column}.apps>.sectionTitle{margin:3px 0 16px}.appsNote{font-size:10px;color:var(--muted);margin:auto 0 0;padding-top:15px}.appCard{position:relative;display:flex;align-items:center;gap:18px;text-decoration:none;color:var(--text);border:1px solid var(--line);padding:23px 20px;margin-bottom:13px;border-radius:15px;min-height:112px;overflow:hidden;background:linear-gradient(120deg,var(--soft),var(--panel));width:100%;text-align:left;transition:transform .25s,border-color .25s}.appCard:hover{transform:translateY(-3px);border-color:var(--red)}.appCard:after{content:'';position:absolute;width:100px;height:100px;right:-20px;top:40px;border:1px solid #ffffff08;transform:rotate(35deg);border-radius:22px}.appCard:first-child{background:linear-gradient(120deg,#bf292f,#e44445);border:0;color:white}.appIcon{width:45px;height:45px;border-radius:13px;background:#ffffff0c;display:grid;place-items:center;color:var(--red);flex-shrink:0}.appCard:first-child .appIcon{background:#ffffff20;color:white}.appIcon svg{width:24px;height:24px}.appCard b{font-size:21px;letter-spacing:-.7px}.appCard small{display:block;font-size:11px;opacity:.65;margin-top:6px}.arrow{margin-left:auto;align-self:flex-start;opacity:.6}.panel{padding:25px;background:var(--panel);border:1px solid var(--line);border-radius:18px}.forecast{grid-column:1;min-width:0}.forecast .eyebrow{font-size:8px}.forecast h2{margin-top:6px}.tabs{display:flex;gap:2px;background:var(--bg);padding:4px;border-radius:9px}.tabs button{white-space:nowrap;border:0;color:var(--muted);font-size:10px;padding:8px 11px}.tabs button.active{background:var(--soft);color:var(--text)}.forecastScroll{overflow:auto}#forecastItems{display:flex;min-width:max-content;gap:4px}.forecastCell{min-width:87px;flex:1;text-align:center;border-radius:12px;padding:14px 10px;font-size:11px}.forecastCell:first-child{background:var(--soft)}.forecastCell .symbol{font-size:27px;margin:17px 0;color:#efc477}.forecastCell strong{display:block;font-size:21px;font-weight:500;margin-bottom:12px}.forecastCell .metric{font-size:9px;line-height:1.8;color:var(--muted)}.forecastCell em{display:block;font-style:normal;font-size:8px;color:var(--red);height:12px}.muted{color:var(--muted);font-size:10px;line-height:1.7;margin:14px 0 0}.currency{grid-column:2;grid-row:2/4}.tag{font-size:8px;letter-spacing:1px;border:1px solid var(--line);padding:5px 7px;border-radius:5px;color:var(--muted)}.rate{font-size:37px;margin-top:15px;letter-spacing:-1.5px}.rate small{font:10px var(--font);color:var(--muted)}.convert{display:flex;align-items:center;gap:10px;margin-top:25px;padding-top:20px;border-top:1px solid var(--line)}.convert label,.convert>div{flex:1;min-width:0}.convert span{font-size:9px;color:var(--muted);display:block;margin-bottom:10px}.convert input{width:100%;border:0;border-bottom:1px solid var(--line);background:none;color:var(--text);font-size:19px;padding:0 0 6px}.convert output{display:block;font-size:19px;overflow-wrap:anywhere}.convert button{padding:7px}.notice{padding:23px 25px}.notice h2{margin-top:10px}.notice>p{font-size:12px;color:var(--muted)}.noticeRow{display:flex;align-items:center;gap:13px;border-top:1px solid var(--line);padding-top:18px;margin-top:20px;font-size:12px}.noticeRow small{display:block;color:var(--muted);font-size:10px;margin-top:5px}.noticeRow .tag{margin-left:auto}.noticeIcon{background:var(--soft);padding:10px;border-radius:8px}footer{display:flex;justify-content:space-between;font-size:9px;color:var(--muted);padding:28px 0 30px;gap:16px}dialog{color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:18px;max-width:560px;width:calc(100% - 32px);padding:30px}dialog::backdrop{background:#0009;backdrop-filter:blur(8px)}dialog p{font-size:13px;line-height:1.6;color:var(--muted)}dialog input{display:block;width:100%;background:var(--bg);border:1px solid var(--line);border-radius:7px;padding:12px;color:var(--text);margin:7px 0 12px}dialog label{font-size:11px}.appFieldsRow{padding:12px 0;border-bottom:1px solid var(--line);margin-bottom:12px}.primary{background:var(--red);color:white;border:0}.dialogActions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}#error{color:var(--red)}.particles i{position:absolute;top:-15%;width:1px;height:25px;background:#c2deee99;animation:fall 1s linear infinite;display:none}.weather[data-scene=rain] .particles i{display:block}.weather[data-scene=snow] .particles i{display:block;width:4px;height:4px;border-radius:50%;background:white;animation-duration:8s}.weather[data-scene=rain] .scene,.weather[data-scene=cloud] .scene{background:linear-gradient(120deg,#283d52,#8796a4)}.weather[data-scene=snow] .scene{background:linear-gradient(120deg,#5e7488,#b6c5ce)}.weather[data-scene=snow] .mountains{opacity:.4}.weather[data-scene=night] .scene{background:linear-gradient(120deg,#0b152c,#293956)}.weather[data-scene=night] .sun{width:75px;height:75px;background:#e6e8e2;box-shadow:0 0 70px #dae4f322}.weather[data-scene=rain] .sun,.weather[data-scene=cloud] .sun,.weather[data-scene=snow] .sun{opacity:0}.weather[data-scene=night] .stars{position:absolute;inset:0;background-image:radial-gradient(1px 1px at 20% 15%,white 90%,transparent),radial-gradient(1px 1px at 65% 11%,white 90%,transparent),radial-gradient(1px 1px at 44% 38%,white 90%,transparent);background-size:210px 130px}.paused .scene *{animation-play-state:paused!important}@keyframes drift{to{translate:80px -8px}}@keyframes breathe{50%{transform:scale(1.07)}}@keyframes fall{to{transform:translate(-80px,650px)}}
body.light{--bg:#f3f1ed;--panel:#fff;--text:#202126;--muted:#858380;--line:#e3e0da;--soft:#f1eeea;--red:#d83238}body.light .shell{max-width:1560px}body.light .greeting{padding:39px 0}body.light h1{font-weight:700}body.light .dashboard{grid-template-columns: minmax(300px,.85fr) minmax(0,1.5fr);gap:22px}body.light .apps{grid-column:1;grid-row:1}body.light .weather{grid-column:2;grid-row:1;min-height:475px;border-radius:10px}body.light .appCard{border-radius:9px;min-height:117px;background:#fff;box-shadow:0 5px 14px #34221604}body.light .appCard:first-child{background:#202126;color:white}body.light .appCard:first-child .appIcon{background:#d83238;color:white}body.light .appIcon{background:#f7efeb}body.light .appCard:after{border-color:#00000008}body.light .panel{border-radius:10px}body.light .forecast{grid-column:2;grid-row:2/4}body.light .currency{grid-column:1;grid-row:2}body.light .notice{grid-column:1/3;display:grid;grid-template-columns:1fr 1fr;column-gap:50px}body.light .notice .eyebrow,body.light .notice h2,body.light .notice>p{grid-column:1}body.light .noticeRow{grid-column:2;grid-row:1/4;border:0;margin:0;padding:0}body.light .forecastCell{min-width:93px}body.light .weatherAside{display:none}body.light .forecastScroll{margin-top:35px}body.light .brand img{background:transparent}body.light .edition b{color:#222}
@media(min-width:1450px){.weather{min-height:480px}.weatherBody{padding-top:15px;padding-bottom:35px}}
@media(max-width:1050px){.dashboard{grid-template-columns:minmax(0,1fr) 290px;gap:16px}.weatherAside{display:none}.weatherStats{gap:20px}.panel{padding:20px}.appCard{padding:22px 15px}.brand{gap:15px}.forecast .sectionTitle{align-items:flex-start;flex-direction:column}.headerRight{gap:13px}}
@media(max-width:760px){.conceptbar{flex-wrap:wrap;justify-content:center;padding:12px}.conceptbar>span:first-child{display:none}.conceptbar .demo{font-size:8px}.switch button{padding:8px 13px}.shell{padding:0 5%}header{padding:18px 0}.brand img{width:70px;height:58px}.brand .divider,.brand>span:last-child{display:none}.headerRight #date{font-size:9px;max-width:110px}#clock{font-size:22px}.greeting{padding:27px 0}.edition{display:none}h1{font-size:29px;letter-spacing:-1px}.eyebrow{font-size:8px}.dashboard,body.light .dashboard{display:flex;flex-direction:column;gap:22px}.weather,body.light .weather{min-height:0}.weatherTop{padding:21px}.weatherBody{padding:4px 23px 22px}.weatherStats{margin:0 23px;justify-content:space-between;gap:7px}.weatherStats div{min-width:0}.weatherStats b{font-size:16px}.temperature{font-size:86px}.sceneTools{padding:10px 15px}.sceneTools>span{display:none}.sceneTools>div{justify-content:space-between;width:100%}.appsNote{display:none}.appCard,body.light .appCard{min-height:94px;margin-bottom:10px}.forecast .sectionTitle{flex-direction:row;align-items:center;gap:8px}.tabs button{padding:7px;font-size:9px}.tabs{padding:3px}.forecastCell{min-width:83px}.currency{min-height:0}.rate{margin-top:10px}body.light .notice{display:block}body.light .noticeRow{margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}body.light .apps{order:0}body.light .weather{order:1}body.light .forecast{order:2}body.light .currency{order:3}body.light .notice{order:4}body.light .forecastScroll{margin-top:0}footer{flex-direction:column;gap:8px}.brand img{padding:3px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media(max-width:760px){.sun{right:4%;top:80px;width:95px;height:95px}.weather:after{background:linear-gradient(90deg,#07152195,transparent 95%),linear-gradient(0deg,#0a1b2df0,transparent 65%)}}
/* Photographic live weather wallpaper */
.scene{background:#173a60!important}.scene .mountains,.scene .cloud{display:none}.scene:before,.scene:after{content:'';position:absolute;inset:-8%;background:url('weather-sky.png') center/cover no-repeat;animation:skyMove 48s ease-in-out infinite alternate;transition:filter 2s,opacity 2s}.scene:after{opacity:.17;mix-blend-mode:screen;transform:scale(1.25);animation:skyMove 65s ease-in-out -18s infinite alternate-reverse}.scene .sun{width:65px;height:65px;right:15%;top:42px;background:#fffbea;box-shadow:0 0 35px 18px #fff9df66,0 0 110px 70px #ffe8ad30;z-index:1;opacity:.8}.weather:after{background:linear-gradient(90deg,#041525a8,transparent 95%),linear-gradient(0deg,#071724ed,transparent 70%)}.weather[data-scene=cloud] .scene:before,.weather[data-scene=rain] .scene:before{filter:grayscale(1) brightness(.55);transform:scale(1.8)}.weather[data-scene=cloud] .scene:after,.weather[data-scene=rain] .scene:after{filter:grayscale(1);opacity:.6;mix-blend-mode:normal;background-position:100% 90%}.weather[data-scene=snow] .scene:before{filter:grayscale(.9) brightness(.75)}.weather[data-scene=snow] .scene:after{opacity:.4;filter:grayscale(1)}.weather[data-scene=night] .scene:before,.weather[data-night=true] .scene:before{filter:brightness(.18) saturate(.6)}.weather[data-scene=night] .scene:after,.weather[data-night=true] .scene:after{opacity:.12;filter:brightness(.3)}.weather[data-scene=night] .scene .sun{width:52px;height:52px;background:radial-gradient(circle at 40% 30%,#ecede4,#abb4bd);box-shadow:0 0 40px #cfdded44}.scene .stars{z-index:1}.scene .particles{position:absolute;inset:0;z-index:3}.particles i{height:40px;animation-duration:.8s}.weather[data-scene=snow] .particles i:nth-child(3n){width:7px;height:7px;filter:blur(1px);animation-duration:6s}.paused .scene:before,.paused .scene:after{animation-play-state:paused!important}.weatherAside{display:none}.sceneTools{flex-wrap:wrap}.sceneTools>div{flex-wrap:wrap}.weatherSource{font-size:10px;color:#e1e9ef;margin:0;padding:8px 28px;background:#0c1a27a0}.weatherSource a{color:inherit}.weather[data-mode=preview] .weatherSource{color:#ffd39a}.sceneTools button.active{background:#fff3}.sceneTools button[data-scene=auto]{color:#fff}.weatherBody p{opacity:.9}.locationResults{display:grid;gap:7px;margin:15px 0}.locationResults button{text-align:left}.weatherTop button{background:#07172466}.weatherStats span{color:#e0e5eb}.weatherBody{min-height:270px}@keyframes skyMove{from{translate:-1% 0;scale:1.03}to{translate:4% -2%;scale:1.12}}@media(prefers-reduced-motion:reduce){.scene:before,.scene:after{animation:none!important}}