/* 极简样式：结构布局 + 功能性颜色，尽量用原生控件与默认字体。 */
* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", "Microsoft YaHei", sans-serif;
  font-size: 15px;
  line-height: 1.5;
  color: #1f2733;
  background: #f4f6f9;
  display: flex;
  flex-direction: column;
  overflow: hidden; /* 桌面端：左右各自滚动，body 不滚动 */
}
h2 { font-size: 15px; margin: 0 0 8px; }
h3 { font-size: 17px; margin: 0 0 12px; }
h4 { font-size: 14px; margin: 0 0 7px; color: #3a4353; }
.muted { color: #7a8493; }
.small { font-size: 12.5px; }
/* 下单金额括注：独占一行、自身不折行（避免在「+CNH」后换行） */
/* 金额括注：作为整体不折行（避免在「+CNH」后断开），但空间不足时整体换到下一行。 */
.money-tag { display: inline-block; white-space: nowrap; }
.hidden { display: none !important; }

/* 顶栏与免责 */
.topbar {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 16px; background: #1f2733; color: #fff;
}
.topbar-title { cursor: pointer; }
.topbar-title strong { font-size: 15px; }
.topbar-title .muted { color: #b6c0d0; margin-left: 8px; font-size: 12px; }
/* 操作按钮：各自按内容宽度、不换行（避免「复制分享链接」被挤成两行）；空间不足时整行换行。
   文档类（使用说明/更新日志）在左，操作类（分享/导出/登出）在右，中间用竖线分隔。 */
.topbar-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px; }
.topbar-actions button { margin-left: 0; white-space: nowrap; }
.topbar-sep { color: rgba(255, 255, 255, 0.35); padding: 0 2px; user-select: none; }
/* 登出：红底白字，与其它按钮区分 */
#btn-logout { background: #c0392b; color: #fff; border-color: #c0392b; }
#btn-logout:hover { background: #a5311f; border-color: #a5311f; }

.disclaimer { display: flex; align-items: flex-start; gap: 10px; background: #fff7e6; border-bottom: 1px solid #f0d9a8; color: #7a5a00; padding: 8px 16px; font-size: 13px; line-height: 1.55; }
.disclaimer-text { flex: 1 1 auto; min-width: 0; }
/* 折叠态：正文压成一行，超出部分省略号 */
.disclaimer.collapsed .disclaimer-text { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.disclaimer-toggle {
  flex: 0 0 auto; align-self: flex-start; white-space: nowrap; cursor: pointer;
  background: #fff; border: 1px solid #e0c98a; color: #7a5a00;
  border-radius: 4px; padding: 2px 8px; font-size: 12px;
}
.disclaimer-toggle:hover { background: #fdf3dc; }

/* 布局：侧边栏 + 内容，各自独立滚动条 */
.layout { display: flex; align-items: stretch; gap: 14px; padding: 14px; flex: 1 1 auto; min-height: 0; }
.sidebar { width: 320px; flex: 0 0 320px; overflow-y: auto; height: 100%; padding-right: 4px; }
.content { flex: 1; min-width: 0; overflow-y: auto; height: 100%; position: relative; padding-right: 8px; } /* 右侧留白，卡片不贴滚动条 */
#cards-wrap { display: flex; flex-direction: column; gap: 14px; }

/* 起始页：极简留白（无卡片外框），仅一点引导文字；完整介绍在「使用说明」叠加层。 */
.welcome { display: flex; align-items: center; justify-content: center; min-height: 100%; padding: 20px; }
.welcome-empty { max-width: 520px; text-align: center; color: #7a8493; }
.welcome-hint { font-size: 15px; line-height: 1.9; margin: 0; }
.welcome-card { max-width: 640px; background: #fff; border: 1px solid #e2e7ee; border-radius: 8px; padding: 26px 30px; }
.welcome-card h1 { font-size: 20px; margin: 0 0 12px; }
.welcome-card p { line-height: 1.7; }
.welcome-card ol { line-height: 1.9; padding-left: 20px; }
.prefill { background: #eef5ff; border: 1px solid #cfe0fb; color: #274b9f; padding: 8px 10px; border-radius: 6px; }

/* 粘性标签导航 */
.tabbar { position: sticky; top: 0; z-index: 5; display: flex; gap: 4px; overflow-x: auto; background: #f4f6f9; padding: 6px 2px; border-bottom: 1px solid #e2e7ee; }
.tabbar a { white-space: nowrap; padding: 5px 12px; border-radius: 14px; font-size: 14px; color: #5a6472; text-decoration: none; border: 1px solid transparent; }
.tabbar a:hover { background: #e9eef6; }
.tabbar a.active { background: #274b9f; color: #fff; }
/* 突出卡片对应的标签：浅蓝底 + 蓝字 + 2px 蓝边（与卡片描边同色）；选中态(.active)为实蓝填充、优先。
   边框由 1px 加到 2px 时同步减 1px 内边距，使标签外框尺寸不变、切换视角时标签条不跳动。 */
.tabbar a.tab-emphasis:not(.active) {
  background: #eef5ff; color: #274b9f; border-color: #5a82dc; border-width: 2px; padding: 4px 11px;
}
/* 悬浮需比上面的高亮规则更具体，否则被覆盖、看不出效果 */
.tabbar a.tab-emphasis:not(.active):hover { background: #dfeafd; }
.river-picker { display: flex; flex-wrap: wrap; gap: 10px; font-size: 13px; margin-bottom: 6px; }
.river-picker label { display: inline-flex; align-items: center; gap: 4px; }

/* 面板 / 卡片 */
.panel, .card {
  background: #fff; border: 1px solid #e2e7ee; border-radius: 6px; padding: 14px;
}
.card { scroll-margin-top: 46px; } /* 点击标签跳转时停在粘性标签条下方 */

/* 买家视角：只给相关卡片加一圈描边（纯呈现，不改计算）。
   2.9.0 一路做减法后，视角不再重排、不再隐藏、也不再折叠卡片——卡片的顺序与
   可见性完全不受视角影响，页面上不存在任何需要用户先点开才能看到的内容。 */
/* 突出卡片：用【内描边】而非外发光——外发光的左侧会被 #content 溢出裁掉。
   不加底色，只靠这一圈描边示意重点（避开涨跌绿红与热力图配色）。 */
.card.card-emphasis { border-color: #5a82dc; box-shadow: inset 0 0 0 4px #5a82dc; }
.panel { margin-bottom: 12px; }
/* 侧边栏最后一个卡片去掉底部外边距，避免左侧滚到底时比右侧多出一段空隙 */
.sidebar .panel:last-child { margin-bottom: 0; }
.card-head { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; }

/* 表单 */
.field { margin-bottom: 10px; }
.field label { display: block; font-size: 13px; color: #5a6472; margin-bottom: 3px; }
.field.two { display: flex; gap: 8px; }
.field.two > div { flex: 1 1 0; min-width: 0; } /* min-width:0 允许日期框收缩，不撑破侧栏 */
.field.checkbox label { display: flex; align-items: center; gap: 6px; color: #1f2733; }
input, select, button { font: inherit; }
input[type=text], input[type=number], input[type=date], input:not([type]), select {
  width: 100%; min-width: 0; padding: 4px 6px; border: 1px solid #c2cad6; border-radius: 4px; background: #fff;
}
input:disabled, select:disabled { background: #eef1f5; color: #a7b0bd; }
button { padding: 4px 10px; border: 1px solid #c2cad6; border-radius: 4px; background: #f7f9fc; cursor: pointer; }
button:hover { background: #eef2f8; }
button.primary { background: #274b9f; color: #fff; border-color: #274b9f; }
button.primary:hover { background: #1f3d84; }
/* 成功态：绿底白字（复制成功 / 数据已最新） */
button.ok { background: #2f9e5b; color: #fff; border-color: #2f9e5b; }
button.ok:hover { background: #2a8a50; border-color: #2a8a50; }
.btn-row { display: flex; flex-wrap: wrap; gap: 6px; }
.symbol-add { display: flex; gap: 6px; }
.symbol-add input { flex: 1; }

/* 标的 chips */
/* 标的块：一行一个（而非横向排布的小标签）。顺序 = 接股意愿顺序，可拖拽排序，
   纵向列表比横向流式布局更贴合「排序」这个动作，也给名称留出了空间。 */
.chips { display: flex; flex-direction: column; gap: 4px; margin-top: 6px; }
.chip {
  display: flex; align-items: center; gap: 6px;
  background: #eef2f8; border: 1px solid #d3dbe6; border-radius: 4px;
  padding: 4px 8px; font-size: 12px;
}
.chip .chip-code { font-weight: 600; color: #2b3442; }
/* 名称占据剩余宽度并在过长时省略，使右侧的市场标与删除按钮始终对齐 */
.chip .chip-name { flex: 1 1 auto; min-width: 0; color: #5a6472; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chip .mkt { margin-left: auto; color: #7a8493; font-size: 10px; }
.chip .chip-name + .mkt { margin-left: 0; }
.chip .x { cursor: pointer; color: #a04; font-weight: bold; padding: 0 2px; }

.chip[draggable="true"] { cursor: grab; }
.chip .chip-rank {
  flex: 0 0 auto;
  display: inline-flex; align-items: center; justify-content: center;
  width: 16px; height: 16px; border-radius: 50%;
  background: #274b9f; color: #fff; font-size: 10px; font-weight: 600;
}
.chip .chip-grip { flex: 0 0 auto; color: #a8b2c1; font-size: 9px; letter-spacing: -1px; cursor: grab; }
.chip.chip-dragging { opacity: 0.4; cursor: grabbing; }
/* 纵向列表里用上边框示意「会插到这一行之前」 */
.chip.chip-over { border-color: #274b9f; box-shadow: inset 0 3px 0 0 #274b9f; }

.err { color: #c0392b; font-size: 12px; margin-top: 4px; white-space: pre-wrap; }
.dirty { background: #fff2f0; border: 1px solid #ffccc7; color: #a8321f; padding: 6px 8px; border-radius: 4px; font-size: 12px; margin-top: 8px; }
/* 加载/报错横幅：置顶于输出区（#content 是滚动容器），随内容滚动时保持在顶部。
   z-index 高于 .tabbar(5) 以免被标签栏盖住；仅置顶输出区，不与顶部「重要声明」对齐。 */
.banner-error, .banner-info { position: sticky; top: 0; z-index: 6; padding: 8px 10px; border-radius: 6px; box-shadow: 0 2px 6px rgba(0,0,0,0.06); }
.banner-error { background: #fff2f0; border: 1px solid #ffccc7; color: #a8321f; }
.banner-info { background: #eef5ff; border: 1px solid #cfe0fb; color: #274b9f; }

/* 图表 */
/* touch-action:pan-y —— 竖向滑动仍交给浏览器滚动页面；横向拖拽/双指捏合由图表自行处理（见 chart/core.js）。 */
canvas.chart { width: 100%; display: block; background: #fff; touch-action: pan-y; }
/* 打印用河流图容器：屏幕上移到视口外（但保留布局宽度，画布才能正确测量并绘制出位图）；
   打印时归位显示。画布用普通 .chart，打印时与其它图表一样按 max-width:100% 等比缩放。 */
#river-print { position: absolute; left: -10000px; top: 0; width: 720px; }
.river-print-title { margin: 6px 0 2px; font-weight: 600; }
canvas.tall { height: 340px; }
canvas.mid { height: 200px; }
canvas.heat { height: 200px; }
.legend { display: flex; flex-wrap: wrap; gap: 12px; font-size: 13px; margin-top: 6px; color: #5a6472; align-items: center; }
.legend .sw { display: inline-block; width: 12px; height: 3px; vertical-align: middle; margin-right: 4px; }
.legend .leg-item { cursor: pointer; user-select: none; }
.legend .leg-item.off { opacity: 0.4; text-decoration: line-through; }
.legend .legend-hint { cursor: default; }
/* 散点图图例：色块用圆点（与图上的点同形），且不可点击——走势图的图例可点开关，这里不能，
   所以不继承那份 pointer 光标，免得看着像能点。 */
.legend .leg-item.static { cursor: default; }
.legend .sw-dot { width: 8px; height: 8px; border-radius: 50%; }

/* 决策卡 */
.decision-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.metric { border: 1px solid #e2e7ee; border-radius: 6px; padding: 10px; }
.metric .v { font-size: 22px; font-weight: 600; }
.metric .k { font-size: 13px; color: #7a8493; margin-bottom: 4px; }
.metric .ci { font-size: 12px; color: #98a2b0; }

/* ── 核心指标卡：三行（收益 / 风险 / 接股后最坏情景）× 三格 ────────────────
   通俗名当标题（大一号、深色），数值最醒目，术语与口径退到灰小字。
   与下方详情卡的区别只在呈现：数值同源、完全一致。 */
.core-row + .core-row { margin-top: 14px; padding-top: 12px; border-top: 1px solid #eef1f5; }
.core-row-head { display: flex; align-items: baseline; gap: 8px; margin-bottom: 8px; }
.core-row-title {
  font-size: 14px; color: #274b9f; font-weight: 600;
  padding: 1px 9px; border-radius: 11px; background: #eef5ff;
}
/* 核心卡的格子比通用 metric 大一号，且给三行留出统一的最小高度以便对齐 */
.core-metric { padding: 11px 12px; }
.core-metric .k { font-size: 14px; color: #40495a; font-weight: 600; margin-bottom: 6px; }
.core-metric .v { font-size: 26px; line-height: 1.15; margin-bottom: 5px; }
.core-metric .ci { line-height: 1.55; }
/* 买家视角高亮的指标格：直接沿用卡片级突出的那圈实心内描边（同色、同做法），
   而不是先前的淡蓝内阴影——小格子上淡色几乎看不出来，等于没高亮。
   内边距同步减去描边宽度，使高亮时格子外框尺寸不变、切视角时网格不跳动。 */
.core-metric.metric-emphasis {
  border-color: #5a82dc;
  box-shadow: inset 0 0 0 3px #5a82dc;
  padding: 8px 9px;
}

/* ── 用户旅程三阶段的分组标题（详情卡的导航轴）────────────────────────────
   核心卡不属于任何阶段：它是结论摘要，先给结论、再按旅程展开。 */
.stage-head {
  display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
  margin: 20px 0 8px; padding-bottom: 6px; border-bottom: 2px solid #e2e7ee;
}
.stage-no { font-size: 12px; color: #fff; background: #274b9f; border-radius: 10px; padding: 2px 9px; }
.stage-title { font-size: 16px; font-weight: 600; color: #2b3442; }
/* 标签条里的阶段分隔标记 */
.tab-group {
  align-self: center; white-space: nowrap; padding: 0 6px 0 8px;
  font-size: 12px; color: #98a2b0; border-left: 1px solid #dde3ec;
}
.tabbar .tab-group:first-child { border-left: none; }

/* 表格 */
table { border-collapse: collapse; width: 100%; font-size: 14px; }
th, td { border: 1px solid #e6eaf0; padding: 5px 9px; text-align: right; }
th:first-child, td:first-child { text-align: left; }
thead th { background: #f4f6f9; }
tr.current td { background: #fff8e6; }

/* 宽表容器：内容过宽时在自身内部横向滚动，避免撑破卡片 / 整页（尤其窄屏手机）。
   overflow-x:auto 仅在需要时出现滚动条，桌面端无影响。
   覆盖结果区所有承载表格的容器（移动端多列数字表极易溢出）。 */
#fundamentals-table, #valuation-table, #current-table, #sensitivity-table,
#regime-table, #hold-compare, #outcome-table, #today-issue,
#opportunity, #floatdd-table, #worst-table, #scenario-result, #net-summary,
#dd-summary, #dd-events, #dd-breaches { overflow-x: auto; }
/* 每个表格单独的横向滚动容器（由 main.js wrapTables 注入）：只让表格横滚，
   表下方的说明文字是它的兄弟节点、留在滚动区之外，不会被卷走隐藏。 */
.table-wrap { overflow-x: auto; }

/* 布局辅助 */
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
/* 网格项默认 min-width:auto 会被内部 nowrap 宽表撑破（不肯收缩），
   置 0 后才能让子容器的 overflow-x:auto 生效、仅表格自身横向滚动。 */
.two-col > * { min-width: 0; }
/* 估值画像：相关性矩阵占固定窄列，其余让给估值河流图 */
#card-valuation .two-col { grid-template-columns: 280px 1fr; }
/* 单标的（无相关性矩阵）：塌缩为单栏，河流图占满整幅宽度 */
#card-valuation .two-col.single-col { grid-template-columns: 1fr; }
/* 卡内分块：上下都留白。table 与 .two-col 都不带外边距，若分块只有 margin-bottom，
   紧跟在表格或两栏网格之后的分块（如净收益分布、机会成本、被交割标的的分布）会贴死在上一块下沿。
   相邻分块之间的上下外边距会合并，故仍是 12px、不会翻倍。 */
.detail-block { margin: 12px 0; }
/* 两栏网格内的分块间距由 gap 负责，不再叠加外边距 */
.two-col > .detail-block { margin: 0; }
/* 卡内分节标题（派息 / 存续期股息 / 财报等小节的领头） */
.section-h { margin: 16px 0 6px; padding-top: 10px; border-top: 1px solid #eef1f5; font-size: 14px; }
/* 未来 / 推算的行（除净日、财报日）：淡黄底以区分于已发生 */
tr.div-future > td { background: #fff8e6; }
.trend-controls, .dd-controls { display: flex; align-items: center; gap: 6px; font-size: 13px; }
/* 回撤子区间控件：日期框用自然宽度（不吃 input 的 width:100%），按钮文字不竖排；
   空间不足时整体换行（移动端「应用」「全区间」自动落到下一行）。 */
.dd-controls { flex-wrap: wrap; }
.dd-controls input[type=date] { width: auto; min-width: 128px; }
.dd-controls button { white-space: nowrap; }
.ma-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13px; color: #5a6472; margin-bottom: 6px; }
.ma-bar label { display: inline-flex; align-items: center; gap: 3px; }
.trend-controls input[type=range] { width: 160px; }
.focus-outcome { font-size: 13.5px; margin-bottom: 6px; }
/* 结论句紧跟在表格 / 控件之后时补上间距；作为卡内首个元素时（如存续详情的状态行）保持贴顶 */
* + .focus-outcome { margin-top: 10px; }
.scenario-slider input[type=range] { width: 100%; }

/* 页脚：始终显示的窄条 */
.app-footer {
  flex: 0 0 auto;
  display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 6px;
  padding: 6px 16px; border-top: 1px solid #e2e7ee; background: #fff;
  font-size: 12px; color: #7a8493;
}
.app-footer a { color: #5a6472; }

/* 语义色：保本=绿(最佳) 敲出=黄 已回本=橙 被行权=红 */
.c-par { color: #2f9e5b; } .c-ko { color: #b58900; } .c-rec { color: #2f6fb0; } .c-ex { color: #c0392b; }
.profit { color: #2f9e5b; } .loss { color: #c0392b; }
.badge { display: inline-block; padding: 1px 6px; border-radius: 3px; font-size: 12px; color: #fff; }
.badge.par { background: #2f9e5b; } .badge.ko { background: #d99a00; color: #fff; }
.badge.recovered { background: #2f6fb0; } .badge.exercised { background: #c0392b; }
.note { font-size: 12.5px; color: #7a8493; margin-top: 5px; line-height: 1.55; }
.uncertain { color: #b8860b; font-size: 12px; }

/* 访问校验占位屏（主页未通过校验前显示；未登录会跳转到 login.html） */
#gate-splash {
  position: fixed; inset: 0; z-index: 2000; display: none;
  align-items: center; justify-content: center;
  background: linear-gradient(160deg, #1f2733, #0f1620); color: #cdd6e4; font-size: 15px;
}
html.gate-checking #gate-splash { display: flex; }
/* 校验中隐藏应用主体，避免"删元素即见" */
html.gate-checking .topbar,
html.gate-checking .disclaimer,
html.gate-checking .layout,
html.gate-checking .app-footer { display: none !important; }

/* 独立登录页 */
/* 渐变固定铺满视口 + 深色兜底：避免移动端滚动/回弹时露出浅蓝底色。 */
body.login-page { overflow: auto; background: #0f1620 linear-gradient(160deg, #1f2733, #0f1620) no-repeat fixed; }
/* dvh 随地址栏收放动态计算，消除「内容其实放得下却仍能滚一点」的现象。 */
.login-wrap { min-height: 100vh; min-height: 100dvh; display: flex; align-items: center; justify-content: center; padding: 20px; }
.login-box {
  width: min(92vw, 380px); background: #fff; border-radius: 12px;
  padding: 30px 30px 26px; text-align: center; box-shadow: 0 20px 60px rgba(0,0,0,0.45);
}
.login-lock { font-size: 34px; margin-bottom: 6px; }
.login-box h1 { font-size: 24px; margin: 0 0 6px; }
.login-sub1 { font-size: 18px; }
.login-sub2 { color: #7a8493; font-size: 13px; line-height: 1.6; margin: 0 0 12px; }
.login-warn { color: #b4462a; font-size: 13px; line-height: 1.6; margin: 0 0 18px; }
.login-field { display: block; text-align: left; margin-bottom: 12px; }
.login-field span { display: block; font-size: 13px; color: #5a6472; margin-bottom: 4px; }
.login-field input { width: 100%; padding: 10px 12px; font-size: 14px; }
.login-box button { width: 100%; padding: 11px; font-size: 16px; margin-top: 4px; background: #274b9f; color: #fff; border-color: #274b9f; letter-spacing: 2px; }
.login-box button:hover { background: #1f3d84; }
.login-box button:disabled { background: #9aa8c8; border-color: #9aa8c8; cursor: default; }
.login-hint { margin-top: 14px; font-size: 13px; color: #7a8493; }
.login-error { margin-top: 8px; font-size: 13px; color: #c0392b; min-height: 18px; }
.login-author { margin-top: 16px; font-size: 13px; color: #7a8493; }
.login-author a { color: #5a6472; }

/* ── 文档中心叠加层 ────────────────────────────────────────────────────────── */
.doc-overlay { position: fixed; inset: 0; z-index: 3000; display: flex; align-items: center; justify-content: center; }
.doc-overlay.hidden { display: none; }
/* 半透明 + 轻微模糊：让用户明显感到这是叠加层、其下还有页面内容。 */
.doc-backdrop { position: absolute; inset: 0; background: rgba(15, 22, 32, 0.5); backdrop-filter: blur(1.5px); }
/* 固定尺寸：上下左右各留约 5% 空白（90vw × 90vh），大小不随内容多少变化；正文在内部滚动。 */
.doc-panel { position: relative; z-index: 1; width: 90vw; height: 90vh; display: flex; flex-direction: column;
  background: #fff; border-radius: 10px; box-shadow: 0 24px 70px rgba(0, 0, 0, 0.4); overflow: hidden; }
.doc-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 12px; border-bottom: 1px solid #e2e7ee; background: #f7f9fc; flex: 0 0 auto; }
/* 主体：左侧目录(TOC) + 右侧正文，各自滚动 */
.doc-main { flex: 1 1 auto; display: flex; min-height: 0; }
/* 左栏 = 顶部整宽折叠按钮 + 目录列表 */
.doc-toc-wrap { flex: 0 0 220px; width: 220px; display: flex; flex-direction: column; min-height: 0;
  border-right: 1px solid #e2e7ee; background: #fafbfc; }
.doc-toc { flex: 1 1 auto; overflow-y: auto; padding: 12px 8px; min-height: 0; }
.doc-toc.empty { display: none; }
/* 展开态：整宽方角按钮，与左栏齐平、无圆角无缝隙 */
.doc-toc-toggle { display: block; width: 100%; box-sizing: border-box; padding: 9px 12px; text-align: left;
  cursor: pointer; border: 0; border-bottom: 1px solid #e2e7ee; border-radius: 0;
  background: #eef2f8; color: #274b9f; font-size: 13px; font-weight: 600; }
.doc-toc-toggle:hover { background: #e3ebf7; }
/* 折叠：左栏收窄为一条竖栏，按钮留在【左上角】、仍在布局流中 → 不覆盖正文。 */
.doc-main.toc-collapsed .doc-toc-wrap { flex-basis: auto; width: auto; }
.doc-main.toc-collapsed .doc-toc { display: none; }
.doc-main.toc-collapsed .doc-toc-toggle { width: auto; white-space: nowrap; }
.doc-toc a { display: block; padding: 4px 10px; border-radius: 4px; color: #5a6472; text-decoration: none; font-size: 13px; line-height: 1.45; cursor: pointer; }
.doc-toc a:hover { background: #eef2f8; }
.doc-toc a.active { background: #274b9f; color: #fff; }
/* TOC 按标题级别缩进：一级（项目标题）齐头加粗，二级缩进，三级再缩进 */
.doc-toc a.toc-l1 { padding-left: 10px; font-weight: 600; color: #3a4353; }
.doc-toc a.toc-l2 { padding-left: 24px; }
.doc-toc a.toc-l3 { padding-left: 40px; font-size: 12.5px; color: #7a8493; }
.doc-toc a.toc-l1.active, .doc-toc a.toc-l3.active { color: #fff; }
/* 无 H1 的页（除「介绍」外）：h2/h3 在 TOC 各减一层缩进（仅改缩进，保留各自字重/字色） */
.doc-toc.no-h1 a.toc-l2 { padding-left: 10px; }
.doc-toc.no-h1 a.toc-l3 { padding-left: 24px; }
/* 标签页可横向滚动：标签很多（10+）或窗口很窄时不换行、不溢出，超出部分横向滚动。 */
.doc-tabs { display: flex; gap: 6px; flex: 1 1 auto; min-width: 0; overflow-x: auto; scrollbar-width: thin; }
.doc-tab { flex: 0 0 auto; white-space: nowrap; padding: 5px 12px; border: 1px solid transparent; border-radius: 14px; background: transparent; font-size: 14px; color: #5a6472; cursor: pointer; }
.doc-tab:hover { background: #e9eef6; }
.doc-tab.active { background: #274b9f; color: #fff; }
.doc-head-right { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.doc-optout { display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; color: #5a6472; white-space: nowrap; cursor: pointer; }
.doc-close { border: none; background: transparent; font-size: 18px; line-height: 1; color: #7a8493; cursor: pointer; padding: 4px 8px; }
.doc-close:hover { color: #1f2733; }
.doc-body { padding: 18px 22px; overflow-y: auto; line-height: 1.7; flex: 1 1 auto; min-width: 0; }
.doc-body h1 { font-size: 20px; margin: 0 0 12px; }
/* 各 ## 小节之间用细线分隔（更新日志各版本之间同样适用）。 */
.doc-body h2 { font-size: 18px; margin: 18px 0 8px; border-top: 1px solid #eef1f5; padding-top: 14px; }
.doc-body h2:first-child { margin-top: 0; border-top: none; padding-top: 0; }
.doc-body h3 { font-size: 15px; margin: 12px 0 6px; color: #3a4353; }
.doc-body p { margin: 8px 0; }
.doc-body ul, .doc-body ol { padding-left: 22px; margin: 8px 0; }
.doc-body li { margin: 4px 0; }
/* 「---」分节线：留白明显强于 h2（h2 上方约 32px），作为强分节 */
.doc-body hr { border: none; border-top: 2px solid #d0d7e2; margin: 44px 0; }
/* 跳转（TOC 点击 / 「?」引导）后，对目标小节做一次蓝色高亮闪烁 */
@keyframes docFlash {
  0%   { background: rgba(59, 130, 246, 0.18); }
  20%  { background: rgba(59, 130, 246, 0.18); }
  40%  { background: transparent; }
  60%  { background: rgba(59, 130, 246, 0.18); }
  100% { background: transparent; }
}
.doc-body .doc-flash { animation: docFlash 1.5s ease-in-out; border-radius: 4px; }
.doc-body code { background: #eef1f5; padding: 0 4px; border-radius: 3px; font-size: 0.92em; }
/* 文档内表格（GFM 管道表格）：与正文一致的轻量样式 */
.doc-body table { border-collapse: collapse; margin: 10px 0; font-size: 13px; width: auto; max-width: 100%; }
.doc-body th, .doc-body td { border: 1px solid #e3e8ef; padding: 5px 10px; text-align: left; vertical-align: top; }
.doc-body thead th { background: #f4f6f9; font-weight: 600; color: #3a4353; }
body.doc-open { overflow: hidden; } /* 打开文档时锁定背景滚动 */

/* 「?」引导角标：卡片小节标题/关键数值旁，点击打开「数值详解」并跳到对应小节。 */
.doc-hint {
  display: inline-flex; align-items: center; justify-content: center;
  width: 15px; height: 15px; margin-left: 5px; border-radius: 50%;
  background: #e3e8ef; color: #5a6473; font-size: 11px; line-height: 1; font-weight: 700;
  cursor: pointer; text-decoration: none; vertical-align: middle; user-select: none;
  transition: background .12s, color .12s;
}
.doc-hint:hover { background: #274b9f; color: #fff; }
@media print { .doc-hint { display: none !important; } }

/* 响应式：按页面比例判断（竖高型/窄屏 → 上下堆叠、整页滚动），非 UA 判断 */
@media (max-aspect-ratio: 1/1), (max-width: 820px) {
  body { overflow: auto; }
  /* 顶栏改为上下：标题在上，操作按钮整行落到标题下方（不再左右挤在一行）。
     按钮各按内容宽度并靠左排列，多了自动换行；不再等宽以免文字被挤成两行。 */
  .topbar { flex-direction: column; align-items: stretch; gap: 8px; }
  .topbar-actions { justify-content: flex-start; }
  .layout { flex-direction: column; align-items: stretch; min-height: 0; flex: none; }
  .sidebar { width: 100%; flex: none; height: auto; overflow: visible; }
  .content { height: auto; overflow: visible; }
  .two-col, #card-valuation .two-col { grid-template-columns: 1fr; }
  .welcome { min-height: auto; }
  canvas.tall { height: 260px; }
  .trend-controls input[type=range] { width: 110px; }
  /* 移动端：表格单元格不换行，保持每列自然宽度；超宽时由所在容器(见上方 overflow-x 清单)
     横向滚动，而非压缩列宽把文字挤成竖排。只有表格滚动，卡片本身不横滚。 */
  .content th, .content td { white-space: nowrap; }
  /* 移动端：面板近全屏；目录收窄给正文留空间。 */
  .doc-overlay { padding: 8px; }
  .doc-panel { width: 100%; height: 100%; }
  .doc-optout { font-size: 12px; }
  .doc-toc-wrap { flex-basis: 132px; width: 132px; }
  .doc-toc { padding: 10px 6px; }
  .doc-toc a { font-size: 12.5px; padding: 4px 8px; }
  .doc-body { padding: 14px 14px; }
}

/* 打印 / 导出 PDF：隐藏输入区，纵向展开。顶部合规声明(.disclaimer)照常打印，作为报告的正式声明。 */
/* 默认打印参数：A3、纵向、无边距（其余「全部页面 / 彩色 / 默认缩放」为对话框默认值，无法由脚本设定）。 */
@page { size: A3 portrait; margin: 0; }
@media print {
  /* 打印背景图形（色块/徽章/热力图/声明底色），对应对话框「背景图形」勾选。 */
  html, body { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  body { overflow: visible; }
  #gate-splash, .doc-overlay { display: none !important; }
  .topbar-actions, .sidebar, .dirty, #loading { display: none !important; }
  .layout { display: block; padding: 0; }
  .content { gap: 10px; padding-right: 0; overflow: visible; height: auto; }
  .disclaimer { border: 1px solid #e0c98a; break-inside: avoid; }
  /* 打印时始终完整展开声明，不受屏幕折叠态影响 */
  .disclaimer.collapsed .disclaimer-text { white-space: normal !important; overflow: visible !important; }
  .disclaimer-toggle { display: none !important; }
  .card { border: 1px solid #ccc; break-inside: avoid; }
  /* 导出 PDF 时忽略买家视角的突出，全部卡片一视同仁——留档的文档不该因为屏幕上
     选了某个视角而看起来有轻重之分。 */
  .card.card-emphasis { box-shadow: none !important; border-color: #ccc !important; }
  /* 打印时撤销格子高亮：内边距也要跟着还原，否则被高亮的格子会比其它格子小一圈 */
  .core-metric.metric-emphasis { box-shadow: none !important; border-color: #ccc !important; padding: 11px 12px !important; }
  /* 阶段分组标题跟随其后的卡片，不落单在页尾 */
  .stage-head { break-after: avoid; break-inside: avoid; }
  .two-col { grid-template-columns: 1fr 1fr; }
  /* 估值卡保持「相关性矩阵（窄）| 河流图（宽）」一左一右，不因纵向页面被压成上下堆叠——
     否则相关性矩阵占满整宽会过大且模糊。 */
  #card-valuation .two-col { grid-template-columns: 280px 1fr !important; }
  /* 图表按【自身像素比例】等比缩放，避免被强行拉伸变形（与屏幕观感一致）。
     canvas 的固有尺寸即其位图宽高，width/height:auto + max-width:100% 可保持长宽比。 */
  canvas.chart { width: auto !important; height: auto !important; max-width: 100% !important; }
  /* 宽表在纸上改为换行自适应，不再出现横向滚动条 / 被裁切（今日发行速算、基本面速览等）。 */
  .table-wrap { overflow: visible !important; }
  .content th, .content td { white-space: normal !important; }
  /* 河流图：屏幕上仅显示所选标的，打印时改为逐一显示全部标的。 */
  #river-picker, #river-canvas, #river-note { display: none !important; }
  #river-print { position: static !important; left: auto !important; width: auto !important; }
  .river-print-item { break-inside: avoid; margin-bottom: 10px; }
}
