/* Hotspot Work 移动阅读端样式（2026-09-19 UI 打磨）。
   色板对齐桌面端 Apple 深色体系：卡片 #1c1c1e / 浮层 #2c2c2e / 蓝 #0091ff。
   设计原则：信息层级清晰（标题/概要/元信息三级）、**所有触控目标 ≥44px**、
   骨架屏代替干等、深色对比度全部 ≥ WCAG AA 4.5:1。

   2026-09-19 修正（均为真实 Chrome 390×844 实测，不是目测）：
   - 触控目标：此前 31 个可点元素里 29 个不足 44px（chip 38.4 / segment 38 /
     news-action 34 / 退出 36 / 返回 40）→ 全部提到 44px。
   - 对比度：`--label-3` 透明度 0.36 在卡片上实测仅 3.01:1、低于 AA →
     提到 0.52（实测 ≈4.8:1）；次要文字不再用"更淡"来分层。
   - 空占位：`p.state-note` 加载完成后被置空但保留 32px padding，形成 64px
     空白条 → `:empty` 直接不渲染。 */

:root {
  --page-bg: #0e0e10;
  --card-bg: #1a1a1c;
  --card-bg-hover: #222224;
  --card-bg-2: #2c2c2e;
  --separator: rgba(235, 235, 245, 0.10);
  --label-1: #f5f5f7;
  --label-2: rgba(235, 235, 245, 0.62);
  /* 0.36 在卡片底上实测 3.01:1，未达 AA；0.52 → 4.87:1，但 .news-action.muted /
     .heat-low 这几处压在更亮的浮层底（#2c2c2e / rgba(118,118,128,.2)）
     上仍只有 4.33–4.46:1。0.58 让最差一处也过 4.5:1（浮层 5.04 / 卡片 5.69）。 */
  --label-3: rgba(235, 235, 245, 0.58);
  /* --tint 是**文字/图标**用蓝：在卡片上 4.76:1 ✓。
     --tint-fill 是**填充底**用蓝：纯白字压 #0a84ff 只有 3.65:1（14px chip 与 17px
     按钮都不算 WCAG 大号文字，需 4.5:1），压 #0a6fd8 为 4.91:1 ✓。
     注意桌面端用的 #0091ff 白字只有 3.23:1，比原来更差，不能照抄。 */
  --tint: #0a84ff;
  --tint-fill: #0a6fd8;
  /* 小号 tint 文字压在 --tint-soft 底（rgb(24,42,62)）上的专用色：5.56:1 ✓。
     直接用 --tint 只有 4.00:1。 */
  --tint-on-soft: #4da3ff;
  --tint-soft: rgba(10, 132, 255, 0.15);
  --danger: #ff453a;
  --warn: #ffd60a;
  --radius: 16px;
  /* 触控目标下限：iOS HIG / Material 均为 44pt，集中一处便于审查。 */
  --tap: 44px;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }

/* 全局焦点可见（2026-09-19）：原先只有登录输入框有焦点样式，键盘用户与
   iOS 全键盘控制看不到焦点落在哪个 chip / tab / 按钮上。 */
:focus-visible { outline: 2px solid var(--tint); outline-offset: 2px; }

/* 触摸反馈补偿（2026-09-19）：下面这行关掉了系统 tap 高亮，但多数控件没有
   自己的 :active，点下去屏幕零反馈，慢网时会被当成"没点上"而重复点击。
   这里统一补一个轻量反馈，各控件不再逐个依赖。 */
button:active, .chip:active, .tab:active, .news-action:active,
.report-download:active, .detail-link:active, .back-link:active { opacity: 0.7; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--page-bg);
  color: var(--label-1);
  font: 16px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
        "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  /* 去掉 -webkit-font-smoothing: antialiased：它关闭次像素渲染，在"浅字压深底"
     （本 app 的全部场景）下会让笔画变细发虚，12–13px 中文尤其明显。 */
}

/* 长英文标识符 / 裸 URL 不会在无空格处断行，会把卡片顶破或造成横向溢出。
   中文可在任意字符换行，所以这条只对拉丁串生效。 */
.news-title, .news-brief, .report-title, .detail-title, .detail-brief { overflow-wrap: anywhere; }

/* 尊重用户的减少动态偏好（2026-09-19）：骨架屏在每次首屏/切分类/切报告版本
   都会无限脉冲，对前庭敏感用户是不适来源。 */
