/* ============================================================================
   v14-gold.css —— 10 版黄金观察（0912 定稿）：模块卡三块条带 + 两 Tab 详情。
   页公共版式（.mp-*）在 v14.css §10，条带外壳（.mod-strip / .strip-blk）在 v14.css §6。
   文案纪律：回调 · 反弹风险温度计，不作涨跌预测（文案在 js/gold.js）。
   2026-09-16 测试站反馈优化 §C：卡头无 pill、价格行单行；页内数据面板 / 区间钮独立行 / 图表浮窗；旧的口径行样式已删。
   ========================================================================== */

/* ============ 模块卡 ============ */
.gold-price { display: flex; align-items: baseline; gap: 8px; height: 24px; flex: none; }
.gold-price-t { font-size: 12px; font-weight: 700; color: var(--ink-2); white-space: nowrap; }
.gold-price-v { font-size: 22px; font-weight: 700; letter-spacing: -.02em; color: var(--ink); font-variant-numeric: tabular-nums; line-height: 1; }
.gold-price-d { font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; }
.gold-price-d.is-up { color: var(--green-d); }
.gold-price-d.is-down { color: var(--bear); }
.gold-strip { position: relative; flex: 1; min-height: 0; margin-top: 8px; }
.gold-strip .mod-strip { height: 100%; }
.strip-t-r { margin-left: auto; font-size: 11px; font-weight: 600; color: var(--ink-3); }
/* 前两块同构：罗盘与日内折线同 viewBox 180×96、同 124px 宽（2026-09-16 二轮），下面各一行「档位 + 最新值」 */
.gold-gauge, .gold-mini { display: block; margin: 0 auto; height: auto; }
.gold-intra-row { display: inline-flex; align-items: baseline; gap: 6px; }
.gold-crowd { position: relative; display: block; height: 6px; border-radius: var(--r-pill); opacity: .9; background: linear-gradient(90deg, var(--bull) 0%, var(--soft) 40%, var(--soft) 60%, var(--bear) 100%); }
.gold-crowd.is-lg { height: 10px; margin-top: 12px; }
.gold-crowd-mk { position: absolute; top: -3px; width: 3px; height: 12px; border-radius: 2px; background: var(--ink); transform: translateX(-1.5px); }
.gold-crowd.is-lg .gold-crowd-mk { top: -3px; height: 16px; }
.gold-crowd-lab { display: flex; justify-content: space-between; margin-top: 6px; font-size: 11px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.gold-crowd-lab .mid { color: var(--ink-2); font-weight: 700; }

/* ============ 模块页：恐惧贪婪 ============ */
/* 标题行右侧只放一个时间（数据截至 / 最新 bar 收盘） */
.mp-card-s.is-r { margin-left: auto; flex: none; white-space: nowrap; font-variant-numeric: tabular-nums; }
.gold-zone-pill { display: inline-flex; align-items: center; gap: 5px; height: 22px; padding: 0 9px; border-radius: var(--r-pill); font-size: 11px; font-weight: 700; }
.gold-zone-pill .dot { width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
/* 数据面板：标题下两格（最新 + 档位 / 5 日均；最新读数 / 已收盘 bar） */
.gold-stats { margin-top: 12px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.gold-stat { display: flex; align-items: baseline; gap: 8px; min-width: 0; padding: 10px 12px; border-radius: 12px; background: var(--soft-2); }
.gold-stat-l { font-size: 11px; color: var(--ink-3); white-space: nowrap; }
.gold-stat-v { font-size: 20px; font-weight: 800; color: var(--ink); font-variant-numeric: tabular-nums; letter-spacing: -.02em; line-height: 1; white-space: nowrap; }
.gold-stat-u { margin-left: 4px; font-size: 12px; font-weight: 600; color: var(--ink-3); letter-spacing: 0; }
.gold-stat .gold-zone-pill { margin-left: auto; flex: none; }
/* 区间钮独立一行（图表右上） */
.gold-chart-bar { margin-top: 12px; display: flex; justify-content: flex-end; }
.mp-seg.is-sm { margin-top: 0; flex: none; }
/* 图表 + 浮窗（浮窗定位由 JS 写 style；SVG 内竖参考线 / 放大点用 visibility 切换） */
.gold-chart { position: relative; margin-top: 12px; touch-action: pan-y; }
.gold-svg { display: block; width: 100%; height: auto; }
.gold-tip { position: absolute; left: 0; top: 0; z-index: 2; pointer-events: none; padding: 6px 10px; border-radius: 8px; background: var(--card); border: 1px solid var(--line); box-shadow: var(--sh-card); font-size: 11px; line-height: 1.5; color: var(--ink-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
.gold-tip b { font-weight: 700; color: var(--ink); }
.gold-tip-z { font-weight: 700; }
.gold-legend { margin-top: 6px; display: flex; align-items: center; justify-content: center; gap: 18px; flex-wrap: wrap; font-size: 12px; color: var(--ink-2); }
.gold-legend .lg { display: inline-flex; align-items: center; gap: 6px; }
.gold-legend i { width: 16px; height: 3px; border-radius: 2px; }
.gold-legend i.ma { background: var(--ink); }
.gold-legend i.dy { background: var(--ink-3); }
.gold-legend .lg-u { color: var(--ink-3); }

/* 8 因子分解（两列） */
.gold-factors { margin-top: 16px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 24px; }
.gf-row { display: grid; grid-template-columns: 150px 1fr 34px 42px; align-items: center; height: 26px; gap: 8px; }
.gf-l { font-size: 12px; color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gf-bar { height: 6px; border-radius: var(--r-pill); background: var(--soft); overflow: hidden; }
.gf-bar > span { display: block; height: 100%; border-radius: var(--r-pill); opacity: .85; }
.gf-z { font-size: 12px; font-weight: 700; color: var(--ink); text-align: right; font-variant-numeric: tabular-nums; }
.gf-w { font-size: 11px; color: var(--ink-3); text-align: right; font-variant-numeric: tabular-nums; }

/* ============ 模块页：持仓与期权 ============ */
.gold-pos { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.gold-pos .mp-card + .mp-card { margin-top: 0; }
.gold-pos .mp-card.is-full { grid-column: 1 / -1; }
.gold-big { margin-top: 14px; font-size: 22px; font-weight: 800; color: var(--ink); font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.gold-big .u { margin-left: 6px; font-size: 12px; font-weight: 600; color: var(--ink-3); letter-spacing: 0; }
.gold-spark, .gold-bars { display: block; width: 100%; height: auto; margin-top: 10px; }
.gold-sub3 { margin-top: 10px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }   /* 2026-09-17：五只全显（≤720 三列见 mobile.css） */
.oi-empty { font-size: 12px; color: var(--ink-3); padding: 10px 0; }   /* 一侧无 OI 数据 / 持仓为 0 占位 */
.g3 { background: var(--soft-2); border-radius: 12px; padding: 8px 6px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }   /* 五格并排（桌面卡内宽 ≈ 390）：左右各 6 才放得下「估算 09-03」 */
.g3-t { font-size: 11px; font-weight: 700; color: var(--ink-2); }
.g3-v { font-size: 13px; font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }
.g3-s { font-size: 11px; color: var(--ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.oi-grid { margin-top: 12px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px 24px; }
.oi-h { font-size: 12px; font-weight: 700; color: var(--ink-2); margin-bottom: 6px; }
.oi-row { display: grid; grid-template-columns: 52px 1fr 64px; align-items: center; height: 24px; gap: 8px; }
.oi-k { font-size: 12px; font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }
.oi-bar { height: 10px; border-radius: var(--r-pill); background: var(--soft); overflow: hidden; }
.oi-bar > span { display: block; height: 100%; border-radius: var(--r-pill); opacity: .85; }
.oi-bar > span.is-call { background: var(--bull); }
.oi-bar > span.is-put { background: var(--bear); }
.oi-v { font-size: 12px; color: var(--ink-2); text-align: right; font-variant-numeric: tabular-nums; }
/* 2026-09-18 C3：期权卡一句用途 / 两侧「阻力参考 · 支撑参考」小标 / 行权价下方金价换算（行高随之放开，首列加宽放「≈金价 4,852」） */
.mp-purpose { margin-top: 8px; font-size: 12px; line-height: 1.5; color: var(--ink-3); }
.oi-hs { margin-left: 5px; font-size: 11px; font-weight: 600; color: var(--ink-3); }
.oi-row { grid-template-columns: 78px 1fr 56px; height: auto; min-height: 24px; padding: 2px 0; }
.oi-k { display: flex; flex-direction: column; line-height: 1.15; }
.oi-kg { font-size: 10px; font-weight: 500; color: var(--ink-3); white-space: nowrap; }
.mp-meta.is-pc { color: var(--ink-2); }

/* 分项缺失提示（契约：分项不可得为 null 且整体 partial） */
.gold-partial { margin-bottom: 10px; font-size: 12px; color: var(--amber); background: var(--amber-soft); border-radius: 10px; padding: 8px 12px; }

/* 会话状态标（进行中 / 已收盘 / 滞留缓存）：防止把旧交易日画成「今天」 */
.gold-sess { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; border-radius: var(--r-pill); font-size: 11px; font-weight: 700; }
.gold-sess.is-live { background: var(--green-soft); color: var(--green-d); }
.gold-sess.is-closed { background: var(--soft); color: var(--ink-2); }
.gold-sess.is-stale { background: var(--amber-soft); color: var(--amber); }

/* 2026-09-15：卡内空态（期权链不完整 options:null 等）——不占 60px 大留白 */
.mp-state.is-inline { padding: 22px 12px; line-height: 1.7; text-align: center; }