/* ==========================================================================
   生意参谋 SYCM — 设计令牌 (Design Tokens)
   全部数值提取自 sycm.taobao.com/cc/item_rank 页面内联样式表
   提取方式：解析 299 个 <style> 块共 2.68MB CSS，统计 21424 条规则
   ========================================================================== */

/* ==========================================================================
   字体（原始页面从 alicdn 加载，这里是同源地址，可离线替换为本地文件）
   - AlibabaSans102：数字/金额专用，是整套 UI 最显著的视觉特征
   - oui-canary-iconfont / anticon：图标字体
   ========================================================================== */
@font-face {
  font-family: "AlibabaSans102";
  src: url("https://g.alicdn.com/dt/sycm-static-fonts/0.0.1/AlibabaSans102/AlibabaSans102-Bd.ttf") format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "Alibaba-PuHuiTi";
  src: url("https://g.alicdn.com/dt/sycm-static-fonts/0.0.3/AlibabaPuHuiTi/Alibaba-PuHuiTi-Regular.ttf") format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "oui-canary-iconfont";
  src: url("https://at.alicdn.com/t/a/font_84613_uiac8dqu29.woff2") format("woff2"),
       url("https://at.alicdn.com/t/a/font_84613_uiac8dqu29.woff") format("woff");
  font-display: swap;
}

