/**
 * UIR Editorial Liquid Glass — v1.4.7
 * Page-to-page blur out AND blur in; shorter, smooth entrance and exit.
 * Native cross-document View Transitions plus an accessible fallback.
 */

/* Chrome, Edge, Safari and other engines supporting cross-document snapshots. */
@view-transition {
  navigation: auto;
}

@keyframes uir-page-blur-out {
  0%   { opacity: 1;    filter: blur(0); }
  35%  { opacity: .88;  filter: blur(5px); }
  70%  { opacity: .48;  filter: blur(13px); }
  100% { opacity: 0;    filter: blur(20px); }
}

@keyframes uir-page-blur-in {
  0%   { opacity: 0;   filter: blur(20px); }
  24%  { opacity: .32; filter: blur(16px); }
  55%  { opacity: .78; filter: blur(8px); }
  80%  { opacity: .96; filter: blur(2px); }
  100% { opacity: 1;   filter: blur(0); }
}

/* Compact cross-document navigation (~0.6 seconds total).
   New snapshot is really blurred, not just faded in. */
::view-transition-old(root) {
  animation: 380ms cubic-bezier(.48, 0, .86, .48) both uir-page-blur-out;
}
::view-transition-new(root) {
  animation: 550ms cubic-bezier(.12, .58, .22, 1) 45ms both uir-page-blur-in;
}

/* Without native cross-document View Transitions, the navigation script
   animates the old page, then the new document animates from blur(20px). */
@media (prefers-reduced-motion: no-preference) {
  html.uir-page-blur-fallback #Wrapper {
    transition: opacity 380ms cubic-bezier(.48, 0, .86, .48),
                filter 380ms cubic-bezier(.48, 0, .86, .48);
  }
  html.uir-page-blur-fallback.uir-page-blur-exiting #Wrapper {
    opacity: 0;
    filter: blur(20px);
    pointer-events: none;
  }
  html.uir-page-blur-fallback.uir-page-blur-entering #Wrapper {
    animation: uir-page-blur-in 550ms cubic-bezier(.12, .58, .22, 1) both;
  }
}

/* Respect OS accessibility settings. Neither blur nor delayed navigation. */
@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
  ::view-transition-old(root),
  ::view-transition-new(root) {
    animation: none !important;
  }
  html.uir-page-blur-fallback #Wrapper {
    animation: none !important;
    transition: none !important;
    filter: none !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
}