/* ==========================================================================
   连板涨停 —— 界面样式
   红色为主色调。纯手写 CSS，不引入任何前端构建链。

   设计约定
   · 品牌色用 Radix 风格的红阶（brand-*），语义色单独一套（success/warn/danger）
   · 正文区域保持近白底 + 深色字，保证长时间阅读不刺眼；
     红色用在「身份识别」上：侧栏、标题栏、主按钮、未读、重点标记
   · 间距走 4 的倍数；圆角 6/10/14；阴影分 3 级
   ========================================================================== */

:root {
  /* ---- 品牌红阶 ---- */
  --brand-50:  #fff8f8;
  --brand-100: #fff0f0;
  --brand-200: #ffdedf;
  --brand-300: #ffc6c8;
  --brand-400: #f89a9d;
  --brand-500: #e5484d;   /* 主色 */
  --brand-600: #d2373c;   /* hover */
  --brand-700: #b02429;   /* active */
  --brand-800: #8a1a1f;
  --brand-900: #5c1216;
  --brand-950: #2c0d10;

  /* ---- 侧栏（深红） ---- */
  --side-top:    #35141a;
  --side-bottom: #230c10;
  --side-text:   #efd9db;
  --side-muted:  #b08e91;
  --side-hover:  #ffffff14;
  --side-active: var(--brand-600);
  --side-line:   #ffffff1a;

  /* ---- 中性色 ---- */
  --bg:        #ffffff;
  --bg-soft:   #fafafa;
  --bg-sunken: #f4f4f5;
  --border:    #e8e6e7;
  --border-strong: #d8d4d5;
  --text:      #1a1618;
  --text-soft: #494246;
  --text-muted:#857d81;
  /* 链接与空收藏星：深浅两套主题下都要够对比度 */
  --link:        var(--brand-700);
  --link-hover:  var(--brand-800);
  --star-empty:  #cfc9ca;
  --scroll-thumb: #d9d4d5;
  --scroll-thumb-hover: #c4bdbe;
  --border-hover: #c9c2c3;
  --placeholder:  #b3acae;

  /* ---- 语义色 ---- */
  /* 固定规则（2026-10-02 用户要求）：前端不出现绿色元素。
     “成功 / 在线 / 已启用”等正向状态一律走品牌红家族，避免页面里冒出绿色。 */
  --ok:        var(--brand-600);
  --ok-text:   var(--brand-800);   /* 正向状态文字：白底上达到 AA */
  --ok-bg:     var(--brand-100);
  --ok-border: var(--brand-300);
  /* 重要快讯文字：同样走品牌红，靠“红 + 粗”和普通条目区分 */
  --important-text: var(--brand-700);
  /* 自动补拉刚插入卡片的短暂底色 */
  --flash-bg:  var(--brand-100);
  --warn:      #a26a00;
  --warn-bg:   #fff9db;
  --warn-border:#ffe8a3;

  /* ---- 尺寸与层次 ---- */
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-full: 999px;

  --sh-1: 0 1px 2px #0000000a;
  --sh-2: 0 2px 8px #0000000f, 0 1px 2px #0000000a;
  --sh-3: 0 8px 28px #0000001a, 0 2px 6px #0000000f;
  --sh-brand: 0 2px 8px #e5484d33;

  --sidebar-w: 252px;
  --sidebar-w-collapsed: 64px;
}

* { box-sizing: border-box; }

