:root{
  --bg:#f7efe6; /* 奶油白 */
  --accent:#3f2b1f; /* 深棕 */
  --muted:#6b5b50;
  --gap:28px;
  --radius:2px;
  --max-desktop:1280px;
}
*{box-sizing:border-box}
html,body{height:100%;background:var(--bg);color:var(--accent);font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;margin:0}
a{color:inherit;text-decoration:none}
.masthead{border-bottom:1px solid rgba(63,43,31,0.08);background:linear-gradient(180deg,var(--bg),#fff);}
.masthead-top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 16px;max-width:var(--max-desktop);margin:0 auto}
.brand-link{font-weight:700;color:var(--accent);font-family:Georgia, "Times New Roman", Times, serif;font-size:20px}
.top-nav{display:flex;gap:14px;align-items:center;font-size:14px;color:var(--muted)}
.top-nav .nav-home{padding:6px 8px;border-radius:var(--radius);border:1px solid transparent}
.masthead-strip{height:6px;background:transparent}

/* page container */
.page{padding:24px 16px 56px;max-width:100%;margin:0 auto}
.layout-grid{display:flex;flex-direction:column;gap:var(--gap);max-width:var(--max-desktop);margin:0 auto}

/* article */
.article{background:transparent;border-radius:var(--radius);border:1px solid rgba(63,43,31,0.06);padding:18px}
.article-header{padding-bottom:12px}
.eyebrow{font-size:13px;color:var(--muted);font-family:Georgia, "Times New Roman", Times, serif;margin-bottom:6px}
.title{font-family:Georgia, "Times New Roman", Times, serif;font-size:28px;color:var(--accent);line-height:1.16;margin:0 0 8px}
.meta-row{font-size:13px;color:var(--muted);display:flex;align-items:center;gap:8px;margin-bottom:12px}
.summary{background:transparent;padding:8px 0}
.summary-label{display:block;font-size:13px;color:var(--muted);margin-bottom:6px}
.summary-text{margin:0;color:rgba(63,43,31,0.9);line-height:1.6}

.article-body{padding-top:6px}
.article-content{color:rgba(63,43,31,0.95);font-size:16px;line-height:1.9;font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;padding:6px 2px;position:relative}
/* 双层基线网格感：细微的水平参考线（视觉签名） */
.article-content{background-image:repeating-linear-gradient(to bottom, transparent 0px, transparent 22px, rgba(63,43,31,0.02) 22px, rgba(63,43,31,0.02) 23px, transparent 23px, transparent 44px, rgba(63,43,31,0.02) 44px, rgba(63,43,31,0.02) 45px);background-attachment:local}

/* 视觉章节编号（仅视觉插入，不改变内容） */
.article-content{counter-reset:section-counter}
.article-content > *{position:relative;padding-left:42px}
.article-content > *::before{counter-increment:section-counter;content:counter(section-counter)".";position:absolute;left:8px;top:0;color:var(--muted);font-family:Georgia, "Times New Roman", Times, serif}

/* ad slots are independent, non-floating */
.ad-slot{border-radius:var(--radius);border:1px dashed rgba(63,43,31,0.06);padding:10px;margin:18px 0;background:linear-gradient(180deg,#fff,rgba(255,255,255,0.6));min-height:44px}

/* side column */
.side-column{margin-top:8px}
.side-box{border-radius:var(--radius);border:1px solid rgba(63,43,31,0.06);padding:12px;background:rgba(255,255,255,0.5)}
.side-title{font-family:Georgia, "Times New Roman", Times, serif;margin:0 0 8px;font-size:15px}
.side-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px;color:var(--muted)}

/* bottom blocks */
.bottom-blocks{margin-top:30px;padding-top:12px}
.faq h2,.related h2{font-family:Georgia, "Times New Roman", Times, serif;font-size:18px;margin:0 0 12px}
.faq-grid{border-top:1px solid rgba(63,43,31,0.06);padding-top:12px}
/* FAQ 表格式桌面风格将在媒体规则中实现；此处为兼容内容的基础样式 */
.faq-grid dl{margin:0}
.faq-grid dt{font-weight:600;color:var(--accent);padding:8px 0}
.faq-grid dd{margin:0 0 10px 0;padding-left:10px;color:var(--muted)}

.related-list{margin-top:8px;border-top:1px solid rgba(63,43,31,0.06);padding-top:12px}
.related-list > *{display:block;padding:10px 0;border-bottom:1px solid rgba(63,43,31,0.04);color:var(--muted)}
.related-list time{float:right;color:rgba(63,43,31,0.45);font-size:13px}

.site-foot{border-top:1px solid rgba(63,43,31,0.06);padding:18px 16px;text-align:center;color:var(--muted);font-size:13px}

/* Desktop rules - 学刊式布局；站名置左、栏目置右，章节感与大留白；FAQ与推荐横跨页面底部 */
@media (min-width:1024px){
  .page{padding:36px 20px 64px}
  .layout-grid{display:grid;grid-template-columns:1fr 320px;grid-template-areas:"article side";gap:48px;align-items:start}
  .article{grid-area:article;padding:28px;border-radius:var(--radius)}
  .side-column{grid-area:side;align-self:start}
  /* 强制桌面容器宽度在1120-1440之间 */
  .layout-grid{width:100%;max-width:1440px;min-width:1120px;margin:0 auto}

  /* 标题更大，紧凑眉题 */
  .title{font-size:34px}
  .eyebrow{font-size:13px;letter-spacing:0.4px}

  /* FAQ 表格式：左侧问题 220px 右侧答案自适应 */
  .faq-grid dl{display:grid;grid-template-columns:220px 1fr;row-gap:16px;column-gap:24px;align-items:start}
  .faq-grid dt{padding:6px 0}
  .faq-grid dd{padding:6px 0}

  /* 底部区块横跨页面 */
  .bottom-blocks{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start;max-width:var(--max-desktop);margin:36px auto 0}
  .faq{grid-column:1/2}
  .related{grid-column:2/3}
  .ad-bottom{grid-column:1/-1;margin-top:20px}

  /* 章编号位置更明确 */
  .article-content > *{padding-left:56px}
  .article-content > *::before{left:12px;font-size:15px}
}

/* Mobile rules - 保持章节层级但间距缩小，底部区域单列 */
@media (max-width:767px){
  .masthead-top{padding:12px}
  .masthead-strip{height:4px}
  .layout-grid{gap:14px}
  .article{padding:14px}
  .title{font-size:20px}
  .eyebrow{font-size:12px}
  .article-content{font-size:15px;line-height:1.6}
  .article-content > *{padding-left:36px}
  .article-content > *::before{left:10px}

  /* 侧栏下移为普通区块 */
  .side-column{order:3}
  .side-box{margin-top:8px}

  /* 底部改为单列 */
  .bottom-blocks{display:flex;flex-direction:column;gap:18px}
  .faq-grid dl{display:block}
  .related-list > *{padding:8px 0}

  /* 页面宽度适配最小320px，禁止横向滚动 */
  html,body{overflow-x:hidden}
}

/* accessibility & density */
h1,h2,h3{line-height:1.2}
p{margin:0 0 14px}
button,select,input,textarea{font-family:inherit}