@view-transition{navigation:auto}
.auth-page .auth{view-transition-name:auth-card}
.auth-page .auth-visual{view-transition-name:auth-visual;border-radius:28px 0 0 28px}
.auth-page .auth-main{view-transition-name:auth-form;border-radius:0 28px 28px 0}
::view-transition-group(*){animation-duration:.45s;animation-timing-function:cubic-bezier(.2,.8,.2,1)}
::view-transition-old(auth-form){animation:authVtOut .2s ease-in both}
::view-transition-new(auth-form){animation:authVtIn .45s cubic-bezier(.2,.8,.2,1) .08s both}
::view-transition-old(auth-visual),::view-transition-new(auth-visual){animation-duration:.45s}
@keyframes authVtOut{to{opacity:0;transform:translateY(-10px)}}
@keyframes authVtIn{from{opacity:0;transform:translateY(14px)}}
@media (max-width:960px){
  .auth-page .auth-visual{border-radius:22px 22px 0 0}
  .auth-page .auth-main{border-radius:0 0 22px 22px}
}
@media (max-width:640px){
  .auth-page .auth-visual{border-radius:18px 18px 0 0}
  .auth-page .auth-main{border-radius:0 0 18px 18px}
}
@media (prefers-reduced-motion:reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}}
