So, I have the code below that will add a caption to the video.

video.addEventListener("loadedmetadata", () => {
        video.play();
        track = video.addTextTrack("captions", "English", "en");
        track.mode = "showing";
        track.addCue(new VTTCue(0, 100, username));
        
    });

I am rotating it to mirror the video with this css:

#video-grid > video {
    transform: rotateY(180deg);
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    height: 300px;
    width: 400px;
}

However, the caption is also getting flipped. How can I avoid it to flip the caption or how to flip it back?