/* ============================================================
   小涵互联 · 移动端全新 UI（v3）
   适用 ≤820px；桌面端不加载任何移动端结构
   - 底部 TabBar（毛玻璃 + 滑块指示器 + 安全区）
   - 移动端吸顶头部、横向分类条、单列卡片流
   - 所有触控目标 ≥ 44px，符合移动端可用性
   ============================================================ */

@media (max-width: 820px) {
    :root {
        --xh-tabbar-h: 58px; /* 手机端不显示底部导航栏 */
        --xh-safe-b: env(safe-area-inset-bottom, 0px);
    }

    html { -webkit-text-size-adjust: 100%; }

    body.xh-page {
        padding-bottom: calc(var(--xh-safe-b) + 18px) !important;
        overscroll-behavior-y: contain;
    }


    /* 移动端通用容器：去掉过大的桌面侧边距 */
    .shell,
    .xh-shell {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 14px !important;
        padding-right: 14px !important;
        box-sizing: border-box;
    }

    /* ---------- 顶部导航（移动端精简） ---------- */
    .xh-nav { height: 56px; }
    .xh-nav-inner {
        height: 56px !important;
        padding: 0 14px !important;
        gap: 10px;
    }
    .xh-nav-logo img { height: 26px !important; }
    .xh-nav-titles b { font-size: 15px !important; }
    .xh-nav-titles i { display: none !important; }
    .xh-nav-links { display: none !important; }

    /* ---------- 页面标题区 ---------- */
    .page-head,
    .hub-hero {
        padding: 18px 0 12px !important;
        display: block !important;
    }
    .page-head h1,
    .hub-hero h1 {
        font-size: 24px !important;
        line-height: 1.28 !important;
        letter-spacing: -.3px;
        margin: 0 0 6px !important;
    }
    .page-head p,
    .hub-hero p {
        font-size: 13.5px !important;
        line-height: 1.6 !important;
        color: var(--xh-text-2);
        margin: 0 !important;
    }
    .hub-eyebrow { font-size: 10.5px !important; letter-spacing: 1.4px; }

    /* ---------- 搜索框吸顶 ---------- */
    .search-box,
    .hub-search {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 46px !important;
        border-radius: 14px !important;
        margin: 0 0 12px !important;
        font-size: 15px !important;
    }
    .search-box input,
    .hub-search input {
        font-size: 15px !important;
        /* 防止 iOS 聚焦缩放 */
    }
    .hub-search button,
    .search-box button {
        min-width: 74px;
        min-height: 38px;
        border-radius: 11px !important;
        font-size: 14px;
    }

    /* ---------- 横向滚动筛选条 ---------- */
    .chip-row,
    .cat-tabs,
    .plat-tabs {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        overflow-y: hidden;
        gap: 8px !important;
        margin: 0 -14px 14px !important;
        padding: 2px 14px 8px !important;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .chip-row::-webkit-scrollbar,
    .cat-tabs::-webkit-scrollbar,
    .plat-tabs::-webkit-scrollbar { display: none; }
    .chip,
    .cat-tab {
        flex: 0 0 auto !important;
        scroll-snap-align: start;
        height: 36px !important;
        padding: 0 14px !important;
        font-size: 13.5px !important;
        border-radius: 999px !important;
        white-space: nowrap;
        display: inline-flex !important;
        align-items: center;
        gap: 6px;
    }

    /* ---------- 卡片栅格 → 单列 / 双列 ---------- */
    .grid.grid-4,
    .grid.grid-3,
    .grid-links,
    .dl-grid,
    .hub-grid,
    .site-grid {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }
    .grid.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }

    .card,
    .link-card,
    .dl-card,
    .site-card,
    .tool-tile {
        padding: 14px !important;
        border-radius: 16px !important;
        min-height: 0 !important;
    }
    .card-title b,
    .lc-title,
    .dl-title { font-size: 15px !important; }
    .card-desc,
    .lc-desc,
    .dl-desc {
        font-size: 13px !important;
        line-height: 1.55 !important;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    /* 触控卡片整块可点，且给出按压反馈 */
    .card:active,
    .link-card:active,
    .dl-card:active,
    .site-card:active {
        transform: scale(.985);
        transition: transform .12s ease;
    }
    .lc-go { font-size: 13px !important; }

    .card-ico,
    .lc-icon,
    .dl-icon,
    .site-ico {
        width: 42px !important;
        height: 42px !important;
        border-radius: 12px !important;
        font-size: 16px !important;
    }
    .card-ico svg,
    .lc-icon svg,
    .dl-icon svg { width: 22px; height: 22px; }

    /* ---------- 分页 → 触控友好 ---------- */
    .pager { gap: 6px !important; flex-wrap: wrap; }
    .pager-btn, .pager a, .pager span {
        min-width: 40px !important;
        height: 40px !important;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        border-radius: 12px !important;
        font-size: 14px;
    }

    /* ---------- 表格 → 卡片化 ---------- */
    .hist-table,
    .ad-table,
    table.xh-table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        font-size: 13px;
    }
    .hist-table thead { display: none; }
    .hist-table tr {
        display: flex;
        flex-wrap: wrap;
        gap: 6px 12px;
        padding: 12px 0;
        border-bottom: 1px solid var(--xh-line);
    }
    .hist-table td { border: 0 !important; padding: 0 !important; font-size: 12.5px; }
    .hist-table td:first-child { font-weight: 600; flex: 1 0 100%; font-size: 14px; }

    /* ---------- 客户端平台切换（移动端两列） ---------- */
    .plat-tab {
        flex-direction: column !important;
        gap: 6px !important;
        padding: 12px 10px !important;
        min-width: 96px;
    }
    .plat-ico svg { width: 22px; height: 22px; }
    .plat-panel {
        display: block !important;
        padding: 16px !important;
        border-radius: 18px !important;
    }
    .plat-panel-shot { margin-top: 14px !important; }
    .dl-btn.lg { width: 100%; min-height: 48px; font-size: 15px; border-radius: 14px; }

    /* ---------- 页脚精简 ---------- */
    .site-foot { padding: 18px 0 8px; }
    .site-foot-inner {
        display: block !important;
        text-align: center;
        font-size: 12px;
        line-height: 1.9;
    }
    .site-foot-links {
        display: flex !important;
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px 14px;
        margin-top: 8px;
        font-size: 12.5px;
    }
    /* 移动端底部已有 TabBar，隐藏重复的页脚导航块 */
    .xh-tabbar ~ .site-foot .site-foot-links,
    body.xh-has-tabbar .site-foot-links { opacity: .82; }

    /* ---------- 登录页 ---------- */
    .auth-wrap {
        display: block !important;
        padding: 18px 0 6px !important;
    }
    .auth-card {
        margin: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 18px 16px 20px !important;
        border-radius: 20px !important;
    }
    .auth-tabs { gap: 6px; }
    .auth-tab { flex: 1; height: 42px; font-size: 13.5px; border-radius: 12px; }
    .auth-input, .auth-card input[type=text], .auth-card input[type=password], .auth-card input[type=email] {
        height: 48px !important;
        font-size: 15.5px !important;
        border-radius: 13px !important;
    }
    .auth-submit, .auth-card button[type=submit] {
        height: 50px !important;
        font-size: 16px !important;
        border-radius: 14px !important;
    }
}

