Rebase services-as-hub-ia onto mobile-responsive-parity

Combine both branches into a single coherent branch:
- Full mobile responsive parity (useIsMobile, MobileCardRow, SheetForm,
  .mobile-touch-target, mobile cards, SheetForm forms, 44px targets,
  dirty-state confirm, TablePagination, refetchIntervalInBackground).
- Full services-as-hub IA (data-driven nav, service-page tab skeleton,
  new service types, Authentik directory + messaging, named dashboards,
  legacy routes 404, Observability split, Jellyseerr absorbed).

Enhancement: service tabs now use mobile-parity primitives:
- MediaTab: MobileCardRow below md (title/size/HDR/library/year) +
  TablePagination; DataTable at md+ (desktop branch preserved).
- FilesTab: MobileCardRow below md (name/type/size/modified) +
  handleRowClick; DataTable at md+.
- ServicePage: SheetForm branch below md (open-on-mount, sticky header
  + save bar, cancel navigates back to /services, dirty-state guard).
- Dashboard: single-column + section anchors below md (from mobile-parity)
  + empty-state CTA (from services-hub).
- App.tsx: useIsMobile() replaces inline matchMedia (from mobile-parity)
  + data-driven useNavItems (from services-hub).
- Backup tables (BackupAlerts/Jobs/Runs) already have MobileCardRow from
  mobile-parity; JobsTab inherits mobile behavior through its sub-components.

Conflict resolutions:
- Backend: entirely from services-hub (mobile didn't touch it).
- Deleted pages (Media/FileBrowser/Actions/Users/UsersPage/Applications/
  ObservabilityPage/BackupsPage + hooks/useUsers + tests): kept deleted
  (services-hub deleted them; content moved into service tabs).
- New service-tabs/*: from services-hub, enhanced with mobile patterns.
- App.tsx: services-hub's data-driven nav + mobile-parity's useIsMobile.
- Dashboard.tsx: merged (services-hub CTA + mobile-parity sections/anchors).
- ServicePage.tsx: services-hub's tab skeleton + mobile-parity's SheetForm.
- Primitives (useIsMobile/mobile-card/sheet-form/etc.): from mobile-parity.

117 frontend tests pass (mobile-parity's 122 - 5 deleted page tests +
services-hub's new tab/dashboard tests); 271 backend tests pass; lint/
build green both sides.

frontend/src/pages/NamedDashboardPage.tsx

@@ -0,0 +1,91 @@
+import { useMemo } from "react";
+import { useParams } from "react-router-dom";
+import { Boxes } from "lucide-react";
+import { Alert, AlertDescription } from "@/components/ui/alert";
+import { Skeleton } from "@/components/ui/skeleton";
+import { useDashboardBySlug } from "../hooks/useDashboards";
+import { PinnedServiceLink } from "../components/PinnedServiceLink";
+
+/**
+ * Payload model for named dashboards (design choice: inline items, not widget
+ * instance ids). The payload stores an ordered list of items:
+ *
+ * ```
+ * { items: DashboardItem[] }
+ * ```
+ *
+ * Where `DashboardItem` is either a pinned service link (this slice) or a
+ * future widget reference (follow-up). Widget composition on named dashboards
+ * is deferred — the main Dashboard already has the rich widget config dialog.
+ */
+interface LinkItem {
+	type: "link";
+	label: string;
+	target: string;
+}
+
+type DashboardItem = LinkItem;
+
+function parseItems(payload: Record<string, unknown>): DashboardItem[] {
+	const items = payload.items;
+	if (!Array.isArray(items)) return [];
+	return items.filter(
+		(item): item is LinkItem =>
+			typeof item === "object" &&
+			item !== null &&
+			item.type === "link" &&
+			typeof item.label === "string" &&
+			typeof item.target === "string",
+	);
+}
+
+export function NamedDashboardPage() {
+	const { slug = "" } = useParams<{ slug: string }>();
+	const { data: dashboard, isLoading, isError } = useDashboardBySlug(slug);
+
+	const items = useMemo(
+		() => parseItems(dashboard?.payload ?? {}),
+		[dashboard?.payload],
+	);
+
+	if (isLoading) {
+		return <Skeleton className="h-32 w-full" />;
+	}
+
+	if (isError || !dashboard) {
+		return (
+			<Alert>
+				<AlertDescription>
+					Dashboard not found. It may have been deleted or the link is invalid.
+				</AlertDescription>
+			</Alert>
+		);
+	}
+
+	return (
+		<div className="flex flex-col gap-4">
+			<div>
+				<h2 className="text-xl font-semibold">{dashboard.label}</h2>
+			</div>
+			{items.length === 0 ? (
+				<Alert>
+					<AlertDescription>
+						This dashboard has no shortcuts yet. Add pinned service links from
+						the dashboard management panel on the Services page.
+					</AlertDescription>
+				</Alert>
+			) : (
+				<div className="grid grid-cols-1 gap-3 md:grid-cols-2 lg:grid-cols-3">
+					{items.map((item, index) => (
+						<PinnedServiceLink
+							key={`${item.target}-${index}`}
+							label={item.label}
+							target={item.target}
+							icon={Boxes}
+						/>
+					))}
+				</div>
+			)}
+		</div>
+	);
+}