

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Cheeseopardy! - Bay Blue</title>
    
<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=DM+Sans:wght@400;500;600;700&family=DM+Serif+Display:ital@0;1&display=swap" rel="stylesheet">
<link href="/css/editorial.css?v=20260914" rel="stylesheet">

    <link href="/css/editorial-games.css?v=2026091406" rel="stylesheet">
</head>
<body class="editorial-page editorial-game">
<header class="editorial-nameplate">
    <a href="/" class="editorial-brand" aria-label="Pagosa Cheesemongers home">Pagosa <span>Cheesemongers</span></a>
    <p>A journal for the cheese curious <span>Pagosa Springs, Colorado</span></p>
</header>


<main id="game-container" class="jeopardy-stage">
    <div class="jeopardy-lights" aria-hidden="true"></div>
    <header class="jeopardy-header">
        <div>
            <nav class="jeopardy-breadcrumb" aria-label="Breadcrumb"><a href="/game/">Games</a><span>/</span><a href="/jeopardy/">Choose a board</a></nav>
            <p class="jeopardy-kicker">Product board</p>
            <h1>Cheeseopardy!</h1>
            <p class="jeopardy-course">Tonight’s cheese: Bay Blue</p>
        </div>
        <div id="score-display" aria-live="polite"><span>Score</span><strong class="score">$0</strong></div>
    </header>

    <div class="jeopardy-instructions"><span>Choose any value on the board</span><span id="clues-remaining"></span></div>

    
        <div class="jeopardy-board-wrap">
            <div class="jeopardy-mobile-category-control">
                <label for="mobile-category-select">Choose a category</label>
                <select id="mobile-category-select"></select>
                <span id="mobile-category-position" aria-live="polite"></span>
            </div>
            <div id="game-board" style="--category-count: 6"></div>
        </div>
        <div id="game-complete" class="game-complete" tabindex="-1" hidden>
            <p>Board cleared</p>
            <h2>Cheeseopardy complete!</h2>
            <p>Your final score is <strong id="final-score">$0</strong>.</p>
            <div><button type="button" id="play-again">Build a new board</button><a href="/jeopardy/">Choose another topic</a></div>
        </div>
    
</main>

<div id="clue-modal" role="dialog" aria-modal="true" aria-labelledby="modal-category" aria-describedby="modal-clue">
    <div class="modal-content">
        <button type="button" class="clue-modal-close" id="close-modal" aria-label="Close clue">&times;</button>
        <p class="modal-value" id="modal-value"></p>
        <h2 id="modal-category">Category</h2>
        <p id="modal-clue">Clue</p>
        <form id="daily-double-form" class="daily-double-panel" hidden>
            <p class="daily-double-title">Daily Double</p>
            <p>Choose your wager before the clue is revealed.</p>
            <label for="wager-input">Your wager <span id="wager-limit"></span></label>
            <div class="answer-entry">
                <input type="number" id="wager-input" min="0" step="100" inputmode="numeric" required>
                <button type="submit" id="submit-wager">Reveal the clue</button>
            </div>
        </form>
        <div id="answer-form">
            <p class="response-label">Choose your response</p>
            <div id="modal-choices" class="jeopardy-answer-choices"></div>
        </div>
        <div id="answer-feedback" class="answer-feedback" hidden aria-live="polite">
            <p id="feedback-result"></p>
            <p>The accepted answer: <strong id="correct-answer"></strong></p>
            <button type="button" id="continue-game">Back to the board</button>
        </div>
    </div>
</div>


