/* A full-width line drawing within the same editorial column as the mechanisms. */
#etr-story #opening.lineage-scroll{position:relative;background:#fff;color:#182126;padding:0;margin:0 auto;width:calc(100% - var(--editorial-gutter,80px)*2);max-width:var(--editorial-width,1180px)}
#etr-story .lineage-scroll-stage{position:relative;background:#fff;min-width:0;border-top:0}
#etr-story .lineage-scroll .lineage-controls{display:none}
#etr-story .lineage-scroll[data-lineage-ready="true"]{height:calc(var(--scene-height) + var(--scene-travel))}
#etr-story .lineage-scroll[data-lineage-ready="true"] .lineage-scroll-stage{position:sticky;top:var(--scene-pin);height:var(--scene-height);min-height:640px;overflow:hidden;box-sizing:border-box;display:grid;grid-template-rows:auto minmax(0,1fr);gap:16px;padding:26px 0 24px}
#etr-story .lineage-scroll .lineage-scroll-stage>header{position:relative;inset:auto;max-width:none;padding:0;text-align:left;z-index:2;pointer-events:none;display:grid;grid-template-columns:1.1fr 1fr;gap:36px;align-items:end}
#etr-story .lineage-scroll .lineage-scroll-stage>header h2{font:500 clamp(32px,3.6vw,52px)/1.04 var(--scene-serif,ui-serif,Georgia,serif);letter-spacing:-.015em;color:#182126;margin:0;text-wrap:balance}
#etr-story .lineage-scroll .lineage-scroll-stage>header>p{font:400 clamp(15px,1.25vw,18px)/1.5 var(--scene-sans,system-ui,sans-serif);letter-spacing:normal;color:#566169;margin:0}
#etr-story .lineage-scroll .lineage-film{background:#fff;color:#182126;max-width:none;margin:0}
#etr-story .lineage-scroll[data-lineage-ready="true"] .lineage-film{position:relative;inset:auto;display:grid;grid-template-columns:minmax(0,1fr) 340px;grid-template-rows:minmax(250px,1fr) auto auto;min-height:0;gap:16px 36px}
#etr-story .lineage-scroll[data-lineage-ready="true"] .lineage-stage{position:relative;inset:auto;grid-column:1/-1;grid-row:1;min-height:250px}
#etr-story .lineage-scroll[data-lineage-ready="true"] .lineage-canvas{position:absolute;inset:0;display:block;width:100%;height:100%;touch-action:pan-y}
#etr-story .lineage-scroll[data-lineage-ready="true"] .lineage-stills{display:none}
#etr-story .lineage-scroll[data-lineage-ready="true"] .lineage-caption{position:relative;display:block;inset:auto;grid-column:1;grid-row:2;max-width:none;min-height:0;padding:0;margin:0;pointer-events:none}
#etr-story .lineage-scroll .lineage-caption h2{font:500 clamp(23px,2vw,30px)/1.1 var(--scene-serif,ui-serif,Georgia,serif);letter-spacing:-.012em;margin:0 0 8px;color:#182126}
#etr-story .lineage-scroll .lineage-caption p{font:400 14px/1.5 var(--scene-sans,system-ui,sans-serif);color:#566169;max-width:55ch;margin:0}
#etr-story .lineage-scroll[data-lineage-ready="true"] .lineage-controls{position:relative;display:flex;inset:auto;grid-column:2;grid-row:2;align-self:end;width:100%;max-width:none;gap:12px;border:0;padding:0;margin:0;z-index:3}
#etr-story .lineage-scroll .lineage-controls label{font:400 12px/1.4 var(--scene-sans,system-ui,sans-serif);white-space:nowrap;color:#566169}
#etr-story .lineage-scroll .lineage-controls input{min-width:0;width:100%;height:44px;margin:0;accent-color:#c74332;cursor:ew-resize}
#etr-story .lineage-scroll .lineage-controls input:focus-visible{outline:3px solid #c74332;outline-offset:4px}
#etr-story .lineage-scroll .lineage-qualification{position:relative;inset:auto;grid-column:1/-1;grid-row:3;max-width:100%;padding:16px 0 0;border-top:0;margin:0;font:400 12px/1.5 var(--scene-sans,system-ui,sans-serif);color:#566169}
#etr-story .lineage-scroll .lineage-qualification a{color:#182126}
#etr-story .lineage-stills figcaption{color:#566169}
#etr-story .lineage-stills strong{color:#182126}
@media(max-width:899px){
 #etr-story #opening.lineage-scroll{margin-block:0}
 #etr-story .lineage-scroll[data-lineage-ready="true"] .lineage-scroll-stage{min-height:780px;padding:20px 0 16px;gap:16px}
 #etr-story .lineage-scroll .lineage-scroll-stage>header{display:block}
 #etr-story .lineage-scroll .lineage-scroll-stage>header h2{font-size:clamp(32px,5vw,42px);margin-bottom:12px}
 #etr-story .lineage-scroll .lineage-scroll-stage>header>p{font-size:15px}
 #etr-story .lineage-scroll[data-lineage-ready="true"] .lineage-film{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(260px,1fr) auto auto auto;gap:14px}
 #etr-story .lineage-scroll[data-lineage-ready="true"] .lineage-stage{grid-column:1;min-height:260px}
 #etr-story .lineage-scroll[data-lineage-ready="true"] .lineage-caption{grid-column:1;grid-row:2}
 #etr-story .lineage-scroll .lineage-caption h2{font-size:26px;margin-bottom:8px}
 #etr-story .lineage-scroll .lineage-caption p{font-size:14px;max-width:50ch}
 #etr-story .lineage-scroll[data-lineage-ready="true"] .lineage-controls{grid-column:1;grid-row:3;flex-wrap:nowrap;gap:14px}
 #etr-story .lineage-scroll .lineage-qualification{grid-column:1;grid-row:4;font-size:12px;padding-top:12px}
}
/* Static gate: mirrors lineage-scroll.js verbatim. */
@media(max-width:899px) and (max-height:519px), (min-width:900px) and (max-height:711px){
 #etr-story .lineage-scroll[data-lineage-ready="true"]{height:auto}
 #etr-story .lineage-scroll[data-lineage-ready="true"] .lineage-scroll-stage{position:relative;top:0;height:auto;min-height:0}
 #etr-story .lineage-scroll[data-lineage-ready="true"] .lineage-stage{min-height:360px}
}
@media(prefers-reduced-motion:reduce){
 #etr-story .lineage-scroll[data-lineage-ready="true"]{height:auto}
 #etr-story .lineage-scroll[data-lineage-ready="true"] .lineage-scroll-stage{position:relative;top:0;height:auto;min-height:0}
 #etr-story .lineage-scroll[data-lineage-ready="true"] .lineage-stage{min-height:360px}
 #etr-story .lineage-scroll[data-lineage-ready="true"] .lineage-caption{display:block}
 #etr-story .lineage-scroll[data-lineage-ready="true"] .lineage-controls{display:flex}
}

