/**
 * invite-web 视觉 token —— 对齐 user-app-v2「style-liuliang / 流量引擎」最新主题
 *
 * 来源：user-app-v2/styles/liuliang.scss §1（figma fileKey awkRQG9HhK1dCsox6j0yi1
 *       「流量引擎」红白主题，2026-05-20 第 4 次视觉重塑权威）。
 *
 * 翻译规则：
 *   - H5 无 rpx 单位，liuliang.scss 的 rpx 值 ÷2 还原为设计 px
 *     （如 24rpx → 12px / 32rpx → 16px / 48rpx → 24px）。
 *   - 命名 100% 沿用 v2 语义层 token（--brand-* / --bg-* / --text-* / --state-* ...），
 *     业务 class 引用 token 名跨工程 1:1 可移植。
 *   - 仅取 light 主题（白底 + 正红）—— 注册落地页不需要短视频沉浸黑主题。
 *
 * 主基调：正红 #EF4444（主 CTA / 链接 / 选中）+ 近白页 #FAFAFA + 纯白卡。
 *         极柔阴影 0 0 8px rgba(0,0,0,0.04) 是 liuliang 灵魂——禁用偏重阴影。
 */
:root {
  /* ───────── §1 品牌色（正红，figma red1）───────── */
  --brand-pri: #ef4444;            /* ★ 主品牌色：主 CTA / 顶栏强调 / 选中 / 链接 / 价格 */
  --brand-pri-pressed: #d63232;    /* 按压态（figma red2）*/
  --brand-pri-deep: #b12525;       /* 深态（figma red3）*/
  --brand-pri-soft: #feecec;       /* 弱底（chip / tag / readonly field 底色，白底场景）*/
  --brand-pri-alpha: rgba(239, 68, 68, 0.1);     /* 半透明弱底，叠彩底时混色 */
  --brand-pri-disabled: rgba(239, 68, 68, 0.4);
  --brand-grad-start: #ff7a6b;     /* banner 渐变起（浅红）*/
  --brand-grad-end: #ef4444;       /* banner 渐变终 = brand-pri */
  /* alias：旧 short-video-eco 主题命名兼容（download / index 沿用 brand-warm 引用）*/
  --brand-warm: #ef4444;
  --brand-warm-pressed: #d63232;
  --brand-warm-soft: #feecec;

  /* ───────── §2 背景色（figma 18:44 实测：白底卡片浮于近白页）───────── */
  --bg-page: #fafafa;              /* 页面整体底（近白）*/
  --bg-surface: #ffffff;           /* 卡片底（纯白，与近白页靠微反差 + 阴影分层）*/
  --bg-surface-2: #f5f5f5;         /* 次级 surface（figma gray10）*/
  --bg-input: #f5f5f5;             /* 输入框 / 搜索栏灰底（figma 真值，对齐 liuliang.scss §1.3）*/
  --bg-overlay: rgba(0, 0, 0, 0.5);

  /* ───────── §3 文本色（figma 中性梯度）───────── */
  --text-pri: #1c1c1e;             /* 主文 / 标题（figma gray90）*/
  --text-sec: #38373c;             /* 副文（figma gray70）*/
  --text-tert: #999999;            /* 弱文 / 占位（figma gray40）*/
  --text-disabled: #bbbbbb;        /* 禁用（figma gray30）*/
  --text-inverse: #ffffff;
  --text-brand: #ef4444;
  --dialog-desc: #666666;          /* 守卫 / 品牌弹窗副文（介于 sec/tert）*/

  /* ───────── §4 状态色（figma 功能色梯度）───────── */
  --state-success: #31af12;
  --state-success-bg: #eaf7e6;
  --state-warning: #f59e0b;
  --state-warning-bg: #fef3e0;
  --state-danger: #ef4444;         /* 与品牌同色，靠图标 / 上下文区分语义 */
  --state-danger-bg: #feecec;
  --state-info: #3971f9;
  --state-info-bg: #ebf0ff;

  /* ───────── §5 边框 / 分隔（figma 极柔）───────── */
  --border-sub: #dddddd;           /* 描边（figma gray20，强分隔）*/
  --border-pri: rgba(0, 0, 0, 0.14);
  --divider: #f2f2f2;              /* 极柔分隔线（列表项 / 卡片内分组）*/
  --hairline: rgba(0, 0, 0, 0.05);
  --hairline-strong: rgba(0, 0, 0, 0.1);
  --input-border: rgba(0, 0, 0, 0.06);   /* 账号域输入框 1px 描边（figma 257:864 实测）*/
  --input-placeholder: #cccccc;          /* 输入框占位符（figma 真值）*/
  --outline-focus: #ef4444;

  /* ───────── §6 圆角（H5 px，对齐 liuliang.scss §1.7，rpx → px 折半）───────── */
  --r-chip: 4px;                   /* chip / 角标 */
  --r-card: 12px;                  /* ★ figma 商品卡 / 通用卡 */
  --r-tile: 12px;                  /* 同 r-card */
  --r-tile-lg: 16px;               /* 大卡（订单卡）/ 按钮 */
  --r-section: 12px;               /* 区块 */
  --r-input: 8px;                  /* 输入框（搜索栏走 --r-pill）*/
  --r-modal: 16px;                 /* 模态 / 底部浮层 */
  --r-dialog: 24px;                /* 守卫 / 品牌弹窗卡（大于 --r-modal）*/
  --r-pill: 9999px;                /* 全圆（pill 按钮 / 头像 / 搜索栏）*/

  /* ───────── §7 阴影（figma 极柔，0 偏移 + 大模糊 + 极低透明度）───────── */
  --shadow-card: 0 0 8px rgba(0, 0, 0, 0.04);              /* 商品卡 / 通用卡 */
  --shadow-elevated: 0 0 8px rgba(177, 37, 37, 0.08);      /* 抬高卡（红调，figma 订单卡）*/
  --shadow-fab: 0 4px 12px rgba(239, 68, 68, 0.28);        /* 主 CTA 浮起 */
  --shadow-promo: 0 3px 8px rgba(239, 68, 68, 0.26);
  --shadow-modal: 0 -4px 16px rgba(0, 0, 0, 0.1);          /* 底部浮层（从底向上投影）*/
  /* alias：旧 short-video-eco 命名兼容 */
  --shadow-fab-blue: 0 4px 12px rgba(239, 68, 68, 0.28);

  /* ───────── §8 间距（4px grid，沿用）───────── */
  --s-1: 2px;
  --s-2: 4px;
  --s-3: 8px;
  --s-4: 12px;
  --s-5: 16px;
  --s-6: 20px;
  --s-7: 24px;
  --s-8: 32px;

  /* ───────── §9 字阶（H5 px，对齐 liuliang.scss §1.9）───────── */
  --fs-micro: 10px;                /* 角标 / tabBar / 辅助 */
  --fs-caption: 12px;              /* 次要 / 标签 / 按钮文 / 协议链 */
  --fs-body: 14px;                 /* 正文 / 商品名 / input 文字 */
  --fs-h3: 16px;                   /* 卡片 / 区块标题 */
  --fs-h2: 18px;                   /* section 标题 / 价格 / 主按钮 */
  --fs-h1: 20px;                   /* 页面主标题 / 昵称 */
  --fs-display: 28px;              /* 超大数字 / 错误码 */

  /* ───────── §10 字重 ───────── */
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  /* ───────── §11 行高 ───────── */
  --lh-tight: 1.25;
  --lh-normal: 1.5;
  --lh-loose: 1.75;

  /* ───────── §12 字体族 ───────── */
  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC",
    "Helvetica Neue", "Microsoft YaHei", system-ui, sans-serif;
  --font-display: "SF Pro Display", -apple-system, BlinkMacSystemFont,
    "PingFang SC", "Helvetica Neue", system-ui, sans-serif;
  --font-mono: "SF Mono", "Roboto Mono", "Menlo", "Monaco", "Consolas",
    "Courier New", monospace;

  /* ───────── §13 动效 ───────── */
  --duration-fast: 100ms;
  --duration-normal: 300ms;
  --easing-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --easing-decelerated: cubic-bezier(0, 0, 0.2, 1);
}