/* ============================================
   阙外 Premium 设计令牌 v4.0
   统一三主题 · 新中式美学 · 全球顶级机构验证
   来源: Bloomberg/FT/Economist/McKinsey 等24家机构调研
   设计DNA: "学者风骨，东方气韵"
   命名: --qw-*
   原则: 一个点缀色 · 三种字重 · 无纯黑 · 微投影
   ============================================ */

/* ===== 字体栈 ===== */
:root {
  --qw-serif: 'Source Han Serif SC', 'Noto Serif SC', 'STSong', 'Songti SC', Georgia, serif;
  --qw-sans: 'Geist Sans', 'Inter', 'PingFang SC', 'Microsoft YaHei', -apple-system, system-ui, sans-serif;
  --qw-mono: 'Geist Mono', 'JetBrains Mono', 'SF Mono', 'Cascadia Code', 'Fira Code', monospace;

  /* 比例尺 — 6级 */
  --qw-text-xs: 0.75rem;    /* 12px — 辅助 */
  --qw-text-sm: 0.875rem;   /* 14px — 标签/说明 */
  --qw-text-base: 1rem;     /* 16px — 正文 */
  --qw-text-lg: 1.125rem;   /* 18px — 引言/摘要 */
  --qw-text-xl: 1.5rem;     /* 24px — 小标题 */
  --qw-text-2xl: 2.25rem;   /* 36px — 大标题 */
  --qw-text-3xl: 3rem;      /* 48px — Hero标题 */

  /* 行高 — 中文需要更宽松 */
  --qw-leading-tight: 1.15;
  --qw-leading-snug: 1.35;
  --qw-leading-normal: 1.6;
  --qw-leading-relaxed: 1.75;

  /* 字重 — 仅三种: 400/500/600 (全球顶级平台铁律) */
  --qw-weight-body: 400;
  --qw-weight-ui: 500;
  --qw-weight-heading: 600;

  /* 字间距 — 标题激进负向 (FT/Vercel/Apple标准) */
  --qw-tracking-display: -0.04em;
  --qw-tracking-heading: -0.02em;
  --qw-tracking-body: -0.01em;
  --qw-tracking-ui: 0;

  /* 间距比例尺 (4px基) */
  --qw-space-xs: 0.25rem;
  --qw-space-sm: 0.5rem;
  --qw-space-md: 1rem;
  --qw-space-lg: 2rem;
  --qw-space-xl: 3rem;
  --qw-space-2xl: 4rem;
  --qw-space-3xl: 6rem;

  /* 圆角 — 微圆角=锐利=高端 */
  --qw-radius-none: 0;
  --qw-radius-sm: 4px;
  --qw-radius-md: 6px;
  --qw-radius-lg: 8px;
  --qw-radius-xl: 12px;
  --qw-radius-full: 9999px;

  /* 过渡 */
  --qw-motion-instant: 100ms;
  --qw-motion-fast: 150ms;
  --qw-motion-base: 250ms;
  --qw-motion-slow: 400ms;
  --qw-ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --qw-ease-spring: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --qw-ease-out: cubic-bezier(0.16, 1, 0.3, 1);

  /* 内容宽度 */
  --qw-content-sm: 680px;
  --qw-content: 900px;
  --qw-content-lg: 1200px;
  --qw-content-wide: 1400px;

  /* z-index */
  --qw-z-base: 0;
  --qw-z-raised: 10;
  --qw-z-sticky: 100;
  --qw-z-overlay: 200;
  --qw-z-modal: 300;
}

