CSS + JavaScript _ how to play animation from where it is (or undo an animation)

Question

When you play an animation (CSS), and put the animation-fill-mode"forwards", the animation plays and stops where it is - right !? Now how do you reverse that animation (play the animation from where it is (backwards). -> using OnClick event (html, CSS, J.S)
I have an example here ... see code here

https://code.sololearn.com/WZbovtoiaC83/?ref=app

When I say how do you play that animation backwards, I mean the block the animation is being done to. how do you make the block go backwards after an animation is played.

Because when I put the _animation-fill-mode:forwards, and try to make the block backwards (undo animation(reverse), the block (animation) starts from its normal position not from its different location.

Answer 1

https://code.sololearn.com/WmxBf7CUO3eM/?ref=app