:root{
  --bg: #f8f6f2; /* 纸白 */
  --text: #111213;
  --muted: #6b6b6b;
  --accent: #0b2540; /* 藏蓝强调色 */
  --line: rgba(0,0,0,0.08);
  --max-width: 1280px; /* 在 1120-1440 之间 */
  --side-nav-width: 160px;
  --radius: 0; /* 直角 */
  --gap: 20px;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  --serif: Georgia, "Times New Roman", Times, serif;
}

/* 基础重置与可访问性 */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:var(--sans);
  color:var(--text);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.65;
}
.visually-hidden{position:absolute;left:-9999px}

/* 左侧纵向刊头 */
.side-nav{
  position:fixed;
  left:0;top:0;bottom:0;
  width:var(--side-nav-width);
  background:var(--accent);
  color: #fff;
  padding:22px 14px;
  border-right:1px solid rgba(255,255,255,0.06);
  display:flex;align-items:flex-start;flex-direction:column;gap:12px;
}
.brand{display:flex;flex-direction:column;gap:6px}
.brand-link{color: #fff;text-decoration:none;font-weight:700;font-size:16px}
.brand-sub{font-size:12px;opacity:0.9}

/* 页面外壳：留出左侧栏宽度 */
.page-shell{margin-left:var(--side-nav-width);min-height:100vh;padding:24px 32px}
.inner{max-width:var(--max-width);margin-inline:auto;display:flex;flex-direction:column;gap:18px}

/* 细线网格风格的顶部工具条 */
.page-header{border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:6px}
.header-row{display:flex;justify-content:space-between;align-items:center;gap:12px}
.meta-line{color:var(--muted);font-size:13px}
.meta-line .pipe{margin:0 8px;color:var(--line)}
.keywords{font-size:13px;color:var(--muted)}

/* 主网格：8/4 分栏 */
.layout-grid{display:grid;grid-template-columns:2fr 1fr;gap:28px;align-items:start}
.article{background:#fff;padding:28px;border:1px solid var(--line)}
.side-column{padding:18px;border:1px solid var(--line);background:#fff}

/* 标题构图：超大但受限两行 */
.title{
  margin:0 0 12px 0;
  font-family:var(--serif);
  font-weight:700;
  color:var(--text);
  font-size:44px; /* 超大 */
  line-height:1.05;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.summary{margin:0 0 18px 0;color:var(--muted);font-size:15px}

.article-body{color:var(--text);font-size:17px;line-height:1.8}
.article-body p{margin:0 0 16px}
.article-body h2{margin:22px 0 12px;font-size:20px;color:var(--accent)}

.section-title{margin:18px 0 10px;font-size:16px;color:var(--text)}

/* 广告容器：独立、不可悬浮 */
.ad-zone{border:1px dashed var(--line);padding:12px;margin:18px 0;background:transparent;color:var(--muted);font-size:13px}
.ad-zone *{color:inherit}

/* FAQ 区：鼓励使用 details，但容器保持中性 */
.faq-section .faq-list{margin-top:8px}
.faq-list details{border-top:1px solid var(--line);padding:10px 0}
.faq-list summary{cursor:pointer;font-weight:600}

/* 侧栏信息块：方形信息块、细线、无大圆角 */
.info-box{border:1px solid var(--line);padding:12px;background:#fff}
.info-title{font-weight:700;color:var(--accent);margin-bottom:6px}
.info-body{color:var(--muted);font-size:14px}

/* 相关阅读：底部三列短卡（无阴影） */
.related-wrap{margin-top:22px;padding-top:12px;border-top:1px solid var(--line)}
.related-title{font-size:15px;margin:0 0 12px}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.related-grid > *{background:#fff;border:1px solid var(--line);padding:12px;font-size:14px}

/* 页脚广告 */
.page-footer{margin-top:22px}

/* 视觉约束：全部直角、细线、单一强调色（藏蓝） */
*{border-radius:0}

/* 响应式：桌面明确规则 */
@media (min-width:1024px){
  :root{--max-width:1280px}
  .page-shell{padding:36px}
  .inner{gap:24px}
  .layout-grid{grid-template-columns:2fr 1fr;gap:32px}
  .title{font-size:56px}
  .article{padding:36px}
  .side-column{position:relative;top:0}
}

/* 手机端：单列、标题比例缩小、侧栏下移（折叠为块） */
@media (max-width:767px){
  .side-nav{position:relative;width:100%;height:auto;padding:12px 14px;flex-direction:row;align-items:center}
  .brand-link{font-size:15px}
  .page-shell{margin-left:0;padding:12px}
  .inner{max-width:100%;padding:0}
  .layout-grid{display:block}
  .article{padding:18px}
  .side-column{margin-top:18px;padding:14px}
  .title{font-size:22px;line-height:1.12;-webkit-line-clamp:2}
  .article-body{font-size:16px}
  .related-grid{grid-template-columns:1fr;gap:10px}
  .related-grid > *{padding:10px}
  .ad-zone{margin:14px 0}
}

/* 中等屏：避免横向滚动 */
@media (min-width:768px) and (max-width:1023px){
  :root{--max-width:960px}
  .title{font-size:32px}
}