/* ===== 浅色 (默认) — Hermès 晨曦粉 ===== */
/* 来源: hermes.com 数字品牌色 · Brandfetch/ColorFYI 验证 */
:root,
[data-theme="light"] {
  /* Hermès Dawn Pink #F6F1EB — 仅3色的网站: 粉+黑+白 */
  --qw-ink: #000000;
  --qw-ink-secondary: #3D3A37;
  --qw-ink-muted: #6B6662;
  --qw-ink-subtle: #A09A94;

  --qw-bg: #F6F1EB;
  --qw-surface: #FFFFFF;
  --qw-surface-raised: #FFFFFF;
  --qw-surface-alt: #F0E9E2;
  --qw-surface-subtle: #EBE3DA;

  /* Hermès: 点缀即黑 — 奢侈的极致是不需要彩色点缀 */
  --qw-accent: #000000;
  --qw-accent-hover: #3D3A37;
  --qw-accent-subtle: rgba(0, 0, 0, 0.04);
  --qw-accent-border: rgba(0, 0, 0, 0.10);

  --qw-brand: #000000;
  --qw-brand-light: #3D3A37;
  --qw-brand-subtle: rgba(0, 0, 0, 0.03);

  --qw-positive: #1E8449;
  --qw-positive-bg: rgba(30, 132, 73, 0.08);
  --qw-negative: #C0392B;
  --qw-negative-bg: rgba(192, 57, 43, 0.08);
  --qw-warning: #D97706;
  --qw-warning-bg: rgba(217, 119, 6, 0.08);

  --qw-border: #E5DED6;
  --qw-border-light: #EFEAE4;
  --qw-border-hairline: rgba(0, 0, 0, 0.04);

  --qw-shadow-border: 0 0 0 1px rgba(0, 0, 0, 0.04);
  --qw-shadow-card: 0 1px 3px rgba(0, 0, 0, 0.02), 0 0 0 1px rgba(0, 0, 0, 0.03);
  --qw-shadow-raised: 0 4px 12px rgba(0, 0, 0, 0.04), 0 0 0 1px rgba(0, 0, 0, 0.03);
  --qw-shadow-overlay: 0 16px 48px rgba(0, 0, 0, 0.06);

  --qw-chart-bg: #FFFFFF;
  --qw-chart-grid: #EFEAE4;

  --qw-insight-bg: #F4EDE5;
  --qw-insight-border: rgba(0, 0, 0, 0.08);
  --qw-code-bg: #F0E9E2;
}

/* ===== 暗色 — Linear App Surface Ladder ===== */
/* 来源: Linear.app 产品设计系统 · surface-base→hairline→ink 逐级抬升 */
[data-theme="dark"] {
  /* Linear 文字阶: #F7F8F8 → #D0D6E0 → #8A8F98 */
  --qw-ink: #F7F8F8;
  --qw-ink-secondary: #D0D6E0;
  --qw-ink-muted: #8A8F98;
  --qw-ink-subtle: #5D6268;

  /* Linear 表面梯: 微蓝黑底→逐级抬升 */
  --qw-bg: #080A0A;
  --qw-surface: #0F1111;
  --qw-surface-raised: #141617;
  --qw-surface-alt: #0C0E0E;
  --qw-surface-subtle: #060808;

  /* Linear Lavender #5E6AD2 — 全站唯一彩色, 仅用于CTA+Logo */
  --qw-accent: #5E6AD2;
  --qw-accent-hover: #828FFF;
  --qw-accent-subtle: rgba(94, 106, 210, 0.08);
  --qw-accent-border: rgba(94, 106, 210, 0.15);

  --qw-brand: #5E6AD2;
  --qw-brand-light: #828FFF;
  --qw-brand-subtle: rgba(94, 106, 210, 0.06);

  --qw-positive: #27A644;
  --qw-positive-bg: rgba(39, 166, 68, 0.08);
  --qw-negative: #F87171;
  --qw-negative-bg: rgba(248, 113, 113, 0.08);
  --qw-warning: #FBBF24;
  --qw-warning-bg: rgba(251, 191, 36, 0.08);

  /* Linear hairline: #23252A·半透明白 */
  --qw-border: #23252A;
  --qw-border-light: #1A1C1E;
  --qw-border-hairline: rgba(255, 255, 255, 0.06);

  --qw-shadow-border: 0 0 0 1px rgba(255, 255, 255, 0.05);
  --qw-shadow-card: 0 0 0 1px rgba(255, 255, 255, 0.04);
  --qw-shadow-raised: 0 4px 12px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.05);
  --qw-shadow-overlay: 0 16px 48px rgba(0, 0, 0, 0.6);

  --qw-chart-bg: #0F1111;
  --qw-chart-grid: #23252A;

  --qw-insight-bg: #0C0E0E;
  --qw-insight-border: rgba(94, 106, 210, 0.12);
  --qw-code-bg: #0F1111;
}

