.journey-book {
  --book-ink: #17374a;
  --book-red: #963d2a;
  --book-rule: #9c9c8d;
  --book-paper: #f7f3e8;
  --book-display: Baskerville, 'Iowan Old Style', 'Palatino Linotype', Georgia, serif;
  max-width: 1530px;
  margin: 0 auto;
  padding: clamp(22px,3.5vw,56px) clamp(18px,4.5vw,77px) 0;
  color: var(--book-ink);
}
.journey-opener {text-align:center}
.journey-kicker,.journey-panorama figcaption,.timeline-heading,.entry-running-head,.entry-art figcaption,.timeline-number {
  font: 600 10px/1.55 system-ui,sans-serif;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.journey-opener .journey-kicker {display:flex;align-items:center;justify-content:center;gap:14px;color:var(--book-red)}
.journey-kicker b {font:400 13px/1 Georgia,serif}
.journey-book .journey-opener h1 {
  margin: .09em auto .05em;
  max-width: 16em;
  font: 400 clamp(48px,7.4vw,112px)/1.02 var(--book-display);
  letter-spacing: -.047em;
}
.journey-book .journey-subtitle {margin:0 auto clamp(16px,2vw,28px);color:var(--book-red);font:italic clamp(20px,2vw,32px)/1.25 var(--book-display)}
.journey-panorama {margin:0;padding-top:5px;border-top:3px double var(--book-rule)}
.journey-panorama img {display:block;width:100%;aspect-ratio:3.45;object-fit:cover;background:#e8e4d7}
.journey-panorama figcaption {
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  padding:9px 1px 8px;border-bottom:1px solid var(--book-rule);
  font-size:9px;letter-spacing:.14em;color:#59656a;
}
.journey-panorama figcaption span {display:flex;align-items:center;gap:.7em}
.journey-panorama figcaption i,.entry-art figcaption i {display:inline-block;width:21px;height:1px;background:var(--book-rule)}
.journey-panorama figcaption b {font:normal 15px/1 Georgia;color:var(--book-red)}
.journey-book .journey-thesis {
  margin:clamp(30px,4.2vw,63px) auto clamp(35px,4.3vw,70px);max-width:35ch;
  font:400 clamp(25px,2.8vw,45px)/1.18 var(--book-display);letter-spacing:-.026em;
  text-wrap:balance;
}
.narrative-heading {text-align:center;margin:clamp(55px,7vw,110px) auto clamp(25px,3.6vw,56px)}
.narrative-heading .journey-kicker {color:var(--book-red);display:inline-flex;align-items:center;gap:14px}
.narrative-heading .journey-kicker::before,.narrative-heading .journey-kicker::after {content:'';width:28px;height:1px;background:var(--book-rule)}
.journey-book .narrative-heading h2 {font:400 clamp(36px,4.3vw,68px)/1.04 var(--book-display);letter-spacing:-.04em;margin:9px 0 0}
.narrative-body {display:grid;grid-template-columns:clamp(145px,13vw,195px) minmax(0,1fr);gap:clamp(22px,3vw,58px);align-items:start}
.narrative-stories {min-width:0}
.narrative-timeline {position:sticky;top:14px;padding:13px 0 0;border-top:3px double var(--book-rule);z-index:3}
.timeline-heading {display:flex;justify-content:space-between;align-items:center;gap:10px;color:var(--book-red);font-size:9px;white-space:nowrap}
.timeline-count {font-size:9px;color:#4d5b5f;letter-spacing:.04em}
.timeline-line {position:relative;list-style:none;padding:0;margin:10px 0 0}
.timeline-line::before,.timeline-line::after {content:'';position:absolute;left:5px;top:22px;bottom:22px;width:1px;background:#a4a798;pointer-events:none}
.timeline-line::after {background:var(--book-red);width:2px;transform:scaleY(var(--read-progress));transform-origin:top;transition:transform .14s linear}
.timeline-line li {position:relative}
.timeline-line button {
  width:100%;min-height:44px;display:grid;grid-template-columns:13px 17px 1fr;align-items:center;gap:5px;
  text-align:left;padding:3px 1px;border:0;cursor:pointer;color:#4f5c60;background:none;
  font:400 15px/1.22 var(--book-display);
}
.timeline-line button[aria-current],.timeline-line button:hover {color:var(--book-red)}
.timeline-node {height:9px;width:9px;box-sizing:border-box;background:var(--book-paper);border:1px solid #717a75;border-radius:100%;position:relative;z-index:1;transition:background-color .25s,transform .25s}
.timeline-line button[aria-current] .timeline-node {background:var(--book-red);border-color:var(--book-red);outline:1px solid var(--book-red);outline-offset:2px;transform:scale(.9)}
.timeline-number {font-size:8px;letter-spacing:.06em}
.timeline-line button:focus-visible,.entry-source:focus-visible {outline:2px solid var(--book-red);outline-offset:1px}
.narrative-stop {scroll-margin-top:22px;margin:0 0 clamp(46px,6vw,92px);outline:none}
.narrative-stop:focus-visible .entry-running-head {border-top-color:var(--book-red)}
.entry-running-head {
  border-block:3px double var(--book-rule);border-bottom:0;
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding:10px 0 14px;font-size:9px;color:#43535c;
}
.entry-running-head span:first-child {color:var(--book-red)}
.entry-running-head i {font-style:normal;margin:0 .4em;color:var(--book-rule)}
.entry-spread {display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:center;gap:clamp(22px,2.8vw,52px)}
.narrative-stop:nth-child(even) .entry-spread {grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
.narrative-stop:nth-child(even) .entry-art {grid-column:2}
.narrative-stop:nth-child(even) .entry-copy {grid-column:1;grid-row:1}
.entry-art {margin:0;min-width:0}
.entry-art img {display:block;width:100%;aspect-ratio:1.4;object-fit:cover;background:#e8e4d7}
.entry-art figcaption {display:flex;align-items:center;gap:8px;padding:9px 0 0;color:#606967;font-size:9px;letter-spacing:.09em}
.entry-art figcaption span {color:var(--book-red)}
.entry-copy {min-width:0}
.journey-book .entry-copy h3 {
  font:400 clamp(29px,3.1vw,51px)/1.03 var(--book-display);letter-spacing:-.045em;
  color:var(--book-ink);margin:0 0 .36em;text-wrap:balance;
}
.journey-book .entry-copy p {font:400 clamp(16px,1.2vw,19px)/1.6 Georgia,'Times New Roman',serif;color:#32434a;margin:0 0 .8em;max-width:65ch}
.entry-copy p:first-of-type::first-letter {float:left;font:400 3.3em/.86 var(--book-display);color:var(--book-red);margin:.08em .08em 0 0}
.entry-source {display:inline-block;color:var(--book-red);font:italic 13px/1.5 Georgia,serif;text-underline-offset:3px;text-decoration-color:#aa8d7899}
.entry-source:hover {text-decoration-color:currentColor}
.entry-source span {font-style:normal}
@media(max-width:1050px) {
  .narrative-body {display:block}
  .narrative-timeline {top:0;padding:8px 5px 0;margin:0 -5px 22px;background:var(--book-paper);border-bottom:1px solid var(--book-rule)}
  .timeline-heading {padding:0 4px}
  .timeline-line {display:flex;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;margin:1px 0 0;padding:0 3px;gap:12px}
  .timeline-line::before,.timeline-line::after {display:none}
  .narrative-timeline::after {content:'';position:absolute;bottom:-1px;left:0;height:2px;background:var(--book-red);width:100%;transform-origin:left;transform:scaleX(var(--read-progress,0));pointer-events:none}
  .timeline-line li {flex:0 0 auto}
  .timeline-line button {width:auto;padding:0 2px;min-height:43px;white-space:nowrap;grid-template-columns:9px auto auto;gap:5px}
  .timeline-node {width:6px;height:6px}
  .narrative-stop {scroll-margin-top:91px}
  .entry-copy h3 {font-size:36px}
}
@media(max-width:680px) {
  .journey-book {padding:22px 17px 0}
  .journey-panorama img {aspect-ratio:2.05;object-position:center}
  .journey-panorama figcaption {font-size:8px;letter-spacing:.07em}
  .entry-spread,.narrative-stop:nth-child(even) .entry-spread {display:flex;flex-direction:column;align-items:stretch;gap:19px}
  .narrative-heading {margin:48px auto 22px}
  .narrative-timeline {margin-inline:-9px;padding-inline:9px}
  .entry-running-head {font-size:8px;letter-spacing:.1em}
  .entry-running-head span:last-child {text-align:right}
  .entry-art img {aspect-ratio:1.55}
  .journey-book .entry-copy h3 {font-size:clamp(31px,6.3vw,41px)}
  .journey-book .entry-copy p {font-size:17px}
  .timeline-line {gap:14px}
}
@media(prefers-reduced-motion:reduce) {
  .timeline-line::after,.timeline-node {transition:none}
}
