/* core/term.css — 量化终端组件系统（源自视频原型 polymarket-terminal 的视觉语言）
   设计要点：等宽字体 · ◆ 面板头（大写字母距）· 网格底纹 · 紧凑高密度 · 绿/红/琥珀/青语义色
   复用全站 token（--bg/--panel/--line/--accent/--up/--down/--muted/--txt），并补充终端专属色。
   仅使用独立类名（.term-* / .fd-card 复用），不与 style.css 既有 .panel 冲突（见底部全局统一规则）。 */

:root{
  /* 终端专属扩展 token（在全局 token 之上补充视频原型配色） */
  --t-mono: ui-monospace, "JetBrains Mono", "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;
  --t-dim:#5a6474; --t-dim2:#7c8798;
  --t-green:#35e07a; --t-red:#ff4d4d; --t-amber:#ffb224; --t-cyan:#3fe0ff; --t-blue:#5b8cff;
  --t-line:rgba(125,165,215,.12); --t-line2:rgba(125,165,215,.18);
  --t-panel:var(--panel, #0d141e);   /* 【20260928】白叠加→深蓝黑（与全站统一） */
  --t-up:var(--up, #4ade80); --t-down:var(--down, #f87171);
}

/* ---------- 页面容器 ---------- */
.term-page{ max-width:1400px; margin:0 auto; padding:18px 16px 44px; }
.term-hd{ margin:6px 0 16px; }
.term-hd .lbl{ font-family:var(--t-mono); font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:var(--accent); }
.term-hd h1{ font-size:22px; font-weight:800; letter-spacing:-.01em; margin:4px 0 2px; display:flex; align-items:center; gap:12px; }
.term-hd .sub{ color:var(--muted); font-size:12px; }

/* ---------- KPI 条 ---------- */
.term-strip{ display:grid; grid-template-columns:repeat(6,1fr); gap:10px; margin-bottom:16px; }
@media (max-width:1080px){ .term-strip{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:620px){ .term-strip{ grid-template-columns:repeat(2,1fr); } }
.term-kpi{ position:relative; border:1px solid var(--t-line); border-radius:12px;
  background:linear-gradient(180deg, var(--panel2, #121b27), var(--panel, #0d141e));
  box-shadow:inset 0 1px 0 rgba(125,165,215,.07), 0 10px 26px -20px rgba(0,0,0,.6);
  padding:11px 13px; overflow:hidden; }
.term-kpi::after{ content:""; position:absolute; inset:0; pointer-events:none; opacity:.35;
  background-image:linear-gradient(rgba(125,165,215,.05) 1px, transparent 1px),
                   linear-gradient(90deg, rgba(125,165,215,.05) 1px, transparent 1px);
  background-size:22px 22px; -webkit-mask-image:radial-gradient(120% 120% at 50% 0%, #000 30%, transparent 75%);
          mask-image:radial-gradient(120% 120% at 50% 0%, #000 30%, transparent 75%); }
.term-kpi .k{ font-family:var(--t-mono); font-size:9px; letter-spacing:.16em; text-transform:uppercase; color:var(--t-dim2); }
.term-kpi .v{ font-family:var(--t-mono); font-size:22px; font-weight:700; color:#fff; letter-spacing:-.02em;
  font-variant-numeric:tabular-nums; line-height:1.15; margin-top:3px; text-shadow:0 0 16px rgba(var(--accent-rgb),.22); }
.term-kpi .v.ac{ color:var(--accent); }
.term-kpi .s{ font-family:var(--t-mono); font-size:10px; color:var(--muted); margin-top:2px; }
.term-kpi .s.up{ color:var(--t-green); } .term-kpi .s.down{ color:var(--t-red); }

/* ---------- 终端面板（◆ 头 + 网格底纹 + 等宽） ---------- */
.term-panel{ position:relative; border:1px solid var(--t-line); border-radius:12px;
  background:linear-gradient(180deg, var(--panel2, #121b27), var(--panel, #0d141e));
  box-shadow:inset 0 1px 0 rgba(125,165,215,.07), 0 12px 34px -22px rgba(0,0,0,.65);
  overflow:hidden; margin-bottom:14px; }
.term-panel::before{ content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:linear-gradient(rgba(125,165,215,.05) 1px, transparent 1px),
                   linear-gradient(90deg, rgba(125,165,215,.05) 1px, transparent 1px);
  background-size:22px 22px; -webkit-mask-image:radial-gradient(120% 120% at 50% 0%, #000 22%, transparent 80%);
          mask-image:radial-gradient(120% 120% at 50% 0%, #000 22%, transparent 80%); }
.term-panel > *{ position:relative; }
/* 【20261007b P0】面板标题与其他页（.panel h3）对齐：sans 13px/600 常规字距，
   不再走 mono 10px 大写（用户反馈"费率终端的标题又细又小、和其他页不一致"）。 */
.term-panel > .p-h{ display:flex; align-items:center; justify-content:space-between; gap:10px;
  font-family:var(--font); font-size:13px; font-weight:600; letter-spacing:.01em; text-transform:none; color:var(--txt-80);
  border-bottom:1px solid var(--t-line); padding:9px 12px; background:rgba(125,165,215,.04); }
.term-panel > .p-h .mk{ color:var(--accent); margin-right:8px; }
.term-panel > .p-h b{ color:var(--muted); font-weight:500; letter-spacing:.01em; text-transform:none; }
.term-panel > .p-h .sp{ flex:1; min-width:6px; }
.term-panel > .p-h .meta{ color:var(--t-dim2); font-size:11px; font-weight:400; letter-spacing:.02em; }
.term-body{ padding:12px; }

/* ---------- 双栏网格 ---------- */
.term-grid{ display:grid; grid-template-columns:1.15fr 1fr; gap:14px; margin-bottom:14px; }
@media (max-width:1000px){ .term-grid{ grid-template-columns:1fr; } }

/* ---------- KV 键值表（视频 METRICS 风格） ---------- */
.term-kv{ display:grid; grid-template-columns:auto 1fr; gap:3px 12px; font-family:var(--t-mono); font-size:11px; }
.term-kv > div:nth-child(odd){ color:var(--t-dim2); letter-spacing:.04em; text-transform:uppercase; font-size:9px; }
.term-kv > div:nth-child(even){ color:var(--txt); text-align:right; font-variant-numeric:tabular-nums; }

/* ---------- 梯级盘口表（视频 order ladder 风格） ---------- */
.term-lad{ width:100%; border-collapse:collapse; font-family:var(--t-mono); font-size:10px; }
.term-lad td{ padding:2px 8px; white-space:nowrap; border-bottom:1px solid rgba(125,165,215,.07); }
.term-lad td:nth-child(1){ color:var(--muted); width:42%; }
.term-lad td:nth-child(2){ text-align:right; width:30%; font-variant-numeric:tabular-nums; }
.term-lad td:nth-child(3){ text-align:right; color:var(--t-dim2); width:28%; font-variant-numeric:tabular-nums; }
.term-lad .ask{ color:var(--t-red); } .term-lad .bid{ color:var(--t-green); }
.term-lad .mid td{ color:#fff; background:rgba(125,165,215,.09); font-weight:700; }
.term-lad .z-bar{ position:relative; height:100%; }
.term-lad tr{ position:relative; }
.term-lad tr .depth{ position:absolute; top:0; bottom:0; right:0; opacity:.12; pointer-events:none; }
.term-lad .ask .depth{ background:var(--t-red); } .term-lad .bid .depth{ background:var(--t-green); }

/* ---------- 紧凑数据表（◆ 面板内通用表） ---------- */
.term-tbl{ width:100%; border-collapse:separate; border-spacing:0; font-family:var(--t-mono); font-size:11px; }
.term-tbl thead th{ position:sticky; top:0; z-index:2; background:var(--panel, #0d141e);   /* 【20260928】表头→深蓝面板色（0918 的纯黑表头在新主题下抹平了表头/表体层次） */
  font-size:9px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--t-dim2);
  padding:8px 12px; border-bottom:1px solid var(--t-line); text-align:left; white-space:nowrap; }
.term-tbl thead th.s{ cursor:pointer; user-select:none; }
.term-tbl thead th.s:hover{ color:var(--txt); }
.term-tbl thead th .ar{ color:var(--accent); margin-left:4px; }
.term-tbl td{ padding:7px 12px; border-bottom:1px solid rgba(125,165,215,.08); font-variant-numeric:tabular-nums; white-space:nowrap; }
.term-tbl tbody tr:hover{ background:rgba(var(--accent-rgb),.04); }
.term-tbl td.r, .term-tbl th.r{ text-align:right; }
.term-tbl .sym{ font-weight:700; } .term-tbl .ex{ color:var(--muted); } .term-tbl .idx{ color:var(--t-dim2); }
.term-tbl .up{ color:var(--t-green); } .term-tbl .down{ color:var(--t-red); }

/* ---------- 图表画布容器 ---------- */
.term-canvas{ display:block; width:100%; }
.term-canvas.h160{ height:160px; } .term-canvas.h200{ height:200px; } .term-canvas.h120{ height:120px; }
.term-axis{ display:flex; justify-content:space-between; font-family:var(--t-mono); font-size:9px; color:var(--t-dim2);
  letter-spacing:.04em; padding:2px 2px 0; }

/* ---------- LIVE 徽标（视频 LIVE FEED 风格） ---------- */
.term-live{ display:inline-flex; align-items:center; gap:7px; font-family:var(--t-mono); font-size:9px; font-weight:700;
  letter-spacing:.18em; color:var(--t-green); border:1px solid var(--t-green); padding:2px 8px; border-radius:3px;
  animation:termblink 1.6s steps(1) infinite; }
.term-live::before{ content:"● "; font-size:8px; }
@keyframes termblink{ 50%{ opacity:.35; } }
.term-clock{ font-family:var(--t-mono); font-size:11px; font-weight:700; letter-spacing:.08em; color:var(--txt); }

/* ---------- 控件（筛选/分段） ---------- */
.term-bar{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:0 0 12px; }
.term-bar .lbl{ font-family:var(--t-mono); font-size:10px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--t-dim2); }
.term-bar .sp{ flex:1; min-width:6px; }
.term-bar .stat{ font-family:var(--t-mono); font-size:11px; color:var(--muted); font-variant-numeric:tabular-nums; }
/* 【20260922 控价统一】原来两处都写 background:var(--panel2) —— HUD 皮肤把 --panel2
   重定义成 rgba(255,255,255,.04)（4% 白），压在纯黑底上就是「全透明、看不清」。
   统一改用不透明控件底色令牌 --ctl-bg + 中性边框 --ctl-line（与「帮助与反馈」浮层同源）。 */
.term-bar input[type=search]{ min-width:150px; background:var(--ctl-bg); border:1px solid var(--ctl-line); color:var(--txt);
  border-radius:8px; padding:6px 10px; font-family:var(--t-mono); font-size:12px; }
.term-bar select{ background:var(--ctl-bg); border:1px solid var(--ctl-line); color:var(--txt); border-radius:12px; padding:6px 10px;
  font-family:var(--t-mono); font-size:12px; }
.term-seg{ display:inline-flex; border:1px solid var(--t-line); border-radius:8px; overflow:hidden; }
.term-seg button{ height:28px; padding:0 10px; background:transparent; border:0; color:var(--muted);
  font:600 11px var(--t-mono); letter-spacing:.06em; text-transform:uppercase; cursor:pointer; }
.term-seg button + button{ border-left:1px solid var(--t-line); }
.term-seg button.on{ background:var(--accent-weak); color:var(--accent); }
.term-btn{ height:28px; padding:0 12px; background:var(--panel2); border:1px solid var(--line); color:var(--txt);
  border-radius:8px; font:600 11px var(--t-mono); letter-spacing:.06em; cursor:pointer; }
.term-btn:hover{ border-color:var(--accent); }

/* ---------- 全站面板头（【20260919】按用户反馈重做） ----------
   原实现用 !important 把标题压成 11px 大写等宽字，并注入 .panel > h3::before{content:"◆"}。
   问题：标题若是 flex 行（例如「标题 …… 右侧折叠箭头」的 space-between 三段式），该伪元素会被
   当作**第 3 个 flex item**参与分配 —— 标题于是被挤到居中或靠右，同一页不同面板表现还不一致。
   现改为：只保留极轻的字距，字号/大小写/字体交给各页自己的样式；不再注入任何伪元素。 */
.panel > h3{ letter-spacing:.01em; }
/* 保留 panel 头内徽标/计数/右侧元信息的等宽可读性（不再是 10.5px 的极小字） */
.panel > h3 .cnt, .panel > h3 .rt, .panel > h3 .cal, .panel > h3 .cal-btn{ font-family:var(--t-mono);
  font-size:12px !important; color:var(--muted); }

/* 全站滚动条统一（已在 style.css 定义，这里确保内容表一致） */
.term-tblwrap{ overflow:auto; max-height:620px; }
.term-note{ font-family:var(--t-mono); font-size:10px; color:var(--t-dim2); padding:8px 12px; border-top:1px solid var(--t-line); }

@media (max-width:680px){
  .term-hd h1{ font-size:18px; }
  .term-kpi .v{ font-size:20px; }
}