/* A complete, compact route map at the top of the treatment. */
:root{--navigation-height:160px}
.treatment-navigation{position:sticky;top:0;z-index:85;background:#121714;color:#f6eed9;border-bottom:3px solid #ff7421;box-shadow:0 2px 7px #0002}
.treatment-navigation .topbar{position:static;z-index:auto;height:52px;max-width:1680px;margin:auto;padding:0 30px;border:0;background:none;box-shadow:none}
.treatment-navigation .wordmark{flex-shrink:0}
.treatment-navigation .wordmark img{width:49px}
.treatment-navigation .wordmark span{font-size:10px}
.treatment-navigation .top-actions{gap:26px}
.treatment-navigation .top-actions button{padding:9px 0;font:700 10px/1.4 var(--ui,Arial,sans-serif);letter-spacing:.065em;white-space:nowrap}
.treatment-navigation .top-actions button span{font-size:17px;margin-left:6px}
.treatment-navigation #index-toggle[aria-expanded="true"]{color:var(--droplet-blue)}
.chapter-rail{position:relative;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));max-width:1680px;margin:0 auto;padding:0 30px 8px;gap:0;overflow:visible}
.chapter-rail a{position:relative;display:flex;align-items:center;gap:8px;min-width:0;min-height:31px;padding:7px 9px;border-top:1px solid #435047;color:#e7eadd;font:500 11px/1.25 var(--ui,Arial,sans-serif);letter-spacing:0;text-transform:none;transition:background-color .12s,color .12s}
.chapter-rail a::after{content:"";position:absolute;left:9px;right:9px;bottom:1px;height:2px;background:transparent}
.chapter-rail .nav-number{flex:0 0 17px;font:600 9px/1 var(--ui,Arial,sans-serif);font-variant-numeric:tabular-nums;color:var(--droplet-blue);letter-spacing:.015em}
.chapter-rail .nav-label{min-width:0}
.chapter-rail a:hover{background:#26392f;color:#fff}
.chapter-rail a[aria-current="location"]{background:#203128;color:#fff;font-weight:700}
.chapter-rail a[aria-current="location"] .nav-number{color:#ff9b55}
.chapter-rail a[aria-current="location"]::after{background:var(--droplet-blue)}
.treatment-navigation a:focus-visible,.treatment-navigation button:focus-visible{outline:2px solid var(--droplet-blue);outline-offset:2px;z-index:1}

/* The open map is also the phone's all-sections view. */
.chapter-index{position:fixed;inset:var(--navigation-height) 0 0;z-index:90;padding:24px clamp(22px,5vw,80px) 40px;background:#eee6d1 url('assets/subway/cream-tiles.jpg') repeat;background-size:1000px auto;background-blend-mode:soft-light;color:#162218;overscroll-behavior:contain;overflow:auto}
.chapter-index[hidden]{display:none}
.chapter-index .index-intro{max-width:1300px;margin:0 auto;padding-bottom:17px;border-bottom:2px solid #26372a;gap:20px}
.chapter-index .index-intro h2{margin:0;font:700 11px/1.5 var(--ui,Arial,sans-serif);letter-spacing:.09em;text-transform:uppercase}
.chapter-index .index-close{font:400 34px/1 Arial,sans-serif;padding:2px 9px;min-width:42px;min-height:42px;flex-shrink:0}
.chapter-index nav{max-width:1300px;margin:18px auto 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 35px}
.chapter-index nav a{display:flex;align-items:center;gap:12px;min-width:0;min-height:62px;padding:14px 6px;border-bottom:1px solid #899383;font:600 clamp(15px,1.5vw,22px)/1.25 var(--ui,Arial,sans-serif);letter-spacing:-.02em;text-transform:none;transition:color .12s,background-color .12s}
.chapter-index nav a:hover{padding-left:6px;background:#203128;color:var(--droplet-blue)}
.chapter-index nav .nav-number{flex:0 0 23px;font:600 11px/1 var(--ui,Arial,sans-serif);font-variant-numeric:tabular-nums;color:var(--droplet-blue);opacity:1;letter-spacing:0}
.chapter-index nav .nav-label{font:inherit;color:inherit;letter-spacing:inherit;opacity:1}
.chapter-index nav a[aria-current="location"]{color:var(--droplet-blue);background:#203128}
.chapter-index nav a[aria-current="location"] .nav-number{font-weight:800;color:var(--droplet-blue)}
.chapter-index a:focus-visible,.chapter-index button:focus-visible{outline:3px solid var(--droplet-blue);outline-offset:2px}

/* One offset, measured from the actual responsive header. */
:is(#top,#intro,#story,#rush-hour,#pressure-cooker,#all-hell,#smash-cut,#one-last-thing,#shot-list,#hero,#passengers,#jacket,#product,#tone,#camera,#design,#edit,#sound,#process,#thanks,#the-end){scroll-margin-top:calc(var(--navigation-height) + 14px)}
:is(#top,#intro,#story,#rush-hour,#pressure-cooker,#all-hell,#smash-cut,#one-last-thing,#shot-list,#hero,#passengers,#jacket,#product,#tone,#camera,#design,#edit,#sound,#process,#thanks,#the-end):focus{outline:none}

@media(min-width:1680px){.chapter-rail a{font-size:12px}}
@media(max-width:1100px) and (min-width:761px){
 .treatment-navigation .topbar{padding:0 22px}
 .chapter-rail{padding:0 18px 7px}
 .chapter-rail a{padding:6px 6px;gap:5px;font-size:10px;min-height:33px}
 .chapter-rail .nav-number{flex-basis:14px;font-size:8px}
 .chapter-rail a::after{left:6px;right:6px}
}
@media(max-width:760px){
 :root{--navigation-height:99px}
 .treatment-navigation .topbar{height:51px;padding:0 17px}
 .treatment-navigation .wordmark{gap:8px}
 .treatment-navigation .wordmark img{width:43px}
 .treatment-navigation .wordmark span{font-size:8px}
 .treatment-navigation .top-actions{gap:18px}
 .treatment-navigation .top-actions button{font-size:9px;padding:10px 0;letter-spacing:.03em}
 .treatment-navigation .top-actions button span{font-size:17px;margin-left:5px}
 .treatment-navigation #motion-master{font-size:0}
 .treatment-navigation #motion-master span{font-size:16px;margin:0}
 .chapter-rail{display:flex;gap:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:#697c69 #121714;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding:0 10px 5px;-webkit-overflow-scrolling:touch}
 .chapter-rail::-webkit-scrollbar{height:3px}
 .chapter-rail::-webkit-scrollbar-thumb{background:#697c69}
 .chapter-rail::-webkit-scrollbar-track{background:#121714}
 .chapter-rail a{flex:0 0 auto;min-height:37px;padding:9px 11px;font-size:10px;gap:7px;white-space:nowrap;scroll-snap-align:start;border-top:1px solid #435047}
 .chapter-rail .nav-number{font-size:9px;flex-basis:auto}
 .chapter-rail a::after{left:11px;right:11px}
 .chapter-index{padding:17px 22px 35px}
 .chapter-index .index-intro{padding-bottom:10px;gap:12px}
 .chapter-index .index-intro h2{font-size:9px;max-width:225px}
 .chapter-index nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px;margin-top:10px}
 .chapter-index nav a{font-size:15px;min-height:62px;padding:12px 3px;gap:8px}
 .chapter-index nav a:hover{padding-left:3px}
 .chapter-index nav .nav-number{font-size:10px;flex-basis:18px}
}
@media(max-width:350px){
 .treatment-navigation .wordmark span{display:none}
 .chapter-index{padding-left:17px;padding-right:17px}
 .chapter-index nav{column-gap:13px}
 .chapter-index nav a{font-size:14px;gap:6px}
}
@media(prefers-reduced-motion:reduce){.chapter-rail a,.chapter-index nav a{transition:none}}
@media print{.treatment-navigation,.chapter-index{display:none!important}}