/* 玻璃基差回归交易系统 - 浏览器版样式
   ------------------------------------------------------------------
   主题: 默认浅色; <html data-theme="dark"> 切深色(顶栏「主题」按钮切换, 服务端持久化)。
   ★全部颜色走 CSS 变量(一处定义两套值): 新增元素直接引用变量即自动适配, 避免
   "深色下漏改某个选择器 -> 白底黑字/黑底黑字"。深色只覆盖变量, 不重复选择器。
   红涨绿跌为国内习惯: --up=红(涨) --down=绿(跌)。 */
:root {
  /* 底色 / 卡片 */
  --bg: #f0f2f5;
  --card: #fff;
  --card-shadow: 0 1px 3px rgba(0,0,0,.08);
  --topbar-shadow: 0 1px 4px rgba(0,0,0,.08);
  --soft: #fafafa;          /* 浅灰区(回测控制条/表头) */
  --soft2: #f7f9fc;         /* 悬停底 */
  --soft3: #fafbfc;         /* 内嵌页头 */
  --chip: #f2f4f7;          /* 小徽标底 */
  --chart-bg: #fff;         /* 图表容器底(回测图) */

  /* 文字 */
  --fg: #333;
  --fg2: #555;
  --fg3: #888;
  --fg3b: #999;
  --fg4: #aaa;

  /* 线 / 边框 */
  --line: #eee;
  --line-soft: #f0f0f0;
  --line2: #ddd;
  --input-bd: #ccc;
  --btn-bd: #ccc;
  --btn-hover: #f5f5f5;

  /* 主色 */
  --accent: #1f77b4;        /* 选中/标签蓝 */
  --link: #1a5fb4;          /* 链接蓝 */
  --purple: #9467bd;
  --primary: #1a7f37;       /* 主按钮绿 */
  --primary-fg: #fff;
  --danger: #c62828;
  --danger-bd: #e0b4b4;
  --neutral: #7f7f7f;
  --bear: #1565c0;          /* 熊市蓝标 */
  --live-blue: #1565c0;     /* v50 交易窗口「实盘交易」页签选中态(蓝底) */
  --up: #d62728;            /* 涨(红) */
  --down: #2ca02c;          /* 跌(绿) */
  --live-line: #1565c0;     /* 日线走势"实时价格线"(中性蓝: 与红涨绿跌区分, 不暗示方向) */
  --grid: #e8ecf3;          /* 图表十字方格背景线(主图/副图统一: 细虚线, 便于定位价格) */
  --warn-fg: #b26a00;

  /* 语义底色块(提醒条 / 角标 / 徽标) */
  --tint-red-bg: #fdecea;   --tint-red-fg: #c62828;   --tint-red-bd: #f5c6c2;
  --tint-green-bg: #e8f5e9; --tint-green-fg: #1a7f37; --tint-green-bd: #bfe3c9;
  --tint-gold-bg: #fffbe9;  --tint-gold-fg: #b8860b;  --tint-gold-bd: #e6cf8b;
  --tint-blue-bg: #f2f7ff;  --tint-blue-fg: #1a5fb4;  --tint-blue-bd: #d6e4ff;
  --tint-amber-bg: #fff7e6; --tint-amber-fg: #d46b08;
  --mask: rgba(0,0,0,.45);
}

html[data-theme="dark"] {
  --bg: #14171c;
  --card: #1c2028;
  --card-shadow: 0 1px 3px rgba(0,0,0,.55);
  --topbar-shadow: 0 1px 4px rgba(0,0,0,.5);
  --soft: #191d24;
  --soft2: #232a34;
  --soft3: #1a1e25;
  --chip: #262c36;
  --chart-bg: #1c2028;

  --fg: #d5dae2;
  --fg2: #aab3be;
  --fg3: #8b949f;
  --fg3b: #7d8792;
  --fg4: #67707b;

  --line: #2a2f38;
  --line-soft: #242932;
  --line2: #343b46;
  --input-bd: #3b434f;
  --btn-bd: #3b434f;
  --btn-hover: #262d37;

  --accent: #4d9fe0;
  --link: #5aa9e6;
  --purple: #b18ae0;
  --primary: #2e9e57;
  --primary-fg: #fff;
  --danger: #ef6b6b;
  --danger-bd: #6b3a3a;
  --neutral: #8a8f96;
  --bear: #4a90d9;
  --live-blue: #2f6fd0;     /* v50 实盘页签蓝底(深色下提亮) */
  --up: #ff5a5a;
  --down: #2fc98a;
  --live-line: #58a6ff;     /* 实时价格线(深色下提亮, 避免暗蓝在深底上发闷) */
  --grid: #2b323d;          /* 图表十字方格线(深色下比 --line 略亮, 方格才看得见) */
  --warn-fg: #e8a33c;

  --tint-red-bg: #3a1e20;   --tint-red-fg: #ff9292;   --tint-red-bd: #5c2f31;
  --tint-green-bg: #14302a; --tint-green-fg: #4fd6a0; --tint-green-bd: #2a5a4a;
  --tint-gold-bg: #332912;  --tint-gold-fg: #e6c46a;  --tint-gold-bd: #5c4a22;
  --tint-blue-bg: #16273a;  --tint-blue-fg: #7bb8f0;  --tint-blue-bd: #2a4460;
  --tint-amber-bg: #33280f; --tint-amber-fg: #f0a83c;
  --mask: rgba(0,0,0,.6);
}

