/* Five balls follow the reference: 10 / 16 / 22 / 16 / 10, staggered by .15s. */
#loading-mask { background: var(--portal-page, #f7f8fd); }
.loading-balls,
body .el-loading-mask .el-loading-spinner > svg {
  display: inline-block;
  width: 102px;
  height: 42px;
  overflow: visible;
  vertical-align: middle;
  color: var(--commonBgColor, #2484ff);
  animation: none;
}
.loading-balls circle,
body .el-loading-mask .el-loading-spinner > svg circle {
  fill: currentColor;
  stroke: none;
  transform-box: fill-box;
  transform-origin: center;
  animation: loading-bounce .9s ease-in-out infinite alternate;
}
.loading-balls circle:nth-child(2),
body .el-loading-mask .el-loading-spinner > svg circle:nth-child(2) { animation-delay: .15s; }
.loading-balls circle:nth-child(3),
body .el-loading-mask .el-loading-spinner > svg circle:nth-child(3) { animation-delay: .3s; }
.loading-balls circle:nth-child(4),
body .el-loading-mask .el-loading-spinner > svg circle:nth-child(4) { animation-delay: .45s; }
.loading-balls circle:nth-child(5),
body .el-loading-mask .el-loading-spinner > svg circle:nth-child(5) { animation-delay: .6s; }
body .el-loading-mask .el-loading-spinner {
  top: 50%;
  margin-top: -21px;
}
body .el-loading-mask .el-loading-spinner .el-loading-text { color: var(--commonBgColor, #2484ff); }
body .el-button .el-icon.is-loading {
  width: 36px;
  height: 18px;
  flex-shrink: 0;
  animation: none;
}
body .el-button .el-icon.is-loading .loading-balls { width: 36px; height: 18px; color: inherit; }
@keyframes loading-bounce {
  from { transform: translateY(0) scale(.85); opacity: .45; }
  to { transform: translateY(-18px) scale(1); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .loading-balls circle,
  body .el-loading-mask .el-loading-spinner > svg circle { animation: none; opacity: 1; }
}