.app-loader {
  position: fixed;
  inset: 0;
  z-index: 9998;
  background: #161616;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.375rem;
  transition: opacity .45s ease, visibility .45s ease;
}
.app-loader.is-done {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.app-loader__name {
  font-family: 'Krona One', sans-serif;
  font-size: 1.375rem;
  letter-spacing: -.02em;
  color: #6c63ff;
}
.app-loader__track {
  width: 140px;
  height: 2px;
  background: rgba(255, 255, 255, .08);
  border-radius: 2px;
  overflow: hidden;
}
.app-loader__fill {
  height: 100%;
  width: 0;
  background: #5a52e0;
  border-radius: 2px;
  animation: app-loader-fill 1.1s cubic-bezier(.4, 0, .2, 1) forwards;
}
@keyframes app-loader-fill {
  0%   { width: 0%; }
  70%  { width: 82%; }
  100% { width: 100%; }
}