/* ===== 首页专属样式（仅 index.html 使用） ===== */
:root {
    --bg-start: #eef2fa;
    --bg-end: #e0e8f2;
    --sidebar-width: 260px;
    --transition: all 0.2s ease;
}
body.dark {
    --bg-start: #0f172a;
    --bg-end: #1e293b;
    --progress-bg: rgba(100, 116, 139, 0.4);
    --progress-fill-start: #60a5fa;
    --progress-fill-end: #a78bfa;
    --backdrop-btn-bg: linear-gradient(135deg, #60a5fa, #a78bfa);
}
body { transition: background 0.3s, color 0.2s; }

/* ===== 主布局 ===== */
body{overflow:auto!important}
.main-wrapper{min-height:100vh;display:flex;flex-direction:column;margin-left:max(calc(var(--sidebar-width) + 40px),calc((100% - 1350px + var(--sidebar-width) + 40px)/2));margin-right:auto;max-width:1350px}
.scroll-content{flex:1;padding:60px 24px 0}

/* ===== 卡片板块 ===== */
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-bottom:48px}
.mindmap-card{min-width:0;background:var(--card-bg);border-radius:28px;padding:1.5rem;border:1px solid var(--glass-border);box-shadow:var(--shadow-sm);position:relative;overflow:hidden;transition:var(--transition)}
.mindmap-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.watermark-icon{position:absolute;bottom:12px;right:12px;font-size:5.5rem;opacity:0.2;pointer-events:none;transition:opacity 0.2s;line-height:1}
body.dark .watermark-icon{opacity:0.15}
.mindmap-card:hover .watermark-icon{opacity:0.3}
.card-content{position:relative;z-index:2}
.card-title{font-weight:700;font-size:1.1rem;margin-bottom:8px}
.card-desc{font-size:0.8rem;color:var(--text-secondary);margin-bottom:16px}
.card-btn{background:var(--accent-light);border:none;padding:6px 18px;border-radius:40px;font-weight:500;color:var(--accent);cursor:pointer;font-size:0.75rem;transition:0.2s;display:inline-block;text-decoration:none}
.card-btn.disabled{opacity:0.6;cursor:not-allowed}
.card-btn:hover:not(.disabled){background:var(--accent);color:white}

/* ===== 板块标题 ===== */
.section-header{display:flex;align-items:baseline;gap:12px;margin-bottom:20px;padding-left:12px}
.section-header h2{font-size:1.46rem;font-weight:700}
.grade-sub{font-size:0.8rem;color:var(--text-muted);font-weight:normal}

/* ===== 文章列表 ===== */
.articles-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(400px,1fr));gap:32px;margin-top:48px;padding-top:24px;border-top:1px solid var(--glass-border)}
.article-item{display:flex;align-items:flex-start;gap:12px;padding:12px 0;border-bottom:1px solid var(--glass-border);cursor:pointer;transition:var(--transition)}
.article-item:last-child{border-bottom:none}
.article-item:hover{background:var(--accent-light);margin:0 -8px;padding:12px 8px;border-radius:16px}
.article-rank{font-weight:700;color:var(--accent);min-width:32px;text-align:right;font-size:0.9rem}
.article-rank.first{font-size:1.2rem;font-weight:800}
.article-content{flex:1}
.article-name{font-weight:500;font-size:0.9rem;margin-bottom:4px}
.article-meta{font-size:0.7rem;color:var(--text-muted);display:flex;gap:12px}
.more-link{background:var(--accent-light);padding:4px 12px;border-radius:40px;font-size:0.7rem;color:var(--accent);text-decoration:none;transition:0.2s}
.more-link:hover{background:var(--accent);color:white}
.category-tag{font-size:0.7rem;font-weight:500;padding:4px 12px;border-radius:40px;background:#e0f2fe;color:#0284c7}
.category-tag.method{background:#dcfce7;color:#15803d}
.category-tag.insight{background:#fef3c7;color:#b45309}
.article-list-header{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 12px;margin-bottom:20px;padding-left:20px}
.article-list-header h3{font-size:1.2rem;font-weight:600}
.article-list-header .more-link{margin-left:auto}

/* ===== 响应式 ===== */
@media (max-width: 1000px) {
    .main-wrapper{margin-left:0}
    .articles-grid{grid-template-columns:1fr;gap:32px}
    .card-grid{grid-template-columns:1fr!important;gap:16px}
}
@media(max-width:700px){.card-grid{grid-template-columns:1fr!important;gap:12px}.mindmap-card{padding:1rem}.articles-grid{grid-template-columns:1fr}}