@layer component{.m-card-spinner{width:300px;height:200px;perspective:1000px;cursor:pointer}.m-card-spinner:hover .m-card-spinner-content{transform:rotateY(180deg)}.m-card-spinner-content{position:relative;width:100%;height:100%;text-align:center;transition:transform .8s;transform-style:preserve-3d}.m-card-spinner-front{width:100%;height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;background:rgba(var(--color-white-rgb),.1);backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px);padding:var(--space-4);gap:var(--space-3);text-align:center}.m-card-spinner-front,.m-card-spinner-front:before{position:absolute;border-radius:var(--border-radius)}.m-card-spinner-front:before{content:"";z-index:-1;inset:0;padding:1px;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;background:linear-gradient(to right,var(--gradiant-start-color) 0,var(--gradiant-end-color) 100%)}}