feat: ST-601-ST-612 M6 polish, beveiliging en launch-ready

- ST-601/602: loading skeletons en error boundary
- ST-603: Sonner toasts op alle CRUD-operaties
- ST-604: DemoTooltip op uitgeschakelde knoppen
- ST-605: KeyboardSensor dnd-kit, Escape sluit modals
- ST-606: min-width banner < 1024px
- ST-607: WCAG AA aria-labels en skip link
- ST-608: rate limiting login (10/min) en registratie (5/uur)
- ST-609: security integratietests cross-user toegang (7 tests)
- ST-610: GitHub Actions CI/CD workflow
- ST-611: README met quickstart, deployment en API-docs
- ST-612: Lars-flow acceptatiechecklist
- fix: settings toont gebruikersnaam i.p.v. interne id
- fix: seed idempotent, testdata altijd gekoppeld aan demo-gebruiker

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

app/(app)/settings/page.tsx

@@ -8,9 +8,10 @@ import Link from 'next/link'
 export default async function SettingsPage() {
   const session = await getIronSession<SessionData>(await cookies(), sessionOptions)
 
-  const userRoles = await prisma.userRole.findMany({
-    where: { user_id: session.userId },
-  })
+  const [user, userRoles] = await Promise.all([
+    prisma.user.findUnique({ where: { id: session.userId }, select: { username: true } }),
+    prisma.userRole.findMany({ where: { user_id: session.userId } }),
+  ])
   const currentRoles = userRoles.map(r => r.role as string)
 
   return (
@@ -20,7 +21,7 @@ export default async function SettingsPage() {
       <div className="bg-surface-container-low border border-border rounded-xl p-5 space-y-3">
         <h2 className="text-sm font-medium text-foreground">Account</h2>
         <p className="text-sm text-muted-foreground">
-          Ingelogd als <span className="text-foreground font-medium">{session.userId}</span>
+          Ingelogd als <span className="text-foreground font-medium">{user?.username ?? session.userId}</span>
           {session.isDemo && <span className="ml-2 text-warning text-xs">(demo)</span>}
         </p>
       </div>