feat(admin): add RoleBadge component and integrate it in user management views

- add new RoleBadge shared component for consistent role display
- export RoleBadge from shared components index
- replace inline Badge usage with RoleBadge in UsersPage role column
- use RoleBadge via renderTag prop in UserEditModal role TagInput
- simplify TagInput Pill to a generic unstyled pill, removing color logic

src/features/admin/pages/UsersPage.client.js

@@ -2,7 +2,7 @@
 
 import { registerPage } from '../registry.js';
 import { useState, useEffect } from 'react';
-import { Card, Table, Badge, StatusBadge, Button, UserAvatar, RelativeDate } from '@zen/core/shared/components';
+import { Card, Table, Badge, StatusBadge, Button, UserAvatar, RelativeDate, RoleBadge } from '@zen/core/shared/components';
 import { PencilEdit01Icon } from '@zen/core/shared/icons';
 import { useToast } from '@zen/core/toast';
 import AdminHeader from '../components/AdminHeader.js';
@@ -54,9 +54,7 @@ const UsersPageClient = ({ currentUserId }) => {
                 return (
                     <div className="flex flex-wrap gap-1">
                         {visible.map(role => (
-                            <Badge key={role.id} color={role.color || undefined}>
-                                {role.name}
-                            </Badge>
+                            <RoleBadge key={role.id} name={role.name} color={role.color} />
                         ))}
                         {overflow > 0 && <Badge>+{overflow}</Badge>}
                         {roles.length === 0 && <span className="text-xs text-neutral-400">—</span>}