/* /home/ubuntu/baoleme/frontend/hw-wall-ui.css
HW_WALL_UI R3 — 全屏终端墙最终权威覆盖层 2026-10-09 老板全权
── 为什么存在 ──────────────────────────────────────────────
终端墙(#hwWall)被 10 层样式反复覆盖:
hw-styles #40 V17骨架 / #41 V18背景 / #42 V19移动 / #47 V23玻璃
hw-motion(悬停) · hw-theme(配色!) · hw-reforge(CRT) · hw-elite(密度)
其中 hw-elite.css 最后加载且无 !important = 实际赢家(KPI 27px / 表格 7px 行距),
导致 1366x768 / 1600x900 笔电下卡片被压到 53~94px 并出现内部滚动条;
hw-theme.css 又用 !important 把 KPI 盈亏色压成近白 #F2F3FA → 涨跌语义丢失。
本层在 hw-elite.css 之后加载, 以 ID 级特异性夺回控制权。
── 原则 ────────────────────────────────────────────────────
只动观感(密度/层级/配色/截断), 不改结构/类名/交互/数据源/交易逻辑。
不引入 backdrop-filter (遵 V18 铁律);
不动 #hwWall position (遵 hw-reforge 铁律, 改了会把墙推出屏幕)。
涨/跌色语义保持: 涨 var(--hw-up) / 跌 var(--hw-down)。
── 回滚 ────────────────────────────────────────────────────
删 index.html 里本文件那一行 即全部还原。 */
:root{
--hww-kpi-v:20px; /* KPI 数值 (原被 hw-elite 抬到 27px) */
--hww-kpi-k:9px; /* KPI 标签 */
--hww-gap:10px; /* 统一栅格间距 (原 14px) */
--hww-h1:#4fd1e0; /* 短线 青 */
--hww-h4:#e0a44a; /* 中线 琥珀 */
--hww-d1:#9d92ff; /* 长线 紫 */
}
/* ══ 1. 密度回收: 把纵向空间还给卡片 ══ */
#hwWall{gap:var(--hww-gap)!important;padding:12px 16px 14px!important}
#hwWall .wl-kpis{gap:var(--hww-gap)!important}
#hwWall .wl-main{gap:var(--hww-gap)!important}
#hwWall .wl-kpi{padding:9px 11px 10px!important;border-radius:11px!important}
#hwWall .wl-kpi .k{font-size:var(--hww-kpi-k)!important;letter-spacing:.12em!important}
#hwWall .wl-kpi .v{font-size:var(--hww-kpi-v)!important;line-height:1.06!important;
margin-top:4px!important;letter-spacing:-.02em!important}
#hwWall .wl-kpi .s{font-size:9.5px!important;margin-top:3px!important}
#hwWall .wl-eqk{padding:9px 11px 10px!important}
#hwWall .wl-eqchart{min-height:30px!important;margin-top:4px!important}
#hwWall .wl-eqv{font-size:12.5px!important;margin-top:3px!important}
/* ══ 2. 夺回盈亏语义 (压掉 hw-theme.css 的 !important 近白) ══
hw-theme: html.hw-theme .wl-kpi .v{color:#F2F3FA!important} ← 特异性 (0,3,1)
本层: html.v17-on #hwWall .wl-kpi .v.up ← 带 ID, 必胜 */
html.v17-on #hwWall .wl-kpi .v.up{color:var(--hw-up,#35d69c)!important}
html.v17-on #hwWall .wl-kpi .v.dn{color:var(--hw-down,#ff5f78)!important}
html.v17-on #hwWall .wl-kpi .v.gd{color:#b9aaff!important}
/* ══ 3. KPI 主次分层: 总权益/浮动盈亏为主角, 其余降噪 ══ */
#wlKpiCells .wl-kpi:nth-child(1) .v,
#wlKpiCells .wl-kpi:nth-child(3) .v{
font-size:calc(var(--hww-kpi-v) + 2px)!important;font-weight:800!important}
#wlKpiCells .wl-kpi:nth-child(1),
#wlKpiCells .wl-kpi:nth-child(3){border-color:rgba(77,124,254,.26)!important}
#wlKpiCells .wl-kpi:nth-child(n+7) .v{opacity:.9}
/* ══ 4. 短屏保底: 放弃等分网格 → 流式布局 ══
真问题区: 宽 ≥1181px 且 高 ≤960px (1366x768 / 1440x900 / 1600x900 笔电)
病因: 三行等分网格把卡片压到 53~94px, 内部滚动条 + 内容被裁。
处置: 卡片按内容自然高度堆叠, 墙体整体滚动 → 零裁切, 单条滚动轴不困惑。 */
@media (min-width:1181px) and (max-height:960px){
/* ⚠️ 必须带 .on 限定: 仅当终端墙打开(#hwWall.on)时才改 display。
2026-10-09 修 bug「终端墙进去后退不出」: 原 #hwWall{display:block!important}
无 .on 限定 → 笔电分辨率下即使 close() 摘掉 .on, 墙仍被强制显示 → 退不出。
★ 2026-10-10 R4: 仅当不存在 5 卡新布局时生效 (旧 7 卡短屏保底)。
R4 网格 (#hwWall .wl-main:has(.p-strat)) 自带 3 行等比, 短屏也能放下 → 不再压平。 */
#hwWall.on:not(:has(.wl-main .p-gmgn + .p-guard)){display:block!important;overflow-y:auto!important;grid-template-rows:none!important}
#hwWall.on:not(:has(.wl-main .p-gmgn + .p-guard)) .wl-kpis{grid-template-columns:repeat(6,minmax(0,1fr))!important;margin-bottom:var(--hww-gap)}
#hwWall.on:not(:has(.wl-main .p-gmgn + .p-guard)) .wl-main{display:block!important;grid-template-rows:none!important;height:auto!important}
#hwWall.on:not(:has(.wl-main .p-gmgn + .p-guard)) .wl-card{height:auto!important;min-height:0!important;display:flex!important;
flex-direction:column!important;margin-bottom:var(--hww-gap)!important;
grid-column:auto!important;grid-row:auto!important}
#hwWall.on:not(:has(.wl-main .p-gmgn + .p-guard)) .wl-body{max-height:none!important;overflow:visible!important;flex:0 0 auto!important}
#wlKpiCells .wl-kpi:nth-child(1) .v,
#wlKpiCells .wl-kpi:nth-child(3) .v{font-size:17px!important}
}
/* ══ 5. 表格密度 (hw-elite 曾放到 7px 行距) ══ */
#hwWall table{font-size:10.5px!important}
#hwWall th{padding:3px 8px!important;font-size:9px!important;line-height:1.25!important}
#hwWall td{padding:3px 8px!important;line-height:1.34!important}
#hwWall .wl-body{padding:5px 10px 7px!important}
/* ══ 6. 紫色收敛: 只留品牌/部门标签, 数据层转中性灰蓝 ══ */
#hwWall .wl-card>h4{color:#b3c0d4!important;letter-spacing:.09em!important;
font-size:10px!important;padding:5px 10px!important;
overflow:hidden!important;white-space:nowrap!important}
#hwWall .wl-card>h4 .wl-dept{opacity:1!important;color:#9d92ff!important;
background:rgba(77,124,254,.10)!important;border-color:rgba(77,124,254,.20)!important}
#hwWall .inst{color:#dbe4f2!important}
#hwWall .strat-tag{color:#8b96a8!important}
/* ══ 7. 周期标签醒目化 (老板: 持仓到底是短/中/长线 要显示清楚) ══
墙内 td.hz 原为纯文本, 现改为与部门色系一致的三色 chip */
#hwWall td.hz{
text-align:center!important;font-weight:700!important;font-size:9.5px!important;
letter-spacing:.06em!important;font-family:var(--mono,'JetBrains Mono',monospace)!important}
#hwWall td.hz:not(:empty){color:#c9d3e6}
/* 用 :nth 无法按文本着色 → 由 JS 输出 hz- 类; 无类时给中性兜底 */
#hwWall td.hz.hz-h1{color:var(--hww-h1)!important}
#hwWall td.hz.hz-h4{color:var(--hww-h4)!important}
#hwWall td.hz.hz-d1{color:var(--hww-d1)!important}
/* ══ 8. 修语义 bug: 日志 warn 用琥珀 (原 renderLog 误用 .gd=紫) ══ */
#hwWall .flow .m.warn{color:#e0a44a!important}
/* ══════════════════════════════════════════════════════════════════
R4 — 2026-10-10 老板令「回到全屏终端 + 按最新洪武重新设计」
- 卡片数 7 → 5 (去成交/日志, 核心聚焦): 持仓 / SI裁决 / 因子矩阵 / GMGN链上 / 风控
- 布局: 持仓主视觉 (跨 8 列占 2 行) + 右侧 SI裁决/因子/GMGN/风控
- 因子矩阵: 三周期 H1/H4/D1 三列
- GMGN: 新增筛选漏斗 (候选→过滤→开仓) + 死亡门 top3
- 数据源/字段完全对齐当前 /api/hongwu/* (overview/ai-decision/si-weights/gmgn/risk)
回滚: 删 index.html 的 hw-wall-ui.css 即还原 (但 JS 已是 R4 → 需同步还原)
══════════════════════════════════════════════════════════════════ */
/* ── 5 卡新布局 ──
桌面 (≥1181px): 12 列网格 (即便短屏 900px 也放得下 3 行)
行1: [持仓 span8, rowspan2] [SI裁决 span4]
行2: [ 同上 ] [因子矩阵 span4]
行3: [GMGN span7] [风控 span5] */
@media (min-width:1181px){
#hwWall.on .wl-main{
display:grid!important;
grid-template-columns:repeat(12,minmax(0,1fr))!important;
grid-template-rows:minmax(0,1.02fr) minmax(0,1fr) minmax(0,0.9fr)!important;
gap:8px!important;min-height:0!important;height:auto!important;overflow:visible!important}
/* 复位旧短屏保底对卡片的挤压 (不动 grid-column/row, 让下方 .p-* 定位生效) */
#hwWall.on .wl-card{height:auto!important;margin-bottom:0!important;
min-height:0!important;display:flex!important;flex-direction:column!important}
#hwWall.on .wl-body{max-height:none!important;flex:1 1 auto!important;overflow:auto!important}
#hwWall .p-pos{grid-column:1 / span 8!important;grid-row:1 / span 2!important}
#hwWall .p-ai{grid-column:9 / span 4!important;grid-row:1!important}
#hwWall .p-strat{grid-column:9 / span 4!important;grid-row:2!important}
#hwWall .p-gmgn{grid-column:1 / span 7!important;grid-row:3!important}
#hwWall .p-guard{grid-column:8 / span 5!important;grid-row:3!important}
}
/* ── 因子矩阵: 三周期列 ── */
#hwWall .strat-3tf{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;height:100%}
#hwWall .strat-col{display:flex;flex-direction:column;gap:5px;min-width:0}
#hwWall .strat-hd{font-size:9px;font-weight:700;letter-spacing:.08em;text-align:center;
padding:3px 0;border-radius:6px;background:rgba(255,255,255,.03);border:1px solid rgba(77,124,254,.12)}
#hwWall .strat-hd.hz-h1{color:var(--hww-h1)!important}
#hwWall .strat-hd.hz-h4{color:var(--hww-h4)!important}
#hwWall .strat-hd.hz-d1{color:var(--hww-d1)!important}
#hwWall .strat-3tf .strat-cell{flex:1 1 auto;justify-content:space-between;gap:6px;padding:5px 8px}
#hwWall .strat-3tf .strat-cell .nm{font-size:10.5px;font-weight:600;flex:0 0 auto}
/* ── SI 裁决: 新元素 ── */
#hwWall .ai-act{font-size:10px;font-weight:700;letter-spacing:.08em;padding:2px 7px;border-radius:5px;
background:rgba(77,124,254,.12);border:1px solid rgba(77,124,254,.24);color:#b9aaff}
#hwWall .ai-watch{margin:6px 0 4px;display:flex;flex-wrap:wrap;gap:5px;align-items:center}
#hwWall .ai-watch .wt{font-size:9px;font-weight:700;letter-spacing:.1em;color:#e0a44a;
background:rgba(224,164,74,.10);border:1px solid rgba(224,164,74,.26);border-radius:5px;padding:1px 6px}
#hwWall .ai-watch .wi{font-size:9.5px;color:#a9b6cc;background:rgba(255,255,255,.03);
border:1px solid rgba(77,124,254,.10);border-radius:5px;padding:2px 7px}
#hwWall .ai-debate{margin-top:6px;display:flex;flex-direction:column;gap:4px}
#hwWall .ai-debate .dbd{font-size:9.5px;line-height:1.5;color:#9fb0c9;padding:5px 8px;border-radius:7px;
background:rgba(255,255,255,.02);border-left:2px solid}
#hwWall .ai-debate .dbd b{display:inline-block;margin-right:6px;font-weight:700}
#hwWall .ai-debate .dbd.bull{border-left-color:#3fd9a0}
#hwWall .ai-debate .dbd.bull b{color:#3fd9a0}
#hwWall .ai-debate .dbd.bear{border-left-color:#ff8fa3}
#hwWall .ai-debate .dbd.bear b{color:#ff8fa3}
#hwWall .ai-ts{font-size:9.5px;color:var(--hw-dim,#5d6878);margin-top:5px}
/* ── GMGN 漏斗 + 死亡门 ── */
#hwWall .gm-funnel{display:flex;align-items:center;justify-content:space-between;gap:6px;
margin:7px 0 5px;padding:7px 9px;border-radius:9px;
background:rgba(77,124,254,.05);border:1px solid rgba(77,124,254,.12)}
#hwWall .gm-funnel .gfl{display:flex;flex-direction:column;align-items:center;gap:2px;flex:1 1 0;min-width:0}
#hwWall .gm-funnel .gk{font-size:8.5px;letter-spacing:.06em;color:var(--hw-dim,#5d6878);white-space:nowrap}
#hwWall .gm-funnel .gv{font-size:14px;font-weight:700;font-variant-numeric:tabular-nums;color:#cdd8ea}
#hwWall .gm-funnel .gv.up{color:var(--hw-up,#35d69c)}
#hwWall .gm-funnel .gfa{color:rgba(77,124,254,.5);font-size:11px;flex:0 0 auto}
#hwWall .gm-gates{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:4px}
#hwWall .gm-gate{display:flex;align-items:center;gap:6px;font-size:9.5px;color:#9fb0c9;
padding:2px 7px;border-radius:6px;background:rgba(255,77,107,.06);border:1px solid rgba(255,77,107,.14)}
#hwWall .gm-gate b{color:#ff8fa3;font-weight:700;font-variant-numeric:tabular-nums}