.loader-wrapper {
  position: fixed;
  height: 100vh;
  width: 100%;
  display: none;
  justify-content: center;
  align-items: center;
  background-color: hsla(0,0%,100%,.85);
  backdrop-filter: blur(4px);
  z-index: 9999;
}

.loader-wrapper.no-background {
  background: 0;
  backdrop-filter: none;
}

.loader-wrapper.absolute {
  height: 100%;
  position: absolute;
}

.adv-loader {
  width: 50px;
  --b: 8px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--color-blue-dk);
  -webkit-mask:
    repeating-conic-gradient(#0000 0deg,#000 1deg 70deg,#0000 71deg 90deg),
    radial-gradient(farthest-side,#0000 calc(100% - var(--b) - 1px),#000 calc(100% - var(--b)));
  mask:
    repeating-conic-gradient(#0000 0deg,#000 1deg 70deg,#0000 71deg 90deg),
    radial-gradient(farthest-side,#0000 calc(100% - var(--b) - 1px),#000 calc(100% - var(--b)));
  -webkit-mask-composite: destination-in;
          mask-composite: intersect;
  animation: l5 1s infinite;
}
@keyframes l5 {to{transform: rotate(.5turn)}}