[data-variant=neutral] .spinner-dot{--spinner-dot-background:var(--background-color-neutral-background-high);--spinner-dot-highlight:var(--text-color-neutral-text-interactive-default)}[data-variant=brand] .spinner-dot{--spinner-dot-background:var(--background-color-brand-background-low);--spinner-dot-highlight:var(--text-color-brand-text-interactive-default)}[data-variant]{--spinner-distance:calc(var(--spinner-size) * .33);--spinner-dot-size:calc(var(--spinner-size) * .14);--spinner-animation-duration:.85s}.spinner-dot{width:var(--spinner-dot-size);height:var(--spinner-dot-size);animation:spinner-dot-fade var(--spinner-animation-duration) infinite;transform-origin:50%;border-radius:9999px;position:absolute;top:50%;left:50%}.spinner-dot:first-of-type{transform:rotate(0deg) translateY(calc(var(--spinner-distance) * -1));animation-delay:calc(var(--spinner-animation-duration) * -7 / 8)}.spinner-dot:nth-of-type(2){transform:rotate(45deg) translateY(calc(var(--spinner-distance) * -1));animation-delay:calc(var(--spinner-animation-duration) * -6 / 8)}.spinner-dot:nth-of-type(3){transform:rotate(90deg) translateY(calc(var(--spinner-distance) * -1));animation-delay:calc(var(--spinner-animation-duration) * -5 / 8)}.spinner-dot:nth-of-type(4){transform:rotate(135deg) translateY(calc(var(--spinner-distance) * -1));animation-delay:calc(var(--spinner-animation-duration) * -4 / 8)}.spinner-dot:nth-of-type(5){transform:rotate(180deg) translateY(calc(var(--spinner-distance) * -1));animation-delay:calc(var(--spinner-animation-duration) * -3 / 8)}.spinner-dot:nth-of-type(6){transform:rotate(225deg) translateY(calc(var(--spinner-distance) * -1));animation-delay:calc(var(--spinner-animation-duration) * -2 / 8)}.spinner-dot:nth-of-type(7){transform:rotate(270deg) translateY(calc(var(--spinner-distance) * -1));animation-delay:calc(var(--spinner-animation-duration) * -1 / 8)}.spinner-dot:nth-of-type(8){transform:rotate(315deg) translateY(calc(var(--spinner-distance) * -1));animation-delay:0s}@keyframes spinner-dot-fade{0%,75%,to{background-color:var(--spinner-dot-background)}90%{background-color:var(--spinner-dot-highlight)}}