/* ==========================================================================
   全网热点 - 通用广告系统 (Universal Ad System)
   模块化规范:
   1. 【统一卡片规范】: .unified-ad-card (16:9 黄金比例自适应卡片)
      - .image-card : 纯图片海报卡片
      - .text-card  : 纯文字极简卡片 (单背景色 + 居中文案)
      - .empty-card : 待申请招商虚线卡片
   2. 【通用侧栏布局】: .ad-sidebar-layout (双侧悬浮栏 + 中间自适应内容)
      - .ad-sidebar.left  : 左侧广告悬浮栏 (大屏展示，中屏/小屏自动隐藏)
      - .ad-sidebar.right : 右侧广告悬浮栏 (大屏/中屏展示，小屏自动隐藏)
      - .ad-main-content  : 中间页面主内容区 (自适应 820px 居中)
   3. 【流内插播卡片】: .ad-stream-item (PC卡片网格与移动端时间轴无缝嵌入)
   ========================================================================== */

/* 统一广告角标 (半透明低调合规角标) */
.ad-tag,
.linux-ad-tag {
    position: absolute;
    bottom: 6px;
    right: 6px;
    font-size: 9.5px;
    line-height: 1.2;
    padding: 1.5px 5.5px;
    border-radius: 3px;
    background: rgba(0, 0, 0, 0.58);
    color: #ffffff;
    font-weight: 500;
    pointer-events: none;
    z-index: 5;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    letter-spacing: 0.5px;
}

/* ==========================================================================
   一、核心卡片规范: .unified-ad-card (标准 16:9 黄金自适应卡片)
   ========================================================================== */
.unified-ad-card {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 10px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    text-decoration: none;
    background: var(--card-bg, #ffffff);
    border: 1px solid var(--border-color, rgba(0, 0, 0, 0.08));
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.2s ease;
    cursor: pointer;
}

.unified-ad-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.09);
    border-color: rgba(59, 130, 246, 0.35);
}

/* 1. 纯图片广告卡片 (.image-card) */
.unified-ad-card.image-card {
    background: #090d16;
    line-height: 0;
}

.unified-ad-card.image-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 9px;
    transition: filter 0.2s ease;
}

.unified-ad-card.image-card:hover img {
    filter: brightness(1.02);
}

/* 2. 纯文字广告卡片 (.text-card) - 纯背景色 + 居中文案，与图片卡片 1:1 等大 */
.unified-ad-card.text-card {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 16px 20px;
    box-sizing: border-box;
    user-select: none;
    text-decoration: none;
}

.unified-ad-card.text-card .ad-pure-text {
    font-size: 16px;
    font-weight: 700;
    color: #ffffff;
    line-height: 1.5;
    letter-spacing: 0.5px;
    word-break: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
    margin: 0;
}

@media (min-width: 768px) {
    .unified-ad-card.text-card .ad-pure-text {
        font-size: 16.5px;
    }
}

/* 广告主自选背景色库 */
.unified-ad-card.text-card.theme-blue {
    background: #2563eb;
}

.unified-ad-card.text-card.theme-dark {
    background: #0f172a;
}

.unified-ad-card.text-card.theme-purple {
    background: #7c3aed;
}

.unified-ad-card.text-card.theme-orange {
    background: #ea580c;
}

.unified-ad-card.text-card.theme-emerald {
    background: #059669;
}

.unified-ad-card.text-card.theme-cyan {
    background: #0284c7;
}

.unified-ad-card.text-card.theme-red {
    background: #dc2626;
}

.unified-ad-card.text-card.theme-indigo {
    background: #4338ca;
}

