/* base.css - 变量 / 重置 / 布局 */
:root {
  --bg:#0d1117; --bg2:#111823; --panel:#151d2a; --panel2:#1a2332; --line:#232e42;
  --tx:#dfe6f0; --tx2:#8ea0ba; --tx3:#5f7088; --gold:#f0a63a; --acc:#ffb84d;
  --up:#f2505a; --down:#22c06e; --buy:#ff7a59; --sell:#3aa9ff; --ok:#22c06e; --warn:#f0a63a;
}
* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; }
body {
  background: radial-gradient(1200px 500px at 80% -10%, rgba(240,166,58,.07), transparent 60%), var(--bg);
  color: var(--tx); font: 14px/1.5 -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
}
#app { height: 100vh; }
.layout { display: flex; height: 100vh; overflow: hidden; }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: #2a3850; border-radius: 4px; }
.side {
  width: 206px; flex-shrink: 0; background: linear-gradient(180deg, #10161f, #0c1119);
  border-right: 1px solid var(--line); display: flex; flex-direction: column;
}
.brand { padding: 17px 18px 13px; border-bottom: 1px solid var(--line); }
.logo { font-size: 19px; font-weight: 800; letter-spacing: 1px; color: #fff; }
.logo b { color: var(--gold); }
.brand .sub { font-size: 11px; color: var(--tx3); margin-top: 2px; letter-spacing: 2px; }
.nav { flex: 1; padding: 10px 8px; overflow: auto; }
.n-item {
  display: flex; align-items: center; gap: 10px; padding: 9px 12px; margin: 2px 0;
  border-radius: 8px; color: var(--tx2); cursor: pointer; font-size: 13.5px; transition: .15s;
}
.n-item:hover { background: rgba(255,255,255,.04); color: var(--tx); }
.n-item.active {
  background: linear-gradient(90deg, rgba(240,166,58,.18), rgba(240,166,58,.05));
  color: var(--acc); font-weight: 600;
}
.n-item svg { width: 17px; height: 17px; flex-shrink: 0; }
.n-item .badge {
  margin-left: auto; background: var(--up); color: #fff; border-radius: 20px;
  font-size: 10.5px; padding: 0 6px; line-height: 16px; min-width: 16px; text-align: center;
}
.side-foot { padding: 12px 16px; border-top: 1px solid var(--line); font-size: 11px; color: var(--tx3); }
.side-foot .dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; margin-right: 6px; background: var(--ok); }
.main { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.topbar {
  height: 54px; flex-shrink: 0; display: flex; align-items: center; gap: 14px;
  padding: 0 20px; border-bottom: 1px solid var(--line); background: rgba(13,17,23,.8);
}
.page-title { font-size: 16px; font-weight: 700; }
.spacer { flex: 1; }
.pill {
  display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--tx2);
  background: var(--panel); border: 1px solid var(--line); border-radius: 20px; padding: 4px 11px;
}
.pill .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--tx3); }
.pill.on .dot { background: var(--ok); box-shadow: 0 0 6px var(--ok); }
.pill.off .dot { background: var(--warn); box-shadow: 0 0 6px var(--warn); }
.content { flex: 1; overflow: auto; padding: 18px 20px; }
.up { color: var(--up); } .down { color: var(--down); } .muted { color: var(--tx3); } .warn { color: var(--warn); }

