/**
 * 设计令牌 · 全站唯一视觉来源
 * ------------------------------------------------------------------
 * 本文件与 DESIGN.md 严格一一对应。
 * 组件里禁止写死颜色 / 字号 / 间距，一律引用这里的变量。
 * 换肤、调间距、改字重，只改这一个文件。
 */

:root {
  /* ================= 颜色 · 基底 ================= */
  --c-bg: #FFFFFF;             /* 页面主背景，占 95% 面积 */
  --c-bg-soft: #F7F6F3;        /* 次级背景、图片占位、斑马块（带一点暖灰，避免死白） */
  --c-ink: #0B0B0B;            /* 主文字、页脚底、实心按钮底 */
  --c-ink-2: #5A5A5A;          /* 正文、次要文字 */
  --c-ink-3: #9A9A9A;          /* 元信息、英文小标签、弱化内容 */
  --c-ink-inv: #FFFFFF;        /* 深色底上的文字 */
  --c-rule: #E7E5E1;           /* 1px 细线：全站唯一的「边框」 */
  --c-rule-soft: #F0EEEA;      /* 更淡的线，用于列表内部 */

  /* ================= 颜色 · 强调（香槟金，唯一有彩色） ================= */
  --c-gold: #C8A96A;
  --c-gold-deep: #B8965A;      /* 悬停 / 按压 */
  --c-gold-soft: #D9C08C;      /* 深底上使用的亮一档金 */
  --c-gold-wash: rgba(200, 169, 106, 0.08);  /* 8% 淡底，仅用于悬停背景 */
  --c-gold-line: rgba(200, 169, 106, 0.35);  /* 半透明金线 */

  /* ================= 颜色 · 功能 ================= */
  --c-ok: #2E7D5B;            /* 售票中 */
  --c-warn: #B8860B;          /* 即将开票 */
  --c-mute: #9A9A9A;          /* 已结束 */
  --c-error: #B33A3A;         /* 错误提示 */

  /* ================= 颜色 · 深底专用 ================= */
  --c-on-dark: #FFFFFF;
  --c-on-dark-2: #BFBFBF;
  --c-on-dark-3: #8A8A8A;
  --c-on-dark-rule: #2A2A2A;

  /* ================= 字体 ================= */
  --f-sans: "Helvetica Neue", "Avenir Next", -apple-system, BlinkMacSystemFont,
            "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif;
  --f-mono: "SF Mono", "JetBrains Mono", Menlo, Consolas, "Courier New", monospace;

  /* ================= 字号 · 流式缩放 =================
     下限 32px 而不是 40px：首屏标题第二行是 9 个字，在 375px 宽的手机上
     40px 会撑爆导致「展」单字换行，32px 刚好收在容器内（9×32=288 < 335 可用宽度）。 */
  --f-display: clamp(32px, 6.8vw, 88px);
  --f-h2: clamp(28px, 3.4vw, 44px);
  --f-h3: clamp(18px, 1.6vw, 22px);
  --f-lede: 18px;
  --f-body: 16px;
  --f-nav: 12px;
  --f-meta: 12px;
  --f-micro: 11px;
  --f-number: clamp(30px, 3.6vw, 46px);

  /* ================= 字重（只用三档） ================= */
  --w-thin: 200;
  --w-base: 400;
  --w-bold: 500;               /* 标题 / 导航 / 按钮，本系统最重的字重 */

  /* ================= 字距（冷峻感的主要来源） ================= */
  --track-display: -0.022em;   /* 中文大标题：微负，更紧实有硬度 */
  --track-h2: -0.015em;
  --track-normal: 0;
  --track-nav: 0.14em;         /* 英文导航：大写 + 正字距 */
  --track-label: 0.22em;       /* kicker 小标签 */
  --track-button: 0.18em;
  --track-meta: 0.1em;
  --track-micro: 0.16em;
  --track-en-name: 0.2em;      /* 艺人英文名 */

  /* ================= 行高（标题紧、正文松） ================= */
  --lh-display: 1.14;
  --lh-h2: 1.2;
  --lh-h3: 1.4;
  --lh-body: 1.9;
  --lh-lede: 1.85;
  --lh-meta: 1.6;

  /* ================= 间距刻度（基准 8px） ================= */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-6: 24px;
  --s-8: 32px;
  --s-12: 48px;
  --s-16: 64px;
  --s-24: 96px;
  --s-32: 128px;

  /* ================= 布局 ================= */
  --container: 1320px;
  --gutter: clamp(20px, 5vw, 72px);
  --section-y: clamp(72px, 12vh, 160px);
  --header-h: 76px;
  --header-h-scrolled: 64px;
  --grid-gap: 24px;

  /* ================= 图片调色 =================
     封面 / 照片的统一色彩处理，改这一处即可全站生效：
       none                          = 原色（当前采用）
       grayscale(1)                  = 全黑白，冷调更统一，但会改掉专辑封面原貌
       grayscale(.3) contrast(1.02)  = 轻度去色，兼顾统一与原貌
     专辑封面是音乐人的作品，默认必须原色呈现，不做二次创作。 */
  --img-tone: none;
  --img-tone-hover: none;

  /* ================= 形状（全站零圆角，无例外） ================= */
  --radius: 0px;
  --rule-w: 1px;
  --hairline: 1px;

  /* ================= 动效 ================= */
  --dur-fast: 240ms;
  --dur: 600ms;
  --dur-slow: 800ms;
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);      /* 统一缓动：起步快、收尾缓 */
  --ease-in-out: cubic-bezier(0.45, 0, 0.15, 1);

  /* ================= 层级 ================= */
  --z-noise: 1;
  --z-content: 2;
  --z-header: 60;
  --z-drawer: 70;
  --z-toast: 80;

  /* ================= 噪点纹理（用渐变生成，无需图片） ================= */
  --noise-opacity: 0.04;
  --noise-size: 160px;
}

/* 深色区域（页脚）的局部覆盖：只需加 class="on-dark" */
.on-dark {
  --c-rule: var(--c-on-dark-rule);
  color: var(--c-on-dark);
}
