:root {
  --bg: #0e1117; --panel: #161b22; --border: #2a313c; --fg: #c9d1d9;
  --muted: #6e7681; --up: #ef5350; --down: #26a69a; --accent: #f5c542;
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; background: var(--bg); color: var(--fg);
  font: 13px/1.4 -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif; }
body { display: flex; flex-direction: row; }                        /* 两栏：左自选 + 右行情 */
#main-col { flex: 1; min-width: 0; min-height: 0; display: flex; flex-direction: column; }   /* 右栏：工具条/图/状态纵向排，min-width:0 让图能收窄 */

/* ---------------- 左侧栏目栏（rail）+ 面板 ---------------- */
#rail { flex: none; width: 52px; display: flex; flex-direction: column;
  background: var(--bg); border-right: 1px solid var(--border); }
.rail-btn { padding: 12px 0; text-align: center; color: var(--muted); cursor: pointer;
  border-left: 2px solid transparent; user-select: none; }
.rail-btn:hover { color: var(--fg); background: var(--panel); }
.rail-btn.on { color: var(--accent); border-left-color: var(--accent); background: var(--panel); }   /* 当前栏目高亮 */
#sidebar { width: 200px; flex: none; display: flex; flex-direction: column;
  background: var(--panel); border-right: 1px solid var(--border); overflow: hidden; }
.side-panel { flex: 1; min-height: 0; display: none; flex-direction: column; }   /* 同一时刻只显示选中的面板 */
.side-panel.on { display: flex; }
.wl-filter { flex: none; display: flex; flex-wrap: wrap; gap: 4px; padding: 6px 8px; border-bottom: 1px solid var(--border); }
.wl-filter:empty { display: none; }                /* 仅一个市场时不渲染 chip→自动隐藏整条 */
.wl-chip { padding: 1px 8px; font-size: 11px; color: var(--muted); background: var(--bg);
  border: 1px solid var(--border); border-radius: 10px; cursor: pointer; user-select: none; }
.wl-chip:hover { border-color: var(--accent); color: var(--fg); }
.wl-chip.on { color: var(--bg); background: var(--accent); border-color: var(--accent); }   /* 选中：金底深字 */
.watchlist { flex: 1; min-height: 0; overflow-y: auto; }
.wl-empty { padding: 12px 10px; color: var(--muted); line-height: 1.9; }
.wl-group { padding: 6px 10px 2px; font-size: 11px; font-weight: 600; color: var(--muted); border-top: 1px solid var(--border); }
.wl-group:first-child { border-top: none; }
.wl-item { padding: 5px 10px; cursor: pointer; border-left: 2px solid transparent; }
.wl-item:hover { background: #1f2630; }
.wl-item.sel { background: #1f2630; border-left-color: var(--accent); }
.wl-r1, .wl-r2 { display: flex; align-items: baseline; gap: 6px; }
.wl-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--fg); }
.wl-code { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  color: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; }
.wl-pct, .wl-price { flex: none; font-size: 12px; font-variant-numeric: tabular-nums; }   /* 价/涨跌幅由 JS 按涨跌着色 */
.wl-rm { flex: none; display: none; color: var(--muted); padding-left: 2px; }              /* 悬停才显示的移除✕ */
.wl-item:hover .wl-rm { display: inline; }
.wl-rm:hover { color: var(--up); }
.wl-item.wl-dim { opacity: .4; }            /* 查无行情(退市/非法)→整行弱化 */
.wl-item.wl-dim:hover { opacity: .72; }     /* 悬停略提亮，便于查看/移除 */

