docs: promote /web from develop for backup-restore, Log2RAM and Network Flow guides

Brings 69 files from develop under /web/:
- Full Backup & Restore section (11 pages EN + ES: overview, how-it-works, destinations,
  creating backups, scheduled jobs, restoring, cross-kernel hydration)
- Log2RAM dedicated block in post-install/optional with commands + upstream link
- Network Flow diagram documented on monitor/dashboard/network
- Rewritten category descriptions in post-install/customizable
- Fixed automated.json thresholds + link to Log2RAM section
- Updated screenshots (network-flow-overview, storage-top-row, vms modals)

No code, config or AppImage binaries touched — /web/ scope only. Merging deploys
the documentation site to the current beta release notes.

web/app/[locale]/docs/monitor/dashboard/system-overview/page.tsx

@@ -31,6 +31,7 @@ export default async function SystemOverviewTabPage({
   const messages = (await getMessages({ locale })) as unknown as {
     docs: { monitor: { dashboard: { systemOverview: {
       topRow: { rows: TopRow[]; thresholdsItems: string[] }
+      processes: { listItems: string[]; detailItems: string[] }
       bottom: { storageItems: string[] }
       refresh: { items: string[] }
       dataCollected: { rows: DataRow[] }
@@ -40,6 +41,8 @@ export default async function SystemOverviewTabPage({
   const so = messages.docs.monitor.dashboard.systemOverview
   const topRows = so.topRow.rows
   const thresholdsItems = so.topRow.thresholdsItems
+  const processListItems = so.processes.listItems
+  const processDetailItems = so.processes.detailItems
   const storageItems = so.bottom.storageItems
   const refreshItems = so.refresh.items
   const dataRows = so.dataCollected.rows
@@ -135,6 +138,53 @@ export default async function SystemOverviewTabPage({
         {t("topRow.sparklineBody")}
       </Callout>
 
+      <h2 className="text-2xl font-semibold mt-10 mb-4 text-gray-900">{t("processes.heading")}</h2>
+      <p className="mb-4 text-gray-800 leading-relaxed">
+        {t.rich("processes.intro", { code })}
+      </p>
+
+      <h3 className="text-lg font-semibold mt-6 mb-2 text-gray-900">{t("processes.listTitle")}</h3>
+      <ul className="list-disc pl-6 mb-4 text-gray-800 leading-relaxed space-y-1">
+        {processListItems.map((_, idx) => (
+          <li key={idx}>{t.rich(`processes.listItems.${idx}`, { strong })}</li>
+        ))}
+      </ul>
+
+      <figure className="my-6">
+        <img
+          src="/monitor/system-overview-top-processes.png"
+          alt={t("processes.captureListAlt")}
+          className="rounded-lg border border-gray-200 shadow-sm w-full"
+        />
+        <figcaption className="text-sm text-gray-500 mt-2 text-center italic">
+          {t("processes.captureListCaption")}
+        </figcaption>
+      </figure>
+
+      <h3 className="text-lg font-semibold mt-6 mb-2 text-gray-900">{t("processes.detailTitle")}</h3>
+      <p className="mb-4 text-gray-800 leading-relaxed">
+        {t.rich("processes.detailIntro", { code })}
+      </p>
+      <ul className="list-disc pl-6 mb-4 text-gray-800 leading-relaxed space-y-1">
+        {processDetailItems.map((_, idx) => (
+          <li key={idx}>{t.rich(`processes.detailItems.${idx}`, { strong, code })}</li>
+        ))}
+      </ul>
+      <p className="mb-4 text-gray-800 leading-relaxed">
+        {t.rich("processes.detailRefresh", { em, code })}
+      </p>
+
+      <figure className="my-6">
+        <img
+          src="/monitor/system-overview-process-detail.png"
+          alt={t("processes.captureDetailAlt")}
+          className="rounded-lg border border-gray-200 shadow-sm w-full"
+        />
+        <figcaption className="text-sm text-gray-500 mt-2 text-center italic">
+          {t("processes.captureDetailCaption")}
+        </figcaption>
+      </figure>
+
       <h2 className="text-2xl font-semibold mt-10 mb-4 text-gray-900">{t("middle.heading")}</h2>
       <p className="mb-4 text-gray-800 leading-relaxed">
         {t.rich("middle.body1", { code, em })}