/* 主体布局 */
.detail-main {max-width: 1200px; margin: 20px auto;display: flex;gap: 24px;}
.detail-left {flex: 1 1 auto;min-width: 0;border:1px solid #eef0f3;border-radius:8px;background:#fff; padding: 25px;}
.detail-right {width: 320px;flex: 0 0 320px;}

/* 标题与元信息 */
.article-header{border-bottom: 1px solid #ebebeb;padding-bottom: 15px;}
.article-header h1{font-size:26px;line-height:1.3;color:#333;font-weight:700;margin-bottom:12px}
.article-header .meta{font-size:13px;color:#666}
.article-header .meta i{font-size: 13px;}
.article-header .meta span + span{margin-left:14px}

/* 摘要 */
.article-brief{margin-top:12px;padding:12px 14px;background:#f7f8fa;border:1px solid #eef0f3;border-radius:8px;color:#333;line-height:1.7}

/* 正文排版 */
.article-body{margin-top:20px;font-size:16px;color:#333;line-height:1.85;}
.article-body h2{margin:20px 0 8px;font-size:20px;border-left:3px solid #0086c6;padding-left:10px}
.article-body p{margin:12px 0;color:#333;text-align: justify;}
.article-body pre{background:#333;color:#fff;padding:12px 14px;border-radius:6px;overflow:auto;font-size:13px;line-height:1.7}
.article-body code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace}


/* 标签 */
.article-tags{margin-top:25px;display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.article-tags span{color:#333;font-size:13px;font-weight:600;}
.article-tags span i{color:#0086c6;margin-right: 6px;font-weight: normal;}
.article-tags a{display:inline-block;font-size:12px;color:#0086c6;background:#eef4ff;border:1px solid #d8e6ff;padding:2px 8px;border-radius:999px}
.article-tags a:hover{background:#e6f0ff}

/* 上/下一篇 */
.article-nav{margin-top:25px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.article-nav a{flex:1 1 320px;background:#f7f8fa;border:1px solid #eef0f3;border-radius:8px;padding:10px 12px;color:#333}
.article-nav a:hover{color:#0086c6;border-color:#d8e6ff}

/* 相关文章 */
.article-related{margin-top:18px}
.article-related-title{font-weight:600;color:#333;padding:10px 0;border-bottom:1px solid #f0f2f5;display:flex;align-items:center;gap:6px;font-size:13px;}
.article-related-title i{color:#0086c6;font-weight: normal;}
.article-related ul{list-style:none;margin:0;padding:0}
.article-related ul li{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px dashed #f0f2f5;font-size:14px}
.article-related ul li:last-child{border-bottom:none}
.article-related ul li a{color:#333}
.article-related ul li a:hover{color:#0086c6}
.article-related ul li span{color:#aaa;font-size:12px}


/* 响应式 */
@media (max-width: 768px) {
  .detail-main{padding: 0 1.5%; flex-direction: column;}
  .detail-left{padding: 20px;}
  .article-header h1{font-size: 20px;}
  .article-nav{flex-direction: column;}
  .article-nav div{margin-bottom: 10px;}
  .detail-right{width: 100%;}

}