/* A股行业板块资金流向 — 主样式:主题变量 / 布局 / 图表区 / 原生控件美化 */
:root{--bg:#0e1117;--panel:#151a22;--panel2:#1a212b;--bd:#262d38;--tx:#c9d1d9;--tx2:#8b949e;--tx3:#6e7681;--red:#e5534b;--green:#3fb950;--amber:#d29922;--blue:#58a6ff;--grid:#222a35;--gridStrong:#3a4350;--gridFaint:#1b222c;--tipbg:rgba(13,17,23,.95);--r-s:8px;--r-m:10px;--r-l:12px;--fs-xs:1.1rem;--fs-kpi:2.4rem}
/* 字号三档:10px 基准, 文本全用 rem, 标准/大/特大跟随记忆 */
html,html[data-font="standard"]{font-size:10px}
html[data-font="large"]{font-size:11.5px}
html[data-font="xlarge"]{font-size:13px}
[data-theme="light"]{--bg:#f6f8fa;--panel:#ffffff;--panel2:#eef1f5;--bd:#d8dee4;--tx:#1f2328;--tx2:#57606a;--tx3:#6e7781;--red:#cf222e;--green:#1a7f37;--amber:#9a6700;--blue:#0969da;--grid:#eaeef2;--gridStrong:#c6cdd5;--gridFaint:#f0f3f6;--tipbg:rgba(255,255,255,.97)}
*{margin:0;padding:0;box-sizing:border-box}
body{background:var(--bg);color:var(--tx);font:1.3rem/1.6 "Segoe UI","Microsoft YaHei",sans-serif;height:100vh;height:100dvh;overflow:hidden}
.wrap{max-width:1500px;margin:0 auto;padding:10px 18px 10px;height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden}
header{display:flex;align-items:center;gap:14px;flex-wrap:wrap;border-bottom:1px solid var(--bd);padding-bottom:8px;flex:none}
h1{font-size:1.6rem;font-weight:600;letter-spacing:.5px}
h1 .sub{font-size:1.2rem;color:var(--tx2);font-weight:400;margin-left:10px}
.spacer{flex:1}
.tgroup{display:inline-flex;align-items:center;gap:8px}
.tgroup>label{font-size:1.1rem;color:var(--tx3);white-space:nowrap}
.tsep{width:1px;height:22px;background:var(--bd);flex:none}
.chip{display:inline-flex;align-items:center;gap:6px;background:var(--panel);border:1px solid var(--bd);border-radius:6px;padding:4px 10px;font-size:1.2rem;color:var(--tx2)}
.chip b{color:var(--tx);font-weight:500}
.dot{width:7px;height:7px;border-radius:50%;background:var(--green);display:inline-block}
.dot.closed{background:var(--tx3)}
select,input[type=search],button{background:var(--panel);border:1px solid var(--bd);color:var(--tx);border-radius:var(--r-s);padding:6px 10px;font-size:1.2rem;outline:none;transition:background .15s,border-color .15s,box-shadow .15s}
select:focus,input:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(88,166,255,.18)}
button{cursor:pointer}button:hover{background:var(--panel2);border-color:var(--tx3)}
/* ---- 原生下拉框:去原生箭头,双主题自绘chevron(展开后的系统列表纯CSS动不了,此处只尽力统一option配色) ---- */
select{appearance:none;-webkit-appearance:none;padding:6px 28px 6px 12px;font-weight:500;letter-spacing:.2px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='10'%20height='6'%3E%3Cpath%20d='M1%201l4%204%204-4'%20stroke='%238b949e'%20stroke-width='1.8'%20fill='none'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}
[data-theme="light"] select{background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='10'%20height='6'%3E%3Cpath%20d='M1%201l4%204%204-4'%20stroke='%2357606a'%20stroke-width='1.8'%20fill='none'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E")}
select:hover{border-color:var(--blue);background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='10'%20height='6'%3E%3Cpath%20d='M1%201l4%204%204-4'%20stroke='%2358a6ff'%20stroke-width='1.8'%20fill='none'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E")}
[data-theme="light"] select:hover{background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='10'%20height='6'%3E%3Cpath%20d='M1%201l4%204%204-4'%20stroke='%230969da'%20stroke-width='1.8'%20fill='none'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E")}
option{background:var(--panel);color:var(--tx)}
.kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin:10px 0;flex:none}
.kpi{background:var(--panel);border:1px solid var(--bd);border-radius:var(--r-l);padding:10px 14px}
.kpi .lab{font-size:1.2rem;color:var(--tx2)}
.kpi .val{font-size:var(--fs-kpi);font-weight:600;margin-top:2px;font-variant-numeric:tabular-nums}
.kpi .ksub{font-size:var(--fs-xs);color:var(--tx3);margin-top:2px;font-variant-numeric:tabular-nums;min-height:16px}
.searchbox{position:relative;margin:0 0 8px;flex:none}
.searchbox input{width:340px}
.sugg{position:absolute;top:36px;left:0;z-index:30;background:var(--panel);border:1px solid var(--bd);border-radius:8px;min-width:340px;max-height:320px;overflow:auto;display:none;box-shadow:0 8px 24px rgba(0,0,0,.45)}
.sugg div{padding:6px 12px;cursor:pointer;display:flex;justify-content:space-between;gap:14px}
.sugg div:hover{background:var(--panel2)}
.sugg .code{color:var(--tx3);font-size:1.1rem}
.sugg .tag{color:var(--tx3);font-size:1.1rem}
.chartcard{background:var(--panel);border:1px solid var(--bd);border-radius:12px;padding:10px 8px 4px;position:relative;flex:1;min-height:0;display:flex;flex-direction:column}
#chart{flex:1;min-height:0;display:flex;flex-direction:column}
#chart svg{width:100%;height:100%;display:block}
#tip{position:absolute;pointer-events:none;background:var(--tipbg);border:1px solid var(--bd);border-radius:8px;padding:8px 12px;font-size:1.2rem;display:none;z-index:20;min-width:180px}
#tip .t{color:var(--tx2);margin-bottom:4px}
#tip .row{display:flex;justify-content:space-between;gap:16px;font-variant-numeric:tabular-nums}
svg text{font-family:"Segoe UI","Microsoft YaHei",sans-serif}
footer{margin-top:8px;color:var(--tx3);font-size:1.15rem;display:flex;gap:18px;flex-wrap:wrap;flex:none}
.hint{color:var(--tx3);font-size:1.15rem;margin:2px 0 6px;flex:none}
/* ---- 原生滚动条美化(Chrome/Edge/Safari + Firefox,跟随深浅主题) ---- */
*{scrollbar-width:thin;scrollbar-color:var(--tx3) transparent}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{background-color:var(--bd);border-radius:8px;border:3px solid transparent;background-clip:content-box}
*::-webkit-scrollbar-thumb:hover{background-color:var(--tx3);border:3px solid transparent;background-clip:content-box}
*::-webkit-scrollbar-corner{background:transparent}
/* ---- 原生复选框自绘 ---- */
input[type=checkbox]{appearance:none;-webkit-appearance:none;width:15px;height:15px;flex:none;margin:0;border:1.5px solid var(--tx3);border-radius:4px;background:var(--panel);cursor:pointer;position:relative;transition:background .15s,border-color .15s}
input[type=checkbox]:hover{border-color:var(--blue)}
input[type=checkbox]:checked{background:var(--blue);border-color:var(--blue)}
input[type=checkbox]:checked::after{content:"";position:absolute;left:4px;top:1px;width:4px;height:8px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
input[type=checkbox]:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
/* ---- 其他原生细节 ---- */
::selection{background:var(--blue);color:#fff}
button{transition:background .15s,border-color .15s,color .15s,transform .05s}
button:active{transform:translateY(1px)}
.modal-body,.cfg-left,.cfg-pane,.cfg-chips,.sugg{overscroll-behavior:contain}
/* ---- 响应式 ---- */
@media (max-width: 1250px){
  .kpis{grid-template-columns:repeat(3,1fr)}
}
@media (max-width: 900px){
  body{height:auto;overflow:auto}
  .wrap{height:auto;min-height:100vh;min-height:100dvh;overflow:visible}
  .kpis{grid-template-columns:1fr 1fr}
  .kpi{padding:8px 10px}
  .kpi .val{font-size:1.7rem}
  header{gap:10px}
  h1{font-size:1.4rem}
  .tgroup>label{display:none}
  .searchbox input{width:100%}
  .modal-tools input[type=search]{width:100%}
  .chartcard{flex:none;height:52vh;height:52dvh;min-height:340px}
  #chart{overflow-x:auto}
  #chart svg{height:100%;width:auto;min-width:680px;max-width:none}
  .dtable{min-width:430px}
  #rpBar{flex-wrap:wrap}
  #rpSeek{flex-basis:100%;min-height:28px}
}
@media (max-width: 640px){
  .wrap{padding:10px 10px 24px}
  #calPop{position:fixed;left:12px;right:12px;top:120px;width:auto}
}
/* ---- 减少动态效果 ---- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none !important;transition:none !important}
}
/* ---- 交易日历 ---- */
.calwrap{position:relative}
#calBtn{min-width:150px;font-variant-numeric:tabular-nums}
#calPop{position:absolute;top:calc(100% + 6px);left:0;z-index:60;background:var(--panel);border:1px solid var(--bd);border-radius:10px;box-shadow:0 12px 32px rgba(0,0,0,.4);padding:10px 12px;width:308px}
.cal-head{display:flex;align-items:center;gap:2px;margin-bottom:6px}
.cal-head b{flex:1;text-align:center;font-size:1.3rem;font-weight:600}
.cal-head button{background:transparent;border:none;color:var(--tx2);font-size:1.4rem;padding:2px 8px}
.cal-head button:hover{color:var(--blue)}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.cw{color:var(--tx3);font-size:1.1rem;text-align:center;padding:2px 0}
.cd{position:relative;text-align:center;font-size:1.2rem;padding:5px 0;border-radius:6px;color:var(--tx2);font-variant-numeric:tabular-nums}
.cd.offm{visibility:hidden}
.cd.can{cursor:pointer;color:var(--tx)}
.cd.can:hover{background:var(--panel2)}
.cd.sel{outline:1.5px solid var(--blue)}
.dt{display:inline-block;width:5px;height:5px;border-radius:50%;margin-left:3px;vertical-align:middle}
.dt.file{background:var(--blue)}
.dt.hist{background:transparent;border:1.5px solid var(--tx3)}
.dt.live{background:var(--green)}
.cal-foot{display:flex;gap:10px;align-items:center;margin-top:8px;color:var(--tx3);font-size:1.1rem}
.cal-foot .cnt{margin-left:auto;color:var(--tx2)}
/* ---- 日级截面 ---- */
.dhead{display:flex;gap:14px;align-items:center;padding:10px 6px;flex-wrap:wrap}
.dhead b{font-size:1.5rem}
.dhead span{color:var(--tx2);font-size:1.2rem}
.dwrap{flex:1;min-height:0;overflow:auto;border:1px solid var(--bd);border-radius:8px}
.dtable{width:100%;border-collapse:collapse;font-size:1.25rem;font-variant-numeric:tabular-nums}
.dtable thead th{position:sticky;top:0;background:var(--panel2);color:var(--tx2);font-weight:500;text-align:left;padding:7px 12px}
.dtable td{padding:6px 12px;border-top:1px solid var(--bd)}
.dtable tbody tr:hover{background:var(--panel2)}
.pos{color:var(--red)}
.neg{color:var(--green)}
/* ---- 回放控制条 ---- */
#rpBar{position:absolute;left:8px;right:8px;bottom:4px;display:flex;align-items:center;gap:8px;background:var(--tipbg);border:1px solid var(--bd);border-radius:10px;padding:7px 12px;z-index:15;box-shadow:0 6px 20px rgba(0,0,0,.35)}
#rpBar button{background:transparent;border:1px solid transparent;border-radius:6px;color:var(--tx);font-size:1.2rem;padding:3px 8px;cursor:pointer}
#rpBar button:hover{background:var(--panel2);border-color:var(--tx3)}
#rpTime{font-size:1.2rem;color:var(--tx2);white-space:nowrap;font-variant-numeric:tabular-nums;min-width:118px}
#rpSeek{flex:1;accent-color:var(--blue);cursor:pointer;min-width:80px}
.rpSpeeds{display:flex;gap:2px}
.rpSpeeds button.on{border-color:var(--blue);color:var(--blue)}
/* ---- 骨架/空态 ---- */
.skel{border-radius:var(--r-s);background:linear-gradient(90deg,var(--panel2) 25%,var(--bd) 50%,var(--panel2) 75%);background-size:200% 100%;animation:skshim 1.2s infinite}
@keyframes skshim{to{background-position:-200% 0}}
.empty{padding:60px 20px;text-align:center}
.empty .et{font-size:1.4rem;font-weight:600;margin-bottom:6px}
.empty .ed{font-size:1.2rem;color:var(--tx2);margin-bottom:12px}
.empty button{border-color:var(--blue);color:var(--blue)}
/* ---- 自绘下拉 ---- */
.ddwrap{position:relative}
.ddbtn{display:inline-flex;align-items:center;gap:8px;min-width:110px;font-weight:500}
.ddchev{width:7px;height:7px;border-right:1.6px solid var(--tx2);border-bottom:1.6px solid var(--tx2);transform:rotate(45deg) translateY(-2px);flex:none;transition:border-color .15s}
.ddbtn:hover .ddchev{border-color:var(--blue)}
.ddpop{position:absolute;top:calc(100% + 6px);left:0;z-index:60;background:var(--panel);border:1px solid var(--bd);border-radius:10px;box-shadow:0 12px 32px rgba(0,0,0,.4);padding:5px;min-width:100%;white-space:nowrap}
.dditem{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:6px;font-size:1.25rem;cursor:pointer;color:var(--tx)}
.dditem:hover,.dditem.hot{background:var(--panel2)}
.dditem .ddtick{margin-left:auto;color:var(--blue);font-weight:700;visibility:hidden;font-size:1.2rem}
.dditem.on{color:var(--blue)}
.dditem.on .ddtick{visibility:visible}
/* ---- 轻提示 ---- */
#toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%) translateY(10px);background:var(--tipbg);border:1px solid var(--bd);border-radius:8px;padding:8px 16px;font-size:1.25rem;z-index:200;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;max-width:80vw}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
#toast.warn{border-color:var(--amber)}
#toast.err{border-color:var(--red)}