/* design-tokens.css - 全局变量与基础重置 */
:root {
  /* === 色彩 === */
  --color-bg:        #F9F9F6;        /* 主背景，米白 */
  --color-surface:   #FFFFFF;
  --color-border:    rgba(0,0,0,0.06);
  --color-text:      #1A1A1A;
  --color-text-muted:#6B7280;
  --color-accent:    #2563EB;
  --color-accent-soft: rgba(37,99,235,0.08);

  /* 玻璃拟态 */
  --glass-bg:        rgba(255,255,255,0.72);
  --backdrop-blur:   12px;
  --glass-border:    1px solid rgba(255,255,255,0.5);
  --glass-shadow:    0 8px 32px rgba(0,0,0,0.04);

  /* 边框 */
  --radius-sm:       clamp(6px, 1.2vw, 10px);
  --radius-md:       clamp(10px, 1.8vw, 16px);
  --radius-lg:       clamp(14px, 2.4vw, 20px);

  /* 间距（流体） */
  --space-xs:        clamp(4px, 0.8vw, 8px);
  --space-sm:        clamp(6px, 1.2vw, 12px);
  --space-md:        clamp(12px, 2.4vw, 24px);
  --space-lg:        clamp(20px, 4vw, 40px);
  --space-xl:        clamp(32px, 6vw, 64px);

  /* 字体 */
  --font-heading:    'Playfair Display', Georgia, 'Times New Roman', serif;
  --font-body:       'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* 字号（流体） */
  --text-xs:         clamp(0.625rem, 1.2vw, 0.75rem);
  --text-sm:         clamp(0.75rem, 1.4vw, 0.875rem);
  --text-base:       clamp(0.875rem, 1.8vw, 1rem);
  --text-lg:         clamp(1rem, 2.2vw, 1.25rem);
  --text-xl:         clamp(1.25rem, 3vw, 1.75rem);
  --text-2xl:        clamp(1.5rem, 4vw, 2.25rem);
  --text-3xl:        clamp(1.875rem, 5.5vw, 3rem);

  /* 阴影 */
  --shadow-sm:       0 1px 3px rgba(0,0,0,0.04);
  --shadow-md:       0 4px 12px rgba(0,0,0,0.06);
  --shadow-lg:       0 12px 40px rgba(0,0,0,0.08);

  /* 过渡 */
  --transition-fast: 150ms ease;
  --transition-smooth: 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* 重置 */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font-body);
  background: var(--color-bg);
  color: var(--color-text);
  line-height: 1.6;
  min-height: 100vh;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
button, input { font: inherit; border: none; background: none; outline: none; }
h1, h2, h3, h4 { font-family: var(--font-heading); font-weight: 600; line-height: 1.25; }