/* ============================================
   Design Tokens — CSS Custom Properties
   Physics Animation Teaching Platform
   ============================================ */

/* Dark mode (default) — 提亮版暗色：保持暗色调，仅比原版（slate-900）略微提亮 */
:root {
  /* Colors */
  --color-bg: #10182B;
  --color-surface: rgba(255,255,255,0.07);
  --color-border: rgba(255,255,255,0.12);
  --color-primary: #1E3A5F;
  --color-accent: #F59E0B;
  --color-secondary: #3B82F6;
  --color-physics-red: #EF4444;
  --color-physics-green: #10B981;
  --color-text-primary: #F1F5F9;
  --color-text-secondary: #9CAEC2;
  --color-canvas-bg: #10182B;

  /* Spacing */
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 16px;
  --spacing-lg: 24px;
  --spacing-xl: 32px;

  /* Border radius */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;

  /* Fonts */
  --font-sans: 'PingFang SC', 'Microsoft YaHei', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', 'Courier New', monospace;
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.25rem;
  --font-size-xl: 1.5rem;

  /* Transitions */
  --transition-fast: 0.15s ease;
  --transition-normal: 0.25s ease;

  /* Layout */
  --nav-height: 48px;
  --panel-width: 240px;
  --info-width: 200px;
}