


.sign-in__block { position: relative; }
.sign-in__block .btn__blue.ae-btn {
  transition: width .45s cubic-bezier(.6, 0, .2, 1), padding .45s, border-radius .45s, background .4s, box-shadow .4s, color .2s;
}
.sign-in__block .btn__blue.ae-busy {
  color: transparent !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  min-width: 0 !important;
  border-radius: 50% !important;
  white-space: nowrap;
  overflow: hidden;
  pointer-events: none;
  grid-template-columns: 1fr;
}
.sign-in__block .btn__blue.ae-busy::after { opacity: 0 !important; }
.ae-spin, .ae-check {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s;
}
.ae-busy .ae-spin { opacity: 1; }
.ae-spin i {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 2.5px solid rgba(255, 255, 255, .18);
  border-top-color: #7cc4ff;
  border-right-color: #00e0ff;
  animation: aeRot .7s linear infinite;
}
.ae-busy.ae-ok .ae-spin { opacity: 0; }
.ae-check svg { width: 24px; height: 24px; }
.ae-check path { stroke-dasharray: 30; stroke-dashoffset: 30; }
.sign-in__block .btn__blue.ae-ok {
  background: linear-gradient(135deg, #1fbf75, #13a3a0) !important;
  box-shadow: 0 0 0 2px rgba(60, 230, 160, .35), 0 0 28px rgba(40, 220, 150, .45) !important;
}
.ae-ok .ae-check { opacity: 1; }
.ae-ok .ae-check path { animation: aeDraw .45s .1s ease forwards; }
.ae-status {
  min-height: 20px;
  margin: 14px 0 0;
  text-align: center;
  font-size: 13px;
  line-height: 20px;
  color: rgba(190, 215, 255, .7);
  transition: opacity .25s, transform .25s;
}
.ae-status.ae-hide { opacity: 0; transform: translateY(4px); }
.ae-status b { color: #5de2a6; font-weight: 600; }
.sign-in__form.ae-lock .sign-in__input,
.sign-in__form.ae-lock .login-2fa-block { opacity: .45; pointer-events: none; transition: opacity .3s; }


.ae-glow {
  position: absolute;
  inset: -1px;
  z-index: 3;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  padding: 1.5px;
  background: conic-gradient(from var(--ae-a, 0deg), transparent 0 70%, #4da3ff 80%, #00e0ff 88%, #5de2a6 94%, transparent);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
.ae-glow.ae-on { opacity: 1; animation: aeSweep 1.1s linear forwards; }
@property --ae-a { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
.sign-in__block.ae-out {
  transition: transform .6s cubic-bezier(.6, 0, .2, 1), opacity .5s, filter .6s;
  transform: scale(.96);
  opacity: 0;
  filter: blur(6px);
}
.sign-in__block.ae-shake { animation: aeShake .45s; }
.auth-promo, .breadcrumbs, .sign-in__subtitle { transition: opacity .5s, filter .5s; }
body.ae-leaving .auth-promo,
body.ae-leaving .breadcrumbs,
body.ae-leaving .sign-in__subtitle { opacity: 0; filter: blur(6px); }

@keyframes aeRot { to { transform: rotate(360deg); } }
@keyframes aeDraw { to { stroke-dashoffset: 0; } }
@keyframes aeSweep { 0% { --ae-a: 0deg; opacity: 1; } 85% { opacity: 1; } 100% { --ae-a: 360deg; opacity: 0; } }
@keyframes aeShake { 0%, 100% { transform: none; } 20% { transform: translateX(-9px); } 40% { transform: translateX(8px); } 60% { transform: translateX(-5px); } 80% { transform: translateX(3px); } }
