.container{width:350px;height:350px;border-radius:100%;background:radial-gradient(circle at 60% 40%,#FFD1DC 0,#D8B7FF 30%,#B3E5FF 60%,#FFB6C1 80%,#E6CCFF 100%);position:relative;opacity:0;transform:scale(.8);animation:fadeInScale 1s ease-out forwards}.container:after{background:radial-gradient(circle at center,rgba(255,105,180,.6),rgba(138,43,226,.4),rgba(0,191,255,.3),rgba(255,20,147,.2),transparent 70%);transform:translate(-50%,-50%) scale(0);animation:liquidWave 1s ease-out forwards;z-index:1}.container:after,.container:before{content:"";position:absolute;top:50%;left:50%;width:350px;height:350px;border-radius:50%;pointer-events:none}.container:before{opacity:0;transform:translate(-50%,-50%) scale(1);box-shadow:15px 15px 5px 2px rgba(255,105,180,.8),-20px 10px 5px 2px rgba(138,43,226,.8),10px -15px 5px 2px rgba(0,191,255,.8),-15px -10px 5px 2px rgba(255,20,147,.8),25px 0 5px 2px rgba(255,182,193,.8),-25px 0 5px 2px rgba(186,85,211,.8),0 25px 5px 2px rgba(221,160,221,.8),0 -25px 5px 2px rgba(0,191,255,.8)}.container.fade-out{animation:explodeFadeOut 1.2s ease-in forwards}.container.fade-out:before{animation:particlesDisperse 1.2s ease-in forwards;opacity:1}.container.fade-out:after{animation:explodeExpand .4s ease-out forwards;opacity:.6}.loader:before{position:absolute;content:"";width:100%;height:100%;border-radius:100%;border-bottom:0 solid #ffffff05;box-shadow:inset 0 -10px 20px 20px rgba(255,105,180,.3),inset 0 -5px 15px 10px rgba(138,43,226,.4),inset 0 -2px 5px rgba(0,191,255,.4),inset 0 -3px 2px rgba(255,20,147,.5),0 2px 0 rgba(255,182,193,.9),0 2px 3px rgba(186,85,211,.6),0 5px 5px rgba(221,160,221,.7),0 5px 5px rgba(0,191,255,.4),0 10px 15px rgba(138,43,226,.5),0 10px 20px 20px rgba(255,105,180,.3);filter:blur(3px);animation:rotate 2s linear infinite;animation-delay:1s;animation-fill-mode:forwards}@keyframes liquidWave{0%{transform:translate(-50%,-50%) scale(0);opacity:.8}70%{transform:translate(-50%,-50%) scale(1.2);opacity:.4}to{transform:translate(-50%,-50%) scale(1);opacity:0}}@keyframes fadeInScale{0%{opacity:0;transform:scale(.6)}70%{opacity:1;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}@keyframes explodeFadeOut{0%{opacity:1;transform:scale(1)}30%{opacity:1;transform:scale(1.5)}to{opacity:0;transform:scale(2)}}@keyframes explodeExpand{0%{transform:translate(-50%,-50%) scale(1);opacity:.6}40%{transform:translate(-50%,-50%) scale(2.5);opacity:.3}to{transform:translate(-50%,-50%) scale(3);opacity:0}}@keyframes particlesDisperse{0%{opacity:1;box-shadow:15px 15px 5px 2px rgba(255,105,180,.8),-20px 10px 5px 2px rgba(138,43,226,.8),10px -15px 5px 2px rgba(0,191,255,.8),-15px -10px 5px 2px rgba(255,20,147,.8),25px 0 5px 2px rgba(255,182,193,.8),-25px 0 5px 2px rgba(186,85,211,.8),0 25px 5px 2px rgba(221,160,221,.8),0 -25px 5px 2px rgba(0,191,255,.8);transform:translate(-50%,-50%) scale(1)}to{opacity:0;box-shadow:60px 60px 10px 5px rgba(255,105,180,0),-80px 40px 10px 5px rgba(138,43,226,0),40px -60px 10px 5px rgba(0,191,255,0),-60px -40px 10px 5px rgba(255,20,147,0),100px 0 10px 5px rgba(255,182,193,0),-100px 0 10px 5px rgba(186,85,211,0),0 100px 10px 5px rgba(221,160,221,0),0 -100px 10px 5px rgba(0,191,255,0);transform:translate(-50%,-50%) scale(1.5)}}@keyframes rotate{to{transform:rotate(1turn)}}