/* Page: Quiz Mobile (#page-quiz) */

@media (max-width: 768px) {
    #page-quiz .quiz-page-container {
        height: auto;
        display: block;
        padding-bottom: 2rem;
    }

    #page-quiz .quiz-card {
        margin-bottom: 1rem;
        height: auto;
    }

    #page-quiz .card-body {
        padding: 1.5rem !important;
        flex-direction: row !important;
        /* Horizontal layout for compact mobile view? No, keep vertical as per icons */
        text-align: center;
    }

    /* Maybe reduce icon size on mobile */
    #page-quiz .quiz-icon-wrapper {
        width: 60px;
        height: 60px;
    }

    #page-quiz .container {
        padding: 0 1rem;
    }
}