:root {
  --research-motion-duration: 480ms;
  --research-motion-distance: 12px;
  --research-motion-stagger: 55ms;
  --research-motion-ease: cubic-bezier(.22, 1, .36, 1);
  --research-feedback-duration: 180ms;
}

@keyframes research-arrive {
  from { opacity: .45; transform: translateY(var(--research-motion-distance)); }
  to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: no-preference) {
  .research-tile.is-arriving {
    animation: research-arrive var(--research-motion-duration) var(--research-motion-ease) both;
    animation-delay: calc(var(--research-arrival-order, 0) * var(--research-motion-stagger));
  }

  .research-tile-link .arrow {
    transition: transform var(--research-feedback-duration) var(--research-motion-ease);
  }

  .research-tile-link:focus-visible .arrow { transform: translate(2px, -2px); }

  @media (hover: hover) and (pointer: fine) {
    .research-tile-link:hover .arrow { transform: translate(2px, -2px); }
  }
}

@media (max-width: 559px) {
  :root {
    --research-motion-duration: 380ms;
    --research-motion-distance: 8px;
  }
}

@media print {
  .research-tile.is-arriving { animation: none; }
}
