@layer utilities{:where(.fx-galaxy){position:relative}}.fx-galaxy{--fx-h:202;--fx-s:90%;--fx-on:0;--fx-spark:1.8s;isolation:isolate;transform-style:preserve-3d;overflow:hidden}.fx-galaxy--action{--fx-h:26;--fx-s:80%}.fx-galaxy:is(:hover,:focus-visible,:active),.fx-galaxy--card:focus-within{--fx-on:1}.fx-galaxy.fx-btn:not(.fx-galaxy--action){box-shadow:inset 0 .5px #ffffff4d,inset 0 0 0 1px #ffffff14,0 0 0 .5px #000c,0 8px 22px -12px #000000b3}.fx-galaxy--action.fx-btn{box-shadow:inset 0 .5px #ffffff73,0 0 0 .5px #000c,0 0 0 3px #d86c1829,0 14px 30px -12px #d86c188c}.fx-galaxy__spark{z-index:-3;border-radius:inherit;animation:fx-flip calc(var(--fx-spark) * 2) infinite steps(2, end);position:absolute;inset:0;overflow:hidden;-webkit-mask:linear-gradient(#fff,#0000 50%);mask:linear-gradient(#fff,#0000 50%)}.fx-galaxy__spark:before{content:"";aspect-ratio:1;width:200%;opacity:calc(var(--fx-on) * .7 + .25);background:conic-gradient(from 0deg, transparent 0 340deg, hsl(var(--fx-h) 100% 85%) 360deg);animation:fx-rotate var(--fx-spark) linear infinite both;transition:opacity .25s;position:absolute;top:0;left:50%;transform:rotate(-90deg)}.fx-galaxy__backdrop{z-index:-2;border-radius:inherit;background:var(--fx-galaxy-bg,#0b0d16eb);position:absolute;inset:1px}.fx-galaxy--action .fx-galaxy__backdrop{background:linear-gradient(90deg, var(--color-accent-500), var(--color-accent-400))}.fx-galaxy__glow{z-index:-1;border-radius:inherit;pointer-events:none;background:radial-gradient(120% 120% at 120% 120%, hsl(var(--fx-h) var(--fx-s) 60% / .55), transparent 65%);opacity:var(--fx-on);transition:opacity .25s;position:absolute;inset:1px}.fx-galaxy__ring-wrap{aspect-ratio:1;z-index:-1;pointer-events:none;width:100%;opacity:var(--fx-on);transition:opacity .25s;position:absolute;top:50%;left:50%;overflow:hidden;translate:-50% -50%}.fx-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)}.fx-galaxy__drift{z-index:-1;pointer-events:none;opacity:var(--fx-on);transition:opacity .25s;position:absolute;inset:0;-webkit-mask:radial-gradient(#fff,#0000);mask:radial-gradient(#fff,#0000)}.fx-star{height:calc(var(--size,3) * 1px);aspect-ratio:1;background:hsl(var(--fx-h) 100% 92%);opacity:var(--alpha,.7);transform:translate(-50%, -50%) rotate(10deg) rotate(0deg) translateY(calc(var(--distance,80) * 1px));animation:fx-orbit calc(var(--duration,12) * 1s) calc(var(--delay,3) * -1s) infinite linear;border-radius:50%;position:absolute;top:50%;left:50%}.fx-star--drift{filter:brightness(3);opacity:.85;max-height:3px;animation:fx-move-x calc(var(--duration,12) * .1s) calc(var(--delay,3) * -.1s) infinite linear, fx-move-y calc(var(--duration,12) * .2s) calc(var(--delay,3) * -.2s) infinite linear;transform:none}.fx-galaxy:not(:hover):not(:focus-visible):not(:focus-within):not(:active) .fx-star{animation-play-state:paused}.fx-galaxy>:not([class^=fx-]):not(.sr-only){z-index:1;position:relative}.fx-galaxy.fx-btn{transition:transform .2s var(--motion-ease-out), box-shadow .25s ease}@media (hover:hover) and (pointer:fine){.fx-galaxy.fx-btn:hover{box-shadow:0 0 2.5em .6em hsl(var(--fx-h) 95% 55% / .28), 0 2px 8px -2px #00000080;transform:translateY(-1px)scale(1.03)}}.fx-galaxy.fx-btn:active{transform:scale(.97)}.fx-galaxy--card{--fx-galaxy-bg:#0d0f1a;--fx-spark:6s}.fx-galaxy--card .fx-galaxy__spark:before{opacity:calc(var(--fx-on) * .3 + .06);background:conic-gradient(from 0deg, transparent 0 350deg, hsl(var(--fx-h) 100% 80%) 360deg)}.fx-galaxy--card .fx-galaxy__ring-wrap{width:140%}.fx-galaxy--card:not(:hover):not(:focus-within) .fx-galaxy__spark,.fx-galaxy--card:not(:hover):not(:focus-within) .fx-galaxy__spark:before{animation-play-state:paused}@keyframes fx-orbit{to{transform:translate(-50%, -50%) rotate(10deg) rotate(360deg) translateY(calc(var(--distance,80) * 1px))}}@keyframes fx-move-x{0%{translate:-100px}to{translate:100px}}@keyframes fx-move-y{0%{transform:translateY(-50px)}to{transform:translateY(50px)}}@keyframes fx-flip{to{rotate:360deg}}@keyframes fx-rotate{to{transform:rotate(90deg)}}@media (prefers-reduced-motion:reduce){.fx-galaxy *,.fx-galaxy :before{animation:none!important}.fx-galaxy__ring-wrap,.fx-galaxy__drift{display:none}.fx-galaxy.fx-btn:hover,.fx-galaxy.fx-btn:active{transform:none}}
