/*
 * Platform mechanisms only. No colour, font or layout is chosen here: the
 * design sets the custom properties named below, and every default is
 * neutral (a transparent layer, a small shift, a short fade).
 */

/* handoff.js: the layer that grows from the activated link to the viewport. */
.lt-handoff-layer {
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  pointer-events: none;
  transform-origin: 0 0;
  background: var(--handoff-colour, transparent);
}
.lt-handoff-layer[hidden] {
  display: none;
}

/*
 * arrive.js: content is visible at rest. An element that scrolls into view
 * gets .lt-arrived and plays once from a visible, slightly shifted state.
 * Elements already in view at load get .lt-at-rest and never move.
 */
@media (prefers-reduced-motion: no-preference) {
  .lt-arrived {
    animation: lt-arrive var(--arrive-duration, 600ms) var(--arrive-easing, cubic-bezier(.2, .7, .2, 1))
      calc(var(--arrive-order, 0) * var(--arrive-stagger, 70ms)) both;
  }
}
@media (prefers-reduced-motion: reduce) {
  .lt-arrived {
    animation: lt-arrive-fade var(--arrive-duration-reduced, 200ms) ease-out both;
  }
}
@keyframes lt-arrive {
  from { transform: translate3d(0, var(--arrive-distance, 1rem), 0); }
}
@keyframes lt-arrive-fade {
  from { opacity: var(--arrive-fade-from, .6); }
}