/* REV014 — explanatory gold linework, contained by its prose column.
   Figure size and placement belong to storytelling-graphics.css. */
#stage[data-sitewide-revision] .narrative-graphic {
  --narrative-gold: #d7b44a;
  margin: 0;
  padding: 0;
  border: 0;
  min-width: 0;
  background: none;
  color: var(--narrative-gold);
}
#stage[data-sitewide-revision] .narrative-art {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
  filter: drop-shadow(0 1px 2px rgb(0 0 0 / .68));
}
.narrative-graphic .narrative-icon { overflow: visible; }
.narrative-graphic .narrative-label {
  fill: #ead8a1;
  stroke: rgb(8 10 10 / .55);
  stroke-width: 1.5px;
  stroke-linejoin: round;
  paint-order: stroke fill;
  font-family: inherit;
  font-size: 24px;
  font-weight: 500;
  letter-spacing: -.35px;
}
.narrative-graphic .narrative-label--memory {
  fill: #d7b44a;
  font-weight: 400;
}
.narrative-graphic .narrative-route,
.narrative-graphic .narrative-current {
  fill: none;
  stroke-width: 1.25px;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}
.narrative-graphic .narrative-route {
  stroke: #d7b44a;
  opacity: .62;
}
.narrative-graphic .narrative-current {
  stroke-width: 1.6px;
  opacity: 0;
  filter: drop-shadow(0 0 1.2px rgb(242 217 137 / .24));
  animation: narrative-rail-luminance 12s ease-in-out infinite;
  animation-delay: var(--narrative-delay, 0s);
}
.narrative-graphic .narrative-luminance {
  animation: narrative-stroke-luminance 12s ease-in-out infinite;
  animation-delay: var(--narrative-delay, 0s);
}
.narrative-graphic .narrative-luminance--shoulder {
  animation-name: narrative-stroke-shoulder;
}
/* A one-second rise, a brief soft peak and a slower fall. Only luminance
   changes: geometry, icon position, labels and all semantic phases stay still. */
@keyframes narrative-stroke-luminance {
  0%, 32%, 100% { stop-color: #d7b44a; }
  8%, 11% { stop-color: #fff0bd; }
  20% { stop-color: #e4c96e; }
}
@keyframes narrative-stroke-shoulder {
  0%, 32%, 100% { stop-color: #d7b44a; }
  8%, 11% { stop-color: #e7ce7b; }
  20% { stop-color: #ddbe59; }
}
@keyframes narrative-rail-luminance {
  0%, 32%, 100% { opacity: 0; }
  8%, 11% { opacity: .86; }
  20% { opacity: .26; }
}
/* One lifecycle gate controls every autonomous highlight. Scroll does not
   advance the drawing, and a static/reduced-motion drawing keeps all meaning. */
.narrative-graphic * { animation-play-state: paused; }
.narrative-graphic[data-motion='running'] * { animation-play-state: running; }
.narrative-graphic[data-reduced-motion='true'] * { animation: none; }
.narrative-graphic[data-reduced-motion='true'] .narrative-current { opacity: 0; }
.narrative-graphic[data-reduced-motion='true'] .narrative-luminance { stop-color: #d7b44a; }
@media (prefers-reduced-motion: reduce) {
  .narrative-graphic * { animation: none; }
  .narrative-graphic .narrative-current { opacity: 0; }
  .narrative-graphic .narrative-luminance { stop-color: #d7b44a; }
}