/* ==========================================================================
   巧思AI · 主题令牌
   三套主题：橙黄（sun）/ 海蓝（sea）/ 粉红（pink），都是大面积白底；
   切主题只换 html[data-theme]，端上顶栏那颗图标按钮点一下轮切这三套。
   后台「数学 → 平台设置」写入 ms_mathsci_setting.theme，前台与后台共用本文件。
   ========================================================================== */

/* 品牌色固定：标记在橙黄 / 海蓝 / 粉红三套主题下都不变色。
   与 --ms-hero-a/-b 分开：hero 跟主题走，品牌标记不跟。
   白字压这两端是 3.08 / 4.35，过图形标记 3:1；值就是 brand-mark.svg 里那对。 */
:root {
  --ms-brand-a: #f2691c;
  --ms-brand-b: #d14f07;
  --ms-brand-shadow: 0 4px 14px rgba(242, 105, 28, .22);
}

/* 橙黄：站标主色，也是唯一一套写全所有令牌的基准，下面两套只覆盖跟着色相走的那些 */
:root,
html[data-theme="sun"] {
  --ms-primary: #ff8a3d;
  --ms-primary-strong: #f2691c;
  --ms-primary-soft: #fff3e8;
  --ms-primary-line: #ffd6b3;
  --ms-accent: #ffb300;
  --ms-accent-soft: #fff8e6;
  /* hero 渐变两端都换成深色：旧值 #ffb03a/#ff7a3d 上压白字只有 1.82/2.59，端上每一处
     「渐变底 + 白字」（主按钮、封面兜底字、课包首字）全在 3:1 以下。
     橙黄这对与品牌标记同色；海蓝/粉红只换 hero，品牌标记仍取上面的 --ms-brand-*。 */
  --ms-hero-a: #f2691c;
  --ms-hero-b: #d14f07;
  --ms-on-primary: #ffffff;

  --ms-bg: #ffffff;
  --ms-surface: #ffffff;
  --ms-surface-alt: #fcfaf7;
  --ms-text: #23272f;
  --ms-text-sub: #6b7280;
  --ms-muted: #9ca3af;
  --ms-border: #f0e9e0;
  --ms-border-strong: #e2d8cc;

  --ms-success: #1fa971;
  --ms-success-soft: #e9f8f1;
  --ms-warning: #e8a33d;
  --ms-danger: #e2574c;
  --ms-danger-soft: #fdeeec;
  --ms-info: #2e9cca;

  --ms-radius-s: 8px;
  --ms-radius: 14px;
  --ms-radius-l: 22px;
  --ms-shadow: 0 2px 10px rgba(38, 28, 15, .06);
  --ms-shadow-l: 0 14px 34px rgba(38, 28, 15, .10);
  --ms-shadow-primary: 0 4px 14px rgba(242, 105, 28, .22);

  /* 别名：同一套令牌允许两种写法（-s/-sm、muted/text-muted、border/line） */
  --ms-radius-sm: var(--ms-radius-s);
  --ms-radius-lg: var(--ms-radius-l);
  --ms-shadow-sm: var(--ms-shadow);
  --ms-text-muted: var(--ms-muted);
  --ms-line: var(--ms-border);

  --ms-cell: #ffffff;
  --ms-cell-given: #fff8f0;
  --ms-cell-user: #ffffff;
  --ms-cell-self: #fff1e0;
  --ms-cell-peer: #fdf7f0;
  --ms-cell-same: #ffe3bd;
  --ms-cell-bad: #fdeceb;
  --ms-cell-ok: #e9f8f1;
  --ms-grid-line: #d9d2c8;
  --ms-grid-thick: #2c2a27;
  --ms-tile: linear-gradient(180deg, #ffffff, #fff6ea);
  --ms-tile-edge: #ffd6b3;

  --ms-nav-h: 64px;
  --ms-tap: 48px;
  --ms-font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --ms-num: "DIN Alternate", "Bahnschrift", ui-rounded, "Helvetica Neue", sans-serif;
}

/* ==========================================================================
   字阶 · 端上（前台）统一的 11 档
   --------------------------------------------------------------------------
   三族：展示族管「一屏只出现一次的大字」，正文族管「读」，数字族管「看一眼就要看见的数」，
   ctl 是按钮/菜单项/导航控件那一档。切主题不换字号，所以这一组放在与主题无关的 :root。
   规矩：端上 CSS 里新写文字一律引用这里的变量，不再随手填 px；
   只有两类例外留在字面值里——随格子边长缩放题面数字（.msl-cell、.msm-bc、.msm-ring__in）
   和纯装饰字形（.ms-cover__fallback、.ms-empty__icon、.ms-pack__letter 那种），
   它们跟着盒子几何走，套进文字档会撑破宿主那一格。
   底线：正文与表格 ≥16px、说明类 14px、徽标 12px，与 page-account.css 头部写的口径一致。
   ========================================================================== */
:root {
  /* 展示族：一屏一次 */
  --ms-fs-display: clamp(26px, 2.8vw, 38px);
  --ms-fs-title: clamp(21px, 2.1vw, 30px);
  /* 正文族 */
  --ms-fs-section: clamp(18px, 1.6vw, 22px);
  --ms-fs-body: clamp(16px, 1.2vw, 18px);
  /* 课堂正文比通用页重一档（投屏离得远），只有 learn/* 题板页用它 */
  --ms-fs-body-lg: clamp(16px, 1.15vw, 19px);
  --ms-fs-sub: 14px;
  --ms-fs-micro: 12px;
  /* 数字族 */
  --ms-fs-num-lg: clamp(26px, 2.6vw, 36px);
  --ms-fs-num: clamp(20px, 1.9vw, 28px);
  --ms-fs-num-sm: 17px;
  /* 控件族：按钮、菜单项、顶栏控件同一档 */
  --ms-fs-ctl: 15px;
}

/* ==========================================================================
   海蓝：主色 #1c86b8（白字 4.08:1）、强调字 #0e618c（白底 6.76:1），
   灰阶与阴影一起从橙系的暖调换成冷调，否则蓝主色旁边挂着一条米色描边会脏。
   ========================================================================== */
html[data-theme="sea"] {
  --ms-primary: #1c86b8;
  --ms-primary-strong: #0e618c;
  --ms-primary-soft: #e8f5fb;
  --ms-primary-line: #c4e3f2;
  --ms-accent: #2aa8c4;
  --ms-accent-soft: #e6f7fa;
  /* 与 sun 同一条规矩：hero 两端就是本套的主色对，白字 4.08/6.76（旧的 #5bc6e8 只有 1.96） */
  --ms-hero-a: #1c86b8;
  --ms-hero-b: #0e618c;

  --ms-surface-alt: #f6fafc;
  --ms-border: #e2edf2;
  --ms-border-strong: #c8dbe3;

  --ms-shadow: 0 2px 10px rgba(14, 58, 78, .07);
  --ms-shadow-l: 0 14px 34px rgba(14, 58, 78, .12);
  --ms-shadow-primary: 0 4px 14px rgba(14, 97, 140, .24);

  --ms-cell-given: #f0f7fb;
  --ms-cell-self: #dceef8;
  --ms-cell-peer: #f4fafc;
  --ms-cell-same: #cae8f6;
  --ms-grid-line: #ccd9df;
  --ms-grid-thick: #252c31;
  --ms-tile: linear-gradient(180deg, #ffffff, #f2f9fc);
  --ms-tile-edge: #c4e3f2;
}

/* ==========================================================================
   粉红：主色 #e94b82（白字 3.62:1）、强调字 #c13065（白底 5.41:1）。
   --ms-danger 保持 #e2574c 不动：判错那一档要靠语义色，不能跟着主题变成另一种粉。
   ========================================================================== */
html[data-theme="pink"] {
  --ms-primary: #e94b82;
  --ms-primary-strong: #c13065;
  --ms-primary-soft: #fdeef4;
  --ms-primary-line: #f8cede;
  --ms-accent: #ef7fae;
  --ms-accent-soft: #fdf1f6;
  /* 同上：两端取本套主色对，白字 3.62/5.41（旧的 #ff9ec2 只有 1.92） */
  --ms-hero-a: #e94b82;
  --ms-hero-b: #c13065;

  --ms-surface-alt: #fdf7f9;
  --ms-border: #f4e5eb;
  --ms-border-strong: #e7ccd8;

  --ms-shadow: 0 2px 10px rgba(66, 22, 40, .07);
  --ms-shadow-l: 0 14px 34px rgba(66, 22, 40, .12);
  --ms-shadow-primary: 0 4px 14px rgba(193, 48, 101, .24);

  --ms-cell-given: #fdf2f7;
  --ms-cell-self: #f9dfe9;
  --ms-cell-peer: #fcf5f8;
  --ms-cell-same: #f6cadd;
  --ms-grid-line: #dccfd3;
  --ms-grid-thick: #2c2427;
  --ms-tile: linear-gradient(180deg, #ffffff, #fdf3f8);
  --ms-tile-edge: #f8cede;
}
