/* ─────────────────────────────────────────────────────────────────────────────
   PyViz3D Design Tokens — Design System Foundation
   所有 CSS 变量在此定义，确保全站视觉一致性
   ───────────────────────────────────────────────────────────────────────────── */

:root {
  /* ── Background Layers ───────────────────────────────────────────────────── */
  --bg-primary:    #080810;   /* 最深层背景：深空黑 */
  --bg-secondary:  #0e0e1c;   /* 卡片/面板背景 */
  --bg-tertiary:   #16162a;   /* 输入框 / hover / active 态 */
  --bg-overlay:    #12122a;   /* 半透明遮罩背景 */

  /* ── Glass Surface ─────────────────────────────────────────────────────── */
  --surface:       rgba(14, 14, 28, 0.88);   /* 玻璃面板背景 */
  --surface-light: rgba(22, 22, 42, 0.93);   /* 浅色玻璃面板 */
  --glass-blur:    blur(16px);                /* backdrop-filter 值 */
  --glass-blur-sm: blur(8px);

  /* ── Borders ───────────────────────────────────────────────────────────── */
  --border:        rgba(255, 255, 255, 0.07);
  --border-subtle: rgba(255, 255, 255, 0.04);
  --border-active: rgba(0, 212, 255, 0.35);
  --border-hover:  rgba(255, 255, 255, 0.12);

  /* ── Accent Colors ────────────────────────────────────────────────────── */
  --accent:        #00d4ff;   /* 主强调色：科技青 */
  --accent-dim:    rgba(0, 212, 255, 0.15);
  --accent-glow:   rgba(0, 212, 255, 0.25);
  --accent-rgb:    0, 212, 255;

  --accent-2:      #7b2ff7;   /* 次强调色：紫 */
  --accent-2-dim:  rgba(123, 47, 247, 0.15);

  --gradient:      linear-gradient(135deg, #00d4ff, #7b2ff7);
  --gradient-soft: linear-gradient(135deg, rgba(0,212,255,0.12), rgba(123,47,247,0.12));
  --gradient-btn:  linear-gradient(135deg, #00d4ff 0%, #7b2ff7 100%);

  /* ── Text Colors ───────────────────────────────────────────────────────── */
  --text-primary:   #e8e8f0;
  --text-secondary: #8888aa;
  --text-muted:     #555570;
  --text-disabled: #3a3a50;
  --text-accent:    #00d4ff;

  /* ── Semantic Colors ───────────────────────────────────────────────────── */
  --success:  #4ade80;
  --warning:  #fbbf24;
  --danger:   #f87171;
  --info:     #60a5fa;

  /* ── Object Type Colors (图层面板使用) ─────────────────────────────────── */
  --type-points:     #00d4ff;
  --type-mesh:       #7b2ff7;
  --type-box:        #fbbf24;
  --type-arrow:      #f87171;
  --type-line:       #4ade80;
  --type-label:      #60a5fa;
  --type-superquad:  #fb923c;
  --type-polyline:   #e879f9;
  --type-motion:     #a78bfa;

  /* ── Border Radius ─────────────────────────────────────────────────────── */
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-full: 9999px;

  /* ── Shadows ───────────────────────────────────────────────────────────── */
  --shadow-sm:   0 2px 8px rgba(0, 0, 0, 0.3);
  --shadow-md:   0 4px 16px rgba(0, 0, 0, 0.4);
  --shadow-lg:   0 8px 32px rgba(0, 0, 0, 0.5);
  --shadow-xl:   0 16px 48px rgba(0, 0, 0, 0.6);

  --shadow-panel: 0 8px 32px rgba(0, 0, 0, 0.4);
  --shadow-glow:  0 0 20px rgba(0, 212, 255, 0.15);
  --shadow-glow-strong: 0 0 30px rgba(0, 212, 255, 0.3);
  --shadow-btn:   0 4px 16px rgba(0, 212, 255, 0.25);
  --shadow-btn-hover: 0 6px 24px rgba(0, 212, 255, 0.4);

  /* ── Spacing ───────────────────────────────────────────────────────────── */
  --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;

  /* ── Typography ────────────────────────────────────────────────────────── */
  --font-sans:  -apple-system, BlinkMacSystemFont, 'Inter', 'Segoe UI', Roboto, sans-serif;
  --font-mono:  'JetBrains Mono', 'SF Mono', 'Fira Code', Consolas, monospace;
  --font-size-xs:   10px;
  --font-size-sm:   12px;
  --font-size-base: 14px;
  --font-size-md:   16px;
  --font-size-lg:   18px;
  --font-size-xl:   22px;
  --font-size-2xl:  28px;
  --font-size-3xl:  36px;

  /* ── Z-index Layers ────────────────────────────────────────────────────── */
  --z-canvas:     1;
  --z-overlay:    10;
  --z-panel:      20;
  --z-toolbar:    30;
  --z-gui:        40;
  --z-modal:      50;
  --z-toast:      60;

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

  /* ── Layout ────────────────────────────────────────────────────────────── */
  --toolbar-height: 52px;
  --panel-width:    280px;
  --panel-width-sm: 200px;
}