.detail-article{  
  background:#fff;border-radius:.75rem;  
  border:1px solid var(--line);padding:2.5rem;  
}  
  
.detail-a11y-bar{  
  display:flex;align-items:center;gap:.625rem;flex-wrap:wrap;  
  padding:.875rem 1.25rem;background:#f6faff;border-radius:.5rem;  
  border:1px solid #d0e4f7;margin-bottom:1.75rem;  
}  
.detail-a11y-label{  
  display:flex;align-items:center;gap:.375rem;  
  font-size:.875rem;font-weight:600;color:var(--primary);  
  letter-spacing:.0625rem;margin-right:.25rem;white-space:nowrap;  
}  
.detail-a11y-btn{  
  display:inline-flex;align-items:center;gap:.375rem;  
  padding:5px 12px;border-radius:4px;border:1px solid #c3d9f0;  
  background:#fff;color:var(--text-2);font-size:.8125rem;cursor:pointer;  
  transition:all .2s;font-family:inherit;white-space:nowrap;  
}  
.detail-a11y-btn:hover{background:var(--primary);color:#fff;border-color:var(--primary);}  
.detail-a11y-btn.reading{background:var(--accent);border-color:var(--accent);color:#fff;}  
  
.detail-title{  
  font-size:1.75rem;font-weight:700;color:var(--text);  
  line-height:1.55;letter-spacing:.05rem;margin-bottom:1.25rem;  
}  
.detail-meta{  
  display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap;  
  padding:.875rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);  
  margin-bottom:1.75rem;  
}  
.detail-meta-item{  
  display:flex;align-items:center;gap:.375rem;  
  font-size:.875rem;color:var(--text-3);  
}  
  
.detail-cover{  
  width:100%;border-radius:.625rem;overflow:hidden;margin-bottom:1.75rem;  
  background:#f2f5f8;display:flex;justify-content:center;align-items:center;  
}  
.detail-cover img{max-width:100%;height:auto;display:block;max-height:28rem;object-fit:contain;}  
  
.article-body{font-size:1.0625rem;color:var(--text);line-height:2;}  
.article-body p{margin-bottom:1.25rem;}  

.article-body table {
  max-width: 100% !important;
  width: 100% !important;
  margin: 1.5rem 0;
  overflow-x: auto;
  display: block; 
  border-collapse: collapse;
}
.article-body table td,
.article-body table th {
  padding: .5rem .75rem;
  border: 1px solid var(--line);
  font-size: .9375rem;
  word-break: break-all; 
}
.article-body a {
  color: var(--primary);
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.2s;
}
.article-body a:hover {
  color: var(--primary-dark);
}
.article-body h2{  
  font-size:1.25rem;font-weight:700;color:var(--text);  
  margin:2rem 0 1rem;padding-left:1rem;  
  border-left:4px solid var(--primary);  
  line-height:1.5;  
}  
.article-body h3{  
  font-size:1.125rem;font-weight:600;color:var(--text);  
  margin:1.5rem 0 .875rem;  
}  
.article-body img{  
  display:block;max-width:100%;height:auto !important;margin:1.5rem auto;  
  border-radius:.5rem;box-shadow:0 4px 16px rgba(0,0,0,.08);  
}  
.article-body ul,.article-body ol{margin:0 0 1.25rem 1.5rem;}  
.article-body li{margin-bottom:.5rem;}  
.article-body blockquote{  
  border-left:4px solid var(--primary);padding:.875rem 1.25rem;  
  background:var(--primary-bg);border-radius:0 .5rem .5rem 0;  
  margin:1.25rem 0;color:var(--text-2);font-style:italic;  
}  
.article-body a{color:var(--primary);text-decoration:underline;text-underline-offset:3px;}  
.article-body a:hover{color:var(--primary-dark);}  
  
.article-body.fs-detail-lg{font-size:1.25rem;}  
.article-body.fs-detail-sm{font-size:.9375rem;}  
  
.detail-tags{  
  display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;  
  margin-top:2rem;padding-top:1.25rem;border-top:1px solid var(--line);  
}  
.detail-tag-label{font-size:.875rem;color:var(--text-3);}  
.detail-tag{  
  font-size:.8125rem;color:var(--primary);background:var(--primary-bg);  
  padding:3px .875rem;border-radius:1rem;border:1px solid #c3d9f0;  
  transition:all .2s;  
}  
.detail-tag:hover{background:var(--primary);color:#fff;border-color:var(--primary);}  
  
.detail-share{  
  display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;  
  margin-top:1rem;padding-top:1rem;  
}  
.detail-share-label{font-size:.875rem;color:var(--text-3);}  
.detail-share-btn{  
  display:inline-flex;align-items:center;gap:.375rem;  
  padding:5px 14px;border-radius:4px;border:1px solid var(--line);  
  background:#fff;color:var(--text-2);font-size:.875rem;cursor:pointer;  
  transition:all .2s;font-family:inherit;  
}  
.detail-share-btn:hover{border-color:var(--primary);color:var(--primary);}  
  
.detail-nav-links{  
  display:grid;grid-template-columns:1fr 1fr;gap:1rem;  
  margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--line);  
}  
.detail-nav-prev,.detail-nav-next{  
  display:flex;align-items:center;gap:.75rem;  
  padding:1rem 1.25rem;border:1px solid var(--line);border-radius:.5rem;  
  color:var(--text-2);transition:all .2s;background:#fff;  
}  
.detail-nav-next{justify-content:flex-end;text-align:right;}  
.detail-nav-prev:hover,.detail-nav-next:hover{  
  border-color:var(--primary);background:var(--primary-bg);color:var(--primary);  
}  
.detail-nav-prev span,.detail-nav-next span{  
  font-size:.75rem;color:var(--text-3);display:block;margin-bottom:.25rem;  
}  
.detail-nav-prev p,.detail-nav-next p{  
  font-size:.9375rem;font-weight:500;  
  display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;  
}  
.detail-nav-prev svg,.detail-nav-next svg{flex-shrink:0;stroke:currentColor;}  

@media print{  
    
  .a11y-guide-top, .a11y-guide-bottom, .a11y-guide-bar, .a11y-bar,   
  .mob-topbar, .mob-menu-overlay, .mob-menu-panel, .nav, .sticky-nav,   
  .sub-banner, .sub-breadcrumb, .sub-sidebar, .side-bar, .footer,  
  .detail-a11y-bar, .detail-tags, .detail-share, .detail-nav-links {  
    display: none !important;  
  }  

  body, .sub-main, .sub-wrap, .sub-content-layout, main, .detail-article {  
    width: 100% !important;  
    max-width: 100% !important;  
    margin: 0 !important;  
    padding: 0 !important;  
    display: block !important;  
    float: none !important;  
    position: relative !important;  
    background: transparent !important;  
    border: none !important;  
    box-shadow: none !important;  
  }  

  #printArea {  
    display: block !important;  
    width: 100% !important;  
    overflow: visible !important;  
  }  

  .detail-title{font-size:22px; color:#000 !important;}  
  .article-body{font-size:14px;line-height:1.8; color:#333 !important;}  
  .article-body h2{font-size:16px;}  
  .detail-cover img{max-height:300px; object-fit: contain !important;}  
  .detail-meta{border-color:#ccc; padding: 5px 0; margin-bottom: 20px;}  
}  
  
@media (max-width:900px){  
  .detail-article{padding:1.25rem 1rem;}  
  .detail-title{font-size:1.25rem;}  
  .article-body{font-size:1rem;}  
  .article-body h2{font-size:1.125rem;}  
  .detail-nav-links{grid-template-columns:1fr;}  
  .detail-meta{gap:.75rem;}  
  .detail-a11y-bar{gap:.5rem;}  
  .detail-a11y-label{font-size:.8125rem;}  
  .detail-a11y-btn{padding:4px 9px;font-size:.75rem;}  
}  
  
@media (max-width:480px){  
  .detail-article{padding:1rem .875rem;}  
  .detail-title{font-size:1.125rem;}  
  .detail-cover img{max-height:14rem;}  
}