/* ==========================================
   移动端响应式增强 - Android/iOS 适配
   ========================================== */

/* --- 平板 --- */
@media (max-width: 900px) {
    .stats-grid { grid-template-columns: repeat(2, 1fr) !important; }
    .quiz-stats { grid-template-columns: repeat(3, 1fr) !important; }
    .profile-grid { grid-template-columns: 1fr !important; }
}

/* --- 大屏手机 --- */
@media (max-width: 768px) {
    /* 容器 */
    .container { padding: 12px !important; }
    .profile-container, .quiz-container { padding: 12px !important; }

    /* 导航：只显示图标 + 溢出滚动 */
    .navbar {
        padding: 0 12px;
        height: 56px;
        flex-wrap: nowrap;
    }
    .navbar-brand { font-size: 14px; }
    .navbar-brand span:not(.logo) { display: none; }
    .navbar-menu {
        gap: 2px !important;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        flex: 1;
        justify-content: flex-end !important;
        scrollbar-width: none;
    }
    .navbar-menu::-webkit-scrollbar { display: none; }
    .navbar-menu li { flex-shrink: 0; }
    .navbar-menu a {
        padding: 6px 8px !important;
        font-size: 18px !important;
        border-radius: 6px;
    }
    .navbar-menu a span { display: none !important; }
    .navbar-user { margin-left: 8px; }
    .btn-login { padding: 4px 10px; font-size: 12px; }

    /* 首页倒计时 */
    .countdown-banner { padding: 20px 16px !important; }
    .countdown-banner h2 { font-size: 14px !important; }
    .countdown-days { font-size: 56px !important; }
    .countdown-tip { font-size: 12px !important; }

    /* 首页统计卡片 */
    .stats-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; }
    .stat-card { padding: 14px !important; }
    .stat-icon { font-size: 24px !important; }
    .stat-value { font-size: 24px !important; }
    .stat-label { font-size: 12px !important; }

    /* 今日学习 5列变 2列 */
    [style*="grid-template-columns: repeat(5"] {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    [style*="grid-template-columns: repeat(3"] {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    /* 卡片 */
    .card { padding: 16px !important; margin-bottom: 16px !important; }
    .card-title { font-size: 15px !important; }

    /* 两栏布局单列 */
    [style*="grid-template-columns: 2fr 1fr"] {
        grid-template-columns: 1fr !important;
    }

    /* 单词卡片 */
    .flashcard {
        padding: 24px 16px !important;
        min-height: 300px !important;
    }
    .flashcard .word-main { font-size: 32px !important; }
    .flashcard .phonetic { font-size: 14px !important; }
    .flashcard .meaning { font-size: 16px !important; }
    .flashcard .example { font-size: 13px !important; }
    .flashcard-actions { flex-direction: column !important; gap: 10px !important; }
    .flashcard-actions .btn { width: 100% !important; padding: 14px !important; font-size: 15px !important; }

    /* 古诗 */
    .poem-content { font-size: 16px !important; line-height: 1.9 !important; }
    .poem-title { font-size: 20px !important; }
    .poem-actions { flex-direction: column !important; }
    .poem-actions .btn { width: 100% !important; }

    /* 阅读理解 */
    .reading-passage {
        font-size: 15px !important;
        line-height: 1.8 !important;
        padding: 16px !important;
    }
    .question-text { font-size: 15px !important; }
    .option-item { padding: 14px 12px !important; font-size: 14px !important; }
    .btn-row { flex-direction: column !important; }
    .btn-row .btn { width: 100% !important; padding: 14px !important; }

    /* 物理化学题库 */
    .quiz-header { padding: 16px !important; }
    .quiz-header h2 { font-size: 18px !important; }
    .quiz-stats { grid-template-columns: repeat(3, 1fr) !important; gap: 8px !important; }
    .stat-card .num { font-size: 20px !important; }
    .stat-card .label { font-size: 11px !important; }
    .practice-panel { padding: 16px !important; }
    .question-text { font-size: 15px !important; }
    .option-item { padding: 12px !important; font-size: 14px !important; }
    .btn { padding: 12px 20px !important; font-size: 14px !important; }
    .btn-row { flex-direction: column !important; gap: 10px !important; }
    .btn-row .btn { width: 100% !important; }

    /* 错题本 */
    .wrong-item { padding: 14px !important; }
    .wrong-item .question { font-size: 14px !important; }
    .filter-tabs { flex-wrap: wrap !important; gap: 6px !important; }
    .filter-tab { padding: 6px 12px !important; font-size: 12px !important; }

    /* 学习统计 */
    .stats-summary { grid-template-columns: repeat(2, 1fr) !important; }
    .summary-item .num { font-size: 22px !important; }

    /* 个人中心 */
    .profile-header { padding: 20px 16px !important; }
    .profile-header h2 { font-size: 18px !important; }
    .avatar { width: 60px !important; height: 60px !important; font-size: 30px !important; }
    .form-row input, .form-row select { font-size: 15px !important; padding: 12px !important; }

    /* 登录注册 */
    .auth-container { padding: 28px 20px !important; width: 95% !important; }
    .auth-header h1 { font-size: 20px !important; }
    .form-group input { font-size: 15px !important; padding: 12px !important; }
    .btn-submit { padding: 14px !important; font-size: 15px !important; }

    /* 图表区 */
    .bar-chart { height: 100px !important; }
    .bar-item { width: 28px !important; }
    .bar-label { font-size: 10px !important; }
}

/* --- 小屏手机 --- */
@media (max-width: 480px) {
    .container, .profile-container, .quiz-container { padding: 10px !important; }
    .stats-grid { grid-template-columns: 1fr 1fr !important; }
    .stat-card { padding: 12px 8px !important; }
    .stat-icon { font-size: 20px !important; }
    .stat-value { font-size: 20px !important; }
    .stat-label { font-size: 11px !important; }
    .countdown-days { font-size: 44px !important; }
    .countdown-tip { font-size: 11px !important; }

    .quiz-stats { grid-template-columns: 1fr 1fr !important; }

    [style*="grid-template-columns: repeat(5"] {
        grid-template-columns: 1fr 1fr !important;
    }
}

/* --- 触摸优化 --- */
@media (hover: none) and (pointer: coarse) {
    /* 触摸设备上禁用hover效果 */
    .hover-lift:hover { transform: none; box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
    /* 增大可点击区域 */
    .btn, button, .option-item, .filter-tab { min-height: 44px; }
    .navbar-menu a { min-width: 44px; min-height: 44px; display: flex; align-items: center; justify-content: center; }
}

/* --- 横屏 --- */
@media (max-width: 900px) and (orientation: landscape) {
    .flashcard { min-height: 240px !important; }
}

/* --- 安全区适配（iPhone刘海） --- */
@supports (padding: env(safe-area-inset-top)) {
    .navbar { padding-top: env(safe-area-inset-top); height: calc(56px + env(safe-area-inset-top)); }
    body { padding-bottom: env(safe-area-inset-bottom); }
}
