<img class="bg__img img" src="./assets/BG.webp" alt="">
    <div class="wrapper">
        <div class="logo">
            <img class="logo__img img" src="./assets/logo.png" alt="logo">
        </div>
        <div class="counter__wrapper">
            <img class="counter__gold img" src="./assets/gold.png" alt="gold">
            <p class="counter">0</p>
        </div>
        <div class="shkala">
            <div class="text__wrapper">
                <p class="shkala__text">Тапай по казино щоб
                    <span style="color:#FFE600;">покращити його</span>
                </p>
            </div>
            <div class="shkala__container">
                <div class="shkala__wrapper">
                    <div class="scale">
                        <div class="inside__scale">
                            <svg class="progress-svg" width="341" height="22" viewBox="0 0 341 12" fill="none"
                                xmlns="http://www.w3.org/2000/svg">
                                <path opacity="0.3" fill-rule="evenodd" clip-rule="evenodd"
                                    d="M18.2843 -10L21.8198 -6.46447L-6.46447 21.8198L-10 18.2843L18.2843 -10ZM37.2843 -10L40.8198 -6.46447L12.5355 21.8198L9 18.2843L37.2843 -10ZM59.8198 -6.46447L56.2843 -10L28 18.2843L31.5355 21.8198L59.8198 -6.46447ZM75.2843 -10L78.8198 -6.46447L50.5355 21.8198L47 18.2843L75.2843 -10ZM97.8198 -6.46447L94.2843 -10L66 18.2843L69.5355 21.8198L97.8198 -6.46447ZM113.284 -10L116.82 -6.46447L88.5355 21.8198L85 18.2843L113.284 -10ZM135.82 -6.46447L132.284 -10L104 18.2843L107.536 21.8198L135.82 -6.46447ZM151.284 -10L154.82 -6.46447L126.536 21.8198L123 18.2843L151.284 -10ZM173.82 -6.46447L170.284 -10L142 18.2843L145.536 21.8198L173.82 -6.46447ZM189.284 -10L192.82 -6.46447L164.536 21.8198L161 18.2843L189.284 -10ZM211.82 -6.46447L208.284 -10L180 18.2843L183.536 21.8198L211.82 -6.46447ZM227.284 -10L230.82 -6.46447L202.536 21.8198L199 18.2843L227.284 -10ZM249.82 -6.46447L246.284 -10L218 18.2843L221.536 21.8198L249.82 -6.46447ZM265.284 -10L268.82 -6.46447L240.536 21.8198L237 18.2843L265.284 -10ZM287.82 -6.46447L284.284 -10L256 18.2843L259.536 21.8198L287.82 -6.46447ZM303.284 -10L306.82 -6.46447L278.536 21.8198L275 18.2843L303.284 -10ZM325.82 -6.46447L322.284 -10L294 18.2843L297.536 21.8198L325.82 -6.46447ZM341.284 -10L344.82 -6.46447L316.536 21.8198L313 18.2843L341.284 -10ZM363.82 -6.46447L360.284 -10L332 18.2843L335.536 21.8198L363.82 -6.46447Z"
                                    fill="#FFEAB2" />
                            </svg>
                        </div>
                    </div>
                    <img class="mini__gold" src="./assets/mini_gold.png" alt="mini_gold">
                </div>
            </div>
            <div class="hand">
                <img class="hand__img img" src="./assets/hand.png" alt="hand">
                <p class="hand__text">1 монета / тап</p>
            </div>
        </div>
        <div class="lottie" id="lottie-container"
            style="position: absolute; top: 0; left: 0;z-index: 100; pointer-events: none;"></div>
        <div class="stone" id="clickableDiv">
            <img class="combo" src="./assets/Combo.webp" alt="Combo">
            <div class="stone__img__container">
                <img class="stone__img img" src="./assets/Stone1.webp" alt="Stone">
                <!-- <img class="stone__img img" src="./assets/bookAnim.gif" id="video"
                    style="display: none; scale: 2;"></img> -->
                <div class="light"></div>
                <img class="finger-hand img" src="./assets/finger-hand.png" alt="finger">
            </div>
            <div class="lottie2" id="lottie-container2"></div>
            <div class="lottie3" id="lottie-container3"></div>
        </div>
        <div class="bottom">
            <img class="bottom__img img" src="./assets/bottom.webp" alt="">
        </div>
        <!-- <div class="prepopup" id="prepopup">
            <div class="popup-content__wrapper">
                <div class="popup-content" id="popup">
                    <div class="counter__wrapper2">
                        <img class="counter__gold2 img" src="./assets/gold.png" alt="gold">
                        <p class="counter3">0</p>
                    </div>
                    <img class="box close__popup" src="./assets/box.png" alt="box with gold">
                    <img class="box__open " src="./assets/box_open.png" alt="open box with gold"> -->
        <!-- <div class="roll__open open__popup carousel-container">
                        <div class="carousel">
                            <img src="./assets/drop/pink.png" alt="Image 2">
                            <img src="./assets/drop/red.png" alt="Image 3">
                            <img src="./assets/drop/blue.png" alt="Image 1">
                            <img src="./assets/drop/pink.png" alt="Image 2">
                            <img src="./assets/drop/red.png" alt="Image 3">
                            <img src="./assets/drop/purple.png" alt="100 FS Chest">
                            <img src="./assets/drop/blue.png" alt="Image 1">
                            <img src="./assets/drop/red.png" alt="Image 3">
                            <img src="./assets/drop/purple.png" alt="100 FS Chest">
                            <img src="./assets/drop/red.png" alt="Image 3">
                            <img src="./assets/drop/pink.png" alt="Image 2">
                            <img src="./assets/drop/purple.png" alt="100 FS Chest">
                            <img src="./assets/drop/pink.png" alt="Image 2">
                            <img src="./assets/drop/red.png" alt="Image 3">
                            <img src="./assets/drop/pink.png" alt="Image 2">
                            <img src="./assets/drop/yellow.png" alt="Image 4">
                            <img src="./assets/drop/red.png" alt="Image 3">
                            <img src="./assets/drop/purple.png" alt="100 FS Chest">
                            <img src="./assets/drop/red.png" alt="Image 3">
                            <img src="./assets/drop/pink.png" alt="Image 2">
                            <img src="./assets/drop/purple.png" alt="100 FS Chest">
                            <img src="./assets/drop/blue.png" alt="Image 1">
                            <img src="./assets/drop/red.png" alt="Image 3">
                            <img src="./assets/drop/purple.png" alt="100 FS Chest">


                            <img src="./assets/drop/purple.png" alt="100 FS Chest">
                            <img src="./assets/drop/red.png" alt="100 FS Chest">
                            <img src="./assets/drop/blue.png" alt="100 FS Chest">
                            <img src="./assets/drop/pink.png" alt="100 FS Chest">
                            <img src="./assets/drop/purple.png" alt="100 FS Chest">
                            <img src="./assets/drop/red.png" alt="100 FS Chest">
                            <img src="./assets/drop/blue.png" alt="100 FS Chest">
                            <img src="./assets/drop/pink.png" alt="100 FS Chest">
                            <img src="./assets/drop/purple.png" alt="100 FS Chest">
                            <img src="./assets/drop/red.png" alt="100 FS Chest">
                            <img src="./assets/drop/blue.png" alt="100 FS Chest">
                            <img src="./assets/drop/pink.png" alt="100 FS Chest">
                            <img src="./assets/drop/purple.png" alt="100 FS Chest">
                            <img src="./assets/drop/red.png" alt="100 FS Chest">
                            <img src="./assets/drop/blue.png" alt="100 FS Chest">
                            <img src="./assets/drop/yellow.png" alt="100 FS Chest">
                            <img src="./assets/drop/purple.png" alt="100 FS Chest">
                            <img src="./assets/drop/red.png" alt="100 FS Chest">
                            <img src="./assets/drop/blue.png" alt="100 FS Chest">
                        </div>
                    </div> -->
        <!-- <p class="popup__text1 close__popup">Вам випала</p>
                    <p class="popup__text2 close__popup">Скриня</p>
                    <p class="popup__text3 close__popup">Відкрити ?</p>
                    <button class="popup__button close__popup">
                        <img class="img__btn img" src="./assets/gold.png" alt="gold">
                        <span class="counter2">25</span>
                    </button>
                </div>
            </div>
        </div> -->
        <div class="backdrop" id="prepopup" style="display: none;">
            <div class="modal__book">
                <div class="modal__wrapper">
                    <img src="./assets/book.webp" alt="book">
                </div>
            </div>
        </div>
        <div class="modal__thumb" style="display: none;" id="modalThumb">
            <div class="modal__counter--wrapper">
                <img class="counter__gold2 img" src="./assets/gold.png" alt="gold">
                <p class="counter3" style="color: #81200B">0</p>
            </div>
            <p class="modal__text--try">Випробуй удачу</p>
            <div class="modal__text--counter">1 спроба - <img class="counter__gold2 img"
                    style="width: 18px; height: 18px;" src="./assets/gold.png" alt="gold">18</div>
            <img src="./assets/topIero.png" alt="ierogliph" style="margin-top: 30px;">
            <!-- <div class="modal__space">
            </div> -->
            <div class="roll__open open__popup carousel-container">
                <div class="blur"></div>
                <div class="carousel">
                    <div style="width: 100px; height: 100px; margin-right: 322px;"></div>
                    <img src="./assets/drop/pink.webp" alt="Image 2">
                    <img src="./assets/drop/red.webp" alt="Image 3">
                    <img src="./assets/drop/blue.webp" alt="Image 1">
                    <img src="./assets/drop/pink.webp" alt="Image 2">
                    <img src="./assets/drop/red.webp" alt="Image 3">
                    <img src="./assets/drop/purple.webp" alt="100 FS Chest">
                    <img src="./assets/drop/blue.webp" alt="Image 1">
                    <img src="./assets/drop/red.webp" alt="Image 3">
                    <img src="./assets/drop/purple.webp" alt="100 FS Chest">
                    <img src="./assets/drop/red.webp" alt="Image 3">
                    <img src="./assets/drop/pink.webp" alt="Image 2">
                    <img src="./assets/drop/purple.webp" alt="100 FS Chest">
                    <img src="./assets/drop/pink.webp" alt="Image 2">
                    <img src="./assets/drop/red.webp" alt="Image 3">
                    <img src="./assets/drop/pink.webp" alt="Image 2">
                    <img src="./assets/drop/yellow.webp" alt="Image 4">
                    <img src="./assets/drop/red.webp" alt="Image 3">
                    <img src="./assets/drop/purple.webp" alt="100 FS Chest">
                    <img src="./assets/drop/red.webp" alt="Image 3">
                    <img src="./assets/drop/pink.webp" alt="Image 2">
                    <img src="./assets/drop/purple.webp" alt="100 FS Chest">
                    <img src="./assets/drop/blue.webp" alt="Image 1">
                    <img src="./assets/drop/red.webp" alt="Image 3">
                    <img src="./assets/drop/purple.webp" alt="100 FS Chest">
                    <img src="./assets/drop/purple.webp" alt="100 FS Chest">
                    <img src="./assets/drop/red.webp" alt="100 FS Chest">
                    <img src="./assets/drop/blue.webp" alt="100 FS Chest">
                    <img src="./assets/drop/pink.webp" alt="100 FS Chest">
                    <img src="./assets/drop/purple.webp" alt="100 FS Chest">
                    <img src="./assets/drop/red.webp" alt="100 FS Chest">
                    <img src="./assets/drop/blue.webp" alt="100 FS Chest">
                    <img src="./assets/drop/pink.webp" alt="100 FS Chest">
                    <img src="./assets/drop/purple.webp" alt="100 FS Chest">
                    <img src="./assets/drop/red.webp" alt="100 FS Chest">
                    <img src="./assets/drop/blue.webp" alt="100 FS Chest">
                    <img src="./assets/drop/pink.webp" alt="100 FS Chest">
                    <img src="./assets/drop/purple.webp" alt="100 FS Chest">
                    <img src="./assets/drop/red.webp" alt="100 FS Chest">
                    <img src="./assets/drop/blue.webp" alt="100 FS Chest">
                    <img src="./assets/drop/yellow.webp" alt="100 FS Chest">
                    <img src="./assets/drop/purple.webp" alt="100 FS Chest">
                    <img src="./assets/drop/red.webp" alt="100 FS Chest">
                    <img src="./assets/drop/blue.webp" alt="100 FS Chest">
                </div>
            </div>
            <img src="./assets/topIero.webp" alt="ierogliph">

            <button type="button" class="modal__button">
                <img src="./assets/gold.png" alt="gold" class="counter__gold2 img">
                18
            </button>
        </div>