/* ==========================================================================
   AI newspaper · 公用主题样式
   报纸风格：纸色底、双线规则、暗红点缀、Maple Mono NF CN 等宽正文
   用法：<link rel="stylesheet" href="assets/newspaper.css">
   （字体在同目录 fonts/fonts.css，已由本文件 @import，无需额外引入）
   ========================================================================== */
@import url("fonts/fonts.css");

:root{
  --ink:#16130f;
  --ink-soft:#3d3730;
  --ink-light:#6b6357;
  --ink-faint:#918a7c;          /* 出处/信源这类「引用行」的灰 */
  --paper:#f2ede2;
  --paper-2:#e9e2d3;
  --accent:#8c1d18;
  --rule:#2a241d;
  --serif:"Maple Mono NF CN","Maple Mono NF",ui-monospace,SFMono-Regular,Menlo,monospace;
  --sans:"Maple Mono NF CN","Maple Mono NF",ui-monospace,SFMono-Regular,Menlo,monospace;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{-webkit-text-size-adjust:100%}   /* 禁掉 iOS 的自动放大字号 */
body{
  background:#cfc7b4;
  background-image:radial-gradient(circle at 20% 10%,rgba(255,255,255,.35),transparent 60%),
                   radial-gradient(circle at 85% 80%,rgba(0,0,0,.06),transparent 55%);
  color:var(--ink);
  font-family:var(--serif);
  font-variant-ligatures:none;
  font-feature-settings:"calt" 0;
  line-height:1.82;
  padding:28px 14px 60px;
  -webkit-font-smoothing:antialiased;
}

/* ── 纸张 ───────────────────────────────────────────────────────────────── */
.sheet{
  max-width:1180px;
  margin:0 auto;
  background:var(--paper);
  background-image:
    repeating-linear-gradient(0deg,rgba(0,0,0,.012) 0 1px,transparent 1px 3px),
    repeating-linear-gradient(90deg,rgba(0,0,0,.012) 0 1px,transparent 1px 3px);
  box-shadow:0 2px 0 rgba(0,0,0,.15),0 18px 45px rgba(0,0,0,.35);
  padding:26px 30px 34px;
  border:1px solid #bdb49f;
}
.sheet--flat{box-shadow:none;border-color:#c6bda8;max-width:none}

/* ── 报头 ───────────────────────────────────────────────────────────────── */
/* 版面顶部不再有「期号 / 数据来源」那一行：阅读栏已显示期号，页脚已有出处。
   .masthead 直接起头。 */
.masthead{
  text-align:center;padding:18px 0 10px;
  border-bottom:3px double var(--rule);
}
.masthead .cn{
  font-size:clamp(42px,9vw,88px);font-weight:800;letter-spacing:.02em;
  line-height:1.06;margin:0;text-indent:.02em;
}
.masthead .en{
  font-family:var(--sans);font-size:11px;letter-spacing:.26em;font-weight:500;
  color:var(--ink-light);margin-top:12px;text-transform:uppercase;
}
.dateline{
  display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px;
  font-family:var(--sans);font-size:11.5px;letter-spacing:.04em;
  color:var(--ink-soft);padding:8px 0 12px;border-bottom:1px solid var(--rule);
}
.dateline b{font-weight:600}
.dateline .sep{color:var(--accent)}

/* ── 导读 ───────────────────────────────────────────────────────────────── */
.brief{
  display:flex;flex-wrap:wrap;gap:10px 0;
  border-bottom:2px solid var(--rule);
  padding:11px 0;font-size:13px;
}
.brief .k{
  font-family:var(--sans);font-size:10.5px;font-weight:700;letter-spacing:.14em;
  background:var(--accent);color:#f5eff0;padding:3px 9px;margin-right:12px;
  align-self:center;white-space:nowrap;
}
.brief .v{flex:1 1 320px;min-width:260px;padding-right:22px;color:var(--ink-soft)}
.brief .v + .v{border-left:1px solid #c3baa5;padding-left:22px}

/* ── 数字条 ─────────────────────────────────────────────────────────────── */
.stats{
  display:grid;grid-template-columns:repeat(6,1fr);
  border-bottom:3px double var(--rule);
}
.stats .s{padding:13px 10px;border-left:1px dashed #c3baa5;text-align:center}
.stats .s:first-child{border-left:0}
.stats .n{
  display:block;font-size:23px;font-weight:800;color:var(--accent);
  line-height:1.15;letter-spacing:-.01em;
}
.stats .l{
  display:block;font-family:var(--sans);font-size:10.2px;color:var(--ink-light);
  line-height:1.55;margin-top:5px;
}

/* ── 栏目头 ─────────────────────────────────────────────────────────────── */
.section{margin-top:26px}
.section-head{display:flex;align-items:center;gap:12px;margin:0 0 14px}
.section-head h2{
  font-family:var(--sans);font-size:13px;font-weight:800;letter-spacing:.16em;
  margin:0;white-space:nowrap;color:var(--ink);
}
.section-head .cn-num{font-family:var(--serif);font-size:12px;color:var(--accent);letter-spacing:.2em}
.section-head::after{content:"";flex:1;height:0;border-top:3px double var(--rule)}
.section-head::before{
  content:"";width:14px;height:14px;background:var(--accent);
  clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);flex:none;
}
.subhead{
  font-family:var(--sans);font-size:11px;font-weight:800;letter-spacing:.14em;
  color:var(--accent);margin:18px 0 10px;padding-bottom:4px;
  border-bottom:1px solid var(--rule);
}
.topic-note{
  font-family:var(--sans);font-size:11.4px;color:var(--ink-light);
  margin:-4px 0 14px;padding-left:2px;
}

/* ── 头条 ───────────────────────────────────────────────────────────────── */
.lead{
  display:grid;grid-template-columns:2.05fr 1fr;gap:0;
  border-bottom:1px solid var(--rule);padding-bottom:20px;
}
.lead-main{padding-right:26px;border-right:1px solid #c3baa5}
.lead-side{padding-left:26px}
.lead--solo{grid-template-columns:1fr}          /* 没有侧栏时头条通栏 */
.lead--solo .lead-main{padding-right:0;border-right:0}
.kicker{
  font-family:var(--sans);font-size:11px;letter-spacing:.16em;font-weight:700;
  color:var(--accent);text-transform:uppercase;margin-bottom:8px;
}
.lead-main h1{
  font-size:clamp(27px,4.1vw,46px);line-height:1.34;margin:0 0 14px;
  font-weight:800;letter-spacing:0;
}
.lead-main h1.is-long{font-size:clamp(22px,2.9vw,34px);line-height:1.45}  /* 长标题降一号 */
.deck{                        /* 副题：不用斜体，靠左侧暗红竖线 + Medium 字重区分 */
  font-size:14.4px;color:#4a4339;font-weight:500;letter-spacing:.01em;
  border-left:3px solid var(--accent);padding-left:12px;margin:0 0 14px;
}
.lead-main p{margin:0 0 12px;font-size:15.2px;text-align:justify}
.lead-main p.first{font-size:15.6px;color:#241e18}
.lead-main p.first::first-line{font-weight:500;letter-spacing:.01em}
.lead-side h3{
  font-size:17.5px;line-height:1.5;margin:0 0 8px;font-weight:800;
  border-bottom:1px solid #c3baa5;padding-bottom:8px;
}
.lead-side .item{padding:12px 0;border-bottom:1px dotted #b6ac96}
.lead-side .item:last-child{border-bottom:0}
.lead-side .item p{margin:4px 0 0;font-size:13.4px;color:var(--ink-soft);text-align:justify}
.lead-side .more{
  margin-top:10px;font-family:var(--sans);font-size:10.6px;color:var(--ink-light);
  border-top:1px solid #c3baa5;padding-top:8px;
}

/* ── 多栏与条目 ─────────────────────────────────────────────────────────── */
.cols{column-count:3;column-gap:26px;column-rule:1px solid #c3baa5}
.cols.two{column-count:2}
article.story{
  break-inside:avoid;margin:0 0 16px;padding-bottom:14px;
  border-bottom:1px dotted #b6ac96;
}
article.story:last-child{border-bottom:0}
.story h4{margin:0 0 6px;font-size:15px;line-height:1.52;font-weight:700}
.story .src{
  font-family:var(--sans);font-size:9.5px;letter-spacing:.02em;font-weight:400;
  color:var(--ink-faint);margin-bottom:6px;
}
.story .src .t{color:var(--accent);font-weight:700}
/* 头条下方的出处行，与条目出处同一套样式 */
.lead-main p.src-line{
  font-family:var(--sans);font-size:9.5px;letter-spacing:.02em;
  color:var(--ink-faint);margin:2px 0 0;
}
.story p{margin:0;font-size:13.6px;color:var(--ink-soft);text-align:justify}
.story p.tag{margin-top:6px;font-size:12.6px;color:#514a40}
.story .ext{
  margin-top:6px;font-size:12.4px;color:#514a40;
  border-top:1px solid #d6cdb8;padding-top:5px;
}

/* ── 正文内联元素 ───────────────────────────────────────────────────────── */
a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(140,29,24,.35)}
a:hover{border-bottom-color:var(--accent);color:var(--accent)}
em,i,cite,address,dfn{font-style:normal}     /* 全站不出现斜体 */
em{color:var(--accent);font-weight:700}

/* ── 榜单（今日热榜等） ─────────────────────────────────────────────────── */
.board{
  background:var(--paper-2);border:1px solid var(--rule);
  padding:16px 18px 8px;margin-top:6px;
}
.board ol{margin:0;padding-left:0;list-style:none;counter-reset:rk}
.board li{
  counter-increment:rk;display:flex;gap:12px;align-items:flex-start;
  padding:11px 0;border-bottom:1px dotted #b6ac96;font-size:14.2px;
}
.board li:last-child{border-bottom:0}
.board li::before{
  content:counter(rk);font-family:var(--sans);font-weight:800;font-size:12px;
  color:#f2ede2;background:var(--ink);min-width:22px;height:22px;line-height:22px;
  text-align:center;flex:none;margin-top:2px;
}
.board li:nth-child(1)::before,
.board li:nth-child(2)::before,
.board li:nth-child(3)::before{background:var(--accent)}
.board .body{flex:1;min-width:0}
.board .body>b,.board .body a{font-weight:700}
.board .meta{
  display:block;font-family:var(--sans);font-size:9.6px;color:var(--ink-faint);
  letter-spacing:.04em;margin-top:3px;
}
.board .desc{margin:5px 0 0;font-size:13.2px;color:var(--ink-soft);line-height:1.78;text-align:justify}
.board .desc em{font-style:normal;color:var(--accent);font-weight:700}

/* ── 页脚 ───────────────────────────────────────────────────────────────── */
.footer{
  margin-top:30px;border-top:3px double var(--rule);padding-top:14px;
  display:flex;flex-wrap:wrap;gap:12px 30px;justify-content:space-between;
  font-family:var(--sans);font-size:10.8px;font-weight:400;letter-spacing:.01em;
  color:var(--ink-light);line-height:1.9;
}
.footer .stamp{
  font-family:var(--serif);font-size:12px;font-weight:700;letter-spacing:.14em;
  color:var(--accent);border:1px solid var(--accent);padding:4px 10px;
  flex:none;align-self:flex-start;
}
.footer p{margin:0;max-width:660px}

/* ── 嵌入容器（索引页右侧渲染区）的按宽度折栏 ───────────────────────────── */
.doc-wrap{container-type:inline-size;container-name:doc}
@container doc (max-width:900px){.cols{column-count:2}}
@container doc (max-width:620px){.cols,.cols.two{column-count:1}}
@container doc (max-width:900px){.stats{grid-template-columns:repeat(3,1fr)}.stats .s:nth-child(4){border-left:0}}
@container doc (max-width:560px){.stats{grid-template-columns:repeat(2,1fr)}.stats .s:nth-child(3){border-left:0}}
@container doc (max-width:820px){.lead{grid-template-columns:1fr}.lead-main{padding-right:0;border-right:0;border-bottom:1px solid #c3baa5;padding-bottom:16px}.lead-side{padding-left:0;padding-top:16px}.lead--solo .lead-main{border-bottom:0}}
@container doc (max-width:820px){.brief .v + .v{border-left:0;padding-left:0}}

/* ── 响应式（独立页面按视口折栏） ───────────────────────────────────────── */
@media (max-width:900px){
  .cols{column-count:2}
  .stats{grid-template-columns:repeat(3,1fr)}
  .stats .s:nth-child(4){border-left:0}
}
@media (max-width:860px){
  .lead{grid-template-columns:1fr}
  .lead-main{padding-right:0;border-right:0;border-bottom:1px solid #c3baa5;padding-bottom:16px}
  .lead-side{padding-left:0;padding-top:16px}
  .brief .v + .v{border-left:0;padding-left:0}
  .sheet{padding:20px 18px 26px}
}
@media (max-width:640px){
  .cols,.cols.two{column-count:1}
  .sheet{padding:16px 14px 22px}
  .masthead{padding:14px 0 8px}
  .masthead .cn{font-size:clamp(34px,11vw,52px)}
  .dateline{flex-direction:column;gap:2px;align-items:center;padding:8px 0 10px}
  .dateline .sep{display:none}               /* 竖排时不需要菱形分隔 */
  .lead-main h1{font-size:26px}
  .lead-main h1.is-long{font-size:21px}
}
@media (max-width:560px){.stats{grid-template-columns:repeat(2,1fr)}.stats .s:nth-child(3){border-left:0}}

@media print{
  body{background:#fff;padding:0}
  .sheet{box-shadow:none;border:0;max-width:none}
  .board{background:#fff}
}
