Framer Motion cannot animate rotateZ property

Question

I am using variants (Framer motion) to animate a component from initial to animate state in React, and one of the animated properties include rotateZ property, which does not animate at all. All others properties (opacity and x) animate. Can anyone tell me what's my mistake?

Variant

const variants = {
    initial: {
        opacity: 0,
        x: -50,
        rotateZ: "-60deg",
        backgroundColor: Colors.greenPrimary
    },
    animate: {
        opacity: 1,
        x: 0,
        rotateZ: "0deg",
        transition: {
            ease: easeInOutCubicBezier,
            delay: 2.8,
            duration: 1
        }
    }
}

Animation (I need this because I use animation for more animations later.)

useEffect(() => {
        animation.start("animate")
    }, [animation])

Element

<motion.div variants={variants} animate={animation} whileTap="whileTap" initial="initial" onClick={toggleMenuHandler}>
...
</motion.div>