/**
 * 清爽调研报告风格 - 基础样式表
 * 版本: 3.0.0
 * 更新: 2026-03-06
 * 
 * 专业调研报告设计系统
 * 包含完整的CSS变量、组件样式、响应式布局
 * 默认包含：多色调色板、Mesh Gradient背景、毛玻璃导航、色彩发光阴影
 */

/* ==================== CSS 变量定义 ==================== */
:root {
    /* ============ 主色调（语义化） ============ */
    --color-success: #059669;           /* Emerald：核心/正向/成功 */
    --color-success-light: #10B981;     /* Emerald 亮色 */
    --color-danger: #E11D48;            /* Rose：警告/风险/关键 */
    --color-danger-light: #F43F5E;      /* Rose 亮色 */
    --color-warning: #D97706;           /* Amber：类比/提示/辅助 */
    --color-warning-light: #F59E0B;     /* Amber 亮色 */
    --color-info: #2563EB;              /* Blue：信息/技术/链接 */
    --color-info-light: #3B82F6;        /* Blue 亮色 */
    --color-purple: #7C3AED;            /* Violet：洞察/元认知/高级 */
    --color-purple-light: #8B5CF6;      /* Violet 亮色 */
    
    /* ============ 中性色（高对比度）============ */
    --color-text-primary: #1C1917;
    --color-text-secondary: #57534E;
    --color-text-muted: #78716C;
    --color-border: #E7E5E4;
    --color-border-light: #F5F5F4;
    --color-bg: #F8FAFB;
    --color-bg-card: #FFFFFF;
    --color-bg-table-header: #FAFAF9;
    
    /* ============ 渐变色 ============ */
    --gradient-success: linear-gradient(135deg, #059669 0%, #10B981 100%);
    --gradient-hero: linear-gradient(135deg, #059669 0%, #2563EB 50%, #7C3AED 100%);
    --gradient-badge: linear-gradient(135deg, #ECFDF5 0%, #EFF6FF 100%);
    --gradient-highlight: linear-gradient(135deg, rgba(5,150,105,0.08) 0%, rgba(5,150,105,0.03) 100%);
    --gradient-mesh: 
        radial-gradient(at 20% 20%, rgba(5,150,105,0.08) 0%, transparent 50%),
        radial-gradient(at 80% 80%, rgba(37,99,235,0.06) 0%, transparent 50%),
        radial-gradient(at 50% 50%, rgba(124,58,237,0.04) 0%, transparent 50%);
    
    /* ============ 阴影层级 ============ */
    --shadow-xs: 0 1px 2px rgba(0,0,0,0.04);
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
    --shadow-card: 0 2px 8px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
    --shadow-md: 0 4px 6px -1px rgba(0,0,0,0.07), 0 2px 4px -2px rgba(0,0,0,0.04);
    --shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.08), 0 4px 6px -4px rgba(0,0,0,0.04);
    --shadow-xl: 0 20px 25px -5px rgba(0,0,0,0.08), 0 8px 10px -6px rgba(0,0,0,0.03);
    --shadow-glow-success: 0 4px 14px rgba(5,150,105,0.15);
    --shadow-glow-info: 0 4px 14px rgba(37,99,235,0.15);
    --shadow-glow-purple: 0 4px 14px rgba(124,58,237,0.15);
    --shadow-hover: 0 6px 16px rgba(5,150,105,0.15), 0 2px 6px rgba(5,150,105,0.1);
    
    /* ============ 间距系统（8px基准） ============ */
    --spacing-xs: 4px;      /* 最小间距 */
    --spacing-sm: 8px;      /* 小间距 */
    --spacing-md: 16px;     /* 中等间距 */
    --spacing-lg: 24px;     /* 大间距 */
    --spacing-xl: 32px;     /* 特大间距 */
    --spacing-2xl: 40px;    /* 章节间距 */
    --spacing-3xl: 48px;    /* 页脚间距 */
    
    /* ============ 圆角系统 ============ */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 20px;
    --radius-2xl: 24px;
    --radius-full: 9999px;
    
    /* ============ 字体系统 ============ */
    --font-family: -apple-system, "SF Pro Display", "system-ui", "Segoe UI", "Noto Sans SC", Helvetica, Arial, sans-serif;
    --font-mono: "SF Mono", "Fira Code", "Cascadia Code", "JetBrains Mono", monospace;
    
    /* ============ 字体层级体系（核心！） ============ */
    /* 标题类 - 4级递减 */
    --heading-1: 28px;      /* H1: 报告主标题 */
    --heading-2: 18px;      /* H2: 章节标题 */
    --heading-3: 15px;      /* H3: 子章节/卡片标题 */
    --heading-4: 13px;      /* H4: 小节标题/表头/洞察框标题 */
    
    /* 正文类 */
    --body-text: 14px;      /* 正文: 段落、描述、列表 */
    --body-small: 13px;     /* 表格内容 */
    --caption: 12px;        /* 辅助文字: 来源、标签、备注 */
    
    /* 兼容旧变量 */
    --font-size-xs: var(--caption);
    --font-size-sm: var(--body-small);
    --font-size-base: var(--body-text);
    --font-size-md: var(--heading-3);
    --font-size-lg: var(--heading-2);
    --font-size-xl: 20px;
    --font-size-2xl: 24px;
    --font-size-3xl: var(--heading-1);
    
    /* ============ 动画系统 ============ */
    --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-normal: 200ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* ==================== 基础重置 ==================== */
*, *::before, *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

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

body {
    font-family: var(--font-family);
    font-size: var(--body-text);
    line-height: 1.65;
    color: var(--color-text-primary);
    background: var(--color-bg);
    background-image: var(--gradient-mesh);
    background-attachment: fixed;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* ==================== 容器布局 ==================== */
.container {
    max-width: 980px;
    margin: 0 auto;
    padding: var(--spacing-lg) var(--spacing-md) 48px;
}

/* ==================== 头部区域 ==================== */
.header {
    text-align: center;
    padding: var(--spacing-2xl) 0;
    margin-bottom: var(--spacing-2xl);
    position: relative;
    overflow: hidden;
}

/* 顶部3px渐变指示条 */
.header::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--gradient-hero);
}

.badge, .header-badge {
    display: inline-flex;
    align-items: center;
    background: var(--gradient-badge);
    color: var(--color-info);
    padding: var(--spacing-xs) 12px;
    border-radius: var(--radius-full);
    font-size: var(--caption);
    font-weight: 500;
    letter-spacing: 0.02em;
    margin-bottom: 20px;
    border: 1px solid rgba(9, 105, 218, 0.15);
}

.main-title, .header-title {
    font-size: 34px;
    font-weight: 800;
    line-height: 1.3;
    margin-bottom: 12px;
    letter-spacing: -0.02em;
    background: var(--gradient-hero);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.subtitle, .header-subtitle {
    font-size: var(--body-text);
    color: var(--color-text-secondary);
    max-width: 580px;
    margin: 0 auto;
    line-height: 1.6;
}

/* ==================== 核心发现区域 ==================== */
.summary-box {
    background: var(--color-bg-card);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-card);
    padding: var(--spacing-lg);
    margin-bottom: var(--spacing-2xl);
    position: relative;
    overflow: hidden;
    border-left: 4px solid var(--color-danger);
}

.summary-label {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--caption);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-danger);
    margin-bottom: 12px;
}

.summary-label::before {
    content: '';
    width: 8px;
    height: 8px;
    background: var(--color-danger);
    border-radius: 50%;
    box-shadow: 0 0 0 3px rgba(207, 34, 46, 0.15);
}

.summary-title {
    font-size: var(--heading-2);
    font-weight: 600;
    line-height: 1.4;
    margin-bottom: 12px;
    color: var(--color-text-primary);
}

.summary-title em {
    color: var(--color-danger);
    font-style: normal;
    font-weight: 600;
}

.summary-text {
    color: var(--color-text-secondary);
    font-size: var(--body-text);
    line-height: 1.7;
}

/* ==================== Tab导航 ==================== */
.tab-nav {
    display: flex;
    flex-wrap: nowrap;
    gap: 4px;
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: 6px;
    margin-bottom: var(--spacing-lg);
    position: sticky;
    top: 12px;
    z-index: 100;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    box-shadow: var(--shadow-card);
}

.tab-btn {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 12px;
    background: transparent;
    border: none;
    border-radius: var(--radius-md);
    cursor: pointer;
    font-family: inherit;
    font-size: var(--body-small);
    font-weight: 500;
    color: var(--color-text-muted);
    transition: all var(--transition-fast);
    white-space: nowrap;
}

.tab-btn:hover {
    background: var(--color-bg-table-header);
    color: var(--color-text-secondary);
}

.tab-btn.active {
    background: var(--gradient-success);
    color: #fff;
    box-shadow: 0 2px 8px rgba(5, 150, 105, 0.25);
}

.tab-btn-num {
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.06);
    border-radius: var(--radius-sm);
    font-size: 11px;
    font-weight: 600;
}

.tab-btn.active .tab-btn-num {
    background: rgba(255,255,255,0.2);
}

.tab-btn-text {
    display: none;
}

@media (min-width: 768px) {
    .tab-btn-text {
        display: inline;
    }
}

.tab-panel {
    display: none;
    animation: fadeIn 0.3s ease-out;
}

.tab-panel.active {
    display: block;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ==================== 二级导航 ==================== */
.sub-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 16px;
    background: var(--color-bg-table-header);
    border-radius: var(--radius-lg);
    margin-bottom: 24px;
    border: 1px solid var(--color-border-light);
}

.sub-nav-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    cursor: pointer;
    font-family: inherit;
    font-size: var(--caption);
    font-weight: 500;
    color: var(--color-text-secondary);
    transition: all var(--transition-fast);
    white-space: nowrap;
}

.sub-nav-btn:hover {
    background: var(--color-info);
    color: #fff;
    border-color: var(--color-info);
    transform: translateY(-1px);
}

.sub-nav-btn .sub-nav-num {
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #0969da 0%, #1a7f37 100%);
    color: #fff;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 600;
}

.sub-nav-btn:hover .sub-nav-num {
    background: rgba(255, 255, 255, 0.2);
}

@media (max-width: 768px) {
    .sub-nav {
        gap: 6px;
        padding: 12px;
    }
    
    .sub-nav-btn {
        padding: 6px 10px;
        font-size: 11px;
    }
    
    .sub-nav-btn .sub-nav-num {
        width: 16px;
        height: 16px;
        font-size: 9px;
    }
}

/* ==================== 章节卡片 ==================== */
.section, .section-card {
    background: var(--color-bg-card);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-card);
    padding: var(--spacing-lg);
    margin-bottom: var(--spacing-lg);
    border: 1px solid var(--color-border);
}

.section-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    padding-bottom: var(--spacing-md);
    border-bottom: 1px solid var(--color-border-light);
}

.section-number {
    background: var(--gradient-success);
    color: white;
    width: 32px;
    height: 32px;
    border-radius: var(--radius-md);
    font-size: 14px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 2px 4px rgba(5, 150, 105, 0.25);
}

.section-number-small {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    font-size: 14px;
}

.section-title {
    font-size: var(--heading-2);
    font-weight: 600;
    color: var(--color-text-primary);
    letter-spacing: -0.01em;
}

.section-content {
    color: var(--color-text-secondary);
    line-height: 1.7;
}

.section-content p {
    margin-bottom: var(--spacing-md);
}

/* ==================== 统计卡片 ==================== */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-2xl);
}

@media (max-width: 768px) {
    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

.stat-card {
    background: var(--color-bg-card);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--color-border);
    padding: 20px;
    text-align: center;
    position: relative;
    cursor: help;
    transition: box-shadow var(--transition-normal), transform var(--transition-normal);
}

.stat-card:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-3px);
}

.stat-card:hover .stat-tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
}

.stat-value {
    font-size: var(--font-size-2xl);
    font-weight: 600;
    margin-bottom: var(--spacing-xs);
    letter-spacing: -0.02em;
}

.stat-value.success, .stat-value.green {
    color: var(--color-success);
}

.stat-value.danger, .stat-value.red {
    color: var(--color-danger);
}

.stat-value.warning, .stat-value.orange {
    color: var(--color-warning);
}

.stat-value.info, .stat-value.blue {
    color: var(--color-info);
}

