localização das variaveis no arquivo.js

Queria entender pq colocando as variaveis fora da função o botão sortear só funciona uma vez.

let quantidade = document.getElementById("quantidade");
let de = document.getElementById("de");
let ate = document.getElementById("ate");
let resultado = document.getElementById("resultado");

function sortear() {
    quantidade = parseInt(quantidade.value);
    de = parseInt(de.value);
    ate = parseInt(ate.value);

    let numerosSorteados = [];
    let numero = obterNumeroAleatorio(de, ate);

    for (i = 0; i < quantidade; i++) {
        numero = obterNumeroAleatorio(de, ate);

        while (numerosSorteados.includes(numero)) {
            numero = obterNumeroAleatorio(de, ate);
        }

        numerosSorteados.push(numero);
    }

    exibirNumerosSorteados(numerosSorteados);
    ativarBotao(btnReiniciar);

    console.log(quantidade);
    console.log(de);
    console.log(ate);
}


function exibirNumerosSorteados(numeros) {
    resultado.innerHTML = `<label class="texto__paragrafo">Números sorteados: ${numeros}</label>`
}

function obterNumeroAleatorio(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
}

function ativarBotao(botao) {
    botao.classList.remove("container__botao-desabilitado");
    botao.classList.add("container__botao");
}

Como vou usar esses mesmo campos em outro na função reiniciar para limpa-los, eu resolvi deixar as variaveis q serão utilizadas de novo no escopo mais alto do arquivo. O problema é que dessa forma, os valores dos campos "quantidade", "de" e "ate" aparentemente só são armazenados uma vez. quando clico no botão de sortear, ela me retorna NãN, como observei no console.log q fiz das variaveis.