:root {
  /* ---------- 品牌主色 ---------- */
  --color-primary:            #2062e6;  /* 主色（按钮/链接/激活/排序）出现 29 次 */
  --color-primary-hover:      #4987f2;  /* 主色 hover */
  --color-primary-active:     #1145bf;  /* 主色按下 */
  --color-primary-light:      #f0f7ff;  /* 表格行 hover / 选中底色 */
  --color-primary-pale:       #5980ff;  /* 左侧菜单选中文字 / 次级蓝 */
  --color-primary-alt:        #3d5eff;  /* 新版强调蓝 出现 53 次 */
  --color-ai:                 #007aff;  /* AI 相关功能专用蓝 */
  --color-ai-gradient:        linear-gradient(180deg, #007aff 0%, #53a6ff 100%);

  /* ---------- 语义色 ---------- */
  --color-up:                 #f23c3c;  /* 指标上涨（红涨） */
  --color-down:               #08c45c;  /* 指标下跌（绿跌） */
  --color-danger:             #ff335e;  /* 警示/角标 出现 29 次 */
  --color-warning:            #ffc159;
  --color-success:            #08c45c;
  --color-info:               #14a4ff;

  /* ---------- 文字色 ---------- */
  --color-text-primary:       #333333;  /* 正文/卡片标题（87 次） */
  --color-text-regular:       #666666;  /* 次级文字（86 次） */
  --color-text-secondary:     #999999;  /* 辅助/占位（80 次） */
  --color-text-strong:        #111111;  /* 强调标题（54 次） */
  --color-text-menu:          #252934;  /* 左侧一级菜单文字 */
  --color-text-disabled:      #cecece;

  /* ---------- 边框 / 分割线 ---------- */
  --color-border:             #e6e6e6;  /* 卡片、表格主边框 */
  --color-border-light:       #f0f0f0;  /* 表格内部细线 */
  --color-border-token:       #e6e7eb;  /* 设计系统 --color-line1-1 */
  --color-border-card:        #e9ecf3;  /* 卡片头部/侧栏分割 */
  --color-lining:             #f0f2f5;  /* 设计系统 --color-lining */

  /* ---------- 背景 ---------- */
  --color-bg-page:            #eef1f6;  /* 页面底色（关键！灰蓝色调） */
  --color-bg-surface:         #ffffff;  /* 卡片/侧栏白底 */
  --color-bg-subtle:          #f7f8fa;  /* 表头/浅色块 */
  --color-bg-hover:           #f4f4f4;  /* 悬停 */

  /* ---------- 左侧菜单选中渐变 ---------- */
  --gradient-menu-active:     linear-gradient(270deg, #f4f8ff 0%, #ecf3ff 100%);

  /* ---------- 圆角 ---------- */
  --corner-zero:              0;
  --corner-1:                 4px;   /* 设计系统基础圆角：按钮/输入框/标签 */
  --corner-2:                 8px;
  --corner-3:                 16px;
  --corner-card:              12px;  /* 新版 op-cc 卡片圆角（关键！） */
  --corner-pill:              100px; /* 左侧菜单胶囊 */
  --corner-circle:            50%;

  /* ---------- 间距刻度（4 的倍数） ---------- */
  --s-base:                   4px;
  --s-1:                      4px;
  --s-2:                      8px;
  --s-3:                      12px;
  --s-4:                      16px;
  --s-5:                      20px;
  --s-6:                      24px;
  --s-7:                      28px;
  --s-8:                      32px;
  --s-9:                      36px;
  --s-10:                     40px;

  /* ---------- 线宽 ---------- */
  --line-1:                   1px;
  --line-2:                   2px;
  --line-3:                   3px;

  /* ---------- 字体 ---------- */
  /* 数字/金额专用字体，是这套 UI 最强的视觉特征 */
  --font-num:                 "AlibabaSans102", "Roboto", "Helvetica Neue", Arial, sans-serif;
  /* 中文正文 */
  --font-base:                "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "SimHei",
                              "WenQuanYi Micro Hei", sans-serif;
  /* 顶栏菜单用字体 */
  --font-topmenu:             "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;

  --fs-10:                    10px;
  --fs-11:                    11px;
  --fs-12:                    12px;   /* 主字号，出现 198 次 */
  --fs-13:                    13px;
  --fs-14:                    14px;   /* 次主字号，出现 124 次 */
  --fs-16:                    16px;   /* 卡片标题 / 顶栏菜单 */
  --fs-18:                    18px;
  --fs-20:                    20px;
  --fs-24:                    24px;
  --fs-32:                    32px;

  /* ---------- 布局尺寸 ---------- */
  --header-top-h:             60px;   /* 顶栏第一行 */
  --header-nav-h:             50px;   /* 顶栏第二行（一级菜单） */
  --header-pad-h:             47px;   /* 顶栏左右内边距 */
  --sidebar-w:                160px;  /* 左侧菜单宽度 */
  --layout-min-w:             1210px; /* 内容最小宽度 */
  --layout-mid-w:             1310px;
  --layout-max-w:             100%;   /* 2026-10-31：原 1430px 会在宽屏右侧留一大片空白，改成铺满 */
  --body-min-w:               1240px; /* body 最小宽度 */
  --card-gap:                 18px;   /* 卡片纵向间距 */
  --card-pad-h:               24px;   /* 卡片左右内边距 */
  --card-header-h:            60px;   /* 卡片头行高 */
  --right-agent-w:            400px;  /* AI 右侧面板宽度 */

  /* ---------- 阴影 ---------- */
  --shadow-card:              0 2px 8px rgba(0, 0, 0, 0.15);  /* 旧版卡片阴影，新版已关闭 */
  --shadow-sidebar:           0 1px 4px rgba(0, 0, 0, 0.10);
  --shadow-popup:             0 2px 8px rgba(0, 0, 0, 0.15);
  --shadow-none:              none;

  /* ---------- 顶栏背景 ---------- */
  /* 标准皮肤：4000x900 蓝色渐变横幅（原始默认规则 .has-left-menu-root） */
  --header-bg-image:          url("https://img.alicdn.com/imgextra/i1/O1CN01f0AXSF1uzW0EYAU4i_!!6000000006108-2-tps-4000-900.png");
  /* CSS 渐变兜底：CDN 不可用时的等价观感 */
  --header-bg-gradient:       linear-gradient(95deg, #2b57d6 0%, #3a5cd3 45%, #4f7be8 100%);
  /* 注：快照抓取时页面正处双11活动皮肤，以下变量覆盖了上面的标准背景
     --bgImage:         url(https://img.alicdn.com/imgextra/i2/O1CN01CATEvFVZzxE43lNA_!!6000000004902-2-tps-2000-432.png)
     --activityBgImage: url(https://img.alicdn.com/imgextra/i3/O1CN019a3FXJY4t4K43lRg_!!6000000002363-2-tps-2000-712.png)
     如需复刻活动态外观，把 --header-bg-image 改成上面 --bgImage 的地址即可。 */
}