/* 移动端布局优化 - 2026-05-06 */
/* 最终方案：Header固定 + 导航粘性定位 + Banner + 搜索条 + 内容 */
/* 覆盖设备：手机(竖/横)、平板、折叠手机 */

/* ==================== 基础移动端 (< 1025px) ==================== */
@media (max-width: 1024px) {
    /* 容器优化 */
    .conch-content .container {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 12px !important;
        margin: 0 auto !important;
    }

    /* 播放页与详情页样式统一 - 同时覆盖.hl-detail-content和.hl-playinfo-wrap */
    .conch-content .hl-detail-content,
    .conch-content .hl-playinfo-wrap {
        position: relative !important;
    }

    /* 竖版手机元数据排版优化 - 时长|播放量|▶播放一行显示 */
    @media (max-width: 767px) {
        .conch-content .hl-detail-content .hl-vod-data ul,
        .conch-content .hl-playinfo-wrap .hl-vod-data ul {
            display: flex !important;
            flex-wrap: wrap !important;
            align-items: center !important;
        }

        .conch-content .hl-detail-content .hl-vod-data li,
        .conch-content .hl-playinfo-wrap .hl-vod-data li {
            margin-right: 12px !important;
            margin-bottom: 4px !important;
        }

        /* 简介展开/收起按钮样式 */
        .conch-content .hl-detail-content .blurb-toggle,
        .conch-content .hl-playinfo-wrap .blurb-toggle {
            display: inline-block !important;
            margin-left: 8px !important;
            font-size: 12px !important;
            color: #f50 !important;
            cursor: pointer !important;
        }
    }

    /* ==================== Header 简化 - 只保留Logo和用户 ==================== */
    .conch-header {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        z-index: 9999 !important;
        background: #fff !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
        height: 50px !important;
    }

    .conch-header .hl-header-container {
        padding: 0 16px !important;
        height: 50px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
    }

    .conch-header .hl-header-top-row {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        height: 50px !important;
    }

    /* Logo */
    .conch-header .conch-logo {
        flex-shrink: 0 !important;
    }

    .conch-header .conch-logo img {
        max-height: 32px !important;
        width: auto !important;
    }

    /* 隐藏搜索框 */
    .conch-header .conch-search {
        display: none !important;
    }

    /* 用户登录区域 */
    .conch-header .hl-top-tools {
        display: flex !important;
        align-items: center !important;
    }

    .conch-header .hl-top-tools .hl-tool-item {
        margin-left: 16px !important;
    }

    .conch-header .hl-top-tools .hl-tool-item a {
        color: #333 !important;
        font-size: 20px !important;
    }

    /* 隐藏桌面导航 */
    .conch-header .hl-header-nav-row {
        display: none !important;
    }

    /* 为固定Header预留空间 */
    .conch-content {
        padding-top: 50px !important;
    }

    /* ==================== 移动端专用导航 (粘性定位) ==================== */
    .mobile-nav-row {
        display: block !important;
        position: sticky !important;
        top: 50px !important;
        left: 0 !important;
        right: 0 !important;
        z-index: 9998 !important;
        background: #fff !important;
        border-bottom: 1px solid #eee !important;
        height: 44px !important;
    }

    .mobile-nav-row .mobile-nav {
        height: 44px !important;
        display: flex !important;
        align-items: center !important;
        padding: 0 12px !important;
    }

    .mobile-nav-row .mobile-nav-list {
        flex: 1 !important;
        display: flex !important;
        overflow-x: auto !important;
        white-space: nowrap !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
        list-style: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .mobile-nav-row .mobile-nav-list::-webkit-scrollbar {
        display: none !important;
    }

    .mobile-nav-row .mobile-nav-item {
        flex-shrink: 0 !important;
        margin-right: 20px !important;
    }

    .mobile-nav-row .mobile-nav-item:last-child {
        margin-right: 0 !important;
    }

    .mobile-nav-row .mobile-nav-item a {
        display: block !important;
        padding: 0 4px !important;
        line-height: 44px !important;
        font-size: 14px !important;
        color: #666 !important;
        text-decoration: none !important;
        position: relative !important;
    }

    .mobile-nav-row .mobile-nav-item a.active {
        color: #ff6b35 !important;
        font-weight: 600 !important;
    }

    .mobile-nav-row .mobile-nav-item a.active::after {
        content: '' !important;
        position: absolute !important;
        bottom: 6px !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        width: 20px !important;
        height: 3px !important;
        background: #ff6b35 !important;
        border-radius: 2px !important;
    }

    /* ==================== Banner 优化 ==================== */
    .conch-content .conch-banner,
    .conch-content .hl-vod-slide {
        padding-top: 56.25% !important; /* 16:9 */
        margin: 0 0 12px 0 !important;
        border-radius: 0 !important;
        overflow: hidden !important;
        position: relative !important;
    }

    /* Banner 内边距 */
    .conch-banner .container,
    .hl-vod-slide .container {
        padding: 0 !important;
    }

    /* ==================== 移动端搜索框 (Banner下方) ==================== */
    .mobile-search-box {
        display: block !important;
        padding: 12px 0 !important;
        background: #fff !important;
        border-bottom: 1px solid #f0f0f0 !important;
    }

    .mobile-search-form {
        display: block !important;
        width: 100% !important;
    }

    .mobile-search-input-wrap {
        display: flex !important;
        align-items: center !important;
        background: #f5f5f5 !important;
        border-radius: 20px !important;
        padding: 0 4px 0 12px !important;
        height: 40px !important;
    }

    .mobile-search-input-wrap .iconfont {
        color: #999 !important;
        font-size: 16px !important;
        margin-right: 8px !important;
    }

    .mobile-search-input {
        flex: 1 !important;
        border: none !important;
        background: transparent !important;
        font-size: 14px !important;
        color: #333 !important;
        padding: 0 !important;
        height: 100% !important;
        outline: none !important;
    }

    .mobile-search-input::placeholder {
        color: #999 !important;
    }

    .mobile-search-btn {
        background: #ff6b35 !important;
        border: none !important;
        color: #fff !important;
        font-size: 14px !important;
        padding: 0 16px !important;
        height: 32px !important;
        border-radius: 16px !important;
        margin-left: 8px !important;
    }

    /* ==================== 模块标题优化 ==================== */
    .conch-content .hl-rb-head,
    .conch-content .hl-row-head {
        font-size: 16px !important;
        font-weight: 600 !important;
        padding: 16px 0 12px 0 !important;
        color: #333 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
    }

    .conch-content .hl-rb-head::before,
    .conch-content .hl-row-head::before {
        content: '' !important;
        display: inline-block !important;
        width: 4px !important;
        height: 16px !important;
        background: #ff6b35 !important;
        border-radius: 2px !important;
        margin-right: 8px !important;
    }

    .conch-content .hl-rb-head .hl-rb-more,
    .conch-content .hl-row-head .hl-text-more {
        font-size: 13px !important;
        color: #999 !important;
        font-weight: normal !important;
    }

    /* ==================== 视频卡片基础样式 ==================== */
    .conch-content .hl-item-wrap {
        display: flex !important;
        flex-direction: column !important;
        height: 100% !important;
    }

    /* 最高优先级，覆盖所有其他CSS文件中的设置 */
    html body .conch-content .hl-row-box .hl-item-thumb,
    html body .conch-content .hl-rb-vod .hl-item-thumb,
    html body #conch-content .hl-row-box .hl-item-thumb,
    .conch-content .hl-row-box .hl-item-thumb,
    .conch-content .hl-rb-vod .hl-item-thumb,
    .conch-content .hl-item-thumb {
        padding-top: 75% !important; /* 4:3 比例，更适合视频缩略图 */
        border-radius: 6px !important;
        overflow: hidden !important;
        position: relative !important;
    }

    .conch-content .hl-item-thumb img {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    .conch-content .hl-item-text {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        padding: 6px 2px !important;
        min-height: 50px !important;
        background: transparent !important;
        flex: 1 !important;
    }

    .conch-content .hl-line-episode {
        font-size: 11px !important;
        color: #999 !important;
        margin-bottom: 2px !important;
        display: block !important;
    }

    .conch-content .hl-line-episode .hl-label {
        display: none !important;
    }

    .conch-content .hl-line-name {
        font-size: 12px !important;
        line-height: 16px !important;
        max-height: 32px !important;
        overflow: hidden !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        color: #333 !important;
        font-weight: 500 !important;
    }

    .conch-content .hl-line-name .hl-label {
        display: none !important;
    }

    .conch-content .hl-line-play {
        display: none !important;
    }

    /* ==================== 视频列表布局 - 移动端全部横向滑动 ==================== */
    
    /* 所有视频列表默认横向滑动 - 包括热播推荐和其他模块 */
    .conch-content .hl-vod-list {
        display: flex !important;
        flex-wrap: nowrap !important;
        margin: 0 !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
    }
    
    .conch-content .hl-vod-list::-webkit-scrollbar {
        display: none !important;
    }
    
    /* 所有视频卡片统一样式 */
    .conch-content .hl-vod-list .hl-list-item {
        flex: 0 0 auto !important;
        width: 33.333vw !important;
        max-width: 150px !important;
        min-width: 100px !important;
        padding: 0 4px !important;
        margin-bottom: 0 !important;
        float: none !important;
    }
    
    /* ==================== Swiper 兼容样式 ==================== */
    /* Swiper 容器 - 隐藏溢出 */
    .conch-content .hl-list-swiper {
        overflow: hidden !important;
        position: relative !important;
    }
    
    /* Swiper wrapper - 移除原生滚动，让Swiper控制 */
    .conch-content .hl-list-swiper .hl-vod-list.swiper-wrapper {
        overflow-x: visible !important;
    }
    
    /* Swiper 滑动项 - 保持flex属性 */
    .conch-content .hl-list-swiper .hl-vod-list.swiper-wrapper .hl-list-item.hl-slide-swiper {
        flex: 0 0 auto !important;
        width: 33.333vw !important;
        max-width: 150px !important;
        min-width: 100px !important;
    }
    
    /* 热播推荐容器特殊处理 */
    .conch-content .hl-rb-vod .hl-list-wrap {
        overflow: hidden !important;
    }
    
    .conch-content .hl-rb-vod .hl-vod-list {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
    }

    /* ==================== 全局优化 ==================== */
    body, html {
        overflow-x: hidden !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .conch-content img {
        max-width: 100% !important;
        height: auto !important;
    }

    /* 隐藏桌面端元素 */
    .conch-content .hl-pc-only {
        display: none !important;
    }
}

/* ==================== 折叠手机/超小屏 (< 360px) ==================== */
@media (max-width: 359px) {
    /* 所有视频卡片横向滑动 */
    .conch-content .hl-vod-list .hl-list-item,
    .conch-content .hl-vod-list.swiper-wrapper .hl-list-item,
    .conch-content .hl-list-swiper .hl-vod-list .hl-list-item {
        flex: 0 0 auto !important;
        width: 40vw !important;
        max-width: 140px !important;
        min-width: 100px !important;
        padding: 0 4px !important;
        margin-bottom: 0 !important;
    }

    .conch-content .hl-item-text {
        padding: 4px 2px !important;
        min-height: 44px !important;
    }

    .conch-content .hl-line-name {
        font-size: 11px !important;
        line-height: 15px !important;
    }

    /* 导航字号缩小 */
    .mobile-nav-row .mobile-nav-item a {
        font-size: 13px !important;
    }

    /* 搜索框高度减小 */
    .mobile-search-input-wrap {
        height: 36px !important;
    }

    .mobile-search-btn {
        height: 28px !important;
        padding: 0 12px !important;
        font-size: 13px !important;
    }

    /* 竖版手机(<360px)简介双行 */
    .conch-content .hl-detail-content .hl-vod-data li.blurb,
    .conch-content .hl-playinfo-wrap .hl-vod-data li.blurb {
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        width: 100% !important;
    }
}

/* ==================== 小屏手机 (360px - 479px) ==================== */
@media (min-width: 360px) and (max-width: 479px) {
    /* 所有视频卡片横向滑动 */
    .conch-content .hl-vod-list .hl-list-item,
    .conch-content .hl-vod-list.swiper-wrapper .hl-list-item,
    .conch-content .hl-list-swiper .hl-vod-list .hl-list-item {
        flex: 0 0 auto !important;
        width: 33.333vw !important;
        max-width: 150px !important;
        min-width: 110px !important;
        padding: 0 4px !important;
        margin-bottom: 0 !important;
    }
}

/* ==================== 普通手机 (480px - 599px) ==================== */
@media (min-width: 480px) and (max-width: 599px) {
    /* 所有视频卡片横向滑动 */
    .conch-content .hl-vod-list .hl-list-item,
    .conch-content .hl-vod-list.swiper-wrapper .hl-list-item,
    .conch-content .hl-list-swiper .hl-vod-list .hl-list-item {
        flex: 0 0 auto !important;
        width: 28vw !important;
        max-width: 160px !important;
        min-width: 120px !important;
        padding: 0 6px !important;
        margin-bottom: 0 !important;
    }

    .conch-content .hl-line-name {
        font-size: 13px !important;
    }
}

/* ==================== 大屏手机/小平板 (600px - 767px) ==================== */
@media (min-width: 600px) and (max-width: 767px) {
    /* 所有视频卡片横向滑动 */
    .conch-content .hl-vod-list .hl-list-item,
    .conch-content .hl-vod-list.swiper-wrapper .hl-list-item,
    .conch-content .hl-list-swiper .hl-vod-list .hl-list-item {
        flex: 0 0 auto !important;
        width: 22vw !important;
        max-width: 170px !important;
        min-width: 130px !important;
        padding: 0 6px !important;
        margin-bottom: 0 !important;
    }

    .conch-content .hl-line-name {
        font-size: 13px !important;
    }
}

/* ==================== 手机横屏 (< 768px landscape) ==================== */
@media (max-width: 767px) and (orientation: landscape) {
    /* Header 减小高度 */
    .conch-header {
        height: 44px !important;
    }

    .conch-header .hl-header-container,
    .conch-header .hl-header-top-row {
        height: 44px !important;
    }

    /* 导航跟随Header */
    .mobile-nav-row {
        top: 44px !important;
        height: 38px !important;
    }

    .mobile-nav-row .mobile-nav {
        height: 38px !important;
    }

    .mobile-nav-row .mobile-nav-item a {
        line-height: 38px !important;
        font-size: 13px !important;
    }

    /* 内容间距调整 */
    .conch-content {
        padding-top: 44px !important;
    }

    /* 搜索框减小 */
    .mobile-search-box {
        padding: 8px 0 !important;
    }

    .mobile-search-input-wrap {
        height: 36px !important;
    }

    /* Banner 减小高度 */
    .conch-content .conch-banner,
    .conch-content .hl-vod-slide {
        padding-top: 30% !important;
        margin-bottom: 8px !important;
    }

    /* 所有视频卡片横向滑动 */
    .conch-content .hl-vod-list .hl-list-item,
    .conch-content .hl-vod-list.swiper-wrapper .hl-list-item,
    .conch-content .hl-list-swiper .hl-vod-list .hl-list-item {
        flex: 0 0 auto !important;
        width: 18vw !important;
        max-width: 160px !important;
        min-width: 120px !important;
        padding: 0 4px !important;
        margin-bottom: 0 !important;
    }

    .conch-content .hl-line-name {
        font-size: 11px !important;
        line-height: 15px !important;
    }
}

/* ==================== 小屏手机横屏 (< 600px landscape) ==================== */
@media (max-width: 600px) and (orientation: landscape) {
    /* 所有视频卡片横向滑动 */
    .conch-content .hl-vod-list .hl-list-item,
    .conch-content .hl-vod-list.swiper-wrapper .hl-list-item,
    .conch-content .hl-list-swiper .hl-vod-list .hl-list-item {
        flex: 0 0 auto !important;
        width: 22vw !important;
        max-width: 150px !important;
        min-width: 110px !important;
    }
}

/* ==================== 折叠手机展开态 (901px-1100px landscape) ==================== */
@media (min-width: 901px) and (max-width: 1100px) and (orientation: landscape) {
    /* 折叠手机展开后 - 上下分栏布局 */
    .conch-content .conch-banner,
    .conch-content .hl-vod-slide {
        padding-top: 56.25% !important; /* 16:9 */
    }

    /* 所有视频卡片横向滑动 */
    .conch-content .hl-vod-list .hl-list-item,
    .conch-content .hl-vod-list.swiper-wrapper .hl-list-item,
    .conch-content .hl-list-swiper .hl-vod-list .hl-list-item {
        flex: 0 0 auto !important;
        width: 15vw !important;
        max-width: 150px !important;
        min-width: 110px !important;
    }
}

/* ==================== 平板 (768px - 1024px) ==================== */
@media (min-width: 768px) and (max-width: 1024px) {
    .conch-content .container {
        padding: 0 16px !important;
    }

    /* Banner 适当减小 */
    .conch-content .conch-banner,
    .conch-content .hl-vod-slide {
        padding-top: 40% !important;
        border-radius: 8px !important;
    }

    /* 所有视频卡片横向滑动 */
    .conch-content .hl-vod-list .hl-list-item,
    .conch-content .hl-vod-list.swiper-wrapper .hl-list-item,
    .conch-content .hl-list-swiper .hl-vod-list .hl-list-item {
        flex: 0 0 auto !important;
        width: 22vw !important;
        max-width: 180px !important;
        min-width: 140px !important;
        padding: 0 8px !important;
        margin-bottom: 0 !important;
    }



    .conch-content .hl-line-name {
        font-size: 14px !important;
        line-height: 20px !important;
    }

    .conch-content .hl-item-text {
        padding: 8px 4px !important;
        min-height: 56px !important;
    }

    .conch-content .hl-rb-head,
    .conch-content .hl-row-head {
        font-size: 18px !important;
        padding: 20px 0 16px 0 !important;
    }
}

/* ==================== 桌面端隐藏移动端元素 ==================== */
@media (min-width: 1025px) {
    .conch-content .hl-mobile-only,
    .mobile-nav-row,
    .mobile-search-box {
        display: none !important;
    }
}



/* ==================== 播放页面移动端优化 ==================== */
@media (max-width: 1024px) {
    .conch-content .hl-player-wrap {
        padding-top: 56.25% !important;
        margin: 0 -12px !important;
    }

    .conch-content .hl-vod-detail {
        padding: 16px 12px !important;
    }

    .conch-content .hl-vod-name {
        font-size: 18px !important;
        line-height: 24px !important;
        margin-bottom: 12px !important;
    }

    .conch-content .hl-vod-info {
        font-size: 13px !important;
        line-height: 20px !important;
        color: #999 !important;
    }
}

/* ==================== 详情页移动端重构优化 ==================== */

/* ==================== 1. 竖版手机 (360px-767px) ==================== */
@media (max-width: 767px) {
    /* 详情页整体布局 - 上下分栏 */
    #conch-content .hl-detail-content,
    html body #conch-content .hl-detail-content,
    html body .conch-content .hl-detail-content {
        display: flex !important;
        flex-direction: column !important;
        margin-bottom: 12px !important;
        padding: 12px !important;
        background: #fff !important;
        border-radius: 8px !important;
    }

    /* 视频封面区域 - 通栏16:9，宽度占满 */
    #conch-content .hl-detail-content .hl-dc-pic,
    html body #conch-content .hl-detail-content .hl-dc-pic,
    html body .conch-content .hl-detail-content .hl-dc-pic {
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 12px 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    /* 视频封面16:9比例，宽度占满 */
    #conch-content .hl-detail-content .hl-dc-pic .hl-item-thumb,
    html body #conch-content .hl-detail-content .hl-dc-pic .hl-item-thumb,
    html body .conch-content .hl-detail-content .hl-dc-pic .hl-item-thumb {
        padding-top: 56.25% !important; /* 16:9 */
        width: 100% !important;
        max-width: 100% !important;
        border-radius: 6px !important;
        overflow: hidden !important;
        position: relative !important;
        display: block !important;
        box-sizing: border-box !important;
    }

    /* 视频封面图片占满 */
    #conch-content .hl-detail-content .hl-dc-pic .hl-item-thumb img,
    html body #conch-content .hl-detail-content .hl-dc-pic .hl-item-thumb img,
    html body .conch-content .hl-detail-content .hl-dc-pic .hl-item-thumb img {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    /* 右侧内容区域 */
    #conch-content .hl-detail-content .hl-dc-content,
    html body #conch-content .hl-detail-content .hl-dc-content,
    html body .conch-content .hl-detail-content .hl-dc-content {
        float: none !important;
        width: 100% !important;
        padding: 0 !important;
    }

    /* 标题单行省略 */
    .conch-content .hl-detail-content .hl-dc-title {
        font-size: 16px !important;
        line-height: 22px !important;
        font-weight: 600 !important;
        color: #333 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        margin-bottom: 8px !important;
    }

    /* 信息行精简 - 只显示时长、播放量 */
    .conch-content .hl-detail-content .hl-vod-data {
        margin-bottom: 8px !important;
    }

    .conch-content .hl-detail-content .hl-vod-data ul {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
        font-size: 13px !important;
        color: #666 !important;
    }

    .conch-content .hl-detail-content .hl-vod-data li {
        display: inline-flex !important;
        align-items: center !important;
    }

    /* 竖版手机：隐藏片名、状态、VID、时长、更新（第1-5个li），保留简介（第6个li） */
    /* 使用nth-child选择器，因为HTML中没有对应的class */
    #conch-content .hl-detail-content .hl-vod-data li:nth-child(1),
    #conch-content .hl-detail-content .hl-vod-data li:nth-child(2),
    #conch-content .hl-detail-content .hl-vod-data li:nth-child(3),
    #conch-content .hl-detail-content .hl-vod-data li:nth-child(4),
    #conch-content .hl-detail-content .hl-vod-data li:nth-child(5),
    .conch-content .hl-detail-content .hl-vod-data li:nth-child(1),
    .conch-content .hl-detail-content .hl-vod-data li:nth-child(2),
    .conch-content .hl-detail-content .hl-vod-data li:nth-child(3),
    .conch-content .hl-detail-content .hl-vod-data li:nth-child(4),
    .conch-content .hl-detail-content .hl-vod-data li:nth-child(5) {
        display: none !important;
    }

    /* 隐藏副标题 */
    .conch-content .hl-detail-content .hl-dc-sub {
        display: none !important;
    }

    /* 简介双行超出收起 - 竖版手机默认显示双行（第6个li是简介） */
    #conch-content .hl-detail-content .hl-vod-data li:nth-child(6),
    .conch-content .hl-detail-content .hl-vod-data li:nth-child(6) {
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        width: 100% !important;
    }

    /* 工具图标横排 */
    .conch-content .hl-detail-content .hl-tool-icon {
        margin: 8px 0 !important;
    }

    .conch-content .hl-detail-content .hl-tool-icon ul {
        display: flex !important;
        flex-direction: row !important;
        gap: 16px !important;
    }

    /* 播放按钮区域 */
    .conch-content .hl-detail-content .hl-dc-btns {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        margin-top: 8px !important;
    }

    .conch-content .hl-detail-content .hl-dc-btns a.hl-play-btn {
        flex: 1 !important;
        text-align: center !important;
        border-radius: 20px !important;
        font-size: 14px !important;
        height: 36px !important;
        line-height: 36px !important;
    }

    /* 隐藏来源选择按钮 */
    .conch-content .hl-detail-content .hl-dc-btns .hl-form-wb,
    .conch-content .hl-detail-content .hl-dc-btns a.hl-from-btn {
        display: none !important;
    }

    /* 剧集列表 - 竖版3个/行 */
    /* 使用最高优先级选择器覆盖style.css - 直接覆盖li样式 */
    html body .conch-content .hl-play-source .hl-tabs-box .hl-plays-list,
    html body #conch-content .hl-play-source .hl-tabs-box .hl-plays-list {
        display: flex !important;
        flex-wrap: wrap !important;
        margin: 0 -4px !important;
        padding: 0 !important;
        list-style: none !important;
        overflow: visible !important;
    }

    /* 覆盖hl-col-xs-4的固定宽度样式 */
    html body .conch-content .hl-play-source .hl-tabs-box .hl-plays-list > li.hl-col-xs-4,
    html body #conch-content .hl-play-source .hl-tabs-box .hl-plays-list > li.hl-col-xs-4,
    html body .conch-content .hl-play-source .hl-plays-list > li.hl-col-xs-4,
    html body #conch-content .hl-play-source .hl-plays-list > li.hl-col-xs-4 {
        flex: 0 0 33.333% !important;
        width: 33.333% !important;
        max-width: 33.333% !important;
        padding: 4px !important;
        box-sizing: border-box !important;
        margin: 0 0 8px 0 !important;
        float: none !important;
        display: block !important;
    }

    html body .conch-content .hl-play-source .hl-tabs-box .hl-plays-list > li > a,
    html body #conch-content .hl-play-source .hl-tabs-box .hl-plays-list > li > a {
        display: block !important;
        text-align: center !important;
        padding: 10px 4px !important;
        font-size: 13px !important;
        border-radius: 4px !important;
        background: #f5f5f5 !important;
        color: #333 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        text-decoration: none !important;
        line-height: 20px !important;
        position: relative !important;
    }

    /* 隐藏"为你推荐"模块 */
    .conch-content .hl-vod-recommend,
    .conch-content .hl-recommend-box,
    .conch-content .hl-detail-recommend {
        display: none !important;
    }
}

/* ==================== 2. 横版手机 (横屏 < 768px) ==================== */
@media (max-width: 767px) and (min-aspect-ratio: 4/3) {
    /* 详情页整体布局 - 左右分栏 */
    html body .conch-content .hl-detail-content {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        margin-bottom: 12px !important;
        padding: 12px !important;
        background: #fff !important;
        border-radius: 8px !important;
    }

    /* 左侧视频封面 - 45%宽度 */
    html body .conch-content .hl-detail-content .hl-dc-pic {
        float: none !important;
        width: 45% !important;
        max-width: 45% !important;
        margin: 0 !important;
        padding: 0 !important;
        flex-shrink: 0 !important;
        box-sizing: border-box !important;
    }

    /* 视频封面16:9 */
    html body .conch-content .hl-detail-content .hl-dc-pic .hl-item-thumb {
        padding-top: 56.25% !important;
        width: 100% !important;
        max-width: 100% !important;
        border-radius: 6px !important;
        overflow: hidden !important;
        position: relative !important;
        box-sizing: border-box !important;
    }

    /* 视频封面图片占满 */
    html body .conch-content .hl-detail-content .hl-dc-pic .hl-item-thumb img {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    /* 右侧内容区域 - 55%宽度 */
    html body .conch-content .hl-detail-content .hl-dc-content {
        float: none !important;
        width: 55% !important;
        padding: 0 0 0 12px !important;
        display: flex !important;
        flex-direction: column !important;
    }

    /* 标题单行省略 */
    .conch-content .hl-detail-content .hl-dc-title {
        font-size: 14px !important;
        line-height: 20px !important;
        font-weight: 600 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        margin-bottom: 6px !important;
    }

    /* 隐藏副标题 */
    .conch-content .hl-detail-content .hl-dc-sub {
        display: none !important;
    }

    /* 信息行精简 */
    .conch-content .hl-detail-content .hl-vod-data {
        margin-bottom: 6px !important;
        font-size: 12px !important;
    }

    /* 简介默认收起 */
    .conch-content .hl-detail-content .hl-vod-data li.blurb,
    .conch-content .hl-playinfo-wrap .hl-vod-data li.blurb {
        display: none !important;
    }

    /* 工具图标 */
    .conch-content .hl-detail-content .hl-tool-icon {
        margin: 6px 0 !important;
    }

    .conch-content .hl-detail-content .hl-tool-icon ul {
        display: flex !important;
        flex-direction: row !important;
        gap: 12px !important;
    }

    /* 播放按钮 */
    .conch-content .hl-detail-content .hl-dc-btns {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        margin-top: 6px !important;
    }

    .conch-content .hl-detail-content .hl-dc-btns a.hl-play-btn {
        padding: 0 16px !important;
        border-radius: 16px !important;
        font-size: 13px !important;
        height: 32px !important;
        line-height: 32px !important;
    }

    /* 隐藏来源选择 */
    .conch-content .hl-detail-content .hl-dc-btns .hl-form-wb,
    .conch-content .hl-detail-content .hl-dc-btns a.hl-from-btn {
        display: none !important;
    }

    /* 剧集列表 - 横屏4个/行 */
    .conch-content .hl-playlist-side .hl-plays-list {
        display: flex !important;
        flex-wrap: wrap !important;
        margin: 0 -4px !important;
    }

    .conch-content .hl-playlist-side .hl-plays-list li {
        flex: 0 0 25% !important;
        width: 25% !important;
        max-width: 25% !important;
        padding: 4px !important;
        box-sizing: border-box !important;
    }

    .conch-content .hl-playlist-side .hl-plays-list li a {
        display: block !important;
        text-align: center !important;
        padding: 6px 4px !important;
        font-size: 12px !important;
        border-radius: 4px !important;
        background: #f5f5f5 !important;
        color: #333 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    /* 横屏精简页脚 */
    .conch-content .conch-footer {
        padding: 12px !important;
        font-size: 12px !important;
    }

    .conch-content .conch-footer .container {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
    }
}

/* ==================== 3. 折叠屏手机（展开态 901px-1100px landscape） ==================== */
@media (min-width: 901px) and (max-width: 1100px) and (orientation: landscape) {
    /* 详情页上下分栏 */
    html body .conch-content .hl-detail-content {
        display: flex !important;
        flex-direction: column !important;
        margin-bottom: 12px !important;
        padding: 12px !important;
        background: #fff !important;
        border-radius: 8px !important;
    }

    /* 针对详情页的列 - 强制上下堆叠 */
    html body .conch-content .hl-has-item .hl-col-md-70w,
    html body .conch-content .hl-has-item .hl-col-md-30w,
    html body .conch-content .hl-has-item .hl-col-lg-9,
    html body .conch-content .hl-has-item .hl-col-lg-3 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        float: none !important;
    }

    /* 视频封面通栏 - 宽度占满 */
    html body .conch-content .hl-detail-content .hl-dc-pic {
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 12px 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    html body .conch-content .hl-detail-content .hl-dc-pic .hl-item-thumb {
        padding-top: 56.25% !important;
        width: 100% !important;
        max-width: 100% !important;
        border-radius: 6px !important;
        box-sizing: border-box !important;
    }

    /* 视频封面图片占满 */
    html body .conch-content .hl-detail-content .hl-dc-pic .hl-item-thumb img {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    /* 内容区域 */
    html body .conch-content .hl-detail-content .hl-dc-content {
        float: none !important;
        width: 100% !important;
        padding: 0 !important;
    }

    /* 侧边栏剧集列表显示在下方 */
    html body .conch-content .hl-detail-side {
        width: 100% !important;
        margin-top: 16px !important;
    }

    /* 标题 */
    .conch-content .hl-detail-content .hl-dc-title {
        font-size: 16px !important;
        line-height: 22px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        margin-bottom: 8px !important;
    }

    /* 隐藏副标题 */
    .conch-content .hl-detail-content .hl-dc-sub {
        display: none !important;
    }

    /* 简介默认收起 - 折叠屏默认不显示简介 */
    .conch-content .hl-detail-content .hl-vod-data li.blurb,
    .conch-content .hl-playinfo-wrap .hl-vod-data li.blurb {
        display: none !important;
    }

    /* 剧集列表 - 折叠屏6个/行 */
    .conch-content .hl-playlist-side .hl-plays-list {
        display: flex !important;
        flex-wrap: wrap !important;
        margin: 0 -4px !important;
    }

    .conch-content .hl-playlist-side .hl-plays-list li {
        flex: 0 0 16.666% !important;
        width: 16.666% !important;
        max-width: 16.666% !important;
        padding: 4px !important;
        box-sizing: border-box !important;
    }

    .conch-content .hl-playlist-side .hl-plays-list li a {
        display: block !important;
        text-align: center !important;
        padding: 8px 4px !important;
        font-size: 13px !important;
        border-radius: 4px !important;
        background: #f5f5f5 !important;
        color: #333 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
}

/* ==================== 4. 平板 (768px-1024px) ==================== */
@media (min-width: 768px) and (max-width: 1024px) {
    /* 详情页上下分栏 */
    html body .conch-content .hl-detail-content {
        display: flex !important;
        flex-direction: column !important;
        margin-bottom: 16px !important;
        padding: 16px !important;
        background: #fff !important;
        border-radius: 8px !important;
    }

    /* 视频封面通栏 - 宽度占满 */
    html body .conch-content .hl-detail-content .hl-dc-pic {
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 16px 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    html body .conch-content .hl-detail-content .hl-dc-pic .hl-item-thumb {
        padding-top: 56.25% !important;
        width: 100% !important;
        max-width: 100% !important;
        border-radius: 8px !important;
        box-sizing: border-box !important;
    }

    /* 视频封面图片占满 */
    html body .conch-content .hl-detail-content .hl-dc-pic .hl-item-thumb img {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    /* 内容区域 */
    html body .conch-content .hl-detail-content .hl-dc-content {
        float: none !important;
        width: 100% !important;
        padding: 0 !important;
    }

    /* 标题 */
    .conch-content .hl-detail-content .hl-dc-title {
        font-size: 18px !important;
        line-height: 24px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        margin-bottom: 10px !important;
    }

    /* 隐藏副标题 */
    .conch-content .hl-detail-content .hl-dc-sub {
        display: none !important;
    }

    /* 简介默认3行 - 平板显示3行 */
    .conch-content .hl-detail-content .hl-vod-data li.blurb,
    .conch-content .hl-playinfo-wrap .hl-vod-data li.blurb {
        display: -webkit-box !important;
        -webkit-line-clamp: 3 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        width: 100% !important;
        margin-top: 8px !important;
    }

    /* 剧集列表 - 平板6个/行 */
    .conch-content .hl-playlist-side .hl-plays-list {
        display: flex !important;
        flex-wrap: wrap !important;
        margin: 0 -6px !important;
    }

    .conch-content .hl-playlist-side .hl-plays-list li {
        flex: 0 0 16.666% !important;
        width: 16.666% !important;
        max-width: 16.666% !important;
        padding: 6px !important;
        box-sizing: border-box !important;
    }

    .conch-content .hl-playlist-side .hl-plays-list li a {
        display: block !important;
        text-align: center !important;
        padding: 10px 6px !important;
        font-size: 14px !important;
        border-radius: 6px !important;
        background: #f5f5f5 !important;
        color: #333 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
}

/* ==================== 保留原有详情页样式作为后备 ==================== */
@media (max-width: 1024px) {
    /* 左侧缩略图区域 - 竖版手机通栏，其他设备占40%宽度 */
    html body .conch-content .hl-detail-content .hl-dc-pic {
        float: none !important;
        width: 100% !important;
        margin: 0 0 12px 0 !important;
        padding: 0 !important;
        flex-shrink: 0 !important;
        flex-grow: 0 !important;
        overflow: hidden !important;
    }

    /* 图片使用16:9比例，填满容器 */
    html body .conch-content .hl-detail-content .hl-dc-pic .hl-item-thumb {
        padding-top: 56.25% !important; /* 16:9 */
        width: 100% !important;
        max-width: 100% !important;
        border-radius: 6px !important;
        overflow: hidden !important;
        position: relative !important;
        display: block !important;
        height: auto !important;
        box-sizing: border-box !important;
    }
    
    /* 图片本身 */
    html body .conch-content .hl-detail-content .hl-dc-pic .hl-item-thumb img {
        max-width: 100% !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
    }

    /* 右侧内容区域 - 竖版手机通栏 */
    html body .conch-content .hl-detail-content .hl-dc-content {
        float: none !important;
        width: 100% !important;
        padding: 0 !important;
        display: flex !important;
        flex-direction: column !important;
    }

    /* 标题区域 - 更紧凑 */
    .conch-content .hl-detail-content .hl-dc-headwrap {
        margin-bottom: 8px !important;
        display: block !important;
        visibility: visible !important;
    }

    .conch-content .hl-detail-content .hl-dc-title {
        font-size: 16px !important;
        line-height: 22px !important;
        font-weight: 600 !important;
        color: #333 !important;
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        max-height: 44px !important;
        overflow: hidden !important;
    }

    /* 隐藏副标题，节省空间 */
    .conch-content .hl-detail-content .hl-dc-sub {
        display: none !important;
    }

    /* 视频信息列表 - 精简显示 */
    .conch-content .hl-detail-content .hl-vod-data {
        padding-bottom: 0 !important;
        margin-bottom: 8px !important;
        flex: 1 !important;
    }

    /* 隐藏弹窗头部和标题 */
    .conch-content .hl-vod-data .hl-data-sm .hl-full-head,
    .conch-content .hl-vod-data .hl-data-sm .hl-full-title,
    .conch-content .hl-vod-data .hl-data-sm .hl-item-pic {
        display: none !important;
    }

    /* 隐藏移动端的展开按钮 */
    .conch-content .hl-vod-data .hl-data-xs {
        display: none !important;
    }

    /* 弹窗内容直接显示 */
    .conch-content .hl-vod-data .hl-data-sm {
        position: static !important;
        width: auto !important;
        height: auto !important;
        background: transparent !important;
        z-index: auto !important;
        transform: none !important;
        transition: none !important;
    }

    .conch-content .hl-vod-data .hl-full-box {
        padding: 0 !important;
    }

    .conch-content .hl-vod-data ul {
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
        display: flex !important;
        flex-direction: column !important;
    }

    .conch-content .hl-vod-data li {
        margin-bottom: 3px !important;
        padding-left: 0 !important;
        font-size: 11px !important;
        line-height: 16px !important;
        color: #666 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        display: block !important;
    }

    /* 信息项标签样式 */
    .conch-content .hl-vod-data li em {
        display: inline !important;
        font-style: normal !important;
    }

    .conch-content .hl-vod-data li em:first-child {
        color: #999 !important;
        margin-right: 2px !important;
    }

    /* 简介显示 - 默认显示1行，具体设备在各自媒体查询中覆盖 */
    .conch-content .hl-vod-data li.blurb {
        display: -webkit-box !important;
        -webkit-line-clamp: 1 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        width: 100% !important;
    }

    /* 隐藏片名、状态等冗余信息 */
    .conch-content .hl-vod-data li.hl-vod-name,
    .conch-content .hl-vod-data li.hl-hide-sm {
        display: none !important;
    }

    .conch-content .hl-vod-data li em.hl-text-muted {
        margin-left: 0 !important;
        color: #999 !important;
        font-size: 11px !important;
    }

    /* 简介显示由各自媒体查询控制 */

    /* 工具图标区域 - 改为横排 */
    .conch-content .hl-detail-content .hl-tool-icon {
        position: relative !important;
        bottom: auto !important;
        left: auto !important;
        width: 100% !important;
        margin-top: 0 !important;
        padding-top: 8px !important;
        border-top: none !important;
        height: auto !important;
    }

    .conch-content .hl-tool-icon ul {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 16px !important;
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
    }

    .conch-content .hl-tool-icon li {
        float: none !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
    }

    .conch-content .hl-tool-icon a {
        display: flex !important;
        align-items: center !important;
        height: 32px !important;
        line-height: 32px !important;
        font-size: 18px !important;
        color: #666 !important;
        text-decoration: none !important;
    }

    .conch-content .hl-tool-icon a em {
        font-size: 12px !important;
        margin-left: 4px !important;
        color: #999 !important;
    }

    /* 隐藏部分工具图标，保持简洁 */
    .conch-content .hl-tool-icon li.hl-list-qrcode,
    .conch-content .hl-tool-icon li.hl-list-weixin,
    .conch-content .hl-tool-icon li.hl-list-mqrcode {
        display: none !important;
    }

    /* 按钮区域 - 全宽横排 */
    .conch-content .hl-detail-content .hl-dc-btns {
        position: relative !important;
        bottom: auto !important;
        left: auto !important;
        width: 100% !important;
        margin-top: 12px !important;
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        order: 99 !important; /* 放在最后 */
    }

    .conch-content .hl-detail-content .hl-dc-btns a {
        float: none !important;
        line-height: 40px !important;
    }

    /* 立即播放按钮 - 主要按钮 */
    .conch-content .hl-detail-content .hl-dc-btns a.hl-play-btn {
        flex: 1 !important;
        margin: 0 !important;
        width: auto !important;
        text-align: center !important;
        border-radius: 20px !important;
        font-size: 15px !important;
        font-weight: 500 !important;
        height: 40px !important;
        line-height: 40px !important;
    }

    /* 隐藏来源选择按钮 */
    .conch-content .hl-detail-content .hl-dc-btns .hl-form-wb,
    .conch-content .hl-detail-content .hl-dc-btns a.hl-from-btn {
        display: none !important;
    }

    /* 宽图模式也统一处理 */
    .conch-content .hl-detail-content.hl-wide-items {
        flex-direction: row !important;
        margin-bottom: 12px !important;
    }

    .conch-content .hl-detail-content.hl-wide-items .hl-dc-pic {
        padding-right: 0 !important;
        width: 38% !important;
    }

    .conch-content .hl-detail-content.hl-wide-items .hl-dc-content {
        padding-left: 12px !important;
        width: 62% !important;
    }

    .conch-content .hl-detail-content.hl-wide-items .hl-vod-data {
        padding-bottom: 0 !important;
    }

    .conch-content .hl-detail-content.hl-wide-items .hl-dc-btns .hl-form-wb,
    .conch-content .hl-detail-content.hl-wide-items .hl-dc-sub {
        display: none !important;
    }

    /* 隐藏剧集列表标题的图标装饰 */
    .conch-content .hl-play-title {
        font-size: 14px !important;
        padding: 12px 0 8px 0 !important;
    }

    /* 剧集按钮更紧凑 */
    .conch-content .hl-plays-list a {
        padding: 8px 12px !important;
        font-size: 13px !important;
        margin: 0 6px 6px 0 !important;
    }
}

/* ==================== 折叠屏手机特殊适配 ==================== */
@media (max-width: 400px) {
    .conch-content .hl-detail-content .hl-dc-title {
        font-size: 14px !important;
        line-height: 20px !important;
    }

    .conch-content .hl-vod-data li {
        font-size: 11px !important;
        line-height: 16px !important;
    }

    .conch-content .hl-tool-icon ul {
        gap: 12px !important;
    }

    .conch-content .hl-tool-icon a {
        font-size: 16px !important;
    }

    .conch-content .hl-detail-content .hl-dc-btns a.hl-play-btn {
        font-size: 14px !important;
        height: 36px !important;
        line-height: 36px !important;
    }
}

/* ==================== 横屏模式优化（已合并到上方媒体查询） ==================== */