/* ===== 冷色 — Apple Frost 霜白 + #2962FF Blue ===== */
/* 来源: Apple HIG · cool gray palette · crisp professional feel */
[data-theme="cool"] {
  /* Cool frost: near-white with blue undertone */
  --qw-ink: #1D1F23;
  --qw-ink-secondary: #4A4F57;
  --qw-ink-muted: #7B8089;
  --qw-ink-subtle: #A8ADB5;

  /* Apple frost #F2F4F7 — cool light gray */
  --qw-bg: #F2F4F7;
  --qw-surface: #FFFFFF;
  --qw-surface-raised: #FFFFFF;
  --qw-surface-alt: #EBEEF3;
  --qw-surface-subtle: #E4E8EE;

  /* Cool blue accent #2962FF */
  --qw-accent: #2962FF;
  --qw-accent-hover: #1A4BD7;
  --qw-accent-subtle: rgba(41, 98, 255, 0.06);
  --qw-accent-border: rgba(41, 98, 255, 0.15);

  --qw-brand: #2962FF;
  --qw-brand-light: #5C85FF;
  --qw-brand-subtle: rgba(41, 98, 255, 0.04);

  --qw-positive: #1E8449;
  --qw-positive-bg: rgba(30, 132, 73, 0.08);
  --qw-negative: #C0392B;
  --qw-negative-bg: rgba(192, 57, 43, 0.08);
  --qw-warning: #D97706;
  --qw-warning-bg: rgba(217, 119, 6, 0.08);

  --qw-border: #E0E4EA;
  --qw-border-light: #EDF0F4;
  --qw-border-hairline: rgba(0, 0, 0, 0.05);

  --qw-shadow-border: 0 0 0 1px rgba(0, 0, 0, 0.04);
  --qw-shadow-card: 0 1px 3px rgba(0, 0, 0, 0.02), 0 0 0 1px rgba(0, 0, 0, 0.03);
  --qw-shadow-raised: 0 4px 12px rgba(0, 0, 0, 0.04), 0 0 0 1px rgba(0, 0, 0, 0.03);
  --qw-shadow-overlay: 0 16px 48px rgba(0, 0, 0, 0.06);

  --qw-chart-bg: #FFFFFF;
  --qw-chart-grid: #EDF0F4;

  --qw-insight-bg: #EBF0FA;
  --qw-insight-border: rgba(41, 98, 255, 0.10);
  --qw-code-bg: #EBEEF3;
}

/* ===== 全局重置 (无语法错误版本) ===== */
*, *::before, *::after {
  box-sizing: border-box;
}

html {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
}

body {
  margin: 0;
  padding: 0;
  font-family: var(--qw-sans);
  font-size: var(--qw-text-base);
  font-weight: var(--qw-weight-body);
  line-height: var(--qw-leading-normal);
  color: var(--qw-ink);
  background: var(--qw-bg);
  transition: background var(--qw-motion-base) var(--qw-ease-standard),
              color var(--qw-motion-base) var(--qw-ease-standard);
}

/* ===== 排版层级 ===== */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--qw-serif);
  font-weight: var(--qw-weight-heading);
  line-height: var(--qw-leading-snug);
  color: var(--qw-ink);
  margin: 0 0 var(--qw-space-md);
  letter-spacing: var(--qw-tracking-heading);
}

h1 { font-size: var(--qw-text-3xl); letter-spacing: var(--qw-tracking-display); }
h2 { font-size: var(--qw-text-2xl); }
h3 { font-size: var(--qw-text-xl); }
h4 { font-size: var(--qw-text-lg); }

a {
  color: var(--qw-accent);
  text-decoration: none;
  transition: color var(--qw-motion-fast) var(--qw-ease-standard);
}
a:hover { color: var(--qw-accent-hover); }

p {
  margin: 0 0 var(--qw-space-md);
  color: var(--qw-ink-secondary);
  line-height: var(--qw-leading-relaxed);
  letter-spacing: var(--qw-tracking-body);
}

/* 中文不加额外letter-spacing */
:lang(zh) p, :lang(zh) a, :lang(zh) span, :lang(zh) li {
  letter-spacing: 0;
}

/* ===== 内容容器 ===== */
.qw-container {
  max-width: var(--qw-content-lg);
  margin: 0 auto;
  padding: 0 var(--qw-space-lg);
}

.qw-container-narrow {
  max-width: var(--qw-content-sm);
  margin: 0 auto;
  padding: 0 var(--qw-space-lg);
}
