/* ============================================================
   量化选股系统 全站主题系统（2026-09-01 v1）
   用法: 所有页面 <link rel="stylesheet" href="/static/theme.css?v=1">
   + <script src="/static/theme.js?v=1"></script>（放 head，防闪烁）
   颜色一律用 var(--xxx)，禁止页面内写死色值（否则破坏双主题）
   新页面引用本文件即自动统一（导航/卡片/表格/按钮/表单全套）
   ============================================================ */

/* ---------- 白天主题（默认） ---------- */
:root{
  --bg:#f5f6f8;            /* 页面背景 */
  --bg-soft:#eceef1;       /* 次级背景/斑马纹/工具条 */
  --card:#ffffff;          /* 卡片/表格背景 */
  --card-border:#d9dce1;   /* 卡片边框 */
  --row-hover:#f7f9fc;     /* 表格行 hover */
  --text:#1a1a1a;          /* 主文字 */
  --text-2:#666;           /* 次要文字（表头/ghost按钮 5.74:1 合格保持） */
  --text-3:#667085;        /* 弱文字/占位（2026-09-08 #79818f 3.93:1→#667085 4.97:1 on #fff 过线，仍明显偏灰不与正文黑糊档） */
  --accent:#1f5fbf;        /* 主色：链接/按钮/标题 */
  --accent-hover:#18498f;
  --accent-soft:#eef3fb;   /* 主色浅底：选中标签/模板 */
  --up:#d93026;            /* 涨（A股红涨） */
  --down:#0a7d33;          /* 跌（A股绿跌） */
  --warn:#b85c00;          /* 警示/中性 */
  --input-bg:#ffffff;
  --input-border:#d9dce1;
  --btn-bg:#ffffff;
  --btn-border:#d9dce1;
  --shadow:0 1px 3px rgba(20,30,60,.08);
  --shadow-lg:0 4px 16px rgba(20,30,60,.12);
  --grid:#e8eaee;            /* SVG 图表网格线（浅色） */
  --muted:#667085;           /* 占位/弱提示文字（对齐 text-3 2026-09-08） */
  --accent-fg:#fff;          /* accent 底色上的前景字（light=白） */
  --pal-0:#d93026;           /* 折线色板 0 红（light 原值） */
  --pal-1:#1f5fbf;           /* 1 蓝 */
  --pal-2:#0a7d33;           /* 2 绿 */
  --pal-3:#e6a23c;           /* 3 金 */
  --pal-4:#8e44ad;           /* 4 紫 */
  --pal-5:#16a085;           /* 5 青 */
  --pal-6:#d35400;           /* 6 橙 */
  --pal-7:#e91e63;           /* 7 粉 */
  --pal-8:#7cb342;           /* 8 黄绿 */
  --pal-9:#4555c8;           /* 9 蓝紫 */
  --radius:10px;
  --radius-sm:6px;
  --chart-bg:#ffffff;        /* K线图表区底色（2026-09-08 起跟随主题：light=白底配库原生深字；dark=深底配浅字覆写） */
}

