.ww-national-forecast{padding:28px;border:1px solid #285267;border-radius:10px;--ww-yellow:#ffd36a;--ww-orange:#ff973d}.current-summary{max-width:900px;margin-bottom:30px}.current-summary h2{font-size:30px;margin:10px 0}.current-summary p{line-height:1.7}.national-day h3{margin:0}.city-condition{padding:16px;border-top:1px solid #39718d;line-height:1.5;font-size:14px}.city-condition strong{display:block;color:#80e9ff;font-size:12px;margin-top:12px}.forecast-note{font-size:13px;color:#adc6d3;line-height:1.7}.watch-callout{margin:40px 0;padding:30px;border:1px solid #28615e;background:linear-gradient(120deg,#103b3a,#091e2b);border-radius:10px}.watch-callout h2{font-size:32px;margin:10px 0}.watch-callout p{line-height:1.7}.watch-links,.city-links{display:flex;gap:14px;flex-wrap:wrap}.watch-links a{padding:13px 18px;background:#4fefda;color:#06212b;text-decoration:none;border-radius:5px}.city-links a{padding:16px;background:#0d2533;border:1px solid #274b5b;border-radius:5px;text-decoration:none}.city-directory{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.city-directory a{padding:20px;background:#0d2533;border:1px solid #274b5b;border-radius:5px;text-decoration:none}.city-directory span{display:block;font-size:12px;margin-top:8px;color:#a9c5d3}.forecast-empty{padding:28px;line-height:1.7}button{font:inherit;background:#163b4b;color:#fff;border:1px solid #497180;padding:10px 14px;cursor:pointer}a:focus-visible,button:focus-visible{outline:3px solid #6bffe8;outline-offset:4px}@media(max-width:760px){.ww-national-forecast{padding:20px 12px}.national-days{grid-template-columns:repeat(5,minmax(155px,1fr))}.city-directory{grid-template-columns:1fr 1fr}.watch-links{flex-direction:column}}@media(max-width:420px){.city-directory{grid-template-columns:1fr}}
/* City forecast app: today first, then five compact days. */
.city-weather-app{background:radial-gradient(ellipse at 80% 12%,#12383d 0,transparent 45%),#050b10}.city-weather-app main{max-width:1280px;padding-top:100px}.city-location{display:flex;justify-content:space-between;align-items:center;gap:20px;max-width:none;margin-bottom:24px}.city-location h1{font-size:clamp(28px,3.7vw,46px);margin:8px 0;letter-spacing:-.035em}.city-location h1 span{color:#91aebd;font-weight:400}.change-city{font-size:12px;padding:12px 16px;border:1px solid #34545e;border-radius:24px;text-decoration:none;white-space:nowrap}.city-weather-app .ww-national-forecast{padding:0;border:0;background:none}.today-weather{display:grid;grid-template-columns:1.7fr 1fr;gap:22px;background:linear-gradient(120deg,#143d50,#0d232f 65%);border:1px solid #2b586a;border-radius:22px;padding:32px}.today-visual{display:flex;align-items:center;gap:40px;margin:22px 0}.today-visual>.weather-icon{transform:scale(1.4);margin:10px 22px}.today-temperatures{display:flex;gap:30px;align-items:center}.today-temperatures>div{display:flex;flex-direction:column}.today-temperatures span{font-size:10px;letter-spacing:.12em;color:#a8c4d2}.today-temperatures strong{font-size:clamp(64px,8vw,108px);line-height:1.05;font-weight:500;letter-spacing:-.07em}.today-temperatures .today-low strong{font-size:clamp(44px,5vw,64px);color:#8dc6e0}.today-main h2{font-size:25px;font-weight:400;margin:20px 0}.today-metrics{display:flex;gap:25px;flex-wrap:wrap;padding-top:20px;border-top:1px solid #416170}.today-metrics>span{display:grid;gap:6px;color:#91b2c2;font-size:10px;letter-spacing:.08em}.today-metrics b{font-size:16px;color:#ecf7ff;letter-spacing:0;font-weight:400}.wear-card{align-self:center;background:#06192380;border:1px solid #365461;border-radius:16px;padding:24px}.wear-card>span{font-size:30px;color:#65ead5}.wear-card h3{font-size:25px;margin:12px 0}.wear-card p:not(.eyebrow){font-size:17px;line-height:1.65;color:#e0edf3}.wear-card small{color:#87a4b5;line-height:1.6;display:block}.week-heading{display:flex;justify-content:space-between;align-items:center;margin:28px 0 16px;gap:12px}.week-heading h2{font-size:22px;margin:0}.week-heading>span{font-size:12px;color:#9ab6c4}.city-weather-app .national-days{min-height:0;gap:12px}.city-weather-app .national-day{border-radius:14px;background:linear-gradient(#112f40,#0b202d);border-color:#284b5c}.city-weather-app .national-day.is-today{border-color:#65e7d2}.city-weather-app .national-day h3{background:transparent;font-size:15px;letter-spacing:0;text-transform:none;padding:17px 12px 0}.national-day h3 small{display:block;color:#8cabbc;font-size:10px;font-weight:400;margin-top:6px}.city-weather-app .national-visual{padding:12px 10px;flex-direction:column;min-height:0}.city-weather-app .national-temps{flex-direction:row;align-items:baseline;gap:10px}.city-weather-app .national-temps .high{font-size:32px}.city-weather-app .national-temps .low{font-size:21px}.city-weather-app .city-condition{border:0;text-align:center;font-size:12px;padding:5px 14px 18px}.forecast-detail{margin-top:22px;border:1px solid #284350;border-radius:12px;padding:16px}.forecast-detail summary{cursor:pointer;font-size:14px}.forecast-detail p{line-height:1.7;color:#b9cfda}.city-weather-app .national-source{align-items:center}.city-weather-app .forecast-note{font-size:11px}.city-weather-app .watch-callout{border-radius:18px}.city-weather-app .watch-callout h2{font-size:27px}@media(max-width:760px){.city-weather-app main{padding:82px 16px 30px}.city-location{align-items:flex-start;gap:10px}.city-location h1{font-size:28px}.city-location h1 span{display:block;font-size:19px;margin-top:6px}.city-location .eyebrow{font-size:9px}.change-city{font-size:10px;padding:10px 12px;margin-top:8px}.today-weather{grid-template-columns:1fr;padding:22px;gap:22px;border-radius:18px}.today-visual{gap:22px;justify-content:center;margin:20px 0}.today-visual>.weather-icon{transform:scale(1);margin:0;flex-shrink:0;width:100px}.today-temperatures{gap:16px}.today-temperatures strong{font-size:76px}.today-temperatures .today-low strong{font-size:48px}.today-temperatures span{font-size:8px}.today-main h2{font-size:21px}.wear-card{padding:18px}.wear-card>span{float:right;font-size:24px}.wear-card h3{font-size:20px;margin:8px 0}.wear-card p:not(.eyebrow){font-size:15px;margin:10px 0}.wear-card small{font-size:10px}.week-heading h2{font-size:20px}.week-heading>span{font-size:10px}.city-weather-app .national-days{display:flex;flex-direction:column;overflow:visible;gap:8px}.city-weather-app .national-day{display:grid;grid-template-columns:58px 115px minmax(0,1fr);align-items:center;padding:10px;gap:8px}.city-weather-app .national-day h3{padding:0;text-align:left;font-size:13px}.city-weather-app .national-visual{flex-direction:row;padding:0;gap:0}.city-weather-app .national-visual .weather-icon{width:54px;height:54px;transform:scale(.48);transform-origin:left center;margin-right:-20px;flex-shrink:0}.city-weather-app .national-temps{gap:6px}.city-weather-app .national-temps .high{font-size:23px}.city-weather-app .national-temps .low{font-size:16px}.city-weather-app .city-condition{padding:0;text-align:right;font-size:10px;line-height:1.35}.city-condition strong{font-size:10px;margin-top:5px}.city-weather-app .watch-callout{padding:22px}.city-weather-app .watch-callout h2{font-size:24px}}@media(max-width:360px){.today-weather{padding:16px}.today-visual{gap:8px}.today-temperatures strong{font-size:64px}.city-weather-app .national-day{grid-template-columns:50px 100px minmax(0,1fr);gap:4px}}
@media(max-width:760px){.city-weather-app .national-day{grid-template-columns:50px 132px minmax(0,1fr)}.city-weather-app .national-visual .weather-icon{margin-right:0}.city-weather-app .national-temps{gap:5px}}@media(max-width:360px){.city-weather-app .national-day{grid-template-columns:44px 120px minmax(0,1fr)}.city-weather-app .national-temps .high{font-size:21px}}
