/* ============================================
   设计令牌 — 温暖编辑自然主义
   一会去哪儿 · Design Tokens
   ============================================ */

:root {
  /* ── 主色：陶土橙 ── 温暖、活力、户外感 ── */
  --color-primary: #C65D3A;
  --color-primary-deep: #9E4528;
  --color-primary-soft: #E8B89C;
  --color-primary-tint: #F5DDD0;

  /* ── 辅色：鼠尾草绿 ── 自然、放松 ── */
  --color-secondary: #7A8B6F;
  --color-secondary-deep: #5A6B4F;
  --color-secondary-soft: #B8C4AF;

  /* ── 强调色：芥末黄 ── 点睛、阳光 ── */
  --color-accent: #D4A24C;
  --color-accent-deep: #B8862E;
  --color-accent-soft: #ECD3A0;

  /* ── 背景：暖奶油 ── 纸感、编辑气质 ── */
  --color-bg: #FAF6F0;
  --color-bg-warm: #F5EFE6;
  --color-bg-deep: #EDE5D8;
  --color-surface: #FFFFFF;
  --color-surface-elevated: #FFFBF5;
  --color-surface-sunk: #F2EBE0;

  /* ── 文字：暖炭灰，不用纯黑 ── */
  --color-text: #2A2520;
  --color-text-muted: #6B6258;
  --color-text-faint: #A89E92;
  --color-text-inverse: #FAF6F0;

  /* ── 功能色 ── */
  --color-good: #6B8E5A;
  --color-warn: #D4A24C;
  --color-info: #6B8CAE;
  --color-danger: #B85C4A;

  /* ── 天气动态色（JS 根据天气切换 --weather-tint） ── */
  --weather-sunny: #F4B860;
  --weather-cloudy: #8B9DAF;
  --weather-rainy: #6B8CAE;
  --weather-snowy: #C4D4E0;
  --weather-overcast: #9AA5AE;
  --weather-tint: var(--weather-cloudy);
  --weather-tint-soft: rgba(139, 157, 175, 0.12);

  /* ── 字体系统 ── */
  --font-display: 'Fraunces', 'Noto Serif SC', Georgia, serif;
  --font-body: 'Plus Jakarta Sans', 'Noto Sans SC', system-ui, sans-serif;
  --font-numeric: 'Space Grotesk', 'Noto Sans SC', monospace;

  /* ── 字号（流式自适应） ── */
  --text-hero: clamp(2.5rem, 6vw, 4.5rem);
  --text-h1: clamp(1.75rem, 3.5vw, 2.5rem);
  --text-h2: clamp(1.375rem, 2.5vw, 1.875rem);
  --text-h3: 1.25rem;
  --text-body: 1rem;
  --text-small: 0.875rem;
  --text-tiny: 0.8125rem;
  --text-micro: 0.6875rem;

  /* ── 字重 ── */
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;

  /* ── 行高 ── */
  --leading-tight: 1.15;
  --leading-snug: 1.35;
  --leading-normal: 1.6;
  --leading-relaxed: 1.75;

  /* ── 字间距 ── */
  --tracking-tight: -0.02em;
  --tracking-normal: 0;
  --tracking-wide: 0.02em;
  --tracking-wider: 0.08em;

  /* ── 间距系统（8px 基线） ── */
  --space-3xs: 2px;
  --space-2xs: 4px;
  --space-xs: 8px;
  --space-sm: 12px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --space-4xl: 96px;
  --space-5xl: 128px;

  /* ── 圆角 ── 温暖圆润，不用尖锐直角 ── */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 32px;
  --radius-pill: 9999px;
  --radius-circle: 50%;

  /* ── 阴影 ── 柔和分层，暖色调 ── */
  --shadow-xs: 0 1px 2px rgba(42, 37, 32, 0.05);
  --shadow-sm: 0 1px 2px rgba(42, 37, 32, 0.04), 0 1px 3px rgba(42, 37, 32, 0.06);
  --shadow-md: 0 4px 12px rgba(42, 37, 32, 0.06), 0 2px 4px rgba(42, 37, 32, 0.04);
  --shadow-lg: 0 16px 40px rgba(42, 37, 32, 0.10), 0 4px 8px rgba(42, 37, 32, 0.06);
  --shadow-xl: 0 24px 56px rgba(42, 37, 32, 0.14), 0 8px 16px rgba(42, 37, 32, 0.08);
  --shadow-warm: 0 16px 40px rgba(198, 93, 58, 0.15), 0 4px 12px rgba(198, 93, 58, 0.10);
  --shadow-warm-lg: 0 24px 56px rgba(198, 93, 58, 0.22), 0 8px 20px rgba(198, 93, 58, 0.14);
  --shadow-inset: inset 0 1px 2px rgba(42, 37, 32, 0.06);
  --shadow-focus: 0 0 0 3px rgba(198, 93, 58, 0.28);

  /* ── 动效曲线 ── */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

  /* ── 动效时长 ── */
  --duration-instant: 80ms;
  --duration-fast: 150ms;
  --duration-normal: 250ms;
  --duration-slow: 400ms;
  --duration-slower: 600ms;
  --duration-grand: 800ms;

  /* ── 层级 ── */
  --z-base: 1;
  --z-raised: 10;
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-overlay: 500;
  --z-drawer: 600;
  --z-toast: 700;

  /* ── 布局 ── */
  --container-max: 1200px;
  --container-narrow: 760px;
  --container-padding: clamp(1rem, 4vw, 2.5rem);
  --header-height: 72px;

  /* ── 过渡 ── */
  --transition-fast: var(--duration-fast) var(--ease-out);
  --transition-normal: var(--duration-normal) var(--ease-smooth);
  --transition-slow: var(--duration-slow) var(--ease-out);
}