/* 3. 待申请招商卡片 (.empty-card) - 占位大小同样 16:9 完全一致 */
.unified-ad-card.empty-card {
    background: var(--bg-hover, #f8fafc);
    border: 1.5px dashed var(--border-color, #cbd5e1);
    box-shadow: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 4px;
    color: var(--text-muted, #64748b);
    padding: 12px;
}

.unified-ad-card.empty-card:hover {
    background: rgba(59, 130, 246, 0.05);
    border-color: var(--accent-color, #3b82f6);
    color: var(--accent-color, #3b82f6);
    transform: translateY(-2px);
}

.unified-ad-card.empty-card .empty-icon {
    font-size: 22px;
    line-height: 1;
    opacity: 0.7;
    margin-bottom: 2px;
}

.unified-ad-card.empty-card .empty-title {
    font-size: 12.5px;
    font-weight: 700;
}

.unified-ad-card.empty-card .empty-sub {
    font-size: 10.5px;
    color: var(--text-muted, #94a3b8);
}

/* ==========================================================================
   二、通用侧边栏卡片盒容器 (.ad-box)
   ========================================================================== */
.ad-box,
.linux-ad-box {
    background: var(--card-bg, #ffffff);
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 12px;
    padding: 10px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
    box-sizing: border-box;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;
    transition: box-shadow 0.2s ease;
}

.ad-box:hover,
.linux-ad-box:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
}

/* 广告盒底部提示栏 */
.ad-footer-note,
.linux-ad-footer-note {
    padding-top: 6px;
    border-top: 1px dashed var(--border-color, #f1f5f9);
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 10.5px;
    color: var(--text-muted, #94a3b8);
}

.ad-footer-note .tag,
.linux-ad-footer-note .tag {
    font-size: 9.5px;
    padding: 1px 5px;
    border-radius: 3px;
    background: rgba(150, 150, 150, 0.12);
    color: var(--text-muted, #888);
}

/* ==========================================================================
   三、通用双侧栏广告页面布局 (.ad-sidebar-layout)
   适用于: 首页列表视图、今日热点早报页面、下载页及任何需要侧栏广告的页面
   ========================================================================== */

/* 1. 彻底解除 PC 端时间轴视图限制，防止挤压列表与阻断 window 滚动 sticky 悬浮 */
@media (min-width: 769px) {
    .timeline-view {
        max-width: 100% !important;
        width: 100% !important;
        margin: 0 auto !important;
        padding: 0 !important;
        overflow: visible !important;
        overflow-x: visible !important;
        overflow-y: visible !important;
        box-sizing: border-box;
    }
}

.ad-sidebar-layout,
.timeline-pc-layout-wrapper,
.daily-report-layout-wrap {
    width: 100%;
    position: relative;
    box-sizing: border-box;
}

/* 2. 侧栏基础样式与统一悬浮属性 */
.ad-sidebar,
.timeline-pc-sidebar,
.daily-report-side-ad {
    width: 260px;
    flex-shrink: 0;
    position: -webkit-sticky;
    position: sticky;
    display: flex;
    flex-direction: column;
    gap: 16px;
    z-index: 10;
    align-self: flex-start;
}

/* 首页列表模式下：粘顶距离为 122px (避开 60px 顶栏 + 48px 分类栏 + 14px 呼吸间距) */
.timeline-pc-sidebar,
.timeline-pc-layout-wrapper .ad-sidebar {
    top: 122px;
}

/* 今日热点模式下：粘顶距离为 82px (避开 60px 顶栏 + 22px 呼吸间距) */
.daily-report-side-ad,
.daily-report-layout-wrap .ad-sidebar {
    top: 82px;
}

/* 扩展类：若需要关闭悬浮（随页面滚动），只需在父容器添加 .no-sticky */
.ad-sidebar-layout.no-sticky .ad-sidebar,
.ad-sidebar.no-sticky {
    position: static !important;
}

/* 3. 中间主内容区规范 */
.ad-main-content,
.timeline-pc-main-col,
.daily-report-layout-wrap .report-content {
    min-width: 0;
    box-sizing: border-box;
}

.timeline-pc-main-col .timeline-container {
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
}

/* ==========================================================================
   响应式断点与间距规范 (彻底解决大屏贴得太近的问题)
   ========================================================================== */

/* --- 断点一：大屏/超宽屏显示器 (>=1600px，如 1080P 全屏、2K、4K 显示器) --- */
/* 间距拉大到 60px 宽阔呼吸留白，让广告自然退后至视线外缘，再无压迫感 */
@media (min-width: 1600px) {
    .ad-sidebar-layout,
    .timeline-pc-layout-wrapper,
    .daily-report-layout-wrap {
        display: flex;
        justify-content: center;
        align-items: flex-start;
        gap: 60px; /* 大屏宽阔留白，解决用户反馈的“大屏上距离中间太近”问题 */
        max-width: 1560px;
        margin: 0 auto;
        padding: 0 24px;
    }

    .ad-main-content,
    .timeline-pc-main-col,
    .daily-report-layout-wrap .report-content {
        flex: 0 1 820px;
        width: 820px;
        max-width: 820px;
    }

    .daily-report-layout-wrap .report-content {
        margin: 0 !important;
        padding-top: 36px;
    }
}

/* --- 断点二：标准桌面与大屏笔记本 (1360px - 1599px) --- */
@media (min-width: 1360px) and (max-width: 1599px) {
    .ad-sidebar-layout,
    .timeline-pc-layout-wrapper,
    .daily-report-layout-wrap {
        display: flex;
        justify-content: center;
        align-items: flex-start;
        gap: 36px; /* 笔记本屏适度留白 */
        max-width: 1400px;
        margin: 0 auto;
        padding: 0 16px;
    }

    .ad-main-content,
    .timeline-pc-main-col,
    .daily-report-layout-wrap .report-content {
        flex: 1 1 800px;
        max-width: 800px;
    }

    .daily-report-layout-wrap .report-content {
        margin: 0 !important;
        padding-top: 36px;
    }
}

/* --- 断点三：便携笔记本与小屏桌面 (1100px - 1359px) --- */
/* 自动隐藏左侧栏，保留右侧栏，给中间正文留足舒适空间 */
@media (min-width: 1100px) and (max-width: 1359px) {
    .ad-sidebar-layout,
    .timeline-pc-layout-wrapper,
    .daily-report-layout-wrap {
        display: flex;
        justify-content: center;
        align-items: flex-start;
        gap: 32px;
        max-width: 1140px;
        margin: 0 auto;
        padding: 0 16px;
    }

    .ad-sidebar.left,
    .timeline-pc-sidebar.left-sidebar,
    .daily-report-side-ad.left-ad {
        display: none !important;
    }

    .ad-sidebar.right,
    .timeline-pc-sidebar.right-sidebar,
    .daily-report-side-ad.right-ad {
        display: flex !important;
    }

    .ad-main-content,
    .timeline-pc-main-col,
    .daily-report-layout-wrap .report-content {
        flex: 1;
        max-width: 800px;
    }

    .daily-report-layout-wrap .report-content {
        margin: 0 !important;
        padding-top: 36px;
    }
}

/* --- 断点四：平板与移动端 (<1100px) --- */
/* 自动隐藏双侧栏，主内容自适应居中 */
@media (max-width: 1099px) {
    .ad-sidebar,
    .timeline-pc-sidebar,
    .daily-report-side-ad {
        display: none !important;
    }

    .daily-report-layout-wrap .report-content {
        max-width: 820px;
        margin: 0 auto;
        padding: 20px 16px 0;
        width: 100%;
        box-sizing: border-box;
    }

    /* 列表视图中间列在小屏时严禁附加内边距，完全交由时间轴自身原生容器控制，防止移动端缩窄 */
    .timeline-pc-main-col {
        max-width: 820px;
        margin: 0 auto;
        padding: 0 !important;
        width: 100%;
        box-sizing: border-box;
    }
}

@media (max-width: 768px) {
    .timeline-pc-layout-wrapper {
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    .timeline-pc-main-col {
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* ==========================================================================
   四、PC 卡片网格插播广告 (.ad-grid-item / .grid-ad-unified-wrap)
   保持标准卡片外观（带卡片标题栏、圆角、背景），卡片体内嵌入 16:9 广告
   ========================================================================== */
.node-card.ad-grid-item,
.node-card.grid-ad-unified-wrap {
    align-self: start;
    display: flex;
    flex-direction: column;
}

.node-card.grid-ad-unified-wrap .ad-card-body {
    padding: 12px;
    max-height: none !important;
    overflow: visible !important;
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-sizing: border-box;
}

.node-card.grid-ad-unified-wrap .ad-card-body .unified-ad-card {
    width: 100%;
    margin: 0;
    border-radius: 8px;
}

/* ==========================================================================
   五、移动端时间轴原生广告 (.timeline-ad-item)
   左侧保留圆形图标与贯通轴线（绝不挡线），标题栏展示赞助推荐（广告），右侧卡片角标直接在图片/文字卡片上
   ========================================================================== */
.timeline-item.timeline-ad-item {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

/* 消除多余点位，仅保留左侧主轴线和顶部圆形图标 */
.timeline-item.timeline-ad-item::after {
    display: none !important;
}

.timeline-ad-right {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.timeline-ad-right .timeline-content-wrapper {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    padding: 0 !important;
}

.timeline-ad-right .unified-ad-card {
    width: 100%;
    margin: 0;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

/* PC 列表模式已拥有专属左右双侧栏广告，列表中无需重复展示推广条目 */
@media (min-width: 1100px) {
    .timeline-pc-layout-wrapper .timeline-ad-item,
    .timeline-pc-layout-wrapper .ad-stream-item,
    .timeline-pc-layout-wrapper .timeline-item.mock-ad-mobile-wrapper {
        display: none !important;
    }
}

/* ==========================================================================
   六、页面通用心情语录 / 尾部元素独立居中
   ========================================================================== */
.daily-quote {
    clear: both;
    width: 100%;
    max-width: 820px;
    margin: 30px auto 40px !important;
    padding: 20px 20px 40px;
    text-align: center;
    box-sizing: border-box;
}