JavaScript Input Field Not Being Recognized

      let words = [
        {
            word: "addition",
            hint: "The process of adding numbers"
        },
        {
            word: "meeting",
            hint: "Event in which people come together"
        },
        {
            word: "number",
            hint: "Math symbol used for counting"
        },
        {
            word: "exchange",
            hint: "The act of trading"
        },
    ]
 
    const wordText = document.querySelector(".word"),
    hintText = document.querySelector(".hint span"),
    timeText = document.querySelector(".time b"),
    inputField = document.querySelector("input"),
    refreshBtn = document.querySelector(".refresh-word"),
    checkBtn = document.querySelector(".check-word");
    
    let correctWord, timer;
    
    const initTimer = maxTime => {
        clearInterval(timer);
        timer = setInterval(() => {
            if(maxTime > 0) {
                maxTime--;
                return timeText.innerText = maxTime;
            }
            alert(`Time off! ${correctWord.toUpperCase()} was the correct word`);
            initGame();
        }, 1000);
    }
    
    const initGame = () => {
        initTimer(20);
        let randomObj = words[Math.floor(Math.random() * words.length)];
        let wordArray = randomObj.word.split("");
        for (let i = wordArray.length - 1; i > 0; i--) {
            let j = Math.floor(Math.random() * (i + 1));
            [wordArray[i], wordArray[j]] = [wordArray[j], wordArray[i]];
        }
        wordText.innerText = wordArray.join("");
        hintText.innerText = randomObj.hint;
        correctWord = randomObj.word.toLowerCase();;
        inputField.value = "";
        inputField.setAttribute("maxlength", correctWord.length);
    }
    initGame();
    
    const checkWord = () => {
        let userWord = inputField.value.toLowerCase();
        if(!userWord) return alert("Please enter the word to check!");
        if(userWord !== correctWord) return alert(`Oops! ${userWord} is not a correct word`);
        alert(`Congrats! ${correctWord.toUpperCase()} is the correct word`);
        initGame();
    }
    
    refreshBtn.addEventListener("click", initGame);
    checkBtn.addEventListener("click", checkWord);
 

<div class="Gamecontainer">
            <h2>Word Scramble</h2>
            <div class="content">
                <p class="word"></p>
                <div class="details">
                    <p class="hint">Hint: <span></span></p>
                    <p class="time">Time Left: <span><b>20</b>s</span></p>
                </div>
                <input spellcheck="false" type="text" />
                <div class="buttons">
                    <button class="refresh-word">Refresh Word</button>
                    <button class="check-word">Check Word</button>
                </div>
            </div>
        </div>