@media (max-width: 1920px) {
}

@media (max-width: 1366px) {
}

@media (max-width: 1200px) {
}

@media (max-width: 1024px) {
    .characters {
        margin: 50px auto;
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        gap: 20px;
        max-width: 1000px;
    }
    .char-btn {
        background: none;
        border: none;
        cursor: pointer;
    }
    .char-btn img {
        width: 300px;
        height: auto;
        transition: transform 0.3s ease;
    }
    .end-disclaimer {
        margin: 50px auto;
        width: 95%;
    }
}

@media (max-width: 880px) {
    .characters {
        margin: 50px auto;
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        gap: 20px;
        max-width: 800px;
    }
    .char-btn img {
        width: 200px;
        height: auto;
        transition: transform 0.3s ease;
    }
    .end-disclaimer {
        margin: 50px auto;
        width: 95%;
    }
}

@media (max-width: 768px) {
    .modal img {
        max-width: 90%;
        max-height: 90%;
    }
    .end-disclaimer {
        margin: 50px auto;
        width: 90%;
    }
}

@media (max-width: 480px) {
    .modal img {
        max-width: 100%;
        max-height: 200%;
    }
    .end-disclaimer {
        margin: 20px auto;
        width: 95%;
    }
}

@media (max-width: 390px) {
}

@media (max-width: 360px) {
}