/* ========================================
   MUJAM — Адаптивность (мобильные устройства)
   ======================================== */

@media (max-width: 768px) {
    /* Основной макет */
    .mujam-main { padding: 0 12px 16px; }

    /* Шапка */
    .mujam-header-inner { padding: 0 8px; }
    .mujam-title { font-size: 22px; }
    .mujam-logo-link { width: 40px; height: 40px; }

    /* Табы — горизонтальная прокрутка */
    .mujam-nav-tabs { padding: 0 8px; }
    .mujam-tab { padding: 8px 14px; font-size: 13px; }

    /* Поиск */
    .mujam-search-bar { padding: 10px 0 6px; }
    .mujam-search-input { font-size: 14px; padding: 8px 36px 8px 38px; }

    /* Алфавит — компактнее на мобильных */
    .mujam-alpha-btn { min-width: 28px; height: 28px; font-size: 14px; }
    .mujam-alpha-btn-ru { min-width: 24px; height: 24px; font-size: 11px; }

    /* Словарь: скрыть быструю навигацию на мобильных */
    .mujam-quickjump { display: none; }
    .mujam-dict-layout { flex-direction: column; }

    /* Элементы слов */
    .mujam-word-ar { font-size: 19px; min-width: 80px; }
    .mujam-word-ru { font-size: 13px; }

    /* Сарф */
    .sarf-verb-list { grid-template-columns: 1fr; }
    .sarf-saghir-header { font-size: 22px; gap: 10px; }
    .sarf-saghir-details { grid-template-columns: 1fr; }
    .sarf-kabir-tabs { margin: 10px -12px 0; padding: 0 12px; }
    .sarf-conjugation-table td:last-child { font-size: 17px; }

    /* Нахв */
    .nahw-categories { gap: 4px; }
    .nahw-chip { padding: 5px 12px; font-size: 12px; }
    .nahw-topic-card { padding: 10px 14px; }
    .nahw-topic-title-ar { font-size: 17px; }

    /* Практика */
    .practice-example-ar { font-size: 17px; }
    .practice-ai-sentence-ar { font-size: 17px; }

    /* Модальное окно */
    .mujam-modal { max-height: 90vh; border-radius: var(--radius-md); margin: 10px; }
    .mujam-modal-title { font-size: 18px; }
}

/* Поддержка тёмной темы */
@media (prefers-color-scheme: dark) {
    /* Обрабатывается глобальными правилами css/dark-mode.css */
}

/* Очень маленькие экраны */
@media (max-width: 400px) {
    .mujam-tab { padding: 7px 10px; font-size: 12px; }
    .sarf-kabir-tab { padding: 6px 10px; font-size: 12px; }
    .mujam-alpha-btn { min-width: 24px; height: 24px; font-size: 12px; }
}