[Dúvida] MUDANÇAS DE TEMA

Algo no meu código (que não consegui encontrar) não está funcionando, fazendo com que ao clicar nos botões para alterar a funcionalidade que quer, não é alterado nada, e deveria mudar a cor de fundo, foto etc.

código js:

const html = document.querySelector('html');
const focoBt = document.querySelector('.app__card-button--foco');
const curtoBt = document.querySelectorAll('.app__card-button--curto');
const longoBt = document.querySelectorAll('.app__card-button--longo');
const banner = document.querySelector('.app__image');


focoBt.addEventListener('click', () => {
    html.setAttribute('data-contexto', 'foco');
    banner.setAttribute('src', '/imagens/foco.png')
})

curtoBt.addEventListener('click', () => {
    html.setAttribute('data-contexto', 'descanso-curto');
    banner.setAttribute('src', '/imagens/descanso-curto.png')
})

longoBt.addEventListener('click', () => {
    html.setAttribute('data-contexto', 'descanso-longo');
})