[Dúvida] Minha Solução

    <div class="grafismo"></div>
    <h1>Compre seu <span>ingresso</span></h1>
    <form action="">
        <label class="input-group">
            Escolha o tipo
            <select name="tipo-ingresso" id="tipo-ingresso">
                <option value="inferior">Cadeira inferior</option>
                <option value="superior">Cadeira superior</option>
                <option value="pista">Pista</option>
            </select>
        </label>
        <label class="input-group">Qtde.
            <input type="number" id="qtd" placeholder="00" min="1" max="10">
        </label>
        <button onclick="comprar()" type="button">Comprar</button>
    </form>
    <img class="hachuras" src="./assets/SVG/Hachuras.svg" alt="">
    <section>
        <h2>Quantidade disponível</h2>

        <ul class="lista">
            <li>Pista<span id="qtd-pista">100</span></li>
            <li>Cadeira superior<span id="qtd-superior">200</span></li>
            <li>Cadeira inferior<span id="qtd-inferior">400</span></li>
            
        </ul>
        <img src="./assets/Ingresso.svg" alt="">
    </section>
</main>

<script src="js/app.js"></script>

let qtdPista = document.getElementById('qtd-pista').innerHTML; let qtdSuperior = document.getElementById('qtd-superior').innerHTML; let qtdInferior = document.getElementById('qtd-inferior').innerHTML;

console.log(qtdPista); console.log(qtdSuperior); console.log(qtdInferior);

function comprar(){

let tipoIngresso = document.getElementById('tipo-ingresso').value;
let quantidadeEscolhida = parseInt(document.getElementById('qtd').value);

let categorias = [
    {nome: "pista", quantidade: [qtdPista]},
    {nome: "superior", quantidade: [qtdSuperior]},
    {nome: "inferior", quantidade: [qtdInferior]}
];

// Procurar pela categoria selecionada
let categoriaSelecionada = categorias.find(function(categoria) {
    return categoria.nome === tipoIngresso;
});

if (categoriaSelecionada) {
    // Subtrair a quantidade escolhida da categoria selecionada
    categoriaSelecionada.quantidade = categoriaSelecionada.quantidade.map(function(quantidade) {
        return quantidade - quantidadeEscolhida;
        
    });

     //alterar quantidade disponivel na pagina
    document.getElementById('qtd-' + tipoIngresso).innerText = categoriaSelecionada.quantidade;
    console.log("Nova quantidade da categoria", categoriaSelecionada.nome + ":", categoriaSelecionada.quantidade);

} else {
    console.log("Categoria não encontrada.");
}

//limpar campo quantidade
document.getElementById('qtd').value = '';

console.log(categorias);
console.log(tipoIngresso);
console.log(quantidadeEscolhida);
console.log(qtdPista);
console.log(qtdSuperior);
console.log(qtdInferior);

}

Oi, Henrique

Só está faltando atualizar os valores da quantidade

Fiz, também, umas pequenas alterações para te dar ideia sobre refatoração

let qtdPista; let qtdSuperior; let qtdInferior;

function atualizaQuantidades() {
  qtdPista = document.getElementById('qtd-pista').innerHTML;
  qtdSuperior = document.getElementById('qtd-superior').innerHTML;
  qtdInferior = document.getElementById('qtd-inferior').innerHTML
  console.log(qtdPista, qtdSuperior, qtdInferior);
}


function comprar() {
  atualizaQuantidades();
  let tipoIngresso = document.getElementById('tipo-ingresso').value;
  let quantidadeEscolhida = parseInt(document.getElementById('qtd').value);

  let categorias = [
    { nome: "pista", quantidade: qtdPista },
    { nome: "superior", quantidade: qtdSuperior },
    { nome: "inferior", quantidade: qtdInferior }
  ];

  // Procurar pela categoria selecionada
  let categoriaSelecionada = categorias.find( categoria => categoria.nome === tipoIngresso);

  if (!categoriaSelecionada) {
    console.log("Categoria não encontrada.");
    return; // sai da função
  }

  // Subtrair a quantidade escolhida da categoria selecionada
  categoriaSelecionada.quantidade -= quantidadeEscolhida;

  //alterar quantidade disponivel na pagina
  document.getElementById('qtd-' + tipoIngresso).innerText = categoriaSelecionada.quantidade;
  console.log("Nova quantidade da categoria", categoriaSelecionada.nome + ":", categoriaSelecionada.quantidade);
 
  //limpar campo quantidade
  document.getElementById('qtd').value = '';

  console.log(categorias);
  console.log(tipoIngresso);
  console.log(quantidadeEscolhida);
  atualizaQuantidades();
}

Muito obrigado Luis.

Pelo o que entendi eu estava atualizando o valor na página mas não estava atualizando o valor da variável.

No início do código a variável recebe o valor da página mas esse código só roda quando atualizamos a página, correto?

Correto 👍