/* 变量色板与基准 */
:root{
  --bg: #f6f6f6; /* 轻灰背景 */
  --surface: #ffffff; /* 内容面板 */
  --text: #222222; /* 石墨灰文字 */
  --muted: #666666;
  --accent: #caa800; /* 芥末黄 */
  --divider: #e6e6e6;
  --max-width: 1300px; /* 桌面容器上限（位于1120-1440区间） */
  --gap: 28px;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --serif: Georgia, "Times New Roman", serif;
}

/* 全局重置与可读性 */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:var(--sans);
  color:var(--text);
  background:var(--bg);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}

/* 头部：极简细导航，居中站名 + 左右文本 */
.site-header{border-bottom:1px solid var(--divider);background:var(--surface)}
.nav-row{max-width:var(--max-width);margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:12px 20px}
.site-title{font-weight:700;font-family:var(--serif);font-size:1.05rem;color:var(--text);text-align:center}
.site-title a{color:var(--text)}
.nav-side{color:var(--muted);font-size:0.95rem}

/* 广告容器样式（独立、不悬浮） */
.ad-slot{max-width:var(--max-width);margin:18px auto;padding:8px 12px;background:transparent;border-top:1px dashed var(--divider);border-bottom:1px dashed var(--divider);color:var(--muted);font-size:0.92rem}
.ad-slot:empty{display:none}

/* 页面框架 */
.site-frame{margin:22px auto;padding:18px;min-height:60vh}
.top-split{display:grid;grid-template-columns:1fr auto;align-items:start;gap:18px;max-width:var(--max-width);margin:0 auto;padding:18px;background:transparent;border-bottom:1px solid var(--divider)}

/* 左侧主引导：标题与摘要 */
.lead h1{font-family:var(--serif);font-size:1.9rem;margin:0 0 10px 0;color:var(--text);line-height:1.18}
.lead .published{display:block;color:var(--muted);font-size:0.92rem;margin-bottom:10px}
.lead .summary{margin:0;color:var(--muted);font-size:1.02rem}

/* 竖排元信息（视觉签名） */
.meta-vertical{display:none} /* 默认隐藏，桌面显示 */
.meta-stack{display:flex;flex-direction:column;gap:12px;padding:8px 12px;color:var(--muted);font-size:0.95rem}
.meta-item{border-left:3px solid var(--accent);padding-left:10px}

/* 内容与侧栏网格（默认为单列，桌面会切换） */
.content-grid{display:block;max-width:var(--max-width);margin:18px auto;padding:0 18px}
.content-column{margin-bottom:22px}
.content{background:transparent;color:var(--text);font-size:1rem}
.content p{margin:0 0 12px 0}
.content ul, .content ol{margin:0 0 12px 24px}

/* 侧栏内容 */
.side-column{background:transparent;border-top:1px solid var(--divider);padding-top:14px;margin-top:14px}
.side-column h2,h3{font-family:var(--serif);color:var(--text);margin:0 0 8px 0;font-size:1.05rem}
.faq-list{border-top:1px solid var(--divider);margin-top:8px}
.faq-list > *{padding:10px 0;border-bottom:1px solid var(--divider)}
.faq-list h4{margin:0;font-weight:600;font-size:0.98rem}
.faq-list p{margin:6px 0 0 0;color:var(--muted)}

.related.index{display:block;padding-top:12px}
.related.index > *{display:block;padding:6px 0;border-bottom:1px dashed var(--divider);color:var(--muted);font-size:0.95rem}

/* 页脚 */
.site-footer{border-top:1px solid var(--divider);background:var(--surface);padding:12px 0;margin-top:26px}
.footer-row{max-width:var(--max-width);margin:0 auto;text-align:right;padding:0 18px;color:var(--muted);font-size:0.92rem}

/* 桌面规则：明确 @media(min-width:1024px) */
@media (min-width:1024px){
  .site-frame{padding:28px}
  .top-split{grid-template-columns:1fr 140px;align-items:start}
  .meta-vertical{display:block;writing-mode:vertical-rl;text-orientation:mixed;margin-left:12px;align-self:start}
  .meta-stack{border-left:none;padding-left:0}
  /* 内容采用7/5两栏布局，明确桌面差异 */
  .content-grid{display:grid;grid-template-columns:7fr 5fr;gap:28px;padding:22px}
  .side-column{border-top:none;padding-top:0;margin-top:0}
  .content{font-size:1.02rem}
  .lead h1{font-size:2.2rem}
}

/* 在更宽视口下强制内容容器处于1120-1440区间（当视口允许时） */
@media (min-width:1120px){
  .nav-row,.site-frame,.ad-slot,.content-grid,.top-split,.footer-row{max-width:var(--max-width);margin-left:auto;margin-right:auto}
}

/* 手机端规则：明确 @media(max-width:767px)，独立重排 */
@media (max-width:767px){
  body{font-size:15px}
  .nav-row{padding:10px 14px}
  .site-title{font-size:1rem}
  .top-split{display:block;padding:12px}
  .lead h1{font-size:1.25rem}
  .lead .summary{margin-top:8px}
  .meta-vertical{display:none}
  .content-grid{display:block;padding:12px}
  .side-column{border-top:1px solid var(--divider);padding-top:12px;margin-top:18px}
  .faq-list > *{padding:10px 0}
  .ad-slot{margin:12px}
  /* 确保320px时无横向滚动 */
  .site-frame,.nav-row,.content-grid{padding-left:12px;padding-right:12px}
}

/* 视觉细节：线条、无圆角、无阴影 */
*{border-radius:0}