.weather-dashboard{max-width:1440px;margin:auto;padding:32px 24px 56px;color:var(--color-light-primary,#edf3f9)}
.weather-dashboard-intro{margin:0 0 24px}.weather-dashboard-intro h1{font-size:clamp(28px,4vw,40px);line-height:1.15;margin:8px 0 12px;font-weight:600}.weather-dashboard-intro p{line-height:1.6;margin:0;opacity:.75}.weather-eyebrow{font-size:11px;letter-spacing:.12em}
.weather-view-note{font-size:13px;line-height:1.5;opacity:.7;margin:0 0 22px}.weather-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px;align-items:start}.weather-station{min-width:0}.weather-station-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 4px 12px}.weather-station-heading h2{font-size:20px;line-height:1.3;margin:0 0 3px;font-weight:600}.weather-station-heading span{font-size:12px;opacity:.7}.weather-station-heading a{font-size:12px;color:inherit;text-decoration:none;white-space:nowrap;opacity:.8}.weather-station .rh-history{margin:0}.weather-stats-card{background:var(--color-nav-primary,#22292f);border-radius:16px;padding:22px;min-height:160px}.weather-stats-latest{display:flex;justify-content:space-between;align-items:baseline;gap:14px;margin-bottom:22px}.weather-stats-latest strong{font-size:36px;font-weight:500;letter-spacing:-1px}.weather-stats-latest span{font-size:12px;opacity:.7}.weather-stats-metrics{display:grid;grid-template-columns:1fr 1fr;gap:12px}.weather-stat{background:rgba(128,128,128,.08);border-radius:10px;padding:14px;min-width:0}.weather-stat h3{font-size:12px;font-weight:500;opacity:.75;margin:0 0 10px}.weather-stat p{font-size:17px;margin:0;line-height:1.5}.weather-stat small{display:block;font-size:11px;opacity:.65;margin-top:4px;line-height:1.5}.weather-stats-note{font-size:12px;line-height:1.6;opacity:.7;margin:18px 0 0}
#weather-dashboard-status:empty{display:none}#weather-dashboard-status{padding:32px 0;font-size:14px}
.weather-retry{font:inherit;color:inherit;background:var(--color-nav-primary,#22292f);border:0;border-radius:8px;padding:10px 16px;margin-left:12px;cursor:pointer}
@media(max-width:900px){.weather-card-grid{grid-template-columns:minmax(0,1fr);max-width:780px}.weather-dashboard{padding:24px 16px 40px}}
@media(max-width:480px){.weather-dashboard{padding:22px 12px 36px}.weather-dashboard-intro p{font-size:13px}.weather-eyebrow{font-size:10px!important}.weather-stats-card{padding:18px 14px}.weather-stat{padding:12px}.weather-station-heading h2{font-size:18px}}


.weather-stat p { font-weight: 600; font-variant-numeric: tabular-nums; }
.weather-stat[data-metric="temperature-high"] p { color: #f4ad78; }
.weather-stat[data-metric="temperature-low"] p { color: #91bdf2; }
.weather-stat[data-metric="peak-gust"] p { color: #f4a261; }
.weather-stat[data-metric="strongest-average-wind"] p { color: #8bb4f0; }
.weather-stat[data-metric="humidity-range"] p { color: #8bc9c6; }
.weather-stat[data-metric="lowest-wind-chill"] p { color: #a9c5e2; }
.weather-stat.is-unavailable p { color: inherit; opacity: .55; font-weight: 400; }

.weather-dashboard-hero { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; min-height: 17rem; padding: 28px; border-radius: 18px; background: #0d1220; color: #fff; }
.weather-dashboard-hero-image { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: center 48%; }
.weather-dashboard-hero::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(6,8,14,.12) 0%, rgba(6,8,14,.2) 30%, rgba(6,8,14,.82) 100%), linear-gradient(90deg, rgba(6,8,14,.22), transparent 75%); }
.weather-dashboard-hero .weather-eyebrow { opacity: .85; }
.weather-dashboard-hero p:last-child { max-width: 620px; opacity: .85; }
@media (min-width: 1000px) { .weather-dashboard-hero { min-height: 19rem; } }
@media (max-width: 480px) { .weather-dashboard-hero { min-height: 17rem; padding: 22px 18px; } .weather-dashboard-hero-image { object-position: 53% center; } }

.weather-chart-nav + .weather-dashboard { padding-top: 24px; }