/* ===== 融资融券（pages/rzrq.html）=====
   红涨绿跌：余额增加 / 净买入为正 = 红 #e03131；减少 = 绿 #0ca678；主色 #27548c */
:root{
  --rz-blue:#27548c; --rz-up:#e03131; --rz-dn:#0ca678;
  --rz-bd:#e3e4e6; --rz-mut:#8a93a5; --rz-ink:#0a0a0a; --rz-line:#f0f0f2;
  --rz-2:#7048e8; --rz-3:#f59f00; --rz-4:#1890a8;
}
body{background:#fafafa;}

/* ---------------- Tab（胶囊容器，选中项白底浮起） ---------------- */
.rz-tabs{display:flex;gap:2px;background:#f0f0f2;border-radius:11px;padding:4px;margin:-2px 0 18px;
  flex-wrap:wrap;width:fit-content;max-width:100%;box-sizing:border-box;}
.rz-tab{border:0;background:none;font:inherit;padding:8px 16px;border-radius:8px;cursor:pointer;
  display:flex;align-items:baseline;gap:7px;white-space:nowrap;transition:.15s;}
.rz-tab b{font-size:13.5px;font-weight:600;color:#454e61;}
.rz-tab i{font-style:normal;font-size:11px;color:#98a0b0;}
.rz-tab:hover b{color:var(--rz-blue);}
.rz-tab.on{background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.10);}
.rz-tab.on b{color:var(--rz-blue);}
.rz-tab.on i{color:#aab2c2;}
.rz-sub{display:flex;gap:6px;margin:0 0 14px;flex-wrap:wrap;}
.rz-sub button{border:1px solid #e3e4e6;background:#fff;border-radius:20px;padding:6px 15px;
  font:600 12.5px/1.3 inherit;color:#5a6478;cursor:pointer;transition:.15s;}
.rz-sub button:hover{border-color:#b3c7e2;color:var(--rz-blue);}
.rz-sub button.on{background:var(--rz-blue);border-color:var(--rz-blue);color:#fff;}

/* ---------------- 过滤条 ---------------- */
.rz-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:4px 0 14px;}
.rz-bar .lab{font-size:12px;color:#9aa3b2;}
.rz-bar .seg{display:flex;border:1px solid #e3e4e6;border-radius:9px;overflow:hidden;background:#fff;}
.rz-bar .seg button{border:0;background:none;font:600 12.5px/1 inherit;color:#86868b;padding:8px 13px;cursor:pointer;
  white-space:nowrap;transition:.15s;}
.rz-bar .seg button+button{border-left:1px solid #f0f0f2;}
.rz-bar .seg button:hover{color:var(--rz-blue);background:#f7faff;}
.rz-bar .seg button.on{background:var(--rz-blue);color:#fff;}
.rz-bar input{border:1px solid #e3e4e6;border-radius:9px;padding:8px 12px;font-size:12.5px;
  font-family:inherit;color:var(--rz-ink);background:#fff;outline:none;width:190px;box-sizing:border-box;}
.rz-bar input:focus{border-color:var(--rz-blue);box-shadow:0 0 0 3px rgba(39,84,140,.10);}
.rz-bar select{border:1px solid #e3e4e6;border-radius:9px;padding:8px 10px;font-size:12.5px;
  font-family:inherit;font-weight:600;color:var(--rz-ink);background:#fff;outline:none;cursor:pointer;max-width:190px;}
.rz-bar select:focus{border-color:var(--rz-blue);}
.rz-bar .tip{font-size:11.5px;color:#8a93a5;line-height:1.7;}
.rz-bar .tip b{color:var(--rz-blue);}
.rz-chip{border:1px solid #e3e4e6;background:#fff;border-radius:20px;padding:7px 14px;
  font:600 12.5px/1.3 inherit;color:#5a6478;cursor:pointer;transition:.15s;white-space:nowrap;}
.rz-chip:hover{border-color:#b3c7e2;color:var(--rz-blue);background:#f7faff;}
.rz-chip.on{background:var(--rz-blue);border-color:var(--rz-blue);color:#fff;}
.rz-chip.on:hover{background:#1f57e0;color:#fff;}

/* ---------------- KPI ---------------- */
.rz-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px;}
.rz-kpi{border:1px solid var(--rz-bd);border-radius:14px;background:#fff;padding:13px 15px;min-width:0;
  position:relative;overflow:hidden;}
.rz-kpi::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:#e3e4e6;}
.rz-kpi.t1::before{background:var(--rz-blue);}
.rz-kpi.t2::before{background:var(--rz-2);}
.rz-kpi.t3::before{background:var(--rz-3);}
.rz-kpi.t4::before{background:var(--rz-4);}
.rz-kpi .k{font-size:11.5px;color:var(--rz-mut);font-weight:600;}
.rz-kpi .v{font-size:22px;font-weight:700;margin-top:5px;font-variant-numeric:tabular-nums;color:var(--rz-ink);
  line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.rz-kpi .v.up{color:var(--rz-up);} .rz-kpi .v.dn{color:var(--rz-dn);}
.rz-kpi .s{font-size:11.5px;color:#9aa3b2;margin-top:4px;line-height:1.7;}
.rz-kpi .s b{color:#5a6478;font-weight:600;}
.rz-kpi .s .up{color:var(--rz-up);font-weight:700;} .rz-kpi .s .dn{color:var(--rz-dn);font-weight:700;}

/* ---------------- 区块 / 图 ---------------- */
.rz-sec{margin-bottom:18px;}
.rz-sec-h{display:flex;align-items:baseline;gap:8px;font-size:14px;font-weight:700;color:var(--rz-ink);
  margin-bottom:10px;padding-left:9px;border-left:3px solid var(--rz-blue);flex-wrap:wrap;}
.rz-sec-h small{font-size:11.5px;font-weight:500;color:var(--rz-mut);}
.rz-sec-h .r{margin-left:auto;font-size:11.5px;font-weight:600;color:var(--rz-mut);}
.rz-chart{width:100%;height:330px;}
.rz-chart.sm{height:200px;}
.rz-chart .rz-load,.rz-chart .rz-err{height:100%;display:flex;align-items:center;justify-content:center;
  color:#9aa3b2;font-size:13px;text-align:center;line-height:2;padding:0 20px;}
.rz-chart .rz-err{color:#b02a37;}
.rz-src{font-size:11px;color:#9aa3b2;line-height:1.9;border-top:1px dashed #f0f0f2;margin-top:10px;padding:10px 2px 2px;}
.rz-empty{color:#9aa3b2;font-size:13px;padding:34px 0;text-align:center;line-height:2;}

/* ---------------- 表 ---------------- */
.rz-tbl{overflow-x:auto;}
.rz-tbl table{width:100%;border-collapse:collapse;font-size:12.5px;white-space:nowrap;}
.rz-tbl th,.rz-tbl td{padding:7px 9px;border-bottom:1px solid var(--rz-line);text-align:left;}
.rz-tbl th{font-size:11.5px;font-weight:700;color:#5a6478;background:#fafafa;position:sticky;top:0;
  cursor:pointer;user-select:none;z-index:2;}
.rz-tbl th.nosort{cursor:default;}
.rz-tbl th.num,.rz-tbl td.num{text-align:right;font-variant-numeric:tabular-nums;}
.rz-tbl td.c{color:var(--rz-mut);font-variant-numeric:tabular-nums;}
.rz-tbl td.nm{font-weight:700;max-width:260px;overflow:hidden;text-overflow:ellipsis;}
.rz-tbl td.up{color:var(--rz-up);} .rz-tbl td.dn{color:var(--rz-dn);}
.rz-tbl td.na{color:#c8cdd8;}
.rz-tbl tbody tr:hover td{background:#fafafa;}
.rz-tbl tbody tr[data-c]{cursor:pointer;}
.rz-tbl tbody tr[data-c]:hover td{background:#f2f7ff;}
.rz-tbl tbody tr.self td{background:#f4f7ff;box-shadow:inset 3px 0 0 var(--rz-blue);}
.rz-tbl td .tag{display:inline-block;font-size:10.5px;padding:0 6px;border-radius:4px;line-height:18px;font-weight:700;}
.rz-tbl td .tag.self{color:#fff;background:var(--rz-blue);}
.rz-tbl td .tag.small{color:#7c6f64;background:#f1f3f5;font-weight:600;}
.rz-more{text-align:center;padding:12px 0 4px;}
.rz-tbl .bar-cell{position:relative;display:block;height:16px;border-radius:3px;background:#f0f3f9;overflow:hidden;min-width:52px;}
.rz-tbl .bar-cell i{position:absolute;left:0;top:0;bottom:0;background:#b3c7e2;border-radius:3px;}
.rz-tbl .bar-cell em{position:relative;font-style:normal;font-size:11px;color:#41506b;padding-left:5px;
  line-height:16px;font-variant-numeric:tabular-nums;}

/* ---------------- 板块：动态排名 ---------------- */
.rz-race-hd{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:8px;}
.rz-race-date{font-size:22px;font-weight:700;color:var(--rz-ink);font-variant-numeric:tabular-nums;
  letter-spacing:-.5px;min-width:150px;}
.rz-race-date small{font-size:11.5px;font-weight:600;color:var(--rz-mut);margin-left:6px;letter-spacing:0;}
.rz-race-ctl{display:flex;gap:7px;align-items:center;margin-left:auto;flex-wrap:wrap;}
.rz-race-ctl button{border:1px solid #e3e4e6;background:#fff;border-radius:8px;padding:6px 13px;
  font:600 12.5px/1.2 inherit;color:#5a6478;cursor:pointer;transition:.15s;white-space:nowrap;}
.rz-race-ctl button:hover{border-color:#b3c7e2;color:var(--rz-blue);}
.rz-race-ctl button.on{background:var(--rz-blue);border-color:var(--rz-blue);color:#fff;}
.rz-race-ctl button:disabled{opacity:.45;cursor:not-allowed;}
.rz-race-ctl input[type=range]{width:150px;accent-color:var(--rz-blue);cursor:pointer;}
.rz-race{width:100%;height:430px;}
.rz-race .rz-load{height:100%;display:flex;align-items:center;justify-content:center;color:#9aa3b2;font-size:13px;}

/* 多选对比 chips */
.rz-pick{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0 2px;max-height:112px;overflow-y:auto;}
.rz-pick button{border:1px solid #e3e4e6;background:#fff;border-radius:20px;padding:4px 12px;
  font:600 11.5px/1.3 inherit;color:#86868b;cursor:pointer;transition:.15s;white-space:nowrap;}
.rz-pick button:hover{border-color:#b3c7e2;color:var(--rz-blue);}
.rz-pick button.on{background:#eef3fa;border-color:#9dbaff;color:var(--rz-blue);}

/* ---------------- 个股 ---------------- */
.rz-sbar{display:flex;gap:9px;flex-wrap:wrap;align-items:center;position:relative;}
.rz-sbar input{flex:1;min-width:230px;border:1px solid #e3e4e6;border-radius:9px;padding:10px 13px;
  font-size:13.5px;font-family:inherit;color:var(--rz-ink);background:#fff;outline:none;box-sizing:border-box;}
.rz-sbar input:focus{border-color:var(--rz-blue);box-shadow:0 0 0 3px rgba(39,84,140,.10);}
.rz-sbar button{border:0;border-radius:9px;padding:10px 20px;font:600 13.5px/1 inherit;cursor:pointer;
  background:var(--rz-blue);color:#fff;transition:.15s;white-space:nowrap;}
.rz-sbar button:hover{background:#1f57e0;}
.rz-sbar button.ghost{background:#fff;color:#5a6478;border:1px solid #e3e4e6;}
.rz-sbar button.ghost:hover{color:var(--rz-blue);border-color:#b3c7e2;background:#f7faff;}
.rz-sug{position:absolute;top:calc(100% + 4px);left:0;min-width:300px;max-width:540px;z-index:95;
  background:#fff;border:1px solid #e3e6ec;border-radius:10px;box-shadow:0 10px 28px rgba(0,0,0,.14);
  overflow:hidden;max-height:320px;overflow-y:auto;}
.rz-sug .it{display:flex;align-items:center;gap:9px;padding:8px 12px;cursor:pointer;font-size:12.5px;}
.rz-sug .it:hover{background:#f2f7ff;}
.rz-sug .it b{color:var(--rz-ink);}
.rz-sug .it .cd{font-family:ui-monospace,Consolas,monospace;color:#86868b;font-size:11.5px;}
.rz-sug .it .why{margin-left:auto;color:#9aa3b2;font-size:11px;}
.rz-hot{margin-top:11px;font-size:12px;color:#9aa3b2;display:flex;gap:7px;flex-wrap:wrap;align-items:center;}
.rz-hot a{color:#5b7fd0;cursor:pointer;border-bottom:1px dashed #c3d3f0;}
.rz-hot a:hover{color:var(--rz-blue);border-bottom-style:solid;}
.rz-head{display:flex;gap:14px;flex-wrap:wrap;align-items:flex-start;padding-bottom:13px;
  border-bottom:1px solid var(--rz-bd);margin-bottom:14px;}
.rz-head .nm{font-size:21px;font-weight:700;color:var(--rz-ink);display:flex;gap:9px;align-items:center;flex-wrap:wrap;}
.rz-head .nm small{font-size:13px;color:var(--rz-mut);font-weight:600;font-family:ui-monospace,Consolas,monospace;}
.rz-head .nm .bdg{font-size:11.5px;font-weight:700;border:1px solid #cfe0ff;background:#f2f7ff;color:#27548c;
  border-radius:7px;padding:3px 9px;}
.rz-head .px{display:flex;gap:12px;align-items:baseline;margin-left:auto;}
.rz-head .px .p{font-size:23px;font-weight:700;font-variant-numeric:tabular-nums;}
.rz-head .px .c{font-size:14px;font-weight:700;font-variant-numeric:tabular-nums;}
.rz-kv{display:flex;gap:8px;flex-wrap:wrap;width:100%;margin-top:4px;}
.rz-kv span{font-size:12px;color:var(--rz-mut);background:#f5f8fd;border:1px solid #eaeff7;
  border-radius:7px;padding:4px 10px;}
.rz-kv span b{color:var(--rz-ink);font-weight:700;}
.rz-kv span.up b{color:var(--rz-up);} .rz-kv span.dn b{color:var(--rz-dn);}
.rz-switch{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:12px;color:#9aa3b2;margin:2px 0 10px;}
.rz-switch button{border:1px solid #e3e4e6;background:#fff;border-radius:20px;padding:5px 13px;
  font:600 12px/1.3 inherit;color:#5a6478;cursor:pointer;transition:.15s;}
.rz-switch button:hover{border-color:#b3c7e2;color:var(--rz-blue);}
.rz-switch button.on{background:var(--rz-blue);border-color:var(--rz-blue);color:#fff;}

/* ---------------- 响应式 ---------------- */
@media (max-width:1024px){
  .rz-kpis{grid-template-columns:repeat(2,minmax(0,1fr));}
  .rz-race{height:380px;}
}
@media (max-width:760px){
  .rz-kpis{grid-template-columns:minmax(0,1fr);}
  .rz-head .px{margin-left:0;}
  .rz-tbl th,.rz-tbl td{padding:6px 7px;font-size:12px;}
  .rz-race{height:330px;}
  .rz-race-date{font-size:18px;min-width:auto;}
  .rz-race-ctl{margin-left:0;width:100%;}
  .rz-race-ctl input[type=range]{width:100%;}
  .rz-sbar input{min-width:0;}
}

/* ★2026-10-19: 全市场榜表头点击排序 */
.rz-tbl th[data-k]{cursor:pointer;user-select:none;}
.rz-tbl th[data-k]:hover{color:#27548c;}
.rz-tbl th[data-k].on{color:#27548c;}

/* ★2026-10-19: 可选列面板（板块榜单 / 个股逐日明细共用）
   定位基准是 .rz-sec —— 面板 absolute 挂在区块右侧，不参与 flex 排版 */
.rz-sec{position:relative;}
.rz-cfgbtn{font:inherit;font-size:11.5px;font-weight:600;color:#5a6478;background:#fff;
  border:1px solid #e3e6ec;border-radius:6px;padding:1px 8px;line-height:18px;cursor:pointer;
  transition:.15s;white-space:nowrap;}
.rz-cfgbtn:hover{color:#27548c;border-color:#c3d3ea;background:#f7faff;}
.rz-cfgbtn.on{color:#fff;background:#27548c;border-color:#27548c;}
.rz-colpop{position:absolute;right:0;top:28px;z-index:60;background:#fff;border:1px solid #e3e6ec;
  border-radius:10px;box-shadow:0 10px 28px rgba(20,40,80,.13);padding:9px 11px;min-width:186px;max-width:264px;}
.rz-colpop[hidden]{display:none;}
.rz-colpop .rz-cp-in{display:flex;flex-direction:column;gap:1px;max-height:270px;overflow:auto;}
.rz-colpop label{display:flex;align-items:center;gap:7px;font-size:12px;color:#41506b;
  padding:3px 3px;cursor:pointer;border-radius:5px;white-space:nowrap;font-weight:500;}
.rz-colpop label:hover{background:#f5f8fd;}
.rz-colpop input{margin:0;width:13px;height:13px;accent-color:#27548c;cursor:pointer;flex:0 0 auto;}
.rz-colpop .rz-cp-f{display:flex;gap:12px;border-top:1px dashed #eef1f6;margin-top:7px;padding-top:7px;}
.rz-colpop .rz-cp-f a{font-size:11.5px;color:#27548c;cursor:pointer;font-weight:600;}
.rz-colpop .rz-cp-f a:hover{text-decoration:underline;}
