@media screen and (max-width: 576px) {
    .record-accueil {
        flex-direction: column;
    }
    .record {
        width: 100%;
    }
    .record-precedent {
        display: none;
    }
    .btn {
        width: 100%;
    }
    .container-plateau .calc {
        gap: 20px;
    }
    h1 {
        font-size: 18px;
    }
    input[type="text"] {
        width: calc(100% - 34px);
    }
    p {
        font-size: 16px;
    }
    .stat-container {
        flex-direction: column;
    }
    .stat-info,
    .stat-record {
        width: 100%;
    }
    .stat-container .stat-block {
        margin: 20px 0;
        box-sizing: border-box;
    }
    .stat-classement>span {
        width: 20px;
        height: 20px;
    }
    .container-stat p {
        font-size: 14px;
    }
    .mobile-none {
        display: none;
    }
    .mobile-block {
        display: block;
    }
    .btn-nbr {
        height: 60px;
        width: 60px;
        font-size: 30px;
    }
    .nbr-triangle,
    .nbr-carre,
    .nbr-rond {
        font-size: 25px;
        width: 60px;
        height: 60px;
    }
    .nbr-triangle::before {
        border-left: 30px solid transparent;
        border-right: 30px solid transparent;
        border-bottom: 60px solid #58b3da;
    }
    .toast-message {
        padding: 20px 20px;
        font-size: 16px;
        line-height: 18px;
        width: 80%;
    }
    .container {
        height: calc(100vh - 40px);
    }
    .container-stat {
        height: calc(100% - 40px);
    }
}