/* Final copy reserves its own width; the transient words never participate in layout. */
.scope-word {
  display: inline-block;
  position: relative;
  perspective: 400px;
  white-space: nowrap;
}
.scope-word-display { display: none; }
.headline-is-running .scope-word-final { opacity: 0; }
.headline-is-running .scope-word-display {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  white-space: nowrap;
  transform-origin: left center;
  backface-visibility: hidden;
}
.headline-is-running .title-scribble path {
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
}
.headline-is-settled .title-scribble path {
  stroke-dasharray: 1;
  animation: headline-underline .36s ease-out both;
}
.headline-is-settled .title-scribble path + path {
  animation-delay: .2s;
}
@keyframes headline-underline {
  from { stroke-dashoffset: 1; }
  to { stroke-dashoffset: 0; }
}
@media (prefers-reduced-motion: reduce) {
  [data-headline] .title-scribble path { animation: none; stroke-dashoffset: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .headline-is-running .scope-word-final { opacity: 1; }
  .headline-is-running .scope-word-display { display: none; }
}