.compsoul-body{margin-left:auto;margin-right:auto;display:flex;height:100%;width:100%;flex-direction:column;flex-wrap:wrap;align-items:center;border-radius:9999px}.compsoul-roulette{--size:100%;--angle:calc(3.1416 / var(--number-of-items));--tangent-first:var(--angle);--tangent-second:calc((1 / 3) * var(--angle) * var(--angle) * var(--angle));--tangent-third:calc((2 / 15) * var(--angle) * var(--angle) * var(--angle) * var(--angle) * var(--angle));--tangent-fourth:calc((17 / 315) * var(--angle) * var(--angle) * var(--angle) * var(--angle) * var(--angle) * var(--angle) * var(--angle));--tangent:calc(var(--tangent-first) + var(--tangent-second) + var(--tangent-third) + var(--tangent-fourth));height:var(--size);width:var(--size);position:relative;border-radius:9999px;border-width:1px}.compsoul-roulette .roulette-list{border-radius:100%;height:100%;list-style-type:none;margin:0;overflow:hidden;padding:0;position:relative;width:100%}.compsoul-roulette .roulette-item .roulette-border,.compsoul-roulette .roulette-item .slot{bottom:calc(var(--size)/2);height:calc(var(--size)/2);left:calc(var(--size)/4);transform-origin:bottom center;width:calc(var(--size)/2);position:absolute;display:flex;flex-direction:column;align-items:center}.compsoul-roulette .roulette-item .roulette-border{left:calc(var(--size)/2)}.compsoul-roulette.count-10 .roulette-item:first-child .roulette-border,.compsoul-roulette.count-8 .roulette-item:first-child .roulette-border{transform:rotate(calc(1turn / var(--number-of-items) * (1 - .5001))) translateX(-.4px)}.compsoul-roulette .roulette-item:first-child .slot{transform:rotate(calc(1turn / var(--number-of-items) * (1 - 1)))}.compsoul-roulette .roulette-item:first-child .roulette-border{transform-origin:bottom center;transform:rotate(calc(1turn / var(--number-of-items) * (1 - .5)));z-index:2;position:absolute;height:100%;width:1px}.compsoul-roulette.count-10 .roulette-item:nth-child(2) .roulette-border,.compsoul-roulette.count-8 .roulette-item:nth-child(2) .roulette-border{transform:rotate(calc(1turn / var(--number-of-items) * (2 - .5001))) translateX(-.4px)}.compsoul-roulette .roulette-item:nth-child(2) .slot{transform:rotate(calc(1turn / var(--number-of-items) * (2 - 1)))}.compsoul-roulette .roulette-item:nth-child(2) .roulette-border{transform-origin:bottom center;transform:rotate(calc(1turn / var(--number-of-items) * (2 - .5)));z-index:2;position:absolute;height:100%;width:1px}.compsoul-roulette.count-10 .roulette-item:nth-child(3) .roulette-border,.compsoul-roulette.count-8 .roulette-item:nth-child(3) .roulette-border{transform:rotate(calc(1turn / var(--number-of-items) * (3 - .5001))) translateX(-.4px)}.compsoul-roulette .roulette-item:nth-child(3) .slot{transform:rotate(calc(1turn / var(--number-of-items) * (3 - 1)))}.compsoul-roulette .roulette-item:nth-child(3) .roulette-border{transform-origin:bottom center;transform:rotate(calc(1turn / var(--number-of-items) * (3 - .5)));z-index:2;position:absolute;height:100%;width:1px}.compsoul-roulette.count-10 .roulette-item:nth-child(4) .roulette-border,.compsoul-roulette.count-8 .roulette-item:nth-child(4) .roulette-border{transform:rotate(calc(1turn / var(--number-of-items) * (4 - .5001))) translateX(-.4px)}.compsoul-roulette .roulette-item:nth-child(4) .slot{transform:rotate(calc(1turn / var(--number-of-items) * (4 - 1)))}.compsoul-roulette .roulette-item:nth-child(4) .roulette-border{transform-origin:bottom center;transform:rotate(calc(1turn / var(--number-of-items) * (4 - .5)));z-index:2;position:absolute;height:100%;width:1px}.compsoul-roulette.count-10 .roulette-item:nth-child(5) .roulette-border,.compsoul-roulette.count-8 .roulette-item:nth-child(5) .roulette-border{transform:rotate(calc(1turn / var(--number-of-items) * (5 - .5001))) translateX(-.4px)}.compsoul-roulette .roulette-item:nth-child(5) .slot{transform:rotate(calc(1turn / var(--number-of-items) * (5 - 1)))}.compsoul-roulette .roulette-item:nth-child(5) .roulette-border{transform-origin:bottom center;transform:rotate(calc(1turn / var(--number-of-items) * (5 - .5)));z-index:2;position:absolute;height:100%;width:1px}.compsoul-roulette.count-10 .roulette-item:nth-child(6) .roulette-border,.compsoul-roulette.count-8 .roulette-item:nth-child(6) .roulette-border{transform:rotate(calc(1turn / var(--number-of-items) * (6 - .5001))) translateX(-.4px)}.compsoul-roulette .roulette-item:nth-child(6) .slot{transform:rotate(calc(1turn / var(--number-of-items) * (6 - 1)))}.compsoul-roulette .roulette-item:nth-child(6) .roulette-border{transform-origin:bottom center;transform:rotate(calc(1turn / var(--number-of-items) * (6 - .5)));z-index:2;position:absolute;height:100%;width:1px}.compsoul-roulette.count-10 .roulette-item:nth-child(7) .roulette-border,.compsoul-roulette.count-8 .roulette-item:nth-child(7) .roulette-border{transform:rotate(calc(1turn / var(--number-of-items) * (7 - .5001))) translateX(-.4px)}.compsoul-roulette .roulette-item:nth-child(7) .slot{transform:rotate(calc(1turn / var(--number-of-items) * (7 - 1)))}.compsoul-roulette .roulette-item:nth-child(7) .roulette-border{transform-origin:bottom center;transform:rotate(calc(1turn / var(--number-of-items) * (7 - .5)));z-index:2;position:absolute;height:100%;width:1px}.compsoul-roulette.count-10 .roulette-item:nth-child(8) .roulette-border,.compsoul-roulette.count-8 .roulette-item:nth-child(8) .roulette-border{transform:rotate(calc(1turn / var(--number-of-items) * (8 - .5001))) translateX(-.4px)}.compsoul-roulette .roulette-item:nth-child(8) .slot{transform:rotate(calc(1turn / var(--number-of-items) * (8 - 1)))}.compsoul-roulette .roulette-item:nth-child(8) .roulette-border{transform-origin:bottom center;transform:rotate(calc(1turn / var(--number-of-items) * (8 - .5)));z-index:2;position:absolute;height:100%;width:1px}.compsoul-roulette.count-10 .roulette-item:nth-child(9) .roulette-border,.compsoul-roulette.count-8 .roulette-item:nth-child(9) .roulette-border{transform:rotate(calc(1turn / var(--number-of-items) * (9 - .5001))) translateX(-.4px)}.compsoul-roulette .roulette-item:nth-child(9) .slot{transform:rotate(calc(1turn / var(--number-of-items) * (9 - 1)))}.compsoul-roulette .roulette-item:nth-child(9) .roulette-border{transform-origin:bottom center;transform:rotate(calc(1turn / var(--number-of-items) * (9 - .5)));z-index:2;position:absolute;height:100%;width:1px}.compsoul-roulette.count-10 .roulette-item:nth-child(10) .roulette-border,.compsoul-roulette.count-8 .roulette-item:nth-child(10) .roulette-border{transform:rotate(calc(1turn / var(--number-of-items) * (10 - .5001))) translateX(-.4px)}.compsoul-roulette .roulette-item:nth-child(10) .slot{transform:rotate(calc(1turn / var(--number-of-items) * (10 - 1)))}.compsoul-roulette .roulette-item:nth-child(10) .roulette-border{transform-origin:bottom center;transform:rotate(calc(1turn / var(--number-of-items) * (10 - .5)));z-index:2;position:absolute;height:100%;width:1px}.compsoul-roulette.count-10 .roulette-item:nth-child(11) .roulette-border,.compsoul-roulette.count-8 .roulette-item:nth-child(11) .roulette-border{transform:rotate(calc(1turn / var(--number-of-items) * (11 - .5001))) translateX(-.4px)}.compsoul-roulette .roulette-item:nth-child(11) .slot{transform:rotate(calc(1turn / var(--number-of-items) * (11 - 1)))}.compsoul-roulette .roulette-item:nth-child(11) .roulette-border{transform-origin:bottom center;transform:rotate(calc(1turn / var(--number-of-items) * (11 - .5)));z-index:2;position:absolute;height:100%;width:1px}.compsoul-roulette.count-10 .roulette-item:nth-child(12) .roulette-border,.compsoul-roulette.count-8 .roulette-item:nth-child(12) .roulette-border{transform:rotate(calc(1turn / var(--number-of-items) * (12 - .5001))) translateX(-.4px)}.compsoul-roulette .roulette-item:nth-child(12) .slot{transform:rotate(calc(1turn / var(--number-of-items) * (12 - 1)))}.compsoul-roulette .roulette-item:nth-child(12) .roulette-border{transform-origin:bottom center;transform:rotate(calc(1turn / var(--number-of-items) * (12 - .5)));z-index:2;position:absolute;height:100%;width:1px}.compsoul-roulette.count-10 .roulette-item:nth-child(13) .roulette-border,.compsoul-roulette.count-8 .roulette-item:nth-child(13) .roulette-border{transform:rotate(calc(1turn / var(--number-of-items) * (13 - .5001))) translateX(-.4px)}.compsoul-roulette .roulette-item:nth-child(13) .slot{transform:rotate(calc(1turn / var(--number-of-items) * (13 - 1)))}.compsoul-roulette .roulette-item:nth-child(13) .roulette-border{transform-origin:bottom center;transform:rotate(calc(1turn / var(--number-of-items) * (13 - .5)));z-index:2;position:absolute;height:100%;width:1px}.compsoul-roulette.count-10 .roulette-item:nth-child(14) .roulette-border,.compsoul-roulette.count-8 .roulette-item:nth-child(14) .roulette-border{transform:rotate(calc(1turn / var(--number-of-items) * (14 - .5001))) translateX(-.4px)}.compsoul-roulette .roulette-item:nth-child(14) .slot{transform:rotate(calc(1turn / var(--number-of-items) * (14 - 1)))}.compsoul-roulette .roulette-item:nth-child(14) .roulette-border{transform-origin:bottom center;transform:rotate(calc(1turn / var(--number-of-items) * (14 - .5)));z-index:2;position:absolute;height:100%;width:1px}.compsoul-roulette.count-10 .roulette-item:nth-child(15) .roulette-border,.compsoul-roulette.count-8 .roulette-item:nth-child(15) .roulette-border{transform:rotate(calc(1turn / var(--number-of-items) * (15 - .5001))) translateX(-.4px)}.compsoul-roulette .roulette-item:nth-child(15) .slot{transform:rotate(calc(1turn / var(--number-of-items) * (15 - 1)))}.compsoul-roulette .roulette-item:nth-child(15) .roulette-border{transform-origin:bottom center;transform:rotate(calc(1turn / var(--number-of-items) * (15 - .5)));z-index:2;position:absolute;height:100%;width:1px}.compsoul-roulette.count-10 .roulette-item:nth-child(16) .roulette-border,.compsoul-roulette.count-8 .roulette-item:nth-child(16) .roulette-border{transform:rotate(calc(1turn / var(--number-of-items) * (16 - .5001))) translateX(-.4px)}.compsoul-roulette .roulette-item:nth-child(16) .slot{transform:rotate(calc(1turn / var(--number-of-items) * (16 - 1)))}.compsoul-roulette .roulette-item:nth-child(16) .roulette-border{transform-origin:bottom center;transform:rotate(calc(1turn / var(--number-of-items) * (16 - .5)));z-index:2;position:absolute;height:100%;width:1px}.compsoul-roulette.count-10 .roulette-item:nth-child(17) .roulette-border,.compsoul-roulette.count-8 .roulette-item:nth-child(17) .roulette-border{transform:rotate(calc(1turn / var(--number-of-items) * (17 - .5001))) translateX(-.4px)}.compsoul-roulette .roulette-item:nth-child(17) .slot{transform:rotate(calc(1turn / var(--number-of-items) * (17 - 1)))}.compsoul-roulette .roulette-item:nth-child(17) .roulette-border{transform-origin:bottom center;transform:rotate(calc(1turn / var(--number-of-items) * (17 - .5)));z-index:2;position:absolute;height:100%;width:1px}.compsoul-roulette.count-10 .roulette-item:nth-child(18) .roulette-border,.compsoul-roulette.count-8 .roulette-item:nth-child(18) .roulette-border{transform:rotate(calc(1turn / var(--number-of-items) * (18 - .5001))) translateX(-.4px)}.compsoul-roulette .roulette-item:nth-child(18) .slot{transform:rotate(calc(1turn / var(--number-of-items) * (18 - 1)))}.compsoul-roulette .roulette-item:nth-child(18) .roulette-border{transform-origin:bottom center;transform:rotate(calc(1turn / var(--number-of-items) * (18 - .5)));z-index:2;position:absolute;height:100%;width:1px}.compsoul-roulette.count-10 .roulette-item:nth-child(19) .roulette-border,.compsoul-roulette.count-8 .roulette-item:nth-child(19) .roulette-border{transform:rotate(calc(1turn / var(--number-of-items) * (19 - .5001))) translateX(-.4px)}.compsoul-roulette .roulette-item:nth-child(19) .slot{transform:rotate(calc(1turn / var(--number-of-items) * (19 - 1)))}.compsoul-roulette .roulette-item:nth-child(19) .roulette-border{transform-origin:bottom center;transform:rotate(calc(1turn / var(--number-of-items) * (19 - .5)));z-index:2;position:absolute;height:100%;width:1px}.compsoul-roulette.count-10 .roulette-item:nth-child(20) .roulette-border,.compsoul-roulette.count-8 .roulette-item:nth-child(20) .roulette-border{transform:rotate(calc(1turn / var(--number-of-items) * (20 - .5001))) translateX(-.4px)}.compsoul-roulette .roulette-item:nth-child(20) .slot{transform:rotate(calc(1turn / var(--number-of-items) * (20 - 1)))}.compsoul-roulette .roulette-item:nth-child(20) .roulette-border{transform-origin:bottom center;transform:rotate(calc(1turn / var(--number-of-items) * (20 - .5)));z-index:2;position:absolute;height:100%;width:1px}.compsoul-roulette .roulette-item .slot-inner{border-right:calc(var(--size)/2*var(--tangent) + 1px) solid transparent;border-top:calc(var(--size)/2 + 1px) solid transparent;border-left:calc(var(--size)/2*var(--tangent) + 1px) solid transparent;content:"";z-index:-1;position:absolute;bottom:0;left:50%;display:block;height:0;width:0;--tw-translate-x:-50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.roulette-text{position:absolute;top:33.333333%;width:100%;line-height:1}.roulette-text.with-image{top:46%}.roulette-item__description{margin-bottom:min(2%,8px);width:100%;max-width:100%;text-align:center;font-size:12px}.roulette-item__title{width:calc(var(--size)*sin(var(--angle)/2)*2*.8);max-width:100%;text-align:center;font-size:16px;font-weight:700}@keyframes roulette{0%{transform:rotate(0)}to{transform:rotate(1turn)}}