/* ============================================================
   东理塾 · 学科成本台帳 — design tokens
   方向：swiss + 和纸（理性网格 / 纸感底色 / 深绿主色 / 朱色点缀）
   只允许从这里取色与字阶，页面里不要写死颜色。
   ============================================================ */

:root {
  /* ---- 纸与墨 ---- */
  --paper: #f3f1ea;          /* 页面底色：生成り和纸 */
  --surface: #fbfaf6;        /* 卡片 */
  --surface-2: #efede4;      /* 次级面 / 表头 */
  --surface-3: #e7e4d8;      /* 选中态 */
  --ink: #161b17;            /* 主文字 */
  --ink-2: #49514b;          /* 次文字 */
  --ink-3: #626a62;          /* 辅助文字 */
  --ink-4: #8b918a;          /* 占位 / 弱化 */
  --line: #ded9ca;           /* 分隔线 */
  --line-strong: #c8c1ad;
  --white: #ffffff;

  /* ---- 主色：深绿 ---- */
  --forest: #123d2c;
  --forest-2: #1d5a43;
  --forest-3: #3f7d61;
  --forest-soft: #dfe9e2;
  --forest-ink: #0d2c20;

  /* ---- 点缀：朱 / 金 ---- */
  --accent: #c0572f;
  --accent-soft: #f3e2da;
  --gold: #b08a3e;
  --gold-soft: #f0e8d6;

  /* ---- 状态 ---- */
  --ok: #2f6b4f;
  --ok-soft: #e0ece4;
  --warn: #b57a1f;
  --warn-soft: #f6ead4;
  --danger: #b23a2c;
  --danger-soft: #f5e0db;
  --info: #3e5c7a;
  --info-soft: #e2e8ef;

  /* ---- 学科色（服务端 subjects.color 覆盖，此处为兜底） ---- */
  --s1: #2f6b5b;
  --s2: #3e5c7a;
  --s3: #5b5a8c;
  --s4: #9a5b45;
  --s5: #b08a3e;
  --s6: #8a8578;

  /* ---- 字体 ---- */
  --font-ui: "Space Grotesk", "Noto Sans SC", "PingFang SC", "Hiragino Sans GB",
    "Microsoft YaHei", "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", "SF Mono", "Menlo", "Consolas", monospace;
  --font-cn-serif: "Noto Serif SC", "Songti SC", "STSong", "SimSun", serif;

  /* 字阶（1.25，基准 16） */
  --fs-display: 56px;
  --fs-h1: 34px;
  --fs-h2: 26px;
  --fs-h3: 20px;
  --fs-body: 15px;
  --fs-small: 13px;
  --fs-label: 11px;
  --lh-tight: 1.15;
  --lh-body: 1.7;
  --tracking-label: 0.14em;

  /* 间距（4 的倍数） */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;

  /* 圆角 / 阴影 */
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 16px;
  --r-xl: 22px;
  --r-pill: 999px;
  --shadow-1: 0 1px 2px rgba(18, 61, 44, 0.06);
  --shadow-2: 0 18px 48px -18px rgba(18, 61, 44, 0.22);
  --shadow-pop: 0 24px 64px -22px rgba(18, 61, 44, 0.3);

  /* 布局 */
  --rail-w: 224px;
  --topbar-h: 64px;
  --content-max: 1440px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* 深色侧栏局部变量 */
.rail {
  --rail-bg: var(--forest);
  --rail-ink: #e9efe9;
  --rail-ink-2: rgba(233, 239, 233, 0.74);
  --rail-line: rgba(233, 239, 233, 0.14);
}

* { box-sizing: border-box; }

html,
body {
  margin: 0;
  padding: 0;
}

body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

::selection {
  background: var(--forest-soft);
  color: var(--forest-ink);
}

:focus-visible {
  outline: 2px solid var(--forest-2);
  outline-offset: 2px;
}

/* 数字永远等宽对齐 */
.num {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}