#wrapper{aspect-ratio:1;border:2px dashed #000;border-radius:100%;width:100%;position:relative}:first-child{--nth-child:1}:nth-child(2){--nth-child:2}:nth-child(3){--nth-child:3}:nth-child(4){--nth-child:4}:nth-child(5){--nth-child:5}:nth-child(6){--nth-child:6}:nth-child(7){--nth-child:7}:nth-child(8){--nth-child:8}:nth-child(9){--nth-child:9}:nth-child(10){--nth-child:10}:nth-child(11){--nth-child:11}:nth-child(12){--nth-child:12}.item{--add:10;text-align:center;width:10%;height:10%;transform:rotateZ(calc((var(--nth-child) + var(--add))*calc(360/20)*1deg))translateY(500%)rotateZ(calc((var(--nth-child) + var(--add))*calc(360/20)*-1deg));border-radius:100%;justify-content:center;align-items:center;display:flex;position:absolute;top:45%;left:45%}