/* ============================================
   variables.css — 设计系统 CSS 变量
   当前配色：方案 A — 极光蓝（科技渐变）
   ============================================ */

:root {
  /* ── 字体族 ── */
  --font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB',
                 'Microsoft YaHei', 'Helvetica Neue', Arial, sans-serif;
  --font-family-serif: Georgia, serif;

  /* ── 主色 ── */
  --color-primary-start: #0052D4;
  --color-primary-mid:   #4364F7;
  --color-primary-end:   #6FB1FC;
  --color-primary:       #4364F7;
  --gradient-primary: linear-gradient(135deg, #0052D4 0%, #4364F7 50%, #6FB1FC 100%);

  /* ── 背景 ── */
  --color-bg:            #FFFFFF;
  --color-bg-alt:        #F0F4FF;
  --color-bg-card:       #FFFFFF;

  /* ── 文字 ── */
  --color-text-primary:  #1A1A2E;
  --color-text-secondary:#4A5568;
  --color-text-muted:    #718096;
  --color-text-inverse:       #FFFFFF;
  --color-text-inverse-dim:   rgba(255, 255, 255, 0.85);
  --color-text-inverse-muted: rgba(255, 255, 255, 0.65);
  --color-text-inverse-faint: rgba(255, 255, 255, 0.35);

  /* ── 边框 & 分割线 ── */
  --color-border:        #E2EAF8;
  --color-border-light:  #F0F4FF;

  /* ── 模块强调色 ── */
  --color-starcore:      #587EE6;
  --color-starflow:      #0EA5E9;

  /* ── 状态色 ── */
  --color-success:       #10B981;
  --color-warning:       #F59E0B;
  --color-error:         #EF4444;

  /* ── Header ── */
  --header-height:       64px;
  --header-bg:           #ffffff;
  --header-bg-glass:     #ffffff;
  --header-border:       rgba(226, 234, 248, 1);
  --header-shadow:       0 1px 20px rgba(67, 100, 247, 0.08);

  /* ── 字体 ── */
  --font-size-xs:        0.75rem;   /* 12px */
  --font-size-sm:        0.875rem;  /* 14px */
  --font-size-base:      1rem;      /* 16px */
  --font-size-md:        1.125rem;  /* 18px */
  --font-size-lg:        1.25rem;   /* 20px */
  --font-size-xl:        1.5rem;    /* 24px */
  --font-size-2xl:       2rem;      /* 32px */
  --font-size-3xl:       2.5rem;    /* 40px */
  --font-size-4xl:       3rem;      /* 48px */

  /* ── 间距 ── */
  --spacing-1:  0.25rem;
  --spacing-2:  0.5rem;
  --spacing-3:  0.75rem;
  --spacing-4:  1rem;
  --spacing-5:  1.25rem;
  --spacing-6:  1.5rem;
  --spacing-8:  2rem;
  --spacing-10: 2.5rem;
  --spacing-12: 3rem;
  --spacing-16: 4rem;
  --spacing-20: 5rem;
  --spacing-24: 6rem;

  /* ── 圆角 ── */
  --radius-sm:  4px;
  --radius-md:  8px;
  --radius-lg:  12px;
  --radius-xl:  16px;
  --radius-2xl: 24px;
  --radius-full: 9999px;

  /* ── 阴影 ── */
  --shadow-sm:  0 1px 3px rgba(0, 0, 0, 0.08);
  --shadow-md:  0 4px 16px rgba(67, 100, 247, 0.12);
  --shadow-lg:  0 8px 32px rgba(67, 100, 247, 0.16);
  --shadow-xl:  0 16px 48px rgba(67, 100, 247, 0.20);

  /* ── 过渡 ── */
  --transition-fast:   0.15s ease;
  --transition-base:   0.25s ease;
  --transition-slow:   0.4s ease;

  /* ── 布局 ── */
  --container-max:     1200px;
  --container-padding: 1.5rem;
}