/* 深色滚动条(WebView2 即 Chromium, ::-webkit-scrollbar 有效; 否则深色页面里挂白条) */
html[data-theme="dark"] ::-webkit-scrollbar { width: 10px; height: 10px; }
html[data-theme="dark"] ::-webkit-scrollbar-track { background: #1a1e25; }
html[data-theme="dark"] ::-webkit-scrollbar-thumb { background: #3a424d; border-radius: 5px; }
html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #4a535f; }

* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body {
  font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
  background: var(--bg); color: var(--fg); font-size: 13px;
  display: flex; flex-direction: column; min-height: 100vh;
}

/* ---------- 顶栏 ---------- */
/* 小窗口也保持一行: 禁止换行, 允许收缩, 长文本省略号(不再把状态区挤到第二行) */
#topbar {
  background: var(--card); padding: 6px 10px; display: flex; align-items: center;
  gap: 10px; flex-wrap: nowrap; box-shadow: var(--topbar-shadow); z-index: 5;
  min-width: 0;
}
.brand { font-size: 14px; font-weight: 700; white-space: nowrap; flex: 0 0 auto; }
.tools { display: flex; align-items: center; gap: 5px; flex-wrap: nowrap; flex: 0 0 auto; }
.cap { color: var(--fg2); margin-left: 8px; white-space: nowrap; }
.cap input { width: 88px; padding: 3px 6px; border: 1px solid var(--input-bd);
  border-radius: 4px; background: var(--card); color: var(--fg); }
.stats { display: flex; align-items: center; gap: 8px; margin-left: auto;
  flex-wrap: nowrap; min-width: 0; }
.stat { color: var(--fg2); white-space: nowrap; min-width: 0; flex: 0 1 auto;
  overflow: hidden; text-overflow: ellipsis; }
#structureBadge, #btnUser, #btnTheme { flex: 0 0 auto; }
.stat.rp { font-weight: 700; }
.badge { padding: 3px 12px; border-radius: 12px; color: #fff; font-weight: 700; font-size: 12px; }
.badge.bull { background: var(--up); }
.badge.bear { background: var(--bear); }
.badge.neutral { background: var(--neutral); }

/* 窄窗口: 再压一档字号/内边距, 保证一行放得下 */
@media (max-width: 1400px) {
  #topbar { padding: 5px 8px; gap: 8px; }
  .brand { font-size: 13px; }
  .btn { padding: 4px 9px; font-size: 11.5px; }
  .btn.small { padding: 3px 7px; font-size: 11px; }
  .badge { font-size: 11px; padding: 3px 9px; }
  .stat { font-size: 12px; }
  .stats { gap: 6px; }
}
@media (max-width: 1220px) {
  .brand { font-size: 12px; }
  .btn { padding: 4px 7px; font-size: 11px; }
  .btn.small { padding: 3px 6px; font-size: 10.5px; }
}

/* ---------- 按钮 ---------- */
.btn {
  padding: 5px 12px; border: 1px solid var(--btn-bd); border-radius: 4px;
  background: var(--card); color: var(--fg);
  cursor: pointer; font-size: 12px;
}
.btn:hover:not(:disabled) { background: var(--btn-hover); }
.btn:disabled { opacity: .45; cursor: not-allowed; }
.btn.primary { background: var(--primary); border-color: var(--primary);
  color: var(--primary-fg); font-weight: 700; }
.btn.primary:disabled { opacity: .45; }
.btn.danger { color: var(--danger); border-color: var(--danger-bd); }
.btn.small { padding: 3px 9px; }
.btn.small.active { background: var(--accent); border-color: var(--accent); color: #fff; }

/* ---------- 主体 ---------- */
main { flex: 1; display: flex; gap: 8px; padding: 8px; min-height: 0; overflow-y: auto; }
.card {
  background: var(--card); border-radius: 8px; box-shadow: var(--card-shadow);
  padding: 8px 10px; display: flex; flex-direction: column;
}
#bigPanel { flex: 3.2; min-width: 0; overflow-y: auto; }
#tierPanel { flex: 1; min-width: 300px; max-width: 380px;
  display: flex; flex-direction: column; gap: 8px; overflow-y: auto; }
#tierCards { display: flex; flex-direction: column; gap: 8px; }

/* ---------- 产业实时动态窗口 ---------- */
.news-card { flex: 1 1 auto; min-height: 180px; }
.news-card .panel-head { margin-bottom: 2px; }
.news-more { font-size: 12px; color: var(--accent); text-decoration: none; }
.news-more:hover { text-decoration: underline; }
.news-ts { font-size: 11px; color: var(--fg4); font-family: Consolas, monospace; }
.news-list { flex: 1; overflow-y: auto; min-height: 140px; }
.news-item { display: flex; align-items: baseline; gap: 6px; padding: 4px 2px;
  border-bottom: 1px dashed var(--line-soft); color: var(--fg); text-decoration: none;
  font-size: 12px; line-height: 1.5; }
.news-item:hover { background: var(--soft2); }
.news-item.is-new { background: var(--tint-amber-bg); }
.news-item.is-new .nt { color: var(--tint-amber-fg); font-weight: 700; }
.news-item .nt { color: var(--fg3b); flex: 0 0 78px; font-size: 11px;
  font-family: Consolas, monospace; }
.news-item .ni { flex: 1; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; }
.news-empty { color: var(--fg4); font-size: 12px; }
.panel-head { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; }
.panel-head b { font-size: 13px; }
.spacer { flex: 1; }
.dim { color: var(--fg3b); }
.tier-radios label { margin-right: 8px; cursor: pointer; }
.tier-radios input { vertical-align: -2px; }
.tier-radios .checked { color: var(--accent); font-weight: 700; }
/* 回测系列按钮组(盘面回测模式显示) */
.bt-sym-wrap { display: inline-flex; align-items: center; gap: 5px; }
/* 技术指标切换下拉(MACD/SAR) */
#indSel {
  padding: 2px 6px; border: 1px solid var(--input-bd); border-radius: 4px;
  font-size: 12px; background: var(--card); color: var(--fg); cursor: pointer;
}
#btSeriesBtns { display: inline-flex; align-items: center; gap: 4px; }
/* 回测明细中可点击的合约代码 */
.bt-sym-link { color: var(--accent); cursor: pointer; text-decoration: underline dotted; }
.bt-sym-link:hover { font-weight: 700; }

/* ---------- 图表 ---------- */
/* 主图占剩余空间(不与基差窗口争高度), 基差窗口固定高度, 互不重叠;
   min-height 保证小屏下基差/技术指标两个固定窗口不会把主图压缩消失,
   高度不够时 main 容器滚动(下方媒体查询同时缩小固定窗口高度) */
.chart-lg { flex: 1 1 0; min-height: 280px; height: auto; overflow: hidden; }
.basis-head { display: flex; align-items: baseline; gap: 8px; margin-top: 6px;
  border-top: 1px dashed var(--line2); padding-top: 6px; }
.basis-head b { font-size: 12.5px; }
.basis-head .sym-tag { margin-left: auto; color: var(--purple); font-weight: 700; }
.chart-sm { flex: 0 0 190px; height: 190px; overflow: hidden; }
/* MACD 日线副图窗口(基差窗口下方) */
#macdChart { flex: 0 0 170px; height: 170px; overflow: hidden; }

/* 矮屏(笔记本/小窗): 缩小两个固定高度副图, 给主图让空间 */
@media (max-height: 820px) {
  .chart-sm { flex-basis: 150px; height: 150px; }
  #macdChart { flex-basis: 130px; height: 130px; }
}
@media (max-height: 700px) {
  .chart-sm { flex-basis: 120px; height: 120px; }
  #macdChart { flex-basis: 110px; height: 110px; }
  .chart-lg { min-height: 240px; }
}

/* ---------- 监控小窗口 ---------- */
.tier-card { border-left: 4px solid var(--btn-bd); }
.tier-card.tradeable { border-left-color: var(--primary); }
.tier-head { display: flex; align-items: baseline; gap: 8px; }
.tier-head .sym { color: var(--accent); font-weight: 700; font-size: 14px; }
.tier-head .name { color: var(--fg3); font-size: 11px; }
.tier-head .basis { margin-left: auto; font-weight: 700; }
.basis.pos { color: var(--up); }
.basis.neg { color: var(--down); }
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 10px; margin: 5px 0; }
.grid2 .k { color: var(--fg3); }
.grid2 .v { font-weight: 700; text-align: right; }
.v.up { color: var(--up); }
.v.down { color: var(--down); }
.signal { padding: 2px 8px; border-radius: 3px; background: var(--chip); font-size: 12px; }
.signal.hot { background: var(--tint-red-bg); color: var(--tint-red-fg); font-weight: 700; }
.signal.pos-open { background: var(--tint-green-bg); color: var(--tint-green-fg); font-weight: 700; }
.tail-line { display: block; font-size: 11px; color: var(--warn-fg); font-weight: 600; }
.fills { font-family: Consolas, monospace; font-size: 11px; color: var(--fg2);
  max-height: 92px; overflow-y: auto; border-top: 1px dashed var(--line); padding-top: 4px; }
