/* ============================================================
   design-tokens.css — 个人工作台 · token 源文件（数值基准）
   ------------------------------------------------------------
   所有数值来自《中小学教师个人工作台-设计方案.md》v3.6 §7 / §8.2。
   三层结构：1) primitive  2) semantic  3) component

   ⚠️ 事实说明（此前这里写的是「改这里 = 改全部页面」，经实测为假，已更正）：
   01–08 八个页面是单文件交付形态，没有任何一页 <link> 引入本文件；
   它们在各自 <style> 内联了一份 :root 拷贝。因此：
     · 改本文件 **不会** 影响任何页面；
     · 改 token 必须同步改 7 份内联拷贝（05 屏自带独立深色板，不共享本文件）。
   一致性由可执行规格/probes/check_token_drift.py 守卫 —— 它逐屏比对
   内联 :root 与本文件的 primitive 数值，任一处漂移即失败。
   ============================================================ */

:root {
  /* ---------- Layer 1：primitive（§7 配色） ---------- */
  --blue-600: #255CE0;   /* 主色（600 档同时承担「浅底上的文字」与「压白字的实心底」，双向压深至 5.70:1 / 弱蓝底 5.09:1） */
  --blue-700: #1E4FBF;
  --blue-050: #EDF2FF;

  --green-600: #0F7C3E;  /* 成功（原 #12A150 压白仅 3.37:1） */
  --green-050: #E8F6EE;

  --amber-600: #E8A317;  /* 警告 */
  --amber-050: #FDF4E3;

  --red-600: #C82E35;    /* 危险（原 #E5484D 压白仅 3.91:1） */
  --red-050: #FDECEC;

  --gray-900: #18191C;
  --gray-700: #3F4753;
  --gray-600: #4B5563;
  --gray-500: #5F6773;   /* 中性（既作 --c-text-3 又作实心底，需双向达标） */
  --gray-300: #D1D5DB;
  --gray-200: #E5E7EB;
  --gray-100: #F1F3F6;
  --gray-050: #F7F8FA;
  --white: #FFFFFF;

  /* 学科色带（§7，固定 5 色，不扩展） */
  --subj-chinese: #C24520;
  --subj-math: #255CE0;
  --subj-english: #7B5CD6;
  --subj-pe: #0F7C3E;
  --subj-other: #5F6773;

  /* ---------- Layer 1：8pt 栅格 ---------- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-10: 40px;

  /* ---------- Layer 2：semantic ---------- */
  --c-bg: var(--gray-050);
  --c-surface: var(--white);
  --c-surface-sub: var(--gray-100);
  --c-border: var(--gray-200);
  --c-border-strong: var(--gray-300);

  --c-text: var(--gray-900);
  --c-text-2: var(--gray-600);
  --c-text-3: var(--gray-500);

  --c-primary: var(--blue-600);
  --c-primary-hover: var(--blue-700);
  --c-primary-weak: var(--blue-050);

  --c-success: var(--green-600);
  --c-success-weak: var(--green-050);
  --c-warn: var(--amber-600);
  --c-warn-weak: var(--amber-050);
  --c-danger: var(--red-600);
  --c-danger-weak: var(--red-050);

  /* 暖/绿/红底上的「文字 + 描边」配套色。
     为什么单独出这两组而不是直接用 --c-warn/--c-success/--c-danger：
     那几个 600 档只够作图形与大面积填充，压在小字上对比度不足
     （#E8A317 on #FDF4E3 = 1.99，远低于 4.5:1），不能当正文色。
     文字色 --c-warn-text 实测 5.43:1（on --c-warn-weak），才够小字用。 */
  --c-warn-text: #8A5A00;      /* on --c-warn-weak = 5.43:1 */
  --c-warn-border: #F2DDB0;
  --c-warn-border-strong: #E0C88E;
  --c-success-border: #B9E2CB;
  --c-danger-border: #F6C7C9;

  /* 饱和实心底上的字色。黄底压白字在 WCAG 中无解（#E8A317 白字最高 2.17:1），
     故改「深字压在黄底」：#18191C on #E8A317 = 8.10:1。 */
  --c-on-solid: #18191C;
  /* 「良好 / 一般」这类介于成功与警告之间的中性档实心底（原为硬编码 #4FA3FF，白字仅 2.62:1）。 */
  --c-good: #2570C4;

  --c-focus: var(--blue-600);

  /* ---------- Layer 2：字号层级（§7，四档，不新增） ---------- */
  --fs-page: 20px;   /* 页面标题 20/600 */
  --fs-module: 16px; /* 模块标题 16/600 */
  --fs-body: 14px;   /* 内容 14/400 */
  --fs-aux: 12px;    /* 辅助 12/400 灰 */
  --fs-metric: 28px; /* 图表数值 28/600 */

  --lh-body: 1.65;
  --lh-tight: 1.35;

  --font-cn: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei",
             "Noto Sans SC", "Source Han Sans SC", "Hiragino Sans GB", sans-serif;
  --font-num: "SF Mono", "JetBrains Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;

  /* ---------- Layer 2：圆角 / 阴影（§7） ---------- */
  --r-card: 12px;
  --r-input: 8px;
  --r-tag: 4px;

  /* 阴影仅浮层可用，卡片不用阴影 */
  --sh-overlay: 0 8px 24px rgba(0, 0, 0, 0.08);

  /* ---------- Layer 3：骨架与命中区（§7 / §8.2） ---------- */
  --nav-w: 200px;        /* 左侧固定导航 200px */
  --topbar-h: 48px;      /* 顶部全局条 48px */

  --hit-web: 44px;       /* Web 标准 ≥ 44×44 */
  --hit-web-lg: 56px;    /* Web 放大 ≥ 56×56（快速动作 / 键盘棒 / 份号格） */
  --hit-stage: 96px;     /* 课堂大屏 ≥ 96×96 */
  --hit-gap: 8px;        /* Web 相邻可点对象间距 ≥ 8px */
  --hit-gap-stage: 16px; /* 大屏相邻可点对象间距 ≥ 16px */

  /* ---------- Layer 3：动效（全部 ≤150ms，配合 reduced-motion） ---------- */
  --t-fast: 120ms;
  --t-base: 150ms;
  --e-out: cubic-bezier(0.2, 0.8, 0.3, 1);

  /* 进度 / 状态点尺寸 */
  --dot: 8px;
  --dot-lg: 10px;
}

/* 课堂模式独立 token 集（§7：深色优先 + 高饱和强调 + 对比度 ≥7:1） */
.stage-scope {
  --stage-bg: #0E1116;
  --stage-bg-alt: #12241E;
  --stage-surface: rgba(255, 255, 255, 0.06);
  --stage-border: rgba(255, 255, 255, 0.14);
  --stage-text: #F2F5F8;
  --stage-text-2: #A8B0BA;
  --stage-accent: #12A150;   /* 抽中位号 */
  --stage-alarm: #E5484D;    /* 倒计时最后 10s */
  --stage-fs-body: 32px;     /* 1920 宽基准 */
  --stage-fs-h1: 56px;
  --stage-rad: 20px;
}

@media (min-width: 2560px) {
  .stage-scope { --stage-fs-body: 40px; --stage-fs-h1: 72px; }
}
@media (min-width: 3600px) {
  .stage-scope { --stage-fs-body: 48px; --stage-fs-h1: 88px; }
}