/* Weather workspace v2: summary -> daily outlook -> detailed forecast + radar. */
body.weather-dashboard { background: #f2f6fa; color: #233e53; }
.weather-dashboard .pw-header { padding: 18px max(28px, calc((100vw - 1600px) / 2)); gap: 14px; }
.weather-dashboard .pw-header h1 { font-size: 22px; }
.pw-header-actions { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.pw-location-picker { display: flex; align-items: center; gap: 12px; padding: 8px 16px; border: 1px solid #dce7ee; border-radius: 12px; background: #f8fbfd; }
.pw-location-picker > i { color: #1787a5; font-size: 22px; }
.pw-location-picker label { display: block; color: #8295a4; font-size: 10px; }
.pw-location-picker select { border: 0; background: transparent; font-size: 16px; color: #274e66; font-weight: 700; width: 205px; padding: 2px 0; cursor: pointer; }
.pw-refresh-all { border: 1px solid #dce7ee; border-radius: 12px; padding: 13px 16px; background: white; display: flex; gap: 8px; align-items: center; color: #57748a; font-size: 13px; }
.pw-refresh-all:disabled { opacity: .45; }
.pw-dashboard-content { width: calc(100% - 56px); max-width: 1600px; margin: 26px auto 0; }
.pw-overview { display: grid; grid-template-columns: minmax(300px, .75fr) minmax(0, 1.8fr); gap: 20px; }
.pw-current-card { position: relative; padding: 24px; border-radius: 22px; background: radial-gradient(ellipse at 95% 5%, #268b9eaa, transparent 65%), #133c52; color: #fff; overflow: hidden; }
.pw-current-top { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; color: #d9eef2; }
.pw-model-tag { background: #ffffff17; border: 1px solid #ffffff20; border-radius: 20px; font-size: 10px; padding: 3px 8px; white-space: nowrap; }
.pw-current-main { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 16px 0 4px; }
.pw-temperature { display: flex; align-items: flex-start; font-size: clamp(48px, 4vw, 70px); letter-spacing: -.06em; line-height: 1.2; font-weight: 600; }
.pw-temperature small { font-size: 24px; font-weight: 400; letter-spacing: 0; padding-top: 6px; padding-left: 4px; color: #a9d4e0; }
.pw-current-main > i { font-size: 65px; color: #b6e8ef; text-shadow: 0 8px 25px #041e2b40; }
.pw-current-main strong { font-size: 15px; font-weight: 500; }
.pw-current-card > p { font-size: 10px; color: #95bdcc; margin: 8px 0 18px; }
.pw-current-details { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #ffffff20; padding-top: 17px; gap: 10px; }
.pw-current-details div { min-width: 0; }
.pw-current-details i { color: #86c5d6; font-size: 16px; }
.pw-current-details small { display: block; margin-top: 4px; color: #a2c2d0; font-size: 10px; }
.pw-current-details strong { display: block; font-size: 13px; margin-top: 4px; font-weight: 500; }
.pw-outlook-card { background: white; border: 1px solid #e2ebf2; border-radius: 22px; padding: 23px 26px 14px; min-width: 0; }
.pw-card-title { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.pw-card-title h2, .pw-section-title h2, .pw-workspace-heading h2 { font-size: 20px; font-weight: 700; margin: 4px 0 0; }
.pw-outlook-category { background: #edf8fd; color: #1686af; padding: 7px 12px; border-radius: 10px; font-size: 12px; font-weight: 600; }
.pw-summary-metrics { display: grid; grid-template-columns: 1fr 1fr 1.3fr; margin-top: 18px; gap: 16px; }
.pw-summary-metrics > div { border-right: 1px solid #e8eff4; padding-right: 12px; }
.pw-summary-metrics > div:last-child { border-right: 0; }
.pw-summary-metrics small { font-size: 11px; color: #8699a6; display: block; margin-bottom: 5px; }
.pw-summary-metrics strong { font-size: 27px; color: #256c8a; line-height: 1.4; font-weight: 600; }
.pw-summary-metrics em { font-size: 12px; font-style: normal; color: #8a9ca9; font-weight: 400; }
.pw-summary-metrics .pw-summary-start { font-size: 17px; }
.pw-summary-chart .pw-chart { height: 86px; }
.pw-summary-chart .pw-chart-caption { font-size: 9px; }
.weather-dashboard .pw-data-note { padding: 12px 0 0; margin-top: 5px; border-top: 1px solid #edf2f6; font-size: 10px; }
.pw-section-title, .pw-workspace-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin: 27px 0 14px; }
.pw-section-title p, .pw-workspace-heading p { font-size: 11px; color: #7f94a4; margin: 5px 0 0; }
.pw-soft-label { color: #7b93a5; font-size: 10px; background: #e8f0f6; border-radius: 20px; padding: 5px 10px; white-space: nowrap; }
.weather-dashboard .pw-day-cards { padding: 0; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; }
.weather-dashboard .pw-day { text-align: left; padding: 15px; border-radius: 15px; box-shadow: none; min-height: 150px; transition: border-color .2s, background .2s, transform .2s; }
.weather-dashboard button.pw-day { cursor: pointer; }
.weather-dashboard .pw-day:first-child { background: white; border-color: #dbe9f2; }
.weather-dashboard .pw-day[aria-pressed="true"] { background: #ecf8fc; border-color: #71bed8; box-shadow: 0 0 0 2px #87cfe01c; }
.weather-dashboard button.pw-day:hover { border-color: #89bace; transform: translateY(-2px); }
.weather-dashboard .pw-day .pw-condition-icon { position: static; display: block; font-size: 26px; margin: 7px 0; }
.weather-dashboard .pw-day strong { font-size: 14px; color: #345b73; margin-bottom: 7px; }
.weather-dashboard .pw-day-metrics { display: flex; flex-direction: column; gap: 4px; font-size: 11px; }
.pw-day-prob { font-size: 10px; color: #6e96ac; }
.weather-dashboard .pw-tabs { background: #e4edf4; border: 0; padding: 4px; border-radius: 12px; gap: 3px; }
.weather-dashboard .pw-tabs button { font-size: 12px; padding: 9px 15px; min-height: 38px; }
.weather-dashboard .pw-tabs button[aria-selected="true"] { background: white; color: #1b7799; box-shadow: 0 3px 9px #274c6b0a; }
.pw-workspace { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(350px, 1fr); gap: 20px; align-items: start; }
.pw-workspace.pw-radar-focus { grid-template-columns: 1fr; }
.weather-dashboard .pw-forecast-panel { background: white; border: 1px solid #e2ebf2; border-radius: 20px; padding: 22px; min-width: 0; }
.weather-dashboard .pw-forecast-heading h2 { font-size: 18px; }
.weather-dashboard .pw-forecast-heading p { font-size: 10px; margin-bottom: 5px; }
.pw-selected-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 20px 0 12px; }
.pw-selected-metrics div { background: #f4f8fb; border-radius: 11px; padding: 11px; }
.pw-selected-metrics small { display: block; color: #8b9ca8; font-size: 10px; }
.pw-selected-metrics strong { display: block; font-size: 14px; color: #3e6a83; margin-top: 5px; }
.weather-dashboard .pw-hourly-chart { border: 0; border-radius: 0; padding: 4px 3px 12px; margin: 10px 0; }
.weather-dashboard .pw-hourly-chart .pw-chart { height: 130px; gap: 5px; }
.pw-hour-table-wrap { overflow-x: auto; }
.pw-hour-table { width: 100%; border-collapse: collapse; white-space: nowrap; font-size: 11px; }
.pw-hour-table th { background: #f4f8fb; font-weight: 500; padding: 12px 10px; color: #7a91a3; }
.pw-hour-table td { padding: 13px 10px; border-bottom: 1px solid #edf2f5; color: #52728a; }
.pw-hour-table td strong { color: #1c86ad; font-size: 13px; }
.pw-hour-table td time { color: #2f536d; font-weight: 600; }
.pw-hour-table tbody tr:focus { outline: 2px solid #68b8d4; outline-offset: -2px; background: #f1fbfe; }
.pw-hour-table .pw-wind i { display: inline-block; margin-right: 5px; }
.weather-dashboard .pw-radar-panel { min-width: 0; display: flex; flex-direction: column; border: 1px solid #e2ebf2; border-radius: 20px; overflow: hidden; background: white; }
.pw-radar-heading { padding: 20px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.pw-radar-heading h2 { font-size: 17px; font-weight: 700; margin: 0; }
.pw-radar-heading h2 i { color: #3195b1; margin-right: 5px; }
.pw-radar-heading p { color: #90a1ae; font-size: 10px; margin: 6px 0 0; }
.weather-dashboard .pw-map-wrap { min-height: 390px; }
.weather-dashboard .pw-map { height: 390px; }
.weather-dashboard .pw-map-caption { font-size: 10px; top: 12px; left: 52px; padding: 8px; }
.weather-dashboard .pw-map-center { width: 34px; height: 34px; right: 12px; top: 12px; font-size: 17px; }
.weather-dashboard .pw-radar-legend { left: 10px; right: 10px; bottom: 27px; font-size: 10px; padding: 8px; }
.weather-dashboard .pw-radar-legend small { font-size: 9px; }
.weather-dashboard .pw-timeline { gap: 9px; padding: 14px 16px 9px; }
.weather-dashboard .pw-play { width: 35px; height: 35px; font-size: 18px; }
.weather-dashboard .pw-selected-time { min-width: 68px; }
.weather-dashboard .pw-selected-time strong { font-size: 14px; }
.weather-dashboard .pw-selected-time small { font-size: 9px; }
.weather-dashboard .pw-icon-button { width: 30px; height: 30px; }
.weather-dashboard .pw-radar-note { padding: 0 16px 12px; line-height: 1.7; font-size: 9px; }
.pw-radar-help { display: flex; gap: 10px; color: #7e96a6; background: #f7fafc; border-top: 1px solid #eaf1f5; padding: 14px 16px; }
.pw-radar-help p { margin: 0; font-size: 10px; line-height: 1.8; }
.pw-radar-focus .pw-map { height: min(66dvh, 650px); min-height: 400px; }
.weather-dashboard .pw-footer { margin: 22px 0; border-top: 1px solid #dfe9ef; padding: 20px 0; }
@media (max-width: 1100px) { .pw-workspace { grid-template-columns: 1fr; } .weather-dashboard .pw-header { padding: 16px 24px; } .pw-overview { grid-template-columns: 320px 1fr; } .weather-dashboard .pw-day-cards { gap: 7px; } .weather-dashboard .pw-day { padding: 12px 9px; } }
@media (max-width: 800px) { .pw-overview { grid-template-columns: 1fr; } .pw-current-card { padding: 22px; } .pw-current-main { margin: 10px 0; } .pw-current-details { padding-top: 12px; } .weather-dashboard .pw-day-cards { display: flex; overflow-x: auto; padding: 3px 2px 10px; scroll-snap-type: x proximity; } .weather-dashboard .pw-day { min-width: 132px; flex-shrink: 0; scroll-snap-align: start; } .pw-workspace-heading { align-items: flex-start; flex-direction: column; } .weather-dashboard .pw-tabs { width: 100%; } }
@media (max-width: 640px) {
    .weather-dashboard .pw-header { padding: 13px 15px; flex-wrap: wrap; gap: 10px; }
    .weather-dashboard .pw-header h1 { font-size: 18px; }
    .pw-header-actions { width: 100%; margin-left: 0; gap: 8px; }
    .pw-location-picker { flex: 1; min-width: 0; padding: 8px 12px; }
    .pw-location-picker div { flex: 1; min-width: 0; }
    .pw-location-picker select { width: 100%; font-size: 15px; }
    .pw-refresh-all { padding: 12px; }
    .pw-refresh-all span { display: none; }
    .pw-dashboard-content { width: calc(100% - 28px); margin-top: 15px; }
    .pw-overview { gap: 13px; }
    .pw-current-card, .pw-outlook-card { border-radius: 18px; padding: 20px; }
    .pw-current-main > i { font-size: 60px; }
    .pw-temperature { font-size: 58px; }
    .pw-current-details strong { font-size: 12px; }
    .pw-card-title h2 { font-size: 17px; }
    .pw-outlook-category { font-size: 10px; padding: 6px 8px; }
    .pw-summary-metrics { gap: 8px; grid-template-columns: 1fr 1fr; }
    .pw-summary-metrics > div { padding-right: 8px; }
    .pw-summary-metrics > div:nth-child(2) { border: 0; }
    .pw-summary-metrics > div:last-child { grid-column: 1 / -1; padding-top: 8px; }
    .pw-summary-metrics strong { font-size: 25px; }
    .pw-summary-metrics .pw-summary-start { font-size: 14px; }
    .pw-section-title h2, .pw-workspace-heading h2 { font-size: 18px; }
    .pw-section-title .pw-soft-label { display: none; }
    .weather-dashboard .pw-forecast-panel { padding: 17px 14px; border-radius: 16px; }
    .weather-dashboard .pw-forecast-heading h2 { font-size: 16px; }
    .weather-dashboard .pw-forecast-heading select { max-width: 120px; }
    .pw-selected-metrics { grid-template-columns: repeat(2, 1fr); }
    .pw-selected-metrics strong { font-size: 13px; }
    .pw-hour-table { min-width: 590px; }
    .weather-dashboard .pw-hourly-chart .pw-chart { gap: 3px; }
    .weather-dashboard .pw-map { height: 400px; }
    .pw-radar-focus .pw-map { height: 55dvh; min-height: 350px; }
    .pw-radar-heading { padding: 16px; }
    .weather-dashboard .pw-timeline { padding: 12px; }
}
@media (prefers-reduced-motion: reduce) { .weather-dashboard .pw-day { transition: none; } }
.pw-related-water{display:flex;align-items:center;gap:12px;padding:14px 18px;margin-bottom:20px;border:1px solid #d4e8e8;border-radius:14px;background:linear-gradient(110deg,#edf8f6,#fff);color:#28777d}.pw-related-water>i:first-child{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:#def0ed;font-size:22px}.pw-related-water>i:last-child{margin-left:auto}.pw-related-water strong{display:block;font-size:14px}.pw-related-water small{display:block;font-size:11px;color:#799b9d;margin-top:3px}