/* =========================================================================
   序 XU · Design Tokens
   与官网 Landing Page 共用同一套视觉系统（极简时间美学 × Editorial × 轻科技）。
   浅色为默认；深色为「重新设计」而非简单反转。
   修改时务必与 /XU/assets/css/tokens.css 保持同步。
   ========================================================================= */

:root {
  color-scheme: light;

  /* ---------- 字体 ---------- */
  --font-sans: system-ui, -apple-system, "Segoe UI", "PingFang SC",
               "HarmonyOS Sans SC", "Hiragino Sans GB", "Microsoft YaHei",
               "Source Han Sans SC", "Noto Sans SC", sans-serif;
  --font-serif: "Songti SC", "STSong", "Source Han Serif SC", "Noto Serif CJK SC",
                "Noto Serif SC", "SimSun", "Songti TC", Georgia, "Times New Roman", serif;
  --font-mono: ui-monospace, "SFMono-Regular", "JetBrains Mono", Menlo, Consolas, monospace;

  /* ---------- 色彩 · Light（温暖纸感） ---------- */
  --paper:      #F6F4EF;
  --paper-2:    #FBF9F5;
  --paper-3:    #FFFFFF;
  --ink:        #1B1A17;
  --ink-2:      #55524B;
  --ink-3:      #8C8880;
  --line:       rgba(27, 26, 23, .10);
  --line-2:     rgba(27, 26, 23, .18);
  --accent:     #A2553A;
  --accent-2:   #C0805C;
  --accent-soft:rgba(162, 85, 58, .08);
  --accent-line:rgba(162, 85, 58, .28);
  --ghost:      rgba(27, 26, 23, .035);
  --ph-a:       #E9E4DA;
  --ph-b:       #DCD5C8;
  --shadow:     0 1px 2px rgba(27, 26, 23, .04), 0 12px 32px -18px rgba(27, 26, 23, .18);
  --shadow-2:   0 2px 6px rgba(27, 26, 23, .06), 0 22px 50px -26px rgba(27, 26, 23, .30);

  /* 状态色：刻意避开刺眼的高亮绿，用克制的暖灰/陶土语义 */
  --st-draft:    #8C8880;  /* 草稿 · 浅灰 */
  --st-active:   #A2553A;  /* 进行中 · 陶土 */
  --st-done:     #6F7E63;  /* 已完成 · 低饱和橄榄（非亮绿） */
  --st-archived: #B7AFA2;  /* 已归档 · 更浅的米粉 */
  --danger:      #B23A2E;  /* 危险 / 删除操作（克制暖红） */

  /* ---------- 间距 ---------- */
  --sp-1: .5rem;
  --sp-2: 1rem;
  --sp-3: 1.5rem;
  --sp-4: 2rem;
  --sp-5: 3rem;
  --sp-6: 4rem;
  --sp-7: 6rem;
  --sp-8: 8rem;

  /* ---------- 字号 ---------- */
  --fs-hero:    clamp(4.5rem, 14vw, 9rem);
  --fs-display: clamp(1.75rem, 3.6vw, 3rem);
  --fs-h2:      clamp(1.375rem, 2.4vw, 2rem);
  --fs-h3:      clamp(1.125rem, 1.8vw, 1.375rem);
  --fs-lead:    clamp(1rem, .5vw + .92rem, 1.1875rem);
  --fs-body:    clamp(.9375rem, .25vw + .9rem, 1.0625rem);
  --fs-sm:      .875rem;
  --fs-xs:      .75rem;
  --fs-micro:   .6875rem;

  --lh-tight: 1.16;
  --lh-snug:  1.45;
  --lh-body:  1.75;
  --ls-wide:  .16em;
  --ls-mid:   .06em;

  /* ---------- 圆角（克制） ---------- */
  --r-xs: 2px;
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-pill: 999px;

  /* ---------- 动效（克制：200–600ms ease-out，无 bounce/scale/rotate 强调） ---------- */
  --ease: cubic-bezier(.16, .84, .44, 1);
  --dur-1: 200ms;
  --dur-2: 320ms;
  --dur-3: 460ms;
  --dur-4: 600ms;

  /* ---------- 布局 ---------- */
  --sidebar-w: 236px;
  --topbar-h: 60px;
  --bottomnav-h: 60px;
  --gutter: clamp(1.25rem, 4vw, 2.5rem);
}

/* ---------- 色彩 · Dark ---------- */
:root[data-theme="dark"] {
  color-scheme: dark;
  --danger:     #E0756A;  /* 危险 / 删除操作（深色下提亮） */

  --paper:      #100F0E;
  --paper-2:    #171614;
  --paper-3:    #1D1B19;
  --ink:        #ECE8E1;
  --ink-2:      #A5A099;
  --ink-3:      #75716A;
  --line:       rgba(236, 232, 225, .12);
  --line-2:     rgba(236, 232, 225, .22);
  --accent:     #C98A6B;
  --accent-2:   #A87053;
  --accent-soft:rgba(201, 138, 107, .12);
  --accent-line:rgba(201, 138, 107, .30);
  --ghost:      rgba(236, 232, 225, .04);
  --ph-a:       #23211E;
  --ph-b:       #2C2926;
  --shadow:     0 1px 2px rgba(0, 0, 0, .5), 0 16px 40px -22px rgba(0, 0, 0, .8);
  --shadow-2:   0 2px 8px rgba(0, 0, 0, .6), 0 26px 56px -28px rgba(0, 0, 0, .9);

  --st-draft:    #75716A;
  --st-active:   #C98A6B;
  --st-done:     #8FA07E;
  --st-archived: #6B645B;
}

/* 无 JS 时依然尊重系统偏好 */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --danger: #E0756A;
    --paper: #100F0E;
    --paper-2: #171614;
    --paper-3: #1D1B19;
    --ink: #ECE8E1;
    --ink-2: #A5A099;
    --ink-3: #75716A;
    --line: rgba(236, 232, 225, .12);
    --line-2: rgba(236, 232, 225, .22);
    --accent: #C98A6B;
    --accent-2: #A87053;
    --accent-soft: rgba(201, 138, 107, .12);
    --accent-line: rgba(201, 138, 107, .30);
    --ghost: rgba(236, 232, 225, .04);
    --ph-a: #23211E;
    --ph-b: #2C2926;
    --shadow: 0 1px 2px rgba(0, 0, 0, .5), 0 16px 40px -22px rgba(0, 0, 0, .8);
    --shadow-2: 0 2px 8px rgba(0, 0, 0, .6), 0 26px 56px -28px rgba(0, 0, 0, .9);
    --st-draft: #75716A;
    --st-active: #C98A6B;
    --st-done: #8FA07E;
    --st-archived: #6B645B;
  }
}