/* ==========================================================================
   MyHgm Design Tokens — 统一设计令牌层（light）
   依据 kimi-design-skill references/tokens.json（color / typography / radius /
   spacing / effect）+ principles.md（Quiet Utility / Semantic Hierarchy /
   Surface Over Stroke）建立，全站 redot / app-shell / auth 壳共用。

   令牌缺口记录（token gaps）：
   - --k-accent 产品品牌红 #e9382c：Kimi 令牌无产品品牌色，属产品决策。
   - --k-display-* 金额展示字号（40/44px）：Kimi webUI 无 display 角色，
     来源于 design/ 参考截图（RedotPay），属产品决策。
   - 列表分隔线使用 separator 的 6% 透明度变体（比 s1 的 13% 更轻），
     遵循 principles「separators should be visually light」。
   ========================================================================== */

body.myhgm-app-shell,
body.redot-home,
body.myhgm-auth-redot {
  /* —— 文本层级 color.labels.* —— */
  --k-label-1: rgba(0, 0, 0, 0.9);    /* labels.primary */
  --k-label-2: rgba(0, 0, 0, 0.6);    /* labels.secondary */
  --k-label-3: rgba(0, 0, 0, 0.45);   /* labels.tertiary —— 列表次级/时间戳 */
  --k-label-4: rgba(0, 0, 0, 0.3);    /* labels.quaternary —— 占位/禁用 */

  /* —— 填充 color.fills.*（Surface Over Stroke：状态用填充表达） —— */
  --k-fill-f1: rgba(0, 0, 0, 0.03);   /* 静止灰底 / 轻 hover */
  --k-fill-f1-hover: rgba(0, 0, 0, 0.059);
  --k-fill-f2: rgba(0, 0, 0, 0.05);   /* 控件灰底（快捷入口/胶囊） */
  --k-fill-f2-hover: rgba(0, 0, 0, 0.079);
  --k-fill-f2-active: rgba(0, 0, 0, 0.098);
  --k-fill-f3: rgba(0, 0, 0, 0.15);   /* 强按下 */

  /* —— 分隔 color.separator.s1 —— */
  --k-separator: rgba(0, 0, 0, 0.13); /* 输入框边、弹层描边 */
  --k-hairline: rgba(0, 0, 0, 0.06);  /* 列表分隔线（轻量变体，见头部记录） */

  /* —— 背景 color.background.* —— */
  --k-bg: #ffffff;                    /* background.primary */
  --k-bg-secondary: #f5f5f5;          /* background.secondary */

  /* —— 品牌与状态 —— */
  --k-accent: #e9382c;                /* 产品品牌红（令牌缺口，见头部记录） */
  --k-accent-hover: #d43227;
  --k-accent-active: #c02c22;
  --k-accent-tint: rgba(233, 56, 44, 0.08);   /* 选中底 */
  --k-info: #2563eb;                  /* 信息蓝：底栏激活态（产品决策） */
  --k-info-tint: #eff4ff;             /* 信息蓝淡底：底栏激活背景 */
  --k-ink-strong: #111111;            /* 主要按钮底（kimiDark 等价深色） */
  --k-ink-strong-hover: #252525;      /* brand.kimiDark.hover */
  --k-ink-strong-active: #000000;

  --k-success: #16c456;               /* status.positiveGreen */
  --k-success-tint: rgba(22, 196, 86, 0.1);   /* others.lightGreenBg */
  --k-danger: #ff3849;                /* status.danger */
  --k-danger-tint: rgba(255, 77, 77, 0.1);    /* others.lightRedBg */
  --k-warning: #ff9500;               /* status.orange（pending/caution） */
  --k-warning-tint: rgba(255, 149, 0, 0.1);   /* others.lightOrangeBg */
  --k-warning-ink: #92600a;           /* warning tint 上的可读文字色 */

  /* —— 字体 typography.webUI.*（PingFang SC 不可用时回落系统栈） —— */
  --k-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display",
    "Segoe UI", "Inter", "PingFang SC", "Microsoft YaHei", sans-serif;
  --k-fs-large-title: 20px;           /* largeTitleEmphasized 20/30 w600 */
  --k-fs-page-title: 17px;            /* ui.pageTitle 17/24 */
  --k-fs-t2: 16px;                    /* t2 16/24 */
  --k-fs-b1: 15px;                    /* b1 15/22 */
  --k-fs-b2: 14px;                    /* b2 14/20 */
  --k-fs-c1: 12px;                    /* c1 12/18 —— 仅辅助元信息 */
  --k-fs-display: 44px;               /* 首页总资产（产品 display，见头部记录） */
  --k-fs-display-sm: 40px;            /* 子页总资产 */

  /* —— 圆角 radius.* —— */
  --k-radius-xxs: 4px;
  --k-radius-sm: 8px;
  --k-radius-md: 10px;
  --k-radius-lg: 12px;                /* >32px 控件、普通卡片 */
  --k-radius-xl: 16px;                /* 大卡片（banner/promo/vcard） */
  --k-radius-full: 999px;             /* 有意的胶囊形（底栏/主 CTA） */

  /* —— 间距 spacing.*：4 / 8 / 12 / 16 / 20 / 24 / 32 —— */
  --k-space-xs: 4px;
  --k-space-sm: 8px;
  --k-space-md: 12px;
  --k-space-lg: 16px;
  --k-space-xl: 20px;
  --k-space-2xl: 24px;
  --k-space-3xl: 32px;

  /* —— 阴影 effect.shadow.*（仅表达层级，不装饰） —— */
  --k-shadow-small: 0 4px 16.4px rgba(0, 0, 0, 0.1);
  --k-shadow-tabbar: 0 8px 30px rgba(0, 0, 0, 0.12);
  --k-shadow-card: 0 3px 10px rgba(0, 0, 0, 0.07);

  /* —— 动效 animation.md：短促、ease-out、仅 transform/opacity —— */
  --k-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --k-dur-press: 120ms;
  --k-dur-hover: 150ms;
  --k-dur-enter: 200ms;
  --k-press-scale: 0.97;

  /* —— 层级 web-best-practices.md §Layering —— */
  --k-z-header: 500;                  /* 顶栏 / 悬浮底栏 */
  --k-z-modal-backdrop: 800;
  --k-z-modal: 810;
  --k-z-dialog-backdrop: 850;
  --k-z-dialog: 860;
  --k-z-tooltip: 900;
  --k-z-skeleton: 950;                /* 全屏骨架（低于 toast） */
  --k-z-toast: 1000;

  /* ========== 旧变量别名：--rd-* / --app-* → 规范令牌 ==========
     既有 CSS 文件不改一行即可获得统一色板。 */
  --rd-bg: var(--k-bg);
  --rd-red: var(--k-accent);
  --rd-blue: var(--k-info);           /* 底栏激活等场景的信息蓝 */
  --rd-ink: #111111;                  /* 与 --k-label-1 视觉等价，保留实色供边框场景 */
  --rd-muted: var(--k-label-3);
  --rd-line: var(--k-hairline);
  --rd-gray: var(--k-bg-secondary);
  --rd-gray-border: var(--k-hairline);
  --rd-radius: var(--k-radius-lg);
  --rd-radius-lg: var(--k-radius-xl);
  --rd-font: var(--k-font);

  --app-bg: var(--k-bg);
  --app-ink: #111111;
  --app-muted: var(--k-label-3);
  --app-muted-2: var(--k-label-4);
  --app-line: var(--k-hairline);
  --app-gray: var(--k-bg-secondary);
  --app-gray-btn: var(--k-bg-secondary);
  --app-gray-border: var(--k-hairline);
  --app-accent: var(--k-accent);
}