/* Gentle screen changes without delaying account or form state. */
@view-transition { navigation: auto; }
@keyframes wheel-screen-enter { from { opacity: 0; } to { opacity: 1; } }
@keyframes wheel-screen-leave { from { opacity: 1; } to { opacity: 0; } }
@media (prefers-reduced-motion: no-preference) {
  body > main, #accountDialog[open] { animation: wheel-screen-enter 180ms ease-out both; }
  ::view-transition-old(root) { animation: wheel-screen-leave 160ms ease-out both; }
  ::view-transition-new(root) { animation: wheel-screen-enter 180ms ease-out both; }
}
.privacyClose, #accountClose {
  -webkit-tap-highlight-color: transparent;
  -webkit-appearance: none;
  appearance: none;
  color: inherit;
  -webkit-text-fill-color: currentColor;
  text-decoration: none;
}
.privacyClose:hover, .privacyClose:active, .privacyClose:focus {
  background: transparent;
  border: 0;
  box-shadow: none;
}
@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}
/* First visit: show the settled typography, without an indefinite loading screen. */
html.site-loading body > header, html.site-loading body > main,
html.site-loading body > footer, html.site-loading #accountDialog[open] {
  opacity: 0;
  pointer-events: none;
  animation: none;
}
@media (prefers-reduced-motion: no-preference) {
  html.site-ready body > header, html.site-ready body > main,
  html.site-ready body > footer { animation: wheel-screen-enter 420ms ease-out both; }
  html.site-ready #accountDialog[open] { animation: wheel-screen-enter 220ms ease-out both; }
}
