/* Q-Star 内容工场 · Design Tokens (Path A) — DESIGN §1 */
:root {
  color-scheme: dark;

  /* 1.1 Color */
  --bg: #0B0D10;
  --bg-elev: #12151A;
  --bg-soft: #1A1F27;
  --line: #2A3140;
  --line-strong: #3D4658;
  --text: #E8ECF1;
  --text-muted: #9AA3B2;
  --text-faint: #8C95A3;
  --accent: #3DDC97;
  --accent-dim: rgba(61, 220, 151, 0.14);
  --accent-text: #0B0D10;
  --warn: #F5A524;
  --danger: #F07178;
  --focus: #5B8CFF;

  /* 1.2 Fonts */
  --font-sans: "Geist", "Inter", "Noto Sans SC", system-ui, sans-serif;
  --font-display: "Geist", "Inter", "Noto Sans SC", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", "SF Mono", ui-monospace, monospace;

  /* 1.3 Type scale */
  --fs-hero: clamp(2rem, 4vw + 1rem, 3.25rem);
  --fs-h2: clamp(1.35rem, 1.5vw + 1rem, 1.75rem);
  --fs-body: 1.0625rem;
  --fs-sm: 0.875rem;
  --lh-tight: 1.2;
  --lh-body: 1.65;
  --tracking-hero: -0.02em;

  /* 1.4 Space / radius / shadow */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 72px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --shadow-card: 0 0 0 1px var(--line), 0 12px 40px rgba(0, 0, 0, 0.35);
  --content-w: 1080px;
  --gutter: clamp(16px, 4vw, 32px);

  /* 1.5 Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-soft: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-1: 160ms;
  --dur-2: 320ms;
  --dur-3: 600ms;
}