/* 卡片与栅格 */
.card { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 16px; }
.card + .card { margin-top: 14px; }
.card-title { font-size: 13.5px; font-weight: 700; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
.card-title .hint { font-weight: 400; font-size: 11.5px; color: var(--tx3); }
.card-title .right { margin-left: auto; }
.grid { display: grid; gap: 14px; }
/* 关键指标方块（底背离信号 / 顶背离信号 …）：9 个方块正好排一行，尺寸压到最小。
   窄了放不下的长文案由下一行截断 + title 兜底，否则换行又会把卡片重新撑高 */
.g-cards { grid-template-columns: repeat(9, 1fr); gap: 8px; }
.g-cards .kpi { padding: 7px 8px; }
.g-cards .k-label { font-size: 10.5px; white-space: nowrap; overflow: hidden; }
.g-cards .k-val { font-size: 14px; margin-top: 2px; }
.g-cards .k-val.sm { font-size: 14px; }
.g-cards .k-val, .g-cards .k-sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.g-cards .k-sub { font-size: 9.5px; margin-top: 1px; }
.g-2 { grid-template-columns: 1.6fr 1fr; }
.g-2b { grid-template-columns: 1fr 1fr; }
@media (max-width: 1180px) {
  .g-cards { grid-template-columns: repeat(3, 1fr); }
  .g-2, .g-2b { grid-template-columns: 1fr; }
}
.kpi {
  background: linear-gradient(180deg, var(--panel), var(--panel2));
  border: 1px solid var(--line); border-radius: 12px; padding: 13px 15px;
}
.k-label { font-size: 12px; color: var(--tx3); display: flex; justify-content: space-between; }
.k-val { font-size: 23px; font-weight: 800; margin-top: 7px; font-variant-numeric: tabular-nums; }
.k-val.sm { font-size: 18px; }
.k-sub { font-size: 11px; color: var(--tx3); margin-top: 3px; }

/* 芯片 */
.chips { display: flex; flex-wrap: wrap; gap: 7px; }
.chip {
  display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; line-height: 1;
  border-radius: 20px; padding: 4px 9px; border: 1px solid var(--line);
  color: var(--tx2); background: var(--panel2); cursor: pointer; user-select: none;
}
.chip.on { color: var(--acc); border-color: rgba(240,166,58,.5); background: rgba(240,166,58,.1); }
.chip.buy { color: var(--buy); border-color: rgba(255,122,89,.45); background: rgba(255,122,89,.1); }
.chip.sell { color: var(--sell); border-color: rgba(58,169,255,.45); background: rgba(58,169,255,.1); }
/* 买/卖色芯片的选中态：.chip.buy/.chip.sell 排在 .chip.on 之后，会盖掉后者的选中样式，需单独提权 */
.chip.buy.on { border-color: var(--buy); background: rgba(255,122,89,.26); box-shadow: inset 0 0 0 1px rgba(255,122,89,.3); }
.chip.sell.on { border-color: var(--sell); background: rgba(58,169,255,.26); box-shadow: inset 0 0 0 1px rgba(58,169,255,.3); }
.chip.gray { cursor: default; }
/* 状态类标签（趋势增强 / 震荡 / 放量 / 波动率）：中性色，既不表示买也不表示卖 */
.chip.state { color: var(--tx2); border-color: var(--line); background: rgba(142,160,186,.1); }
.chip.state.on { color: var(--acc); border-color: rgba(240,166,58,.5); background: rgba(240,166,58,.1); }
/* 背离类标签（菱形标记） */
.chip.div { color: #f0a63a; border-color: rgba(240,166,58,.45); background: rgba(240,166,58,.1); }
.chip.div.on { border-color: #f0a63a; background: rgba(240,166,58,.26); box-shadow: inset 0 0 0 1px rgba(240,166,58,.3); }
/* 策略组合命中标签（AND 共振） */
.chip.strat { cursor: default; font-weight: 600; }
.chip.strat.buy { color: var(--acc); border-color: rgba(240,166,58,.45); background: rgba(240,166,58,.1); }
.chip.strat.sell { color: #b98cff; border-color: rgba(185,140,255,.45); background: rgba(185,140,255,.1); }
/* 按钮 / 输入 */
.btn {
  display: inline-flex; align-items: center; gap: 6px; justify-content: center;
  font-size: 12.5px; padding: 7px 13px; border-radius: 8px; border: 1px solid var(--line);
  background: var(--panel2); color: var(--tx); cursor: pointer; transition: .15s; white-space: nowrap;
}
.btn:hover { border-color: #33415c; filter: brightness(1.12); }
.btn.primary { background: linear-gradient(135deg, #ff9d2e, var(--gold)); color: #1b1206; border: none; font-weight: 700; }
.btn.ghost { background: transparent; }
.btn.danger { color: var(--up); border-color: rgba(242,80,90,.4); }
.btn:disabled { opacity: .55; cursor: not-allowed; }
.btn.sm { padding: 4px 9px; font-size: 11.5px; }
.btn.xs { padding: 1px 6px; font-size: 11px; line-height: 1.3; }
/* 搜索框：内嵌 input + 右侧 × 清除键；用于历史作战台的股票名/代码搜索 */
.searchbox {
  display: inline-flex; align-items: center;
  background: var(--bg2); border: 1px solid var(--line); border-radius: 8px;
  padding: 0 4px 0 8px;
}
.searchbox:focus-within { border-color: #3aa9ff; }
.searchbox .search {
  background: transparent; border: none; outline: none; color: var(--tx);
  padding: 5px 6px; font-size: 12.5px; min-width: 220px;
}
.searchbox .btn.xs.ghost { margin-left: 2px; }
/* 自选切换按钮：未加是 outline 弱化态（提示性），已加是实色金黄态（确认性）；
   hover"已加自选"变成警示红边框，提示会删除，让误点可识别 */
.watch-toggle.on {
  background: linear-gradient(135deg, #ff9d2e, var(--gold));
  color: #1b1206; border: none; font-weight: 700;
}
.watch-toggle.on:hover { border: 1px solid var(--up); color: var(--up); background: var(--panel2); }
.input, .select {
  background: var(--bg2); border: 1px solid var(--line); color: var(--tx);
  border-radius: 8px; padding: 7px 11px; font-size: 13px; outline: none;
}
.input:focus, .select:focus { border-color: var(--gold); }
.input.w { width: 200px; }
.select { cursor: pointer; }
label.f { display: flex; flex-direction: column; gap: 5px; font-size: 12px; color: var(--tx2); }

/* 开关 */
.switch { position: relative; display: inline-block; width: 40px; height: 22px; flex-shrink: 0; }
.switch input { display: none; }
.switch i { position: absolute; inset: 0; background: #26334a; border-radius: 20px; transition: .2s; cursor: pointer; }
.switch i::after {
  content: ""; position: absolute; width: 16px; height: 16px; left: 3px; top: 3px;
  background: #cfd9e6; border-radius: 50%; transition: .2s;
}
.switch input:checked + i { background: linear-gradient(90deg, #e89b2e, var(--gold)); }
.switch input:checked + i::after { left: 21px; background: #fff; }

/* 表格 */
table.tbl { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.tbl th {
  text-align: left; color: var(--tx3); font-weight: 500; font-size: 11.5px;
  padding: 7px 10px; border-bottom: 1px solid var(--line); white-space: nowrap;
}
.tbl td { padding: 9px 10px; border-bottom: 1px solid rgba(35,46,66,.55); vertical-align: middle; }
.tbl tr:hover td { background: rgba(255,255,255,.02); }
.tbl .num { text-align: right; font-variant-numeric: tabular-nums; }
.stock-name { font-weight: 700; }
.stock-code { color: var(--tx3); font-size: 11px; }
.linkbtn { color: var(--acc); cursor: pointer; font-size: 12px; }
.linkbtn:hover { text-decoration: underline; }
.empty { text-align: center; color: var(--tx3); padding: 34px 0; font-size: 13px; }
.empty .big { font-size: 30px; margin-bottom: 8px; opacity: .5; }
/* 信号列表行 */
.sig-row { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 10px; cursor: pointer; }
.sig-row:hover { background: var(--panel2); }
.sig-row + .sig-row { margin-top: 6px; }
.sig-row .pl { font-size: 15px; font-weight: 700; width: 56px; flex-shrink: 0; text-align: center; }
.sig-row .mid { flex: 1; min-width: 0; }
.sig-row .nm { font-weight: 700; font-size: 13.5px; }
.sig-row .desc { color: var(--tx3); font-size: 11.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sig-row .px { font-variant-numeric: tabular-nums; text-align: right; }
/* 监控台「买卖点信号速览」：一行两列。半宽单元格里收紧箭头占位、首行禁止换行，
   这样行高与单列时一致（策略芯片挤不下时用省略号截断，而不是把行撑高） */
.sig-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 10px; }
.sig-grid .sig-row + .sig-row { margin-top: 0; } /* 行间距交给 gap，避免与单列规则叠加 */
.sig-grid .sig-row .pl { width: 24px; }
.sig-grid .sig-row .px { flex-shrink: 0; }
.sig-grid .sig-row .mid > div:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.arrow-buy, .arrow-sell {
  width: 0; height: 0; border-left: 7px solid transparent; border-right: 7px solid transparent;
  display: inline-block;
}
.arrow-buy { border-bottom: 9px solid var(--buy); }
.arrow-sell { border-top: 9px solid var(--sell); }
/* 仅状态标签（趋势/量能/波动率）而无明确买卖方向时的占位符 */
.arrow-neutral { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--tx3); opacity: .45; }

/* Toast */
#toasts {
  position: fixed; top: 62px; right: 18px; z-index: 9999;
  display: flex; flex-direction: column; gap: 10px; max-width: 360px;
}
.toast {
  background: var(--panel2); border: 1px solid #35435f; border-left: 3px solid var(--gold);
  border-radius: 10px; padding: 11px 14px; box-shadow: 0 6px 24px rgba(0,0,0,.35);
  animation: slide-in .25s ease; cursor: pointer;
}
.toast.buy { border-left-color: var(--buy); }
.toast.sell { border-left-color: var(--sell); }
.t-title { font-weight: 700; font-size: 13px; }
.t-sub { font-size: 12px; color: var(--tx2); margin-top: 3px; }
@keyframes slide-in { from { opacity: 0; transform: translateX(20px); } to { opacity: 1; transform: none; } }

/* 弹层 / 图表 */
.overlay {
  position: fixed; inset: 0; background: rgba(4,8,14,.72); z-index: 1000;
  display: flex; align-items: center; justify-content: center; padding: 20px 30px;
}
.modal {
  background: var(--panel); border: 1px solid var(--line); border-radius: 14px;
  width: min(980px, 96vw); max-height: 96vh; display: flex; flex-direction: column;
  overflow: hidden; box-shadow: 0 8px 32px rgba(0,0,0,.45);
}
.m-head { display: flex; align-items: center; padding: 13px 18px; border-bottom: 1px solid var(--line); gap: 12px; }
.m-body { overflow: auto; padding: 14px 18px; }
.m-x { margin-left: auto; cursor: pointer; color: var(--tx3); font-size: 20px; width: 28px; height: 28px; border-radius: 6px; display: grid; place-items: center; }
.m-x:hover { background: rgba(255,255,255,.08); color: var(--tx); }
#stockChart { width: 100%; height: min(520px, 66vh); }
.chart-tags { margin: 10px 0 2px; }
.src-chip {
  display: inline-block; vertical-align: 2px; margin-left: 8px; font-size: 10.5px; font-weight: 500;
  color: var(--acc); border: 1px solid rgba(58,169,255,.35); background: rgba(58,169,255,.1);
  border-radius: 20px; padding: 1px 8px;
}
.src-chip.warn { color: var(--warn); border-color: rgba(240,166,58,.45); background: rgba(240,166,58,.12); }
.degrade-note {
  font-size: 11.5px; color: var(--warn); border: 1px dashed rgba(240,166,58,.45);
  background: rgba(240,166,58,.07); border-radius: 8px; padding: 7px 11px; margin-bottom: 10px; line-height: 1.6;
}
.ind-strip { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.ind-strip .it { font-size: 11.5px; color: var(--tx2); background: var(--bg2); border: 1px solid var(--line); border-radius: 8px; padding: 6px 10px; }

/* ── 分时（盘中）评估条：左侧日内强度分 + 右侧分时指标明细 ───────────── */
.intra-eval { margin-top: 10px; padding: 10px 12px; background: var(--bg2); border: 1px solid var(--line); border-radius: 10px; }
.intra-eval .ie-top { display: flex; align-items: center; gap: 12px; }
.intra-eval .ie-score {
  flex-shrink: 0; width: 46px; height: 46px; border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  font-size: 19px; font-weight: 700; font-variant-numeric: tabular-nums;
  background: rgba(142, 160, 186, .14); color: var(--tx2);
}
/* 档位配色：强→弱 由红到绿，与涨跌色同源，扫一眼即知强弱 */
.intra-eval .ie-score.lv-strong { background: rgba(242, 80, 90, .24); color: #ff8a92; }
.intra-eval .ie-score.lv-bull { background: rgba(242, 80, 90, .13); color: #ff9aa2; }
.intra-eval .ie-score.lv-neutral { background: rgba(142, 160, 186, .14); color: var(--tx2); }
.intra-eval .ie-score.lv-bear { background: rgba(34, 192, 110, .13); color: #4fd69a; }
.intra-eval .ie-score.lv-weak { background: rgba(34, 192, 110, .24); color: #4fd69a; }
.intra-eval .ie-title { font-size: 12.5px; color: var(--tx2); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.intra-eval .ie-title b { color: #cfd8e6; }
.intra-eval .ind-strip { margin-top: 8px; }
/* 图与评估左右并排：指标竖排贴右侧，图与评估同屏，无需下滑 */
.m-cols.m-2col { display: flex; align-items: flex-start; gap: 14px; }
.m-cols.m-2col .m-col-main { flex: 1 1 auto; min-width: 0; }
/* 侧栏高度与左侧图表对齐（同为 520px，矮视口按 66vh 一起收缩），
   该高度足够放下指标明细 + 叠加开关 + 图例 + 脚注，正常视口下不会出现栏内滚动条 */
.m-cols.m-2col .m-col-side { flex: 0 0 306px; width: 306px; max-height: min(520px, 66vh); overflow-y: auto; }
.m-col-side .intra-eval { margin-top: 0; }
.m-col-side .intra-eval .ie-top { flex-wrap: wrap; row-gap: 8px; }
/* 非分时的右栏面板：指标明细 / 主图叠加开关 + 图例（与分时评估同处一栏、同款卡片） */
.m-col-side .side-panel { background: var(--bg2); border: 1px solid var(--line); border-radius: 10px; padding: 9px 12px; }
.m-col-side .side-panel + .side-panel { margin-top: 10px; }
.m-col-side .side-panel .side-tt { font-size: 11.5px; color: var(--tx2); font-weight: 600; margin-bottom: 7px; }
.m-col-side .side-panel .ind-strip { margin-top: 0; }
/* 非分时明细条目都短（DIF / RSI / SAR / 量比…），两列并排省一半高度 */
.m-col-side .side-panel .ind-strip { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }
.m-col-side .side-panel .ind-strip .it { width: auto; }
/* 右栏里的叠加开关与图例：从「图下方整宽横排」收进 306px，需紧凑排布 */
.m-col-side .chart-toggles { margin-top: 0; gap: 6px; }
.m-col-side .legend-bar { margin-top: 7px; gap: 5px 12px; font-size: 11px; }
/* 右栏底部脚注：图上符号含义 + 免责（原为图例内一条，合并进脚注省一行） */
.m-col-side .side-foot { margin-top: 8px; font-size: 11px; color: var(--tx3); line-height: 1.6; }
/* 竖排明细：每条独占一行、行距收紧，长文案自动折行，避免右侧被撑宽（分时评估用） */
.m-col-side .ind-strip { flex-direction: column; gap: 5px; }
.m-col-side .ind-strip .it { width: 100%; line-height: 1.45; font-size: 11px; padding: 4px 8px; }
.m-col-side .ind-strip .it.muted { font-size: 11px; }
/* 数据源卡片 / 进度 / 表单行 */
.src-card {
  display: flex; flex-direction: column; gap: 10px; border: 1px solid var(--line);
  border-radius: 12px; padding: 16px; background: var(--panel); position: relative;
}
.src-card.active {
  border-color: rgba(240,166,58,.6);
  background: linear-gradient(180deg, rgba(240,166,58,.06), var(--panel));
}
.src-card h3 { margin: 0; font-size: 15px; }
.src-card .dsc { font-size: 12px; color: var(--tx3); min-height: 34px; }
.src-status { font-size: 12px; border-radius: 8px; padding: 7px 10px; background: var(--bg2); border: 1px solid var(--line); }
.bar { height: 7px; background: var(--bg2); border-radius: 5px; overflow: hidden; }
.bar > i {
  display: block; height: 100%; background: linear-gradient(90deg, var(--gold), var(--acc));
  border-radius: 5px; transition: width .3s;
}
.f-row { display: flex; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px solid rgba(35,46,66,.5); }
.f-row:last-child { border-bottom: none; }
.f-row .fl { width: 160px; color: var(--tx2); font-size: 12.5px; flex-shrink: 0; }
.f-row .fl small { display: block; color: var(--tx3); font-size: 11px; }
.f-row .fc { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.tip {
  font-size: 11.5px; color: var(--tx3); border: 1px dashed #33415c;
  background: rgba(35,46,66,.25); border-radius: 8px; padding: 8px 11px; line-height: 1.7;
}
.tip b { color: var(--acc); font-weight: 600; }
code.path { background: #0b1018; border: 1px solid var(--line); border-radius: 5px; padding: 1px 6px; font-size: 11px; color: var(--acc); }
.form-num { width: 84px; }
.row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.mini { font-size: 11px; color: var(--tx3); }
.spin {
  display: inline-block; width: 13px; height: 13px; border: 2px solid rgba(255,255,255,.2);
  border-top-color: var(--acc); border-radius: 50%; animation: rot .7s linear infinite;
}
@keyframes rot { to { transform: rotate(360deg); } }
.pulse { animation: pulse 1.2s infinite; }
@keyframes pulse { 50% { opacity: .35; } }
.rule-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px 22px; }
.rule-item { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 0; }
.rule-item .rl { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.kind-buy { color: var(--buy); font-size: 10px; }
.kind-sell { color: var(--sell); font-size: 10px; }
.kind-state { color: var(--tx3); font-size: 10px; }

/* 选股条件（智能选股页）：40 个原子条件 + 策略组合原先每项一行带大开关，纵向占掉近千像素，
   现改为「一行摘要 + 折叠」+ 展开后的紧凑芯片行（按类别成行），默认折叠时只占一行 */
.cond-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 6px 0 2px; }
.cond-head .ct { font-size: 12.5px; color: var(--tx2); font-weight: 600; }
.cond-head .csum { font-size: 11px; color: var(--tx3); }
.cond-head .csum b { color: var(--acc); font-weight: 600; font-variant-numeric: tabular-nums; }
.cond-head .csum b.off { color: var(--warn); }
.cond-head .linkbtn { margin-left: auto; }
.cond-body { margin-top: 8px; padding-top: 9px; border-top: 1px dashed var(--line); }
.rc-line { display: flex; align-items: flex-start; gap: 10px; padding: 3px 0; }
.rc-line + .rc-line { border-top: 1px solid rgba(35,46,66,.35); }
.rc-cat { flex: 0 0 56px; font-size: 11px; color: var(--tx3); padding-top: 5px; }
.rc-wrap { display: flex; flex-wrap: wrap; gap: 6px; flex: 1; min-width: 0; }
.rc {
  display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; line-height: 1;
  padding: 4px 9px; border-radius: 999px; border: 1px solid var(--line);
  background: var(--bg2); color: var(--tx3); cursor: pointer; user-select: none; transition: .15s;
}
.rc:hover { color: var(--tx2); border-color: #33415c; }
.rc i.dot { width: 6px; height: 6px; border-radius: 50%; background: var(--tx3); opacity: .45; flex-shrink: 0; }
.rc.buy i.dot { background: var(--buy); }
.rc.sell i.dot { background: var(--sell); }
.rc.on { color: var(--tx); }
.rc.on i.dot { opacity: 1; }
.rc.on.state { border-color: rgba(240,166,58,.65); background: rgba(240,166,58,.14); }
.rc.on.buy { border-color: rgba(255,122,89,.75); background: rgba(255,122,89,.16); }
.rc.on.sell { border-color: rgba(58,169,255,.75); background: rgba(58,169,255,.16); }

/* 今日作战台（监控台首屏）：扫描只说明"发生了什么"，这里回答"所以该干什么"——
   一句结论定打法，决策卡直接给 入场/止损/目标/盈亏比/仓位 */
.mood { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 10px 13px; border-radius: 10px; background: var(--bg2); border: 1px solid var(--line); margin: 6px 0 12px; }
.mood.buy { border-color: rgba(255,122,89,.42); background: rgba(255,122,89,.07); }
.mood.sell { border-color: rgba(58,169,255,.42); background: rgba(58,169,255,.07); }
.mood .m-badge { font-size: 13px; font-weight: 700; padding: 4px 11px; border-radius: 999px; background: rgba(255,255,255,.06); white-space: nowrap; }
.mood.buy .m-badge { color: var(--buy); background: rgba(255,122,89,.16); }
.mood.sell .m-badge { color: var(--sell); background: rgba(58,169,255,.16); }
.mood .m-text { flex: 1; min-width: 240px; font-size: 12.5px; color: var(--tx2); line-height: 1.7; }
.mood .m-nums { display: flex; gap: 14px; font-size: 11.5px; color: var(--tx3); white-space: nowrap; }
.mood .m-nums b { font-size: 15px; font-variant-numeric: tabular-nums; }
.deck-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(272px, 1fr)); gap: 10px; }
.dcard { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; background: var(--bg2); cursor: pointer; transition: .15s; }
.dcard:hover { border-color: #33415c; transform: translateY(-1px); }
.dcard.buy { border-left: 3px solid var(--buy); }
.dcard.reduce { border-left: 3px solid var(--sell); }
.dcard.wait { border-left: 3px solid var(--tx3); }
.d-head { display: flex; align-items: center; gap: 6px; }
.d-head .nm { font-weight: 700; font-size: 13.5px; }
.d-act { font-size: 10.5px; padding: 2px 7px; border-radius: 4px; font-weight: 600; white-space: nowrap; }
.dcard.buy .d-act { color: var(--buy); background: rgba(255,122,89,.16); }
.dcard.reduce .d-act { color: var(--sell); background: rgba(58,169,255,.16); }
.dcard.wait .d-act { color: var(--tx3); background: rgba(255,255,255,.06); }
.d-score { margin-left: auto; font-size: 11px; color: var(--acc); font-variant-numeric: tabular-nums; white-space: nowrap; }
.d-px { margin: 7px 0 8px; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.d-px b { font-size: 19px; font-variant-numeric: tabular-nums; }
.d-levels { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 12px; font-size: 11.5px; }
.d-levels > div { display: flex; justify-content: space-between; gap: 6px; }
.d-levels span { color: var(--tx3); }
.d-levels b { font-variant-numeric: tabular-nums; }
.d-levels i { font-style: normal; color: var(--tx3); font-size: 10.5px; margin-left: 3px; }
.d-why { display: flex; flex-wrap: wrap; gap: 4px; margin: 9px 0 7px; }
.d-chip { font-size: 10.5px; color: var(--tx2); background: rgba(255,255,255,.05); border: 1px solid var(--line); border-radius: 4px; padding: 2px 6px; }
.d-btns { display: flex; gap: 12px; border-top: 1px dashed var(--line); padding-top: 7px; }
.d-btns .linkbtn { font-size: 11px; }
/* 决策卡筛选条：勾「已自选」只留有自选态的卡片（与股池页 .ck 同一交互），右侧是过滤命中数 */
.desk-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: -2px 0 10px; }
.desk-bar .ck {
  display: inline-flex; align-items: center; gap: 7px; flex: none; cursor: pointer; user-select: none;
  border: 1px solid var(--line); background: var(--panel2); border-radius: 9px; padding: 5px 10px;
  font-size: 12px; color: var(--tx2); transition: .15s;
}
.desk-bar .ck:hover { border-color: rgba(240,166,58,.45); }
.desk-bar .ck.on { color: var(--acc); border-color: rgba(240,166,58,.5); background: rgba(240,166,58,.1); }
.desk-bar .ck.dis { opacity: .45; cursor: not-allowed; }
.desk-bar .ck.dis:hover { border-color: var(--line); }
.desk-bar .ck input { width: 14px; height: 14px; margin: 0; flex: none; accent-color: var(--acc); cursor: pointer; }
.desk-bar .ck.dis input { cursor: not-allowed; }
.desk-bar .ck .n { font-weight: 700; font-size: 10.5px; opacity: .75; font-variant-numeric: tabular-nums; }
/* 情绪行的三个数字即下方卡片的分类计数，点击直接过滤（.zero = 该类为 0，点了只会看到空列表，故不响应） */
.mood .m-nums { gap: 6px; }
.mood .m-nums span { cursor: pointer; user-select: none; border-radius: 7px; padding: 3px 8px; transition: .15s; }
.mood .m-nums span:hover { background: rgba(255,255,255,.07); color: var(--tx2); }
.mood .m-nums span.on { background: rgba(240,166,58,.16); color: var(--acc); }
.mood .m-nums span.on b { color: var(--acc); }
.mood .m-nums span.zero { opacity: .5; cursor: default; }
.mood .m-nums span.zero:hover { background: none; color: var(--tx3); }
/* 已自选态：卡片名后的星标 + 底部按钮转为不可点的「已自选 ✓」 */
.d-wstar { color: var(--warn); font-size: 11px; }
.d-btns .linkbtn.on { color: var(--tx3); cursor: default; }
.d-btns .linkbtn.on:hover { text-decoration: none; }
/* 全局机会横幅：任何页面都能被"喊到"，点一下直达作战台 */
#cb-banner { position: fixed; top: 10px; left: 50%; transform: translateX(-50%); z-index: 10000; min-width: 320px; max-width: min(680px, 94vw); border-radius: 12px; border: 1px solid rgba(255,122,89,.5); background: linear-gradient(180deg, rgba(40,27,24,.98), rgba(24,26,34,.98)); box-shadow: 0 12px 30px rgba(0,0,0,.45); padding: 11px 14px; cursor: pointer; animation: bannerIn .28s ease-out; }
#cb-banner.sell { border-color: rgba(58,169,255,.5); background: linear-gradient(180deg, rgba(19,32,45,.98), rgba(24,26,34,.98)); }
#cb-banner .b-t { display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; padding-right: 14px; }
#cb-banner .b-t .tag { font-size: 10.5px; padding: 2px 7px; border-radius: 4px; background: rgba(255,122,89,.18); color: var(--buy); white-space: nowrap; }
#cb-banner.sell .b-t .tag { background: rgba(58,169,255,.18); color: var(--sell); }
#cb-banner .b-s { font-size: 11.5px; color: var(--tx2); margin-top: 5px; line-height: 1.6; font-variant-numeric: tabular-nums; }
#cb-banner .b-x { position: absolute; top: 8px; right: 10px; color: var(--tx3); font-size: 12px; }
@keyframes bannerIn { from { opacity: 0; transform: translate(-50%, -12px); } to { opacity: 1; transform: translate(-50%, 0); } }
/* 窄屏时移到屏幕底部：顶部已被 toast 占用，两者会叠在一起 */
@media (max-width: 762px) {
  #cb-banner { top: auto; bottom: 12px; animation: none; }
}
/* 自选股弹窗内"该股预警列表"的单行容器（提醒中心已改卡片，这里仍复用，勿删） */
.reline { display: flex; align-items: flex-start; gap: 12px; padding: 11px 12px; border-radius: 10px; }
.reline:hover { background: var(--panel2); }
/* 提醒中心：一条一行太占高度，改成卡片网格（2 列，超宽 3 列），同屏条数翻倍。
   卡片固定 4 行（标签 / 标的 / 说明 / 操作），长说明单行截断、全文交给 title */
.rem-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; align-content: start; }
@media (min-width: 1600px) { .rem-grid { grid-template-columns: repeat(3, 1fr); } }
.rem-card {
  border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px 9px;
  background: var(--panel2); cursor: pointer; min-width: 0;
  transition: border-color .15s, background .15s, transform .12s;
}
.rem-card:hover { border-color: #3aa9ff; background: rgba(58,169,255,.06); }
.rem-card:active { transform: translateY(1px); }
.rem-card.new { border-color: rgba(240,166,58,.3); background: rgba(240,166,58,.05); }
.rem-card.new:hover { border-color: #f0a63a; background: rgba(240,166,58,.10); }
.rem-card .rem-hd { display: flex; align-items: center; gap: 6px; min-width: 0; }
.rem-card .rem-hd .chip { padding: 1px 6px; }
/* 合并提醒的「×N 多信号聚合」角标：
   设计意图——reminders.js 把同次扫描同 code 同 kind 的多 type 合并成 1 条 rec，
   卡片上要让用户一眼看出这是「多个信号聚合」而不是「单信号」，
   避免误判为强度一般的普通提醒。视觉策略：
     · 主 chip 仍是「买入信号 / 卖出信号」承担方向语义，×N 仅作数字提示；
     · 沿用主 chip 的 buy/sell/state 色系但低饱和、不抢主 chip 视觉重点；
     · font-size / padding 收紧，缩成"角标"密度；
     · title 给出完整 label 列表供悬停查看。
   不影响旧 chip 类，未启用 merged 字段的 rec 不显示。 */
.rem-card .rem-hd .chip.merged-n {
  font-size: 10.5px; font-weight: 600; line-height: 1.45;
  padding: 0 5px;
  opacity: .85;
  cursor: help;
}
.rem-card .rem-hd .chip.merged-n.buy {
  color: var(--buy); border-color: rgba(255,122,89,.25); background: rgba(255,122,89,.05);
}
.rem-card .rem-hd .chip.merged-n.sell {
  color: var(--sell); border-color: rgba(58,169,255,.25); background: rgba(58,169,255,.05);
}
.rem-card .rem-hd .chip.merged-n.state {
  color: var(--tx2); border-color: var(--line); background: rgba(142,160,186,.05);
}
/* 提醒卡片右下方「查看个股」主行动按钮：金黄色，提示用户这是主要的下一步动作 */
.rem-act .linkbtn.primary { color: var(--gold); font-weight: 600; }
.rem-act .linkbtn.primary:hover { color: #ffb34c; }
.rem-time { margin-left: auto; flex-shrink: 0; color: var(--tx3); font-size: 11px; font-variant-numeric: tabular-nums; }
.rem-name { margin-top: 3px; display: flex; align-items: baseline; gap: 6px; min-width: 0; font-size: 13px; }
.rem-name b { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rem-name .mini { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rem-line {
  margin-top: 2px; font-size: 11.5px; color: var(--tx3);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rem-act { margin-top: 5px; display: flex; align-items: center; gap: 12px; }
.rem-st { margin-left: auto; font-size: 11px; }
.legend-bar { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 11.5px; color: var(--tx2); margin-top: 4px; }
.legend-bar i { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: 5px; }
/* 主图叠加层开关（布林带 / 均线）：点击只重绘，不重新拉行情（现挂在弹窗右侧栏内） */
.chart-toggles { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 9px; }
.chart-toggles .chip i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; }
.chart-toggles .chip i.ma { width: 16px; }
/* 弹窗：该股在最近一次扫描中命中的信号（由列表页透传，回答「信号N 到底是哪个信号」） */
.sig-hit { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin-bottom: 10px; }
.sig-hit .sh-tt { font-size: 11.5px; color: var(--tx2); font-weight: 600; }
.sig-hit .sh-note { font-size: 11px; color: var(--tx3); }
.stat-line { display: flex; justify-content: space-between; padding: 8px 2px; border-bottom: 1px solid rgba(35,46,66,.5); font-size: 12.5px; }
.stat-line:last-child { border-bottom: none; }
.stat-line .s2 { color: var(--tx2); font-variant-numeric: tabular-nums; }

/* 自选搜索联想（全 A 股：代码/汉字/拼音首字母） */
.ac-box { position: relative; }
.ac-panel {
  position: absolute; left: 0; top: calc(100% + 6px); width: 100%; z-index: 40;
  background: #0e1522; border: 1px solid #33415c; border-radius: 10px;
  box-shadow: 0 12px 32px rgba(0,0,0,.5); padding: 6px; max-height: 320px; overflow: auto;
}
.ac-item { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 8px; cursor: pointer; }
.ac-item:hover { background: var(--panel); }
.ac-item + .ac-item { margin-top: 2px; }

/* 价格预警编辑器 / 小弹窗 */
.modal.sm { width: min(560px, 94vw); }
.seg { display: inline-flex; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; background: var(--bg2); }
.seg span { padding: 6px 14px; cursor: pointer; font-size: 12px; color: var(--tx2); }
.seg span + span { border-left: 1px solid var(--line); }
.seg span.seg-on { background: rgba(240,166,58,.14); color: var(--acc); }
.seg span.seg-on.up { background: rgba(255,122,89,.15); }
.seg span.seg-on.down { background: rgba(34,192,110,.15); }
.chip.warn { color: var(--warn); border-color: rgba(240,166,58,.5); background: rgba(240,166,58,.1); }

/* 股池页 */
.pool-head { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 12px; }
.pool-head .search {
  display: flex; align-items: center; gap: 8px; flex: 1; min-width: 260px; max-width: 460px;
  border: 1px solid var(--line); background: var(--panel); border-radius: 9px; padding: 7px 12px;
}
.pool-head .meta2 { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
/* 搜索框后的「已自选」勾选框：与搜索框同高，勾选态跟随强调色 */
.pool-head .ck {
  display: inline-flex; align-items: center; gap: 7px; flex: none; cursor: pointer; user-select: none;
  border: 1px solid var(--line); background: var(--panel); border-radius: 9px; padding: 7px 11px;
  font-size: 12.5px; color: var(--tx2); transition: .15s;
}
.pool-head .ck:hover { border-color: rgba(240,166,58,.45); }
.pool-head .ck.on { color: var(--acc); border-color: rgba(240,166,58,.5); background: rgba(240,166,58,.1); }
.pool-head .ck.dis { opacity: .45; cursor: not-allowed; }
.pool-head .ck.dis:hover { border-color: var(--line); }
.pool-head .ck input { width: 14px; height: 14px; margin: 0; flex: none; accent-color: var(--acc); cursor: pointer; }
.pool-head .ck.dis input { cursor: not-allowed; }
.pool-head .ck .n { font-weight: 700; font-size: 10.5px; opacity: .75; font-variant-numeric: tabular-nums; }
/* 筛选条：信号快速过滤 + 板块多选 */
.pool-filters { display: flex; flex-direction: column; gap: 7px; margin: -2px 0 12px; }
.pool-filters .pf-row { display: flex; gap: 10px; align-items: flex-start; }
.pool-filters .pf-label { flex: none; width: 32px; padding-top: 5px; font-size: 11.5px; color: var(--tx3); text-align: right; }
.pool-filters .chips { flex: 1; min-width: 0; align-items: center; }
.pf-scroll { max-height: 78px; overflow-y: auto; padding-right: 4px; }
/* 芯片组内的竖线分隔（股池筛选条 / 监控台信号速览共用） */
.v-sep { align-self: stretch; width: 1px; background: var(--line); margin: 2px; }
/* 芯片内的计数（仅股池筛选条，避免影响其它页面芯片里的 <b>） */
.pool-filters .chip .n { font-weight: 700; font-size: 10.5px; opacity: .7; font-variant-numeric: tabular-nums; }
.pool-filters .chip.on .n { opacity: 1; }
.tbl.pool th { cursor: pointer; user-select: none; white-space: nowrap; }
.tbl.pool th .srt { opacity: .35; font-size: 10px; margin-left: 3px; }
.tbl.pool th.on-sort { color: var(--acc); }
.tbl.pool th.on-sort .srt { opacity: 1; }
.tbl.pool th.num, .tbl.pool td.num { text-align: right; }
.tbl.pool tbody tr { cursor: pointer; }

/* 自选股 拖动排序 / 置顶 */
.tbl.wl .wh { width: 36px; text-align: center; }
/* 名称列（名称 + 代码）：不换行，宽度在自然宽度上略放宽 */
.tbl.wl th:nth-child(2), .tbl.wl td:nth-child(2) { white-space: nowrap; padding-right: 18px; }
.tbl.wl .gh {
  display: inline-block; cursor: grab; color: var(--tx3); font-size: 14px; line-height: 1.2;
  user-select: none; -webkit-user-select: none; opacity: 0; transition: opacity .15s;
}
.tbl.wl tr:hover .gh { opacity: 1; }
.tbl.wl tr.wl-dragging > td { opacity: .4; }
.tbl.wl tr.wl-dragging .gh { cursor: grabbing; }
.tbl.wl .linkbtn.pin-on { color: var(--warn); font-weight: 600; }
.tbl.wl tr.tr-pin > td:first-child { box-shadow: inset 3px 0 0 var(--warn); }

/* 数据接入：编辑网址 */
.url-edit { border: 1px dashed var(--line); border-radius: 10px; padding: 10px 14px 12px; margin-top: 12px; }
.url-edit-head { display: flex; align-items: center; gap: 10px; }
.url-edit-head .spacer { flex: 1; }
.url-edit-head b { color: var(--tx); }
.url-edit .f-row { margin-top: 8px; }

/* 系统日志页 */
.log-filter { display: flex; gap: 6px; margin: 10px 0 8px; }
.log-filter .chip { cursor: pointer; user-select: none; }
.log-box {
  border: 1px solid var(--line); border-radius: 10px; height: calc(100vh - 330px); min-height: 280px;
  overflow: auto; padding: 8px 10px; background: rgba(0,0,0,.25);
  font: 12px/1.65 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.lg { display: flex; gap: 8px; padding: 1px 2px; white-space: pre-wrap; word-break: break-all; }
.lg.empty { color: var(--tx3); justify-content: center; padding: 30px; }
.lg-t { color: var(--tx3); flex: none; }
.lg-lv { flex: none; width: 52px; text-align: center; border-radius: 4px; font-size: 11px; line-height: 16px; height: 16px; margin-top: 2px; font-weight: 600; }
.lg.info .lg-lv { color: #5aa0ff; background: rgba(58,139,255,.14); }
.lg.info .lg-msg { color: #c6d3e6; }
.lg.warn .lg-lv { color: var(--warn); background: rgba(240,166,58,.14); }
.lg.warn .lg-msg { color: #e6c98f; }
.lg.err .lg-lv { color: #ff8f7a; background: rgba(242,80,90,.16); }
.lg.err .lg-msg { color: #ffb3a8; }
.lg.dbg .lg-lv { color: #8b98ad; background: rgba(143,152,173,.12); }

/* 资讯页 */
.news-bar { display: flex; align-items: center; gap: 10px; margin: 14px 0 2px; flex-wrap: wrap; }
.news-search {
  flex: 1; min-width: 260px; display: flex; align-items: center; gap: 8px;
  background: rgba(255,255,255,.045); border: 1px solid var(--line); border-radius: 20px;
  padding: 0 13px; height: 32px; color: var(--tx3);
}
.news-search input { border: 0; background: transparent; outline: 0; color: var(--tx); flex: 1; font-size: 12.5px; }
.news-search:focus-within { border-color: rgba(240,166,58,.55); }
.news-prov { display: flex; gap: 6px; flex-wrap: wrap; }
.news-cats { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
.news-cats .chip { cursor: pointer; user-select: none; }
.nf-list { display: flex; flex-direction: column; }
.nf-row { display: flex; gap: 14px; padding: 11px 2px; border-bottom: 1px solid rgba(255,255,255,.05); }
.nf-time { flex: none; width: 92px; padding-top: 2px; color: var(--tx2); font-size: 12px; font-variant-numeric: tabular-nums; }
.nf-main { flex: 1; min-width: 0; }
.nf-title { font-size: 13.5px; font-weight: 600; line-height: 1.5; }
.nf-title a { color: var(--tx); text-decoration: none; }
.nf-title a:hover { color: var(--acc); text-decoration: underline; }
.nf-sum {
  color: var(--tx2); font-size: 12px; margin-top: 3px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.nf-meta { display: flex; align-items: center; gap: 6px; margin-top: 5px; flex-wrap: wrap; font-size: 11px; color: var(--tx3); }
.nf-fail { border: 1px dashed rgba(240,166,58,.5); border-radius: 10px; padding: 18px; text-align: center; color: var(--tx2); margin-top: 12px; font-size: 13px; }
/* 标题/详情入口：弹窗内阅读，不再跳转外链 */
.nf-link { color: var(--tx); cursor: pointer; }
.nf-link:hover { color: var(--acc); text-decoration: underline; }
.nf-more { text-align: center; color: var(--tx3); font-size: 11.5px; padding: 14px 0 2px; }
.nf-more .linkbtn { margin-left: 5px; }
/* 资讯详情弹窗：宽度收窄到阅读舒适区 */
.modal.art { width: min(880px, 96vw); }
.modal.art .m-body { padding: 18px 24px 20px; }
.art-title { font-size: 15px; font-weight: 700; line-height: 1.5; }
.art-body { max-width: 880px; }
.art-body p { margin: 0 0 11px; font-size: 13.5px; line-height: 1.78; color: var(--tx); }
.art-note { border: 1px dashed rgba(240,166,58,.5); border-radius: 10px; padding: 10px 12px; color: var(--warn); font-size: 12.5px; margin-bottom: 12px; }
.art-foot { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; border-top: 1px solid var(--line); margin-top: 16px; padding-top: 10px; }

/* ===== 用户体系 / 登录引导 ===== */
.boot-screen { height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; color: var(--tx3); font-size: 13px; }
.inline-err { color: var(--up); font-size: 12px; margin: 6px 2px; }
.ok-text { color: var(--ok); font-size: 12px; margin-left: 10px; }
.notice { font-size: 12px; border-radius: 8px; padding: 8px 12px; margin: 8px 0; }
.notice.warn { color: var(--warn); border: 1px dashed rgba(240,166,58,.45); background: rgba(240,166,58,.06); }

.auth-shell { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.auth-panel {
  width: min(900px, 94vw); display: grid; grid-template-columns: 1.08fr .92fr; min-height: 540px;
  background: var(--panel); border: 1px solid var(--line); border-radius: 18px; overflow: hidden;
  box-shadow: 0 24px 70px rgba(0,0,0,.45);
}
.auth-hero {
  background: linear-gradient(165deg, rgba(240,166,58,.14), rgba(240,166,58,.02) 55%), #101822;
  padding: 46px 42px; display: flex; flex-direction: column; border-right: 1px solid var(--line);
}
.auth-brand { display: flex; align-items: baseline; gap: 14px; }
.logo.big { font-size: 26px; }
.auth-hero h1 { font-size: 27px; line-height: 1.3; margin: 30px 0 12px; }
.auth-hero p { color: var(--tx2); font-size: 13.5px; line-height: 1.8; margin: 0 0 18px; }
.auth-hero ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.auth-hero li { color: var(--tx2); font-size: 13px; display: flex; gap: 10px; align-items: center; }
.auth-hero li i { color: var(--gold); font-style: normal; }
.footline { margin-top: auto; font-size: 11px; color: var(--tx3); }
.auth-form { background: var(--panel); padding: 42px 38px; display: flex; flex-direction: column; }
.af-head .tabs { display: inline-flex; gap: 18px; border-bottom: 1px solid var(--line); padding-bottom: 10px; margin-bottom: 16px; }
.af-head .tabs span { cursor: pointer; color: var(--tx3); font-size: 14px; padding-bottom: 11px; margin-bottom: -11px; }
.af-head .tabs span.on { color: var(--acc); font-weight: 700; border-bottom: 2px solid var(--acc); }
.af-title { font-size: 22px; font-weight: 800; }
.af-sub { color: var(--tx3); font-size: 12px; margin: 6px 0 20px; line-height: 1.7; }
.af-fields { display: flex; flex-direction: column; }
.af-l { color: var(--tx2); font-size: 12.5px; margin: 10px 0 5px; }
.af-opt { color: var(--tx3); }
.af-i { width: 100%; }
.af-err { color: var(--up); font-size: 12px; margin: 8px 0 0; }
.af-btn { width: 100%; margin-top: 18px; justify-content: center; }
.af-foot { margin-top: auto; font-size: 11px; color: var(--tx3); line-height: 1.7; }

/* 顶栏账号 / 套餐 */
.usr { position: relative; display: flex; align-items: center; gap: 8px; padding: 4px 8px 4px 4px; border-radius: 10px; background: var(--panel); border: 1px solid var(--line); cursor: pointer; }
.usr:hover { border-color: #3a4d6b; }
.usr-ava {
  width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; font-weight: 800; font-size: 13px;
  background: linear-gradient(135deg, var(--gold), var(--acc)); color: #171108;
}
.usr-name { font-size: 12.5px; display: flex; align-items: center; gap: 6px; }
.caret { border: 4px solid transparent; border-top-color: var(--tx2); margin-top: 4px; }
.usr-menu { position: absolute; top: calc(100% + 8px); right: 0; width: 226px; z-index: 61; background: var(--panel2); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; box-shadow: 0 16px 40px rgba(0,0,0,.5); }
.um-head { padding: 11px 15px; border-bottom: 1px solid var(--line); font-size: 13.5px; font-weight: 700; }
.um-sub { font-weight: 400; color: var(--tx3); font-size: 11.5px; margin-top: 2px; }
.um-item { padding: 9px 15px; cursor: pointer; font-size: 13px; color: var(--tx2); }
.um-item:hover { background: rgba(255,255,255,.05); color: var(--tx); }
.um-item.danger { color: var(--up); }
.um-sep { height: 1px; background: var(--line); margin: 4px 0; }
.um-mask { position: fixed; inset: 0; z-index: 50; }
.plan-pill { cursor: pointer; }
.plan-pill.warn { color: var(--warn); border-color: rgba(240,166,58,.5); }
.plan-pill.on { color: var(--down); border-color: rgba(34,192,110,.4); }
.plan-pill.off { color: var(--tx3); }

/* 订阅中心 */
.ent-banner { display: flex; gap: 22px; align-items: center; padding: 10px 4px 4px; }
.ent-state { min-width: 330px; }
.ent-tag { font-size: 13px; font-weight: 800; margin-bottom: 4px; }
.ent-state.ok .ent-tag { color: var(--down); }
.ent-state.no .ent-tag { color: var(--warn); }
.ent-line { display: flex; gap: 10px; align-items: center; font-size: 15px; }
.ent-line .chip { margin-left: 4px; }
.ent-hint { flex: 1; color: var(--tx2); font-size: 12px; line-height: 1.8; }
.plan-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.plan-card { position: relative; border: 1px solid var(--line); border-radius: 12px; padding: 16px 14px; cursor: pointer; background: var(--panel2); transition: .15s; }
.plan-card:hover { border-color: #3a4d6b; }
.plan-card.on { border-color: var(--gold); box-shadow: 0 0 0 1px rgba(240,166,58,.45), 0 8px 22px rgba(0,0,0,.3); }
.pc-name { font-weight: 700; font-size: 14px; }
.pc-price { font-size: 26px; font-weight: 800; margin: 10px 0 4px; font-variant-numeric: tabular-nums; }
.pc-price small { font-size: 15px; }
.pc-price em { font-style: normal; font-size: 12px; color: var(--tx3); font-weight: 400; }
.pc-sub { font-size: 11.5px; color: var(--tx3); }
.pc-check { position: absolute; top: 12px; right: 12px; font-size: 11px; color: var(--tx3); }
.plan-card.on .pc-check { color: var(--gold); font-weight: 700; }
.pay-steps { margin-top: 14px; border: 1px dashed rgba(34,192,110,.5); background: rgba(34,192,110,.05); border-radius: 10px; padding: 14px 16px; font-size: 12.5px; line-height: 2; }
.ps-title { font-size: 14px; margin-bottom: 4px; }
.ps-step i { display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: var(--down); color: #06130c; font-style: normal; font-weight: 800; font-size: 11px; margin-right: 6px; }
.ps-note { color: var(--tx2); white-space: pre-wrap; font-size: 12px; padding-left: 24px; }

/* AI 复盘 */
.ai-off { text-align: center; padding: 44px 0 30px; color: var(--tx2); font-size: 13px; line-height: 1.9; }
.ai-off .big { font-size: 40px; opacity: .55; margin-bottom: 8px; }
.ai-toolbar { position: relative; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; background: var(--bg2); }
.ai-sel { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ai-sel .lbl { color: var(--tx2); font-size: 12px; }
.ai-sugg { position: absolute; z-index: 20; top: calc(100% + 4px); left: 76px; width: 280px; background: var(--panel2); border: 1px solid var(--line); border-radius: 10px; overflow: hidden; box-shadow: 0 14px 34px rgba(0,0,0,.45); }
.ai-sugg-i { padding: 8px 12px; font-size: 12.5px; cursor: pointer; }
.ai-sugg-i:hover { background: rgba(240,166,58,.12); }
.ai-watch { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.ai-chat { min-height: 320px; max-height: 52vh; overflow: auto; display: flex; flex-direction: column; gap: 12px; padding: 16px 4px; }
.ai-empty { text-align: center; color: var(--tx3); padding: 44px 0; }
.ai-empty .big { font-size: 30px; margin-bottom: 10px; opacity: .6; }
.ai-quicks { display: flex; gap: 8px; justify-content: center; margin-top: 14px; flex-wrap: wrap; }
.ai-msg { display: flex; flex-direction: column; }
.ai-msg.user { align-items: flex-end; }
.ai-bubble { max-width: 78%; padding: 10px 14px; border-radius: 12px; font-size: 13px; line-height: 1.8; white-space: pre-wrap; word-break: break-word; }
.ai-msg.user .ai-bubble { background: linear-gradient(135deg, #c9811f, var(--gold)); color: #1b1204; border-bottom-right-radius: 3px; }
.ai-msg.assistant .ai-bubble { background: var(--panel2); border: 1px solid var(--line); border-bottom-left-radius: 3px; }
.ai-bind { font-size: 11px; opacity: .7; margin-bottom: 4px; }
.ai-text { white-space: pre-wrap; }
.ai-meta { font-size: 10.5px; color: var(--tx3); margin-top: 3px; }
.ai-typing { display: flex; gap: 4px; padding: 14px; }
.ai-typing .dotl { width: 6px; height: 6px; border-radius: 50%; background: var(--acc); animation: pulse 1s infinite; }
.ai-typing .dotl:nth-child(2) { animation-delay: .15s; }
.ai-typing .dotl:nth-child(3) { animation-delay: .3s; }
.ai-input { display: flex; gap: 8px; align-items: flex-end; }
.ai-ta { flex: 1; resize: none; }
.ai-go { flex-shrink: 0; height: 52px; padding: 0 22px; }

/* 运营管理 */
.ops-tabs { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.ops-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.kpi { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 15px 16px; }
.kpi-k { color: var(--tx3); font-size: 12px; }
.kpi-v { font-size: 26px; font-weight: 800; margin: 6px 0 2px; font-variant-numeric: tabular-nums; }
.kpi-v.buy { color: var(--buy); }
.kpi-v.warn { color: var(--warn); }
.kpi-v em { font-style: normal; font-size: 12px; color: var(--tx3); font-weight: 400; }
.kpi-s { color: var(--tx3); font-size: 11px; }
.ops-filters { display: flex; gap: 6px; margin-bottom: 12px; }
.ops-filters .chip { cursor: pointer; }
.plan-edit input { text-align: right; }
.test-box { margin-top: 12px; border-radius: 10px; padding: 12px 14px; font-size: 12.5px; line-height: 1.8; }
.test-box.ok { border: 1px solid rgba(34,192,110,.4); background: rgba(34,192,110,.06); color: var(--down); }
.test-box.fail { border: 1px dashed rgba(240,166,58,.5); background: rgba(240,166,58,.05); color: var(--warn); }

/* 收款码 / 客服二维码（运营端上传 + 用户订阅中心展示） */
.qr-grid { display: flex; gap: 16px; flex-wrap: wrap; }
.qr-box { width: 172px; }
.qr-label { font-size: 12.5px; font-weight: 700; margin-bottom: 8px; display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.qr-box .mini { text-align: center; }
.qr-thumb { display: block; width: 172px; height: 172px; object-fit: contain; border: 1px solid var(--line); border-radius: 12px; background: #fff; cursor: zoom-in; box-sizing: border-box; }
.qr-empty { display: grid; place-items: center; width: 172px; height: 172px; border: 1px dashed var(--line); border-radius: 12px; color: var(--tx3); font-size: 11px; text-align: center; padding: 10px; box-sizing: border-box; background: var(--bg2); line-height: 1.6; }
.qr-actions { display: flex; gap: 6px; margin-top: 8px; align-items: center; flex-wrap: wrap; }
.qr-file-input { display: none; }
.qr-zoom { text-align: center; padding: 8px 0 4px; }
.qr-zoom img { width: min(320px, 76vw); background: #fff; border-radius: 12px; display: block; margin: 0 auto; }
.qr-zoom .mini { margin-top: 8px; }
.qr-foot { margin-top: 10px; }

/* ===================================================================
 * 移动端 / 响应式适配
 * 说明：该区块全部位于断点媒体查询内，桌面宽度（>880px）布局与原版一致；
 *       ≤880px 起侧栏转为抽屉，配合 app.js 中导航开关切换 .m-open。
 * =================================================================== */
html { -webkit-text-size-adjust: 100%; }

/* 汉堡按钮（默认隐藏，窄屏显示） */
.btn-ico {
  display: none; align-items: center; justify-content: center;
  width: 36px; height: 36px; flex: 0 0 36px; border: 1px solid var(--line);
  background: var(--panel); color: var(--tx); border-radius: 9px; cursor: pointer;
  padding: 0; transition: filter .15s;
}
.btn-ico:active { filter: brightness(1.4); }

/* 抽屉遮罩（常驻 DOM，控制透明度实现淡入淡出） */
.m-mask {
  position: fixed; inset: 0; z-index: 900;
  background: rgba(4, 8, 14, .55);
  opacity: 0; pointer-events: none; transition: opacity .2s ease;
}
.layout.m-open .m-mask { opacity: 1; pointer-events: auto; }

/* ---- 异动广场：表格 + 后续波动单元格 ---- */
/* 表格布局：12 列 grid，方便把"事件触发价 → 后续多档回填"摆成一张一眼可比的表。
   列宽按重要性分配：时间 / 类别 / 名称 / 事件标题 / 触发价 / 6 个波动单元 / 操作 */
.ev-table {
  border: 1px solid var(--line);
  border-radius: 10px;
  /* 列多（波动窗口 ×5 + 进出场 + 现价）时整体横滚，不压缩列；
     y 轴裁切保住圆角，x 轴允许滚动 */
  overflow: hidden;
  overflow-x: auto;
  background: var(--bg2);
}
.ev-head, .ev-row {
  /* fr 部分给 minmax 下限，避免窄屏视口（1024~1280）下"股票 / 事件"被压成细缝。
     固定列略减总宽腾出空间：846 → 824，容器≥960 即可完整展开；
     小于此宽度时整表横向滚动（见 .ev-table { overflow-x:auto }）。 */
  display: grid;
  grid-template-columns: 116px 86px minmax(126px, 1.3fr) minmax(220px, 2.3fr) 90px repeat(6, 76px) 76px;
  align-items: center;
  padding: 12px 14px;
  gap: 10px;
  font-size: 13px;
  line-height: 1.55;
}
.ev-head {
  background: var(--panel2);
  color: var(--tx3);
  font-weight: 600;
  font-size: 12px;
  letter-spacing: .4px;
  padding-top: 11px;
  padding-bottom: 11px;
  border-bottom: 1px solid var(--line);
}
.ev-row {
  cursor: pointer;
  border-top: 1px solid transparent;
  border-bottom: 1px solid var(--line);
  transition: background .12s;
}
.ev-row:first-of-type { border-top: 1px solid var(--line); }
.ev-row:hover { background: rgba(255,255,255,.04); }
.ev-row:last-child { border-bottom: none; }
/* 行内"事件标题"拆两行：第一行 kind·label，第二行 desc 灰小；超长省略（描述允许 3 行，信息更完整） */
.ev-title { display: flex; flex-direction: column; min-width: 0; line-height: 1.55; gap: 2px; }
.ev-title-1 { font-weight: 600; font-size: 13px; }
.ev-title-2 {
  font-size: 12px;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ev-caveat {                          /* D 方案：免责语独立行，虚线分隔避免与 desc 混淆 */
  margin-top: 3px; padding-top: 4px;
  border-top: 1px dashed rgba(255,255,255,.10);
  font-size: 11px; color: var(--tx3); opacity: .78; line-height: 1.45;
}
/* 名称列：股票名 + 代码灰 */
.ev-name { display: flex; flex-direction: column; min-width: 0; line-height: 1.45; }
.ev-name b {
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%;
}
/* 时间列：相对时间 + 灰日期小字 */
.ev-time { line-height: 1.45; }
.ev-time .mini { font-size: 10.5px; }
/* 后续波动单元格：基础灰底，up/down/zero 三态着色，good/bad 加边框区分"信号正确性" */
.ev-cell, .cell {
  text-align: center;
  font-variant-numeric: tabular-nums;
  font-size: 12.5px;
  padding: 6px 4px;
  border-radius: 6px;
  background: var(--panel2);
  color: var(--tx3);
}
.cell.empty { color: var(--tx3); opacity: .55; }
/* 涨=红、跌=绿（与 --up/--down 中国配色一致；底色与文字同色系淡化） */
.cell.up   { color: var(--up);   background: rgba(242,80,90,.12); }
.cell.down { color: var(--down); background: rgba(34,192,110,.12); }
.cell.zero { color: var(--tx); }
.cell.good { box-shadow: inset 0 0 0 1.5px currentColor; font-weight: 600; }
.cell.bad  { opacity: .55; }
/* 表头里的列名居中，与单元格对齐 */
.ev-head > div:not(:first-child):not(.ev-name):not(.ev-title):not(.ev-act) { text-align: center; }
.ev-act { display: flex; justify-content: flex-end; }
/* ---- 历史作战台专用：12 列（时间/类型/股票/理由/触发价/现价/进出场/5窗口/准确/操作）----
   列数比异动广场多，min-width 保证窄屏下整表横滚展开（配合 .ev-table overflow-x:auto），
   5 分钟~5 天五个波动窗口一屏全部可见，不再被视口截断。 */
.ev-arch .ev-head, .ev-arch .ev-row {
  grid-template-columns: 104px 78px minmax(110px, 1.1fr) minmax(170px, 2fr) 76px 76px 92px repeat(5, 70px) 68px 52px;
  min-width: 1280px;
}

/* ---- 平板 / 手机：≤880px ---- */
@media (max-width: 880px) {
  .btn-ico { display: inline-flex; }

  .side {
    position: fixed; left: 0; top: 0; bottom: 0; width: 240px; z-index: 950;
    transform: translateX(-104%); box-shadow: none;
    background: linear-gradient(180deg, #0e141e, #0a0f16);
  }
  .side, .main { transition: transform .22s ease; }
  .layout.m-open .side { transform: translateX(0); box-shadow: 0 0 46px rgba(0, 0, 0, .55); }

  .topbar { padding: 0 14px; gap: 10px; }
  .content { padding: 14px; }
  #toasts { right: 14px; }
  .g-cards { gap: 8px; }
  .g-2, .g-2b { gap: 12px; }

  /* 图 + 右侧指标栏（分时评估 / K 线指标明细）在窄屏回退为上下排列，图表恢复满宽；
     上下排列时侧栏不再限高（限高会把它变成一个小滚动框），滚动交给整个弹窗 */
  .m-cols.m-2col { flex-direction: column; align-items: stretch; }
  /* 换成列方向后交叉轴变成水平方向，桌面端的 align-items: flex-start 会把主列压成
     「内容宽度」；而 K 线档主列里只有 width:100% 的图表容器（图例仅分时档渲染），
     宽度收缩后算成 0，echarts 按 0 宽初始化 —— 手机端日K/周K/60分钟整张空白。
     这里显式占满宽度，任何浏览器下都不会再把主列算成 0 宽。 */
  .m-cols.m-2col .m-col-main { width: 100%; }
  .m-cols.m-2col .m-col-side { flex: 1 1 auto; width: 100%; max-height: none; overflow-y: visible; }
  /* 上下排列后再用 520px 的图就太占屏，图高收到与窄屏一致的档位 */
  #stockChart { height: min(380px, 46vh); }
}

/* ---- 手机宽屏/平板竖屏：≤760px ---- */
@media (max-width: 760px) {
  .topbar { height: 52px; }
  .page-title { font-size: 15px; }
  .top-mkt, .top-clock { display: none !important; }
  .usr { padding: 4px; }
  .usr-name { display: none; }
  .usr-ava { width: 30px; height: 30px; border-radius: 9px; }

  .content { padding: 12px 12px calc(12px + env(safe-area-inset-bottom, 0px)); }
  .card { padding: 14px; border-radius: 11px; }
  .card + .card { margin-top: 12px; }
  .grid { gap: 11px; }
  .card-title { margin-bottom: 10px; }
  .kpi { padding: 12px 13px; }
  .k-val { font-size: 19px; }
  .k-val.sm { font-size: 16px; }
  .sig-row { padding: 9px 6px; }
  .sig-grid { grid-template-columns: 1fr; } /* 窄屏两列会把名字挤没，退回单列 */

  /* 关键卡片区降列 */
  .g-cards { grid-template-columns: repeat(2, 1fr); }
  .g-2, .g-2b { grid-template-columns: 1fr; }
  .rule-grid, .plan-row { grid-template-columns: 1fr; }
  .ops-stats { grid-template-columns: repeat(2, 1fr); }
  .kpi-v { font-size: 22px; }

  /* 表单：行转列，触屏字号加大避免 iOS 聚焦自动缩放 */
  .input, .select, textarea { font-size: 16px !important; }
  .f-row { flex-wrap: wrap; row-gap: 6px; }
  .f-row .fl { width: 100%; }
  .f-row .fc { width: 100%; }
  .btn { padding: 8px 14px; }

  /* 宽表格：允许内容区横向滑动查看全部列 */
  table.tbl { min-width: 700px; }
  .tbl.wl .wh { width: 30px; }
  .tbl.wl .gh { opacity: .55; }
  .pool-head .search, .news-search, .ac-box { min-width: 0; }
  .pool-head .search { max-width: none; }
  .ac-panel { max-height: 300px; }

  /* 股池筛选条：窄屏收紧标签宽度、放大可滚动高度 */
  .pool-filters .pf-label { width: 26px; }
  .pf-scroll { max-height: 108px; }

  /* 弹窗：近全屏，头部可换行 */
  .overlay { padding: 10px; }
  .modal {
    width: 100%;
    max-height: calc(100vh - 20px);
    max-height: calc(100dvh - 20px);
  }
  .modal.sm { width: 100%; }

  /* 异动广场窄屏：表头隐藏，所有数据行换成纵向卡片式布局（grid 列数降为 2） */
  .ev-table { overflow-x: auto; }
  .ev-head { display: none; }
  .ev-row {
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      "time cat"
      "name name"
      "title title"
      "price price"
      "w1 w3"
      "w5 d1"
      "d3 d5"
      "act act";
    row-gap: 6px;
    padding: 12px;
  }
  .ev-time { grid-area: time; }
  .ev-cat { grid-area: cat; text-align: right; }
  .ev-name { grid-area: name; flex-direction: row; align-items: baseline; gap: 8px; }
  .ev-title { grid-area: title; }
  .ev-price { grid-area: price; font-size: 14px; font-weight: 600; }
  .ev-row > .ev-cell:nth-of-type(1) { grid-area: w1; }   /* m1 */
  .ev-row > .ev-cell:nth-of-type(2) { grid-area: w3; }   /* m5 (无w3，复用列1区域) */
  .ev-row > .ev-cell:nth-of-type(3) { grid-area: w5; }   /* h1 (复用列2区域) */
  .ev-row > .ev-cell:nth-of-type(4) { grid-area: d1; }
  .ev-row > .ev-cell:nth-of-type(5) { grid-area: d3; }
  .ev-row > .ev-cell:nth-of-type(6) { grid-area: d5; }
  .ev-act { grid-area: act; justify-content: flex-end; }
  .m-head { flex-wrap: wrap; row-gap: 6px; padding: 12px 14px; }
  .m-body { padding: 12px 14px; }
  .m-head .row { margin-left: 0; width: 100%; }
  #stockChart { height: min(360px, 54vh); }
  .reline { flex-wrap: wrap; }
  .rem-grid { grid-template-columns: 1fr; }
  .legend-bar { gap: 10px; flex-wrap: wrap; }
  .chart-tags .chip { font-size: 10.5px; }

  /* 订阅 / 账号 */
  .ent-banner { flex-direction: column; align-items: flex-start; gap: 10px; }
  .ent-state { min-width: 0; width: 100%; }
  .plan-card { padding: 14px; }
  .pc-price { font-size: 23px; }

  /* AI 复盘 */
  .ai-sugg { left: 6px; width: min(260px, 92vw); }
  .ai-go { padding: 0 16px; height: 46px; }
  .ai-sel .lbl { width: 100%; }

  /* 日志/源页面行内 grid 强制单列，避免横向撑破 */
  [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }

  /* Toast 移到视口底部，触手可及 */
  #toasts {
    left: 12px; right: 12px; top: auto; bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    max-width: none; align-items: stretch;
  }

  .side-foot { padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px)); }
}

/* ---- 手机窄屏：≤480px ---- */
@media (max-width: 480px) {
  .content { padding: 10px 10px calc(10px + env(safe-area-inset-bottom, 0px)); }
  .card { padding: 12px; }
  .ops-stats { grid-template-columns: 1fr; }
  .kpi { padding: 10px 12px; }
  .topbar { padding: 0 10px; gap: 8px; }
  .modal .row .select { max-width: 46%; }
  .m-x { width: 32px; height: 32px; }

  /* 登录页：面板全屏，hero 收敛为顶部品牌条 */
  .auth-shell { padding: 0; }
  .auth-panel {
    width: 100%; min-height: 100vh; min-height: 100dvh;
    grid-template-columns: 1fr; border: none; border-radius: 0;
  }
  .auth-hero {
    padding: 18px 20px 8px; border-right: none;
    border-bottom: 1px solid var(--line);
  }
  .auth-hero h1 { margin: 10px 0 0; font-size: 19px; line-height: 1.4; }
  .auth-hero p, .auth-hero ul, .footline { display: none; }
  .auth-brand .logo.big { font-size: 22px; }
  .auth-form { padding: 20px 22px calc(20px + env(safe-area-inset-bottom, 0px)); }
  .af-title { font-size: 19px; }
}

/* ===================================================================
 * 行为轨迹（运营看板）：KPI / 趋势图 / 热度条 / 用户活跃榜 / 轨迹抽屉
 * =================================================================== */
.ana-kpi { grid-template-columns: repeat(3, 1fr); }
.ana-chart { width: 100%; height: 260px; }
.ana-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 14px; }
.ana-cols .card { margin-top: 0; }
.ana-cols + .card { margin-top: 14px; }

/* 热度条：名称固定宽、条形自适应、数值右对齐 —— 三列对齐才不会因名字长短而错位 */
.ana-row { display: flex; align-items: center; gap: 10px; padding: 4px 0; font-size: 12.5px; }
.ana-name { flex: 0 0 84px; color: var(--tx2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ana-bar { flex: 1; height: 7px; border-radius: 5px; background: rgba(142,160,186,.14); overflow: hidden; }
.ana-bar i { display: block; height: 100%; border-radius: 5px; background: linear-gradient(90deg, #f0a63a, rgba(240,166,58,.5)); transition: width .3s; }
.ana-bar.blue i { background: linear-gradient(90deg, #3aa9ff, rgba(58,169,255,.45)); }
.ana-bar.green i { background: linear-gradient(90deg, var(--down), rgba(34,192,110,.45)); }
.ana-val { flex: 0 0 52px; text-align: right; color: var(--tx3); font-variant-numeric: tabular-nums; }

.online-chip { color: var(--down); border-color: rgba(34,192,110,.45); background: rgba(34,192,110,.08); }
.ana-click { cursor: pointer; }

/* 用户活跃榜分页条（2026-09-23 需求：每页 10 条 + 翻页）：
   左侧总数说明、右侧翻页按钮与页码，用一条分隔线与表格收口 —— 列表不再无限往下拉长。 */
.ana-page {
  display: flex; align-items: center; gap: 10px;
  margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line);
}
.ana-page .right { margin-left: auto; display: flex; align-items: center; gap: 10px; }

/* 轨迹抽屉：右侧滑出，宽度随屏幕收缩 */
.ana-mask { position: fixed; inset: 0; z-index: 900; background: rgba(4,8,14,.55); }
.ana-drawer {
  position: fixed; top: 0; right: 0; bottom: 0; width: min(560px, 92vw); z-index: 950;
  background: var(--panel); border-left: 1px solid var(--line);
  padding: 16px 18px; overflow: auto; box-shadow: -14px 0 40px rgba(0,0,0,.45);
}
.ana-sum { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 12px; }
.ana-sum span {
  font-size: 11.5px; color: var(--tx2); border: 1px solid var(--line);
  border-radius: 20px; padding: 4px 10px; background: var(--bg2);
}
.ana-trail { border-left: 1px solid var(--line); margin-left: 6px; padding-left: 14px; }
.ana-ev { position: relative; padding: 7px 0; font-size: 12.5px; line-height: 1.5; }
.ana-ev::before {
  content: ''; position: absolute; left: -19px; top: 13px; width: 7px; height: 7px;
  border-radius: 50%; background: var(--tx3); box-shadow: 0 0 0 3px var(--panel);
}
.ana-ev.k-pv::before { background: #f0a63a; }
.ana-ev.k-act::before { background: var(--down); }
.ana-ev.k-api::before { background: #3aa9ff; }
.ana-ev.k-sess::before { background: #b98cff; }
.ana-ev.k-auth::before { background: var(--tx2); }
.ana-ev .ev-t { color: var(--tx3); font-size: 11px; font-variant-numeric: tabular-nums; margin-right: 8px; }
.ana-ev .ev-d { color: var(--tx); }
.ana-ev.k-sess .ev-d { color: var(--tx3); }

@media (max-width: 880px) {
  .ana-kpi { grid-template-columns: repeat(2, 1fr); }
  .ana-cols { grid-template-columns: 1fr; }
  .ana-chart { height: 220px; }
  .ana-drawer { width: 100vw; }
}

/* ==========================================================================
 * 实时提醒浮窗（reminder-bubble.js）—— 右下角常驻小气泡
 * 设计目标：在任何页面都能看到最新未读，单条点击直接跳到个股 K 线 / 分时
 * ========================================================================== */
.rb-root {
  position: fixed; right: 16px; bottom: 16px; z-index: 920;
  display: flex; flex-direction: column; align-items: flex-end;
  pointer-events: none;     /* 根容器本身不接收事件，避免遮挡非浮窗区域 */
}
.rb-root > * { pointer-events: auto; }
.rb-root.collapsed { bottom: 16px; }

/* 折叠态：圆形徽章（铃铛 + 数字） */
.rb-badge {
  position: relative;
  width: 48px; height: 48px; border-radius: 50%;
  background: linear-gradient(135deg, #ff9d2e, var(--gold));
  border: none; color: #1b1206; cursor: pointer;
  box-shadow: 0 6px 20px rgba(240,166,58,.35), 0 2px 6px rgba(0,0,0,.4);
  display: flex; align-items: center; justify-content: center;
  transition: transform .15s;
}
.rb-badge:hover { transform: translateY(-2px) scale(1.05); }
.rb-badge:active { transform: scale(0.96); }
.rb-badge svg { display: block; }
.rb-badge-n {
  position: absolute; top: -4px; right: -4px;
  min-width: 18px; height: 18px; line-height: 18px;
  background: var(--up); color: #fff; font-size: 11px; font-weight: 700;
  border-radius: 10px; padding: 0 5px; text-align: center;
  border: 2px solid var(--bg); box-shadow: 0 2px 6px rgba(242,80,90,.4);
  animation: rb-bounce .8s ease;
  font-variant-numeric: tabular-nums;
}
@keyframes rb-bounce {
  0%, 100% { transform: scale(1); }
  20% { transform: scale(1.35); }
  40% { transform: scale(.9); }
  60% { transform: scale(1.15); }
}

/* 展开态：浮窗主体 */
.rb-box {
  width: min(360px, calc(100vw - 32px));
  background: var(--panel); border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: 0 14px 44px rgba(0,0,0,.55), 0 2px 8px rgba(0,0,0,.4);
  overflow: hidden; display: flex; flex-direction: column;
  max-height: min(560px, calc(100vh - 90px));
  animation: rb-rise .22s ease;
}
@keyframes rb-rise {
  from { opacity: 0; transform: translateY(8px) scale(0.96); }
  to   { opacity: 1; transform: translateY(0)   scale(1); }
}
.rb-hd {
  display: flex; align-items: center;
  padding: 11px 13px; border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(240,166,58,.08), transparent);
  flex-shrink: 0;
}
.rb-title {
  font-size: 13px; font-weight: 700; color: var(--tx);
  display: flex; align-items: center; gap: 8px; flex: 1; min-width: 0;
}
.rb-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--tx3); flex-shrink: 0;
}
.rb-dot.pulse {
  background: var(--gold);
  box-shadow: 0 0 0 0 rgba(240,166,58,.6);
  animation: rb-pulse 1.4s infinite;
}
@keyframes rb-pulse {
  0%   { box-shadow: 0 0 0 0   rgba(240,166,58,.55); }
  70%  { box-shadow: 0 0 0 10px rgba(240,166,58,0);   }
  100% { box-shadow: 0 0 0 0   rgba(240,166,58,0);   }
}
.rb-n {
  font-size: 11px; font-weight: 500; color: var(--tx3); margin-left: 4px;
  font-variant-numeric: tabular-nums;
}
.rb-hd-act { display: flex; gap: 4px; }
.rb-ico {
  width: 24px; height: 24px; border-radius: 6px; border: 1px solid var(--line);
  background: transparent; color: var(--tx2); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: .15s;
}
.rb-ico:hover { color: var(--tx); border-color: #3aa9ff; background: rgba(58,169,255,.08); }

/* 空态：今日平安 */
.rb-empty {
  padding: 26px 18px 28px; text-align: center; color: var(--tx3);
  font-size: 12.5px; line-height: 1.7;
}
.rb-empty-big {
  font-size: 28px; line-height: 1; color: var(--down);
  opacity: .55; margin-bottom: 8px;
}
.rb-empty-sub { font-size: 11px; color: var(--tx3); opacity: .75; margin-top: 4px; }

/* 列表 */
.rb-list {
  flex: 1; overflow: auto;
  padding: 6px 8px 4px; display: flex; flex-direction: column; gap: 6px;
  min-height: 60px;
}
.rb-item {
  background: var(--panel2); border: 1px solid var(--line); border-radius: 9px;
  padding: 8px 10px 9px; cursor: pointer; min-width: 0;
  transition: border-color .14s, background .14s, transform .1s;
}
.rb-item:hover { border-color: #3aa9ff; background: rgba(58,169,255,.06); }
.rb-item:active { transform: translateY(1px); }
.rb-item.flashing {
  border-color: var(--gold); background: rgba(240,166,58,.13);
  animation: rb-flash 1.6s ease;
}
@keyframes rb-flash {
  0%   { box-shadow: 0 0 0 0   rgba(240,166,58,.6); }
  60%  { box-shadow: 0 0 0 12px rgba(240,166,58,0);   }
  100% { box-shadow: 0 0 0 0   rgba(240,166,58,0);   }
}
.rb-item-hd {
  display: flex; align-items: center; gap: 6px; min-width: 0;
}
.rb-item-hd .chip { padding: 1px 6px; flex-shrink: 0; }
.rb-item-name {
  flex: 1; min-width: 0; font-size: 12.5px; color: var(--tx);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rb-item-code {
  color: var(--tx3); font-size: 10.5px; flex-shrink: 0;
  font-variant-numeric: tabular-nums;
}
.rb-item-x {
  width: 18px; height: 18px; flex-shrink: 0; line-height: 1;
  border: none; background: transparent; color: var(--tx3);
  font-size: 16px; cursor: pointer; border-radius: 4px;
  padding: 0; opacity: 0; transition: opacity .15s;
}
.rb-item:hover .rb-item-x { opacity: 1; }
.rb-item-x:hover { background: rgba(242,80,90,.16); color: var(--up); }
.rb-item-line {
  margin-top: 3px; font-size: 11.5px; color: var(--tx2); line-height: 1.45;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  min-width: 0;
}
.rb-item-ft {
  margin-top: 4px; display: flex; align-items: center; justify-content: space-between;
  font-size: 10.5px; color: var(--tx3);
}
.rb-item-time { font-variant-numeric: tabular-nums; }
.rb-item-go { color: var(--gold); font-weight: 600; }

/* 底部工具栏 */
.rb-ft {
  display: flex; align-items: center; gap: 6px;
  padding: 8px 10px; border-top: 1px solid var(--line); background: var(--panel2);
  flex-shrink: 0;
}
.rb-spacer { flex: 1; }
.rb-link {
  background: transparent; border: 1px solid var(--line); border-radius: 6px;
  padding: 4px 9px; font-size: 11.5px; color: var(--tx2); cursor: pointer;
  transition: .14s;
}
.rb-link:hover { color: var(--tx); border-color: #3aa9ff; }
.rb-link.primary { background: linear-gradient(135deg, #ff9d2e, var(--gold)); border: none; color: #1b1206; font-weight: 700; }
.rb-link.primary:hover { filter: brightness(1.08); }

/* 进入/退出过渡 */
.rb-fade-enter-active, .rb-fade-leave-active { transition: opacity .18s, transform .18s; }
.rb-fade-enter-from { opacity: 0; transform: translateY(10px) scale(.96); }
.rb-fade-leave-to   { opacity: 0; transform: translateY(6px)  scale(.96); }

/* 移动端：浮窗占满宽，贴底全屏抽屉感 */
@media (max-width: 760px) {
  .rb-root { right: 8px; bottom: 8px; left: 8px; align-items: stretch; }
  .rb-box { width: 100%; max-height: 60vh; }
}

/* ---------- 策略广场 ----------
   闭环三栏：风格分类 → 策略卡（命中只数）→ 绑定信号 / 命中股票。
   .stg-grid 用 auto-fit 以便窄屏自动叠成单列，无需额外断点。 */
.stg-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 14px; margin-top: 14px; align-items: start;
}
.stg-scroll { max-height: 70vh; overflow: auto; }
.stg-card {
  border: 1px solid var(--line); border-left: 3px solid var(--line); border-radius: 10px;
  padding: 9px 11px; background: var(--bg2); cursor: pointer; transition: .15s;
}
.stg-card + .stg-card { margin-top: 8px; }
.stg-card:hover { border-color: #33415c; transform: translateY(-1px); }
.stg-card.on { border-color: rgba(240,166,58,.55); background: rgba(240,166,58,.07); }
.stg-card.buy { border-left-color: var(--buy); }
.stg-card.sell { border-left-color: var(--sell); }
.stg-card .sg-head { display: flex; align-items: center; gap: 6px; }
.stg-card .sg-nm { font-weight: 700; font-size: 13px; }
.stg-card .sg-n {
  margin-left: auto; font-size: 11px; color: var(--gold);
  font-variant-numeric: tabular-nums; white-space: nowrap;
}
.stg-card .sg-desc { color: var(--tx3); font-size: 11.5px; line-height: 1.6; margin-top: 5px; }
/* 绑定信号行：左标签 / 中说明 / 右命中数 */
.stg-sig {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 0; border-bottom: 1px dashed var(--line); font-size: 12px;
}
.stg-sig:last-child { border-bottom: none; }
.stg-sig .ss-lb { font-weight: 600; flex-shrink: 0; }
.stg-sig .ss-ds {
  color: var(--tx3); font-size: 11.5px; flex: 1; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.stg-sig .ss-n {
  margin-left: auto; color: var(--gold); flex-shrink: 0;
  font-variant-numeric: tabular-nums; white-space: nowrap;
}
/* 命中股票行内「该策略实际命中的信号」小标签 */
.chip.hit { color: var(--acc); border-color: rgba(240,166,58,.45); background: rgba(240,166,58,.1); }
/* 芯片内的计数角标（股池页的 .chip .n 只作用于 .pool-filters，这里补上本页作用域） */
.stg-head .chip .n, .stg-grid .chip .n {
  font-weight: 700; font-size: 10.5px; opacity: .7;
  font-variant-numeric: tabular-nums; margin-left: 3px;
}
/* 自定义策略构建器：挑信号 → 起名 → 保存。信号选择区复用智能选股页的 .rc 芯片体系
   （同一交互、同一配色），这里只补布局与「不可选」两个状态 */
.sb-body { margin: 4px 0 12px; padding: 8px 10px; border: 1px dashed #33415c; border-radius: 10px; background: rgba(35,46,66,.22); }
.sb-row { display: flex; align-items: flex-start; gap: 10px; padding: 5px 0; }
.sb-k { flex: 0 0 44px; font-size: 11.5px; color: var(--tx3); padding-top: 6px; }
.sb-row .input { flex: 1; min-width: 0; }
.sb-body .rc-line:first-child { padding-top: 0; }
.sb-body .rc-line + .rc-line { border-top: none; }
.sb-foot { display: flex; align-items: center; gap: 10px; margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--line); }
.sb-foot .mini { flex-shrink: 0; max-width: 46%; }
.sb-err { color: var(--up); font-size: 11.5px; line-height: 1.5; }
/* 与当前方向相反的信号：置灰但保留可见——用户需要看见"这套组合里少了什么"，
   点上去时用一句话说明原因（而不是静默无反应） */
.rc.off { opacity: .35; cursor: not-allowed; }
.rc.off:hover { color: var(--tx3); border-color: var(--line); }
/* 自定义策略卡上的编辑/删除：默认压暗，hover 或选中时才亮，避免抢「点卡片看详情」的主交互 */
.sg-ops { display: flex; align-items: center; gap: 12px; margin-top: 7px; opacity: .5; transition: .15s; }
.stg-card:hover .sg-ops, .stg-card.on .sg-ops { opacity: 1; }
.sg-ops .linkbtn { font-size: 11px; }

/* ---------- 信号加强 · W4（置信分 + 环境 chip）----------
   设计原则：
   · env-chip 复用 .chip 的圆角 pill 但更小（不抢主 chip「MACD 金叉 / RSI 超卖」的视觉重点）；
   · 颜色只用「对个股有利 / 不利」两极（不再叠加 buy/sell 的方向色），避免 chip 多色拥挤；
   · score-chip 单独占一格，强反衬于 chip 列：让用户一眼看到「高置信 / 中置信 / 低置信」三级风险分层。 */
.env-row { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; margin-top: 4px; }
.env-chip {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 10.5px; line-height: 1; padding: 3px 7px; border-radius: 10px;
  border: 1px solid var(--line); background: var(--panel2); color: var(--tx2);
  cursor: default;
}
.env-chip.pos { color: rgba(34, 192, 110, 1); border-color: rgba(34, 192, 110, .35); background: rgba(34, 192, 110, .12); }
.env-chip.neg { color: rgba(242, 80, 90, 1); border-color: rgba(242, 80, 90, .35); background: rgba(242, 80, 90, .12); }
.env-chip.neu { color: var(--tx2); border-color: var(--line); background: var(--panel2); }
/* 市场级环境 chip（scope=market）：描述全市场而非个股，虚线边框 + 半透明弱化，
   文案由前端加「市场·」前缀（2026-09-23 中国中车 25 分挂「赚钱效应活跃」误读事故） */
.env-chip.mkt { border-style: dashed; opacity: .78; }
/* 详情弹窗 / 异动广场里的「环境异动」chip（与上面同族但更大，挂在主 chip 行内） */
.env-chip.lg { font-size: 11.5px; padding: 3px 9px; }

.score-chip {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 10.5px; font-weight: 700; line-height: 1;
  padding: 3px 8px; border-radius: 10px;
  border: 1px solid var(--line); background: var(--panel2); color: var(--tx2);
  cursor: default; font-variant-numeric: tabular-nums;
}
.score-chip.lv-high { color: #fff; border-color: rgba(34, 192, 110, .55); background: rgba(34, 192, 110, .82); }
.score-chip.lv-mid { color: #5b3d00; border-color: rgba(240, 166, 58, .5); background: rgba(240, 166, 58, .85); }
.score-chip.lv-low { color: var(--tx3); border-color: var(--line); background: rgba(142, 160, 186, .18); }
/* score-chip 颜色提权：避免被 .chip.on 等高优选择器盖掉 */
.sig-row .score-chip.lv-high, .desk .score-chip.lv-high { color: #fff; }
.sig-row .score-chip.lv-mid, .desk .score-chip.lv-mid { color: #5b3d00; }

/* ================= 信号分级徽标（2026-09-23 准确率优化 · 珍宝岛复盘） =================
 * 与 score-chip 并排：score 回答"这条信号多强"，grade 回答"该不该现在推给你"。
 * 🔥强买点 = 放量承接+板块共振+大盘合格（推送）；🟡观察 = 缩量/无共振/贴压力（仅列表）；
 * ⛔拦截 = 弱势大盘+缩量+紧贴压力三重共振（不出作战台卡片）。 */
.grade-chip {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 10.5px; font-weight: 700; line-height: 1;
  padding: 3px 8px; border-radius: 10px;
  border: 1px solid var(--line); background: var(--panel2); color: var(--tx2);
  cursor: default;
}
.grade-chip.g-strong { color: #fff; border-color: rgba(216, 68, 88, .5); background: linear-gradient(135deg, rgba(216, 68, 88, .85), rgba(240, 108, 58, .82)); }
/* 卖向强信号（2026-09-23 卖出信号严格化）：同一 g-strong 类，dir-sell 覆盖为跌色（绿），
   与买向的红色系一眼区分——同一只票可能同时挂着买级与卖级徽标。 */
.grade-chip.g-strong.dir-sell { border-color: rgba(34, 192, 110, .5); background: linear-gradient(135deg, rgba(34, 192, 110, .85), rgba(18, 150, 112, .82)); }
.grade-chip.g-watch { color: #5b3d00; border-color: rgba(240, 166, 58, .5); background: rgba(240, 166, 58, .8); }
.grade-chip.g-blocked { color: var(--tx3); border-color: var(--line); background: rgba(142, 160, 186, .16); text-decoration: line-through; }
/* 作战台卡片上的分级徽标（advisor 卡同样带 grade） */
.desk .grade-chip { margin-left: 6px; }