/* rsi.css — RSI 深度长文 view 专属样式 (2026-06-19, v2 Notion 扁平风)
 * 全部选择器 scope 在 #rsi-view 之下 (site.css 有裸 .wrap/.card, id 特异性更高 → 视图内胜出且不外泄)。
 * 设计约束(用户要求): ① 仅 2 个字号(标题 --rsi-h / 正文 --rsi-b), 层级靠 weight+color+留白;
 *   ② 无白色卡片衬底, 通篇扁平在页面底色上, 仅靠分隔线/左侧色条做轻结构; ③ Notion 文章风。
 */

#rsi-view {
  --rsi-h: 1.45rem;   /* 唯一的"标题"字号: hero h1 + 章节 h2 共用 */
  --rsi-b: 1rem;      /* 唯一的"正文"字号: h3(粗体)/段落/说明/脚注/标签/SVG 外文字 全用它 */
  color: var(--text-1);
  font-family: var(--font-sans);
  font-size: var(--rsi-b);
  line-height: 1.78;
}
#rsi-view .rsi-wrap { max-width: 720px; margin: 0 auto; padding: var(--sp-4) 0 var(--sp-6); }
#rsi-view a { color: var(--accent); text-decoration: none; }
#rsi-view b { color: var(--text-0); font-weight: 600; }
#rsi-view .accent { color: var(--accent); font-weight: 600; }
#rsi-view .dim, #rsi-view .sm { color: var(--text-3); }
#rsi-view p { margin: 0 0 var(--sp-4); }

/* ---- hero ---- */
#rsi-view .hero { padding: var(--sp-5) 0 var(--sp-4); }
#rsi-view .eyebrow { letter-spacing: .12em; color: var(--text-3); margin-bottom: var(--sp-3); }
#rsi-view h1 { font-family: var(--font-heading); font-size: var(--rsi-h); line-height: 1.32; color: var(--text-0); margin: 0 0 var(--sp-3); font-weight: 700; }
#rsi-view .hook { color: var(--text-1); }
/* 阅读主线(因果链) — 紧跟 hook, 给读者一张"层层递进"的地图; 仅靠颜色+加粗, 不做卡 */
#rsi-view .spine { color: var(--text-2); margin-top: var(--sp-2); }
#rsi-view .spine b { color: var(--text-0); font-weight: 600; }
#rsi-view .roadmap { display: flex; gap: var(--sp-2); align-items: center; flex-wrap: wrap; margin-top: var(--sp-3); color: var(--text-2); }
#rsi-view .roadmap .step { color: var(--text-2); }
#rsi-view .roadmap .sep { color: var(--text-3); }

/* 关键事实条 — 替代 KPI 卡, 扁平横排, 无衬底, 仅顶部细线 */
#rsi-view .facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-4); margin: var(--sp-5) 0 var(--sp-3); }
#rsi-view .facts .f { border-top: 2px solid var(--border-strong); padding-top: var(--sp-2); }
#rsi-view .facts .f .num { font-family: var(--font-heading); font-size: var(--rsi-h); font-weight: 700; color: var(--accent); line-height: 1.2; }
#rsi-view .facts .f .lab { color: var(--text-3); margin-top: var(--sp-1); line-height: 1.5; }
#rsi-view .heroMeta { color: var(--text-3); margin-top: var(--sp-3); }

/* ---- 章节 ---- */
#rsi-view .sec { margin-top: calc(var(--sp-6) * 1.6); }
#rsi-view .secNo { letter-spacing: .16em; color: var(--accent); margin-bottom: var(--sp-2); }
#rsi-view h2 { font-family: var(--font-heading); font-size: var(--rsi-h); color: var(--text-0); line-height: 1.34; margin: 0 0 var(--sp-3); font-weight: 700; }
#rsi-view .lede { color: var(--text-2); margin: 0 0 var(--sp-4); }

/* .blk → 扁平段块: 无卡、无框、无衬底, 只留间距; h3 = 粗体正文(不另起字号) */
#rsi-view .blk { margin-bottom: var(--sp-5); }
#rsi-view .blk h3 { font-size: var(--rsi-b); font-weight: 700; color: var(--text-0); margin: 0 0 var(--sp-1); }
#rsi-view .blk .hint { color: var(--text-3); margin-bottom: var(--sp-3); }

/* 图 */
#rsi-view .svgbox { margin: var(--sp-4) 0 var(--sp-2); }
#rsi-view .svgbox svg { width: 100%; height: auto; display: block; }
#rsi-view .svgbox img { width: 100%; height: auto; display: block; border: 1px solid var(--border-soft); border-radius: var(--r-md); }
#rsi-view .svgcap { color: var(--text-3); margin-top: var(--sp-2); text-align: center; }

/* 章节间过渡 — 仅左侧色条, 无衬底 */
#rsi-view .bridge { font-family: var(--font-heading); color: var(--text-0); margin: var(--sp-5) 0; padding-left: var(--sp-4); border-left: 3px solid var(--accent); }
#rsi-view .bridge .q { color: var(--text-2); font-family: var(--font-sans); margin-bottom: var(--sp-1); }

