/* 全局变量与基础重置 */
:root{
  --bg:#f6f5f1; /* 轻纸张底色 */
  --ink:#222222; /* 石墨灰主色 */
  --muted:#666666;
  --accent:#b89b1a; /* 芥末黄 */
  --frame-border: #d8d6cf;
  --line: #e6e4dd;
  --max-width: 1280px; /* 在1120-1440范围内 */
  --content-gap: 18px; /* 紧凑风格 */
}
html,body{height:100%;}
body{
  margin:0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Microsoft YaHei", sans-serif;
  background:var(--bg);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  line-height:1.5;
  font-size:16px;
}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.label{font-weight:600;color:var(--muted);font-size:0. nine rem;margin:14px 0 6px}

/* 工具栏（站名与面包屑合并为工具栏） */
.toolbar{border-bottom:1px solid var(--line);background:transparent;padding:10px 16px}
.toolbar-inner{max-width:var(--max-width);margin:0 auto;display:flex;align-items:center;justify-content:space-between}
.site-name{font-weight:700;color:var(--ink);letter-spacing:0.01em}
.toolbar-right{font-size:13px;color:var(--muted);display:flex;align-items:center;gap:8px}
.toolbar-right .crumb-home{color:var(--muted)}
.crumb-sep{color:var(--line)}

/* 页面外框：桌面显示细边框（外框式专题页） */
.page-frame{max-width:var(--max-width);margin:18px auto;padding:18px;background:transparent}

/* 标题区：通栏 */
.title-region{border-top:3px solid var(--frame-border);padding-top:12px;padding-bottom:10px}
.title-wrap{display:flex;align-items:flex-start;gap:20px;flex-wrap:wrap}
.page-title{font-family: Georgia, 'Times New Roman', serif; /* 标题衬线 */font-size:28px;margin:0;color:var(--ink);line-height:1.15}
.summary-inline{flex:1 1 320px;text-align:right}
.summary-text{margin:0;color:var(--muted);font-size:14px}
.meta-row{margin-top:8px;font-size:13px;color:var(--muted)}
.meta-row .published{color:var(--muted)}

/* 主体网格：桌面为8/4，使用 grid */
.content-area{padding-top:12px}
.grid{display:grid;grid-template-columns:1fr;gap:12px}
.main-article{background:transparent}
.side-column{background:transparent}

/* 文章内部样式 */
.article-body{color:var(--ink);font-family:system-ui, -apple-system, 'Helvetica Neue', Arial, 'Microsoft YaHei', sans-serif;font-size:16px}
.article-body p{margin:0 0 12px}
.keywords, .related, .footer-related{color:var(--muted);font-size:14px}
.keywords{display:flex;flex-wrap:wrap;gap:8px}
.keywords > *{padding:4px 8px;border:1px solid var(--line);color:var(--ink);border-radius:2px;font-size:13px}
.side-module{border-top:1px solid var(--line);padding:12px 0}

/* 广告容器样式（不能覆盖正文） */
.ad{border-top:1px dashed var(--line);padding:12px 0;text-align:center;color:var(--muted);font-size:14px}

/* 页脚：visual_signature 宽屏索引式排版 */
.site-footer{margin-top:18px;border-top:1px solid var(--frame-border);padding-top:14px;padding-bottom:20px}
.footer-index{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-start}
.footer-col{flex:1 1 60%}
.footer-col.right{text-align:right;flex:0 0 200px}
.footer-related{color:var(--muted);font-size:14px}
.footer-note{color:var(--muted);font-size:13px}

/* FAQ 列表通常站位，模板不改写 faq 内容，保留 details 折叠语义 */
.faq-list details{border-top:1px solid var(--line);padding:10px 0}
.faq-list summary{cursor:pointer;font-weight:600}

/* 响应：桌面与手机必须是两套排版（非等比拉伸） */
@media (min-width: 1024px){
  /* 外框边线仅桌面存在 */
  body{background:var(--bg)}
  .page-frame{border-left:1px solid var(--frame-border);border-right:1px solid var(--frame-border);padding:28px 36px}
  /* 使用12列网格：8/4 */
  .grid{grid-template-columns:2fr 1fr;gap:28px;align-items:start}
  .page-title{font-size:36px}
  .summary-inline{max-width:520px}
  .label{margin-top:18px;font-size:13px;color:var(--muted);font-weight:700}
  .article-body{font-size:17px}
  .footer-index{display:flex;justify-content:space-between;align-items:flex-start}
  /* 桌面侧栏视觉为框线分隔而非阴影 */
  .side-column{padding-left:12px;border-left:1px solid var(--line)}
}

@media (max-width: 767px){
  /* 手机端移除页面左右边线，保留模块顶部线，侧栏下移并垂直排列 */
  .page-frame{max-width:100%;padding:12px 14px;border-left:0;border-right:0}
  .title-wrap{flex-direction:column;align-items:flex-start}
  .summary-inline{text-align:left}
  .meta-row{font-size:13px}
  .grid{grid-template-columns:1fr;gap:12px}
  .side-column{order:2;padding-top:6px;border-left:0;border-top:1px solid var(--line)}
  .main-article{order:1}
  .page-title{font-size:20px}
  .article-body{font-size:15px}
  .label{border-top:1px solid var(--line);padding-top:10px;margin-top:10px}
  .ad{padding:10px 0}
  .footer-index{flex-direction:column;gap:8px}
}

/* 禁止光影与大型圆角等被禁止的视觉套路，保持简洁平面 */
*{box-sizing:border-box}