/**
 * Layer 2: Semantic Tokens - Light Theme（亮色语义令牌）
 *
 * 业务代码唯一引用入口：业务 TSX/CSS 引用 var(--color-*) / var(--font-*) 等。
 * 维护者：ai13（teacher-portal）
 * 关联：project_rules §3.10、03-long-term-architecture.md §1.5
 *
 * 引用 Layer 1 Primitive 组合成完整语义值。
 */

:root {
  color-scheme: light;

  /* ============ 背景与表面 ============ */
  --bg-paper: hsl(var(--color-paper-h) var(--color-paper-s) var(--color-paper-l-98));
  --bg-surface: hsl(var(--color-paper-h) var(--color-paper-s) var(--color-paper-l-99));
  --bg-subtle: hsl(var(--color-rule-h) var(--color-rule-s) var(--color-rule-l-90));

  /* ============ 文字 ============ */
  --color-ink: hsl(var(--color-ink-h) var(--color-ink-s) var(--color-ink-l-15));
  --color-ink-muted: hsl(var(--color-ink-h) var(--color-ink-s) var(--color-ink-l-45));
  --color-ink-subtle: hsl(var(--color-ink-h) var(--color-ink-s) var(--color-ink-l-60));
  --color-ink-on-accent: hsl(var(--color-paper-h) var(--color-paper-s) var(--color-paper-l-99));

  /* ============ 强调色 ============ */
  --color-accent: hsl(var(--color-accent-h) var(--color-accent-s) var(--color-accent-l-35));
  --color-accent-hover: hsl(var(--color-accent-h) var(--color-accent-s) var(--color-accent-l-50));
  --color-accent-subtle: hsl(var(--color-accent-h) var(--color-accent-s) var(--color-rule-l-90));

  /* ============ 分隔线 ============ */
  --color-rule: hsl(var(--color-rule-h) var(--color-rule-s) var(--color-rule-l-90));
  --color-rule-strong: hsl(var(--color-rule-h) var(--color-rule-s) var(--color-rule-l-85));

  /* ============ 语义色 ============ */
  --color-success: hsl(var(--color-success-h) var(--color-success-s) var(--color-success-l-45));
  --color-warning: hsl(var(--color-warning-h) var(--color-warning-s) var(--color-warning-l-50));
  --color-danger: hsl(var(--color-danger-h) var(--color-danger-s) var(--color-danger-l-60));
  --color-info: hsl(var(--color-info-h) var(--color-info-s) var(--color-info-l-48));

  /* ============ 边框/输入 ============ */
  --color-border: var(--color-rule);
  --color-border-focus: var(--color-accent);
  --color-input-bg: var(--bg-surface);

  /* ============ 字体族（通过 var 引用，禁止字面量） ============ */
  --font-family-sans: var(--font-inter, system-ui), -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-family-serif: var(--font-fraunces, Georgia), "Times New Roman", serif;
  --font-family-mono: var(--font-jetbrains-mono, "SF Mono"), Monaco, Consolas, monospace;

  /* ============ 语义字号 ============ */
  --font-size-body: var(--font-size-3);
  --font-size-small: var(--font-size-2);
  --font-size-tiny: var(--font-size-1);
  --font-size-heading-1: var(--font-size-7);
  --font-size-heading-2: var(--font-size-6);
  --font-size-heading-3: var(--font-size-5);
  --font-size-display: var(--font-size-9);
  --font-size-large-number: var(--font-size-8);

  /* ============ 语义间距 ============ */
  --space-xs: var(--space-1);
  --space-sm: var(--space-2);
  --space-md: var(--space-4);
  --space-lg: var(--space-6);
  --space-xl: var(--space-8);
  --space-2xl: var(--space-12);

  /* ============ 语义阴影 ============ */
  --shadow-sm: var(--shadow-1);
  --shadow-md: var(--shadow-2);
  --shadow-lg: var(--shadow-3);
  --shadow-xl: var(--shadow-4);

  /* ============ 语义圆角 ============ */
  --radius-default: var(--radius-md);
  --radius-card: var(--radius-lg);
  --radius-button: var(--radius-md);

  /* ============ 过渡 ============ */
  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-normal: 200ms cubic-bezier(0.4, 0, 0.2, 1);
}
