/* 草根主题手机端独立样式 */
@media (max-width: 900px) {
    body.dark-mode {
        --bg: #121212;
        --surface: #1e1e1e;
        --surface-soft: rgba(30, 30, 30, 0.94);
        --text: #f7f7f8;
        --muted: #b9c0ca;
        --border: rgba(255, 255, 255, 0.08);
        background: #121212;
    }

    body.dark-mode .site-header {
        background: #1a1a1a;
        border-bottom: 1px solid rgba(255,255,255,0.04);
    }

    .header-inner {
        height: 58px;
    }

    body.dark-mode .caogen-quick-nav, body.dark-mode .resource-hero, body.dark-mode .shop-hero, body.dark-mode .movie-hero, body.dark-mode .archive-hero { background: #2b2c31; border-color: rgba(255,255,255,0.04); }

    .resource-hero,
    .shop-hero,
    .movie-hero,
    .archive-hero {
        padding: 22px 0 18px;
    }

    .shop-strip-section,
    .movie-filter-section,
    .hero-section,
    .home-slider-section,
    .topic-section,
    .magazine-section,
    .home-modules-section,
    .sidebar-area {
        display: none;
    }

    .site-main {
        padding-top: 0;
    }

    #latest-posts,
    .layout-grid {
        display: block;
        padding-top: 10px;
    }

    .content-area {
        width: 100%;
    }

    .section-heading {
        display: none;
    }

    .caogen-recommend-section {
        display: block;
        padding: 10px 0 16px;
    }

    .caogen-recommend-section .section-heading {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 10px;
    }

    body.dark-mode .caogen-recommend-section .section-heading h2 { margin: 0; color: #fff; font-size: 18px; }

    .caogen-recommend-section .section-heading p {
        display: none;
    }

    body.dark-mode .caogen-recommend-section .section-more { min-height: 28px; padding: 0 10px; color: #9fb6e8; background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.06); font-size: 12px; }

    .caogen-recommend-row {
        display: grid;
        grid-auto-flow: column;
        grid-auto-columns: 56%;
        grid-template-columns: none;
        gap: 10px;
        overflow-x: auto;
        padding: 0 2px 8px;
        scroll-snap-type: x mandatory;
    }

    body.dark-mode .caogen-recommend-card { scroll-snap-align: start; border-radius: 14px; background: #303136; border-color: rgba(255,255,255,.06); box-shadow: none; }

    .caogen-recommend-thumb {
        aspect-ratio: 16 / 10;
    }

    .caogen-recommend-info {
        padding: 9px 10px 10px;
    }

    .caogen-recommend-top {
        min-height: 20px;
        margin-bottom: 6px;
    }

    .caogen-recommend-top .cat-badge {
        max-width: 100%;
        padding: 2px 6px;
        font-size: 11px;
    }

    .caogen-recommend-price {
        left: 8px;
        bottom: 8px;
        min-height: 23px;
        max-width: calc(100% - 16px);
        padding: 0 8px;
        font-size: 12px;
    }

    .caogen-recommend-card h3 {
        font-size: 13.5px;
        line-height: 1.36;
    }

    body.dark-mode .caogen-recommend-card h3 a { min-height: 37px; max-height: 37px; color: #f4f6fb; }

    .caogen-recommend-bottom {
        margin-top: 8px;
        padding-top: 8px;
        font-size: 11px;
    }

    .caogen-recommend-meta {
        max-width: calc(100% - 48px);
    }

    body.dark-mode .caogen-recommend-bottom > a { padding: 4px 8px; color: #b9c7ff; background: rgba(99,102,241,.16); }

    .caogen-mobile-sort {
        display: flex;
        align-items: center;
        gap: 9px;
        margin: 0 0 12px;
        padding: 6px 2px;
        color: var(--muted);
        font-size: 14px;
        white-space: nowrap;
        overflow-x: auto;
    }

    body.dark-mode .caogen-mobile-sort strong { color: #fff; font-size: 16px; }

    .caogen-mobile-sort a {
        color: var(--muted);
    }

    body.dark-mode .caogen-mobile-sort a::before { content: "·"; margin-right: 7px; color: rgba(255,255,255,0.22); }

    body.dark-mode .zlb-mobile-tab { background: #1a1a1a; border-top: 1px solid rgba(255,255,255,0.05); }

    body.dark-mode .zlb-mobile-tab a { color: #8fb3e8; }

    .caogen-widget-grid,
    .caogen-widget-tabs {
        grid-template-columns: 1fr;
    }

    .caogen-widget-row {
        grid-auto-columns: 72%;
    }

    .home-bottom-widgets {
        padding: 16px 0 78px;
    }

    .home-top-widgets {
        padding: 14px 0 6px;
    }

    .caogen-category-image-grid,
    .caogen-category-style-mini {
        display: grid;
        grid-auto-flow: column;
        grid-auto-columns: 72%;
        grid-template-columns: none;
        gap: 12px;
        overflow-x: auto;
        padding: 0 2px 10px;
        scroll-snap-type: x mandatory;
    }

    .caogen-category-image-card {
        min-height: 142px;
        padding: 14px;
        border-radius: 18px;
        scroll-snap-align: start;
    }

    .caogen-category-image-card strong {
        font-size: 18px;
    }

    .caogen-category-image-card small {
        display: -webkit-box;
        overflow: hidden;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        font-size: 12px;
    }

    .cg-user-feature-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .cg-user-feature-cards a {
        padding: 12px;
        border-radius: 16px;
    }

    .cg-user-feature-cards strong {
        font-size: 18px;
    }

    .caogen-nav-hero {
        padding: 24px 0 12px;
        text-align: left;
    }

    .caogen-nav-hero h1 {
        font-size: 28px;
    }

    .caogen-nav-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .caogen-nav-card {
        padding: 14px;
        border-radius: 18px;
    }

    .caogen-nav-links {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .caogen-nav-links a {
        padding: 9px;
        border-radius: 12px;
    }

    .caogen-nav-links a > span {
        width: 26px;
        height: 26px;
        border-radius: 9px;
    }

    .caogen-layer-slider {
        width: 100%;
        height: auto;
        aspect-ratio: 16 / 9;
        min-height: 190px;
        max-height: 360px;
        border-radius: 0;
    }

    .caogen-nav-slider {
        height: auto !important;
        aspect-ratio: 16 / 9;
        min-height: 190px;
    }

    .caogen-layer-slider-track,
    .caogen-layer-slide,
    .caogen-layer-slide-link {
        width: 100%;
        height: 100%;
    }

    .caogen-slide-video {
        display: none;
    }

    .caogen-slide-mask {
        background: linear-gradient(180deg, rgba(5, 7, 18, .18), rgba(5, 7, 18, .82));
    }

    .caogen-slide-layer {
        right: 12px;
        bottom: 0;
        max-width: 48vw;
        max-height: 58%;
        opacity: .9;
    }

    .caogen-slide-copy {
        left: 18px;
        right: 18px;
        top: auto;
        bottom: 42px;
        width: auto;
        transform: none;
    }

    .caogen-slide-copy strong {
        font-size: 28px;
        margin-bottom: 8px;
    }

    .caogen-slide-copy em {
        font-size: 14px;
        line-height: 1.55;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .caogen-slide-copy b {
        margin-top: 13px;
        padding: 8px 14px;
        font-size: 13px;
    }

    .caogen-slider-control {
        display: none;
    }
}

/* 手机底部Tab栏 */
.caogen-mobile-tab-bar { position:fixed; bottom:0; left:0; right:0; z-index:1000; display:flex; justify-content:space-around; align-items:center; height:56px; background:var(--surface-soft); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); border-top:1px solid var(--border); }
.caogen-mobile-tab-bar .mobile-tab-item { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; padding:4px 0; color:var(--muted); text-decoration:none; font-size:10px; border:none; background:none; cursor:pointer; transition:color .2s ease; }
.caogen-mobile-tab-bar .mobile-tab-item.is-active { color:var(--primary); }
.caogen-mobile-tab-bar .mobile-tab-icon { font-size:20px; line-height:1; }
.caogen-mobile-tab-bar .mobile-tab-label { font-size:10px; font-weight:700; }
body { padding-bottom:56px; }