/* Native document navigation preserves the old page until its successor can render. */
@view-transition { navigation: auto; }
::view-transition-old(root) {
  animation: page-depart 130ms ease-out both;
}
::view-transition-new(root) {
  animation: page-arrive 180ms cubic-bezier(.22, 1, .36, 1) both;
}
@keyframes page-depart { to { opacity: 0; } }
@keyframes page-arrive {
  from { opacity: .35; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}
.medallion-mark .mark-fallback {
  position: absolute;
  inset: 10%;
  display: block;
  width: 80%;
  height: 80%;
  object-fit: contain;
  mix-blend-mode: multiply;
  opacity: 1;
  pointer-events: none;
  transition: opacity 110ms linear;
}
.medallion-mark canvas[data-mark] {
  opacity: 0;
  transition: opacity 110ms linear;
}
.medallion-mark canvas[data-ready="true"] { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
  .medallion-mark .mark-fallback, .medallion-mark canvas[data-mark] { transition: none; }
}