/* tokens.css —— 唯一样式源头，禁止页面内硬编码色值 */

@font-face {
  font-family: 'OPPO Sans';
  src: url('/assets/fonts/OPPOSans4.0.ttf') format('truetype');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'OPPO Sans';
  src: url('/assets/fonts/OPPOSans4.0.ttf') format('truetype');
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: 'OPPO Sans';
  src: url('/assets/fonts/OPPOSans4.0.ttf') format('truetype');
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: 'OPPO Sans';
  src: url('/assets/fonts/OPPOSans4.0.ttf') format('truetype');
  font-weight: 700;
  font-display: swap;
}

:root {
  /* 品牌色 */
  --neon: #17FF26;
  --neon-dark: #14d620;

  /* 绿色系 */
  --green-700: #0d5e3a;
  --green-600: #15803d;
  --green-500: #1a9c5c;
  --green-400: #22c55e;
  --green-300: #4ade80;
  --green-100: #dcfce7;
  --green-50: #f0fdf4;

  /* 中性色（值已与 Figma 设计稿对齐） */
  --bg: #fafafa;
  --bg-card: #fff;
  --text: #1a1a1a;
  --text-secondary: #444444;
  --text-muted: #9ca3af;
  --border: #e5e7eb;
  --border-light: #f3f4f6;

  /* 强调色 */
  --gold: #f59e0b;
  --gold-light: #fef3c7;
  --gold-text: #92400e;
  --red: #dc2626;
  --red-light: #fee2e2;
  --red-200: #fecaca;

  /* 设计稿规范色（Figma 设计评选网站） */
  --star: #ffc700;
  --gray-disabled: #d4d4d4;
  --logout-red: #e33333;
  --footer-text: #d1d1d1;
  --hover-gray: #f7f7f7;
  --badge-green: #007934;

  /* 深色背景上的前景色（图片遮罩 / 视频 / 弹层上的白字白图标） */
  --on-dark: #ffffff;
  --video-bg: #000000;

  /* 排名徽章 2/3 名（原硬编码值语义化） */
  --rank-2-bg: #f1f5f9;
  --rank-2-text: #64748b;
  --rank-3-bg: #fef2f2;
  --rank-3-text: #991b1b;

  /* Figma 嵌入标签（紫色，原硬编码值语义化） */
  --figma-bg: #ede9fe;
  --figma-text: #7c3aed;

  /* 新品详情长图窗口（反馈#49：渐变背景 #465461 → #999999） */
  --longimg-grad-start: #465461;
  --longimg-grad-end: #999999;

  /* 项目状态徽章（反馈#55：组任务详情页） */
  --status-doing-text: #b45309;
  --status-planning-bg: #eef2ff;
  --status-planning-text: #4f46e5;

  /* Bug 反馈悬浮按钮描边（反馈#57，设计稿 #F4F4F4） */
  --bug-float-border: #f4f4f4;

  /* 阴影 */
  --shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  --shadow-lg: 0 10px 25px rgba(0, 0, 0, 0.08);

  /* 圆角 */
  --radius: 12px;
  --radius-sm: 8px;
  --radius-xs: 6px;
  --radius-pill: 999px;

  /* 字体 */
  --font: 'OPPO Sans', -apple-system, BlinkMacSystemFont, 'PingFang SC', sans-serif;
  --transition: 0.2s ease;

  /* ===== 字号阶梯（语义化，对应设计系统.md §2） ===== */
  --fs-display: 60px;
  --fs-h1: 28px;
  --fs-h2: 26px;
  --fs-h3: 24px;
  --fs-h4: 20px;
  --fs-lg: 16px;
  --fs-md: 14px;
  --fs-sm: 13px;
  --fs-xs: 12px;
  --fs-caption: 11px;

  /* 行高 */
  --lh-tight: 1.3;
  --lh-normal: 1.5;
  --lh-relaxed: 1.8;

  /* 字重（Figma 中 600 一律用 700 实现） */
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-bold: 700;

  /* ===== 间距阶梯（4px 基准网格，对应设计系统.md §3） ===== */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;

  /* ===== 断点（文档化常量；CSS 媒体查询须写字面量，JS 可读此值） ===== */
  --bp-sm: 640px;
  --bp-md: 768px;
  --bp-lg: 1024px;
  --bp-xl: 1280px;

  /* 尺寸 */
  --header-h: 60px;
  --nav-h: 55px;
  --nav-pill-h: 33px;
}