/* 研究报告页。只用 tokens.css 的令牌与 page.css 的网格。
   正文：左 3 栏目录（桌面吸顶），右 9 栏里文字收在 40 em 一行，图表与表格用满 9 栏。
   数据图照数据可视化规范：单一墨色，条长按比例，直接标数，不用图例；浅色段只表示区间。 */

/* ---------- 首屏与摘要 ---------- */
.rp-hero .t-label a:hover { color: var(--senyu-paper); }
.lede .t-body { max-width: 40em; }
.rs-hero .t { width: min(100%, 696px); }
.lede .t-body + .t-body { margin-top: var(--space-2); }

/* ---------- 正文 ---------- */
.rp { row-gap: var(--space-4); }
.rp .meta { display: none; }
.rp .body > * { max-width: 40em; }
.rp .body > .wide, .rp .body > figure { max-width: none; }
.rp .body > * + * { margin-top: var(--space-2); }
.rp .body > h2 { margin-top: var(--space-8); padding-top: var(--space-1); border-top: 1px solid var(--senyu-ink); scroll-margin-top: calc(var(--nav-h) + var(--space-2)); }
.rp .body > h2:first-child { margin-top: 0; }
.rp .body > h3 { margin-top: var(--space-4); }
.rp .body > h2 + * { margin-top: var(--space-3); }
.rp .body > figure, .rp .body > .wide { margin-top: var(--space-4); margin-bottom: var(--space-2); }
.rp .body p { color: var(--senyu-n3); }
.rp .body b { color: var(--senyu-ink); font-weight: var(--w-ui); }
sup.cn { font-family: var(--font-mono); font-size: 0.62em; line-height: 0; margin-left: 1px; }
sup.cn a { color: var(--color-text-2); padding: 0 1px; transition: color var(--motion-response) var(--ease-response); }
sup.cn a:hover { color: var(--senyu-ink); transition-duration: var(--motion-instant); }

/* 并列的段落：编号用等宽 */
.pts { counter-reset: pt; }
.pts li { position: relative; counter-increment: pt; padding: var(--space-1-5) 0 var(--space-1-5) var(--space-4); border-top: 1px solid var(--color-border); }
.pts li:last-child { border-bottom: 1px solid var(--color-border); }
.pts li::before { content: counter(pt, decimal-leading-zero); position: absolute; left: 0; top: calc(var(--space-1-5) + .55em); font-family: var(--font-mono); font-size: var(--fs-label); letter-spacing: var(--track-mono); color: var(--color-text-2); }

/* 目录 */
.toc { margin-top: var(--space-2); display: grid; row-gap: var(--space-1); counter-reset: toc; }
.toc li { counter-increment: toc; display: grid; grid-template-columns: 2.4em 1fr; color: var(--color-text-2); }
.toc li::before { content: counter(toc, decimal-leading-zero); font-family: var(--font-mono); letter-spacing: var(--track-mono); }
.toc li:last-child::before { content: ""; }
.toc a { transition: color var(--motion-response) var(--ease-response); }
.toc a:hover { color: var(--senyu-ink); transition-duration: var(--motion-instant); }

/* ---------- 六个维度：区间条 ---------- */
.rng .rh { display: none; color: var(--color-text-2); padding-bottom: var(--space-1); border-bottom: 1px solid var(--senyu-ink); }
.rng li { display: grid; grid-template-columns: 1fr; row-gap: var(--space-1); padding: var(--space-2) 0; border-bottom: 1px solid var(--color-border); }
.rng .nm > b { display: block; font-weight: var(--w-ui); }
.rng .nm > span { display: block; margin-top: var(--space-0-5); color: var(--color-text-2); }
.rng .br { display: flex; flex-direction: column; gap: var(--space-0-75); }
.rng .br i { display: block; height: var(--space-1); background:
  linear-gradient(to right, var(--senyu-ink) 0 calc(var(--a) * 1%), var(--senyu-n7) calc(var(--a) * 1%) calc(var(--b) * 1%), transparent calc(var(--b) * 1%)),
  linear-gradient(to right, transparent calc(25% - 1px), var(--senyu-n9) calc(25% - 1px) 25%, transparent 25% calc(50% - 1px), var(--senyu-n9) calc(50% - 1px) 50%, transparent 50% calc(75% - 1px), var(--senyu-n9) calc(75% - 1px) 75%, transparent 75%),
  linear-gradient(var(--senyu-n9), var(--senyu-n9)) 0 50% / 100% 1px no-repeat; }
.rng .br em { font-style: normal; font-weight: var(--w-head); font-variant-numeric: tabular-nums; color: var(--senyu-ink); }
.rng .dr { color: var(--senyu-n4); }
.rng figcaption, .hb figcaption, .gap figcaption { margin-top: var(--space-1); color: var(--color-text-2); }