/* ---------- 黑夜主题 ---------- */
[data-theme="dark"]{
  --bg:#0f1420;
  --bg-soft:#1a2133;
  --card:#1a2133;
  --card-border:#2a3550;
  --row-hover:#222c44;
  --text:#e8eaf0;
  --text-2:#a0aabd;        /* 次要文字（2026-09-08 #8b95ab 5.33→#a0aabd 6.86:1，与 text-3 拉开档距） */
  --text-3:#8d97ab;        /* 弱文字（2026-09-08 #6e7a90 3.7:1 黑夜看不清→#8d97ab 5.46:1 on card 过线） */
  --accent:#7ab8ff;
  --accent-hover:#93c6ff;
  --accent-soft:#222c44;
  --up:#f0524d;
  --down:#2fbf71;
  --warn:#e6a23c;
  --input-bg:#222c44;
  --input-border:#2a3550;
  --btn-bg:#222c44;
  --btn-border:#2a3550;
  --shadow:0 1px 3px rgba(0,0,0,.35);
  --shadow-lg:0 4px 16px rgba(0,0,0,.45);
  --grid:#28304a;            /* SVG 图表网格线（暗色） */
  --muted:#8d97ab;           /* 占位/弱提示文字（对齐 text-3 2026-09-08，暗色下可读） */
  --accent-fg:#0f1420;       /* accent 底色上的前景字（dark=深字，accent 已提亮成浅蓝 #7ab8ff，白字会 2.07:1 不可读） */
  --pal-0:#f0524d;           /* 折线色板 0 红（dark 提亮系，全 ≥5:1 对 #0f1420） */
  --pal-1:#6cb6ff;           /* 1 亮蓝（对齐 accent 系） */
  --pal-2:#2fbf71;           /* 2 亮绿（对齐 --down） */
  --pal-3:#ffc94d;           /* 3 金 */
  --pal-4:#b07ce8;           /* 4 紫 */
  --pal-5:#34c7c0;           /* 5 青 */
  --pal-6:#ff9040;           /* 6 橙 */
  --pal-7:#ff6f9f;           /* 7 粉 */
  --pal-8:#9fd25c;           /* 8 黄绿 */
  --pal-9:#8f9dff;           /* 9 蓝紫 */
  --chart-bg:#0b0e14;        /* K线图表区底色（dark） */
}

/* ---------- 基础 ---------- */
*{box-sizing:border-box}
body{font-family:'Microsoft YaHei',sans-serif;background:var(--bg);color:var(--text);margin:0;padding:0;font-size:14px;transition:background .25s,color .25s}
.wrap{max-width:1160px;margin:0 auto;padding:20px 16px}
h1{font-size:20px;margin:0;color:var(--accent)}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--accent-hover)}
.foot{color:var(--text-2);font-size:12px;margin-top:20px;text-align:center;padding:14px 0}
.foot a.fl{color:var(--accent);text-decoration:none}
.foot a.fl:hover{text-decoration:underline}
.empty{color:var(--text-3);font-size:13px;padding:36px 0;text-align:center;background:var(--card);border:1px dashed var(--card-border);border-radius:var(--radius)}

/* ---------- 顶栏（含主题切换按钮） ---------- */
.topbar{display:flex;align-items:center;gap:14px;padding:12px 20px;border-bottom:1px solid var(--card-border);background:var(--card);flex-wrap:wrap}
/* ── 版式统一（2026-09-13）────────────────────────────────────────────
   历史原因页眉有三种骨架：① 顶层（横贯整屏）② .wrap 内（与内容同宽）
   ③ .wrap 里再套一层 .wrap（内容窄 32px、下移 20px）。
   这里统一成一种视觉结果：**页眉与内容同宽、居中；嵌套 .wrap 不再叠加内边距**。 */
.topbar{max-width:1128px;margin-left:auto;margin-right:auto}
/* 页眉在 .wrap 内时会被 wrap 的上内边距顶下去 20px → 抵消掉，让所有页页眉都在同一高度 */
.wrap > .topbar{margin-top:-20px}
/* 页眉在顶层时（它在 .wrap 之外），紧随的内容 wrap 再留 20px 上边距 → 会和上面那种差 20px，
   这里抹掉，让「页眉→导航」的间距全站一致 */
body > .topbar + .wrap{padding-top:0}
.wrap .wrap{padding:0;max-width:none}
.topbar h1{font-size:19px;margin:0;color:var(--accent)}
.topbar .sub{color:var(--text-3);font-size:13px}
.topbar .spacer{flex:1}
.theme-btn{border:1px solid var(--card-border);background:var(--btn-bg);color:var(--text-2);border-radius:var(--radius-sm);padding:5px 12px;font-size:13px;cursor:pointer;line-height:1.4}
.theme-btn:hover{border-color:var(--accent);color:var(--accent)}

/* ---------- 导航 ---------- */
.nav{display:flex;gap:10px;margin:14px 0 18px;font-size:13px;flex-wrap:wrap}
.nav a{color:var(--text-2);text-decoration:none;padding:6px 14px;border-radius:var(--radius-sm);background:var(--card);border:1px solid var(--card-border)}
.nav a.on,.nav a:hover{color:var(--accent-fg);background:var(--accent);border-color:var(--accent)}

