fix: use Tailwind class for bar fill (--primary is hex, not HSL)

components/units/VisualComparison.tsx

@@ -199,13 +199,10 @@ export default function VisualComparison({ conversions, onValueChange }: VisualC
             >
               <div
                 className={cn(
-                  'absolute inset-y-0 left-0 rounded-sm',
+                  'absolute inset-y-0 left-0 rounded-sm bg-primary/65',
                   draggingUnit ? 'transition-none' : 'transition-all duration-500 ease-out'
                 )}
-                style={{
-                  width: `${displayPercentage}%`,
-                  background: 'linear-gradient(to right, hsl(var(--primary) / 0.35), hsl(var(--primary) / 0.75))',
-                }}
+                style={{ width: `${displayPercentage}%` }}
               />
               {isDraggable && !isDragging && (
                 <div className="absolute inset-0 flex items-center justify-end px-2 opacity-0 hover:opacity-100 transition-opacity">