#loader{ width: 100%; height: 100%; background: var(--color-bg); position: fixed; top: 0px; left: 0px; z-index: 9999; display: flex; align-items: center; justify-content: center;}
.loader {
  width: 50px;
  aspect-ratio: 1;
  display: grid;
  border: 4px solid #0000;
  border-radius: 50%;
  border-right-color: var(--color-01);
  animation: l15 1s infinite linear;
}
.loader::before,
.loader::after {
  content: "";
  grid-area: 1/1;
  margin: 2px;
  border: inherit;
  border-radius: 50%;
  animation: l15 2s infinite;
}
.loader::before {
  margin: 8px;
  animation-duration: 3s;
}
.loader::after {
  margin: 8px;
  border-right-color: var(--color-02);
  animation-duration: 3s;
}
@keyframes l15{
  100%{transform: rotate(1turn)}
}