:root {
  --bg: #0a0d12;
  --panel: #12161d;
  --panel-2: #181e28;
  --panel-3: #1e2531;
  --line: #232b37;
  --line-2: #2f3947;
  --text: #e8eef7;
  --dim: #8b97a9;
  --dim-2: #5f6b7d;
  --up: #f5484a;
  --down: #12b886;
  --gold: #d9a441;
  --blue: #5b8def;
  --radius: 10px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
  background: var(--bg);
  color: var(--text);
  font: 14px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif;
  -webkit-font-smoothing: antialiased;
  font-variant-numeric: tabular-nums;
}

.wrap { max-width: 1340px; margin: 0 auto; padding: 22px 26px 70px; }

.top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
  flex-wrap: wrap;
}

.brand { display: flex; align-items: baseline; gap: 9px; }

.brand h1 { font-size: 16px; font-weight: 500; letter-spacing: .2px; }

.brand .sub { font-size: 13px; color: var(--dim); }

.brand .dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--gold);
  align-self: center;
  box-shadow: 0 0 0 3px rgba(217, 164, 65, .12);
}

.meta { display: flex; align-items: center; gap: 14px; font-size: 12px; color: var(--dim); }

.live { display: inline-flex; align-items: center; gap: 6px; }

.live::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: var(--dim-2);
}

.live.on::before { background: var(--down); box-shadow: 0 0 0 3px rgba(18, 184, 134, .15); }

.live.err::before { background: var(--up); }

.btn {
  background: var(--panel-2);
  border: 1px solid var(--line-2);
  color: var(--text);
  font-size: 12px;
  padding: 5px 13px;
  border-radius: 6px;
  cursor: pointer;
  font-family: inherit;
  transition: background .15s, border-color .15s;
}

.btn:hover { background: var(--panel-3); border-color: #3b475a; }
.btn:active { transform: translateY(1px); }
.btn[disabled] { opacity: .5; cursor: default; }

.hero {
  margin: 26px 0 30px;
  padding: 26px 28px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 14px;
  position: relative;
  overflow: hidden;
}

.hero::after {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: var(--dim-2);
}

.hero.tone-work::after { background: var(--up); }
.hero.tone-off::after { background: var(--down); }
.hero.tone-mixed::after { background: var(--gold); }
.hero.tone-idle::after { background: var(--blue); }

.hero-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; flex-wrap: wrap; }

.tag {
  display: inline-block;
  font-size: 11px;
  letter-spacing: .5px;
  color: var(--dim);
  border: 1px solid var(--line-2);
  padding: 2px 9px;
  border-radius: 20px;
  margin-bottom: 12px;
}

.verdict-text { min-width: 320px; flex: 1; }

.verdict-text h2 {
  font-size: 34px;
  font-weight: 500;
  letter-spacing: -.5px;
  line-height: 1.25;
  margin-bottom: 10px;
}

.verdict-text p { font-size: 13.5px; color: var(--dim); max-width: 720px; line-height: 1.75; }

.stamp { text-align: right; font-size: 12px; color: var(--dim-2); line-height: 1.9; white-space: nowrap; }
.stamp strong { color: var(--dim); font-weight: 400; }

.metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  margin-top: 26px;
  background: var(--line);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
}

.metric { background: var(--panel-2); padding: 15px 18px; }
.metric .k { font-size: 11.5px; color: var(--dim); margin-bottom: 6px; }
.metric .v { font-size: 24px; font-weight: 500; letter-spacing: -.4px; }
.metric .v.gold { color: var(--gold); }
.metric .n { font-size: 11.5px; color: var(--dim-2); margin-top: 3px; }

.section-title {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 34px 0 12px;
  font-size: 13px;
  font-weight: 400;
  color: var(--dim);
}

.section-title .hint { font-size: 11.5px; color: var(--dim-2); }

/* 表格上方工具条：左侧搜索，右侧匹配条数 */
.toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

.searchbox {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 1 380px;
  min-width: 220px;
  height: 34px;
  padding: 0 10px;
  background: var(--panel);
  border: 1px solid var(--line-2);
  border-radius: 8px;
  transition: border-color .15s, background .15s;
}
.searchbox:focus-within { border-color: rgba(217, 164, 65, .55); background: var(--panel-2); }
.searchbox .sicon { color: var(--dim-2); flex: none; }
.searchbox input {
  flex: 1;
  min-width: 0;
  height: 100%;
  background: transparent;
  border: 0;
  outline: 0;
  color: var(--text);
  font: inherit;
  font-size: 13px;
}
.searchbox input::placeholder { color: var(--dim-2); }
.searchbox input::-webkit-search-cancel-button { display: none; }

