feat(design): glass surfaces by role, the static Badge, LinkButton, user pickers on the Combobox (E28 S3d1)

frontend/src/components/PlexCollectionEditor.tsx

@@ -11,6 +11,7 @@ import Modal from "./ui/Modal";
 import { useConfirm } from "./confirmContext";
 import { Pressable } from "./ui/Pressable";
 import { Input } from "./ui/Input";
+import { SURFACE } from "./ui/surfaces";
 
 // Admin-only "manage this movie's collections" dialog (Collections P2). Lists the library's EDITABLE
 // collections with an in/out toggle (add/remove the movie, written back to Plex), plus a field to
@@ -190,7 +191,7 @@ export default function PlexCollectionEditor({
             return (
               <div
                 key={c.id}
-                className="glass-card flex items-center gap-2 rounded-lg px-2 py-1.5 text-sm"
+                className={`${SURFACE.card} flex items-center gap-2 px-2 py-1.5 text-sm`}
               >
                 <Pressable
                   role="checkbox"
@@ -241,7 +242,7 @@ export default function PlexCollectionEditor({
             {eligible.map((c) => (
               <div
                 key={c.id}
-                className="glass-card flex items-center gap-2 rounded-lg px-2 py-1.5 text-sm"
+                className={`${SURFACE.card} flex items-center gap-2 px-2 py-1.5 text-sm`}
               >
                 <span className="min-w-0 flex-1 truncate">{c.title}</span>
                 <span className="shrink-0 text-xs text-muted">