html, body {
  margin: 0; padding: 0; height: 100%;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei",
               "PingFang SC", "Hiragino Sans GB", Roboto, sans-serif;
  font-size: 14px; line-height: 1.65; color: var(--text);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

a { color: var(--link); text-decoration: none; }
a:hover { color: var(--link-hover); text-decoration: underline; text-underline-offset: 2px; }

h1, h2, h3 { letter-spacing: -.01em; }

::selection { background: var(--brand-200); color: var(--brand-900); }
/* HTML 的 hidden 属性靠 UA 样式表里的 display:none 生效，作者样式只要写了
   display 就会把它盖掉（踩过：设置页那条声音提醒明明 hidden 却一直挂在页面上）。
   这里统一兜住，免得以后每个组件都要自己小心一次。 */
[hidden] { display: none !important; }

/* 键盘 Tab 时必须看得见焦点落在哪里 */
:focus-visible {
  outline: 2px solid var(--brand-500);
  outline-offset: 2px;
  border-radius: var(--r-sm);
}

/* 滚动条：细一点，跟整体风格一致 */
* { scrollbar-width: thin; scrollbar-color: var(--scroll-thumb) transparent; }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-thumb {
  background: var(--scroll-thumb); border-radius: var(--r-full); border: 3px solid transparent;
  background-clip: content-box;
}
*::-webkit-scrollbar-thumb:hover { background: var(--scroll-thumb-hover); background-clip: content-box; }
*::-webkit-scrollbar-track { background: transparent; }

.layout { display: flex; height: 100vh; overflow: hidden; }

/* ==========================================================================
   侧栏
   ========================================================================== */

.sidebar {
  width: var(--sidebar-w); flex: 0 0 var(--sidebar-w);
  background: linear-gradient(180deg, var(--side-top) 0%, var(--side-bottom) 100%);
  color: var(--side-text);
  display: flex; flex-direction: column; overflow: hidden;
  border-right: 1px solid var(--side-line);
}

.sidebar-head {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 16px 16px 14px; border-bottom: 1px solid var(--side-line);
}
.brand { display: flex; align-items: center; gap: 9px; font-weight: 700; color: var(--side-strong); font-size: 15px; }
.brand-mark {
  width: 26px; height: 26px; flex: 0 0 26px; display: block;
  filter: drop-shadow(0 2px 5px #e5484d45);
}
.brand-mark svg, .brand-mark img { width: 100%; height: 100%; display: block; }
.head-link {
  color: var(--side-muted); font-size: 15px; width: 28px; height: 28px;
  display: flex; align-items: center; justify-content: center; border-radius: var(--r-sm);
}
.head-link:hover { color: var(--side-strong); background: var(--side-hover); text-decoration: none; }

.nav { padding: 10px 10px 0; }
.nav-item {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 10px; border-radius: var(--r-sm);
  color: var(--side-text); font-size: 13.5px; font-weight: 500;
  transition: background .12s ease;
}
.nav-item:hover { background: var(--side-hover); text-decoration: none; color: var(--side-strong); }
.nav-item.is-active { background: var(--side-active); color: var(--qt-text-on-accent); box-shadow: var(--sh-brand); }

/* 「资讯研报」的二级入口：缩进 + 更小字号，不改变一级入口的观感 */
.nav-sub {
  display: flex; align-items: center; gap: 6px;
  padding: 6px 10px 6px 24px; border-radius: var(--r-sm);
  color: var(--side-muted); font-size: 13px;
  transition: background .12s ease;
}
.nav-sub::before { content: "›"; color: var(--side-muted); }
.nav-sub:hover { background: var(--side-hover); color: var(--side-strong); text-decoration: none; }
.nav-sub.is-active { background: var(--side-hover); color: var(--side-strong); }

.channel-block { flex: 1; overflow-y: auto; padding: 16px 10px; }
.block-title {
  display: flex; align-items: center; justify-content: space-between;
  font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em;
  color: var(--side-muted); padding: 0 10px 8px;
}
.block-link {
  color: var(--side-muted); font-size: 13px; line-height: 1;
  padding: 2px 4px; border-radius: var(--r-sm);
}
.block-link:hover { color: var(--side-strong); background: var(--side-hover); text-decoration: none; }
.channel-item {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 8px 10px; border-radius: var(--r-sm);
  color: var(--side-text); font-size: 14px;
  transition: background .12s ease, color .12s ease;
}
.channel-item:hover { background: var(--side-hover); text-decoration: none; color: var(--side-strong); }
.channel-item.is-active {
  background: var(--side-active); color: var(--qt-text-on-accent); font-weight: 600; box-shadow: var(--sh-brand);
}
.channel-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.channel-item .lock { opacity: .55; font-size: 11px; }


.badge {
  background: var(--side-active); color: var(--qt-text-on-accent); font-size: 11px; font-weight: 700;
  border-radius: var(--r-full); padding: 1px 7px; min-width: 20px; text-align: center;
  box-shadow: var(--sh-brand); line-height: 1.5;
}
.channel-item.is-active .badge { background: var(--qt-text-on-accent); color: var(--side-active); box-shadow: none; }

/* ---- 频道分组（会员自己设置：特别关注 / 置顶 / 折叠 / 普通） ---- */
.chan-group { margin-bottom: 4px; }
.group-head {
  display: flex; align-items: center; gap: 6px; width: 100%;
  background: none; border: 0; cursor: pointer; text-align: left;
  font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em;
  color: var(--side-muted); padding: 6px 10px; border-radius: var(--r-sm);
  transition: background .12s ease, color .12s ease;
}
.group-head:hover { color: var(--side-strong); background: var(--side-hover); }
.group-head.is-static { cursor: default; }
.group-head.is-static:hover { color: var(--side-muted); background: none; }
.group-name { flex: 1; }
.group-caret { font-size: 10px; transition: transform .12s ease; }
.chan-group:not(.is-folded) .group-caret { transform: rotate(90deg); }
.group-badge { text-transform: none; letter-spacing: 0; }
.chan-group.is-folded .group-body { display: none; }
/* 空频道提示：原来是整片留白，分不清「没消息」和「没加载出来」 */
.empty-hint { padding: 48px 20px; text-align: center; }

/* ---- 频道行：链接 + 右侧「⋮」设置入口 ---- */
.channel-row { display: flex; align-items: center; }
.channel-row .channel-item { flex: 1; min-width: 0; }
.chan-more {
  background: none; border: 0; cursor: pointer; color: var(--side-muted);
  font-size: 15px; line-height: 1; padding: 4px 6px; border-radius: var(--r-sm);
  /* 常驻但压暗：只在 hover 时才出现的话，用户根本找不到这个入口 */
  opacity: .35; transition: opacity .12s ease, background .12s ease, color .12s ease;
}
.channel-row:hover .chan-more,
.channel-row.is-active .chan-more,
.chan-more[aria-expanded="true"] { opacity: 1; }
.chan-more:hover { color: var(--side-strong); background: var(--side-hover); }

/* 特别关注：左侧红竖条 + 加粗。
   不整行涂色——那会和「正在看」的选中态混在一起，分不清哪个是重点、哪个是当前。 */
.channel-item.is-special { font-weight: 600; box-shadow: inset 3px 0 0 var(--brand-500); }
.channel-item.is-special.is-active {
  box-shadow: inset 3px 0 0 var(--brand-300), var(--sh-brand);
}

/* 连接状态文字：绿色在白底上要够深才达标 */
#conn-state { color: var(--ok-text); }

.sidebar-foot {
  border-top: 1px solid var(--side-line); padding: 12px 16px 16px;
  background: var(--side-hover);
}
.me { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.me-name { color: var(--side-strong); font-weight: 600; font-size: 13px; }
.me-expiry {
  font-size: 11px; color: var(--side-muted); background: var(--side-hover);
  padding: 1px 7px; border-radius: var(--r-full);
}
.me-expiry.is-urgent { background: var(--side-active); color: var(--qt-text-on-accent); }
.foot-links { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 12px; font-size: 12px; }
.foot-links a { color: var(--side-muted); }
.foot-links a:hover { color: var(--side-strong); text-decoration: none; }
.inline { display: inline; margin: 0; }
.link-btn {
  background: none; border: none; padding: 0; color: var(--side-muted);
  font-size: 12px; cursor: pointer; font-family: inherit;
}
.link-btn:hover { color: var(--side-strong); }

/* ---- 频道设置弹出菜单 ----
   挂在 <body> 上用 fixed 定位。不能挂进 .channel-block：那里是 overflow:auto，
   菜单会被裁掉半截（尤其靠下的频道）。 */
.chan-menu {
  position: fixed; z-index: 80; min-width: 184px; max-width: 250px;
  background: var(--bg); color: var(--text);
  border: 1px solid var(--border); border-radius: var(--r-md);
  box-shadow: var(--sh-3); padding: 6px;
}
.chan-menu-title {
  font-size: 12px; font-weight: 700; padding: 4px 8px 8px;
  border-bottom: 1px solid var(--border); margin-bottom: 6px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.chan-menu-label { font-size: 11px; color: var(--text-muted); padding: 7px 8px 2px; }
.chan-menu-item {
  display: flex; align-items: center; gap: 8px; cursor: pointer;
  padding: 5px 8px; border-radius: var(--r-sm); font-size: 13px;
}
.chan-menu-item:hover { background: var(--bg-sunken); }
.chan-menu-item input { margin: 0; flex: 0 0 auto; }
.chan-menu-foot {
  border-top: 1px solid var(--border); margin-top: 6px; padding: 7px 8px 2px; font-size: 12px;
}

/* 设置页里的行内勾选 */
.check-inline { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }

/* 主题切换开关：侧栏里一套、登录页浮动一套 */
.theme-toggle {
  width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center;
  background: none; border: 1px solid var(--side-line); border-radius: var(--r-sm);
  color: var(--side-muted); font-size: 13px; line-height: 1; font-family: inherit;
  cursor: pointer; transition: color .12s ease, background .12s ease;
}
.theme-toggle:hover { color: var(--side-strong); background: var(--side-hover); }

/* 登录/注册页没有侧栏，用中性色的浮动开关 */
.theme-toggle--floating {
  position: fixed; top: 18px; right: 20px; z-index: 20;
  width: 30px; height: 30px; font-size: 14px;
  border-color: var(--border-strong); color: var(--text-muted);
  background: var(--bg); box-shadow: var(--sh-1);
}
.theme-toggle--floating:hover { color: var(--brand-700); background: var(--brand-50); }

/* ==========================================================================
   主区
   ========================================================================== */

.main {
  flex: 1; min-width: 0; display: flex; flex-direction: column; overflow: hidden;
  background: var(--bg); position: relative;   /* 「回到底部」按钮的定位基准 */
}
/* 非聊天页正文视口：滚动容器自身限宽并居中；聊天页不套本类。 */
.content-viewport {
  width: 100%;
  max-width: var(--content-max, 1440px);
  margin-left: auto;
  margin-right: auto;
}

/* 顶栏按基线固定 64px 高、底部用主题 header 底色（不再是硬编码白/深） */
.channel-header {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  min-height: 64px; padding: 12px 24px; background: var(--qt-header-bg);
  border-bottom: 1px solid var(--border);
  box-shadow: var(--sh-1); position: relative; z-index: 2;
}
.channel-header::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
  background: linear-gradient(90deg, var(--brand-500), var(--brand-300) 45%, transparent 85%);
  opacity: .5;
}
.channel-title { font-size: 16px; font-weight: 700; color: var(--qt-text-strong); }
.channel-title::before {
  content: "#"; color: var(--brand-400); font-weight: 700; margin-right: 4px;
}
/* 紧凑区（计数、连接状态）按基线 13px */
.channel-meta { color: var(--text-muted); font-size: 13px; }
.spacer { flex: 1; }

#conn-state { font-weight: 600; font-size: 13px; }

/* ---------------- 消息流 ---------------- */

/* 刻意不用 scroll-behavior: smooth：图片异步加载会把内容撑高，
   平滑滚动会与「保持在底部」的重定位互相打架。 */
.messages { flex: 1; overflow-y: auto; padding: 12px 0 96px; }

.post {
  display: flex; gap: 12px; padding: 12px 24px;   /* 基线间距刻度 12/24 */
  border-left: 3px solid transparent;
  transition: background .12s ease, border-color .12s ease;
}
/* 行 hover 走主题 surface-hover；左侧竖条只做“我在哪一行”的定位，跟随主题强调色 */
.post:hover { background: var(--qt-surface-hover); border-left-color: var(--brand-300); }

.avatar {
  width: 38px; height: 38px; flex: 0 0 38px; border-radius: var(--r-full);
  background: linear-gradient(140deg, var(--brand-100), var(--brand-200));
  color: var(--brand-800); font-weight: 700; font-size: 13px; letter-spacing: .02em;
  display: flex; align-items: center; justify-content: center; overflow: hidden;
  box-shadow: inset 0 0 0 1px var(--qt-border);
}
/* 没有头像的发送者用文字缩写。颜色按名字哈希固定，整体仍在红/暖色系内，
   既能区分不同发送者，又不会破坏「红色为主」的统一感。 */
.avatar[data-tone="0"] { background: linear-gradient(140deg,#fff1f1,#ffdcdd); color:#8a1a1f; }
.avatar[data-tone="1"] { background: linear-gradient(140deg,#ffe7e7,#ffc4c6); color:#7d161a; }
.avatar[data-tone="2"] { background: linear-gradient(140deg,#fdeae4,#f8cec3); color:#8a3d1f; }
.avatar[data-tone="3"] { background: linear-gradient(140deg,#f8e8ee,#eec8d5); color:#7d1f3c; }
.avatar[data-tone="4"] { background: linear-gradient(140deg,#f4ebe6,#e6d4c8); color:#7a4a2a; }
.avatar[data-tone="5"] { background: linear-gradient(140deg,#efeae9,#ddd2d0); color:#4c3b39; }
.avatar img { width: 100%; height: 100%; object-fit: cover; }

.post-main { min-width: 0; flex: 1; }
.post-head { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.post-author { font-weight: 600; color: var(--qt-text-strong); font-size: 14px; }
/* 机器人标签出现在绝大多数消息上，刻意弱化，避免抢走品牌红重点 */
.bot-tag {
  font-size: 11px; font-weight: 600; letter-spacing: .02em;
  color: var(--text-muted); background: var(--bg-sunken);
  border: 1px solid var(--border);
  border-radius: var(--r-sm); padding: 1px 6px; line-height: 1.5;
}
/* 时间/已编辑属于紧凑区，按基线 13px / 12px */
.post-time { color: var(--text-muted); font-size: 13px; font-variant-numeric: tabular-nums; }
.post-edited { color: var(--text-muted); font-size: 12px; font-style: italic; }
/* 正文按基线走 16px/1.6：交易时段长时间盯盘要够清楚，又不靠放大空白充数 */
.post-body { margin-top: 4px; color: var(--text); font-size: 16px; line-height: 1.6; overflow-wrap: anywhere; }

/* 消息正文里的 Markdown 元素 */
.post-body p { margin: 0 0 8px; }
.post-body p:last-child { margin-bottom: 0; }
.post-body strong { color: var(--text); font-weight: 700; }
/* 正文里的图片多为外链长图，必须限高，否则一条消息就占满整屏。
   限高后点击可放大查看原图（见 app.js 的 lightbox）。 */
.post-body img {
  max-width: min(100%, 460px); max-height: 420px; width: auto; height: auto;
  object-fit: contain; border-radius: var(--r-md); vertical-align: top;
  border: 1px solid var(--border); box-shadow: var(--sh-1);
  cursor: zoom-in; transition: box-shadow .15s ease;
}
.post-body img:hover { box-shadow: var(--sh-2); }
.post-body h1, .post-body h2, .post-body h3 {
  margin: 16px 0 8px; font-weight: 700; color: var(--qt-text-strong); line-height: 1.4;
}
.post-body h1 { font-size: 20px; }
.post-body h2 { font-size: 18px; }
.post-body h3 { font-size: 16px; }
.post-body ul, .post-body ol { margin: 8px 0; padding-left: 24px; }
.post-body li { margin: 3px 0; }
.post-body pre {
  background: var(--bg-sunken); border: 1px solid var(--border);
  border-left: 3px solid var(--brand-300);
  border-radius: var(--r-sm); padding: 11px 13px; margin: 9px 0;
  overflow-x: auto; font-size: 13px; line-height: 1.6;
  font-family: "Cascadia Mono", Consolas, "Courier New", monospace;
}
.post-body code {
  background: var(--bg-sunken); border: 1px solid var(--border);
  padding: 1px 5px; border-radius: var(--r-sm); font-size: 13px;
  font-family: "Cascadia Mono", Consolas, "Courier New", monospace;
}
.post-body pre code { background: none; border: none; padding: 0; font-size: inherit; }
.post-body blockquote {
  margin: 9px 0; padding: 2px 0 2px 13px;
  border-left: 3px solid var(--brand-300); color: var(--text-muted);
}
.post-body a { color: var(--link); text-decoration: underline; text-underline-offset: 2px; }
.post-body a:hover { color: var(--link-hover); }
/* 宽表格由 .tbl-wrap 自己横向滚（见 app.js），不让整页出现横向溢出 */
.tbl-wrap { max-width: 100%; overflow-x: auto; margin: 8px 0; }
.post-body table { border-collapse: collapse; margin: 8px 0; font-size: 13px; }
.tbl-wrap table { margin: 0; }
.post-body th, .post-body td { border: 1px solid var(--border); padding: 6px 10px; }
.post-body th { background: var(--bg-soft); font-weight: 600; }
.post-body hr { border: none; border-top: 1px solid var(--border); margin: 14px 0; }

.post.deleted .post-body { color: var(--text-muted); font-style: italic; }
.post.flash { animation: flash 1.8s ease-out; }
@keyframes flash {
  0%   { background: var(--brand-100); border-left-color: var(--brand-500); }
  100% { background: transparent; border-left-color: transparent; }
}

/* 消息操作（复制 / 收藏）：图标按钮，28px 点击区，hover 才显形；
   触屏没有 hover，所以窄屏/触屏常显（见文件末尾的 (hover:none) 规则）。 */
.post-actions { display: inline-flex; align-items: center; gap: 2px; margin-left: 2px; }
.post-actions .fav-btn, .post-actions .copy-btn {
  background: none; border: none; cursor: pointer; color: var(--qt-text-muted);
  font-size: 15px; line-height: 1; font-family: inherit;
  min-width: 28px; height: 28px; padding: 0 6px; border-radius: var(--r-sm);
  display: inline-flex; align-items: center; justify-content: center;
  transition: color .12s ease, background .12s ease;
}
.post-actions .fav-btn:hover, .post-actions .copy-btn:hover {
  color: var(--qt-primary); background: var(--qt-surface-hover);
}
.post-actions .fav-btn.is-on { color: var(--qt-primary); }
.post-actions .copy-btn.is-done { color: var(--ok); }

/* ---------------- 附件 ---------------- */

.attachments { margin-top: 9px; display: flex; flex-direction: column; gap: 9px; }
.att-image { max-width: 440px; }
.att-image img {
  max-width: 100%; max-height: 440px; border-radius: var(--r-md);
  border: 1px solid var(--border); box-shadow: var(--sh-2);
  cursor: zoom-in; display: block; transition: transform .15s ease;
}
.att-image img:hover { transform: translateY(-1px); }
.att-video video {
  max-width: 500px; border-radius: var(--r-md);
  border: 1px solid var(--border); box-shadow: var(--sh-2);
}
.att-audio audio {
  width: 300px; max-width: 100%; height: 38px;
  border-radius: var(--r-md); border: 1px solid var(--border);
  background: var(--bg-soft); display: block;
}
.att-file {
  display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px;
  border: 1px solid var(--border); border-radius: var(--r-md); background: var(--bg-soft);
  color: var(--text); font-size: 13px; max-width: 480px;
  transition: border-color .12s ease, background .12s ease;
}
.att-file:hover { text-decoration: none; border-color: var(--brand-300); background: var(--brand-50); }
.att-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.att-missing {
  font-size: 13px; color: var(--text-muted);
  border: 1px dashed var(--border-strong); border-radius: var(--r-md);
  padding: 8px 12px; display: inline-block; background: var(--bg-soft);
}

.reactions { margin-top: 7px; display: flex; gap: 6px; flex-wrap: wrap; }
.reaction {
  font-size: 12px; background: var(--brand-50); border: 1px solid var(--brand-200);
  border-radius: var(--r-full); padding: 2px 9px; color: var(--brand-800);
}

/* ---------------- 回到底部 ---------------- */

/* 向上翻历史、或新消息到达时，用一个浮动按钮回到最新，比手动滚到底友好得多。 */
.jump-bottom {
  position: absolute; right: 24px; bottom: 20px; z-index: 5;
  display: none; align-items: center; gap: 6px;
  height: 34px; padding: 0 14px; border-radius: var(--r-full);
  border: 1px solid var(--border-strong);
  background: var(--qt-surface); color: var(--qt-text);
  font-size: 13px; font-weight: 600; font-family: inherit;
  cursor: pointer; box-shadow: var(--sh-2);
}
.jump-bottom::after { content: "↓"; font-size: 13px; }
.jump-bottom:hover { background: var(--qt-surface-hover); border-color: var(--qt-primary); }
.jump-bottom.is-visible { display: inline-flex; }
.jump-bottom.has-new {
  background: var(--qt-primary); color: var(--qt-text-on-accent);
  border-color: transparent; box-shadow: var(--sh-2);
}
.jump-bottom.has-new:hover { filter: brightness(1.06); background: var(--qt-primary); border-color: transparent; }

/* ---------------- 图片放大 ---------------- */

.lightbox {
  position: fixed; inset: 0; background: #1a0d0fe6; backdrop-filter: blur(3px);
  display: none; align-items: center; justify-content: center; z-index: 100; padding: 24px;
  overflow: auto;
}
.lightbox.is-open { display: flex; }
/* 切到原始尺寸后，长截图会超出视口：改为顶部对齐并允许滚动阅读 */
.lightbox.is-actual { align-items: flex-start; }
/* 原始尺寸模式必须解除 max-width/max-height，否则长截图仍会被压回容器高度、
   用户看到的就是「点了没变化」。解除后由容器 overflow:auto 提供滚动阅读。 */
.lightbox img.is-actual { max-width: none; max-height: none; margin: auto; cursor: zoom-out; }
.lightbox img { cursor: zoom-in; }
/* 实际显示尺寸由 app.js 按原图比例算好（小图最多放大 3 倍），
   这里的 max-* 只是兜底，防止极端尺寸溢出。 */
.lightbox img { max-width: 100%; max-height: 100%; border-radius: var(--r-md); box-shadow: var(--sh-3); }
.lightbox .close {
  position: absolute; top: 18px; right: 26px; color: #fff; font-size: 30px; line-height: 1;
  cursor: pointer; background: none; border: none; font-family: inherit; opacity: .85;
}
.lightbox .close:hover { opacity: 1; }

/* ---------------- 提示条 ---------------- */

.banner {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 10px 22px; font-size: 13px; border-bottom: 1px solid transparent;
}
.banner::before { font-size: 14px; }
/* 提示条目前只有两种用途：会员临期提醒与已到期提醒 */
.banner-warn {
  background: var(--warn-bg); color: var(--warn); border-bottom-color: var(--warn-border);
}
.banner-warn::before { content: "⚠"; }
.banner-error {
  background: var(--brand-100); color: var(--brand-800); border-bottom-color: var(--brand-300);
}
.banner-error::before { content: "!"; font-weight: 800; }
.banner strong { font-weight: 700; }
.banner-body { opacity: .85; }

/* ---------------- 加载骨架屏 ----------------

   服务端已把外壳渲染出来，但消息由 JS 构建。这段骨架就补在
   「HTML 已绘制、消息还没画出来」之间，避免一片空白。 */

.skeleton { padding: 8px 22px; }
.skeleton-row { display: flex; gap: 13px; padding: 9px 0; }
.sk-avatar {
  width: 38px; height: 38px; flex: 0 0 38px; border-radius: var(--r-full);
  background: var(--bg-sunken);
}
.sk-lines { flex: 1; min-width: 0; padding-top: 4px; }
.sk-line {
  height: 11px; border-radius: var(--r-full); margin-bottom: 9px;
  background: var(--bg-sunken);
}
.sk-line.w-30 { width: 30%; }
.sk-line.w-88 { width: 88%; }
.sk-line.w-72 { width: 72%; }
.sk-line.w-54 { width: 54%; }
.skeleton .sk-avatar,
.skeleton .sk-line {
  background-image: linear-gradient(90deg, var(--bg-sunken) 0%, var(--bg-soft) 50%, var(--bg-sunken) 100%);
  background-size: 200% 100%;
  animation: cf-shimmer 1.4s ease-in-out infinite;
}
@keyframes cf-shimmer {
  0%   { background-position: 140% 0; }
  100% { background-position: -40% 0; }
}
@media (prefers-reduced-motion: reduce) {
  .skeleton .sk-avatar, .skeleton .sk-line { animation: none; }
  .ct-item.is-flash { animation: none; }
}

/* ---------------- 超长消息折叠 ----------------

   一条消息过长时会占满整屏，把其它内容挤下去。 */
.post-body { position: relative; }
.post-body.is-collapsed {
  max-height: min(420px, 58vh);   /* 约视口六成，留出上下文 */
  overflow: hidden;
}
.post-body.is-collapsed::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: 0; height: 76px;
  background: linear-gradient(180deg, transparent, var(--bg));
  pointer-events: none;
}
.post:hover .post-body.is-collapsed::after {
  background: linear-gradient(180deg, transparent, var(--qt-surface-hover));
}
.post-expand {
  margin-top: 6px; padding: 4px 12px;
  background: var(--bg-soft); border: 1px solid var(--border);
  border-radius: var(--r-full);
  color: var(--brand-800); font-size: 12.5px; font-weight: 600; font-family: inherit;
  cursor: pointer;
}
.post-expand:hover { background: var(--brand-50); border-color: var(--brand-300); }

/* ---------------- 相对时间 ---------------- */

.post-time { font-variant-numeric: tabular-nums; }
.post-time.is-recent { color: var(--brand-700); font-weight: 600; }

/* ---------------- 日期分隔与加载 ---------------- */

.day-sep {
  display: flex; align-items: center; gap: 14px; margin: 18px 22px 10px;
  color: var(--text-muted); font-size: 12px; font-weight: 600;
}
.day-sep::before, .day-sep::after { content: ""; flex: 1; height: 1px; background: var(--border); }
.day-sep::before { max-width: 40px; }

.load-more { text-align: center; padding: 16px; }

/* 空态（基线 §6.2）：图标 + 说明 + 一个可执行动作；三种容器同一套内边距，切换不跳版 */
.empty-state { margin: auto; text-align: center; color: var(--text-muted); padding: 48px 24px; }
.empty-state .empty-icon {
  width: 44px; height: 44px; margin: 0 auto 12px; border-radius: var(--r-full);
  display: flex; align-items: center; justify-content: center;
  background: var(--qt-primary-soft); color: var(--qt-primary); font-size: 20px; line-height: 1;
}
.empty-state h2 { color: var(--qt-text-strong); font-size: 16px; font-weight: 600; margin: 0 0 6px; }
.empty-state p { margin: 0 0 16px; font-size: 13px; }
.empty-state .btn { margin: 0 auto; }

/* ==========================================================================
   表单与按钮
   ========================================================================== */

/* 登录 / 注册页：淡红渐变背景 + 居中白卡 */
.auth-wrap {
  flex: 1; display: flex; align-items: center; justify-content: center;
  padding: 40px 20px; overflow-y: auto;
  background:
    radial-gradient(900px 420px at 50% -8%, var(--brand-100) 0%, transparent 70%),
    linear-gradient(180deg, var(--brand-50) 0%, var(--bg) 55%);
}
.auth-card {
  width: 100%; max-width: 400px; background: var(--bg);
  border: 1px solid var(--border); border-radius: var(--r-lg);
  box-shadow: var(--sh-3); padding: 32px 32px 28px;
}
.auth-brand {
  display: flex; align-items: center; gap: 10px; margin-bottom: 22px;
  padding-bottom: 18px; border-bottom: 1px solid var(--border);
}
.auth-brand .brand-mark { width: 32px; height: 32px; flex: 0 0 32px; font-size: 15px; }
.auth-brand-name { font-weight: 800; font-size: 16px; letter-spacing: -.01em; }

.form-narrow { max-width: 400px; margin: 60px auto; padding: 0 20px; }
.form-title { font-size: 23px; font-weight: 800; margin: 0 0 6px; letter-spacing: -.02em; }
.form-sub { color: var(--text-muted); margin: 0 0 24px; font-size: 13px; }

.field { margin-bottom: 15px; }
.field label {
  display: block; font-size: 12px; font-weight: 600; margin-bottom: 6px;
  color: var(--text-soft); letter-spacing: .01em;
}
.field input[type=text], .field input[type=password], .field input[type=date],
.field input[type=number], .field select, .field textarea {
  width: 100%; padding: 10px 12px; border: 1px solid var(--border-strong);
  border-radius: var(--r-sm); font-size: 14px; font-family: inherit;
  background: var(--bg); color: var(--text); transition: border-color .12s ease, box-shadow .12s ease;
}
.field textarea { min-height: 96px; resize: vertical; line-height: 1.6; }
.field input:hover, .field select:hover, .field textarea:hover { border-color: var(--border-hover); }
.field input:focus, .field select:focus, .field textarea:focus {
  outline: none; border-color: var(--brand-500);
  box-shadow: 0 0 0 3px var(--brand-100);
}
.field input::placeholder, .field textarea::placeholder { color: var(--placeholder); }

.checkbox-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 7px; }
.checkbox-grid label {
  display: flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 400;
  color: var(--text-soft); padding: 5px 8px; border-radius: var(--r-sm);
  transition: background .12s ease;
}
.checkbox-grid label:hover { background: var(--brand-50); }
.checkbox-grid input[type=checkbox] { accent-color: var(--brand-500); width: 15px; height: 15px; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 10px 18px; border-radius: var(--r-sm); border: 1px solid transparent;
  /* 用 600->700 而非 500->600：白字对比度从 3.9:1 提到 4.8~6.7:1，达到 AA */
  background: linear-gradient(180deg, var(--brand-600), var(--brand-700));
  color: #fff; font-size: 14px; font-weight: 600; font-family: inherit;
  cursor: pointer; box-shadow: var(--sh-brand);
  transition: filter .12s ease, transform .06s ease, box-shadow .12s ease;
}
.btn:hover { filter: brightness(1.06); text-decoration: none; color: #fff; }
.btn:active { transform: translateY(1px); box-shadow: none; }
.btn:disabled { opacity: .55; cursor: not-allowed; box-shadow: none; }
.btn-block { width: 100%; }
.btn-secondary {
  background: var(--bg); color: var(--text-soft); border-color: var(--border-strong); box-shadow: var(--sh-1);
}
.btn-secondary:hover { background: var(--brand-50); border-color: var(--brand-300); color: var(--brand-800); filter: none; }
.btn-small { padding: 5px 11px; font-size: 12.5px; }
.btn-danger { background: linear-gradient(180deg, #a01e23, #7d161a); box-shadow: none; }
.btn-danger:hover { filter: brightness(1.12); }

.msg-error, .msg-ok {
  display: flex; align-items: flex-start; gap: 8px;
  border-radius: var(--r-sm); padding: 10px 13px; margin-bottom: 16px; font-size: 13px;
}
.msg-error { background: var(--brand-100); color: var(--brand-800); border: 1px solid var(--brand-300); }
.msg-error::before { content: "✕"; font-weight: 700; }
.msg-note {
  background: var(--bg-soft); border: 1px solid var(--border);
  border-radius: var(--r-sm); padding: 10px 13px; margin-bottom: 16px;
  font-size: 12.5px; line-height: 1.7; color: var(--text-muted);
}
.msg-note strong { color: var(--brand-700); }
.msg-ok { background: var(--ok-bg); color: var(--ok-text); border: 1px solid var(--ok-border); }
.msg-ok::before { content: "✓"; font-weight: 700; }

/* ==========================================================================
   管理后台
   ========================================================================== */

.admin-nav {
  display: flex; gap: 5px; flex-wrap: wrap; padding: 10px 22px;
  border-bottom: 1px solid var(--border); background: var(--bg-soft);
}
.admin-nav a {
  padding: 6px 13px; border-radius: var(--r-full); font-size: 13px; font-weight: 500;
  color: var(--text-soft); border: 1px solid transparent;
  transition: background .12s ease, color .12s ease;
}
.admin-nav a:hover { background: var(--bg); border-color: var(--border); text-decoration: none; }
.admin-nav a.is-active {
  background: linear-gradient(180deg, var(--brand-500), var(--brand-600));
  color: #fff; box-shadow: var(--sh-brand);
}

.admin-body { flex: 1; overflow-y: auto; padding: 24px 22px 48px; }
.admin-body h1 { font-size: 20px; margin: 0 0 6px; font-weight: 800; letter-spacing: -.02em; }
.admin-body h2 {
  font-size: 15px; margin: 28px 0 12px; font-weight: 700;
  display: flex; align-items: center; gap: 8px;
}
.admin-body h2::before {
  content: ""; width: 3px; height: 15px; border-radius: 2px;
  background: var(--brand-500); flex: 0 0 3px;
}
.admin-body h2:first-child { margin-top: 0; }

.cards {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(158px, 1fr));
  gap: 13px; margin: 14px 0 6px;
}
.card {
  position: relative; overflow: hidden;
  border: 1px solid var(--border); border-radius: var(--r-md); padding: 14px 16px;
  background: linear-gradient(180deg, var(--bg), var(--brand-50));
  box-shadow: var(--sh-1);
}
.card::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 3px;
  background: linear-gradient(90deg, var(--brand-500), var(--brand-300));
}
.card .k { font-size: 12px; color: var(--text-muted); font-weight: 500; }
.card .v {
  font-size: 24px; font-weight: 800; margin-top: 3px; color: var(--brand-700);
  letter-spacing: -.02em; font-variant-numeric: tabular-nums;
}

table.grid {
  width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13px;
  border: 1px solid var(--border); border-radius: var(--r-md); overflow: hidden;
  background: var(--bg); box-shadow: var(--sh-1);
}
table.grid th, table.grid td {
  border-bottom: 1px solid var(--border); padding: 10px 12px;
  text-align: left; vertical-align: top;
}
table.grid th {
  background: var(--bg-soft); font-size: 12px; font-weight: 700;
  color: var(--text-soft); white-space: nowrap; letter-spacing: .02em;
}
table.grid tbody tr:last-child td { border-bottom: none; }
table.grid tbody tr:hover td { background: var(--brand-50); }

.tag {
  display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: .02em;
  padding: 2px 8px; border-radius: var(--r-full); border: 1px solid transparent;
  line-height: 1.6; vertical-align: middle;
}
.tag-pending { background: var(--warn-bg); color: var(--warn); border-color: var(--warn-border); }
.tag-active  { background: var(--ok-bg); color: var(--ok-text); border-color: var(--ok-border); }
.tag-rejected{ background: var(--bg-sunken); color: var(--text-muted); border-color: var(--border); }
.tag-disabled{ background: var(--brand-100); color: var(--brand-800); border-color: var(--brand-300); }
.tag-expired { background: var(--brand-600); color: #fff; }
.tag-ok      { background: var(--ok-bg); color: var(--ok-text); border-color: var(--ok-border); }
.tag-bad     { background: var(--brand-100); color: var(--brand-800); border-color: var(--brand-300); }
.tag-action  { background: var(--bg-sunken); color: var(--text); border-color: var(--border-strong); }

.inline-form { display: inline-flex; gap: 5px; align-items: center; flex-wrap: wrap; }
.inline-form input[type=text], .inline-form input[type=date], .inline-form input[type=number],
.inline-form select {
  padding: 5px 9px; border: 1px solid var(--border-strong); border-radius: var(--r-sm);
  font-size: 12.5px; font-family: inherit; background: var(--bg); color: var(--text);
}
.inline-form input:focus, .inline-form select:focus {
  outline: none; border-color: var(--brand-500); box-shadow: 0 0 0 3px var(--brand-100);
}
.inline-form input[type=text].narrow { width: 120px; }

.details { margin: 4px 0; }
.details summary {
  cursor: pointer; color: var(--brand-700); font-size: 12.5px; font-weight: 600;
  list-style: none; display: inline-flex; align-items: center; gap: 5px;
  padding: 3px 0; user-select: none;
}
.details summary::-webkit-details-marker { display: none; }
.details summary::before { content: "▸"; transition: transform .15s ease; display: inline-block; }
.details[open] > summary::before { transform: rotate(90deg); }
.details[open] > summary { margin-bottom: 10px; }
.details > form, .details > div { padding-left: 14px; border-left: 2px solid var(--brand-200); }

/* 会员详情页：两列面板布局，窄屏自动堆叠 */
.detail-grid {
  display: grid; gap: 16px;
  grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
  align-items: start;
}
.panel {
  border: 1px solid var(--border); border-radius: var(--r-md);
  background: var(--bg); box-shadow: var(--sh-1); padding: 16px 18px;
}
.panel-wide { grid-column: 1 / -1; }
.panel h2 {
  font-size: 14px; font-weight: 700; margin: 0 0 12px;
  display: flex; align-items: center; gap: 8px;
}
.panel h2::before {
  content: ""; width: 3px; height: 14px; border-radius: 2px;
  background: var(--brand-500); flex: 0 0 3px;
}
.panel .field:last-of-type { margin-bottom: 12px; }
.panel table.grid { box-shadow: none; }

/* ==========================================================================
   工具类
   ========================================================================== */

.muted { color: var(--text-muted); }
.small { font-size: 12px; }
.pad { padding: 10px; }
.mono {
  font-family: "Cascadia Mono", Consolas, "Courier New", monospace;
  font-size: 12px; color: var(--text-soft);
}

/* ==========================================================================
   窄屏
   ========================================================================== */

@media (max-width: 860px) {
  .layout { flex-direction: column; }
  .sidebar {
    width: 100%; flex: 0 0 auto; max-height: 44vh;
    border-right: none; border-bottom: 1px solid #00000040;
  }
  .channel-block { max-height: 24vh; }
  .main { flex: 1; min-height: 0; }
  .post { padding: 9px 14px; gap: 10px; }
  .channel-header, .banner, .admin-nav, .admin-body { padding-left: 14px; padding-right: 14px; }
  .att-image, .att-image img, .att-video video { max-width: 100%; }
  .avatar { width: 34px; height: 34px; flex: 0 0 34px; }
  .cards { grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); }
}

/* 触屏没有 hover：把「⋮」入口常亮，否则永远点不出来 */
@media (hover: none) {
  .chan-more { opacity: 1; }
}

/* 打印时去掉交互装饰（留个口子，方便以后做导出） */
@media print {
  .sidebar, .admin-nav, .post-actions, .load-more { display: none !important; }
  .post:hover { background: none; border-left-color: transparent; }
}


/* ==========================================================================
   深色主题

   data-theme 由 <head> 内联脚本在首屏渲染前设置（避免闪白），
   用户选择存 localStorage；没有选择时跟随系统。
   ========================================================================== */

:root[data-theme="dark"] {
  color-scheme: dark;   /* 让原生滚动条与表单控件跟着变深 */

  /* 品牌红在深色底上要提亮，否则发闷。
     同时把「深红=文字色」的角色反转（浅色下 brand-800 是深字，深色下要变浅字）。 */
  --brand-50:  #2b1418;
  --brand-100: #3b1a1f;
  --brand-200: #56242b;
  --brand-300: #7e3038;
  --brand-400: #c2484e;
  --brand-500: #ef5a60;
  --brand-600: #e5484d;
  --brand-700: #cf3d42;
  --brand-800: #ffb4b7;
  --brand-900: #ffd7d9;
  --brand-950: #ffecec;

  --side-top:    #1b0e11;
  --side-bottom: #140a0c;
  --side-text:   #e9dadc;
  --side-muted:  #a2898c;
  --side-hover:  #ffffff12;
  --side-line:   #ffffff14;

  --bg:            #171314;
  --bg-soft:       #1e191a;
  --bg-sunken:     #251f20;
  --border:        #302829;
  --border-strong: #3f3637;
  --border-hover:  #4a4142;
  --placeholder:   #756a6c;
  --text:          #f3edee;
  --text-soft:     #d5cacb;
  --text-muted:    #9e9193;

  --link:        #ff9a9e;
  --link-hover:  #ffc0c2;
  --star-empty:  #6b5f61;
  --scroll-thumb: #3b3335;
  --scroll-thumb-hover: #4d4345;

  /* 同样没有绿色：深色下正向状态走更亮一档的品牌红 */
  --ok:         #ff8f93;
  --ok-text:    #ffb9bc;
  --ok-bg:      #2b1416;
  --ok-border:  #4d2429;
  /* 深色下同样：重要=亮红加粗，高亮底色压暗，避免刺眼 */
  --important-text: #ff9a9e;
  --flash-bg:   #331a1d;
  --warn:       #e6bb52;
  --warn-bg:    #322a13;
  --warn-border: #4e421d;

  /* 深色下阴影几乎不可见，层次主要靠边框；阴影只保留极轻的一层 */
  --sh-1: 0 1px 2px #00000040;
  --sh-2: 0 2px 10px #00000055;
  --sh-3: 0 10px 34px #00000070;
  --sh-brand: 0 2px 10px #e5484d38;
}

/* 无头像发送者的文字缩写：深色下换成深底浅字，仍只走红/暖色家族 */
:root[data-theme="dark"] .avatar[data-tone="0"] { background: linear-gradient(140deg,#3c1b1f,#4f2228); color:#ffcdd0; }
:root[data-theme="dark"] .avatar[data-tone="1"] { background: linear-gradient(140deg,#472026,#5d2a31); color:#ffd2d4; }
:root[data-theme="dark"] .avatar[data-tone="2"] { background: linear-gradient(140deg,#412a20,#55382a); color:#ffdcc4; }
:root[data-theme="dark"] .avatar[data-tone="3"] { background: linear-gradient(140deg,#3f2130,#552b3f); color:#ffd0e0; }
:root[data-theme="dark"] .avatar[data-tone="4"] { background: linear-gradient(140deg,#3a302a,#4d4038); color:#f0dcc8; }
:root[data-theme="dark"] .avatar[data-tone="5"] { background: linear-gradient(140deg,#332c2b,#453c3a); color:#ddd0cd; }

/* 深色下正文图片的浅色边框会显得突兀 */
:root[data-theme="dark"] .post-body img,
:root[data-theme="dark"] .att-image img { border-color: var(--border-strong); }
/* 「响提示音勾了、声音总开关没开」的行内提醒（设置页） */
.warn-inline {
  /* 注意：不能直接写 display:inline-block——作者样式会盖掉 [hidden] 的 display:none，
     结果「隐藏」的提醒一直挂在页面上。所以默认 none，只有没 hidden 时才显示。 */
  display: none; margin-left: 10px; padding: 2px 8px; border-radius: var(--r-sm);
  background: var(--brand-100); color: var(--brand-800); border: 1px solid var(--brand-300);
  font-size: 12px;
}
.warn-inline:not([hidden]) { display: inline-block; }
/* 设置页「会不会提示」列：会提示标绿，一眼看出哪几个频道是哑的 */
.ok-inline { color: var(--ok); font-weight: 600; }
/* ==========================================================================
   资讯研报 · 7x24电报（DEC-20260928-021/022 的 Web 页面）
   与聊天页共用同一套变量与深色主题，这里只加时间流需要的少量类。
   ========================================================================== */
.ct-wrap { position: relative; display: flex; flex-direction: column; height: 100%; min-height: 0; }

/* 筛选条：紧凑区按基线 13px，内边距走 12/16 刻度 */
.ct-filters {
  display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center;
  padding: 12px 16px; border-bottom: 1px solid var(--border);
  background: var(--qt-surface-sunken);
}
.ct-field { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-muted); }
.ct-field select, .ct-field input { font-size: 13px; }
.ct-check { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; color: var(--text-soft); }
.ct-sources { flex-wrap: wrap; max-width: 100%; gap: 6px 14px; }
.ct-sources .ct-check { font-size: 13px; }

.ct-hint { padding: 8px 14px; background: var(--warn-bg); color: var(--warn); border-bottom: 1px solid var(--warn-border); font-size: 12px; }

/* 内容页顶部的「设置」入口：品牌红 + 齿轮，窄屏也保持可见（头部本来就会换行） */
.ct-settings-btn {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 10px; font-size: 12.5px; text-decoration: none;
}
.ct-settings-gear { font-size: 13px; line-height: 1; }

.ct-selfmedia-btn {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 10px; font-size: 12.5px; text-decoration: none;
}

/* 关键词高亮 / 屏蔽词标灰（屏蔽词优先，命中处不重叠） */
.ct-hit-kw { color: var(--important-text); font-weight: 700; }
.ct-hit-blocked { color: var(--text-muted); text-decoration: line-through; }

/* 资讯研报通知设置页：关键词/屏蔽词 textarea 与数字输入的行内样式 */
#content-notify-form textarea {
  width: 100%; min-height: 72px; resize: vertical; line-height: 1.6;
  font-size: 13px; font-family: inherit; padding: 6px 8px;
  border-radius: var(--r-sm); border: 1px solid var(--border);
  background: var(--bg); color: var(--text);
}
#content-notify-form textarea:focus {
  outline: none; border-color: var(--brand-400); box-shadow: 0 0 0 3px var(--brand-100);
}
#content-notify-form input[type=number] {
  padding: 4px 8px; font-size: 13px; border-radius: var(--r-sm);
  border: 1px solid var(--border); background: var(--bg); color: var(--text);
}
#content-notify-form input[type=number]:focus {
  outline: none; border-color: var(--brand-400); box-shadow: 0 0 0 3px var(--brand-100);
}

.ct-list { flex: 1; min-height: 0; overflow-y: auto; padding: 0 0 12px; }

/* 时间流条目：主文字 15px/600，元信息 13px，行内边距 12/16 */
.ct-item {
  position: relative; display: flex; gap: 12px; padding: 12px 16px;
  border-bottom: 1px solid var(--border);
  transition: background .12s ease;
}
.ct-item:hover, .ct-item:focus-within { background: var(--qt-surface-hover); }
.ct-item.is-unread .ct-title { font-weight: 700; }
/* 未读标记画成实心小圆点，不依赖字体字形 */
.ct-dot {
  flex: 0 0 8px; width: 8px; height: 8px; margin-top: 8px;
  border-radius: var(--r-full); background: var(--qt-border);
  color: transparent; font-size: 0; overflow: hidden;
}
.ct-item.is-unread .ct-dot { background: var(--qt-primary); }
.ct-main { flex: 1; min-width: 0; }
.ct-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ct-head-spacer { flex: 1; }
.ct-time { color: var(--text-muted); font-size: 13px; font-variant-numeric: tabular-nums; }
.ct-act {
  background: none; border: 0; cursor: pointer; color: var(--text-muted);
  font-size: 13px; padding: 4px 8px; border-radius: var(--r-sm); text-decoration: none;
  transition: background .12s ease, color .12s ease;
}
.ct-act:hover { color: var(--qt-text-on-accent); background: var(--qt-primary); text-decoration: none; }
.ct-act:active { filter: brightness(.94); }
.ct-act.is-on { color: var(--qt-primary); }
.ct-title { margin-top: 4px; font-size: 15px; line-height: 1.55; font-weight: 600; }
.ct-title a { color: var(--qt-text); text-decoration: none; }
.ct-title a:hover { color: var(--brand-600); text-decoration: underline; }
.ct-tags { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px; }

/* 重要快讯（服务端 is_important / 重要事件成员）：主文字标红加粗。
   只用红/暖色家族（本项目前端不用绿色），普通条目样式保持不变。 */
.ct-item.is-important .ct-title,
.ct-item.is-important .ct-title a { color: var(--important-text); font-weight: 700; }
.ct-item.is-important .ct-title a:hover { color: var(--brand-600); text-decoration: underline; }

/* 自动补拉刚插入的卡片：短暂高亮一下（不改布局、不滚动），动画结束自动恢复 */
.ct-item.is-flash { animation: ct-flash 2.4s ease-out 1; }
@keyframes ct-flash {
  0%   { background-color: var(--flash-bg); }
  55%  { background-color: var(--flash-bg); }
  100% { background-color: transparent; }
}

/* 「相似文章」：同一事件的其它资讯，独立边框块，和主卡片明显分开 */
.ct-similar {
  margin-top: 10px; padding: 10px 12px; border: 1px solid var(--border);
  border-radius: var(--r-md); background: var(--qt-surface-sunken);
}
.ct-similar-title { font-size: 12px; font-weight: 700; letter-spacing: .02em; color: var(--text-muted); margin-bottom: 6px; }
.ct-similar-list { list-style: none; margin: 0; padding: 0; }
.ct-similar-item { display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; font-size: 13px; line-height: 1.6; padding: 3px 0; }
.ct-similar-time { color: var(--text-muted); font-variant-numeric: tabular-nums; flex: 0 0 auto; }
.ct-similar-source { color: var(--brand-700, var(--brand-600)); flex: 0 0 auto; }
.ct-similar-text { color: var(--text-soft); text-decoration: none; overflow-wrap: anywhere; }
a.ct-similar-text:hover { color: var(--brand-600); text-decoration: underline; }

/* 标签（chip）：内容域专用。基线：surface-muted 底 + 次文字色；
   可点标签要有 hover 与 focus，纯展示标签保持静态。 */
.chip {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 12px; line-height: 1.5; padding: 1px 8px;
  border-radius: var(--r-sm); background: var(--qt-surface-muted); color: var(--text-muted);
  border: 1px solid var(--qt-border); text-decoration: none;
  transition: background .12s ease, color .12s ease, border-color .12s ease;
}
a.chip:hover { color: var(--qt-text-on-accent); background: var(--qt-primary); border-color: transparent; text-decoration: none; }
a.chip:active { filter: brightness(.94); }
a.chip:focus-visible { outline: 2px solid var(--brand-500); outline-offset: 2px; }
.chip-source { background: var(--qt-primary-soft); color: var(--brand-800); border-color: var(--brand-300); font-weight: 600; }
.chip-stock { background: var(--ok-bg); color: var(--ok-text); border-color: var(--ok-border); }
.chip-event { background: var(--warn-bg); color: var(--warn); border-color: var(--warn-border); }
.chip-event.is-updated { box-shadow: 0 0 0 2px var(--warn-border); }
.chip-warn { background: var(--brand-100); color: var(--brand-800); border-color: var(--brand-300); }

/* 空态（基线 §6.2）：图标 + 说明 + 一个可执行动作，与聊天页共用同一套观感 */
.ct-empty { padding: 40px 24px; text-align: center; color: var(--text-muted); font-size: 13px; }
.ct-empty::before {
  content: "◍"; display: flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; margin: 0 auto 12px; border-radius: var(--r-full);
  background: var(--qt-primary-soft); color: var(--qt-primary); font-size: 20px; line-height: 1;
}
.ct-empty p { margin: 0; }
.ct-empty .btn { margin-top: 12px; }
.ct-more { padding: 16px 16px 24px; text-align: center; }

/* ==========================================================================
   自媒体广场（/content/self-media 与「我想看」）
   沿用资讯页的卡片/筛选条视觉，只加作者区、文章卡与阅读抽屉。
   ========================================================================== */
.sm-wrap { flex: 1; min-height: 0; overflow-y: auto; padding: 0 0 40px; }
.sm-summary { padding: 12px 16px 0; font-size: 13px; }
.sm-clear-author { color: var(--link); }

/* 作者发现区 */
.sm-authors {
  display: grid; gap: 8px; padding: 12px 16px;
  grid-template-columns: repeat(8, minmax(0, 1fr));
}
.sm-author {
  display: flex; align-items: center; gap: 6px; min-width: 0;
  padding: 8px 9px; border: 1px solid var(--border); border-radius: var(--r-md);
  background: var(--qt-surface); transition: background .12s ease, border-color .12s ease;
}
.sm-author:hover, .sm-author:focus-within { border-color: var(--qt-primary); background: var(--qt-surface-hover); }
.sm-avatar {
  flex: 0 0 38px; width: 38px; height: 38px; border-radius: var(--r-full);
  display: flex; align-items: center; justify-content: center; overflow: hidden;
  background: var(--sm-author-color, var(--brand-100)); color: var(--brand-800);
  font-weight: 700; font-size: 15px;
}
.sm-avatar img { width: 100%; height: 100%; object-fit: cover; }
.sm-author-main { flex: 1; min-width: 0; }
.sm-author-name { display: block; overflow: hidden; color: var(--text); font-weight: 600; font-size: 13px; line-height: 1.5; text-overflow: ellipsis; white-space: nowrap; }
.sm-author-name:hover { color: var(--brand-600); text-decoration: underline; }
.sm-author .sm-follow { flex: 0 0 auto; }
.sm-author .sm-follow-btn { padding: 4px 7px; font-size: 11px; line-height: 1.3; }
.sm-private-item { margin: 10px 16px; padding: 12px 14px; background: var(--qt-surface-raised); border: 1px solid var(--border); border-radius: var(--r-md); }
.sm-private-item-head { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; color: var(--qt-text-strong); }
.sm-private-link { display: inline-block; margin-top: 6px; color: var(--brand-600); font-size: 12px; }
.sm-private-reason { margin-top: 6px; }
.sm-private-reject { margin-top: 6px; padding: 6px 8px; color: var(--qt-important-text); background: var(--qt-primary-soft); border-radius: var(--r-sm); font-size: 12px; }

/* 文章流 */
.sm-list-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 16px 8px; border-top: 1px solid var(--border); margin-top: 8px;
}
.sm-list-title { font-weight: 700; font-size: 15px; }
.sm-list { display: flex; flex-direction: column; }
.sm-item {
  padding: 12px 16px; border-bottom: 1px solid var(--border); cursor: pointer;
  transition: background .12s ease;
}
.sm-item:hover, .sm-item:focus-within { background: var(--qt-surface-hover); }
.sm-item-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sm-item-author { font-weight: 600; font-size: 13px; color: var(--text-soft); }
.sm-item-title { margin: 6px 0 0; font-size: 15px; line-height: 1.55; font-weight: 600; }
.sm-item-title a { color: var(--qt-text); text-decoration: none; }
.sm-item-title a:hover { color: var(--brand-600); text-decoration: underline; }
.sm-item-summary { margin-top: 6px; color: var(--text-soft); font-size: 14px; line-height: 1.65; overflow-wrap: anywhere; }
.sm-item-foot { margin-top: 8px; font-size: 13px; }
.chip-pending { background: var(--warn-bg); color: var(--warn); border-color: var(--warn-border); }
.chip-ok { background: var(--ok-bg); color: var(--ok-text); border-color: var(--ok-border); }
.chip-muted { background: var(--bg-sunken); color: var(--text-muted); }
.chip-important { background: var(--brand-100); color: var(--brand-800); border-color: var(--brand-300); font-weight: 600; }

/* 阅读抽屉：覆盖在内容区上，不跳转详情页 */

/* 自媒体广场：顶部「全部 / 我关注的」+ 我想看 */
.sm-topbar {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 10px 14px 2px;
}
.sm-scope { display: inline-flex; background: var(--qt-surface-sunken); border: 1px solid var(--border); border-radius: var(--r-full); padding: 2px; }
.sm-scope-item {
  padding: 6px 16px; border-radius: var(--r-full); font-size: 13px;
  color: var(--text-soft); text-decoration: none; transition: background .12s ease, color .12s ease;
}
.sm-scope-item:hover { color: var(--text); text-decoration: none; }
.sm-scope-item.is-active { background: var(--qt-primary); color: var(--qt-text-on-accent); box-shadow: var(--sh-1); }

/* 选中作者时的简介头 */
.sm-author-head {
  display: flex; gap: 12px; align-items: flex-start;
  margin: 12px 16px 0; padding: 12px 16px;
  background: var(--qt-surface-sunken); border: 1px solid var(--border); border-radius: var(--r-md);
}
.sm-avatar-lg { width: 52px; height: 52px; flex: 0 0 52px; font-size: 20px; }
.sm-author-head-main { flex: 1; min-width: 0; }
.sm-author-head-name { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-weight: 700; font-size: 16px; color: var(--qt-text-strong); }
.sm-author-bio { margin: 8px 0 0; color: var(--text-soft); font-size: 14px; line-height: 1.7; overflow-wrap: anywhere; }
.sm-author-head-links { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 8px; }
.sm-head-link { color: var(--brand-600); font-size: 13px; text-decoration: none; }
.sm-head-link:hover { text-decoration: underline; }

/* 整卡可点：给手型提示，不改布局 */
.sm-author, .sm-item { cursor: pointer; }
.sm-item-link { color: var(--text); text-decoration: none; }
.sm-origin-link { color: var(--brand-600); }

/* 自媒体详情正文：保留段落/标题/列表/表格/图片顺序 */
/* 自媒体详情正文（服务端已清洗的 HTML）：按正文 16px/1.75 排版；
   图片块级留白（未加载时用 sunken 底色兜底，不出裂图）；表格允许断词，避免整页横向溢出。 */
.ct-html { line-height: 1.75; color: var(--text); font-size: 16px; overflow-wrap: anywhere; }
.ct-html p { margin: 0 0 12px; }
.ct-html h1, .ct-html h2, .ct-html h3, .ct-html h4 { margin: 20px 0 10px; color: var(--qt-text-strong); line-height: 1.4; }
.ct-html ul, .ct-html ol { margin: 0 0 12px; padding-left: 24px; }
.ct-html li { margin: 6px 0; }
.ct-html img { display: block; max-width: 100%; height: auto; margin: 12px 0; border-radius: var(--r-md); border: 1px solid var(--border); background: var(--qt-surface-sunken); }
.ct-html table { width: 100%; border-collapse: collapse; margin: 0 0 12px; font-size: 14px; }
.ct-detail .ct-html table,
.ct-detail .ct-body table { display: block; max-width: 100%; overflow-x: auto; }
.ct-detail .ct-html pre,
.ct-detail .ct-body pre { max-width: 100%; overflow-x: auto; white-space: pre; }
.ct-html th, .ct-html td { border: 1px solid var(--border); padding: 6px 10px; text-align: left; overflow-wrap: anywhere; }
.ct-html th { background: var(--qt-surface-sunken); }
.ct-html blockquote { margin: 0 0 12px; padding: 8px 14px; border-left: 3px solid var(--brand-300); background: var(--qt-surface-sunken); color: var(--text-muted); }
.ct-html a { color: var(--link); }

/* 我想看 */
.sm-quota { padding: 12px 16px 0; font-size: 13px; }
.sm-recs { display: flex; flex-direction: column; padding: 0 16px; }
.sm-rec {
  display: flex; align-items: flex-start; gap: 12px; justify-content: space-between;
  padding: 12px 0; border-bottom: 1px solid var(--border);
}
.sm-rec-main { flex: 1; min-width: 0; }
.sm-rec-name { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-weight: 600; font-size: 14px; }
.sm-rec-reason { margin-top: 4px; font-size: 13px; }
.sm-rec-act { flex: 0 0 auto; }
.sm-status-filter { display: flex; align-items: center; gap: 6px; }
.sm-status-filter select { font-size: 13px; }

/* 我想看：说明、小标题、推荐表单都按内容域的间距与表格观感（覆盖后台表格样式） */
.sm-intro { margin: 12px 16px 0; line-height: 1.7; font-size: 13px; }
.sm-section-title { margin: 20px 16px 8px; font-size: 15px; font-weight: 700; color: var(--qt-text-strong); }
.sm-form { padding: 0 16px; }
.sm-form-actions { margin: 12px 0 0; }
.sm-wrap table.grid { font-size: 13px; }
.sm-wrap table.grid th, .sm-wrap table.grid td { padding: 10px 12px; }
.sm-wrap table.grid tbody tr:hover td { background: var(--qt-surface-hover); }

@media (max-width: 860px) {
  .sm-authors { grid-template-columns: 1fr; padding: 12px; }
  .sm-private-item { margin-left: 12px; margin-right: 12px; }
  .sm-list-head, .sm-item, .sm-summary, .sm-topbar, .sm-recs,
  .sm-form, .sm-intro, .sm-section-title, .sm-quota { padding-left: 12px; padding-right: 12px; }
  .sm-intro, .sm-section-title { margin-left: 0; margin-right: 0; }
  .sm-author-head { margin: 12px 12px 0; padding: 12px; }
  .sm-rec { flex-direction: column; gap: 8px; }
}

/* 浮动回顶按钮：列表不在顶部又有新内容时出现；浮层不占布局、不阻断阅读 */
.ct-float-new {
  position: absolute; left: 50%; transform: translateX(-50%); bottom: 20px;
  z-index: 5; height: 34px; padding: 0 16px; border: 0; border-radius: var(--r-full);
  background: var(--qt-primary); color: var(--qt-text-on-accent); cursor: pointer;
  font-size: 13px; font-weight: 600; font-family: inherit; box-shadow: var(--sh-2);
}
.ct-float-new:hover { filter: brightness(1.06); }
.ct-float-new[hidden] { display: none; }

/* 详情页 */
/* 详情页自己要当滚动容器：父级 .main 是 overflow:hidden，若这里不滚动，长正文会被裁掉、看着像“不能滚”。
   内层 .ct-detail-inner 保留原来的 padding 与 900px 正文宽度，外观不变。 */
.ct-detail { flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; }
.ct-detail-inner { padding: 24px 24px 48px; max-width: 900px; margin-left: auto; margin-right: auto; }
.ct-detail-title { font-size: 22px; line-height: 1.45; font-weight: 700; color: var(--qt-text-strong); margin: 0 0 12px; }
.ct-detail-meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 12px; font-size: 13px; }
.ct-origin { font-size: 13px; color: var(--link); }
.ct-body { margin: 16px 0 20px; font-size: 16px; line-height: 1.75; color: var(--text); }
.ct-plain { white-space: pre-wrap; overflow-wrap: anywhere; }
.ct-media { display: flex; flex-direction: column; gap: 12px; margin-bottom: 20px; }
.ct-media img { max-width: 100%; height: auto; border-radius: var(--r-md); border: 1px solid var(--border); background: var(--qt-surface-sunken); }
.ct-video { max-width: 100%; border-radius: var(--r-md); }
.ct-event { margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--border); }
.ct-event h2 { font-size: 16px; margin: 0 0 8px; color: var(--qt-text-strong); }
.ct-event-items { margin: 10px 0 0; padding-left: 20px; }
.ct-event-items li { margin: 6px 0; font-size: 14px; }
.ct-detail-foot { margin-top: 24px; }

@media (max-width: 860px) {
  .ct-filters { padding: 12px; gap: 8px 12px; }
  .ct-field input[type="text"] { width: 110px !important; }
  .ct-item { padding: 12px; gap: 10px; }
  .ct-similar { padding: 10px; }
  .ct-similar-item { font-size: 13px; }
  .ct-more { padding: 12px 12px 20px; }
  .ct-detail-inner { padding: 16px 14px 36px; }
  .ct-detail-title { font-size: 19px; }
}

/* ==========================================================================
   UI 壳层：全局一级菜单 + 聊天专属频道面板 + 内容区页签
   ========================================================================== */

/* 全局一级菜单：只放栏目，窄一点，给频道面板腾空间 */
:root { --chan-panel-w: 258px; }
@media (max-width: 1279px) { :root { --sidebar-w: 214px; --chan-panel-w: 236px; } }

/* ---- 聊天专属频道面板（只在 /c/<频道> 出现） ---- */
.chan-panel {
  width: var(--chan-panel-w); flex: 0 0 var(--chan-panel-w);
  display: flex; flex-direction: column; min-height: 0;
  --chan-panel-active-bg: var(--qt-primary-active);
  --chan-panel-active-bg: color-mix(in srgb, var(--qt-primary-active) 85%, var(--qt-app-bg));
  background: var(--qt-surface-sunken); border-right: 1px solid var(--qt-border);
  transition: flex-basis .16s ease, width .16s ease;
}
.chan-panel .channel-item { color: var(--qt-text); }
.chan-panel .channel-item:hover { background: var(--qt-surface-hover); color: var(--qt-text-strong); }
.chan-panel .channel-item.is-active {
  background: var(--chan-panel-active-bg); color: var(--qt-text-on-accent);
}
.chan-panel .badge { background: var(--chan-panel-active-bg); color: var(--qt-text-on-accent); }
.chan-panel .channel-item.is-active .badge {
  background: var(--qt-text-on-accent); color: var(--chan-panel-active-bg);
}
.chan-panel .group-head { color: var(--qt-text-muted); }
.chan-panel .group-head:hover { background: var(--qt-surface-hover); color: var(--qt-text-strong); }
.chan-panel .group-head.is-static:hover { background: none; color: var(--qt-text-muted); }
.chan-panel .chan-more { color: var(--qt-text-muted); }
.chan-panel .chan-more:hover { background: var(--qt-surface-hover); color: var(--qt-text-strong); }
.chan-panel .block-link { color: var(--qt-text-muted); }
.chan-panel .block-link:hover { background: var(--qt-surface-hover); color: var(--qt-text-strong); }
.chan-panel .chan-search {
  background: var(--qt-surface); color: var(--qt-text); border-color: var(--qt-border);
}
.chan-panel .chan-search:focus {
  border-color: var(--qt-primary); box-shadow: 0 0 0 2px var(--qt-primary-soft);
}
.chan-panel .chan-panel-head { color: var(--qt-text-muted); }
.chan-panel .chan-panel-toggle {
  background: var(--qt-surface); color: var(--qt-text-muted); border-color: var(--qt-border);
}
.chan-panel .chan-panel-toggle:hover { color: var(--qt-text-strong); border-color: var(--qt-border-soft); }
.chan-panel .chan-panel-foot { border-top-color: var(--qt-border); }
.chan-panel .chan-more-btn { color: var(--qt-primary-active); }
.chan-panel[data-collapsed="1"] { width: 0; flex-basis: 0; overflow: hidden; border-right: 0; }
.chan-panel-head {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 12px 8px; color: var(--text-muted); font-size: 12px;
}
.chan-panel-title { font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.chan-panel-head .spacer { flex: 1; }
.chan-favorites { margin: 0 12px 8px; }
.chan-favorites-label { display: flex; align-items: center; gap: 8px; min-width: 0; }
.chan-favorites .nav-icon { width: 16px; height: 16px; flex-basis: 16px; }
.chan-favorites .nav-icon svg { width: 16px; height: 16px; }
.chan-panel-toggle {
  width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--border); border-radius: var(--r-sm);
  background: var(--bg); color: var(--text-muted); font-size: 12px; cursor: pointer;
}
.chan-panel-toggle:hover { color: var(--brand-700); border-color: var(--border-strong); }
.chan-panel[data-collapsed="1"] .chan-panel-toggle { transform: rotate(180deg); }

.chan-panel-tools { padding: 0 12px 8px; display: flex; flex-direction: column; gap: 8px; }
.chan-search {
  width: 100%; padding: 6px 9px; font-size: 13px;
  background: var(--bg); color: var(--text);
  border: 1px solid var(--border); border-radius: var(--r-sm);
}
.chan-search:focus { outline: none; border-color: var(--brand-500); box-shadow: 0 0 0 2px var(--brand-100); }
.chan-panel-body { flex: 1; min-height: 0; overflow-y: auto; padding: 0 8px 8px; }
/* 频道多了也不卡：屏外条目不参与布局/绘制（浏览器原生懒渲染） */
.chan-panel-body .channel-row { content-visibility: auto; contain-intrinsic-size: auto 32px; }
.chan-panel-foot {
  border-top: 1px solid var(--border); padding: 6px 12px;
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.chan-more-btn {
  border: 0; background: none; color: var(--brand-600); font-size: 12px; cursor: pointer; padding: 2px 0;
}
.chan-more-btn:hover { text-decoration: underline; }

/* 面板里的频道块：沿用原有 DOM，只把外层滚动交给面板 */
.chan-panel .channel-block { padding: 0; overflow: visible; flex: none; }

.chan-empty { padding: 8px 12px; }

/* 窄屏：面板变抽屉（覆盖式），一级菜单收成顶部条 */
.chan-drawer-btn { display: none; }
@media (max-width: 860px) {
  .chan-panel {
    position: fixed; top: 0; bottom: 0; left: 0; z-index: 50;
    width: min(320px, 86vw); flex-basis: auto;
    background: var(--bg); box-shadow: var(--sh-3);
    transform: translateX(-102%); transition: transform .18s ease;
  }
  .chan-panel[data-open="1"] { transform: translateX(0); }
  .chan-panel[data-collapsed="1"] { width: min(320px, 86vw); overflow: visible; }
  .chan-drawer-btn {
    display: inline-flex; align-items: center; gap: 6px;
    position: fixed; left: 12px; bottom: 14px; z-index: 40;
    padding: 8px 14px; border: 1px solid var(--border-strong); border-radius: var(--r-full);
    background: var(--bg); color: var(--text); box-shadow: var(--sh-2); font-size: 13px; cursor: pointer;
  }
  .chan-drawer-mask {
    position: fixed; inset: 0; z-index: 45; background: var(--qt-overlay, rgba(0,0,0,.48));
  }
  .chan-drawer-mask[hidden] { display: none; }
}


/* hidden 兜底：这些容器在别处是 flex，[hidden] 必须真的隐藏 */
.channel-row[hidden], .chan-group[hidden] { display: none !important; }

/* 频道面板内的焦点环：键盘用户要看得见 */
.chan-panel .channel-item:focus-visible,
.chan-panel .chan-more:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--qt-surface-sunken), 0 0 0 4px var(--qt-focus-ring);
}


/* ==========================================================================
   聊天页精修（UI 基线第 1 批）

   只覆盖聊天页与共享壳层：字号/行高/间距/圆角/状态全部走 tokens（--qt-*），
   不新增写死颜色；成功/在线仍是品牌红，绿色只留给行情负向。
   ========================================================================== */

/* ---- 加载 / 错误态（基线 §6.2：就地说明原因 + 重试，不整页替换） ---- */
.load-error {
  display: flex; align-items: center; justify-content: center; gap: 12px;
  margin: 0 24px; padding: 12px 16px;
  background: var(--warn-bg); border: 1px solid var(--warn-border);
  border-radius: var(--r-md); color: var(--warn); font-size: 13px;
}
.messages > .empty-state { margin: 32px auto 0; max-width: 420px; }

/* ---- 触屏（基线 §6.3 / P2-10）：没有 hover，操作入口常显 ---- */
@media (hover: none) {
  .post-actions .fav-btn, .post-actions .copy-btn { color: var(--qt-text-muted); }
  .post:hover { background: none; border-left-color: transparent; }
  .chan-more { opacity: 1; }
}

/* ---- 减少动效（基线 §6.4） ---- */
@media (prefers-reduced-motion: reduce) {
  .post, .jump-bottom, .post-body img, .att-image img,
  .post-actions .fav-btn, .post-actions .copy-btn,
  .chan-panel, .chan-drawer-btn { transition: none; }
  .post.flash { animation: none; }
  .lightbox { backdrop-filter: none; }
}

/* ---- 窄屏：顶栏压到 56px，消息间距按 4/8 刻度收紧，横向不溢出 ---- */
@media (max-width: 860px) {
  .channel-header { min-height: 56px; padding: 10px 14px; gap: 8px; }
  .messages { padding: 8px 0 88px; }
  .post { padding: 12px 14px; gap: 10px; }
  .post-actions .fav-btn, .post-actions .copy-btn { color: var(--qt-text-muted); }
  .load-error { margin: 0 14px; }
}

/* ---- 聊天页里的控件统一可见焦点环（基线 §6.1 / §6.4） ---- */
.post-actions .fav-btn:focus-visible,
.post-actions .copy-btn:focus-visible,
.jump-bottom:focus-visible,
.post-expand:focus-visible,
.load-error .btn:focus-visible {
  outline: 2px solid var(--brand-500); outline-offset: 2px;
}


/* ==========================================================================
   资讯研报内容域精修（UI 基线第 2 批）

   只覆盖 /content/*：卡片、筛选条、标签、详情正文、加载/空/错误态。
   颜色一律走 --qt-* 或既有别名，不新增写死颜色；成功/在线保持品牌红，
   绿色只留给行情负向。
   ========================================================================== */

/* ---- 键盘可达：内容域可交互元素统一焦点环（基线 §6.4） ---- */
.ct-item a:focus-visible,
.ct-act:focus-visible,
.sm-item a:focus-visible,
.sm-author a:focus-visible,
.sm-scope-item:focus-visible,
.sm-head-link:focus-visible,
.sm-origin-link:focus-visible,
.ct-origin:focus-visible,
.ct-similar-text:focus-visible {
  outline: 2px solid var(--brand-500); outline-offset: 2px;
  border-radius: var(--r-sm);
}

/* ---- 触屏（基线 §6.3 / P2-10）：不依赖 hover；相似文章链接直接可辨 ---- */
@media (hover: none) {
  .ct-item:hover, .sm-item:hover, .sm-author:hover { background: none; }
  .ct-item:focus-within, .sm-item:focus-within, .sm-author:focus-within { background: var(--qt-surface-muted); }
  .ct-similar-text { text-decoration: underline; }
}

/* ---- 减少动效（基线 §6.4） ---- */
@media (prefers-reduced-motion: reduce) {
  .ct-item, .sm-item, .sm-author, .sm-scope-item, .chip, .ct-act { transition: none; }
}


/* ==========================================================================
   会员端设置 / 设备 / 收藏（UI 基线第 3A 批）

   只覆盖 /settings、/settings/channels、/settings/notifications、/devices、
   /favorites：外壳、分节标题、表单控件、表格、标签、帮助文字与保存反馈。
   颜色一律走 --qt-* 或既有别名，不新增写死颜色；成功/在线保持品牌红，
   绿色只留给行情负向。
   ========================================================================== */

/* ---- 外壳：会员页不用后台壳，自己当滚动容器（基线 §5.5） ---- */
.settings-body {
  flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden;
  padding: 24px 24px 48px;
}
.settings-body.is-narrow { max-width: 560px; }
.settings-body.is-medium { max-width: 860px; }

/* ---- 分节标题：与内容域同一套观感，但只作用于会员页 ---- */
.settings-body h2 {
  font-size: 15px; font-weight: 700; margin: 32px 0 12px;
  display: flex; align-items: center; gap: 8px; color: var(--qt-text-strong);
}
.settings-body h2::before {
  content: ""; width: 3px; height: 15px; border-radius: 2px;
  background: var(--qt-primary); flex: 0 0 3px;
}
.settings-body h2:first-child { margin-top: 0; }

/* ---- 帮助文字：13px/1.7，和正文拉开层级 ---- */
.settings-body .help-text {
  margin: 0 0 16px; color: var(--text-muted); font-size: 13px; line-height: 1.7;
}
.settings-body h2 + .help-text { margin-top: -4px; }

/* ---- 表格：后台 grid 的会员版；窄屏自己横向滚，不压列 ---- */
.grid-wrap { max-width: 100%; overflow-x: auto; }
.settings-body table.grid { box-shadow: none; background: var(--qt-surface); }
.settings-body table.grid th {
  background: var(--qt-surface-sunken); font-size: 12px; font-weight: 600;
  color: var(--text-muted); letter-spacing: .02em;
}
.settings-body table.grid td { color: var(--text); }
.settings-body table.grid tbody tr:hover td { background: var(--qt-surface-hover); }
.settings-body .col-label { width: 132px; }
.settings-body .col-select { width: 152px; }
.settings-body .col-narrow { width: 34%; }
.settings-body .col-half { width: 58%; }

/* ---- 表单控件：表格里的下拉/输入/多行都要够大够好点（基线 §6.1） ---- */
.settings-body table.grid select,
.settings-body table.grid input[type=text],
.settings-body table.grid input[type=number],
.settings-body table.grid input[type=password],
.settings-body table.grid textarea {
  min-height: 32px; padding: 6px 10px; font-size: 13px; font-family: inherit;
  border: 1px solid var(--border-strong); border-radius: var(--r-sm);
  background: var(--bg); color: var(--text); max-width: 100%;
  transition: border-color .12s ease, box-shadow .12s ease;
}
.settings-body table.grid textarea { width: 100%; min-height: 84px; line-height: 1.6; resize: vertical; }
.settings-body table.grid select:hover,
.settings-body table.grid input:hover,
.settings-body table.grid textarea:hover { border-color: var(--border-hover); }
.settings-body table.grid select:focus,
.settings-body table.grid input:focus,
.settings-body table.grid textarea:focus {
  outline: none; border-color: var(--brand-500); box-shadow: 0 0 0 3px var(--brand-100);
}
/* 设置页的 .field 输入与按钮同一档：13px / 32px 高 */
.settings-body .field input,
.settings-body .field select,
.settings-body .field textarea { font-size: 13px; padding: 7px 10px; min-height: 32px; }
.settings-body .field textarea { min-height: 96px; }
.settings-body .num-input { width: 104px; }
.settings-body .check-inline {
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 32px; font-size: 13px; color: var(--text); cursor: pointer;
}
.settings-body .check-inline input[type=checkbox] {
  width: 16px; height: 16px; flex: 0 0 auto; accent-color: var(--qt-primary);
}

/* ---- 按钮：会员页不要后台那种大按钮 ---- */
.settings-body .btn { font-size: 13px; padding: 7px 14px; min-height: 32px; }
.settings-body .btn-small { padding: 5px 11px; min-height: 30px; }
.settings-body .form-actions {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 20px 0 0;
}
/* 危险操作（登出设备等）：平时安静，hover 才提示风险 */
.btn-soft-danger { color: var(--brand-700); border-color: var(--brand-300); background: var(--qt-surface); }
.btn-soft-danger:hover { background: var(--brand-100); border-color: var(--brand-400); color: var(--brand-800); }

/* ---- 状态与反馈 ---- */
.settings-body .msg-ok, .settings-body .msg-error { margin-bottom: 20px; font-size: 13px; }
.settings-body .tag { font-size: 12px; }
.settings-body .device-id { font-family: "Cascadia Mono", Consolas, "Courier New", monospace; font-size: 12.5px; }
.settings-body .perm-state { font-size: 13px; color: var(--text-muted); }

/* ---- 窄屏：收边距、宽表横向滚、按钮整行 ---- */
@media (max-width: 860px) {
  .settings-body { padding: 16px 12px 40px; }
  .settings-body h2 { margin: 24px 0 10px; }
  .settings-body table.grid th, .settings-body table.grid td { padding: 9px 10px; }
}
@media (max-width: 640px) {
  .settings-body .col-label { width: 96px; }
  .settings-body .col-select { width: 132px; }
  .settings-body .form-actions .btn { flex: 1 1 auto; justify-content: center; }
  .grid-wrap table.grid.grid-wide { min-width: 520px; }
}
@media (prefers-reduced-motion: reduce) {
  .settings-body table.grid input, .settings-body table.grid select,
  .settings-body table.grid textarea { transition: none; }
}


/* ==========================================================================
   导航修复：侧栏二级栏目 + 频道面板收起细轨
   ========================================================================== */

/* ---- 侧栏二级栏目：一级项下面缩进列出（当前栏目默认展开，右侧小三角开合） ---- */
.nav-section { display: block; }
.nav-row { display: flex; align-items: center; gap: 4px; }
.nav-row .nav-item { flex: 1; min-width: 0; }
.nav-caret {
  flex: 0 0 auto; width: 26px; height: 26px; padding: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: none; border: 0; border-radius: var(--r-sm); cursor: pointer;
  color: var(--side-muted); font-size: 11px; line-height: 1; font-family: inherit;
  transition: color .12s ease, background .12s ease, transform .12s ease;
}
.nav-caret:hover { color: var(--side-strong); background: var(--side-hover); }
.nav-caret[aria-expanded="false"] { transform: rotate(-90deg); }
.nav-caret:focus-visible { outline: 2px solid var(--brand-500); outline-offset: 2px; }
.nav-sub-list { margin: 2px 0 4px; }
.nav-sub-list[hidden] { display: none; }
.nav-sub { padding-left: 26px; }
.nav-sub.is-active { background: var(--side-hover); color: var(--side-strong); font-weight: 600; }

/* ---- T-206 一级栏图标轨 ---- */
.nav-icon {
  width: 18px; height: 18px; flex: 0 0 18px;
  display: inline-flex; align-items: center; justify-content: center;
  color: currentColor;
}
.nav-icon svg { width: 18px; height: 18px; display: block; }
.foot-links a,
.foot-links .link-btn {
  display: inline-flex; align-items: center; gap: 6px;
}
.foot-links .nav-icon { width: 16px; height: 16px; flex-basis: 16px; }
.foot-links .nav-icon svg { width: 16px; height: 16px; }
.sidebar-rail-toggle {
  width: 100%; margin-top: 10px; padding: 7px 8px;
  display: flex; align-items: center; gap: 7px;
  border: 1px solid var(--side-line); border-radius: var(--r-sm);
  background: transparent; color: var(--side-muted); cursor: pointer;
  font: inherit; font-size: 12px; text-align: left;
  transition: color .12s ease, background .12s ease, border-color .12s ease;
}
.sidebar-rail-toggle:hover { color: var(--side-strong); background: var(--side-hover); border-color: var(--side-strong); }
.sidebar-rail-toggle:focus-visible { outline: 2px solid var(--brand-500); outline-offset: 2px; }
.rail-toggle-icon { width: 16px; height: 16px; display: inline-flex; flex: 0 0 16px; }
.rail-toggle-icon svg { width: 16px; height: 16px; display: block; }

@media (min-width: 861px) {
  .sidebar { overflow: visible; transition: width .16s ease, flex-basis .16s ease; }
  .sidebar .theme-menu {
    left: calc(100% + 8px); right: auto; bottom: 0;
  }
  .sidebar[data-sidebar-collapsed="1"] {
    width: var(--sidebar-w-collapsed); flex-basis: var(--sidebar-w-collapsed);
  }
  .sidebar[data-sidebar-collapsed="1"] .sidebar-head { justify-content: center; padding: 16px 0 14px; }
  .sidebar[data-sidebar-collapsed="1"] .brand { justify-content: center; gap: 0; }
  .sidebar[data-sidebar-collapsed="1"] .brand-name { display: none; }
  .sidebar[data-sidebar-collapsed="1"] .nav { padding-left: 6px; padding-right: 6px; }
  .sidebar[data-sidebar-collapsed="1"] .nav-row { display: block; }
  .sidebar[data-sidebar-collapsed="1"] .nav-caret { display: none; }
  .sidebar[data-sidebar-collapsed="1"] .nav-label { display: none; }
  .sidebar[data-sidebar-collapsed="1"] .nav-item,
  .sidebar[data-sidebar-collapsed="1"] .nav-sub {
    justify-content: center; padding-left: 8px; padding-right: 8px;
  }
  .sidebar[data-sidebar-collapsed="1"] .nav-sub-list {
    display: block !important; margin: 2px 0 4px;
  }
  .sidebar[data-sidebar-collapsed="1"] .nav-sub::before { content: none; }
  .sidebar[data-sidebar-collapsed="1"] .sidebar-foot { padding: 10px 6px 12px; }
  .sidebar[data-sidebar-collapsed="1"] .me { display: none; }
  .sidebar[data-sidebar-collapsed="1"] .foot-links {
    flex-direction: column; align-items: center; flex-wrap: nowrap; gap: 6px; margin-top: 0;
  }
  .sidebar[data-sidebar-collapsed="1"] .foot-links a,
  .sidebar[data-sidebar-collapsed="1"] .foot-links .link-btn,
  .sidebar[data-sidebar-collapsed="1"] .theme-menu-wrap {
    width: 36px; min-height: 32px; justify-content: center; padding: 6px;
  }
  .sidebar[data-sidebar-collapsed="1"] .sidebar-rail-toggle {
    justify-content: center; padding: 7px; margin-top: 8px;
  }
  .sidebar[data-sidebar-collapsed="1"] .rail-toggle-icon { transform: rotate(180deg); }
  .sidebar[data-sidebar-collapsed="1"] .theme-menu {
    left: calc(100% + 22px); bottom: 6px;
  }
}

@media (max-width: 860px) {
  .sidebar-rail-toggle { display: none !important; }
}

/* ---- 频道面板收起：留一条细轨 ----
   唯一的展开按钮就在面板里，收成 0 宽会把按钮一起藏掉，用户再也打不开
   （收起状态还会进 localStorage，刷新也回不来）。所以收起后保留一条细轨放按钮。
   窄屏（≤860px）是抽屉，规则在别处，这里用 min-width 限定只作用于桌面。 */
@media (min-width: 861px) {
  .chan-panel[data-collapsed="1"] {
    width: 40px; flex-basis: 40px;
    overflow: hidden; border-right: 1px solid var(--border);
  }
  .chan-panel[data-collapsed="1"] .chan-panel-title,
  .chan-panel[data-collapsed="1"] .chan-favorites,
  .chan-panel[data-collapsed="1"] .chan-panel-tools,
  .chan-panel[data-collapsed="1"] .chan-panel-body,
  .chan-panel[data-collapsed="1"] .chan-panel-foot,
  .chan-panel[data-collapsed="1"] .chan-panel-head .spacer { display: none; }
  .chan-panel[data-collapsed="1"] .chan-panel-head {
    padding: 12px 0 8px; gap: 0; justify-content: center;
  }
  /* 收起后箭头要指向「展开」方向，别再整体旋转（原来会把 › 转成 ‹） */
  .chan-panel[data-collapsed="1"] .chan-panel-toggle { transform: none; }
}

/* ==========================================================================
   竞价异动六榜单（T-403 Web）
   ========================================================================== */
.auction-wrap {
  flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden;
  padding: 16px 20px 40px;
}
.auction-page-head {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 16px; margin-bottom: 16px;
}
.auction-page-head h1 { margin: 0; font-size: 19px; color: var(--qt-text-strong); }
.auction-page-head p { margin: 4px 0 0; }
.auction-status {
  display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap;
  gap: 8px; color: var(--qt-text-muted); font-size: 12px;
}
.auction-status span {
  padding: 3px 8px; border: 1px solid var(--qt-border);
  border-radius: var(--r-full); background: var(--qt-surface);
}
.auction-status #auction-status-stale { color: var(--qt-text-strong); background: var(--qt-warning-soft); }
.auction-stale { color: var(--qt-text-strong); }
.auction-layout {
  display: grid; grid-template-columns: minmax(260px, .72fr) minmax(0, 1.8fr);
  gap: 16px; align-items: start;
}
.auction-card {
  min-width: 0; background: var(--qt-surface); border: 1px solid var(--qt-border);
  border-radius: var(--r-md); box-shadow: var(--sh-1);
}
.auction-card-head {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--qt-border);
}
.auction-card-head h2 { margin: 0; font-size: 15px; color: var(--qt-text-strong); }
.auction-card-head p { margin: 4px 0 0; }
.auction-board-head { align-items: center; min-width: 0; }
.auction-board-head > div:first-child { min-width: 0; }
.auction-history-list { padding: 8px 16px 16px; }
.auction-day {
  padding: 8px; margin: 2px 0; border: 1px solid transparent;
  border-bottom-color: var(--qt-border-soft); border-radius: var(--r-sm); cursor: pointer;
}
.auction-day:hover { background: var(--qt-surface-hover); }
.auction-day:focus-visible { outline: 2px solid var(--qt-focus-ring); outline-offset: 2px; }
.auction-day.is-active { background: var(--qt-surface-selected); border-color: var(--qt-primary); }
.auction-day h3 { margin: 0 0 4px; font-size: 13px; color: var(--qt-text-strong); }
.auction-day ul { margin: 0; padding: 0; list-style: none; }
.auction-day li {
  display: grid; grid-template-columns: 40px 54px minmax(0, 1fr) auto;
  gap: 8px; align-items: center; padding: 4px 0; font-size: 12px; color: var(--qt-text);
}
.auction-point-time { color: var(--qt-primary-active); font-weight: 700; }
.auction-point-seal { color: var(--qt-text-muted); }
.auction-board-actions { display: flex; align-items: center; gap: 8px; min-width: 0; }
.auction-tabs {
  display: flex; align-items: center; gap: 4px; max-width: 100%; overflow-x: auto;
  padding: 3px; background: var(--qt-surface-muted); border-radius: var(--r-sm);
  scrollbar-width: thin;
}
.auction-tab {
  flex: 0 0 auto; border: 0; background: transparent; color: var(--qt-text-muted);
  padding: 6px 10px; border-radius: var(--r-sm); font: inherit; font-size: 12px;
  white-space: nowrap; cursor: pointer;
}
.auction-tab:hover { color: var(--qt-text-strong); background: var(--qt-surface-hover); }
.auction-tab:focus-visible { outline: 2px solid var(--qt-focus-ring); outline-offset: 2px; }
.auction-tab.is-active { color: var(--qt-text-strong); background: var(--qt-surface-selected); }
.auction-board-panel { min-width: 0; }
.auction-board-state { min-width: 0; padding: 0 16px; }
.auction-board-state #auction-loading,
.auction-board-state #auction-error,
.auction-board-state #auction-empty,
.auction-board-state #auction-state-meta { margin: 10px 0 0; }
.auction-state-flags { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding-top: 10px; }
.auction-state-flags:empty { display: none; }
.auction-state-badge {
  padding: 3px 7px; border: 1px solid var(--qt-border); border-radius: var(--r-full);
  color: var(--qt-text-muted); background: var(--qt-surface-muted); font-size: 11px;
}
.auction-state-badge.is-partial,
.auction-state-badge.is-stale { color: var(--qt-text-strong); background: var(--qt-warning-soft); }
.auction-state-badge.is-unavailable { color: var(--qt-text-strong); background: var(--qt-surface-sunken); }
.auction-table td { color: var(--qt-text); }
.auction-table tr:hover td { background: var(--qt-surface-hover); }
.auction-stock-cell { display: flex; flex-direction: column; gap: 1px; min-width: 104px; }
.auction-stock-name { color: var(--qt-text-strong); font-weight: 700; }
.auction-stock-cell a { text-decoration: none; }
.auction-stock-cell a:hover { color: var(--qt-primary-active); text-decoration: underline; }
.auction-stock-cell a:focus-visible { outline: 2px solid var(--qt-focus-ring); outline-offset: 2px; }
.auction-metric-line { display: flex; align-items: baseline; gap: 5px; line-height: 1.45; }
.auction-metric-label { flex: 0 0 auto; color: var(--qt-text-muted); font-size: 11px; }
.auction-metric-value { min-width: 0; }
.auction-pair-cell { min-width: 108px; }
.auction-change-cell { min-width: 104px; }
.auction-concept-cell { min-width: 148px; white-space: normal !important; }
.auction-concept-cell .auction-metric-value { max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.auction-num.is-up, .auction-value.is-up { color: var(--qt-rise-strong); }
.auction-num.is-down, .auction-value.is-down { color: var(--qt-fall-strong); }
.auction-table-empty { text-align: center !important; color: var(--qt-text-muted) !important; padding: 28px 12px !important; }
.auction-detail-link { color: var(--qt-primary-active); text-decoration: none; }
.auction-detail-link:hover { text-decoration: underline; }
.auction-detail-link:focus-visible { outline: 2px solid var(--qt-focus-ring); outline-offset: 2px; }
#auction-history-loading, #auction-history-error { margin: 10px 16px 0; }
@media (max-width: 900px) {
  .auction-wrap { padding: 12px; }
  .auction-page-head { flex-direction: column; }
  .auction-status { justify-content: flex-start; }
  .auction-layout { grid-template-columns: minmax(0, 1fr); }
  .auction-board-head { flex-direction: column; align-items: stretch; }
  .auction-board-actions { width: 100%; flex-wrap: wrap; }
  .auction-tabs { width: 100%; }
  .auction-tab { flex: 0 0 auto; }
}
/* ==========================================================================
   竞价封单页（T-003 rework）
   左侧四日历史封单，右侧八页签；只使用中性表格风格。
   ========================================================================== */
.auction-wrap {
  --auction-paper: var(--qt-surface);
  --auction-paper-soft: var(--qt-surface-raised);
  padding: 10px 12px 28px; overflow-x: hidden; background: var(--auction-paper);
}
.auction-data-status {
  display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px;
  min-width: 0; margin: 0 0 8px;
}
.auction-missing-banner {
  flex: 1 1 560px; min-width: 0; padding: 5px 9px;
  color: var(--qt-text-strong); background: var(--qt-warning-soft);
  border: 1px solid var(--qt-warning); border-radius: 2px;
  font-size: 11px; line-height: 1.35;
}
.auction-missing-banner[hidden] { display: none !important; }
.auction-source-badges {
  display: flex; align-items: center; flex-wrap: wrap; gap: 4px;
  min-width: 0; margin-left: auto;
}
.auction-source-scope {
  color: var(--qt-text-strong); font-size: 10px; font-weight: 700;
  line-height: 16px; white-space: nowrap;
}
.auction-source-badge, .auction-source-mixed {
  padding: 2px 7px; color: var(--qt-text-muted); background: var(--qt-surface-muted);
  border: 1px solid var(--qt-border-soft); border-radius: var(--r-full);
  font-size: 10px; line-height: 16px; white-space: nowrap;
}
.auction-source-mixed {
  color: var(--qt-primary); background: var(--qt-primary-soft);
  border-color: var(--qt-primary);
}
.auction-source-badge[hidden] { display: none !important; }
.auction-source-mixed[hidden] { display: none !important; }
.auction-main-grid {
  display: grid; grid-template-columns: minmax(0, 58fr) minmax(0, 42fr);
  gap: 8px; align-items: stretch; min-width: 0;
}
.auction-history-panel, .auction-board-card {
  min-width: 0; height: calc(100dvh - 112px); min-height: 720px; background: var(--auction-paper);
  border: 1px solid var(--qt-border); border-radius: 2px; overflow: hidden;
}
.auction-history-scroll {
  height: 100%; max-height: none; overflow-x: hidden; overflow-y: auto;
  scrollbar-gutter: stable;
}
.auction-history-columns {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  min-width: 0; min-height: 100%; align-items: stretch;
}
.auction-history-column {
  display: flex; flex-direction: column; min-width: 0;
  border-right: 1px solid var(--qt-border-soft);
  cursor: pointer; background: var(--auction-paper);
}
.auction-history-column:last-child { border-right: 0; }
.auction-history-column:hover { background: var(--auction-paper-soft); }
.auction-history-column.is-active { background: var(--qt-surface-selected); }
.auction-history-date {
  padding: 8px 8px 3px; color: var(--qt-text-strong); font-size: 13px; font-weight: 700;
  white-space: nowrap;
}
.auction-history-summary { padding: 0 8px 6px; color: var(--qt-text-muted); font-size: 11px; white-space: nowrap; }
.auction-history-subhead {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2px;
  padding: 4px 7px; background: var(--qt-surface-sunken); border-top: 1px solid var(--qt-border-soft); border-bottom: 1px solid var(--qt-border-soft);
  color: var(--qt-text-muted); font-size: 10px; text-align: center; white-space: nowrap;
}
.auction-history-rows { flex: 1 1 auto; min-height: 0; overflow: visible; }
.auction-history-row { padding: 7px 7px 6px; border-bottom: 1px solid var(--qt-border-soft); }
.auction-history-row:hover { background: var(--auction-paper-soft); }
.auction-history-quote-line {
  margin-top: 1px; overflow: hidden; color: var(--qt-text-muted);
  font-size: 9.5px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap;
}
.auction-history-stock { display: flex; align-items: baseline; gap: 4px; min-width: 0; }
.auction-history-stock-title { display: block; flex: 0 1 auto; min-width: 0; }
.auction-history-name { display: block; min-width: 0; overflow: hidden; color: var(--qt-text-strong); font-size: 12px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.auction-history-tags, .auction-stock-tags { display: flex; flex-wrap: wrap; gap: 2px; margin-top: 0; min-width: 0; }
.auction-tag {
  padding: 0 3px; color: var(--qt-text-muted); background: var(--qt-surface-muted); border: 1px solid var(--qt-border-soft);
  border-radius: 2px; font-size: 10px; line-height: 15px; white-space: nowrap;
}
.auction-history-values {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2px;
  margin-top: 4px; color: var(--qt-text); font-size: 10px; text-align: right;
  font-variant-numeric: tabular-nums; white-space: nowrap;
}
.auction-history-column.is-history .auction-history-subhead,
.auction-history-column.is-history .auction-history-values { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.auction-history-value, .auction-history-change { overflow: hidden; text-overflow: ellipsis; }
.auction-history-value.is-missing { color: var(--qt-text-muted); font-size: 8px; letter-spacing: -0.2px; text-overflow: clip; }
.auction-history-change.is-up { color: var(--qt-rise-strong); }
.auction-history-change.is-down { color: var(--qt-fall-strong); }
.auction-history-empty { padding: 24px 12px; color: var(--qt-text-muted); font-size: 12px; text-align: center; }
.auction-board-card { display: flex; flex-direction: column; }
.auction-board-head {
  display: flex; align-items: stretch; justify-content: space-between; gap: 6px;
  min-width: 0; border-bottom: 1px solid var(--qt-border-soft);
}
.auction-board-card .auction-tabs {
  flex: 1 1 auto; min-width: 0; gap: 0; padding: 0; background: transparent; border-radius: 0;
  overflow-x: auto; scrollbar-width: thin;
}
.auction-board-card .auction-tab {
  padding: 8px 7px; border: 0; border-bottom: 2px solid transparent; border-radius: 0;
  color: var(--qt-text-muted); font-size: 11px;
}
.auction-board-card .auction-tab:hover { color: var(--qt-text-strong); background: var(--qt-surface-hover); }
.auction-board-card .auction-tab.is-active { color: var(--qt-text-strong); background: var(--qt-surface-selected); border-bottom-color: var(--qt-primary); }
.auction-board-panels { min-width: 0; }
.auction-board-card .auction-state-flags {
  padding: 8px 12px; border-top: 1px solid var(--qt-border-soft);
}
.auction-board-panel { min-width: 0; }
.auction-board-panel[hidden] { display: none; }
.auction-table-wrap { width: 100%; max-height: calc(100vh - 175px); overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; }
.auction-table { width: 100%; min-width: 0; table-layout: fixed; border-collapse: collapse; font-size: 11px; }
.auction-table th, .auction-table td { padding: 7px 6px; border-bottom: 1px solid var(--qt-border-soft); text-align: left; white-space: normal; overflow: hidden; text-overflow: ellipsis; overflow-wrap: anywhere; word-break: break-word; vertical-align: middle; }
.auction-table th { position: sticky; top: 0; z-index: 1; color: var(--qt-text-muted); background: var(--qt-surface-muted); font-weight: 700; }
.auction-table td { color: var(--qt-text); }
.auction-table tr:hover td { background: var(--qt-surface-hover); }
/* 同一只股票行的任意一列都能切换股票：整行给出手型指针（点击由 auction_jjyd.js 的统一委托处理） */
.auction-table tr[data-auction-stock-open] { cursor: pointer; }
.auction-stock-cell { min-width: 0; }
.auction-stock-name { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; overflow: hidden; color: var(--qt-text-strong); font-weight: 700; text-align: left; }
.auction-stock-name-text { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.auction-stock-code { display: block; max-width: 100%; margin-top: 1px; color: var(--qt-text-muted); font-size: 10px; font-weight: 400; line-height: 1.25; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.auction-metric-line { display: flex; align-items: baseline; gap: 4px; line-height: 1.45; }
.auction-metric-label { flex: 0 0 auto; color: var(--qt-text-muted); font-size: 10px; }
.auction-metric-value { min-width: 0; }
.auction-pair-cell { min-width: 0; }
.auction-change-cell { min-width: 0; }
.auction-concept-cell { min-width: 0; white-space: normal !important; }
.auction-num { font-variant-numeric: tabular-nums; }
.auction-num.is-up, .auction-value.is-up { color: var(--qt-rise-strong); }
.auction-num.is-down, .auction-value.is-down { color: var(--qt-fall-strong); }
.auction-table-empty { padding: 24px 10px !important; color: var(--qt-text-muted) !important; text-align: center !important; }
.auction-group-row td { color: var(--qt-text-muted); background: var(--qt-surface-muted); font-size: 10px; }
.auction-group-label { color: var(--qt-text-strong); font-weight: 700; }
.auction-group-value { color: var(--qt-text); }
.auction-stock-link { padding: 0; margin: 0; border: 0; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.auction-stock-link:hover { color: var(--qt-primary-active); text-decoration: underline; }
.auction-stock-link:focus-visible { outline: 2px solid var(--qt-focus-ring); outline-offset: 2px; }
.auction-history-row[data-auction-history-open] { cursor: pointer; }
.auction-history-row[data-auction-history-open]:focus-visible { outline: 2px solid var(--qt-focus-ring); outline-offset: -2px; }
.auction-stock-modal {
  position: fixed; inset: 0; z-index: 1200; display: flex; align-items: flex-end; justify-content: stretch; padding: 0;
  /* 不再整页盖住：容器本身不接收点击，只有浮层本体接收；这样浮层打开时可以直接点其它股票行切换。 */
  pointer-events: none;
}
.auction-stock-modal[hidden] { display: none !important; }
.auction-stock-modal-dialog {
  position: relative; display: flex; flex-direction: column; width: 100%; height: min(58vh, 560px); max-height: 92vh; pointer-events: auto;
  overflow: hidden; color: var(--qt-text); background: var(--qt-surface-raised); border: 1px solid var(--qt-border); border-bottom: 0; border-radius: 14px 14px 0 0; box-shadow: 0 -10px 32px color-mix(in srgb, var(--qt-text-strong) 18%, transparent);
}
.auction-stock-modal-head { display: flex; align-items: center; gap: 20px; min-width: 0; padding: 8px 12px; border-bottom: 1px solid var(--qt-border-soft); }
.auction-stock-modal-identity { flex: 0 0 170px; min-width: 0; }
.auction-stock-modal-head h2 { margin: 0; color: var(--qt-text-strong); font-size: 15px; line-height: 1.35; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.auction-stock-modal-code { display: block; margin-top: 1px; color: var(--qt-text-muted); font-family: ui-monospace, Consolas, monospace; font-size: 11px; line-height: 1.25; }
.auction-stock-sheet-tabs { display: flex; align-items: stretch; flex: 1 1 auto; min-width: 0; overflow-x: auto; scrollbar-width: thin; }
.auction-stock-sheet-tab { flex: 0 0 auto; padding: 9px 14px; color: var(--qt-text-muted); background: transparent; border: 0; border-bottom: 2px solid transparent; font: inherit; font-size: 13px; white-space: nowrap; cursor: pointer; }
.auction-stock-sheet-tab:hover { color: var(--qt-text-strong); background: var(--qt-surface-hover); }
.auction-stock-sheet-tab.is-active { color: var(--qt-text-strong); background: var(--qt-surface-selected); border-bottom-color: var(--qt-primary); }
.auction-stock-sheet-tab:focus-visible { outline: 2px solid var(--qt-focus-ring); outline-offset: -2px; }
.auction-stock-modal-close { flex: 0 0 auto; padding: 5px 10px; color: var(--qt-text); background: var(--qt-surface); border: 1px solid var(--qt-border); border-radius: var(--r-sm); font: inherit; font-size: 12px; cursor: pointer; }
.auction-stock-modal-close:hover { background: var(--qt-surface-hover); }
.auction-stock-modal-close:focus-visible { outline: 2px solid var(--qt-focus-ring); outline-offset: 2px; }
/* 个股浮层头部（个股名 + 8 个页签）整体水平居中（2026-10-11）：
   页签不再撑满剩余宽度（flex: 0 1 auto），但仍保留 min-width: 0 + overflow-x: auto，
   窄视口下照旧横向滚动、不裁切；行高/内边距都没动，头部高度与浮层总高（365px）不变。
   关闭按钮在宽屏下用绝对定位钉回右上角、不参与居中；窄屏回落成普通流式子项，避免与页签重叠。 */
.auction-stock-modal-head { position: relative; justify-content: center; gap: 16px; }
.auction-stock-modal-identity { flex: 0 1 auto; }
.auction-stock-sheet-tabs { flex: 0 1 auto; }
.auction-stock-modal-close { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); }
@media (max-width: 900px) {
  .auction-stock-modal-close { position: static; top: auto; transform: none; }
}
.auction-stock-modal-body { flex: 1 1 auto; min-height: 0; overflow: hidden; background: var(--qt-surface); }
.auction-stock-frame { display: block; width: 100%; height: 100%; border: 0; background: var(--qt-surface); }
.auction-loading, .msg-error { margin: 8px 10px; }
@media (max-width: 1100px) {
  .auction-main-grid { grid-template-columns: minmax(0, 1fr); }
  .auction-history-panel, .auction-board-card { height: auto; min-height: 0; }
  .auction-history-scroll, .auction-table-wrap { height: auto; max-height: none; }
}
/* ==========================================================================
   资讯热榜（/content/news-hotlist）
   颜色只走主题 token；AI 弹窗、管理员侧栏和移动端抽屉由 news_hotlist.js 控制。
   ========================================================================== */
.nh-page-head { flex-wrap: wrap; gap: 8px; }
.nh-title-wrap { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.nh-ai-settings { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; min-width: 0; max-width: 100%; }
.nh-ai-thinking-label { color: var(--qt-text-muted); font-size: 12.5px; white-space: nowrap; }
.nh-ai-thinking-select {
  min-height: 32px; padding: 5px 26px 5px 9px; font: inherit; color: var(--text);
  background: var(--bg); border: 1px solid var(--border-strong); border-radius: var(--r-sm);
}
.nh-ai-thinking-select:disabled { opacity: .6; cursor: not-allowed; }
.nh-ai-settings-error { flex-basis: 100%; margin: 0; text-align: right; }
.nh-wrap { flex: 1; min-height: 0; width: 100%; overflow-y: auto; overflow-x: hidden; padding: 16px 20px 40px; max-width: var(--content-max, 1440px); margin: 0 auto; }
.nh-tabs {
  display: flex; align-items: center; gap: 4px; overflow-x: auto;
  border-bottom: 1px solid var(--border); margin-bottom: 16px;
}
.nh-tab {
  flex: 0 0 auto; padding: 8px 14px; font-size: 14px; color: var(--text-muted);
  border-bottom: 2px solid transparent; text-decoration: none; white-space: nowrap;
}
.nh-tab:hover { color: var(--text); text-decoration: none; }
.nh-tab.is-active { color: var(--brand-600); border-bottom-color: var(--brand-600); font-weight: 700; }
.nh-tab:focus-visible, .nh-source-tab:focus-visible, .nh-ai-item:focus-visible,
.nh-admin button:focus-visible, .nh-icon-btn:focus-visible {
  outline: 2px solid var(--brand-500); outline-offset: 2px;
}
.nh-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; align-items: start; }
.nh-layout.is-admin-open { grid-template-columns: minmax(0, 1fr) 340px; }
.nh-main, .nh-panel, .nh-ai-group { min-width: 0; }
.nh-panel[hidden], .nh-source-tabs[hidden], .nh-more[hidden], .nh-admin[hidden],
.nh-panel.is-hidden, .nh-source-tabs.is-hidden { display: none !important; }
.nh-loading { margin: 0 0 16px; }
.nh-ai-types {
  display: flex; align-items: center; gap: 8px; overflow-x: auto;
  padding: 0 0 4px; margin: 0 0 14px;
}
.nh-ai-group { margin-bottom: 22px; }
.nh-card {
  background: var(--qt-surface); border: 1px solid var(--border); border-radius: var(--r-md);
  box-shadow: var(--sh-1); padding: 16px;
}
.nh-card-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; margin-bottom: 12px;
}
.nh-card-head h2, .nh-ai-group h2 {
  margin: 0; color: var(--qt-text-strong); font-size: 16px; font-weight: 700;
}
.nh-card-meta, .nh-inline-state { color: var(--text-muted); font-size: 12px; }
.nh-inline-state { margin: -4px 0 10px; }
.nh-inline-state.is-error, .nh-admin-status.is-error { color: var(--brand-700); }
.nh-source-tabs {
  display: flex; align-items: center; gap: 8px; overflow-x: auto;
  padding: 0 0 4px; margin: 0 0 12px;
}
.nh-source-tab {
  flex: 0 0 auto; min-height: 32px; padding: 6px 12px; font-size: 13px;
  color: var(--text-muted); background: var(--qt-surface); border: 1px solid var(--border);
  border-radius: var(--r-full); cursor: pointer;
}
.nh-source-tab:hover { color: var(--text); background: var(--qt-surface-hover); }
.nh-source-tab.is-active {
  color: var(--qt-text-on-accent); background: var(--brand-600); border-color: var(--brand-600);
  font-weight: 700;
}
.nh-source-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; }
.nh-rank-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.nh-rank-item {
  display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 10px;
  padding: 11px 10px; border-bottom: 1px solid var(--qt-border-soft);
  border-radius: var(--r-sm); transition: background .12s ease;
}
.nh-rank-item:hover { background: var(--qt-surface-hover); }
.nh-rank-item:last-child { border-bottom: 0; }
.nh-rank-no { color: var(--brand-600); font-size: 15px; font-weight: 700; text-align: center; }
.nh-rank-main { min-width: 0; }
.nh-rank-title { color: var(--qt-text-strong); font-size: 14px; font-weight: 600; text-decoration: none; }
.nh-rank-title:hover { color: var(--brand-600); text-decoration: none; }
.nh-rank-summary { margin: 4px 0 0; color: var(--text-muted); font-size: 13px; line-height: 1.55; }
.nh-rank-meta, .nh-ai-meta, .nh-modal-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 6px; }
.nh-hot { color: var(--brand-600); font-size: 12px; font-weight: 600; }
.nh-chip-row { display: inline-flex; align-items: center; gap: 4px; flex-wrap: wrap; margin-top: 6px; }
.nh-chip {
  padding: 2px 6px; border-radius: var(--r-full); background: var(--qt-surface-sunken);
  border: 1px solid var(--qt-border-soft); color: var(--text-muted); font-size: 11px;
}
.nh-more { margin-top: 12px; }
.nh-ai-list { display: grid; gap: 8px; }
.nh-ai-item {
  display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 10px;
  padding: 12px; background: var(--qt-surface); border: 1px solid var(--border);
  border-radius: var(--r-md); cursor: pointer; transition: border-color .12s ease, background .12s ease;
}
.nh-ai-item:hover { border-color: var(--brand-500); background: var(--qt-surface-hover); }
.nh-ai-rank {
  display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px;
  border-radius: 50%; background: var(--brand-100); color: var(--brand-700);
  border: 1px solid var(--brand-200); font-size: 14px; font-weight: 700;
}
.nh-ai-title { margin: 0; color: var(--qt-text-strong); font-size: 15px; font-weight: 700; }
.nh-ai-summary { margin: 5px 0 0; color: var(--text-muted); font-size: 13px; line-height: 1.6; }
.nh-admin {
  position: sticky; top: 16px; align-self: start; padding: 16px;
  background: var(--qt-surface); border: 1px solid var(--border); border-radius: var(--r-md);
  box-shadow: var(--sh-1);
}
.nh-admin-head, .nh-admin-stream-head, .nh-admin-actions {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.nh-admin-head { justify-content: space-between; align-items: flex-start; }
.nh-admin-head h2 { margin: 0 0 4px; color: var(--qt-text-strong); font-size: 16px; }
.nh-admin-controls { margin-top: 16px; }
.nh-field { display: grid; gap: 6px; color: var(--text-muted); font-size: 12px; }
.nh-field select {
  min-height: 32px; padding: 5px 9px; font: inherit; color: var(--text);
  background: var(--bg); border: 1px solid var(--border-strong); border-radius: var(--r-sm);
}
.nh-admin-actions { margin-top: 10px; }
.nh-admin-actions .btn { flex: 1 1 auto; justify-content: center; }
.nh-admin-stream { margin-top: 16px; border-top: 1px solid var(--qt-border-soft); padding-top: 12px; }
.nh-admin-stream-head { color: var(--text-muted); font-size: 12px; }
.nh-admin-output {
  min-height: 180px; max-height: 360px; overflow: auto; white-space: pre-wrap;
  overflow-wrap: anywhere; margin: 10px 0 0; padding: 12px;
  background: var(--qt-surface-sunken); border: 1px solid var(--qt-border-soft);
  border-radius: var(--r-sm); color: var(--text); font: 12.5px/1.7 "Cascadia Mono", Consolas, monospace;
}
.nh-icon-btn {
  padding: 4px 8px; color: var(--text-muted); background: transparent; border: 1px solid var(--border);
  border-radius: var(--r-sm); cursor: pointer; font: inherit; font-size: 12px;
}
.nh-icon-btn:hover { color: var(--text); background: var(--qt-surface-hover); }
.nh-modal {
  width: min(760px, calc(100% - 24px)); max-height: min(82vh, 760px); padding: 0;
  color: var(--text); background: var(--qt-surface); border: 1px solid var(--border);
  border-radius: var(--r-lg); box-shadow: var(--sh-2);
}
.nh-modal::backdrop { background: var(--qt-overlay); }
.nh-modal-inner { padding: 20px; overflow: auto; max-height: inherit; }
.sm-article-modal {
  width: min(1120px, calc(100vw - 32px));
  max-width: calc(100vw - 32px);
  height: min(90vh, 900px);
  max-height: 90vh;
}
.sm-article-modal[data-window="full"] {
  width: calc(100vw - 24px);
  max-width: calc(100vw - 24px);
  height: calc(100vh - 24px);
  max-height: calc(100vh - 24px);
}
.sm-article-modal .nh-modal-inner { padding: 0 20px 20px; overflow-x: hidden; overflow-y: auto; }
.sm-article-modal .nh-modal-head {
  position: sticky; top: 0; z-index: 1; padding: 18px 0 12px;
  background: var(--qt-surface); border-bottom: 1px solid var(--border);
}
.sm-article-modal-window-actions { display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.sm-article-modal .nh-modal-meta { margin-top: 8px; }
.sm-article-modal-detail.ct-detail-inner { padding: 0 0 8px; max-width: none; }
.sm-article-modal .ct-body { margin-top: 14px; }
.sm-article-modal .ct-body img,
.sm-article-modal .ct-html img,
.sm-article-modal .ct-media img {
  max-width: 100%; width: auto; height: auto; display: block;
}
.sm-article-scroll { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.sm-article-modal .ct-html table,
.sm-article-modal .ct-body table { width: auto; max-width: none; border-collapse: collapse; }
.sm-article-modal .ct-html pre,
.sm-article-modal .ct-body pre { max-width: 100%; overflow-x: auto; white-space: pre; }
.sm-article-modal-actions { min-height: 28px; }
.nh-modal-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.nh-modal-head h2 { margin: 0; color: var(--qt-text-strong); font-size: 18px; }
.nh-modal-summary { color: var(--text); line-height: 1.8; }
.nh-related-list { margin: 8px 0 0; padding-left: 20px; }
.nh-related-item { margin: 0 0 10px; padding-left: 4px; }
.nh-related-title { color: var(--qt-text-strong); font-weight: 600; text-decoration: none; }
.nh-related-title:hover { color: var(--brand-600); }
.nh-admin-open { margin-left: 4px; }
.nh-admin-open[hidden] { display: none !important; }
@media (max-width: 980px) {
  .nh-layout.is-admin-open { grid-template-columns: minmax(0, 1fr); }
  .nh-admin:not(.is-open) { display: none !important; }
  .nh-admin {
    position: fixed; top: 0; right: 0; bottom: 0; z-index: 50;
    width: min(360px, 92vw); max-height: 100vh; overflow: auto;
    border-radius: 0; border-top: 0; border-bottom: 0;
  }
  .nh-admin-open { display: inline-flex; }
}

@media (max-width: 760px) {
  .nh-wrap { padding: 12px 12px 32px; }
  .nh-tabs { margin-bottom: 12px; }
  .nh-source-layout { grid-template-columns: minmax(0, 1fr); }
  .nh-card { padding: 12px; }
  .nh-ai-item { grid-template-columns: 32px minmax(0, 1fr); padding: 10px; }
  .nh-ai-rank { width: 26px; height: 26px; font-size: 12px; }
  .nh-modal-inner { padding: 14px; }
  .sm-article-modal .nh-modal-inner { padding: 0 14px 16px; }
  .sm-article-modal .nh-modal-head { padding-top: 14px; align-items: flex-start; }
  .sm-article-modal-window-actions { flex-wrap: wrap; justify-content: flex-end; }
}
@media (prefers-reduced-motion: reduce) {
  .nh-ai-item, .nh-tab, .nh-source-tab { transition: none; }
}


/* ==========================================================================
   资讯研报子栏目头部规范化（T-101）
   三个页面的标题、说明、状态、操作和内容起始间距使用同一套约定。
   ========================================================================== */
.info-head-main {
  display: flex; align-items: baseline; gap: 8px; min-width: 0; flex-wrap: wrap;
}
.info-head-main .channel-title::before { content: none; }
.info-subtitle { color: var(--qt-text-muted); font-size: 13px; line-height: 1.4; }
.info-head-status {
  display: inline-flex; align-items: center; gap: 12px; min-width: 0;
  flex-wrap: wrap; color: var(--qt-text-muted); font-size: 13px;
}
.info-head-actions { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.info-toolbar { min-height: 44px; }
.info-status { color: var(--qt-text-muted); font-size: 13px; }
.info-content { padding-top: 16px; }
.ct-wrap.info-content { padding-top: 0; }
.ct-wrap.info-content > .info-toolbar:first-child { padding-top: 16px; }
.sm-wrap.info-content { padding-top: 16px; }
.sm-wrap.info-content > .info-toolbar { padding-top: 0; }
.nh-wrap.info-content { padding-top: 16px; }

@media (max-width: 768px) {
  .info-head-main, .info-head-status, .info-head-actions { width: 100%; }
  .info-head-actions { justify-content: flex-end; }
  .nh-ai-settings { justify-content: flex-end; }
  .nh-ai-thinking-select { max-width: 100%; }
  .info-content, .nh-wrap.info-content, .sm-wrap.info-content { padding-top: 12px; }
  .ct-wrap.info-content > .info-toolbar:first-child { padding-top: 12px; }
}

/* 7x24 电报 AI 分析弹窗 */
.content-ai-overlay { position: fixed; inset: 0; z-index: 160; display: flex; align-items: center; justify-content: center; padding: 24px; }
.content-ai-overlay[hidden] { display: none; }
.content-ai-backdrop { position: absolute; inset: 0; background: var(--qt-overlay); border: 0; }
.content-ai-dialog { position: relative; width: min(720px, calc(100vw - 48px)); max-height: calc(100vh - 48px); overflow: auto; padding: 18px; background: var(--qt-surface-raised); border: 1px solid var(--qt-border); border-radius: var(--r-lg); box-shadow: var(--sh-2); color: var(--qt-text); }
.content-ai-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.content-ai-head h2 { margin: 0; color: var(--qt-text-strong); font-size: 18px; }
.content-ai-meta { display: block; margin-top: 4px; color: var(--qt-text-muted); font-size: 11.5px; }
.content-ai-item-title { margin: 14px 0 0; color: var(--qt-text-strong); font-size: 14px; line-height: 1.6; }
.content-ai-status { margin-top: 12px; padding: 8px 10px; color: var(--qt-text); background: var(--qt-warning-soft); border: 1px solid var(--qt-warning); border-radius: var(--r-sm); font-size: 12px; }
.content-ai-status.is-error { color: var(--qt-important-text); background: var(--brand-50); border-color: var(--brand-300); }
.content-ai-status.is-ok { color: var(--qt-text); background: var(--qt-surface-muted); border-color: var(--qt-border-soft); }
.content-ai-result { min-height: 180px; margin-top: 12px; padding: 12px; color: var(--qt-text); background: var(--qt-surface-sunken); border: 1px solid var(--qt-border-soft); border-radius: var(--r-sm); white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.75; }
.content-ai-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 14px; }
.content-ai-overlay .watchlist-icon-button { width: 32px; height: 32px; }
.ct-ai-act { margin-left: 4px; }