:root{--transition:.25s;--spark:1.8s}.galaxy-button{--hue:38;--active:0;display:inline-block;position:relative}.galaxy-button:hover,.galaxy-button:focus-within{--active:1}.galaxy-button__element{--cut:.1em;--bg:radial-gradient(120% 120% at 126% 126%, hsl(var(--hue) calc(var(--active) * 97%) 98% / calc(var(--active) * .9)) 40%, transparent 50%) calc(100px - (var(--active) * 100px)) 0 / 100% 100% no-repeat, radial-gradient(120% 120% at 120% 120%, hsl(var(--hue) calc(var(--active) * 97%) 70% / calc(var(--active) * 1)) 30%, transparent 70%) calc(100px - (var(--active) * 100px)) 0 / 100% 100% no-repeat, hsl(var(--hue) calc(var(--active) * 100%) calc(12% - (var(--active) * 8%)));background:var(--bg);cursor:pointer;white-space:nowrap;width:fit-content;height:50px;box-shadow:0 0 calc(var(--active) * 4em) calc(var(--active) * 2em) hsl(var(--hue) 97% 61% / .4), 0 .05em 0 0 hsl(var(--hue) calc(var(--active) * 97%) calc((var(--active) * 50%) + 30%)) inset, 0 -.05em 0 0 hsl(var(--hue) calc(var(--active) * 97%) calc(var(--active) * 10%)) inset;transition:box-shadow var(--transition), transform var(--transition), background var(--transition);transform:scale(calc(1 + (var(--active) * .05)));transform-style:preserve-3d;perspective:100vmin;color:#fff;-webkit-user-select:none;user-select:none;border:0;border-radius:2rem;justify-content:center;align-items:center;gap:.5em;padding:.85em 2em;font-size:clamp(.875rem,2vw,1.05rem);font-weight:600;line-height:1.2;text-decoration:none;display:inline-flex;position:relative;overflow:hidden}.galaxy-button__element:active{transform:scale(1)}.galaxy-button .star{height:calc(var(--size) * 1px);aspect-ratio:1;opacity:var(--alpha);transform:translate(-50%, -50%) rotate(10deg) rotate(0deg) translateY(calc(var(--distance) * 1px));animation:galaxy-orbit calc(var(--duration) * 1s) calc(var(--delay) * -1s) infinite linear;background:#fff;border-radius:50%;position:absolute;top:50%;left:50%}@keyframes galaxy-orbit{to{transform:translate(-50%, -50%) rotate(10deg) rotate(360deg) translateY(calc(var(--distance) * 1px))}}.galaxy-button .galaxy{aspect-ratio:1;width:100%;opacity:var(--active);transition:opacity var(--transition);pointer-events:none;position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)}.galaxy-button .galaxy__ring{width:200%;height:200%;transform-style:preserve-3d;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-28%,-40%)rotateX(-24deg)rotateY(-30deg)rotateX(90deg)}.galaxy-button .galaxy__container{opacity:var(--active);transition:opacity var(--transition);pointer-events:none;position:absolute;inset:0;-webkit-mask:radial-gradient(#fff,#0000);mask:radial-gradient(#fff,#0000)}.galaxy-button .star--static{filter:brightness(4);opacity:.9;max-height:4px;animation:none;animation:galaxy-move-x calc(var(--duration) * .1s) calc(var(--delay) * -.1s) infinite linear, galaxy-move-y calc(var(--duration) * .2s) calc(var(--delay) * -.2s) infinite linear;top:50%;left:50%;transform:translate(0)}.galaxy-button:hover .star--static{animation-play-state:paused}@keyframes galaxy-move-x{0%{transform:translate(-100px)}to{transform:translate(100px)}}@keyframes galaxy-move-y{0%{transform:translateY(-50px)}to{transform:translateY(50px)}}.galaxy-button .spark{animation:galaxy-flip calc(var(--spark) * 2) infinite steps(2, end);pointer-events:none;border-radius:2rem;position:absolute;inset:0;overflow:hidden;transform:rotate(0);-webkit-mask:linear-gradient(#fff,#0000 50%);mask:linear-gradient(#fff,#0000 50%)}@keyframes galaxy-flip{to{transform:rotate(360deg)}}.galaxy-button .spark:before{content:"";aspect-ratio:1;z-index:-1;width:200%;opacity:calc((var(--active)) + .4);background:conic-gradient(from 0deg, transparent 0 340deg, #fff 360deg);transition:opacity var(--transition);animation:galaxy-rotate var(--spark) linear infinite both;position:absolute;top:0%;left:50%;transform:translate(-50%,-15%)rotate(-90deg)}.galaxy-button .spark:after{content:"";inset:var(--cut);border-radius:2rem;position:absolute}.galaxy-button .backdrop{inset:var(--cut);background:var(--bg);transition:background var(--transition);pointer-events:none;border-radius:2rem;position:absolute}@keyframes galaxy-rotate{to{transform:translate(-50%,-15%)rotate(90deg)}}.galaxy-button .text{z-index:1;letter-spacing:.03em;color:#fff;transition:color var(--transition);align-items:center;gap:.4em;display:inline-flex;position:relative}.card-spark{--spark:1.8s;animation:galaxy-flip calc(var(--spark) * 2) infinite steps(2, end);pointer-events:none;opacity:0;z-index:0;border-radius:22px;transition:opacity .3s;position:absolute;inset:0;overflow:hidden;transform:rotate(0);-webkit-mask:linear-gradient(#fff,#0000 50%);mask:linear-gradient(#fff,#0000 50%)}.group\/card:hover .card-spark,.group\/card:focus-within .card-spark{opacity:1}.card-spark:before{content:"";aspect-ratio:1;z-index:-1;background:conic-gradient(from 0deg, transparent 0 335deg, #bc9348 350deg, #fff 360deg);width:250%;animation:galaxy-rotate var(--spark) linear infinite both;position:absolute;top:0%;left:50%;transform:translate(-50%,-15%)rotate(-90deg)}