.fills .open-long  { color: var(--up); }
.fills .open-short { color: var(--down); }
.fills .close-long { color: var(--down); }
.fills .close-short{ color: var(--up); }

/* ---------- 盘口报价面板(v35/v36) ----------
   v36: 从"仿文华黑底窗"改为与其它 .card 同色系(用户反馈黑底与整体浅色界面不搭),
   红涨绿跌沿用 --up/--down 变量, 深色主题下自动切换为亮红/亮绿。 */
#depthPanel { flex: 0 0 auto; }
#depthPanel .depth-head { cursor: pointer; user-select: none; margin-bottom: 2px; }
/* v38: 标签独立成行, 四档等宽铺满(窄栏 250px 也不折行) */
#depthTabs { display: flex; gap: 4px; padding: 2px 10px 4px; }
#depthTabs .depth-tab { flex: 1; padding: 2px 4px; font-size: 11px; text-align: center; }
/* 显式压过 .btn.small.active(特异性 0,3,0): 用 #depthTabs 前缀提到 1,2,0 */
#depthTabs .depth-tab.active { background: var(--accent); border-color: var(--accent);
  color: #fff; font-weight: 700; }
.depth-sym { color: var(--fg3); font-size: 11px; font-family: Consolas, monospace; }
#depthFold { color: var(--fg3); font-size: 12px; }
.depth-table { width: 100%; border-collapse: collapse; font-size: 12.5px;
  line-height: 1.75; font-family: Consolas, "Microsoft YaHei", monospace;
  table-layout: fixed; }
/* ★v65 固定 5 列宽: 首行(卖出|价|量|涨跌|值)定义列, 其余行值跨第2+3列。
   数值列预留足够位数(总量 269,434 / 持仓 1,527,816 / 时间 21:44:05 都放得下),
   超宽 hidden 截断 —— 永不撑动右侧内容。 */
.depth-table col.c1 { width: 15%; }
.depth-table col.c2 { width: 24%; }
.depth-table col.c3 { width: 17%; }
.depth-table col.c4 { width: 15%; }
.depth-table col.c5 { width: 29%; }
.depth-table .dl { color: var(--fg3); white-space: nowrap; padding-right: 6px; }
.depth-table .dv-cell { color: var(--fg); font-weight: 600;
  white-space: nowrap; overflow: hidden; }
/* ★v66 「最新」置顶行: 标签字号与其它项目一致(不放大), 只有价格数字放大加粗,
   做重点显示; 行底加分隔线, 与下方盘口细项区分开。 */
.depth-table .depth-last-row td { border-bottom: 1px solid var(--line);
  padding-bottom: 3px; }
.depth-table .depth-last-row .dl { font-size: 12.5px; }
.depth-table .depth-last-price { color: var(--fg); font-weight: 700;
  font-size: 23px; line-height: 1.28; letter-spacing: .5px;
  white-space: nowrap; overflow: hidden; }
.depth-table .depth-last-price span { font-size: inherit; font-weight: inherit; }
.dp-up { color: var(--up); }
.dp-dn { color: var(--down); }
.dp-flat { color: var(--fg); }
.dp-time { color: var(--accent); font-weight: 400; }
.depth-empty { color: var(--fg4); font-size: 12px; padding: 14px 0 10px; text-align: center; }

/* ---------- 底部日志 ---------- */
footer.card { margin: 0 8px 8px; flex: 0 0 150px; }
#logBox { overflow-y: auto; font-family: Consolas, monospace; font-size: 11.5px;
  flex: 1; line-height: 1.55; }
#logBox .info { color: var(--fg); }
#logBox .warn { color: var(--warn-fg); }
#logBox .err  { color: var(--danger); }
#logBox .buy  { color: var(--up); font-weight: 700; }
#logBox .sell { color: var(--down); font-weight: 700; }

/* ============ 开仓阈值设置弹窗 ============ */
.modal{position:fixed;inset:0;background:var(--mask);display:flex;
       align-items:center;justify-content:center;z-index:100}
.modal.hidden{display:none}
.modal-box{width:min(640px,92vw);padding:14px 18px 12px}
.thr-grid{display:flex;gap:24px;margin:12px 0 10px;flex-wrap:wrap}
.thr-col{flex:1 1 240px;display:flex;flex-direction:column;gap:8px}
.thr-title{font-weight:700;font-size:13px;padding:4px 8px;border-radius:4px}
.thr-title.bear{background:var(--tint-red-bg);color:var(--tint-red-fg)}
.thr-title.bull{background:var(--tint-green-bg);color:var(--tint-green-fg)}
.thr-col label{display:flex;align-items:center;justify-content:space-between;
               gap:10px;font-size:13px}
.thr-col input{width:110px;padding:4px 8px;border:1px solid var(--input-bd);
               border-radius:4px;font-size:13px;text-align:right;
               background:var(--card);color:var(--fg)}
.thr-foot{display:flex;align-items:center;gap:10px;border-top:1px solid var(--line);
          padding-top:10px}

/* ============ 策略回测弹窗 ============ */
.modal-wide{width:min(1120px,95vw);max-height:92vh;overflow:auto}
.bt-controls{display:flex;align-items:center;gap:14px;flex-wrap:wrap;
             margin:10px 0 6px;padding:8px 10px;background:var(--soft);border-radius:6px}
.bt-controls label{display:flex;align-items:center;gap:6px;font-size:13px}
.bt-controls input{padding:4px 8px;border:1px solid var(--input-bd);border-radius:4px;
                   font-size:13px;background:var(--card);color:var(--fg)}
