/* ============================================================
 * 国金证券客户端设计系统 · design-tokens.css(数值真源)
 * version: v2.6.2 · 750 设计稿基准
 * 唯一颜色/尺寸来源。ALWAYS 用 var(--xxx),NEVER 硬编码色值。
 * 深色模式:容器加 [data-theme="dark"] 即自动切换语义色。
 * ============================================================ */

:root {
  /* ---------- 原子色盘:7 彩色族×19阶 + 灰18阶,锚点在第6阶 ---------- */
  /* R · 品牌红(★R6 主色/涨红) */
  --R1:#FFF2F0; --R2:#FFE0DB; --R3:#FFBAB3; --R4:#FF928A; --R5:#FF6661; --R6:#F93838; --R7:#D4242A; --R8:#AD151F; --R9:#870916; --R10:#610612; --R11:#281B26; --R12:#551313; --R13:#7E1C1C; --R14:#A72626; --R15:#D02F2F; --R16:#FA6060; --R17:#FB8888; --R18:#FDAFAF; --R19:#FED7D7;
  /* O · 辅色橙 */
  --O1:#FFF8F0; --O2:#FFECD6; --O3:#FFD6AD; --O4:#FFBE85; --O5:#FFA35C; --O6:#FF8533; --O7:#D96421; --O8:#B34712; --O9:#8C2F07; --O10:#661E04; --O11:#282024; --O12:#572D11; --O13:#81431A; --O14:#AB5922; --O15:#D56F2B; --O16:#FF9D5C; --O17:#FFB685; --O18:#FFCEAD; --O19:#FFE7D6;
  /* Y · 辅色黄 */
  --Y1:#FFFBE6; --Y2:#FFF2B8; --Y3:#FFE78F; --Y4:#FFD966; --Y5:#FFC83D; --Y6:#FFB415; --Y7:#D98F07; --Y8:#B36E00; --Y9:#8C5200; --Y10:#663800; --Y11:#291D1C; --Y12:#543313; --Y13:#7D4F1B; --Y14:#A66E26; --Y15:#CC8C1E; --Y16:#FDC74E; --Y17:#FADB87; --Y18:#FCEAAC; --Y19:#FFF7D6;
  /* J · 辅色金(广告/会员) */
  --J1:#FFF6EA; --J2:#F5E2C4; --J3:#E8C595; --J4:#DBA869; --J5:#CF8B42; --J6:#C36E20; --J7:#9C4F11; --J8:#753507; --J9:#4F1F01; --J10:#290E00; --J11:#24180C; --J12:#462F16; --J13:#694621; --J14:#8B5D2C; --J15:#AD7437; --J16:#D9A268; --J17:#E2B98E; --J18:#ECD1B3; --J19:#F5E8D9;
  /* G · 辅色绿(★G6 跌绿) */
  --G1:#E3FAEC; --G2:#B7EBD1; --G3:#8ADCB5; --G4:#5ECE9A; --G5:#31BF7E; --G6:#05B063; --G7:#048A4E; --G8:#03643A; --G9:#013D25; --G10:#001710; --G11:#16252A; --G12:#02321D; --G13:#044A2B; --G14:#05633A; --G15:#067B48; --G16:#37C082; --G17:#69D0A1; --G18:#9BDFC1; --G19:#CDEFE0;
  /* B · 辅色蓝(★B6 卖/链接) */
  --B1:#F0F7FF; --B2:#CFE5FF; --B3:#A6CCFF; --B4:#7DB1FF; --B5:#5493FF; --B6:#2B73FF; --B7:#1A53D9; --B8:#0C39B3; --B9:#03238C; --B10:#011566; --B11:#181F36; --B12:#0F2757; --B13:#163A81; --B14:#1D4DAB; --B15:#2460D5; --B16:#558FFF; --B17:#80ABFF; --B18:#AAC7FF; --B19:#D5E3FF;
  /* P · 辅色紫(智能体) */
  --P1:#F4F0FF; --P2:#EEE8FF; --P3:#CEBFFF; --P4:#AB96FF; --P5:#866EFF; --P6:#5E44FF; --P7:#4130D9; --P8:#281EB3; --P9:#15118C; --P10:#0B0B66; --P11:#100C2D; --P12:#201757; --P13:#2F2281; --P14:#3F2EAB; --P15:#4F39D5; --P16:#7E69FF; --P17:#9E8FFF; --P18:#BFB4FF; --P19:#DFDAFF;
  /* H · 基础灰(★H9 主文本) */
  --H1:#FFFFFF; --H2:#F2F4F8; --H3:#E2E8F2; --H4:#EEEEEE; --H5:#DDDDDD; --H6:#CCCCCC; --H7:#87878D; --H8:#55555E; --H9:#0F0F1B; --H10:#000000; --H11:#161824; --H12:#0F0F1B; --H13:#21212D; --H14:#373746; --H15:#55555E; --H16:#87878D; --H17:#87878D; --H18:#DDDDDD;
  /* ---------- 品牌渐变 ---------- */
  --grad-red:linear-gradient(180deg, var(--CP1) 0%, var(--CP0) 100%);
  --grad-ai:linear-gradient(135deg, var(--CP2) 0%, var(--CP3) 100%);
  --grad-peach:linear-gradient(180deg, var(--O1) 0%, #FFFBF7 100%);
  --grad-iris:linear-gradient(180deg, #F6FBFF 0%, #FFF9FF 50%, #F3F5FF 100%); /* @kind color */
  --grad-glass:linear-gradient(180deg, #FFFFFF 0%, rgba(255,255,255,0.2) 100%); /* @kind color */
  --grad-orb:radial-gradient(circle, rgba(179,160,255,.55) 0%, rgba(255,223,252,.55) 35%, rgba(199,229,255,.55) 70%, rgba(124,181,255,.55) 100%); /* @kind color */
  /* ---------- 语义别名(开发友好) ---------- */
  --red-50:var(--R1); --red-100:var(--R2); --red-200:var(--R3); --red-300:var(--R4); --red-400:var(--R5); --red-500:var(--R6); --red-600:var(--R7); --red-700:var(--R8); --gold-50:var(--J1); --gold-100:var(--J2); --gold-200:var(--J3); --gold-300:var(--J4); --gold-400:var(--J5); --gold-500:var(--J6); --gold-600:var(--J7); --gold-700:var(--J8); --blue-50:var(--B1); --blue-100:var(--B2); --blue-300:var(--B5); --blue-500:var(--B6); --blue-700:var(--B7); --ink-900:var(--H9); --ink-700:var(--H8); --ink-500:var(--H8); --ink-400:var(--H7); --ink-300:var(--H6); --line:var(--H4); --bg-1:var(--H1); --bg-2:var(--H2); --bg-3:#F8F9FB;
  /* ---------- 圆角 / 间距 ---------- */
  /* 750 基准(v1.6.2 起全系统统一 750,不再 ÷2;基线单位 8) */
  --r-xs:4px; --r-6:6px; --r-sm:8px; --r-12:12px; --r-md:16px; --r-2xl:32px; --r-20:20px; --r-pill:999px; --s-1:8px; --s-2:16px; --s-3:24px; --s-4:32px; --s-5:40px; --s-6:48px; /* ---------- 字体 ---------- */
  --font-sans:"PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", "OPPO Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-num:"GJType", "PingFang SC", "Noto Sans SC", system-ui, sans-serif;

  /* ===================================================
   * 语义 token(白版/默认)— 按用途取用,而非按颜色
   * =================================================== */
  /* 01 品牌色 · CP · Brand */
  --CP0:var(--R6); /* 品牌色(对应色盘 R6) */
  --CP1:#FF7067; /* 品牌渐变浅色端 */
  --CP2:#667FFF; /* 智能体品牌渐变色蓝 */
  --CP3:#8B52FF; /* 智能体品牌渐变色紫 */
  /* 02 文字色 · CT · Text */
  --CT1:var(--H9); /* 主要文本 / 标题 */
  --CT2:var(--H9); /* 大面积主要文本的黑肤特殊处理（例：资讯） */
  --CT3:var(--H8); /* 次要文本 / 副标题 */
  --CT4:var(--H7); /* 辅助文本 / 提示说明 */
  --CT5:var(--H8); /* 弱文本 / 失效文本 */
  --CT6:var(--H1); /* 反白文字 */
  --CT7:var(--H1); /* 顶部标题栏文字 */
  --CT8:rgba(255,255,255,0.3); /* 禁用按钮上的反白文字 */
  /* 03 涨跌色 · CS · Rise / Fall */
  --CS1:var(--R6); /* 涨红 */
  --CS2:var(--G6); /* 跌绿 */
  --CS3:var(--H8); /* 平灰 */
  --CS4:var(--B6); /* 部分交易场景的跌 / 卖 */
  /* 04 功能色 · CF · Functional */
  --CF1:var(--R6); /* 警告 / 失败 */
  --CF2:#FF7015; /* 警示 / 次要提示 */
  --CF3:var(--B6); /* 成功 / 链接色 */
  --CF4:#059BB0; /* 市场情绪-大盘指数-"偏低"功能色 */
  --CF5:#32BFDE; /* 市场情绪-北向净卖入-"深股通"线条 / 选中色值 */
  --CF6:var(--J6); /* 辅助棕 - 广告词 */
  /* 05 线框色 · CL · Line / Border */
  --CL1:var(--H5); /* 一级分割线 / 默认描边 */
  --CL2:var(--H4); /* 常规分割线 */
  --CL3:var(--R6); /* 红色边框 */
  --CL4:var(--O6); /* 橙色边框 */
  --CL5:var(--B6); /* 蓝色边框 */
  --CL6:var(--P6); /* 紫色边框 */
  --CL8:rgba(43,115,255,0.5); /* 市场情绪选中边框 */
  --CL9:var(--B6); /* 分时图背景 */
  /* 06 按钮色 · CN · Button / Action */
  --CN1:var(--R6); /* 交易买 / 默认主按钮 */
  --CN2:var(--R7); /* 交易买 - 按下 */
  --CN3:var(--B6); /* 交易卖 / 期权平 */
  --CN4:var(--B7); /* 交易卖 / 期权平 - 按下 */
  --CN5:var(--G6); /* 期权卖 */
  --CN6:var(--G7); /* 期权卖 - 按下 */
  --CN7:var(--R7); /* 融买 */
  --CN8:var(--R8); /* 融买 - 按下 */
  --CN9:var(--B7); /* 融卖 */
  --CN10:var(--B8); /* 融卖 - 按下 */
  --CN11:rgba(249,56,56,0.3); /* 常规按钮禁用状态 */
  --CN12:var(--R1); /* 浅色主按钮背景色 */
  --CN13:var(--R2); /* 浅色主按钮背景色 - 按下 */
  --CN14:var(--H2); /* 灰色辅助按钮背景色 */
  --CN15:var(--H3); /* 灰色辅助按钮背景色 - 按下 */
  /* 07 图标色 · CI · Icon */
  --CI1:var(--H9); /* 主要图标 */
  --CI2:var(--H8); /* 次要图标，搭配次要文本 */
  --CI3:var(--H7); /* 辅助图标，搭配辅助文本及提示说明 */
  --CI4:var(--H6); /* 弱图标 / 失效图标，搭配弱文本及失效文本 */
  --CI5:var(--H1); /* 反白图标，搭配反白文字 */
  /* 08 图表色 · CH · Chart */
  --CH1:var(--R6); /* 主品牌色 / 高亮 (图表) */
  --CH2:var(--R5); /* 红 - 浅一阶 */
  --CH3:var(--O6); /* 橙 - 主 */
  --CH4:var(--O4); /* 橙 - 浅 */
  --CH5:var(--Y6); /* 黄 - 主 */
  --CH6:var(--Y4); /* 黄 - 浅 */
  --CH7:var(--G5); /* 绿 - 主 */
  --CH8:var(--G4); /* 绿 - 浅 */
  --CH9:var(--B5); /* 蓝 - 主 */
  --CH10:var(--B3); /* 蓝 - 浅 */
  --CH11:var(--P5); /* 紫 - 主 */
  --CH12:var(--P3); /* 紫 - 浅 */
  --CH13:var(--J3); /* 金 - 主 */
  --CH14:var(--J2); /* 金 - 浅 */
  /* 09 背景色 · CB · Background */
  --CB1:var(--H1); /* 卡片背景色 */
  --CB2:var(--H2); /* 页面背景色 */
  --CB3:var(--H2); /* 二层卡片 / 二级未选中 Tab */
  --CB35:#FCFDFF; /* 瓷片区卡片背景 */
  --CB41:#F6F8FC; /* 用于常规文字模块背景 */
  --CB7:var(--H2); /* 三层卡片 / 需要提亮特殊处理模块 */
  --CB8:var(--H1); /* 浅色浮层 */
  --CB4:var(--R1); /* 红色标签背景 */
  --CB43:var(--R2); /* 红色标签背景（深） */
  --CB5:var(--O1); /* 橙色标签背景 */
  --CB44:var(--O2); /* 橙色标签背景（深） */
  --CB6:var(--B1); /* 蓝色标签背景 */
  --CB45:var(--B2); /* 蓝色标签背景（深） */
  --CB9:var(--G1); /* 绿色标签背景 */
  --CB37:#FBF4EE; /* 金色标签背景 */
  --CB10:rgba(249,56,56,0.05); /* 指数涨背景 */
  --CB11:rgba(5,176,99,0.05); /* 指数跌背景 */
  --CB12:rgba(85,85,94,0.05); /* 指数平背景 */
  --CB36:rgba(255,112,21,0.05); /* 自选底部通知条 / 交易公告背景 */
  --CB13:rgba(249,56,56,0.08); /* 红色透明标签背景 */
  --CB14:rgba(43,115,255,0.08); /* 蓝色透明标签背景 */
  --CB15:rgba(255,112,21,0.08); /* 橙色透明标签背景 */
  --CB16:rgba(94,68,255,0.08); /* 紫色透明标签背景 */
  --CB27:rgba(5,176,99,0.08); /* 自选个股列表跌 / 理财热点 / 指数定投气泡背景 */
  --CB17:rgba(43,115,255,0.1); /* 自选 / 行情图表蓝色走势线背景色 */
  --CB18:rgba(0,0,0,0.8); /* 深色浮层背景 */
  --CB19:rgba(0,0,0,0.6); /* 常规遮罩色 */
  --CB20:rgba(249,56,56,0.25); /* 自选分时上涨 / 国金策略涨 */
  --CB21:rgba(5,176,99,0.25); /* 自选分时下跌 / 国金策略跌 */
  --CB22:rgba(85,85,94,0.25); /* 自选分时平 */
  --CB23:rgba(249,56,56,0); /* 自选分时上涨渐变端 */
  --CB24:rgba(5,176,99,0); /* 自选分时下跌渐变端 */
  --CB25:rgba(85,85,94,0); /* 自选分时平渐变端 */
  --CB26:rgba(255,255,255,0); /* 自选个股列表涨跌背景渐变端 */
  --CB28:#E3FAF9; /* 市场情绪-大盘情绪-偏低背景 */
  --CB29:rgba(249,56,56,0.1); /* 国金策略指数色值展示卡片背景 */
  --CB30:rgba(249,56,56,0.15); /* 国金策略指数色值展示卡片背景 */
  --CB31:rgba(249,56,56,0.2); /* 国金策略指数色值展示卡片背景 */
  --CB32:rgba(5,176,99,0.1); /* 国金策略指数色值展示卡片背景 */
  --CB33:rgba(5,176,99,0.15); /* 国金策略指数色值展示卡片背景 */
  --CB34:rgba(5,176,99,0.2); /* 国金策略指数色值展示卡片背景 */
  --CB38:#F6FBFF; /* 智能体相关的通用渐变背景色 */
  --CB39:#FFF9FF; /* 智能体相关的通用渐变背景色 */
  --CB40:#F3F5FF; /* 智能体相关的通用渐变背景色 */
  --CB42:#F6F5FF; /* 智能体相关卡片浅紫渐变背景色 */
}

/* ===================================================
 * 深色模式覆盖(仅 39 个 token 需切换,其余不变)
 * =================================================== */
[data-theme="dark"] {
  --CT1:var(--H1); /* 主要文本 / 标题 */
  --CT2:#BBBBBB; /* 大面积主要文本的黑肤特殊处理（例：资讯） */
  --CT3:var(--H7); /* 次要文本 / 副标题 */
  --CT5:var(--H6); /* 弱文本 / 失效文本 */
  --CS3:var(--H7); /* 平灰 */
  --CL1:var(--H14); /* 一级分割线 / 默认描边 */
  --CL2:var(--H14); /* 常规分割线 */
  --CL9:var(--H5); /* 分时图背景 */
  --CN12:var(--R11); /* 浅色主按钮背景色 */
  --CN13:var(--R12); /* 浅色主按钮背景色 - 按下 */
  --CN14:var(--H9); /* 灰色辅助按钮背景色 */
  --CN15:var(--H13); /* 灰色辅助按钮背景色 - 按下 */
  --CI1:var(--H1); /* 主要图标 */
  --CI2:var(--H7); /* 次要图标，搭配次要文本 */
  --CI4:var(--H8); /* 弱图标 / 失效图标，搭配弱文本及失效文本 */
  --CB1:var(--H11); /* 卡片背景色 */
  --CB2:var(--H9); /* 页面背景色 */
  --CB3:#1C1E2D; /* 二层卡片 / 二级未选中 Tab */
  --CB35:#1C1E2D; /* 瓷片区卡片背景 */
  --CB41:#1C1E2D; /* 用于常规文字模块背景 */
  --CB7:#282A35; /* 三层卡片 / 需要提亮特殊处理模块 */
  --CB8:#282A35; /* 浅色浮层 */
  --CB4:var(--R11); /* 红色标签背景 */
  --CB43:var(--R12); /* 红色标签背景（深） */
  --CB5:var(--O11); /* 橙色标签背景 */
  --CB44:var(--O12); /* 橙色标签背景（深） */
  --CB6:var(--B11); /* 蓝色标签背景 */
  --CB45:var(--B12); /* 蓝色标签背景（深） */
  --CB9:var(--G11); /* 绿色标签背景 */
  --CB37:#2D2724; /* 金色标签背景 */
  --CB17:var(--H5); /* 自选 / 行情图表蓝色走势线背景色 */
  --CB22:rgba(135,135,141,0.25); /* 自选分时平 */
  --CB25:rgba(135,135,141,0); /* 自选分时平渐变端 */
  --CB26:rgba(22,24,36,0); /* 自选个股列表涨跌背景渐变端 */
  --CB28:#062B31; /* 市场情绪-大盘情绪-偏低背景 */
  --CB38:#281B28; /* 智能体相关的通用渐变背景色 */
  --CB39:#1D2032; /* 智能体相关的通用渐变背景色 */
  --CB40:#1C1E2D; /* 智能体相关的通用渐变背景色 */
  --CB42:#302F50; /* 智能体相关卡片浅紫渐变背景色 */
}