/* 一体化部署的 CSP 禁止内联样式，此同源静态文件确保应用挂载前仍保持全屏加载态。 */
* {
  padding: 0;
  margin: 0;
}

html,
body,
#app {
  height: 100%;
}

.app-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  background: #181818;
}

.app-name__loader {
  font-size: 20px;
  font-weight: bold;
  line-height: 5em;
  color: #efefef;
}

.app-name__loader::before {
  content: "MineAdmin";
}

.app-animate__loader {
  width: 6px;
  aspect-ratio: 1;
  color: #fff;
  border-radius: 50%;
  animation:
    animate-loading-1 0.75s infinite linear alternate,
    animate-loading-2 1.5s infinite linear;
}

@keyframes animate-loading-1 {
  0%,
  20% {
    box-shadow: 30px 0 0 3px, 10px 0 0 3px, -10px 0 0 3px, -30px 0 0 3px;
  }

  60%,
  100% {
    box-shadow: 12px 0 0 3px, 14px 0 0 6px, -14px 0 0 6px, -12px 0 0 3px;
  }
}

@keyframes animate-loading-2 {
  0%,
  25% {
    transform: rotate(0);
  }

  50%,
  100% {
    transform: rotate(0.5turn);
  }
}

.app-text__loader {
  font-size: 14px;
  line-height: 7em;
  color: #aaa;
}

.app-text__loader::before {
  content: "再等等，拼命载入资源中";
}