@property --k{syntax:"<number>";initial-value:-1;inherits:true}.circular-gallery-wrapper{position:relative;width:100%;height:100%;overflow:hidden;perspective:1000px;display:flex;align-items:start;justify-content:center}.circular-gallery-container{--dir:0;position:relative;transform-style:preserve-3d;width:100%;height:100%;display:grid;place-items:center}.scene{transform-style:preserve-3d;transform:translateY(-5%) translateZ(-500px)}.assembly{display:grid;transform-style:preserve-3d;rotate:0 1 0 calc((var(--k) + .5) * -1turn)}.assembly article{--i:var(--i);--n:var(--gallery-length);--r:700px;--a:calc(var(--i) * (360deg / var(--n)));grid-area:1/1;position:absolute;left:50%;top:50%;width:140px;height:200px;transform:translate(-50%,-50%) rotateY(var(--a)) translateZ(var(--r));backface-visibility:hidden;transform-style:preserve-3d;border-radius:8px;box-shadow:0 10px 30px rgba(0,0,0,.5);-webkit-box-reflect:below 5px linear-gradient(transparent,transparent,rgba(0,0,0,.4))}.assembly img{width:100%;height:100%;border-radius:8px;pointer-events:none}@media (max-width:768px){.assembly article{--r:650px;width:90px;height:130px}.circular-gallery-wrapper{margin-top:-3rem}.scene{transform:translateY(-5%) translateZ(-800px)}}