/* =========================================================================
   序 · Design Tokens
   极简时间美学 × Editorial 编辑感 × 轻科技
   浅色为默认；深色为「重新设计」而非简单反转。
   ========================================================================= */

: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);

  /* ---------- 间距 ---------- */
  --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;
  --sp-9: 11rem;

  /* ---------- 字号 ---------- */
  --fs-hero:    clamp(9rem, 27vw, 21rem);
  --fs-start:   clamp(5rem, 15vw, 11rem);
  --fs-display: clamp(1.875rem, 4.4vw, 3.5rem);
  --fs-h3:      clamp(1.25rem, 2vw, 1.625rem);
  --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.9;
  --ls-wide:  .16em;
  --ls-mid:   .06em;

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

  /* ---------- 动效 ---------- */
  --ease: cubic-bezier(.16, .84, .44, 1);
  --dur-1: 240ms;
  --dur-2: 420ms;
  --dur-3: 680ms;
  --dur-4: 900ms;

  /* ---------- 布局 ---------- */
  --w-page: 1180px;
  --w-text: 720px;
  --w-narrow: 560px;
  --gutter: clamp(1.25rem, 5vw, 3.5rem);
  --header-h: 68px;
}

/* ---------- 色彩 · Dark ---------- */
:root[data-theme="dark"] {
  color-scheme: dark;

  --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);
}

/* 无 JS 时依然尊重系统偏好 */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --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);
  }
}
