.map-stage{min-height:0}.map-canvas{position:relative;height:auto}.map-viewport{position:relative;height:490px}.map-stage .map-surface{padding:0;touch-action:none;cursor:grab;user-select:none}.map-stage .map-surface:active{cursor:grabbing}
.map-stage .dept-shape,.map-stage .commune-shape{vector-effect:non-scaling-stroke;transform:none}.map-stage .commune-label{font-weight:600}
.map-zoom-controls{position:absolute;top:12px;right:10px;z-index:5;display:grid;gap:4px;text-align:center}.map-zoom-controls button{width:44px;height:44px;border:1px solid var(--line);border-radius:12px;background:var(--solid,#16334b);color:var(--ink);font-size:24px;cursor:pointer;box-shadow:0 3px 12px #071c3026}.map-zoom-controls button:disabled{opacity:.45;cursor:default}.map-zoom-controls output{font-size:11px;color:var(--muted);padding:5px 0;pointer-events:none}
.map-forecast-controls{display:flex;align-items:center;gap:12px;margin:5px 0 12px;flex-wrap:wrap}.map-forecast-controls[hidden]{display:none}.map-day-switch{display:flex;gap:3px;background:var(--soft);border:1px solid var(--line);border-radius:999px;padding:3px}.map-day-switch button{min-height:40px;padding:8px 16px;border:0;border-radius:999px;color:var(--muted);background:transparent;font-size:12px;cursor:pointer}.map-day-switch button[aria-pressed="true"]{background:var(--ink);color:var(--bg,#132d43)}.map-forecast-source{flex:1 1 220px;font-size:11px;line-height:1.6;color:var(--muted);margin:0}.map-hint{pointer-events:none;max-width:calc(100% - 24px)}
#mapWeather{pointer-events:none}.map-weather-marker{pointer-events:none}.map-weather-marker text{fill:#15374c;text-anchor:middle;font-family:inherit;paint-order:stroke fill;stroke:#f3faff;stroke-opacity:.85;stroke-width:2.5px;stroke-linejoin:round}.map-weather-reading{font-weight:750}.map-weather-pin{fill:#101820;stroke:#f3faff;stroke-width:.8px;pointer-events:visiblePainted;cursor:pointer}.map-weather-marker:focus{outline:none}.map-weather-marker:focus text{fill:#934b12;stroke:#fff;stroke-width:3px}.map-weather-marker:focus .map-weather-pin,.map-weather-pin:hover{stroke:#f9ba68;stroke-width:2px}.map-stage.has-weather #mapLabels{opacity:.35}
#mapSky{display:none;pointer-events:none}.map-stage.has-sky #franceMap .dept-shape{fill:transparent;stroke:#335972;stroke-opacity:.6;stroke-width:.75px}.map-stage.has-sky #franceMap .dept-shape:hover,.map-stage.has-sky #franceMap .dept-shape:focus{fill:#ffffff40;stroke:#15374c;stroke-width:1.6px}.map-stage.has-sky #franceMap .dept-shape.selected{fill:#fff2c640;stroke:#614313;stroke-width:1.6px}.map-stage.has-sky #mapLabels{opacity:.6}.map-stage.has-sky #mapLabels text{fill:#15374c;paint-order:stroke fill;stroke:#ffffff80;stroke-width:1px;pointer-events:none}
.map-sky-legend{flex:1 0 100%;display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;font-size:10px;line-height:1.5;color:var(--muted)}.map-sky-legend[hidden]{display:none}.map-sky-legend>span{display:inline-flex;align-items:center;gap:5px}.map-sky-title{font-weight:650}.map-sky-legend i{display:inline-block;width:16px;height:7px;border-radius:4px}.sky-clear{background:#f3b86a}.sky-cloud{background:#c8c7bf}.sky-overcast{background:#a2adb7}.sky-rain{background:#387bbd}.sky-snow{background:#dce8ef}
.map-time-head{display:flex;align-items:center;gap:10px;width:100%;min-width:0}.map-days{flex:1;min-width:0;overflow-x:auto;scrollbar-width:thin;border-radius:16px;background:transparent;border:0;padding:0}.map-days button{flex-shrink:0;padding:8px 12px;border-radius:12px;white-space:nowrap}.map-step-switch{display:flex;align-items:center;gap:2px;flex-shrink:0;border:1px solid var(--line);padding:3px;border-radius:12px;font-size:11px}.map-step-switch>span{color:var(--muted);padding:0 6px}.map-step-switch button{border:0;border-radius:8px;min-width:35px;min-height:36px;background:transparent;color:var(--muted);cursor:pointer;font-size:11px}.map-step-switch button[aria-pressed="true"]{color:var(--bg);background:var(--ink)}
.map-timeline{display:flex;align-items:center;gap:14px;width:100%;min-width:0;padding:9px 12px 12px;border-top:1px solid var(--line);background:var(--soft);box-sizing:border-box}.map-timeline[hidden]{display:none}.map-time-navigation{display:flex;align-items:center;gap:4px;flex-shrink:0}.map-time-navigation button{border:1px solid var(--line);border-radius:12px;background:var(--soft);color:var(--ink);min-height:44px;min-width:36px;cursor:pointer;font:inherit}.map-time-navigation button:disabled{opacity:.35;cursor:default}#mapPlay{font-size:12px;padding:0 12px;min-width:90px}#mapPlay[aria-pressed="true"]{color:#132d43;background:#a5d8f5}#mapPrevious,#mapNext{font-size:24px}.map-time-track{flex:1;min-width:0}.map-time-track output{display:block;font-size:14px;font-weight:650;color:var(--ink);text-transform:capitalize;line-height:1.5}.map-time-track input{display:block;width:100%;height:28px;margin:0;accent-color:#83caed;cursor:pointer}.map-time-limits{display:flex;justify-content:space-between;gap:8px;font-size:10px;line-height:1.3;color:var(--muted)}.map-timeline-note{flex:1 1 100%;margin:0;color:var(--muted);font-size:10px;line-height:1.5}.map-forecast-controls{gap:8px}.map-forecast-source{flex:1 1 100%;margin-top:0}.map-sky-legend{margin-top:3px}
.map-forecast-controls button:focus-visible,.map-timeline button:focus-visible,.map-time-track input:focus-visible{outline:2px solid #88d5f7;outline-offset:3px}
@media(max-width:1100px){.map-viewport{height:460px}}
@media(max-width:800px){.map-viewport{height:490px}}
@media(max-width:600px){.map-time-head{flex-wrap:wrap;gap:4px}.map-days{flex-basis:100%}.map-days button{min-height:40px;padding:8px 11px}.map-step-switch{margin-left:auto;padding:1px}.map-step-switch button{min-height:36px;min-width:37px}.map-timeline{gap:8px}.map-time-navigation{gap:3px}.map-time-navigation button{min-width:30px;border-radius:9px}#mapPlay{min-width:74px;padding:0 6px;font-size:11px}.map-time-track output{font-size:12px}.map-time-limits{font-size:9px}.map-sky-legend{gap:10px}}
.observation-sync{font-size:10px;line-height:1.6;color:#dcebf5;margin:4px 0 0}.observation-sync.sync-delayed{color:#ffdcad}
@media(max-width:600px){.explore-grid{margin-left:8px;margin-right:8px}.map-card-primary{padding:18px 8px 8px}.map-viewport{height:clamp(400px,60svh,550px)}.map-timeline{padding:9px 6px 10px}.map-forecast-controls{gap:8px}.map-day-switch button{padding:8px 14px}.map-forecast-source{font-size:11px}.map-zoom-controls{right:6px;top:8px}.observation-sync{font-size:10px}.map-hint{font-size:11px;padding:7px 9px}}

#departmentSky{display:none;pointer-events:none}.map-stage.has-department-sky .commune-shape{fill:transparent;stroke:#335972;stroke-opacity:.3;stroke-width:.55px}
.map-stage.has-department-sky .commune-shape:hover,.map-stage.has-department-sky .commune-shape:focus-visible{fill:#ffffff40;stroke:#15374c;stroke-opacity:1;stroke-width:1.2px;filter:none}
.map-stage.has-department-sky .commune-shape.selected{fill:#fff2c640;stroke:#614313;stroke-width:1.3px;filter:none}
.map-stage.has-department-sky .commune-label{fill:#15374c;stroke:#ffffffba}
/* Put the local-weather journey ahead of the forecast controls. */
.map-heading h2{font-size:clamp(30px,3.2vw,38px);font-weight:600;line-height:1.15}
#mapEyebrow{display:flex;align-items:center;gap:8px;color:var(--ink);font-size:11px;font-weight:650;letter-spacing:.09em;margin-bottom:10px}
#mapEyebrow::before{content:"1";display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--ink);color:var(--bg);font-size:12px;letter-spacing:0}
.map-card-primary:has([data-level="department"]) #mapEyebrow::before{content:"2"}
.map-heading #mapIntro{display:block;color:var(--ink);font-size:14px;font-weight:600;line-height:1.55;padding:9px 12px;border-left:3px solid #83caed;background:var(--soft);border-radius:0 9px 9px 0;margin-top:11px}
#departmentWeather{pointer-events:none}.has-department-weather #communeLabels{display:none}
.map-weather-marker .map-weather-name{font-weight:550;stroke-width:2px;stroke-opacity:.95}
.map-weather-marker .map-weather-reading,.map-weather-marker .map-weather-name{pointer-events:visiblePainted;cursor:pointer}
.map-weather-leader{stroke:#24485e;stroke-width:1;stroke-opacity:.65;pointer-events:none}
/* Map, date, playback and sky key share one compact frame. */
.map-card-primary{container-type:inline-size}
.map-stage{display:block;min-height:0;border:1px solid var(--line);border-radius:18px;background:var(--soft);box-shadow:none}
.map-canvas{position:relative;height:auto}
.map-viewport{width:calc(100% - 184px)}
.map-stage:has(.map-timeline[hidden]) .map-viewport{width:100%}
.map-stage .map-surface{width:100%;height:100%;padding:0}
.map-timeline{position:absolute;top:50%;right:12px;transform:translateY(-50%);width:160px;display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:12px;padding:0;border:0;background:transparent}
.map-timeline[hidden]{display:none}
.map-time-track{flex:0;min-width:0}
.map-time-caption{display:block;margin-bottom:8px;color:var(--muted);font-size:9px;letter-spacing:.12em;text-transform:uppercase}
.map-time-track output{display:flex;flex-direction:column;gap:6px;font-size:19px;line-height:1.3;font-weight:500}
#mapSelectedHour{font-size:44px;line-height:1.1;letter-spacing:-.045em;font-weight:650;font-variant-numeric:tabular-nums}
.map-time-zone{font-size:11px;color:var(--muted);letter-spacing:0}
.map-time-track input{height:32px;margin:9px 0 2px}
.map-time-limits{font-size:8px}
.map-time-navigation{order:1;justify-content:space-between;gap:4px}
.map-time-navigation button{min-height:40px;min-width:30px;border-radius:10px}
#mapPlay{min-width:84px;padding:0 8px;font-size:11px}
.map-sky-legend{order:2;flex:none;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:5px;margin:0;padding-top:11px;border-top:1px solid var(--line);font-size:10px;color:var(--ink)}
.map-sky-legend[hidden]{display:none}
.map-sky-title{margin-bottom:2px;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.1em}
.map-sky-legend>span{gap:7px}.map-sky-legend i{width:18px;height:8px;border-radius:4px}
.map-tooltip{white-space:normal;max-width:calc(100% - 30px);line-height:1.4}
@container(max-width:580px){
 .map-canvas{display:flex;flex-direction:column}
 .map-viewport{width:100%;height:clamp(380px,55svh,500px);flex:none}
 .map-timeline{position:relative;top:auto;right:auto;transform:none;order:-1;width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 9px;padding:10px 12px;border-bottom:1px solid var(--line)}
 .map-time-track{display:contents}.map-time-caption{display:none}
 .map-time-track output{grid-column:1/-1;flex-direction:row;align-items:baseline;justify-content:space-between;gap:7px;margin-bottom:3px;font-size:16px}
 #mapSelectedHour{font-size:30px}.map-time-zone{font-size:10px}
 .map-time-track input{grid-column:1;grid-row:2;margin:0;height:32px}.map-time-limits{grid-column:1;grid-row:3;font-size:8px}
 .map-time-navigation{grid-column:2;grid-row:2/4;order:0;align-self:center}.map-time-navigation button{min-height:44px}
 #mapPlay{min-width:74px;padding:0 6px}
 .map-sky-legend{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;gap:4px 12px;margin-top:8px;padding-top:7px;font-size:10px}
 .map-sky-title{margin:0;font-size:9px;letter-spacing:.07em}.map-sky-legend i{width:14px;height:7px}.map-sky-legend>span{gap:5px}
 .map-hint{left:6px;right:6px;bottom:8px;font-size:10px;padding:7px 8px}
}
@media(max-width:600px){
 .map-heading h2{font-size:28px}#mapEyebrow{font-size:10px;letter-spacing:.07em;margin-bottom:8px}
 .map-heading #mapIntro{font-size:13px;padding:8px 10px;margin-top:9px}
}
/* The forecast hour changes the surroundings; the sky legend stays stable. */
.map-stage[data-forecast-period="day"]{background:linear-gradient(180deg,#d8effc,#acd5ee)}
.map-stage[data-forecast-period="night"]{background:linear-gradient(180deg,#0c1c35,#173651)}
.map-canvas::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity .25s;background:radial-gradient(circle at 8% 16%,#e0efffc9 0 1px,transparent 1.8px),radial-gradient(circle at 29% 9%,#e0efff9c 0 1px,transparent 1.7px),radial-gradient(circle at 67% 8%,#e0efffc9 0 1px,transparent 1.8px),radial-gradient(circle at 88% 24%,#e0efff9c 0 1px,transparent 1.7px),radial-gradient(circle at 14% 81%,#e0efffa3 0 1px,transparent 1.8px),radial-gradient(circle at 64% 90%,#e0efff9c 0 1px,transparent 1.7px)}
.map-stage[data-forecast-period="night"] .map-canvas::before{opacity:1}.map-viewport{z-index:1}.map-timeline{z-index:2}
.map-forecast-period{align-self:flex-start;font-size:11px;font-weight:500;line-height:1.5;text-transform:none;letter-spacing:0;padding:3px 9px;border:1px solid var(--line);border-radius:999px;color:var(--ink);background:var(--soft)}.map-forecast-period[hidden]{display:none}
.map-stage[data-forecast-period="night"] .map-timeline{color:#f4f9ff;--ink:#f4f9ff;--muted:#c2d6e4;--line:#d5ebf933;--soft:#d3ecff12}
@container(max-width:580px){.map-time-track output{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 8px;align-items:center}#mapSelectedDate{grid-column:1;grid-row:1}#mapSelectedHour{grid-column:2;grid-row:1/4}.map-forecast-period{grid-column:1;grid-row:2;justify-self:start;align-self:start;font-size:10px;padding:1px 7px}.map-time-zone{grid-column:1;grid-row:3}}
@media(prefers-reduced-motion:reduce){.map-canvas::before{transition:none}}

.map-stage[data-forecast-period="day"]{--ink:#18364a;--muted:#496779;--line:#1f4f6a2e;--soft:#ffffff45;--solid:#edf6fa}
.map-stage[data-forecast-period="day"] .map-timeline{color:var(--ink)}
.map-stage[data-forecast-period="day"] .map-hint{color:#18364a;background:#edf6fad9;border-color:#1f4f6a30}
