Os códigos de movimentar minha raquete não estão funcionando , por estar em vermelho, como posso fazer?

Aqui está meu código inteiro

let xBolinha = 300; let yBolinha = 200; let diametro = 22; let raio = diametro / 2;

let velocidadeYBolinha = 2; let velocidadeXBolinha = 2;

//variáveis da raquete

let xRaquete = 5; let yRaquete = 150; let raqueteComprimento = 10; let raqueteAltura = 90;

function setup() { createCanvas(600, 400); }

function draw() { background(0);

circle(xBolinha, yBolinha, diametro); xBolinha += velocidadeXBolinha; yBolinha += velocidadeYBolinha;

rect(xRaquete, yRaquete, raqueteComprimento, raqueteAltura);

if(xBolinha + raio > width || xBolinha - raio < 0){ velocidadeXBolinha *= -1 } if(yBolinha + raio > height || yBolinha - raio < 0){ velocidadeYBolinha *= -1;

if (keyIsDown(UP_ARROW)) {
    yRaquete -= 10;
}
if (keyIsDown(DOWN_ARROW)) {
    yRaquete += 10;
}

}

UP_ARROW e DOWN_ARROW estão em vermelho