/* Shared visual language with the national atlas; all weather fields remain IFS data. */
.synoptic{margin:35px 0 30px;scroll-margin-top:20px}
.syn-heading{display:flex;justify-content:space-between;gap:28px;align-items:center;margin-bottom:22px}
.syn-heading h2{font-size:clamp(27px,3vw,39px);font-weight:550;letter-spacing:-1.5px;margin:0 0 10px;color:#143c50}
.syn-heading h2>span{color:#24a0c9}.syn-heading p:not(.eyebrow){font-size:13px;color:#6b8390;line-height:1.65;margin:0}
.syn-model{border-left:1px solid #cbdde5;padding-left:24px;flex-shrink:0;display:grid;gap:6px}.syn-model>span{font-size:8px;letter-spacing:1.5px;color:#76909b}.syn-model strong{font-size:16px;letter-spacing:1px;color:#2c586b;font-weight:500}.syn-model b{font-size:10px;background:#dfedf1;padding:4px 6px;border-radius:3px;vertical-align:2px}.syn-model small{font-size:10px;color:#718a99}
.syn-card{--syn-muted:#a5c4d5;--syn-line:#ffffff20;border:1px solid #22495e;border-radius:22px;overflow:hidden;background:#102e42;color:#f1f8fc;padding:0 24px;box-shadow:0 18px 50px #0a34451a}
.syn-toolbar{padding:21px 0;display:flex;justify-content:space-between;align-items:center;gap:15px;color:#b8d3e1}
.syn-view-label{font-size:10px;letter-spacing:1.8px;font-weight:650;display:flex;align-items:center;gap:9px}.syn-view-label>span{width:6px;height:6px;background:#8bd6ed;border-radius:50%}.syn-view-label small{font-size:7px;font-weight:500;color:#9cbece;letter-spacing:1px;border:1px solid #486c80;padding:5px 6px;border-radius:4px;margin-left:3px}
.syn-layers{display:flex;gap:8px}.syn-layers button{font-size:11px;font-weight:600;padding:9px 14px;color:#c8e1ed;background:#1a3b50;border:1px solid #436078;border-radius:22px}.syn-layers button[aria-pressed=true]{background:#187abd;color:#fff;border-color:#71c9fb;box-shadow:inset 0 1px 0 #ffffff26}.syn-layers button:hover{border-color:#b0dff7}
.syn-map-frame{position:relative;border:1px solid #7bbad24f;border-radius:17px;overflow:hidden;background:#347fa8;isolation:isolate}.syn-map{position:relative}#syn-svg{width:100%;height:auto;display:block;cursor:crosshair;touch-action:pan-y}
.syn-valid{position:absolute;z-index:2;left:20px;top:20px;pointer-events:none;background:#10364dde;border:1px solid #97c8e24a;border-radius:10px;padding:13px 16px;box-shadow:0 4px 20px #09283c1a;backdrop-filter:blur(8px)}.syn-valid>span{display:block;font-size:7px;letter-spacing:1.5px;color:#a8ccdf;margin-bottom:6px}.syn-valid strong{display:block;color:#f0faff;font-size:17px;font-weight:600;text-transform:capitalize;letter-spacing:-.3px}.syn-valid small{display:block;font-size:9px;color:#add0e2;margin-top:6px}
.syn-map-brand{position:absolute;left:22px;bottom:27px;display:flex;align-items:center;gap:5px;color:#f4fbff;font:italic 45px Georgia,serif;pointer-events:none;opacity:.9;text-shadow:0 1px 5px #123b52}.syn-map-brand>span{color:#ffd166;margin-left:-10px}.syn-map-brand small{font:7px/1.8 -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:1.7px;margin-left:8px}.syn-map-credit{position:absolute;bottom:10px;right:15px;font-size:7px;color:#d6ebf6;background:#123b528c;padding:4px 6px;border-radius:4px}
.syn-loading{position:absolute;z-index:3;inset:0;display:grid;place-items:center;background:#205976;font-size:14px;padding:30px;text-align:center;color:#e4f5ff}.syn-loading[hidden]{display:none}
.syn-graticule{stroke:#c6e9f7;stroke-width:.7;opacity:.15;fill:none}.syn-land{fill:none;stroke:#a7c8d7;stroke-opacity:.5;stroke-width:.65;stroke-linejoin:round}
.syn-isobar{fill:none;stroke:#d9eaf2;stroke-width:1.05;stroke-opacity:.72;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 1px 1px #12394ecc)}.syn-isobar.major{stroke-width:1.5;stroke-opacity:.88}
.syn-pressure-label{fill:#f1f9fd;font-size:10px;font-weight:600;letter-spacing:.7px;paint-order:stroke;stroke:#224d65;stroke-width:3.5;stroke-linejoin:round}
.syn-country{fill:#e0eff7;font-size:9px;font-weight:600;letter-spacing:2px;paint-order:stroke;stroke:#1b475eaa;stroke-width:2.5;text-anchor:middle}.syn-sea-label{fill:#d3effb;font-size:12px;font-style:normal;letter-spacing:3px;opacity:.55;text-anchor:middle;paint-order:stroke;stroke:#285d762e;stroke-width:2}
.syn-center{filter:url(#syn-shadow);text-anchor:middle;pointer-events:none}.syn-center>circle{fill:#10364de8;stroke:#d3ecfa99;stroke-width:1}.syn-center.high{fill:#ffce79}.syn-center.low{fill:#90d8ff}.syn-center .letter{font-size:39px;font-weight:750;letter-spacing:-2px}.syn-center .value{font-size:11px;font-weight:650;paint-order:stroke;stroke:#153e55;stroke-width:3.5px}.syn-center .definition{fill:#e3f1f9;font-size:7px;letter-spacing:1px;paint-order:stroke;stroke:#153e55;stroke-width:3px}
.syn-legend{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 0;border-bottom:1px solid var(--syn-line)}.syn-symbols{display:flex;gap:20px;align-items:center;font-size:10px;color:#c4d9e6}.syn-symbols>span{display:flex;align-items:center;gap:7px}.syn-symbols b{font-size:20px;font-weight:750}.syn-a{color:#ffce79}.syn-b{color:#90d8ff}.syn-isobar-key{color:#c4d9e6}.syn-rain-key{display:flex;align-items:center;gap:13px;font-size:10px;color:#c4d9e6}.syn-rain-key>div{width:200px;display:flex;justify-content:space-between;position:relative;padding-top:14px;font-size:9px}.syn-rain-key i{position:absolute;top:0;width:100%;height:7px;border-radius:4px;background:linear-gradient(90deg,#47d4e3,#3ec89b 25%,#e4d751 50%,#f49d3f 75%,#dc5aa1)}.syn-rain-key small{font-size:9px}
.syn-timebar{display:flex;gap:19px;align-items:center;padding:22px 0 18px}.syn-play{height:39px;min-width:39px;border-radius:50%;background:#187abd;border:1px solid #71c9fb;color:#f1faff;font-size:13px}.syn-play:hover{background:#238fcd}.syn-play[aria-pressed=true]{background:#256689}.syn-slider{flex:1;min-width:0;padding-top:5px}.syn-slider input{display:block;width:100%;accent-color:#82d1fc;height:5px;margin:0;cursor:pointer}.syn-slider input:focus-visible{outline:2px solid #e5a944;outline-offset:6px}.syn-slider>div{display:flex;justify-content:space-between;margin-top:12px}.syn-slider>div button{background:none;color:#b1d0e1;font-size:10px;padding:5px 0;min-width:45px;text-align:center}.syn-slider>div button:first-child{text-align:left}.syn-slider>div button:last-child{text-align:right}.syn-slider>div button span{display:block;color:#88aebf;font-size:9px;margin-top:4px}.syn-slider>div button[aria-pressed=true]{color:#90d8ff;font-weight:700}.syn-step-buttons{display:flex;gap:6px;align-self:flex-start}.syn-step-buttons button{border:1px solid #4e758b;background:#224b64;color:#e2f4ff;border-radius:7px;width:33px;height:33px}.syn-step-buttons button:hover{background:#30647f}
.syn-reading{padding:15px 0 19px;display:flex;align-items:center;justify-content:space-between;gap:18px;border-top:1px solid var(--syn-line)}.syn-reading>div{display:flex;gap:16px;align-items:center}.syn-reading-label{font-size:8px;font-weight:650;letter-spacing:1.3px;white-space:nowrap;color:#88c9ec}.syn-reading p{font-size:11px;line-height:1.7;margin:0;color:#b2cedf}.syn-reading>span{font-size:9px;color:#94b9cd;white-space:nowrap}.syn-reading>span.stale{color:#f4c384}
.syn-method{font-size:11px;line-height:1.8;color:#718795;padding:13px 3px}.syn-method summary{cursor:pointer;list-style:none;display:inline-flex;gap:15px;color:#5d7f90}.syn-method summary::-webkit-details-marker{display:none}.syn-method summary>span{color:#4b93af}.syn-method p{max-width:1000px;margin:12px 0}.syn-method a{color:#2a7b9c}.syn-legend.rain-hidden .syn-rain-key{opacity:.45}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
@media(max-width:1000px){.syn-toolbar{align-items:flex-start;flex-direction:column;gap:15px}.syn-legend{flex-wrap:wrap}.syn-model{padding-left:15px}.syn-heading{gap:15px}.syn-heading h2{font-size:30px}.syn-reading{align-items:flex-start}.syn-reading>div{display:block}.syn-reading-label{display:block;margin-bottom:4px}.syn-card{padding:0 18px}.syn-valid{left:15px;top:15px;padding:11px 13px}.syn-valid strong{font-size:15px}}
@media(max-width:600px){.synoptic{margin-top:28px}.syn-heading{display:block;margin-bottom:17px}.syn-heading h2{font-size:29px;letter-spacing:-1px}.syn-heading p:not(.eyebrow){font-size:12px}.syn-model{border:0;padding:0;margin-top:14px;display:flex;align-items:center;gap:9px;flex-wrap:wrap}.syn-model>span{display:none}.syn-model strong{font-size:12px}.syn-model b{font-size:8px;vertical-align:1px}.syn-model small{font-size:9px}.syn-card{padding:0 12px;border-radius:16px}.syn-toolbar{padding:17px 0 14px;gap:14px}.syn-view-label{font-size:9px;letter-spacing:1.2px}.syn-layers{gap:5px;width:100%}.syn-layers button{font-size:10px;padding:8px 10px}.syn-map-frame{border-radius:12px}.syn-map{overflow-x:auto;overscroll-behavior-x:contain}#syn-svg{width:680px;max-width:none;height:407px}.syn-valid{position:relative;inset:auto;border:0;border-radius:0;padding:11px 13px;background:#153e55;backdrop-filter:none;box-shadow:none}.syn-valid strong{font-size:14px;letter-spacing:0}.syn-valid>span{font-size:6px;margin-bottom:4px}.syn-valid small{font-size:8px;margin-top:4px}.syn-map-brand{font-size:32px;left:14px;bottom:24px}.syn-map-brand small{font-size:6px;letter-spacing:1px}.syn-map-credit{font-size:6px;bottom:7px;right:8px}.syn-legend{padding:13px 0;gap:12px}.syn-symbols{font-size:9px;gap:14px}.syn-symbols b{font-size:17px}.syn-rain-key{width:100%;justify-content:space-between;font-size:9px}.syn-rain-key>div{width:190px;font-size:8px}.syn-timebar{padding:18px 0 13px;gap:12px}.syn-play{height:32px;min-width:32px;font-size:11px}.syn-step-buttons{display:none}.syn-slider>div button{font-size:10px;min-width:30px}.syn-slider>div button span{font-size:8px}.syn-reading{padding:12px 0 15px;display:block}.syn-reading p{font-size:10px}.syn-reading>span{display:block;font-size:8px;margin-top:5px}.syn-method{font-size:10px}.syn-country{font-size:11px}.syn-pressure-label{font-size:12px}}
@media(prefers-reduced-motion:reduce){.synoptic *{scroll-behavior:auto!important}}
.syn-freshness{flex:none;text-align:right;font-size:9px;line-height:1.6;color:#a5c4d5}.syn-freshness #syn-status{display:block}.syn-freshness .stale{color:#f4c384}.syn-freshness small{display:block;font-size:8px;color:#94b9cd}.syn-freshness button{font-size:9px;background:transparent;color:#90d8ff;padding:5px 0 0;text-decoration:underline;text-underline-offset:3px}.syn-slider>div button span{font-size:8px;max-width:100px;line-height:1.5}.syn-layers button:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:600px){.syn-freshness{text-align:left;margin-top:10px}.syn-slider>div button span{max-width:66px;font-size:7px}.syn-slider>div button{min-width:36px;font-size:9px}}

#syn-wind{position:absolute;left:0;top:0;z-index:1;pointer-events:none}.syn-layers{flex-wrap:wrap}.syn-toolbar{flex-wrap:wrap}