/* 14 版组件层 · 看板六卡与大盘关键位页（UI 规格 §2 / §3 / §5 / §6）
   载入顺序：mobile.css 之后、theme-dark.css 之前——本文件的无条件规则会盖过 mobile.css 对同一选择器的 ≤720 规则，
   改动已有组件时，≤720 的值要在本文件的 @media (max-width: 720px) 里重新写全；深色差异写在本文件 [data-theme="dark"] 段。
   精确值来源：14 版画布（docs/前端参考/2026-10-16-14版整体需求/，用户 10-17 验收）计算样式实测；现网已有的类保留原规则，这里只补新件与差异。
   卡壳（256 高：头 20 + 体 146 + 脚 40，无脚体 196）、卡头、轮播轨道、推特X日报表格、罗盘档位字沿用 v14.css / v3.css。 */

/* ============ 2.2 大盘关键位卡：轮播（13 版 hj-*）+ 脚行最近阻力 / 支撑 ============ */
/* 放大钮与卡上灯箱退役（整卡开 ?page=levels），光标由 zoom-in 改手型；touch-action: pan-y 让左右滑交给 levels.js 手势、竖滑照常滚页面 */
.mod-body .hj-carousel { cursor: pointer; touch-action: pan-y; }
.hj-track img { -webkit-user-drag: none; user-select: none; }
.lv-foot { display: flex; align-items: center; height: 40px; margin-top: 10px; flex: none; min-width: 0; white-space: nowrap; overflow: hidden; }
.lv-foot .k { font-size: var(--fs-12); font-weight: 700; margin-right: 5px; }
.lv-foot .k.res { color: var(--bear); }
.lv-foot .k.sup { color: var(--bull); }
.lv-foot .v { font-size: var(--fs-13); font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }
.lv-foot .sep { margin: 0 8px; font-size: var(--fs-12); color: var(--ink-3); }
.lv-foot .none { font-size: var(--fs-12); color: var(--ink-3); }
/* 从没有过图集 / 首次加载中：体内虚线框一句，脚空（整卡仍可点） */
.lv-empty {
  height: 100%; border-radius: 12px; border: 1px dashed var(--line-hover); background: var(--soft-2);
  display: grid; place-items: center; font-size: var(--fs-12); color: var(--ink-3);
}

