.rotating-button{text-transform:uppercase;color:var(--color-base-400,currentColor);cursor:pointer;font:inherit;background:0 0;border:0;align-items:center;gap:.5rem;padding:0;text-decoration:none;display:inline-flex;position:relative}.rotating-button-label{-webkit-font-smoothing:antialiased;letter-spacing:-.025rem;width:max-content;font-weight:900;display:inline-block;position:relative;transform:translateY(.1rem)}.rotating-button-label:after{content:"";transform-origin:100% 100%;will-change:transform;background:currentColor;width:100%;height:.1rem;transition:transform .25s ease-out;position:absolute;bottom:-.35rem;left:0;transform:scaleX(0)}.rotating-button:hover .rotating-button-label:after{transform-origin:0 100%;transform:scaleX(1)}.rotating-button-icon{transform-style:preserve-3d;perspective:1000px;will-change:transform;justify-content:center;align-items:center;transition:transform .6s ease-out;display:flex}.rotating-button-icon-inner{background-color:var(--rotating-button-bg,currentColor);width:1.5rem;height:1.5rem;color:var(--rotating-button-fg,#fff);border-radius:10rem;justify-content:center;align-items:center;display:flex}.rotating-button:hover .rotating-button-icon{animation:.8s ease-out forwards rotatingButtonFlipTwice}.rotating-button:not(:hover) .rotating-button-icon{animation:.8s ease-out forwards rotatingButtonFlipBack}@keyframes rotatingButtonFlipTwice{0%{transform:rotateY(0)}to{transform:rotateY(720deg)}}@keyframes rotatingButtonFlipBack{0%{transform:rotateY(720deg)}to{transform:rotateY(0)}}.rotating-button--light{--rotating-button-bg:#fff;--rotating-button-fg:#111;color:#fff}.rotating-button--dark{--rotating-button-bg:#111;--rotating-button-fg:#fff;color:#111}@media (width<=1000px){.rotating-button-label:after{display:none}.rotating-button:hover .rotating-button-icon,.rotating-button:not(:hover) .rotating-button-icon{animation:none}}