feat(web): admin backoffice — meshes, sessions, invites, audit, overview

Four new admin routes backed by the mesh API modules:

- /admin/meshes — paginated data-table (name, owner, tier, transport,
  members, created). Tier + transport multiSelect filters.
- /admin/meshes/[id] — detail page: owner row + 4 live sections
  (members, presences, invites, last 50 audit events).
- /admin/sessions — live Claude Code WS presences. Status filter,
  pulse dot for working sessions, disconnected badge.
- /admin/invites — invite tokens w/ status derived client-side
  (active/revoked/expired/exhausted).
- /admin/audit — metadata-only event log, event-type + mesh + date
  filters.

Overview page at /admin rewritten to 6 summary cards (users, orgs,
customers, meshes, sessions, messages 24h) joining the base
/admin/summary and /admin/summary/mesh endpoints.

Sidebar navigation gains a second "mesh" group with the four new entries.
paths.ts extended with admin.meshes / sessions / invites / audit.

All UI reuses @turbostarter/ui-web/data-table — columns.tsx + thin
*-data-table.tsx wrapper per the existing users pattern.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

apps/web/src/modules/admin/invites/data-table/columns.tsx

@@ -0,0 +1,123 @@
+import { Badge } from "@turbostarter/ui-web/badge";
+import { DataTableColumnHeader } from "@turbostarter/ui-web/data-table/data-table-column-header";
+
+import { TurboLink } from "~/modules/common/turbo-link";
+
+import type { ColumnDef } from "@tanstack/react-table";
+import type { GetInvitesResponse } from "@turbostarter/api/schema";
+
+type Invite = GetInvitesResponse["data"][number];
+
+export const useInviteColumns = (): ColumnDef<Invite>[] => [
+  {
+    id: "q",
+    accessorKey: "q",
+    meta: { placeholder: "Search by mesh or token…", variant: "text" },
+    enableHiding: false,
+    enableColumnFilter: true,
+  },
+  {
+    id: "mesh",
+    header: ({ column }) => (
+      <DataTableColumnHeader column={column} title="Mesh" />
+    ),
+    cell: ({ row }) =>
+      row.original.meshId ? (
+        <TurboLink
+          href={`/admin/meshes/${row.original.meshId}`}
+          className="group flex flex-col gap-0.5"
+        >
+          <span className="group-hover:text-primary text-sm font-medium underline underline-offset-4">
+            {row.original.meshName ?? "—"}
+          </span>
+          <span className="text-muted-foreground font-mono text-xs">
+            {row.original.meshSlug ?? "—"}
+          </span>
+        </TurboLink>
+      ) : (
+        <span className="text-muted-foreground">—</span>
+      ),
+    meta: { label: "Mesh" },
+    enableHiding: false,
+  },
+  {
+    id: "token",
+    accessorKey: "token",
+    header: ({ column }) => (
+      <DataTableColumnHeader column={column} title="Token" />
+    ),
+    cell: ({ row }) => (
+      <code className="bg-muted text-muted-foreground rounded px-2 py-0.5 text-xs">
+        {row.original.token.slice(0, 12)}…
+      </code>
+    ),
+    meta: { label: "Token" },
+  },
+  {
+    id: "role",
+    accessorKey: "role",
+    header: ({ column }) => (
+      <DataTableColumnHeader column={column} title="Role" />
+    ),
+    cell: ({ row }) => (
+      <Badge variant="outline">{row.original.role}</Badge>
+    ),
+    meta: { label: "Role" },
+  },
+  {
+    id: "uses",
+    header: ({ column }) => (
+      <DataTableColumnHeader column={column} title="Uses" />
+    ),
+    cell: ({ row }) => (
+      <span className="font-mono text-sm">
+        {row.original.usedCount} / {row.original.maxUses}
+      </span>
+    ),
+    meta: { label: "Uses" },
+  },
+  {
+    id: "expiresAt",
+    accessorKey: "expiresAt",
+    header: ({ column }) => (
+      <DataTableColumnHeader column={column} title="Expires" />
+    ),
+    cell: ({ row }) => {
+      const expired = new Date(row.original.expiresAt) < new Date();
+      return (
+        <span
+          className={
+            "text-sm " + (expired ? "text-destructive" : "text-muted-foreground")
+          }
+        >
+          {new Date(row.original.expiresAt).toLocaleDateString()}
+          {expired && " (expired)"}
+        </span>
+      );
+    },
+    meta: { label: "Expires" },
+  },
+  {
+    id: "status",
+    header: ({ column }) => (
+      <DataTableColumnHeader column={column} title="Status" />
+    ),
+    cell: ({ row }) => {
+      if (row.original.revokedAt) {
+        return (
+          <Badge className="bg-destructive/15 text-destructive">revoked</Badge>
+        );
+      }
+      if (new Date(row.original.expiresAt) < new Date()) {
+        return <Badge variant="outline">expired</Badge>;
+      }
+      if (row.original.usedCount >= row.original.maxUses) {
+        return <Badge variant="outline">exhausted</Badge>;
+      }
+      return (
+        <Badge className="bg-success/15 text-success">active</Badge>
+      );
+    },
+    meta: { label: "Status" },
+  },
+];