#btStatus{font-size:12px;color:var(--fg3);max-width:340px;overflow:hidden;
          text-overflow:ellipsis;white-space:nowrap}
.bt-results{margin-top:6px}
.bt-results.hidden{display:none}
.bt-cards{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0}
.bt-card{background:var(--soft);border-radius:6px;padding:8px 14px;flex:1 1 110px;text-align:center}
.bt-card .k{font-size:11px;color:var(--fg3)}
.bt-card .v{font-size:19px;font-weight:700;margin-top:2px}
.bt-chart{height:300px;background:var(--chart-bg);border:1px solid var(--line);
          border-radius:6px;margin-bottom:8px}
.bt-chart-sm{height:170px;background:var(--chart-bg);border:1px solid var(--line);
             border-radius:6px;margin-bottom:8px}
.bt-charts-row{display:flex;gap:8px}
.bt-chart-half{flex:1;height:230px;background:var(--chart-bg);border:1px solid var(--line);
               border-radius:6px}
.bt-trades{margin-top:10px;font-size:13px}
.bt-table-wrap{max-height:320px;overflow:auto;margin-top:6px;border:1px solid var(--line);
               border-radius:6px}
.bt-trades table{width:100%;border-collapse:collapse;font-size:12px;background:var(--card)}
.bt-trades th,.bt-trades td{padding:5px 8px;border-bottom:1px solid var(--line);
                            text-align:center;white-space:nowrap}
.bt-trades th{background:var(--soft);position:sticky;top:0}

/* ---------- 会员登录入口(顶栏右侧) ---------- */
.user-chip { color: var(--primary); border-color: var(--tint-green-bd); font-weight: 700; }
.user-chip.vip { color: var(--tint-gold-fg); border-color: var(--tint-gold-bd);
  background: var(--tint-gold-bg); }
/* 登录/注册弹窗: APP 内自建表单(对接玻璃观察网用户体系, 见 index.html 注释) */
.login-box { width: min(400px, 92vw); }
.btn.lg { display: block; width: 100%; padding: 11px 0; font-size: 14px;
  margin-bottom: 8px; }
.wx-btn { background: var(--tint-green-bg); border-color: var(--tint-green-bd);
  color: var(--tint-green-fg); }
.wx-btn:disabled, .wx-btn[title] { opacity: .62; }
/* 登录/注册标签页 */
.login-tabs { display: flex; gap: 4px; margin: 8px 0 4px;
  border-bottom: 1px solid var(--line); }
.login-tabs .ltab { flex: 1; padding: 8px 0; border: 0; background: none;
  cursor: pointer; font-size: 13px; color: var(--fg2);
  border-bottom: 2px solid transparent; }
.login-tabs .ltab.active { color: var(--link); font-weight: 700;
  border-bottom-color: var(--link); background: var(--tint-blue-bg); }
.lpane { padding-top: 4px; }
.lpane.hidden { display: none; }   /* 注意: 全局只有 .modal.hidden, 这里必须单独定义 */
.login-box label { display: block; margin: 9px 0 4px; color: var(--fg2); font-size: 12px; }
.login-box input { width: 100%; padding: 8px 10px; border: 1px solid var(--input-bd);
  border-radius: 4px; font-size: 13px; box-sizing: border-box;
  background: var(--card); color: var(--fg); }
.login-box input:focus { border-color: var(--link); outline: none; }
.login-msg { min-height: 18px; margin-top: 7px; color: var(--danger); font-size: 12px;
  line-height: 1.5; }
.login-msg.ok { color: var(--primary); }
.login-note { margin: 10px 0 0; padding-top: 8px; border-top: 1px dashed var(--line);
  line-height: 1.7; font-size: 12px; }

/* ---------- 我的会员面板(v19: 站点窗口登录 + APP会员权益 + 设备绑定) ----------
   注意: 全局只有 .modal.hidden 一条隐藏规则, 普通 div 的 .hidden 必须逐个补,
   否则子面板会全部叠着显示(踩过坑)。 */
.member-box { width: min(660px, 94vw); max-height: 90vh; overflow: auto; }
.mguest { text-align: center; padding: 6px 4px 2px; }
.mguest.hidden { display: none; }
.mguest-ico { font-size: 40px; line-height: 1; margin: 6px 0 4px; }
.mguest h3 { margin: 0 0 6px; font-size: 16px; }
.mguest p { font-size: 12.5px; color: var(--fg2); line-height: 1.75; margin: 6px 0 12px; }
.muser.hidden { display: none; }
.mcard { border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px;
  margin-top: 10px; background: var(--soft); }
.mcard-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.mcard-top .dim { font-size: 11.5px; color: var(--fg3b); }
.mavatar { font-size: 20px; }
.mwho { display: flex; align-items: center; gap: 6px; font-size: 15px; }
.mtag { font-style: normal; font-size: 11px; color: var(--fg3); border: 1px solid var(--line2);
  border-radius: 10px; padding: 1px 8px; background: var(--chip); }
.mtag.on { color: var(--tint-gold-fg); border-color: var(--tint-gold-bd);
  background: var(--tint-gold-bg); font-weight: 700; }
