.article-container{max-width:1200px;margin:40px auto;padding:0 12px;}
.article-2col{display:grid;grid-template-columns:260px minmax(0,1fr);gap:20px;}
.article-2col.no-toc{grid-template-columns:minmax(0,1fr);}
.article-2col .toc,.article-2col .article-main{float:none!important;width:auto!important;box-sizing:border-box;}
.article-2col .toc{position:sticky;top:20px;align-self:start;background:#fafafa;border:1px solid #eee;border-radius:8px;padding:20px;max-height:72vh;overflow:auto;box-shadow:0 2px 6px rgba(0,0,0,.05);z-index:2;}
.article-2col .toc h2{display:flex;justify-content:space-between;align-items:center;font-size:18px;margin:0 0 10px;border-left:4px solid #1e90ff;padding-left:8px;}
.article-2col .toc ul{list-style:none;margin:0;padding:0;}
.article-2col .toc li.sub{margin-left:20px;}
.article-2col .toc a{color:inherit;text-decoration:none;}
.article-2col .toc a:hover{text-decoration:underline;}
.toc.collapsed ul{display:none;}
.article-2col .article-main{background:#fff;padding:30px;border:1px solid #eee;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,.05);}
.breadcrumb{font-size:13px;color:#666;margin-bottom:12px;}
.breadcrumb a{color:#666;text-decoration:none;}
.breadcrumb a:hover{text-decoration:underline;}
.breadcrumb .sep{margin:0 6px;}
.article-main .post-title{font-size:32px;line-height:1.35;font-weight:700;text-align:center;color:#333;margin:0 0 12px;}
.article-main .article-meta{text-align:center;font-size:14px;color:#888;margin:0 0 20px;}
.article-main .post-content,.article-main .content{font-size:16px;line-height:1.9;color:#333;word-break:break-word;}
.article-main .post-content p,.article-main .content p{margin:1em 0;}
.article-main .post-content ul,.article-main .post-content ol,.article-main .content ul,.article-main .content ol{margin:1em 2em;}
.article-main .post-content img,.article-main .content img{max-width:100%;height:auto;display:block;margin:20px auto;border-radius:8px;box-shadow:0 2px 6px rgba(0,0,0,.1);}
.article-main .post-content iframe,.article-main .content iframe,.article-main .post-content video,.article-main .content video{max-width:100%;display:block;margin:16px auto;}
.article-main .post-content table{width:100%;border-collapse:collapse;}
.article-main .post-content table td,.article-main .post-content table th{border:1px solid #eee;padding:8px 10px;}
.article-main .post-content h2,.article-main .content h2,.article-main .post-content .as-h2,.article-main .content .as-h2{font-size:24px;margin:1.5em 0 .8em;padding-left:10px;font-weight:bold;border-left:6px solid #30b7ef;}
.article-main .post-content h3,.article-main .content h3,.article-main .post-content .as-h3,.article-main .content .as-h3{font-size:20px;margin:1.2em 0 .6em;color:#444;font-weight:bold;}
.article-main .post-content h2:nth-of-type(6n+1),.article-main .content h2:nth-of-type(6n+1),.article-main .post-content .as-h2:nth-of-type(6n+1),.article-main .content .as-h2:nth-of-type(6n+1){border-left-color:#1e90ff!important;}
.article-main .post-content h2:nth-of-type(6n+2),.article-main .content h2:nth-of-type(6n+2),.article-main .post-content .as-h2:nth-of-type(6n+2),.article-main .content .as-h2:nth-of-type(6n+2){border-left-color:#ff6a00!important;}
.article-main .post-content h2:nth-of-type(6n+3),.article-main .content h2:nth-of-type(6n+3),.article-main .post-content .as-h2:nth-of-type(6n+3),.article-main .content .as-h2:nth-of-type(6n+3){border-left-color:#7ac943!important;}
.article-main .post-content h2:nth-of-type(6n+4),.article-main .content h2:nth-of-type(6n+4),.article-main .post-content .as-h2:nth-of-type(6n+4),.article-main .content .as-h2:nth-of-type(6n+4){border-left-color:#2b66a3!important;}
.article-main .post-content h2:nth-of-type(6n+5),.article-main .content h2:nth-of-type(6n+5),.article-main .post-content .as-h2:nth-of-type(6n+5),.article-main .content .as-h2:nth-of-type(6n+5){border-left-color:#b56cf9!important;}
.article-main .post-content h2:nth-of-type(6n),.article-main .content h2:nth-of-type(6n),.article-main .post-content .as-h2:nth-of-type(6n),.article-main .content .as-h2:nth-of-type(6n){border-left-color:#9a9a9a!important;}
.article-main .keywords{margin-top:24px;padding-top:14px;border-top:1px solid #eee;color:#666;font-size:14px;}
.post-nav{display:flex;justify-content:space-between;gap:16px;margin-top:28px;padding:16px 0;border-top:1px solid #eee;border-bottom:1px solid #eee;font-size:14px;color:#666;}
.post-nav a{color:#1e90ff;text-decoration:none;}
.post-nav a:hover{text-decoration:underline;}
.post-nav .prev{max-width:48%;}
.post-nav .next{max-width:48%;text-align:right;}
html{scroll-behavior:smooth;}
.toc a.active{font-weight:600;text-decoration:underline;}
.toc li:nth-of-type(6n+1) a{color:#1e90ff;}
.toc li:nth-of-type(6n+2) a{color:#ff6a00;}
.toc li:nth-of-type(6n+3) a{color:#7ac943;}
.toc li:nth-of-type(6n+4) a{color:#2b66a3;}
.toc li:nth-of-type(6n+5) a{color:#b56cf9;}
.toc li:nth-of-type(6n) a{color:#9a9a9a;}

/* related-wide */
.related-wide{grid-column:1/-1;margin-top:40px;background:#f5f6f7;border:1px solid #eee;border-radius:12px;padding:24px 20px;}
.related-wide h2{font-size:24px;line-height:1.3;margin:0 0 18px 6px;}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.r-card{display:block;background:#fff;border:1px solid #e9e9e9;border-radius:12px;overflow:hidden;box-shadow:0 4px 14px rgba(0,0,0,.06);transition:transform .2s,box-shadow .2s;}
.r-card:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,0,0,.1);}
.r-cover{position:relative;padding-top:56.25%;overflow:hidden;}
.r-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.r-overlay{position:absolute;left:0;right:0;bottom:0;padding:16px 14px;background:linear-gradient(180deg,rgba(0,0,0,0) 0,rgba(0,0,0,.55) 80%);}
.r-otitle{color:#fff;font-size:18px;font-weight:700;line-height:1.3;}
.r-osub{color:#e9eef5;font-size:13px;margin-top:4px;}
.r-body{padding:14px 14px 16px;}
.r-title{font-weight:700;font-size:16px;line-height:1.45;margin:2px 0 6px;}
.r-desc{color:#666;font-size:14px;line-height:1.7;height:3.4em;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;}
.r-more{display:inline-block;margin-top:10px;font-size:14px;color:#1e90ff;}
.article-main .post-content{overflow-wrap:anywhere;}