/* ==========================================================
   XAUAD 设计系统 v3 —— 母题「金锭铸型 · Bullion Cast」
   核心元素：梯形切角(金锭轮廓) + 精密刻度尺 + 金银双金属
   ========================================================== */
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}

/* ---------- 六套主题 ---------- */
:root,[data-theme="gold"]{
  --bg:#0a0a0c; --bg2:#101014; --panel:#14141a; --panel2:#1b1b22; --line:#282830;
  --tx:#ece9e3; --tx2:#9a9689; --tx3:#63605a;
  --accent:#d9a826; --accent2:#f2cd6a; --accent-dk:#2a2008; --accent-soft:#231b06;
  --up:#22b573; --dn:#e04b4b; --on-accent:#17130a; --shadow:0 18px 40px -24px rgba(0,0,0,.9);
}
[data-theme="abyss"]{
  --bg:#060d16; --bg2:#0a1420; --panel:#0d1826; --panel2:#13212f; --line:#1c2e42;
  --tx:#e2eef8; --tx2:#89a3bb; --tx3:#5b7385;
  --accent:#33bcd8; --accent2:#6fd9ee; --accent-dk:#062430; --accent-soft:#07202b;
  --up:#22b573; --dn:#e04b4b; --on-accent:#031014; --shadow:0 18px 40px -24px rgba(0,0,0,.9);
}
[data-theme="jade"]{
  --bg:#07110e; --bg2:#0a1714; --panel:#0d1c17; --panel2:#122620; --line:#1d332b;
  --tx:#e5efe9; --tx2:#8fa89d; --tx3:#5f7a70;
  --accent:#d9b44a; --accent2:#eecd76; --accent-dk:#251f08; --accent-soft:#1c1a08;
  --up:#2bbd82; --dn:#dd4b4b; --on-accent:#14120a; --shadow:0 18px 40px -24px rgba(0,0,0,.9);
}
[data-theme="cinnabar"]{
  --bg:#120b09; --bg2:#1a100d; --panel:#1f1512; --panel2:#291d19; --line:#3a2723;
  --tx:#f5e9e4; --tx2:#b6978d; --tx3:#8a6c63;
  --accent:#e2603c; --accent2:#f28d6d; --accent-dk:#2e1209; --accent-soft:#26100a;
  --up:#28b57a; --dn:#e0442f; --on-accent:#1a0a05; --shadow:0 18px 40px -24px rgba(0,0,0,.9);
}
[data-theme="nebula"]{
  --bg:#0b0813; --bg2:#120d1c; --panel:#170f24; --panel2:#1f1630; --line:#2d2244;
  --tx:#ece6f6; --tx2:#a294bd; --tx3:#6f6390;
  --accent:#a06ce8; --accent2:#c49bf5; --accent-dk:#231040; --accent-soft:#1c0f30;
  --up:#2ebd82; --dn:#e04b6a; --on-accent:#100720; --shadow:0 18px 40px -24px rgba(0,0,0,.9);
}
[data-theme="platinum"]{
  --bg:#f4f5f7; --bg2:#eceef1; --panel:#ffffff; --panel2:#f7f8fa; --line:#dfe3e9;
  --tx:#11151c; --tx2:#5e6774; --tx3:#8b95a3;
  --accent:#1a6ef5; --accent2:#4b93ff; --accent-dk:#e4edff; --accent-soft:#eef4ff;
  --up:#0f9d58; --dn:#d93025; --on-accent:#ffffff; --shadow:0 14px 32px -20px rgba(15,23,42,.35);
}

body{background:var(--bg);color:var(--tx);margin:0;
  font:13px/1.45 "Segoe UI","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  height:100vh;height:100dvh;overflow:hidden;display:flex;flex-direction:column;
  -webkit-font-smoothing:antialiased}
.num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}
.up{color:var(--up)} .dn{color:var(--dn)} .ac{color:var(--accent)}
.mut{color:var(--tx2)} .mut3{color:var(--tx3)}
.hide{display:none!important}
a{color:inherit;text-decoration:none}

/* ---------- 金锭切角：所有容器的基础形 ---------- */
.bev{--b:9px;
  clip-path:polygon(var(--b) 0,100% 0,100% calc(100% - var(--b)),
    calc(100% - var(--b)) 100%,0 100%,0 var(--b))}
.bev-s{--b:6px}

/* ---------- 顶栏 ---------- */
.hd{background:var(--bg2);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:40}
.hd .in{display:flex;align-items:center;gap:4px;height:52px;padding:0 10px;max-width:1680px;margin:0 auto}

/* 金锭 logo */
.logo{display:flex;align-items:center;gap:8px;flex:none;padding-right:10px}
/* 2026-10-16：品牌标记统一成站内同款金底 X（之前是个无样式的裸字母 A）*/
.logo .mark{width:26px;height:26px;background:var(--gold,#d9a826);display:grid;place-items:center;flex:none}

.logo .bt{font:700 15px/1 "Segoe UI",sans-serif;letter-spacing:.14em}
.logo .bs{font-size:9px;letter-spacing:.24em;color:var(--tx3);display:block;margin-top:3px}

/* ---------- 资产条（横排卡片，带赔付率） ---------- */
.assets{display:flex;gap:6px;overflow-x:auto;flex:1;scrollbar-width:none;padding:6px 2px}
.assets::-webkit-scrollbar{display:none}
.acard{flex:none;min-width:132px;background:var(--panel);border:1px solid var(--line);
  padding:5px 10px 6px;position:relative;cursor:pointer}
.acard.on{border-color:var(--accent);background:var(--accent-soft)}
.acard.on:before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--accent)}
.acard .n{font-size:12px;font-weight:700;letter-spacing:.02em}
.acard .p{font-size:11px;color:var(--tx2);margin-top:1px}
.acard .y{position:absolute;right:8px;top:5px;font-size:11px;font-weight:700;color:var(--accent)}
.acard.off{opacity:.4;cursor:not-allowed}

.hdr-r{display:flex;align-items:center;gap:6px;flex:none}
.kv{background:var(--panel);border:1px solid var(--line);padding:4px 9px;line-height:1.25;text-align:right}
.kv .l{font-size:9px;letter-spacing:.14em;color:var(--tx3)}
.kv .v{font-size:13px;font-weight:700}

/* ---------- 主题切换（手机也可见） ---------- */
.themes{display:flex;gap:4px;align-items:center;padding:3px 6px;background:var(--panel);
  border:1px solid var(--line)}
.themes b{width:14px;height:14px;border-radius:50%;cursor:pointer;display:block;
  border:2px solid transparent;transition:transform .12s}
.themes b.on{border-color:var(--tx);transform:scale(1.18)}
.themes b:hover{transform:scale(1.18)}

.btn{background:var(--accent);color:var(--on-accent);border:0;padding:7px 13px;font-size:12px;
  font-weight:700;cursor:pointer;letter-spacing:.02em}
.btn.gh{background:transparent;color:var(--tx);border:1px solid var(--line)}
.btn.sm{padding:6px 10px;font-size:11px}

/* ---------- 主区 ---------- */
.main{display:flex;flex:1;min-height:0;max-width:1680px;width:100%;margin:0 auto}
.chartwrap{flex:1;position:relative;min-width:0;background:var(--bg2)}

/* 图上浮条 */
.cbar{position:absolute;left:0;right:0;top:0;z-index:6;display:flex;align-items:center;gap:6px;
  padding:7px 10px;background:linear-gradient(180deg,var(--bg2),transparent);pointer-events:none}
.cbar>*{pointer-events:auto}
.sym{font-weight:700;font-size:13px;letter-spacing:.03em}
.bigpx{font-size:19px;font-weight:700;line-height:1}
.seg{display:flex;gap:3px;background:var(--panel);border:1px solid var(--line);padding:2px}
.seg button{background:transparent;border:0;color:var(--tx2);font-size:11px;padding:4px 8px;cursor:pointer;
  font-weight:600;font-family:inherit}
