fix: resolve hydration errors in playground

- Fix nested button error in color history by using div with role=button
- Add keyboard accessibility (Enter/Space) to color history swatches
- Add type guard for ColorInfo.name to handle object values
- Add aria-label to remove button for better accessibility

Fixes React hydration errors and improves accessibility.

components/color/ColorInfo.tsx

@@ -80,7 +80,7 @@ export function ColorInfo({ info, className }: ColorInfoProps) {
           <div className="text-xs text-muted-foreground">Type</div>
           <div className="text-sm font-medium">{info.is_light ? 'Light' : 'Dark'}</div>
         </div>
-        {info.name && (
+        {info.name && typeof info.name === 'string' && (
           <div className="space-y-1">
             <div className="text-xs text-muted-foreground">Named</div>
             <div className="text-sm font-medium">{info.name}</div>