Problem: When you create any timeline, all the statements execute at the same time. So GSAP creates tween with target and duration, in your case duration is important but it gets calculated for all three tweens based on target element's current position. So when 3rd tween is created element is at position 0 and it goes distance of 50 pixels which is absolute value. But because it is a 'to' tween, the element goes from whatever the current position is to the target position and by the time 3rd tween plays, distance has changed but because it was created already, the duration for it was set to 0.5.
Solution: You need some way to calculate duration based on actual position, to get around that you need to use addPause method.
When you call addPause during a timeline, it will pause timeline at given position parameter.
I am passing the function that will get called when timeline pauses, parameters that we pass to move function and scope. I am passing current timeline as scope to keep things organized.
Inside the move function, you do same calculations as before but this function gets called while timeline is playing.
Because of that the tween gets created based on what is actual position of the element, so your calculation for duration is live and correct.
Once your tween/timeline completes inside the addPause function, we can resume the main timeline by using onComplete callback.
If you know all target positions then another solution would be to calculate your duration based on target value of previous tween instead of getting current position of the element. Because I think original question was for scenario where target position would change based on user interaction.