Spike: Investigate class-variance-authority (cva) for improved component style management

## Context
Currently, we manage component styles using string concatenation and twMerge. While functional, this approach could be improved for better maintainability and type safety.

https://www.reddit.com/r/tailwindcss/comments/16ub0mb/do_you_use_class_variance_authority_cva/

## Investigation Goals
- Evaluate class-variance-authority (cva) for managing component variants
- Compare current approach vs cva approach
- Assess TypeScript integration and type safety benefits
- Consider migration strategy and effort required

## Tasks
- [ ] Set up proof of concept with cva in a new branch
- [ ] Refactor one existing component (ButtonBase) to use cva
- [ ] Document pros and cons compared to current approach
- [ ] Create example showing type safety benefits
- [ ] Estimate effort for wider adoption
- [ ] Document findings and make recommendation

## Example Implementation
```typescript
import { cva } from 'class-variance-authority'

const buttonStyles = cva(
// Base styles
'inline-flex items-center justify-center rounded-full px-4 text-default font-medium transition-colors duration-150',
{
variants: {
intent: {
primary: 'bg-primary-default text-primary-inverse hover:bg-primary-hover',
secondary: 'bg-muted hover:bg-muted-hover active:bg-muted-pressed',
},
size: {
sm: 'h-8',
md: 'h-10',
lg: 'h-12',
},
isFullWidth: {
true: 'w-full',
}
},
defaultVariants: {
intent: 'secondary',
size: 'md',
}
}
)
```

## Benefits to Explore
- Type-safe variants
- Improved maintainability
- Better IDE support
- Simplified testing
- Consistent variant patterns across components

## Resources
- [cva Documentation](https://cva.style/docs)
- [Example Implementation](https://github.com/joe-bell/cva)
- [Tailwind CSS Best Practices](https://tailwindcss.com/docs/reusing-styles)

## Definition of Done
- POC implementation completed
- Findings documented
- Recommendation made for adoption strategy
- Example code provided