Tengo un svg de "cookie" con una clase de "cookie", quiero que la cookie comience desde el origen y se mueva a -20 y luego se mueva a 0 y se mueva a 20 y se mueva a 0, y quiero que lo haga es un tiempo infinito, aparentemente estoy usando GSAP para hacerlo usando la línea de tiempo, pero no puedo entender cómo hacerlo

 tl.fromTo(".cookie", { y: 0 }, { y: 20 }); tl.fromTo(".cookie", { y: 20 }, { y: -20 }); tl.fromTo(".cookie", { y: -20 }, { y: 0 });

este código hace el trabajo pero solo por una vez, pero quiero hacerlo por tiempo infinito, ¡así que por favor ayuda!