/* 细滚动条：自选栏 + 各下拉（Firefox thin + WebKit 6px，半透明轨道、悬停加深） */
.watchlist, .dropdown { scrollbar-width: thin; scrollbar-color: var(--border) transparent; }
.watchlist::-webkit-scrollbar, .dropdown::-webkit-scrollbar { width: 6px; height: 6px; }
.watchlist::-webkit-scrollbar-track, .dropdown::-webkit-scrollbar-track { background: transparent; }
.watchlist::-webkit-scrollbar-thumb, .dropdown::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }
.watchlist:hover::-webkit-scrollbar-thumb, .dropdown:hover::-webkit-scrollbar-thumb { background: #3a4554; }

/* ---------------- 市场一览（全窗可排序表格 + 无限滚动） ---------------- */
#market-view { flex: 1; min-width: 0; display: none; flex-direction: column; background: var(--bg); }
body.market-mode #sidebar, body.market-mode #main-col { display: none; }   /* 市场一览占满整窗：隐藏自选侧栏 + 行情区 */
body.market-mode #market-view { display: flex; }
#mkt-head { flex: none; display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  padding: 7px 12px; background: var(--panel); border-bottom: 1px solid var(--border); }
.mkt-tabs { display: flex; gap: 4px; }
.mkt-tab { padding: 3px 12px; color: var(--muted); border: 1px solid transparent; border-radius: 4px; cursor: pointer; user-select: none; }
.mkt-tab:hover { color: var(--fg); }
#mkt-markets .mkt-tab.on { color: var(--fg); font-weight: 600; border-color: var(--border); background: var(--bg); }   /* 市场：标签态 */
#mkt-ind { max-width: 150px; padding: 3px 6px; }                 /* 行业/种类下拉：申万二级/恒生/GICS；币·合约=种类 */
#mkt-ind:disabled { opacity: .4; cursor: not-allowed; }          /* 币·现货：无行业维度，置灰 */
.mkt-count { margin-left: auto; color: var(--muted); font-variant-numeric: tabular-nums; }
#mkt-scroll { flex: 1; min-height: 0; overflow: auto; scrollbar-width: thin; scrollbar-color: var(--border) transparent; }
#mkt-scroll::-webkit-scrollbar { width: 9px; height: 9px; }
#mkt-scroll::-webkit-scrollbar-thumb { background: var(--border); border-radius: 4px; }
#mkt-scroll::-webkit-scrollbar-thumb:hover { background: #3a4554; }
#mkt-table { border-collapse: collapse; width: 100%; font-variant-numeric: tabular-nums; white-space: nowrap; }
#mkt-table th, #mkt-table td { padding: 6px 12px; text-align: right; }
#mkt-table th:nth-child(-n+2), #mkt-table td:nth-child(-n+2) { text-align: left; }   /* 代码/名称左对齐 */
#mkt-table thead th { position: sticky; top: 0; z-index: 2; background: var(--panel); color: var(--muted);
  font-weight: 600; cursor: pointer; user-select: none; border-bottom: 1px solid var(--border); }
#mkt-table thead th:hover { color: var(--fg); }
#mkt-table thead th.on { color: var(--accent); }                 /* 当前排序列 */
#mkt-table thead th .arr { font-size: 10px; }
#mkt-table tbody tr { border-bottom: 1px solid #1b212b; cursor: pointer; }
#mkt-table tbody tr:hover { background: #1f2630; }
#mkt-table tbody tr.sel { background: #232b36; }                 /* 当前标的 */
.mkt-code { color: var(--muted); font-size: 12px; }
.mkt-name { color: var(--fg); }
.mkt-up { color: var(--up); }
.mkt-down { color: var(--down); }
.mkt-na { color: var(--muted); }                                 /* 无值 — */
#mkt-more { padding: 14px; text-align: center; color: var(--muted); }

/* 紧凑态（三栏：rail + 窄一览 + 行情）：点个股后中栏缩为「名称+涨跌幅」 */
body.market-mode.market-compact #market-view { flex: none; width: 190px; border-right: 1px solid var(--border); }
body.market-mode.market-compact #main-col { display: flex; }     /* 紧凑态右侧出行情图（覆盖 market-mode 的隐藏） */
body.market-compact #mkt-head, body.market-compact #mkt-scroll { display: none; }
#mkt-compact { display: none; flex: 1; min-height: 0; flex-direction: column; }
body.market-compact #mkt-compact { display: flex; }
#mkt-back { flex: none; padding: 8px 10px; color: var(--muted); cursor: pointer; user-select: none; border-bottom: 1px solid var(--border); }
#mkt-back:hover { color: var(--fg); }
#mkt-clist { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--border) transparent; }
#mkt-clist::-webkit-scrollbar { width: 6px; }
#mkt-clist::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }
.mkt-crow { display: flex; align-items: baseline; gap: 6px; padding: 6px 10px; cursor: pointer; border-left: 2px solid transparent; }
.mkt-crow:hover { background: #1f2630; }
.mkt-crow.sel { background: #1f2630; border-left-color: var(--accent); }
.mkt-crow .nm { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--fg); }
.mkt-crow .pc { flex: none; font-variant-numeric: tabular-nums; }

.toolbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 6px 10px; background: var(--panel); border-bottom: 1px solid var(--border); }
.tb-group { display: flex; align-items: center; gap: 4px; }

