/* Design Tokens - Detective Noir Theme */

:root {
  /* Color Palette - Noir Workbench with Brass Rim-light */
  --color-surface-0: #05070C;
  --color-surface-1: #0A0D12;
  --color-surface-2: #0F1218;
  --color-surface-3: #161921;
  --color-surface-4: #1C1E26;
  
  --color-brass-primary: #D4A574;
  --color-brass-dim: #B8935A;
  --color-steel: #6B7A8F;
  --color-steel-dim: #4A5261;
  
  --color-text-primary: #E8E9EB;
  --color-text-secondary: #A8ACB5;
  --color-text-dim: #6B7180;
  
  /* Typography */
  --font-display: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', sans-serif;
  --font-body: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', sans-serif;
  
  /* Fluid Type Scale */
  --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
  --text-sm: clamp(0.875rem, 0.825rem + 0.25vw, 1rem);
  --text-base: clamp(0.9375rem, 0.875rem + 0.3125vw, 1.125rem);
  --text-lg: clamp(1.125rem, 1rem + 0.625vw, 1.5rem);
  --text-xl: clamp(1.5rem, 1.25rem + 1.25vw, 2.25rem);
  --text-2xl: clamp(2rem, 1.5rem + 2.5vw, 3.5rem);
  --text-3xl: clamp(2.5rem, 1.75rem + 3.75vw, 4.5rem);
  
  /* Spacing Scale */
  --space-xs: clamp(0.5rem, 0.45rem + 0.25vw, 0.625rem);
  --space-sm: clamp(0.75rem, 0.65rem + 0.5vw, 1rem);
  --space-md: clamp(1rem, 0.85rem + 0.75vw, 1.5rem);
  --space-lg: clamp(1.5rem, 1.15rem + 1.75vw, 2.5rem);
  --space-xl: clamp(2rem, 1.5rem + 2.5vw, 3.5rem);
  --space-2xl: clamp(3rem, 2rem + 5vw, 6rem);
  
  /* Border Radius */
  --radius-sm: 3px;
  --radius-md: 6px;
  --radius-lg: 12px;
  --radius-pill: 999px;
  --radius-circle: 50%;
  
  /* Shadows - Noir depth */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.5);
  --shadow-md: 0 4px 8px rgba(0, 0, 0, 0.6);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.7);
  --shadow-brass-glow: 0 0 16px rgba(212, 165, 116, 0.3);
  
  /* Layout */
  --container-max: 1200px;
  --header-height-mobile: 56px;
  --header-height-desktop: 72px;
  
  /* Transitions */
  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-base: 250ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 400ms cubic-bezier(0.4, 0, 0.2, 1);
}