/* Monochrome-feature 样式表
   设计种子: df07ebc0b97c5c3a
   主题：黑白专题排版 + 砖红强调色；桌面 8/4 分栏，元信息沿边缘纵向排列
*/
:root{
  --bg:#F4EDE6; /* 砂岩白 作为页面浅背景 */
  --paper:#FFFFFF; /* 正文白 */
  --ink:#111111;
  --muted:#6b6b6b;
  --accent:#B04535; /* 砖红 */
  --max-width:1280px; /* 在 1120-1440 区间内居中 */
  --gutter:24px;
  --radius:4px;
  --base-font: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;background:var(--bg);color:var(--ink);font-family:var(--base-font);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.container{max-width:var(--max-width);min-width:1120px;margin:20px auto;padding:0 20px}
.site-header{background:#111; color:var(--paper);}
.site-header .header-inner{display:flex;align-items:center;justify-content:center;position:relative;max-width:var(--max-width);margin:0 auto;padding:18px 20px}
.left-mast{position:absolute;left:0;top:0;bottom:0;width:72px;display:flex;align-items:center;justify-content:center}
.mast-vertical{writing-mode:vertical-rl;text-orientation:mixed;letter-spacing:1px;color:var(--paper);font-weight:700;font-size:12px}
.masthead{display:flex;flex-direction:column;align-items:center;gap:6px}
.masthead .home-link{color:var(--paper);font-weight:700;font-size:18px}
.nav-line{height:2px;width:200px;background:linear-gradient(90deg,var(--paper) 20%,rgba(255,255,255,0.08) 80%);opacity:0.12}

.layout-grid{display:grid;grid-template-columns:72px 1fr 360px;gap:var(--gutter);align-items:start;padding:28px 0}
.meta-rail{padding-top:8px}
.meta-stack{display:flex;flex-direction:column;gap:14px;border-right:1px solid rgba(0,0,0,0.06);padding-right:18px}
.meta-item{font-size:13px;color:var(--muted)}
.meta-item time{display:block;color:var(--ink);font-weight:600}

.content{background:transparent}
.article-head h1{margin:0 0 12px 0;font-size:36px;line-height:1.08;font-weight:800;color:var(--ink);text-align:left}
.summary{background:var(--paper);padding:14px;border:1px solid rgba(0,0,0,0.06);border-left:4px solid var(--accent);max-width:900px}
.summary-label{display:block;color:var(--muted);font-size:12px;margin-bottom:8px}
.summary-text{margin:0;color:var(--ink);line-height:1.6}

.article-body{margin-top:18px}
.body-surface{background:var(--paper);padding:22px;border:1px solid rgba(0,0,0,0.06);line-height:1.7;color:var(--ink)}
.body-surface p{margin:0 0 16px}

.section-title{font-size:16px;margin:18px 0 8px;color:var(--ink);border-bottom:1px solid rgba(0,0,0,0.06);padding-bottom:8px}
.faq-block{background:#fff;padding:14px;border:1px solid rgba(0,0,0,0.04)}
.related-list{list-style:none;margin:0;padding:0;border-top:1px dashed rgba(0,0,0,0.06)}
.related-list > *{padding:12px 0;border-bottom:1px dashed rgba(0,0,0,0.04)}

.side-notes{padding-top:8px}
.info-card{background:var(--paper);padding:12px;border:1px solid rgba(0,0,0,0.06)}
.card-title{font-weight:700;margin-bottom:8px}
.card-body{font-size:13px;color:var(--muted)}

.ad-slot{background:transparent;margin:14px 0;padding:6px 0;text-align:center;color:var(--muted);font-size:13px}
.ad-slot > *{display:inline-block}

.site-footer{padding:18px 20px;text-align:center;font-size:13px;color:var(--muted)}

/* Desktop 强调：非对称 8/4 分栏 + 元信息沿边缘纵向排列，标题压左与粗细横线构图 */
@media (min-width:1024px){
  :root{--max-width:1280px}
  .container{min-width:1120px}
  .layout-grid{grid-template-columns:72px 1fr 320px;align-items:start}
  /* 将正文区域以 8/4 栅格感呈现：content 主体占据更宽列 */
  .content{grid-column:2 / 3}
  .side-notes{grid-column:3 / 4}
  /* 标题视觉构图：左压，并用一条细线延伸 */
  .article-head{display:flex;flex-direction:column;gap:12px}
  .article-head h1{font-size:48px;max-width:900px;border-bottom:2px solid rgba(0,0,0,0.04);padding-bottom:8px}
  .nav-line{width:340px;opacity:0.08}
  /* 元信息纵向沿边缘排列（meta-rail） */
  .meta-rail{position:static}
  .mast-vertical{font-size:13px}
}

/* Mobile 单列重排规则：宽度 <= 767px */
@media (max-width:767px){
  :root{--max-width:680px}
  .container{min-width:0;max-width:680px;padding:12px}
  .site-header .header-inner{padding:12px}
  .left-mast{display:none}
  .masthead .home-link{font-size:16px}
  .nav-line{display:none}
  .layout-grid{display:block;padding:12px 0}
  .meta-rail{display:block;border-right:none;padding:0;margin-bottom:8px}
  .meta-stack{flex-direction:row;gap:12px;flex-wrap:wrap}
  .meta-item{font-size:12px}
  .content{order:0}
  .article-head h1{font-size:20px;font-weight:700}
  .summary{border-left:3px solid var(--accent);padding:10px}
  .body-surface{padding:14px}
  .side-notes{margin-top:18px}
  .info-card{display:block}
  .related-list > *{padding:10px 0}
  /* 保证在 320px 不出现横向滚动 */
  html,body{overflow-x:hidden}
  .container{padding:0 10px}
}

/* 中等屏幕（768 - 1023）做适度缩放 */
@media (min-width:768px) and (max-width:1023px){
  .container{min-width:0;padding:18px}
  .layout-grid{grid-template-columns:56px 1fr;grid-auto-columns:1fr}
  .side-notes{display:none}
  .meta-rail{display:block}
  .article-head h1{font-size:28px}
}

/* 可访问性/印刷友好小调整 */
a.home-link:focus{outline:2px dashed var(--accent);outline-offset:4px}
article .section-title{color:var(--ink)}