/* Application shell, reading panel and story. Map styles live in atlas-map.css. */
:root{--paper:#f8faf7;--ink:#223047;--muted:#596779;--line:#dce2e9;--accent:#305f99;--serif:Georgia,'Times New Roman',serif;--sans:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color-scheme:light;font:14px/1.5 var(--sans);color:var(--ink);background:var(--paper)}
*{box-sizing:border-box}
body{margin:0;height:100dvh;display:flex;flex-direction:column;overflow:hidden}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
button,a,input,select{-webkit-tap-highlight-color:transparent}
button{background:none;border:0}
a{color:var(--accent);text-underline-offset:3px}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid #42795d;outline-offset:4px}
button:disabled{cursor:default;opacity:.4}
[hidden]{display:none!important}
.sr-only,.skip:not(:focus){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.skip:focus{position:fixed;z-index:30;background:white;padding:15px}
.masthead{height:78px;flex-shrink:0;display:flex;align-items:center;padding:0 32px;border-bottom:1px solid var(--line);gap:35px}
.brand{padding:0;text-align:left;font:29px/1 var(--serif);letter-spacing:-1px}
.brand span{display:block;font:8px/1.8 var(--sans);letter-spacing:2.3px;margin-top:6px}
.edition{font-size:12px;border-left:1px solid var(--line);padding-left:26px}
.edition span{display:block;font-size:10px;color:var(--muted)}
.masthead nav{margin-left:auto;display:flex;gap:18px}
.masthead nav button{font-size:12px;padding:10px 0}
.masthead nav button span{font-size:20px;vertical-align:-1px;margin-right:5px}

h1{font:25px/1.2 var(--serif);letter-spacing:-.5px;margin:0 0 6px}

#workspace{display:flex;flex:1;min-height:0;border-top:1px solid transparent}
.map-column{position:relative;flex:1;min-width:0;display:flex;flex-direction:column}
#loading,#map-empty{position:absolute;inset:40% 10% auto;text-align:center;color:var(--muted)}
#map-empty button{display:block;margin:10px auto;text-decoration:underline}
.map-bottom{height:83px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 30px 13px}
.story-entry{display:flex;align-items:center;gap:13px;text-align:left;padding:10px 14px 10px 0}
.story-entry:hover .story-time{background:#dce8dc}
.story-time{width:47px;height:47px;display:grid;place-items:center;border:1px solid #a7b9a7;border-radius:50%;font:13px var(--serif);transition:background .15s}
.story-entry small{display:block;font-size:10px;color:var(--muted);margin-top:2px}
.story-entry>span:last-child{font-size:18px;margin-left:10px}
.map-controls{display:flex;align-items:center;padding:4px;border:1px solid var(--line);border-radius:28px;background:#fff9;gap:2px;white-space:nowrap}
.map-controls button{min-width:36px;min-height:36px;border-radius:20px;padding:6px 9px}
.map-controls button:hover{background:#e5ece2}
.map-controls output{font-size:10px;min-width:38px;text-align:center}
.map-controls #overview{border-left:1px solid var(--line);border-radius:0;padding:5px 12px;font-size:11px}
.atlas-footer{display:flex;align-items:center;gap:18px;padding:10px 32px;border-top:1px solid var(--line);font-size:10px;color:var(--muted);height:42px;flex-shrink:0}
.atlas-footer p{margin:0;margin-left:auto}
.atlas-footer button{font-size:10px;text-decoration:underline;white-space:nowrap}
.depth{display:flex;align-items:center;gap:9px;white-space:nowrap}
.depth i{font-style:normal;color:#a1b19e}
.depth .current{color:var(--ink);font-weight:650}
.depth .current::before{content:'';display:inline-block;width:5px;height:5px;border-radius:50%;background:#3d7455;margin-right:5px}
#inspector{width:420px;flex-shrink:0;border-left:1px solid var(--line);background:#fcfdfb;display:flex;flex-direction:column;min-height:0;box-shadow:-12px 0 30px #243f3903}
.panel-nav{height:49px;flex-shrink:0;display:flex;justify-content:space-between;align-items:center;padding:8px 23px;border-bottom:1px solid #e5eae2}
.panel-nav button{font-size:11px;padding:7px 0}
.panel-nav #panel-close{font-size:18px;padding:4px 6px}
.panel-nav #panel-back:disabled{visibility:hidden}
#panel-content{padding:24px 27px 40px;overflow:auto;min-height:0;scroll-behavior:auto}
#panel-content:focus{outline:none}
.kicker{font-size:9px;font-weight:650;letter-spacing:1.5px;text-transform:uppercase;margin:0 0 12px;color:#5f7768}
h2{font:32px/1.1 var(--serif);letter-spacing:-.8px;margin:0 0 16px}
h3{font-size:10px;text-transform:uppercase;letter-spacing:1.1px;margin:25px 0 10px}
.lead{font:18px/1.5 var(--serif);color:#3f5b4a;margin:0 0 20px}
.body-copy{font-size:13px;line-height:1.75;margin:10px 0}
.evidence-note{font-size:11px;line-height:1.65;color:var(--muted)}
.status{display:inline-block;border:1px solid #d7e0d3;border-radius:20px;padding:4px 9px;font-size:10px;margin:0 0 15px}
.status.unresolved{background:#f4efdf;border-color:#e4d9b7;color:#71643c}
.insight{margin:20px 0;padding:17px 18px;background:#edf3e9;border-left:2px solid #859d78;border-radius:0 8px 8px 0}
.insight .kicker{font-size:8px;margin-bottom:8px}
.insight p:last-child{font:17px/1.4 var(--serif);margin:0}
.entry{display:block;width:100%;text-align:left;border-bottom:1px solid #e2e8dd;padding:14px 0}
.entry strong{display:block;font-weight:500;font-size:13px}
.entry strong::after{content:'↗';float:right;color:#7b927f}
.entry small{display:block;font-size:10px;color:var(--muted);margin-top:4px;line-height:1.6}
.entry:hover strong{color:#1e7747}
.entry .type{font-size:9px;text-transform:uppercase;letter-spacing:.9px}
.section-meta{display:flex;justify-content:space-between;align-items:center}
.section-meta h3{margin-bottom:0}
.section-meta span{font-size:10px;color:var(--muted)}
.lens-context{font-size:12px;background:#f0f4ee;padding:12px 14px;border-radius:7px;margin:15px 0}
.lens-context b{display:block;font-size:9px;text-transform:uppercase;letter-spacing:1px;margin-bottom:6px}
.source-list{padding:0;list-style:none;margin:12px 0}
.source-list li{font-size:11px;padding:8px 0;border-bottom:1px solid #e2e8dd;overflow-wrap:anywhere}
.source-list small{display:block;color:var(--muted);font-size:10px;margin-top:4px}
.panel-action{border:1px solid #a8b9a0;border-radius:25px;padding:9px 14px;font-size:12px;margin:7px 0}
.panel-action:hover{background:#edf3e9}
.fact{border-bottom:1px solid #e2e8dd;padding:12px 0}
.fact dt{font-size:9px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin-bottom:6px}
.fact dd{font-size:12px;line-height:1.65;margin:0}
.search-field{width:100%;border:1px solid #bcccb9;border-radius:8px;padding:11px 12px;background:white;margin:0 0 9px}
.search-summary{font-size:10px;color:var(--muted)}
.story-progress{display:flex;gap:5px;margin:18px 0}
.story-progress button{height:5px;flex:1;background:#dde5d8;border-radius:4px;padding:0}
.story-progress button.current{background:#598365}
.story-clock{font:44px/1 var(--serif);color:#92a788;letter-spacing:-2px;margin:18px 0}
.story-controls{display:flex;justify-content:space-between;margin-top:24px}
.story-controls button{padding:10px 13px;border:1px solid var(--line);border-radius:22px;font-size:11px}
.no-results{font-size:13px;color:var(--muted);padding:20px 0}
.legend-dot{display:inline-block;width:7px;height:7px;background:#476d56;border-radius:50%;margin-right:5px}
.legend-company{border-radius:0;background:transparent;border:1px solid #476d56}
@media(min-width:1500px){#inspector{width:460px}
}
@media(max-width:1000px){.edition{display:none}
.masthead{height:70px;padding:0 24px}


.atlas-footer p{display:none}
#inspector{width:365px}
.map-bottom{padding:8px 18px}
.story-entry small{max-width:145px}
.story-entry>span:last-child{display:none}
.map-controls output{display:none}}
@media(max-width:700px){.masthead{height:62px;padding:0 18px;gap:15px}
.brand{font-size:25px}
.brand span{font-size:7px;margin-top:4px}
.masthead nav{gap:16px}
.masthead nav button{font-size:11px}
.masthead #about-open{display:none}



#workspace{position:relative}
.map-bottom{height:72px;padding:8px 12px}
.story-entry{gap:8px;font-size:11px}
.story-entry small{font-size:9px;max-width:125px}
.story-time{width:36px;height:36px;font-size:11px}
.map-controls button{min-width:32px;min-height:34px;padding:5px}
.map-controls #overview{font-size:10px;padding:5px 9px}
.atlas-footer{padding:8px 16px;height:39px;gap:8px;font-size:9px}
.atlas-footer>button{margin-left:auto;font-size:9px}
.depth{gap:6px}
#inspector{position:absolute;inset:23% 8px 0;width:auto;z-index:10;border:1px solid var(--line);border-radius:15px 15px 0 0;box-shadow:0 -15px 55px #24463118}
.panel-nav{height:43px;padding:7px 19px}
#panel-content{padding:20px 23px 30px}
h2{font-size:29px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.story-chapter{border-top:1px solid var(--line);padding:25px 0 45px;margin:20px 0 30px;min-height:520px}.story-scene{font:20px/1.65 var(--serif);color:#405947}.story-chapter .story-clock{font-size:50px;margin:12px 0 23px}.story-chapter details{font-size:12px;margin:25px 0}.story-chapter summary{cursor:pointer;text-underline-offset:4px;text-decoration:underline;color:#506d58}.story-chapter .field-question{margin-top:28px;font-size:8px}.scroll-cue{font-size:11px;margin:24px 0;color:#658268;letter-spacing:.7px}
@media(max-width:700px){.story-entry{min-width:0;padding-right:6px}.story-entry .story-time{flex-shrink:0;width:32px;height:32px}.story-entry>span:nth-child(2){max-width:120px}.map-controls{flex-shrink:0}.map-controls button{min-width:28px}.map-controls #overview{padding:5px 7px}}
.editorial-asset{object-fit:contain;object-position:center bottom}
.story-chapter>.editorial-asset{width:125px;height:145px;float:right;margin:0 0 15px 15px}
.stress-banner{padding:7px 18px;background:#fff0bb;color:#5c4210;text-align:center;font-size:11px;flex-shrink:0}
@media(min-width:701px){.masthead{height:64px}.map-bottom{height:60px}.atlas-footer{height:34px;padding-top:6px;padding-bottom:6px}}

/* Keep the name and purpose together across every map level. */
.masthead{height:auto;min-height:84px;flex-direction:column;align-items:flex-start;justify-content:center;gap:5px;padding-top:15px;padding-bottom:15px}
.brand-tagline{margin:0;font-size:14px;line-height:1.4;font-weight:400;color:var(--muted)}

/* Decorative loading shapes mirror the map's composition without inventing content. */
#loading:has(.map-skeletons){inset:7% 5% auto;pointer-events:none}
.map-skeletons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px;max-width:1120px;margin:auto;text-align:left}
.map-skeleton{position:relative;padding:24px 34px 35px;isolation:isolate}
.map-skeleton::before{content:"";position:absolute;inset:0;background:#eef0e8;opacity:.45;border-radius:46% 54% 48% 52% / 44% 45% 55% 56%;z-index:-1}
.map-skeleton:nth-child(even)::before{background:#f0eae4;border-radius:53% 47% 54% 46% / 48% 51% 49% 52%}
.map-skeleton span{display:block;background:#dce1d7;opacity:.6}
.skeleton-illustration{height:clamp(90px,19vh,190px);width:82%;margin:0 auto 25px;border-radius:48% 52% 43% 57% / 54% 47% 53% 46%}
.skeleton-title{height:24px;width:78%;border-radius:12px;margin:0 0 12px}
.skeleton-line{height:12px;width:62%;border-radius:6px}
