:root{font-family:Outfit,Arial,sans-serif;color:#183c52;background:#edf5f9;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}a{color:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #0284c7;outline-offset:5px}[hidden]{display:none!important}
#atlas,#map{position:absolute;inset:0;width:100%;height:100%;height:100dvh}#atlas{overflow:hidden}#map{background:#edf5f9}
.map-wash{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#edf5f9 0,rgba(237,245,249,0) 110px),linear-gradient(270deg,#edf5f9 0,rgba(237,245,249,0) 110px),linear-gradient(180deg,#edf5f9 0,rgba(237,245,249,0) 135px),linear-gradient(0deg,#edf5f9 0,rgba(237,245,249,0) 90px);z-index:1}
.atlas-heading{position:absolute;top:max(40px,env(safe-area-inset-top));left:48px;z-index:3;pointer-events:none}.brand{display:inline-block;pointer-events:auto}.brand img{display:block;width:112px;height:28px}.atlas-heading h1{font-size:clamp(23px,2.4vw,36px);font-weight:400;letter-spacing:-.055em;margin:24px 0 0;color:#183c52}
.round{border:1px solid #9cbed337;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#ffffffa6;color:#365870;backdrop-filter:blur(12px);text-decoration:none;transition:background .2s}.round:hover{background:#fff}.round svg{height:19px;width:19px;stroke:currentColor;fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.back{position:absolute;top:max(40px,env(safe-area-inset-top));right:40px;z-index:4}.reset{position:absolute;right:40px;bottom:64px;z-index:4}
.atlas-meta{position:absolute;bottom:max(38px,calc(env(safe-area-inset-bottom) + 20px));left:48px;z-index:3;display:flex;align-items:center;gap:25px;font-size:12px}.coverage{display:flex;align-items:center;gap:9px}.coverage i{width:6px;height:6px;border-radius:50%;background:#38bdf8;box-shadow:0 0 0 5px #38bdf813}.coverage b{font-weight:400}.source-toggle{border:0;background:none;padding:9px 0;font-size:10px;color:#6d8b9e;display:flex;align-items:center;gap:7px}.source-toggle svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.3}
.gesture-hint{position:absolute;left:50%;bottom:38px;transform:translateX(-50%);color:#6d8b9e;font-size:11px;letter-spacing:.03em;pointer-events:none;transition:opacity .6s;z-index:2;white-space:nowrap}.gesture-hint span{margin-left:13px;color:#0284c7;font-size:16px}.is-exploring .gesture-hint{opacity:0}
.sources{position:absolute;bottom:98px;left:48px;z-index:5;width:320px;max-width:calc(100% - 40px);max-height:calc(100dvh - 160px);overflow:auto;padding:22px 24px;background:#ffffffed;backdrop-filter:blur(20px);border:1px solid #d6e6ee;border-radius:18px;box-shadow:0 15px 60px #2b657216;font-size:12px;line-height:1.7}.sources strong{font-weight:500}.sources p{color:#637e90}.sources a{color:#0284c7;text-decoration:none}.sources .credit{font-size:10px}.sources #city-shortcuts{display:flex;gap:5px;flex-wrap:wrap;margin:15px 0}.sources #city-shortcuts button{border:1px solid #d6e6ee;border-radius:6px;padding:5px 9px;font-size:11px;background:#f4fafc;color:#285b79}
/* MapLibre owns the root transform; only the artwork animates. */
.atlas-pin{position:absolute;border:0;background:none;padding:0;width:42px;height:56px;cursor:pointer;overflow:visible;text-align:center;z-index:2;transition:none!important}.atlas-pin .pin-art{display:block;width:100%;height:100%;filter:drop-shadow(0 7px 5px #2454702b);transform-origin:50% 100%;animation:pin-arrive .45s both;transition:filter .2s}.atlas-pin svg{width:100%;height:100%;display:block;overflow:visible}.atlas-pin:after{content:"";position:absolute;bottom:-3px;left:50%;width:22px;height:7px;transform:translateX(-50%);background:#269bd630;border-radius:50%;filter:blur(3px);z-index:-1}.atlas-pin:hover .pin-art,.atlas-pin:focus-visible .pin-art{filter:drop-shadow(0 8px 8px #0284c755);scale:1.1}.pin-label{position:absolute;top:calc(100% + 11px);left:50%;transform:translateX(-50%);font-size:11px;white-space:nowrap;font-weight:400;color:#34627a;text-shadow:0 1px 6px #fff,0 0 8px #fff;pointer-events:none}.atlas-pin[data-kind=point]{width:37px;height:50px}.atlas-pin[data-kind=point] .pin-label{opacity:0;max-width:210px;white-space:normal;width:max-content;background:#fffffff0;padding:5px 9px;border-radius:7px;transition:opacity .2s}.atlas-pin[data-kind=point]:hover .pin-label,.atlas-pin[data-kind=point]:focus-visible .pin-label{opacity:1}.atlas-pin.is-selected .pin-label{opacity:1}.atlas-pin.is-leaving{pointer-events:none}.atlas-pin.is-leaving .pin-art{animation:pin-leave .18s both}
.point-detail{position:absolute;bottom:94px;left:50%;transform:translateX(-50%);z-index:5;background:#fffffff2;backdrop-filter:blur(20px);border:1px solid #d6e6ee;border-radius:18px;padding:23px 75px 23px 25px;min-width:280px;max-width:calc(100vw - 40px);box-shadow:0 16px 60px #2b657216;display:flex;flex-direction:column;gap:8px}.detail-kicker{color:#0284c7;font-size:8px;letter-spacing:.18em}.point-detail strong{font-size:18px;font-weight:400}.point-detail>span:not(.detail-kicker){font-size:12px;color:#688598}.point-detail small{font-size:10px;color:#8299a7}.point-detail .round{position:absolute;right:16px;top:16px;width:32px;height:32px;border:0;background:none}
.map-status{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px;z-index:6;background:#edf5f9e8;font-size:12px;color:#6d8b9e}.map-status button{border:1px solid #b5dbea;border-radius:20px;background:white;color:#0284c7;padding:10px 18px}.loader{height:24px;width:24px;border:1px solid #c9e7f5;border-top-color:#0284c7;border-radius:50%;animation:spin 1s linear infinite}.maplibregl-ctrl-attrib{font:9px Outfit,sans-serif!important;background:#ffffff7d!important;color:#6d8b9e!important}.maplibregl-ctrl-attrib a{color:#6d8b9e!important}.maplibregl-ctrl-bottom-right{bottom:7px;right:10px}.maplibregl-ctrl-attrib-button{opacity:.55}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes pin-arrive{from{opacity:0;transform:translateY(8px) scale(.6)}to{opacity:1;transform:none}}@keyframes pin-leave{to{opacity:0;transform:scale(.5)}}
@media(max-width:600px){.atlas-heading{top:max(30px,env(safe-area-inset-top));left:24px}.brand img{width:98px;height:25px}.atlas-heading h1{margin-top:22px;font-size:27px}.back{top:26px;right:22px;width:38px;height:38px}.atlas-meta{left:24px;bottom:36px;gap:17px}.reset{right:22px;bottom:87px;width:38px;height:38px}.gesture-hint{bottom:85px}.atlas-pin{width:28px;height:39px}.pin-label{font-size:9px;top:calc(100% + 7px)}.atlas-pin[data-kind=point]{width:35px;height:47px}.sources{left:20px;bottom:84px}.point-detail{bottom:138px}.maplibregl-ctrl-bottom-right{bottom:0;right:4px}}
@media(max-height:500px){.atlas-heading{top:22px;left:28px}.atlas-heading h1{font-size:23px;margin-top:12px}.back{top:20px;right:24px}.atlas-meta{left:28px;bottom:20px}.gesture-hint{bottom:18px}.sources{bottom:75px}.point-detail{bottom:70px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
@media(max-width:600px){.atlas-pin[data-kind=city]{width:24px;height:33px}.atlas-pin[data-kind=city] .pin-label{opacity:0}.atlas-pin[data-kind=city]:hover .pin-label,.atlas-pin[data-kind=city]:focus-visible .pin-label{opacity:1}}
@media(max-height:500px){.atlas-pin[data-kind=city]{width:27px;height:37px}.atlas-pin[data-kind=city] .pin-label{font-size:9px;opacity:0}.atlas-pin[data-kind=city]:hover .pin-label,.atlas-pin[data-kind=city]:focus-visible .pin-label{opacity:1}}

/* V86 · white counter cards. Only the cards move; the map remains interactive. */
.overview-stats{position:absolute;z-index:3;top:148px;left:50%;transform:translateX(-50%);display:grid;grid-template-columns:1fr 1.25fr;gap:16px;width:min(660px,calc(100% - 96px));pointer-events:none;perspective:900px;visibility:hidden;transition:visibility 0s linear .5s}
.overview-stats.is-visible{visibility:visible;transition-delay:0s}
.overview-stat{display:grid;grid-template-columns:46px minmax(0,1fr);column-gap:17px;row-gap:9px;align-content:center;min-width:0;padding:23px 25px 24px;background:#fff;border:1px solid #ffffff;border-radius:21px;box-shadow:0 12px 36px #365f7210,0 2px 5px #365f7203;opacity:0;transform:translate3d(0,-22px,0) scale(.92) rotateX(7deg);transform-origin:50% 0;filter:blur(3px);transition:transform .4s cubic-bezier(.4,0,.6,1),opacity .3s ease,filter .35s ease}
.overview-stat:nth-of-type(1){transition-delay:45ms}
.overview-stats.is-visible .overview-stat{opacity:1;transform:translate3d(0,0,0) scale(1) rotateX(0);filter:blur(0);transition-duration:.75s,.42s,.55s;transition-timing-function:cubic-bezier(.18,1.12,.3,1),ease,ease;transition-delay:0s}
.overview-stats.is-visible .overview-stat:nth-of-type(2){transition-delay:85ms}
.stat-icon{grid-column:1;grid-row:1/3;align-self:center;width:46px;height:46px;border-radius:15px;display:grid;place-items:center;background:#edf8ff;color:#129bdf;transform:scale(.82) rotate(-9deg);transition:transform .45s ease}
.stat-icon-water{background:#edfafa;color:#12a9bd}
.stat-icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round}
.overview-stats.is-visible .stat-icon{transform:scale(1) rotate(0);transition:transform .85s cubic-bezier(.2,1.35,.3,1) .12s}
.overview-stats.is-visible .overview-stat:nth-of-type(2) .stat-icon{transition-delay:.2s}
.stat-label{grid-column:2;min-width:0;font-size:11px;color:#6b8798;font-weight:300;line-height:1.4}
.overview-stat strong{grid-column:2;min-width:0;font-size:38px;font-weight:300;letter-spacing:-.055em;line-height:1.05;font-variant-numeric:tabular-nums;white-space:nowrap}
.overview-stat b{font-weight:inherit}.overview-stat small{font-size:14px;margin-left:7px;letter-spacing:0;color:#6b8798}
.stats-mode{position:absolute;right:5px;top:-23px;font-size:9px;color:#829ca9;letter-spacing:.04em;opacity:0;transition:opacity .2s}
.overview-stats.is-visible .stats-mode{opacity:1;transition-delay:.2s}
.point-detail{pointer-events:none}.point-detail button{pointer-events:auto}.atlas-pin svg,.atlas-pin .pin-art{pointer-events:none;user-select:none;-webkit-user-drag:none}
@media(max-width:600px){
 .map-wash{background:linear-gradient(90deg,#edf5f9 0,rgba(237,245,249,0) 40px),linear-gradient(270deg,#edf5f9 0,rgba(237,245,249,0) 40px),linear-gradient(180deg,#edf5f9 0,rgba(237,245,249,0) 125px),linear-gradient(0deg,#edf5f9 0,rgba(237,245,249,0) 90px)}
 .overview-stats{top:178px;left:20px;right:20px;transform:none;width:auto;grid-template-columns:1fr 1.3fr;gap:10px}
 .overview-stat{grid-template-columns:28px minmax(0,1fr);gap:12px 8px;padding:17px 14px 18px;border-radius:17px}
 .stat-icon{grid-row:1;width:28px;height:32px;border-radius:10px}.stat-icon svg{width:19px;height:19px}
 .stat-label{font-size:9px;align-self:center;line-height:1.4}
 .overview-stat strong{grid-column:1/-1;font-size:clamp(23px,6.6vw,29px)}.overview-stat small{font-size:11px;margin-left:4px}.stats-mode{font-size:8px;top:-21px}
}
@media(max-height:500px) and (min-width:601px){
 .overview-stats{top:29px;left:auto;right:85px;width:min(430px,calc(100% - 320px));transform:none;gap:10px}
 .overview-stat{grid-template-columns:28px minmax(0,1fr);column-gap:9px;row-gap:5px;padding:13px 14px;border-radius:15px}
 .stat-icon{width:28px;height:34px;border-radius:10px}.stat-icon svg{width:18px;height:18px}
 .stat-label{font-size:9px}.overview-stat strong{font-size:24px}.overview-stat small{font-size:10px;margin-left:4px}.stats-mode{top:-18px;font-size:8px}
 .map-wash{background:linear-gradient(90deg,#edf5f9,rgba(237,245,249,0) 70px),linear-gradient(270deg,#edf5f9,rgba(237,245,249,0) 70px),linear-gradient(180deg,#edf5f9,rgba(237,245,249,0) 85px),linear-gradient(0deg,#edf5f9,rgba(237,245,249,0) 55px)}
}
@media(max-height:500px) and (min-width:601px) and (max-width:740px){.overview-stat{padding:12px;column-gap:7px}.overview-stat strong{font-size:clamp(17px,3vw,20px)}}
@media(prefers-reduced-motion:reduce){.overview-stats,.overview-stat,.stat-icon,.stats-mode{transition:none!important;animation:none!important}.overview-stat{transform:none;filter:none}}