@media (prefers-reduced-motion: reduce) {
  .skeleton { animation: none; }
  * { transition-duration: 0.01ms !important; }
}

body { min-height: 100dvh; overscroll-behavior-y: none; }

a { color: var(--tint); text-decoration: none; }
button { font: inherit; color: inherit; cursor: pointer; }

.hidden { display: none !important; }

/* ---------- 骨架屏（加载态） ---------- */

@keyframes skeleton-pulse { 0%, 100% { opacity: 0.45; } 50% { opacity: 0.9; } }
.skeleton {
  background: linear-gradient(100deg, var(--card-bg) 40%, var(--card-bg-2) 50%, var(--card-bg) 60%);
  background-size: 200% 100%;
  animation: skeleton-pulse 1.4s ease infinite;
  border-radius: 10px;
}
.skeleton-line { height: 14px; margin: 8px 2px; }
.skeleton-line.w60 { width: 60%; }
.skeleton-line.w35 { width: 35%; }
.skeleton-card { border-radius: var(--radius); padding: 16px; margin-bottom: 10px; }
/* 报告正文加载占位（report.js 一直在用 .skeleton-block，此前未定义 → 0 高度）。 */
.skeleton-block { height: 120px; border-radius: var(--radius); margin-bottom: 12px; }

/* ---------- 视图容器与底部 Tab ---------- */

/* 顶栏移除后（M02）顶部安全区没有别人处理了：黑透状态栏（black-translucent）
   下内容会顶到刘海/灵动岛下面。这里补上 --safe-top，与原先 .app-header 的
   padding-top 同一来源。 */
.view-root { padding: calc(var(--safe-top) + 24px) 16px calc(84px + var(--safe-bottom)); max-width: 720px; margin: 0 auto; }

.app-tabbar {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 10;
  display: flex;
  background: rgba(14, 14, 16, 0.92);
  backdrop-filter: blur(18px) saturate(1.4);
  -webkit-backdrop-filter: blur(18px) saturate(1.4);
  border-top: 1px solid var(--separator);
  padding-bottom: var(--safe-bottom);
}

.app-tabbar .tab {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 8px 0 6px;
  min-height: var(--tap);
  color: var(--label-3);
  font-size: 11px;
  transition: color 0.15s;
}
.app-tabbar .tab.on { color: var(--tint); }
.app-tabbar .tab-icon { display: flex; align-items: center; justify-content: center; height: 24px; }
.app-tabbar .tab-icon svg { display: block; }
.app-tabbar .tab-label { font-weight: 500; }

/* ---------- 业务切换（2026-09-29 设计定稿）：底栏右缘档位 ----------
   与两个 tab 同构：线性「带环星球」图标 + 当前业务名小字；左侧发丝线与
   tab 分隔。业务是整页口径（概览/七日焦点/列表跟随），入口常驻跟屏。
   data-tab 仍只有 news/reports：本档位是动作位，不是第三个页面 tab。 */
.app-tabbar .tab-edge {
  display: flex;
  align-items: center;
  padding: 4px 6px 4px 12px;
  border-left: 1px solid rgba(242, 212, 164, 0.12);
}
.biz-slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  min-width: 62px;
  min-height: var(--tap);
  padding: 7px 4px 6px;
  border: 0;
  background: none;
  color: var(--label-2);
  font-size: 11px;
  cursor: pointer;
}
.biz-slot svg { display: block; }
.biz-slot-name {
  max-width: 60px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 500;
}

/* ---------- 业务底部面板 ----------
   从底部滑入（220ms），顶部一道金色发丝与仪表卡同一语言；行内右对齐
   各业务近 7 天真实信号数，细环单选标记当前业务。 */
