/* ============================================================
   TradingView 风格皮肤（覆盖层，不改原功能样式结构）
   颜色：TV 深蓝灰 + 蓝色主色；涨跌按中国习惯 涨红跌绿
   ============================================================ */
:root{
  --bg:#131722; --panel:#131722; --panel2:#1e222d; --card:#1e222d;
  --border:#2a2e39; --border-soft:#262b36; --seam:#2a2e39;
  --text:#d1d4dc; --dim:#9598a1; --dim2:#6a6d78;
  --green:#ef5350;   /* 涨 / 多 */
  --red:#26a69a;     /* 跌 / 空 */
  --up:#ef5350; --down:#26a69a;
  --amber:#2962ff; --blue:#2962ff;
  --accent-soft:rgba(41,98,255,.15); --accent-line:rgba(41,98,255,.55); --accent-deep:#2962ff;
  --purple:#b18cff; --teal:#26a69a;
  --mono:"JetBrains Mono","SF Mono",Consolas,"Roboto Mono",monospace;
}
*{scrollbar-color:#2a2e39 transparent}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-thumb{background:#2a2e39;border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:#3a4250}
::-webkit-scrollbar-track{background:transparent}
body{background:var(--bg);color:var(--text);font:13px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Microsoft YaHei",Arial,sans-serif}
:focus-visible{outline:1px solid #2962ff;outline-offset:1px}
button,input,select{font-family:inherit}

/* ── 涨跌色：统一 涨红跌绿（含股票模式） ───────────────── */
.up,.c-up,.s-up,.oh-up{color:var(--green)!important}
.down,.c-dn,.s-dn,.oh-down{color:var(--red)!important}
body.stock-mode .up,body.stock-mode .c-up,body.stock-mode .s-up,body.stock-mode .oh-up{color:var(--green)!important}
body.stock-mode .down,body.stock-mode .c-dn,body.stock-mode .s-dn,body.stock-mode .oh-down{color:var(--red)!important}
.tick-arrow.tick-up{color:var(--green)}.tick-arrow.tick-down{color:var(--red)}
@keyframes tickUp{0%{background:rgba(239,83,80,.30);transform:translateY(-2px)}100%{background:transparent;transform:none}}
@keyframes tickDown{0%{background:rgba(38,166,154,.30);transform:translateY(2px)}100%{background:transparent;transform:none}}
.tb-up{background:rgba(239,83,80,.14);color:var(--green)}
.tb-down{background:rgba(38,166,154,.14);color:var(--red)}
body.stock-mode .tb-up{background:rgba(239,83,80,.14);color:var(--green)}
body.stock-mode .tb-down{background:rgba(38,166,154,.14);color:var(--red)}
.dir.long{background:rgba(239,83,80,.16);color:var(--green)}
.dir.short{background:rgba(38,166,154,.16);color:var(--red)}
.chip.h{color:#ff9a97}.chip.l{color:#7fd9c8}
.sw-tag.H{color:#ff9a97}.sw-tag.L{color:#7fd9c8}
.lv-r{color:var(--green)!important}.lv-s{color:var(--red)!important}

/* ── 顶栏 ─────────────────────────────── */
#topbar{height:44px;gap:8px;padding:0 10px;background:#131722;border-bottom:1px solid #2a2e39;position:relative;z-index:80}
.brand{gap:8px}
/* 头像用包内 assets/brand.jpg */
.brand-logo{display:block;width:27px;height:27px;border-radius:5px;object-fit:cover;background:#fff;box-shadow:0 0 0 1px #2a2e39;flex:none}
.tv-brand-mark{display:none}
.brand-name{font-size:14px;font-weight:700;color:#e8eaf0;letter-spacing:.2px}
.tv-head-sep{height:22px;margin:0 2px;background:#2a2e39}
.tv-sym-search{display:inline-flex;color:#9598a1;flex:none}
#topbar .top-symbol{background:#1e222d;border:1px solid #2a2e39;border-radius:6px;padding:5px 10px;gap:8px;max-width:34vw}
#topbar .top-symbol:hover{border-color:#3c4250;background:#262b38}
#ts-symbol{font-size:13px;letter-spacing:.3px}
#ts-price{font-size:14px}
.tag-perp{background:#2a2e39;color:#9598a1;border-radius:3px;font-size:10px}
.sym-arrow{color:#787b86;font-size:10px}
.top-right{gap:6px}
.conn-badge{height:24px;border-radius:4px;border:1px solid #2a2e39;background:#1e222d;color:#9598a1;font-size:11px}
.conn-badge .dot.dot-on{background:#26a69a;box-shadow:0 0 0 2px rgba(38,166,154,.16)}
.conn-badge .dot.dot-off{background:#ef5350;box-shadow:0 0 0 2px rgba(239,83,80,.15)}
#login-link,#user-chip{display:none!important}

/* 顶部图表工具栏（周期 / 图标按钮） */
#topbar #toolbar{height:auto;flex:0 1 auto;min-width:0;background:transparent;border:0;padding:0;gap:3px;overflow:visible;margin-left:2px}
#topbar #toolbar .tb-sep{height:18px;margin:0 4px;background:#2a2e39}
#intervals{gap:1px;flex:none}
.tb-group button{padding:5px 8px;min-width:30px;font-size:12px;font-weight:500;color:#9598a1;border-radius:4px}
.tb-group button:hover{background:#2a2e39;color:#d1d4dc}
.tb-group button.active{background:rgba(41,98,255,.18);color:#5b8cff;border-color:transparent;font-weight:700}
.tv-tb-btn,.tv-tb-static{width:30px;height:28px;padding:0;flex:none;display:inline-flex;align-items:center;justify-content:center;
  background:transparent;border:1px solid transparent;border-radius:4px;color:#9598a1;font-size:14px;line-height:1;cursor:pointer}
.tv-tb-static{cursor:default;color:#6a6d78}
.tv-tb-btn:hover{background:#2a2e39;color:#d1d4dc}
.tv-tb-btn.active{background:rgba(41,98,255,.18);color:#5b8cff}
.tv-tb-text{font:600 11px var(--mono)}
.reso-tb-btn{display:none}

/* ── 布局 ─────────────────────────────── */
#layout{height:calc(100vh - 44px);height:calc(100dvh - 44px);background:#131722}
#center{order:1;min-width:0}
#chart-wrap{background:#131722}
#chart{background:#131722}
#chart-loading{background:rgba(19,23,34,.72);color:#9598a1}
#tv-status{height:26px;flex:none;display:flex;align-items:center;gap:10px;padding:0 10px;
  background:#131722;border-top:1px solid #2a2e39;color:#9598a1;font-size:11px;white-space:nowrap;overflow:hidden}
.st-item{display:inline-flex;align-items:center;gap:5px}
.st-dot{width:7px;height:7px;border-radius:50%;background:#6a6d78;display:inline-block;flex:none}
.st-dot.on{background:#26a69a;box-shadow:0 0 0 2px rgba(38,166,154,.16)}
.st-dot.off{background:#ef5350;box-shadow:0 0 0 2px rgba(239,83,80,.15)}
.st-sep{width:1px;height:12px;background:#2a2e39;flex:none}
.st-gap{flex:1}
.st-muted{color:#6a6d78}
#st-conn,#st-symbol,#st-iv,#st-price{color:#b2b5be}

/* ── 左侧垂直工具栏 ───────────────────── */
#tv-tools{width:44px;flex:none;order:0;background:#131722;border-right:1px solid #2a2e39;
  display:flex;flex-direction:column;align-items:center;padding:8px 0 10px;gap:2px;z-index:30}
.tv-tools-group{display:flex;flex-direction:column;gap:2px;width:100%;align-items:center}
.tv-tool{width:32px;height:32px;flex:none;display:flex;align-items:center;justify-content:center;
  background:transparent;border:0;border-radius:5px;color:#9598a1;cursor:pointer;position:relative}
.tv-tool svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tv-tool:hover{background:#2a2e39;color:#d1d4dc}
.tv-tool.active{background:rgba(41,98,255,.18);color:#5b8cff}
.tv-tool-text{font:600 11px var(--mono)}
.tv-tool-sep{height:1px;width:24px;background:#2a2e39;margin:4px 0;flex:none}
.tv-tools-spacer{flex:1}
.tv-tools-foot{padding-top:6px}
.tv-live-dot{width:8px;height:8px;border-radius:50%;background:#6a6d78;display:block}
.tv-live-dot.on{background:#26a69a;box-shadow:0 0 0 3px rgba(38,166,154,.16)}
.tv-live-dot.off{background:#ef5350;box-shadow:0 0 0 3px rgba(239,83,80,.16)}
.tv-tool:hover::after{content:attr(title);position:absolute;left:40px;top:50%;transform:translateY(-50%);
  white-space:nowrap;z-index:200;background:#2a2e39;color:#d1d4dc;border:1px solid #3c4250;border-radius:4px;
  padding:5px 9px;font-size:11px;pointer-events:none;box-shadow:0 6px 18px rgba(0,0,0,.45)}

/* ── 图上图例 ─────────────────────────── */
#chart-head{top:10px;left:14px;right:14px}
.ohlc{font-size:11.5px;gap:11px;color:#9598a1}
.ohlc-sym{color:#d1d4dc;font-size:12px}
.ohlc b{color:#d1d4dc;font-weight:500}
.stats{font-size:11px;color:#787b86}
.stats b{color:#b2b5be}
.conf-pill{background:rgba(41,98,255,.15);border:1px solid rgba(41,98,255,.45);color:#8aabff}
#trend-watermark{color:#d1d4dc}
#sym-watermark .sw-name{color:#b2b5be}
#brand-watermark{opacity:.22}
.etf-note,#etf-note{color:#b18cff}
.scale-corner{right:10px;bottom:26px;background:rgba(19,23,34,.9);border:1px solid #2a2e39;border-radius:5px;padding:2px}
.scale-corner button{color:#9598a1;height:24px;min-width:24px;font-size:11px;border-radius:3px}
.scale-corner button:hover{background:#2a2e39;color:#d1d4dc}
.scale-corner button.active{color:#5b8cff;background:rgba(41,98,255,.18)}
#panel-reopen{top:56px;background:rgba(19,23,34,.94);border:1px solid #2a2e39;border-right:0;border-radius:5px 0 0 5px;color:#9598a1;writing-mode:vertical-rl;letter-spacing:2px;padding:10px 5px;font-size:11px}
#panel-reopen:hover{color:#d1d4dc;background:#1e222d}
#reso-bar{background:rgba(19,23,34,.9);border:1px solid #2a2e39}
#loc-toast{background:#1e222d;border:1px solid #2a2e39;color:#d1d4dc}

/* ── 右侧栏 ───────────────────────────── */
#panel{width:320px;background:#131722;border-left:1px solid #2a2e39;order:2}
.panel-tabs{gap:2px;padding:8px 8px 0;background:#131722;border-bottom:1px solid #2a2e39}
.ptab{border:0;border-bottom:2px solid transparent;border-radius:0;background:transparent;color:#9598a1;font-size:12px;padding:9px 0;font-weight:600}
.ptab:hover{background:#1e222d;color:#d1d4dc}
.ptab.active{background:transparent;border-bottom-color:#2962ff;color:#5b8cff}
#panel-resize::before{background:#363a45;width:2px;height:48px}
#panel-resize:hover::before,#panel-resize.dragging::before{background:#2962ff}
#panel-resize.dragging{background:rgba(41,98,255,.10)}
.panel-sticky{background:#131722;padding:12px 12px 10px;border-bottom:1px solid #2a2e39}
.panel-title{font-size:13px;color:#d1d4dc}
.panel-sub{font-size:10.5px}
#panel-toggle{background:#1e222d;border:1px solid #2a2e39;border-radius:4px;color:#9598a1;font-size:10px;padding:3px 8px}
#panel-toggle:hover{background:#2a2e39;color:#d1d4dc}
.strat-view{background:#1e222d;border:1px solid #2a2e39;border-radius:5px;padding:2px;gap:2px}
.strat-view button{font-size:11px;padding:5px 8px;border-radius:3px;color:#9598a1}
.strat-view button:hover{background:#2a2e39;color:#d1d4dc}
.strat-view button.active{background:rgba(41,98,255,.2);color:#5b8cff;font-weight:700}
.strat-sep{background:#2a2e39}
.panel-body{padding:10px 12px 16px}
.strategy-card{background:#1e222d;border:1px solid #2a2e39;border-radius:6px;padding:12px;margin-bottom:10px;box-shadow:none}
.strategy-card.active-card{border-color:rgba(41,98,255,.55)}
.sc-icon{color:#5b8cff;width:24px;font-size:17px}
.sc-name{font-size:13px}
.sc-sub{font-size:10.5px;color:#787b86}
.sc-badge,.sc-gear{background:rgba(41,98,255,.14);color:#8aabff;border:1px solid rgba(41,98,255,.3);border-radius:4px;font-size:10px;padding:2px 7px}
.sc-gear{cursor:pointer}
.sc-gear:hover{background:rgba(41,98,255,.26)}
.sc-body{border-top:1px solid #2a2e39}
.trend-row .k,.level-row .k{color:#9598a1;font-size:11.5px}
.level-row b{color:#d1d4dc}
.levels{background:#1a1f2b;border:1px solid #262b36;border-radius:5px}
.tb-range{background:rgba(240,185,11,.12);color:#f0b90b}
.sig-head{color:#b2b5be;font-size:11.5px;border-bottom:1px solid #2a2e39;padding-bottom:5px}
.sig-count{color:#6a6d78}
.sig{background:#1a1f2b;border:1px solid #262b36;border-radius:4px;font-size:11.5px}
.sig:hover{border-color:#2962ff;background:#202736}
.sig .meta{color:#6a6d78}
.sig-empty{color:#6a6d78}
.chip{background:#1e222d;color:#9598a1;border:1px solid #2a2e39}
.chips .chip{margin-left:3px}
.howto{color:#9598a1;font-size:11.5px}
.howto summary{color:#b2b5be;font-size:11.5px}
.howto p{margin-top:6px}
.chan-toggles label{font-size:11.5px;color:#9598a1}
.chan-toggles input{accent-color:#2962ff}
.seg-btns button,.seg-row button{background:#1e222d;border:1px solid #2a2e39;color:#9598a1;border-radius:4px;font-size:11px}
.seg-btns button.active,.seg-row button.active{color:#5b8cff;border-color:rgba(41,98,255,.5);background:rgba(41,98,255,.14)}
#mkt-switch{gap:4px;padding:6px 10px}
#mkt-switch button{border-radius:4px;border:1px solid #2a2e39;background:#1e222d;color:#9598a1;font-size:11px;padding:5px 0}
#mkt-switch button.active{background:rgba(41,98,255,.18);border-color:rgba(41,98,255,.5);color:#5b8cff}
#wl-filter{background:#1e222d;border:1px solid #2a2e39;border-radius:4px;color:#d1d4dc;font-size:12px}
#wl-filter:focus{border-color:#2962ff}
.wl-head{padding:10px 10px 6px}
.wl-title{font-size:12px;color:#d1d4dc}
.wl-cols{color:#6a6d78;font-size:11px;border-bottom:1px solid #2a2e39;padding:6px 10px}
.wl-row{font-size:12.5px;padding:8px 10px;border-bottom:1px solid rgba(255,255,255,.025)}
.wl-row:hover{background:#1e222d}
.wl-row.active{background:rgba(41,98,255,.13);box-shadow:inset 2px 0 0 #2962ff}
.wl-row .star{color:#6a6d78}
.wl-row .star.on,.wl-row .star:hover{color:#f0b90b}
.wl-foot{color:#6a6d78;font-size:10.5px;border-top:1px solid #2a2e39}
.wl-sortbar button{background:#1e222d;border:1px solid #2a2e39;color:#9598a1;border-radius:4px}
/* 资金流面板 */
.fl-head{border-bottom:1px solid #2a2e39}
.fl-title{font-size:12.5px}
.fl-head button,.fl-head .fl-seg button{background:#1e222d;border:1px solid #2a2e39;color:#9598a1;border-radius:4px}
.fl-seg button{background:#1e222d;border:1px solid #2a2e39;color:#9598a1;border-radius:4px}
.fl-seg button.on{background:rgba(41,98,255,.18);border-color:rgba(41,98,255,.5);color:#5b8cff}
.fl-kpis>div{background:#1e222d;border:1px solid #2a2e39;border-radius:5px}
.fl-kpis h5{color:#9598a1;font-size:10.5px}
.fl-kpis b{color:#d1d4dc}
.fl-tf th,.fl-tf td{border-bottom:1px solid #262b36}
.fl-tf th{color:#6a6d78}
.fl-rank-head{color:#b2b5be;border-bottom:1px solid #2a2e39}
.fl-note,.fl-foot{color:#6a6d78;font-size:10.5px}
.badge.flat{background:#2a2e39;color:#9598a1}
/* 共振 / 版本 / 信号面板 */
.reso-meter{background:#2a2e39}
.reso-state.rs-none{background:#2a2e39;color:#9598a1}
.rb-pop{background:#1e222d;border:1px solid #2a2e39;color:#d1d4dc}

/* ── 弹窗（选股 / 共振设置 / 资金信号） ─────────── */
.modal-mask{background:rgba(4,7,14,.68);backdrop-filter:blur(2px)}
.picker,.modal,.sig-box{background:#1e222d;border:1px solid #363a45;border-radius:8px;box-shadow:0 24px 70px rgba(0,0,0,.68)}
.picker-head{border-bottom:1px solid #2a2e39;padding:10px 12px}
.picker-tabs button,.picker-tabs button.active{background:#1e222d;border:1px solid #2a2e39;border-radius:4px;color:#9598a1;font-size:11.5px}
.picker-tabs button.active{background:rgba(41,98,255,.18);border-color:rgba(41,98,255,.5);color:#5b8cff}
.src-select{background:#1e222d;border:1px solid #2a2e39;border-radius:4px;color:#d1d4dc}
.picker-hint{font-size:10.5px}
#picker-search{background:#161b26;border:1px solid #2a2e39;border-radius:4px;color:#d1d4dc}
#picker-search:focus{border-color:#2962ff}
.picker-cols{color:#6a6d78;border-color:#2a2e39}
.picker-row{border-bottom:1px solid rgba(255,255,255,.025);font-size:12.5px}
.picker-row:hover{background:#262b38}
.picker-row.active{background:rgba(41,98,255,.15)}
.picker-row .c{color:#9598a1}
.picker-row .st.on,.picker-row .st:hover{color:#f0b90b}
.picker-foot{border-top:1px solid #2a2e39;color:#6a6d78}
.modal-head{border-bottom:1px solid #2a2e39}
.modal-title{color:#d1d4dc}
.modal-x,.picker-x,.sig-head button{color:#9598a1}
.modal-sec{color:#b2b5be;border-bottom:1px solid #2a2e39}
.thr-card,.opt-row,.ind-row{background:#1a1f2b;border:1px solid #2a2e39;border-radius:5px}
.thr-btns button,.ind-actions button{background:#1e222d;border:1px solid #2a2e39;border-radius:4px;color:#9598a1}
.thr-btns button.active,.ind-actions button:hover{color:#5b8cff;border-color:rgba(41,98,255,.5);background:rgba(41,98,255,.14)}
input[type=range]{accent-color:#2962ff}
.switch input:checked+i{background:#2962ff}
.switch i{background:#2a2e39}
.ind-foot,.thr-note{color:#6a6d78}
.sig-cols{color:#6a6d78;border-bottom:1px solid #2a2e39}
.sig-body .sig-row{border-bottom:1px solid rgba(255,255,255,.03)}
.sig-detail,.sig-foot{border-top:1px solid #2a2e39;color:#9598a1}

/* Gate 兼容线路不含 taker buy 数据：资金流面板不展示假的 0 值 */
#tab-flow.tv-limited .fl-sig,
#tab-flow.tv-limited .fl-kpis,
#tab-flow.tv-limited #fl-cv,
#tab-flow.tv-limited .fl-tf,
#tab-flow.tv-limited #fl-rank,
#tab-flow.tv-limited .fl-rank-head,
#tab-flow.tv-limited #fl-iv,
#tab-flow.tv-limited .fl-note{display:none!important}
.tv-flow-banner{margin:10px 12px 4px;padding:11px 13px;border:1px solid rgba(240,185,11,.42);
  background:rgba(240,185,11,.07);border-radius:5px;color:#c8ad5c;font-size:11.5px;line-height:1.7}
.tv-flow-banner b{display:block;color:#f0b90b;font-size:12.5px;margin-bottom:3px}

/* ── 响应式 ───────────────────────────── */
@media(max-width:1280px){
  #panel{width:300px}
  #topbar .top-symbol{max-width:30vw}
  #st-source{max-width:150px;overflow:hidden;text-overflow:ellipsis}
}
@media(max-width:1100px){
  #tv-status .st-muted,#tv-status .st-muted+.st-sep{display:none}
  .stats{display:none}
}
@media(max-width:860px){
  body{overflow:auto}
  #tv-tools{display:none}
  #topbar{gap:6px;padding:0 8px;overflow-x:auto;scrollbar-width:none}
  #topbar #toolbar{overflow-x:auto;flex:1 1 auto}
  #topbar .top-symbol{max-width:none}
  .conn-badge{display:none}
  #panel{width:100%;max-width:100%;border-left:0}
  #layout{flex-direction:column;height:auto}
}

/* Cloudflare 登录墙：顶栏显示当前账号 / 邀请码后台 / 退出 */
#login-link{display:none!important}
#user-chip:not([hidden]){display:inline-flex!important}
#user-chip .user-name{color:#eaecef}
#user-chip a{color:#5b8cff}
