/* The poster keeps its type and layout. Only a finite dock response moves
   these five letter paint boxes; their original inline slots never collapse. */
#directions .motion-visual-word .alive-word-text,
#directions .motion-visual-word .alive-letter {
  position: static;
  top: auto;
  right: auto;
  font: inherit;
  color: inherit;
  letter-spacing: inherit;
}
#directions .motion-visual-word .alive-word-text { display: inline; white-space: nowrap; }
#directions .motion-visual-word .alive-letter { display: inline-block; transform-origin: 50% 72%; }
/* Keep the visual centre in the established top-right corner while replacing
   the font-dependent multiplication mark with the physical key's exact path. */
#directions .motion-visual-word .alive-key-target {
  position: absolute;
  top: calc(.07em - 16px);
  right: calc(-.02em - 16px);
  display: block;
  width: 32px;
  height: 32px;
  font-size: inherit;
  line-height: 0;
  color: #f4f0fa;
  pointer-events: none;
}
#directions .alive-key-target > svg { display: block; width: 100%; height: 100%; overflow: visible; }
#directions .alive-key-target path { fill: none; stroke: currentColor; stroke-width: 17.25; stroke-linecap: butt; stroke-linejoin: miter; }
/* The white receiver stays present during approach/abort. During the effect
   it takes the key's paint while core hides the global visual. */
#directions .alive-key-target[data-key-painted='true'] path { stroke: var(--alive-key-paint); }
#directions .alive-key-proxy {
  position: absolute;
  inset: 0 auto auto 0;
  z-index: 3;
  transform-origin: 50% 50%;
  pointer-events: none;
}
#directions .alive-key-proxy svg { display: block; width: 100%; height: 100%; overflow: visible; }
#directions .alive-key-proxy path { fill: none; stroke: var(--alive-key-paint, #f460c4); stroke-width: 14; stroke-linecap: butt; stroke-linejoin: miter; }
#directions [data-alive-caption] { position: relative; display: block; white-space: pre; }
#directions [data-alive-caption]::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(105deg, transparent, #fff 50%, transparent) no-repeat;
  background-size: 45% 100%;
  background-position: var(--alive-caption-sweep, -50%) 0;
  opacity: var(--alive-caption-light, 0);
}