@property --angle{syntax:"<angle>";inherits:false;initial-value:0deg}.vsl-btn{cursor:pointer;background-color:var(--shade-600);color:#ddeaff;text-align:center;outline:1px solid var(--shade-600);border-radius:10px;gap:.5rem;position:relative;overflow:visible}.vsl-btn[data-mode=normal]{outline:none}.vsl-btn:is([data-mode=outline],[data-mode=ghost],[data-is-animating=true]){background-color:#0000;-webkit-background-clip:text;background-clip:text}.vsl-btn[data-mode=ghost]{outline:none}.vsl-btn[data-size=small],.vsl-btn[data-size=medium],.vsl-btn[data-size=large]{padding:.25rem}.vsl-btn:disabled{cursor:not-allowed;opacity:.5}.vsl-btn:not(:disabled){cursor:pointer}.vsl-btn[data-is-animating=true] .particles-container{z-index:10;width:100%;height:100%;animation:13s linear infinite particleBorderTrace;position:absolute;top:0;left:0;transform:translate(-50%,-50%)}@media (max-width:768px){.particles-container{display:none}.vsl-btn{outline:none}}.vsl-btn[data-is-animating=true] .particles-container .particle{opacity:1;width:1px;height:1px;box-shadow:0px 0px 10px 1px var(--shade-600);background-color:var(--shade-600);border-radius:50%;position:absolute;top:50%;left:50%}.vsl-btn[data-is-animating=true] .particles-container .particle:first-child{animation:8s ease-in-out infinite particleFloat1}.vsl-btn[data-is-animating=true] .particles-container .particle:nth-child(2){animation:12s ease-in-out infinite particleFloat2}.vsl-btn[data-is-animating=true] .particles-container .particle:nth-child(3){animation:10s ease-in-out infinite particleFloat3}.vsl-btn[data-is-animating=true] .particles-container .particle:nth-child(4){animation:15s ease-in-out infinite particleFloat4}.vsl-btn[data-is-animating=true] .particles-container .particle:nth-child(5){animation:9s ease-in-out infinite particleFloat5}.vsl-btn[data-is-animating=true] .particles-container .particle:nth-child(6){animation:11s ease-in-out infinite particleFloat6}.vsl-btn[data-is-animating=true] .particles-container .particle:nth-child(7){animation:13s ease-in-out infinite particleFloat7}.vsl-btn[data-is-animating=true] .particles-container .particle:nth-child(8){animation:14s ease-in-out infinite particleFloat8}.vsl-btn[data-is-animating=true] .particles-container .particle:nth-child(9){animation:16s ease-in-out infinite particleFloat9}.vsl-btn[data-is-animating=true] .particles-container .particle:nth-child(10){animation:7s ease-in-out infinite particleFloat10}.vsl-btn[data-mode=outline] .btn-children-overlay{background-color:#0000;border-radius:6px;box-shadow:0 0 2px 5px #0000}.vsl-btn[data-mode=outline] .btn-children-wrapper{color:#0000;z-index:50;-webkit-background-clip:text;background-clip:text;background-image:linear-gradient(180deg,#9cbdff 8.85%,var(--shade-600)100%);font-size:1rem;font-weight:500;line-height:1.5rem;position:relative}.vsl-btn .hover-glow{z-index:10;filter:blur(8px);pointer-events:none;background:radial-gradient(circle,#fff 0% 70%);border-radius:50%;width:1rem;height:1rem;transition:all 50ms;position:absolute;transform:translate(-50%,-50%)}.vsl-btn[data-mode=outline] .hover-glow{background:radial-gradient(circle,var(--shade-600)0%,var(--shade-600)70%)}.vsl-btn:not(:disabled) .hover-particle{background-color:#fff;width:1.3px;height:1.3px;transition:all .3s ease-out;position:absolute}.vsl-btn[data-mode=outline]:not(:disabled) .hover-particle{background-color:var(--shade-600)}@keyframes swing{0%{--angle:0deg}to{--angle:360deg}}@keyframes particleFloat{0%{transform:translate(0)scale(1)}25%{transform:translate(3px,7px)scale(.8)}50%{transform:translate(-5px,-3px)scale(1.2)}75%{transform:translate(4px,5px)scale(.9)}to{transform:translate(0)scale(1)}}@keyframes particleFloat1{0%{opacity:.8;transform:translate(0)scale(1)}50%{opacity:.4;transform:translate(3px,7px)scale(.9)}to{opacity:.8;transform:translate(0)scale(1)}}@keyframes particleFloat2{0%{opacity:.8;transform:translate(0)scale(1)}50%{opacity:.3;transform:translate(-5px,2px)scale(1.1)}to{opacity:.8;transform:translate(0)scale(1)}}@keyframes particleFloat3{0%{opacity:.8;transform:translate(0)scale(1)}50%{opacity:.5;transform:translate(8px,-4px)scale(.8)}to{opacity:.8;transform:translate(0)scale(1)}}@keyframes particleFloat4{0%{opacity:.8;transform:translate(0)scale(1)}50%{opacity:.4;transform:translate(-2px,9px)scale(1.2)}to{opacity:.8;transform:translate(0)scale(1)}}@keyframes particleFloat5{0%{opacity:.8;transform:translate(0)scale(1)}50%{opacity:.3;transform:translate(6px,-8px)scale(.9)}to{opacity:.8;transform:translate(0)scale(1)}}@keyframes particleFloat6{0%{opacity:.8;transform:translate(0)scale(1)}50%{opacity:.5;transform:translate(-7px,3px)scale(1.1)}to{opacity:.8;transform:translate(0)scale(1)}}@keyframes particleFloat7{0%{opacity:.8;transform:translate(0)scale(1)}50%{opacity:.4;transform:translate(4px,6px)scale(.8)}to{opacity:.8;transform:translate(0)scale(1)}}@keyframes particleFloat8{0%{opacity:.8;transform:translate(0)scale(1)}50%{opacity:.3;transform:translate(-9px,-5px)scale(1.2)}to{opacity:.8;transform:translate(0)scale(1)}}@keyframes particleFloat9{0%{opacity:.8;transform:translate(0)scale(1)}50%{opacity:.5;transform:translate(7px,-3px)scale(.9)}to{opacity:.8;transform:translate(0)scale(1)}}@keyframes particleFloat10{0%{opacity:.8;transform:translate(0)scale(1)}50%{opacity:.4;transform:translate(-4px,8px)scale(1.1)}to{opacity:.8;transform:translate(0)scale(1)}}@keyframes particleBorderTrace{0%{transform:translate(-50%,-50%)rotate(0)}25%{transform:translate(50%,-50%)rotate(90deg)}50%{transform:translate(50%,50%)rotate(180deg)}75%{transform:translate(-50%,50%)rotate(270deg)}to{transform:translate(-50%,-50%)rotate(360deg)}}