Javascript-форум - Помогите оптимизировать игру в пары под стрелочные функции и в сокращении кода

Seadjus,
<!DOCTYPE html>
<html lang="ru">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://necolas.github.io/normalize.css/8.0.1/normalize.css">
    <style type="text/css">
        .container {
            display: flex;
            flex-direction: column;
            align-items: center;
            margin: 0 auto;
            max-width: 1000px;
        }

        .wrapper {
            display: flex;
            justify-content: center;
            flex-direction: column;
            align-items: center;
            padding: 50px 0 0 0;
        }

        .wrapper-cards {
            display: flex;
            flex-wrap: wrap;
            width: 50%;
            justify-content: center;
            padding: 0 0 15px 0;
            font-size: 64px;
        }

        .timer-window {
            margin: 0;
            text-align: center;
            padding: 50px 0 15px 0;
            font-size: 32px;
        }

        .card {
            width: 17%;
            height: 119px;
            margin-right: 27px;
            margin-bottom: 15px;
            border: 2px solid black;
            text-align: center;
            font-size: 106px;
            font-weight: 600;
            cursor: pointer;
            background-image: url("./avatar.svg");
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
        }

        .enter-sum {
            margin: 0;
            margin-bottom: 10px;
        }

        .enter-number {
            margin-bottom: 10px;
        }

        .open {
            background-image: none;
            background-color: blue;
            transform: scale(0.9);
        }

        .open:after {
            content: attr(data-number);
        }

        .card:hover {
            box-shadow: 0 0 5px #2f2d2d;
        }

        .card:focus {
            background-image: none;
        }

        .play {
            display: none;
        }

        .go-play {
            display: none;
        }

        .remuve-play {
            display: block;
        }

        input.enter-number:invalid {
            background-color: ivory;
            border: none;
            outline: 2px solid red;
            border-radius: 5px;
        }
    </style>
    <title>Document</title>
    <script>
        window.addEventListener('load', () => {
            let wrapper = document.querySelector('.wrapper');
            let input = document.querySelector('.enter-number');
            let button = document.querySelector('.btn-play');
            let wrapperCards = document.querySelector('.wrapper-cards');
            let goPlay = document.querySelector('.go-play');
            let rocket = document.getElementById('rocket');
            const createCards = length => {
                return Array.from({
                        length
                    }, (v, i) => Math.trunc(i / 2) + 1)
                    .sort(_ => Math.random() - 0.5)
                    .map(i => {
                        let card = document.createElement("div");
                        card.classList.add('card');
                        card.dataset.number = i;
                        return card;
                    })
            };
            let timer;
            const countdown = (num) => {
                clearTimeout(timer);
                rocket.innerHTML = 'Осталось:\n' + num + '\nсекунд'
                if (!num) win(true);
                else timer = setTimeout(countdown, 900, --num);
            }
            button.addEventListener('click', () => {
                if (!input.validity.valid) return;
                let newArr = createCards(input.value);
                wrapperCards.innerHTML = '';
                wrapperCards.append(...newArr);
                wrapper.classList.add("play");
                countdown(60);
            })
            let success;
            wrapperCards.addEventListener('click', ({
                target
            }) => {
                target = target.closest('.card');
                if (!target || target.closest('.open')) return;
                target.classList.add('open')
                if (success && success !== target) {
                    let num = success.dataset.number;
                    let cardValue = target.dataset.number;
                    if (num == cardValue) success = null;
                    else {
                        success.classList.remove('open');
                        success = target;
                    }
                } else success = target;
                win()
            })
            const win = (err) => {
                let end = wrapperCards.querySelectorAll(".card").length == wrapperCards.querySelectorAll(".open").length;
                if (err || end) {
                    wrapperCards.innerHTML = err ? 'ВРЕМЯ ВЫШЛО, ТЫ ПРОИГРАЛ :(' : '<p>Победа!</p>'
                    goPlay.classList.add("remuve-play");
                    clearTimeout(timer);
                }
            }
            goPlay.addEventListener('click', () => {
                goPlay.classList.remove('remuve-play');
                wrapper.classList.remove("play");
                wrapperCards.innerHTML = '';
                rocket.innerHTML = '';
                success = null;
            })

        })
    </script>
</head>

<body>
    <div class="container">
        <h1>Игра в пары</h1>
        <div class="wrapper" id="wrapper">
            <p class="enter-sum">Выбери колличество карт</p>
            <input class="enter-number" value="16" type="number" min="16" max="64" step="2">
            <button class="btn-play" id="button">Начать игру</button>
            <p>Время на выполнение: 60 секунд!</p>
        </div>
        <p class="timer-window" id="rocket"></p>
        <div class="wrapper-cards"></div>
        <button class="go-play"> Еще разок?</button>
    </div>
</body>

</html>