/* Light reading surface. Maps and imagery retain their own dark treatment. */
:root {
  color-scheme: light;
  --bg: #fff;
  --panel: #fff;
  --line: #d4e1e1;
  --muted: #536a6e;
  --blue: #057c90;
  --amber: #a96511;
}
html { background: #fff; }
body { background: #fff; color: #143037; }
h1,h2,h3 { color: #102c33; }
p,.note,.source-tag { color: #536a6e; }
a,.link { color: #056e80; }
.eyebrow { color: #086d79; }
button,select { background: #fff; color: #15343b; border-color: #aebfc1; }
button:hover { background: #eaf6f5; border-color: #057c90; }
button:focus-visible,select:focus-visible,a:focus-visible { outline-color: #057c90; }

/* The dark masthead gives the mark a stable, legible home. */
header { background: #082025; border-bottom-color: #0f4751; box-shadow: none; }
header .brand,header .brand-name,header .brand-copy { color: #fff; }
header .header-brand small { color: #bed4d3; }
header .header-right { color: #c3d5d6; }
header .badge { color: #d4efed; border-color: #508288; }
header .demo-badge { color: #ffd27a; border-color: #bd8a30; }

.site-tabs { border-bottom-color: #c7dada; }
.site-tabs a { color: #3e6066; }
.site-tabs a:hover,.site-tabs [aria-current] { color: #102f36; background: transparent; }
.site-tabs [aria-current] { border-bottom-color: #b77119; }
.location label { color: #3d5d63; }
.location-hint:not(:empty) { color: #3a6067; }

.brief,.cyclone-brief {
  color: #17383e;
  background: #eaf5f4;
  border-color: #b5d6d4;
  border-left-color: #c68728;
}
.brief strong,.brief div>span { color: #17383e; }
.brief-icon { color: #a66817; }
.brief button { color: #16464e; }
.cyclone-brief { background: #fff2ed; border-color: #eec5b8; border-left-color: #cf6548; }

.stat,.s-panel,.station-panel,.cyclone-panel,.two-columns section,.hourly,.week,
.station-summary article,.cyclone-overview article,.station-watch {
  color: #143037;
  background: #fff;
  border-color: #d1dfdf;
  box-shadow: 0 2px 9px #0c34320b;
}
.stat-label,.stat p,.stat-bottom { color: #46646a; }
.stat-bottom { border-top-color: #dce7e6; }
.stat .value,.watch { color: #16383e; }
.stat .value.blue,.blue,.precip { color: #087589; }
.stat .value.amber,.amber { color: #a96511; }
.stat-label>.ui-icon { color: #087589; }
.station-summary article>span,.station-summary small,.cyclone-overview span,.cyclone-overview small { color: #4f686d; }
.station-summary strong,.cyclone-overview strong { color: #14343b; }
.station-summary .summary-rain { background: #eef8fb; }
.station-summary .summary-rain strong { color: #086d85; }
.station-summary article:after { opacity: .35; }

.section-heading,.panel-heading,.panel-title { border-bottom-color: #cbdcdb; }
.s-context,.transport-summary,.model-agreement,.network-analysis,.model-consensus,.s-models article,
.model-card,.system-card,.hazard-grid article,.official-chain a,.preparedness-grid article {
  color: #18363c;
  background: #f7fbfa;
  border-color: #d2e2e0;
  box-shadow: none;
}
.s-context,.s-models article>p,.transport-summary p,.model-consensus,.outlook-text,
.preparedness-grid ul,.reading-list span,.official-chain span { color: #425e64; }
.transport-summary strong,.model-metrics b,.system-metrics b,.zone-metrics b { color: #16383d; }
.transport-summary span,.s-models article>span { color: #087482; }
.s-models article>small,.model-agreement small,.model-primary small,.model-metrics span,
.system-card span,.system-card small,.system-metrics span { color: #4a666a; }
.model-card h3 { color: color-mix(in srgb,var(--model-tone,#057c90) 65%,#102e35); }
.model-consensus { background: #edf7f7; }
.map-warning,.model-caution { background: #fff7e4; color: #5e5137!important; }

.ai-panel { background: #f8fbfa; border-color: #bfd7d7; }
.ai-output { color: #18383e; background: transparent; }
.analysis-grid { border-color: #d5e2e1; }
.analysis-card { background: #fff; border-color: #d5e2e1; }
.analysis-card h3,.analysis-card p { color: #18363c; }
.analysis-action { background: #edf7f6; }
.analysis-action .analysis-card-head h3 { color: #8c5a12; }
.analysis-message,.analysis-sources,.analysis-foot,.analysis-intro { color: #4b666a; }
.analysis-sources { border-top-color: #d1dfdf; }
.analysis-sources b { color: #1c5158; }

/* Analysis labels had fixed pale colors from the night theme. */
.analysis-intro,
.analysis-foot .note,
.analysis-sources>span,
#weather-ai-meta,
#weather-ai-output,
#weather-ai-output .analysis-message,
#weather-ai-output .analysis-card-head h3,
#weather-ai-output .analysis-card p {
  color: #27474d;
}
#weather-ai-output .analysis-card-head h3 { color: #15343b; }
#weather-ai-output .analysis-action .analysis-card-head h3 { color: #80520d; }
#weather-ai-output .analysis-icon { color: #066878; background: #d9efed; }
#weather-ai-output .analysis-sources b { color: #174b54; background: #e8f6f4; border-color: #a8d2cf; }
#weather-ai-output .analysis-sources>span { font-size: 12px; }

/* Keep both the loading message and any unstructured report readable on paper. */
.light-theme .ai-panel .ai-output,
.light-theme .ai-panel .analysis-message,
.light-theme .ai-panel .analysis-card p,
.light-theme .ai-panel .analysis-card-head h3 {
  color: #18383e;
}
.light-theme .ai-panel .analysis-action .analysis-card-head h3 { color: #80520d; }
.light-theme .ai-panel .analysis-foot .note { color: #385b62; }

.station-filters { background: #f5faf9f5; border-color: #cbdedd; box-shadow: 0 4px 18px #153b3714; }
.station-filters label,.network-live { color: #426268; }
.zone-name small,.zone-metrics span,.temp-bucket small,.comparison-name,.scatter-axis,.scatter-label,
.station-table-panel td:first-child small,.station-empty-state { color: #536d71; }
.temp-bucket strong,.comparison-value,.scatter-axis strong,.scatter-label strong { color: #173840; }
.zone-card { background: #f4faf9; border-color: #c8dddd; box-shadow: 0 2px 9px #0c34320b; }
.zone-name strong { color: #16383f; font-size: 16px; }
.zone-name small { color: #496970; font-size: 12px; }
.zone-metrics span { color: #44636a; border-left-color: #bdd3d3; font-size: 12px; }
.zone-metrics b { color: #12353d; font-size: 17px; }
.station-table-scroll { border-color: #cbdedd; }
.station-table-panel th,.model-table-wrap th { background: #eaf4f3; color: #385b62; }
.station-table-panel td { color: #203e44; }
.station-table-panel tbody tr:hover { background: #f1f8f7; }
.scatter-help { background: #eff7f6; color: #385f64; }
.scatter-help strong { color: #16434b; }

.s-metric strong,.s-metric em { color: color-mix(in srgb,var(--risk-color,#057c90) 64%,#15353b); }
.point-reading { background: #f5faf9; color: #183b41; border-color: #d3e1e0; }
.point-reading strong { color: #173a40; }
.point-reading span,.point-reading small { color: #48666b; }
.risk-stat .value { color: color-mix(in srgb,var(--risk-color,#057c90) 70%,#102e35); }
.risk-stat .value small { color: #466368; }
.info-button { color: #075e6b; background: #e1f2f1; border-color: #7bbec0; }
.info-button:hover,.info-button:focus-visible { color: #fff; background: #076e7d; border-color: #076e7d; }
.signal-strip span { color: #1b4850; background: #e7f4f3; border-color: #a6cbcb; }
.signal-strip i { box-shadow: none; }
.radar-network-note { color: #375a61; background: #eff7f6; border-top-color: #cbdedd; }

/* Map canvases stay dark for radar and dust imagery; controls and captions sit on light paper. */
.map-shell { background: #fff; border-color: #c8dada; box-shadow: 0 5px 20px #123b3914; }
.map-toolbar,.windy-layers { background: #f2f8f7; border-color: #d1e0de; }
.map-toolbar button { color: #30545b; }
.map-toolbar button.active { background: #d5efed; color: #075b68; border-color: #70b9ba; }
.map-caption,.ground-map-foot { background: #fff; color: #49666b; }
.map-live-key { color: #49666b; }
.station-highlights article { background: #f6faf9; border-color: #d9e6e4; }
.station-highlights article>span,.station-highlights article>small { color: #3e5f65; }
.station-highlights article>strong { color: color-mix(in srgb,var(--highlight-tone,#057c90) 65%,#14353b); }
.hour:first-child { background: #e5f3f1; }
.hour,.day { border-right-color: #dce7e6; }
.hour small,.day small { color: #4a676c; }
.hour strong,.day strong { color: #16393f; }
/* Cloud contours need a dark ink against the light forecast cards. */
.weather-symbol .wx-cloud { fill: #e2f1f2; stroke: #125b68; }
.outlook { background: #102125; }
.windy-panel { border-color: #cbdedd; box-shadow: 0 4px 20px #133a3715; }
.windy-caption { background: #f6faf9; color: #3c5f65; border-top-color: #cbdedd; }
.windy-caption p { color: #3c5f65; }
.plume-legend,.plume-legend strong,.plume-legend small { color: #f5faf9; }

footer { border-top-color: #c9d9d8; }
footer p,footer div { color: #536a6e; }
footer .brand { color: #16373e; }
footer .brand>span { color: #087c90; }

/* Named, readable heat comparison replaces the unlabelled scatterplot. */
.heat-explainer,.heat-footnote{color:#49636a;line-height:1.65;font-size:14px}
.heat-explainer strong{color:#143940}
.heat-summary{padding:18px;background:#eaf5f3;border-left:4px solid #057c90;margin:18px 0}
.heat-summary>span{display:block;color:#41616a;font-size:13px}
.heat-summary>strong{display:block;color:#153a41;font-size:18px;margin:4px 0}
.heat-summary>b{display:block;color:#975012;font-size:28px;line-height:1.3}
.heat-summary>b small{font-size:13px;font-weight:500;color:#49636a}
.heat-summary p{font-size:12px;margin:8px 0 0;color:#49636a}
.heat-list{display:grid;gap:12px}
.heat-card{border:1px solid #cbdedd;border-radius:8px;padding:16px;background:#fff}
.heat-card-head{display:flex;gap:10px;align-items:flex-start;margin-bottom:16px}
.heat-rank{display:grid;place-items:center;flex:none;width:26px;height:26px;border-radius:50%;color:#075f6d;background:#e1f1f0;font-size:13px;font-weight:700}
.heat-card h3{font-size:15px;line-height:1.4;margin:0;color:#153a41}
.heat-card-head small{font-size:12px;color:#526b71}
.heat-bar-row{display:grid;grid-template-columns:105px minmax(20px,1fr) 74px;align-items:center;gap:8px;margin:10px 0;font-size:12px;color:#36575f}
.heat-bar-row>b{text-align:right;font-size:15px;white-space:nowrap;color:#174a57}
.heat-track{background:#eef3f3;height:9px;border-radius:4px;overflow:hidden}
.heat-track i{display:block;height:100%;background:#057c90;border-radius:4px}
.heat-apparent .heat-track i{background:#b56d19}
.heat-apparent>b{color:#94500d}
.heat-card-foot{display:flex;justify-content:space-between;gap:8px;margin-top:14px;font-size:13px;color:#41616a}
.heat-rain{color:#086c8a;font-weight:600}
.heat-card>p{border-top:1px solid #e0eaea;padding-top:10px;margin:10px 0 0;font-size:13px;color:#49636a}
.heat-more{margin-top:14px}
.heat-more summary{cursor:pointer;padding:12px;color:#066a78;font-weight:600;font-size:14px}
.heat-footnote{font-size:12px;margin-top:18px}
@media(max-width:380px){.heat-card{padding:12px}.heat-bar-row{grid-template-columns:96px minmax(14px,1fr) 67px;gap:5px}.heat-bar-row>b{font-size:14px}}

/* La lámina aprobada es la única familia de iconos meteorológicos. */
.official-weather-icon { width: 32px; height: 32px; stroke: none; mix-blend-mode: multiply; overflow: hidden; }
#now-icon .official-weather-icon { width: 32px; height: 32px; }
.weather-icon .official-weather-icon { width: 34px; height: 34px; }

/* Weather-first hierarchy: current conditions, immediate forecast, then maps. */
.heading{margin-bottom:18px}
.heading h1{max-width:720px}
.brief{margin-bottom:14px}
.weather-summary{grid-template-columns:1.45fr 1.45fr repeat(3,minmax(0,1fr));align-items:stretch}
.weather-summary .current-weather{grid-column:span 2;background:linear-gradient(135deg,#ffffff 0%,#edf8f6 100%);border-color:#73b9ae;box-shadow:0 8px 28px #123b3914}
.current-weather .stat-label{font-size:12px;color:#0a6873}
.current-weather #now-icon,.current-weather #now-icon .official-weather-icon{width:58px;height:58px}
.current-weather .current-reading{display:grid;grid-template-columns:auto 1fr;align-items:end;gap:22px;margin-top:2px}
.current-weather .value{font-size:76px;line-height:1.05;color:#123d43}
.current-weather .current-reading>p{font-size:20px;font-weight:650;color:#254b51;margin:0 0 9px;min-height:0}
.current-weather #feels{margin-top:18px;color:#436167;font-size:14px}
.current-weather .now-stations{margin-top:18px;border:1px solid #b8d9d5;border-radius:10px;background:#f6fbfa;color:#25484e}
.current-weather .now-stations summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 16px;cursor:pointer;font-size:14px;line-height:1.45}
.current-weather .now-stations summary::-webkit-details-marker{display:none}
.current-weather .now-stations summary:focus-visible{outline:2px solid #057c90;outline-offset:3px;border-radius:8px}
.current-weather .now-stations-action{white-space:nowrap;color:#057c90;font-weight:700;font-size:13px}
.current-weather .now-stations[open] .now-stations-action{font-size:0}
.current-weather .now-stations[open] .now-stations-action::after{content:'Ocultar detalle';font-size:13px}
.current-weather .now-observations{margin:0;padding:14px 16px 16px;border-top:1px solid #cde3e0;gap:10px;color:#365b61;font-size:14px;line-height:1.55}
.current-weather .now-observations #raining-stations{color:#284d55}
.current-weather .now-observations .model-rain-note,.current-weather .now-observations .local-rain-report{display:inline-block;padding:9px 11px;border-left:3px solid #c8822a;background:#fff9ed;color:#59431d}
.current-weather .now-observations .local-rain-report{border-left-color:#057c90;background:#e8f6f5;color:#215258}
.current-weather .now-observations .link{color:#057c90;font-weight:650;text-decoration:underline;text-underline-offset:2px}
.weather-summary>.stat:not(.current-weather){display:flex;flex-direction:column;min-height:230px}
.weather-summary>.stat:not(.current-weather) .stat-bottom{margin-top:auto}
.weather-summary>.stat:not(.current-weather) .value{font-size:48px}
.weather-summary .watch{font-size:25px;line-height:1.25;margin:28px 0 18px}
.forecast-now{margin-top:24px;padding:22px 24px 24px;border:1px solid #c8dada;border-radius:10px;background:#fff;box-shadow:0 8px 28px #123b3912}
.forecast-heading{align-items:flex-end;margin-bottom:14px}
.forecast-heading h2{margin-bottom:0}
.forecast-heading .sun-times{margin:0}
.forecast-now .hourly{border-radius:8px}
.forecast-now .hour{min-width:96px;padding:16px 13px}
.map-section{margin-top:42px}
@media(max-width:1050px){.weather-summary{grid-template-columns:repeat(3,1fr)}.weather-summary .current-weather{grid-column:span 3}.weather-summary>.stat:not(.current-weather){min-height:210px}}
@media(max-width:700px){.heading{margin-bottom:14px}.brief{margin-bottom:10px}.weather-summary{grid-template-columns:1fr 1fr;gap:10px}.weather-summary .current-weather{grid-column:span 2}.current-weather #now-icon,.current-weather #now-icon .official-weather-icon{width:48px;height:48px}.current-weather .current-reading{grid-template-columns:1fr;gap:0}.current-weather .value{font-size:62px}.current-weather .current-reading>p{font-size:18px;margin:2px 0 8px}.weather-summary>.stat:not(.current-weather){min-height:190px}.weather-summary>.stat:last-child{grid-column:span 2;min-height:0}.weather-summary>.stat:not(.current-weather) .value{font-size:42px}.weather-summary .watch{margin:16px 0 8px}.forecast-now{margin-top:18px;padding:18px 14px}.forecast-heading{align-items:flex-start}.forecast-heading .sun-times{width:100%}.forecast-heading .sun-times span{flex:1}.forecast-now .hour{min-width:86px;padding:14px 10px}}
@media(max-width:390px){.weather-summary{grid-template-columns:1fr}.weather-summary .current-weather,.weather-summary>.stat:last-child{grid-column:auto}.weather-summary>.stat:not(.current-weather){min-height:0}.weather-summary>.stat:not(.current-weather) .stat-bottom{margin-top:12px}}
@media(max-width:700px){.current-weather .now-stations summary{align-items:flex-start;flex-direction:column;gap:4px}.current-weather .now-stations-action{white-space:normal}}

.light-theme .station-detail-tools input{background:#fff;color:#15373e;border-color:#bcd3d3}.light-theme .station-detail-tools label span,.light-theme .station-detail-tools p{color:#48686e}.light-theme .station-detail-card{background:#fff;border-color:#c9dddd}.light-theme .station-detail-card[open]{background:#f3faf9;border-color:#67aeb0}.light-theme .station-detail-card summary:hover{background:#f0f8f7}.light-theme .station-detail-name strong,.light-theme .station-detail-primary strong,.light-theme .station-detail-metrics b{color:#173940}.light-theme .station-detail-name small,.light-theme .station-detail-primary small,.light-theme .station-detail-metrics span{color:#577278}.light-theme .station-detail-metrics span{border-left-color:#cbdedd}.light-theme .station-detail-warning{color:#80520d;background:#f4b21016}.light-theme .station-detail-more{background:#eaf6f5;border-color:#8dbfc0;color:#075f6b}.light-theme .station-detail-more:hover{background:#dff1ef}

/* Home hierarchy: current conditions, action, then secondary signals. */
.weather-overview{display:grid;gap:14px;margin-bottom:8px}
.weather-lead{display:grid;gap:10px}
.weather-lead .current-weather{padding:28px 34px 25px;border:0;border-left:5px solid #29bbbf;border-radius:14px;background:linear-gradient(110deg,#e5f5f3 0%,#fff 76%);box-shadow:none;overflow:visible}
.weather-lead .current-weather .stat-label{font-size:13px;letter-spacing:.1em;font-weight:700;color:#075c68}
.weather-lead .current-weather .current-reading{display:flex;align-items:center;gap:26px;margin:2px 0 8px}
.weather-lead .current-weather .value{font-size:clamp(76px,8vw,112px);letter-spacing:-.07em;line-height:1;color:#103b42;flex:none}
.weather-lead .current-weather .value small{font-size:.26em;margin-left:6px;color:#42646a;letter-spacing:0}
.weather-lead .current-weather .current-reading>p{font-size:clamp(18px,2vw,25px);line-height:1.25;font-weight:600;color:#183d44;max-width:640px;margin:0}
.weather-lead .current-weather #feels{border:0;padding:0;margin:6px 0 0;font-size:16px;color:#385c62}
.weather-lead .current-weather .now-stations{max-width:760px;margin-top:20px;background:#fff;border-color:#b8dad5}
.weather-lead .brief{margin:0;padding:16px 22px;border:0;border-left:5px solid #f4b210;border-radius:10px;background:#fff7e5;box-shadow:none}
.weather-lead .brief strong{font-size:clamp(17px,1.6vw,21px);color:#273f40}
.weather-lead .brief div>span{color:#51686a;font-size:14px}
.weather-lead .brief button{border-color:#c8c3ae;background:#fff;color:#194750}
.weather-essentials{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.weather-essentials .stat{display:grid;align-content:start;min-height:0;padding:18px 22px;border:1px solid #d5e3e0;border-top:3px solid #29bbbf;border-radius:9px;background:#fff;box-shadow:none}
.weather-essentials .stat:nth-child(2){border-top-color:#c8822a}
.weather-essentials .stat:nth-child(3){border-top-color:#057c90}
.weather-essentials .value{font-size:clamp(36px,4vw,48px);line-height:1.2;margin:7px 0 0}
.weather-essentials .watch{font-size:clamp(22px,2.5vw,30px);line-height:1.2;margin:12px 0 8px}
.weather-essentials .stat-label{font-size:12px;font-weight:700}
.weather-essentials .stat p{font-size:14px;margin:2px 0 8px;min-height:0}
.weather-essentials .stat-bottom{align-self:end;margin-top:8px;padding-top:9px;font-size:13px}
.forecast-now{padding:8px 0 0;border:0;box-shadow:none;background:transparent;margin-top:30px}
.forecast-now .hourly{border:1px solid #d4e2e0;border-radius:10px;scrollbar-color:#8bbfbd #f4f8f7;scroll-snap-type:x proximity}
.forecast-now .hour{flex:0 0 clamp(96px,10vw,132px);min-width:96px;padding:12px 10px;scroll-snap-align:start}
.forecast-now .weather-icon{margin:5px 0}
.forecast-now .hour strong{font-size:23px}
.map-section{margin-top:34px}
.map-shell{border:0;border-radius:12px;box-shadow:0 5px 22px #123b3914}
.map-toolbar{align-items:center;gap:14px;padding:10px 14px}
.map-toolbar .layers{display:flex;flex-wrap:wrap;gap:3px;padding:3px;border-radius:9px;background:#e5f1ef}
.map-toolbar .layers button{border-radius:7px;padding:9px 12px;font-size:13px;color:#29535a}
.map-toolbar .layers button.active{background:#fff;border-color:#b5d5d1;color:#075c68;box-shadow:0 2px 6px #123b3915}
#map{height:clamp(500px,48vw,700px)}
.station-watch{margin-top:18px}
.ai-panel{margin-top:32px;padding:28px 30px;border:0;border-left:5px solid #057c90;border-radius:12px;background:#edf7f6;box-shadow:none}
.ai-panel .analysis-grid{gap:10px;border:0}
.ai-panel .analysis-card{background:#fff;border:1px solid #d3e6e2;border-top:3px solid var(--analysis-tone,#057c90);border-radius:9px;min-height:0;padding:18px}
.ai-panel .analysis-card h3{font-weight:650}
.ai-panel .analysis-card p{line-height:1.55}
.two-columns{gap:16px}
.two-columns section{box-shadow:none}
.week{gap:8px;border:0;box-shadow:none;background:transparent}
.week .day{border:1px solid #dbe7e4;border-radius:9px;background:#fff;min-width:0;padding:18px 9px}
.week .day:first-child{background:#eaf6f4;border-color:#a7d1cc}
.week .day .temps{font-size:24px}
@media(max-width:700px){
  .weather-lead .current-weather{padding:18px 17px 20px}
  .weather-lead .current-weather .current-reading{display:block;margin-top:7px}
  .weather-lead .current-weather .value{font-size:74px}
  .weather-lead .current-weather .current-reading>p{margin:5px 0;font-size:19px}
  .weather-lead .brief{padding:14px;flex-wrap:wrap}
  .weather-lead .brief button{margin-left:0}
  .weather-essentials{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .weather-essentials .stat{padding:14px;min-height:0}
  .weather-essentials .stat:last-child{grid-column:span 2}
  .weather-essentials .value{font-size:38px}
  .forecast-now{margin-top:25px;padding:0}
  .forecast-now .hour{flex-basis:105px;min-width:105px;padding:11px 8px}
  .map-toolbar{align-items:stretch;flex-wrap:wrap}
  .map-toolbar .layers{flex:1;overflow-x:auto;flex-wrap:nowrap}
  .map-toolbar .layers button{white-space:nowrap}
  #map{height:480px}
  .ai-panel{padding:18px 15px}
  .week{display:flex;overflow-x:auto;gap:8px}
  .week .day{flex:0 0 118px}
}
@media(max-width:390px){.weather-essentials{grid-template-columns:1fr}.weather-essentials .stat:last-child{grid-column:auto}}
.precipitation-notices{margin:20px 0 28px;padding:20px 24px;border:1px solid #cbdedd;border-left:5px solid #29bbbf;border-radius:14px;background:#f6fbfa;color:#17383d}
.precipitation-notices.has-rain{border-left-color:#f4b210;background:#fffaf0}
.precipitation-notices-head{display:flex;justify-content:space-between;align-items:start;gap:16px}
.precipitation-notices-head h2{font-size:clamp(1.3rem,2vw,1.8rem);margin:5px 0 0;color:#15363d}
.precipitation-notices-head a,.notice-more a{color:#057c90;font-weight:700}
.precipitation-notices>p{margin:12px 0 0;color:#345a60;font-weight:600}
.precipitation-notices>small{display:block;margin-top:12px;color:#527078;font-size:.8rem}
.precipitation-notices-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px;margin-top:14px}
.precipitation-notices-list:empty{display:none}
.precipitation-notice{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:14px;border:1px solid #e0d6bd;border-radius:10px;background:#fff}
.precipitation-notice.is-local{border-color:#29bbbf;box-shadow:inset 0 0 0 1px #29bbbf55}
.precipitation-notice .notice-scope{display:block;margin-bottom:4px;color:#9a5f13;font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.precipitation-notice.is-local .notice-scope{color:#057c90}
.precipitation-notice div>strong{display:block;color:#17383d;font-size:1rem;line-height:1.3}
.precipitation-notice div>small{display:block;margin-top:4px;color:#537077;font-size:.8rem;line-height:1.35}
.precipitation-notice .notice-reading{text-align:right;white-space:nowrap}
.precipitation-notice .notice-reading strong{color:#ad651b;font-size:1.35rem}
.precipitation-notice .notice-reading strong small{font-size:.8rem}
.precipitation-notice .notice-reading span{display:block;color:#5c7074;font-size:.76rem}
.precipitation-notice .notice-map{grid-column:1/-1;justify-self:start;border:0;background:none;padding:3px 0;color:#057c90;font:700 .85rem Poppins,sans-serif;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.precipitation-notice .notice-map:focus-visible{outline:2px solid #057c90;outline-offset:3px}
.precipitation-notices-list .notice-more{grid-column:1/-1;margin:3px 0;color:#426067}
.precipitation-bands-scroll{overflow-x:auto;margin-top:16px}
.precipitation-bands{width:100%;border-collapse:collapse;text-align:left;font-size:.88rem;background:#fff;border:1px solid #d8e5e2;border-radius:8px;overflow:hidden}
.precipitation-bands caption{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.precipitation-bands th,.precipitation-bands td{padding:10px 12px;border-bottom:1px solid #e0e9e6;white-space:nowrap;color:#24434a}
.precipitation-bands thead th{font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;color:#48676d;background:#eaf4f3}
.precipitation-bands tbody th{border-left:4px solid #29bbbf}
.precipitation-bands .band-1 th{border-left-color:#c8822a}
.precipitation-bands .band-2 th{border-left-color:#c04734}
.precipitation-bands tbody tr:last-child th,.precipitation-bands tbody tr:last-child td{border-bottom:0}
.precipitation-bands tbody th small{font-size:.75rem;color:#59727a;font-weight:400}
.precipitation-notice .notice-caution{grid-column:1/-1;margin:0;padding:8px 10px;border-left:3px solid #c8822a;background:#fff6e5;color:#67431c;font-size:.78rem;line-height:1.4}
.rain-alert-controls{display:flex;align-items:end;flex-wrap:wrap;gap:12px 18px;margin-top:16px;padding:14px;border:1px solid #d8e6e3;border-radius:10px;background:#fff}
.rain-alert-controls>div{display:flex;flex-direction:column;gap:3px;flex:1 1 210px}
.rain-alert-controls>div strong{color:#17383d;font-size:.95rem}
.rain-alert-controls>div span{color:#537078;font-size:.8rem;line-height:1.4}
.rain-alert-controls label{display:flex;align-items:center;gap:7px;color:#36575e;font-size:.85rem;font-weight:600}
.rain-alert-controls select{padding:8px 10px;min-height:39px;border:1px solid #b8d4d2;border-radius:7px;background:#fff;color:#17383d;font:inherit}
.rain-alert-controls input{accent-color:#057c90;width:17px;height:17px}
.rain-alert-controls button{padding:9px 15px;min-height:40px;border:0;border-radius:7px;background:#057c90;color:#fff;font:700 .85rem Poppins,sans-serif;cursor:pointer}
.rain-alert-controls button[aria-pressed="true"]{background:#244a51}
.rain-alert-controls button:focus-visible,.rain-alert-controls select:focus-visible,.rain-alert-controls input:focus-visible{outline:2px solid #057c90;outline-offset:3px}
.precipitation-notices .rain-alert-status{font-size:.8rem;font-weight:400;margin:8px 0 0;color:#567078}
@media(max-width:650px){.precipitation-notices{padding:16px}.precipitation-notices-head{flex-direction:column;gap:7px}}