.stat-label {
    font-size: var(--caption);
    color: var(--color-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: 500;
}

/* ==================== Tooltip ==================== */
.stat-tooltip {
    position: absolute;
    bottom: calc(100% + 12px);
    left: 50%;
    transform: translateX(-50%) translateY(8px);
    background: var(--color-text-primary);
    color: #fff;
    padding: 12px 16px;
    border-radius: var(--radius-md);
    font-size: 13px;
    line-height: 1.5;
    text-align: left;
    width: 280px;
    max-width: 90vw;
    box-shadow: 0 8px 24px rgba(0,0,0,0.2);
    opacity: 0;
    visibility: hidden;
    transition: all 0.2s ease;
    z-index: 100;
    pointer-events: none;
}

.stat-tooltip::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 8px solid transparent;
    border-top-color: var(--color-text-primary);
}

.stat-tooltip-title {
    font-weight: 600;
    margin-bottom: 6px;
    color: #fff;
}

.stat-tooltip-desc {
    color: rgba(255,255,255,0.85);
    font-size: var(--caption);
    line-height: 1.5;
}

/* 内容Tooltip */
.has-tip {
    position: relative;
    cursor: help;
    border-bottom: 1px dashed var(--color-info);
}

.tip-box {
    position: fixed;
    width: 320px;
    max-width: 90vw;
    max-height: 340px;
    overflow-y: auto;
    padding: var(--spacing-md);
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity var(--transition-fast), visibility var(--transition-fast);
    z-index: 9999;
    font-size: var(--body-text);
    line-height: 1.7;
}

.has-tip:hover .tip-box {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.tip-title {
    font-size: var(--heading-4);
    font-weight: 600;
    margin-bottom: var(--spacing-md);
    padding-bottom: var(--spacing-sm);
    border-bottom: 1px solid var(--color-border-light);
    color: var(--color-text-primary);
}

.tip-section { margin-bottom: var(--spacing-md); }
.tip-section:last-child { margin-bottom: 0; }

.tip-label {
    font-size: var(--caption);
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--color-info);
    margin-bottom: 4px;
}

.tip-text { 
    color: var(--color-text-secondary); 
    line-height: 1.7;
}

.tip-list {
    list-style: none;
    color: var(--color-text-secondary);
}

.tip-list li {
    padding: 3px 0;
    padding-left: var(--spacing-md);
    position: relative;
}

.tip-list li::before {
    content: '→';
    position: absolute;
    left: 0;
    color: var(--color-info);
    font-size: var(--caption);
}

.tip-box::-webkit-scrollbar { width: 4px; }
.tip-box::-webkit-scrollbar-thumb { 
    background: var(--color-border); 
    border-radius: 2px; 
}

/* ==================== 状态标签 ==================== */
.tag, .status {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: var(--radius-full);
    font-size: var(--caption);
    font-weight: 500;
    white-space: nowrap;
    line-height: 1.5;
}

.tag-green, .status-success {
    background: rgba(5, 150, 105, 0.12);
    color: var(--color-success);
}

.tag-orange, .status-warning {
    background: rgba(191, 135, 0, 0.12);
    color: var(--color-warning-dark);
}

.tag-red, .status-danger {
    background: rgba(207, 34, 46, 0.12);
    color: var(--color-danger);
}

.tag-blue, .status-info {
    background: rgba(9, 105, 218, 0.12);
    color: var(--color-info);
}

/* ==================== 引用框 ==================== */
.quote, .quote-box {
    background: var(--color-bg-table-header);
    border-left: 3px solid var(--color-info);
    padding: var(--spacing-md) 20px;
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
    margin: 20px 0;
    transition: all var(--transition-fast);
}

.quote:hover, .quote-box:hover {
    border-left-width: 4px;
    background: rgba(9, 105, 218, 0.04);
}

.quote-text {
    font-size: var(--body-text);
    font-style: italic;
    color: var(--color-text-primary);
    line-height: 1.7;
}

.quote-author {
    font-size: var(--caption);
    color: var(--color-text-muted);
    margin-top: var(--spacing-sm);
    font-weight: 500;
}

/* ==================== 洞察框 ==================== */
.insight-box {
    border-left: 3px solid var(--color-warning);
    background: rgba(191, 135, 0, 0.06);
    padding: var(--spacing-md) 20px;
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
    margin: 20px 0;
    transition: all var(--transition-fast);
}

.insight-box:hover {
    border-left-width: 4px;
    background: rgba(191, 135, 0, 0.08);
}

.insight-title {
    font-size: var(--heading-4);
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--color-warning-dark);
    margin-bottom: var(--spacing-sm);
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.insight-title::before {
    content: '';
    width: 8px;
    height: 8px;
    background: var(--color-warning);
    border-radius: 50%;
}

.insight-content {
    margin-top: var(--spacing-md);
    padding: var(--spacing-md);
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.insight-content-title {
    font-size: var(--heading-3);
    color: var(--color-warning);
    font-weight: 600;
    margin-bottom: var(--spacing-sm);
}

.insight-content-text {
    color: var(--color-text-secondary);
    font-size: var(--body-text);
    line-height: 1.7;
}

.insight-content-text strong {
    color: var(--color-text-primary);
    font-weight: 600;
}

.insight-content-text ul {
    margin: 12px 0;
    padding-left: 20px;
    color: var(--color-text-secondary);
    font-size: var(--body-text);
    line-height: 1.7;
}

.insight-content-text ul li {
    margin-bottom: 6px;
}

/* ==================== 双列对比 ==================== */
.two-col, .comparison-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-md);
    margin-top: 20px;
}

@media (max-width: 768px) {
    .two-col, .comparison-grid {
        grid-template-columns: 1fr;
    }
}

.col-box {
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
    background: var(--color-bg-table-header);
}

.col-box-title {
    font-size: var(--heading-4);
    font-weight: 600;
    letter-spacing: 0.02em;
    margin-bottom: var(--spacing-md);
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.col-box-title.red { color: var(--color-danger); }
.col-box-title.green { color: var(--color-success); }

.col-list {
    list-style: none;
}

.col-list li {
    padding: var(--spacing-sm) 0;
    color: var(--color-text-secondary);
    font-size: var(--body-text);
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-sm);
    line-height: 1.7;
}

.col-list li::before {
    content: '•';
    color: var(--color-text-muted);
    flex-shrink: 0;
    font-weight: bold;
}

.correct-path {
    border-left: 3px solid rgba(5, 150, 105, 0.5);
    background: rgba(5, 150, 105, 0.04);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

.wrong-path {
    border-left: 3px solid rgba(207, 34, 46, 0.5);
    background: rgba(207, 34, 46, 0.04);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

/* ==================== 路径对比框 ==================== */
.pathway-section {
    border-left: 3px solid rgba(5, 150, 105, 0.5);
    background: rgba(5, 150, 105, 0.04);
    border-radius: 0 var(--radius-lg) var(--radius-lg) 0;
    padding: var(--spacing-lg);
    margin-bottom: var(--spacing-lg);
}

.pathway-section.wrong {
    border-left: 3px solid rgba(207, 34, 46, 0.5);
    background: rgba(207, 34, 46, 0.04);
}

.pathway-header {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-md);
    margin-bottom: 20px;
    padding-bottom: var(--spacing-md);
    border-bottom: 1px solid rgba(5, 150, 105, 0.15);
}

.pathway-section.wrong .pathway-header {
    border-bottom-color: rgba(207, 34, 46, 0.15);
}

.pathway-icon {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    font-size: 18px;
    font-weight: 600;
    flex-shrink: 0;
}

.pathway-icon.correct {
    background: var(--gradient-success);
    color: #fff;
    box-shadow: 0 2px 8px rgba(5, 150, 105, 0.3);
}

.pathway-icon.wrong {
    background: linear-gradient(135deg, var(--color-danger) 0%, #ff6b6b 100%);
    color: #fff;
    box-shadow: 0 2px 8px rgba(207, 34, 46, 0.3);
}

.pathway-title-wrap {
    flex: 1;
}

.pathway-title {
    font-size: var(--heading-2);
    font-weight: 600;
    color: var(--color-text-primary);
    margin-bottom: 4px;
}

.pathway-subtitle {
    font-size: var(--body-text);
    color: var(--color-text-secondary);
}

/* ==================== 步骤流程 ==================== */
.pathway-steps {
    display: flex;
    align-items: stretch;
    gap: var(--spacing-sm);
    flex-wrap: wrap;
}

.pathway-step {
    flex: 1;
    min-width: 140px;
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--spacing-md);
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.step-number {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-success);
    color: #fff;
    border-radius: 50%;
    font-size: var(--caption);
    font-weight: 600;
}

.step-content {
    flex: 1;
}

.step-title {
    font-size: var(--heading-4);
    font-weight: 600;
    color: var(--color-text-primary);
    margin-bottom: 4px;
    line-height: 1.4;
}

.step-desc {
    font-size: var(--caption);
    color: var(--color-text-secondary);
    line-height: 1.5;
}

.pathway-arrow {
    display: flex;
    align-items: center;
    font-size: 18px;
    color: var(--color-success);
    font-weight: 600;
}

@media (max-width: 960px) {
    .pathway-steps {
        flex-direction: column;
    }
    .pathway-arrow {
        transform: rotate(90deg);
        justify-content: center;
    }
}

/* ==================== 偏差网格 ==================== */
.deviation-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

@media (max-width: 768px) {
    .deviation-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

.deviation-item {
    background: var(--color-bg-card);
    border: 1px solid rgba(207, 34, 46, 0.2);
    border-radius: var(--radius-md);
    padding: var(--spacing-md);
}

.deviation-wrong {
    font-size: var(--body-text);
    font-weight: 600;
    color: var(--color-danger);
    margin-bottom: 4px;
}

.deviation-result {
    font-size: var(--caption);
    color: var(--color-text-secondary);
    line-height: 1.5;
}

/* ==================== 未来路径对比 ==================== */
.future-paths {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-md);
    margin: var(--spacing-lg) 0;
}

@media (max-width: 768px) {
    .future-paths {
        grid-template-columns: 1fr;
    }
}

.future-path {
    background: var(--color-bg-card);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

.future-path.continue {
    border-left: 4px solid var(--color-danger);
}

.future-path.pivot {
    border-left: 4px solid var(--color-success);
}

.path-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: var(--spacing-md);
    padding-bottom: 12px;
    border-bottom: 1px solid var(--color-border-light);
}

.path-icon {
    font-size: 20px;
}

.path-label {
    font-size: var(--heading-3);
    font-weight: 600;
    color: var(--color-text-primary);
}

.path-list {
    list-style: none;
    margin-bottom: var(--spacing-md);
}

.path-list li {
    padding: var(--spacing-sm) 0;
    font-size: var(--body-text);
    color: var(--color-text-secondary);
    line-height: 1.7;
    border-bottom: 1px solid var(--color-border-light);
}

.path-list li:last-child {
    border-bottom: none;
}

.path-list li strong {
    color: var(--color-text-primary);
}

.path-verdict {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: 12px;
    background: var(--color-bg-table-header);
    border-radius: var(--radius-sm);
}

.verdict-label {
    font-size: var(--caption);
    color: var(--color-text-muted);
    font-weight: 500;
}

.verdict-value {
    font-size: var(--body-text);
    font-weight: 600;
}

.verdict-value.red {
    color: var(--color-danger);
}

.verdict-value.green {
    color: var(--color-success);
}

/* ==================== 表格样式 ==================== */
.table-wrap, .table-wrapper {
    overflow-x: auto;
    margin: var(--spacing-md) 0;
}

table {
    border-collapse: collapse;
    width: 100%;
    font-size: var(--body-small);
}

th {
    background: var(--color-bg-table-header);
    color: var(--color-text-secondary);
    padding: 12px 16px;
    font-weight: 600;
    font-size: var(--heading-4);
    text-align: left;
    letter-spacing: 0.02em;
    white-space: nowrap;
    border-bottom: 1px solid var(--color-border);
}

td {
    padding: 12px 16px;
    border-bottom: 1px solid var(--color-border-light);
    vertical-align: middle;
}

td:first-child {
    font-weight: 500;
    color: var(--color-text-primary);
}

tbody tr {
    transition: background var(--transition-fast);
}

tbody tr:hover td {
    background: rgba(0, 0, 0, 0.02);
}

tr:last-child td {
    border-bottom: none;
}

.highlight-col {
    background: rgba(5, 150, 105, 0.08) !important;
}

/* ==================== 图例样式 ==================== */
.legend {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-md);
    justify-content: center;
    padding: var(--spacing-md);
    background: var(--color-bg-table-header);
    border-radius: var(--radius-md);
    margin-top: var(--spacing-md);
    font-size: var(--caption);
}