.qclear {
  flex: none;
  padding: 2px 7px;
  font-size: 11.5px;
  color: var(--dim);
  background: var(--panel-3);
  border: 1px solid var(--line-2);
  border-radius: 5px;
  cursor: pointer;
}
.qclear:hover { color: var(--text); border-color: var(--line-2); }

/* GO：搜索框里的动作按钮。和「清除」同一行，但用主色描边把它和「辅助操作」区分开。
   触屏键盘的回车不一定是「前往」，有些输入法直接吞掉，所以必须有个能点的东西 */
.qgo {
  flex: none;
  padding: 3px 9px;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--gold);
  background: rgba(217, 164, 65, .1);
  border: 1px solid rgba(217, 164, 65, .4);
  border-radius: 5px;
  cursor: pointer;
  transition: background .15s, border-color .15s;
}
.qgo:hover { background: rgba(217, 164, 65, .18); border-color: var(--gold); }
.qgo:active { transform: translateY(1px); }

.qhint { font-size: 11.5px; color: var(--dim-2); }
.qhint strong { color: var(--text); font-weight: 500; }

/* 表头副标题：标注数据截止周期（2025年报 / 26中报） */
.th-sub {
  display: block;
  margin-top: 1px;
  font-size: 10px;
  font-weight: 400;
  color: var(--dim-2);
  letter-spacing: .2px;
}

/* 单元格里的小字副值（如机构占比与上期的差值） */
.cellsub { display: block; font-size: 10.5px; line-height: 1.3; margin-top: 1px; }
/* 单位后缀：差值只有数字会让人误读成份额或百分比，pp 明确是百分点 */
.cellsub .unit { font-size: 9px; margin-left: 1px; opacity: .7; letter-spacing: 0; }
/* 口径说明里的具体数值，等宽字体避免和正文混读 */
.mono { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: .94em; color: var(--text); }

mark {
  background: rgba(217, 164, 65, .22);
  color: var(--gold);
  border-radius: 2px;
  padding: 0 1px;
}

.sharenote {
  margin-top: 9px;
  font-size: 11.5px;
  color: var(--dim-2);
  line-height: 1.7;
}

.tablewrap {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow-x: auto;
}

table { width: 100%; border-collapse: collapse; min-width: 1180px; }

thead th {
  font-size: 11.5px;
  font-weight: 400;
  color: var(--dim);
  text-align: right;
  padding: 11px 13px;
  border-bottom: 1px solid var(--line);
  white-space: nowrap;
  position: sticky;
  top: 0;
  background: var(--panel);
  user-select: none;
}

thead th.sortable { cursor: pointer; }
thead th.sortable:hover { color: var(--text); }
thead th.sorted { color: var(--text); box-shadow: inset 0 -2px 0 var(--gold); }
thead th:first-child, tbody td:first-child { text-align: left; }

tbody td {
  padding: 11px 13px;
  border-bottom: 1px solid rgba(35, 43, 55, .55);
  text-align: right;
  font-size: 13px;
  white-space: nowrap;
}

tbody tr:last-child td { border-bottom: none; }
tbody tr:hover td { background: rgba(30, 37, 49, .5); }

.name { display: flex; flex-direction: column; gap: 2px; }
.name .nm { font-size: 13px; line-height: 1.35; }
.name .sub { display: flex; align-items: center; gap: 6px; }
.name .code { font-size: 11px; color: var(--dim-2); font-family: ui-monospace, Consolas, monospace; }
.badge {
  font-size: 10px;
  color: var(--gold);
  border: 1px solid rgba(217, 164, 65, .35);
  background: rgba(217, 164, 65, .08);
  padding: 0 5px;
  border-radius: 3px;
  line-height: 1.6;
}

.idx { color: var(--dim); font-size: 12px; }
.up { color: var(--up); }
.down { color: var(--down); }
.flat { color: var(--dim); }
.mute { color: var(--dim-2); }

.mult { font-weight: 500; }
.mult.hot { color: var(--gold); }

.spark { display: block; margin-left: auto; }

tfoot td {
  padding: 13px;
  text-align: right;
  font-size: 13px;
  font-weight: 500;
  border-top: 1px solid var(--line-2);
  background: var(--panel-2);
}

tfoot td:first-child { text-align: left; color: var(--dim); font-weight: 400; }

.observe-note {
  padding: 9px 15px;
  font-size: 11.5px;
  color: var(--dim-2);
  border-bottom: 1px solid var(--line);
  background: rgba(24, 30, 40, .6);
}

/* 搜索无结果的空状态：必须写在 tbody td:first-child 之后，
   否则会被「首列左对齐」那条规则按就近原则盖掉 */
tbody td.empty {
  padding: 30px 15px;
  text-align: center;
  color: var(--dim-2);
  font-size: 12.5px;
  white-space: normal;
}

