/* ============================================================
   tokens.css — 设计令牌
   概念：一本可动手操作的交互式数据手册。
   两种真实材料：数据手册的纸（--paper）与逻辑分析仪的荧幕（--screen）。
   ============================================================ */

:root {
  /* 只支持浅色主题，并且明确拒绝被自动暗化。
     本页是「纸 + 荧幕」双材质：纸是浅的、荧幕是深的，两者的反差本身就是信息。
     自动反色会把荧幕翻成奶白、把琥珀色高亮翻成深橄榄，画面立刻失去可读性。
     `only` 关键字是这里的关键 —— 只写 light 表示"浅色优先"，仍允许浏览器自动暗化；
     写 only light 才是"不要动它"。CSS 这一份与 <meta name="color-scheme"> 互为兜底，
     并且负责让输入框、下拉框、滚动条都按浅色控件渲染。 */
  color-scheme: only light;
  /* ---- 材质：纸 ---- */
  --paper:        #f1f3ee;   /* 页面底：微偏绿的工程纸 */
  --paper-raised: #f8f9f5;   /* 抬起的纸面（卡片/表头） */
  --paper-sunken: #e7eae2;   /* 凹陷的纸面（代码块/输入） */
  --rule:         #cfd5c9;   /* 纸张上的细分隔线 */
  --rule-soft:    #e0e4db;

  /* ---- 材质：PCB 阻焊绿（结构骨架） ---- */
  --board:        #123a2c;
  --board-deep:   #0b2820;
  --board-line:   #2c5a48;
  --board-text:   #d8e4dc;

  /* ---- 材质：荧光屏 ---- */
  --screen:       #0c1512;
  --screen-raise: #12201b;
  --screen-line:  #1f3a30;
  --screen-text:  #cfe3d6;
  --screen-dim:   #6f8b7d;

  /* ---- 墨 ---- */
  --ink:      #141a18;
  --ink-mid:  #47524c;
  --ink-dim:  #6d7871;

  /* ---- 铜箔：唯一的强调色 ---- */
  --copper:      #b8770f;
  --copper-lo:   #e0a94a;
  --copper-wash: #f6ecd9;

  /* ---- 语义色（克制，仅用于校验/错误/通过） ---- */
  --pass:      #2f7a4f;
  --pass-wash: #e2efe6;
  --fail:      #a83232;
  --fail-wash: #f6e3e1;

  /* ---- 波形通道色（逻辑分析仪惯例） ---- */
  --ch1: #d99114;   /* 琥珀 */
  --ch2: #2f8fa8;   /* 青 */
  --ch3: #a8465f;   /* 品红 */
  --ch4: #5f8a34;   /* 橄榄 */
  --ch5: #6a5aa8;   /* 紫 */
  --ch6: #8a7a5a;   /* 褐 */

  /* ---- 字体：无外部依赖，只能使用系统字体栈 ---- */
  --font-sans: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",
               "Noto Sans CJK SC", "Source Han Sans SC", -apple-system,
               "Segoe UI", system-ui, Roboto, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "JetBrains Mono", "Cascadia Mono",
               "Roboto Mono", Consolas, "Liberation Mono", "Courier New",
               "Noto Sans Mono CJK SC", monospace;
  --font-cond: "Arial Narrow", "Helvetica Neue", "PingFang SC",
               "Microsoft YaHei", system-ui, sans-serif;

  /* ---- 字阶（配合字号跨度制造性格，而非依赖外部字体） ---- */
  --fs-hero:  clamp(2.5rem, 6.2vw, 4.6rem);
  --fs-h1:    clamp(1.85rem, 3.6vw, 2.7rem);
  --fs-h2:    clamp(1.3rem, 2.1vw, 1.62rem);
  --fs-h3:    1.0625rem;
  --fs-body:  1.0625rem;
  --fs-sm:    0.9375rem;
  --fs-xs:    0.8125rem;
  --fs-2xs:   0.6875rem;

  --lh-tight: 1.06;
  --lh-head:  1.24;
  --lh-body:  1.72;

  --ls-hero:  -0.035em;
  --ls-head:  -0.018em;
  --ls-body:  0.006em;
  --ls-label: 0.09em;

  /* ---- 间距 ---- */
  --s1: 4px;  --s2: 8px;  --s3: 12px; --s4: 16px;
  --s5: 24px; --s6: 32px; --s7: 48px; --s8: 64px; --s9: 96px;

  /* ---- 版式 ---- */
  --measure: 74ch;
  --rail-w: 260px;
  --gutter: clamp(16px, 3vw, 40px);

  /* ---- 形状：数据手册几乎不用圆角 ---- */
  --r-0: 0px;
  --r-1: 2px;
  --r-2: 3px;

  --shadow-lift: 0 1px 0 var(--rule), 0 8px 20px -14px rgba(18, 58, 44, 0.5);
  --focus: 0 0 0 3px rgba(184, 119, 15, 0.45);

  --dur-fast: 120ms;
  --dur: 220ms;
  --dur-slow: 420ms;
  --ease: cubic-bezier(0.2, 0.7, 0.3, 1);
}