fix(web): clearer topology/identity copy, capped description width, mobile More-nav, preset spacing

Console polish on the Virtual displays card + shell:
- Topology help now leads with the streamed display's role (Extend/Primary/Exclusive) instead of
  the confusing physical-monitor-only framing; notes the headless case. Identity help spells out the
  actual behavior (stable per-client identity → the desktop reapplies that client's scaling/resolution
  on reconnect) + what Shared / Per-client / Per-client+resolution each do.
- Cap description/help width at max-w-prose so long help text isn't a full-viewport line on large screens.
- Mobile bottom nav: 8 flat tabs were too cramped → 4 pinned tabs + a "More" tab whose sheet holds the
  rest (Performance/Logs/Pairing/Settings), "More" highlighted when the active route is in the overflow.
- More breathing room under the "Preset" heading.

web tsc + biome + vite build green.

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

web/src/sections/Displays/DisplayCard.tsx

@@ -67,7 +67,7 @@ export const DisplaySection: FC = () => {
 					<CardTitle>{m.display_config_title()}</CardTitle>
 				</CardHeader>
 				<CardContent className="space-y-4">
-					<p className="text-sm text-muted-foreground">{m.host_displays_help()}</p>
+					<p className="max-w-prose text-sm text-muted-foreground">{m.host_displays_help()}</p>
 					<QueryState isLoading={q.isLoading} error={q.error} refetch={q.refetch}>
 						{q.data && draft && (
 							<DisplayForm
@@ -154,8 +154,8 @@ const DisplayForm: FC<{
 	return (
 		<div className="space-y-6">
 			{/* One-click presets — a 2-up grid so each has room to breathe */}
-			<div className="space-y-3">
-				<Label className="text-base font-semibold">{m.display_preset()}</Label>
+			<div className="space-y-4">
+				<Label className="mb-1 block text-base font-semibold">{m.display_preset()}</Label>
 				<div className="grid gap-3 sm:grid-cols-2">
 					{PRESET_ORDER.map((id) => {
 						const p = presets.find((x) => x.id === id);
@@ -341,7 +341,7 @@ const DisplayForm: FC<{
 				<Badge variant="outline">{`${effective.max_displays}×`}</Badge>
 			</div>
 
-			<p className="text-xs text-muted-foreground">{m.display_pending_note()}</p>
+			<p className="max-w-prose text-xs text-muted-foreground">{m.display_pending_note()}</p>
 			{error && <p className="text-sm text-amber-600 dark:text-amber-500">{error}</p>}
 		</div>
 	);
@@ -357,7 +357,7 @@ const Field: FC<{ label: string; help?: string; children: ReactNode }> = ({
 	<div className="space-y-3">
 		<Label className="block">{label}</Label>
 		{children}
-		{help && <p className="text-xs text-muted-foreground">{help}</p>}
+		{help && <p className="max-w-prose text-xs text-muted-foreground">{help}</p>}
 	</div>
 );