@import url(https://fonts.googleapis.com/css2?family=Open+Sans&family=Alfa+Slab+One&family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap);:root{--animation-color:yellow}body,html{margin:0;background-color:#0b0c0d;font-family:Raleway,sans-serif;color:#2c3e50;box-sizing:border-box}*{box-sizing:border-box}#root{overflow:hidden;height:100vh;width:100%;display:flex;align-items:center;justify-content:center}.energyBall{position:absolute;left:50px;top:0;width:120px;height:120px;border-radius:50%;transform:scale(0);box-shadow:0 0 12px 12px var(--animation-color) inset,0 0 12px 12px var(--animation-color);background:radial-gradient(ellipse at center,rgba(255,113,12,0) 45%,var(--animation-color) 51.5%)}.energyBall.user{animation:chargeAnimation 2s linear forwards,moveFromUserToEnemy .5s ease-in-out 2s forwards}.energyBall.enemy{animation:chargeAnimation 2s linear forwards,moveFromEnemyToUser .5s ease-in-out 2s forwards}@keyframes moveFromEnemyToUser{0%{transform:translate(0) translateY(0)}to{transform:translate(36vh) translateY(-100px)}}@keyframes moveFromUserToEnemy{0%{transform:translate(0) translateY(0)}to{transform:translate(-36vh) translateY(100px)}}@keyframes chargeAnimation{0%{transform:translate(0) rotate(0) scale(0)}2%{transform:translate(-7px,10px) rotate(3.5deg) scale(.02)}4%{transform:translate(-5px,7px) rotate(-1.5deg) scale(.04)}6%{transform:translateY(7px) rotate(3.5deg) scale(.06)}8%{transform:translateY(-9px) rotate(-.5deg) scale(.08)}10%{transform:translate(-8px,-5px) rotate(2.5deg) scale(.1)}12%{transform:translate(-1px,4px) rotate(3.5deg) scale(.12)}14%{transform:translate(8px,4px) rotate(.5deg) scale(.14)}16%{transform:translate(-3px,8px) rotate(.5deg) scale(.16)}18%{transform:translate(10px,10px) rotate(-.5deg) scale(.18)}20%{transform:translate(-4px,10px) rotate(.5deg) scale(.2)}22%{transform:translate(6px,4px) rotate(.5deg) scale(.22)}24%{transform:translate(-9px,-7px) rotate(-.5deg) scale(.24)}26%{transform:translate(8px,3px) rotate(-1.5deg) scale(.26)}28%{transform:translate(-8px,-9px) rotate(2.5deg) scale(.28)}30%{transform:translateY(-3px) rotate(-.5deg) scale(.3)}32%{transform:translate(-3px,3px) rotate(1.5deg) scale(.32)}34%{transform:translate(8px) rotate(-1.5deg) scale(.34)}36%{transform:translate(-3px,-5px) rotate(-2.5deg) scale(.36)}38%{transform:translate(-3px,6px) rotate(-.5deg) scale(.38)}40%{transform:translate(3px,-6px) rotate(1.5deg) scale(.4)}42%{transform:translate(-6px,-4px) rotate(-1.5deg) scale(.42)}44%{transform:translate(-2px,-7px) rotate(-.5deg) scale(.44)}46%{transform:translate(9px,2px) rotate(-.5deg) scale(.46)}48%{transform:translate(6px,4px) rotate(3.5deg) scale(.48)}50%{transform:translate(7px,3px) rotate(.5deg) scale(.5)}52%{transform:translate(6px,6px) rotate(.5deg) scale(.52)}54%{transform:translate(-4px,-5px) rotate(2.5deg) scale(.54)}56%{transform:translate(-8px) rotate(2.5deg) scale(.56)}58%{transform:translate(-4px,2px) rotate(-1.5deg) scale(.58)}60%{transform:translate(-6px,4px) rotate(-.5deg) scale(.6)}62%{transform:translate(6px,8px) rotate(.5deg) scale(.62)}64%{transform:translateY(8px) rotate(-2.5deg) scale(.64)}66%{transform:translate(6px,8px) rotate(.5deg) scale(.66)}68%{transform:translate(-6px) rotate(1.5deg) scale(.68)}70%{transform:translate(1px,-5px) rotate(-.5deg) scale(.7)}72%{transform:translate(7px,-5px) rotate(1.5deg) scale(.72)}74%{transform:translate(-3px,-7px) rotate(1.5deg) scale(.74)}76%{transform:translate(-4px,-7px) rotate(2.5deg) scale(.76)}78%{transform:translate(-5px,4px) rotate(3.5deg) scale(.78)}80%{transform:translate(2px,7px) rotate(-.5deg) scale(.8)}82%{transform:translate(-6px,10px) rotate(1.5deg) scale(.82)}84%{transform:translate(-8px,-8px) rotate(1.5deg) scale(.84)}86%{transform:translate(-6px,4px) rotate(-.5deg) scale(.86)}88%{transform:translate(-9px,-7px) rotate(3.5deg) scale(.88)}90%{transform:translate(7px,8px) rotate(-.5deg) scale(.9)}92%{transform:translate(-2px,-6px) rotate(-.5deg) scale(.92)}94%{transform:translate(-2px,8px) rotate(2.5deg) scale(.94)}96%{transform:translate(-5px,6px) rotate(-1.5deg) scale(.96)}98%{transform:translate(6px,-5px) rotate(2.5deg) scale(.98)}to{transform:translate(0) rotate(0) scale(1)}}