/* ==================== Article Detail ==================== */
.article-detail header{margin-bottom:24px;padding-bottom:20px;border-bottom:1px solid var(--border)}
.article-detail header h1{font-size:28px;margin-bottom:14px;line-height:1.5}
.article-detail header .meta{color:var(--text-light);font-size:14px;display:flex;flex-wrap:wrap;gap:18px}
.article-detail .summary-box{background:var(--accent);border-left:3px solid var(--primary);padding:16px 20px;margin-bottom:28px;border-radius:0 var(--radius) var(--radius) 0;font-size:15px;color:var(--text)}
.article-detail .content{font-size:16px;line-height:2;word-wrap:break-word}
.article-detail .content h2{font-size:22px;margin:30px 0 16px;padding-bottom:8px;border-bottom:1px solid var(--border);color:var(--text)}
.article-detail .content h3{font-size:18px;margin:24px 0 12px}
.article-detail .content p{margin:14px 0}
.article-detail .content ul,.article-detail .content ol{margin:14px 0;padding-left:28px}
.article-detail .content li{margin:8px 0}
.article-detail .content img{max-width:100%;border-radius:var(--radius);margin:20px 0}
.article-detail .content table{width:100%;border-collapse:collapse;margin:20px 0;font-size:14px}
.article-detail .content td,.article-detail .content th{border:1px solid var(--border);padding:12px 16px}
.article-detail .content th{background:var(--bg-gray);font-weight:600}
.article-detail .content blockquote{margin:20px 0;padding:16px 24px;background:var(--bg-gray);border-left:4px solid var(--primary);border-radius:0 var(--radius) var(--radius) 0}
.article-detail footer{margin-top:40px;padding-top:20px;border-top:1px solid var(--border)}
.article-detail .article-pager{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:14px;margin-bottom:20px}
.article-detail .article-pager a{max-width:48%}
.article-detail .tags{margin-top:12px;display:flex;flex-wrap:wrap;gap:8px}
.article-detail .tags span{background:var(--bg-gray);padding:4px 14px;border-radius:14px;font-size:13px;color:var(--text-light)}

/* Sidebar */
.sidebar-box{border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:20px;margin-bottom:20px;background:var(--bg)}
.sidebar-box h3{font-size:16px;margin-bottom:14px;padding-bottom:10px;border-bottom:2px solid var(--primary)}
.sidebar-box ul{list-style:none}
.sidebar-box li{padding:8px 0;border-bottom:1px dashed var(--border);font-size:14px}
.sidebar-box li:last-child{border-bottom:none}
.sidebar-box li span{color:var(--text-muted);font-size:12px}

/* Two-column layout */
.page-row{display:flex;gap:30px;margin:30px 0}
.page-main{flex:1;min-width:0}
.page-sidebar{width:280px;flex-shrink:0}

/* ==================== Article Responsive ==================== */
@media (max-width:768px){
    .page-row{flex-direction:column}
    .page-sidebar{width:100%}
    .article-detail header h1{font-size:24px}
    .article-detail .article-pager{flex-direction:column}
    .article-detail .article-pager a{max-width:100%}
}
@media (max-width:480px){
    .article-detail header h1{font-size:20px}
}