/* The Atlas of the Middle */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.ahero{padding-block:56px 20px;border:0}
.ahero h1{max-width:16ch}
.ahero .lede{max-width:62ch}
.amap{padding-block:16px 48px;border:0!important}
.controls{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:end;padding:14px;border:1px solid var(--rule);border-radius:12px;background:var(--surface)}
.controls .qf{flex:1 1 240px}
.controls .yf{width:96px}
.controls .yf>span{font:500 12px var(--sans);color:var(--muted)}
.cgroup{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.cgroup>span{font:500 12px var(--sans);color:var(--muted);width:100%}
.cgroup button{font:500 13px/1 var(--sans);padding:8px 10px;border-radius:999px;border:1px solid var(--rule);background:var(--bg);color:var(--ink);cursor:pointer;transition:background .2s ease,color .2s ease}
.cgroup button[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.linkbtn{background:none;border:0;padding:8px 0;font:500 13px var(--sans);color:var(--muted);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.count{font-size:14px;color:var(--muted);margin:14px 0 6px;font-variant-numeric:tabular-nums}
.stage{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:20px;align-items:start}
@media (max-width:980px){.stage{grid-template-columns:1fr}}
.mapwrap{position:relative;min-width:0}
#map{display:block;width:100%;height:auto;overflow:visible;touch-action:manipulation}
#map .dot{cursor:pointer;transition:opacity .35s ease,r .25s ease}
#map .dot.off{opacity:.08;pointer-events:none}
#map .dot.hi{stroke:var(--amber);stroke-width:2.5}
#map .clab{font:600 21px var(--serif);fill:var(--ink)}
#map .csub{font:500 15px var(--sans);fill:var(--muted)}
#map a:hover .clab{fill:var(--amber)}
#map .link{stroke:var(--amber);stroke-width:1.4;stroke-dasharray:3 3;fill:none;opacity:.9}
#map .halo{fill:none;stroke:var(--rule);stroke-dasharray:2 5}
#map .halo.w{stroke:var(--dot-mid);stroke-opacity:.45;stroke-width:6;stroke-dasharray:18 10 4 10}
.dot.d-supports,.d-supports .dotfill{fill:var(--dot-top)}
.dot.d-mixed{fill:var(--faint)}
.dot.d-challenges{fill:var(--amber)}
.dot.d-none{fill:var(--bg);stroke:var(--faint);stroke-width:1.4}
i.dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;vertical-align:-1px}
i.dot.d-supports{background:var(--dot-top)} i.dot.d-mixed{background:var(--faint)} i.dot.d-challenges{background:var(--amber)} i.dot.d-none{background:var(--bg);box-shadow:inset 0 0 0 1.5px var(--faint)}
.tip{position:absolute;z-index:4;max-width:300px;background:var(--ink);color:var(--bg);border-radius:10px;padding:10px 12px;font:400 13.5px/1.4 var(--sans);pointer-events:none;box-shadow:0 12px 30px -16px rgba(6,14,25,.6)}
.tip b{display:block;font:600 13px var(--sans);color:var(--amber-soft);margin-bottom:3px}
.side{position:sticky;top:84px;background:var(--surface);border:1px solid var(--rule);border-radius:12px;padding:18px;min-height:220px}
@media (max-width:980px){.side{position:static}}
.side h3{font-size:20px;margin:6px 0 8px}
.side .cite{margin:0}
.side .finding{font-size:17px;margin:10px 0}
.side .chips{margin:10px 0}
.legend2{display:flex;flex-wrap:wrap;gap:8px 20px;font-size:13px;color:var(--muted);margin-top:10px}
.cite{font:500 13.5px var(--sans);color:var(--amber);margin:0 0 8px}
.cite i{font-style:italic}
.finding{font:400 clamp(19px,2.2vw,23px)/1.5 var(--serif);margin:18px 0 22px;max-width:60ch}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.pchip{display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border:1px solid var(--rule);border-radius:999px;font:500 13px var(--sans);text-decoration:none;background:var(--surface)}
.pchip i{width:9px;height:9px;border-radius:50%;background:var(--dot-top)}
.pchip.d-mixed i{background:var(--faint)} .pchip.d-challenges i{background:var(--amber)}
.pchip span{color:var(--muted);font-weight:400}
.pchip:hover{border-color:var(--ink)}
.str{display:inline-block;font:600 11.5px/1 var(--sans);padding:4px 7px;border-radius:5px;background:var(--chip);color:var(--muted)}
.str.s-high{background:var(--ink);color:var(--bg)} .str.s-medium{background:color-mix(in srgb,var(--ink) 18%,var(--chip));color:var(--ink)}
.aparts,.alist,.amethod{padding-block:56px}
.pgrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:18px}
@media (max-width:1000px){.pgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.pgrid{grid-template-columns:1fr}}
.pcard{display:grid;gap:6px;align-content:start;padding:16px;border:1px solid var(--rule);border-radius:12px;background:var(--surface);text-decoration:none;transition:border-color .2s ease}
.pcard:hover{border-color:var(--ink)}
.pcard .n{font:500 12px var(--sans);color:var(--amber)}
.pcard b{font:600 18px/1.2 var(--serif)}
.pcard span{font-size:14px;color:var(--muted)}
.pcard em{font-style:normal;font:600 13px var(--sans);margin-top:4px}
.slist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}
@media (max-width:760px){.slist{grid-template-columns:1fr}}
.scard{display:grid;gap:6px;padding:16px;border:1px solid var(--rule);border-radius:12px;background:var(--surface);text-decoration:none;transition:border-color .2s ease}
.scard:hover{border-color:var(--ink)}
.scard .meta{font:500 12.5px var(--sans);color:var(--muted);display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.scard b{font:600 16.5px/1.3 var(--serif)}
.scard>span:last-child{font-size:14.5px;line-height:1.5}
.amethod p{font:400 17px/1.65 var(--serif)}
.a-cta{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;background:var(--navy);color:var(--on-navy);border-radius:14px;padding:28px;margin-block:48px}
@media (max-width:700px){.a-cta{grid-template-columns:1fr}}
.a-cta h2{color:var(--on-navy);margin:0 0 6px}
.a-cta p{margin:0;color:var(--on-navy-muted)}
.a-cta .btn{background:var(--chip);border-color:var(--amber-soft);color:#0D1A2B}
/* study + part pages */
.study,.part{padding-block:28px 24px}
.crumb{display:flex;gap:8px;flex-wrap:wrap;font-size:13.5px;color:var(--muted);margin-bottom:26px}
.crumb a{color:var(--ink)}
.sgrid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:48px;align-items:start}
@media (max-width:900px){.sgrid{grid-template-columns:1fr;gap:24px}}
.study h1{font-size:clamp(28px,4vw,44px);max-width:22ch}
.kind{display:inline-block;font:600 12.5px var(--sans);background:var(--chip);padding:6px 10px;border-radius:6px;margin:0}
.h3{font:600 13px var(--sans);color:var(--muted);margin:0 0 10px}
.provenance{font-size:13px;color:var(--muted);margin-top:26px;max-width:62ch}
.facts{background:var(--surface);border:1px solid var(--rule);border-radius:12px;padding:18px}
.facts dl{margin:0;display:grid;gap:12px}
.facts dt{font:600 12px var(--sans);color:var(--muted)}
.facts dd{margin:2px 0 0;font-size:14.5px}
.facts dd small{display:block;color:var(--muted);font-size:12.5px;margin-top:6px;line-height:1.4}
.rel{padding-block:40px 0;border:0}
.rgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media (max-width:1000px){.rgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.rgrid{grid-template-columns:1fr}}
.rcard{display:grid;gap:6px;padding:14px;border:1px solid var(--rule);border-radius:10px;text-decoration:none;background:var(--surface);font-size:14px;line-height:1.45}
.rcard b{font:600 14px var(--sans);color:var(--amber)}
.rcard:hover{border-color:var(--ink)}
.phead{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:40px;align-items:start}
@media (max-width:860px){.phead{grid-template-columns:1fr;gap:20px}}
.phead p{font:400 17px/1.6 var(--serif)}
.phead .lede{font-size:21px}
.pstat{background:var(--surface);border:1px solid var(--rule);border-radius:12px;padding:18px;display:grid;gap:8px}
.pstat b{font:700 46px/1 var(--serif);font-variant-numeric:tabular-nums}
.pstat>span{color:var(--muted);font-size:14px}
.pstat .bar{display:flex;height:12px;border-radius:6px;overflow:hidden;background:var(--chip)}
.pnav{display:flex;flex-wrap:wrap;gap:6px;margin:28px 0 8px}
.pnav a{font:500 13px var(--sans);padding:8px 11px;border:1px solid var(--rule);border-radius:999px;text-decoration:none;color:var(--muted)}
.pnav a[aria-current]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.dgroup{padding-block:28px 0;border:0}
.dgroup h2{font-size:24px;display:flex;align-items:center;gap:4px}
.dgroup h2 small{font:500 14px var(--sans);color:var(--muted);margin-left:8px}

/* ---- narrow screens ---- */
.ftoggle{display:none}
#map .cnum{display:none}
#map .cnum circle{fill:var(--ink)}
#map .cnum text{font:700 34px var(--serif);fill:var(--bg)}
.mkey{display:none}
@media (max-width:760px){
  .ahero{padding-block:20px 8px}
  .ahero h1{font-size:40px}
  .controls{padding:10px;gap:8px;align-items:center}
  .controls .qf{flex:1 1 0;min-width:0}
  .ftoggle{display:inline-flex;align-items:center;font:600 14px var(--sans);padding:11px 14px;border:1px solid var(--rule);border-radius:8px;background:var(--bg);color:var(--ink);cursor:pointer}
  .ftoggle[aria-expanded="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
  .controls .cgroup,.controls .yf,.controls #reset{display:none}
  .controls.showf .cgroup,.controls.showf .yf,.controls.showf #reset{display:flex}
  .controls.showf .yf{display:grid;flex:1 1 40%}
  #map .clab,#map .csub{display:none}
  #map .cnum{display:inline}
  .mkey{display:block;list-style:none;margin:8px 0 0;padding:0;border-top:1px solid var(--rule)}
  .mkey li{display:block;border-bottom:1px solid var(--rule)}
  .mkey .krow{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 2px;font-size:15px;line-height:1.3;text-decoration:none;color:var(--ink)}
  .mkey .krow em{font-style:normal}
  .mkey b,.mkey .b0{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--ink);color:var(--bg);font:700 14px/1 var(--serif)}
  .mkey .krow>span:last-child{color:var(--muted);font-variant-numeric:tabular-nums}
  .legend2{gap:6px 14px;font-size:12.5px}
}
/* answer pages */
.answer .narrowish{max-width:46rem}
.answer h1{text-wrap:balance}
.answer .short{border-left:4px solid var(--amber);background:var(--chip);padding:1.1rem 1.3rem;margin:1.4rem 0 1rem;border-radius:0 10px 10px 0}
.answer .short p{font-size:1.15rem;line-height:1.55;margin:.4rem 0 0}
.answer .gp{max-width:46rem;color:var(--muted)}
.answer .means,.answer .faq{margin-top:2.6rem}
.answer .faq details{border-top:1px solid var(--rule);padding:.9rem 0}
.answer .faq summary{cursor:pointer;font-weight:600}
.answer .faq p{margin:.6rem 0 0}
.qgrid .rcard b{font-size:1.05rem}
.qrel{margin:28px 0 8px;padding:0;border:0}
.qrel h2{font-size:20px;margin:0 0 12px}
.qlist{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.qlist a{display:grid;gap:4px;padding:14px 16px;border:1px solid var(--rule);border-left:3px solid var(--amber);border-radius:10px;background:var(--surface);color:var(--ink);text-decoration:none;font:600 16px/1.3 var(--serif)}
.qlist a span{font:600 11px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--amber)}
.qlist a:hover{border-color:var(--ink);border-left-color:var(--amber)}