/* 引文 — 左侧色条, 无衬底 */
#rsi-view .pull { border-left: 3px solid var(--border-strong); padding: 0 0 0 var(--sp-4); margin: var(--sp-4) 0; }
#rsi-view .pull .zh { font-family: var(--font-heading); color: var(--text-0); }
#rsi-view .pull .en { color: var(--text-3); margin-top: var(--sp-1); font-style: italic; }

/* 诚实注 / callout — Notion 风轻底色 + 左色条(非白衬底) */
#rsi-view .note { background: var(--tag-bg); border-left: 3px solid var(--accent); border-radius: 0 var(--r-md) var(--r-md) 0; padding: var(--sp-3) var(--sp-4); margin: var(--sp-4) 0; color: var(--text-1); }
#rsi-view .note b { color: var(--text-0); }

/* 临界系数 k 的基准说明 — 三行紧凑列表(替代散点比喻), 仅横线, 无卡 */
#rsi-view .kbench { margin: var(--sp-4) 0; border-top: 1px solid var(--border-strong); }
#rsi-view .kbench .kr { display: flex; gap: var(--sp-3); align-items: baseline; padding: var(--sp-3) 0; border-bottom: 1px solid var(--border-soft); }
#rsi-view .kbench .kk { flex: 0 0 86px; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: .02em; }
#rsi-view .kbench .kk.dn { color: var(--dn); }      /* 0.99 熄灭 → 与曲线图同色(绿) */
#rsi-view .kbench .kk.mid { color: var(--text-2); } /* 1.00 基准 → 灰 */
#rsi-view .kbench .kk.up { color: var(--accent); }  /* 1.01 燎原 → 橙(同曲线图) */
#rsi-view .kbench .kt { color: var(--text-1); }

/* 表格 — 仅横线, 无框 */
#rsi-view table { width: 100%; border-collapse: collapse; }
#rsi-view th { color: var(--text-3); text-align: left; font-weight: 600; padding: var(--pad-cell-y) var(--pad-cell-x); border-bottom: 1px solid var(--border-strong); }
#rsi-view td { padding: var(--pad-cell-y) var(--pad-cell-x); border-bottom: 1px solid var(--border-soft); vertical-align: top; }
#rsi-view tr:last-child td { border-bottom: none; }
/* 五互补要素表 — 第一列窄、加粗; 表后用一条 accent 顶线把 5 条前提"收"成阿姆达尔结论 */
#rsi-view .bottleTbl td:first-child { width: 32%; color: var(--text-0); }
#rsi-view .amdahl { color: var(--text-1); margin: 0 0 var(--sp-4); padding-top: var(--sp-3); border-top: 2px solid var(--accent); }

/* 多栏(五要素 / A·B / 四关节) — 扁平: 顶部细线分隔, 无卡无衬底 */
#rsi-view .cols2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-4) var(--sp-5); margin: var(--sp-4) 0; }
#rsi-view .cols3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: var(--sp-4) var(--sp-5); margin: var(--sp-4) 0; }
#rsi-view .cell { border-top: 2px solid var(--border-strong); padding-top: var(--sp-2); }
#rsi-view .cell.key { border-top-color: var(--accent); }
#rsi-view .cell .ct { font-weight: 700; color: var(--text-0); }
#rsi-view .cell .cs { color: var(--text-3); margin-top: 2px; }
#rsi-view .cell .cb { color: var(--text-2); margin-top: var(--sp-2); }
#rsi-view .cell .tag { color: var(--text-2); margin-bottom: var(--sp-1); }
#rsi-view .cell.a .tag { color: var(--up); }
#rsi-view .cell.b .tag { color: var(--dn); }

/* 四关节裁决小标 — 用颜色, 不另起字号/不做徽章衬底 */
#rsi-view .verdict-lead { font-weight: 600; }
#rsi-view .verdict-lead.yes { color: var(--dn); }
#rsi-view .verdict-lead.no { color: var(--up); }
#rsi-view .verdict-lead.mid { color: var(--accent); }

/* 收尾判断 — 左粗色条强调, 非深色卡 */
#rsi-view .verdict { border-left: 4px solid var(--accent); padding-left: var(--sp-4); margin: var(--sp-4) 0; }
#rsi-view .verdict h3 { font-size: var(--rsi-b); font-weight: 700; color: var(--text-0); margin: 0 0 var(--sp-2); }
#rsi-view .verdict .sigline { font-family: var(--font-heading); color: var(--text-3); margin-top: var(--sp-3); letter-spacing: .04em; }

/* footer */
#rsi-view footer { margin-top: calc(var(--sp-6) * 1.4); padding-top: var(--sp-4); border-top: 1px solid var(--border-strong); color: var(--text-3); line-height: 1.85; }
#rsi-view footer ol { padding-left: 1.4em; margin: var(--sp-2) 0 0; }
#rsi-view sup { color: var(--accent); font-size: .72em; }

@media (max-width: 640px) {
  #rsi-view .facts { grid-template-columns: 1fr 1fr; }
  #rsi-view .cols2, #rsi-view .cols3 { grid-template-columns: 1fr; }
}