feat(admin): Gebruikers screen (list, create, role, password, deactivate)

apps/admin/src/styles.css

@@ -671,3 +671,74 @@ body {
 .reports-table th:not(:first-child) {
   text-align: right;
 }
+
+.users-table {
+  width: 100%;
+  border-collapse: collapse;
+  margin-top: 1rem;
+}
+.users-table th,
+.users-table td {
+  text-align: left;
+  padding: 0.5rem 0.6rem;
+  border-bottom: 1px solid var(--border, #e4e4e7);
+  vertical-align: middle;
+}
+.users-actions {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.4rem;
+}
+.users-reset {
+  display: inline-flex;
+  gap: 0.3rem;
+  align-items: center;
+}
+.pill {
+  display: inline-block;
+  padding: 0.1rem 0.5rem;
+  border-radius: 999px;
+  font-size: 0.75rem;
+  font-weight: 600;
+}
+.pill-admin {
+  background: #ede9fe;
+  color: #6d28d9;
+}
+.pill-worker {
+  background: #e0f2fe;
+  color: #0369a1;
+}
+.pill-active {
+  background: #dcfce7;
+  color: #15803d;
+}
+.pill-inactive {
+  background: #fee2e2;
+  color: #b91c1c;
+}
+.user-self-badge {
+  font-size: 0.7rem;
+  color: var(--muted, #71717a);
+  font-style: italic;
+}
+.user-form {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.75rem;
+  align-items: flex-end;
+  padding: 1rem;
+  background: var(--surface, #f4f4f5);
+  border-radius: 0.5rem;
+  margin-bottom: 1rem;
+}
+.user-form label {
+  display: flex;
+  flex-direction: column;
+  gap: 0.25rem;
+  font-size: 0.8rem;
+}
+.user-form-actions {
+  display: flex;
+  gap: 0.5rem;
+}