/* ==========================================================================
   设计令牌 — TikTok 专线服务（复古未来网络终端风格）
   全站唯一的颜色 / 字阶 / 间距 / 圆角 / 阴影 / 动效来源。
   组件层禁止硬编码色值，一律引用本文件变量。
   ========================================================================== */

:root {
  /* ---------- 表面与底色 ---------- */
  /* 近黑蓝而非纯黑：让荧光色有对比空间，同时降低 OLED 死黑感 */
  --color-bg: #05080c;
  --color-bg-elev: #0a0f16;
  --color-surface: #0d141d;
  --color-surface-2: #121b26;
  --color-surface-3: #18232f;

  /* ---------- 文本 ---------- */
  --color-text: #e8f4f8;          /* 正文主色，对 --color-bg 对比度 ≈ 15.8:1 */
  --color-text-strong: #ffffff;   /* 标题 */
  --color-muted: #a8bdcb;         /* 次要文本，对 --color-bg 对比度 ≈ 9.6:1 */
  --color-faint: #7b93a4;         /* 辅助标签，对 --color-bg 对比度 ≈ 5.6:1 */

  /* ---------- 主色：信号青（链路 / 在线状态语义） ---------- */
  --color-primary: #22d3ee;
  --color-primary-dim: #0e7490;
  --color-primary-soft: rgba(34, 211, 238, 0.12);
  --color-primary-glow: rgba(34, 211, 238, 0.32);

  /* ---------- 强调色：琥珀橙（单屏唯一强调色，只给关键动作） ---------- */
  --color-accent: #ff7a18;
  --color-accent-dim: #b45309;
  --color-accent-soft: rgba(255, 122, 24, 0.14);
  --color-accent-glow: rgba(255, 122, 24, 0.38);

  /* ---------- 语义色 ---------- */
  --color-success: #34d399;
  --color-warning: #fbbf24;
  --color-danger: #f87171;

  /* ---------- 描边与分隔 ---------- */
  --color-border: rgba(147, 169, 184, 0.14);
  --color-border-strong: rgba(34, 211, 238, 0.42);
  --color-hairline: rgba(147, 169, 184, 0.08);

  /* ---------- 渐变 ---------- */
  --gradient-signal: linear-gradient(135deg, #22d3ee 0%, #0ea5e9 50%, #6366f1 100%);
  --gradient-accent: linear-gradient(135deg, #ff7a18 0%, #f59e0b 100%);
  --gradient-surface: linear-gradient(160deg, rgba(24, 35, 47, 0.9) 0%, rgba(10, 15, 22, 0.9) 100%);
  --gradient-sheen: linear-gradient(105deg, transparent 30%, rgba(34, 211, 238, 0.14) 50%, transparent 70%);
  --gradient-fade-down: linear-gradient(180deg, var(--color-bg) 0%, rgba(5, 8, 12, 0) 100%);

  /* ---------- 字体 ---------- */
  --font-display: 'Chakra Petch', 'PingFang SC', 'Microsoft YaHei', 'Noto Sans SC', sans-serif;
  --font-body: 'Inter Tight', -apple-system, BlinkMacSystemFont, 'Segoe UI',
               'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Noto Sans SC', sans-serif;
  --font-mono: 'IBM Plex Mono', 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* ---------- 字阶（1.25 模组，响应式钳制） ---------- */
  --fs-display: clamp(2.75rem, 7.2vw, 5.5rem);   /* Hero 主标题 */
  --fs-h1: clamp(2.25rem, 5.2vw, 3.75rem);
  --fs-h2: clamp(1.875rem, 3.6vw, 2.75rem);
  --fs-h3: clamp(1.25rem, 1.9vw, 1.5rem);
  --fs-h4: clamp(1.0625rem, 1.3vw, 1.1875rem);
  --fs-body-lg: clamp(1rem, 1.15vw, 1.125rem);
  --fs-body: 1rem;
  --fs-sm: 0.9375rem;
  --fs-xs: 0.8125rem;
  --fs-micro: 0.6875rem;                         /* 标签 / 编号 */

  /* ---------- 间距梯度 ---------- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;

  /* ---------- 版心 ---------- */
  --container-max: 1200px;
  --container-wide: 1400px;
  --container-pad: clamp(1.25rem, 4vw, 2.5rem);

  /* ---------- 圆角（偏克制，配合硬边科技感） ---------- */
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;
  --radius-pill: 999px;

  /* ---------- 阴影（三级，带环境色而非纯黑） ---------- */
  --shadow-1: 0 2px 8px rgba(2, 8, 16, 0.5);
  --shadow-2: 0 8px 28px rgba(2, 8, 16, 0.58);
  --shadow-3: 0 24px 64px rgba(2, 8, 16, 0.66);
  --shadow-glow: 0 0 0 1px var(--color-border-strong), 0 8px 40px var(--color-primary-glow);
  --shadow-glow-accent: 0 0 0 1px rgba(255, 122, 24, 0.5), 0 8px 40px var(--color-accent-glow);

  /* ---------- 动效 ---------- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 160ms;
  --dur-base: 320ms;
  --dur-slow: 640ms;
  --dur-scene: 900ms;

  /* ---------- 层级 ---------- */
  --z-base: 0;
  --z-sticky: 100;
  --z-nav: 500;
  --z-overlay: 900;
  --z-modal: 1000;
}

/* 注：此前此处有 @media (prefers-reduced-motion: reduce) 把动效时长归零，
   与 base.css 的降级块一并移除 —— 动效时长现在恒为设计值，持续运行。 */