/* ============================================================
   中医小助手 V1 · Design Tokens
   finesse Set 7「Brick & Olive」—— 燕麦纸底 + 砖红 + 橄榄绿
   暖药铺风 · 标题宋体 · 深浅两套
   ============================================================ */

:root {
  /* —— 基底（燕麦纸底，暖米白，绝不用纯白/纯黑）—— */
  --page:       #f3efe6;
  --bg:         #ffffff;
  --panel-2:    #f9f6ef;
  --border:     rgba(44, 30, 22, 0.07);

  /* —— 文字（棕系，暖调）—— */
  --ink-1:      #1e1712;   /* 标题 */
  --ink-2:      #4a3e35;   /* 正文 */
  --ink-3:      #7f7263;   /* 小字/标签 */

  /* —— 品牌色 —— */
  --accent:     #9c4a38;   /* 砖红 · 主强调 */
  --accent-2:   #5c5a3a;   /* 橄榄绿 · 次强调 */
  --accent-soft: rgba(156, 74, 56, 0.10);
  --on-accent:  #ffffff;
  --glow:       rgba(156, 74, 56, 0.28);

  /* —— 语义色 —— */
  --up:         #3e7a52;   /* 涨 · 但此处为「好/宜」绿 */
  --down:       #c22e22;   /* 跌 · 警示红 */
  --warn:       #b77a16;

  /* —— 阴影（暖调，不纯黑）—— */
  --shadow:     0 1px 3px rgba(56, 36, 24, 0.05);
  --shadow-lg:  0 40px 90px -50px rgba(56, 36, 24, 0.33);

  /* —— 圆角 —— */
  --r-sm: 12px;
  --r:    16px;
  --r-lg: 22px;

  /* —— 字体 —— */
  --font-serif: "Noto Serif SC", "Songti SC", "STSong", "SimSun", serif;  /* 标题宋体 */
  --font-sans:  -apple-system, "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif; /* 正文黑体 */
  --font-mono:  "SF Mono", "Cascadia Code", "JetBrains Mono", monospace;

  /* —— 间距 —— */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 64px;

  /* —— 过渡 —— */
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --fast: 150ms;
  --norm: 250ms;
  --slow: 400ms;
}

/* —— 深色模式：同色相重新推导（纸底→深棕黑，砖红/橄榄提亮）—— */
body.dark {
  --page:       #171410;
  --bg:         #1e1a16;
  --panel-2:    #262019;
  --border:     rgba(255, 255, 255, 0.07);

  --ink-1:      #f0ece5;
  --ink-2:      #c8bfb3;
  --ink-3:      #9a8f80;

  --accent:     #c8674f;
  --accent-2:   #8a8458;
  --accent-soft: rgba(200, 103, 79, 0.16);
  --on-accent:  #1e1712;
  --glow:       rgba(200, 103, 79, 0.30);

  --up:         #6fbd88;
  --down:       #e05a4f;
  --warn:       #d9a03d;

  --shadow:     0 1px 3px rgba(0, 0, 0, 0.4);
  --shadow-lg:  0 40px 90px -50px rgba(0, 0, 0, 0.7);
}

/* —— 全局基础 —— */
* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
}

body {
  background: var(--page);
  color: var(--ink-2);
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  transition: background var(--slow) var(--ease), color var(--slow) var(--ease);
}

/* 标题用宋体 */
h1, h2, h3, .serif {
  font-family: var(--font-serif);
  color: var(--ink-1);
  letter-spacing: 0.01em;
}

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

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(127, 114, 99, 0.3); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: rgba(127, 114, 99, 0.5); }

:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 2px;
}

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