#appLoader {
  --color: #fafafa;
  .dark & {
    --color: #171717;
  }
  position: fixed;
  inset: 0;
  height: 100svh;
  background-color: var(--color);
  display: grid;
  place-items: center;
}
#clock {
  width: 30px;
  height: 30px;
  border: 1px solid;
  border-radius: 50%;
  color: var(--clock-color);
  transform: scale(1.6);
  &::before,
  &::after {
    position: absolute;
    width: 0;
    border-left: 1px solid var(--clock-color);
    content: '';
    border-radius: 1px;
    transform-origin: bottom center;
    animation: clockwise linear infinite;
    left: 50%;
    margin-left: -0.5px;
  }
  &::before {
    height: 12px;
    top: calc(50% - 12px);
    animation-duration: 1s;
  }
  &::after {
    height: 10px;
    top: calc(50% - 10px);
    animation-duration: 60s;
  }
}
@keyframes clockwise {
  to {
    transform: rotate(360deg);
  }
}