/* =========================================================
   Moban 8-10-6 — responsive.css
   768px: tablet/mobile — Bento collapse to single column,
   bottom fixed tab bar enabled. 480px: small phones.
   ========================================================= */

/* ---------- Tablet & mobile ---------- */
@media (max-width: 768px) {
    /* Body padding so the fixed bottom tab bar never covers content */
    body { padding-bottom: 78px; }

    .container { padding: 0 14px; }
    .site-content { padding: 18px 0 30px; }

    /* Top bar: hide horizontal nav (bottom tab bar takes over) */
    .top-nav { display: none; }
    .top-bar-inner { justify-content: space-between; gap: 12px; min-height: 58px; }
    .logo-img { max-height: 36px; }
    .btn-login, .header-actions .btn-login { display: none; }
    .btn-register { padding: 8px 16px; font-size: 0.85rem; }

    /* Bento grids collapse to a single stacked column */
    .bento-grid {
        display: flex;
        flex-direction: column;
        gap: 14px;
    }
    .bento-grid > * { min-width: 0; }
    .b-hero { min-height: 300px; }
    .b-hero .b-cover { height: 190px; }
    .b-poster { min-height: 220px; }
    .b-game { flex-direction: row; align-items: center; gap: 12px; }
    .b-game-img { width: 86px; height: 86px; border-radius: 16px; flex: 0 0 auto; }
    .b-game-body { padding: 10px 14px 10px 0; }
    .b-news-mini { min-height: 92px; }
    .b-download { text-align: left; }
    .b-news-card .b-news-thumb { height: 170px; }
    .b-news-card--fallback { grid-row: auto; }

    /* CTA band & page band */
    .cta-band-inner { flex-direction: column; align-items: flex-start; padding: 26px 22px; }
    .cta-band-title { font-size: 1.35rem; }
    .page-band { padding: 24px 20px; }
    .page-band-title { font-size: 1.4rem; }

    /* Post grid → single column */
    .post-grid { grid-template-columns: 1fr; }
    .single-card { padding: 24px 18px; }
    .single-title { font-size: 1.5rem; }

    /* Footer widgets stacked */
    .footer-widgets { grid-template-columns: 1fr; }

    /* Fixed bottom tab bar becomes visible */
    .mobile-tabbar { display: flex; }
}

/* ---------- Small phones ---------- */
@media (max-width: 480px) {
    body { font-size: 15px; padding-bottom: 72px; }
    .container { padding: 0 12px; }

    .bento-tabs { gap: 8px; }
    .bento-tab { padding: 8px 18px; font-size: 0.9rem; }

    .b-hero { min-height: 260px; }
    .b-hero-title { font-size: 1.1rem; }
    .b-poster { min-height: 180px; }
    .b-download-title { font-size: 1.05rem; }

    .mtab span { font-size: 0.62rem; }
    .mtab-icon { width: 20px; height: 20px; }

    .chip { font-size: 0.8rem; padding: 5px 12px 5px 5px; }
    .chip img { width: 28px; height: 28px; }

    .cta-band-inner { padding: 22px 18px; }
    .btn-lg { padding: 12px 24px; font-size: 0.95rem; }
    .post-card-thumb { height: 150px; }
    .single-nav { flex-direction: column; }
    .single-nav-item { text-align: left; }
    .single-nav-item:last-child { text-align: left; }
}
