feat: super admin promote/demote endpoint + admin panel UI

Fix require_engineer_or_admin missing "admin" account_role, add
PUT /admin/users/{id}/super-admin endpoint with audit logging,
and promote/demote button with confirmation modal on UserDetailPage.

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

frontend/src/api/admin.ts

@@ -38,6 +38,8 @@ export const adminApi = {
     api.put(`/admin/users/${id}/role`, { role }).then(r => r.data),
   updateAccountRole: (id: string, account_role: string) =>
     api.put(`/admin/users/${id}/account-role`, { account_role }).then(r => r.data),
+  updateSuperAdminStatus: (id: string, is_super_admin: boolean) =>
+    api.put(`/admin/users/${id}/super-admin`, { is_super_admin }).then(r => r.data),
   deactivateUser: (id: string) =>
     api.put(`/admin/users/${id}/deactivate`).then(r => r.data),
   activateUser: (id: string) =>

frontend/src/pages/admin/UserDetailPage.tsx

@@ -32,6 +32,9 @@ export function UserDetailPage() {
   const [resetTempPassword, setResetTempPassword] = useState<string | null>(null)
   const [resetCopied, setResetCopied] = useState(false)
 
+  // Super admin
+  const [superAdminModalOpen, setSuperAdminModalOpen] = useState(false)
+
   // Hard delete
   const [hardDeleteModalOpen, setHardDeleteModalOpen] = useState(false)
   const [hardDeleteChecking, setHardDeleteChecking] = useState(false)
@@ -119,6 +122,18 @@ export function UserDetailPage() {
     setTimeout(() => setResetCopied(false), 2000)
   }
 
+  const handleToggleSuperAdmin = async () => {
+    if (!userId || !user) return
+    try {
+      await adminApi.updateSuperAdminStatus(userId, !user.is_super_admin)
+      toast.success(user.is_super_admin ? 'Super admin access removed' : 'Promoted to super admin')
+      setSuperAdminModalOpen(false)
+      fetchUser()
+    } catch {
+      toast.error('Failed to update super admin status')
+    }
+  }
+
   const handleArchive = async () => {
     if (!userId) return
     try {
@@ -317,6 +332,18 @@ export function UserDetailPage() {
                 </button>
               </>
             )}
+            <button
+              onClick={() => setSuperAdminModalOpen(true)}
+              className={cn(
+                'flex w-full items-center gap-3 rounded-lg border px-4 py-3 text-left text-sm',
+                user.is_super_admin
+                  ? 'border-yellow-500/20 text-yellow-400 hover:bg-yellow-500/5'
+                  : 'border-purple-500/20 text-purple-400 hover:bg-purple-500/5'
+              )}
+            >
+              <Crown className="h-4 w-4" />
+              {user.is_super_admin ? 'Remove Super Admin' : 'Promote to Super Admin'}
+            </button>
             <button
               onClick={() => {
                 setResetMode('email_link')
@@ -665,6 +692,47 @@ export function UserDetailPage() {
         </div>
       </Modal>
 
+      {/* Super Admin Modal */}
+      <Modal
+        isOpen={superAdminModalOpen}
+        onClose={() => setSuperAdminModalOpen(false)}
+        title={user.is_super_admin ? 'Remove Super Admin Access' : 'Promote to Super Admin'}
+        size="sm"
+        footer={
+          <div className="flex justify-end gap-3">
+            <button
+              onClick={() => setSuperAdminModalOpen(false)}
+              className="rounded-md border border-border px-4 py-2 text-sm font-medium text-muted-foreground hover:bg-accent"
+            >
+              Cancel
+            </button>
+            <button
+              onClick={handleToggleSuperAdmin}
+              className={cn(
+                'rounded-md px-4 py-2 text-sm font-medium text-white',
+                user.is_super_admin
+                  ? 'bg-yellow-600 hover:bg-yellow-700'
+                  : 'bg-gradient-brand shadow-lg shadow-primary/20 hover:opacity-90'
+              )}
+            >
+              {user.is_super_admin ? 'Remove Access' : 'Promote'}
+            </button>
+          </div>
+        }
+      >
+        <div className="space-y-3">
+          {user.is_super_admin ? (
+            <div className="rounded-xl border border-yellow-400/20 bg-yellow-400/10 p-3 text-sm text-yellow-400">
+              This will remove system-wide admin access from <strong>{user.full_name || user.email}</strong>. They will revert to their account role permissions.
+            </div>
+          ) : (
+            <div className="rounded-xl border border-purple-400/20 bg-purple-400/10 p-3 text-sm text-purple-400">
+              This will grant <strong>{user.full_name || user.email}</strong> full system-wide admin access, including access to the admin panel and all accounts.
+            </div>
+          )}
+        </div>
+      </Modal>
+
       {/* Hard Delete Modal */}
       <Modal
         isOpen={hardDeleteModalOpen}