.button{appearance:none;cursor:pointer;opacity:0;border:0;outline:none;justify-content:center;align-items:center;width:1em;height:1em;padding:0;font-size:5vmin;animation:2s cubic-bezier(.33,.45,.3,1) 2s forwards buttonIn;display:flex;position:relative}@keyframes buttonIn{0%{opacity:0;transform:scale(1.1,1.15)}to{opacity:1;transform:none}}.button{background:0 0;border-radius:50%}.button:before,.button:after{content:"";border-radius:inherit}.button:before{filter:blur(.025em);background:radial-gradient(160% 160% at 57.5% 60%,#ffdfb800 30%,#ffdfb8c0 45%),radial-gradient(180% 200% at 40% 17.5%,#ffa33300 35%,#ffa333c0 50%),#ffbd6dc0 radial-gradient(120% 120% at 45% 45%,#ffba6600 42%,#ffa333bf 50%);position:absolute;inset:0;box-shadow:inset -.05em -.05em .025em -.025em #ffaf4dc0,.115em .15em .1em -.033em #ff9b33c0,.15em .2em .25em #ffaf4dc0,.5em .33em .5em .1em #ffaf4dc0,-.1em -.1em .05em -.075em #ffd6a3c0,-.2em -.2em .33em -.075em #ffd29cc0}.button:after{opacity:0;filter:blur(.03em);background:radial-gradient(150% 150% at 75% 75%,#ff8c0000 30%,#ff8c00c0),#ffba66c0 radial-gradient(150% 150% at -10% -10%,#ffd8a800 50%,#ffd8a8c0);transition:all .75s cubic-bezier(.33,.45,.3,1) .25s;position:absolute;inset:.025em;transform:scale(.925,.94)}.print{z-index:1;backface-visiblity:hidden;color:#33aaff80;width:40%;height:0;padding-bottom:44.488%;display:inline-block;position:relative;transform:scale(1.05)}.print svg{position:absolute;inset:0}.print path{stroke-width:4px;fill:none;stroke-linecap:round;stroke-dasharray:1;will-change:stroke-dashoffset,stroke,color,opacity;transition:all 2s cubic-bezier(.33,.45,.3,1)}.print--under{mix-blend-mode:lighten;filter:drop-shadow(0 0 .033em);stroke-dashoffset:.5px;margin-right:-40%;transition:all 2s cubic-bezier(.33,.45,.3,1);animation:2s linear 6.25s infinite printPulse}@keyframes printPulse{0%{opacity:1}50%{opacity:.33}to{opacity:1}}.print--under path{opacity:0;animation:2s cubic-bezier(.33,.45,.3,1) 3.2s forwards printIn}@keyframes printIn{0%{opacity:0;stroke-dashoffset:.5px}to{opacity:1;stroke-dashoffset:0}}.print--under path:first-of-type{stroke:#a6ceff}.print--under path:nth-of-type(2){stroke:#a6d1ff}.print--under path:nth-of-type(3){stroke:#a6d4ff}.print--under path:nth-of-type(4){stroke:#a6d7ff}.print--under path:nth-of-type(5){stroke:#a6daff}.print--over{filter:drop-shadow(-.0075em -.0075em .005em #0000331a)drop-shadow(.0075em .0075em .005em #ffffff40)drop-shadow(0 0 .04em);opacity:0;transition:transform 2s cubic-bezier(.33,.45,.3,1),color 0s .4s,opacity .5s cubic-bezier(.33,.45,.3,1)}.print--over:after{content:"";opacity:0;mix-blend-mode:color-dodge;background:radial-gradient(32.5% 32.5% at 42.5% 42.5%,#ffffff8c,#fff0);border-radius:50%;transition:opacity .3s cubic-bezier(.33,.45,.3,1);animation:3s linear infinite glowPulse,3s linear infinite glowTwist;position:absolute;inset:-40% -60%}@keyframes glowPulse{0%{transform:scale(.9)}50%{transform:scale(1)}to{transform:scale(.9)}}@keyframes glowTwist{0%{rotate:none}50%{rotate:180deg}to{rotate:360deg}}.print--over path{opacity:0;stroke-dashoffset:1px;transition:stroke .5s cubic-bezier(.33,.45,.3,1),opacity 0s .5s,stroke-dashoffset 0s .5s}.print--over path:first-of-type{stroke:#338fff}.print--over path:nth-of-type(2){stroke:#3396ff}.print--over path:nth-of-type(3){stroke:#339cff}.print--over path:nth-of-type(4){stroke:#33a3ff}.print--over path:nth-of-type(5){stroke:#3af}.button:hover.test,.button.test.test{opacity:1;font-size:60vmin;animation:none;transform:none}.button:hover:after,.button.test:after{opacity:1;transition-delay:0s;transform:none}.button:hover .print,.button.test .print{transform:scale(1)translateZ(0)}.button:hover .print--over,.button.test .print--over{color:#6f00ffa8;opacity:.66;transition:all 1.5s cubic-bezier(.33,.45,.3,1) 4.5s,opacity .25s cubic-bezier(.33,.45,.3,1),transform 2s cubic-bezier(.33,.45,.3,1)}.button:hover .print--over:after,.button.test .print--over:after{transition:opacity 2s cubic-bezier(.33,.45,.3,1) 5.25s}.button:hover .print--over path,.button.test .print--over path{opacity:1;stroke-dashoffset:0}.button:hover .print--over path:first-of-type,.button.test .print--over path:first-of-type{stroke:#2b00ff;transition:opacity .25s cubic-bezier(.33,.45,.3,1) .35s,stroke-dashoffset 4.2s cubic-bezier(.33,.45,.3,1) .35s,stroke 1.2s cubic-bezier(.33,.45,.3,1) 4.65s,color 1.2s cubic-bezier(.33,.45,.3,1) 4.65s}.button:hover .print--over path:nth-of-type(2),.button.test .print--over path:nth-of-type(2){stroke:#3c00ff;transition:opacity .25s cubic-bezier(.33,.45,.3,1) .45s,stroke-dashoffset 4.4s cubic-bezier(.33,.45,.3,1) .45s,stroke 1.4s cubic-bezier(.33,.45,.3,1) 4.55s,color 1.4s cubic-bezier(.33,.45,.3,1) 4.55s}.button:hover .print--over path:nth-of-type(3),.button.test .print--over path:nth-of-type(3){stroke:#4d00ff;transition:opacity .25s cubic-bezier(.33,.45,.3,1) .55s,stroke-dashoffset 4.6s cubic-bezier(.33,.45,.3,1) .55s,stroke 1.6s cubic-bezier(.33,.45,.3,1) 4.45s,color 1.6s cubic-bezier(.33,.45,.3,1) 4.45s}.button:hover .print--over path:nth-of-type(4),.button.test .print--over path:nth-of-type(4){stroke:#5e00ff;transition:opacity .25s cubic-bezier(.33,.45,.3,1) .65s,stroke-dashoffset 4.8s cubic-bezier(.33,.45,.3,1) .65s,stroke 1.8s cubic-bezier(.33,.45,.3,1) 4.35s,color 1.8s cubic-bezier(.33,.45,.3,1) 4.35s}.button:hover .print--over path:nth-of-type(5),.button.test .print--over path:nth-of-type(5){stroke:#6f00ff;transition:opacity .25s cubic-bezier(.33,.45,.3,1) .75s,stroke-dashoffset 5s cubic-bezier(.33,.45,.3,1) .75s,stroke 2s cubic-bezier(.33,.45,.3,1) 4.25s,color 2s cubic-bezier(.33,.45,.3,1) 4.25s}
