/* design tokens · 微积分学习站
   视觉关键词：切线、累积、无穷小、变化率
   主色=切线橙（导数的几何.icon），辅色=积分蓝（面积累积）
   明暗两套独立取色（非反色），对比度满足正文 ≥ 4.5:1 */

:root {
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;

  --radius: 14px;
  --radius-sm: 9px;
  --shadow: 0 1px 2px rgba(60, 30, 10, 0.06), 0 10px 30px rgba(60, 30, 10, 0.07);
  --shadow-soft: 0 1px 2px rgba(60, 30, 10, 0.05);
  --speed: 180ms ease;

  --grid-line: rgba(194, 65, 12, 0.06);
}

html[data-theme="light"] {
  color-scheme: light;
  --bg: #faf8f5;
  --bg-hero: linear-gradient(160deg, #fdefe4 0%, #faf8f5 55%, #e8f0fd 100%);
  --surface: #ffffff;
  --surface-2: #f4efe8;
  --text: #2a2018;
  --muted: #6b5d4d;
  --border: #e6ddd0;
  --primary: #c2410c;
  --primary-strong: #9a3412;
  --primary-soft: #fdeadb;
  --accent: #2563eb;
  --accent-soft: #e5edfd;
  --danger: #b3372f;
  --ok: #3f6212;

  --lv-entry: #0d9488;   /* 入门 · 青 */
  --lv-core: #c2410c;    /* 核心 · 橙 */
  --lv-advanced: #7c3aed;/* 进阶 · 紫 */
  --lv-frontier: #be123c;/* 前沿 · 玫红 */
}

html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #14100a;
  --bg-hero: linear-gradient(160deg, #301a08 0%, #14100a 55%, #0e1c3a 100%);
  --surface: #1e1810;
  --surface-2: #2a2216;
  --text: #f1e9dc;
  --muted: #b3a693;
  --border: #3a3022;
  --primary: #fb923c;
  --primary-strong: #fdba74;
  --primary-soft: #3a2308;
  --accent: #93c5fd;
  --accent-soft: #1b2c52;
  --danger: #ff8f88;
  --ok: #a3d15c;

  --lv-entry: #5eead4;
  --lv-core: #fdba74;
  --lv-advanced: #c4b5fd;
  --lv-frontier: #fda4af;

  --shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 10px 30px rgba(0, 0, 0, 0.35);
  --shadow-soft: 0 1px 2px rgba(0, 0, 0, 0.35);
  --grid-line: rgba(251, 146, 60, 0.07);
}

@media (prefers-reduced-motion: reduce) {
  :root { --speed: 0ms; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}