/* ============================================================
   设计令牌 —— 亮面液态玻璃 / Liquid Glass (Light)
   方向：iOS 26 液态玻璃。浅暖灰底 + 半透明白玻璃层 + 单一墨玉绿强调。
   氛围层走珊瑚/琥珀/薄荷的暖冷对撞，刻意避开"白底蓝紫渐变"那套通用观感。
   所有颜色、字阶、间距、圆角、阴影、动效时长的唯一出处。
   组件里禁止出现硬编码色值。
   ============================================================ */

/* —— 自托管字体：不依赖 Google CDN，国内直连 / 完全离线都能用 ——
   中文不自托管：思源黑体全字库 17MB，不符合轻量目标。
   改用系统思源黑体栈（PingFang SC / HarmonyOS Sans SC / Noto Sans SC /
   微软雅黑），覆盖 iOS·macOS·Android·鸿蒙·Windows，下载 0 字节。
   拉丁文与数字用自托管 Bricolage Grotesque（展示）+ Sora（正文）。 */
@font-face {
  font-family: 'Bricolage Grotesque';
  src: url('/fonts/bricolage-var.woff2') format('woff2-variations');
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Sora';
  src: url('/fonts/sora-var.woff2') format('woff2-variations');
  font-weight: 100 800;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ——— 色彩：浅暖灰底 60% / 白玻璃层 30% / 墨玉绿强调 10% ——— */
  --bg:            #edece7;   /* 暖浅灰，不是纯白 */
  --bg-deep:       #e3e1da;   /* 页脚等下沉区域 */
  --surface:       #f7f6f3;   /* 不透明卡片兜底（无 backdrop-filter 时） */
  --surface-2:     #ffffff;

  --text:          #16130f;   /* 暖近黑，不是纯黑 */
  --text-soft:     #453f38;
  --muted:         #6f685e;   /* 对 --bg 实测 4.9:1 */
  --muted-dim:     #948c80;   /* 仅用于 ≥18px 或非关键信息，实测 3.1:1 */

  /* 唯一强调色：墨玉绿。对 --bg 实测 6.4:1，正文级别可用。
     只给主行动、价格、选中态。绝不用于装饰。 */
  --accent:        #0a6b52;
  --accent-deep:   #064b3a;
  --accent-soft:   #e0efe9;
  --accent-ink:    #ffffff;   /* 绿底上的文字，实测 6.4:1 */
  --accent-glow:   rgba(10, 107, 82, .22);
  --accent-haze:   rgba(10, 107, 82, .07);

  /* 氛围光晕（背景层，不参与强调色计数）。暖珊瑚主导 + 一点薄荷制造冷暖张力。 */
  --aura-coral:    rgba(255, 122, 71, .34);
  --aura-amber:    rgba(255, 193, 74, .30);
  --aura-mint:     rgba(38, 205, 178, .24);

  /* 状态色（浅底版本，全部压深以保证 4.5:1） */
  --ok:            #10714a;
  --warn:          #8a5a00;
  --danger:        #b3261e;
  --info:          #1c4fb8;

  /* ——— 玻璃材质：亮面。白色半透明 + 顶亮底暗的边缘 ——— */
  --glass-tint:      rgba(255, 255, 255, .52);
  --glass-tint-2:    rgba(255, 255, 255, .72);
  --glass-tint-3:    rgba(255, 255, 255, .86);
  --glass-edge:      rgba(255, 255, 255, .95);  /* 受光的上边缘 */
  --glass-edge-dim:  rgba(22, 19, 15, .09);     /* 背光的下边缘 */
  --glass-hair:      rgba(22, 19, 15, .10);     /* 发丝分隔线 */
  --glass-spec:      rgba(255, 255, 255, .85);  /* 跟随光标的镜面高光 */
  --glass-blur:      24px;
  --glass-blur-lg:   40px;
  --glass-sat:       180%;                      /* 让透过的彩光更饱和 */

  /* ——— 字体 ———
     CJK 走系统栈；拉丁与数字走自托管。绝不对中文使用 italic（中文无真斜体）。 */
  --font-cjk:     'PingFang SC', 'HarmonyOS Sans SC', 'Source Han Sans SC',
                  'Noto Sans SC', 'Microsoft YaHei', sans-serif;
  --font-display: 'Bricolage Grotesque', var(--font-cjk);
  --font-body:    'Sora', var(--font-cjk);
  --font-mono:    ui-monospace, 'SF Mono', 'JetBrains Mono', 'Cascadia Mono', Menlo, monospace;

  /* 模块化字阶，比例 1.25 */
  --fs-xs:   0.75rem;    /* 12 */
  --fs-sm:   0.8125rem;  /* 13 */
  --fs-base: 0.9375rem;  /* 15 */
  --fs-md:   1.0625rem;  /* 17 */
  --fs-lg:   1.375rem;   /* 22 */
  --fs-xl:   1.75rem;    /* 28 */
  --fs-2xl:  2.375rem;   /* 38 */
  --fs-3xl:  3.25rem;    /* 52 */
  --fs-4xl:  clamp(2.75rem, 7vw, 5.25rem);

  /* ——— 间距（4/8/16/24/40/64/96） ——— */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 16px; --sp-4: 24px;
  --sp-5: 40px; --sp-6: 64px; --sp-7: 96px; --sp-8: 140px;

  /* ——— 圆角：iOS 26 的连续曲率观感，用大圆角 ——— */
  --r-xs: 8px;  --r-sm: 12px; --r-md: 18px;
  --r-lg: 26px; --r-xl: 34px; --r-pill: 999px;

  /* ——— 阴影：三级，带暖色而非纯黑。浅底上必须轻、散、大。 ——— */
  --shadow-1: 0 1px 2px rgba(60, 45, 30, .06), 0 2px 8px rgba(60, 45, 30, .05);
  --shadow-2: 0 2px 6px rgba(60, 45, 30, .06), 0 10px 28px rgba(60, 45, 30, .09);
  --shadow-3: 0 6px 16px rgba(60, 45, 30, .08), 0 28px 64px rgba(60, 45, 30, .14);

  /* ——— 动效 ——— */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast:  170ms;
  --dur-base:  340ms;
  --dur-slow:  680ms;

  --maxw: 1180px;
}