/* ============================================================
   GOLDEX · UI System v5 —— 交易页「深蓝霓虹」皮肤
   ------------------------------------------------------------
   设计语言：深空蓝黑 + 青 / 紫霓虹辉光，专业加密交易所质感
   · 白天 = 冷白 + 数码蓝（可选）
   · 本文件叠加在 style.css 之后，仅作用于交易页 body[data-page="trade"]
   ============================================================ */

/* ---------- 主题令牌：交易页深蓝（默认 / 暗色） ---------- */
body[data-page="trade"] {
  /* 画布 */
  --bg0: #05070e;
  --bg1: #090d1a;
  --bg2: #0c1120;
  --grid-line: rgba(80, 160, 255, 0.05);

  /* 表面 */
  --panel: rgba(13, 18, 33, 0.82);
  --panel-solid: #0b1120;
  --panel-hi: rgba(130, 170, 255, 0.075);
  --panel2: rgba(255, 255, 255, 0.038);
  --panel3: rgba(255, 255, 255, 0.02);

  /* 边框 */
  --line: rgba(126, 165, 255, 0.13);
  --line2: rgba(160, 185, 255, 0.16);
  --line3: rgba(180, 200, 255, 0.26);

  /* 通用强调（导航 / 激活） */
  --acc: #3ea3ff;
  --acc-hi: #74c6ff;
  --acc-deep: #1b6de0;
  --acc-soft: rgba(62, 163, 255, 0.14);
  --acc-glow: rgba(62, 163, 255, 0.42);

  /* 板块语义色 */
  --metal: #f4c15f;
  --metal2: #ffe1a0;
  --coin: #37c3ff;
  --fut: #a489ff;
  --fut2: #46e0ff;

  /* 文本 */
  --txt: #eaf1ff;
  --txt2: #9ba9c8;
  --txt3: #5e6d95;

  /* 行情涨跌 */
  --up: #12d18c;
  --down: #f64c5f;
  --up-bg: rgba(18, 209, 140, 0.11);
  --down-bg: rgba(246, 76, 95, 0.11);
  --up-brd: rgba(18, 209, 140, 0.38);
  --down-brd: rgba(246, 76, 95, 0.4);

  /* 形状 */
  --radius: 16px;
  --radius-s: 11px;

  --sh-card: 0 26px 64px -30px rgba(0, 0, 0, 0.72), 0 0 0 1px rgba(90, 140, 255, 0.03);
  --sh-pop: 0 22px 60px -20px rgba(0, 0, 0, 0.78);

  /* 页面背景：夜景壁纸（AI 生成的深蓝金流纹理）+ 压暗层 + 氛围光 */
  background:
    radial-gradient(1000px 520px at 92% -10%, rgba(52, 120, 255, 0.16), transparent 62%),
    radial-gradient(900px 520px at -8% -2%, rgba(150, 100, 255, 0.1), transparent 60%),
    radial-gradient(680px 360px at 50% 110%, rgba(30, 220, 255, 0.05), transparent 70%),
    linear-gradient(180deg, rgba(5, 7, 14, 0.66) 0%, rgba(5, 7, 14, 0.8) 55%, rgba(5, 7, 14, 0.92) 100%),
    url('/img/bg-trade-dark.png') center top / cover no-repeat,
    var(--bg0);
  background-attachment: fixed;
}