.seg button.on{background:var(--accent);color:var(--on-accent)}
#lv{position:absolute;inset:0}

/* ---------- 下单栏（窄） ---------- */
.pad{width:236px;flex:none;background:var(--bg2);border-left:1px solid var(--line);
  display:flex;flex-direction:column;overflow-y:auto}
.blk{border-bottom:1px solid var(--line);padding:10px}
.blk .lab{font-size:9px;letter-spacing:.18em;color:var(--tx3);margin-bottom:6px;text-transform:uppercase}
.mode{display:flex;gap:0;border:1px solid var(--line)}
.mode button{flex:1;background:transparent;border:0;color:var(--tx2);font-size:11px;padding:7px 0;
  cursor:pointer;font-weight:700;font-family:inherit}
.mode button.on{background:var(--accent);color:var(--on-accent)}

.amt{display:flex;gap:5px;align-items:stretch}
.amt input{flex:1;min-width:0;background:var(--panel);border:1px solid var(--line);color:var(--tx);
  font:700 17px/1 inherit;text-align:center;padding:9px 6px;font-variant-numeric:tabular-nums}
.amt .st{display:flex;flex-direction:column;gap:4px}
.amt .st button{width:34px;height:20px;background:var(--panel);border:1px solid var(--line);
  color:var(--tx);cursor:pointer;font-weight:700;font-family:inherit;line-height:1}
.qs{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-top:7px}
.qs button{background:var(--panel);border:1px solid var(--line);color:var(--tx2);padding:5px 0;
  font-size:11px;cursor:pointer;font-family:inherit;font-weight:600}
.qs button:hover{border-color:var(--accent);color:var(--tx)}