/* ============ 2.4 投资者情绪卡：仪表 + 档位字（v14.css .strip-zone）+ VIX / Put/Call 两行 ============ */
.sg-top { flex: 1; min-height: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.sg-top .sig-gauge { width: 124px; margin: 0 auto; }
.sg-row { flex: none; height: 32px; border-top: 1px solid var(--line); display: flex; align-items: center; gap: 8px; }
.sg-row .l { font-size: var(--fs-13); color: var(--ink-2); white-space: nowrap; }
.sg-row .r { margin-left: auto; display: inline-flex; align-items: baseline; gap: 6px; white-space: nowrap; }
.sg-row .r b { font-size: var(--fs-14); font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }
.sg-row .r small { font-size: var(--fs-12); color: var(--ink-3); font-variant-numeric: tabular-nums; }

/* ============ 2.5 市场广度卡：标普500 / 纳斯达克两行（行头 24 + 4 + 行图 52 = 80，行间 12）+ 体底说明 ============ */
.br-row { flex: none; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.br-row + .br-row { margin-top: 12px; }
.br-h { display: flex; align-items: baseline; gap: 6px; min-width: 0; height: 24px; }
.br-n { font-size: var(--fs-13); font-weight: 700; color: var(--ink); white-space: nowrap; }
.br-lag { font-size: var(--fs-12); color: var(--ink-3); white-space: nowrap; font-variant-numeric: tabular-nums; }
.br-v { margin-left: auto; font-size: var(--fs-20); font-weight: 800; color: var(--ink); font-variant-numeric: tabular-nums; letter-spacing: -.2px; line-height: 24px; white-space: nowrap; }
.br-d { flex: none; min-width: 38px; text-align: right; font-size: var(--fs-12); font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.br-d.up { color: var(--bull); }
.br-d.down { color: var(--bear); }
.br-d.flat { color: var(--ink-3); }
.br-row.is-miss .br-v { color: var(--ink-3); }
/* 行图：右留 30 给「50%」与最新点；折线 2px --c-yellow（与市场广度页 20 日线同色，10-13 用户定）、50% 虚线 1px --line-hover（3 3） */
.br-sp { position: relative; height: 52px; margin-right: 30px; }
.br-sp svg { display: block; width: 100%; height: 52px; overflow: visible; }
.br-ln50 { stroke: var(--line-hover); stroke-width: 1; stroke-dasharray: 3 3; }
.br-ln { fill: none; stroke: var(--c-yellow); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.br-dot { position: absolute; width: 7px; height: 7px; border-radius: 50%; background: var(--c-yellow); box-shadow: 0 0 0 1.5px var(--card); transform: translate(-50%, -50%); }
.br-50 { position: absolute; left: calc(100% + 6px); transform: translateY(-50%); font-size: var(--fs-11); line-height: 1; color: var(--ink-3); font-variant-numeric: tabular-nums; white-space: nowrap; }
.br-miss { position: absolute; inset: 0 -30px 0 0; display: grid; place-items: center; border-radius: 8px; background: var(--soft); font-size: var(--fs-12); color: var(--ink-3); }
.br-note { flex: none; margin-top: auto; font-size: var(--fs-11); color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.br-empty { flex: 1; display: grid; place-items: center; font-size: var(--fs-13); color: var(--ink-3); }

/* ============ 3 · 大盘关键位页（?page=levels；页头 / Tab / 卡沿用 v14.css §10 .mp-*） ============ */
.lvp .mp-sub[hidden], .lvp .mp-tabs[hidden] { display: none; }   /* 加载中 / 失败 / 从没有过图集：页头只有标题与 ✕ */
.lvp .lv-seg { white-space: nowrap; }                              /* 元信息按「·」分段、段内不断行 */
.lv-fig-t { display: flex; align-items: baseline; gap: 10px; margin: 2px 0 10px; font-size: var(--fs-16); font-weight: 700; color: var(--ink); }
/* 图卡：宽撑满内容列（最宽 960），高按图片原始比例（未到时按 18 : 10 占位）；容器圆角 12 + 1px --line（13 版报告图容器）；点按开灯箱 */
.lv-img {
  position: relative; display: block; width: 100%; padding: 0; border-radius: var(--r-lg); border: 1px solid var(--line);
  overflow: hidden; background: #131722; cursor: zoom-in;
}
.lv-img img { display: block; width: 100%; height: auto; aspect-ratio: auto 18 / 10; }
.lv-fig + .mp-card, .lv-fig + .lv-none { margin-top: 16px; }
.lv-none { font-size: var(--fs-13); color: var(--ink-3); }
/* 价位表（桌面）：区间 160 / 星级 72 / 依据 1fr / 解读 1fr；表头 32；行 ≥ 44、内边距 10 12、行间 1px --line */
.lv-tbl { margin-top: 12px; }
.lv-th, .lv-row { display: grid; grid-template-columns: 160px 72px minmax(0, 1fr) minmax(0, 1fr); align-items: center; }
.lv-th { height: 32px; border-bottom: 1px solid var(--line); }
.lv-th span { padding: 0 12px; font-size: var(--fs-12); font-weight: 600; color: var(--ink-3); }
/* 组头（v3 降级，用户 10-16 晚）：高 32、上内边距 8、左右 12，12/600 --ink-3，字前 6 圆点按方向取色；不加色条与底色 */
.lv-grp { display: flex; align-items: center; gap: 6px; height: 32px; padding: 8px 12px 0; font-size: var(--fs-12); font-weight: 600; color: var(--ink-3); }
.lv-grp::before { content: ''; flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--bear); }
.lv-grp.is-sup::before { background: var(--bull); }
.lv-row { min-height: 44px; border-bottom: 1px solid var(--line); }
.lv-row > span { padding: 10px 12px; min-width: 0; }
.lv-rng { font-size: var(--fs-14); font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.lv-row.is-res .lv-rng { color: var(--bear); }
.lv-row.is-sup .lv-rng { color: var(--bull); }
.lv-stars { font-size: var(--fs-13); letter-spacing: 1px; white-space: nowrap; line-height: 1; }
.lv-stars i { font-style: normal; color: var(--c-yellow); }
.lv-stars i.o { color: var(--line-hover); }
.lv-lab { font-size: var(--fs-13); font-weight: 600; color: var(--ink); line-height: 1.5; }
.lv-nt { font-size: var(--fs-13); color: var(--ink-2); line-height: 1.5; }
/* 收盘分隔行：高 40，虚线 1px --line-hover 横贯，中间「收盘 771.79 · 10-15」12/700 --ink-2；无收盘价时只画虚线 */
.lv-close { position: relative; height: 40px; display: flex; align-items: center; justify-content: center; }
.lv-close::before { content: ''; position: absolute; left: 0; right: 0; top: 50%; border-top: 1px dashed var(--line-hover); }
.lv-close span { position: relative; padding: 0 10px; background: var(--card); font-size: var(--fs-12); font-weight: 700; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.lv-note { margin-top: 14px; font-size: var(--fs-12); color: var(--ink-3); line-height: 1.65; }
/* 灯箱：沿用报告图灯箱 .lightbox（v2.css），点任意处关闭；底部一行说明条（画布 §3 灯箱帧） */
.lv-lb { cursor: zoom-out; }
.lv-lb-cap {
  position: fixed; left: 0; right: 0; bottom: calc(22px + env(safe-area-inset-bottom, 0px));
  text-align: center; font-size: var(--fs-12); font-weight: 700; color: rgba(255, 255, 255, .8); pointer-events: none;
}

/* ============ 8 · ≤720 ============ */
@media (max-width: 720px) {
  /* §2.1：chips 行退役后首卡离顶栏 8——加在看板容器上，不动 #main-area 上内边距（资讯流日期头 sticky top:0 仍贴顶栏下缘） */
  .board-scroll { padding-top: 8px; }
  /* §8：Tab 四个一行、每个 ≥ 64（下划线仍 = 文字宽） */
  .lvp .mp-tabs { gap: 0; margin-top: 12px; }
  .lvp .mp-tab { min-width: 64px; height: 40px; padding: 0 17px; justify-content: center; }
  .lvp .mp-tab-bar { left: 17px; right: 17px; }
  /* §3 价位表堆叠：区间 15/700 + 右侧星级 / 依据 13/600 / 解读 13 --ink-2（有才出）；组头左右内边距 0 */
  .lv-th { display: none; }
  .lv-row { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "rng stars" "lab lab" "nt nt"; row-gap: 3px; padding: 10px 0; min-height: 0; }
  .lv-row > span { padding: 0; }
  .lv-rng { grid-area: rng; font-size: 15px; }   /* UI 规格 §3 ≤720 明定 15/700（七级字号之外的特例） */
  .lv-stars { grid-area: stars; align-self: center; }
  .lv-lab { grid-area: lab; }
  .lv-nt { grid-area: nt; }
  .lv-nt:empty { display: none; }
  .lv-grp { padding-left: 0; padding-right: 0; }
}

/* ============ 深色：本文件新件全部走令牌（--card / --soft / --soft-2 / --line / --line-hover / --ink-* / --bull / --bear / --c-yellow），
   两主题自动切换；关键位图底 #131722 是图本身的深底，两主题相同。轮播容器、圆点、罗盘、灯箱底沿用 theme-dark.css 既有规则。 ============ */