#game-over {

    position: absolute;
    inset: 0;

    display: none;
    align-items: center;
    justify-content: center;

    font-family: cursive;

    background: rgba(0, 0, 0, 0.6);

    z-index: 1000;

    /* ⭐ ensure overlay fills responsive container */
    width: 100%;
    height: 100%;
}

.game-over-box {

    /* ⭐ responsive padding */
    padding: clamp(20px, 4vw, 40px) clamp(30px, 6vw, 60px);

    border-radius: 14px;
    text-align: center;
}

.game-over-text {

    font-size: clamp(36px, 8vw, 100px);
    font-weight: bold;
    color: black;
}

#final-score {

    margin-top: 14px;
    font-weight: bolder;

    font-size: clamp(20px, 4vw, 50px);

    color: black;
}