.mrows { margin-top: 8px; display: flex; flex-direction: column; gap: 5px; }
.mrow { display: flex; align-items: baseline; gap: 10px; font-size: 12.5px; }
.mrow span { flex: 0 0 100px; color: var(--fg3); }
.mrow b { font-weight: 600; color: var(--fg); word-break: break-all; }
.mnote { margin-top: 8px; font-size: 12px; color: var(--warn-fg); line-height: 1.6; }
.mplans { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.mplan { border: 1px solid var(--line); border-radius: 7px; padding: 8px 10px;
  background: var(--card); }
.mplan-h { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.mplan-p { font-style: normal; color: var(--danger); font-weight: 700; }
.mplan-r { margin-top: 5px; display: flex; gap: 6px; flex-wrap: wrap; }
.mplan-r i { font-style: normal; font-size: 11px; color: var(--tint-blue-fg);
  background: var(--tint-blue-bg); border: 1px solid var(--tint-blue-bd);
  border-radius: 3px; padding: 1px 6px; }
.mplan-m { margin-top: 4px; font-size: 11.5px; color: var(--fg3b); }
.mrebind { margin-top: 12px; border: 1px solid var(--tint-gold-bd); background: var(--tint-gold-bg);
  border-radius: 8px; padding: 10px 12px; }
/* v30: 换绑确认独占面板(登录区隐藏)时, 放大居中提示 */
#memberModal .mrebind:not(.hidden) { margin: 18px auto 6px; max-width: 460px; text-align: center;
  padding: 18px 20px; box-shadow: 0 4px 18px rgba(184,134,11,.12); }
#memberModal .mrebind:not(.hidden) .mrebind-b { justify-content: center; }
.mrebind.hidden { display: none; }
.mrebind-t b { color: var(--tint-gold-fg); }
.mrebind-t p { margin: 5px 0 0; font-size: 12.5px; line-height: 1.7; }
.mrebind-b { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
/* 资讯条目 VIP 角标(非VIP时显示, 提示详情需VIP) */
.news-item .nv { margin-left: auto; flex: 0 0 auto; font-size: 9px; color: var(--tint-gold-fg);
  border: 1px solid var(--tint-gold-bd); border-radius: 3px; padding: 0 3px;
  background: var(--tint-gold-bg); align-self: center; }

/* ---------- 内嵌网页遮罩(原生站点面板不可用时的兜底) ----------
   铺满 APP 内容区(顶栏以下), 与原生站点面板同一观感。 */
.embed-overlay { align-items: stretch; padding: 60px 0 0; }
/* #embedOverlay 的 class 是 "modal hidden embed-overlay" —— 本类在文件更靠后,
   若将来有人给 .embed-overlay 加上 display, 就会盖掉 .modal.hidden; 这里显式兜一道。 */
.embed-overlay.hidden { display: none; }
.embed-box { flex: 1; background: var(--card); overflow: hidden;
  display: flex; flex-direction: column; box-shadow: 0 6px 30px rgba(0,0,0,.25); }
.embed-head { display: flex; align-items: center; gap: 10px; padding: 8px 12px;
  border-bottom: 1px solid var(--line); background: var(--soft3); }
.embed-frame { flex: 1; border: 0; width: 100%; background: var(--card); }
.bt-note{font-size:11px;color:var(--fg3b);line-height:1.7}

.sl-label{display:flex;align-items:center;gap:6px;font-size:13px;white-space:nowrap}
.sl-label input{width:64px;padding:4px 8px;border:1px solid var(--input-bd);border-radius:4px;
                font-size:13px;text-align:right;background:var(--card);color:var(--fg)}

/* ---------- 主图全屏(专业行情"图表最大化") ---------- */
#bigPanel.fs {
  position: fixed; inset: 0; z-index: 60; border-radius: 0;
  background: var(--bg); overflow-y: auto;
}
/* 全屏后 #bigPanel 有确定高度(100vh), 主图 flex:1 自动放大, 无需额外高度 */

/* ===== 轻提示浮层(右下角, 只告知不阻塞) =====
   替代 window.confirm: 切换基差口径、实盘连接状态变化等"只要提示就行"的场景。
   confirm 会阻塞主线程且必须点掉, 这里 3.2 秒自动消失, 不打断任何操作。
   颜色全走主题变量 -> 深浅色自动适配。 */
.toast-box {
  position: fixed; right: 18px; bottom: 18px; z-index: 9999;
  max-width: 430px; padding: 11px 15px; border-radius: 8px;
  background: var(--card); color: var(--fg);
  border: 1px solid var(--line2); border-left: 3px solid var(--accent);
  box-shadow: 0 6px 22px rgba(0,0,0,.22);
  font-size: 12.5px; line-height: 1.55;
  opacity: 0; transform: translateY(10px);
  transition: opacity .22s, transform .22s;
  pointer-events: none;
}
.toast-box.show { opacity: 1; transform: translateY(0); }
.toast-box.ok   { border-left-color: var(--primary); }
.toast-box.warn { border-left-color: var(--danger); }
.toast-box.info { border-left-color: var(--accent); }

/* ===== 实盘接入窗口 ===== */
.live-body { display: flex; gap: 16px; padding: 4px 0 10px; flex-wrap: wrap; }
.live-col { flex: 1 1 400px; min-width: 320px; }
.live-side { flex: 0 1 300px; }
.live-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px; margin-top: 8px; }
.live-2col label, .live-row { display: block; font-size: 12px; color: var(--fg2); }
.live-2col input, .live-row input, .live-row select, .live-row textarea {
  width: 100%; box-sizing: border-box; margin-top: 3px;
  padding: 5px 7px; font-size: 12px; border-radius: 4px;
  border: 1px solid var(--input-bd); background: var(--card); color: var(--fg);
}
.live-row textarea { resize: vertical; font-family: Consolas, monospace; }
.live-row { margin-bottom: 6px; }
.live-row .dim { font-weight: 400; }
.live-state {
  padding: 10px 12px; border-radius: 6px; background: var(--soft);
  border: 1px solid var(--line); font-size: 12px; line-height: 1.7; color: var(--fg);
}
.live-dot {
  display: inline-block; width: 8px; height: 8px; border-radius: 50%;
  background: var(--neutral); margin-right: 6px; vertical-align: middle;
}
.live-dot.on   { background: var(--primary); }
.live-dot.warn { background: var(--warn-fg); }
.live-tip { font-size: 11.5px; color: var(--fg3); line-height: 1.65; margin: 10px 0 0; }
.live-tip.ok   { color: var(--primary); }
.live-tip.warn { color: var(--danger); }
.live-foot {
  display: flex; align-items: center; gap: 8px; padding-top: 10px;
  border-top: 1px solid var(--line);
}
.live-foot .spacer { flex: 1; }

/* v44 实盘准入(会员权益)状态条: ok=绿色/ warn=红色, 颜色全走主题 tint 变量 */
.live-right {
  padding: 7px 10px; margin-bottom: 8px; border-radius: 6px;
  font-size: 12px; line-height: 1.6;
  background: var(--tint-blue-bg); color: var(--tint-blue-fg);
  border: 1px solid var(--tint-blue-bd);
}
.live-right.ok   { background: var(--tint-green-bg); color: var(--tint-green-fg);
                   border-color: var(--tint-green-bd); }
.live-right.warn { background: var(--tint-red-bg); color: var(--tint-red-fg);
                   border-color: var(--tint-red-bd); }

/* ===== v49 交易窗口分栏 / v50 双页签(模拟交易 / 实盘交易 互斥, 只显示对应配置项) ===== */
.live-tabs {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 2px 0 8px; border-bottom: 1px solid var(--line); margin-bottom: 4px;
}
.live-tab { padding: 4px 14px; font-size: 12.5px; }
/* ★选中的页签整块实心变色(不再是几乎看不出的浅蓝底):
   模拟交易=绿底(练习/安全) · 实盘交易=蓝底(真实报单, 与顶栏熊市蓝同一色系)。 */
