fix(t5): Rechte-Matrix nach Containerbreite, „Nicht geprüft“ passt, Glas-Knopf gedrückt

Browser-Prüfung A7:
- Die Rechte-Matrix im 384-px-Dialog nahm drei Spalten nach der
  Fensterbreite und schnitt Labels ab; jetzt Container-Queries.
- Dreifach-Auswahl: drei Spalten nur, wo „Nicht geprüft“ hineinpasst,
  sonst rutscht die dritte Option in die nächste Zeile.
- Gedrückter Glas-Knopf („Aufbau als Liste“) mit 2-px-Rahmen in
  holo-edge-strong statt nur Füllung.

Co-Authored-By: Claude Opus 5.5 (1M context) <[email protected]>

ApiCore-Frontend/src/app/(app)/settings/users-roles/permission-matrix.tsx

@@ -74,7 +74,9 @@ export function PermissionMatrix({
   }
 
   return (
-    <div className="flex flex-col gap-4 rounded-xl border border-border/60 p-3">
+    // Container queries: the matrix sits in a 384 px dialog on a wide screen,
+    // so the columns follow its own width, not the viewport.
+    <div className="@container flex flex-col gap-4 rounded-xl border border-border/60 p-3">
       {disabled ? (
         <p id={hintId} className="text-sm font-medium text-muted-foreground">
           {disabledHint}
@@ -102,7 +104,7 @@ export function PermissionMatrix({
               describedBy={describedBy}
               onCheckedChange={(checked) => toggleGroup(group.entries, checked)}
             />
-            <div className="grid grid-cols-1 gap-x-4 gap-y-1 pl-8 sm:grid-cols-2 lg:grid-cols-3">
+            <div className="grid grid-cols-1 gap-x-4 gap-y-1 pl-8 @lg:grid-cols-2 @3xl:grid-cols-3">
               {group.entries.map((entry) => (
                 <CheckboxField
                   key={entry.key}