:root{
  --navy:#13294B; --sky:#1F6FB2; --sun:#F5A623; --mist:#F3F7FB; --line:#D9E3EE;
  --ink:#16202E; --sub:#5A6878;
  --font:"Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--mist);color:var(--ink);font:16px/1.5 var(--font)}
a{color:var(--sky)}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--sun);outline-offset:2px}
.wrap{max-width:1180px;margin:0 auto;padding:0 18px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.wx{width:30px;height:30px;flex:none}
.wx-xl{width:84px;height:84px}

.mast{background:var(--navy);color:#fff}
.mast-in{display:flex;align-items:center;gap:24px;min-height:64px;flex-wrap:wrap}
.logo{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font-weight:800;font-size:21px;letter-spacing:-.01em}
.search{display:flex;margin-left:auto;flex:1;max-width:420px}
.search input{flex:1;min-width:0;border:0;border-radius:6px 0 0 6px;padding:10px 12px;font:15px var(--font)}
.search button{border:0;background:var(--sun);color:var(--navy);font-weight:700;padding:0 16px;border-radius:0 6px 6px 0;cursor:pointer;font-size:15px}
.strip{display:flex;gap:20px;overflow-x:auto;padding-top:8px;padding-bottom:10px;font-size:14px;scrollbar-width:none}
.strip a{color:#b9cbe4;text-decoration:none;white-space:nowrap}
.strip a:hover{color:#fff}

.alerts{background:#fff;border-bottom:1px solid var(--line)}
.alerts .wrap{display:flex;flex-wrap:wrap;gap:8px;padding-top:10px;padding-bottom:10px}
.alert{font-size:14px;text-decoration:none;color:var(--ink);padding:6px 12px;border-radius:4px;border-left:5px solid}
.alert.lvl1{background:#fdecea;border-color:#c0392b}
.alert.lvl2{background:#fff1e0;border-color:#e67e22}
.alert.lvl3{background:#fff8dc;border-color:#d4ac0d}

.lead-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:20px;padding-top:24px;padding-bottom:28px}
.now{border-radius:14px;padding:26px 30px;color:#fff;background:linear-gradient(135deg,#1F6FB2,#4b9ad8)}
.now.is-night{background:linear-gradient(135deg,#13294B,#2e4a7a)}
.now-place{margin:0;font-size:20px;font-weight:700}
.now-place a{color:#fff;text-decoration:none}
.now-place span{font-weight:400;font-size:14px;opacity:.85;margin-left:6px}
.now-main{display:flex;align-items:center;gap:28px;margin:6px 0}
.now-temp{font-size:clamp(84px,12vw,132px);font-weight:300;line-height:1;margin:0;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.now-cond{margin:4px 0 0;font-size:20px;font-weight:600}
.now-meta{margin:0;opacity:.92}
.now .wx{color:#fff}
.now-wide{margin-top:24px}

.five{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px 22px}
.h{font-size:19px;margin:0 0 12px;letter-spacing:-.01em}
.sub{margin:-6px 0 16px;color:var(--sub);font-size:14px}
.five-list{list-style:none;margin:0 0 10px;padding:0}
.five-list li{display:grid;grid-template-columns:60px 34px 1fr auto;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #edf2f7}
.five-list .d{font-weight:600}
.five-list .pop,.hours .pop,.w-pop{color:var(--sky);font-size:13px;font-weight:600}
.five-list .hl{font-variant-numeric:tabular-nums;color:var(--sub)}
.five-list .hl b{color:var(--ink)}
.more{font-weight:600;font-size:15px}

.grid{list-style:none;margin:0 0 48px;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:10px}
.tile{display:grid;grid-template-columns:62px 1fr 30px 84px;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 14px;text-decoration:none;color:var(--ink)}
.tile:hover{border-color:var(--sky)}
.tile-name{font-weight:650;line-height:1.2}
.tile-name small{display:block;font-weight:400;color:var(--sub);font-size:13px}
.tile-hl{font-size:13px;color:var(--sub);font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}
.chip{display:inline-block;min-width:52px;text-align:center;padding:6px 8px;border-radius:7px;font-weight:800;font-size:18px;font-variant-numeric:tabular-nums}
/* temperature colour scale, 10 °F bands from <0 to 110+ */
.band0{background:#7b5ea7;color:#fff}.band1{background:#5b6fc2;color:#fff}.band2{background:#3d86d1;color:#fff}
.band3{background:#3ba3d9;color:#fff}.band4{background:#49bfc6;color:#10303a}.band5{background:#6fcf97;color:#10303a}
.band6{background:#a8d672;color:#203010}.band7{background:#e4d75a;color:#3a3000}.band8{background:#f5b942;color:#3a2600}
.band9{background:#f08a3c;color:#fff}.band10{background:#e2583a;color:#fff}.band11{background:#c33140;color:#fff}.band12{background:#8e1f3b;color:#fff}
.now.is-hot{background:linear-gradient(135deg,#c9542a,#f0a032)}
.now.is-cold{background:linear-gradient(135deg,#3d5fa8,#6f9bd6)}

.facts{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin:16px 0 28px}
.facts div{background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.facts dt{font-size:13px;color:var(--sub)}
.facts dd{margin:2px 0 0;font-weight:700;font-size:18px}
.hours{list-style:none;padding:0;margin:0 0 32px;display:grid;grid-template-columns:repeat(12,minmax(64px,1fr));gap:6px;overflow-x:auto}
.hours li{background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 4px;display:flex;flex-direction:column;align-items:center;gap:4px}
.hours .t{font-size:13px;color:var(--sub)}
.hours b{font-size:18px}
.week{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-bottom:48px}
.week th,.week td{padding:12px 14px;border-bottom:1px solid #edf2f7;text-align:left}
.week th{font-weight:650;width:150px}
.week th small{display:block;font-weight:400;color:var(--sub);font-size:13px}
.w-ic{width:46px}
.w-temp{white-space:nowrap}
.w-temp .lo{color:var(--sub);margin-left:6px}
.w-wind{color:var(--sub);font-size:14px;white-space:nowrap}
.page{padding-top:32px;padding-bottom:48px;min-height:50vh}
.h1{font-size:30px;letter-spacing:-.02em;margin:0 0 16px}
.prose p{max-width:40em}

.foot{background:#fff;border-top:1px solid var(--line);font-size:14px;color:var(--sub)}
.foot-in{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:20px;padding-bottom:20px}
.foot p{margin:0}
.foot-links{display:flex;gap:16px}
.foot-links a{color:var(--sub)}

@media (max-width:900px){
  .lead-grid{grid-template-columns:1fr}
  .facts{grid-template-columns:repeat(3,1fr)}
  .week .w-cond,.week .w-wind{display:none}
}
@media (max-width:420px){.grid{grid-template-columns:1fr}.tile{grid-template-columns:56px 1fr 30px}.tile-hl{display:none}}
@media (max-width:520px){.facts{grid-template-columns:repeat(2,1fr)}.search{max-width:none;margin-left:0}}