/* ==========================================================================
   tokens.css — 设计变量
   风格对齐 kazumi.app：暖白底 · 柔和圆角色块 · 森林绿主色 · 圆润无衬线
   色值取自官方站实际渲染结果
   ========================================================================== */

@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/manrope-latin.woff2") format("woff2");
}
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/manrope-latin.woff2") format("woff2");
}
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/manrope-latin.woff2") format("woff2");
}
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/manrope-latin.woff2") format("woff2");
}
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/manrope-latin.woff2") format("woff2");
}

:root {
  /* ---------- 底色 ---------- */
  --paper:        #FCFBF5;   /* 页面底：奶油白 */
  --paper-2:      #FFFFFF;   /* 白卡 */
  --paper-3:      #F1F3E8;   /* 淡苔绿：侧栏 / 列表 / 导航胶囊 */

  /* ---------- 色块（糖果粉彩） ---------- */
  --mint:         #DCEFD6;   /* 薄荷绿：主色块 */
  --mint-2:       #E9F1E1;   /* 更淡的薄荷：次级卡片 */
  --mint-3:       #C6E2BE;   /* 绿块描边 / hover */
  --butter:       #FBF3C2;   /* 奶油黄：角色卡 */
  --peach:        #FFE1CD;   /* 蜜桃粉：强调卡 */
  --sky:          #DFEDF9;   /* 天空蓝：点缀 */
  --lilac:        #F0E7F8;   /* 淡紫：点缀 */

  /* ---------- 文字 ---------- */
  --ink:          #22301F;   /* 主文字 */
  --ink-2:        #4E5B4A;   /* 正文 */
  --ink-3:        #78846F;   /* 次要 */
  --ink-4:        #A5AE9C;   /* 弱化 */
  --ink-deep:     #1B452D;   /* 深绿标题 */

  /* ---------- 线条 ---------- */
  --line:         #E7EBDB;
  --line-2:       #D6DCC6;

  /* ---------- 主色 / 辅色（沿用旧变量名，避免内联样式失效） ---------- */
  --accent:       #2F6B4E;   /* 森林绿：按钮、强调 */
  --accent-d:     #24543C;
  --accent-soft:  #DCEFD6;
  --accent-line:  #C0DDB8;
  --green:        #2F6B4E;
  --green-soft:   #E6F1DF;
  --green-line:   #CBE0C2;
  --warn:         #B15B34;   /* 暖橘：警示 */
  --warn-soft:    #FFEDE0;
  --warn-line:    #F5D2BC;

  /* ---------- 深色（仅少量：代码块） ---------- */
  --dark:         #1B2B21;
  --dark-2:       #223528;
  --dark-line:    #2F4636;
  --dark-text:    #EDF3E8;
  --dark-text-2:  #9BAF9C;

  /* ---------- 字体 ---------- */
  --font-display: "Manrope", "PingFang SC", "HarmonyOS Sans SC", "Source Han Sans SC",
                  "Noto Sans SC", "Microsoft YaHei", system-ui, sans-serif;
  --font-sans:    "Manrope", "PingFang SC", "HarmonyOS Sans SC", "Source Han Sans SC",
                  "Noto Sans SC", "Microsoft YaHei", system-ui, sans-serif;
  --font-mono:    ui-monospace, "SF Mono", "Cascadia Mono", "JetBrains Mono", Menlo, Consolas, monospace;

  /* ---------- 字号 ---------- */
  --fs-hero:  clamp(34px, 4.4vw, 58px);
  --fs-mega:  clamp(30px, 3.9vw, 50px);
  --fs-h1:    clamp(28px, 3.4vw, 44px);
  --fs-h2:    clamp(24px, 2.9vw, 38px);
  --fs-h3:    21px;
  --fs-body:  16px;
  --fs-sm:    14.5px;
  --fs-xs:    13px;
  --fs-2xs:   11.5px;

  /* ---------- 排版节奏 ---------- */
  --lh-tight: 1.18;
  --lh-snug:  1.45;
  --lh-body:  1.72;

  /* ---------- 布局 ---------- */
  --wrap:        1300px;
  --gutter:      clamp(20px, 4.4vw, 64px);
  --sec-y:       clamp(56px, 7vw, 104px);
  --gap:         clamp(14px, 1.5vw, 20px);

  /* ---------- 圆角与阴影 ---------- */
  --radius:      28px;   /* 大卡 */
  --radius-md:   20px;   /* 中卡 */
  --radius-sm:   14px;   /* 小元素 */
  --radius-pill: 999px;

  --shadow-sm: 0 1px 2px rgba(34, 48, 31, .04);
  --shadow-md: 0 20px 46px -26px rgba(34, 48, 31, .24);
  --shadow-lg: 0 32px 74px -36px rgba(34, 48, 31, .3);

  /* ---------- 动效 ---------- */
  --t-fast: 140ms cubic-bezier(.3, .7, .4, 1);
  --t-slow: 320ms cubic-bezier(.22, .61, .36, 1);
}