:root{--ink:#20252b;--muted:#6f7882;--line:#e1e5e8;--page:#f2f4f5;--surface:#fff;--nav:#163f50;--nav-deep:#0d2e3c;--accent:#f19a38;--weather:#2581a4;--weather-soft:#e5f4fa;--shadow:0 2px 7px rgba(15,35,45,.08)}
body.weather-clear{--nav:#176b87;--nav-deep:#0e526a;--weather:#e89325;--weather-soft:#fff3d7;--page:#f4f5f1}body.weather-clouds{--nav:#506b7a;--nav-deep:#3a5260;--weather:#667f8e;--weather-soft:#edf2f4}body.weather-rain,body.weather-drizzle{--nav:#315b70;--nav-deep:#234555;--weather:#3f7e9d;--weather-soft:#e4eff4;--page:#eef2f4}body.weather-thunderstorm,body.weather-squall,body.weather-tornado{--nav:#403b60;--nav-deep:#2d2948;--weather:#71669c;--weather-soft:#eeebf6}body.weather-snow{--nav:#527f95;--nav-deep:#3b6579;--weather:#6da6c0;--weather-soft:#edf8fc}body.weather-mist,body.weather-fog,body.weather-haze,body.weather-smoke,body.weather-dust,body.weather-sand,body.weather-ash{--nav:#566a67;--nav-deep:#3f514e;--weather:#778985;--weather-soft:#eef1ef}
*{box-sizing:border-box}html{min-width:320px;scroll-behavior:smooth}body{margin:0;min-height:100vh;color:var(--ink);background:var(--page);font-family:Inter,Arial,sans-serif;transition:background .5s ease}button,input{font:inherit}button{color:inherit}.wide-container,.page-shell{width:min(1160px,calc(100% - 32px));margin:0 auto}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.alert-strip{min-height:32px;display:flex;align-items:center;color:#513312;background:var(--accent);font-size:.72rem;font-weight:600}.alert-strip .wide-container{display:flex;align-items:center;gap:9px}.alert-dot{width:6px;height:6px;flex:0 0 auto;border-radius:50%;background:currentColor;opacity:.75}.alert-updated{margin-left:auto;font-weight:500;opacity:.75}
.main-nav{color:#fff;background:var(--nav);transition:background .5s ease}.nav-inner{min-height:70px;display:flex;align-items:center;gap:30px}.brand{display:inline-flex;align-items:center;flex:0 0 auto;padding:5px 9px;border-radius:5px;background:#fff;text-decoration:none;box-shadow:0 1px 5px rgba(0,0,0,.12)}.brand-logo{display:block;width:122px;height:auto}
.search{position:relative;display:flex;align-items:center;width:min(440px,42vw);margin:0 auto;border-radius:4px;color:var(--ink);background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.15)}.search-icon{width:19px;margin-left:13px;fill:none;stroke:#7a858d;stroke-width:1.8}.search input{min-width:0;width:100%;height:42px;padding:0 9px;border:0;outline:0;color:var(--ink);background:transparent;font-size:.84rem}.locate-button{display:grid;place-items:center;width:42px;height:42px;flex:0 0 auto;border:0;background:transparent;cursor:pointer}.locate-button:hover{background:#f0f3f4}.locate-button svg{width:18px;fill:none;stroke:var(--weather);stroke-width:1.8;stroke-linecap:round}.locate-button.loading svg{animation:spin 1s linear infinite}
.nav-menu{display:flex;align-items:center;gap:4px;flex:0 0 auto}.nav-menu a,.nav-menu button{padding:9px 8px;border:0;color:rgba(255,255,255,.82);background:transparent;text-decoration:none;font-size:.72rem;font-weight:600;cursor:pointer}.nav-menu a:hover,.nav-menu button:hover{color:#fff}.nav-menu a span{color:var(--accent)}.menu-toggle{display:none;width:40px;height:40px;padding:10px;border:0;background:transparent;cursor:pointer}.menu-toggle span{display:block;height:2px;margin:4px 0;border-radius:2px;background:#fff;transition:.18s ease}.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(6px) rotate(45deg)}.menu-toggle[aria-expanded=true] span:nth-child(2){opacity:0}.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-6px) rotate(-45deg)}
.suggestions{position:absolute;z-index:50;top:calc(100% + 6px);left:0;right:0;padding:6px;border:1px solid var(--line);border-radius:5px;color:var(--ink);background:#fff;box-shadow:0 12px 30px rgba(12,35,45,.2)}.suggestions[hidden]{display:none}.suggestion-item{display:flex;align-items:center;gap:10px;width:100%;padding:10px;border:0;border-radius:3px;background:transparent;text-align:left;cursor:pointer}.suggestion-item:hover,.suggestion-item.active,.suggestion-item[aria-selected=true]{background:var(--weather-soft)}.suggestion-pin{display:grid;place-items:center;width:29px;height:29px;flex:0 0 auto;border-radius:50%;color:var(--weather);background:var(--weather-soft)}.suggestion-pin svg{width:14px;fill:none;stroke:currentColor;stroke-width:1.8}.suggestion-copy{min-width:0;display:flex;flex-direction:column;gap:2px}.suggestion-copy strong,.suggestion-copy span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.suggestion-copy strong{font-size:.8rem}.suggestion-copy span,.suggestion-empty{color:var(--muted);font-size:.68rem}.suggestion-empty{margin:0;padding:12px;text-align:center}
.search-clear{display:grid;place-items:center;width:28px;height:28px;flex:0 0 auto;padding:0;border:0;border-radius:50%;color:#7c868d;background:transparent;font-size:1.05rem;line-height:1;cursor:pointer}.search-clear[hidden]{display:none}.search-clear:hover{color:var(--ink);background:#eef1f2}.suggestions{max-height:min(410px,70vh);padding:0;overflow-y:auto;border-radius:7px}.suggestion-header{display:flex;align-items:center;justify-content:space-between;padding:10px 12px 7px;color:var(--muted);font-size:.6rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase}.suggestion-header button{padding:3px 0;border:0;color:var(--weather);background:transparent;font-size:.61rem;font-weight:600;text-transform:none;letter-spacing:0;cursor:pointer}.suggestion-item{position:relative;padding:10px 12px;border-radius:0}.suggestion-item+.suggestion-item{border-top:1px solid #f0f2f3}.suggestion-item.active:after{content:"Press Enter";margin-left:auto;color:var(--weather);font-size:.56rem;font-weight:600}.suggestion-copy strong mark{padding:0;color:inherit;background:#ffe2a8}.suggestion-meta{display:flex!important;align-items:center;gap:5px}.country-code{margin-left:auto;padding:3px 6px;border-radius:3px;color:var(--muted);background:#f2f4f5;font-size:.57rem;font-weight:700}.suggestion-footer{padding:8px 12px;border-top:1px solid var(--line);color:#8a9399;background:#fafbfb;font-size:.57rem;text-align:center}.suggestion-state{display:flex;align-items:center;justify-content:center;gap:9px;min-height:62px;padding:12px;color:var(--muted);font-size:.7rem}.suggestion-spinner{width:16px;height:16px;border:2px solid #dfe4e6;border-top-color:var(--weather);border-radius:50%;animation:spin .7s linear infinite}.recent-icon{font-size:.9rem}
.subnav{color:#fff;background:var(--nav-deep);transition:background .5s ease}.subnav-inner{min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:30px}.location-heading{display:flex;align-items:center;gap:10px;min-width:0}.location-heading svg{width:19px;flex:0 0 auto;fill:none;stroke:var(--accent);stroke-width:1.8}.location-heading div{min-width:0;display:flex;flex-direction:column;gap:3px}.location-heading strong{overflow:hidden;font-size:.9rem;text-overflow:ellipsis;white-space:nowrap}.location-status{color:rgba(255,255,255,.62);font-size:.66rem}.section-links{align-self:stretch;display:flex}.section-links a{position:relative;display:grid;place-items:center;min-width:72px;padding:0 12px;color:rgba(255,255,255,.72);text-decoration:none;font-size:.72rem;font-weight:600}.section-links a:hover,.section-links a.active{color:#fff;background:rgba(255,255,255,.05)}.section-links a.active:after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:3px;background:var(--accent)}
.page-shell{padding:24px 0 42px}.message{margin-bottom:16px;padding:12px 15px;border-left:4px solid #b94d44;color:#79342e;background:#fce9e7;font-size:.8rem}.content-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,.75fr);gap:18px;align-items:start}.main-column,.side-column{display:grid;gap:18px}.panel{border:1px solid var(--line);border-radius:3px;background:var(--surface);box-shadow:var(--shadow);overflow:hidden}.panel-header{min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:17px 22px;border-bottom:1px solid var(--line)}.panel-header.compact{min-height:66px}.section-kicker{margin:0 0 4px;color:var(--weather);font-size:.61rem;font-weight:700;letter-spacing:.12em}h1,h2{margin:0;font-family:Outfit,sans-serif;letter-spacing:-.025em}h1{font-size:1.35rem}h2{font-size:1.15rem}.local-time{padding:7px 10px;border-radius:3px;color:var(--muted);background:var(--page);font-size:.72rem;font-weight:600}.panel-note{color:var(--muted);font-size:.66rem}
.current-summary{min-height:225px;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;padding:20px 28px}.current-temperature{display:flex;align-items:center}.weather-icon{width:145px;height:145px;object-fit:contain;filter:drop-shadow(0 8px 10px rgba(22,60,75,.12))}.temp{margin:0;font-family:Outfit,sans-serif;font-size:clamp(4.8rem,8vw,7rem);line-height:.85;letter-spacing:-.065em;font-weight:500}.temp sup{margin-left:6px;font-size:.22em;vertical-align:top;letter-spacing:0}.current-description{padding-left:30px;border-left:1px solid var(--line)}.condition{margin:0 0 6px;font-family:Outfit,sans-serif;font-size:1.6rem;font-weight:600;text-transform:capitalize}.feels-like{margin:0;color:var(--muted);font-size:.8rem}.weather-tip{margin:18px 0 0;padding-left:11px;border-left:3px solid var(--accent);color:#4d5861;font-size:.78rem;line-height:1.5}.current-metrics{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);background:#fafbfb}.current-metrics>div{display:flex;flex-direction:column;gap:5px;padding:16px 20px}.current-metrics>div:not(:last-child){border-right:1px solid var(--line)}.current-metrics span{color:var(--muted);font-size:.66rem}.current-metrics strong{font-size:.82rem}.current-metrics b{font-weight:600}
.hourly-scroll{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(100px,1fr);overflow-x:auto;scrollbar-width:thin}.hour-card{min-height:175px;display:flex;flex-direction:column;align-items:center;padding:17px 10px;border-right:1px solid var(--line);text-align:center}.hour-card:first-child{background:var(--weather-soft)}.hour-time{color:var(--muted);font-size:.68rem;font-weight:600}.hour-card img{width:61px;height:61px;object-fit:contain}.hour-temp{font-family:Outfit,sans-serif;font-size:1.25rem;font-weight:600}.hour-desc{margin-top:4px;color:var(--muted);font-size:.62rem;text-transform:capitalize}.hour-pop{margin-top:auto;color:var(--weather);font-size:.62rem;font-weight:600}.forecast-placeholder{width:120px;height:175px;border-right:1px solid var(--line);background:linear-gradient(100deg,#f4f5f5 30%,#fafafa 50%,#f4f5f5 70%);background-size:300% 100%;animation:shimmer 1.4s infinite}
.daily-list{padding:0 20px}.daily-row{min-height:78px;display:grid;grid-template-columns:1.2fr 70px 1fr .8fr;align-items:center;gap:10px;border-bottom:1px solid var(--line)}.daily-row:last-child{border-bottom:0}.daily-day{display:flex;flex-direction:column;gap:3px}.daily-day strong{font-size:.8rem}.daily-day span,.daily-condition,.daily-rain{color:var(--muted);font-size:.66rem}.daily-weather{display:flex;align-items:center;justify-content:center}.daily-weather img{width:51px;height:51px}.daily-temps{font-family:Outfit,sans-serif;font-size:1rem;font-weight:600}.daily-temps span{margin-left:8px;color:#899198;font-weight:500}.daily-rain{text-align:right}.daily-placeholder{height:78px;border-bottom:1px solid var(--line);background:linear-gradient(100deg,#fff 20%,#f6f7f7 45%,#fff 70%);background-size:300% 100%;animation:shimmer 1.4s infinite}
.detail-list{margin:0;padding:4px 20px}.detail-list div{min-height:49px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line)}.detail-list div:last-child{border-bottom:0}.detail-list dt{color:var(--muted);font-size:.7rem}.detail-list dd{margin:0;font-size:.75rem;font-weight:600;text-align:right}
.sun-panel{padding-bottom:20px}.sun-arc{position:relative;height:58px;margin:32px 30px 0;overflow:hidden;border-top:2px dashed #e8ad59;border-radius:50% 50% 0 0}.sun-dot{position:absolute;top:-7px;left:var(--sun-progress,50%);width:14px;height:14px;transform:translateX(-50%);border-radius:50%;background:var(--accent);box-shadow:0 0 0 6px rgba(241,154,56,.18)}.sun-times{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:0 20px;text-align:center}.sun-times div{display:flex;flex-direction:column;gap:4px}.sun-times span{color:var(--muted);font-size:.62rem}.sun-times strong{font-size:.75rem}
.air-summary{padding:20px}.aqi-badge{display:grid;place-items:center;min-width:38px;height:28px;padding:0 8px;border-radius:3px;color:#276a43;background:#dff3e7;font-size:.72rem;font-weight:700}.aqi-badge.aqi-2{color:#725b13;background:#f7efc9}.aqi-badge.aqi-3{color:#884d1f;background:#fae4ce}.aqi-badge.aqi-4,.aqi-badge.aqi-5{color:#842e31;background:#f8d9da}.air-summary strong{font-family:Outfit,sans-serif;font-size:1.15rem}.air-summary p{margin:6px 0 0;color:var(--muted);font-size:.7rem;line-height:1.45}.pollutant-grid{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line)}.pollutant-grid div{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:3px;padding:13px 16px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.pollutant-grid span{grid-column:1/-1;color:var(--muted);font-size:.6rem}.pollutant-grid strong{font-size:.78rem}.pollutant-grid small{color:var(--muted);font-size:.52rem}
.site-footer{padding:26px 0;color:rgba(255,255,255,.65);background:#102e3b;font-size:.67rem}.site-footer .wide-container{display:flex;justify-content:space-between;gap:20px}.site-footer strong{color:#fff}.info-dialog{width:min(540px,calc(100% - 28px));padding:28px;border:0;border-radius:4px;color:var(--ink);background:#fff;box-shadow:0 25px 70px rgba(6,25,35,.3)}.info-dialog::backdrop{background:rgba(8,27,36,.65)}.info-dialog h2{margin-bottom:20px}.dialog-close{position:absolute;top:14px;right:14px;width:34px;height:34px;border:1px solid var(--line);border-radius:50%;background:#fff;font-size:1.25rem;cursor:pointer}.faq-list{border-top:1px solid var(--line)}.faq-list details{border-bottom:1px solid var(--line)}.faq-list summary{padding:15px 0;font-size:.82rem;font-weight:600;cursor:pointer}.faq-list p,.agreement-copy p{color:var(--muted);font-size:.76rem;line-height:1.65}
.loading .temp span,.loading .condition,.loading .current-metrics strong{color:transparent;border-radius:3px;background:#edf0f1}@keyframes spin{to{transform:rotate(360deg)}}@keyframes shimmer{from{background-position:100% 0}to{background-position:0 0}}
@media(max-width:900px){.nav-inner{gap:16px}.search{width:min(480px,55vw)}.menu-toggle{display:block;margin-left:auto}.nav-menu{position:absolute;z-index:60;top:66px;right:16px;display:none;width:230px;padding:8px;border-radius:4px;background:var(--nav-deep);box-shadow:0 12px 30px rgba(0,0,0,.25)}.nav-menu.open{display:grid}.nav-menu a,.nav-menu button{width:100%;padding:11px;text-align:left}.content-grid{grid-template-columns:1fr}.side-column{grid-template-columns:repeat(2,1fr)}.air-panel{grid-column:1/-1}}
@media(max-width:680px){.alert-updated{display:none}.nav-inner{min-height:64px;flex-wrap:wrap;padding:12px 0}.brand{padding:4px 8px}.brand-logo{width:108px}.search{order:3;width:100%;margin:0}.menu-toggle{margin-left:auto}.nav-menu{top:58px}.subnav-inner{display:block;padding-top:12px}.section-links{height:44px;margin-top:8px;overflow-x:auto}.section-links a{min-width:75px;flex:1}.content-grid,.main-column,.side-column{gap:12px}.page-shell{padding-top:12px}.panel-header{padding:15px 17px}.current-summary{grid-template-columns:1fr;padding:10px 18px 20px}.current-temperature{justify-content:center}.weather-icon{width:120px;height:120px}.temp{font-size:5.5rem}.current-description{padding:10px 0 0;border:0;text-align:center}.weather-tip{display:inline-block;text-align:left}.current-metrics{grid-template-columns:repeat(2,1fr)}.current-metrics>div{padding:13px 16px}.current-metrics>div:nth-child(2){border-right:0}.current-metrics>div:nth-child(-n+2){border-bottom:1px solid var(--line)}.daily-list{padding:0 14px}.daily-row{grid-template-columns:1fr 55px .8fr}.daily-condition{display:none}.side-column{grid-template-columns:1fr}.air-panel{grid-column:auto}.site-footer .wide-container{flex-direction:column}}
@media(max-width:390px){.wide-container,.page-shell{width:min(100% - 20px,1160px)}.current-temperature{justify-content:flex-start}.weather-icon{width:105px;height:105px}.temp{font-size:4.8rem}.panel-note{display:none}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
@media(max-width:480px){.suggestion-item.active:after{display:none}.country-code{font-size:.52rem}.suggestion-footer{display:none}}