/* ============================================================
   底部 TabBar（移动端唯一底部导航；替代历史浮动 Dock）
   ============================================================ */
.xh-tabbar {
    display: none;
}

@media (max-width: 820px) {
    .xh-tabbar {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 900;
        display: flex;
        align-items: stretch;
        justify-content: space-around;
        height: var(--xh-tabbar-h);
        padding: 0 4px calc(var(--xh-safe-b));
        box-sizing: content-box;
        background: color-mix(in srgb, var(--xh-bg, #070b16) 82%, transparent);
        -webkit-backdrop-filter: saturate(180%) blur(20px);
        backdrop-filter: saturate(180%) blur(20px);
        border-top: 1px solid color-mix(in srgb, var(--xh-line, #ffffff1a) 70%, transparent);
        transition: transform .26s cubic-bezier(.32, .72, 0, 1);
    }
    @supports not (background: color-mix(in srgb, red 50%, blue)) {
        .xh-tabbar { background: var(--xh-bg, #070b16); }
    }
    .xh-tabbar.hide { transform: translateY(110%); }

    .xh-tab {
        position: relative;
        z-index: 1;
        flex: 1 1 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 3px;
        color: var(--xh-text-2, #9aa4b8);
        text-decoration: none;
        font-size: 10.5px;
        letter-spacing: .2px;
        -webkit-tap-highlight-color: transparent;
        transition: color .18s ease;
    }
    .xh-tab-ico {
        display: grid;
        place-items: center;
        width: 30px;
        height: 26px;
        border-radius: 9px;
        transition: background .2s ease, transform .2s ease;
    }
    .xh-tab-ico svg { width: 21px; height: 21px; }
    .xh-tab-label { line-height: 1; }

    .xh-tab.on { color: var(--xh-primary, #4f8cff); font-weight: 600; }
    .xh-tab.on .xh-tab-ico {
        background: color-mix(in srgb, var(--xh-primary, #4f8cff) 16%, transparent);
        transform: translateY(-1px);
    }
    .xh-tab:active .xh-tab-ico { transform: scale(.92); }

    /* 当前页指示条：跟随选中的 tab 平滑滑动（此前缺少样式导致指示器一直不动） */
    .xh-tab-ind {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 2;
        width: calc(100% / var(--xh-tab-n, 5));
        height: 3px;
        border-radius: 0 0 3px 3px;
        background: linear-gradient(90deg, var(--xh-primary, #4f8cff), var(--xh-primary-2, #7a5cff));
        transform: translateX(calc(var(--i, 0) * 100%));
        transition: transform .28s cubic-bezier(.22, 1, .36, 1);
        pointer-events: none;
    }
    @media (prefers-reduced-motion: reduce) {
        .xh-tab-ind { transition: none; }
    }
}

/* 桌面端兜底：无论何时都不渲染浮动 Dock */
.xh-dock { display: none !important; }