/* Illustrated atlas and field journal. Scoped to the two visitor guides. */
body:is([data-page="maps"],[data-page="walkthrough"]) .wrap { max-width:1400px; }
.guide-heading { padding-top:22px; }
.guide-heading .breadcrumbs { margin-bottom:20px; }
.guide-heading-row { align-items:center; padding-bottom:25px; gap:35px; }
.guide-heading h1 { font-size:clamp(38px,4.1vw,58px); margin-top:7px; }
.guide-heading-row>p { max-width:450px; font-size:16px; }
.guide-content { padding-top:22px; }
.gate-open-note { margin-bottom:20px; padding-bottom:15px; }
.chapter-picker-heading { margin-bottom:16px; }
.chapter-picker-heading h2 { font-size:30px; }
.chapter-picker-heading p { font-size:14px; margin-top:6px; }
.chapter-choice { min-height:86px; padding:13px 16px; background:linear-gradient(135deg,#1d332d,#142523); }
.chapter-choice strong { font-size:15px; }
.guide-scope { font-size:13px; margin:16px 0 24px; }
.chapter-toolbar { box-shadow:0 8px 20px #06110f30; }
.chapter-frontispiece { display:grid; grid-template-columns:1fr 32%; min-height:190px; border:1px solid var(--line); background:linear-gradient(115deg,#243b32,#142523); overflow:hidden; }
.chapter-frontispiece>img { width:100%; height:100%; object-fit:cover; min-height:190px; border-left:1px solid var(--line); }
.chapter-title { border:0; padding:27px 32px; gap:26px; align-items:start; }
.chapter-title .chapter-number { font-size:76px; opacity:.75; line-height:.9; padding-top:4px; }
.chapter-title h2 { font-size:clamp(32px,3vw,43px); margin:8px 0 12px; line-height:1.05; max-width:660px; }
.chapter-meta { color:var(--muted); margin:0; font-size:13px; }
.chapter-meta span { padding-inline:8px; color:var(--gold); }
.chapter-route-note { margin:0 0 24px; border-bottom:1px solid var(--line); padding:12px 4px; }
.chapter-route-note summary { cursor:pointer; color:var(--gold-light); font-size:14px; }
.chapter-route-note summary span { color:var(--muted); }
.chapter-route-note p { max-width:800px; color:var(--muted); font-size:16px; margin:14px 0 5px; }

/* The diagram and its selected field note share one workspace. */
.atlas-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(330px, .49fr); gap:24px; align-items:start; overflow-anchor:none; }
.atlas-chart { min-width:0; }
.map-content { scroll-margin-top:84px; }
.inspector-heading { display:none; }
.map-toolbar { gap:12px; padding:10px 14px; }
.map-toolbar>span { font-size:14px; color:var(--gold-light); }
.map-scale-controls { display:flex; align-items:center; gap:3px; margin-left:auto; }
.map-scale-controls button { min-width:36px; min-height:40px; border:1px solid var(--line); font-size:18px; }
.map-scale-controls [data-map-fit] { font-size:14px; padding-inline:10px; margin-left:5px; }
.map-scale-controls button:hover:not(:disabled) { background:#d7b78320; border-color:var(--gold); }
.map-scale-controls output { font-size:12px; width:40px; text-align:center; font-variant-numeric:tabular-nums; }
.map-toolbar [data-hide-map] { font-size:13px; margin-left:8px; min-height:40px; }
.map-scroll { height:530px; max-height:65svh; min-height:330px; padding:12px; scrollbar-color:#8c8d68 #132320; scrollbar-width:thin; overscroll-behavior:contain; }
.route-map { min-width:0; max-width:none; height:auto; margin:auto; }
.route-map .map-node-box { fill:#173029; stroke:#6d92807a; }
.map-edge { stroke-width:2; opacity:.56; }
.map-edge.is-connected { stroke-width:3.5; opacity:1; }
.route-map a[aria-current] .map-node-box { fill:#e5c897; stroke:#f4e4c1; stroke-width:2; }
.route-map a[aria-current] text { fill:#1d3229; }
.route-map a:hover .map-node-box,.route-map a:focus .map-node-box { stroke:#f2d7a9; stroke-width:3; }
.route-map .map-photo-marker rect { fill:#b9cfbb; stroke:none; }
.route-map .map-photo-marker path,.route-map .map-photo-marker circle { stroke:#143328; stroke-width:1.5; fill:none; }
.route-map a[aria-current] .map-photo-marker rect { fill:#234b3b; }
.route-map a[aria-current] .map-photo-marker path,.route-map a[aria-current] .map-photo-marker circle { stroke:#f1dfb9; }
.map-node-name { font-size:16px; }
.route-map .map-node-type { font-size:10px; letter-spacing:.6px; }
.map-legend { gap:10px 17px; font-size:12px; margin-top:15px; }
.map-legend .icon { width:17px; height:17px; color:var(--mint); }
.map-caption { font-size:13px; margin-bottom:22px; }
.photo-stops { border-top:1px solid var(--line); padding-top:17px; }
.photo-stops>div { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:12px; }
.photo-stops button { display:grid; grid-template-columns:1fr 18px; text-align:left; align-content:start; gap:8px; padding:7px; border:1px solid var(--line); background:#142923; }
.photo-stops button img { width:100%; height:76px; object-fit:cover; grid-column:1/-1; }
.photo-stops button span { font-size:13px; line-height:1.4; }
.photo-stops button .icon { width:16px; height:16px; color:var(--gold); }
.photo-stops button:hover,.photo-stops button[aria-pressed="true"] { border-color:var(--gold); background:#24372b; }
.atlas-inspector { padding:23px; background:var(--paper); color:var(--dark-text); border-top:3px solid var(--gold); position:sticky; top:calc(var(--header-height) + 78px); max-height:calc(100svh - var(--header-height) - 94px); overflow:auto; scrollbar-width:thin; scrollbar-color:#8e947c var(--paper); scroll-margin-top:84px; box-shadow:0 12px 32px #04110c26; }
.location-selector { display:grid; gap:8px; font-size:13px; color:#52604e; padding-bottom:21px; border-bottom:1px solid #61705a40; margin-bottom:21px; }
.location-selector select { width:100%; color:#20392c; background:#f7f3e8; border-color:#97a18b; font-size:15px; padding:10px; }
.atlas-inspector .eyebrow { color:#56634e; font-size:12px; }
.location-panels h3 { font-size:33px; line-height:1.08; margin:8px 0 20px; }
.location-text-note { color:#53624f; font-size:16px; }
.location-hint-link { display:flex; justify-content:space-between; gap:15px; padding:13px 0; margin:13px 0 21px; border-bottom:1px solid #62745c55; color:#2c4c37; font-size:14px; font-weight:600; }
.location-hint-link:hover { color:#627b42; }
.connections-heading { font:500 24px var(--display); margin:19px 0 4px; }
.connection-list { margin-bottom:0; }
.connection-list li { border-color:#61705a35; padding:12px 0; }
.connection-list button { color:#254835; font-size:15px; width:100%; justify-content:space-between; min-height:28px; }
.connection-list button:hover { color:#687836; }
.connection-list small { font-size:12px; color:#5b6757; }
.connection-list summary { color:#53634a; font-size:13px; }
.connection-list details p { font-size:14px; color:#2a422f; }

/* A single scene viewer is used in both guides. Large images load on demand. */
.location-media { margin:0; background:transparent; color:var(--cream); border:0; min-width:0; }
.location-photo { display:block; width:100%; position:relative; padding:0; cursor:zoom-in; background:#091914; }
.location-photo img { display:block; width:100%; height:auto; aspect-ratio:16/9; object-fit:contain; }
.photo-zoom { position:absolute; right:10px; bottom:10px; display:grid; place-items:center; width:38px; height:38px; border:1px solid #d7b783a0; background:#071912ce; color:#f5e5c6; }
.photo-zoom .icon { width:18px; height:18px; }
.location-photo:hover .photo-zoom { background:var(--gold); color:var(--ink); }
.location-media figcaption { padding:13px 14px; display:grid; gap:6px; }
.media-kind { color:var(--gold-light); text-transform:uppercase; font-size:11px; letter-spacing:.09em; }
.media-caption { font-size:13px; color:#c3d0c0; line-height:1.55; }
.scene-states { border-top:1px solid #d7b78335; padding:0 14px; }
.scene-states summary { padding:12px 0; font-size:13px; cursor:pointer; color:var(--gold-light); }
.scene-states summary span { color:#abbfa9; }
.scene-states p { color:#c3d0c0; font-size:13px; margin:0 0 12px; line-height:1.6; }
.scene-states label { display:grid; gap:6px; font-size:12px; color:#c3d0c0; margin-bottom:14px; }
.scene-states select { min-width:0; width:100%; font-size:14px; }
.location-image-dialog { width:min(1280px,96vw); max-width:none; padding:20px; max-height:94svh; overflow:auto; background:#0b1b17; border:1px solid #b6a77c; color:var(--cream); }
.image-dialog-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:16px; }
.image-dialog-heading h2 { font:500 34px/1.1 var(--display); margin-top:6px; }
.image-dialog-heading .eyebrow { font-size:12px; }
.image-dialog-heading button { flex-shrink:0; }
#location-image-full { display:block; width:100%; max-height:70svh; object-fit:contain; background:#06110e; }
#location-image-caption { font-size:14px; color:var(--muted); margin:14px 0 0; }
.viewer-scene-states { border-top:1px solid var(--line); margin-top:16px; padding-top:12px; }
.viewer-scene-states summary { cursor:pointer; font-size:14px; color:var(--gold-light); padding:5px 0; }
.viewer-scene-states label { display:inline-block; margin-right:15px; font-size:14px; color:var(--muted); }
.viewer-scene-states select { font-size:14px; margin-top:13px; min-width:220px; max-width:100%; }

/* The journal reads like a set of illustrated field notes. */
.guide-actions { font-size:14px; }
.walkthrough-list { border:1px solid #d7b78370; background:var(--paper); color:var(--dark-text); }
.walkthrough-step { border-color:#5c704c33; }
.walkthrough-step:last-child { border-bottom:0; }
.walkthrough-step>summary { min-height:90px; padding:15px 28px; gap:20px; font-size:20px; }
.walkthrough-step>summary:hover { background:#73865c10; }
.step-number { color:#7a825f; font-size:32px; min-width:37px; }
.step-name { font:600 25px/1.2 var(--display); }
.step-name small { display:block; font:400 12px/1.5 var(--body); color:#65705c; margin-top:5px; }
.step-plus { color:#647652; font-size:27px; }
.step-thumbnail { position:relative; width:120px; height:68px; margin-left:auto; flex-shrink:0; border:1px solid #566e4540; }
.step-thumbnail img { width:100%; height:100%; object-fit:cover; }
.step-thumbnail .icon { position:absolute; right:5px; bottom:5px; width:20px; height:20px; padding:2px; color:var(--gold-light); background:#0b241fe0; }
.step-thumbnail+.step-plus { margin-left:0; }
.walkthrough-step[open] { background:#f3efe3; box-shadow:inset 4px 0 #8c9870; }
.walkthrough-step[open]>summary { border-bottom:1px solid #5c704c25; }
.step-body { max-width:none; padding:27px 32px 32px 85px; }
.step-body.has-media { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(280px,1fr); gap:35px; align-items:start; }
.hint-copy { max-width:720px; }
.hint-copy>p:not(.hint-level) { font-size:17px; line-height:1.8; color:#304630; }
.hint-level { color:#687852; font-size:12px; }
.deeper-hint { border-color:#63764a40; }
.deeper-hint summary { font-size:15px; color:#3c5b34; padding-block:10px; }
.deeper-hint p { color:#304630; line-height:1.8; }
.solution { background:#7180570c; border-color:#819362; }
.map-crosslink { color:#526846; font-size:14px; }
.step-body .location-media { margin:0; }
.walkthrough-step,.walkthrough-step>summary { scroll-margin-top:84px; }

@media(min-width:1500px) { .map-scroll { height:620px; } }
@media(max-width:1100px) {
  .chapter-title { padding:23px; gap:19px; }
  .chapter-title .chapter-number { font-size:60px; }
  .atlas-layout { grid-template-columns:minmax(0,1fr) 330px; gap:18px; }
  .atlas-inspector { padding:19px; }
  .map-toolbar>span { display:none; }
  .map-scale-controls { margin-left:0; }
  .step-body { padding-left:30px; }
}
@media(max-width:1000px) {
  .inspector-heading { display:flex; justify-content:space-between; gap:12px; margin-bottom:18px; font-size:13px; color:#53634a; }
  .inspector-heading button { padding:0; text-decoration:underline; text-underline-offset:4px; }
  .atlas-layout { grid-template-columns:1fr; gap:25px; }
  .atlas-inspector { position:static; max-height:none; overflow:visible; }
  .location-panels article { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); column-gap:28px; align-items:start; }
  .location-panels article[hidden] { display:none; }
  .location-panels article>.eyebrow,.location-panels article>h3 { grid-column:1/-1; }
  .location-panels article>.location-media { grid-column:1; grid-row:3/7; }
  .location-panels article>.location-hint-link,.location-panels article>.connections-heading,.location-panels article>.connection-list { grid-column:2; }
  .location-hint-link { margin-top:0; }
  .map-toolbar>span { display:block; }
  .map-scale-controls { margin-left:auto; }
}
@media(max-width:760px) {
  .guide-heading-row { display:block; }
  .guide-heading-row>p { margin-top:15px; max-width:600px; }
  .chapter-frontispiece { grid-template-columns:1fr 25%; }
  .chapter-title .chapter-number { font-size:49px; }
  .chapter-title { gap:15px; padding:22px 18px; }
  .chapter-title h2 { font-size:33px; }
  .chapter-title .eyebrow { font-size:10px; }
  .chapter-meta { font-size:12px; }
  .step-body.has-media { grid-template-columns:1fr; gap:24px; }
  .step-body .location-media { max-width:600px; }
  .step-body { padding:22px; }
}
@media(max-width:600px) {
  .guide-heading h1 { font-size:39px; }
  .guide-heading .breadcrumbs { margin-bottom:16px; }
  .guide-heading-row { padding-bottom:18px; }
  .chapter-choice { min-height:102px; padding:12px; }
  .chapter-frontispiece { display:block; position:relative; isolation:isolate; }
  .chapter-frontispiece>img { position:absolute; inset:0; z-index:-2; width:100%; height:100%; opacity:.2; object-fit:cover; border:0; }
  .chapter-frontispiece::after { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,#10261ce8,#10261c70); }
  .chapter-title { padding:24px 18px; gap:15px; }
  .chapter-meta { color:#cad6c3; }
  .chapter-title h2 { font-size:34px; }
  .chapter-title .chapter-number { font-size:51px; }
  .map-toolbar { padding:8px; gap:7px; }
  .map-toolbar>span { display:none; }
  .map-scale-controls { margin-left:0; }
  .map-toolbar [data-hide-map] { margin-left:auto; }
  .map-scale-controls button { min-width:33px; min-height:44px; }
  .map-scale-controls [data-map-fit] { padding-inline:7px; }
  .map-scale-controls output { width:36px; }
  .map-scroll { height:385px; min-height:300px; }
  .map-legend { font-size:12px; gap:8px 14px; }
  .photo-stops>div { gap:7px; }
  .photo-stops button { padding:5px; gap:6px; grid-template-columns:1fr; }
  .photo-stops button img { height:53px; }
  .photo-stops button span { font-size:12px; }
  .photo-stops button .icon { display:none; }
  .atlas-inspector { padding:19px; scroll-margin-top:76px; }
  .location-panels article { display:block; }
  .location-hint-link { margin-top:12px; }
  .guide-actions { align-items:start; gap:15px; font-size:12px; }
  .guide-actions>span { max-width:180px; }
  .guide-actions .text-button { font-size:13px; white-space:nowrap; }
  .walkthrough-step>summary { padding:15px 14px; gap:11px; min-height:88px; }
  .step-number { min-width:23px; font-size:27px; }
  .step-name { font-size:22px; }
  .step-name small { font-size:11px; }
  .step-thumbnail { width:66px; height:48px; }
  .step-plus { font-size:23px; }
  .step-body { padding:20px 17px 24px; }
  .hint-copy>p:not(.hint-level) { font-size:16px; }
  .location-image-dialog { padding:13px; width:96vw; }
  .image-dialog-heading { gap:10px; }
  .image-dialog-heading h2 { font-size:28px; }
  .image-dialog-heading .eyebrow { font-size:10px; }
}
@media(prefers-reduced-motion:reduce) { .route-map,.location-photo { transition:none; } }