.exp{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.exp button{background:var(--panel);border:1px solid var(--line);color:var(--tx2);padding:6px 0;
  font-size:11px;cursor:pointer;font-family:inherit;font-weight:600}
.exp button.on{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}

/* 收益区：刻度风格 */
.pay{background:var(--panel);border:1px solid var(--line);padding:9px 10px;position:relative;overflow:hidden}
.pay:before{content:"";position:absolute;left:0;right:0;top:0;height:5px;
  background:repeating-linear-gradient(90deg,var(--line) 0 1px,transparent 1px 7px)}
.pay .r{display:flex;justify-content:space-between;align-items:baseline;font-size:12px;padding:2px 0}
.pay .r b{font-size:15px;font-variant-numeric:tabular-nums}
.pay .big{font-size:30px;font-weight:800;color:var(--accent);line-height:1.05;
  font-variant-numeric:tabular-nums;letter-spacing:-.01em}

/* 涨跌双按钮 */
.go{padding:10px;display:grid;gap:8px;margin-top:auto}
.go button{position:relative;border:0;padding:15px 12px;cursor:pointer;text-align:left;
  font-family:inherit;overflow:hidden}
.go button .d{font-size:15px;font-weight:800;letter-spacing:.1em;display:block}
.go button .s{font-size:10px;opacity:.8;letter-spacing:.06em}
.go .bup{background:var(--up);color:#fff}
.go .bdn{background:var(--dn);color:#fff}
.go button:disabled{opacity:.45;cursor:not-allowed}
.go button:after{content:"";position:absolute;right:-6px;bottom:-10px;width:46px;height:46px;
  border:3px solid rgba(255,255,255,.22);transform:rotate(45deg)}

/* ---------- 持仓（底部抽屉条） ---------- */
.pos{background:var(--bg2);border-top:1px solid var(--line);padding:8px 10px;display:flex;gap:8px;
  overflow-x:auto;scrollbar-width:none;min-height:56px;align-items:center}
.pos::-webkit-scrollbar{display:none}
.pcard{flex:none;min-width:212px;background:var(--panel);border:1px solid var(--line);padding:7px 9px}
.pcard .t{display:flex;justify-content:space-between;font-size:11px;font-weight:700}
.pcard .bar{height:3px;background:var(--line);margin:6px 0 5px;position:relative;overflow:hidden}
.pcard .bar i{position:absolute;left:0;top:0;bottom:0;background:var(--accent)}
.pcard .m{display:flex;justify-content:space-between;font-size:11px;color:var(--tx2)}
.pcard .m b{font-variant-numeric:tabular-nums}

/* ---------- 弹窗 / toast ---------- */
.mask{position:fixed;inset:0;background:rgba(0,0,0,.72);display:grid;place-items:center;z-index:90;padding:16px}
.dlg{background:var(--panel);border:1px solid var(--line);padding:20px;width:100%;max-width:346px}
.dlg h3{font-size:16px;margin-bottom:3px;letter-spacing:.02em}
.dlg p.s{font-size:11px;color:var(--tx2);margin-bottom:14px}
.dlg input{width:100%;background:var(--bg);border:1px solid var(--line);color:var(--tx);
  padding:10px;margin-bottom:9px;font-size:13px;font-family:inherit}
.dlg .cat{font-size:11px;color:var(--accent);margin-top:10px;cursor:pointer;display:inline-block}
.err{color:var(--dn);font-size:11px;min-height:15px;margin-top:6px}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:90px;background:var(--panel);
  border:1px solid var(--line);border-left:3px solid var(--accent);padding:10px 16px;font-size:12px;
  z-index:99;box-shadow:var(--shadow)}

/* ---------- 手机：满屏图表 + 底部下单条 ---------- */
@media(max-width:900px){
  .hd .in{height:46px;gap:2px}
  .logo .bs{display:none}
  .main{flex-direction:column}
  .pad{width:100%;border-left:0;border-top:1px solid var(--line);flex:none;
    display:grid;grid-template-columns:1fr 1fr;gap:0;max-height:none;overflow:visible}
  .pad .blk{padding:8px}
  .pad .blk.mode-b{grid-column:1/3;border-bottom:1px solid var(--line)}
  .pad .blk.pay-b{grid-column:1/3}
  .go{grid-column:1/3;grid-template-columns:1fr 1fr;padding:8px;gap:8px}
  .go button{padding:14px 10px;text-align:center}
  .go button:after{display:none}
  .pos{min-height:50px}
  .chartwrap{flex:1;min-height:190px}
  .kv .l{display:none}
  .kv.nsrc{display:none}
  .themes{gap:3px;padding:2px 5px}
  .themes b{width:13px;height:13px}
  .assets .acard{min-width:110px}
}
@media(max-width:420px){
  .logo .bt{font-size:13px}
  .qs{grid-template-columns:repeat(4,1fr)}
}

/* ==========================================================
   多布局：V1 之外的五种（仅作用于 .L2 ~ .L6）
   ========================================================== */
.lay{display:flex;border:1px solid var(--line);background:var(--panel)}
.lay button{width:22px;height:22px;background:transparent;border:0;color:var(--tx3);
  font-size:10px;font-weight:700;cursor:pointer;font-family:inherit;line-height:1}
.lay button.on{background:var(--accent);color:var(--on-accent)}

.pnl{background:var(--bg2);border:1px solid var(--line)}
.pnl .ph{display:flex;align-items:center;gap:6px;padding:6px 9px;border-bottom:1px solid var(--line);
  font-size:10px;letter-spacing:.14em;color:var(--tx3)}
.pnl .pb{padding:9px}
.tbl{width:100%;border-collapse:collapse;font-size:11px}
.tbl th{text-align:left;color:var(--tx3);font-weight:600;font-size:10px;letter-spacing:.08em;
  padding:5px 7px;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl td{padding:5px 7px;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums;white-space:nowrap}
.tbl tr:last-child td{border-bottom:0}
.arow{display:flex;justify-content:space-between;align-items:center;padding:7px 9px;cursor:pointer;
  border-bottom:1px solid var(--line);font-size:12px;gap:8px}
.arow:last-child{border-bottom:0}
.arow.on{background:var(--accent-soft)}
.arow .m{color:var(--tx3);font-size:10px}
.arow .y{color:var(--accent);font-weight:700;font-size:11px;margin-left:auto}
.arow.off{opacity:.42;cursor:not-allowed}
.pay.h{display:flex;background:var(--panel);border:1px solid var(--line)}
.pay.h .c{flex:1;padding:6px 8px;border-right:1px solid var(--line);min-width:0}
.pay.h .c:last-child{border-right:0}
.pay.h .k{font-size:9px;color:var(--tx3);letter-spacing:.08em;white-space:nowrap}
.pay.h .v{font-size:14px;font-weight:700;font-variant-numeric:tabular-nums}
.stat{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line)}
.stat .s{background:var(--bg2);padding:7px 9px}
.stat .s .k{font-size:9px;color:var(--tx3);letter-spacing:.1em}
.stat .s .v{font-size:14px;font-weight:700;font-variant-numeric:tabular-nums}
.side{width:196px;flex:none;background:var(--bg2);border-right:1px solid var(--line);
  display:flex;flex-direction:column;overflow-y:auto}
.padhead{display:flex;align-items:center;justify-content:space-between;padding:7px 10px;
  border-bottom:1px solid var(--line);font-size:10px;letter-spacing:.16em;color:var(--tx3)}

/* ---------- L2 底部横条 ---------- */
.L2 .main{flex-direction:column}
.L2 .pad{width:100%;border-left:0;border-top:1px solid var(--line);flex-direction:row;
  display:grid;grid-template-columns:186px 246px 1fr 300px;gap:12px;padding:10px;align-items:end;overflow:visible}
.L2 .pad .blk{border-bottom:0;padding:0}
.L2 .pad .mode-b{border-bottom:0}
.L2 .go{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0;margin:0}
.L2 .go button{padding:12px 10px;text-align:center}
.L2 .go button:after{display:none}
.L2 .mode{display:inline-flex}
.L2 .hdband .mode{height:24px;align-self:center}
.L2 .hdband .mode button{padding:0 9px;font-size:10px;line-height:22px}
.hdband{display:flex;align-items:center;gap:14px;padding:0 10px;height:34px;
  border-bottom:1px solid var(--line);background:var(--bg2);font-size:11px}
.hdband b{font-size:15px;font-variant-numeric:tabular-nums}

/* ---------- L3 三栏终端 ---------- */
.L3 .main{gap:0}
.L3 .mid{flex:1;display:flex;flex-direction:column;min-width:0}
.L3 .mid .chartwrap{flex:1}
.L3 .pos{flex-direction:column;align-items:stretch;gap:0;min-height:0;max-height:172px;overflow-y:auto;
  border-top:1px solid var(--line);padding:0}
.L3 .pcard{min-width:0;width:100%;border:0;border-bottom:1px solid var(--line);display:grid;
  grid-template-columns:1fr auto auto;align-items:center;gap:10px;padding:6px 10px}
.L3 .pcard .bar{display:none}
.L3 .side .stat{grid-template-columns:1fr 1fr}

/* ---------- L4 沉浸浮动 ---------- */
.L4 .main{position:relative;display:block}
.L4 .chartwrap{position:absolute;inset:0}
.L4 .pad{position:absolute;right:12px;top:56px;width:246px;max-height:calc(100% - 130px);
  background:color-mix(in srgb,var(--panel) 94%,transparent);border:1px solid var(--line);
  box-shadow:var(--shadow);clip-path:none;z-index:8;border-radius:0}
.L4 .pos{position:absolute;left:12px;bottom:12px;right:288px;min-height:0;
  background:color-mix(in srgb,var(--panel) 92%,transparent);border:1px solid var(--line);z-index:7}
.L4 .cbar{background:none}
.L4 .pad .blk{padding:8px}

/* ---------- L5 上下分区 ---------- */
.L5 .main{flex-direction:column;gap:0}
.L5 .quote{display:flex;align-items:center;gap:22px;padding:12px 16px;background:var(--bg2);
  border-bottom:1px solid var(--line)}
.L5 .quote .sym2{font-size:13px;letter-spacing:.2em;color:var(--tx2)}
.L5 .quote .px2{font-size:34px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1}
.L5 .quote .ch2{font-size:14px;font-variant-numeric:tabular-nums}
.L5 .mid{flex:1;display:flex;flex-direction:column;min-width:0}
.L5 .mid .chartwrap{flex:1}
.L5 .pad{width:100%;border-left:0;border-top:1px solid var(--line);flex-direction:row;display:grid;
  grid-template-columns:300px 1fr;gap:0;padding:0;align-items:stretch;overflow:visible}
.L5 .pad .col{padding:10px;display:flex;flex-direction:column;gap:9px}
.L5 .pad .col.r{border-left:1px solid var(--line);justify-content:center}
.L5 .go{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0}
.L5 .go button{padding:26px 12px;text-align:center}
.L5 .go button .d{font-size:19px}
.L5 .pos{min-height:44px}
.L5 .hideseg .seg{display:none}

/* ---------- L6 网格仪表盘 ---------- */
.L6 .main{display:grid;grid-template-columns:1fr 300px;grid-template-rows:1fr auto;
  gap:9px;padding:9px;align-items:stretch}
.L6 .chartwrap{grid-column:1;grid-row:1;border:1px solid var(--line);position:relative}
.L6 .pad{grid-column:2;grid-row:1/3;width:auto;border:1px solid var(--line);background:var(--bg2)}
.L6 .pos{grid-column:1;grid-row:2;border:1px solid var(--line);min-height:0}
.L6 .cbar{position:static;background:none;border-bottom:1px solid var(--line);flex-wrap:wrap}
.L6 .chartwrap>#lv{position:absolute;inset:34px 0 0 0}

@media(max-width:900px){
  .lay{display:none}
  .L2 .pad{grid-template-columns:1fr 1fr;gap:8px;padding:8px;align-items:stretch}
  .L2 .go{grid-column:1/3}
  .L3 .side{display:none}
  .L3 .pos{max-height:132px}
  .L3 .pcard{grid-template-columns:1fr auto}
  .L4 .pad{right:6px;left:6px;top:auto;bottom:6px;width:auto;max-height:62%;
    display:grid;grid-template-columns:1fr 1fr;gap:0}
  .L4 .pad .mode-b{grid-column:1/3}
  .L4 .pad .pay-b{grid-column:1/3}
  .L4 .go{grid-column:1/3;grid-template-columns:1fr 1fr}
  .L4 .go button{text-align:center}
  .L4 .pos{left:6px;right:6px;bottom:auto;top:50px}
  .L5 .quote{padding:9px 12px;gap:14px}
  .L5 .quote .px2{font-size:25px}
  .L5 .pad{grid-template-columns:1fr}
  .L5 .pad .col.r{border-left:0;border-top:1px solid var(--line)}
  .L5 .go button{padding:16px 10px}
  .L6 .main{grid-template-columns:1fr;grid-template-rows:1fr auto auto;padding:6px}
  .L6 .chartwrap{grid-column:1;grid-row:1;min-height:180px}
  .L6 .pad{grid-column:1;grid-row:2}
  .L6 .pos{grid-column:1;grid-row:3}
  .L6 .cbar{flex-wrap:nowrap;overflow-x:auto}
  }

  /* ==========================================================
  根因修复：flex 子项 min-width:auto 撑破页面 → 手机整体缩放
  （对所有版本生效，含 V1）
  ========================================================== */
  html{max-width:100%}
  body{max-width:100%;overflow-x:hidden}
  .hd .in{min-width:0;overflow:hidden}
  .logo{min-width:0;flex:0 0 auto}
  .assets{min-width:0;flex:1 1 auto}
  .hdr-r{min-width:0}
  .main,.mid,.chartwrap,.pad,.pos,.side,.blk{min-width:0}
  .cbar{max-width:100%;overflow-x:auto;scrollbar-width:none}
  .cbar::-webkit-scrollbar{display:none}

  @media(max-width:900px){
  .hd .in{flex-wrap:wrap;height:auto;gap:5px;padding:5px 8px}
  .assets{order:3;flex:1 1 100%;border-top:1px solid var(--line);margin-top:4px;padding:5px 0 1px}
  .hdr-r{flex:1 1 auto;justify-content:flex-end;gap:5px;flex-wrap:wrap}
  .logo .bs{display:none}
  .acard{min-width:104px;padding:4px 8px 5px}
  .acard .n{font-size:11px}
  .acard .y{font-size:10px}
  .kv{padding:3px 7px}
  .kv .v{font-size:12px}
  .themes b{width:12px;height:12px}
  /* 手机上快捷档只留 4 个，给图表让高度 */
  .qs button:nth-child(n+5){display:none}
  .amtmax button{padding:4px 0}
  .qs button{padding:4px 0}
  .M5 .qs button:nth-child(n+5){display:block}
  }

  /* ==========================================================
  M2 - M6：五种手机优先布局（同一份 HTML 结构自适应）
  设计约束：无横向溢出 · 图表占比 ≥ 45% · 一屏内不错位
  ========================================================== */
  .M2 .main,.M3 .main,.M4 .main,.M6 .main{flex:1;display:flex;flex-direction:column;min-height:0}
  .M2 .chartwrap,.M3 .chartwrap,.M4 .chartwrap,.M6 .chartwrap{flex:1;min-height:140px;position:relative}
  .M2 .pos,.M3 .pos,.M4 .pos,.M6 .pos{flex:none;min-height:44px;height:44px}
  .M2 .pad,.M3 .pad,.M4 .pad,.M6 .pad{flex:none;background:var(--bg2);border-top:1px solid var(--line);padding:8px}
  .M2 .go,.M3 .go,.M5 .go,.M6 .go{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0;margin:0}
  .M2 .go button,.M3 .go button,.M5 .go button,.M6 .go button{padding:13px 10px;text-align:center}
  .M2 .go button:after,.M3 .go button:after,.M5 .go button:after,.M6 .go button:after{display:none}
  .M2 .blk,.M3 .blk,.M4 .blk,.M5 .blk,.M6 .blk{padding:0;border:0}
  .lab2{font-size:9px;letter-spacing:.14em;color:var(--tx3);margin-bottom:4px}

  /* ---- M2 底部双行条 ---- */
  .M2 .pad{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .M2 .pad .pay-b,.M2 .pad .go{grid-column:1/3}
  .M2 .amt input{padding:8px 6px;font-size:16px}
  .M2 .exp button{padding:8px 0}
  .M2 .pos{overflow-x:auto}

  /* ---- M3 极简 + 上拉面板 ---- */
  .M3 .pad{display:grid;gap:8px}
  .M3 .mini{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:end}
  .M3 .morebtn{background:var(--panel);border:1px solid var(--line);color:var(--tx2);
  font:600 11px/1 inherit;padding:9px;cursor:pointer;letter-spacing:.06em;width:100%}
  .M3 .more{display:none}
  .M3 .more.on{display:block;display:grid;gap:8px;margin-top:8px;padding-top:8px;border-top:1px solid var(--line)}
  .M3 .pos{overflow-x:auto}

  /* ---- M4 左右分（左参数 / 右大按钮） ---- */
  .M4 .pad{display:grid;grid-template-columns:1fr 132px;gap:0;padding:0}
  .M4 .pad .colx{padding:8px;display:flex;flex-direction:column;gap:7px;min-width:0}
  .M4 .pad .colb{border-left:1px solid var(--line);display:grid;grid-template-rows:1fr 1fr;gap:0}
  .M4 .pad .colb button{border:0;cursor:pointer;font-family:inherit;text-align:center;position:relative}
  .M4 .pad .colb .bup{background:var(--up);color:#fff}
  .M4 .pad .colb .bdn{background:var(--dn);color:#fff}
  .M4 .pad .colb button .d{font-size:15px;font-weight:800;letter-spacing:.1em;display:block}
  .M4 .pad .colb button .s{font-size:10px;opacity:.85;display:block;margin-top:3px}
  .M4 .pos{overflow-x:auto}

  /* ---- M5 卡片流（允许整页纵向滚动） ---- */
  .M5{overflow-y:auto!important;height:auto!important}
  .M5 .hd{position:sticky;top:0;z-index:30}
  .M5 .main{display:block;padding:9px;max-width:900px;margin:0 auto}
  .M5 .card{background:var(--bg2);border:1px solid var(--line);margin-bottom:9px}
  .M5 .card>.ch{display:flex;align-items:center;gap:8px;padding:8px 10px;
  border-bottom:1px solid var(--line);font-size:10px;letter-spacing:.16em;color:var(--tx3)}
  .M5 .card>.cb{padding:10px}
  .M5 .chartwrap{height:290px;position:relative}
  .M5 .pos{height:auto;min-height:0;flex-direction:column;align-items:stretch;gap:0;padding:0;overflow:visible}
  .M5 .pos .pcard{min-width:0;width:100%;border:0;border-bottom:1px solid var(--line)}
  .M5 .pad{padding:0;border:0;background:none;display:grid;gap:9px}

  /* ---- M6 金额滑块 + 巨幅按钮 ---- */
  .M6 .pad{display:grid;gap:8px}
  .M6 .sld{display:grid;grid-template-columns:1fr 74px;gap:8px;align-items:center}
  .M6 input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:26px;background:transparent}
  .M6 input[type=range]::-webkit-slider-runnable-track{height:6px;background:var(--panel);border:1px solid var(--line)}
  .M6 input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;margin-top:-8px;
  background:var(--accent);border:0;cursor:pointer}
  .M6 .amtv{background:var(--panel);border:1px solid var(--line);text-align:center;
  font:700 15px/1 inherit;padding:8px 4px;font-variant-numeric:tabular-nums}
  .M6 .go button{padding:17px 10px}
  .M6 .go button .d{font-size:17px}

  /* ---------- M2-M6 桌面版 ---------- */
  @media(min-width:901px){
  .M2 .main,.M3 .main,.M4 .main,.M6 .main{flex-direction:row;gap:0}
  .M2 .chartwrap,.M3 .chartwrap,.M4 .chartwrap,.M6 .chartwrap{flex:1}
  .M2 .pad,.M3 .pad,.M4 .pad,.M6 .pad{width:248px;border-top:0;border-left:1px solid var(--line);
  display:flex;flex-direction:column;gap:10px;overflow-y:auto}
  .M2 .pad{display:grid;grid-template-columns:1fr;gap:10px}
  .M2 .pad .pay-b,.M2 .pad .go{grid-column:auto}
  .M3 .pad{display:grid;grid-template-columns:1fr;gap:10px}
  .M3 .more{display:grid!important;gap:10px;margin:0;padding:0;border-top:0}
  .M3 .morebtn{display:none}
  .M4 .pad{display:flex;flex-direction:column;padding:0}
  .M4 .pad .colx{flex:1;padding:10px;gap:10px}
  .M4 .pad .colb{border-left:0;border-top:1px solid var(--line);height:132px;grid-template-rows:1fr 1fr}
  .M5 .main{display:grid;grid-template-columns:1fr 300px;gap:10px;max-width:1680px;padding:10px}
  .M5 .chartwrap{height:560px}
  .M5 .c-cards{display:flex;flex-direction:column;gap:10px;min-width:0}
  .M5 .pos{height:auto;flex-direction:row;align-items:center;padding:0 10px}
  .M5 .pos .pcard{width:auto;min-width:212px;border:1px solid var(--line)}
  .M6 .pad{display:flex}
  .M6 .go button{padding:22px 10px}
  .M2 .pos,.M3 .pos,.M4 .pos,.M6 .pos{height:auto;min-height:56px;width:100%;order:9}
  .M2 .main,.M3 .main,.M4 .main,.M6 .main{flex-wrap:wrap}
  .M2 .chartwrap,.M3 .chartwrap,.M4 .chartwrap,.M6 .chartwrap{flex:1 1 auto}
  .M2 .pad,.M3 .pad,.M4 .pad,.M6 .pad{flex:0 0 248px}
  }

/* ---------- 融合功能：筛选条 / 金额快捷 / 行情行 ---------- */
.filt{display:flex;align-items:center;gap:5px;padding:5px 8px;border-top:1px solid var(--line);
  background:var(--bg2);font-size:10px;flex:none;overflow-x:auto;scrollbar-width:none}
.filt::-webkit-scrollbar{display:none}
.filt .fl{letter-spacing:.14em;color:var(--tx3);margin-right:2px;white-space:nowrap}
.filt button{background:transparent;border:1px solid var(--line);color:var(--tx2);
  font:600 10px/1 inherit;padding:4px 8px;cursor:pointer;white-space:nowrap}
.filt button.on{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.amtmax{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin-top:5px}
.amtmax button{background:var(--panel);border:1px solid var(--line);color:var(--tx2);
  font:600 10px/1 inherit;padding:5px 0;cursor:pointer;font-family:inherit}
.amtmax button:hover{border-color:var(--accent);color:var(--tx)}
.quoteline{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.M5 .pos{padding:0;border-top:0}
.M5 .filt{border-top:0;border-bottom:1px solid var(--line)}
.M5 .pos .pcard:last-child{border-bottom:0}

/* ==========================================================
   M4 专项修复（只作用于 .M4）
   ① 顶部工具条改为图表区内的静态两行 → 不遮挡图表
   ② 赔付信息改自适应网格 + 字号自适应 + 溢出截断
   ========================================================== */
.M4 .chartwrap{display:flex;flex-direction:column;min-height:0}
.M4 .qline{display:none}
.M4 .cbwrap{display:flex;flex-direction:column;flex:none;min-width:0;
  background:var(--bg2);border-bottom:1px solid var(--line)}
.M4 .cbar{position:static;inset:auto;display:flex;align-items:center;flex-wrap:nowrap;
  gap:8px;padding:6px 9px 4px;flex:none;background:none;min-width:0;overflow:hidden}
.M4 .cbar .sym,.M4 .cbar .bigpx,.M4 .cbar #tChg{flex:none}
.M4 .cbar .bigpx{font-size:18px}
.M4 .cbar .seg{flex:none}
.M4 .cbfill{flex:1 1 auto;min-width:0}
.M4 .cbwrap .cbscroll{display:none}
/* 周期六档等宽铺满整行，不再横滑、不再被挤掉 */
.M4 .cbar2{display:flex;flex:none;min-width:0;padding:0 9px 6px;background:none}
.M4 .cbar2 .seg{display:flex;flex:1 1 auto;min-width:0;gap:3px;padding:2px}
.M4 .cbar2 .seg button{flex:1 1 0;min-width:0;padding:5px 2px;font-size:11px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.M4 .chartwrap>#lv{position:relative;inset:auto;flex:1 1 auto;min-height:0}

.M4 .pay.h{display:grid;grid-template-columns:repeat(auto-fit,minmax(68px,1fr));
  background:var(--panel);border:1px solid var(--line)}
.M4 .pay.h .c{min-width:0;overflow:hidden;padding:6px 7px;
  border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.M4 .pay.h .k{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.M4 .pay.h .v{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  font-size:clamp(11px,3.4vw,15px);line-height:1.25}
.M4 .amt input{min-width:0;font-size:clamp(13px,4.4vw,17px);padding:8px 4px}
.M4 .qs button,.M4 .amtmax button{min-width:0;overflow:hidden;text-overflow:ellipsis}
.M4 .exp button{padding:7px 0;font-size:10px;min-width:0;overflow:hidden}
.M4 .pad .colb button .d{white-space:nowrap}
.M4 .pad .colb button .s{display:block;max-width:100%;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;padding:0 4px}
.M4 .pad .colx{overflow:hidden}
@media(min-width:901px){
  .M4 .pay.h .v{font-size:14px}
  .M4 .cbwrap{flex-direction:row;align-items:center;gap:14px;padding:0 11px}
  .M4 .cbar{padding:7px 0}
  .M4 .cbar2{flex:1 1 auto;justify-content:flex-end;padding:7px 0;min-width:0}
  .M4 .cbar2 .seg{flex:0 1 auto;padding:2px}
  .M4 .cbar2 .seg button{flex:0 0 auto;padding:4px 10px}
}

/* ---- 控制台补充（不改 v4 原风格，只补本站需要的元素）---- */
.M4 .exp{grid-template-columns:repeat(3,1fr)}
.M4 .exp button{flex-direction:column;gap:1px;line-height:1.25}
.exp button .pc{font-size:9.5px;opacity:.75}
.lgsel{background:var(--panel);border:1px solid var(--line);color:var(--tx);font:inherit;font-size:11px;padding:5px 6px;cursor:pointer}
.lgsel:focus{outline:none;border-color:var(--accent)}
.cnav{display:flex;flex-wrap:wrap;gap:1px;border:1px solid var(--line);border-top:0;background:var(--bg2)}
.cnav a{flex:1 1 auto;min-width:0;padding:9px 10px;font-size:11.5px;color:var(--tx2);text-align:center;text-decoration:none;border-right:1px solid var(--line)}
.cnav a:hover{color:var(--tx);background:var(--panel)}
.cnav a:last-child{border-right:0;color:var(--accent)}
.vbal{display:flex;justify-content:space-between;align-items:baseline;margin-top:6px;font-size:11px;color:var(--tx3)}
.vbal b{color:var(--accent);font-size:13px;font-variant-numeric:tabular-nums}
.lab2{display:flex;justify-content:space-between;gap:6px}
.mut3{font-size:10.5px;color:var(--tx3)}
.mut3p{color:var(--tx3);font-size:11px;padding-left:4px}
#cv{width:100%;height:100%;display:block}
#lv{position:relative;flex:1;min-height:220px}
.rng{position:absolute;right:8px;top:8px;font-size:10px;color:var(--tx3);font-variant-numeric:tabular-nums}
.hd .logo{text-decoration:none;cursor:pointer}
@media(max-width:860px){.hd .assets{display:none}}

.M4 #mode{display:flex;gap:3px;border:1px solid var(--line);background:var(--panel);padding:2px}
.M4 #mode button{flex:1;background:transparent;border:0;color:var(--tx2);font:inherit;font-size:12px;padding:6px 0;cursor:pointer}
.M4 #mode button.on{background:var(--accent);color:#141414;font-weight:600}
.M4 .pos .pcard .m.mut3{display:flex;justify-content:space-between}
@media(max-width:820px){
  .M4 .pos{flex-direction:column;overflow-x:hidden;overflow-y:auto;max-height:46vh}
  .M4 .pos .pcard{width:100%;min-width:0;flex:none}
}
.vishid{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
@media(max-width:900px){
  /* v4 原版把 body 锁成 100vh/overflow:hidden —— 手机上必须放开，否则滑不动 */
  body.M4{height:auto;min-height:100dvh;overflow-y:auto;overflow-x:hidden;display:block}
  .M4 .main{flex:none;min-height:0}
  .M4 .pad{max-height:none;overflow:visible}
  .M4 .blk.mode-b .lab2{display:none}          /* 练习/实盘 上面那行小字删掉 */
  .M4 #pos{max-height:none;overflow:visible;flex-wrap:wrap;padding:6px 2px}
  .M4 .blk.mode-b{padding:6px 8px}
  .M4 .blk{padding:7px 8px}
  .M4 .colx{gap:0}
}
@media(max-width:900px){
  .M4 .hd .in{flex-wrap:nowrap;height:auto;min-height:46px;gap:7px;padding:6px 8px;align-items:center}
  .M4 .hdr-r{flex:1 1 auto;flex-wrap:nowrap;justify-content:flex-end;gap:6px;min-width:0;overflow:hidden}
  .M4 .hd .kv.kv-px{display:none}
  .M4 .hd .kv.nsrc{display:none}
  .M4 .hd .kv{display:flex;align-items:baseline;gap:4px;min-width:0}
  .M4 .hd .kv .l{font-size:9px;margin:0;opacity:.75}
  .M4 .hd .kv .v{font-size:13px}
  .M4 .themes{gap:4px}
  .M4 .themes b{width:13px;height:13px}
  .M4 #hdAcct,.M4 #hdAuth,.M4 #hdOut{padding:5px 9px;font-size:11.5px;white-space:nowrap;flex:none}
}

.M4 #lv{overflow:hidden;min-width:0}
.M4 #lv .tv-lightweight-charts{max-width:100%;overflow:hidden}
@media(max-width:900px){
  .M4 #lv{min-height:200px}
  .M4 .seg button{padding:7px 9px;font-size:12px}
  .M4 .filt button{padding:7px 11px;font-size:12px}
  .M4 .themes b{width:15px;height:15px;padding:0}
  .M4 .colb button .d{font-size:16px}
  .M4 .colb button .s{font-size:12px}
}
@media(max-width:900px){
  /* 图表要有真实高度（上一版把桌面的 flex 撑高改没了 → 手机上图表看不见） */
  .M4 .chartwrap{flex:none;height:44vh;height:44dvh;min-height:224px;max-height:430px;position:relative}
  .M4 #lv{position:absolute;inset:0;min-height:0;overflow:hidden}
  .M4 .cbwrap{position:relative;z-index:3}
  /* 操作栏单列紧凑，不留大间隙 */
  .M4 .pad{display:flex;flex-direction:row;align-items:stretch;width:100%;padding:0;gap:0;max-height:none;overflow:visible}
  .M4 .pad .colx{display:flex;flex-direction:column;flex:none;gap:0;padding:0}
  .M4 .pad .colx > .blk{border-bottom:1px solid var(--line);padding:6px 8px}
  .M4 .pad .colx > .blk:last-child{border-bottom:0}
  .M4 .pad .colx > .blk .lab2{margin-bottom:3px}
  /* 涨/跌：右侧一列，上下排列（v4 原样） */
  .M4 .pad .colb{flex:0 0 108px;display:grid;grid-template-columns:1fr;grid-template-rows:1fr 1fr;height:auto;min-height:150px;border-top:0;border-left:1px solid var(--line)}
  /* 赔付行自带 18px 外边距 + 14px 上下内边距 —— 清掉，块就贴上横线 */
  .M4 .pay.h{margin:0;padding:0}
  .M4 .pad .colx > .blk > *{margin-top:0;margin-bottom:0}
  .M4 .pad .colx > .blk > .exp,.M4 .pad .colx > .blk > .amt,
  .M4 .pad .colx > .blk > .amtmax{margin:0;padding:0}
  /* 左列永不被右栏拉伸撑开（否则「进行中」被推到最底） */
  .M4 .pad .colx{justify-content:flex-start;align-self:flex-start}
  .M4 .pad{align-items:flex-start}
  /* 涨跌按钮做大（右侧一列，上下） */
  .M4 .pad .colb{min-height:186px}
  .M4 .colb button .d{font-size:17px}
  .M4 .colb button .s{font-size:13px;margin-top:6px}
  /* 矮屏把图和小字再压一档 */
  @media(max-height:820px){
    /* 档位按钮恢复显示 2026-10-19 */.M4 .qs{display:grid}
    }
  @media(max-height:700px){
    .M4 .exp{grid-template-columns:repeat(6,1fr)}
    .M4 .exp button{padding:5px 0;font-size:9.5px}
    .M4 .pay.h .c{padding:2px 3px}
    .M4 .pay.h .k{font-size:7px}
    .M4 .pay.h .v{font-size:11px}
    .M4 .pad .colb{min-height:150px}
  }
  /* 压扁各块，让「进行中」在首屏看得见 */
  /* 档位按钮恢复显示 2026-10-19 */.M4 .qs{display:grid}
  .M4 .pad .colx > .blk{padding:5px 7px}
  .M4 .pad .colx > .blk .lab2{margin-bottom:2px;font-size:8.5px}
  .M4 .amt{gap:4px;margin:0}
  .M4 .amt input{padding:5px 7px;font-size:15px}
  .M4 .amt .st{gap:3px}
  .M4 .amtmax,.M4 .qs{margin-top:3px;gap:3px}
  .M4 .amtmax button,.M4 .qs button{padding:4px 0;font-size:10.5px}
  .M4 .exp{gap:3px;margin:0}
  .M4 .exp button{padding:5px 0;font-size:10.5px}
  .M4 .pay.h .c{padding:4px 5px}
  .M4 .pay.h .k{font-size:8px}
  .M4 .pay.h .v{font-size:12px}
  .M4 .blk.mode-b{padding:5px 7px}
  .M4 #mode button{padding:5px 0;font-size:11.5px}
  .M4 .pad .colx > .blk > *:last-child{margin-bottom:0}
  /* 矮屏（<=700px 高）：再压一档，保证「进行中」首屏可见 */
  @media(max-height:700px){
      .M4 .amtmax,.M4 .qs{margin-top:2px}
    .M4 .pay.h .k{font-size:7.5px}
    .M4 .hd .in{min-height:42px;padding:4px 8px}
    .M4 .pad .colx > .blk{padding:4px 6px}
    .M4 .amt input{padding:4px 6px;font-size:14px}
    .M4 .amtmax button,.M4 .qs button{padding:3px 0;font-size:10px}
    .M4 .exp button{padding:4px 0;font-size:10px}
    .M4 .pay.h .c{padding:3px 4px}
    .M4 .pay.h .v{font-size:11.5px}
    .M4 .colb{min-height:132px}
  }
  /* 档位/赔付 两块显示标题；金额块的小字隐藏（省空间） */
  .M4 .pad .colx > .blk > .lab2{display:block;margin-bottom:2px}
  .M4 .pad .colx > .blk:nth-child(1) > .lab2,.M4 .pad .colx > .blk:nth-child(2) > .lab2{display:none}
  /* 允许赔付六格压缩（否则把它们的最小宽度顶到 264px，整页被撑宽） */
  .M4 .pad .colx{min-width:0}
  .M4 .pay.h,.M4 .pay.h .c{min-width:0;overflow:hidden}
  .M4 .pay.h .k,.M4 .pay.h .v{min-width:0;overflow:hidden;text-overflow:ellipsis}
  /* 右栏：涨 / 跌 / 进行中的单子（方块区） */
  .M4 .pad .colx{border-right:1px solid var(--line)}
  .M4 .pad .colb{flex:0 0 128px;width:128px;min-width:0;overflow:hidden;display:grid;grid-template-columns:1fr;grid-template-rows:110px 110px auto;align-content:start;min-height:0;border-top:0;border-left:1px solid var(--line);align-self:stretch}
  .M4 .pad .colb .bup,.M4 .pad .colb .bdn{min-height:0;height:110px;flex:none}
  .M4 .pad .colb #pos{display:flex;flex-direction:column;justify-content:flex-start;gap:0;padding:0;margin:0;border:0;overflow-x:hidden;
    border-top:1px solid var(--line);background:var(--bg2);max-height:none;overflow:visible;width:100%;min-width:0;height:auto}
  .M4 .pad .colb #pos .pcard{border:0;border-bottom:1px solid var(--line);padding:5px 6px;width:100%;min-width:0;background:none;display:block}
  .M4 .pad .colb #pos .pcard:last-child{border-bottom:0}
  .M4 .pad .colb #pos .pcard .t{display:flex;justify-content:space-between;gap:3px;font-size:10px;min-width:0;white-space:nowrap}
  .M4 .pad .colb #pos .pcard .t span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .M4 .pad .colb #pos .pcard .t .num{font-size:10.5px}
  .M4 .pad .colb #pos .pcard .bar{height:3px;margin:4px 0}
  .M4 .pad .colb #pos .pcard .m{display:flex;justify-content:space-between;gap:3px;font-size:9.5px;margin-top:2px;white-space:nowrap}
  .M4 .pad .colb #pos .pcard .m > span{min-width:0;overflow:hidden;text-overflow:ellipsis}
  .M4 .pad .colb #pos .pcard .m > span:last-child{flex:none}
  .M4 .pad .colb #pos .mut3{font-size:10px;padding:6px;display:block}
  /* 进行中的单子紧贴赔付块下面 */
  .M4 #pos{padding:6px 8px;gap:6px}
  .M4 #pos .pcard{margin:0}
}
.M4 .histwrap{border:1px solid var(--line);border-top:0;background:var(--bg2)}
.M4 .histwrap .fl{font-size:9px;letter-spacing:.14em;color:var(--tx3);text-transform:uppercase;padding:8px 10px 2px;display:block}
.M4 .hist{display:block}
.M4 .hrow{display:grid;grid-template-columns:92px 56px 76px 1fr 84px 60px;gap:6px;align-items:center;
  padding:7px 10px;border-bottom:1px solid var(--line);font-size:11.5px}
.M4 .hrow:last-child{border-bottom:0}
.M4 .hrow .t{color:var(--tx3);font-family:var(--mono)}
.M4 .hrow .a{color:var(--tx2);font-family:var(--mono)}
.M4 .hrow .p{color:var(--tx3);font-family:var(--mono);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.M4 .hrow .r{text-align:right;font-weight:700;font-family:var(--mono)}
.M4 .hrow .s{text-align:right}
.M4 .hrow .up{color:var(--up)} .M4 .hrow .dn{color:var(--dn)} .M4 .hrow .mut{color:var(--tx3)}
.M4 .pager{display:flex;align-items:center;justify-content:center;gap:12px;padding:9px 10px;border-top:1px solid var(--line)}
.M4 .pager button{background:var(--panel);border:1px solid var(--line);color:var(--tx2);font:inherit;font-size:12px;
  padding:8px 16px;cursor:pointer;min-height:34px}
.M4 .pager button:disabled{opacity:.35;cursor:not-allowed}
.M4 .pager .pgi{font-family:var(--mono);font-size:12px;color:var(--tx2)}
@media(max-width:900px){
  .M4 .hrow{display:grid;grid-template-columns:110px 40px 1fr 56px;grid-template-areas:"t d a r" "p p p s";gap:0 6px;padding:6px 8px;align-items:baseline;font-size:11px}
  .M4 .hrow > span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
  .M4 .hrow .t,.M4 .hrow .d,.M4 .hrow .a{font-size:10.5px}
  .M4 .hrow .t{grid-area:t;font-size:10px;letter-spacing:-.2px} .M4 .hrow .d{grid-area:d} .M4 .hrow .a{grid-area:a}
  .M4 .hrow .r{grid-area:r;text-align:right} .M4 .hrow .s{grid-area:s;text-align:right}
  .M4 .hrow .p{grid-area:p;display:block;font-size:10px;color:var(--tx3)}

  .M4 #pos{max-height:none}
}
/* 桌面：v4 原版锁 100vh 会把操作栏底部切掉 → 改内容自适应 + 可滚动 */
@media(min-width:901px){
  body.M4{height:auto;min-height:100vh;overflow-y:auto;overflow-x:hidden}
  .M4 .main{flex:none;min-height:0}
  .M4 .chartwrap{flex:none;height:min(52vh,520px);min-height:360px}
  .M4 .pad{overflow:visible}
  .M4 .pad .colx{min-height:0;overflow:visible}
  .M4 .hd{height:auto;min-height:50px}
  .M4 .hd .in{height:auto;min-height:50px}
  .M4 .pad .blk{padding:8px}
  .M4 .pay.h .c{padding:5px 7px}
  .M4 .exp button{padding:6px 0}
}

.M4 .bals{margin-top:5px;border-top:1px solid var(--line);padding-top:4px}
.M4 .balr{display:flex;justify-content:space-between;align-items:baseline;padding:2px 0;font-size:10.5px;color:var(--dim2)}
.M4 .balr b{font-family:var(--mono);font-weight:700;font-size:12.5px;color:var(--ink);font-variant-numeric:tabular-nums}
.M4 .balr.on{color:var(--gold)}
.M4 .balr.on b{color:var(--gold);font-size:14px}

/* ===== 桌面终端 = 三栏自适应（2026-10-15 v2）=====
   左：图表整高 | 中：下单栏整高（自适应压缩，永不出现滚动条）| 右：进行中(竖排滚动) + 筛选 + 历史
   要点：
   1) .main 用 display:contents，子元素直接参与 body 网格分区
   2) 中间栏所有间距/内边距/按钮高都用 vh 驱动的 clamp()，随窗口高矮自动缩，不靠断点
   3) 赔付块吃掉剩余高度（flex:1 + grid-auto-rows:minmax(0,1fr)），多出的空间它自己撑
   4) 右侧「进行中」flex-direction:column 竖排 + overflow-y:auto，卡片满宽 min-width:0
   5) 极端窗口仍保留兜底断点（宁可中间栏自己滚，也绝不压盖或裁内容） */
@media(min-width:901px){
  body.M4{--tg:clamp(2px,.85vh,9px);--tp:clamp(3px,.95vh,10px);
    height:100vh!important;min-height:0!important;overflow:hidden!important;display:grid!important;
    padding:0 14px 12px;box-sizing:border-box;align-content:stretch;
    grid-template-columns:minmax(0,1fr) clamp(206px,18vw,258px) clamp(262px,22.5vw,336px);
    grid-template-rows:auto minmax(176px,1fr) auto minmax(92px,.8fr)}
  body.M4 .hd{grid-column:1/-1;height:auto!important}
  body.M4 .main{display:contents!important}
  body.M4 .chartwrap{grid-area:2/1/5/2;border:1px solid var(--line);border-right:0;min-width:0;
    height:auto!important;min-height:0!important;position:relative;overflow:hidden}
  body.M4 .chartwrap #lv{position:absolute!important;inset:0!important}
  /* ---- 中间下单栏：自适应压缩，永不出滚动条 ---- */
  body.M4 .pad{grid-area:2/2/5/3!important;flex:none!important;width:auto!important;min-width:0;
    border:1px solid var(--line);border-right:0;
    display:flex!important;flex-direction:column!important;flex-wrap:nowrap!important;
    gap:var(--tg)!important;padding:var(--tp)!important;overflow:hidden!important}
  body.M4 .pad .colx{display:flex!important;flex-direction:column!important;flex:1 1 auto!important;
    gap:var(--tg)!important;min-height:0!important;padding:0!important;overflow:hidden!important}
  body.M4 .pad .colx>.blk{flex:1 1 auto!important;padding:var(--tp)!important;min-width:0;
    display:flex!important;flex-direction:column!important;justify-content:center!important}
  body.M4 .pad .colx>.blk>.lab2{margin-bottom:clamp(1px,.4vh,4px)!important}
  body.M4 .pad .colx>.blk.mode-b{max-height:clamp(70px,11vh,150px)!important}
  body.M4 .pad .colx>.blk:nth-of-type(2){max-height:clamp(150px,27vh,320px)!important}
  body.M4 .pad .colx>.blk:nth-of-type(3){max-height:clamp(70px,11vh,160px)!important}
  body.M4 .pad .colx>.blk.pay-b{flex:1 1 auto!important;min-height:0!important;display:flex!important;
    flex-direction:column!important;justify-content:center!important;overflow:hidden!important;
    padding-bottom:0!important}
  body.M4 .pad .colx>.blk.pay-b>.lab2{flex:0 0 auto!important}
  body.M4 .pay.h{flex:1 1 auto!important;min-height:min-content!important;overflow:hidden!important;
    grid-template-columns:repeat(3,1fr)!important;align-content:center!important;
    grid-auto-rows:minmax(clamp(24px,3.6vh,40px),1fr)!important}
  body.M4 .pay.h .c{padding:clamp(2px,.6vh,7px) 6px!important;display:flex!important;
    flex-direction:column!important;justify-content:center!important;overflow:hidden!important}
  body.M4 .pay.h .v{font-size:clamp(11px,2.1vh,24px)!important;line-height:1.15!important}
  body.M4 .pay.h .k{font-size:clamp(8px,.95vh,9.5px)!important}
  body.M4 .pad .qs{margin-top:clamp(2px,.55vh,6px)!important}
  body.M4 .pad .amt input{padding:clamp(4px,.75vh,9px) 4px!important;font-size:clamp(13px,1.85vh,17px)!important}
  body.M4 .pad .amt .st button{height:clamp(15px,1.9vh,20px)!important}
  body.M4 .pad .exp button,body.M4 .pad .qs button,body.M4 .pad .amtmax button{
    padding:clamp(3px,.7vh,6px) 0!important;font-size:clamp(9.5px,1.05vh,11px)!important}
  /* ---- 涨/跌：横排双按钮，随视口高矮自适应 ---- */
  body.M4 .pad .colb{display:grid!important;grid-template-columns:1fr 1fr!important;
    gap:var(--tg)!important;height:auto!important;min-height:clamp(50px,9.5vh,110px)!important;
    max-height:clamp(64px,14vh,168px)!important;flex:1 1 auto!important;
    border-top:0!important;border-left:0!important;padding:0!important}
  body.M4 .pad .colb button{height:100%!important;min-height:0!important;padding:6px 8px!important}
  body.M4 .pad .colb button .d{font-size:clamp(12px,1.55vh,15px)!important}
  body.M4 .pad .colb button .s{font-size:clamp(9px,1.05vh,11px)!important}
  /* ---- 右侧：进行中（竖排、内部纵向滚动）、筛选、历史 ---- */
  body.M4 #pos{grid-area:2/3/3/4;flex-direction:column!important;flex-wrap:nowrap!important;
    align-items:stretch!important;justify-content:flex-start!important;gap:5px!important;
    padding:0 0 0 10px!important;min-height:0!important;max-height:none!important;
    overflow-y:auto!important;overflow-x:hidden!important;background:transparent!important;
    border:0!important;scrollbar-width:thin}
  body.M4 #pos .pcard{width:100%!important;min-width:0!important;flex:none!important;
    display:block!important;background:var(--panel)!important}
  body.M4 #pos .pcard .m.mut3{display:flex!important;justify-content:space-between!important}
  body.M4 .filt{grid-area:3/3/4/4;margin:0 0 0 10px}
  body.M4 .histwrap{grid-area:4/3/5/4;margin-left:10px;overflow-y:auto!important;min-height:0;
    overflow-x:hidden!important}
  /* ---- 顶部工具条必须压在图表 canvas 之上（原版被 canvas 盖住：6 档周期看不见也点不到）---- */
  body.M4 .cbwrap{position:relative!important;z-index:8!important}
  body.M4 .cbar2{position:relative!important;z-index:8!important}
  body.M4 .cbar2 .seg{overflow:visible!important}
  /* ---- 历史记录：卡片式（两行自适应），铺满列宽，不横向滑动 ---- */
  body.M4 .hrow{display:grid!important;width:100%!important;box-sizing:border-box!important;
    grid-template-columns:auto auto 1fr auto!important;
    grid-template-areas:"t d a s" "p p p r"!important;
    gap:1px 8px!important;padding:6px 8px!important;font-size:11px!important;
    align-items:baseline!important}
  body.M4 .hrow>span{min-width:0!important;white-space:nowrap!important;overflow:hidden!important;
    text-overflow:ellipsis!important}
  body.M4 .hrow .t{grid-area:t!important;font-size:10.5px!important}
  body.M4 .hrow .d{grid-area:d!important;font-size:10.5px!important;font-weight:700!important}
  body.M4 .hrow .a{grid-area:a!important;text-align:right!important}
  body.M4 .hrow .s{grid-area:s!important;text-align:right!important;font-size:10.5px!important}
  body.M4 .hrow .p{grid-area:p!important;font-size:10px!important}
  body.M4 .hrow .r{grid-area:r!important;text-align:right!important;font-weight:700!important}
  body.M4 .pager{padding:6px 8px!important;gap:8px!important}
  body.M4 .pager button,.body.M4 .pager .pgi{font-size:11px!important}
}
/* 窄桌面（≤1240px 宽）：工具条换成两行，6 档周期整行铺满（否则被挤到图表外、点不到） */
@media(min-width:901px) and (max-width:1240px){
  body.M4 .cbwrap{flex-wrap:wrap!important;row-gap:0!important;align-content:flex-start!important}
  body.M4 .cbar{flex:1 1 auto!important}
  body.M4 .cbar2{flex:1 1 100%!important;padding:0 0 6px!important;justify-content:stretch!important}
  body.M4 .cbar2 .seg{flex:1 1 100%!important;width:100%!important}
  body.M4 .cbar2 .seg button{flex:1 1 0!important;min-width:0!important;padding:4px 2px!important}
}
/* 矮屏（≤840px 高）：间距/内边距/按钮一起收一档（余额、快捷金额一律不隐） */
@media(min-width:901px) and (max-height:840px){
  body.M4{--tg:clamp(2px,.65vh,7px);--tp:clamp(2px,.75vh,7px)}
  body.M4 .pad .colb{min-height:clamp(46px,10.5vh,96px)!important}
  body.M4 .pay.h{grid-auto-rows:minmax(clamp(20px,3.2vh,32px),1fr)!important}
  body.M4 .pad .colx>.blk.mode-b{max-height:clamp(64px,10vh,120px)!important}
  body.M4 .pad .colx>.blk:nth-of-type(2){max-height:clamp(130px,24vh,240px)!important}
  body.M4 .pad .colx>.blk:nth-of-type(3){max-height:clamp(64px,10vh,130px)!important}
}
/* 超矮屏（≤700px 高）：再收一档（仍然不隐任何功能） */
@media(min-width:901px) and (max-height:700px){
  body.M4{--tg:clamp(2px,.55vh,6px);--tp:clamp(2px,.62vh,6px)}
  body.M4 .pad .qs button,body.M4 .pad .amtmax button{padding:2px 0!important;font-size:9.5px!important}
  body.M4 .pad .pay.h .c{padding:1px 4px!important}
  body.M4 .pay.h .v{font-size:clamp(10.5px,1.9vh,16px)!important}
}

/* 极端窗口兜底（≤540px 高）：中间栏允许自己滚，绝不压盖/裁内容 */
@media(min-width:901px) and (max-height:540px){
  body.M4 .pad{overflow-y:auto!important}
}


/* 手机端档位：6 个，每行 3 个（2026-10-19） */
@media (max-width:560px){
  .M4 .qs{display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:5px !important}
  .M4 .qs button{display:block !important;padding:6px 0 !important;min-width:0 !important}
}