style: update unit category colors to match Tailwind palette

- Harmonize category colors with standard Tailwind CSS 500 shades
- Use Rose, Violet, Emerald, Amber, Blue, and Indigo for grouping related units
- Synchronize hex values in units.ts with OKLCH variables in globals.css

lib/units/units.ts

@@ -206,30 +206,30 @@ export function getCategoryColor(measure: Measure): string {
  */
 export function getCategoryColorHex(measure: Measure): string {
   const colorMap: Record<Measure, string> = {
-    angle: '#0EA5E9',
-    apparentPower: '#8B5CF6',
-    area: '#F59E0B',
-    current: '#F59E0B',
-    digital: '#06B6D4',
-    each: '#64748B',
-    energy: '#EAB308',
-    frequency: '#A855F7',
-    illuminance: '#84CC16',
-    length: '#3B82F6',
-    mass: '#10B981',
-    pace: '#14B8A6',
-    partsPer: '#EC4899',
-    power: '#F43F5E',
-    pressure: '#6366F1',
-    reactiveEnergy: '#D946EF',
-    reactivePower: '#E879F9',
-    speed: '#10B981',
-    temperature: '#EF4444',
-    tempo: '#F97316', // Orange for music/tempo
-    time: '#7C3AED',
-    voltage: '#FB923C',
-    volume: '#8B5CF6',
-    volumeFlowRate: '#22D3EE',
+    angle: '#f43f5e',          // Rose 500
+    apparentPower: '#8b5cf6',  // Violet 500
+    area: '#10b981',           // Emerald 500
+    current: '#f59e0b',        // Amber 500
+    digital: '#3b82f6',        // Blue 500
+    each: '#64748b',           // Slate 500
+    energy: '#f59e0b',         // Amber 500
+    frequency: '#8b5cf6',      // Violet 500
+    illuminance: '#eab308',    // Yellow 500
+    length: '#3b82f6',         // Blue 500
+    mass: '#10b981',           // Emerald 500
+    pace: '#14b8a6',           // Teal 500
+    partsPer: '#94a3b8',       // Slate 400
+    power: '#8b5cf6',          // Violet 500
+    pressure: '#6366f1',       // Indigo 500
+    reactiveEnergy: '#f59e0b', // Amber 500
+    reactivePower: '#8b5cf6',  // Violet 500
+    speed: '#14b8a6',          // Teal 500
+    temperature: '#ef4444',    // Red 500
+    tempo: '#f97316',          // Orange 500
+    time: '#6366f1',           // Indigo 500
+    voltage: '#f59e0b',        // Amber 500
+    volume: '#10b981',         // Emerald 500
+    volumeFlowRate: '#10b981', // Emerald 500
   };
 
   return colorMap[measure];