/* A short bridge between the Site's documents, not another intro.
   Unsupported browsers retain normal links; reduced motion opts out entirely. */
@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
  ::view-transition { background: #050a16; }

  .lab-header .wordmark {
    view-transition-name: meers-wordmark;
  }
  .page > main { view-transition-name: incubating-copy; }
  .page > footer { view-transition-name: incubating-footer; }
  .publications-only .viewport { view-transition-name: publications-content; }
  .join-page .page > main { view-transition-name: join-content; }
  .join-page .page > footer { view-transition-name: join-footer; }

  /* The page itself only crossfades: no slide, camera move or zoom. */
  ::view-transition-group(root) { animation: none; }
  ::view-transition-group(meers-wordmark),
  ::view-transition-old(root),
  ::view-transition-new(root) {
    animation-duration: 500ms;
    animation-timing-function: cubic-bezier(.4,0,.2,1);
  }

  /* One legible name throughout, rather than superimposed letterforms. */
  ::view-transition-old(meers-wordmark) { animation: none; opacity: 0; }
  ::view-transition-new(meers-wordmark) { animation: none; opacity: 1; }

  /* Separate foreground fades prevent the two large headings colliding.
     Backgrounds keep crossfading underneath; no content changes position. */
  ::view-transition-old(incubating-copy),
  ::view-transition-old(incubating-footer),
  ::view-transition-old(join-content),
  ::view-transition-old(join-footer),
  ::view-transition-old(publications-content) {
    animation: page-copy-out 150ms ease-in both;
  }
  ::view-transition-new(incubating-copy),
  ::view-transition-new(incubating-footer),
  ::view-transition-new(join-content),
  ::view-transition-new(join-footer),
  ::view-transition-new(publications-content) {
    animation: page-copy-in 350ms 150ms ease-out both;
  }
}

@keyframes page-copy-out { to { opacity: 0; } }
@keyframes page-copy-in { from { opacity: 0; } }
