/* Native same-origin transitions; cross-origin pages use a short entry fade. */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: sapi-page-out 140ms ease-out both; }
::view-transition-new(root) { animation: sapi-page-in 180ms ease-out both; }
body > main, body > #root { animation: sapi-page-in 180ms ease-out; }
html.sapi-navigating::after {
  content: "";
  position: fixed;
  inset: 0 0 auto;
  height: 3px;
  z-index: 2147483647;
  pointer-events: none;
  background: linear-gradient(90deg, #a849e6, #eb4f9f, #59dbee);
  transform-origin: left;
  animation: sapi-navigation-progress 1.5s ease-out both;
}
html.sapi-navigating { cursor: progress; }
@keyframes sapi-page-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes sapi-page-out { to { opacity: 0; } }
@keyframes sapi-navigation-progress {
  from { transform: scaleX(.08); }
  to { transform: scaleX(.9); }
}
@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root), ::view-transition-new(root),
  body > main, body > #root, html.sapi-navigating::after { animation: none; }
}