/* ---------- 卡片 ---------- */
.card{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius);padding:18px;margin-bottom:14px;box-shadow:var(--shadow)}
.card .t{font-size:14px;font-weight:bold;color:var(--text);margin-bottom:12px}
.card .lbl{font-size:12px;color:var(--text-3)}
.card .num{font-size:24px;font-weight:bold;color:var(--accent);margin-top:6px}
.card .sub{font-size:12px;color:var(--text-3);margin-top:4px}

/* ---------- 指标卡组 ---------- */
.metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:14px}
.metrics .m{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow)}
.metrics .l{font-size:12px;color:var(--text-3)}
.metrics .v{font-size:20px;font-weight:bold;color:var(--text);margin-top:4px}
.metrics .v.good{color:var(--down)}   /* 语义: 正向=涨/好 */
.metrics .v.bad{color:var(--up)}      /* 语义: 负向=跌/坏 */

/* ---------- 表格 ---------- */
table{width:100%;border-collapse:collapse;font-size:13px;background:var(--card);border-radius:var(--radius);overflow:hidden}
th{background:var(--bg-soft);color:var(--text-2);text-align:left;padding:8px 10px;font-weight:normal;white-space:nowrap}
td{padding:7px 10px;border-top:1px solid var(--card-border);white-space:nowrap}
tr:hover td{background:var(--row-hover)}
th.sortable{cursor:pointer;user-select:none}
th.sortable:hover{background:var(--accent-soft)}
.num{text-align:right;font-family:Consolas,monospace}

/* ---------- 涨跌/状态色 ---------- */
.up{color:var(--up)}       /* 红涨 */
.down{color:var(--down)}   /* 绿跌 */
.good{color:var(--down)}
.bad{color:var(--up)}
a.t{color:var(--accent);text-decoration:none}

/* ---------- 工具条/筛选 ---------- */
.bar{display:flex;gap:12px;align-items:center;margin-bottom:12px;font-size:13px;color:var(--text-2);flex-wrap:wrap}
.bar a{color:var(--accent);text-decoration:none;padding:4px 10px;background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-sm)}
.bar a.on{color:var(--accent-fg);background:var(--accent);border-color:var(--accent)}
.bar input,.bar select{padding:5px 8px;border:1px solid var(--input-border);border-radius:var(--radius-sm);background:var(--input-bg);color:var(--text);font-size:13px}
.bar input:focus,.bar select:focus{outline:none;border-color:var(--accent)}

/* ---------- 表单（选股器等） ---------- */
input[type=text],input[type=number],select{background:var(--input-bg);border:1px solid var(--input-border);color:var(--text);border-radius:var(--radius-sm);font-size:13px;padding:6px 8px}
input:focus,select:focus{outline:none;border-color:var(--accent)}
button{font-family:inherit}
/* 原生勾选框/单选框：dark 下默认 color=#000 圆点/方框隐形（r=1.31 实测），必须跟随主题 */
input[type=checkbox],input[type=radio]{accent-color:var(--accent);color:var(--text);cursor:pointer}

/* ---------- 按钮 ---------- */
.btn{background:var(--accent);color:var(--accent-fg);border:none;padding:8px 22px;border-radius:var(--radius-sm);font-size:13px;cursor:pointer}
.btn:hover{background:var(--accent-hover)}
.btn.ghost{background:var(--btn-bg);color:var(--text-2);border:1px solid var(--btn-border);padding:7px 16px}
.btn.ghost:hover{color:var(--accent);border-color:var(--accent);background:var(--accent-soft)}

/* ---------- 标签/模板 ---------- */
.pill{display:inline-block;margin:0 8px 8px 0;padding:5px 14px;background:var(--accent-soft);color:var(--accent);border:1px solid var(--card-border);border-radius:20px;font-size:12px;cursor:pointer}
.pill:hover{background:var(--accent);color:var(--accent-fg)}

