/* ============================================================
   虎迅客 · Design Tokens
   设计令牌：色彩、字体、间距、圆角、阴影、动效
   高端商务化升级 · Voice Agent 3.0 设计系统
   ============================================================ */
:root {
  /* --- 色彩：背景层级（深空商务 - 非纯黑，带蓝紫调） --- */
  --bg: #070A16;              /* 页面主背景 - 更深，让动态光效更突出 */
  --bg-2: #0A0E1E;            /* 次级背景 */
  --surface: #10152B;         /* 卡片表面 - 加深，拉开与 bg 的层级 */
  --surface-2: #161D3A;       /* 次级表面 / 表头 - 明显一级 */
  --surface-3: #080B18;       /* 代码块 / 深凹陷 */
  --surface-glass: rgba(16, 21, 43, 0.58); /* 玻璃态表面 - 更通透，透出动态背景 */
  --surface-glass-2: rgba(22, 29, 58, 0.52); /* 玻璃态次级 */

  /* --- 色彩：文字（对比度拉开一档） --- */
  --ink: #F2F4FB;             /* 主文字 - 保持 */
  --text: #C5CCE0;            /* 次级文字 - 从 #A8B0CC 提亮 */
  --muted: #8B94B0;           /* 辅助文字 - 从 #6B7390 提亮 */
  --disabled: #3D4460;        /* 禁用文字 */

  /* --- 色彩：边框（明显加粗/加深） --- */
  --border: rgba(255, 255, 255, 0.10);
  --border-strong: rgba(255, 255, 255, 0.18);
  --border-glow: rgba(108, 92, 231, 0.45);
  --hairline: rgba(255, 255, 255, 0.07);       /* 极细结构线 - 商务精密感 */
  --hairline-gold: rgba(201, 169, 97, 0.28);   /* 金线 - 高端点缀 */

  /* --- 色彩：品牌（保留紫色主调，增加金线商务感） --- */
  --brand: #6C5CE7;
  --brand-hover: #5A4BD1;
  --brand-active: #483ABF;
  --brand-2: #8B5CF6;
  --brand-text: #B4ABFF;
  --brand-soft: rgba(108, 92, 231, 0.10);
  --brand-soft-strong: rgba(108, 92, 231, 0.20);

  /* --- 色彩：极光三色（动态背景 / 光效统一取色） --- */
  --aurora-1: #7C5CFF;        /* 极光紫 */
  --aurora-2: #22D3EE;        /* 极光青 */
  --aurora-3: #14E0B1;        /* 极光绿 */
  --aurora-1-soft: rgba(124, 92, 255, 0.16);
  --aurora-2-soft: rgba(34, 211, 238, 0.12);
  --aurora-3-soft: rgba(20, 224, 177, 0.10);
  --grad-aurora: linear-gradient(120deg, #7C5CFF 0%, #22D3EE 50%, #14E0B1 100%);
  /* 玻璃卡片光标聚光（由 bg-scene.js 写入 --mx/--my） */
  --mx: 50%;
  --my: 0%;

  /* --- 色彩：商务金线（点缀） --- */
  --gold: #C9A961;
  --gold-soft: rgba(201, 169, 97, 0.10);
  --gold-soft-strong: rgba(201, 169, 97, 0.22);

  /* --- 色彩：状态 --- */
  --success: #00D4AA;
  --success-soft: rgba(0, 212, 170, 0.10);
  --info: #3B82F6;
  --info-soft: rgba(59, 130, 246, 0.10);
  --connect: #06B6D4;
  --connect-soft: rgba(6, 182, 212, 0.10);
  --warning: #FFB800;
  --warning-soft: rgba(255, 184, 0, 0.10);
  --danger: #FF5C5C;
  --danger-soft: rgba(255, 92, 92, 0.10);

  /* --- 渐变（丰富多层） --- */
  --grad-brand: linear-gradient(135deg, #6C5CE7 0%, #8B5CF6 100%);
  --grad-brand-accent: linear-gradient(135deg, #6C5CE7 0%, #00D4AA 100%);
  --grad-text: linear-gradient(135deg, #F2F4FB 0%, #B4ABFF 50%, #C9A961 100%);
  --grad-gold: linear-gradient(135deg, #C9A961 0%, #E8D5A0 100%);
  --grad-mesh: radial-gradient(ellipse 60% 80% at 20% 10%, rgba(124,92,255,0.16), transparent 55%),
               radial-gradient(ellipse 50% 60% at 80% 20%, rgba(34,211,238,0.09), transparent 55%),
               radial-gradient(ellipse 70% 50% at 50% 100%, rgba(201,169,97,0.05), transparent 55%);
  --grad-glass: linear-gradient(135deg, rgba(255,255,255,0.055) 0%, rgba(255,255,255,0.012) 55%, rgba(124,92,255,0.03) 100%);
  --grad-border: linear-gradient(120deg, rgba(124,92,255,0.55), rgba(201,169,97,0.30), rgba(34,211,238,0.35));
  --grad-hairline: linear-gradient(90deg, transparent, rgba(124,92,255,0.30) 25%, rgba(201,169,97,0.22) 50%, rgba(34,211,238,0.26) 75%, transparent);
  --grad-card-border: linear-gradient(150deg, rgba(255,255,255,0.16), rgba(255,255,255,0.03) 38%, rgba(124,92,255,0.12) 70%, rgba(34,211,238,0.14));

  /* --- 字体 --- */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei', 'Noto Sans CJK SC', sans-serif;
  --font-mono: 'SFMono-Regular', 'SF Mono', 'JetBrains Mono', Consolas, monospace;
  --font-display: 'Inter', -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;

  /* --- 字号 --- */
  --fs-h1: 3.5rem;      /* 56 */
  --fs-h2: 2.5rem;      /* 40 */
  --fs-h3: 1.6rem;      /* 25.6 */
  --fs-h4: 1.15rem;     /* 18.4 */
  --fs-body: 1.02rem;   /* 16.3 */
  --fs-sm: 0.88rem;     /* 14 */
  --fs-xs: 0.75rem;     /* 12 */
  --fs-label: 0.75rem;  /* 12 大写标签 */

  /* --- 间距（8px 基准，4→128） --- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 28px;
  --space-6: 36px;
  --space-7: 52px;
  --space-8: 72px;
  --space-9: 112px;

  /* --- 圆角 --- */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-2xl: 32px;
  --radius-pill: 999px;

  /* --- 阴影（多层商务质感） --- */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 6px 24px rgba(0, 0, 0, 0.42);
  --shadow-lg: 0 16px 56px rgba(0, 0, 0, 0.5);
  --shadow-xl: 0 28px 90px rgba(0, 0, 0, 0.55);
  --shadow-glow: 0 0 56px rgba(124, 92, 255, 0.22);
  --shadow-brand: 0 8px 32px rgba(108, 92, 231, 0.4);
  --shadow-gold: 0 4px 24px rgba(201, 169, 97, 0.15);
  --shadow-inset: inset 0 1px 0 rgba(255, 255, 255, 0.05);
  --shadow-glass: 0 12px 44px rgba(0, 0, 0, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.07);

  /* --- 布局 --- */
  --max: 1200px;
  --max-narrow: 860px;
  --header-h: 68px;

  /* --- 动效 --- */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast: 0.15s;
  --dur: 0.25s;
  --dur-slow: 0.4s;
  --dur-xl: 0.6s;

  /* --- 玻璃态 --- */
  --blur-sm: blur(10px) saturate(150%);
  --blur: blur(18px) saturate(160%);
  --blur-lg: blur(26px) saturate(170%);
  --blur-xl: blur(44px) saturate(180%);
}
