/* ============================================================
   沃选数学岛 · 设计 Token（唯一来源）
   门户父页面 /game/、家长 /materials/、知识 /math/ 共用。
   规则：颜色、圆角、阴影、间距只能取这里的变量，页面里不许写死。
   依据：《游戏门户整体架构梳理方案》第三部分（2026-10-14 通过）
   ============================================================ */
:root{
  /* ---- 颜色 ---- */
  --wx-primary:#3B6EF5;        /* 主色 */
  --wx-primary-ink:#2A55CC;    /* 主色按下/厚底边 */
  --wx-primary-soft:#EAF0FE;   /* 主色浅底（选中、提示条） */
  --wx-reward:#FF9F1C;         /* 奖励色：只用在星星、奖杯上 */
  --wx-reward-soft:#FFF3E0;
  --wx-success:#22C55E;        /* 成功色 */
  --wx-success-ink:#15803D;
  --wx-success-soft:#E8F8EE;
  --wx-danger:#EF4444;         /* 答错提示（方案外补充，仅用于对错反馈） */
  --wx-danger-soft:#FDECEC;
  --wx-bg:#F7F9FC;             /* 背景 */
  --wx-surface:#FFFFFF;        /* 卡片/顶栏 */
  --wx-text:#1F2937;           /* 正文 */
  --wx-text-2:#6B7280;         /* 次要文字 */
  --wx-text-3:#9CA3AF;         /* 禁用/占位 */
  --wx-line:#E5E9F0;           /* 分隔线、描边 */
  --wx-disabled:#F1F3F7;       /* 禁用底色 */
  --wx-mask:rgba(31,41,55,.45);/* 弹层遮罩 */

  /* ---- 圆角：四档 ---- */
  --wx-r-sm:8px;
  --wx-r-md:12px;   /* 按钮 */
  --wx-r-lg:16px;   /* 卡片 */
  --wx-r-xl:24px;   /* 弹层、大卡 */
  --wx-r-pill:999px;/* 进度条、徽标 */

  /* ---- 阴影：只有一档 ---- */
  --wx-shadow:0 2px 8px rgba(31,41,55,.08);
  /* 厚底边：只给主操作按钮用 */
  --wx-edge:inset 0 -3px 0 var(--wx-primary-ink);

  /* ---- 间距：4/8 的倍数 ---- */
  --wx-s1:4px;
  --wx-s2:8px;
  --wx-s3:12px;
  --wx-s4:16px;   /* 卡片之间 */
  --wx-s5:20px;   /* 卡片内边距 */
  --wx-s6:24px;
  --wx-s8:32px;
  --wx-s10:40px;

  /* ---- 字体 ----
     品牌标题字体（站酷快乐体 / 思源黑体 Heavy）待确认商用授权后再接入，
     目前标题与正文都用系统字体栈，只靠字重区分。 */
  --wx-font:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC","Source Han Sans SC",sans-serif;
  --wx-font-title:var(--wx-font);
  --wx-fs-xs:12px;
  --wx-fs-sm:14px;
  --wx-fs-md:16px;
  --wx-fs-lg:18px;
  --wx-fs-xl:22px;
  --wx-fs-xxl:28px;

  /* ---- 布局 ---- */
  --wx-top-h:56px;      /* 顶栏高度 */
  --wx-tabbar-h:60px;   /* 手机底部 Tab 高度（不含安全区） */
  --wx-content-w:1020px;/* 内容区最大宽度 */
  --wx-desktop:1024px;  /* 桌面断点（仅作说明，媒体查询里不能用变量） */
}