html[data-theme="light"] body[data-page="trade"] {
  --bg0: #eef3fb;
  --bg1: #e6edf8;
  --bg2: #dbe4f3;
  --grid-line: rgba(20, 90, 220, 0.045);

  --panel: rgba(255, 255, 255, 0.94);
  --panel-solid: #ffffff;
  --panel-hi: rgba(30, 80, 200, 0.055);
  --panel2: rgba(20, 80, 200, 0.045);
  --panel3: rgba(20, 80, 200, 0.025);

  --line: rgba(35, 80, 190, 0.13);
  --line2: rgba(35, 80, 190, 0.16);
  --line3: rgba(30, 80, 200, 0.3);

  --acc: #1d6df0;
  --acc-hi: #3f86ff;
  --acc-deep: #104fc8;
  --acc-soft: rgba(29, 109, 240, 0.11);
  --acc-glow: rgba(29, 109, 240, 0.32);

  --metal: #b9831b;
  --coin: #1680d8;
  --fut: #6b4fe0;
  --fut2: #0f9cc4;

  --txt: #0d1730;
  --txt2: #41517c;
  --txt3: #7c8bad;

  --up: #07a971;
  --down: #e63952;
  --up-bg: rgba(7, 169, 113, 0.1);
  --down-bg: rgba(230, 57, 82, 0.1);
  --up-brd: rgba(7, 169, 113, 0.35);
  --down-brd: rgba(230, 57, 82, 0.36);

  --sh-card: 0 18px 46px -26px rgba(20, 60, 160, 0.26);
  --sh-pop: 0 18px 46px -18px rgba(20, 60, 160, 0.28);

  background:
    radial-gradient(1000px 480px at 92% -10%, rgba(29, 109, 240, 0.1), transparent 60%),
    radial-gradient(820px 460px at -8% 0%, rgba(107, 79, 224, 0.06), transparent 58%),
    linear-gradient(180deg, rgba(238, 243, 251, 0.72) 0%, rgba(246, 249, 253, 0.86) 60%, rgba(241, 245, 252, 0.92) 100%),
    url('/img/bg-trade-light.png') center top / cover no-repeat,
    var(--bg0);
  background-attachment: fixed;
}

/* ================= 顶栏 ================= */
body[data-page="trade"] .topbar {
  height: var(--nav-h);
  background: color-mix(in srgb, var(--bg1) 72%, transparent);
  backdrop-filter: blur(20px) saturate(1.6);
  -webkit-backdrop-filter: blur(20px) saturate(1.6);
  border-bottom: 1px solid var(--line);
  box-shadow: 0 14px 34px -26px rgba(0, 0, 0, 0.8);
}
body[data-page="trade"] .topbar::after {
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(62, 163, 255, 0.55), rgba(164, 137, 255, 0.45), transparent);
  opacity: 0.9;
}

