/* AI 小游戏门户 · 设计 Token（继承博客 v1.1，增量见 WWW-27 03-visual-tokens.md） */
:root {
  --color-background: #09090B;
  --color-foreground: #FAFAFA;
  --color-card: #18181B;
  --color-muted: #27272A;
  --color-muted-foreground: #A1A1AA;
  --color-border: #27272A;
  --color-primary: #FAFAFA;
  --color-primary-foreground: #09090B;
  --color-accent: #F472B6;
  --color-destructive: #F87171;

  --color-game-primary: #F472B6;
  --color-game-primary-strong: #DB2777;
  --color-game-primary-soft: #3F1A2D;
  --color-game-bg: #09090B;
  --color-game-panel: #18181B;
  --color-game-accent-warm: #FBBF24;
  --color-game-state-loading: #A1A1AA;
  --color-game-state-error: #F87171;

  --font-display: 'Times New Roman', 'Songti SC', 'SimSun', serif;
  --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', sans-serif;
  --font-mono: 'SF Mono', 'Consolas', 'Menlo', monospace;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, .5);
  --ease-story: cubic-bezier(.4, 0, .2, 1);
  --dur-step: 300ms;
  --dur-fade: 200ms;
  --dur-skeleton: 1200ms;
  --header-h: 64px;
  --font-scale: 1;
}

:root[data-theme='light'] {
  --color-background: #FAFAFA;
  --color-foreground: #09090B;
  --color-card: #FFFFFF;
  --color-muted: #E8ECF0;
  --color-muted-foreground: #475569;
  --color-border: #E4E4E7;
  --color-primary: #18181B;
  --color-primary-foreground: #FAFAFA;
  --color-accent: #EC4899;
  --color-destructive: #DC2626;

  --color-game-primary: #EC4899;
  --color-game-primary-strong: #BE185D;
  --color-game-primary-soft: #FCE7F3;
  --color-game-bg: #FAFAFA;
  --color-game-panel: #FFFFFF;
  --color-game-accent-warm: #F59E0B;
  --color-game-state-loading: #A1A1AA;
  --color-game-state-error: #DC2626;
  --shadow-sm: 0 1px 2px rgba(9, 9, 11, .06);
  --shadow-md: 0 8px 24px rgba(9, 9, 11, .08);
}

:root[data-font='sm'] { --font-scale: .92; }
:root[data-font='lg'] { --font-scale: 1.12; }