.live-tab.active { font-weight: 600; color: #fff; }
.live-tab[data-live-mode="paper"].active {
  background: var(--primary); border-color: var(--primary); color: var(--primary-fg);
}
.live-tab[data-live-mode="ctp"].active {
  background: var(--live-blue); border-color: var(--live-blue); color: #fff;
}
.live-tab:disabled { opacity: .55; cursor: not-allowed; }
#liveStepHint { font-size: 11.5px; margin-left: auto; }
/* ★全局 .hidden 只对 .modal 生效, 普通 div 必须逐个补(见文件末尾同类注释) */
#liveSimFields.hidden, #liveCtpFields.hidden,
#liveRight.hidden, #liveSimReset.hidden, #liveCapitalHint.hidden { display: none; }
/* ★v53 实盘资金口径提示(只在实盘页签显示): 真实资金/预估/资金不足三态 */
.live-cap-hint {
  margin-top: 10px; padding: 8px 10px; font-size: 11.5px; line-height: 1.7;
  background: var(--soft2); border: 1px solid var(--line); border-radius: 5px;
  color: var(--fg2);
}
.live-cap-hint b { color: var(--fg); }
.live-cap-hint.warn { background: var(--tint-amber-bg); border-color: var(--tint-gold-bd); color: var(--tint-amber-fg); }
.live-cap-hint.ok { background: var(--tint-blue-bg); border-color: var(--tint-blue-bd); color: var(--tint-blue-fg); }
.live-cap-hint.danger { background: var(--tint-red-bg); border-color: var(--tint-red-bd); color: var(--tint-red-fg); }
.live-cap-hint.danger b { color: var(--tint-red-fg); }
.live-cap-hint .hint-lack { margin-top: 5px; font-weight: 700; }
.live-cap-hint .hint-ok { margin-top: 5px; color: var(--tint-green-fg); }

/* ===== v52 模拟账户面板(交易窗口 · 模拟交易页签) ===== */
.sim-acct {
  border: 1px solid var(--line); border-radius: 6px; padding: 8px 10px;
  background: var(--soft3); margin: 10px 0 0; font-size: 12px;
}
.sim-head { display: flex; align-items: baseline; gap: 6px; margin-bottom: 6px; }
.sim-head b { font-size: 13px; letter-spacing: .3px; }
.sim-grid {
  display: grid; grid-template-columns: auto 1fr auto 1fr;
  gap: 3px 8px; align-items: baseline;
}
.sim-grid > span { color: var(--fg3); }
.sim-grid > b { color: var(--fg); text-align: right; }
.sim-poslist { margin-top: 7px; padding-top: 6px; border-top: 1px dashed var(--line); }
.sim-pos { font-size: 11.5px; line-height: 1.7; color: var(--fg2); }
.sim-pos.up   { color: var(--up); }
.sim-pos.down { color: var(--down); }
.sim-pos.dim  { color: var(--fg3); }

/* ===== v49 期现配置窗口 ===== */
.hg-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; }
@media (max-width: 980px) { .hg-grid { grid-template-columns: 1fr; } }
.hg-sec {
  border: 1px solid var(--line); border-radius: 6px; padding: 8px 10px 6px;
  background: var(--soft3);
}
.hg-sec h4 {
  margin: 0 0 8px; font-size: 13px; color: var(--fg);
  display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
}
.hg-sec h4 .dim { font-weight: 400; font-size: 11px; }
.hg-tip { font-size: 11px; line-height: 1.6; margin: 6px 0 2px; }
.hg-baserow { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; }
.hg-thr { width: 100%; border-collapse: collapse; font-size: 12px; }
.hg-thr th, .hg-thr td { padding: 4px 6px; text-align: left; border-bottom: 1px solid var(--line-soft); }
.hg-thr th { color: var(--fg3); font-weight: 500; }
.hg-thr input {
  width: 92px; padding: 4px 6px; font-size: 12px; border-radius: 4px;
  border: 1px solid var(--input-bd); background: var(--card); color: var(--fg);
}
/* ★v70 满仓阈值为公式自动计算值 -> 只读展示(灰底、不可编辑) */
.hg-thr input.hg-thr-ro {
  background: var(--soft); color: var(--fg); font-weight: 600;
  border-style: dashed; cursor: default;
}
.hg-row { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--fg2); margin-bottom: 6px; }
.hg-regions { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 6px 10px; }
.hg-reg { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--fg2); }
.hg-reg input {
  width: 78px; padding: 4px 6px; font-size: 12px; border-radius: 4px;
  border: 1px solid var(--input-bd); background: var(--card); color: var(--fg);
}
.hg-reg-base input { background: var(--soft); color: var(--fg3); }
/* ★v70 满仓阈值实时换算表 + 区域阈值合规表 */
.hg-thrcalc {
  margin: 6px 0 2px; padding: 6px 8px; border-radius: 6px;
  background: var(--soft); font-size: 11.5px; color: var(--fg2); line-height: 1.8;
}
.hg-tc-item { display: inline-block; margin-right: 14px; }
.hg-tc-item b { color: var(--fg); font-size: 12.5px; }
.hg-tc-note { color: var(--fg3b); }
.hg-regnote {
  margin: 8px 0 2px; border: 1px solid var(--line-soft); border-radius: 6px;
  padding: 6px 8px; font-size: 11.5px; color: var(--fg2);
}
.hg-regnote { margin: 8px 0 2px; border: 1px solid var(--line-soft); border-radius: 6px;
  padding: 6px 8px; font-size: 11.5px; color: var(--fg2); }
