/* 文章内站（/zh-cn/articles/）专属样式。作用域 .articles-page，不覆盖导航、页脚、客服等通用组件。
 * 设计真源：docs/tasks/articles-hub-20261016/design/reference-mock.mjs 的 css 常量。
 * 由 scripts/articles/build-articles.mjs 复制到 public/seo-assets/articles.css，请改本文件。 */
.articles-page{--serif:"Songti SC","Noto Serif CJK SC","Source Han Serif SC","Microsoft YaHei UI","Microsoft YaHei",sans-serif;--sans:"PingFang SC","Hiragino Sans GB","Microsoft YaHei UI","Microsoft YaHei","Noto Sans CJK SC","Source Han Sans SC",system-ui,sans-serif;--sheet:#FBFAF7;--sheet-edge:#D9D5C9;--sheet-shadow:#E6E2D7;--text:#2A2B27;--ink:#171815;--paper:#F2F0EA;--rule:#CFCABD;--ul:#A39E90;--rust:#A8441D;
 display:block;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:18px;line-height:1.75;-webkit-font-smoothing:antialiased;padding:48px 0 140px}
.articles-page *,.articles-page *::before,.articles-page *::after{box-sizing:border-box;border-radius:0}
/* 抵消 seo.css 中 main :where(...) 的通用正文规则，正文排版以本文件为准 */
.articles-page :is(p,li,td,th){font-size:inherit;line-height:inherit;max-width:none;overflow-wrap:break-word}
.articles-page :is(h1,h2,h3,h4){overflow-wrap:break-word}
.articles-page .articles-wrap{width:min(1240px,calc(100% - 96px));margin-inline:auto}
.articles-page a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--ul);text-decoration-thickness:1px;text-underline-offset:6px;transition:text-decoration-color .15s,color .15s}
.articles-page a:hover{text-decoration-color:var(--rust);color:var(--rust)}
.articles-page img{display:block;width:100%;height:auto}
/* 标题区：左文右图 */
.articles-page .head{display:grid;grid-template-columns:5fr 7fr;column-gap:56px;align-items:center}
.articles-page .head-text{padding-block:8px}
.articles-page .meta{display:flex;flex-wrap:wrap;gap:6px 0;font-size:17px;line-height:1.5;color:#55524a;margin:0 0 20px;max-width:none}
.articles-page .meta span{padding-right:16px;margin-right:16px;border-right:1px solid var(--rule)}
.articles-page .meta span:last-child{border-right:0;margin-right:0;padding-right:0}
.articles-page h1{font-family:var(--serif);font-weight:900;font-size:42px;line-height:1.35;letter-spacing:0;color:var(--ink);margin:0;padding-bottom:22px;border-bottom:2px solid var(--ink);text-wrap:balance}
.articles-page .dek{font-size:19px;line-height:1.75;margin:22px 0 0;color:#3a3a35;text-wrap:pretty}
.articles-page .cover{margin:0}
.articles-page .head--list{display:block;margin-bottom:56px}
.articles-page .head--list h1{font-size:52px;display:inline-block;min-width:min(520px,100%)}
.articles-page .head--list .dek{max-width:34em}
/* 正文 + 右侧目录。目录栏随 grid 默认拉伸撑满正文高度，sticky 才能生效：不要给 .grid 加 align-items:start */
.articles-page .grid{position:relative;display:grid;grid-template-columns:920px 264px;column-gap:56px;margin-top:56px}
.articles-page .rail{position:relative;z-index:1}
.articles-page .toc{position:sticky;top:104px}
.articles-page .toc h2{font-family:var(--sans);font-size:16px;line-height:1.6;font-weight:700;letter-spacing:.08em;margin:0 0 18px}
.articles-page .toc ol{list-style:none;margin:0;padding:0}
.articles-page .toc li{margin:0}
.articles-page .toc a{display:grid;grid-template-columns:2.4em 1fr;gap:0 4px;padding:9px 0;font-size:17px;line-height:1.55;text-decoration:none;color:#34332f}
.articles-page .toc a i{font-style:normal;color:var(--ul)}
.articles-page .toc a span{text-wrap:balance;text-decoration:underline;text-decoration-color:var(--ul);text-decoration-thickness:1px;text-underline-offset:5px}
.articles-page .toc a:hover,.articles-page .toc a.on{color:var(--ink)}
.articles-page .toc a:hover span{text-decoration-color:var(--rust)}
.articles-page .toc a.on{font-weight:700}
.articles-page .toc a.on span{text-decoration-color:var(--ink);text-decoration-thickness:2px}
.articles-page .toc a.on i{color:var(--rust)}
/* 文章正文：纸张面板 */
.articles-page .prose{font-size:19px;line-height:1.9;letter-spacing:.02em;color:var(--text);text-autospace:normal;line-break:strict;background:var(--sheet);border:1px solid var(--sheet-edge);box-shadow:10px 10px 0 var(--sheet-shadow);padding:64px 56px 72px;max-width:920px;min-width:0}
.articles-page .prose p{margin:0 0 1em}
.articles-page .prose h2{font-family:var(--serif);font-size:30px;line-height:1.4;font-weight:700;color:var(--ink);margin:2.4em 0 .7em;padding-top:1.1em;border-top:1px solid var(--ink);scroll-margin-top:96px}
.articles-page .prose h2:first-child{margin-top:0;border-top:0;padding-top:0}
.articles-page .prose h3{font-family:var(--serif);font-size:23px;line-height:1.5;font-weight:700;color:var(--ink);margin:1.9em 0 .55em}
.articles-page .prose h4{font-size:20px;line-height:1.6;font-weight:700;color:var(--ink);margin:1.6em 0 .5em}
.articles-page .prose ul,.articles-page .prose ol{margin:0 0 1.2em;padding-left:1.4em}
.articles-page .prose li{margin-bottom:.55em}
.articles-page .prose strong{font-weight:700}
.articles-page .prose figure{margin:2.4em -56px}
.articles-page .prose blockquote{margin:.9em 0 1.1em;padding:20px 26px;background:var(--paper)}
.articles-page .prose blockquote p:last-child{margin-bottom:0}
.articles-page .prose table{width:100%;border-collapse:collapse;margin:1.4em 0 1.6em;font-size:17px;line-height:1.7;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.articles-page .prose th,.articles-page .prose td{text-align:left;vertical-align:top;padding:14px 14px 14px 0;font-weight:400;letter-spacing:0}
.articles-page .prose tbody th[scope=row]{white-space:nowrap}
.articles-page .prose td,.articles-page .prose p{text-wrap:pretty}
.articles-page .prose thead th{font-weight:700;border-bottom:1px solid var(--ink)}
.articles-page .prose tbody th{font-weight:700}
.articles-page .prose tbody tr+tr th,.articles-page .prose tbody tr+tr td{border-top:1px solid var(--rule)}
.articles-page .prose table.say td:first-child{width:42%;color:#6a675e}
.articles-page .prose .refs{font-size:17px}
.articles-page .prose .note{font-size:17px;line-height:1.8;color:#55524a;margin:2.4em 0 0}
/* 继续阅读 / 更多文章：日期与标题同一基线 */
.articles-page .more{margin-top:112px}
.articles-page .more h2{font-family:var(--serif);font-size:28px;line-height:1.4;font-weight:700;margin:0 0 24px}
.articles-page .more ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}
.articles-page .more li{border-bottom:1px solid var(--rule);margin:0}
.articles-page .more .all{margin:28px 0 0;font-size:17px}
.articles-page .more li a{display:grid;grid-template-columns:200px 1fr;align-items:baseline;gap:0 24px;padding:24px 0;text-decoration:none}
.articles-page .more time{font-size:17px;line-height:1.5;color:#55524a}
.articles-page .more strong{font-family:var(--serif);font-size:24px;line-height:1.5;font-weight:700;text-decoration:underline;text-decoration-color:var(--ul);text-decoration-thickness:1px;text-underline-offset:7px}
.articles-page .more a:hover strong{text-decoration-color:var(--rust);color:var(--rust)}
.articles-page .more ul+.all{margin-top:28px}
/* 列表页 */
.articles-page--list .feature a{display:grid;grid-template-columns:7fr 5fr;gap:56px;align-items:center;text-decoration:none}
.articles-page--list .feature .cover{margin:0}
.articles-page--list .feature .meta{margin-bottom:18px}
.articles-page--list .feature h2{font-family:var(--serif);font-size:36px;line-height:1.35;font-weight:700;margin:0 0 20px;text-decoration:underline;text-decoration-color:var(--ul);text-decoration-thickness:1px;text-underline-offset:8px}
.articles-page--list .feature a:hover h2{text-decoration-color:var(--rust)}
.articles-page--list .feature p:last-child{font-size:19px;line-height:1.8;margin:0;color:#34332f}
/* 窄屏：目录回到正文前 */
@media (max-width:1180px){
 .articles-page .articles-wrap{width:calc(100% - 64px)}
 .articles-page .grid{display:flex;flex-direction:column-reverse;gap:40px;margin-top:48px}
 .articles-page .toc{position:static}
 .articles-page .toc ol{columns:2;column-gap:40px}
 .articles-page .toc li{break-inside:avoid}
 .articles-page .prose{max-width:none}
 .articles-page h1{font-size:36px}
 .articles-page .head{grid-template-columns:1fr;row-gap:32px}
 .articles-page--list .feature a{grid-template-columns:1fr;gap:32px}
 .articles-page .more li a{grid-template-columns:1fr;gap:6px}
}
@media (max-width:640px){
 .articles-page{padding:32px 0 96px}
 .articles-page .articles-wrap{width:calc(100% - 40px)}
 .articles-page .toc ol{columns:1}
 .articles-page h1{font-size:34px}
 .articles-page .head--list h1{font-size:40px;min-width:0}
 .articles-page--list .feature h2{font-size:28px}
 .articles-page .prose{padding:36px 20px 44px}
 .articles-page .prose figure{margin:2em -20px}
 .articles-page .prose h2{font-size:26px}
 .articles-page .prose .table-scroll{overflow-x:auto;margin:1.4em -20px 1.6em;padding:0 20px}
 .articles-page .prose .table-scroll table{margin:0;min-width:640px}
}