/* ==========================================================================
   UP Video 响应式规则
   断点：1024px（平板横屏）/ 768px（平板竖屏）/ 560px（手机）
   ========================================================================== */

/* ---------- ≤1024px：平板横屏 / 小桌面 ---------- */
@media (max-width: 1024px) {
    .upv-container { width: calc(100% - 40px); }

    .upv-card-grid { grid-template-columns: repeat(3, 1fr); }
    .upv-cat-grid { grid-template-columns: repeat(3, 1fr); }

    /* freedidi 式网格流：平板 2 列（结构与分页不变） */
    .upv-grid { grid-template-columns: repeat(2, 1fr); }

    /* 侧边栏下移 */
    .upv-layout { flex-direction: column; }
    .upv-sidebar { flex: 1 1 auto; }
    .upv-sidebar .upv-widget { margin-bottom: 16px; }
}

/* ---------- ≤768px：平板竖屏 / 大手机 ---------- */
@media (max-width: 768px) {
    .upv-nav-toggle { display: inline-flex; }

    /* 移动端抽屉导航 */
    .upv-nav {
        position: fixed;
        top: var(--upv-header-h);
        left: 0; bottom: 0;
        width: min(300px, 84vw);
        background: var(--upv-surface);
        border-right: 1px solid var(--upv-border);
        box-shadow: var(--upv-shadow-hover);
        transform: translateX(-105%);
        transition: transform .3s ease;
        z-index: 110;
        overflow-y: auto;
        padding: 14px;
    }
    body.upv-nav-open .upv-nav { transform: translateX(0); }
    body.upv-nav-open { overflow: hidden; }
    /* 遮罩 */
    body.upv-nav-open::after {
        content: "";
        position: fixed;
        inset: var(--upv-header-h) 0 0 0;
        background: rgba(0, 0, 0, .45);
        z-index: 105;
    }
    .upv-menu { flex-direction: column; align-items: stretch; }
    .upv-menu a { padding: 12px 14px; font-size: 15px; }
    .upv-menu .sub-menu {
        position: static;
        opacity: 1;
        visibility: visible;
        transform: none;
        border: none;
        box-shadow: none;
        padding-left: 14px;
    }

    .upv-header__inner { gap: 8px; }
    .upv-logo { margin-right: auto; }

    .upv-hero { padding-top: 12px; }
    .upv-hero__viewport { aspect-ratio: 16 / 9; }
    .upv-hero__title { font-size: 17px; }
    .upv-hero__excerpt { display: none; }
    .upv-hero__arrow { display: none; }

    .upv-card-grid { grid-template-columns: repeat(2, 1fr); gap: 14px 12px; }
    .upv-card-grid--compact { grid-template-columns: repeat(2, 1fr); }
    .upv-cat-grid { grid-template-columns: repeat(2, 1fr); }

    /* freedidi 式网格流：手机 1 列（结构与分页不变） */
    .upv-grid { grid-template-columns: 1fr; gap: 16px; }

    .upv-single__title { font-size: 21px; }
    .upv-post-nav { grid-template-columns: 1fr; }

    .upv-collection-hero__inner { flex-direction: column; align-items: flex-start; }
    .upv-collection-hero__cover { flex: 0 0 auto; width: 100%; }

    /* 广告设备控制：移动端生效 */
    .upv-ad[data-device="desktop"] { display: none; }
    .upv-ad[data-device="mobile"] { display: block; }

    /* 悬浮广告为移动端预留 */
    .upv-ad--mobile_sticky { display: block; }

    /* 底部悬浮广告占位，避免遮挡内容 */
    body.has-sticky-ad { padding-bottom: 76px; }

    .upv-author-card { flex-wrap: wrap; }
    .upv-author-card__actions { width: 100%; }

    .upv-comments .comment-form { grid-template-columns: 1fr; }

    .upv-about-hero__social { margin-left: 0; width: 100%; }
}

/* ---------- ≤560px：手机 ---------- */
@media (max-width: 560px) {
    .upv-container { width: calc(100% - 28px); }

    .upv-card-grid { grid-template-columns: 1fr; }
    .upv-card-grid--compact { grid-template-columns: 1fr 1fr; }
    .upv-cat-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
    .upv-cat-card { min-height: 84px; padding: 12px; }

    .upv-section-head__title { font-size: 18px; }
    .upv-archive-head__title { font-size: 20px; }

    .upv-single__meta { gap: 4px 12px; }
    .upv-single__actions { flex-wrap: wrap; }

    .upv-modal__qrs { flex-direction: column; align-items: center; gap: 14px; }
    .upv-qr img { width: 132px; height: 132px; }

    .upv-footer__bottom { flex-direction: column; align-items: flex-start; }

    /* 上下篇纵向排列 */
    .upv-post-nav { gap: 10px; }
}
