@media screen and (max-width: 400px) and (orientation: portrait) {
    main {
        margin: 20px 0;
        padding: 10px;
        gap: 5px;
    }

    h2 {
        font-size: 32px;
    }

    h3 {
        font-size: 24px;
    }

    main>p,
    main>p>a,
    li {
        font-size: 16px;
    }

    .game__room {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        padding: 10px;
    }

    .room__pick {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

    .room__pick>button,
    button.room__play,
    a.add_room {
        padding: 5px;
        font-size: 14px;
    }

    a.add_room {
        padding: 5px 10px;
    }

    .room__username,
    .room__game-type,
    .room__bet {
        font-size: 14px;
    }
}