/* ---------- 条形：一行一个数 ---------- */
.hb, .gap { padding-top: var(--space-1); border-top: 1px solid var(--senyu-ink); }
.hb > .t-label, .gap > .t-label { color: var(--color-text-2); }
.hb ol, .gap ol { margin-top: var(--space-2); display: grid; row-gap: var(--space-1-5); }
.hb li, .gap li { display: grid; grid-template-columns: 1fr auto; column-gap: var(--space-1); row-gap: var(--space-0-5); align-items: center; }
.hb li > span, .gap li > span { grid-column: 1 / -1; color: var(--senyu-n4); }
.hb li i, .gap li i { display: block; height: var(--space-1); background: linear-gradient(var(--senyu-ink), var(--senyu-ink)) 0 0 / calc(var(--v) * 1%) 100% no-repeat, linear-gradient(var(--senyu-n9), var(--senyu-n9)) 0 50% / 100% 1px no-repeat; }
.hb li em, .gap li em { font-style: normal; font-weight: var(--w-ui); font-variant-numeric: tabular-nums; color: var(--senyu-ink); min-width: 4.5em; text-align: right; }
.gap li:first-child i { background: linear-gradient(var(--senyu-n7), var(--senyu-n7)) 0 0 / calc(var(--v) * 1%) 100% no-repeat, linear-gradient(var(--senyu-n9), var(--senyu-n9)) 0 50% / 100% 1px no-repeat; }
.gap .d { margin-top: var(--space-2); color: var(--senyu-n4); }
.gap .d b { font-size: var(--fs-h2); font-weight: var(--w-head); color: var(--senyu-ink); font-variant-numeric: tabular-nums; margin-right: var(--space-0-5); }

/* ---------- 表格：窄屏横向滚动 ---------- */
.xs { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.xs .tbl { min-width: 720px; }
.xs .tbl td { vertical-align: top; color: var(--senyu-n3); }
.xs .tbl td:first-child { white-space: nowrap; }

/* ---------- 参考来源 ---------- */
.refs { counter-reset: rf; }
.refs li { counter-increment: rf; display: grid; grid-template-columns: 2.4em 1fr; column-gap: var(--space-1); row-gap: var(--space-0-5); padding: var(--space-1) 0; border-top: 1px solid var(--color-border); scroll-margin-top: calc(var(--nav-h) + var(--space-2)); }
.refs li:last-child { border-bottom: 1px solid var(--color-border); }
.refs li::before { content: counter(rf); grid-row: 1 / span 2; font-family: var(--font-mono); font-size: var(--fs-label); letter-spacing: var(--track-mono); color: var(--color-text-2); padding-top: .2em; }
.refs li > span { color: var(--senyu-n3); }
.refs li a { color: var(--color-text-2); justify-self: start; transition: color var(--motion-response) var(--ease-response); }
.refs li a:hover { color: var(--senyu-ink); transition-duration: var(--motion-instant); }
.refs li:target { background: var(--color-fill); }

@media (min-width: 768px) {
  .hb li, .gap li { grid-template-columns: minmax(0, 15em) 1fr auto; }
  .hb li > span, .gap li > span { grid-column: auto; }
  .refs li { grid-template-columns: 2.4em 1fr auto; }
  .refs li::before { grid-row: auto; }
}
@media (min-width: 1200px) {
  .rp > .meta { display: block; grid-column: 1 / span 3; position: sticky; top: calc(var(--nav-h) + var(--space-3)); align-self: start; color: var(--color-text-2); }
  .rp > .body { grid-column: 4 / -1; }
  .rng .rh, .rng li { display: grid; grid-template-columns: repeat(9, minmax(0, 1fr)); column-gap: var(--grid-gutter); }
  .rng .rh > span:nth-child(1), .rng .nm { grid-column: 1 / span 3; }
  .rng .rh > span:nth-child(2), .rng .br { grid-column: 4 / span 3; }
  .rng .rh > span:nth-child(3), .rng .dr { grid-column: 7 / span 3; }
  .rng .br { padding-top: .35em; }
}

/* ---------- 研究索引页：只有一份报告 ---------- */
.feat { border-top: 1px solid var(--senyu-ink); padding-top: var(--space-1); }
.feat .k { color: var(--color-text-2); }
.feat h2 a { background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size var(--motion-brand-response) var(--ease-response); }
.feat h2 a:hover { background-size: 100% 1px; }
.feat .t-body { margin-top: var(--space-2); color: var(--senyu-n4); max-width: 32em; }
.kn { margin-top: var(--space-6); display: grid; grid-template-columns: 1fr; row-gap: var(--space-3); }
.kn > div { display: flex; flex-direction: column; padding-top: var(--space-1); border-top: 1px solid var(--color-border); }
.kn dd { order: -1; font-size: var(--fs-h1); font-weight: var(--w-head); line-height: 1.2; font-variant-numeric: tabular-nums; white-space: nowrap; margin-bottom: var(--space-1); }
.kn dd small { font-size: var(--fs-h3); font-weight: var(--w-ui); color: var(--color-text-2); margin: 0 2px; }
.kn dd small:first-child { margin: 0 var(--space-0-5) 0 0; }
.kn dt { color: var(--senyu-n4); }
.feat .ctas { margin-top: var(--space-6); }
@media (min-width: 768px) {
  .kn { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--grid-gutter); }
}