.sheet-backdrop {
  position: fixed;
  inset: 0;
  z-index: 30;
  background: rgba(0, 0, 0, 0.6);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease, visibility 0.2s;
}
.sheet-backdrop.open { opacity: 1; visibility: visible; }
.biz-sheet {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 31;
  max-width: 720px;
  margin: 0 auto;
  background: #131417;
  border: 1px solid rgba(56, 62, 74, 0.5);
  border-bottom: 0;
  border-radius: 18px 18px 0 0;
  padding: 8px 18px calc(14px + var(--safe-bottom));
  opacity: 0;
  visibility: hidden;
  transform: translateY(28px);
  transition: transform 0.22s ease, opacity 0.22s ease, visibility 0.22s;
  overflow: hidden;
}
.biz-sheet::before {
  content: '';
  position: absolute; inset: 0 0 auto 0;
  height: 1px;
  background: linear-gradient(90deg,
    transparent 0%, rgba(224, 168, 111, 0.30) 22%, rgba(242, 212, 164, 0.45) 50%,
    rgba(224, 168, 111, 0.30) 78%, transparent 100%);
}
.biz-sheet.open { opacity: 1; visibility: visible; transform: none; }
.sheet-handle {
  width: 36px; height: 4px;
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.16);
  margin: 4px auto 10px;
}
.biz-sheet .sheet-title {
  margin: 0 2px 4px;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #fff;
}
.biz-list { list-style: none; margin: 0; padding: 0; }
.biz-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 16px;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 58px;
  padding: 0 2px;
  border: 0;
  border-bottom: 1px solid rgba(242, 212, 164, 0.08);
  background: none;
  color: var(--label-2);
  font-size: 15px;
  text-align: left;
  cursor: pointer;
}
.biz-list li:last-child .biz-row { border-bottom: 0; }
.biz-row-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.biz-row[aria-current="true"] .biz-row-name { color: var(--tint); font-weight: 600; }
.biz-row-meta { text-align: right; }
.biz-row-count {
  display: block;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  color: var(--label-2);
  font-variant-numeric: tabular-nums;
}
.biz-row[aria-current="true"] .biz-row-count { color: var(--tint); }
.biz-row-caption {
  display: block;
  margin-top: 1px;
  font-size: 10.5px;
  color: var(--label-3);
}
.biz-row-radio {
  width: 16px; height: 16px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.28);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.biz-row-radio.on { border-color: rgba(242, 212, 164, 0.75); }
.biz-row-radio.on::after {
  content: '';
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--gold, #f2d4a4);
  box-shadow: 0 0 6px 1px rgba(242, 212, 164, 0.4);
}
@media (prefers-reduced-motion: reduce) {
  .sheet-backdrop, .biz-sheet { transition: none; }
  .biz-sheet { transform: none; }
}

/* 底部导航（PIL-99）：只保留资讯/报告两个等宽栏目，均分整行、内容居中。
   导航右端原先的退出口（M02 加的文字按钮）已随节点一起删除；
   是否需要次级账户入口由主控收束，样式不预留死规则。 */

/* ---------- 通用模块 ---------- */

.module-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--tint);
  letter-spacing: 0.03em;
  margin: 20px 4px 10px;
  text-transform: uppercase;
}
.module-title:first-child { margin-top: 4px; }

.card {
  background: var(--card-bg);
  border-radius: var(--radius);
  padding: 16px;
  margin-bottom: 12px;
  border: 1px solid rgba(255, 255, 255, 0.03);
  transition: background 0.12s;
}
.card:active { background: var(--card-bg-hover); }