.notes {
  margin-top: 40px;
  padding: 20px 22px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  font-size: 12px;
  color: var(--dim);
  line-height: 1.9;
}

.notes h3 { font-size: 12px; font-weight: 500; color: var(--text); margin-bottom: 10px; }
.notes p { margin-bottom: 6px; }
.notes .warn { color: var(--gold); }

.loading { padding: 60px 20px; text-align: center; color: var(--dim); font-size: 13px; }

/* ============================================================
   会员 / 导航 / 资讯 / 登录
   以下为接入会员系统后新增，沿用上面同一套变量
   ============================================================ */

a { color: inherit; text-decoration: none; }
.brand a { text-decoration: none; }
.brand .dot { display: inline-block; }

.btn-ghost {
  background: transparent;
  color: var(--dim);
  border-color: var(--line);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
}
.btn-ghost:hover { color: var(--text); border-color: var(--line-2); background: var(--panel-2); }

/* 当前所在栏目：顶栏按钮、下拉项共用这一套高亮 */
.btn-ghost.on,
.navdrop-btn.on {
  color: var(--gold);
  border-color: rgba(217, 164, 65, .42);
  background: rgba(217, 164, 65, .09);
}

/* ------------------------------------------------------------
   RPS 下拉菜单
   个股 / 北证 / 行业三个口径收进一个入口，顶栏不再被三个按钮撑长。
   展开靠 hover + focus-within：桌面端悬停即开，触屏点一下按钮拿到焦点也能开，
   不写 JS 就不用担心和页面其他脚本抢事件。
   ------------------------------------------------------------ */
.navdrop { position: relative; display: inline-flex; }

.navdrop-btn {
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  gap: 5px;
}
.navdrop-btn .caret {
  font-size: 9px;
  line-height: 1;
  opacity: .7;
  transition: transform .16s ease;
}
.navdrop:hover .navdrop-btn .caret,
.navdrop:focus-within .navdrop-btn .caret { transform: rotate(180deg); }

.navdrop-menu {
  position: absolute;
  top: calc(100% + 7px);
  left: 0;
  z-index: 60;
  min-width: 214px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel-2);
  box-shadow: 0 14px 34px rgba(0, 0, 0, .45);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-5px);
  transition: opacity .15s ease, transform .15s ease, visibility .15s;
}
/* 留一条看不见的连接带，否则鼠标从按钮移到菜单的 7px 空隙里会中途收起 */
.navdrop-menu::before {
  content: '';
  position: absolute;
  left: 0; right: 0; top: -8px;
  height: 8px;
}
.navdrop:hover .navdrop-menu,
.navdrop:focus-within .navdrop-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.navdrop-menu a {
  display: block;
  padding: 8px 10px;
  border-radius: 7px;
  font-size: 13px;
  color: var(--text);
  transition: background .12s;
}
.navdrop-menu a em {
  display: block;
  margin-top: 2px;
  font-style: normal;
  font-size: 11px;
  color: var(--dim-2);
}
.navdrop-menu a:hover { background: var(--panel-3); }
.navdrop-menu a.on { color: var(--gold); }

/* 等级不够的条目：不隐藏、不置灰到看不见，只把名称压淡、右上角挂一个等级标签。
   灰到看不清等于变相隐藏，用户还是不知道这里有东西；【会员】标签才是转化入口。
   没提 ?v=：这条纯新增，退化成「标签没有边框、单独一行加粗」，仍然可读，
   不值得为了它把 47 个模板里的 app.css?v=24 全改一遍再重传。 */
.navdrop-menu a.locked { position: relative; padding-right: 52px; }
.navdrop-menu a.locked > em { padding-right: 2px; }
.navdrop-menu a.locked .lk {
  position: absolute;
  top: 8px;
  right: 9px;
  padding: 1px 6px;
  border: 1px solid rgba(217, 164, 65, .45);
  border-radius: 999px;
  font-size: 10px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--gold);
  background: rgba(217, 164, 65, .08);
}

/* 下拉分组标题：选股里「强弱排名 / 资金信号」两组靠它和一条细线分开。
   标题本身不可点，所以用 div 不用 a，hover 也就不该有背景。 */
.navdrop-cap {
  margin: 5px 2px 2px;
  padding: 6px 8px 3px;
  font-size: 10.5px;
  letter-spacing: .09em;
  color: var(--dim-2);
  border-top: 1px solid var(--line);
}
.navdrop-cap:first-child { margin-top: 0; padding-top: 4px; border-top: 0; }

/* 条目带长副标题时把菜单放宽一档：214px 下「涨跌家数、涨停跌停、成交额与近 20 日
   情绪曲线」这类会折成两行，六项叠起来近 440px 高，看着像一堵墙 */
.navdrop-menu.wide { min-width: 300px; }

