.fancy-button{border-radius:18px;outline:none;cursor:pointer;font-size:20px;font-family:Arial,sans-serif;background:transparent;letter-spacing:-1px;border:0;position:relative;width:fit-content;min-width:280px;height:70px;transform:scale(.8);transform-origin:center center}.fancy-button--disabled{cursor:not-allowed;opacity:.7;filter:grayscale(1)}.fancy-button--disabled .fancy-wrap{background:linear-gradient(to bottom,#b0b0b0,gray)}.fancy-button--disabled .fancy-content{background:linear-gradient(to bottom,#a8a8a8,#787878);box-shadow:inset -2px 12px 11px -5px silver,inset 1px -3px 11px #00000040}.fancy-button--disabled .fancy-content:before{background:linear-gradient(to bottom,transparent,#787878)}.fancy-button--disabled .fancy-bg:before,.fancy-button--disabled .fancy-bg:after{background:#606060}.fancy-button--disabled .fancy-bg:before{box-shadow:-7px 6px #64646466,-14px 12px #6464644d,-21px 18px 4px #64646440}.fancy-button--disabled .fancy-char span:after{color:#e0e0e0;text-shadow:-1px 1px 2px #505050}.fancy-bg{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;filter:blur(1px)}.fancy-bg:before,.fancy-bg:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:19.8px;background:#5e2b83}.fancy-bg:before{filter:blur(5px);transition:all .3s ease;box-shadow:-7px 6px #734b9b66,-14px 12px #734b9b4d,-21px 18px 4px #734b9b40,-28px 24px 8px #734b9b26,-35px 30px 12px #734b9b1f,-42px 36px 16px #734b9b14,-56px 42px 20px #734b9b0d}.hero-fancy-button .fancy-bg:before{box-shadow:-4px 3px #734b9b40,-8px 6px #734b9b26,-12px 9px 2px #734b9b1a}.hero-fancy-button{transform:scale(.8);transform-origin:left center}.fancy-wrap{border-radius:inherit;overflow:hidden;height:100%;transform:translate(6px,-6px);padding:3px;background:linear-gradient(to bottom,#f4b1fd,#8e26e2);position:relative;transition:all .3s ease}.fancy-outline{position:absolute;overflow:hidden;top:0;right:0;bottom:0;left:0;opacity:0;outline:none;border-radius:inherit;transition:all .4s ease}.fancy-outline:before{content:"";position:absolute;top:2px;right:2px;bottom:2px;left:2px;width:120px;height:300px;margin:auto;background:linear-gradient(to right,transparent 0%,white 50%,transparent 100%);animation:fancy-spin 3s linear infinite;animation-play-state:paused}.fancy-content{pointer-events:none;display:flex;align-items:center;justify-content:center;z-index:1;position:relative;height:100%;gap:14px;border-radius:calc(18px * .85);font-weight:600;transition:all .3s ease;background:linear-gradient(to bottom,#c389f2,#8e26e2);box-shadow:inset -2px 12px 11px -5px #d190ff,inset 1px -3px 11px #00000059}.fancy-content:before{content:"";right:0;left:0;position:absolute;z-index:10;width:80%;top:45%;bottom:35%;opacity:.7;margin:auto;background:linear-gradient(to bottom,transparent,#8e26e2);filter:brightness(1.3) blur(5px)}.fancy-char{transition:all .3s ease;display:flex;align-items:center;justify-content:center}.fancy-char span{display:block;color:transparent;position:relative}.fancy-char.fancy-state-1 span{animation:fancy-charAppear 1.2s ease backwards calc(var(--i) * .03s)}.fancy-char.fancy-state-1 span:before,.fancy-char span:after{content:attr(data-label);position:absolute;color:#ffe7ff;text-shadow:-1px 1px 2px #5e2b83;left:0}.fancy-char span:before{opacity:0;transform:translateY(-100%)}.fancy-char.fancy-state-2{position:absolute;left:50%;transform:translate(-50%)}.fancy-char.fancy-state-2 span:after{opacity:1}.fancy-icon{animation:fancy-resetArrow .8s cubic-bezier(.7,-.5,.3,1.2) forwards;z-index:10}.fancy-icon div,.fancy-icon div:before,.fancy-icon div:after{height:3px;border-radius:1px;background-color:#ffe7ff}.fancy-icon div:before,.fancy-icon div:after{content:"";position:absolute;right:0;transform-origin:center right;width:12px;border-radius:15px;transition:all .3s ease}.fancy-icon div{position:relative;width:20px;box-shadow:-2px 2px 5px #8e26e2;transform:scale(.9);background:linear-gradient(to bottom,#ffe7ff,#f4b1fd);animation:fancy-swingArrow 1s ease-in-out infinite;animation-play-state:paused}.fancy-icon div:before{transform:rotate(44deg);top:1px;box-shadow:1px -2px 3px -1px #8e26e2;animation:fancy-rotateArrowLine 1s linear infinite;animation-play-state:paused}.fancy-icon div:after{bottom:1px;transform:rotate(316deg);box-shadow:-2px 2px 3px #8e26e2;background:linear-gradient(200deg,#ffe7ff,#f4b1fd);animation:fancy-rotateArrowLine2 1s linear infinite;animation-play-state:paused}.fancy-button:hover .fancy-char.fancy-state-1 span:before{animation:fancy-charAppear .7s ease calc(var(--i) * .03s)}.fancy-button:hover .fancy-char.fancy-state-1 span:after{opacity:1;animation:fancy-charDisappear .7s ease calc(var(--i) * .03s)}.fancy-button:hover .fancy-wrap{transform:translate(8px,-8px)}.fancy-button:hover .fancy-outline{opacity:1}.fancy-button:hover .fancy-outline:before,.fancy-button:hover .fancy-icon div:before,.fancy-button:hover .fancy-icon div:after,.fancy-button:hover .fancy-icon div{animation-play-state:running}.fancy-button:active .fancy-bg:before{filter:blur(5px);opacity:.7;box-shadow:-7px 6px #734b9b66,-14px 12px #734b9b40,-21px 18px 4px #734b9b26}.fancy-button:active .fancy-content{box-shadow:inset -1px 12px 8px -5px #47008966,inset 0 -3px 8px #d190ff}.fancy-button:active .fancy-outline{opacity:0}.fancy-button:active .fancy-wrap{transform:translate(3px,-3px)}.fancy-button:focus .fancy-icon{animation:fancy-arrow 1s cubic-bezier(.7,-.5,.3,1.5) forwards}.fancy-char.fancy-state-2 span:after,.fancy-button:focus .fancy-char.fancy-state-1 span{animation:fancy-charDisappear .5s ease forwards calc(var(--i) * .03s)}.fancy-button:focus .fancy-char.fancy-state-2 span:after{animation:fancy-charAppear 1s ease backwards calc(var(--i) * .03s)}@keyframes fancy-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fancy-charAppear{0%{transform:translateY(50%);opacity:0;filter:blur(20px)}20%{transform:translateY(70%);opacity:1}50%{transform:translateY(-15%);opacity:1;filter:blur(0)}to{transform:translateY(0);opacity:1}}@keyframes fancy-charDisappear{0%{transform:translateY(0);opacity:1}to{transform:translateY(-70%);opacity:0;filter:blur(3px)}}@keyframes fancy-arrow{0%{opacity:1}50%{transform:translate(60px);opacity:0}51%{transform:translate(-200px);opacity:0}to{transform:translate(-128px);opacity:1}}@keyframes fancy-swingArrow{50%{transform:translate(5px) scale(.9)}}@keyframes fancy-rotateArrowLine{50%{transform:rotate(30deg)}80%{transform:rotate(55deg)}}@keyframes fancy-rotateArrowLine2{50%{transform:rotate(330deg)}80%{transform:rotate(300deg)}}@keyframes fancy-resetArrow{0%{transform:translate(-128px)}to{transform:translate(0)}}