Trying a keyboard shortcut with Vanilla JS

<div class="code-block" id="fullscreen">

            <div class="inner-grid">
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sagittis commodo porta. Pellentesque in elit porta, lacinia massa ac, scelerisque felis. Nullam turpis quam, imperdiet ut ex eget, sodales bibendum risus. Integer libero enim, commodo ac convallis a, commodo vel massa. Donec fringilla ultricies libero, non vehicula felis dictum sed. Etiam sollicitudin urna at est mattis aliquet lacinia eget turpis. Sed congue at diam id rhoncus.</p>
                <p>Nulla facilisi. Nam mollis augue eget lacus varius ornare. Donec neque felis, viverra ut bibendum eu, tristique ac neque. Integer vel odio nibh. Vestibulum felis mauris, elementum at odio eu, tristique consectetur massa. Ut vel erat vehicula est venenatis dictum. Sed risus turpis, volutpat sit amet diam interdum, aliquam auctor mauris. Integer consectetur laoreet tellus, at suscipit arcu lacinia vitae. Donec nunc mauris, faucibus eu vulputate vitae, aliquam eget felis. Vivamus eu sollicitudin turpis, eget pellentesque quam. Aenean commodo auctor nisi, condimentum ultrices mauris rutrum id. Curabitur venenatis eros sit amet tristique facilisis.</p>
                <p>Vivamus molestie dolor id sapien luctus molestie. Sed ullamcorper massa vitae urna congue rhoncus. Integer scelerisque lectus a ultrices volutpat. Aenean commodo nunc congue felis malesuada vehicula in quis ex. Nullam eu ante nec diam mattis efficitur sed eget est. Aliquam condimentum pulvinar lacus non vehicula. Sed felis mauris, convallis sed imperdiet sed, vestibulum id leo. Cras lacinia convallis massa eu iaculis. Pellentesque ornare mauris quis magna luctus dignissim. Nulla orci magna, sodales vel ex at, eleifend ultrices neque. Cras facilisis nibh nulla, non aliquam sapien tincidunt vehicula. </p>
            </div>

            <footer>
                <button id="button-fullscreen-toggle">Toggle Fullscreen</button>
                <p>Keyboard Shortcut*:
                    <kbd id="shortcut"><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>F</kbd></kbd>
                    <span id="shortcut-status" class="shortcut-text">*Be sure to click inside your browser window before trying the shortcut.</span>
                </p>
            </footer>

        </div>
        
        <script>

            // ---------        
            // Variables
            // ---------
            const fullscreen = document.querySelector("#fullscreen");
            const button = document.querySelector("#button-fullscreen-toggle");
            const shortcutDisplay = document.querySelector("#shortcut");
            const shortcutStatusMsg = document.querySelector("#shortcut-status");

            // ---------
            // Functions
            // ---------
            function logKey(e) {
                console.log(` ${e.key}`);
            }

            // Tweaked MDN example code
            function checkPageFocus() {
                let hasFocus = false;

                window.addEventListener('focus', function () {
                    hasFocus = true;
                });

                window.focus();

                if (hasFocus === true) {
                    shortcutDisplay.style.textShadow = "3px 3px gold;";
                    shortcutStatusMsg.textContent = "* Shortcut Active";
                } else {
                    shortcutStatusMsg.textContent = "*Be sure to click inside your browser window before trying the shortcut.";
                }
            }

            function toggleFullscreen() {
                if (!document.fullscreenElement) {
                    fullscreen.requestFullscreen();
                } else {
                    document.exitFullscreen();
                    }
            };


            // ---------        
            // Events
            // ---------

            document.addEventListener('keydown', (e) => {
                if (event.shiftKey && event.ctrlKey && e.key === 'F') {
                    toggleFullscreen();
                } 
            });
         
            button.addEventListener('click', () => {
                toggleFullscreen();
            });

            //Check page for focus every second.
            setInterval(checkPageFocus, 1000);

        </script>

.code-block {
                width: clamp(16em, 90vw, 60em);
                margin: 1rem auto;
                padding: 1rem;
                background-color: orange;
                border-radius: 1rem;
                font-family: Helvetica, Arial, sans-serif;
            }

            .code-block footer {
                text-align: center;
            }

            #button-fullscreen-toggle {
                border-radius: .5rem;
                background-color: lightgray;
                padding: .5rem 1rem;
                border: none;
                align-self: center;
            }

            .inner-grid p {
                line-height: 1.5;
                font-weight: 200;
            }

            #fullscreen:fullscreen, #fullscreen:-webkit-full-screen, #fullscreen:-moz-full-screen {
                background: linear-gradient(red, orange);
                width: 100%;
                height: 100%;
            }

            #fullscreen::backdrop {
                background-color: blue;
            }

            .code-block kbd {
                display: block;
                background-color: white;
                padding: .25rem;
                margin: .25rem 0 .25rem 0;
                color: #121212;
                font-weight: 600;
                border: solid 1px #333;
                border-radius: .25rem;
            }

            .code-block kbd > kbd {
                display: inline;
                margin: 0;
                border: none;
            }

            .shortcut-text {
                font-size: .75rem;
                display: block;
                margin: .25rem 0 0 0;
                max-width: 30ch;
                color: #121212;
            }

            @supports (display: grid) {

                .code-block {
                    display: grid;
                    place-items: center;
                }

                .code-block footer {
                display: grid;
                grid-template-columns: 1fr 1fr;
                padding: 1rem;
                gap: 1rem;
                }

                .inner-grid {
                display: grid;
                grid-template-columns: repeat(3, 1fr);
                gap: 1rem;
                max-width: calc(60em - 2rem);
                }

            }