<script>
    const serializedGameData = {"categories":[{"name":"First Taste","clues":[{"choices":["California","Vermont","Oregon","Wisconsin"],"clue":"In which U.S. state is Point Reyes Bay Blue cheese produced?","answer":"California","value":100},{"choices":["It creates a distinctive mineral profile in the milk.","It prevents the need for pasteurization.","It increases the fat content of the milk.","It speeds up the cheese's aging process."],"clue":"How does the granitic soil of Point Reyes influence Bay Blue cheese?","answer":"It creates a distinctive mineral profile in the milk.","value":200},{"choices":["The cooling fog deposits salt on pastures, impacting plant and milk profiles.","The fog increases herd size, leading to higher cheese yields.","The climate eliminates the need for added salt during cheesemaking.","The fog causes the cheese to age more quickly."],"clue":"What is an effect of the Point Reyes microclimate on cheese production?","answer":"The cooling fog deposits salt on pastures, impacting plant and milk profiles.","value":300},{"choices":["Cow's milk","Goat's milk","Sheep's milk","Buffalo milk"],"clue":"What type of milk is used exclusively in Bay Blue cheese?","answer":"Cow's milk","value":400},{"choices":["It contributes to a sweeter, mellower flavor.","It produces a sharper, more piquant taste.","It causes a porcelain-white paste.","It results in a more pronounced 'goaty' aroma."],"clue":"What is the sensory impact of using cow's milk instead of sheep's milk for Bay Blue?","answer":"It contributes to a sweeter, mellower flavor.","value":500}]},{"name":"Cheese Basics","clues":[{"choices":["The milk contains more beta-carotene, producing an ivory-to-straw hue.","The milk contains less protein, making the cheese softer.","Holstein milk converts beta-carotene to vitamin A, resulting in white paste.","Holstein cows produce smaller fat globules than Jersey cows."],"clue":"Why does Bay Blue cheese have an ivory-to-straw colored paste?","answer":"The milk contains more beta-carotene, producing an ivory-to-straw hue.","value":100},{"choices":["Preventing premature lipolysis and rancidity","Decreasing the amount of fat in the cheese","Increasing the cheese's moisture content","Shortening the necessary aging period"],"clue":"What is a benefit of the farmstead designation regarding milk quality?","answer":"Preventing premature lipolysis and rancidity","value":200},{"choices":["Holstein cows","Jersey cows","Guernsey cows","Ayrshire cows"],"clue":"From which breed of cow does Bay Blue's milk exclusively come?","answer":"Holstein cows","value":300},{"choices":["Holstein milk maintains a structural integrity ideal for aging.","Holstein milk leads to greasy or leaking paste during aging.","Holstein milk is not suitable for farmstead operations.","Holstein milk produces spreadable, soft blue cheese."],"clue":"Why is Holstein milk preferred for Bay Blue over Jersey milk?","answer":"Holstein milk maintains a structural integrity ideal for aging.","value":400},{"choices":["Traditional animal rennet","Microbial rennet","Vegetable rennet","No rennet"],"clue":"What type of rennet is used to coagulate Bay Blue cheese?","answer":"Traditional animal rennet","value":500}]},{"name":"Know the Wheel","clues":[{"choices":["Animal rennet is more specific and prevents bitterness in long-aged cheese.","Animal rennet increases fat content in blue cheese.","Microbial rennet produces a drier texture.","Microbial and animal rennet have similar effects on flavor."],"clue":"Why is animal rennet preferred over microbial rennet for Bay Blue?","answer":"Animal rennet is more specific and prevents bitterness in long-aged cheese.","value":100},{"choices":["90 days","30 days","60 days","120 days"],"clue":"What is the minimum aging period for Bay Blue?","answer":"90 days","value":200},{"choices":["The cheese's texture transforms from curdy to fudgy due to proteolysis.","The cheese develops a wax rind that traps moisture.","Spoilage bacteria outcompete desirable molds.","The temperature rises to promote mold overgrowth."],"clue":"What main textural change occurs during Bay Blue's aging?","answer":"The cheese's texture transforms from curdy to fudgy due to proteolysis.","value":300},{"choices":["Piercing the cheese with needles introduces air channels.","Washing the rind with brine prevents mold growth.","Aging the cheese in a vacuum bag increases oxygen supply.","Adding more starter culture after pressing encourages veining."],"clue":"How do Point Reyes cheesemakers encourage blue vein development in Bay Blue?","answer":"Piercing the cheese with needles introduces air channels.","value":400},{"choices":["It reduces water activity, promoting desirable mold while limiting spoilage.","It increases the cheese's saltiness directly.","It softens the paste, making the cheese spreadable.","It raises the pH, inhibiting all microbial growth."],"clue":"What role does lower moisture content play in Bay Blue's preservation?","answer":"It reduces water activity, promoting desirable mold while limiting spoilage.","value":500}]},{"name":"Pairing & Practice","clues":[{"choices":["Firm / Semi-Firm","Soft","Hard","Fresh"],"clue":"How is Bay Blue classified based on moisture content?","answer":"Firm / Semi-Firm","value":100},{"choices":["The natural rind enables air exchange, contributing to unique flavors.","The rind prevents all mold growth on the surface.","Bay Blue is always sold rindless for a sharper flavor.","Vacuum packing is necessary to develop the rind."],"clue":"How does Bay Blue's natural rind impact its flavor?","answer":"The natural rind enables air exchange, contributing to unique flavors.","value":200},{"choices":["A 6-inch diameter and 3–4 inch height optimize internal and external texture.","Flat wheels encourage more even rind growth than tall ones.","Large wheels increase saltiness by surface absorption.","A narrow cylinder improves blue mold activity."],"clue":"Why does Bay Blue use the 6-inch, 6-pound wheel format?","answer":"A 6-inch diameter and 3–4 inch height optimize internal and external texture.","value":300},{"choices":["Sweet / Salted Caramel","Intensely acidic","Strongly smoky","Very bitter"],"clue":"Which is the signature flavor descriptor for Bay Blue?","answer":"Sweet / Salted Caramel","value":400},{"choices":["Earthy/mushroom notes are imparted by the natural rind's flora.","Malty flavors develop from washing the cheese in beer.","Salted caramel notes come from external coatings.","Strong acid tang is the dominant impression."],"clue":"How does Bay Blue acquire its earthy or mushroom flavor notes?","answer":"Earthy/mushroom notes are imparted by the natural rind's flora.","value":500}]},{"name":"Deeper Cut","clues":[{"choices":["Blue-green veins, fudgy and slightly crumbly texture","Very dry, hard, and chalky","Runny, spreadable, with no visible veining","Smooth, elastic, with bitter aftertaste"],"clue":"Which combination best describes Bay Blue's texture and appearance?","answer":"Blue-green veins, fudgy and slightly crumbly texture","value":100},{"choices":["Pasteurization allows controlled introduction of starter cultures.","Pasteurization increases the cheese’s shelf life by several years.","Pasteurization eliminates the need for any rennet.","Pasteurization prevents blue veining from developing."],"clue":"What is one rationale for pasteurizing the milk used in Bay Blue?","answer":"Pasteurization allows controlled introduction of starter cultures.","value":200},{"choices":["A persistent, sharp ammonia smell indicates spoilage.","A faint ammonia odor after unwrapping is always spoilage.","Mold growth on the cut face always means the cheese is rotten.","Blueming after air exposure shows the cheese is unsafe."],"clue":"Which is a true spoilage sign in Bay Blue?","answer":"A persistent, sharp ammonia smell indicates spoilage.","value":300},{"choices":["A small amount of white or blue mold on the cut face can be scraped off and is harmless.","Any mold growth indicates the cheese must be discarded.","Orange slime on Bay Blue's rind is desirable.","A completely dry, cracked interior is a sign of perfect ripeness."],"clue":"What should you do if you see white mold on a cut wedge of Bay Blue?","answer":"A small amount of white or blue mold on the cut face can be scraped off and is harmless.","value":400},{"choices":["Vintage Port","Dry Vermouth","Sparkling Rosé","Manzanilla Sherry"],"clue":"Which wine is listed as the classic pairing for Bay Blue?","answer":"Vintage Port","value":500}]},{"name":"Expert Round","clues":[{"choices":["A California Cabernet bridges tannin and sweetness with the cheese's profile.","Cabernet's high acidity clashes with blue mold.","Zinfandel is too light-bodied to pair well.","Pinot Noir is not recommended due to earthy notes."],"clue":"Why does a California Cabernet Sauvignon pair well with Bay Blue?","answer":"A California Cabernet bridges tannin and sweetness with the cheese's profile.","value":100},{"choices":["Imperial stout","Pale Lager","Wheat beer","Saison"],"clue":"Which beer style is specifically recommended to enhance the malt and fudge notes of Bay Blue?","answer":"Imperial stout","value":200},{"choices":["Barleywine pairs via malt sweetness and complexity mirroring Port.","Barleywine's bitterness enhances the cheese's sharpness.","Porters overpower the cheese with their light body.","Brown ales are avoided due to excessive acidity."],"clue":"How does barleywine function as a pairing with Bay Blue?","answer":"Barleywine pairs via malt sweetness and complexity mirroring Port.","value":300},{"choices":["Burger topping","Ice cream garnish","Soufflé stabilizer","Pickle ingredient"],"clue":"Which of the following is a suggested use for Bay Blue in cooking?","answer":"Burger topping","value":400},{"choices":["Mushroom risotto utilizes Bay Blue's earthiness for depth without meat.","Bay Blue is unsuitable for melting into sauces.","It is strictly reserved for dessert applications.","Grilled peaches overpower the cheese's flavor."],"clue":"How might Bay Blue be used to add richness to vegetarian dishes?","answer":"Mushroom risotto utilizes Bay Blue's earthiness for depth without meat.","value":500}]}]};
    const readGameValue = (record, key) => record[key] ?? record[key.toUpperCase()];
    const gameData = {
        categories: (readGameValue(serializedGameData, 'categories') || []).map(category => ({
            name: readGameValue(category, 'name'),
            clues: (readGameValue(category, 'clues') || []).map(clue => ({
                value: readGameValue(clue, 'value'),
                clue: readGameValue(clue, 'clue'),
                answer: readGameValue(clue, 'answer'),
                choices: readGameValue(clue, 'choices') || []
            }))
        }))
    };

    document.addEventListener('DOMContentLoaded', () => {
        let score = 0;
        let answeredCount = 0;
        let activeClue = null;
        let activeButton = null;
        let lastFocusedButton = null;
        let activeWager = 0;
        let isDailyDouble = false;

        const totalClues = gameData.categories.reduce((total, category) => total + category.clues.length, 0);
        const dailyDoubleCandidates = [];
        gameData.categories.forEach((category, categoryIndex) => {
            category.clues.forEach((clue, clueIndex) => {
                if (clueIndex > 0) dailyDoubleCandidates.push(`${categoryIndex}:${clueIndex}`);
            });
        });
        const dailyDoubleLocation = dailyDoubleCandidates[Math.floor(Math.random() * dailyDoubleCandidates.length)];
        const gameBoard = document.getElementById('game-board');
        const mobileCategorySelect = document.getElementById('mobile-category-select');
        const mobileCategoryPosition = document.getElementById('mobile-category-position');
        const scoreDisplay = document.querySelector('#score-display .score');
        const cluesRemaining = document.getElementById('clues-remaining');
        const clueModal = document.getElementById('clue-modal');
        const modalCategory = document.getElementById('modal-category');
        const modalValue = document.getElementById('modal-value');
        const modalClue = document.getElementById('modal-clue');
        const closeModalButton = document.getElementById('close-modal');
        const dailyDoubleForm = document.getElementById('daily-double-form');
        const wagerInput = document.getElementById('wager-input');
        const wagerLimit = document.getElementById('wager-limit');
        const answerForm = document.getElementById('answer-form');
        const modalChoices = document.getElementById('modal-choices');
        const answerFeedback = document.getElementById('answer-feedback');
        const feedbackResult = document.getElementById('feedback-result');
        const correctAnswer = document.getElementById('correct-answer');
        const continueButton = document.getElementById('continue-game');
        const gameComplete = document.getElementById('game-complete');

        function formatMoney(value) {
            return `${value < 0 ? '-' : ''}$${Math.abs(value).toLocaleString()}`;
        }

        function normalizeAnswer(value) {
            return value.toLowerCase().normalize('NFD').replace(/[\u0300-\u036f]/g, '').replace(/[^a-z0-9\s]/g, ' ').replace(/\s+/g, ' ').trim();
        }

        function answersMatch(userAnswer, acceptedAnswer) {
            const user = normalizeAnswer(userAnswer);
            const accepted = normalizeAnswer(acceptedAnswer);
            return user === accepted || (user.length >= 4 && accepted.length >= 4 && (user.includes(accepted) || accepted.includes(user)));
        }

        function updateStatus() {
            scoreDisplay.textContent = formatMoney(score);
            scoreDisplay.classList.toggle('score-negative', score < 0);
            cluesRemaining.textContent = `${totalClues - answeredCount} clues remaining`;
            gameData.categories.forEach((category, categoryIndex) => {
                const option = mobileCategorySelect.options[categoryIndex];
                const column = gameBoard.querySelector(`[data-category-column="${categoryIndex}"]`);
                if (!option || !column) return;
                const remaining = column.querySelectorAll('.clue-box:not(:disabled)').length;
                option.textContent = remaining ? `${category.name} · ${remaining} left` : `✓ ${category.name}`;
            });
        }

        function showMobileCategory(categoryIndex) {
            const boundedIndex = Math.max(0, Math.min(gameData.categories.length - 1, Number(categoryIndex) || 0));
            gameBoard.querySelectorAll('.category-column').forEach((column, columnIndex) => {
                column.classList.toggle('mobile-active', columnIndex === boundedIndex);
            });
            mobileCategorySelect.value = String(boundedIndex);
            mobileCategoryPosition.textContent = `Category ${boundedIndex + 1} of ${gameData.categories.length}`;
        }

        function showNextUnfinishedCategory(currentCategoryIndex) {
            for (let offset = 1; offset <= gameData.categories.length; offset += 1) {
                const candidateIndex = (currentCategoryIndex + offset) % gameData.categories.length;
                const candidate = gameBoard.querySelector(`[data-category-column="${candidateIndex}"] .clue-box:not(:disabled)`);
                if (candidate) {
                    showMobileCategory(candidateIndex);
                    return;
                }
            }
        }

        function buildBoard() {
            gameData.categories.forEach((category, categoryIndex) => {
                const column = document.createElement('section');
                column.className = `category-column${categoryIndex === 0 ? ' mobile-active' : ''}`;
                column.style.setProperty('--column-index', categoryIndex);
                column.dataset.categoryColumn = categoryIndex;

                const option = document.createElement('option');
                option.value = categoryIndex;
                option.textContent = category.name;
                mobileCategorySelect.appendChild(option);

                const title = document.createElement('h2');
                title.className = 'category-title';
                title.textContent = category.name;
                column.appendChild(title);

                category.clues.forEach((clue, clueIndex) => {
                    const button = document.createElement('button');
                    button.type = 'button';
                    button.className = 'clue-box';
                    button.textContent = `$${Number(clue.value).toLocaleString()}`;
                    button.dataset.categoryIndex = categoryIndex;
                    button.dataset.clueIndex = clueIndex;
                    button.setAttribute('aria-label', `${category.name} for $${Number(clue.value).toLocaleString()}`);
                    button.addEventListener('click', openClue);
                    column.appendChild(button);
                });

                gameBoard.appendChild(column);
            });
            showMobileCategory(0);
            updateStatus();
        }

        function renderChoices(choices) {
            const shuffledChoices = [...choices];
            for (let index = shuffledChoices.length - 1; index > 0; index -= 1) {
                const swapIndex = Math.floor(Math.random() * (index + 1));
                [shuffledChoices[index], shuffledChoices[swapIndex]] = [shuffledChoices[swapIndex], shuffledChoices[index]];
            }

            modalChoices.replaceChildren();
            shuffledChoices.forEach((choice, choiceIndex) => {
                const button = document.createElement('button');
                const letter = document.createElement('span');
                button.type = 'button';
                letter.setAttribute('aria-hidden', 'true');
                letter.textContent = String.fromCharCode(65 + choiceIndex);
                button.appendChild(letter);
                button.append(document.createTextNode(choice));
                button.addEventListener('click', () => submitAnswer(choice));
                modalChoices.appendChild(button);
            });
        }

        function openClue(event) {
            activeButton = event.currentTarget;
            lastFocusedButton = activeButton;
            const categoryIndex = Number(activeButton.dataset.categoryIndex);
            const clueIndex = Number(activeButton.dataset.clueIndex);
            const category = gameData.categories[categoryIndex];
            activeClue = category.clues[clueIndex];
            isDailyDouble = `${categoryIndex}:${clueIndex}` === dailyDoubleLocation;
            activeWager = Number(activeClue.value);

            modalCategory.textContent = category.name;
            modalValue.textContent = isDailyDouble ? 'Daily Double' : `$${Number(activeClue.value).toLocaleString()}`;
            modalClue.textContent = activeClue.clue;
            modalClue.hidden = isDailyDouble;
            renderChoices(activeClue.choices);
            answerForm.hidden = isDailyDouble;
            dailyDoubleForm.hidden = !isDailyDouble;
            answerFeedback.hidden = true;
            closeModalButton.hidden = isDailyDouble;
            clueModal.classList.add('visible');
            clueModal.classList.toggle('daily-double-active', isDailyDouble);
            document.body.classList.add('modal-open');
            if (isDailyDouble) {
                const maximumWager = Math.max(score, 1000);
                wagerInput.max = maximumWager;
                wagerInput.value = Math.min(Math.max(score, 0), maximumWager);
                wagerLimit.textContent = `(maximum ${formatMoney(maximumWager)})`;
                wagerInput.focus();
            } else {
                modalChoices.querySelector('button').focus();
            }
        }

        function closeModal(force = false) {
            if (isDailyDouble && answerFeedback.hidden && !force) return;
            clueModal.classList.remove('visible');
            clueModal.classList.remove('daily-double-active');
            document.body.classList.remove('modal-open');
            activeClue = null;
            activeButton = null;
            activeWager = 0;
            isDailyDouble = false;
            if (lastFocusedButton && !lastFocusedButton.disabled) {
                lastFocusedButton.focus();
            } else {
                const nextClue = gameBoard.querySelector('.clue-box:not(:disabled)');
                if (nextClue) nextClue.focus();
            }
        }

        function submitWager(event) {
            event.preventDefault();
            const maximumWager = Math.max(score, 1000);
            const wager = Number(wagerInput.value);
            if (!Number.isFinite(wager) || wager < 0 || wager > maximumWager) {
                wagerInput.setCustomValidity(`Choose a wager from $0 to ${formatMoney(maximumWager)}.`);
                wagerInput.reportValidity();
                return;
            }
            wagerInput.setCustomValidity('');
            activeWager = wager;
            dailyDoubleForm.hidden = true;
            modalClue.hidden = false;
            answerForm.hidden = false;
            modalChoices.querySelector('button').focus();
        }

        function submitAnswer(selectedAnswer) {
            const submitted = selectedAnswer.trim();
            if (!activeClue || !submitted) return;

            const acceptedAnswers = activeClue.answer.split('|').map(answer => answer.trim()).filter(Boolean);
            const isCorrect = acceptedAnswers.some(answer => answersMatch(submitted, answer));
            score += isCorrect ? activeWager : -activeWager;
            answeredCount += 1;

            activeButton.disabled = true;
            activeButton.classList.add('answered', isCorrect ? 'answered-correct' : 'answered-incorrect');
            activeButton.textContent = isCorrect ? '✓' : '—';
            answerForm.hidden = true;
            answerFeedback.hidden = false;
            closeModalButton.hidden = true;
            feedbackResult.textContent = isCorrect ? `Correct! +${formatMoney(activeWager)}` : `Not quite. −${formatMoney(activeWager)}`;
            feedbackResult.className = isCorrect ? 'feedback-correct' : 'feedback-incorrect';
            correctAnswer.textContent = acceptedAnswers[0] || activeClue.answer;
            updateStatus();
            continueButton.focus();
        }

        function continueGame() {
            const completedCategoryIndex = lastFocusedButton ? Number(lastFocusedButton.dataset.categoryIndex) : 0;
            const completedCategory = gameBoard.querySelector(`[data-category-column="${completedCategoryIndex}"]`);
            const categoryIsComplete = completedCategory && !completedCategory.querySelector('.clue-box:not(:disabled)');
            if (categoryIsComplete && answeredCount < totalClues) showNextUnfinishedCategory(completedCategoryIndex);
            closeModal(true);
            if (answeredCount === totalClues) {
                document.getElementById('final-score').textContent = formatMoney(score);
                gameComplete.hidden = false;
                const reduceMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
                gameComplete.scrollIntoView({ behavior: reduceMotion ? 'auto' : 'smooth', block: 'center' });
                gameComplete.focus({ preventScroll: true });
            }
        }

        buildBoard();
        mobileCategorySelect.addEventListener('change', event => showMobileCategory(event.target.value));
        dailyDoubleForm.addEventListener('submit', submitWager);
        continueButton.addEventListener('click', continueGame);
        closeModalButton.addEventListener('click', () => closeModal());
        document.getElementById('play-again').addEventListener('click', () => window.location.reload());
        clueModal.addEventListener('click', event => { if (event.target === clueModal && !isDailyDouble && answerFeedback.hidden) closeModal(); });
        document.addEventListener('keydown', event => {
            if (event.key === 'Escape' && clueModal.classList.contains('visible') && !isDailyDouble && answerFeedback.hidden) closeModal();
        });
    });
</script>

</body>
</html>