/* The printed index mark moves between the labels as their widths change. */
.wall.restoring-print * { transition: none !important; }
.wall-nav .wall-title:has(.print-register)::after { content: none; }
.print-register {
  position: absolute;
  left: 1px;
  bottom: -2px;
  z-index: 1;
  width: 32px;
  height: 4px;
  background: #df542f;
  transform: skewX(-21deg);
  pointer-events: none;
}

@media screen and (max-width: 600px) and (prefers-reduced-motion: no-preference) {
  .wall-ready .wall-posters { position: relative; overflow: hidden; }
  .wall-ready .wall-posters .poster {
    display: block;
    position: absolute;
    inset: 0;
    background: transparent;
  }
  .wall-ready .poster[data-active="false"] { visibility: hidden; pointer-events: none; }
  .wall-ready .poster[data-active="true"] { z-index: 2; }

  .wall-ready [data-switching] .poster { visibility: visible; }
  .wall-ready [data-switching] .poster-art { will-change: translate; }
  .wall-ready [data-switching] .window-name { opacity: 1; }

  /* Carry a narrow orange registration edge between the passing prints. */
  [data-switching] .poster[data-active="true"] .poster-art::after {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: #ef714c;
    box-shadow: 1px 0 #24221f;
    animation: print-edge-land .62s ease-in both;
  }
  [data-switching="backward"] .poster[data-active="true"] .poster-art::after {
    left: auto;
    right: 0;
    box-shadow: -1px 0 #24221f;
  }
  [data-switching] .poster[data-active="true"] .poster-action {
    animation: print-caption-seat .48s cubic-bezier(.2,.78,.18,1) both;
  }
}

@keyframes print-edge-land { 0%, 65% { opacity: 1; } 100% { opacity: 0; } }
@keyframes print-caption-seat {
  from { opacity: .35; translate: 0 8px; }
  to { opacity: 1; translate: 0 0; }
}