.hg-lad-actions { display: flex; align-items: center; gap: 8px; margin-top: 6px; font-size: 11.5px; }
.hg-ladder { display: flex; flex-direction: column; gap: 5px; }
.hg-lad-row { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--fg2); flex-wrap: wrap; }
.hg-lad-row input {
  width: 74px; padding: 4px 6px; font-size: 12px; border-radius: 4px;
  border: 1px solid var(--input-bd); background: var(--card); color: var(--fg);
}
.hg-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 12px; }
.hg-2col label { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--fg2); }
.hg-2col input {
  flex: 1; min-width: 0; padding: 4px 6px; font-size: 12px; border-radius: 4px;
  border: 1px solid var(--input-bd); background: var(--card); color: var(--fg);
}
/* 资金/风险速览(窗口顶部, 随输入实时变化) */
.hg-fundbar {
  display: flex; gap: 18px; flex-wrap: wrap; margin: 8px 0 6px;
  padding: 8px 12px; border-radius: 6px;
  background: var(--tint-blue-bg); border: 1px solid var(--tint-blue-bd);
}
.hg-fb-item { display: flex; flex-direction: column; gap: 2px; font-size: 11.5px; color: var(--fg2); }
.hg-fb-item b { font-size: 15px; color: var(--fg); }
.hg-fb-item i { font-style: normal; font-size: 10.5px; color: var(--fg3); }
.hg-fb-item b.hg-danger { color: var(--danger); }
/* ★v53 资金口径行: 让用户一眼看清"当前这笔钱是谁的"(模拟=自己设定 / 实盘=期货公司真实资金) */
.hg-capview {
  display: flex; align-items: center; flex-wrap: wrap; gap: 6px;
  margin: 8px 0 6px; padding: 7px 10px; font-size: 12px; color: var(--fg2);
  background: var(--soft2); border: 1px solid var(--line); border-radius: 5px;
}
.hg-capview b { color: var(--fg); font-size: 13px; }
.hg-capview i { font-style: normal; font-size: 11.5px; color: var(--fg3); }
.hcv-tag {
  padding: 1px 7px; border-radius: 9px; font-size: 11px; font-weight: 700;
  background: var(--chip); color: var(--fg2); border: 1px solid var(--line2);
}
.hcv-tag.sim { background: var(--tint-green-bg); color: var(--tint-green-fg); border-color: var(--tint-green-bd); }
.hcv-tag.live { background: var(--tint-blue-bg); color: var(--tint-blue-fg); border-color: var(--tint-blue-bd); }
.hcv-tag.warn { background: var(--tint-amber-bg); color: var(--tint-amber-fg); border-color: var(--tint-gold-bd); }
.hg-warns { display: flex; flex-direction: column; gap: 4px; margin-bottom: 6px; }
.hg-warn {
  font-size: 11.5px; line-height: 1.5; padding: 5px 9px; border-radius: 4px;
  background: var(--tint-amber-bg); color: var(--tint-amber-fg);
}
.hg-warn.danger { background: var(--tint-red-bg); color: var(--tint-red-fg); }
/* ★v51 期现配置强制门禁提示条(首次使用 / 账号首次登录时显示) */
.hg-setup {
  margin: 8px 0 2px; padding: 8px 12px; border-radius: 6px;
  font-size: 12px; line-height: 1.6;
  background: var(--tint-red-bg); color: var(--tint-red-fg);
  border: 1px solid var(--danger);
}
.hg-setup.hidden { display: none; }
/* 只读的持仓上限(来自期现配置): 视觉上明确"不可编辑" */
.live-row input[readonly], .live-2col input[readonly] {
  background: var(--soft3); color: var(--fg2); cursor: default;
}
/* 主界面顶部的风控提示条(有预警才显示, 明显位置提醒资金使用量) */
.risk-bar {
  display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: center;
  padding: 6px 14px; font-size: 12px; line-height: 1.5;
  background: var(--tint-amber-bg); color: var(--tint-amber-fg);
  border-bottom: 1px solid var(--tint-gold-bd);
}
.risk-bar.danger { background: var(--tint-red-bg); color: var(--tint-red-fg);
                   border-bottom-color: var(--tint-red-bd); font-weight: 600; }
.risk-bar.hidden { display: none; }   /* ★全局 .hidden 只对 .modal 生效, 普通 div 必须单独补 */

/* ================= v55 更新提示 / 强制拦截 / 网站精选 ================= */
/* 顶栏下的新版本提示条(浅蓝底, 不与风控条冲突) */
.upd-bar {
  display: flex; gap: 8px 14px; align-items: center;
  padding: 6px 14px; font-size: 12px; line-height: 1.5;
  background: var(--tint-blue-bg); color: var(--tint-blue-fg);
  border-bottom: 1px solid var(--tint-blue-bd);
}
.upd-bar.hidden { display: none; }    /* ★普通 div 必须单独补 .hidden */
/* 强制更新拦截层: 盖住主界面, 仅保留"立即更新" */
.upd-force { position: fixed; inset: 0; z-index: 3000;
             background: var(--bg); display: flex;
             align-items: center; justify-content: center; }
.upd-force.hidden { display: none; }
.upd-force-box { background: var(--card); border-radius: 12px;
                 box-shadow: var(--card-shadow); padding: 28px 34px;
                 max-width: 460px; text-align: center; }
.upd-force-box h2 { margin: 0 0 10px; font-size: 17px; color: var(--fg); }
.btn.hidden { display: none; }        /* ★全局 .hidden 只对 .modal 生效, 按钮单独补 */
.upd-force-box p { margin: 8px 0; font-size: 13px; color: var(--fg2); line-height: 1.6; }
/* ★v81 P0-6: 更新弹窗里的 SHA256 展示(用户可与官网公布值人工比对) */
.upd-hash { margin: 10px 0 4px; font-size: 11px; color: var(--fg3, var(--fg2));
            line-height: 1.5; text-align: left; }
.upd-hash code { display: block; margin-top: 3px; padding: 5px 7px;
                 border-radius: 5px; background: var(--soft3);
                 font-size: 11px; word-break: break-all;
                 color: var(--fg); user-select: all; }
.upd-prog { height: 8px; border-radius: 4px; background: var(--soft3);
            overflow: hidden; margin: 12px 0 4px; }
.upd-prog.hidden { display: none; }
.upd-prog > div { height: 100%; width: 0; background: var(--accent);
                  transition: width .3s; }
/* 精选条目(启动弹窗内使用) */
.portal-list { flex: 1; overflow-y: auto; overflow-x: hidden; min-height: 60px; }
.portal-item { display: flex; gap: 10px; padding: 7px 2px; cursor: pointer;
               border-bottom: 1px dashed var(--line-soft); color: var(--fg);
               text-decoration: none; align-items: flex-start; }
.portal-item:hover { background: var(--soft2); }
.portal-item .pi-img { flex: 0 0 84px; height: 58px; border-radius: 5px;
                       object-fit: cover; background: var(--soft3); }
.portal-item .pi-main { flex: 1; min-width: 0; }
.portal-item .pi-t { display: block; font-size: 13px; color: var(--fg);
                     overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-item .pi-d { display: block; font-size: 11px; color: var(--fg3b);
                     margin-top: 3px; overflow: hidden; text-overflow: ellipsis;
                     white-space: nowrap; }
.portal-empty { color: var(--fg4); font-size: 12px; }

/* ================= v56 启动前封面图(开屏图) / 精选弹窗 ================= */
/* 开屏层: 启动即显示, 主界面就绪 + 最短停留后淡出; 层级低于强制更新页(3000)
   ★v67 纯白底 + 只显示宣传图与标题(不再有卡片框/阴影/灰色大底), 与原生
   无边框启动窗(shell.py)同一观感; 深浅主题均固定白底黑字(宣传图自带白底)。 */
.splash { position: fixed; inset: 0; z-index: 2600; display: flex;
          align-items: center; justify-content: center; background: #fff;
          opacity: 1; transition: opacity .6s ease; }
.splash.splash-gone { opacity: 0; pointer-events: none; }
.splash-inner { display: flex; flex-direction: column; align-items: center; gap: 18px; }
.splash-img { max-width: 72vw; max-height: 60vh; object-fit: contain; }
.splash-img.hidden { display: none; }
/* ★v65 宣传图下方标题: 图加载成功才显示(与图同进退) */
.splash-title { font-size: 21px; font-weight: 700; color: #333;
                letter-spacing: 3px; }
.splash-title.hidden { display: none; }
.splash-brand { text-align: center; }
.splash-brand.hidden { display: none; }
.splash-logo { font-size: 30px; font-weight: 700; color: #333;
               letter-spacing: 4px; }
.splash-text { margin-top: 8px; font-size: 13px; color: #999;
               letter-spacing: 1px; }
.splash-loading { display: flex; align-items: center; gap: 8px;
                  font-size: 12px; color: var(--fg4); }
.splash-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent);
              animation: splashPulse 1s ease-in-out infinite; }
