/* ==========================================================
   买得值 · 设计变量（可爱 / 糖果贴纸风）
   所有颜色、字号、圆角、阴影都从这里取，页面里不写魔法数字
   ========================================================== */
:root {
  /* 背景与表面 */
  --bg: #fff6ec;            /* 奶油黄底 */
  --bg-deep: #ffeddd;
  --surface: #ffffff;
  --surface-2: #fffbf4;

  /* 文字 */
  --ink: #3a2e3f;           /* 主文字：暖紫黑，不用纯黑 */
  --ink-2: #564760;
  --muted: #6e5f72;         /* 次要文字，白底 5.8:1 */
  --line: #3a2e3f;          /* 贴纸描边 */
  --line-soft: #f0dcc6;     /* 虚线、浅分割 */

  /* 主色与糖果色 */
  --primary: #c42b57;       /* 树莓红：白字 5.5:1 */
  --primary-deep: #9e1f45;
  --on-primary: #fff7f1;
  --pink: #ff7a93;
  --pink-soft: #ffe4ea;
  --butter: #ffd166;
  --butter-soft: #fff0c9;
  --mint: #46cdaa;
  --mint-soft: #d8f6ee;
  --sky: #79c4ff;
  --sky-soft: #e0f1ff;
  --taro: #b3a1f2;
  --taro-soft: #ede7ff;

  /* 语义色 */
  --ok: #1b7157;
  --ok-soft: #d8f6ee;
  --warn: #97341f;
  --warn-soft: #ffe5dc;

  /* 字体 */
  --font-sans: "MiSans", "HarmonyOS Sans SC", "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", system-ui, sans-serif;

  /* 字号阶梯：只有这 6 档 */
  --fs-12: 12px;
  --fs-13: 13px;
  --fs-16: 16px;
  --fs-20: 20px;
  --fs-28: 28px;
  --fs-40: clamp(28px, 4.4vw, 40px);

  /* 间距 */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;

  /* 圆角 */
  --r-pill: 999px;
  --r-lg: 28px;
  --r-md: 20px;
  --r-sm: 14px;

  /* 阴影：贴纸硬投影 + 柔和卡片投影 */
  --shadow-pop: 3px 3px 0 var(--ink);
  --shadow-card: 5px 6px 0 #f3e0cb;
  --shadow-card-soft: 4px 5px 0 #f6e7d6;
}