.legend-item {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    color: var(--color-text-secondary);
}

/* ==================== 内联统计 ==================== */
.inline-stats {
    display: flex;
    gap: var(--spacing-xl);
    justify-content: center;
    padding: var(--spacing-md);
    background: var(--color-bg-table-header);
    border-radius: var(--radius-md);
    margin-top: var(--spacing-md);
}

.inline-stat { text-align: center; }

.inline-stat-value {
    font-size: var(--font-size-xl);
    font-weight: 600;
    letter-spacing: -0.02em;
}

.inline-stat-label {
    font-size: var(--caption);
    color: var(--color-text-muted);
    margin-top: 2px;
    font-weight: 500;
}

/* ==================== 结论区域 ==================== */
.conclusion {
    background: rgba(5, 150, 105, 0.04);
    border-left: 3px solid rgba(5, 150, 105, 0.5);
    border-radius: 0 var(--radius-lg) var(--radius-lg) 0;
    padding: var(--spacing-lg);
    margin-top: var(--spacing-xl);
}

.conclusion-title {
    font-size: var(--heading-4);
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--color-success);
    margin-bottom: var(--spacing-md);
}

.conclusion-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-md);
}

@media (max-width: 768px) {
    .conclusion-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .conclusion-grid {
        grid-template-columns: 1fr;
    }
}

.conclusion-item {
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--spacing-md);
}

.conclusion-item-label {
    font-size: var(--caption);
    color: var(--color-text-muted);
    margin-bottom: 4px;
    font-weight: 500;
}

.conclusion-item-value {
    font-size: var(--body-text);
    font-weight: 600;
    color: var(--color-text-primary);
    line-height: 1.4;
}

/* ==================== 全局控制按钮 ==================== */
.global-controls {
    position: fixed;
    bottom: 24px;
    right: 24px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    z-index: 1000;
}

.global-btn {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: none;
    background: var(--color-bg-card);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all var(--transition-fast);
    color: var(--color-text-secondary);
}

.global-btn:hover {
    background: var(--color-info);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(9, 105, 218, 0.3);
}

.global-btn.active {
    background: var(--color-success);
    color: #fff;
}

.global-btn svg {
    width: 22px;
    height: 22px;
}

.global-btn-tooltip {
    position: absolute;
    right: 60px;
    top: 50%;
    transform: translateY(-50%);
    background: var(--color-text-primary);
    color: #fff;
    padding: 6px 12px;
    border-radius: 6px;
    font-size: var(--caption);
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: all var(--transition-fast);
    pointer-events: none;
}

.global-btn:hover .global-btn-tooltip {
    opacity: 1;
    visibility: visible;
}

/* ==================== 移动端预览模式 ==================== */
body.mobile-preview-mode {
    background: #2d2d2d;
}

body.mobile-preview-mode .container {
    max-width: 375px;
    margin: 0 auto;
    box-shadow: 0 0 40px rgba(0, 0, 0, 0.3);
    min-height: 100vh;
    background: var(--color-bg);
    border-left: 1px solid #444;
    border-right: 1px solid #444;
}

body.mobile-preview-mode .container {
    padding: var(--spacing-lg) var(--spacing-md) 80px;
}

body.mobile-preview-mode .header-title {
    font-size: var(--font-size-2xl);
}

body.mobile-preview-mode .stats-grid {
    grid-template-columns: repeat(2, 1fr);
}

body.mobile-preview-mode .two-col {
    grid-template-columns: 1fr;
}

body.mobile-preview-mode .conclusion-grid {
    grid-template-columns: repeat(2, 1fr);
}

body.mobile-preview-mode .section {
    padding: var(--spacing-md);
}

body.mobile-preview-mode .tab-nav {
    overflow-x: auto;
}

body.mobile-preview-mode .tab-btn-text {
    display: none;
}

body.mobile-preview-mode .sub-nav {
    flex-wrap: wrap;
}

body.mobile-preview-mode .sub-nav-btn {
    padding: 6px 10px;
    font-size: 11px;
}

body.mobile-preview-mode .global-controls {
    bottom: 12px;
    right: calc(50% - 187px + 60px);
}

/* ==================== 页脚样式 ==================== */
.footer {
    text-align: center;
    padding-top: 32px;
    margin-top: 48px;
    border-top: 1px solid var(--color-border-light);
}

.footer-quote {
    font-size: var(--body-text);
    font-style: italic;
    color: var(--color-text-secondary);
    max-width: 500px;
    margin: 0 auto var(--spacing-md);
    line-height: 1.6;
}

.footer-date {
    font-size: var(--caption);
    color: var(--color-text-muted);
    font-weight: 500;
}

/* ==================== 免责声明 ==================== */
.disclaimer {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-md);
    margin-top: 40px;
    padding: var(--spacing-md);
    background: var(--color-bg-table-header);
    border-radius: var(--radius-md);
}

.disclaimer-icon {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    color: var(--color-text-muted);
}

.disclaimer-icon svg {
    width: 100%;
    height: 100%;
}

.disclaimer-text {
    font-size: var(--caption);
    color: var(--color-text-muted);
    line-height: 1.6;
}

/* ==================== 文字样式类 ==================== */
.text-success { color: var(--color-success); }
.text-danger { color: var(--color-danger); }
.text-warning { color: var(--color-warning); }
.text-info { color: var(--color-info); }

.text-bold {
    font-weight: 700;
    color: var(--color-text-primary);
}

.text-highlight {
    border-bottom: 2px solid var(--color-danger);
    padding-bottom: 1px;
}

/* ==================== 参考资料区域 ==================== */
.references {
    margin-top: var(--spacing-xl);
    padding-top: var(--spacing-lg);
    border-top: 1px solid var(--color-border-light);
}

.references-header {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    margin-bottom: 20px;
}

.references-icon {
    width: 18px;
    height: 18px;
    color: var(--color-info);
}

.references-icon svg {
    width: 100%;
    height: 100%;
}

.references-title {
    font-size: var(--heading-3);
    font-weight: 600;
    color: var(--color-text-primary);
}

.references-list {
    list-style: none;
    display: grid;
    gap: var(--spacing-md);
}

.reference-item {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-md);
    padding: var(--spacing-md);
    background: var(--color-bg-table-header);
    border-radius: var(--radius-md);
    transition: all var(--transition-fast);
}

.reference-item:hover {
    background: rgba(0, 0, 0, 0.02);
}

.reference-num {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: 4px;
    font-size: var(--caption);
    font-weight: 600;
    color: var(--color-text-muted);
}

.reference-content {
    flex: 1;
    min-width: 0;
}

.reference-link {
    display: block;
    font-size: var(--body-text);
    color: var(--color-info);
    text-decoration: none;
    font-weight: 500;
    line-height: 1.5;
    margin-bottom: 2px;
}

.reference-link:hover {
    text-decoration: underline;
}

.reference-meta {
    font-size: var(--caption);
    color: var(--color-text-muted);
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    flex-wrap: wrap;
}

