.neon-checkbox{--primary:#0fa;--primary-dark:#0c8;--primary-light:#8fd;--size:30px;width:var(--size);height:var(--size);cursor:pointer;-webkit-tap-highlight-color:transparent;position:relative}.neon-checkbox input{display:none}.neon-checkbox__frame{width:100%;height:100%;position:relative}.neon-checkbox__box{border:2px solid var(--primary-dark);background:#000c;border-radius:4px;transition:all .4s;position:absolute;inset:0}.neon-checkbox__check-container{justify-content:center;align-items:center;display:flex;position:absolute;inset:2px}.neon-checkbox__check{fill:none;width:80%;height:80%;stroke:var(--primary);stroke-width:3px;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:40;stroke-dashoffset:40px;transform-origin:50%;transition:all .4s cubic-bezier(.16,1,.3,1)}.neon-checkbox__glow{background:var(--primary);opacity:0;filter:blur(8px);border-radius:6px;transition:all .4s;position:absolute;inset:-2px;transform:scale(1.2)}.neon-checkbox__borders{border-radius:4px;position:absolute;inset:0;overflow:hidden}.neon-checkbox__borders span{background:var(--primary);opacity:0;width:40px;height:1px;transition:opacity .4s;position:absolute}.neon-checkbox__borders span:first-child{animation:2s linear infinite borderFlow1;top:0;left:-100%}.neon-checkbox__borders span:nth-child(2){width:1px;height:40px;animation:2s linear infinite borderFlow2;top:-100%;right:0}.neon-checkbox__borders span:nth-child(3){animation:2s linear infinite borderFlow3;bottom:0;right:-100%}.neon-checkbox__borders span:nth-child(4){width:1px;height:40px;animation:2s linear infinite borderFlow4;bottom:-100%;left:0}.neon-checkbox__particles span{background:var(--primary);opacity:0;pointer-events:none;width:4px;height:4px;box-shadow:0 0 6px var(--primary);border-radius:50%;position:absolute;top:50%;left:50%}.neon-checkbox__rings{pointer-events:none;position:absolute;inset:-20px}.neon-checkbox__rings .ring{border:1px solid var(--primary);opacity:0;border-radius:50%;position:absolute;inset:0;transform:scale(0)}.neon-checkbox__sparks span{background:linear-gradient(90deg,var(--primary),transparent);opacity:0;width:20px;height:1px;position:absolute}.neon-checkbox:hover .neon-checkbox__box{border-color:var(--primary);transform:scale(1.05)}.neon-checkbox input:checked~.neon-checkbox__frame .neon-checkbox__box{border-color:var(--primary);background:#00ffaa1a}.neon-checkbox input:checked~.neon-checkbox__frame .neon-checkbox__check{stroke-dashoffset:0;transform:scale(1.1)}.neon-checkbox input:checked~.neon-checkbox__frame .neon-checkbox__glow{opacity:.2}.neon-checkbox input:checked~.neon-checkbox__frame .neon-checkbox__borders span{opacity:1}.neon-checkbox input:checked~.neon-checkbox__frame .neon-checkbox__particles span{animation:.6s ease-out forwards particleExplosion}.neon-checkbox input:checked~.neon-checkbox__frame .neon-checkbox__rings .ring{animation:.6s ease-out forwards ringPulse}.neon-checkbox input:checked~.neon-checkbox__frame .neon-checkbox__sparks span{animation:.6s ease-out forwards sparkFlash}@keyframes borderFlow1{0%{transform:translate(0)}to{transform:translate(200%)}}@keyframes borderFlow2{0%{transform:translateY(0)}to{transform:translateY(200%)}}@keyframes borderFlow3{0%{transform:translate(0)}to{transform:translate(-200%)}}@keyframes borderFlow4{0%{transform:translateY(0)}to{transform:translateY(-200%)}}@keyframes particleExplosion{0%{opacity:0;transform:translate(-50%,-50%)scale(1)}20%{opacity:1}to{transform:translate(calc(-50% + var(--x,20px)),calc(-50% + var(--y,20px)))scale(0);opacity:0}}@keyframes ringPulse{0%{opacity:1;transform:scale(0)}to{opacity:0;transform:scale(2)}}@keyframes sparkFlash{0%{transform:rotate(var(--r,0deg))translateX(0)scale(1);opacity:1}to{transform:rotate(var(--r,0deg))translateX(30px)scale(0);opacity:0}}.neon-checkbox__particles span:first-child{--x:25px;--y:-25px}.neon-checkbox__particles span:nth-child(2){--x:-25px;--y:-25px}.neon-checkbox__particles span:nth-child(3){--x:25px;--y:25px}.neon-checkbox__particles span:nth-child(4){--x:-25px;--y:25px}.neon-checkbox__particles span:nth-child(5){--x:35px;--y:0px}.neon-checkbox__particles span:nth-child(6){--x:-35px;--y:0px}.neon-checkbox__particles span:nth-child(7){--x:0px;--y:35px}.neon-checkbox__particles span:nth-child(8){--x:0px;--y:-35px}.neon-checkbox__particles span:nth-child(9){--x:20px;--y:-30px}.neon-checkbox__particles span:nth-child(10){--x:-20px;--y:30px}.neon-checkbox__particles span:nth-child(11){--x:30px;--y:20px}.neon-checkbox__particles span:nth-child(12){--x:-30px;--y:-20px}.neon-checkbox__sparks span:first-child{--r:0deg;top:50%;left:50%}.neon-checkbox__sparks span:nth-child(2){--r:90deg;top:50%;left:50%}.neon-checkbox__sparks span:nth-child(3){--r:180deg;top:50%;left:50%}.neon-checkbox__sparks span:nth-child(4){--r:270deg;top:50%;left:50%}.neon-checkbox__rings .ring:first-child{animation-delay:0s}.neon-checkbox__rings .ring:nth-child(2){animation-delay:.1s}.neon-checkbox__rings .ring:nth-child(3){animation-delay:.2s}.button{--primary:#ff5569;--neutral-1:#2e2e2e;--neutral-2:#1a1a1a;--radius:14px;cursor:pointer;border-radius:var(--radius);text-shadow:0 1px 1px #0000004d;color:#fff;background:var(--neutral-1);border:none;justify-content:center;align-items:center;min-width:400px;height:58px;padding:20px;font-family:Galano Grotesque,Poppins,Montserrat,sans-serif;font-size:18px;font-style:normal;font-weight:600;transition:all .3s;display:flex;position:relative;box-shadow:0 .5px .5px 1px #0003,0 10px 20px #0003,0 4px 5px #0000000d}.button:hover{transform:scale(1.02);box-shadow:0 0 1px 2px #ffffff4d,0 15px 30px #0000004d,0 10px 3px -3px #0000000a}.button:active{transform:scale(1);box-shadow:0 0 1px 2px #ffffff4d,0 10px 3px -3px #0003}.button:after{content:"";border-radius:var(--radius);background:linear-gradient(var(--neutral-1),var(--neutral-2))padding-box,linear-gradient(to bottom,#0000001a,#00000073)border-box;z-index:0;border:2.5px solid #0000;transition:all .4s;position:absolute;inset:0}.button:hover:after{transform:scale(1.05,1.1);box-shadow:inset 0 -1px 3px #323232}.button:before{content:"";background:linear-gradient(to top,var(--neutral-1),var(--neutral-2));filter:blur(.5px);z-index:2;border-radius:30px;position:absolute;inset:7px 6px 6px}.state p{justify-content:center;align-items:center;display:flex}.state .icon{justify-content:center;align-items:center;margin:auto;transition:all .3s;display:flex;position:absolute;top:0;bottom:0;left:0;transform:scale(1.25)}.state .icon svg{overflow:visible}.outline{border-radius:inherit;z-index:1;opacity:0;transition:opacity .4s;position:absolute;inset:-2px -3.5px;overflow:hidden}.outline:before{content:"";background:conic-gradient(from 180deg,#0000 60%,#161616 80%,#0000 100%);animation:2s linear infinite paused spin;position:absolute;inset:-100%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.button:hover .outline{opacity:1}.button:hover .outline:before{animation-play-state:running}.state p span{opacity:0;animation:slideDown .8s ease forwards calc(var(--i)*30ms);display:block}.button:hover p span{opacity:1;animation:wave .5s ease forwards calc(var(--i)*20ms)}.button:focus p span{opacity:1;animation:disapear .6s ease forwards calc(var(--i)*30ms)}@keyframes wave{30%{opacity:1;transform:translateY(4px)translate(0)rotate(0)}50%{opacity:1;color:var(--primary);transform:translateY(-3px)translate(0)rotate(0)}to{opacity:1;transform:translateY(0)translate(0)rotate(0)}}@keyframes slideDown{0%{opacity:0;color:var(--primary);filter:blur(5px);transform:translateY(-20px)translate(5px)rotate(-90deg)}30%{opacity:1;filter:blur();transform:translateY(4px)translate(0)rotate(0)}50%{opacity:1;transform:translateY(-3px)translate(0)rotate(0)}to{opacity:1;transform:translateY(0)translate(0)rotate(0)}}@keyframes disapear{0%{opacity:1}to{opacity:0;color:var(--primary);filter:blur(5px);transform:translate(5px)translateY(20px)}}.state--default .icon svg{animation:.6s forwards land}.button:hover .state--default .icon{transform:rotate(45deg)scale(1.25)}.button:focus .state--default svg{animation:.8s linear forwards takeOff}.button:focus .state--default .icon{transform:rotate(0)scale(1.25)}@keyframes takeOff{0%{opacity:1}60%{opacity:1;transform:translate(70px)rotate(45deg)scale(2)}to{opacity:0;transform:translate(160px)rotate(45deg)scale(0)}}@keyframes land{0%{opacity:0;filter:blur(3px);transform:translate(-60px)translateY(30px)rotate(-50deg)scale(2)}to{opacity:1;filter:blur();transform:translate(0)translateY(0)rotate(0)}}.state--default .icon:before{content:"";background:linear-gradient(90deg,#0000,#ffffff80);width:0;height:2px;position:absolute;top:50%;left:-5px}.button:focus .state--default .icon:before{animation:.8s linear forwards contrail}@keyframes contrail{0%{opacity:1;width:0}8%{width:15px}60%{opacity:.7;width:80px}to{opacity:0;width:160px}}.state{z-index:2;padding-left:29px;display:flex;position:relative}.state--default span:nth-child(4){margin-right:5px}.state--sent{display:none}.state--sent svg{margin-right:8px;transform:scale(1.25)}.button:focus .state--default{position:absolute}.button:focus .state--sent{display:flex}.button:focus .state--sent span{opacity:0;animation:slideDown .8s ease forwards calc(var(--i)*.2s)}.button:focus .state--sent .icon svg{opacity:0;animation:1.2s .8s forwards appear}@keyframes appear{0%{opacity:0;color:var(--primary);filter:blur(4px);transform:scale(4)rotate(-40deg)}30%{opacity:1;filter:blur(1px);transform:scale(.6)}50%{opacity:1;filter:blur();transform:scale(1.2)}to{opacity:1;transform:scale(1)}}