.article-simple-head{height:76px;background:#fff;border-bottom:1px solid #e7eaed;display:flex;align-items:center}
.article-simple-head>.shell{display:flex;align-items:center;justify-content:space-between;gap:25px}
.article-simple-head img{width:78px}.article-simple-head nav{display:flex;gap:24px}.article-simple-head a{color:#48535e;text-decoration:none;font-size:11px}.article-head-cart{border:1px solid #e1e5e8;border-radius:9px;padding:8px 13px}
.article-detail-shell{width:min(900px,calc(100% - 36px));margin:18px auto 0;min-width:0}
.article-detail{width:100%;min-width:0;background:#fff;border:1px solid #e5e9ed;border-radius:18px;overflow:hidden;box-sizing:border-box}
.article-detail-header{padding:30px 42px 24px}.article-detail-header .article-category{display:block;margin-bottom:8px}.article-detail-header h1{font-size:27px;line-height:1.7;margin:0 0 11px;font-weight:750}.article-detail-header>p{font-size:13px;color:#606b75;line-height:2;margin:0}.article-detail-meta{display:flex;flex-wrap:wrap;gap:16px;margin-top:17px;font-size:10px;color:#8b949c}
.article-hero{display:block;width:calc(100% - 64px);max-width:calc(100% - 64px);height:auto;aspect-ratio:16/10;margin:0 32px;object-fit:cover;border-radius:14px;box-sizing:border-box}
.article-content-layout{display:grid;grid-template-columns:190px minmax(0,1fr);gap:32px;padding:32px 42px 45px}.article-toc{align-self:start;position:sticky;top:20px;border:1px solid #e8ebee;border-radius:12px;padding:14px}.article-toc strong{font-size:11px}.article-toc a{display:block;color:#69737c;text-decoration:none;font-size:9.5px;line-height:1.8;margin-top:8px}.article-content{min-width:0;font-size:13px;line-height:2.2;color:#38434d}.article-content h2{font-size:19px;line-height:1.8;margin:28px 0 8px;color:#20283e}.article-content h2:first-child{margin-top:0}.article-content p{margin:0 0 15px}.article-content-note{border-right:3px solid #2f67ad;background:#f4f8fc;padding:14px 16px;border-radius:9px;margin:20px 0}.article-detail-loading{padding:80px;text-align:center;color:#7d8790}
.related-articles{width:min(900px,calc(100% - 36px));margin:26px auto 60px;box-sizing:border-box}.related-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.related-head h2{font-size:16px;margin:0;font-weight:800}.related-track{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;min-width:0}.related-track .article-card-link{min-width:0}
.article-content a{color:#2f67ad;text-decoration:underline;text-underline-offset:3px}.article-content figure{max-width:100%;margin:22px 0;text-align:center}.article-content figure img,.article-content>img{display:block;width:100%;height:auto;max-width:100%;border-radius:12px;object-fit:contain}.article-content figcaption{margin-top:7px;color:#727e89;font-size:11px}.article-content h3{font-size:16px;line-height:1.9;margin:22px 0 7px;color:#20283e}.article-content ul,.article-content ol{padding-right:24px}.article-content blockquote{border-right:3px solid #2f67ad;margin:20px 0;padding:4px 16px;background:#f7f9fc}.article-toc[hidden]{display:none}
.articles-footer{background:#fff;border-top:1px solid #e5e9ed}
@media(max-width:700px){
  .article-simple-head{height:60px}.article-simple-head nav{display:none}.article-simple-head img{width:64px}
  .article-detail-shell{width:calc(100% - 24px);margin-top:8px;overflow:hidden}
  .article-detail{border-radius:14px;overflow:hidden}
  .article-detail-header{padding:20px 16px 17px}.article-detail-header h1{font-size:20px}.article-detail-header>p{font-size:11px}.article-detail-meta{gap:7px 12px;font-size:9px}
  .article-hero{width:calc(100% - 32px);max-width:calc(100% - 32px);height:auto;aspect-ratio:16/10;margin-inline:16px;border-radius:12px;object-fit:cover}
  .article-content-layout{display:block;padding:20px 16px 30px}.article-toc{position:static;margin-bottom:20px}.article-content{font-size:12px}.article-content h2{font-size:16px}
  .related-articles{width:calc(100% - 24px);margin:22px auto 90px;overflow:hidden}.related-head{margin-bottom:10px}.related-head h2{font-size:14px}
  .related-track{display:flex;direction:rtl;gap:8px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px;touch-action:pan-x;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain}.related-track::-webkit-scrollbar{display:none}
  .related-track .article-card{flex:0 0 calc((100% - 12px)/2.5);height:auto;scroll-snap-align:start;-webkit-text-size-adjust:100%;text-size-adjust:100%}
  .articles-footer{display:none}
}
@media(min-width:901px){
  .article-detail-shell{width:min(1180px,calc(100% - 36px))}
  .article-detail{--article-sidebar:240px;--article-gap:24px;position:relative;display:grid;grid-template-columns:var(--article-sidebar) minmax(0,1fr);column-gap:var(--article-gap);align-items:start;background:transparent;border:0;border-radius:0;overflow:visible}
  .article-detail::before{content:"";position:absolute;inset-block:0;inset-inline-end:0;width:calc(100% - var(--article-sidebar) - var(--article-gap));background:#fff;border:1px solid #e5e9ed;border-radius:18px;z-index:0;pointer-events:none}
  .article-detail-header,.article-hero,.article-content{position:relative;z-index:1;grid-column:2;min-width:0}
  .article-detail-header{grid-row:1;padding:30px 36px 24px}
  .article-hero{grid-row:2;width:calc(100% - 72px);max-width:calc(100% - 72px);margin-inline:36px}
  .article-content-layout{display:contents}
  .article-toc{grid-column:1;grid-row:1 / span 3;position:sticky;top:150px;background:#fff;border:1px solid #e5e9ed;border-radius:16px;padding:19px 20px;z-index:1}
  .article-toc strong{display:block;font-size:12px;color:#20283e}
  .article-toc a{font-size:11px;margin-top:10px}
  .article-content{grid-row:3;padding:28px 36px 45px}
  .article-content h2[id],.article-content h3[id]{scroll-margin-top:156px}
  .related-articles{width:min(916px,calc(100% - 300px));margin-left:max(18px,calc((100% - 1180px)/2));margin-right:auto}
}