o minha aplicação não funciona. Mesmo copiando o js da aula e o html.

ncaught TypeError: Cannot read property 'querySelector' of null at principal.js:3

linha 3 - var tdAltura = paciente.querySelector(".info-altura");

Segue js

var paciente = document.querySelector("#primeiro-paciente");

var tdAltura = paciente.querySelector(".info-altura"); var tdPeso = paciente.querySelector(".info-peso"); var tdImc = paciente.querySelector(".info-imc");

var altura = tdAltura.textContent; var peso = tdPeso.textContent;

var alturaEhValida = true; var pesoEhValido = true;

if (peso <= 0 || peso > 1000) { console.log("Peso inválido!"); tdPeso.textContent = "Peso inválido!"; pesoEhValido = false;

}

if (altura <= 0 || altura >= 3) { console.log("Altura inválida!"); tdAltura.textContent = "Altura inválida!"; alturaEhValida = false; }

if (alturaEhValida && pesoEhValido) {

var imc = peso / (altura * altura);
tdImc.textContent = imc;

} else { tdImc.textContent = "Altura e/ou peso inválidos!"

}

HTML

</head>
<body>

    <header>
        <div class="container">
            <h2 class="titulo">Aparecida Nutrição</h2>
        </div>
    </header>
    <main>
        <section class="container">
            <h2>Meus pacientes</h2>
            <table>
                <thead>
                    <tr>
                        <th>Nome</th>
                        <th>Peso(kg)</th>
                        <th>Altura(m)</th>
                        <th>Gordura Corporal(%)</th>
                        <th>IMC</th>
                    </tr>
                </thead>
                <tbody id="tabela-pacientes" id="primeiro-paciente">
                    <tr class="paciente" >
                        <td class="info-nome">Paulo</td>
                        <td class="info-peso">100</td>
                        <td class="info-altura">2.00</td>
                        <td class="info-gordura">10</td>
                        <td class="info-imc">0</td>
                    </tr>

                    <tr class="paciente" >
                        <td class="info-nome">João</td>
                        <td class="info-peso">80</td>
                        <td class="info-altura">1.72</td>
                        <td class="info-gordura">40</td>
                        <td class="info-imc">0</td>
                    </tr>

                    <tr class="paciente" >
                        <td class="info-nome">Erica</td>
                        <td class="info-peso">54</td>
                        <td class="info-altura">1.64</td>
                        <td class="info-gordura">14</td>
                        <td class="info-imc">0</td>
                    </tr>

                    <tr class="paciente">
                        <td class="info-nome">Douglas</td>
                        <td class="info-peso">85</td>
                        <td class="info-altura">1.73</td>
                        <td class="info-gordura">24</td>
                        <td class="info-imc">0</td>
                    </tr>
                    <tr class="paciente" >
                        <td class="info-nome">Tatiana</td>
                        <td class="info-peso">46</td>
                        <td class="info-altura">1.55</td>
                        <td class="info-gordura">19</td>
                        <td class="info-imc">0</td>
                    </tr>
                </tbody>
            </table>

        </section>
    </main>

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

</body>