.chip-row {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 2px 2px 4px;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.chip-row::-webkit-scrollbar { display: none; }
/* 滚动提示（2026-09-19）：原先最右侧 chip 被硬切、没有任何"还能横滑"的暗示。
   只在**确实还能向右滚**时加右缘渐隐（由 JS 打 .can-scroll-right）；否则会把
   末尾的按钮永久 painted 成半透明，看起来像禁用。
   向左滚过之后同样给出左缘提示。 */
.chip-row.can-scroll-right {
  -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent);
  mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent);
}
.chip-row.can-scroll-left {
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 28px);
  mask-image: linear-gradient(90deg, transparent, #000 28px);
}
.chip-row.can-scroll-left.can-scroll-right {
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 28px, #000 calc(100% - 28px), transparent);
  mask-image: linear-gradient(90deg, transparent, #000 28px, #000 calc(100% - 28px), transparent);
}

.chip {
  flex: none;
  min-height: var(--tap);
  border: 0;
  background: var(--card-bg);
  color: var(--label-2);
  font-size: 14px;
  font-weight: 500;
  padding: 8px 16px;
  border-radius: 22px;
  transition: all 0.15s;
}
.chip.on { background: var(--tint-fill); color: #fff; font-weight: 600; }

.segment {
  display: flex;
  background: rgba(118, 118, 128, 0.22);
  border-radius: 11px;
  padding: 3px;
  margin: 0 0 6px;
}
.segment button {
  flex: 1;
  min-height: var(--tap);
  border: 0;
  background: none;
  font-size: 14px;
  font-weight: 500;
  color: var(--label-2);
  padding: 7px 0;
  border-radius: 9px;
  transition: all 0.15s;
}
/* 选中态可辨识度（2026-09-19）：原先轨道 rgb(37,37,41) 与选中面板 #2c2c2e 只有
   1.10:1，远低于 WCAG 1.4.11 对"状态指示"要求的 3:1——户外强光下看不出
   "重点关注 / 实时热点"选中了哪个，而它是首屏第一个控件。改用 accent 实底。 */
.segment button.on { background: var(--tint-fill); color: #fff; font-weight: 600; }

.state-note { color: var(--label-2); font-size: 14px; text-align: center; padding: 32px 20px; }
.state-note.error { color: var(--danger); }
/* 加载完成后 note 会被置空，但 padding 仍在 → 形成 64px 空白条，实测存在。
   :empty 时彻底不渲染（含仅剩空白的节点）。 */
.state-note:empty { display: none; }

.retry-btn {
  min-height: 44px;
  display: block;
  margin: 12px auto 0;
  border: 0;
  background: var(--card-bg-2);
  color: var(--label-1);
  font-size: 14px;
  font-weight: 500;
  padding: 10px 28px;
  border-radius: 22px;
}
.retry-btn:active { transform: scale(0.97); }

/* ---------- 登录 ---------- */

/* 登录视图隐藏底部导航（showShell(false)），因此这里必须自己处理顶部安全区，
   否则黑透状态栏（black-translucent）下内容会顶到刘海下面。
   原先只有底部 --safe-bottom，顶部是漏的。
   注：M02 起全局顶栏已移除，.view-root 自己承担 --safe-top，登录页同样自己处理。 */
.login-wrap { min-height: 100dvh; display: flex; flex-direction: column; justify-content: center; padding: calc(var(--safe-top) + 32px) 24px calc(32px + var(--safe-bottom)); max-width: 420px; margin: 0 auto; }

.login-logo {
  width: 72px; height: 72px; border-radius: 18px;
  background: var(--card-bg);
  display: flex; align-items: center; justify-content: center;
  font-size: 34px; margin-bottom: 22px;
  border: 1px solid rgba(255, 255, 255, 0.05);
}
.login-title { font-size: 30px; font-weight: 700; margin: 0 0 6px; letter-spacing: 0; }
.login-sub { font-size: 14px; color: var(--label-2); margin: 0 0 30px; }

.login-field { margin-bottom: 16px; }
.login-field label { display: block; font-size: 13px; color: var(--label-2); margin-bottom: 7px; font-weight: 500; }

.login-field input {
  width: 100%;
  min-height: 50px;
  border: 1px solid var(--separator);
  border-radius: 14px;
  background: var(--card-bg);
  color: var(--label-1);
  font: inherit;
  padding: 13px 16px;
  outline: none;
  transition: border-color 0.15s;
}
.login-field input:focus { border-color: var(--tint); box-shadow: 0 0 0 3px var(--tint-soft); }

.login-error { color: var(--danger); font-size: 14px; min-height: 22px; margin: 2px 0 12px; }

.login-submit {
  width: 100%;
  min-height: 50px;
  border: 0;
  border-radius: 14px;
  background: var(--tint-fill);
  color: #fff;
  font-size: 17px;
  font-weight: 700;
  padding: 13px 0;
  transition: opacity 0.12s, transform 0.12s;
}
.login-submit:active { opacity: 0.85; transform: scale(0.98); }
.login-submit[disabled] { opacity: 0.5; }

/* ---------- 资讯列表 ---------- */

.news-item { padding: 15px 16px; position: relative; }
.news-item .news-title { font-size: 16.5px; font-weight: 600; line-height: 1.42; margin: 0 0 7px; letter-spacing: 0; }
/* 伸展链接（2026-09-19 可访问性）：标题是唯一的 <a>，用 ::after 把点击区铺满整卡，
   这样键盘/读屏可达、又不必把「收藏/隐藏」按钮嵌进 <a>（那样既非法也会误触发跳转）。
   操作行用 z-index 抬到覆盖层之上，保证按钮仍可点。 */
.news-item .news-title-link { color: inherit; }
.news-item .news-content { position: relative; }
.news-item .news-title-link:active { opacity: .8; }
.news-item .news-title-link::after { content: ''; position: absolute; inset: 0; z-index: 1; }
.news-item .news-actions { position: relative; z-index: 2; }
.news-item .news-tags, .news-item .news-meta { position: relative; z-index: 0; }

.view-root .news-item .news-brief {
  font-size: 14px;
  color: var(--label-2);
  margin: 0 0 10px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.view-root .news-item .news-title,
.view-root .news-item.is-read .news-title {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.45;
  color: #f5f2ec;
  margin: 0 0 9px;
  display: block;
  overflow: visible;
}

.view-root .news-item .news-brief {
  font-size: 14.5px;
  line-height: 1.65;
  color: #c9c7c3;
}

.news-item .news-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12px; color: var(--label-3); }
/* 信源名（label-2 同色系，比时间稍亮一档以示区分；不用 chip 样式避免与主题标签混淆） */
.news-item .news-src { color: var(--label-2); }

.news-tags { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.news-tag {
  font-size: 12px; color: var(--label-2);
  background: rgba(118, 118, 128, 0.20);
  padding: 3px 10px; border-radius: 11px;
}
.news-tag.kind { color: var(--tint-on-soft); background: var(--tint-soft); font-weight: 600; }
/* 热度角标三档（2026-09-17，与桌面 news-kind heat-* 同色系） */
.news-tag.heat-high { color: #ff8a5c; background: rgba(255, 138, 92, 0.14); font-weight: 700; }
.news-tag.heat-mid { color: #f5c26b; background: rgba(245, 194, 107, 0.14); }
.news-tag.heat-low { color: var(--label-3); background: rgba(142, 142, 147, 0.12); }

.news-item.is-read .news-title { color: var(--label-2); font-weight: 500; }

.news-actions { display: flex; gap: 8px; margin-top: 12px; }
/* 行内变体（2026-09-29 用户反馈：独立一行难看且占高）：并入标签行右缘。 */
.news-actions--inline { margin-left: auto; margin-top: 0; gap: 2px; }
.news-action {
  min-height: var(--tap);
  border: 0; background: rgba(118, 118, 128, 0.20); color: var(--label-2);
  font-size: 13px; padding: 6px 16px; border-radius: 22px;
}
/* 幽灵图标：无底色不占视觉宽，44px 触达保留；失败闪警示色 + title 说明。 */
.news-action--icon {
  padding: 0;
  background: transparent;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--label-2);
}
.news-action--icon svg { width: 18px; height: 18px; }
.news-action--icon.failed { color: var(--warn); }
.news-action.on { color: var(--warn); background: transparent; }
.news-action.muted { color: var(--label-3); }

.feed-count { font-size: 12px; color: var(--label-3); margin: 0 4px 2px; }

/* 撤销提示（2026-09-19）：隐藏是持久化写操作，误触后需要回滚入口。
   固定在 tabbar 之上，不遮挡内容与导航。 */
.undo-toast {
  position: fixed;
  left: 16px; right: 16px;
  bottom: calc(66px + var(--safe-bottom));
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: var(--card-bg-2);
  border: 1px solid var(--separator);
  border-radius: 14px;
  padding: 10px 10px 10px 16px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
}
.undo-toast-text { font-size: 14px; color: var(--label-1); }
.undo-toast-action {
  flex: none;
  min-height: var(--tap);
  min-width: var(--tap);
  border: 0;
  background: transparent;
  color: var(--tint);
  font-size: 15px;
  font-weight: 600;
  border-radius: 10px;
  padding: 0 12px;
}
.undo-toast-action[disabled] { opacity: 0.5; }

/* 中文转换未完成的说明条（2026-09-19）：轮询超时后如实告知，并给刷新入口。 */
.feed-pending {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  background: var(--card-bg); border-radius: 12px;
  padding: 8px 8px 8px 14px; margin: 0 0 10px;
}
.feed-pending-text { font-size: 13px; color: var(--label-2); }
.feed-pending-action {
  flex: none; min-height: var(--tap); min-width: var(--tap);
  border: 0; background: transparent; color: var(--tint);
  font-size: 14px; font-weight: 600; padding: 0 12px; border-radius: 10px;
}

/* 列表底部：加载更多 / 已到底部。
   JS 里一直在用 .feed-more / .feed-more-btn，但此前 CSS 未定义（死类名）。 */
.feed-more { padding: 4px 0 8px; }
.feed-more-btn { width: 100%; margin: 8px 0 0; }

/* ---------- 资讯详情 ---------- */

.back-link { display: inline-flex; align-items: center; min-height: var(--tap); font-size: 15px; color: var(--tint); padding: 0 0 12px; }
/* 「查看原文」等同为唯一入口的内联链接，同样需要 44px 触控高度。 */
.detail-link { display: inline-flex; align-items: center; min-height: var(--tap); font-size: 15px; }
.detail-title { font-size: 21px; font-weight: 700; line-height: 1.38; margin: 2px 0 10px; letter-spacing: 0; }
.detail-brief { font-size: 15px; color: var(--label-2); white-space: pre-wrap; margin: 0 0 14px; }
.detail-meta { font-size: 13px; color: var(--label-3); margin-bottom: 18px; }

.interpret-box { white-space: normal; }

/* ---------- 站内 AI 解读详情（M02）----------
   详情页结构：标题 / 摘要 / 元信息 / 主题标签 / **醒目的原文入口** / 站内解读。
   原文入口在解读之上，解读未就绪时读者第一眼也能拿到原文；它不是可选的补充，
   而是「站内详情不能替代原文」这条合同要求的落点。 */
.detail-origin-slot { margin: 0 0 22px; }
.detail-origin {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--tap);
  width: 100%;
  padding: 10px 16px;
  border-radius: 22px;
  background: var(--card-bg-2);
  border: 1px solid var(--separator);
  color: var(--tint);
  font-size: 15px;
  font-weight: 600;
}
.detail-origin:active { transform: scale(0.98); }

/* Reading actions stay with the article header; hide is a secondary action. */
.news-detail-actions { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin:0 0 22px; }
.news-detail-actions .detail-origin { flex:1 1 120px; width:auto; padding:10px 12px; gap:6px; }
.news-detail-actions > button.news-detail-icon { box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center; flex:0 0 44px; width:44px; min-width:44px; max-width:44px; height:44px; min-height:44px; padding:0; border:0; border-radius:8px; background:transparent; color:var(--label-2); font-size:0; line-height:0; }
.news-detail-icon svg { width:20px; height:20px; flex:none; }
.news-detail-actions > .news-detail-icon.on { color:var(--tint); background:transparent; }
.news-detail-icon.on svg { fill:var(--tint-soft); }
.news-detail-icon:hover { background:var(--tint-soft); }
.news-detail-status { flex-basis:100%; color:var(--label-2); font-size:13px; }
.news-detail-status:empty { display:none; }
.news-detail-actions :focus-visible { outline:2px solid var(--tint); outline-offset:3px; }

/* 解读分段：把「事实」「业务关联」「待核实」拆成可扫读的小节，
   标题用小号 accent 色，正文沿用 .report-body 的可读性基线。 */
.interpret-section { margin: 0 0 16px; }
.interpret-section:last-child { margin-bottom: 0; }
.interpret-section-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--tint-on-soft);
  letter-spacing: 0.02em;
  margin: 0 0 6px;
}
.interpret-section .report-body { font-size: 15px; line-height: 1.72; }
.interpret-section .report-body h1,
.interpret-section .report-body h2,
.interpret-section .report-body h3 { font-size: 15.5px; margin: 0.8em 0 0.35em; }

/* ---------- 报告 ---------- */

.report-item { padding: 15px 16px; position: relative; }
.report-item .report-title { font-size: 16px; font-weight: 600; line-height: 1.45; margin: 0 0 8px; }
.report-item .report-title-link { color: inherit; }
.report-item .report-title-link::after { content: ''; position: absolute; inset: 0; z-index: 1; }
.report-item .report-meta { font-size: 13px; color: var(--label-2); display: flex; gap: 10px; flex-wrap: wrap; }

.case-meta {
  background: var(--card-bg);
  border-radius: var(--radius);
  padding: 14px 16px;
  margin: 2px 0 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 13.5px;
  color: var(--label-2);
}

.report-status {
  font-size: 13px; font-weight: 600; color: var(--tint-on-soft);
  background: var(--tint-soft);
  display: inline-block;
  padding: 5px 14px; border-radius: 12px; margin: 0 0 12px;
}
.report-status.warn { color: var(--warn); background: rgba(255, 214, 10, 0.13); }

.report-frame-wrap { background: #fff; border-radius: 14px; overflow: hidden; }
/* 78vh 的问题（2026-09-19）：iOS Safari 的 vh 是"大视口"（假设地址栏已收起），
   地址栏展开时 iframe 会超出可视区并被 fixed tabbar 盖住；且 78vh + header +
   tabbar + 下方操作行总和 > 100vh，页面必然额外滚动。改用 dvh 并扣掉固定元素。 */
.report-frame {
  width: 100%;
  height: calc(100dvh - var(--safe-top) - var(--safe-bottom) - 190px);
  min-height: 320px;
  border: 0; display: block;
}
.report-frame-actions { margin: 12px 4px 6px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.frame-note { font-size: 12px; color: var(--label-3); }

/* ---------- Markdown 渲染 ---------- */

.report-body { font-size: 15.5px; line-height: 1.75; }
.report-body h1, .report-body h2, .report-body h3,
.report-body h4, .report-body h5, .report-body h6 { line-height: 1.4; margin: 1.2em 0 0.5em; letter-spacing: 0; }
.report-body h1 { font-size: 22px; }
.report-body h2 { font-size: 19px; }
.report-body h3 { font-size: 17px; }
.report-body p { margin: 0.65em 0; }
.report-body pre {
  background: var(--card-bg);
  border-radius: 12px;
  padding: 14px;
  overflow-x: auto;
  font-size: 13px;
  line-height: 1.55;
  font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
}
.report-body table { border-collapse: collapse; width: 100%; font-size: 14px; margin: 0.9em 0; }
.report-body th, .report-body td { border: 1px solid var(--separator); padding: 8px 10px; text-align: left; }
.report-body th { color: var(--label-2); font-weight: 600; background: var(--card-bg); }
.table-scroll { overflow-x: auto; margin: 0.9em 0; -webkit-overflow-scrolling: touch; }
/* 2026-09-19 实测：结构化报告的定量基线表列多且内容长，把整个页面撑到 453px
   （视口 390），造成全页横向滚动。这里限制表格容器宽度并给一个下限宽度，
   让表格在**容器内**横向滚动，而不是撑破页面。 */
.table-scroll { max-width: 100%; }
.table-scroll table { min-width: 420px; }
.report-body figure { margin: 0.9em 0; }
.report-body figure img { max-width: 100%; border-radius: 12px; display: block; }
.report-body figcaption { font-size: 13px; color: var(--label-3); margin-top: 7px; }

.report-asset {
  background: var(--card-bg);
  border-radius: 12px;
  padding: 12px 14px;
  margin: 0.65em 0;
  font-size: 14px;
  color: var(--label-2);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.report-asset .download {
  color: var(--tint); flex: none; font-weight: 500;
  /* 触控目标（2026-09-19）：纯文字链接此前只有 ~30×21px，是"下载附件"这类
     唯一入口，拇指很难点中。统一到 44px 下限。 */
  min-height: var(--tap); display: inline-flex; align-items: center;
}
/* markdown.js/applyAsset 会读取 .asset-name 作为图片 alt；渲染期需可换行截断，
   否则超长附件路径会把卡片撑破。 */
.asset-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.asset-pending { color: var(--label-3); font-size: 13px; flex: none; }

.report-download {
  color: var(--tint); font-weight: 600; font-size: 15px;
  min-height: var(--tap); display: inline-flex; align-items: center;
  background: none; border: 0; padding: 0; font-family: inherit; cursor: pointer;
}

/* ---------- 结构化正式报告（market-research-report-v1/v2/v3） ----------
   markdown.js 的 renderStructuredReport 产出；与 Markdown 报告共用 .report-body，
   这里只补它特有的分节/字段/提示层级。 */
.report-doc-title { font-size: 22px; line-height: 1.4; margin: 0.2em 0 0.9em; letter-spacing: 0; }
.report-section { margin: 1.6em 0 0; }
.report-section-title {
  font-size: 17px; font-weight: 700; color: var(--tint);
  margin: 0 0 0.5em; padding-bottom: 0.35em;
  border-bottom: 1px solid var(--separator);
}
.report-subsection { margin: 1.1em 0 0; }
.report-subsection-title { font-size: 15.5px; font-weight: 600; margin: 0 0 0.4em; }
/* 小节论点：左侧色条区分"结论句"与正文，不靠加粗堆叠。 */
.report-thesis {
  margin: 0 0 0.6em; padding: 2px 0 2px 10px;
  border-left: 3px solid var(--tint); color: var(--label-1);
}
.report-field { margin: 0.5em 0; }
.report-field-label {
  font-size: 13px; font-weight: 600; color: var(--label-3);
  margin: 0 0 0.15em; letter-spacing: 0.02em;
}
.report-cite-hint { font-size: 12px; color: var(--label-3); margin: 0.5em 0 0; }
.report-caveats { margin: 0.6em 0 0; font-size: 13.5px; color: var(--label-2); }
.report-caveats summary { color: var(--label-3); font-size: 13px; min-height: var(--tap); display: flex; align-items: center; }
.report-caveats p { margin: 0.3em 0; }
.report-questions { margin: 0.3em 0 0; padding-left: 1.2em; }
.report-questions li { margin-bottom: 0.8em; }
.report-questions li p { margin: 0.15em 0; }
.report-question-note { font-size: 13px; color: var(--label-2); }

/* Age of a previously successful response, cleared when refreshed or denied. */
.feed-stale { padding: 4px 20px; font-size: 12px; color: var(--label-2); }

/* Compact list sources; full reporting material is revealed by the reader. */
.news-item .news-brief {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.news-focus-evidence { margin-top: 8px; font-size: 12px; color: var(--label-2); }
.news-focus-evidence > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: var(--tap, 44px);
  cursor: pointer;
}
.news-focus-evidence > summary::-webkit-details-marker { display: none; }
.news-focus-evidence > summary::after { content: '查看'; color: var(--tint); flex: none; }
.news-focus-evidence[open] > summary::after { content: '收起'; }
.news-focus-evidence > summary.is-compact { min-height:48px; border-block:1px solid var(--separator); }
.news-focus-evidence > summary.is-compact .ev-related-meta { margin-left:auto; }
.news-focus-evidence > summary.is-compact::after { content:'⌄'; }
.news-focus-evidence[open] > summary.is-compact::after { content:'⌃'; }
.news-focus-counts { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.news-focus-count { white-space: nowrap; }
.news-focus-count-separator { color: var(--label-3); }
.news-focus-media-list { display: flex; flex-wrap: wrap; gap: 6px; }
.news-focus-media-name { padding: 3px 7px; border-radius: 6px; background: var(--card-bg); }
.news-focus-reports-head { margin: 10px 0 6px; font-size: 12px; font-weight: 600; }
.news-focus-report { padding: 9px 0; border-top: 1px solid var(--separator); }
.news-focus-report-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 10px; }
.news-focus-report-date { color: var(--label-3); }
.news-focus-report-title { margin: 5px 0; line-height: 1.6; overflow-wrap: anywhere; }
.news-focus-link { display: inline-flex; align-items: center; min-height: var(--tap, 44px); color: var(--tint); }
.news-focus-note, .news-focus-aggregate-note { margin: 6px 0; line-height: 1.6; color: var(--label-3); }
.news-focus-aggregate { margin-top: 6px; border-top: 1px solid var(--separator); }
.news-focus-aggregate > summary { min-height: var(--tap, 44px); line-height: 1.6; cursor: pointer; }
.news-focus-aggregate-section h5 { margin: 10px 0 5px; font-size: 12px; }
.news-focus-aggregate-list { padding-left: 18px; line-height: 1.7; }
.news-focus-aggregate-source { margin: 5px 0; overflow-wrap: anywhere; }

/* Reports open with authored highlights; original files are an explicit step. */
.report-reading-lead { margin: 18px 0 24px; line-height: 1.8; color: var(--label-2); }
.report-reading-metrics { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin: 24px 0; }
.report-reading-metrics > div { min-width: 0; padding: 14px 0; border-bottom: 1px solid var(--separator); }
.report-reading-metrics dt { color: var(--label-3); font-size: 13px; }
.report-reading-metrics dd { margin: 8px 0 0; font-size: 18px; font-weight: 650; overflow-wrap: anywhere; }
.report-reading-figure { margin: 24px 0; }
.report-reading-figure img { display: block; width: 100%; height: auto; border-radius: 10px; }
.report-reading-figure figcaption { margin-top: 10px; color: var(--label-3); font-size: 13px; }
.report-reading-actions { display: flex; gap: 12px; margin: 24px 0; }
.report-reading-actions button.report-download { width: auto; flex: 1; min-height: 44px; margin: 0; }
.report-original-frame { display: block; width: 100%; height: 75vh; min-height: 480px; border: 1px solid var(--separator); border-radius: 12px; background: white; }
.report-original-text { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.8; }
.report-original[hidden] { display: none; }
@media (max-width: 350px) { .report-reading-metrics { grid-template-columns: 1fr; } }