@keyframes splashPulse {
  0%, 100% { opacity: .25; transform: scale(.85); }
  50%      { opacity: 1;   transform: scale(1); }
}
/* 启动精选弹窗: 浮在走势图上方, 每天首次启动弹一次, 可手动关闭
   v57: 窗口加大 + 多形式展现(头条大图/视频/推荐列表), 严禁水平滚动条
   v59: 层级压到弹窗层(.modal=100)之下 —— 首启「期现配置强制窗」必须盖住它,
        与 renderPortal 的让路规则同一语义( race 时视觉上也以配置窗优先) */
.portal-modal { position: fixed; inset: 0; z-index: 90;
                background: rgba(0, 0, 0, .34); display: flex;
                align-items: flex-start; justify-content: center; }
.portal-modal.hidden { display: none; }
.portal-box { margin-top: 6vh; width: min(880px, 94vw); max-height: 86vh;
              background: var(--card); border-radius: 12px; padding: 14px 18px 12px;
              box-shadow: var(--card-shadow); display: flex; flex-direction: column;
              overflow: hidden; }
.portal-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.portal-head b { font-size: 15px; color: var(--fg); }
.portal-foot { display: flex; align-items: center; justify-content: space-between;
               gap: 10px; margin-top: 8px; padding-top: 8px;
               border-top: 1px solid var(--line-soft); font-size: 11px; }
.portal-box .portal-item .pi-img { flex: 0 0 92px; height: 62px; }
.portal-box .portal-item .pi-t { font-size: 13.5px; }
/* ① 头条大图: 16:5 横幅, 标题/摘要压图, 左上角「头条」角标 */
.portal-hero { position: relative; display: block; height: 190px; flex: 0 0 auto;
               border-radius: 9px; overflow: hidden; cursor: pointer;
               background: var(--soft3); }
.portal-hero .ph-img { position: absolute; inset: 0; width: 100%; height: 100%;
                       object-fit: cover; display: block; }
.portal-hero .ph-img.ph-noimg { display: none; }
.portal-hero .ph-shade { position: absolute; inset: 0;
                         background: linear-gradient(180deg, rgba(0,0,0,0) 30%,
                                     rgba(0,0,0,.62) 100%); }
.portal-hero .ph-badge { position: absolute; top: 10px; left: 10px;
                         padding: 2px 9px; border-radius: 4px; font-size: 11px;
                         color: #fff; background: #d33a31; letter-spacing: 2px; }
.portal-hero .ph-txt { position: absolute; left: 14px; right: 14px; bottom: 10px;
                       display: block; }
.portal-hero .ph-t { display: block; color: #fff; font-size: 17px; font-weight: 600;
                     overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-hero .ph-d { display: block; margin-top: 4px; color: rgba(255,255,255,.86);
                     font-size: 12px; overflow: hidden; text-overflow: ellipsis;
                     white-space: nowrap; }
/* ② 视频: 内嵌播放器(16:9, 不溢出), 标题行点击进文章 */
.portal-video { margin-top: 12px; }
.portal-video .pv-player { display: block; width: 100%; max-width: 640px;
                           aspect-ratio: 16 / 9; max-height: 250px;
                           border-radius: 8px; background: #000;
                           object-fit: contain; }
.portal-video .pv-t { display: flex; align-items: center; gap: 8px;
                      margin-top: 6px; font-size: 13.5px; color: var(--fg);
                      text-decoration: none; cursor: pointer;
                      overflow: hidden; white-space: nowrap;
                      text-overflow: ellipsis; }
.portal-video .pv-t:hover { color: var(--accent); }
.portal-video .pv-tag { flex: 0 0 auto; padding: 1px 7px; border-radius: 4px;
                        font-size: 11px; color: #fff; background: #2f7bd9; }
/* ③ 推荐列表小标题 */
.portal-sub { margin: 10px 0 2px; font-size: 12px; color: var(--fg3b);
              letter-spacing: 1px; }
.portal-list::-webkit-scrollbar { width: 8px; }
.portal-list::-webkit-scrollbar-thumb { border-radius: 4px; background: var(--soft3); }

/* ================= v59 用户使用协议(首次使用必须签署) =================
   层级 2800: 高于开屏图(2600)/精选弹窗(2500), 低于强制更新页(3000)。
   正文区可滚动阅读, 底部勾选方可"同意并继续"; 不提供关闭按钮(只能同意或退出)。 */
.agree-modal { position: fixed; inset: 0; z-index: 2800;
               background: var(--mask); display: flex;
               align-items: center; justify-content: center; }
.agree-modal.hidden { display: none; }
.agree-box { width: min(760px, 94vw); max-height: 88vh;
             background: var(--card); border-radius: 12px;
             box-shadow: var(--card-shadow); padding: 16px 20px 14px;
             display: flex; flex-direction: column; }
.agree-head { display: flex; align-items: center; gap: 10px; }
.agree-head b { font-size: 16px; color: var(--fg); }
.agree-head .dim { font-size: 12px; }
.agree-tip { margin: 8px 0 8px; font-size: 12px; color: var(--fg3b);
             line-height: 1.65; }
.agree-body { flex: 1; min-height: 180px; overflow-y: auto; overflow-x: hidden;
              padding: 12px 16px; border: 1px solid var(--line);
              border-radius: 8px; background: var(--soft);
              font-size: 13px; line-height: 1.9; color: var(--fg2); }
.agree-body h4 { margin: 12px 0 4px; font-size: 13.5px; color: var(--fg); }
.agree-body h4:first-child { margin-top: 0; }
.agree-body p { margin: 3px 0; }
.agree-foot { display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
              margin-top: 12px; padding-top: 10px;
              border-top: 1px solid var(--line-soft); }
.agree-ck { display: flex; align-items: center; gap: 7px; font-size: 13px;
            color: var(--fg); cursor: pointer; user-select: none; }
.agree-ck input { width: 15px; height: 15px; cursor: pointer; }
.agree-body::-webkit-scrollbar { width: 8px; }
.agree-body::-webkit-scrollbar-thumb { border-radius: 4px; background: var(--soft3); }