/* Pinned phones: 100svh under the reading bar; the drawing takes whatever the words leave. */
@media(max-width:899px){
 #etr-story .lineage-scroll[data-lineage-static="false"]{--scene-height:calc(100svh - var(--scene-pin));--scene-travel:160svh}
 #etr-story .lineage-scroll[data-lineage-static="false"] .lineage-scroll-stage{min-height:0;padding:12px 0 10px;gap:8px}
 #etr-story .lineage-scroll[data-lineage-static="false"] .lineage-scroll-stage>header h2{font-size:clamp(26px,7.2vw,30px);line-height:1.08;margin-bottom:6px}
 #etr-story .lineage-scroll[data-lineage-static="false"] .lineage-scroll-stage>header>p{font-size:14px;line-height:1.4}
 #etr-story .lineage-scroll[data-lineage-static="false"] .lineage-film{grid-template-rows:minmax(0,1fr) auto auto auto;gap:8px}
 #etr-story .lineage-scroll[data-lineage-static="false"] .lineage-stage{min-height:0}
 /* Two reserved lines per era, so the drawing never resizes as the caption changes. */
 #etr-story .lineage-scroll[data-lineage-static="false"] .lineage-caption h2{font-size:clamp(19px,5.6vw,22px);margin-bottom:4px;white-space:nowrap}
 #etr-story .lineage-scroll[data-lineage-static="false"] .lineage-caption p{min-height:3em}
 #etr-story .lineage-scroll[data-lineage-static="false"] .lineage-qualification{padding-top:0;line-height:1.4}
}