@media (max-width: 500px) {
    body{
        gap: 2rem;
    }

    .heading{
        font-size: 1.5rem;
    }

    .game-board{
        width: 80%;
        flex-direction: column;
        border-radius: 1rem;
    }

    .diff-button, .message{
        font-size: 0.8rem;
    }

    .diff-button{
        width: 100%;
    }

    .box{
        width: 3rem;
        height: 3rem;
        font-size: 1rem;
    }

    .start-end{
        padding: 1rem;
        border-radius: 1rem;
    }

    .game-section{
        padding: 1rem;
    }

    .box-1{
        padding: 0.5rem;
        border-radius: 0.5rem;
        font-size: 0.7rem;
    }
}