.btn-primary {
  background: var(--gold);
  border-color: var(--gold);
  color: #14181f;
  font-weight: 500;
}
.btn-primary:hover { background: #e0ae4a; border-color: #e0ae4a; }
.btn-primary[disabled] { opacity: .6; cursor: default; }
.btn-block { width: 100%; display: flex; justify-content: center; padding: 10px 16px; font-size: 13.5px; }

/* 用户信息 */
.userbox { display: inline-flex; align-items: center; gap: 7px; }
.uname { color: var(--text); font-size: 12px; max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-decoration: none; }
.uname:hover { color: var(--gold); }
.ulevel {
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 4px;
  border: 1px solid var(--line-2);
  color: var(--dim-2);
  white-space: nowrap;
}
.ulevel.lv1 { color: var(--gold); border-color: rgba(217, 164, 65, .45); background: rgba(217, 164, 65, .08); }
.ulevel.lv2 { color: #6ee7b7; border-color: rgba(18, 184, 134, .45); background: rgba(18, 184, 134, .08); }

/* 账户下拉：头像 + 昵称 + 等级
   以前是「昵称+等级」和「退出」两个独立控件平铺在右端，退出占了 40px，
   而会员套餐 / 卡密这些真正该常驻的入口反而一个都没有。
   合成一个下拉后总宽度没变（多出 19px 头像和 caret，少掉一个「退出」按钮），
   顶上也不再随页面变化而增减元素。 */
.acc-btn { gap: 6px; padding-left: 7px; }
.acc-ava {
  display: inline-flex; align-items: center; justify-content: center;
  width: 19px; height: 19px;
  border-radius: 50%;
  font-size: 10.5px; font-weight: 500; line-height: 1;
  color: var(--gold);
  background: rgba(217, 164, 65, .12);
  border: 1px solid rgba(217, 164, 65, .38);
}
.acc-name {
  max-width: 96px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* 这个下拉贴着视口右边缘，left:0 会让菜单被推出屏幕外 */
.navdrop-r .navdrop-menu { left: auto; right: 0; }
.acc-menu { min-width: 252px; }
.acc-menu a { position: relative; padding-right: 54px; }

/* 顶部一行把「我是谁、还剩多久」说清楚：续费理由放在菜单第一眼，
   比放在「个人中心 → 会员有效期卡片」里要近得多 */
.acc-head {
  padding: 7px 10px 9px;
  margin-bottom: 3px;
  border-bottom: 1px solid var(--line);
}
.acc-hl { display: flex; align-items: center; gap: 7px; }
.acc-hl b {
  max-width: 150px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: 13px; font-weight: 500; color: var(--text);
}
.acc-he { margin-top: 3px; font-size: 11px; color: var(--dim-2); }

/* 与「选股」里锁定的等级标签同位置同观感，用户不用重新学一次 */
.acc-tag {
  position: absolute;
  top: 8px; right: 9px;
  padding: 1px 6px;
  border: 1px solid rgba(217, 164, 65, .45);
  border-radius: 999px;
  font-size: 10px; font-weight: 400; line-height: 1.5;
  color: var(--gold);
  background: rgba(217, 164, 65, .08);
}

.acc-sep { height: 1px; margin: 5px 4px; background: var(--line); }
.acc-menu a.acc-out { padding-right: 10px; color: var(--dim); }
.acc-menu a.acc-out:hover { color: var(--up); }

/* 站内通知铃铛：只占 30px，塞在用户名前面。
   做成文字「消息」会跟右侧 6 个栏目抢宽度，窄屏又会多折一行 */
.bell {
  position: relative;
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px;
  flex: 0 0 30px;
  color: var(--dim);
  border: 1px solid var(--line);
  border-radius: 8px;
  text-decoration: none;
  transition: color .14s, border-color .14s, background .14s;
}
.bell:hover { color: var(--gold); border-color: rgba(217, 164, 65, .45); }
.bell.on { color: var(--gold); border-color: rgba(217, 164, 65, .35); background: rgba(217, 164, 65, .07); }

.belldot {
  position: absolute; top: -5px; right: -5px;
  min-width: 15px; height: 15px;
  padding: 0 3px;
  font-size: 9.5px;
  font-weight: 500;
  line-height: 15px;
  text-align: center;
  color: #fff;
  background: var(--up);
  border-radius: 8px;
  font-variant-numeric: tabular-nums;
}

/* 公告横幅 */
.announce {
  margin-top: 16px;
  padding: 9px 15px;
  font-size: 12.5px;
  color: var(--gold);
  background: rgba(217, 164, 65, .07);
  border: 1px solid rgba(217, 164, 65, .22);
  border-radius: 8px;
}

/* 会员到期提醒：顶栏下面一条，只在 15 天内或已过期时出现 */
.expbar {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  margin-top: 14px;
  padding: 9px 15px;
  font-size: 12.5px;
  border-radius: 8px;
  border: 1px solid rgba(217, 164, 65, .22);
  color: var(--gold);
  background: rgba(217, 164, 65, .07);
}
.expbar.danger {
  color: var(--up);
  border-color: rgba(245, 72, 74, .3);
  background: rgba(245, 72, 74, .07);
}
.expbar a {
  flex: 0 0 auto;
  color: inherit;
  opacity: .8;
  text-decoration: none;
  border-bottom: 1px dotted currentColor;
}
.expbar a:hover { opacity: 1; }

/* 会员锁定提示 */
.lockbox {
  margin-top: 34px;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 22px 24px;
  background: var(--panel);
  border: 1px dashed var(--line-2);
  border-radius: var(--radius);
}
.lockicon { font-size: 22px; opacity: .5; }
.locktitle { font-size: 13.5px; color: var(--text); margin-bottom: 4px; }
.lockdesc { font-size: 12px; color: var(--dim); }

/* 历史曲线 */
.histwrap {
  padding: 18px 20px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}
.histwrap canvas { width: 100%; display: block; }
.histempty { padding: 40px 0; text-align: center; color: var(--dim-2); font-size: 12.5px; }

/* 分类导航 */
.catnav { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.catitem {
  font-size: 12px;
  padding: 4px 12px;
  border-radius: 20px;
  border: 1px solid var(--line);
  color: var(--dim);
  background: var(--panel);
}
.catitem:hover { color: var(--text); border-color: var(--line-2); }
.catitem.active { color: var(--gold); border-color: rgba(217, 164, 65, .45); background: rgba(217, 164, 65, .08); }

/* 资讯列表 */
.newslist { display: flex; flex-direction: column; gap: 10px; }
.newsitem {
  display: block;
  padding: 16px 20px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  transition: border-color .15s, background .15s;
}
.newsitem:hover { border-color: var(--line-2); background: var(--panel-2); }
.ni-head { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.ni-cat {
  font-size: 10px;
  padding: 1px 7px;
  border-radius: 4px;
  border: 1px solid var(--line-2);
  color: var(--dim);
  white-space: nowrap;
}
.pin {
  font-size: 10px;
  padding: 1px 7px;
  border-radius: 4px;
  background: rgba(217, 164, 65, .15);
  color: var(--gold);
  border: 1px solid rgba(217, 164, 65, .35);
}
.ni-title { font-size: 14.5px; color: var(--text); font-weight: 400; }
.ni-sum { margin-top: 7px; font-size: 12.5px; color: var(--dim); line-height: 1.65; }
.ni-meta { margin-top: 9px; display: flex; gap: 14px; font-size: 11px; color: var(--dim-2); }

.emptybox { padding: 60px 20px; text-align: center; color: var(--dim-2); font-size: 12.5px; }

.pager { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 24px; }
.pagenum { font-size: 12px; color: var(--dim); }

/* 文章详情 */
.article {
  margin-top: 26px;
  padding: 34px 38px 40px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 14px;
}
.art-head { padding-bottom: 20px; border-bottom: 1px solid var(--line); margin-bottom: 24px; }
.art-head h1 { font-size: 24px; font-weight: 500; line-height: 1.4; margin: 12px 0 10px; letter-spacing: -.2px; }
.art-meta { display: flex; gap: 16px; font-size: 11.5px; color: var(--dim-2); }
.art-body { font-size: 14.5px; line-height: 1.95; color: #cfd8e5; }
.art-body p { margin-bottom: 14px; }
.art-body h3, .art-body h4, .art-body h5 { color: var(--text); margin: 26px 0 12px; font-weight: 500; }
.art-body h3 { font-size: 17px; }
.art-body h4 { font-size: 15px; }
.art-body ul, .art-body ol { margin: 0 0 14px 22px; }
.art-body li { margin-bottom: 6px; }
.art-body a { color: var(--blue); text-decoration: underline; }
.art-body strong { color: var(--text); }
.art-body blockquote {
  margin: 0 0 14px;
  padding: 10px 16px;
  border-left: 3px solid var(--line-2);
  color: var(--dim);
  background: var(--panel-2);
  border-radius: 0 6px 6px 0;
}
.art-body code { background: var(--panel-3); padding: 1px 5px; border-radius: 4px; font-size: 12.5px; }
.art-body table { width: 100%; border-collapse: collapse; margin-bottom: 14px; }
.art-body th, .art-body td { border: 1px solid var(--line); padding: 7px 10px; font-size: 13px; }
.art-body th { background: var(--panel-2); text-align: left; }
.artnav { display: flex; justify-content: space-between; gap: 12px; margin-top: 20px; }

/* 登录 / 注册 */
.authbody { display: flex; align-items: center; justify-content: center; min-height: 100vh; }
.authwrap { width: 100%; max-width: 380px; padding: 24px; }
.authcard {
  padding: 32px 30px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 14px;
}
.authbrand { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--dim); margin-bottom: 24px; }
.authbrand .dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 0 3px rgba(217, 164, 65, .12);
}
.authcard h2 { font-size: 21px; font-weight: 500; margin-bottom: 6px; }
.authsub { font-size: 12px; color: var(--dim); margin-bottom: 24px; }
/* 登录有效期到期被踢回来的提示：用金色不用红色——这不是错误，只是到点了。
   负 margin 抵掉 .authsub 给表单留的 24px，免得提示框孤零零飘在中间 */
.authexpired {
  margin: -14px 0 18px;
  padding: 8px 12px;
  font-size: 12px;
  color: var(--gold);
  background: rgba(217, 164, 65, .09);
  border: 1px solid rgba(217, 164, 65, .28);
  border-radius: 6px;
}
.field { display: block; margin-bottom: 15px; }
.field span { display: block; font-size: 11.5px; color: var(--dim); margin-bottom: 6px; }
.field input {
  width: 100%;
  padding: 9px 12px;
  background: var(--bg);
  border: 1px solid var(--line-2);
  border-radius: 7px;
  color: var(--text);
  font-size: 13px;
  font-family: inherit;
  outline: none;
  transition: border-color .15s;
}
.field input:focus { border-color: var(--gold); }
.field input::placeholder { color: var(--dim-2); }
.formerr {
  margin-bottom: 14px;
  padding: 8px 12px;
  font-size: 12px;
  color: #ff8080;
  background: rgba(245, 72, 74, .08);
  border: 1px solid rgba(245, 72, 74, .3);
  border-radius: 6px;
}
.authfoot { margin-top: 18px; text-align: center; font-size: 12px; color: var(--dim); }
.authfoot a { color: var(--gold); }
.authfoot.muted { line-height: 1.7; }
.authnote { margin-top: 18px; text-align: center; font-size: 11px; color: var(--dim-2); }
.noticebox {
  padding: 14px 16px;
  font-size: 12.5px;
  color: var(--dim);
  background: var(--panel-2);
  border: 1px solid var(--line-2);
  border-radius: 8px;
  line-height: 1.7;
}
.noticebox a { color: var(--gold); }

/* ---------------- 7×24 快讯 ---------------- */
.livefeed {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  margin: 14px 0 18px;
  overflow: hidden;
}
.lf-head {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
}
.lf-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--up);
  box-shadow: 0 0 0 3px rgba(245, 72, 74, .16);
  animation: lfpulse 2.2s ease-in-out infinite;
}
@keyframes lfpulse { 50% { opacity: .35; } }
.lf-meta { margin-left: auto; font-size: 11.5px; color: var(--dim-2); }
.lf-list { max-height: 460px; overflow-y: auto; }
.lf-day {
  position: sticky; top: 0; z-index: 1;
  padding: 6px 16px;
  font-size: 11px;
  color: var(--dim-2);
  background: var(--panel-2);
  border-bottom: 1px solid var(--line);
}
.lf-item {
  display: flex;
  gap: 12px;
  padding: 10px 16px;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
  line-height: 1.65;
}
.lf-item:last-child { border-bottom: 0; }
.lf-time { flex: none; width: 44px; color: var(--gold); font-size: 12px; font-variant-numeric: tabular-nums; }
.lf-body b { display: block; font-weight: 600; margin-bottom: 2px; }
.lf-body span { color: var(--dim); font-size: 12.5px; }
.lf-empty { padding: 22px 16px; text-align: center; color: var(--dim-2); font-size: 12.5px; }
.lf-foot { padding: 10px 16px; border-top: 1px solid var(--line); text-align: center; }
.lf-foot .btn { font-size: 12px; }

/* 顶栏全站搜索
   放在 .meta 里，所以宽度必须克制：顶栏已经有六个菜单项和账号区，
   这个输入框再宽就会把整行挤到换行。 */
.navsearch { position: relative; }

/* 输入框 + GO 按钮拼成一个整体：按钮吃掉输入框右侧的圆角，
   两者看起来是一个控件，而不是「一个框旁边贴了个按钮」。 */
.ns-box { display: flex; align-items: stretch; }

.navsearch input {
  width: 186px;
  padding: 5px 10px;
  font: inherit;
  font-size: 12px;
  color: var(--text);
  background: var(--panel);
  border: 1px solid var(--line-2);
  border-right: 0;
  border-radius: 6px 0 0 6px;
  outline: none;
  transition: width .18s ease, border-color .15s ease;
}

.ns-go {
  flex: none;
  padding: 0 10px;
  font: inherit;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  color: var(--gold);
  background: var(--panel-2);
  border: 1px solid var(--line-2);
  border-radius: 0 6px 6px 0;
  cursor: pointer;
  transition: color .15s, background .15s, border-color .15s;
}

.ns-go:hover { color: #fff; background: rgba(217, 164, 65, .18); border-color: var(--gold); }
.ns-go:active { background: rgba(217, 164, 65, .3); }

.navsearch input::placeholder { color: var(--dim-2); }
.navsearch input:focus { border-color: var(--gold); width: 224px; }
.navsearch input::-webkit-search-cancel-button { -webkit-appearance: none; }

.navsearch-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  z-index: 70;
  min-width: 262px;
  padding: 4px;
  background: var(--panel-2);
  border: 1px solid var(--line-2);
  border-radius: 8px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, .55);
}

.ns-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 9px;
  border-radius: 5px;
  font-size: 12px;
  color: var(--text);
  text-decoration: none;
}

