.ring{--inner-angle:calc((360 / var(--char-count)) * 1deg);--character-width:1;font-family:monospace;text-transform:uppercase;font-size:calc(var(--font-size, 1) * 1rem);position:relative}@media (prefers-reduced-motion:no-preference){.text-ring{animation:spin 20s linear infinite}@keyframes spin{to{rotate:1turn}}}.text-ring{position:relative}.text-ring [style*="--index"]{font-family:monospace;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(calc(1turn / var(--total) * var(--index))) translateY(calc(var(--radius, 5) * -1ch))}