.button{--black-700:#1f1f1f;--border_radius:9999px;--transtion:.3s ease-in-out;--offset:2px;cursor:pointer;transform-origin:50%;border-radius:var(--border_radius);transform:scale(calc(1 + (var(--active,0)*.1)));transition:transform var(--transtion);background-color:#0000;border:none;align-items:center;gap:.5rem;padding:1rem 2rem;display:flex;position:relative}.button:before{content:"";background-color:var(--black-700);border-radius:var(--border_radius);width:100%;height:100%;box-shadow:inset 0 .5px #fff,inset 0 -1px 2px 0 #000,0px 4px 10px -4px hsla(0 0% 0%/calc(1 - var(--active,0))),0 0 0 calc(var(--active,0)*.375rem)#5604fbbf;transition:all var(--transtion);z-index:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.button:after{content:"";width:100%;height:100%;opacity:var(--active,0);border-radius:var(--border_radius);transition:opacity var(--transtion);z-index:2;background-color:#7b3bfcbf;background-image:radial-gradient(at 51% 89%,#b99fdb 0,#0000 50%),radial-gradient(at 100% 100%,#9474be 0,#0000 50%),radial-gradient(at 22% 91%,#9474be 0,#0000 50%);background-position:top;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.button:is(:hover,:focus-visible){--active:1}.button:active{transform:scale(1)}.button .dots_border{--size_border:calc(100% + 2px);width:var(--size_border);height:var(--size_border);border-radius:var(--border_radius);z-index:-10;background-color:#0000;position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)}.button .dots_border:before{content:"";transform-origin:0;background-color:#fff;width:100%;height:2rem;animation:2s linear infinite rotate;position:absolute;top:30%;left:50%;transform:rotate(0);-webkit-mask:linear-gradient(#0000 0%,#fff 120%);mask:linear-gradient(#0000 0%,#fff 120%)}@keyframes rotate{to{transform:rotate(360deg)}}.button .sparkle{z-index:10;width:1.75rem;position:relative}.button .sparkle .path{fill:currentColor;stroke:currentColor;transform-origin:50%;color:#fff}.button:is(:hover,:focus) .sparkle .path{animation:1.5s linear .5s infinite path}.button .sparkle .path:first-child{--scale_path_1:1.2}.button .sparkle .path:nth-child(2){--scale_path_2:1.2}.button .sparkle .path:nth-child(3){--scale_path_3:1.2}@keyframes path{0%,34%,71%,to{transform:scale(1)}17%{transform:scale(var(--scale_path_1,1))}49%{transform:scale(var(--scale_path_2,1))}83%{transform:scale(var(--scale_path_3,1))}}.button .text_button{z-index:10;background-image:linear-gradient(90deg,#fff 0%,hsla(0 0% 100%/var(--active,0))120%);color:#0000;-webkit-background-clip:text;background-clip:text;font-size:1rem;position:relative}
