Get the color for an animated color element

Im making an HTML game called, which is a remake of There’s a special type of color that I want to add to certain things in the game, called Radiant. I already have an animation of the color in CSS, but I don’t want to try to code the animation in JavaScript. I was thinking I could just grab the color of the element, but it just returns nothing in the console when I log it.
Repl link:
I’m not making this on replit

CSS contains a class called radiantColorBackground, and it uses two animations that take 3.14 seconds and repeats endlessly. The two animations switches between a variety of colors. One animation takes place on text, and is lighter, while the other animation takes place on the background color, and is darker.

<div id=“ingameRadiantColor” class=“radiantColorBackground”>radiant</div>
JAVASCRIPT (app.js, connected to from index.html):
let radiantColor;
let radiantStrokeColor;

// the following is run in a function every frame using requestAnimationFrame()
radiantColor = document.querySelector(“#ingameRadiantColor”).style.color
radiantStrokeColor = document.querySelector(“#ingameRadiantColor”).style.backgroundColor

I am using node.js for this project, so if there’s a module that simplified this more, then I will be fine installing it.
Note: In the css, the animation uses background and not backgroundColor. Because of this, even if radiantColor worked, radiantStrokeColor wouldn’t work. I’m aware of this, but radiantColor also failed to work on my testing.