.work-story-intro { padding: 75px 0 55px; border-bottom: 1px solid var(--line); }
.work-story-intro h1 { max-width: 760px; margin: 25px 0; font-size: clamp(46px, 6.6vw, 88px); line-height: 1.04; letter-spacing: -.065em; }
.work-story-intro p:not(.eyebrow) { max-width: 650px; color: var(--muted); font-size: 17px; line-height: 1.8; }
.system-story-layout { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: clamp(60px, 9vw, 140px); align-items: start; }
.continuous-story { min-width: 0; }
.continuous-story .work-story-intro h1 { font-size: clamp(34px, 4.5vw, 58px); }
.story-compass-heading #story-current { line-height: 1.5; }
#story-navigation[hidden] { display: none; }
.research-transition { padding: 40px 0 25px; }
.research-transition h2 { font-size: clamp(25px, 2.9vw, 37px); line-height: 1.15; letter-spacing: -.045em; }
.research-transition p { color: var(--muted); font-size: 16px; line-height: 1.85; }
.fingerprint-body .research-topic { margin: 20px 0; font-size: clamp(26px, 3.5vw, 42px); line-height: 1.15; letter-spacing: -.05em; }
.fingerprint-body .research-citation { font-size: 15px; line-height: 1.5; letter-spacing: -.015em; margin-top: 25px; }
.story-network .research-edge-progress { stroke: var(--off-white); stroke-width: 2; stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: 100; opacity: 0; transition: none; }
.story-network .research-edge-progress.fingerprint-edge { opacity: .85; }
.story-network.is-research .domain-dot { fill: #66706c; opacity: .4; }
.story-network.is-research .domain-dot.fingerprint-active { fill: var(--domain-colour); stroke: var(--domain-colour); opacity: 1; }
.story-compass { position: sticky; top: 85px; padding: 35px 0; }
.story-network svg, .chapter-map svg { display: block; width: 100%; height: auto; overflow: visible; }
.story-network line, .chapter-map line { stroke: rgba(250,250,247,.13); stroke-width: 1; transition: stroke 400ms ease; }
.story-network .domain-dot { fill: var(--domain-colour); stroke: var(--charcoal); stroke-width: 3; transition: opacity 250ms ease, stroke 250ms ease; }
.story-network .domain-dot.is-current { stroke: var(--off-white); stroke-width: 2; }
.story-network .domain-dot.is-muted { opacity: .35; }
.story-network .domain-progress { fill: none; stroke: var(--domain-colour); stroke-width: 2.5; stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: 100; opacity: 0; pointer-events: none; }
.story-network .domain-progress.is-current { opacity: 1; }
.story-compass-heading { display: flex; justify-content: space-between; gap: 15px; color: var(--muted); font-size: 11px; margin: 20px 0 25px; }
.story-compass-heading span:last-child { white-space: nowrap; }
#story-navigation { display: grid; gap: 15px; }
#story-navigation a { display: flex; align-items: center; gap: 10px; font-size: 12px; color: var(--muted); line-height: 1.5; }
#story-navigation a::before { content: ''; width: 6px; height: 6px; border-radius: 50%; flex: 0 0 6px; background: var(--domain-colour); }
#story-navigation a[aria-current], #story-navigation a:hover { color: var(--off-white); }
#story-navigation a:focus-visible, .story-paper a:focus-visible, .explore-story-link:focus-visible { outline: 2px solid var(--ochre); outline-offset: 6px; }
.research-chapter { padding: 85px 0; border-bottom: 1px solid var(--line); scroll-margin-top: 35px; }
.chapter-number { font-size: 10px; letter-spacing: .15em; color: var(--domain-colour); }
.research-chapter h2 { font-size: clamp(30px, 4vw, 50px); line-height: 1.1; letter-spacing: -.055em; margin: 22px 0; }
.chapter-description { color: var(--muted); font-size: 16px; line-height: 1.85; }
.chapter-focus { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 25px 0 42px; }
.chapter-focus span { color: var(--domain-colour); font-size: 11px; line-height: 1.6; }
.story-paper { border-top: 1px solid var(--line); padding: 26px 0 12px; margin-top: 16px; }
.story-paper-type { color: var(--slate); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; line-height: 1.7; }
.story-paper h3 { font-size: clamp(20px, 2.3vw, 28px); letter-spacing: -.035em; line-height: 1.35; margin: 12px 0; }
.story-paper-summary, .chapter-context { font-size: 13px; line-height: 1.85; color: var(--muted); }
.story-paper-connections { font-size: 10px; line-height: 1.8; color: var(--domain-colour); }
.chapter-map { display: none; }
.story-finale { padding: 100px 0; max-width: 760px; }
.story-finale h2 { font-size: clamp(30px, 4.4vw, 55px); letter-spacing: -.055em; line-height: 1.1; margin: 20px 0; }
.story-finale p { color: var(--muted); font-size: 16px; line-height: 1.8; }
.story-finale:has(.explore-routes) { max-width: none; }
.explore-routes { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; }
.explore-routes > div { border-top: 1px solid var(--line); padding-top: 18px; }
.library-header { padding: 70px 0 45px; }
.library-header h1 { font-size: clamp(34px, 4.5vw, 58px); letter-spacing: -.055em; line-height: 1.12; }
.library-header p { max-width: 640px; color: var(--muted); line-height: 1.8; }
.library-header .library-links { display: flex; flex-wrap: wrap; gap: 20px; font-size: 12px; }
.library-entry { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 55px; padding: 40px 0; border-top: 1px solid var(--line); }
.library-body h2 { font-size: clamp(21px, 2.5vw, 30px); line-height: 1.25; letter-spacing: -.04em; }
.library-body a:focus-visible { outline: 2px solid var(--ochre); outline-offset: 5px; }
.library-entry .library-fingerprint { width: 100%; }
.explore-story-link { display: inline-block; margin-top: 25px; padding-bottom: 13px; border-bottom: 1px solid var(--ochre); color: var(--off-white); font-size: 15px; }
.fingerprint-section { padding: 90px 0 0; border-top: 1px solid var(--line); }
.fingerprint-section > h2 { max-width: 900px; margin: 25px 0 35px; font-size: clamp(35px, 5vw, 64px); letter-spacing: -.055em; line-height: 1.1; }
.fingerprint-introduction { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; margin-bottom: 55px; }
.fingerprint-introduction p { color: var(--muted); font-size: 15px; line-height: 1.85; }
.fingerprint-story-layout { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: clamp(60px, 9vw, 140px); align-items: start; }
.fingerprint-compass { position: sticky; top: 85px; padding: 35px 0; }
.fingerprint-caption > p:first-child { display: flex; justify-content: space-between; gap: 15px; color: var(--off-white); font-size: 12px; }
#fingerprint-count { white-space: nowrap; color: var(--muted); }
#fingerprint-domains { font-size: 12px; line-height: 1.8; color: var(--muted); }
.fingerprint-publication { padding: 60px 0; border-top: 1px solid var(--line); scroll-margin-top: 200px; }
.fingerprint-publication:first-child { border-top: 0; }
.fingerprint-body h3 { margin: 14px 0; font-size: clamp(21px, 2.6vw, 32px); letter-spacing: -.04em; line-height: 1.25; }
.fingerprint-body a:focus-visible { outline: 2px solid var(--ochre); outline-offset: 5px; }
.publication-fingerprint .domain-dot { fill: #66706c; opacity: .4; transition: fill 300ms ease, opacity 300ms ease, stroke 300ms ease; }
.publication-fingerprint .domain-dot.fingerprint-active { fill: var(--domain-colour); opacity: 1; stroke: var(--domain-colour); stroke-width: 5; }
.publication-fingerprint line { stroke: rgba(250,250,247,.1); }
.publication-fingerprint line.fingerprint-edge { stroke: rgba(250,250,247,.8); stroke-width: 2; }
@media (max-width: 760px) {
  .work-story-intro { grid-template-columns: 1fr; padding: 65px 0 50px; gap: 10px; }
  #story-overview { width: 150px; }
  .work-story-intro p:not(.eyebrow) { font-size: 15px; }
  .system-story-layout { display: block; }
  .story-compass { position: sticky; top: 70px; z-index: 4; display: grid; grid-template-columns: 95px minmax(0, 1fr); gap: 0 12px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--line); background: var(--charcoal); }
  #story-map { display: block; }
  .story-compass-heading { display: flex; flex-direction: column; align-items: flex-start; margin: 0; gap: 8px; }
  #story-current { color: var(--off-white); font-size: clamp(16px, 4vw, 19px); font-weight: 600; line-height: 1.3; letter-spacing: -.025em; overflow-wrap: anywhere; }
  #story-progress { color: var(--muted); font-size: 10px; letter-spacing: .12em; }
  #story-navigation { display: none; }
  .research-chapter { padding: 50px 0; scroll-margin-top: 200px; }
  /* Keep semantic headings for navigation, but let the sticky domain name be
     the single visible heading on mobile. */
  .research-chapter h2, .research-chapter .chapter-number { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
  .chapter-description { font-size: 15px; }
  .story-finale { padding: 65px 0; }
  .explore-routes { grid-template-columns: 1fr; gap: 35px; }
  .library-entry { grid-template-columns: 1fr; gap: 10px; }
  .library-entry .library-fingerprint { width: 160px; }
  .fingerprint-section { padding-top: 55px; }
  .fingerprint-introduction { grid-template-columns: 1fr; gap: 0; margin-bottom: 30px; }
  .fingerprint-story-layout { display: block; }
  .fingerprint-compass { position: sticky; top: 70px; z-index: 4; display: grid; grid-template-columns: 95px minmax(0, 1fr); gap: 12px; padding: 8px 0; background: var(--charcoal); border-bottom: 1px solid var(--line); }
  .publication-fingerprint { width: 95px; }
  .fingerprint-caption > p:first-child { font-size: 12px; margin: 0 0 8px; }
  #fingerprint-domains { font-size: 11px; line-height: 1.5; margin: 0; }
  .fingerprint-publication { padding: 35px 0; }
}
@media (prefers-reduced-motion: reduce) {
  .story-network *, .chapter-map * { transition: none !important; }
}

/* A consistent hierarchy, with one visible fingerprint title on mobile. */
.continuous-story .work-story-intro h1,.library-header h1{font-size:var(--page-title);line-height:1.08}
.research-transition h2,.story-finale h2{font-size:var(--section-title)}
.research-chapter h2{font-size:clamp(27px,2.8vw,34px)}
.fingerprint-body .research-topic{font-size:clamp(25px,2.7vw,32px)}
.fingerprint-body .research-citation{font-size:18px;line-height:1.45}
.story-compass{top:calc(var(--site-nav-height) + 8px)}
@media(max-width:760px){
 .story-compass{top:var(--site-nav-height);padding:12px 0;grid-template-columns:100px minmax(0,1fr);overflow:visible}
 #story-map{padding:5px}
 .work-story-intro h1{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .work-story-intro{padding-top:30px}
 .research-transition h2{font-size:30px}
 .fingerprint-body .research-topic{font-size:25px}
 .fingerprint-body .research-citation{font-size:17px}
}
