.scroll-progress { position:absolute; left:50%; bottom:1.75vh; transform:translateX(-50%); width:190px; height:2px; background:#dbe1ec; }
.scroll-progress i { display:block; width:0; height:100%; background:#2d4677; }

/* The title scrolls normally; only the author timeline is pinned. */
.timeline-section > .timeline-top { padding:5rem 0 2.5rem; }
.timeline-section > .timeline-top .hint { display:block; margin-top:1rem; }
.timeline-section > .timeline-top::before { z-index:0; }
.timeline-section > .timeline-top > * { position:relative; z-index:1; }
.timeline-section > .timeline-top::before { display:none; }
.timeline-section > .timeline-top h2 { display:inline-block; padding:.06em 1.05em .14em; background:linear-gradient(90deg,transparent 0%,#e8e2ff 14%,#f4f0ff 86%,transparent 100%); }

.intro-meta .scroll-cue { margin-top:0; padding:.46rem .7rem .46rem .9rem; border:1px solid #d5ddea; border-radius:99px; color:#566a90; }
.intro-meta .scroll-cue b { border-color:#b5c3d9; }
.timeline-sticky { display:block; padding:2.5vh 0 5vh; }
.timeline-window { display:block; height:100%; margin-top:0; }

/* The chapter header, date label, identity and research text form one card. */
.era {
  grid-template-columns: 1fr;
  gap: 1.35rem;
}

.era-summary {
  align-self:start;
  width:fit-content;
}
.era-date { display:inline-flex; justify-content:center; align-items:center; min-width:134px; margin-top:.78rem; padding:.38rem .55rem; border-radius:2px; background:color-mix(in srgb,var(--date-color) 17%,white); color:var(--date-color); font:500 .58rem/1 "DM Mono",monospace; }
.people { align-items:start; }
.person { min-width:0; padding:0 1.05rem 1.4rem; text-align:center; border-left:0; }
.person:last-child { border-right:1px solid var(--accent); }
.portrait { width:80%; height:auto; aspect-ratio:1 / 1; margin:0 auto .7rem; border-radius:50%; overflow:hidden; background:radial-gradient(circle at 50% 29%,#f7ece1 0 22%,#d2c2af 23% 42%,#eee7df 43% 62%,#b69a84 63% 70%,#e7dfd7 71%); }
.portrait:has(img)::after { content:none; }
.portrait img { width:100%; height:100%; display:block; object-fit:cover; transform:scale(1.15); transform-origin:center; }
.person h4 { min-height:2.25em; margin:0; text-align:center; font-size:clamp(.74rem,1.35vh,.842rem); }
.person time { display:block; margin:.18rem 0 .9rem; text-align:center; font-size:clamp(.62rem,1.1vh,.691rem); }
.person h4, .person time, .person-copy p b { color:var(--accent); }
.person-copy { margin-top:.2rem; text-align:left; }
.person-copy p { margin:0 0 .72rem; font-size:clamp(.64rem,1.2vh,.734rem); line-height:1.42; }
.person-copy p b { display:block; margin-bottom:.18rem; }

/* Every author receives the same reading width; longer eras simply scroll farther. */
@media (min-width:851px) {
  .timeline-section { height:400vh; }
  .era { width:auto; }
  .people { grid-template-columns:repeat(var(--people), 220px); }
}

.era-head { padding:1.33rem 1.54rem; }
.era h3 { font-size:1.89rem; }
.era-head p { font-size:.868rem; }
.era-date { min-width:188px; margin-top:1.1rem; padding:.532rem .77rem; font-size:.812rem; }
.back-to-start { display:table; margin:0 auto 3rem; padding:.58rem .9rem; border:1px solid #d5ddea; border-radius:999px; color:#566a90; font:500 .62rem "DM Mono",monospace; letter-spacing:.08em; text-decoration:none; text-transform:uppercase; }
.back-to-start span { margin-left:.45rem; font-size:1rem; }

.evolution-arrow { position:absolute; top:1rem; right:.9rem; width:3.4rem; height:auto; stroke:#e7e649; stroke-width:2.3; stroke-linecap:round; stroke-linejoin:round; }

@media (max-width:850px) { .scroll-progress { display:none; } .timeline-section > .timeline-top { padding:3rem 0 1rem; } .timeline-window { margin-top:0; } }