input, select, button { font: inherit; color: var(--fg); background: var(--bg);
  border: 1px solid var(--border); border-radius: 4px; padding: 4px 8px; outline: none; }
input:focus, select:focus { border-color: var(--accent); }
button { cursor: pointer; }
button:hover { border-color: var(--accent); }

#search { width: 260px; }
.search-wrap, .ind-wrap { position: relative; }

select:disabled, button:disabled { opacity: .4; cursor: not-allowed; }   /* 置灰锁定：数字货币/指数复权、分时下的指标 */
button:disabled:hover { border-color: var(--border); }      /* 禁用态不高亮边框 */
.chan-group label:has(input:disabled) { opacity: .4; cursor: not-allowed; }   /* 分时锁定缠论勾选 */
#ind-dropdown { min-width: 0; width: max-content; }       /* 指标名短，按内容自适应（不沿用搜索/自选的 240px） */
.dd-check { display: flex; align-items: center; gap: 6px; padding: 5px 10px; cursor: pointer; color: var(--fg); }
.dd-check:hover { background: #1f2630; }
.dd-check input { width: auto; }

body:not(.advanced) .adv-only { display: none; }   /* 进阶功能默认隐藏，URL 带 ?adv 时解锁（缠论：分型/笔/线段/特征序列/中枢买卖点） */
.chan-group label, .auto { color: var(--muted); display: flex; align-items: center; gap: 3px; cursor: pointer; }
.star { font-size: 16px; line-height: 1; padding: 3px 6px; color: var(--accent); }   /* 在/不在自选由 ☆/★ 字形区分（JS 同步 .on 类备用） */
.ghost { color: var(--muted); }

.dropdown { position: absolute; top: 110%; left: 0; z-index: 100; min-width: 240px;   /* 高于图表内部分面分隔线(z-index 50)，否则分隔线会画在下拉框上方 */
  max-height: 70vh; overflow-y: auto; background: var(--panel);
  border: 1px solid var(--border); border-radius: 6px; box-shadow: 0 6px 20px rgba(0,0,0,.5); }
.dropdown.hidden { display: none; }
.dd-item { padding: 6px 10px; cursor: pointer; display: flex; justify-content: space-between; gap: 10px; }
.dd-item:hover, .dd-item.sel { background: #1f2630; }
.dd-item .code { color: var(--accent); font-variant-numeric: tabular-nums; }
.dd-item .name { color: var(--fg); }
.dd-group { padding: 6px 10px 2px; font-size: 11px; font-weight: 600; color: var(--muted); border-top: 1px solid var(--border); }
.dd-group:first-child { border-top: none; }
.dd-empty { padding: 8px 10px; color: var(--muted); }

.info { margin-left: auto; color: var(--muted); font-variant-numeric: tabular-nums; }
#chart { flex: 1; min-height: 0; position: relative; }
.legend { position: absolute; left: 12px; z-index: 5; pointer-events: none; color: var(--fg);
  font-size: 12px; text-shadow: 0 1px 2px #000, 0 0 2px #000; white-space: nowrap;
  font-variant-numeric: tabular-nums; }   /* 等宽数字：悬停逐根更新时不左右抖动 */
.legend .lg-mut { color: var(--muted); }              /* OHLC/价 用弱化色 */
.legend .lg-name { color: var(--fg); }                /* 指标名(参数) */
.status { padding: 3px 10px; background: var(--panel); border-top: 1px solid var(--border);
  color: var(--muted); font-size: 12px; min-height: 22px;
  display: flex; align-items: center; gap: 8px; }
#status { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }  /* 长报错截断，别把版本号挤出屏幕 */
#status.err { color: var(--up); }
#ver { margin-top: auto; padding: 6px 3px; text-align: center; color: var(--muted); opacity: .6;
  font-size: 10px; line-height: 1.3; word-break: break-all; font-variant-numeric: tabular-nums; }   /* 版本号：常驻最左栏底部，各页面都可见 */