.ns-item.on,
.ns-item:hover { background: var(--panel-3); }

.ns-name { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ns-code { color: var(--dim-2); font-variant-numeric: tabular-nums; }

.ns-badge {
  flex: none;
  padding: 1px 5px;
  font-size: 10px;
  color: var(--dim);
  background: var(--panel-3);
  border-radius: 3px;
}

.ns-empty { padding: 12px 10px; font-size: 12px; color: var(--dim-2); }

/* 桌面端顶栏锁死一行
   以前 .top 是 flex-wrap: wrap：只要内容超出几个像素，整个 .meta 就会被折到第二行，
   顶栏高度从 50 直接变 92——「今日护盘」页比别的页多「实时已连接 + 立即刷新」两个控件，
   1440 下正好多出 5px，于是同一根顶栏在不同 URL 下长得不一样。
   现在让搜索框当唯一的可伸缩项：空间不够先瘦它，绝不换行。
   窄屏（≤900）仍走下面那条「搜索框独占一行」的规则，那个是刻意的。 */
@media (min-width: 901px) {
  .top { flex-wrap: nowrap; }
  .brand { flex: none; }
  .meta { flex-wrap: nowrap; min-width: 0; }
  .meta > *:not(.navsearch) { flex: none; }
  .navsearch { flex: 0 1 240px; min-width: 110px; }
  .ns-box { min-width: 0; }
  .navsearch input,
  .navsearch input:focus { width: 100%; min-width: 0; }
}

/* 中等宽度（901~1200）再收一档：间距和按钮内边距先让位，
   否则「今日护盘」页因为多两个控件会比别的页先撑不住。
   目标是所有页面在同一个宽度下永远同高，宁可一起变紧。 */
@media (min-width: 901px) and (max-width: 1200px) {
  .meta { gap: 8px; }
  .meta .btn { padding-left: 8px; padding-right: 8px; }
  .navsearch { flex: 0 1 180px; min-width: 84px; }
}

/* 再窄一点（901~1040）先让时钟让位：它是装饰，导航和账号操作才是要点的。
   和 ≤900 那条同一个取舍，只是分界更细，保证这一档所有页面表现一致。 */
@media (min-width: 901px) and (max-width: 1040px) {
  #clock { display: none; }
  /* 这一档实在放不下：搜索框改为独占一行（和 ≤900 一样），导航和账号留在下一行。
     关键是所有页面都走同一条规则——宁可一起变两行，也不要有的页面两行、有的页面一行。 */
  .meta { flex-wrap: wrap; }
  .navsearch { order: -1; flex: 1 1 100%; min-width: 0; }
  .navsearch input,
  .navsearch input:focus { width: auto; flex: 1 1 auto; min-width: 0; }
}

/* 表格里的股票名/代码：全站统一跳个股详情页。
   默认不带下划线，hover 才显出是可点的，避免整张表变成一片链接色。 */
a.clk { color: inherit; text-decoration: none; border-bottom: 1px dashed transparent; }
a.clk:hover { color: var(--gold); border-bottom-color: rgba(217, 164, 65, .45); }

@media (max-width: 900px) {
  .wrap { padding: 16px 14px 50px; }
  .metrics { grid-template-columns: repeat(2, 1fr); }
  .verdict-text h2 { font-size: 26px; }
  .stamp { text-align: left; }
  .meta { gap: 9px; flex-wrap: wrap; }
  .article { padding: 22px 18px 28px; }
  .art-head h1 { font-size: 20px; }
  .authwrap { padding: 16px; }
  .artnav { flex-direction: column; }
  .navsearch { order: -1; width: 100%; }
  /* 窄屏搜索框占满整行，GO 按钮跟在右边一起撑满，输入框自己 flex 吃掉剩余宽度 */
  .navsearch input,
  .navsearch input:focus { width: auto; flex: 1 1 auto; min-width: 0; }
  .ns-go { padding: 0 14px; font-size: 12px; }
  .navsearch-menu { left: 0; right: auto; min-width: 0; width: 100%; }
  /* 窄屏一行放不下「导航 + 时钟 + 账号 + 退出」，退出会单独掉到下一行。
     时钟是全站装饰，先让它让位，导航和账号操作就能留在同一行。 */
  #clock { display: none; }
}

@media (max-width: 640px) {
  /* 下拉菜单平时只是 opacity/visibility 隐藏，布局位置还在：
     手机宽度下它会从按钮往右撑出视口一百多像素，整页出现横向滚动条。
     手机上没有 hover，靠父级 :focus-within 打开就够。 */
  .navdrop-menu { display: none; }
  .navdrop:hover .navdrop-menu,
  .navdrop:focus-within .navdrop-menu { display: block; }
}

/* 采集停了但接口还通：绿灯会骗人，改成金色并写明落后多久 */
.live.warn::before { background: #d9a441; box-shadow: 0 0 0 3px rgba(217, 164, 65, .15); }
.live.warn { color: #d9a441; }
.stamp-late { color: #d9a441; }
/* 进度曲线样本不足 20 天时的提示：字号更小、颜色更淡，不抢主数字 */
.stamp-dim { color: var(--dim-3, #6b7788); font-size: 11px; }

/* ---------------- 份额流向与加仓指数 ---------------- */
.rangetabs { display: flex; gap: 6px; margin: 0 0 12px; }
.rangetabs button {
  background: var(--panel); border: 1px solid var(--line-2); color: var(--dim);
  font-size: 12px; padding: 5px 14px; border-radius: 999px; cursor: pointer;
  transition: color .15s, border-color .15s, background .15s;
}
.rangetabs button:hover { color: var(--text); border-color: var(--dim-2); }
.rangetabs button.on { color: var(--text); border-color: var(--dim-2); background: var(--panel-2); }

.sharegrid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 10px; }
.sharecard {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 14px 16px 8px; min-width: 0;
}
.sc-head { display: flex; flex-direction: column; gap: 3px; margin-bottom: 6px; }
.sc-head span { font-size: 13px; color: var(--text); }
.sc-head em { font-size: 11px; font-style: normal; color: var(--dim-2); }
.sharecard canvas { display: block; width: 100%; }

/* 图表悬停提示：挂在 body 上用 fixed 定位，不受卡片圆角与 overflow 影响 */
.sctip {
  position: fixed; z-index: 80; pointer-events: none; min-width: 150px;
  background: rgba(18,22,29,.97); border: 1px solid var(--line-2);
  border-radius: 8px; padding: 8px 10px;
  font-size: 12px; line-height: 1.7; color: var(--text);
  box-shadow: 0 10px 26px rgba(0,0,0,.5);
}
.sctip[hidden] { display: none; }
.sctip .sct-h {
  display: flex; align-items: baseline; gap: 7px;
  padding-bottom: 4px; margin-bottom: 4px; border-bottom: 1px solid var(--line);
}
.sctip .sct-h b { font-size: 12px; font-weight: 600; letter-spacing: .2px; }
.sctip .sct-h span { font-size: 11px; color: var(--dim-2); }
.sctip .sct-r { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; white-space: nowrap; }
.sctip .sct-r i { font-style: normal; color: var(--dim-2); }
.sctip .sct-r span { font-variant-numeric: tabular-nums; }
.sctip .up { color: var(--up); }
.sctip .down { color: var(--down); }
.sctip .dim { color: var(--dim); }

.sharefoot { font-size: 12px; color: var(--dim-2); line-height: 1.8; margin-bottom: 22px; }
.sharefoot strong { color: var(--dim); font-weight: 400; }
.sharefoot .up { color: var(--up); }
.sharefoot .down { color: var(--down); }

@media (max-width: 860px) {
  .sharegrid { grid-template-columns: 1fr; }
}

/* 窄屏标题与说明一行放不下，「加仓指数」会被折成「加仓指 / 数」，改成上下两行 */
@media (max-width: 640px) {
  .section-title { flex-direction: column; align-items: flex-start; gap: 3px; }
}

/* 复盘下拉多了「经济数据」之后到了 11 项 + 日历：矮屏（768 高）会把后几项顶出视口，
   给个上限并允许内部滚动。只影响超高的下拉，正常的 5~6 项看不出差别。
   没提 ?v=：这条纯防御，静态资源 1 小时缓存过期后自动生效，不值得为它改 32 个模板。 */
.navdrop-menu { max-height: min(72vh, 620px); overflow-y: auto; overscroll-behavior: contain; }