.drone-btn svg{fill:none;stroke-linejoin:round;overflow:visible}.drone-btn{background:var(--accent-1);cursor:pointer;border:1px solid #ffffff1a;border-radius:16px;width:300px;height:64px;padding-left:70px;padding-right:15px;transition:background-color 1s;position:relative;box-shadow:0 0 20px #8b5cf64d}.drone-btn:before,.drone-btn:after{content:"";transform-origin:0 100%;width:14%;height:6px;position:absolute;bottom:100%;left:5%;transform:scaleX(0);background:#fff3!important}.drone-btn:after{width:66%;left:19%}.drone-btn.s--processing{background-color:var(--success);transition-delay:4.6s;box-shadow:0 0 20px #10b9814d}.drone-btn.s--processing:before,.drone-btn.s--processing:after{transform:scaleX(1);background-color:#fff6!important}.drone-btn.s--processing:before{transition:transform .6s 1.4s,background-color 1s 4.6s}.drone-btn.s--processing:after{transition:transform 2.4s 2.4s,background-color 1s 4.6s}.drone-btn.s--reverting{background-color:var(--accent-1);transition:background-color .5s .96s}.drone-btn.s--reverting:before,.drone-btn.s--reverting:after{opacity:0}.drone-btn__revert-line{background:var(--success);transform-origin:0;opacity:0;width:80%;height:6px;position:absolute;bottom:100%;left:5%}.drone-btn.s--reverting .drone-btn__revert-line{opacity:1;transition:transform .864s;transform:scaleX(0)}.drone-btn__drone-cont{width:100%;height:100%;position:absolute;top:0;left:0}.drone-btn__drone-cont--takeoff{z-index:-1;opacity:0}.drone-btn.s--processing .drone-btn__drone-cont--takeoff{opacity:1;transition:transform .8s 1.2s,opacity .2s 1.2s;transform:translateY(-70px)}.drone-btn.s--processing .drone-btn__drone-cont--shift-x{transition:transform 2.6s 2.4s;transform:translate(213px)}.drone-btn.s--processing .drone-btn__drone-cont--landing{transition:transform .3s 5s;transform:translateY(24px)}.drone-btn__drone{stroke:#fff;stroke-width:2px;fill:none;width:68px;height:56px;position:absolute;top:-12px;left:16px}@keyframes tiltAnim{8%,24%{transform:rotate(0)}35%,70%{transform:rotate(8deg)}85%{transform:rotate(-4deg)}95%,to{transform:rotate(0)}}.drone-btn.s--processing .drone-btn__drone{transform-origin:50% 100%;animation:3.8s 1.2s tiltAnim}.drone-btn.s--processing .drone-btn__drone-leaving{opacity:0;transition:transform 1.1s 5.5s,opacity .55s 6.05s;transform:translate(150px,-150px)rotate(20deg)scale(.3)}.drone-btn__drone-arm{--rotation:0deg;transform-origin:68px 56px;transform:rotate(var(--rotation))}.drone-btn__drone-arm--2{transform:scaleX(-1) rotate(var(--rotation))}.drone-btn.s--processing .drone-btn__drone-arm{--rotation:25deg;transition:transform .3s 5.2s}.drone-btn__drone-green{fill:var(--accent-1)}.drone-btn.s--processing .drone-btn__drone-green{fill:var(--success);transition:fill 1s 4.6s}.drone-btn__drone-yellow{fill:var(--accent-2)}.drone-btn__drone-package{stroke-width:4px}@keyframes revertAnim{40%,45%{transform:translate(-426px)}75%{transform:translate(-426px,-100px)}to{transform:translate(-426px,100px)}}.drone-btn.s--reverting .drone-btn__drone-package{opacity:0;transition:opacity 0s 2s;animation:2s forwards revertAnim}.drone-btn__circle{border-radius:50%;width:40px;height:40px;margin-top:-20px;position:absolute;top:50%;left:30px;box-shadow:inset 0 2px 4px #00000026;background:#fff3!important}.drone-btn.s--processing .drone-btn__circle{transition:background-color 1s 4.6s;background:var(--success)!important}.drone-btn.s--reverting .drone-btn__circle{transition:background-color .5s .96s;background:#fff3!important}.drone-btn__circle-inner{border-radius:inherit;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0;overflow:hidden}.drone-btn__circle-package{stroke:#fff;stroke-width:3px;stroke-linecap:round;width:14px;height:18px}.drone-btn.s--processing .drone-btn__circle-package{transition:transform .8s 1.2s;transform:translateY(-70px)}@keyframes cupDropJelly{0%{transform:translateY(-70px)scale(1)}50%{transform:translateY(0)scale(1)}65%{transform:translateY(0)scale(1.15,.85)}80%{transform:translateY(0)scale(.95,1.05)}to{transform:translateY(0)scale(1)}}.drone-btn.s--reverting .drone-btn__circle-package{animation:.5s 1.6s forwards cupDropJelly}.drone-btn__circle-grabbers{--grabY:0px;--grabRotate:0;width:100%;height:100%;position:absolute;top:0;left:0}.drone-btn__circle-grabbers:before,.drone-btn__circle-grabbers:after{content:"";width:14px;height:8px;transform:translateY(var(--grabY)) rotate(var(--grabRotate));border-top:2px solid #fff;border-bottom:none;border-left:none;border-right:2px solid #fff;transition:transform .8s;position:absolute;top:-12px;right:5px}.drone-btn__circle-grabbers:before{transform:translateY(var(--grabY)) scaleX(-1) rotate(var(--grabRotate));left:5px;right:auto}@keyframes grabAnim{40%,59.999%{--grabY:15px;--grabRotate:55deg}60%,to{--grabY:-55px;--grabRotate:55deg}}.drone-btn.s--processing .drone-btn__circle-grabbers{animation:2s forwards grabAnim}.drone-btn__circle-progress{stroke:#fff;stroke-width:2px;width:100%;height:100%;position:absolute;top:0;left:0}.drone-btn__circle-progress-line{stroke-dasharray:125.68 125.68;stroke-dashoffset:125.68px}.drone-btn.s--processing .drone-btn__circle-progress-line{stroke-dashoffset:0;transition:all .5s 4.9s}.drone-btn.s--reverting .drone-btn__circle-progress-line{stroke-dashoffset:125.68px;transition:all .5s .96s}.drone-btn__circle-progress-checkmark{stroke-dasharray:21.21 21.21;stroke-dashoffset:21.21px}.drone-btn.s--processing .drone-btn__circle-progress-checkmark{stroke-dashoffset:0;transition:all .5s 4.9s}.drone-btn.s--reverting .drone-btn__circle-progress-checkmark{stroke-dashoffset:21.21px;transition:all .5s .96s}.drone-btn__text-fields{color:#fff;letter-spacing:1px;width:100%;height:100%;font-size:20px;font-weight:500;position:relative}.drone-btn__text{opacity:0;will-change:opacity, transform;pointer-events:none;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0;transform:translateY(20px)}@keyframes textAnimation{20%,80%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-20px)}}.drone-btn__text--step-0{opacity:1;transform:translateY(0)}.drone-btn.s--processing .drone-btn__text{transition:all .4s}.drone-btn.s--processing .drone-btn__text--step-0{opacity:0;transform:translateY(-20px)}.drone-btn.s--processing .drone-btn__text--step-1{animation:2s textAnimation}.drone-btn.s--processing .drone-btn__text--step-2{animation:2s 1.6s text-animation}.drone-btn.s--processing .drone-btn__text--step-3{animation:2s 3.2s textAnimation}.drone-btn.s--processing .drone-btn__text--step-4{opacity:1;transition-delay:4.8s;transform:translateY(0)}.drone-btn.s--reverting .drone-btn__text--step-0{opacity:1;transition:all .4s 1s;transform:translateY(0)}.drone-btn.s--reverting .drone-btn__text--step-4{opacity:0;transition:all .4s .8s;transform:translateY(20px)}.drone-btn__text-dots{letter-spacing:-.5px;font-size:26px}@keyframes dotAnimation{10%,90%{opacity:0}40%,60%{opacity:1}}.drone-btn__text-dots span{opacity:0;animation:1.2s .4s infinite dotAnimation}.drone-btn__text-dots:before,.drone-btn__text-dots:after{content:".";opacity:0}.drone-btn__text-dots:before{animation:1.2s infinite dotAnimation}.drone-btn__text-dots:after{animation:1.2s .8s infinite dotAnimation}@keyframes buttonJelly{0%{transform:scale(1)}30%{transform:scale(1.02,.95)}40%{transform:scale(.98,1.02)}50%{transform:scale(1.01,.98)}65%{transform:scale(.99,1.01)}75%{transform:scale(1.005,.995)}to{transform:scale(1)}}.btn-jelly{animation:.6s buttonJelly}
.draft-btn{-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);color:#fff;cursor:pointer;transform-style:preserve-3d;background-color:#0000004d;border:1px solid #ffffff1a;border-radius:12px;outline:none;justify-content:center;align-items:center;padding:10px 24px;font-size:14px;font-weight:500;transition:transform .3s ease-in-out,background-color .3s ease-in-out,border-color .3s ease-in-out;display:flex;position:relative}.draft-btn:hover{background-color:#ffffff1a}.draft-btn-text{z-index:5;transition:opacity .15s ease-in-out;position:relative}.draft-btn:before{content:"SAVED";z-index:10;color:#fff;letter-spacing:2px;opacity:0;justify-content:center;align-items:center;width:100%;height:100%;font-weight:700;transition:none;display:flex;position:absolute;transform:rotateX(180deg)}.draft-btn:after{content:"";opacity:0;z-index:0;background-color:#8b5cf680;border-radius:12px;width:20%;height:100%;transition:width 10ms ease-in-out .6s,opacity .25s ease-in .3s;position:absolute;top:0;left:0;overflow:hidden}.draft-btn.is-active{background-color:#00000080;border-color:#53e2c280;transform:rotateX(180deg)}.draft-btn.is-active .draft-btn-text{opacity:0}.draft-btn.is-active:after{opacity:1;background-color:#53e2c24d;width:100%;transition:width 1s ease-in-out .5s,background-color .3s ease-in .3s,opacity .25s ease-in .3s}.draft-btn.is-active:before{opacity:1;transition:opacity .25s ease-in 1.5s}