/* A single full-height desktop panel and a touch-sized mobile sheet. */
:root{--atlas-width:clamp(360px,32vw,420px);--atlas-bg:#1d2026;--atlas-line:#363d48}
body{height:100dvh;overflow:hidden;background:#19241f}
#map{left:var(--atlas-width);right:0;top:0;bottom:0;width:calc(100% - var(--atlas-width));height:100dvh}
#atlas-panel{position:fixed;inset:0 auto 0 0;width:var(--atlas-width);height:100dvh;z-index:15;background:var(--atlas-bg);display:flex;flex-direction:column;border-right:1px solid var(--atlas-line);box-shadow:4px 0 24px #0003;min-height:0;overflow:hidden;color:#e8edf5;--section-color:#65dbb7}
#atlas-panel [hidden]{display:none!important}
#atlas-panel header{position:static!important;inset:auto!important;width:auto!important;height:auto;min-height:76px;padding:18px 22px;display:flex;justify-content:space-between;pointer-events:auto;background:none;box-shadow:none}
#atlas-panel .brand{padding:0;background:none;box-shadow:none;gap:12px}
#atlas-panel .brand-mark{display:flex;width:34px;height:38px;border:1px solid #446351;background:#23382e;color:#a4e4ba;border-radius:10px;font-size:13px}
#atlas-panel header h1{font-size:21px;letter-spacing:-.4px;font-weight:600}
#atlas-panel .brand div>span{display:block;font-size:11px;letter-spacing:1.2px;margin-top:5px;color:#a4afbd}
#atlas-panel #chapter-nav{position:static!important;inset:auto!important;display:flex;width:100%;max-width:none;padding:0 14px;gap:0;border:0;border-bottom:1px solid var(--atlas-line);background:none;overflow-x:auto;scrollbar-width:none;flex-shrink:0}
#atlas-panel #chapter-nav button{flex:1 0 auto;min-width:0;min-height:48px;padding:10px 9px;font-size:14px;background:none;border:0;border-bottom:3px solid transparent;border-radius:0;box-shadow:none;white-space:nowrap;color:#aeb9c8}
#atlas-panel #chapter-nav button.active{color:#f2f5f9;border-bottom-color:var(--section-color);background:linear-gradient(0deg,#ffffff08,transparent)}
#atlas-panel #chapter-nav button:hover{background:#ffffff0a}
#panel-search{padding:16px 20px 10px;flex-shrink:0}
#atlas-panel #map-search{position:static!important;inset:auto!important;width:100%;height:44px;display:flex;padding:0 12px;gap:10px;background:#292e37;border:1px solid #424a56;border-radius:12px;box-shadow:none}
#atlas-panel #map-search input{font-size:15px;padding:9px 0;min-height:42px;background:transparent;border:0;width:100%}
#atlas-panel .search-icon{display:flex;flex:0 0 19px;height:19px}
#atlas-panel svg.ui-icon,#panel-tools svg,#sheet-toggle svg,#panel-back svg{width:20px;height:20px;flex:0 0 20px}
#panel-context{padding:8px 22px 12px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--atlas-line);flex-shrink:0}
#panel-heading{font-size:12px;letter-spacing:.7px;color:#9aa8ba;text-transform:none}
#panel-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#556070 transparent;scroll-padding:16px;outline-offset:-3px}
#panel-back{display:flex;align-items:center;gap:8px;margin:14px 20px 0;padding:8px 2px;min-height:42px;font-size:14px;color:#a7c8ff;background:none;border:0;max-width:calc(100% - 40px);text-align:left}
#atlas-panel #flyover-card,#atlas-panel #detail,#atlas-panel #assets,#atlas-panel #network,#atlas-panel #atlas-layers,#atlas-panel #legend,#atlas-panel #layers{position:static!important;inset:auto!important;width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:transparent!important;overflow:visible!important;display:block!important;margin:0;transform:none!important}
#atlas-panel #flyover-card[hidden],#atlas-panel #detail[hidden],#atlas-panel #assets[hidden],#atlas-panel #network[hidden],#atlas-panel #atlas-layers[hidden]{display:none!important}
#atlas-panel #detail,#atlas-panel #assets,#atlas-panel #network,#atlas-panel #atlas-layers{padding:22px}
#atlas-panel #legend{padding:0}
#atlas-panel #layers{padding:12px 0 0}
#atlas-panel .flyover-card-content{padding:22px!important;overflow:visible;display:block!important}
#atlas-panel .flyover-card-content>*{max-width:100%}
#atlas-panel .scene-accent,#atlas-panel .scene-navigation,#atlas-panel .scene-kicker,#atlas-panel .journey-return,#atlas-panel .card-expand,#atlas-panel .facility-camera-actions,#atlas-panel #close-detail,#atlas-panel #close-mobile-legend,#atlas-panel .legend-heading{display:none!important}
#atlas-panel h2{font-size:26px;line-height:1.23;letter-spacing:-.5px;font-weight:550;margin:0 0 16px;overflow-wrap:anywhere}
#atlas-panel h3{font-size:16px;margin:24px 0 12px;color:#e7edf5}
#atlas-panel .scene-lead,#atlas-panel .scene-detail,#atlas-panel .detail-intro{display:block!important;overflow:visible!important;-webkit-line-clamp:unset!important;max-height:none!important;font-size:16px;line-height:1.65;color:#c8d0dc;margin:0 0 20px}
#atlas-panel .scene-detail{font-size:16px;margin:10px 0}
#atlas-panel .flyover-card-content > p{font-size:16px!important;line-height:1.65!important}
.well-record-schematic{padding:16px;margin:20px 0;border:1px solid #3b4554;border-radius:16px;background:#181e28}
.well-record-schematic svg{width:100%;height:auto;display:block;margin:12px 0}
.well-record-schematic p{font-size:16px;line-height:1.65;color:#c8cfda}
.well-record-schematic summary{cursor:pointer;color:#a8c7fa;padding:12px 0}
#atlas-panel .small,#atlas-panel .source-caption,#atlas-panel .source-audit-link,#atlas-panel .legend-switch small,#atlas-panel .layer small,#atlas-panel .notice,#atlas-panel .asset-row small{font-size:13px;line-height:1.55}
#atlas-panel .facility-choice-grid{display:grid!important;grid-template-columns:1fr!important;gap:10px;margin:22px 0 12px}
#atlas-panel .facility-choice-grid>button,#atlas-panel .water-choice{display:flex;align-items:center;text-align:left;gap:12px;padding:16px;min-height:90px;width:100%;border:1px solid #414b5a;border-left:3px solid var(--facility-color);background:#252c35;border-radius:12px;overflow:hidden}
#atlas-panel .facility-choice-grid strong,#atlas-panel .water-choice strong{display:block;color:#ecf0f8;font-size:16px;line-height:1.4}
#atlas-panel .facility-choice-grid small,#atlas-panel .water-choice small{display:block!important;color:#b8c2d1;font-size:13px;margin-top:5px;line-height:1.5}
#atlas-panel .facility-choice-icon{display:flex;flex:0 0 35px;background:none;padding:0}
#atlas-panel .facility-choice-action{display:flex;margin-top:8px;min-height:0}
#atlas-panel .water-choice>svg{width:30px;height:30px;flex:0 0 30px}
#atlas-panel .water-choice{margin-top:20px}
#atlas-panel .water-choice>.ui-icon{margin-left:auto}
#atlas-panel .group-cards{display:grid!important;grid-template-columns:1fr;gap:10px}
#atlas-panel .group-cards button{min-height:76px;text-align:left}
#atlas-panel .group-cards button span{font-size:16px}
#atlas-panel .group-cards small{font-size:13px}
#atlas-panel .scene-metrics{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(85px,1fr));gap:14px;padding:18px;margin:22px 0;background:#282f39;border:1px solid #384250;border-radius:12px}
#atlas-panel .scene-metrics strong{font-size:25px;font-weight:500;line-height:1.25;overflow-wrap:anywhere}
#atlas-panel .scene-metrics span{display:block;font-size:12px;line-height:1.5;margin-top:7px}
#atlas-panel .panel-topics{border-top:1px solid var(--atlas-line);margin-top:24px}
#atlas-panel .panel-topics button{display:flex;align-items:center;justify-content:space-between;width:100%;gap:12px;text-align:left;border:0;border-bottom:1px solid #343d49;border-radius:0;padding:14px 0;background:none;color:#bdd3f5;font-size:15px;min-height:52px}
#atlas-panel .panel-topics button:hover{color:white;background:#ffffff06}
#atlas-panel .scene-inspect{display:flex;align-items:center;gap:8px;width:100%;margin:20px 0 0;min-height:46px;padding:12px;background:#2a3d57;border:1px solid #435c7d;border-radius:10px;color:#bdd7ff;font-size:14px}
#atlas-panel .source-image-card,#atlas-panel .scene-image,#atlas-panel .scene-preview{margin:20px 0;display:block!important}
#atlas-panel .source-image-card img,#atlas-panel img{max-width:100%;height:auto}
#atlas-panel .flow-nodes{flex-wrap:wrap}
#atlas-panel #flyover-card .flow-explainer,#atlas-panel #flyover-card .scene-status,#atlas-panel #flyover-card .source-caption,#atlas-panel #flyover-card .road-key{display:block!important}
#atlas-panel #flyover-card .well-chips{display:flex!important;flex-wrap:wrap}
#atlas-panel .flow-nodes>span{font-size:13px;min-width:0}
#atlas-panel .legend-switch{min-height:48px;font-size:14px;padding:10px 0;gap:10px}
#atlas-panel .legend-switch input{min-width:18px;min-height:18px}
#atlas-panel .layer strong{font-size:14px}
#atlas-panel .filter-row{flex-wrap:wrap}
#atlas-panel #panel-map-tools{margin-top:22px;border-top:1px solid var(--atlas-line);padding-top:18px}
#atlas-panel #panel-map-tools summary{font-size:15px;color:#bdd3f5;cursor:pointer;margin-bottom:14px}
#atlas-panel #panel-map-tools button{display:inline-flex;margin:4px;font-size:14px}
#panel-tools{display:flex;flex-shrink:0;gap:2px;padding:8px 12px max(8px,env(safe-area-inset-bottom));border-top:1px solid var(--atlas-line);background:#222730}
#panel-tools button{display:flex;align-items:center;justify-content:center;gap:7px;flex:1;font-size:13px;min-height:44px;padding:8px 4px;border:0;background:transparent;color:#b8c8de;border-radius:8px;white-space:nowrap}
#panel-tools button[aria-pressed=true]{background:#304560;color:#c7ddff}
#panel-tools button:hover{background:#303946}
#sheet-toggle,#panel-handle,#panel-expand,#panel-find{display:none}
#sidebar,#tour,#mobile-map-actions,.header-actions,.map-tools,.scope-note,#field-walkthrough,#field-view-controls,.discovery-callout,#cursor-coords{display:none!important}
.maplibregl-ctrl-top-right{top:12px!important;right:12px!important}
.maplibregl-ctrl-group button{width:38px;height:38px}
.maplibregl-ctrl-bottom-left,.immersive .maplibregl-ctrl-bottom-left{left:12px!important;bottom:24px!important}
.maplibregl-ctrl-attrib{max-width:min(650px,65vw);font-size:11px!important}
#view-preparation{top:16px!important;left:calc(var(--atlas-width) + 18px)!important;right:auto!important;bottom:auto!important;transform:none!important;max-width:calc(100vw - var(--atlas-width) - 90px);z-index:10}
#measure-result{top:72px;left:calc(var(--atlas-width) + 18px);right:auto;max-width:calc(100vw - var(--atlas-width) - 90px)}
#map-error{left:calc(var(--atlas-width) + 25px);top:25%;max-width:calc(100vw - var(--atlas-width) - 60px)}
@media(max-width:760px){
 :root{--atlas-width:0px}
 #map{left:0}
 #atlas-panel{inset:auto 0 0;width:100%;height:auto;max-height:100dvh;padding-bottom:env(safe-area-inset-bottom);border:1px solid #495461;border-bottom:0;border-radius:18px 18px 0 0;box-shadow:0 -8px 32px #0005;transition:none;}
 #panel-top,#panel-section-nav{flex-shrink:0}
 #panel-handle{display:block;flex:0 0 18px;height:18px;touch-action:none;cursor:ns-resize}
 #panel-handle:after{content:'';display:block;width:34px;height:4px;background:#69788b;border-radius:4px;margin:7px auto 0}
 #atlas-panel header{padding:0 16px 8px!important;min-height:34px}
 #atlas-panel header h1{font-size:18px}
 #atlas-panel .brand-mark,#atlas-panel .brand div>span{display:none}
 #atlas-panel #sheet-toggle{display:flex;align-items:center;justify-content:center;min-height:36px;width:44px;padding:6px;background:transparent;border:0;color:#bcd3f5}
 #atlas-panel #panel-find{display:flex;align-items:center;justify-content:center;min-height:36px;width:42px;padding:8px;margin-left:auto;background:transparent;border:0;color:#bcd3f5}
 #panel-find svg{width:20px;height:20px}
 #atlas-panel #chapter-nav{padding:0 9px}
 #atlas-panel #chapter-nav button{padding:9px 8px;min-height:44px;font-size:14px}
 #panel-search{display:none;padding:12px 16px 4px}
 #panel-context{padding:7px 18px;min-height:38px}
 #panel-expand{display:block;min-height:30px;padding:4px 2px;background:none;border:0;font-size:14px;color:#9fc4ff}
 #atlas-panel .flyover-card-content,#atlas-panel #detail,#atlas-panel #assets,#atlas-panel #network,#atlas-panel #atlas-layers{padding:18px!important}
 #atlas-panel h2{font-size:23px}
 #atlas-panel #panel-back{margin:8px 18px 0;min-height:36px}
 #panel-tools{padding-top:4px;padding-bottom:max(4px,env(safe-area-inset-bottom))}
 #panel-tools button{min-height:42px}
 #panel-tools svg{width:18px;height:18px;flex-basis:18px}
 body[data-sheet=full] #atlas-panel{height:calc(100dvh - max(62px,env(safe-area-inset-top)))}
 body[data-sheet=full] #panel-search{display:block}
 body[data-sheet=collapsed] #atlas-panel{height:auto}
 body[data-sheet=collapsed] #panel-scroll,body[data-sheet=collapsed] #panel-search{display:none}
 body[data-sheet=collapsed] #panel-context{display:flex}
 .maplibregl-ctrl-top-right{top:max(6px,env(safe-area-inset-top))!important;right:4px!important}
 .maplibregl-ctrl-bottom-left,.immersive .maplibregl-ctrl-bottom-left{left:8px!important;bottom:calc(var(--atlas-sheet-height,146px) + 64px)!important}
 body[data-sheet=full] .maplibregl-ctrl-bottom-left{display:none}
 .maplibregl-ctrl-bottom-right{top:7px;left:8px;right:auto;bottom:auto;max-width:calc(100vw - 72px)}
 .maplibregl-ctrl-attrib{max-width:calc(100vw - 72px);font-size:10px!important}
 #view-preparation{top:50px!important;left:12px!important;max-width:calc(100vw - 80px)}
 #measure-result{top:106px;left:12px;max-width:calc(100vw - 80px)}
 #map-error{left:16px;top:22%;max-width:calc(100vw - 80px)}
}
@media(max-width:380px){#panel-tools svg{display:none}#atlas-panel #chapter-nav button{padding-inline:6px}}
@media(prefers-reduced-motion:reduce){#atlas-panel{transition:none}}

/* Consistent metric-first records and a single imagery comparison control. */
#atlas-panel h2+.scene-metrics{margin:0 0 18px;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:0;background:none;border:0}
#atlas-panel h2+.scene-metrics>div{background:#282f39;border:1px solid #3b4553;border-radius:10px;padding:12px;min-width:0}
#atlas-panel h2+.scene-metrics>div:last-child:nth-child(odd){grid-column:1/-1}
#atlas-panel .scene-metrics strong{font-size:22px}
#atlas-panel .coverage-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:14px 0;border-block:1px solid #3b4553;margin:18px 0;font-size:12px;line-height:1.5}
#atlas-panel .coverage-grid strong{display:block;font-size:21px;color:#e5edf7}
#atlas-panel .atlas-source-links{border-top:1px solid #3b4553;margin-top:22px;padding-top:16px;font-size:13px;line-height:1.6;overflow-wrap:anywhere}
#atlas-panel .atlas-source-links summary{color:#a8c7fa;cursor:pointer;margin-bottom:12px;font-size:14px}
#atlas-panel .position-review{padding:14px;border-left:3px solid #8ab4f8;background:#25303c;border-radius:4px;margin:16px 0 22px}
#atlas-panel .position-review h3{margin:0 0 8px;font-size:15px}
#atlas-panel .position-review p{margin:0}
#atlas-panel .place-cards{display:grid;gap:8px;margin:18px 0}
#atlas-panel .place-cards button{display:flex;justify-content:space-between;align-items:center;text-align:left;padding:14px;background:#282f39;border:1px solid #465165;border-radius:10px;min-height:48px}
#atlas-panel .group-legend{display:grid;gap:10px;font-size:13px;border-top:1px solid #3b4553;margin-top:12px;padding-top:15px}
#atlas-panel .group-legend span{display:flex;align-items:center;gap:10px}
#atlas-panel .group-legend i{height:12px;width:18px;border:1px solid #ffffff88;border-radius:3px}
#atlas-panel .enhanced-switch{border-bottom:1px solid #3b4553;padding-bottom:18px;margin-bottom:10px}
#atlas-panel .enhanced-switch svg{width:22px;height:22px;color:#a8c7fa}

#enhanced-map-toggle[aria-pressed=false]{color:#c6ced9;background:#242a33ed}
#city-label-overlay,#atlas-feature-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:hidden}
#atlas-feature-overlay{z-index:5}
#city-label-overlay{z-index:6}
#city-label-overlay [data-map-action]{pointer-events:auto;cursor:pointer;outline:none}
#city-label-overlay [data-map-action]:focus-visible>rect{stroke:#ffffff;stroke-width:2}
#city-label-overlay .selection-pulse{animation:atlas-pulse 1.2s ease-out 2;transform-origin:center;transform-box:fill-box}
@keyframes atlas-pulse{from{opacity:.9;stroke-width:3}to{opacity:.3;stroke-width:1}}
@media(max-width:760px){#atlas-panel .scene-metrics strong{font-size:21px}}
@media(prefers-reduced-motion:reduce){#city-label-overlay .selection-pulse{animation:none}}

/* One presentation route and one compact map-layer entry. */
#panel-tools{gap:8px;padding-inline:16px}
#panel-tools #presentation-progress{align-self:center;font-size:12px;color:#9baabe;white-space:nowrap}
#panel-tools #presentation-next{background:#a8c8ff;color:#14243c;justify-content:space-between;padding-inline:12px}
#panel-tools button:disabled{opacity:.35;cursor:default}
#map-layers-button{position:absolute;right:12px;top:144px;z-index:8;width:38px;height:38px;display:flex;align-items:center;justify-content:center;padding:8px;background:#242a33;color:#e8edf5;border:1px solid #556070;border-radius:50%;box-shadow:0 2px 8px #0004}
#map-layers-button svg{width:20px;height:20px}
#map-layers-button[aria-expanded=true]{background:#334d71;border-color:#9cbff8}
#atlas-panel h2{font-size:23px;overflow-wrap:normal}
@media(max-width:760px){#map-layers-button{right:4px;top:138px}#atlas-panel h2{font-size:22px}}
@media(max-width:380px){#atlas-panel h2{font-size:21px}}

/* Mobile presentation controls stay at the same viewport edge in both states. */
@media(max-width:760px){
 #atlas-panel{padding-bottom:calc(58px + env(safe-area-inset-bottom))}
 #panel-tools,body[data-sheet=full] #panel-tools{position:fixed;left:0;right:0;bottom:0;width:100%;box-sizing:border-box;min-height:58px;padding:7px max(16px,env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));gap:10px;border:0;border-top:1px solid var(--atlas-line);border-radius:0;box-shadow:0 -2px 10px #0002;background:#222730;z-index:20}
 #panel-tools button{min-height:44px;font-size:14px}
 #panel-context{gap:12px;min-height:44px}
 #panel-heading{min-width:0;line-height:1.4}
 #panel-expand{flex-shrink:0;min-height:36px}
}

/* A quiet metric ruler; provider credits stay unobtrusive at the top left. */
.maplibregl-ctrl-bottom-right{top:auto!important;left:auto!important;right:12px!important;bottom:16px!important;max-width:none!important}
.maplibregl-ctrl-scale{background:rgba(90,94,98,.38);color:#f1f3f5;border-color:#d0d3d5;border-radius:3px;font-size:11px}
.maplibregl-ctrl-top-left{top:8px;left:8px;max-width:calc(100% - 80px)}
.maplibregl-ctrl-top-left .maplibregl-ctrl-attrib{margin:0;background:rgba(30,33,36,.45)!important;font-size:10px!important;line-height:1.4;max-width:100%;padding:3px 5px}
.maplibregl-ctrl-attrib-button{display:none!important}
#panel-heading{flex:1}
#narration-toggle{display:inline-flex;align-items:center;gap:5px;flex-shrink:0;min-height:36px;padding:5px 7px;border:1px solid #536070;border-radius:8px;background:transparent;color:#bdcce0;font-size:13px}
#narration-toggle svg{width:16px;height:16px}
#narration-toggle[aria-pressed=true]{background:#304560;color:#d0e1ff;border-color:#8eafd8}
#narration-toggle:disabled{opacity:.5}
#narration-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
/* One vertical control stack, with matching touch targets and sound state. */
#atlas-map-controls{position:absolute;z-index:9;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));display:flex;flex-direction:column;align-items:center;gap:8px;width:44px}
#atlas-map-controls .maplibregl-ctrl-group{display:flex;flex-direction:column;gap:8px;margin:0;background:none;box-shadow:none;border:0}
#atlas-map-controls .maplibregl-ctrl-group button,#atlas-map-controls #map-layers-button,#atlas-map-controls #narration-toggle{position:static;display:flex;align-items:center;justify-content:center;width:44px;height:44px;min-height:44px;padding:10px;margin:0;box-sizing:border-box;flex:none;border:1px solid #556070;border-radius:50%;background:#242a33;color:#e8edf5;box-shadow:0 2px 8px #0004}
#atlas-map-controls .maplibregl-ctrl-icon{width:100%;height:100%;filter:invert(1)}
#atlas-map-controls svg{width:22px;height:22px}
#atlas-map-controls #narration-toggle span{display:none}
#atlas-map-controls #narration-toggle[aria-pressed=true],#atlas-map-controls #map-layers-button[aria-expanded=true]{background:#334d71;border-color:#9cbff8}
#atlas-map-controls button:focus-visible{outline:2px solid white;outline-offset:3px}
@media(max-width:760px){
 .maplibregl-ctrl-bottom-right{bottom:calc(var(--atlas-sheet-height,204px) + 8px)!important;right:8px!important}
 body[data-sheet=full] .maplibregl-ctrl-bottom-right{display:none}
 #panel-context{gap:8px}
 #panel-heading{font-size:11px;letter-spacing:.4px}
}
