perf: add content-visibility: auto to long list items

Apply content-visibility: auto to off-screen list and sidebar items
to skip browser layout and painting until they scroll into view.

Changes:
- globals.css: add .list-item-lazy (48px) and .sidebar-item-lazy (40px) utilities
- DocumentsTableShell: apply list-item-lazy to desktop <tr> rows and mobile card divs
- AllPrivateChatsSidebar: apply sidebar-item-lazy to thread items
- AllSharedChatsSidebar: apply sidebar-item-lazy to thread items
- InboxSidebar: apply content-visibility inline (80px intrinsic height) to inbox items

Implements Vercel React Best Practices Rule: rendering-content-visibility (6.2)

surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsTableShell.tsx

@@ -630,7 +630,7 @@ export function DocumentsTableShell({
 									return (
 										<tr
 											key={doc.id}
-											className={`group border-b border-border/50 transition-colors ${
+											className={`list-item-lazy group border-b border-border/50 transition-colors ${
 												isMentioned ? "bg-primary/5 hover:bg-primary/8" : "hover:bg-muted/30"
 											} ${canInteract && hasChatMode ? "cursor-pointer" : ""}`}
 											onClick={handleRowClick}
@@ -871,7 +871,7 @@ export function DocumentsTableShell({
 						return (
 							<MobileCardWrapper key={doc.id} onLongPress={() => setMobileActionDoc(doc)}>
 								<div
-									className={`relative px-3 py-2 transition-colors ${
+									className={`list-item-lazy relative px-3 py-2 transition-colors ${
 										isMentioned ? "bg-primary/5" : "hover:bg-muted/20"
 									} ${canInteract && hasChatMode ? "cursor-pointer" : ""}`}
 								>

surfsense_web/app/globals.css

@@ -246,6 +246,17 @@ button {
 	}
 }
 
+/* content-visibility utilities — skip layout/paint for off-screen list items */
+.list-item-lazy {
+	content-visibility: auto;
+	contain-intrinsic-size: 0 48px;
+}
+
+.sidebar-item-lazy {
+	content-visibility: auto;
+	contain-intrinsic-size: 0 40px;
+}
+
 @source "../node_modules/@llamaindex/chat-ui/**/*.{ts,tsx}";
 @source "../node_modules/streamdown/dist/*.js";
 @source "../node_modules/@streamdown/code/dist/*.js";

surfsense_web/components/layout/ui/sidebar/AllPrivateChatsSidebar.tsx

@@ -349,7 +349,7 @@ export function AllPrivateChatsSidebarContent({
 								<div
 									key={thread.id}
 									className={cn(
-										"group flex items-center gap-2 rounded-md px-2 py-1.5 text-sm",
+										"sidebar-item-lazy group flex items-center gap-2 rounded-md px-2 py-1.5 text-sm",
 										"hover:bg-accent hover:text-accent-foreground",
 										"transition-colors cursor-pointer",
 										isActive && "bg-accent text-accent-foreground",

surfsense_web/components/layout/ui/sidebar/AllSharedChatsSidebar.tsx

@@ -349,7 +349,7 @@ export function AllSharedChatsSidebarContent({
 								<div
 									key={thread.id}
 									className={cn(
-										"group flex items-center gap-2 rounded-md px-2 py-1.5 text-sm",
+										"sidebar-item-lazy group flex items-center gap-2 rounded-md px-2 py-1.5 text-sm",
 										"hover:bg-accent hover:text-accent-foreground",
 										"transition-colors cursor-pointer",
 										isActive && "bg-accent text-accent-foreground",

surfsense_web/components/layout/ui/sidebar/InboxSidebar.tsx

@@ -919,6 +919,7 @@ export function InboxSidebarContent({
 										"transition-colors cursor-pointer",
 										isMarkingAsRead && "opacity-50 pointer-events-none"
 									)}
+									style={{ contentVisibility: "auto", containIntrinsicSize: "0 80px" }}
 								>
 									{isMobile ? (
 										<button