.flap{width:100%;height:100%;position:absolute;bottom:50%;right:50%;pointer-events:none;will-change:transform;background:hsl(calc(1turn * var(--p)),80%,80%);background:linear-gradient(35deg,#555,black);border:4px solid #999;--p:calc(var(--i) / var(--flaps));transform-origin:bottom right;transform:rotate(-.5turn) rotate(calc(1turn * var(--p))) skewX(30deg) translateX(-100%) translateY(90%)}.animate{--d-1:900ms;--d-2:100ms;animation:click var(--d-1) cubic-bezier(.5,0,.5,1) var(--d-2)}@keyframes click{48%,52%{transform:rotate(-90deg) rotate(calc(1turn * var(--p))) skewX(30deg) translateX(0) translateY(0)}}