/* HTML: <div class="loader"></div> */
/* HTML: <div class="loader"></div> */
/* HTML: <div class="loader"></div> */
/* .loader1 {
  width: 60px;
  aspect-ratio: 4;
  background: radial-gradient(circle closest-side, #000 90%, #0000) 0 /
    calc(100% / 3) 100% space;
  clip-path: inset(0 100% 0 0);
  animation: l1 1s steps(4) infinite;
}
@keyframes l1 {
  to {
    clip-path: inset(0 -34% 0 0);
  }
}
.loader {
  width: 85px;
  height: 50px;
  --g1: conic-gradient(
    from 90deg at left 3px top 3px,
    #0000 90deg,
    rgb(0, 136, 255) 0
  );
  --g2: conic-gradient(
    from -90deg at bottom 3px right 3px,
    #0000 90deg,
    rgb(0, 136, 255) 0
  );
  background: var(--g1), var(--g1), var(--g1), var(--g2), var(--g2), var(--g2);
  background-position: left, center, right;
  background-repeat: no-repeat;
  animation: l10 1s infinite alternate;
  margin: auto;
}
@keyframes l10 {
  0%,
  2% {
    background-size: 25px 50%, 25px 50%, 25px 50%;
  }
  20% {
    background-size: 25px 25%, 25px 50%, 25px 50%;
  }
  40% {
    background-size: 25px 100%, 25px 25%, 25px 50%;
  }
  60% {
    background-size: 25px 50%, 25px 100%, 25px 25%;
  }
  80% {
    background-size: 25px 50%, 25px 50%, 25px 100%;
  }
  98%,
  100% {
    background-size: 25px 50%, 25px 50%, 25px 50%;
  }
} */

/* HTML: <div class="loader"></div> */
.loader {
  --d: 22px;
  width: 4px;
  height: 4px;
  /* Always centered in its container; vertical spacing comes from the my-* class on Loader */
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  color: var(--theme-primary, #25b09b);
  box-shadow: calc(1 * var(--d)) calc(0 * var(--d)) 0 0,
    calc(0.707 * var(--d)) calc(0.707 * var(--d)) 0 1px,
    calc(0 * var(--d)) calc(1 * var(--d)) 0 2px,
    calc(-0.707 * var(--d)) calc(0.707 * var(--d)) 0 3px,
    calc(-1 * var(--d)) calc(0 * var(--d)) 0 4px,
    calc(-0.707 * var(--d)) calc(-0.707 * var(--d)) 0 5px,
    calc(0 * var(--d)) calc(-1 * var(--d)) 0 6px;
  animation: l27 1s infinite steps(8);
}
@keyframes l27 {
  100% {
    transform: rotate(1turn);
  }
}
