/* ▼ 自动生成,请勿手改本文件头 ▼
   css/01-tokens.css  —— 整块 :root 变量 —— 设计令牌 / 排版 / 投影 / 间距 / 动效 / 液态玻璃

   本文件由 scripts/split.mjs 从 public/index.html 切出。
   ⚠️ 加载顺序在 index.html 里固定,不要调整 ——
      CSS 级联与 JS 执行都吃顺序,换了位置就会出问题。
   ===== 文件头结束(以下为原样切出的内容) ===== */
  /* ===== 设计令牌:字号缩放 / 移动端尺寸 / 颜色 / 圆角 =====
     主题色只动 --primary* 那一组;所有带透明度的场合都用 RGB 三元组变量,
     换色时才不会漏掉某处。 */
  :root {
    --font-scale: 1;
    /* 移动端布局用的尺寸令牌。safe-area 在桌面与不支持 env() 的浏览器上是 0,不会影响原布局 */
    --header-h: 60px;
    --safe-t: env(safe-area-inset-top, 0px);
    --safe-b: env(safe-area-inset-bottom, 0px);
    --header-total: calc(var(--header-h) + var(--safe-t));
    --bg: #f7f7f9;
    --surface: #ffffff;
    --surface-2: #fafafb;
    --hover: #f3f4f6;
    --border: #e5e7eb;
    --border-strong: #d1d5db;
    --text: #0f172a;
    --text-secondary: #475569;
    --text-tertiary: #94a3b8;
    /* 品牌色令牌:默认绿色。切换主题色只动这一组变量,
       带 alpha 的场合一律用 RGB 三元组变量,换色才不会漏 */
    --primary: #10b981;
    --primary-hover: #059669;
    --primary-2: #34d399;
    --primary-light: rgba(var(--primary-rgb), .12);
    --primary-soft: rgba(var(--primary-2-rgb), .09);
    --primary-rgb: 16, 185, 129;
    --primary-2-rgb: 52, 211, 153;
    --primary-tint: #6ee7b7;        /* 暗色下的浅色文字/高光 */
    --primary-tint-rgb: 110, 231, 183;
    --primary-2-tint: #a7f3d0;
    --primary-2-tint-rgb: 167, 243, 208;
    --primary-tint-2: #a7f3d0;
    --success: #10b981;
    --warning: #f59e0b;
    --danger: #ef4444;
    --user-bubble: linear-gradient(135deg, var(--primary), var(--primary-2));
    --ai-bubble: #f3f4f6;
    --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
    --shadow-md: 0 4px 12px rgba(15, 23, 42, 0.06), 0 1px 3px rgba(15, 23, 42, 0.04);
    --shadow-lg: 0 12px 28px rgba(15, 23, 42, 0.08), 0 4px 10px rgba(15, 23, 42, 0.04);
    --radius-sm: 12px;
    --radius: 16px;
    --radius-lg: 24px;
    --radius-xl: 30px;

    /* ===== 排版层级:字重 / 字距对比 ===== */
    --fw-regular: 400;
    --fw-medium: 510;
    --fw-semibold: 620;
    --fw-bold: 720;
    --ls-tight: -0.35px;
    --ls-normal: 0;
    --ls-wide: 0.6px;

    /* ===== 多层微投影 Subtle Shadows(由近及远,4 层扩散) ===== */
    --shadow-1: 0 1px 2px rgba(15, 23, 42, .05);
    --shadow-2: 0 2px 6px rgba(15, 23, 42, .04), 0 1px 2px rgba(15, 23, 42, .04);
    --shadow-3: 0 4px 12px rgba(15, 23, 42, .06), 0 1px 3px rgba(15, 23, 42, .04);
    --card-shadow:
      0 1px 2px rgba(15, 23, 42, .04),
      0 2px 6px rgba(15, 23, 42, .03),
      0 8px 20px rgba(15, 23, 42, .05),
      0 18px 44px rgba(15, 23, 42, .06),
      inset 0 1px 1px rgba(255, 255, 255, .95),
      inset 0 0 44px rgba(255, 255, 255, .26);
    --card-shadow-hover:
      0 2px 4px rgba(15, 23, 42, .05),
      0 4px 10px rgba(15, 23, 42, .04),
      0 12px 28px rgba(15, 23, 42, .07),
      0 26px 60px rgba(15, 23, 42, .09),
      inset 0 1px 1px rgba(255, 255, 255, 1),
      inset 0 0 52px rgba(255, 255, 255, .36);
    --chip-shadow-hover:
      0 2px 5px rgba(var(--primary-rgb), .12),
      0 8px 18px rgba(var(--primary-rgb), .18),
      inset 0 1px 1px rgba(255, 255, 255, .98),
      inset 0 0 20px rgba(255, 255, 255, .45);
    --ring-focus: 0 0 0 3px rgba(var(--primary-rgb), .16);

    /* ===== 间距节奏 ===== */
    --sp-1: 6px;
    --sp-2: 10px;
    --sp-3: 14px;
    --sp-4: 18px;
    --sp-5: 24px;
    --pad-page: 16px;
    --gap: 16px;

    /* ===== 动效曲线 ===== */
    --ease-smooth: cubic-bezier(.4, 0, .2, 1);
    --ease-out: cubic-bezier(.22, .61, .36, 1);
    --ease-spring: cubic-bezier(.34, 1.46, .64, 1);
    --dur-fast: .16s;
    --dur: .24s;
    --dur-slow: .38s;

    /* ===== 液态玻璃 Liquid Glass ===== */
    --glass-tint: linear-gradient(135deg, rgba(255,255,255,.72) 0%, rgba(255,255,255,.36) 45%, rgba(255,255,255,.52) 100%);
    --glass-tint-strong: linear-gradient(135deg, rgba(255,255,255,.82) 0%, rgba(255,255,255,.56) 55%, rgba(255,255,255,.70) 100%);
    --glass-edge: rgba(255, 255, 255, 0.62);
    --glass-blur: blur(20px) saturate(200%) brightness(1.03);
    --glass-blur-soft: blur(14px) saturate(170%) brightness(1.02);
    /* 多层内阴影 = 玻璃厚度的边缘折射高光 */
    --glass-refract:
      0 6px 22px rgba(15, 23, 42, .10),
      0 2px 6px rgba(15, 23, 42, .05),
      inset 0 1.5px 1px rgba(255, 255, 255, .98),
      inset 0 -1px 1px rgba(255, 255, 255, .40),
      inset 0 0 22px rgba(255, 255, 255, .30),
      inset 0 -8px 20px rgba(var(--primary-rgb), .05);
    --glass-refract-hover:
      0 10px 30px rgba(15, 23, 42, .13),
      0 3px 10px rgba(15, 23, 42, .06),
      inset 0 1.5px 1px rgba(255, 255, 255, 1),
      inset 0 -1px 1px rgba(255, 255, 255, .50),
      inset 0 0 28px rgba(255, 255, 255, .45),
      inset 0 -10px 24px rgba(var(--primary-rgb), .09);
  }