.reference-source {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.reference-tag {
    display: inline-flex;
    padding: 1px 6px;
    background: rgba(9, 105, 218, 0.08);
    color: var(--color-info);
    border-radius: 4px;
    font-size: 10px;
    font-weight: 500;
}

.references-note {
    margin-top: var(--spacing-md);
    padding: var(--spacing-md);
    background: var(--color-bg-table-header);
    border-radius: var(--radius-md);
    font-size: var(--body-text);
    color: var(--color-text-secondary);
    line-height: 1.7;
}

.references-note strong {
    color: var(--color-text-primary);
}

/* ==================== 响应式布局 ==================== */
@media (max-width: 768px) {
    .container {
        padding: var(--spacing-lg) var(--spacing-md) 80px;
    }
    
    .header-title {
        font-size: var(--font-size-2xl);
    }
    
    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .two-col {
        grid-template-columns: 1fr;
    }
    
    .conclusion-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .legend {
        flex-wrap: wrap;
        gap: var(--spacing-md);
    }
    
    .inline-stats {
        flex-wrap: wrap;
        gap: var(--spacing-md);
    }
    
    .section {
        padding: var(--spacing-md);
    }
    
    .stat-tooltip {
        display: none !important;
    }
    
    .tip-box {
        display: none !important;
    }
}

@media (max-width: 480px) {
    .container {
        padding: 12px 10px 80px;
    }
    
    .header-title {
        font-size: 20px;
    }
    
    .stats-grid {
        gap: 8px;
    }
    
    .stat-card {
        padding: 12px 8px;
    }
    
    .stat-value {
        font-size: 18px;
    }
    
    .stat-label {
        font-size: 10px;
        letter-spacing: 0;
    }
    
    .section {
        padding: 12px;
    }
    
    .conclusion-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== 日报组件层 ===== */
/* ===== CSS VARIABLES (清爽调研风格 v5.0 × 日报 × Tab导航升级) ===== */
        :root {
            --color-success: #059669; --color-success-light: #10B981; --color-success-dark: #047857;
            --color-success-50: #ECFDF5; --color-success-100: #D1FAE5;
            --color-danger: #E11D48; --color-danger-light: #F43F5E; --color-danger-50: #FFF1F2;
            --color-warning: #D97706; --color-warning-light: #F59E0B; --color-warning-50: #FFFBEB;
            --color-info: #2563EB; --color-info-light: #3B82F6; --color-info-50: #EFF6FF; --color-info-100: #DBEAFE;
            --color-purple: #7C3AED; --color-purple-light: #8B5CF6; --color-purple-50: #F5F3FF; --color-purple-100: #EDE9FE;
            --color-orange: #EA580C;
            --color-text-primary: #1C1917; --color-text-secondary: #57534E; --color-text-muted: #78716C;
            --color-border: #E7E5E4; --color-border-light: #F5F5F4;
            --color-bg: #F8FAFB; --color-bg-card: #FFFFFF; --color-bg-table-header: #FAFAF9;
            --color-bg-hover: rgba(0,0,0,0.025);

            /* ===== 板块主题色映射（v4.0 Tab导航升级）===== */
            --board-llm: #059669;       /* Emerald */
            --board-llm-light: #10B981;
            --board-llm-50: #ECFDF5;
            --board-coding: #2563EB;    /* Blue */
            --board-coding-light: #3B82F6;
            --board-coding-50: #EFF6FF;
            --board-app: #7C3AED;      /* Violet */
            --board-app-light: #8B5CF6;
            --board-app-50: #F5F3FF;
            --board-industry: #D97706;  /* Amber */
            --board-industry-light: #F59E0B;
            --board-industry-50: #FFFBEB;
            --board-enterprise: #E11D48; /* Rose */
            --board-enterprise-light: #F43F5E;
            --board-enterprise-50: #FFF1F2;

            --gradient-hero: linear-gradient(135deg, #059669 0%, #2563EB 50%, #7C3AED 100%);
            --gradient-success: linear-gradient(135deg, #059669 0%, #10B981 100%);
            --gradient-orange: linear-gradient(135deg, #EA580C 0%, #F97316 100%);
            --gradient-purple: linear-gradient(135deg, #7C3AED 0%, #6D28D9 50%, #5B21B6 100%);
            --gradient-china: linear-gradient(135deg, #DC2626 0%, #EF4444 100%);
            --gradient-badge: linear-gradient(135deg, #ECFDF5 0%, #EFF6FF 100%);
            --gradient-mesh:
                radial-gradient(at 20% 20%, rgba(5,150,105,0.06) 0%, transparent 50%),
                radial-gradient(at 80% 80%, rgba(37,99,235,0.05) 0%, transparent 50%),
                radial-gradient(at 50% 50%, rgba(124,58,237,0.03) 0%, transparent 50%);
            --shadow-xs: 0 1px 2px rgba(0,0,0,0.04);
            --shadow-card: 0 2px 8px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
            --shadow-hover: 0 8px 24px rgba(5,150,105,0.18), 0 2px 8px rgba(5,150,105,0.10);
            --shadow-float: 0 12px 32px rgba(0,0,0,0.10), 0 4px 8px rgba(0,0,0,0.06);
            --shadow-glow-info: 0 4px 14px rgba(37,99,235,0.15);
            --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-full: 9999px;
            --font-family: "DM Sans", -apple-system, "Noto Sans SC", "PingFang SC", sans-serif;
            --font-family-heading: "DM Sans", -apple-system, "Noto Sans SC", sans-serif;
            --font-family-cn: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
            --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
            --transition-normal: 200ms cubic-bezier(0.4, 0, 0.2, 1);
            --sidebar-width: 228px;
            --content-max: 960px;
            --content-pad: 48px;
        }

        /* ===== RESET & BASE ===== */
        *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
        html { scroll-behavior: smooth; }
        body {
            font-family: var(--font-family); font-size: 15px; line-height: 1.65;
            letter-spacing: -0.01em; color: var(--color-text-secondary);
            background: var(--color-bg); background-image: var(--gradient-mesh);
            background-attachment: fixed; -webkit-font-smoothing: antialiased;
        }
        ::selection { background: rgba(5,150,105,0.18); }
        a { color: var(--color-info); text-decoration: none; }
        a:hover { text-decoration: underline; }

        /* ===== SKIP TO CONTENT ===== */
        .skip-to-content {
            position: absolute; top: -40px; left: 0; background: var(--color-info);
            color: #fff; padding: 8px 16px; border-radius: 0 0 8px 0; z-index: 9999;
            transition: top var(--transition-fast);
        }
        .skip-to-content:focus { top: 0; }

        /* ===== LAYOUT ===== */
        .layout-wrapper { display: flex; width: 100%; min-height: 100vh; align-items: stretch; }

        /* ===== SIDEBAR ===== */
        .sidebar-nav {
            width: var(--sidebar-width); flex-shrink: 0;
            position: sticky; top: 0; height: 100vh;
            overflow-y: auto; background: #fff;
            border-right: 1px solid var(--color-border);
            padding: 20px 0; z-index: 100;
            display: flex; flex-direction: column;
        }
        .sidebar-nav::-webkit-scrollbar { width: 4px; }
        .sidebar-nav::-webkit-scrollbar-track { background: transparent; }
        .sidebar-nav::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.08); border-radius: 2px; }
        .sidebar-doc-title {
            font-size: 13px; font-weight: 700; color: var(--color-text-primary);
            padding: 0 20px 16px; line-height: 1.4;
        }
        .toc-group-label {
            font-size: 11px; font-weight: 700; color: var(--color-text-muted);
            letter-spacing: 0.08em; text-transform: uppercase;
            padding: 4px 20px 6px; margin-top: 8px;
        }
        .toc-link {
            display: block; padding: 7px 20px; font-size: 13px; font-weight: 500;
            color: var(--color-text-secondary); border-left: 3px solid transparent;
            transition: all var(--transition-fast); line-height: 1.4; text-decoration: none;
        }
        .toc-link:hover { background: rgba(0,0,0,0.03); color: var(--color-text-primary); text-decoration: none; }
        .toc-link.toc-active { color: var(--color-success); background: rgba(5,150,105,0.04); border-left-color: var(--color-success); font-weight: 600; }
        .toc-link.toc-sub { padding-left: 32px; font-size: 12px; font-weight: 400; color: var(--color-text-muted); }
        .toc-link.toc-sub.toc-active { color: var(--color-success); font-weight: 500; }
        .toc-link:focus-visible { outline: 2px solid var(--color-success); outline-offset: -2px; }

        .reading-progress-wrap { margin-top: auto; padding: 16px 20px 8px; }
        .reading-progress-label { font-size: 11px; color: var(--color-text-muted); margin-bottom: 6px; }
        .reading-progress-track { height: 4px; background: var(--color-border); border-radius: 2px; overflow: hidden; }
        .reading-progress-fill { height: 100%; width: 0%; background: var(--gradient-success); border-radius: 2px; transition: width 0.2s ease; }

        .sidebar-collapse-btn {
            display: flex; align-items: center; justify-content: center;
            width: 28px; height: 28px; background: #fff;
            border: 1px solid var(--color-border); border-radius: 6px;
            cursor: pointer; color: var(--color-text-muted); font-size: 13px;
            position: fixed; top: 20px; left: calc(var(--sidebar-width) - 14px);
            z-index: 101; transition: all var(--transition-fast);
        }
        .sidebar-collapse-btn:hover { background: var(--color-bg); }
        .sidebar-collapse-btn.collapsed-pos { left: 8px; }
        .sidebar-nav.sidebar-collapsed { width: 0; padding: 0; overflow: hidden; border: none; }
        .sidebar-nav.sidebar-collapsed ~ .sidebar-collapse-btn { left: 8px; }

        /* ===== CONTENT AREA ===== */
        .content-area { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; }
        .content-inner { width: 100%; max-width: var(--content-max); padding: 40px var(--content-pad) 100px; }

        /* ===== HEADER ===== */
        .doc-header { padding: 32px 0 28px; position: relative; margin-bottom: 28px; }
        .doc-header::after {
            content: ''; position: absolute; bottom: 0; left: 0; right: 0;
            height: 3px; background: var(--gradient-hero); border-radius: 2px;
        }
        .header-badge {
            display: inline-block; background: var(--gradient-badge); color: var(--color-success);
            padding: 4px 14px; border-radius: var(--radius-full); font-size: 11px; font-weight: 600;
            margin-bottom: 12px; border: 1px solid rgba(5,150,105,0.12); box-shadow: var(--shadow-xs);
            letter-spacing: 0.04em;
        }
        .header-title {
            font-size: 30px; font-weight: 800; letter-spacing: -0.025em;
            background: var(--gradient-hero); -webkit-background-clip: text;
            -webkit-text-fill-color: transparent; background-clip: text;
            line-height: 1.2; margin-bottom: 10px;
        }
        .header-meta { font-size: 13px; color: var(--color-text-muted); display: flex; gap: 16px; flex-wrap: wrap; align-items: center; }
        .header-meta span { display: flex; align-items: center; gap: 4px; }
        .version-badge {
            display: inline-flex; align-items: center; background: rgba(5,150,105,0.1);
            color: var(--color-success); padding: 2px 8px; border-radius: var(--radius-full);
            font-size: 11px; font-weight: 700; margin-left: 6px;
        }

        /* ===== CHAPTER LABEL ===== */
        .doc-chapter-label {
            display: flex; align-items: center; gap: 10px;
            font-size: 11px; font-weight: 700; letter-spacing: 0.12em;
            text-transform: uppercase; color: #A8A29E; padding: 36px 0 12px;
        }
        .doc-chapter-label::after { content: ''; flex: 1; height: 1px; background: #F0EFEE; }

        /* ===== SECTION ===== */
        .report-section { margin-bottom: 48px; }
        .section-title {
            font-size: 20px; font-weight: 700; color: var(--color-text-primary);
            letter-spacing: -0.02em; margin-bottom: 18px; line-height: 1.3;
            display: flex; align-items: center; gap: 10px;
        }
        .section-title::before {
            content: ''; width: 4px; height: 22px; background: var(--gradient-success);
            border-radius: 2px; flex-shrink: 0;
        }

        /* ===== COVERAGE BAR ===== */
        .coverage-bar {
            background: var(--color-bg-card); border: 1px solid var(--color-border-light);
            border-radius: var(--radius-md); padding: 12px 18px; margin-bottom: 20px;
            box-shadow: var(--shadow-card); display: flex; align-items: center; gap: 16px; font-size: 13px;
        }
        .coverage-bar .label { font-weight: 700; color: var(--color-text-muted); }
        .coverage-bar .bar { flex: 1; height: 8px; background: var(--color-border-light); border-radius: 4px; overflow: hidden; display: flex; }
        .coverage-bar .bar-overseas { background: var(--gradient-success); height: 100%; }
        .coverage-bar .bar-china { background: var(--gradient-china); height: 100%; }
        .coverage-bar .stats { display: flex; gap: 12px; font-weight: 600; }
        .coverage-bar .stat-overseas { color: var(--color-success); }
        .coverage-bar .stat-china { color: #DC2626; }

        /* ===== OVERVIEW CARDS ===== */
        .overview { background: var(--color-bg-card); border: 1px solid var(--color-border-light); border-radius: var(--radius-lg); padding: 24px; margin-bottom: 20px; box-shadow: var(--shadow-card); }
        .overview-title { font-size: 16px; font-weight: 700; margin-bottom: 16px; display: flex; align-items: center; gap: 8px; color: var(--color-text-primary); }
        .overview-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
        .overview-grid.five-cols { grid-template-columns: repeat(3, 1fr); }
        .overview-item {
            padding: 14px 16px; border-radius: var(--radius-md);
            border: 1px solid var(--color-border-light); background: var(--color-bg);
            transition: all var(--transition-normal); min-width: 0; overflow: hidden;
        }
        .overview-item:hover { border-color: var(--color-success-light); box-shadow: 0 2px 8px rgba(5,150,105,0.08); }
        .overview-item-header { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; }
        .overview-item-icon { font-size: 16px; }
        .overview-item-label { font-size: 12px; font-weight: 700; color: var(--color-success); letter-spacing: 0.03em; }
        .overview-item-label.orange { color: var(--color-orange); }
        .overview-headline { font-size: 14px; font-weight: 700; color: var(--color-text-primary); margin-bottom: 5px; line-height: 1.4; }
        .overview-item-text { font-size: 12px; color: var(--color-text-secondary); line-height: 1.6; font-family: var(--font-family-cn); }

        /* ===== HEAT TREND ===== */
        .heat-card { background: var(--color-bg-card); border: 1px solid var(--color-border-light); border-radius: var(--radius-lg); margin-bottom: 20px; overflow: hidden; box-shadow: var(--shadow-card); }
        .heat-header { background: linear-gradient(135deg, #EA580C 0%, #DC2626 50%, #B91C1C 100%); color: #fff; padding: 18px 24px; }
        .heat-header-label { font-size: 13px; font-weight: 600; opacity: .85; letter-spacing: .5px; }
        .heat-header-title { font-size: 17px; font-weight: 800; margin-top: 4px; }
        .heat-body { padding: 16px 20px; }
        .heat-body p { font-size: 14px; color: var(--color-text-secondary); line-height: 1.7; margin-top: 12px; font-family: var(--font-family-cn); }
        .heat-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 14px; }
        .heat-table th { padding: 12px 16px; text-align: left; background: #FEF2F2; font-weight: 700; color: #991B1B; border-bottom: 2px solid #FECACA; font-size: 12px; letter-spacing: .03em; }
        .heat-table td { padding: 12px 16px; border-bottom: 1px solid var(--color-border-light); vertical-align: middle; line-height: 1.5; }
        .heat-table tr:last-child td { border-bottom: none; }
        .heat-table tr:hover { background: rgba(234,88,12,.03); }
        .heat-bar { display: flex; gap: 2px; align-items: center; }
        .heat-bar-fill { width: 10px; height: 14px; border-radius: 2px; background: linear-gradient(135deg, #EA580C, #DC2626); }
        .heat-bar-empty { width: 10px; height: 14px; border-radius: 2px; background: #F5F5F4; }
        .heat-trend-tag { display: inline-flex; align-items: center; gap: 3px; padding: 2px 8px; border-radius: var(--radius-full); font-size: 11px; font-weight: 600; }
        .heat-trend-tag.up { background: #EFFDF5; color: #059669; }
        .heat-trend-tag.stable { background: #EFF6FF; color: #2563EB; }
        .heat-trend-tag.down { background: #FEF2F2; color: #DC2626; }
        .heat-trend-tag.burst { background: #FEF2F2; color: #DC2626; }

        /* ===== TAB NAVIGATION (v4.0 毛玻璃Tab栏) ===== */
        .tab-nav {
            display: flex;
            gap: 4px;
            padding: 8px 12px;
            background: rgba(255,255,255,0.82);
            backdrop-filter: blur(20px) saturate(1.8);
            -webkit-backdrop-filter: blur(20px) saturate(1.8);
            border-radius: var(--radius-lg);
            border: 1px solid rgba(0,0,0,0.06);
            box-shadow: 0 2px 12px rgba(0,0,0,0.04);
            position: sticky;
            top: 12px;
            z-index: 100;
            margin-bottom: 24px;
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            scrollbar-width: none;
        }
        .tab-nav::-webkit-scrollbar { display: none; }
        .tab-btn {
            display: flex;
            align-items: center;
            gap: 6px;
            padding: 8px 16px;
            border: none;
            background: transparent;
            border-radius: var(--radius-sm);
            font-size: 13px;
            font-weight: 600;
            color: var(--color-text-muted);
            cursor: pointer;
            transition: all var(--transition-fast);
            white-space: nowrap;
            position: relative;
        }
        .tab-btn:hover {
            background: rgba(0,0,0,0.04);
            color: var(--color-text-primary);
        }
        .tab-btn:focus-visible {
            outline: 2px solid var(--color-success);
            outline-offset: -2px;
        }
        .tab-btn.active {
            color: var(--color-text-primary);
            background: var(--color-success-50);
        }
        .tab-btn[data-tab="llm"].active { background: var(--board-llm-50); color: var(--board-llm); }
        .tab-btn[data-tab="coding"].active { background: var(--board-coding-50); color: var(--board-coding); }
        .tab-btn[data-tab="app"].active { background: var(--board-app-50); color: var(--board-app); }
        .tab-btn[data-tab="industry"].active { background: var(--board-industry-50); color: var(--board-industry); }
        .tab-btn[data-tab="enterprise"].active { background: var(--board-enterprise-50); color: var(--board-enterprise); }
        .tab-btn .tab-icon {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 22px;
            height: 22px;
            border-radius: 6px;
            font-size: 13px;
            flex-shrink: 0;
        }
        .tab-btn .tab-label { line-height: 1; }

        /* Tab Panel */
        .tab-panel { display: none; }
        .tab-panel.active { display: block; }
        /* tab-panel visibility controlled by JS only via .active class */
        .tab-panel.active { display: block !important; }

        /* ===== BOARD SECTION WITH THEME COLOR (v4.0) ===== */
        .board-section {
            background: var(--color-bg-card); border: 1px solid var(--color-border-light);
            border-radius: var(--radius-lg); padding: 24px; margin-bottom: 16px;
            box-shadow: var(--shadow-card);
            border-top: 3px solid var(--board-accent, var(--color-success));
        }
        .board-section[data-board="llm"] { --board-accent: var(--board-llm); }
        .board-section[data-board="coding"] { --board-accent: var(--board-coding); }
        .board-section[data-board="app"] { --board-accent: var(--board-app); }
        .board-section[data-board="industry"] { --board-accent: var(--board-industry); }
        .board-section[data-board="enterprise"] { --board-accent: var(--board-enterprise); }
        .board-badge {
            display: inline-flex; align-items: center; justify-content: center;
            width: 26px; height: 26px; border-radius: 50%;
            background: var(--board-accent, var(--gradient-success)); color: #fff;
            font-size: 12px; font-weight: 700;
        }
        .sub-header { font-size: 13px; font-weight: 700; color: var(--color-text-muted); margin: 14px 0 10px; padding-left: 4px; letter-spacing: .5px; }
        .sub-header:first-child { margin-top: 0; }

        /* ===== NEWS ITEMS (v4.0 — 卡片化+板块主题色左边框+hover上浮) ===== */
        .news-item {
            background: var(--color-bg-card);
            border: 1px solid var(--color-border-light);
            border-left: 3px solid var(--board-accent, var(--color-success));
            border-radius: var(--radius-md);
            padding: 14px 18px;
            margin-bottom: 10px;
            transition: transform 0.2s ease, box-shadow 0.2s ease;
        }
        .news-item:hover {
            transform: translateY(-2px);
            box-shadow: 0 6px 16px color-mix(in srgb, var(--board-accent, var(--color-success)) 12%, transparent);
        }
        /* 板块级新闻项继承主题色 */
        .tab-panel[data-tab="llm"] .news-item { border-left-color: var(--board-llm); }
        .tab-panel[data-tab="llm"] .news-item:hover { box-shadow: 0 6px 16px rgba(5,150,105,0.12); }
        .tab-panel[data-tab="coding"] .news-item { border-left-color: var(--board-coding); }
        .tab-panel[data-tab="coding"] .news-item:hover { box-shadow: 0 6px 16px rgba(37,99,235,0.12); }
        .tab-panel[data-tab="app"] .news-item { border-left-color: var(--board-app); }
        .tab-panel[data-tab="app"] .news-item:hover { box-shadow: 0 6px 16px rgba(124,58,237,0.12); }
        .tab-panel[data-tab="industry"] .news-item { border-left-color: var(--board-industry); }
        .tab-panel[data-tab="industry"] .news-item:hover { box-shadow: 0 6px 16px rgba(217,119,6,0.12); }
        .tab-panel[data-tab="enterprise"] .news-item { border-left-color: var(--board-enterprise); }
        .tab-panel[data-tab="enterprise"] .news-item:hover { box-shadow: 0 6px 16px rgba(225,29,72,0.12); }
        .news-tag { display: inline-block; padding: 1px 6px; border-radius: var(--radius-full); font-size: 10px; font-weight: 700; vertical-align: middle; }
        .tag-hot { background: #FEF2F2; color: var(--color-danger); }
        .tag-new { background: #EFFDF5; color: var(--color-success); }
        .tag-funding { background: #E0F2FE; color: #0284C7; }
        .tag-policy { background: #FFF7ED; color: var(--color-orange); }
        .tag-practice { background: #ECFDF5; color: #059669; }
        .tag-cn { background: #FEF2F2; color: #DC2626; }
        /* v5.1→v4.0: 标题行 — tag + 标题(16px/600) + 来源(12px) inline 合并 */
        .news-title-row { font-size: 16px; font-weight: 600; line-height: 1.5; display: flex; align-items: baseline; flex-wrap: wrap; gap: 5px; margin-bottom: 4px; }
        .news-title-row a { color: var(--color-text-primary); text-decoration: none; }
        .news-title-row a:hover { color: var(--color-success); }
        .news-source-inline { font-size: 11px; color: var(--color-text-muted); font-weight: 400; flex-shrink: 0; white-space: nowrap; }
        /* 兼容旧的 news-title / news-source（独立行）结构 */
        .news-title { font-size: 15px; font-weight: 600; margin: 4px 0 3px; }
        .news-title a { color: var(--color-text-primary); text-decoration: none; }
        .news-title a:hover { color: var(--color-success); }
        .news-source { font-size: 12px; color: var(--color-text-muted); }
        .news-detail { margin-top: 6px; display: flex; flex-direction: column; gap: 4px; }
        .news-detail-row { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; line-height: 1.6; }
        .news-detail-label { flex-shrink: 0; font-weight: 700; color: var(--color-success); font-size: 12px; padding: 1px 0; min-width: 60px; }
        .news-detail-label.orange { color: var(--color-orange); }
        .news-detail-label.china { color: #DC2626; }
        .news-detail-value { color: var(--color-text-secondary); flex: 1; font-family: var(--font-family-cn); }
        .news-detail-value strong { color: var(--color-text-primary); font-weight: 600; }
        .news-data-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
        .news-data-chip { display: inline-flex; align-items: center; padding: 3px 10px; background: #F0FDF4; border: 1px solid #BBF7D0; border-radius: var(--radius-full); font-size: 12px; font-weight: 600; color: #166534; transition: all .15s; }
        .news-data-chip:hover { background: #DCFCE7; border-color: #86EFAC; }
        .news-data-chip.orange { background: #FFF7ED; border-color: #FED7AA; color: #9A3412; }
        .news-data-chip.china { background: #FEF2F2; border-color: #FECACA; color: #991B1B; }
        .news-summary-compact { font-size: 13px; color: var(--color-text-muted); margin-top: 2px; line-height: 1.55; font-family: var(--font-family-cn); }

        /* ===== DEEP FOCUS (v4.0 — 板块主题色) ===== */
        .deep-focus-card { background: var(--color-bg-card); border: 1px solid var(--color-border-light); border-radius: var(--radius-lg); padding: 0; margin-bottom: 16px; box-shadow: var(--shadow-card); overflow: hidden; border-top: 3px solid var(--board-accent, var(--color-purple)); }
        /* 板块主题色 header */
        .tab-panel[data-tab="llm"] .deep-focus-card { border-top-color: var(--board-llm); }
        .tab-panel[data-tab="llm"] .deep-focus-header { background: linear-gradient(135deg, #059669 0%, #047857 100%); }
        .tab-panel[data-tab="coding"] .deep-focus-card { border-top-color: var(--board-coding); }
        .tab-panel[data-tab="coding"] .deep-focus-header { background: linear-gradient(135deg, #2563EB 0%, #1D4ED8 100%); }
        .tab-panel[data-tab="app"] .deep-focus-card { border-top-color: var(--board-app); }
        .tab-panel[data-tab="app"] .deep-focus-header { background: linear-gradient(135deg, #7C3AED 0%, #6D28D9 100%); }
        .tab-panel[data-tab="industry"] .deep-focus-card { border-top-color: var(--board-industry); }
        .tab-panel[data-tab="industry"] .deep-focus-header { background: linear-gradient(135deg, #D97706 0%, #B45309 100%); }
        .tab-panel[data-tab="enterprise"] .deep-focus-card { border-top-color: var(--board-enterprise); }
        .tab-panel[data-tab="enterprise"] .deep-focus-header { background: linear-gradient(135deg, #E11D48 0%, #BE123C 100%); }
        .deep-focus-header { background: var(--gradient-purple); color: #fff; padding: 18px 24px; display: flex; align-items: center; gap: 10px; }
        .deep-focus-header.orange-theme { background: linear-gradient(135deg, #EA580C 0%, #DC2626 100%); }
        .deep-focus-header.china-theme { background: linear-gradient(135deg, #DC2626 0%, #B91C1C 50%, #991B1B 100%); }
        .deep-focus-label { font-size: 13px; font-weight: 600; opacity: .85; letter-spacing: .5px; }
        .deep-focus-title { font-size: 17px; font-weight: 800; margin-top: 4px; line-height: 1.4; }
        .deep-focus-body { padding: 20px 24px; }
        .deep-focus-body p { font-size: 14.5px; color: var(--color-text-secondary); line-height: 1.8; margin-bottom: 18px; font-family: var(--font-family-cn); }
        .deep-focus-body p:last-child { margin-bottom: 0; }
        .deep-focus-body p strong { color: var(--color-text-primary); }
        .deep-focus-takeaway { margin-top: 20px; padding: 16px 18px; background: linear-gradient(135deg, #F5F3FF 0%, #EDE9FE 100%); border-radius: var(--radius-md); border-left: 4px solid var(--color-purple); }
        .deep-focus-takeaway.orange-theme { background: linear-gradient(135deg, #FFF7ED 0%, #FFEDD5 100%); border-left-color: var(--color-orange); }
        .deep-focus-takeaway.china-theme { background: linear-gradient(135deg, #FEF2F2 0%, #FEE2E2 100%); border-left-color: #DC2626; }
        .deep-focus-takeaway-label { font-size: 12px; font-weight: 700; color: var(--color-purple); margin-bottom: 6px; letter-spacing: .5px; }
        .deep-focus-takeaway-label.orange { color: var(--color-orange); }
        .deep-focus-takeaway-label.china { color: #DC2626; }
        .deep-focus-takeaway-text { font-size: 13.5px; color: var(--color-text-secondary); line-height: 1.7; font-family: var(--font-family-cn); }
        .deep-focus-takeaway-text strong { color: var(--color-text-primary); }

        /* ===== PATTERN INSIGHT (pi) ===== */
        .pi-card { background: var(--color-bg-card); border: 1px solid var(--color-border-light); border-radius: var(--radius-lg); margin-bottom: 16px; overflow: hidden; box-shadow: var(--shadow-card); transition: all .25s cubic-bezier(.4,0,.2,1); }
        .pi-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,.08); transform: translateY(-1px); }
        .pi-header { display: flex; align-items: center; gap: 12px; padding: 14px 20px; background: linear-gradient(135deg, #FFFBEB 0%, #FEF3C7 100%); border-bottom: 1px solid #FDE68A; }
        .pi-badge { display: inline-flex; align-items: center; justify-content: center; height: 26px; padding: 0 10px; border-radius: 8px; font-size: 11px; font-weight: 700; color: #fff; background: linear-gradient(135deg, #B45309 0%, #D97706 100%); white-space: nowrap; }
        .pi-title { font-size: 16px; font-weight: 700; color: var(--color-text-primary); flex: 1; letter-spacing: -.01em; line-height: 1.4; }
        .pi-row { display: flex; padding: 14px 20px; border-bottom: 1px solid var(--color-border-light); gap: 14px; }
        .pi-row:last-child { border-bottom: none; }
        .pi-row.highlight { background: linear-gradient(135deg, rgba(217,119,6,.04) 0%, rgba(217,119,6,.01) 100%); }
        .pi-row-label { width: 56px; flex-shrink: 0; font-size: 12px; font-weight: 700; color: #A8A29E; padding-top: 2px; letter-spacing: .02em; }
        .pi-row-label.l2 { color: #D97706; }
        .pi-row-content { flex: 1; font-size: 14px; color: var(--color-text-secondary); line-height: 1.7; font-family: var(--font-family-cn); }
        .pi-row-content strong { color: var(--color-text-primary); font-weight: 700; }
        .pi-evo { display: flex; align-items: center; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
        .pi-evo-step { display: flex; align-items: center; gap: 8px; padding: 7px 12px; background: var(--color-bg-table-header); border-radius: 8px; border: 1px solid var(--color-border-light); transition: all .15s; }
        .pi-evo-step.active { background: rgba(217,119,6,.12); border-color: #D97706; box-shadow: 0 0 0 1px rgba(217,119,6,.15); }
        .pi-evo-step.future { background: rgba(124,58,237,.06); border-color: #8B5CF6; }
        .pi-evo-tag { font-size: 10px; font-weight: 800; color: #D97706; padding: 2px 7px; background: rgba(217,119,6,.1); border-radius: 4px; letter-spacing: .02em; }
        .pi-evo-step.future .pi-evo-tag { color: #7C3AED; background: rgba(124,58,237,.1); }
        .pi-evo-text { font-size: 12px; color: var(--color-text-secondary); }
        .pi-evo-arrow { color: #A8A29E; font-weight: 700; font-size: 14px; }
        .pi-table { padding: 10px 20px 16px; border-top: 1px solid var(--color-border-light); }
        .pi-t-head { display: grid; grid-template-columns: 90px 1fr 1fr; gap: 10px; padding: 6px 10px; border-bottom: 2px solid var(--color-border-light); margin-bottom: 4px; }
        .pi-t-head span { font-size: 11px; font-weight: 700; color: #A8A29E; text-transform: uppercase; letter-spacing: .06em; }
        .pi-t-section { padding: 6px 10px 2px; }
        .pi-t-section-tag { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 700; padding: 2px 10px; border-radius: 999px; letter-spacing: .03em; }
        .pi-t-section.verified .pi-t-section-tag { color: #047857; background: rgba(5,150,105,.08); }
        .pi-t-section.current .pi-t-section-tag { color: #D97706; background: rgba(217,119,6,.08); }
        .pi-t-section.projected .pi-t-section-tag { color: #7C3AED; background: rgba(124,58,237,.08); }
        .pi-t-row { display: grid; grid-template-columns: 90px 1fr 1fr; gap: 10px; padding: 6px 10px; border-radius: 6px; font-size: 13px; line-height: 1.6; transition: background .15s; }
        .pi-t-row:hover { background: rgba(0,0,0,.02); }
        .pi-t-row.projected { background: rgba(124,58,237,.02); }
        .pi-t-row.projected:hover { background: rgba(124,58,237,.05); }
        .pi-t-rule { font-weight: 600; color: #B45309; font-size: 12px; padding-top: 1px; }
        .pi-t-row.projected .pi-t-rule { color: #7C3AED; }
        .pi-t-reality { color: var(--color-text-primary); font-weight: 500; }
        .pi-t-analogy { color: var(--color-text-secondary); padding-left: 10px; border-left: 2px solid var(--color-border-light); }
        .pi-t-divider { border-top: 2px dashed var(--color-border-light); margin: 8px 10px; }
        .pi-t-verify { display: flex; align-items: center; gap: 6px; margin-top: 8px; padding: 6px 10px; background: rgba(5,150,105,.06); border-radius: 6px; font-size: 12px; font-weight: 600; color: #047857; }
        .pi-confidence { display: flex; align-items: center; gap: 6px; margin-top: 8px; padding: 6px 10px; background: rgba(124,58,237,.04); border-radius: 6px; border-left: 3px solid #8B5CF6; font-size: 11px; font-weight: 500; color: #7C3AED; letter-spacing: .02em; }

        /* ===== DATA TABLE ===== */
        .data-table-wrap { overflow-x: auto; margin: 16px 0; border-radius: var(--radius-md); border: 1px solid var(--color-border); }
        .data-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 14px; }
        .data-table th, .data-table td { padding: 12px 18px; text-align: left; border-bottom: 1px solid var(--color-border-light); }
        .data-table th { background: var(--color-bg-table-header); font-weight: 600; color: var(--color-text-secondary); font-size: 12px; text-transform: uppercase; letter-spacing: .04em; }
        .data-table td { color: var(--color-text-primary); line-height: 1.5; }
        .data-table tr:last-child td { border-bottom: none; }
        .data-table tbody tr:hover { background: var(--color-bg-hover); }
        /* pi-card 内嵌 table 样式升级 */
        .pi-card table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 14px; margin: 8px 0; }
        .pi-card th { padding: 10px 16px; background: rgba(124,58,237,0.06); font-weight: 600; font-size: 12px; color: var(--color-text-secondary); border-bottom: 1px solid rgba(124,58,237,0.12); text-align: left; }
        .pi-card td { padding: 10px 16px; border-bottom: 1px solid var(--color-border-light); line-height: 1.5; color: var(--color-text-primary); }
        .pi-card tr:last-child td { border-bottom: none; }
        .pi-card table + p { font-size: 13px; color: var(--color-text-muted); margin-top: 8px; }
        .section-card { background: var(--color-bg-card); border: 1px solid var(--color-border-light); border-radius: var(--radius-lg); padding: 24px; margin-bottom: 16px; box-shadow: var(--shadow-card); }
        .section-header { font-size: 16px; font-weight: 700; margin-bottom: 16px; padding-bottom: 10px; border-bottom: 2px solid var(--color-border-light); display: flex; align-items: center; gap: 8px; color: var(--color-text-primary); }
        .section-header .num { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: var(--gradient-success); color: #fff; font-size: 12px; font-weight: 700; }
        .section-header .num.orange { background: var(--gradient-orange); }

        /* ===== PREVIEW / WATCHLIST ===== */
        .watch-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }

        /* ===== INSIGHT BLOCK (capability_update) ===== */
        .insight-block {
            margin-top: 20px; background: linear-gradient(135deg, #EFF6FF 0%, #EDE9FE 100%);
            border: 1px solid #DBEAFE; border-radius: var(--radius-lg); padding: 24px;
            box-shadow: var(--shadow-card);
        }
        .insight-block-title { font-size: 16px; font-weight: 800; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; color: #1E40AF; }
        .insight-block-body { font-size: 14px; color: #374151; line-height: 1.8; font-family: var(--font-family-cn); }

        /* ===== ANIMATE ON SCROLL ===== */
        .animate-on-scroll {
            opacity: 0; transform: translateY(14px);
            transition: opacity 0.42s ease, transform 0.42s ease;
        }
        .animate-on-scroll.visible { opacity: 1; transform: translateY(0); }
        @media (prefers-reduced-motion: reduce) {
            .animate-on-scroll { transition: none; opacity: 1; transform: none; }
        }

        /* ===== SCROLL TO TOP ===== */
        .scroll-to-top {
            position: fixed; bottom: 28px; right: 28px;
            width: 40px; height: 40px; border-radius: 50%;
            background: var(--color-success); color: #fff; border: none;
            cursor: pointer; font-size: 18px; display: flex; align-items: center; justify-content: center;
            box-shadow: 0 4px 14px rgba(5,150,105,0.3); opacity: 0; pointer-events: none;
            transition: opacity var(--transition-normal), transform var(--transition-normal);
            z-index: 200;
        }
        .scroll-to-top.visible { opacity: 1; pointer-events: auto; }
        .scroll-to-top:hover { transform: translateY(-2px); }

        /* ===== FOOTER ===== */
        .doc-footer {
            margin-top: 56px; padding: 24px 0 0 0; border-top: 1px solid var(--color-border);
            font-size: 12px; color: var(--color-text-muted); text-align: center;
            font-family: var(--font-family-cn); line-height: 1.8;
            max-width: 100%;
        }
        .doc-footer a { color: var(--color-success); }

        /* ===== RESPONSIVE ===== */
        @media (max-width: 768px) {
            .layout-wrapper { flex-direction: column; }
            .sidebar-nav {
                display: none;
            }
            .sidebar-collapse-btn { display: none; }
            .content-inner { padding: 16px 12px 80px; width: 100%; }
            /* Tab: 移动端图标模式 */
            .tab-nav { top: 0; padding: 6px 8px; gap: 2px; border-radius: 0; }
            .tab-btn { padding: 8px 10px; font-size: 12px; min-width: 44px; min-height: 44px; touch-action: manipulation; }
            .tab-btn .tab-label { display: none; }
            .tab-btn .tab-icon { width: 22px; height: 22px; font-size: 14px; }
            .overview-grid.five-cols { grid-template-columns: 1fr 1fr; }
            .watch-grid { grid-template-columns: 1fr; }
            .header-title { font-size: 22px; }
            .heat-table { font-size: 13px; }
            .heat-table th, .heat-table td { padding: 8px 10px; }
            .data-table th, .data-table td { padding: 8px 12px; }
            .pi-card th { padding: 8px 12px; }
            .pi-card td { padding: 8px 12px; }
            .coverage-bar { flex-direction: column; gap: 8px; }
            .pi-evo { flex-direction: column; align-items: flex-start; }
            .pi-evo-arrow { display: none; }
            .pi-t-head { display: none; }
            .pi-t-row { grid-template-columns: 1fr; gap: 2px; padding: 6px 10px; border-left: 3px solid var(--color-border-light); margin-bottom: 4px; }
            .pi-t-row.projected { border-left-color: rgba(124,58,237,.3); }
            .pi-t-analogy { border-left: none; padding-left: 0; font-size: 12px; }
            .news-item { padding: 12px 14px; border-left-width: 3px; }
            .news-title-row { font-size: 16px; flex-wrap: wrap; }
            .news-summary-compact { font-size: 13px; }
            .deep-focus-card { margin: 16px 0; }
            .header { padding: 20px 0 16px; }
            .header-meta { flex-wrap: wrap; }
        }
        @media (min-width: 769px) and (max-width: 1024px) {
            .tab-btn .tab-label { display: inline; }
        }
        @media (max-width: 960px) {
            .overview-grid.five-cols { grid-template-columns: 1fr 1fr; }
        }
        @media (min-width: 1025px) {
            .tab-btn .tab-label { display: inline; }
        }

/* ===== AI洞察定制层 ===== */
/* ===== AI洞察定制层样式（v4.0 — Tab导航升级，板块主题色）===== */
/* 
 * ⚠️ 本文件只包含AI洞察项目特有的组件样式和扩展变量。
 * CSS变量定义和基础样式从 qingshuang-research-style 动态引用。
 * 
 * 引用路径: ../../skills/qingshuang-research-style/references/base-styles.css
 * 引用方式: gen_daily_html.py 和 update_homepage.py 自动合并
 * 
 * 改动规则:
 * - 只改本文件（定制层）
 * - CSS变量（颜色/间距/阴影等）改 qingshuang skill，不要在这里重复定义
 * - 新增组件样式在本文件添加
 */

/* ===== AI洞察扩展CSS变量（公共层未覆盖的）===== */
:root {
    --color-orange: #EA580C;
    --color-success-dark: #047857;
    --color-success-50: #ECFDF5;
    --color-success-100: #D1FAE5;
    --color-danger-50: #FFF1F2;
    --color-warning-50: #FFFBEB;
    --color-info-50: #EFF6FF;
    --color-info-100: #DBEAFE;
    --color-purple-50: #F5F3FF;
    --color-purple-100: #EDE9FE;
    --gradient-orange: linear-gradient(135deg, #EA580C 0%, #F97316 100%);
    --gradient-china: linear-gradient(135deg, #DC2626 0%, #EF4444 100%);
    --color-bg-hover: rgba(0,0,0,0.025);
}

/* ===== 周报Header副标题覆盖（公共层max-width:580px太窄）===== */
.header-subtitle, .subtitle {
    max-width: 100% !important;
    color: var(--color-text-muted) !important;
    font-size: 13px !important;
    margin-top: 14px !important;
}

/* ===== 周报insight-card段落样式（统一用CSS而非内联style）===== */
.insight-card > p {
    line-height: 1.75;
    font-size: 13px;
}

/* ===== 日报特有组件 ===== */

/* 最新日报卡片 */
.latest-report-card {
    background: linear-gradient(135deg, var(--gradient-success));
    border-radius: var(--radius-lg);
    padding: 16px 20px;
    margin-bottom: 16px;
}

/* 日历视图 */
.calendar-container {
    max-width: 280px;
}

.calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
}

.calendar-day.has-report {
    background: var(--color-success-50);
    color: var(--color-success);
    font-weight: 600;
}

.calendar-day.has-weekly::after {
    content: '';
    position: absolute;
    bottom: 2px;
    left: 3px;
    right: 3px;
    height: 3px;
    background: var(--gradient-purple);
    border-radius: 2px;
}

.calendar-day.today {
    border: 2px solid var(--color-info);
    border-radius: var(--radius-sm);
}

/* 周报入口卡片 */
.weekly-report-card {
    background: linear-gradient(135deg, #EFF6FF 0%, #F5F3FF 100%);
    border-radius: var(--radius-lg);
    padding: 16px 20px;
    margin-bottom: 12px;
}

/* ===== 首页特有组件 ===== */

/* Tab导航（首页）*/
.tab-nav {
    background: rgba(255,255,255,0.85);
    backdrop-filter: blur(20px) saturate(1.8);
    position: sticky;
    top: 12px;
    z-index: 100;
}

.tab-btn.active {
    color: var(--color-success);
    border-bottom: 2px solid var(--color-success);
}

/* 统计卡片 */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}

.stat-card {
    background: var(--color-bg-card);
    border-radius: var(--radius-md);
    padding: 16px;
    text-align: center;
    box-shadow: var(--shadow-card);
}

/* 知识库维度卡片 */
.kb-dimension {
    border-radius: var(--radius-md);
    overflow: hidden;
    transition: all 0.2s ease;
}

.kb-dimension:hover {
    box-shadow: var(--shadow-hover);
}

.dim-header {
    cursor: pointer;
    padding: 12px 16px;
}

.kb-item-text {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    font-size: 13px;
    color: var(--color-text-secondary);
}

/* 追踪体系表格 */
.tracking-table {
    width: 100%;
    border-collapse: collapse;
}

.tracking-table th {
    background: var(--color-bg-table-header);
    padding: 8px 12px;
    text-align: left;
    font-size: 13px;
    color: var(--color-text-secondary);
    border-bottom: 1px solid var(--color-border);
}

.tracking-table td {
    padding: 6px 12px;
    font-size: 13px;
    border-bottom: 1px solid var(--color-border-light);
}

/* ===== 响应式 ===== */

@media (max-width: 768px) {
    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .tab-btn .tab-label {
        display: none;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .stats-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}


/* ============================================================
   AI周报视觉系统 v4.0 (2026-06-30)
   对齐 qingshuang-research-style v3.2 规范
   完全重写，替代之前零散补丁
   ============================================================ */

/* ── 1. Top5 卡片：legacy 变量保留 ── */
.llm .news-card      { --card-accent: var(--board-llm,      var(--color-success)); }
.coding .news-card   { --card-accent: var(--board-coding,   var(--color-info)); }
.app .news-card      { --card-accent: var(--board-app,      var(--color-purple)); }
.industry .news-card { --card-accent: var(--board-industry, var(--color-warning)); }
.enterprise .news-card { --card-accent: var(--board-enterprise, var(--color-danger)); }

/* news-card 左边框 + hover 上浮（Material Design cubic-bezier） */
.news-card {
    border-left: 4px solid var(--card-accent, var(--color-success));
    border-radius: var(--radius-md);
    padding: 20px 24px;
    margin-bottom: 14px;
    box-shadow: var(--shadow-card);
    background: #fff;
    transition: box-shadow 200ms cubic-bezier(0.4,0,0.2,1),
                transform   200ms cubic-bezier(0.4,0,0.2,1);
}
.news-card:hover {
    box-shadow: 0 8px 24px rgba(0,0,0,.10), 0 2px 6px rgba(0,0,0,.06);
    transform: translateY(-2px);
}

/* ── 2. Header：深色渐变 + 毛玻璃 badge ── */
/* qingshuang-research-style: 报告标题 30-34px / 800 / 渐变色 */
.doc-header {
    background: linear-gradient(135deg, #0f172a 0%, #1e3a5f 50%, #1e1b4b 100%);
    border-radius: var(--radius-md);
    padding: 52px 44px 44px !important;
    margin-bottom: 40px !important;
    position: relative;
    overflow: hidden;
}
.doc-header::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at 15% 50%, rgba(37,99,235,.28) 0%, transparent 55%),
        radial-gradient(ellipse at 85% 15%, rgba(124,58,237,.22) 0%, transparent 50%),
        radial-gradient(ellipse at 55% 95%, rgba(5,150,105,.18) 0%, transparent 45%);
    pointer-events: none;
}
.doc-header .header-badge {
    display: inline-block;
    background: rgba(255,255,255,.12);
    backdrop-filter: blur(8px);
    color: rgba(255,255,255,.8);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    padding: 4px 12px;
    border-radius: 999px;
    margin-bottom: 18px;
    border: 1px solid rgba(255,255,255,.15);
}
.doc-header .header-title {
    font-size: 36px !important;
    font-weight: 800 !important;
    background: linear-gradient(90deg, #fff 0%, rgba(255,255,255,.82) 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    letter-spacing: -.025em;
    line-height: 1.2 !important;
    margin-bottom: 18px !important;
    text-wrap: balance;
}
.doc-header p.header-meta {
    color: rgba(255,255,255,.55);
    font-size: 13px;
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    margin: 0;
    align-items: center;
}
.doc-header p.header-meta .meta-icon { stroke: rgba(255,255,255,.6); }
/* subtitle 行 */
.doc-header > div[style*="color:var(--color-text-muted)"] {
    color: rgba(255,255,255,.65) !important;
    font-size: 14px !important;
    line-height: 1.75 !important;
    max-width: 700px;
}
/* 底部渐变线 */
.doc-header::after {
    background: linear-gradient(90deg, rgba(255,255,255,.25), rgba(255,255,255,.08), transparent) !important;
    height: 1px !important;
}

/* ── 3. 页面整体背景 ── */
/* qingshuang: body bg + mesh gradient */
body {
    background: #F8FAFB !important;
    background-image:
        radial-gradient(at 20% 20%, rgba(5,150,105,.05) 0%, transparent 50%),
        radial-gradient(at 80% 80%, rgba(37,99,235,.04) 0%, transparent 50%) !important;
}

/* ── 4. 排版层级（qingshuang 规范：至少差 200 字重） ── */
/* 章节标题：22px / 700 */
section > h2 {
    font-size: 22px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    color: #1C1917;
    letter-spacing: -.01em;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px !important;
    margin-bottom: 22px !important;
}
section > h2 .meta-icon { width: 20px !important; height: 20px !important; flex-shrink: 0; }
/* 正文：15px / 400 / 1.65 行高 / #57534E */
p, .news-card-desc, .insight-card p, .callout {
    font-size: 15px !important;
    line-height: 1.75 !important;
    color: #57534E !important;
}
/* 辅助文字 */
.news-card-meta, .meta-item, .daily-item-kw,
.insight-tag, .doc-footer p {
    font-size: 12px !important;
    color: #78716C !important;
}

/* ── 5. doc-chapter-label：pill 胶囊标签 ── */
.doc-chapter-label {
    display: inline-block !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: .1em !important;
    padding: 3px 12px !important;
    border-radius: 999px !important;
    margin-bottom: 6px !important;
    background: rgba(37,99,235,.08);
    color: #2563EB;
}
/* 各板块用板块色 */
section#llm      > .doc-chapter-label { background: rgba(5,150,105,.10); color: #059669; }
section#coding   > .doc-chapter-label { background: rgba(37,99,235,.10); color: #2563EB; }
section#app      > .doc-chapter-label { background: rgba(124,58,237,.10); color: #7C3AED; }
section#industry > .doc-chapter-label { background: rgba(217,119,6,.10); color: #D97706; }
section#enterprise > .doc-chapter-label { background: rgba(225,29,72,.10); color: #E11D48; }

/* ── 6. 板块区分：分隔线 + 间距 ── */
section#llm, section#coding, section#app, section#industry, section#enterprise {
    margin-top: 48px !important;
    padding-top: 36px !important;
    border-top: 2px solid var(--color-border-light);
    position: relative;
}
/* 板块 h2 颜色 */
section#llm      > h2 { color: #059669 !important; }
section#coding   > h2 { color: #2563EB !important; }
section#app      > h2 { color: #7C3AED !important; }
section#industry > h2 { color: #D97706 !important; }
section#enterprise > h2 { color: #E11D48 !important; }

/* ── 7. stat-card：qingshuang 统计数值规范 ── */
/* 数值 20-28px / 700 / 语义色；标签 12px / 500 / muted */
.stat-card {
    padding: 20px 16px !important;
    text-align: center;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
    background: #fff;
    border: 1px solid var(--color-border-light);
    border-top: 3px solid transparent;
    transition: box-shadow 200ms cubic-bezier(0.4,0,0.2,1),
                transform   200ms cubic-bezier(0.4,0,0.2,1);
    font-variant-numeric: tabular-nums;
}
.stat-card:hover { box-shadow: 0 6px 20px rgba(0,0,0,.09); transform: translateY(-2px); }

.stat-value {
    font-size: 26px !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    letter-spacing: -.02em;
    display: block;
    margin-bottom: 6px;
}
.stat-label {
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: .07em !important;
    color: #78716C !important;
    display: block;
    line-height: 1.4;
}

/* 语义色（最高优先级） */
.stat-card.stat-success { border-top-color: #059669; }
.stat-card.stat-info    { border-top-color: #2563EB; }
.stat-card.stat-purple  { border-top-color: #7C3AED; }
.stat-card.stat-warning { border-top-color: #D97706; }
.stat-card.stat-danger  { border-top-color: #E11D48; }

.stat-card.stat-success .stat-value { color: #059669 !important; }
.stat-card.stat-info    .stat-value { color: #2563EB !important; }
.stat-card.stat-purple  .stat-value { color: #7C3AED !important; }
.stat-card.stat-warning .stat-value { color: #D97706 !important; }
.stat-card.stat-danger  .stat-value { color: #E11D48 !important; }

/* stats-grid */
.stats-grid {
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)) !important;
    gap: 12px !important;
    margin-top: 18px;
}

/* ── 8. board-table：精致表格 ── */
/* qingshuang：表格表头要有语义色 + 事件列优先展示 */
.board-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 13px;
    table-layout: fixed;
}
.board-table colgroup col:first-child { width: 55%; }
.board-table colgroup col:nth-child(2) { width: 30%; }
.board-table colgroup col:last-child  { width: 15%; }
.board-table thead th {
    padding: 10px 14px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    background: color-mix(in srgb, var(--board-color, #2563EB) 7%, white);
    color: var(--board-color, #2563EB);
    border-bottom: 2px solid var(--board-color, #2563EB);
    text-align: left;
    white-space: nowrap;
}
.board-table tbody td {
    padding: 10px 14px;
    border-bottom: 1px solid var(--color-border-light);
    vertical-align: top;
    line-height: 1.6;
    font-size: 13px !important;
    word-break: break-word;
}
.board-table tbody tr:last-child td { border-bottom: none; }
.board-table tbody tr:hover { background: color-mix(in srgb, var(--board-color, #2563EB) 3%, white); }
.board-table tbody td:last-child { white-space: nowrap; font-size: 12px; text-align: center; }

/* table-wrap 卡片化 */
.table-wrap {
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-card);
    border: 1px solid var(--color-border-light);
    margin: 16px 0;
}

/* ── 9. callout 升级 ── */
.callout {
    border-left-width: 4px !important;
    padding: 14px 20px !important;
    border-radius: 0 var(--radius-md) var(--radius-md) 0 !important;
    margin: 20px 0 !important;
    font-size: 14px !important;
    line-height: 1.75 !important;
    background: #FAFAFA;
}
.callout strong { color: #1C1917; font-weight: 700; }
.callout-purple  { background: rgba(124,58,237,.04)  !important; border-color: #7C3AED !important; }
.callout-info    { background: rgba(37,99,235,.04)   !important; border-color: #2563EB !important; }
.callout-success { background: rgba(5,150,105,.04)   !important; border-color: #059669 !important; }
.callout-warning { background: rgba(217,119,6,.04)   !important; border-color: #D97706 !important; }
.callout-danger  { background: rgba(225,29,72,.04)   !important; border-color: #E11D48 !important; }

/* ── 10. 日报索引卡片 ── */
.daily-item {
    display: flex !important;
    align-items: flex-start !important;
    gap: 16px !important;
    background: #fff;
    border-radius: var(--radius-md);
    padding: 14px 18px !important;
    margin-bottom: 10px !important;
    box-shadow: var(--shadow-card);
    border-left: 3px solid #2563EB;
    transition: box-shadow 200ms cubic-bezier(0.4,0,0.2,1);
}
.daily-item:hover { box-shadow: 0 4px 16px rgba(0,0,0,.09); }
.daily-item-date {
    flex-shrink: 0;
    min-width: 72px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #2563EB !important;
    line-height: 1.5;
}
.daily-item-link {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #1C1917 !important;
    text-decoration: none !important;
    line-height: 1.4;
}
.daily-item-link:hover { color: #2563EB !important; }
.daily-item-kw {
    font-size: 11px !important;
    color: #78716C !important;
    margin-top: 3px;
    line-height: 1.5;
}

/* ── 11. 宏观叙事区：callout 包装 ── */
section#narrative p {
    font-size: 15px !important;
    line-height: 1.8 !important;
    color: #57534E !important;
    max-width: 65ch;
}
section#narrative .callout { margin-bottom: 16px !important; }

/* ── 12. 了解更多区域增强 ── */
.learn-more-section,
div[class*="learn-more"] {
    margin-top: 56px;
    padding: 32px 36px;
    background: linear-gradient(135deg, rgba(37,99,235,.04) 0%, rgba(124,58,237,.04) 100%);
    border-radius: var(--radius-md);
    border: 1px solid rgba(37,99,235,.12);
    text-align: center;
}

/* ── 13. footer ── */
.doc-footer {
    margin-top: 64px;
    padding: 48px 0 32px;
    text-align: center;
    border-top: 1px solid var(--color-border-light);
}
.doc-footer .footer-brand {
    font-size: 15px;
    font-weight: 600;
    color: #1C1917;
    letter-spacing: -0.01em;
    margin-bottom: 8px;
}
.doc-footer .footer-desc {
    font-size: 13px;
    color: #78716C;
    line-height: 1.7;
    max-width: 480px;
    margin: 0 auto 24px;
}
.doc-footer .footer-divider {
    width: 24px;
    height: 1px;
    background: var(--color-border);
    margin: 0 auto 24px;
}
.doc-footer .footer-home-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 28px;
    background: #1C1917;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    color: #FFFFFF;
    text-decoration: none;
    transition: all .2s ease;
    letter-spacing: 0.01em;
}
.doc-footer .footer-home-btn:hover {
    background: #2563EB;
    transform: translateY(-1px);
    box-shadow: 0 4px 14px rgba(37,99,235,0.25);
}
.doc-footer .footer-home-btn svg {
    opacity: 0.7;
}
.doc-footer .footer-meta {
    margin-top: 32px;
    font-size: 12px;
    color: #A8A29E;
    letter-spacing: 0.02em;
}
.doc-footer a { color: inherit; text-decoration: none; }
.doc-footer a:hover { color: #2563EB; }

/* ── 14. 内容区宽度优化（sidebar 228px → 减小到 200px） ── */
:root { --sidebar-width: 200px; }
.sidebar-nav .toc-link {
    font-size: 12px !important;
    padding: 5px 10px !important;
    line-height: 1.45;
    color: #78716C;
}
.sidebar-nav .toc-link:hover,
.sidebar-nav .toc-link.active { color: #2563EB; background: rgba(37,99,235,.06); }
.content-inner {
    padding: 32px 48px 120px !important;
}

/* ── 15. 无障碍：焦点环（qingshuang 规范）── */
a:focus-visible, button:focus-visible {
    outline: 2px solid #059669;
    outline-offset: 3px;
    box-shadow: 0 0 0 5px rgba(5,150,105,.12);
}
:focus:not(:focus-visible) { outline: none; }

/* ── 16. 行宽限制（qingshuang: 65ch，防阅读疲劳）── */
.news-card-desc, .news-card-why, p:not(.header-meta), .callout,
.insight-card p {
    max-width: 65ch;
}

/* ── 17. 微交互 prefers-reduced-motion ── */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
    }
}

/* ── 18. 响应式（移动优先，qingshuang 断点规范）── */
/* < 768px */
@media (max-width: 767px) {
    .sidebar-nav { display: none !important; }
    .doc-header { padding: 28px 20px 24px !important; border-radius: 0; }
    .doc-header .header-title { font-size: 24px !important; }
    .content-inner { padding: 16px 16px 80px !important; }
    .stats-grid { grid-template-columns: repeat(2, 1fr) !important; }
    section > h2 { font-size: 18px !important; }
    .stat-value { font-size: 20px !important; }
    .daily-item { flex-direction: column; gap: 6px; }
    .board-table { font-size: 12px; }
    .board-table thead th, .board-table tbody td { padding: 8px 10px; }
    p, .news-card-desc { font-size: 14px !important; max-width: 100%; }
}
/* 768-1023px 平板：3列 stat */
@media (min-width: 768px) and (max-width: 1023px) {
    .stats-grid { grid-template-columns: repeat(3, 1fr) !important; }
    .content-inner { padding: 24px 32px 100px !important; }
}
/* > 1024px 桌面：4列 stat */
@media (min-width: 1024px) {
    .stats-grid { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)) !important; }
}

/* ============================================================
   宽度对齐系统 (2026-06-30)
   目标：所有章节内容在同一个 960px 宽度容器内对齐
   ============================================================ */

/* 统一内容区最大宽度 */
:root {
    --content-max: 960px;
    --sidebar-width: 200px;
}

/* content-inner：统一容器（覆盖之前零散定义） */
.content-inner {
    width: 100% !important;
    max-width: var(--content-max) !important;
    padding: 32px 44px 120px !important;
    box-sizing: border-box;
}

/* doc-header：背景全宽，内容对齐 960px */
/* 移除 header 的 border-radius，让它可以全宽铺展 */
/* 内容通过 padding 约束在 content-inner 的宽度内 */
.doc-header {
    /* 让 header 和 section 等宽，都在 content-inner 内 */
    width: 100%;
    box-sizing: border-box;
}
/* subtitle max-width 对齐（去掉硬编码 700px） */
.doc-header > div[style*="color:var(--color-text-muted)"] {
    max-width: 100% !important;
}

/* 所有 section 统一宽度 */
section {
    width: 100%;
    box-sizing: border-box;
}

/* table-wrap、stats-grid、daily-index 统一全宽 */
.table-wrap,
.stats-grid,
.daily-index,
.weekly-news-card,
.insight-card {
    width: 100%;
    box-sizing: border-box;
}

/* 内容行宽：正文段落 65ch，但容器本身全宽 */
/* 这样卡片/表格撑满，只有纯文字段落控制行宽 */
section > p,
.narrative-text {
    max-width: 65ch;
}
/* 清除之前错误地给 callout 加了 65ch 的 max-width */
.callout,
.news-card-desc,
.news-card-why,
.weekly-news-card p,
.insight-card p {
    max-width: none !important;
}

/* 桌面：内容区 padding 44px 两侧 */
@media (min-width: 1024px) {
    .content-inner {
        padding: 32px 44px 120px !important;
    }
}
/* 平板 768-1023px */
@media (min-width: 768px) and (max-width: 1023px) {
    .content-inner {
        padding: 24px 32px 100px !important;
    }
}
/* 移动端 */
@media (max-width: 767px) {
    .content-inner {
        padding: 16px 16px 80px !important;
    }
    .doc-header {
        border-radius: 0 !important;
    }
}

/* ============================================================
   表格溢出修复 (2026-06-30 #fix-overflow)
   根因：.table-wrap { overflow: hidden } 覆盖了 overflow-x: auto
   ============================================================ */

/* 恢复 table-wrap 横向滚动，避免内容截断 */
.table-wrap {
    overflow-x: auto !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch;
}

/* overview 表格：禁用 table-layout:fixed，改用 auto 让浏览器自动分配列宽 */
/* 维度列 whitespace:nowrap 自然取最小宽，信号列获得剩余所有空间 */
.board-table {
    table-layout: auto !important;
    width: 100% !important;
    min-width: 0 !important;
}
.board-table thead th,
.board-table tbody td {
    word-break: break-word;
    overflow-wrap: anywhere;
}
/* 维度列不换行（短文字），信号列自由换行 */
.board-table thead th:first-child,
.board-table tbody td:first-child {
    white-space: nowrap;
    width: 1%;  /* 收缩到内容最小宽度 */
}
.board-table thead th:not(:first-child),
.board-table tbody td:not(:first-child):not(:last-child) {
    white-space: normal;
    word-break: break-word;
}

/* content-inner：用 box-sizing + overflow-x hidden 防止整体溢出 */
.content-inner {
    box-sizing: border-box !important;
    overflow-x: hidden !important;
}

/* section 内所有元素约束在容器内 */
section > * {
    max-width: 100%;
    box-sizing: border-box;
}

/* ============================================================
   内容细节修复 (2026-06-30 round-5)
   ============================================================ */

/* 1. callout 内 strong：更明显的加粗 + 颜色 */
.callout strong {
    font-weight: 800 !important;
    color: #1C1917 !important;
    letter-spacing: -.01em;
}
.callout-purple strong { color: #5B21B6 !important; }
.callout-info    strong { color: #1D4ED8 !important; }
.callout-success strong { color: #047857 !important; }
.callout-warning strong { color: #B45309 !important; }
.callout-danger  strong { color: #BE123C !important; }

/* 2. 深度洞察 块：turning_point/paradox/takeaway 左边条 + 序号标题 */
#linkinsight .callout {
    font-size: 14px !important;
    line-height: 1.8 !important;
}

/* 3. 词汇表：术语列加粗更醒目，出处列更精致 */
.board-table tbody td:first-child {
    font-weight: 700 !important;
    color: #1C1917 !important;
}
.board-table tbody td:last-child {
    color: #78716C;
    font-size: 12px !important;
}

/* 4. 来源列文字不截断 */
.board-table tbody td:nth-child(2) {
    color: #57534E;
    font-size: 13px !important;
    line-height: 1.6;
}

/* 5. 宏观叙事：block 间有足够间距 */
#narrative .callout + .callout {
    margin-top: 14px !important;
}

/* 6. 日报索引链接标题：更像标题 */
.daily-item-link {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #1C1917 !important;
    line-height: 1.45;
    display: block;
    margin-bottom: 3px;
    transition: color 150ms ease;
}
.daily-item-link:hover { color: #2563EB !important; text-decoration: none; }



/* ===== 68ch行宽限制（容器100%，文字68ch）===== */
.news-card-desc, .news-card-why, .insight-card p,
.content-paragraph, .callout > p,
.daily-item-kw, .doc-footer p {
  max-width: 68ch;
}

/* ===== stats-grid自适应列数（支持4/5卡）===== */
.stats-grid {
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}

