[Dúvida] Uncaught TypeError: Cannot read properties of null (reading 'appendChild')

Saudações, estou seguindo o curso conforme as aulas, mesmo fazendo igual, quando vou testar me aparece esse erro. Segue adiante meu código:

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" rel="stylesheet"> 

    <ul class="lista" id="lista
    ">
        <li class="item"><strong>7</strong>Camisas</li>
        <li class="item"><strong>1</strong>Calça</li>
        <li class="item"><strong>3</strong>Casaco</li>

    </ul>
</main>
<script src="js/index.js"></script>

const form = document.getElementById("novoItem") const lista = document.getElementById("lista")

form.addEventListener("submit", (evento) => { evento.preventDefault()

criaElemento(evento.target.elements['nome'].value, evento.target.elements['quantidade'].value)

})

function criaElemento(nome, quantidade) { const novoItem = document.createElement("li") novoItem.classList.add("item")

const numeroItem = document.createElement("strong")
numeroItem.innerHTML = quantidade

novoItem.appendChild(numeroItem)
novoItem.innerHTML += nome

lista.appendChild(novoItem)

}