body[data-page="trade"] .logo-badge {
  background: linear-gradient(135deg, #46d0ff, #3a7bff 60%, #9a6bff);
  box-shadow: 0 8px 22px -8px var(--acc-glow), 0 0 0 1px rgba(255, 255, 255, 0.14) inset;
}
html[data-theme="light"] body[data-page="trade"] .logo-badge {
  background: linear-gradient(135deg, #2f86ff, #6b4fe0);
}

/* 板块导航 */
body[data-page="trade"] .mnav-shell {
  padding: 4px;
  background: rgba(5, 9, 22, 0.5);
  border: 1px solid var(--line2);
  border-radius: 13px;
}
html[data-theme="light"] body[data-page="trade"] .mnav-shell { background: rgba(240, 245, 255, 0.6); }
body[data-page="trade"] .nav-tab { font-size: 13px; font-weight: 650; border-radius: 9px; }
body[data-page="trade"] .nav-tab .gi { border-radius: 7px; }
body[data-page="trade"] .nav-tab:hover { background: var(--panel-hi); color: var(--txt); }

body[data-page="trade"] .nav-tab.active[data-g="metal"] {
  color: #ffe3a1;
  background: rgba(244, 193, 95, 0.13);
  border-color: rgba(244, 193, 95, 0.38);
  box-shadow: 0 0 0 1px rgba(244, 193, 95, 0.1) inset, 0 8px 22px -12px rgba(244, 193, 95, 0.5);
}
body[data-page="trade"] .nav-tab.active[data-g="coin"] {
  color: #9adcff;
  background: rgba(55, 195, 255, 0.14);
  border-color: rgba(55, 195, 255, 0.42);
  box-shadow: 0 0 0 1px rgba(55, 195, 255, 0.1) inset, 0 8px 22px -12px rgba(55, 195, 255, 0.55);
}
body[data-page="trade"] .nav-tab.active[data-g="fut"] {
  color: #d4c2ff;
  background: rgba(164, 137, 255, 0.15);
  border-color: rgba(164, 137, 255, 0.42);
  box-shadow: 0 0 0 1px rgba(164, 137, 255, 0.12) inset, 0 8px 22px -12px rgba(164, 137, 255, 0.55);
}
html[data-theme="light"] body[data-page="trade"] .nav-tab.active[data-g="metal"] { color: #8a5a00; background: rgba(185, 131, 27, 0.1); border-color: rgba(185, 131, 27, 0.35); box-shadow: none; }
html[data-theme="light"] body[data-page="trade"] .nav-tab.active[data-g="coin"] { color: #0d63a8; background: rgba(22, 128, 216, 0.1); border-color: rgba(22, 128, 216, 0.35); box-shadow: none; }
html[data-theme="light"] body[data-page="trade"] .nav-tab.active[data-g="fut"] { color: #4a2ec4; background: rgba(107, 79, 224, 0.1); border-color: rgba(107, 79, 224, 0.35); box-shadow: none; }

body[data-page="trade"] .announce {
  color: var(--acc-hi);
  background: rgba(62, 163, 255, 0.1);
  border-color: rgba(62, 163, 255, 0.3);
}
body[data-page="trade"] .demo-pill b { color: var(--acc); }

/* ================= 交易页三栏网格 ================= */
body[data-page="trade"] .trade {
  max-width: 1740px;
  padding: 18px 22px 44px;
  grid-template-columns: 288px minmax(0, 1fr) 382px;
  gap: 16px;
}
@media (max-width: 1560px) {
  body[data-page="trade"] .trade { grid-template-columns: 262px minmax(0, 1fr) 366px; }
}
@media (max-width: 1440px) {
  body[data-page="trade"] .trade { grid-template-columns: 248px minmax(0, 1fr) 350px; }
}

/* ================= 面板外观 ================= */
body[data-page="trade"] .panel {
  background: linear-gradient(180deg, rgba(120, 170, 255, 0.06), transparent 34%), var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--sh-card);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  overflow: hidden;
}
html[data-theme="light"] body[data-page="trade"] .panel {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.75), transparent 30%), var(--panel);
  box-shadow: var(--sh-card);
}
body[data-page="trade"] .panel::before {
  content: "";
  position: absolute;
  top: 0;
  left: 10%;
  right: 10%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(150, 190, 255, 0.55), transparent);
}

/* 左栏：行情列表 */
body[data-page="trade"] .mkts {
  top: calc(var(--nav-h) + 16px);
  max-height: calc(100vh - var(--nav-h) - 34px);
}
body[data-page="trade"] .mkt-hd { padding: 16px 15px 12px; }
body[data-page="trade"] .mkt-search {
  background: rgba(5, 9, 22, 0.55);
  border-color: var(--line2);
  border-radius: 10px;
}
html[data-theme="light"] body[data-page="trade"] .mkt-search { background: var(--panel2); }
body[data-page="trade"] .mkt-search:focus-within {
  border-color: var(--acc);
  box-shadow: 0 0 0 3px var(--acc-soft);
  color: var(--acc);
}
body[data-page="trade"] .mkt-list { padding: 6px 8px 14px; }
body[data-page="trade"] .trow { border-radius: 12px; padding: 9px 10px; }
body[data-page="trade"] .trow:hover { background: var(--panel-hi); }
body[data-page="trade"] .trow.active { border-width: 1px; box-shadow: 0 10px 26px -14px rgba(0, 0, 0, 0.6); }
body[data-page="trade"] .trow .ico { background: var(--panel2); border-color: var(--line2); }
body[data-page="trade"] .trow .pr b { font-weight: 650; }

/* 右栏容器：三张独立卡片自然堆叠 */
body[data-page="trade"] .rail {
  position: relative;
  align-self: start;
  display: grid;
  gap: 16px;
  min-width: 0;
}

/* 下单 / 资产卡片 */
body[data-page="trade"] .ocard { padding: 16px 17px 18px; }
body[data-page="trade"] .ocard::before {
  left: 0;
  right: 0;
  height: 2px;
}
body[data-page="trade"] .o-spot::before {
  background: linear-gradient(90deg, rgba(18, 209, 140, 0.85), rgba(55, 195, 255, 0.65), transparent 74%);
  box-shadow: 0 0 14px -2px rgba(18, 209, 140, 0.6);
}
body[data-page="trade"] .o-fut::before {
  background: linear-gradient(90deg, rgba(164, 137, 255, 0.9), rgba(70, 224, 255, 0.6), transparent 74%);
  box-shadow: 0 0 14px -2px rgba(164, 137, 255, 0.6);
}
body[data-page="trade"] .o-asset::before {
  background: linear-gradient(90deg, rgba(62, 163, 255, 0.8), transparent 60%);
}

/* 卡片头 */
body[data-page="trade"] .ocard-hd {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 13px;
}
body[data-page="trade"] .ocard-tt { display: flex; align-items: center; gap: 10px; min-width: 0; }
body[data-page="trade"] .ocard-ic {
  width: 36px;
  height: 36px;
  border-radius: 11px;
  display: grid;
  place-items: center;
  flex: none;
  font-style: normal;
  font-weight: 800;
  font-size: 14px;
  font-family: var(--num);
}
body[data-page="trade"] .o-spot .ocard-ic {
  color: #27e6a4;
  background: rgba(18, 209, 140, 0.1);
  border: 1px solid rgba(18, 209, 140, 0.35);
  box-shadow: 0 0 20px -6px rgba(18, 209, 140, 0.7);
}
body[data-page="trade"] .o-fut .ocard-ic {
  color: #c7b1ff;
  background: rgba(164, 137, 255, 0.12);
  border: 1px solid rgba(164, 137, 255, 0.38);
  box-shadow: 0 0 20px -6px rgba(164, 137, 255, 0.7);
}
body[data-page="trade"] .o-asset .ocard-ic {
  color: #7cc4ff;
  background: rgba(62, 163, 255, 0.1);
  border: 1px solid rgba(62, 163, 255, 0.34);
}
html[data-theme="light"] body[data-page="trade"] .o-spot .ocard-ic { color: #047a50; background: rgba(7, 169, 113, 0.1); box-shadow: none; }
html[data-theme="light"] body[data-page="trade"] .o-fut .ocard-ic { color: #4a2ec4; background: rgba(107, 79, 224, 0.1); box-shadow: none; }
html[data-theme="light"] body[data-page="trade"] .o-asset .ocard-ic { color: #104fc8; background: rgba(29, 109, 240, 0.1); box-shadow: none; }

body[data-page="trade"] .ocard-tx { min-width: 0; }
body[data-page="trade"] .ocard-tx b {
  display: block;
  font-size: 15.5px;
  font-weight: 750;
  letter-spacing: .3px;
  line-height: 1.15;
  color: var(--txt);
}
body[data-page="trade"] .ocard-tx span {
  display: block;
  margin-top: 3px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .5px;
  color: var(--txt3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body[data-page="trade"] .ocard-tag {
  font-style: normal;
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 1.6px;
  padding: 3.5px 10px;
  border-radius: 999px;
  flex: none;
}
body[data-page="trade"] .t-spot {
  color: var(--up);
  background: var(--up-bg);
  border: 1px solid var(--up-brd);
  text-shadow: 0 0 12px rgba(18, 209, 140, 0.4);
}
body[data-page="trade"] .t-fut {
  color: #c9b6ff;
  background: rgba(164, 137, 255, 0.13);
  border: 1px solid rgba(164, 137, 255, 0.4);
  text-shadow: 0 0 12px rgba(164, 137, 255, 0.45);
}
html[data-theme="light"] body[data-page="trade"] .t-fut { color: #4a2ec4; background: rgba(107, 79, 224, 0.1); border-color: rgba(107, 79, 224, 0.35); text-shadow: none; }

/* 卡片内小标题 / 重置链接 */
body[data-page="trade"] .mini-link { font-size: 11px; color: var(--txt3); }
body[data-page="trade"] .mini-link:hover { color: var(--acc); }

/* ---------- 买卖 / 多空分段按钮 ---------- */
body[data-page="trade"] .seg {
  gap: 6px;
  padding: 4px;
  border-radius: 13px;
  background: rgba(5, 9, 22, 0.6);
  border: 1px solid var(--line2);
}
html[data-theme="light"] body[data-page="trade"] .seg { background: var(--panel2); }
body[data-page="trade"] .seg button {
  font-size: 14px;
  font-weight: 750;
  letter-spacing: 3px;
  padding: 9px 0;
  border-radius: 9px;
  color: var(--txt3);
  transition: background .16s, color .16s, box-shadow .16s, transform .08s;
}
body[data-page="trade"] .seg button:hover { color: var(--txt); }
body[data-page="trade"] .seg button:active { transform: scale(.98); }
body[data-page="trade"] .seg button.on-buy {
  color: #fff;
  background: linear-gradient(135deg, #19d494, #08b576);
  box-shadow: 0 6px 22px -8px rgba(18, 209, 140, 0.7);
  text-shadow: 0 1px 2px rgba(0, 0, 0, .18);
}
body[data-page="trade"] .seg button.on-sell {
  color: #fff;
  background: linear-gradient(135deg, #ff6b7a, #ee3a4f);
  box-shadow: 0 6px 22px -8px rgba(246, 76, 95, 0.7);
  text-shadow: 0 1px 2px rgba(0, 0, 0, .18);
}
html[data-theme="light"] body[data-page="trade"] .seg button.on-buy {
  background: linear-gradient(135deg, #09c27f, #06a468);
  box-shadow: none;
}
html[data-theme="light"] body[data-page="trade"] .seg button.on-sell {
  background: linear-gradient(135deg, #f04f61, #dd3347);
  box-shadow: none;
}

/* ---------- 表单 ---------- */
body[data-page="trade"] .field { margin-top: 13px; }
body[data-page="trade"] .field label { font-size: 11.5px; letter-spacing: .3px; }
body[data-page="trade"] .field label b { color: var(--txt2); font-weight: 650; }
body[data-page="trade"] .input-wrap {
  background: rgba(5, 9, 22, 0.55);
  border-color: var(--line2);
  border-radius: 12px;
}
html[data-theme="light"] body[data-page="trade"] .input-wrap { background: var(--panel2); }
body[data-page="trade"] .input-wrap:focus-within {
  border-color: var(--acc);
  box-shadow: 0 0 0 3px var(--acc-soft);
}
body[data-page="trade"] .input-wrap input { font-size: 17px; padding: 10px 13px; }
body[data-page="trade"] .quick { gap: 6px; }
body[data-page="trade"] .quick button {
  border-radius: 8px;
  border-color: var(--line2);
  background: var(--panel2);
  font-size: 11px;
  font-weight: 650;
  padding: 6px 0;
  transition: .15s;
}
body[data-page="trade"] .quick button:hover {
  color: #fff;
  border-color: var(--acc);
  background: var(--acc);
  box-shadow: 0 4px 14px -6px var(--acc-glow);
}
html[data-theme="light"] body[data-page="trade"] .quick button:hover { color: #fff; }

/* 杠杆 */
body[data-page="trade"] .lev-block { margin-top: 14px; }
body[data-page="trade"] .lev-top { font-size: 11.5px; }
body[data-page="trade"] .lev-top b { color: #c9b6ff; }
body[data-page="trade"] .lev-pill {
  border-radius: 8px;
  border-color: var(--line2);
  background: var(--panel2);
  font-size: 11px;
  font-weight: 700;
  transition: .14s;
}
body[data-page="trade"] .lev-pill:hover { color: #d0bdff; border-color: rgba(164, 137, 255, 0.55); background: rgba(164, 137, 255, 0.12); }
body[data-page="trade"] .lev-pill.on {
  color: #fff;
  background: linear-gradient(135deg, #a489ff, #7f63f0);
  border-color: transparent;
  box-shadow: 0 5px 16px -6px rgba(164, 137, 255, 0.7);
}
html[data-theme="light"] body[data-page="trade"] .lev-pill.on { background: linear-gradient(135deg, #6b4fe0, #8357ff); box-shadow: none; }
body[data-page="trade"] .lev-range input[type=range] { accent-color: #a489ff; }
body[data-page="trade"] .lev-range .lval { color: #c9b6ff; font-weight: 800; }

/* 预估面板 */
body[data-page="trade"] .est-panel {
  margin-top: 14px;
  background: rgba(5, 9, 22, 0.45);
  border: 1px solid var(--line2);
  border-radius: 12px;
  padding: 11px 13px;
}
html[data-theme="light"] body[data-page="trade"] .est-panel { background: var(--panel2); }
body[data-page="trade"] .est-row { font-size: 11.5px; }
body[data-page="trade"] .est-row span { color: var(--txt3); }
body[data-page="trade"] .est-row b { font-size: 12.5px; color: var(--txt); }
body[data-page="trade"] .est-row .dng { color: var(--down); }
body[data-page="trade"] .est-row .gl { color: #c9b6ff; }
body[data-page="trade"] .est-row .ok { color: var(--up); }

/* 下单大按钮 */
body[data-page="trade"] .trade-btn {
  margin-top: 16px;
  padding: 14px 0;
  border-radius: 13px;
  font-size: 15px;
  letter-spacing: 2px;
  transition: filter .15s, transform .1s, box-shadow .18s;
}
body[data-page="trade"] .trade-btn:hover { filter: brightness(1.07); }
body[data-page="trade"] .trade-btn:active { transform: scale(.985); }
body[data-page="trade"] .trade-btn.buy, body[data-page="trade"] .trade-btn.long {
  background: linear-gradient(135deg, #1fd497, #0cbb79);
  box-shadow: 0 12px 30px -12px rgba(18, 209, 140, 0.65);
}
body[data-page="trade"] .trade-btn.sell, body[data-page="trade"] .trade-btn.short {
  background: linear-gradient(135deg, #ff6f7c, #f03b4f);
  box-shadow: 0 12px 30px -12px rgba(246, 76, 95, 0.65);
}
body[data-page="trade"] .trade-btn.long { background: linear-gradient(135deg, #24e09a, #0abf7d); }
html[data-theme="light"] body[data-page="trade"] .trade-btn { text-shadow: none; }

/* 合约暂停提示 */
body[data-page="trade"] .fut-off {
  margin-bottom: 12px;
  font-size: 11.5px;
  border-radius: 11px;
  padding: 8px 11px;
  gap: 7px;
}

/* 资产卡 */
body[data-page="trade"] .o-asset .ocard-hd { margin-bottom: 6px; }
body[data-page="trade"] .asset-hero { align-items: flex-end; }
body[data-page="trade"] .ah-k { letter-spacing: .9px; font-size: 10.5px; }
body[data-page="trade"] .ah-k em { font-size: 9px; letter-spacing: 1.6px; }
body[data-page="trade"] .equity {
  font-size: 31px;
  font-weight: 800;
  letter-spacing: .4px;
  background: linear-gradient(90deg, #fff, #bcd6ff);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
html[data-theme="light"] body[data-page="trade"] .equity {
  background: linear-gradient(90deg, #0d1730, #2b5fd0);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
body[data-page="trade"] .asset-grid { grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; }
body[data-page="trade"] .ai {
  background: rgba(5, 9, 22, 0.4);
  border-color: var(--line2);
  border-radius: 11px;
  padding: 9px 12px;
}
html[data-theme="light"] body[data-page="trade"] .ai { background: var(--panel2); }
body[data-page="trade"] .ai .k { font-size: 9.5px; letter-spacing: .5px; }
body[data-page="trade"] .ai .v { font-size: 15px; font-weight: 750; }
body[data-page="trade"] .asset-ft { margin-top: 11px; padding-top: 10px; }

/* ================= 中栏：报价头 / 图表 ================= */
body[data-page="trade"] .mid { padding-bottom: 8px; }
body[data-page="trade"] .quote-head { padding: 20px 22px 14px; }
body[data-page="trade"] .cur-line b { font-size: 17px; }
body[data-page="trade"] .ctag {
  width: 28px;
  height: 28px;
  border-radius: 9px;
  font-size: 11px;
  border-color: var(--line2);
  box-shadow: 0 0 0 1px rgba(120, 170, 255, 0.12) inset;
}
body[data-page="trade"] .vsym {
  color: #9adcff;
  border-color: rgba(55, 195, 255, 0.4);
  background: rgba(55, 195, 255, 0.08);
  font-weight: 750;
}
html[data-theme="light"] body[data-page="trade"] .vsym { color: #0d63a8; background: rgba(22, 128, 216, 0.08); border-color: rgba(22, 128, 216, 0.3); }
body[data-page="trade"] .big-price { font-size: 44px; font-weight: 800; }
body[data-page="trade"] .big-price .unit { font-size: 13px; font-weight: 600; }
body[data-page="trade"] .mini-stats .ms b { font-weight: 700; }
body[data-page="trade"] .chart-box { border-top: 1px solid var(--line); }

/* 现货持仓横条 */
body[data-page="trade"] .band {
  margin: 0 18px;
  padding: 14px 4px;
  border-color: var(--line);
  background: linear-gradient(90deg, rgba(55, 195, 255, 0.04), transparent 55%);
}
body[data-page="trade"] .band-l span { letter-spacing: 1.5px; }
body[data-page="trade"] .band-l b { font-size: 15.5px; }
body[data-page="trade"] .bcell b { font-size: 16px; }
body[data-page="trade"] .bcell .mb { background: var(--panel-hi); }
body[data-page="trade"] .bcell .mb i {
  background: linear-gradient(90deg, #2f86ff, #46e0ff);
  box-shadow: 0 0 10px rgba(55, 195, 255, 0.6);
}

/* 合约持仓区 */
body[data-page="trade"] .ft-wrap { margin: 0 18px 8px; }
body[data-page="trade"] .ft-sum .fpill { border-color: var(--line2); background: var(--panel3); }
body[data-page="trade"] .ft-sum .fpill.gl { color: #c9b6ff; border-color: rgba(164, 137, 255, 0.4); }
body[data-page="trade"] .ft-cols span { font-size: 9.5px; }
body[data-page="trade"] .ft-row { border-radius: 12px; }
body[data-page="trade"] .ft-close { border-radius: 9px; }

/* 区块标题 / 成交表 */
body[data-page="trade"] .sec-head { padding: 16px 20px 10px; font-size: 13.5px; }
body[data-page="trade"] .sq {
  width: 3px;
  height: 14px;
  background: linear-gradient(180deg, #46e0ff, #a489ff);
  box-shadow: 0 0 12px rgba(55, 195, 255, 0.8);
}
body[data-page="trade"] .mini-seg button.on { background: linear-gradient(135deg, #2f86ff, #a489ff); }
html[data-theme="light"] body[data-page="trade"] .mini-seg button.on { color: #fff; background: linear-gradient(135deg, #1d6df0, #6b4fe0); }
body[data-page="trade"] .mini-seg button.on.fut { background: linear-gradient(135deg, #a489ff, #7f63f0); }
body[data-page="trade"] .tbl th {
  font-size: 10px;
  letter-spacing: 1.2px;
  padding: 10px 12px;
  color: var(--txt3);
}
body[data-page="trade"] .tbl td { padding: 10px 12px; }
body[data-page="trade"] .tbl tbody tr:hover { background: var(--panel-hi); }

/* ================= 页脚 ================= */
body[data-page="trade"] .site-ft { font-size: 11px; letter-spacing: .2px; }

/* ================= 响应式：窄屏单列时右栏恢复常规滚动 ================= */
@media (max-width: 1240px) {
  body[data-page="trade"] .trade { grid-template-columns: 1fr; }
  body[data-page="trade"] .rail { grid-template-columns: 1fr 1fr; }
  body[data-page="trade"] .rail .o-asset { grid-column: 1 / -1; }
  body[data-page="trade"] .mkts { position: static; max-height: none; }
}
@media (max-width: 700px) {
  body[data-page="trade"] .rail { grid-template-columns: 1fr; }
  body[data-page="trade"] .trade { padding: 10px; gap: 12px; }
  body[data-page="trade"] .quote-head { padding: 16px 15px 12px; }
  body[data-page="trade"] .big-price { font-size: 34px; }
  body[data-page="trade"] .band { margin: 0 12px; }
}