.reel-motion-layer {
  position: absolute;
  z-index: 4;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  contain: strict;
}

.reel-motion-window {
  position: absolute;
  top: 0;
  height: 100%;
  min-width: 0;
  overflow: hidden;
  contain: strict;
}

.reel-motion-track {
  position: absolute;
  inset: 0;
  overflow: visible;
  will-change: transform;
}

.reel-motion-tile {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: calc(100% * 185 / 580);
  min-height: 0;
  will-change: transform;
  backface-visibility: hidden;
}

.reel-motion-window:not(.is-landing) .reel-motion-symbol {
  filter: blur(.42px) saturate(.94) brightness(.94) drop-shadow(0 .2em .16em rgba(0, 0, 0, .52));
}

.reel-motion-window.is-landing .reel-motion-symbol {
  filter: saturate(.98) drop-shadow(0 .22em .22em rgba(0, 0, 0, .62));
}

.reel-motion-window::after {
  content: "";
  position: absolute;
  z-index: 3;
  inset: .4%;
  border: .24em solid #39a8ff;
  border-radius: .55em;
  opacity: 0;
  box-shadow: inset 0 0 1.4em #147cff, 0 0 1.2em #68c9ff;
  pointer-events: none;
}

.reel-motion-window.is-teasing::after {
  animation: referee-tease-edge .34s ease-in-out infinite alternate;
}

@keyframes referee-tease-edge {
  from { opacity: .18; filter: brightness(.8); }
  to { opacity: 1; filter: brightness(1.55); }
}

@media (prefers-reduced-motion: reduce) {
  .reel-motion-layer { display: none; }
}