/* Animate existing public-page buttons without changing their design. */
.public-page :is(.login-btn, .search-btn) {
  position: relative;
  overflow: hidden;
  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.public-page :is(.login-btn, .search-btn)::after {
  content: "";
  position: absolute;
  inset: 0 auto 0 -100%;
  width: 50%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.3), transparent);
  transform: skewX(-25deg);
  pointer-events: none;
}
@media (hover: hover) and (pointer: fine) {
  .public-page :is(.login-btn, .search-btn):hover:not(:disabled)::after {
    animation: publicButtonSweep .7s ease-out;
  }
}
.public-page :is(.login-btn, .search-btn):active:not(:disabled) { transform: scale(.96); }
@keyframes publicButtonSweep { to { left: 160%; } }
@media (prefers-reduced-motion: reduce) {
  .public-page :is(.login-btn, .search-btn),
  .public-page :is(.login-btn, .search-btn)::after,
  .public-page :is(.login-btn, .search-btn) .aui-flip__face {
    animation: none !important;
    transition: none !important;
  }
  .public-page :is(.login-btn, .search-btn):is(:hover, :active) { transform: none !important; }
}