Store chat images separately; JPEG for large PNGs; gzip/brotli responses

Images of messages (pasted images, screenshots, generated images) were base64
inside the message JSON, so opening a chat downloaded all of them at once
(66 MB for a chat with 120 screenshots). They now live in a `blobs` table,
addressed by SHA-256; messages keep a reference (blob, size). The UI loads
them from /api/blobs/<hash> lazily with an immutable cache header, the runner
fills the bytes in before model requests, JSON exports stay self-contained.

- Store::add_message moves inline images out; large opaque PNGs become JPEG
  (q85) when smaller. Older chats are converted once at start-up in the
  background, unused images are removed (also after deleting a chat) and the
  database is vacuumed when that frees 32 MB or more.
- Responses are compressed with gzip/brotli (not images, SSE streams or
  binary downloads).

Example (copy of production): chat load 66 MB -> 1.5 MB (370 KB brotli),
database 90 MB -> 27 MB.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

web/src/components/ChatView.tsx

@@ -1,6 +1,6 @@
 import { takePrefill } from "../share";
 import { Icon } from "./Icon";
-import { base64Size, FileChip, FileFigure, fileType } from "./FileFigure";
+import { FileChip, FileFigure, fileType, imageSize, imageSrc } from "./FileFigure";
 import { useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { del, get, patch, post } from "../api";
 import { useModels } from "../hooks";
@@ -471,8 +471,8 @@ export function ChatView({ sessionId, onMenu, onClosePane }: { sessionId: string
                   {imgs.length > 0 && (
                     <div className="user-files">
                       {imgs.map((p, i) => (
-                        <FileFigure key={i} name={`image-${i + 1}.${fileType(undefined, p.image.media_type).toLowerCase()}`} mime={p.image.media_type} size={base64Size(p.image.data)}>
-                          <img src={`data:${p.image.media_type};base64,${p.image.data}`} alt="" />
+                        <FileFigure key={i} name={`image-${i + 1}.${fileType(undefined, p.image.media_type).toLowerCase()}`} mime={p.image.media_type} size={imageSize(p.image)}>
+                          <img src={imageSrc(p.image)} alt="" loading="lazy" decoding="async" />
                         </FileFigure>
                       ))}
                     </div>