/* 股票个人工作台 —— 深色终端风 */
:root {
  --bg: #0d1117;
  --panel: #161c26;
  --panel2: #1c2431;
  --border: #2a3444;
  --text: #d9e1ec;
  --muted: #8b96a5;
  --up: #f04a5e;      /* 涨·红 */
  --down: #26c281;    /* 跌·绿 */
  --flat: #8b96a5;
  --accent: #3d7eff;
  --amber: #e8a33d;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  background: var(--bg);
  color: var(--text);
  font: 14px/1.6 "Microsoft YaHei", "PingFang SC", "Segoe UI", sans-serif;
  min-height: 100vh;
}
a { color: var(--accent); text-decoration: none; }

/* ---------- 顶栏 ---------- */
.topbar { background: var(--panel); border-bottom: 1px solid var(--border); position: sticky; top: 0; z-index: 600; isolation: isolate; }
.topbar-inner { max-width: 1280px; margin: 0 auto; display: flex; align-items: center; gap: 28px; padding: 0 20px; height: 52px; }
.brand { font-size: 16px; font-weight: 600; color: #fff; letter-spacing: 1px; }
.topbar nav { display: flex; gap: 4px; flex: 1; }
.topbar nav a { color: var(--muted); padding: 6px 14px; border-radius: 6px; transition: .15s; }
.topbar nav a:hover { color: var(--text); background: var(--panel2); }
.topbar nav a.on { color: #fff; background: var(--accent); }
.topbar-right { color: var(--muted); font-variant-numeric: tabular-nums; }

.container { max-width: 1280px; margin: 0 auto; padding: 18px 20px 40px; }
.foot { text-align: center; color: #556070; font-size: 12px; padding: 14px 0 22px; }

/* ---------- 通用面板 ---------- */
.panel { background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 16px 18px; margin-bottom: 16px; }
.panel h2 { font-size: 15px; font-weight: 600; margin-bottom: 12px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.panel h2 .sub { font-size: 12px; color: var(--muted); font-weight: 400; }
.panel h2 .right { margin-left: auto; font-weight: 400; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.grid-2 > .panel { margin-bottom: 0; }
@media (max-width: 1000px) { .grid-2 { grid-template-columns: 1fr; } .grid-2 > .panel { margin-bottom: 16px; } }

/* ---------- 指数卡 ---------- */
.stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
@media (max-width: 1000px) { .stat-grid { grid-template-columns: repeat(2, 1fr); } }
.stat-card { background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 14px 16px; }
.stat-card .nm { color: var(--muted); font-size: 13px; margin-bottom: 4px; display: flex; justify-content: space-between; }
.stat-card .val { font-size: 24px; font-weight: 600; font-variant-numeric: tabular-nums; }
.stat-card .sub { font-size: 12px; margin-top: 2px; font-variant-numeric: tabular-nums; }
.up { color: var(--up); } .down { color: var(--down); } .flat { color: var(--flat); }

/* ---------- 情绪指标卡 ---------- */
.emo-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-bottom: 16px; }
@media (max-width: 1100px) { .emo-grid { grid-template-columns: repeat(3, 1fr); } }
.emo-card { background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 12px 14px; text-align: center; }
.emo-card .k { color: var(--muted); font-size: 12px; margin-bottom: 6px; }
.emo-card .v { font-size: 22px; font-weight: 600; font-variant-numeric: tabular-nums; }
.emo-card .s { font-size: 12px; color: var(--muted); margin-top: 2px; }

/* ---------- 图表 ---------- */
.chart { width: 100%; height: 300px; }
.chart-tall { height: 360px; }

/* ---------- 表格 ---------- */
table.tbl { width: 100%; border-collapse: collapse; font-size: 13px; }
.tbl th, .tbl td { padding: 8px 10px; border-bottom: 1px solid var(--border); text-align: right; white-space: nowrap; }
.tbl th { color: var(--muted); font-weight: 500; background: var(--panel2); position: sticky; top: 0; z-index: 2; }
.tbl th:first-child, .tbl td:first-child { text-align: left; }
.tbl tr:hover td { background: rgba(61, 126, 255, .06); }
.tbl .num { font-variant-numeric: tabular-nums; }
.tbl-scroll { overflow: auto; max-height: 70vh; }
.tag { display: inline-block; padding: 1px 8px; border-radius: 10px; font-size: 12px; background: var(--panel2); border: 1px solid var(--border); margin: 1px 2px; }
.tag-ths { color: var(--accent); border-color: rgba(61,126,255,.4); }
.tag-imp { color: var(--amber); border-color: rgba(232,163,61,.4); }

/* ---------- 情绪周期矩阵 ---------- */
.matrix-wrap { overflow: auto; }
table.matrix { border-collapse: collapse; font-size: 12px; min-width: 100%; }
.matrix th, .matrix td { border: 1px solid var(--border); padding: 5px 8px; text-align: center; white-space: nowrap; }
.matrix thead th { background: var(--panel2); color: var(--muted); position: static; }
.mx-board { background: var(--panel2); color: var(--text); font-weight: 600; min-width: 46px; }
.mx-board.mx-hot { color: var(--up); }
.mx-board.mx-mid { color: var(--amber); }
.mx-cell { min-width: 110px; max-width: 260px; color: var(--muted); }
.mx-cell.has { color: var(--text); }
.mx-none { color: #3a4353; }

/* ---------- 表单 ---------- */
.fieldset { border: 1px solid var(--border); border-radius: 8px; padding: 12px 14px 14px; margin-bottom: 14px; }
.fieldset legend { color: var(--accent); font-size: 13px; padding: 0 8px; font-weight: 600; }
.form-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px 14px; }
.fi label { display: block; color: var(--muted); font-size: 12px; margin-bottom: 3px; }
.fi input, .fi select, .fi textarea {
  width: 100%; background: var(--panel2); border: 1px solid var(--border); color: var(--text);
  border-radius: 6px; padding: 7px 9px; font-size: 13px; outline: none;
}
.fi input:focus, .fi select:focus { border-color: var(--accent); }
.fi input::placeholder { color: #4d5766; }
.btn {
  display: inline-block; background: var(--accent); color: #fff; border: 0; border-radius: 6px;
  padding: 8px 18px; font-size: 13px; cursor: pointer; transition: .15s;
}
.btn:hover { filter: brightness(1.15); }
.btn-ghost { background: var(--panel2); color: var(--text); border: 1px solid var(--border); }
.btn-danger { background: transparent; color: var(--up); border: 1px solid rgba(240,74,94,.4); }
.btn-sm { padding: 3px 10px; font-size: 12px; border-radius: 5px; }
.toolbar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.empty-tip { color: var(--muted); text-align: center; padding: 24px 0; }
.hint { color: var(--muted); font-size: 12px; }
.ok-msg { color: var(--down); font-size: 13px; }
.err-msg { color: var(--up); font-size: 13px; }

/* ---------- 梯队板级列 ---------- */
.ladder-cols { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 6px; align-items: flex-start; }
.ladder-col { min-width: 150px; flex: 0 0 auto; background: var(--panel2); border: 1px solid var(--border); border-radius: 8px; }
.ladder-col .lc-head { text-align: center; font-weight: 600; padding: 6px 0; border-bottom: 1px solid var(--border); }
.ladder-col.lc-hot .lc-head { color: var(--up); }
.ladder-col.lc-mid .lc-head { color: var(--amber); }
.ladder-col .lc-body { padding: 8px; display: flex; flex-direction: column; gap: 8px; }
.lcard { background: var(--panel); border: 1px solid var(--border); border-radius: 6px; padding: 6px 8px; }
.lcard .ln { font-weight: 600; display: flex; justify-content: space-between; align-items: center; }
.lcard .lc { color: var(--muted); font-size: 12px; margin-top: 2px; }
.lcard .lv { font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; margin-top: 2px; }

/* ---------- 徽标 ---------- */
.badge-date { color: var(--amber); font-size: 12px; }
.muted { color: var(--muted); }
.mt8 { margin-top: 8px; }

/* ============================================================
   v2.0 · 宽屏霓虹光效主题
   ============================================================ */

:root {
  --neon-blue: #3d7eff;
  --neon-cyan: #22d3ee;
  --neon-purple: #8b5cf6;
  --neon-pink: #f04a5e;
  --neon-green: #26c281;
  --glow-blue: 0 0 24px rgba(61, 126, 255, .35);
  --glow-pink: 0 0 24px rgba(240, 74, 94, .35);
  --glass: rgba(22, 28, 38, .72);
}

/* 背景氛围光斑 */
body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 0;
  background:
    radial-gradient(900px 500px at 12% -8%, rgba(61,126,255,.16), transparent 60%),
    radial-gradient(760px 420px at 92% 4%, rgba(139,92,246,.14), transparent 62%),
    radial-gradient(700px 500px at 50% 108%, rgba(34,211,238,.09), transparent 60%);
}
/* 抬高到氛围层之上；注意 topbar 的 z-index 必须高于 main，
   否则顶栏里的下拉菜单会被下方卡片盖住（菜单的 z-index 只在顶栏
   这个层叠上下文内比较，跟 main 的 z-index 才是同级竞争）。 */
.topbar { position: sticky; z-index: 600; }
main, .foot { position: relative; z-index: 1; }

/* ---------- 宽屏容器：宽度随视口自适应（无固定上限，任何分辨率都铺满） ---------- */
.container,
.container-wide,
.topbar-inner { max-width: none; }
/* 左右留白随视口缩放：小屏 16px，1920 约 33px，超宽屏上限 48px */
.container,
.container-wide,
.topbar-inner {
  padding-left: clamp(16px, 1.7vw, 48px);
  padding-right: clamp(16px, 1.7vw, 48px);
}
@media (min-width: 1500px) {
  .page-wide .stat-grid { grid-template-columns: repeat(4, 1fr); }
  .page-wide .emo-grid { grid-template-columns: repeat(6, 1fr); }
  .page-wide .form-grid { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
}
/* 超宽屏：左栏（涨停池）再让出更多宽度 */
@media (min-width: 1900px) {
  .page-wide .grid-2 { grid-template-columns: 1.35fr 1fr; }
}

/* ---------- 顶栏霓虹化 ---------- */
.topbar {
  background: rgba(13, 17, 23, .82);
  backdrop-filter: blur(14px) saturate(1.3);
  border-bottom: 1px solid rgba(61, 126, 255, .18);
  box-shadow: 0 1px 0 rgba(255,255,255,.03), 0 8px 30px rgba(0,0,0,.45);
}
.brand { display: flex; align-items: center; gap: 9px; }
.brand-dot {
  width: 9px; height: 9px; border-radius: 50%; background: var(--neon-cyan);
  box-shadow: 0 0 10px var(--neon-cyan), 0 0 22px rgba(34,211,238,.6);
  animation: pulse 2.4s ease-in-out infinite;
}
@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: .55; transform: scale(.82); }
}
.topbar nav a {
  position: relative; transition: .18s;
}
.topbar nav a:hover {
  color: #fff; background: rgba(61,126,255,.12);
  box-shadow: inset 0 0 0 1px rgba(61,126,255,.28);
}
.topbar nav a.on {
  background: linear-gradient(180deg, rgba(61,126,255,.95), rgba(61,126,255,.72));
  box-shadow: var(--glow-blue), inset 0 1px 0 rgba(255,255,255,.22);
}
.topbar-right { display: flex; align-items: center; gap: 14px; }
.clock { color: var(--muted); font-variant-numeric: tabular-nums; font-size: 13px; }

/* ---------- 霓虹卡片（渐变描边 + 悬浮光效） ---------- */
.panel, .stat-card, .emo-card {
  position: relative;
  background: linear-gradient(160deg, rgba(28,36,49,.9), rgba(18,23,32,.92));
  border: 1px solid rgba(61,126,255,.16);
  border-radius: 14px;
  box-shadow: 0 6px 26px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.04);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.panel::after, .stat-card::after, .emo-card::after {
  content: ''; position: absolute; left: 14px; right: 14px; top: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(61,126,255,.55), rgba(139,92,246,.45), transparent);
  opacity: .8;
}
.panel:hover, .stat-card:hover, .emo-card:hover {
  border-color: rgba(61,126,255,.34);
  box-shadow: 0 10px 34px rgba(0,0,0,.5), 0 0 30px rgba(61,126,255,.14), inset 0 1px 0 rgba(255,255,255,.06);
}

/* 指数卡：大号数字 + 光晕 */
.stat-card { padding: 16px 18px; overflow: hidden; }
.stat-card:hover { transform: translateY(-2px); }
.stat-card .nm { font-size: 12px; letter-spacing: .6px; text-transform: uppercase; color: #7d8ba0; }
.stat-card .val {
  font-size: 30px; font-weight: 700; letter-spacing: -.5px; margin-top: 2px;
  text-shadow: 0 0 22px currentColor;
  transition: color .25s;
}
.stat-card .val.up   { text-shadow: 0 0 26px rgba(240,74,94,.5); }
.stat-card .val.down { text-shadow: 0 0 26px rgba(38,194,129,.45); }
.stat-card .sub { font-size: 12.5px; }

/* 情绪卡：顶部渐变条 */
.emo-card { padding: 14px 12px; }
.emo-card .v { font-size: 26px; font-weight: 700; }
.emo-card:nth-child(1)::after { background: linear-gradient(90deg, transparent, var(--neon-pink), transparent); }
.emo-card:nth-child(2)::after { background: linear-gradient(90deg, transparent, var(--neon-green), transparent); }
.emo-card:nth-child(3)::after { background: linear-gradient(90deg, transparent, var(--amber), transparent); }
.emo-card:nth-child(4)::after { background: linear-gradient(90deg, transparent, var(--neon-cyan), transparent); }
.emo-card:nth-child(5)::after { background: linear-gradient(90deg, transparent, var(--neon-purple), transparent); }
.emo-card:nth-child(6)::after { background: linear-gradient(90deg, transparent, var(--neon-blue), transparent); }

/* 数字变动闪烁动画 */
@keyframes flashUp   { 0% { background: rgba(240,74,94,.22); } 100% { background: transparent; } }
@keyframes flashDown { 0% { background: rgba(38,194,129,.22); } 100% { background: transparent; } }
.tick-up   { animation: flashUp .9s ease-out; }
.tick-down { animation: flashDown .9s ease-out; }

/* 面板标题霓虹 */
.panel h2 { font-size: 15px; letter-spacing: .3px; display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.panel h2::before {
  content: ''; width: 3px; height: 15px; border-radius: 2px; flex: 0 0 3px;
  background: linear-gradient(180deg, var(--neon-cyan), var(--neon-blue));
  box-shadow: 0 0 10px rgba(34,211,238,.6);
}

/* 图表容器微调 */
.chart { height: 320px; }
.page-wide .chart-tall { height: 420px; }

/* ---------- 顶栏：刷新设置 + 用户菜单 ---------- */
/* 层级说明：sticky 顶栏 500 < 下拉菜单 900 < 弹层遮罩 1200
   .ri-box/.user-box 必须显式给 z-index，否则菜单会被 .topbar 之后的
   卡片（同属顶栏的层叠上下文内、DOM 顺序在后）盖住。 */
.ri-box, .user-box { position: relative; z-index: 950; }
.ri-btn, .user-btn {
  background: rgba(28,36,49,.85); color: var(--text); border: 1px solid rgba(61,126,255,.22);
  border-radius: 8px; padding: 5px 12px; font-size: 12.5px; cursor: pointer; transition: .18s;
  font-family: inherit;
}
.ri-btn:hover, .user-btn:hover { border-color: rgba(61,126,255,.5); box-shadow: 0 0 16px rgba(61,126,255,.22); color: #fff; }
.ri-menu, .user-menu {
  position: absolute; right: 0; top: calc(100% + 8px); min-width: 150px;
  /* 菜单必须完全不透明，否则下方卡片内容会透出来 */
  background: #191f2b;
  backdrop-filter: blur(16px);
  border: 1px solid rgba(61,126,255,.3); border-radius: 10px; padding: 6px;
  box-shadow: 0 18px 50px rgba(0,0,0,.85), 0 0 0 1px rgba(0,0,0,.5);
  opacity: 0; visibility: hidden; transform: translateY(-6px); transition: .18s;
  z-index: 960; pointer-events: none;
}
.ri-menu.on, .user-menu.on { opacity: 1; visibility: visible; transform: translateY(0); pointer-events: auto; }
.ri-menu a, .user-menu a {
  display: block; padding: 7px 12px; border-radius: 6px; color: var(--text); font-size: 13px;
  transition: .15s; white-space: nowrap;
}
.ri-menu a:hover, .user-menu a:hover { background: rgba(61,126,255,.16); color: #fff; }
.ri-menu a.on { background: rgba(61,126,255,.22); color: #fff; font-weight: 600; }
.ri-menu a.on::after { content: ' ✓'; color: var(--neon-cyan); }
.ri-tip { color: #5d6a7d; font-size: 11px; padding: 5px 10px 3px; border-top: 1px solid rgba(255,255,255,.06); margin-top: 4px; }
.um-head { color: #7d8ba0; font-size: 11.5px; padding: 6px 12px 7px; border-bottom: 1px solid rgba(255,255,255,.07); margin-bottom: 4px; }
.user-menu .um-out { color: var(--neon-pink); }
.tag-me { color: var(--neon-cyan); border-color: rgba(34,211,238,.45); }
.tag-ok { color: var(--neon-green); border-color: rgba(38,194,129,.4); }
.tag-warn { color: var(--amber); border-color: rgba(232,163,61,.4); }

/* ---------- 登录 / 设置页 ---------- */
.auth-body {
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
  background: radial-gradient(1000px 600px at 20% 0%, rgba(61,126,255,.18), transparent 60%),
              radial-gradient(900px 600px at 80% 100%, rgba(139,92,246,.16), transparent 60%),
              #0a0e14;
  padding: 30px 16px;
}
.auth-wrap { width: 100%; max-width: 440px; }
.auth-card {
  position: relative;
  background: rgba(22,28,38,.86); backdrop-filter: blur(18px) saturate(1.3);
  border: 1px solid rgba(61,126,255,.24); border-radius: 18px;
  padding: 30px 28px 24px;
  box-shadow: 0 24px 70px rgba(0,0,0,.65), 0 0 60px rgba(61,126,255,.1), inset 0 1px 0 rgba(255,255,255,.06);
}
.auth-card::before {
  content: ''; position: absolute; left: 10%; right: 10%; top: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(34,211,238,.8), rgba(139,92,246,.7), transparent);
}
.auth-card-wide { max-width: 720px; }
.auth-brand { font-size: 21px; font-weight: 700; color: #fff; letter-spacing: .5px; text-align: center; }
.auth-sub { color: var(--muted); font-size: 12.5px; text-align: center; margin-top: 5px; }
.auth-tabs { display: flex; gap: 6px; background: rgba(13,17,23,.7); padding: 4px; border-radius: 10px; margin: 20px 0 16px; }
.auth-tabs a {
  flex: 1; text-align: center; padding: 8px 0; border-radius: 7px; color: var(--muted); font-size: 13px; transition: .18s;
}
.auth-tabs a.on { background: linear-gradient(180deg, rgba(61,126,255,.95), rgba(61,126,255,.7)); color: #fff; box-shadow: var(--glow-blue); }
.auth-err, .auth-ok {
  border-radius: 9px; padding: 9px 13px; font-size: 13px; margin-bottom: 14px;
}
.auth-err { background: rgba(240,74,94,.12); border: 1px solid rgba(240,74,94,.4); color: #ff8b9a; }
.auth-ok  { background: rgba(38,194,129,.12); border: 1px solid rgba(38,194,129,.4); color: #6ee7b7; }
.btn-block { width: 100%; padding: 11px 0; font-size: 14px; letter-spacing: 4px; }
.auth-foot { text-align: center; margin-top: 16px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.06); line-height: 1.9; }
.auth-actions { display: flex; gap: 10px; align-items: center; margin-top: 18px; flex-wrap: wrap; }
.panel-ok { border-color: rgba(38,194,129,.4) !important; color: #6ee7b7; }
.panel-err { border-color: rgba(240,74,94,.4) !important; color: #ff8b9a; }
.note-list { list-style: none; }
.note-list li { color: var(--muted); font-size: 13px; padding: 6px 0 6px 18px; position: relative; line-height: 1.7; }
.note-list li::before { content: '▸'; position: absolute; left: 2px; color: var(--neon-cyan); }
.chk { display: block; color: var(--muted); font-size: 13px; padding: 5px 0; cursor: pointer; }
.chk input { margin-right: 7px; accent-color: var(--neon-blue); }

/* ---------- 弹层 ---------- */
.modal-mask {
  position: fixed; inset: 0; background: rgba(6,9,13,.72); backdrop-filter: blur(6px);
  display: flex; align-items: center; justify-content: center; z-index: 1200;
  opacity: 0; visibility: hidden; transition: .2s; padding: 20px; overflow: auto;
}
.modal-mask.on { opacity: 1; visibility: visible; }
.modal {
  background: linear-gradient(160deg, rgba(28,36,49,.98), rgba(16,21,29,.99));
  border: 1px solid rgba(61,126,255,.28); border-radius: 16px; padding: 20px 22px;
  min-width: 480px; max-width: 620px; width: 100%; max-height: 90vh; overflow: auto;
  box-shadow: 0 30px 80px rgba(0,0,0,.75), 0 0 50px rgba(61,126,255,.12);
}
.modal-head {
  font-size: 15px; font-weight: 600; color: #fff; margin-bottom: 16px;
  display: flex; align-items: center; gap: 8px;
  padding-bottom: 12px; border-bottom: 1px solid rgba(255,255,255,.07);
}
.modal-x {
  margin-left: auto; background: transparent; border: 0; color: var(--muted);
  font-size: 16px; cursor: pointer; padding: 2px 8px; border-radius: 6px; transition: .15s;
}
.modal-x:hover { background: rgba(240,74,94,.16); color: var(--neon-pink); }
.modal-foot { display: flex; gap: 10px; margin-top: 18px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.07); }
@media (max-width: 640px) { .modal { min-width: auto; } }

/* ---------- 表格玻璃化 ---------- */
.tbl th { background: rgba(28,36,49,.95); backdrop-filter: blur(6px); }
.tbl tbody tr { transition: background .15s; }
.matrix thead th { background: rgba(28,36,49,.95); }
.ladder-col { background: linear-gradient(170deg, rgba(28,36,49,.9), rgba(18,23,32,.9)); }

/* ============================================================
   v2.1 · 股市元素增强（跑马灯 / K线纹理 / 涨跌家数 / 全屏适配）
   ============================================================ */

/* ---------- 背景氛围特效（v2.2 替代原顶栏跑马灯） ---------- */
/* 极光呼吸：缓慢缩放 + 明暗起伏 */
@keyframes auroraPulse {
  0%, 100% { opacity: 1; transform: scale(1) translateY(0); }
  50%      { opacity: .72; transform: scale(1.06) translateY(-12px); }
}
body::before { animation: auroraPulse 18s ease-in-out infinite; }

/* 底部 K 线剪影：涨红/跌绿蜡烛，极低透明度，缓慢右移像行情在走 */
.bg-candles {
  position: fixed; left: 0; right: 0; bottom: 0; height: 180px; z-index: 0;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='480' height='180'%3E%3Cg stroke='rgba(240,74,94,0.10)' stroke-width='2'%3E%3Cline x1='20' y1='60' x2='20' y2='150'/%3E%3Cline x1='100' y1='40' x2='100' y2='140'/%3E%3Cline x1='180' y1='55' x2='180' y2='165'/%3E%3Cline x1='220' y1='30' x2='220' y2='120'/%3E%3Cline x1='300' y1='50' x2='300' y2='160'/%3E%3Cline x1='380' y1='45' x2='380' y2='135'/%3E%3Cline x1='460' y1='60' x2='460' y2='150'/%3E%3C/g%3E%3Cg stroke='rgba(38,194,129,0.10)' stroke-width='2'%3E%3Cline x1='60' y1='90' x2='60' y2='160'/%3E%3Cline x1='140' y1='80' x2='140' y2='150'/%3E%3Cline x1='260' y1='70' x2='260' y2='140'/%3E%3Cline x1='340' y1='85' x2='340' y2='155'/%3E%3Cline x1='420' y1='75' x2='420' y2='170'/%3E%3C/g%3E%3Cg fill='rgba(240,74,94,0.09)'%3E%3Crect x='11' y='80' width='18' height='50'/%3E%3Crect x='91' y='70' width='18' height='55'/%3E%3Crect x='171' y='85' width='18' height='60'/%3E%3Crect x='211' y='60' width='18' height='45'/%3E%3Crect x='291' y='75' width='18' height='65'/%3E%3Crect x='371' y='70' width='18' height='48'/%3E%3Crect x='451' y='80' width='18' height='50'/%3E%3C/g%3E%3Cg fill='rgba(38,194,129,0.08)'%3E%3Crect x='51' y='105' width='18' height='40'/%3E%3Crect x='131' y='95' width='18' height='35'/%3E%3Crect x='251' y='90' width='18' height='32'/%3E%3Crect x='331' y='100' width='18' height='38'/%3E%3Crect x='411' y='95' width='18' height='55'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: repeat-x;
  background-size: 480px 180px;
  /* 顶部渐隐，让蜡烛从页面底部"长"出来 */
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 60%);
  mask-image: linear-gradient(180deg, transparent 0%, #000 60%);
  animation: candleDrift 90s linear infinite;
}
@keyframes candleDrift { from { background-position: 0 0; } to { background-position: 480px 0; } }

/* ---------- K 线柱状纹理背景（营造行情终端质感） ---------- */
body::after {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 0;
  background-image:
    linear-gradient(rgba(61,126,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(61,126,255,.045) 1px, transparent 1px);
  background-size: 46px 46px, 46px 46px;
  mask-image: radial-gradient(ellipse 90% 70% at 50% 30%, #000 20%, transparent 100%);
  -webkit-mask-image: radial-gradient(ellipse 90% 70% at 50% 30%, #000 20%, transparent 100%);
}

/* ---------- 涨跌家数卡（三色大数字） ---------- */
.breadth-val {
  font-size: 27px !important; font-weight: 800; letter-spacing: -.5px;
  font-variant-numeric: tabular-nums; display: flex; align-items: baseline;
  justify-content: flex-start; gap: 2px; margin-top: 2px;
}
.breadth-val .up   { color: var(--up);   text-shadow: 0 0 22px rgba(240,74,94,.55); }
.breadth-val .down { color: var(--down); text-shadow: 0 0 22px rgba(38,194,129,.5); }
.breadth-val .flat { color: #6b7686; }
.bd-sep { color: #3a4353; font-size: 19px; margin: 0 7px; font-weight: 400; }
.badge-sign { font-size: 11.5px; font-weight: 600; letter-spacing: .5px; }

/* ---------- 卡片入场动画 ---------- */
@keyframes riseIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.panel, .stat-card, .emo-card { animation: riseIn .45s cubic-bezier(.2,.7,.3,1) both; }
.stat-card:nth-child(1) { animation-delay: .02s; }
.stat-card:nth-child(2) { animation-delay: .07s; }
.stat-card:nth-child(3) { animation-delay: .12s; }
.stat-card:nth-child(4) { animation-delay: .17s; }

/* ---------- 面板顶部扫光（数据流动感） ---------- */
.panel::before {
  content: ''; position: absolute; left: 0; right: 0; top: 0; height: 2px;
  background: linear-gradient(90deg, transparent, rgba(34,211,238,.55), transparent);
  background-size: 200% 100%; opacity: .55; pointer-events: none;
  animation: sweep 4.5s linear infinite; border-radius: 14px 14px 0 0;
}
@keyframes sweep { from { background-position: -100% 0; } to { background-position: 200% 0; } }

/* ---------- 表格：涨跌行左缘色条 + 斑马纹 ---------- */
.tbl tbody tr td:first-child { border-left: 2px solid transparent; }
.tbl tbody tr:hover td:first-child { border-left-color: var(--neon-blue); }
.tbl tbody tr:nth-child(even) td { background: rgba(255,255,255,.012); }

/* 自选股：盈亏为正/负时整行左缘提示（涨红跌绿） */
#watch-tbl tbody tr td:first-child { border-left: 2px solid rgba(61,126,255,.25); }

/* ---------- 梯队卡：涨跌渐变描边 ---------- */
.lcard:hover { border-color: rgba(240,74,94,.4); box-shadow: 0 0 18px rgba(240,74,94,.16); }
.ladder-col.lc-hot .lc-head { text-shadow: 0 0 16px rgba(240,74,94,.6); }
.ladder-col.lc-mid .lc-head { text-shadow: 0 0 16px rgba(232,163,61,.5); }

/* ---------- 表单区宽屏：fieldset 自动铺满 ---------- */
fieldset.fieldset { break-inside: avoid; }
.page-wide .fieldset .form-grid { grid-template-columns: repeat(auto-fill, minmax(165px, 1fr)); }

/* ---------- 刷新按钮内的倒计时 ---------- */
/* 倒计时是 #ri-btn 的兄弟节点，位于按钮外侧（放按钮内会污染按钮文案） */
.ri-count {
  color: var(--neon-cyan); font-size: 11px; letter-spacing: 0; margin-left: 7px;
  font-variant-numeric: tabular-nums; padding: 3px 8px; border-radius: 6px;
  background: rgba(34,211,238,.08); border: 1px solid rgba(34,211,238,.22);
  white-space: nowrap; transition: .2s;
}
.ri-box { display: flex; align-items: center; }
.ri-count:empty { display: none; }
/* 倒计时结束前的最后一秒高亮，给「即将刷新」的临场感 */
.ri-count.soon { color: #fff; background: rgba(240,74,94,.2); border-color: rgba(240,74,94,.5); }

/* ---------- 弹层遮罩层级（高于顶栏与菜单） ---------- */
.modal-mask { z-index: 1200; }

/* 减少动画偏好 */
@media (prefers-reduced-motion: reduce) {
  .panel::before, .brand-dot, .bg-candles, body::before { animation: none !important; }
  .panel, .stat-card, .emo-card { animation: none !important; }
}

/* ============================================================
   v2.2 · 三图一行 + 仪表盘一屏化
   ============================================================ */
.grid-3 { display: grid; grid-template-columns: 1fr 1fr 1.25fr; gap: 14px; }
.grid-3 > .panel { margin-bottom: 0; }
@media (max-width: 1200px) {
  .grid-3 { grid-template-columns: 1fr; }
  .grid-3 > .panel { margin-bottom: 14px; }
}

/* 仪表盘专用紧凑档：让全部内容尽量收进一屏（按视口高度自适应） */
.page-index .container { padding-top: 12px; padding-bottom: 12px; }
.page-index .stat-grid, .page-index .emo-grid { gap: 10px; margin-bottom: 10px; }
.page-index .stat-card { padding: 9px 14px; }
.page-index .stat-card .val { font-size: 24px; }
.page-index .breadth-val { font-size: 22px !important; }
.page-index .bd-sep { font-size: 16px; margin: 0 5px; }
.page-index .emo-card { padding: 8px 10px; }
.page-index .emo-card .v { font-size: 19px; }
.page-index .panel { padding: 10px 14px; margin-bottom: 8px; border-radius: 12px; }
.page-index .panel h2 { font-size: 14px; margin-bottom: 8px; }
.page-index .panel.strip { padding: 5px 14px; }
.page-index .chart { height: clamp(160px, 20vh, 280px); }
.page-index .grid-2 { gap: 12px; }
.page-index .foot { padding: 4px 0 10px; font-size: 11px; }

/* ---------- v2.4 卡片数据来源链接（右下角，点击核实） ----------
   绝对定位：不占布局高度，不影响一屏压缩；不干扰 JS 更新的 .sub 节点 */
.src {
  position: absolute; right: 8px; bottom: 6px;
  font-size: 10px; line-height: 1; letter-spacing: .3px;
  color: var(--muted); opacity: .55;
  padding: 2px 5px; border-radius: 5px;
  border: 1px solid transparent;
  transition: opacity .15s, color .15s, border-color .15s, background .15s;
  z-index: 3;
}
.src::after { content: '↗'; font-size: 9px; margin-left: 2px; vertical-align: 1px; }
.src:hover { opacity: 1; color: var(--accent); border-color: rgba(61,126,255,.35); background: rgba(61,126,255,.1); }
/* 指数/情绪卡底部说明右移，给来源链接让位（emo 卡文字居中，空间足够不加） */
.stat-card .sub { padding-right: 36px; }
/* 提示条来源：垂直居中贴右 */
.panel.strip { position: relative; }
.strip-src { top: 50%; bottom: auto; transform: translateY(-50%); right: 12px; font-size: 11px; }
.page-index .strip-src { font-size: 10px; }
.page-index .stat-card .sub { padding-right: 32px; }
/* emo 卡：底部说明与右下角来源链接错开 */
.emo-card .s { padding-bottom: 9px; }

/* ============================================================
   v2.5 · 每日梯队（板级切换）/ 矩阵转置 / 复盘区间图 / 实时标记
   ============================================================ */

/* ---------- 「实时」标记 ---------- */
.live-dot {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 11px; font-weight: 400; color: var(--neon-green);
  background: rgba(38,194,129,.12); border: 1px solid rgba(38,194,129,.35);
  border-radius: 9px; padding: 1px 7px; margin-left: 6px;
}
.live-dot::before {
  content: ''; width: 5px; height: 5px; border-radius: 50%;
  background: var(--neon-green); animation: livePulse 1.6s ease-in-out infinite;
}
.live-off {
  font-size: 11px; font-weight: 400; color: var(--muted);
  background: var(--panel2); border: 1px solid var(--border);
  border-radius: 9px; padding: 1px 7px; margin-left: 6px;
}
@keyframes livePulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%      { opacity: .35; transform: scale(.7); }
}

/* ---------- 梯队页：标题栏日期表单 ---------- */
.hd-form { margin-left: auto; display: flex; gap: 6px; align-items: center; }
.hd-form input[type=date] {
  background: var(--panel2); border: 1px solid var(--border); color: var(--text);
  border-radius: 6px; padding: 4px 8px; font-family: inherit;
}

/* ---------- 梯队页：上部板级选项 ---------- */
.lv-tabs { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 10px; }
.lv-tab {
  background: var(--panel2); border: 1px solid var(--border); color: var(--text);
  border-radius: 8px; padding: 5px 12px; font-size: 13px; cursor: pointer;
  font-family: inherit; transition: background .15s, border-color .15s, color .15s;
}
.lv-tab:hover { border-color: rgba(61,126,255,.5); }
.lv-tab .lv-n { font-size: 11px; color: var(--muted); margin-left: 4px; font-variant-numeric: tabular-nums; }
.lv-tab.active {
  background: rgba(61,126,255,.16); border-color: rgba(61,126,255,.55); color: #9dc0ff;
  box-shadow: inset 0 0 0 1px rgba(61,126,255,.2);
}
.lv-tab.active .lv-n { color: #9dc0ff; }
.lv-tab.lv-hi.hi2.active { background: rgba(240,74,94,.14); border-color: rgba(240,74,94,.5); color: #ff9aa6; }
.lv-tab.lv-first.active { background: rgba(139,150,165,.14); border-color: rgba(139,150,165,.45); color: #c4ccd8; }
.lv-hint { margin-left: auto; font-size: 12px; color: var(--muted); }

/* ---------- 梯队页：下部个股表 ---------- */
.lv-scroll { max-height: 62vh; }
.lv-tbl { table-layout: fixed; }
.lv-nm { font-weight: 600; }
.lv-code { display: block; font-size: 11px; color: var(--muted); font-weight: 400; }
.lv-b {
  display: inline-block; padding: 1px 7px; border-radius: 9px; font-size: 12px;
  background: var(--panel2); border: 1px solid var(--border); white-space: nowrap;
}
.lv-b1 { color: var(--muted); }
.lv-b2 { color: #7fb3ff; border-color: rgba(61,126,255,.4); }
.lv-b3 { color: var(--amber); border-color: rgba(232,163,61,.45); }
.lv-b4, .lv-b5 { color: #ff9aa6; border-color: rgba(240,74,94,.4); }
.lv-b6 { color: #fff; background: rgba(240,74,94,.28); border-color: rgba(240,74,94,.6); }
.lv-cc { color: #9dc0ff; font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; }
.lv-rs { color: var(--muted); white-space: normal; text-align: left; font-size: 12px; line-height: 1.45; }
.tag-st { color: #ffb4b4; border-color: rgba(240,74,94,.5); font-size: 10px; padding: 0 5px; margin-left: 4px; }
.lv-foot { margin-top: 10px; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }

/* ---------- 情绪周期矩阵（转置：日期竖排 × 板级横向） ---------- */
.matrix.mx2 { width: 100%; }
.matrix.mx2 th, .matrix.mx2 td { text-align: left; vertical-align: top; white-space: normal; }
.matrix.mx2 thead th { text-align: center; }
.matrix.mx2 .mx-date {
  width: 78px; min-width: 78px; text-align: center; background: var(--panel2);
  position: sticky; left: 0; z-index: 2;
}
.matrix.mx2 thead .mx-date { z-index: 3; }
.mx-date b { display: block; font-size: 13px; line-height: 1.3; }
.mx-date span { display: block; font-size: 10px; color: var(--muted); }
.matrix.mx2 .mx-bh { font-weight: 600; min-width: 96px; }
.matrix.mx2 .mx-bh.mx-hot { color: var(--up); }
.matrix.mx2 .mx-bh.mx-mid { color: var(--amber); }
.matrix.mx2 .mx-cell { min-width: 96px; max-width: none; }
.mx-stk { display: flex; gap: 5px; align-items: baseline; padding: 1px 0; font-size: 12.5px; line-height: 1.5; }
.mx-nm { font-weight: 600; color: var(--text); white-space: nowrap; }
.mx-cc { font-size: 10.5px; color: #7f8b9c; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mx-more { font-size: 11px; color: var(--muted); padding-top: 1px; }
.matrix.mx2 .mx-first { text-align: center !important; }
.mx-cnt { font-size: 20px; font-weight: 700; color: #8fc7ff; font-variant-numeric: tabular-nums; }
.mx-unit { font-size: 11px; color: var(--muted); margin-left: 2px; }
/* 情绪周期矩阵随页面自然滚动（不做内部下拉）；表头不再吸顶，避免被固定顶栏遮挡 */
.matrix.mx2 thead th { position: static; }
.matrix.mx2 thead .mx-date { z-index: 3; }
.page-ladder .matrix-wrap { max-height: none; overflow: auto; }

/* ---------- 热股榜 ---------- */
.hot-tbl td.hot-rk { font-weight: 700; color: #8b96a5; }
.hot-tbl td.hot-rk.rk1 { color: #ffd166; }
.hot-tbl td.hot-rk.rk2 { color: #dfe6ee; }
.hot-tbl td.hot-rk.rk3 { color: #e8a33d; }
.hot-tbl td.hot-heat { position: relative; min-width: 118px; }
.hot-heat .heat-bar {
  position: absolute; left: 8px; top: 50%; transform: translateY(-50%);
  height: 15px; border-radius: 8px; max-width: calc(100% - 16px);
  background: linear-gradient(90deg, rgba(240,74,94,.42), rgba(240,74,94,.1));
}
.hot-heat i { position: relative; font-style: normal; font-variant-numeric: tabular-nums; }

/* ---------- 每日复盘页 ---------- */
.rv-head { display: flex; align-items: center; gap: 14px; margin-bottom: 12px; flex-wrap: wrap; }
.rv-date { display: flex; align-items: baseline; gap: 10px; }
.rv-date .rd-lab { font-size: 12px; color: var(--muted); }
.rv-date b { font-size: 26px; letter-spacing: .5px; font-variant-numeric: tabular-nums; }
.rv-date .rd-tag {
  font-size: 11px; color: var(--neon-cyan); border: 1px solid rgba(34,211,238,.35);
  border-radius: 9px; padding: 1px 8px;
}
.rv-sync { margin-left: auto; }
.rv-tools { display: flex; flex-direction: column; gap: 9px; padding: 12px 16px; }
.rv-range { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.rv-range input[type=date] {
  background: var(--panel2); border: 1px solid var(--border); color: var(--text);
  border-radius: 6px; padding: 4px 8px; font-family: inherit;
}
.rv-tilde { color: var(--muted); }
.rv-q.active { background: rgba(61,126,255,.16); border-color: rgba(61,126,255,.55); color: #9dc0ff; }
.rv-stat {
  display: flex; gap: 22px; flex-wrap: wrap; font-size: 12.5px; color: var(--muted);
  border-top: 1px dashed var(--border); padding-top: 8px;
}
.rv-stat b { font-variant-numeric: tabular-nums; color: var(--text); margin-left: 4px; }
.rv-stat b.up { color: var(--up); }
.rv-stat b.down { color: var(--down); }
.chart-mid { height: 250px; }
#rv-tbl td:nth-child(2), #rv-tbl td:nth-child(3) { font-weight: 600; }

@media (max-width: 1200px) {
  .lv-hint { margin-left: 0; width: 100%; }
  .rv-stat { gap: 14px; }
}

/* ==========================================================================
   v2.5 增量
   1) 首页涨跌家数卡：口径标注（沪深京全A）
   2) 梯队页：板级筛选菜单按板级配色 + 图标点；表格斑马纹与分隔线；涨停原因左对齐
   3) 情绪周期矩阵：标题图标放大、个股按题材着色、多列布局 + 溢出名单弹窗
   4) 复盘区间明细：最高板代表 / 回头波 列
   ========================================================================== */

/* --- 1) 首页涨跌家数口径标注 --- */
.nm-scope {
  font-style: normal; font-size: 10.5px; font-weight: 500;
  color: #9dc0ff; background: rgba(61,126,255,.14);
  border: 1px solid rgba(61,126,255,.32); border-radius: 8px;
  padding: 0 6px; margin-left: 6px; vertical-align: 1px;
}

/* --- 2) 梯队页：板级筛选菜单（颜色 + 图标点） --- */
.lv-tab { display: inline-flex; align-items: center; gap: 0; }
.lv-dot {
  width: 7px; height: 7px; border-radius: 50%; display: inline-block;
  background: currentColor; margin-right: 7px; flex: 0 0 7px;
  box-shadow: 0 0 7px currentColor;
}
.lv-tab .lv-n {
  min-width: 22px; text-align: center; border-radius: 8px;
  background: rgba(255,255,255,.07); padding: 0 5px; margin-left: 7px;
}
/* 全部 */
.lv-tab.lv-all { color: #c4ccd8; border-color: rgba(139,150,165,.32); }
.lv-tab.lv-all.active { background: rgba(139,150,165,.16); border-color: rgba(139,150,165,.6); color: #e6ecf5; }
/* 首板 */
.lv-tab.lv-tb1 { color: #93a1b4; border-color: rgba(139,150,165,.3); }
.lv-tab.lv-tb1.active { background: rgba(139,150,165,.2); border-color: rgba(139,150,165,.65); color: #dbe3ee; }
/* 2 板 */
.lv-tab.lv-tb2 { color: #7fb3ff; border-color: rgba(61,126,255,.34); }
.lv-tab.lv-tb2.active { background: rgba(61,126,255,.22); border-color: rgba(61,126,255,.7); color: #bcd6ff; }
/* 3 板 */
.lv-tab.lv-tb3 { color: #e8a33d; border-color: rgba(232,163,61,.34); }
.lv-tab.lv-tb3.active { background: rgba(232,163,61,.22); border-color: rgba(232,163,61,.7); color: #ffd79a; }
/* 4 板 */
.lv-tab.lv-tb4 { color: #ff8a5c; border-color: rgba(255,138,92,.34); }
.lv-tab.lv-tb4.active { background: rgba(255,138,92,.22); border-color: rgba(255,138,92,.7); color: #ffc4ab; }
/* 5 板 */
.lv-tab.lv-tb5 { color: #ff6b7f; border-color: rgba(240,74,94,.36); }
.lv-tab.lv-tb5.active { background: rgba(240,74,94,.22); border-color: rgba(240,74,94,.72); color: #ffb3bd; }
/* 6 板及以上 */
.lv-tab.lv-tb6 { color: #ff4d6a; border-color: rgba(240,74,94,.5); background: rgba(240,74,94,.1); }
.lv-tab.lv-tb6.active { background: rgba(240,74,94,.32); border-color: #f04a5e; color: #fff; }
.lv-tab.active .lv-n { background: rgba(255,255,255,.14); color: inherit; }

/* --- 2) 梯队个股表：斑马纹 / 分隔线 / 文本左对齐 --- */
.lv-tbl tbody tr td { border-bottom: 1px solid rgba(255,255,255,.055); }
.lv-tbl tbody tr.alt td { background: rgba(255,255,255,.032); }
.lv-tbl tbody tr:hover td { background: rgba(61,126,255,.11); }
.lv-tbl tbody tr td:first-child { border-left: 3px solid transparent; }
.lv-tbl tbody tr.lv-r1 td:first-child { border-left-color: rgba(139,150,165,.55); }
.lv-tbl tbody tr.lv-r2 td:first-child { border-left-color: rgba(61,126,255,.65); }
.lv-tbl tbody tr.lv-r3 td:first-child { border-left-color: rgba(232,163,61,.7); }
.lv-tbl tbody tr.lv-r4 td:first-child { border-left-color: rgba(255,138,92,.75); }
.lv-tbl tbody tr.lv-r5 td:first-child { border-left-color: rgba(240,74,94,.8); }
.lv-tbl tbody tr.lv-r6 td:first-child { border-left-color: #f04a5e; }
/* 题材与涨停原因必须左对齐（覆盖 .tbl td{text-align:right}，故提高选择器权重） */
.lv-tbl td.lv-cc,
.lv-tbl td.lv-rs { text-align: left; white-space: normal; }
.lv-tbl td.lv-rs { color: #b8c2d0; }

/* --- 3) 情绪周期矩阵 --- */
.mx-title { font-size: 17px !important; letter-spacing: .4px; }
.mx-ico {
  font-size: 19px; line-height: 1; color: var(--neon-cyan, #22d3ee);
  text-shadow: 0 0 12px rgba(34,211,238,.55); margin-right: -2px;
}
.matrix.mx2 .mx-bn { font-size: 14px; }
.matrix.mx2 .mx-bh { font-size: 13px; }

.mx-list.c1 { column-count: 1; }
.mx-list.c2 { column-count: 2; column-gap: 14px; }
.mx-list.c3 { column-count: 3; column-gap: 14px; }
.mx-stk {
  display: flex; gap: 5px; align-items: baseline; padding: 1px 0;
  font-size: 12.5px; line-height: 1.55; break-inside: avoid; -webkit-column-break-inside: avoid;
}
.mx-stk .mx-nm { color: inherit; font-weight: 600; white-space: nowrap; }
.mx-stk .mx-cc { font-size: 10.5px; color: rgba(255,255,255,.40); font-style: normal;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 题材配色板（同题材同色） */
.mx-stk.c0 { color: #7fb3ff; }
.mx-stk.c1 { color: #6fd6a0; }
.mx-stk.c2 { color: #e8a33d; }
.mx-stk.c3 { color: #c792ea; }
.mx-stk.c4 { color: #ff9aa6; }
.mx-stk.c5 { color: #58c8d8; }
.mx-stk.c6 { color: #a8d46a; }
.mx-stk.c7 { color: #f0a6ca; }
.mx-more {
  display: inline-block; margin-top: 5px; font-family: inherit; cursor: pointer;
  font-size: 11.5px; color: #9dc0ff; background: rgba(61,126,255,.12);
  border: 1px solid rgba(61,126,255,.32); border-radius: 7px; padding: 2px 9px;
  transition: .15s;
}
.mx-more:hover { background: rgba(61,126,255,.24); border-color: rgba(61,126,255,.6); color: #cfe0ff; }
.mx-more b { font-variant-numeric: tabular-nums; }
.mx-tot { font-size: 11px; color: var(--muted); padding-top: 3px; }
.mx-none { color: #3a4353; }

/* 溢出名单弹窗 */
.mx-modal { position: fixed; inset: 0; z-index: 1300; display: flex; align-items: center; justify-content: center; }
.mx-modal[hidden] { display: none; }
.mx-modal-mask { position: absolute; inset: 0; background: rgba(6,9,14,.72); backdrop-filter: blur(3px); }
.mx-modal-box {
  position: relative; width: min(880px, 92vw); max-height: 84vh; display: flex; flex-direction: column;
  background: #141a24; border: 1px solid rgba(61,126,255,.28); border-radius: 14px;
  box-shadow: 0 24px 70px rgba(0,0,0,.62);
}
.mx-modal-hd {
  display: flex; align-items: center; gap: 12px; padding: 12px 16px;
  border-bottom: 1px solid var(--border);
}
.mx-modal-hd b { font-size: 15px; }
.mx-legend { font-size: 11px; color: var(--muted); margin-left: auto; }
.mx-modal-x {
  background: transparent; border: 1px solid var(--border); color: var(--muted);
  border-radius: 7px; width: 26px; height: 26px; cursor: pointer; font-family: inherit; line-height: 1;
}
.mx-modal-x:hover { color: #fff; border-color: rgba(240,74,94,.6); }
.mx-modal-bd { padding: 12px 16px 18px; overflow: auto; column-count: 3; column-gap: 20px; }
.mx-row { display: flex; gap: 6px; align-items: baseline; font-size: 13px; padding: 2px 0; break-inside: avoid; }
.mx-row .mx-nm { color: inherit; font-weight: 600; white-space: nowrap; }
.mx-row .mx-cc { font-size: 11px; color: rgba(255,255,255,.45); font-style: normal; white-space: nowrap; }
.mx-row .mx-rr {
  font-style: normal; font-size: 11px; color: rgba(255,255,255,.32);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
@media (max-width: 900px) { .mx-modal-bd { column-count: 2; } }

/* --- 4) 复盘区间明细新增列 --- */
#rv-tbl td.rv-mb { font-variant-numeric: tabular-nums; }
#rv-tbl td.rv-mbs { text-align: left; color: #ffcf9a; max-width: 110px; overflow: hidden; text-overflow: ellipsis; }

/* ==========================================================================
   v2.7
   1) 首页纵向 flex 撑满视口：涨停池/热股榜表格自适应剩余高度（减少下拉）
   2) 情绪周期矩阵：随页面自然滚动，不做内部下拉
   3) 全站图标：顶栏导航图标 + 面板标题图标
   ========================================================================== */

/* --- 1) 首页：让「涨停池 Top20 / 热股榜 Top10」吃满剩余高度 ---
   思路：body 为纵向 flex（100vh），main 撑满剩余高度；main 内除 grid-2 外
   都是固定高度，grid-2 用 flex:1 吃掉剩余空间，其内部表格滚动区再吃满面板。 */
/* height 必须 100vh（定值）：min-height 下容器高度不定，
   main 的 flex-basis:0% 会被按 content 处理，内部表格区永远不收缩 */
.page-index { display: flex; flex-direction: column; height: 100vh; }
.page-index .topbar,
.page-index .foot,
.page-index .stat-grid,
.page-index .emo-grid,
.page-index .panel.strip,
.page-index .grid-3 { flex: 0 0 auto; }
.page-index main.container {
  /* basis 必须 0：auto 会以内容高度为基准把 body 撑过一屏（scrollH 1504），
     0 让 main 以视口剩余高度为基准，内部表格区自行收缩滚动 */
  flex: 1 1 0%; min-height: 0;
  display: flex; flex-direction: column;
  /* 关键：覆盖 .container 的 margin:0 auto —— body 是 flex 列容器时，
     子项的 auto 外边距会阻止默认拉伸（stretch），导致 main 收缩为
     fit-content 宽度（约 1540px）而不是铺满视口。 */
  margin-left: 0; margin-right: 0;
}
.page-index .grid-2 { flex: 1 1 auto; min-height: 250px; }
.page-index .grid-2 > .panel { display: flex; flex-direction: column; min-height: 0; margin-bottom: 0; }
/* 表格滚动区：撑满面板剩余高度并内部滚动，页面不再需要下拉 */
.page-index .grid-2 > .panel .tbl-scroll {
  flex: 1 1 auto; min-height: 150px; max-height: none; overflow: auto;
}
/* 面板底部的表单/提示行不被压缩 */
.page-index .grid-2 > .panel .lv-foot { flex: 0 0 auto; }

/* --- 3) 图标：顶栏导航 + 面板标题 --- */
.topbar nav a .ni {
  font-style: normal; font-size: 14px; line-height: 1;
  margin-right: 6px; vertical-align: -1px;
}
.topbar nav a.on .ni { filter: drop-shadow(0 0 6px rgba(255,255,255,.55)); }
.brand .bi {
  font-style: normal; font-size: 15px; line-height: 1; margin-right: 6px;
  filter: drop-shadow(0 0 8px rgba(34,211,238,.7));
}
.panel h2 .ico {
  font-style: normal; font-size: 15px; line-height: 1; flex: 0 0 auto;
  filter: drop-shadow(0 0 8px rgba(61,126,255,.5));
}
.page-index .panel h2 .ico { font-size: 14px; }
/* 卡片/小节标题图标（复盘摘要等） */
.sec-ico { font-style: normal; font-size: 13px; margin-right: 6px; filter: drop-shadow(0 0 6px rgba(61,126,255,.45)); }
/* 按钮内图标间距 */
.btn .bi { font-style: normal; margin-right: 5px; }
.empty-tip .ei { font-style: normal; margin-right: 6px; opacity: .8; }


/* ============================================================
   v2.12 · 板块资金流入 Top10 卡片（仪表盘，位于热股榜上方）
   ============================================================ */
/* 首页 flex 全屏布局下新增区块必须显式 flex:0 0 auto，否则会挤压下方表格区 */
.page-index .panel-bkflow { flex: 0 0 auto; margin-bottom: 12px; position: relative; }
.panel-bkflow h2 { margin-bottom: 10px; }
.sf-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(158px, 1fr));
  gap: 8px;
}
.sf-card {
  background: var(--panel2);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 8px 10px;
  min-width: 0;
}
.sf-name {
  display: flex; justify-content: space-between; align-items: baseline; gap: 6px;
  font-size: 13px; font-weight: 600;
  white-space: nowrap; overflow: hidden;
}
.sf-name > span:first-child { overflow: hidden; text-overflow: ellipsis; }
.sf-pct { font-size: 11px; font-weight: 400; font-variant-numeric: tabular-nums; flex: 0 0 auto; }
.sf-v { font-size: 18px; font-weight: 700; margin: 2px 0; font-variant-numeric: tabular-nums; }
.sf-sub { font-size: 11px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 1000px) { .sf-grid { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); } }

/* ============================================================
   v2.13 · 手机端适配（≤820px）
   ============================================================ */
/* 网格项默认 min-width:auto，内部 nowrap 表格的最小内容宽（514px+）
   会把 grid 轨道整体撑宽，造成手机端整页横向溢出；
   min-width:0 后表格在 .tbl-scroll 内自行横向滚动 */
.grid-2 > .panel, .grid-3 > .panel { min-width: 0; }
.tbl-scroll { min-width: 0; }

@media (max-width: 820px) {
  /* --- 顶栏收窄 --- */
  .topbar-inner { gap: 12px; height: 48px; }
  .brand { font-size: 15px; letter-spacing: .5px; }
  .topbar nav { gap: 2px; }
  .topbar nav a { padding: 6px 9px; font-size: 13px; }
  .topbar-right { gap: 8px; }
  .clock { display: none; }
  .ri-btn, .user-btn { padding: 5px 8px; font-size: 12px; }

  /* --- 仪表盘：解除一屏化，恢复自然滚动 --- */
  .page-index { height: auto; min-height: 100vh; }
  .page-index .grid-2 > .panel .tbl-scroll {
    flex: 0 0 auto;
    min-height: 0;
    max-height: 55vh;
    -webkit-overflow-scrolling: touch;
  }
  .page-index .grid-2 > .panel { margin-bottom: 12px; }

  /* --- 通用表格在窄屏更紧凑 --- */
  .tbl { font-size: 12.5px; }
  .tbl th, .tbl td { padding: 6px 8px; }

  /* --- 指数/情绪卡压缩 --- */
  .page-index .stat-card .val { font-size: 20px; }
  .page-index .emo-card .v { font-size: 17px; }
  .page-index .emo-card .k { font-size: 11px; }
  .stat-card .val { font-size: 20px; }
  .emo-card .v { font-size: 18px; }

  /* --- 图表高度 --- */
  .chart { height: 220px; }
  .chart-tall { height: 260px; }
}

@media (max-width: 640px) {
  /* 顶栏折两行：上行 品牌 + 右侧操作，下行 菜单横滑 */
  .topbar-inner {
    flex-wrap: wrap;
    height: auto;
    padding-top: 8px;
    padding-bottom: 8px;
    row-gap: 4px;
  }
  .brand { flex: 1 1 auto; }
  .topbar-right { flex: 0 0 auto; }
  .topbar nav {
    order: 3;
    flex: 1 0 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .topbar nav::-webkit-scrollbar { display: none; }
  .topbar nav a { white-space: nowrap; }

  /* 情绪卡窄屏保持 3 列但更紧凑 */
  .emo-grid, .page-index .emo-grid { grid-template-columns: repeat(3, 1fr); gap: 6px; }
  .page-index .emo-card { padding: 6px 4px; }

  /* 板块资金流卡片：窄屏缩小 */
  .sf-grid { grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 6px; }
  .sf-v { font-size: 16px; }

  .panel, .page-index .panel { padding: 10px 12px; }
  .container, .container-wide { padding-top: 12px; }
}

/* ============================================================
   v2.14 · 手机端第二轮修复
   1) 涨跌家数卡：v2.13 的 20px 被 .breadth-val 的 22px !important
      压过导致 "4170/1189/193" 溢出 —— 移动端用更小字号 + 同 !important
   2) 复盘统计区间：≤640px 网格化排版（日期一行、快捷按钮等宽一行）
   ============================================================ */

/* 快捷按钮容器：桌面端仍是行内排列（与旧版一致） */
.rv-quick { display: inline-flex; gap: 8px; flex-wrap: wrap; align-items: center; }

@media (max-width: 820px) {
  /* --- 涨跌家数卡：三个数字必须装进 ~150px 卡片 --- */
  .page-index .breadth-val { font-size: 16px !important; line-height: 1.4; }
  .page-index .bd-sep { font-size: 12px; margin: 0 2px; }
  .page-index .stat-card { padding: 8px 10px; }
  .page-index .stat-card .nm { font-size: 12px; gap: 4px; }
  .page-index .nm-scope { font-size: 9.5px; padding: 0 4px; margin-left: 4px; }
  .page-index .badge-sign { font-size: 10.5px; }
  .page-index .stat-card .sub { font-size: 10.5px; line-height: 1.55; }
  .stat-card .sub { font-size: 11px; }
}

@media (max-width: 640px) {
  /* --- 复盘区间工具条：网格重排 ---
     第1行：统计区间 标签 + 起始日期 ~ 结束日期
     第2行：5 个快捷按钮等宽铺满
     第3行：区间信息（共 N 个交易日…） */
  .rv-range {
    display: grid;
    grid-template-columns: auto 1fr auto 1fr;
    align-items: center;
    gap: 8px 6px;
  }
  .rv-range > .hint:first-of-type { grid-column: 1; white-space: nowrap; }
  .rv-range input[type="date"] {
    grid-row: 1; width: 100%; min-width: 0;
    padding: 7px 6px; font-size: 14px;   /* 14px 防 iOS 聚焦自动放大 */
  }
  .rv-range input#rv-start { grid-column: 2; }
  .rv-range .rv-tilde { grid-column: 3; text-align: center; }
  .rv-range input#rv-end { grid-column: 4; }
  .rv-quick {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 6px;
  }
  .rv-quick .btn {
    padding: 7px 0; font-size: 11.5px; text-align: center;
    white-space: nowrap; border-radius: 6px;
  }
  .rv-range .hint#rv-info { grid-column: 1 / -1; }

  /* 区间统计行：两列换行更整齐 */
  .rv-stat { gap: 8px 18px; font-size: 12px; }
}
