@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600&family=Be+Vietnam+Pro:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');
:root{--cream:#f7efdf;--paper:#fcf6e9;--red:#722932;--ink:#44352c;--muted:#796957;--line:#d9c9b1;--serif:'Fraunces',Georgia,serif;--sans:'Be Vietnam Pro',sans-serif;--mono:'IBM Plex Mono',monospace;color-scheme:light}*{box-sizing:border-box}body{margin:0;background:#e9decb;color:var(--ink);font:13px/1.8 var(--sans)}a{color:inherit;text-underline-offset:4px}a:focus-visible,button:focus-visible{outline:2px solid var(--red);outline-offset:5px}.demo-switch{max-width:1260px;margin:18px auto;display:flex;align-items:center;gap:22px;font:10px var(--mono);padding:0 20px;flex-wrap:wrap}.demo-switch span{margin-right:auto;color:var(--muted);letter-spacing:.1em}.demo-switch a{text-decoration:none;padding:7px 0}.demo-switch [aria-current]{border-bottom:1px solid var(--red);color:var(--red)}.book{max-width:1260px;margin:0 auto 35px;background:var(--paper);box-shadow:0 15px 60px #49342312;border:1px solid #d7c7ad;padding:0 46px}.mast{padding:23px 0;border-bottom:2px solid var(--red);display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{font:600 23px var(--serif);color:var(--red);text-decoration:none}.mast nav{display:flex;gap:24px;font:10px var(--mono)}.mast nav a{text-decoration:none}.spread{display:grid;grid-template-columns:1fr 1fr}.cover{padding:33px 40px 29px 0;border-right:1px solid var(--line)}.eyebrow{font:10px var(--mono);text-transform:uppercase;letter-spacing:.12em;color:var(--red);margin:0 0 20px}.cover h1{font:400 88px/.99 var(--serif);letter-spacing:-.055em;color:var(--red);margin:0 0 20px}.cover h1 em{font-weight:400}.specialty{font:500 12px var(--mono);letter-spacing:.03em;margin:0 0 12px}.intro{color:var(--muted);max-width:44ch;font-size:12px;line-height:1.85;margin:0 0 24px}.film{position:relative;margin:0;border-block:1px solid var(--line);padding:7px 0}.film video{width:100%;aspect-ratio:16/9;display:block;object-fit:contain}.film button{position:absolute;right:10px;bottom:16px;border:1px solid var(--line);background:var(--paper);color:var(--red);font:9px var(--mono);padding:7px 9px;cursor:pointer}.caption{display:flex;justify-content:space-between;gap:20px;font:9px var(--mono);color:var(--muted);margin:12px 0 0}.chapter-index{padding:33px 0 22px 38px;min-width:0;position:relative}.index-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:17px;gap:15px}.index-head h2{font:400 30px var(--serif);color:var(--red);margin:0}.index-head span{font:9px var(--mono);color:var(--muted)}.index-note{font-size:11px;color:var(--muted);margin:0 0 12px}.route{list-style:none;padding:0;margin:0;position:relative}.route:before{content:'';position:absolute;left:11px;top:45px;bottom:47px;border-left:1px dashed #a76e6a}.route li{position:relative}.route a{display:grid;grid-template-columns:24px 95px 1fr 14px;gap:14px;align-items:center;text-decoration:none;padding:18px 0;border-bottom:1px solid var(--line);position:relative}.route li:last-child a{border:0}.route .num{border:1px solid var(--red);border-radius:50%;width:23px;height:23px;background:var(--paper);color:var(--red);font:10px var(--mono);display:grid;place-items:center}.route img{width:95px;height:auto;transform:rotate(-5deg);transition:transform .2s;filter:drop-shadow(1px 3px 2px #49342320)}.route li:nth-child(even) img{transform:rotate(5deg)}.route a:hover img{transform:rotate(0) translateY(-3px)}.date{display:block;font:9px var(--mono);color:var(--muted);margin-bottom:5px}.route h3{font:500 22px/1.2 var(--serif);margin:0 0 5px;color:var(--red)}.org{font-size:10px;line-height:1.5;display:block;color:var(--muted)}.arrow{color:var(--red)}.route-foot{font:9px/1.8 var(--mono);color:var(--muted);margin:16px 0 0}.evidence{border-block:1px solid var(--red);display:grid;grid-template-columns:1fr 1fr 1fr;padding:22px 0;gap:25px}.evidence div{display:flex;align-items:center;gap:17px}.evidence strong{font:400 29px var(--serif);white-space:nowrap;color:var(--red)}.evidence span{font-size:10px;color:var(--muted);max-width:20ch}.bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:23px 0;font:9px var(--mono);color:var(--muted)}.bottom a{color:var(--red)}
/* Alternative: a film opening followed by a collection of stamps. */
.cinema .spread{display:block}.cinema .cover{display:grid;grid-template-columns:.8fr 1.2fr;column-gap:48px;padding:38px 0 30px;border:0;align-items:center}.cinema .cover-copy{grid-row:1;grid-column:1}.cinema .film-area{grid-column:2;grid-row:1}.cinema .cover h1{font-size:76px}.cinema .chapter-index{padding:25px 0 28px;border-top:1px solid var(--line)}.cinema .route{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:26px}.cinema .route:before{left:12px;right:12px;top:28px;bottom:auto;border-left:0;border-top:1px dashed #a76e6a}.cinema .route a{display:flex;flex-direction:column;align-items:flex-start;gap:12px;border:0;padding:17px 0 0}.cinema .route .num{z-index:1}.cinema .route img{width:135px;max-width:100%;align-self:center;margin:7px 0 10px}.cinema .route .arrow{position:absolute;top:21px;right:0}.cinema .route h3{font-size:23px}.cinema .org{font-size:11px}.cinema .route-foot{margin-top:25px}
@media(max-width:1050px){.book{margin-inline:20px;padding-inline:28px}.cover{padding-right:25px}.cover h1{font-size:70px}.chapter-index{padding-left:25px}.route a{grid-template-columns:23px 72px 1fr 10px;gap:10px}.route img{width:72px}.route h3{font-size:19px}.cinema .cover{gap:28px}.cinema .cover h1{font-size:65px}.cinema .route{gap:18px}.cinema .route h3{font-size:20px}}
@media(max-width:760px){.demo-switch{gap:15px;font-size:9px}.demo-switch span{width:100%}.book{margin:0 12px 20px;padding-inline:22px}.mast{padding:18px 0}.mast nav{gap:14px;font-size:9px}.spread{display:block}.cover{border-right:0;padding:28px 0}.cover h1{font-size:75px}.intro{max-width:50ch}.chapter-index{padding:26px 0;border-top:1px solid var(--line)}.route a{grid-template-columns:23px 95px 1fr 12px;gap:13px;padding:19px 0}.route img{width:95px}.route h3{font-size:23px}.evidence{gap:14px}.evidence div{display:block}.evidence strong{font-size:25px}.evidence span{display:block;font-size:9px;line-height:1.7;margin-top:7px}.bottom{flex-wrap:wrap;font-size:9px;line-height:1.8}.cinema .cover{display:block}.cinema .cover h1{font-size:75px}.cinema .route{display:block}.cinema .route:before{left:11px;top:45px;bottom:47px;right:auto;border-top:0;border-left:1px dashed #a76e6a}.cinema .route a{display:grid;grid-template-columns:23px 95px 1fr 12px;gap:13px;padding:19px 0;border-bottom:1px solid var(--line)}.cinema .route img{width:95px;margin:0}.cinema .route .arrow{position:static}.cinema .route h3{font-size:23px}.cinema .film-area{margin-top:25px}}
@media(max-width:390px){.book{padding-inline:16px}.cover h1,.cinema .cover h1{font-size:63px}.route a,.cinema .route a{grid-template-columns:21px 72px 1fr 10px;gap:10px}.route img,.cinema .route img{width:72px}.route h3,.cinema .route h3{font-size:20px}.index-head h2{font-size:26px}.evidence strong{font-size:22px}}
.evidence{grid-template-columns:repeat(3,minmax(0,1fr))}.evidence div{min-width:0}
@media(max-width:390px){.evidence{gap:9px}.evidence strong{font-size:19px;letter-spacing:-.04em}.evidence span{overflow-wrap:anywhere}}
@media(prefers-reduced-motion:reduce){.route img{transition:none}.route a:hover img{transform:none}}