/* ===== Economist-style reading typography (opt-in, per page) =====
   挂在 frame.css / md-skins.css 之后加载；用双类提升特异性以覆盖皮肤默认。
   颜色一律取皮肤变量（--fg / --fg-muted / --border），不硬编码，保证 6 套皮肤都可读。
   强调色 --accent 与中文底 --zh-bg 按皮肤取值（浅色 EC 红，深色提亮红）。 */

[data-skin="github-light"] { --accent: #e3120b; --accent-soft: #fbe9e8; --zh-bg: #f4f5f7; }
[data-skin="github-dark"]  { --accent: #ff5b4a; --accent-soft: #2a1413; --zh-bg: rgba(255,255,255,.07); }
[data-skin="nord"]         { --accent: #bf616a; --accent-soft: #292e3a; --zh-bg: rgba(255,255,255,.07); }
[data-skin="tokyo-night"]  { --accent: #f7768e; --accent-soft: #2a2030; --zh-bg: rgba(255,255,255,.07); }
[data-skin="rose-pine"]    { --accent: #b4637a; --accent-soft: #f4e9ee; --zh-bg: #f1ecea; }
[data-skin="atom-one"]     { --accent: #e06c75; --accent-soft: #2a2024; --zh-bg: rgba(255,255,255,.07); }

/* 阅读栏：收窄、去卡片框、放大留白 */
.economist .wrap { max-width: 760px; }
.markdown-body.markdown-body {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 4px 8px 96px;
  max-width: 720px;
  margin: 0 auto;
  font-family: Georgia, "Iowan Old Style", "Times New Roman", "Songti SC",
    "STSong", "Noto Serif CJK SC", "Noto Serif SC", "Source Han Serif SC", serif;
  font-size: 18px;
  line-height: 1.8;
  letter-spacing: .1px;
  color: var(--fg, #1f2328);
}

/* 链接：EC 红、细下划 */
.markdown-body.markdown-body a {
  color: var(--accent);
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--accent) 45%, transparent);
  text-underline-offset: .22em;
}
.markdown-body.markdown-body a:hover { text-decoration-color: var(--accent); }

/* 标题：衬线、紧致、红细线分隔；颜色随皮肤 */
.markdown-body.markdown-body h1,
.markdown-body.markdown-body h2,
.markdown-body.markdown-body h3,
.markdown-body.markdown-body h4 {
  font-family: Georgia, "Songti SC", "Noto Serif SC", serif;
  font-weight: 700;
  line-height: 1.3;
  color: var(--fg, #1f2328);
  letter-spacing: 0;
  scroll-margin-top: 64px;
}
.markdown-body.markdown-body h1 { font-size: 1.9em; margin: 1.4em 0 .6em; }
.markdown-body.markdown-body h2 {
  font-size: 1.35em; margin: 1.6em 0 .7em; padding-bottom: .3em;
  border-bottom: 2px solid var(--accent);
}
.markdown-body.markdown-body h3 { font-size: 1.12em; margin: 1.4em 0 .5em; }
.markdown-body.markdown-body h4 { font-size: 1em; margin: 1.2em 0 .4em; color: var(--fg-muted, #57606a); }

/* 中文对照行：浅灰底（由 economist.js 包裹 .zh） */
.markdown-body.markdown-body .zh {
  background: var(--zh-bg);
  border-radius: 4px;
  padding: 1px 5px;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

/* 顶部 front-matter：由 economist.js 把 YAML h2 重排成键值卡片 */
.markdown-body.markdown-body .fm {
  border-left: 3px solid var(--accent);
  background: var(--accent-soft);
  padding: 14px 18px;
  border-radius: 0 10px 10px 0;
  margin: 1em 0 1.8em;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", sans-serif;
}
.markdown-body.markdown-body .fm-row {
  display: grid;
  grid-template-columns: 132px 1fr;
  gap: 4px 14px;
  padding: 5px 0;
}
.markdown-body.markdown-body .fm-row + .fm-row {
  border-top: 1px solid color-mix(in srgb, var(--accent) 14%, transparent);
}
.markdown-body.markdown-body .fm-k {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--accent);
  padding-top: 2px;
}
.markdown-body.markdown-body .fm-v { font-size: 14px; line-height: 1.6; color: var(--fg-muted, #57606a); }

/* 段落与段间距更舒展 */
.markdown-body.markdown-body p { margin: 0 0 1.15em; }
.markdown-body.markdown-body li { margin: .35em 0; }

/* 列表：accent 圆点 + 更松 */
.markdown-body.markdown-body ul,
.markdown-body.markdown-body ol { padding-left: 1.4em; }
.markdown-body.markdown-body li::marker { color: var(--accent); }

/* 引文：左红粗线 + 衬线斜体 + 浅底；颜色随皮肤 */
.markdown-body.markdown-body blockquote {
  margin: 1.4em 0;
  padding: .6em 1.1em;
  border-left: 3px solid var(--accent);
  background: color-mix(in srgb, var(--accent) 6%, transparent);
  color: var(--fg-muted, #57606a);
  font-style: italic;
  border-radius: 0 8px 8px 0;
}
.markdown-body.markdown-body blockquote p { margin: .4em 0; }

/* 行内代码 */
.markdown-body.markdown-body code,
.markdown-body.markdown-body tt {
  background: color-mix(in srgb, var(--accent) 8%, rgba(127,127,127,.12));
  border-radius: 4px;
}

/* 代码块：保留等宽深色、圆角外框 */
.markdown-body.markdown-body pre {
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--accent) 20%, transparent);
}
.markdown-body.markdown-body pre code,
.markdown-body.markdown-body pre tt { background: transparent; }

/* 分隔线：居中短红线（底色随皮肤，避免浅色在深色主题下刺眼） */
.markdown-body.markdown-body hr {
  height: 1px;
  background: none;
  border: none;
  border-top: 1px solid color-mix(in srgb, var(--accent) 35%, var(--border, #ccc));
  margin: 2.4em auto;
  width: 60%;
}

/* ---------- 阅读进度条 ---------- */
#eco-progress {
  position: fixed; top: 0; left: 0; height: 3px; width: 0;
  background: var(--accent); z-index: 120;
  transition: width .08s linear;
}

/* ---------- 浮动目录 ---------- */
.eco-toc {
  display: none;
  position: fixed; top: 64px; right: 18px; width: 232px;
  max-height: calc(100vh - 96px);
  flex-direction: column;
  background: var(--panel-bg, #fff);
  border: 1px solid var(--border, #ccc);
  border-radius: 10px;
  box-shadow: 0 6px 24px rgba(0, 0, 0, .10);
  z-index: 60; overflow: hidden;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", sans-serif;
}
.eco-toc.open { display: flex; }
.eco-toc-h {
  font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  color: var(--accent); padding: 10px 14px; border-bottom: 1px solid var(--border, #ccc);
}
.eco-toc-list { overflow: auto; padding: 6px; }
.eco-toc-i {
  display: block; font-size: 12.5px; line-height: 1.5;
  color: var(--fg-muted, #57606a); text-decoration: none;
  padding: 4px 8px; border-radius: 6px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.eco-toc-i:hover { background: var(--hover-bg, #fafbfd); color: var(--fg, #1f2328); }
.eco-toc-i.active {
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  color: var(--accent); font-weight: 600;
}
.eco-toc-i.lv1 { padding-left: 8px; font-weight: 600; }
.eco-toc-i.lv2 { padding-left: 20px; }
.eco-toc-i.lv3 { padding-left: 32px; }
.eco-toc-i.lv4 { padding-left: 44px; }

/* 目录开关按钮（顶栏内） */
.eco-toc-btn {
  background: var(--hover-bg, #fafbfd); border: 1px solid var(--border, #ccc);
  border-radius: 999px; padding: 4px 12px; font-size: 12px; cursor: pointer;
  color: var(--fg-muted, #57606a); font-family: inherit; line-height: 1.4;
}
.eco-toc-btn:hover { color: var(--fg, #1f2328); }

/* 窄屏微调 */
@media (max-width: 700px) {
  .markdown-body.markdown-body { font-size: 17px; padding: 4px 4px 72px; }
  .markdown-body.markdown-body .fm-row { grid-template-columns: 1fr; }
  .markdown-body.markdown-body .fm-k { padding-top: 6px; }
  .eco-toc { width: 82vw; right: 9vw; }
}

/* ===== 防横向溢出（2026-10-07） =====
   症状：系统提示词里的超长代码行 / URL / token 不换行，把整页撑到上万 px，
   出现整页横向滚动条（实测某页 docScrollWidth 达 15046px）。
   策略：正文与行内代码一律允许断行；代码块改为软换行（pre-wrap），不产生横向滚动。
   用双类提升特异性，压过 md-skins 的 .markdown-body pre / p / li 默认值。 */

/* 代码块：软换行，不再横向滚动 */
.markdown-body.markdown-body pre {
  max-width: 100%;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  overflow-x: auto;   /* 兜底：极端情况也只在本块内滚动，不外溢整页 */
}
.markdown-body.markdown-body pre code,
.markdown-body.markdown-body pre tt {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

/* 行内代码：长 token / URL 允许断行 */
.markdown-body.markdown-body code,
.markdown-body.markdown-body tt { overflow-wrap: anywhere; }

/* 正文各块级元素：长串换行而不是撑宽页面 */
.markdown-body.markdown-body p,
.markdown-body.markdown-body li,
.markdown-body.markdown-body dd,
.markdown-body.markdown-body dt,
.markdown-body.markdown-body blockquote,
.markdown-body.markdown-body h1,
.markdown-body.markdown-body h2,
.markdown-body.markdown-body h3,
.markdown-body.markdown-body h4,
.markdown-body.markdown-body h5,
.markdown-body.markdown-body h6,
.markdown-body.markdown-body td,
.markdown-body.markdown-body th,
.markdown-body.markdown-body summary {
  overflow-wrap: anywhere;
  min-width: 0;
}

/* .zh 中文底是 inline 元素：行尾那 5px 水平内边距会顶出容器。
   给承载它的块级元素留出右侧余量，彻底消掉这点溢出。 */
.markdown-body.markdown-body p,
.markdown-body.markdown-body li,
.markdown-body.markdown-body dd,
.markdown-body.markdown-body dt,
.markdown-body.markdown-body h1,
.markdown-body.markdown-body h2,
.markdown-body.markdown-body h3,
.markdown-body.markdown-body h4,
.markdown-body.markdown-body h5,
.markdown-body.markdown-body h6,
.markdown-body.markdown-body summary { padding-right: 6px; }

/* 表格过宽时在自身内部滚动，不外溢 */.markdown-body.markdown-body table {
  display: block;
  width: max-content;
  max-width: 100%;
  overflow-x: auto;
}

/* 媒体不超宽 */
.markdown-body.markdown-body img,
.markdown-body.markdown-body video,
.markdown-body.markdown-body iframe,
.markdown-body.markdown-body svg { max-width: 100%; height: auto; }

/* 顶栏长文本不要撑宽页面 */
.bar { max-width: 100vw; overflow-wrap: anywhere; }
.eco-toc { max-width: calc(100vw - 24px); }

/* 兜底：即使还有漏网的超宽元素，也不出现整页横向滚动条。
   用 clip 而不是 hidden —— clip 不创建滚动容器，不会破坏 .bar 的 sticky。 */
html { overflow-x: clip; }