/* ---------- 分页 ---------- */
.pg{display:flex;gap:10px;align-items:center;margin-top:12px;font-size:13px}
.pg a{color:var(--accent);text-decoration:none;padding:4px 10px;background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-sm)}
.pg a:hover{background:var(--accent-soft)}
.pg span{color:var(--text-2)}

/* ---------- 质量行（总览页） ---------- */
.qrow{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--card-border);font-size:13px}
.qrow .ok{color:var(--down)}.qrow .bad{color:var(--up)}

/* ---------- 告警 ---------- */
.alarm{font-size:13px;padding:8px 12px;border-radius:var(--radius-sm);margin-bottom:8px;background:var(--accent-soft);border:1px solid var(--card-border);color:var(--text)}
.alarm.ok{background:var(--accent-soft);border-color:var(--card-border)}

/* ---------- 📘 数据与口径说明（2026-09-06 §八，默认收起，全站 12 页统一组件） ---------- */
.guide{background:var(--bg-soft);border:1px solid var(--card-border);border-radius:var(--radius-sm);margin:0 0 16px;font-size:12.5px;color:var(--text-2);line-height:1.8}
.guide>summary{cursor:pointer;padding:9px 14px;font-weight:600;color:var(--text);font-size:13px;user-select:none;list-style:none}
.guide>summary::-webkit-details-marker{display:none}
.guide>summary:hover{color:var(--accent)}
.guide[open]>summary{border-bottom:1px dashed var(--card-border);margin-bottom:6px}
.guide-sec{padding:6px 14px 0}
.guide-sec b{color:var(--text);font-weight:600}
.guide-sec ul{margin:2px 0 6px;padding-left:18px}
.guide-sec li{margin:1px 0}

/* ---------- 图表容器（K线等） ---------- */
#KLineCtrl{width:100%;height:calc(100vh - 104px);min-height:520px;background:var(--chart-bg)}  /* 图表区底色跟随主题（2026-09-08 起：light 白底/dark 深底，库内文字配色由 KLineChart.js 按主题分支覆写） */

/* ---------- SVG 图表 ---------- */
svg text{font-family:'Microsoft YaHei',sans-serif}

/* ============================================================
   📖 名词库悬停引擎公共样式（§七 2026-09-06）
   放 theme.css 原因：glossary.js 全站 13 页注入，弹卡/词样式必须全站生效——
   ⛔ 只放 glossary.css 则仅 /glossary 页加载，其它页弹卡无 fixed 定位渲染在视口外（线上事故）
   ============================================================ */
.gl-word{
  border-bottom:1px dotted var(--text-2);
  cursor:pointer;
  border-radius:3px;
  transition:background .12s,color .12s;
}
.gl-word:hover{background:var(--accent-soft);color:var(--accent);border-bottom-color:var(--accent)}

#glTip{
  position:fixed;
  z-index:99999;
  max-width:340px;
  min-width:210px;
  background:var(--card);
  border:1px solid var(--card-border);
  border-radius:var(--radius);
  box-shadow:var(--shadow-lg);
  padding:10px 13px;
  font-size:13px;
  line-height:1.55;
  color:var(--text);
  pointer-events:auto;
  display:none;
}
#glTip .gt-t{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
#glTip .gt-t .w{font-weight:bold;font-size:14px;color:var(--accent);font-family:Consolas,monospace}
#glTip .gt-t .w.zh{font-family:'Microsoft YaHei',sans-serif}
#glTip .gt-t .disp{font-size:12px;color:var(--text-3)}
#glTip .gt-badges{margin-left:auto}
#glTip .gt-sum{color:var(--text);margin-top:5px}
#glTip .gt-more{margin-top:6px;font-size:12px;color:var(--accent);text-decoration:none}
#glTip .gt-more:hover{text-decoration:underline}

/* 词类型/因子族徽章（弹卡与详情页通用） */
.gbadge{
  display:inline-block;
  padding:1px 9px;
  border-radius:20px;
  font-size:11px;
  line-height:1.7;
  background:var(--accent-soft);
  color:var(--accent);
  border:1px solid var(--card-border);
  white-space:nowrap;
}
.gbadge.g2{background:var(--bg-soft);color:var(--text-2)}