/* 通用变量与重置 */
:root{
  --brick:#b24535; /* 砖红 */
  --sand:#f5efe6; /* 砂岩白 */
  --text:#1d1d1f;
  --muted:#6b6b6b;
  --border:rgba(0,0,0,0.06);
  --radius:2px; /* surface 2px 小圆角 */
  --content-max:1280px; /* 在 1120-1440 之间，取中间值 */
  --gutter:20px;
  --dense-line:1.45;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial; color:var(--text);background:var(--sand);}
a{color:var(--brick);text-decoration:none}
a:hover{text-decoration:underline}
.page-wrap{max-width:var(--content-max);margin:18px auto;padding:0 16px}
.masthead{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--border);background:transparent}
.mast-left{display:flex;flex-direction:column}
.site-logo{font-weight:700;font-size:18px;color:var(--text)}
.editor-label{font-size:12px;color:var(--muted);margin-top:4px}
.top-nav{display:flex;gap:12px;align-items:center}
.top-nav a,.top-nav .nav-item{font-size:13px;color:var(--muted)}
.top-nav a{font-weight:600}
/* Layout base */
.layout{display:grid;grid-template-columns:1fr;gap:24px;margin-top:18px}
.sidebar{order:2}
.article{background:var(--sand);border:1px solid var(--border);border-radius:var(--radius);padding:16px;order:1}
.article-header{padding:0 4px 10px 4px;margin-bottom:6px;border-bottom:1px solid rgba(0,0,0,0.04)}
.title-row{display:flex;align-items:flex-start;gap:12px}
.title{font-size:22px;margin:0;line-height:1.05}
.meta-column{min-width:140px;margin-left:auto;display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--muted);text-align:right}
.summary-band{display:flex;align-items:flex-start;gap:12px;padding:10px 0}
.summary-indicator{width:6px;height:100%;background:var(--brick);border-radius:var(--radius);flex:0 0 6px}
.summary{margin:0;font-size:14px;color:var(--text);line-height:var(--dense-line)}
.content{margin-top:12px;font-size:15px;line-height:var(--dense-line);color:var(--text)}
.content p{margin:0 0 10px}
.faq{margin-top:18px;padding-top:10px;border-top:3px solid var(--brick)}
.faq h2{margin:0 0 8px;font-size:16px}
.faq-body{font-size:14px;color:var(--text)}
.ad-slot{margin:18px 0;padding:8px;border:1px dashed var(--border);background:transparent;border-radius:var(--radius);font-size:13px;color:var(--muted)}
.site-footer{margin-top:26px;padding:14px 0;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;font-size:13px}
.footer-nav{display:flex;gap:12px}
.related-list{display:block;padding:6px 4px}
.related-list > *{display:block;padding:6px 0;border-bottom:1px dashed rgba(0,0,0,0.03);color:var(--muted);font-size:13px}
.side-title{font-size:13px;margin:0 0 8px;color:var(--text)}
.site-copyright{color:var(--muted)}
/* Accessibility helper */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* 手机端规则：按合同取消错位，按顺序排列：标题、摘要、正文、FAQ、推荐 */
@media (max-width:767px){
  :root{--gutter:12px}
  .page-wrap{padding:0 12px}
  .layout{display:flex;flex-direction:column}
  .sidebar{order:5;padding-top:8px;border-top:1px solid var(--border)}
  .article{order:1;padding:12px}
  .title{font-size:20px}
  .meta-column{display:flex;flex-direction:row;gap:8px;justify-content:flex-start;font-size:12px;text-align:left;margin-top:8px}
  .summary-band{flex-direction:row;align-items:flex-start}
  .summary-indicator{height:28px;width:6px}
  .content{font-size:15px}
  .ad-slot{margin:14px 0}
}

/* 桌面端规则：正文章偏右，推荐偏左；利用错位宽度形成对角视觉平衡（非斜切） */
@media (min-width:1024px){
  .page-wrap{max-width:1280px}
  .layout{grid-template-columns:320px 1fr;align-items:start;gap:32px}
  .sidebar{order:1}
  .article{order:2;padding:22px}
  /* 标题与窄元信息列：大标题配窄元信息列 */
  .title{font-size:32px;line-height:1.02}
  .meta-column{min-width:160px;margin-left:16px;font-size:13px}
  /* 摘要区使用窄色带而非卡片（视觉签名） */
  .summary-band{padding-left:10px}
  .summary-indicator{width:8px;border-radius:var(--radius)}
  /* 侧边为关键词索引式列表（related_pattern） */
  .related-list{background:transparent;padding:8px}
  .related-list > *{padding:8px 6px}
  /* 密集排版 */
  .article{line-height:var(--dense-line)}
  /* 确保正文不被限制为窄幅手机宽度 */
  .content{max-width:920px}
}

/* 兼容性小修饰：防止横向滚动 */
img,iframe,table{max-width:100%;height:auto}
body{overflow-x:hidden}