fix(frontend): percent-encode fileUrl key segments

fileUrl interpolated the raw storage key into the path, so a key segment
containing a reserved character (`?`, `#`, `%`, space) could be
reinterpreted as a query/fragment delimiter. Encode each `/`-separated
segment with encodeURIComponent, keeping slashes as literal path
separators. Keys are backend-generated today, so this is defence-in-depth.

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

frontend/src/lib/api/client.ts

@@ -7,9 +7,16 @@ const BASE = import.meta.env?.VITE_API_BASE ?? '/api';
  * Builds an absolute URL to the streaming `/files/{key}` endpoint so
  * components can use it directly in `<img src>` etc., without
  * reconstructing the API base in each call site.
+ *
+ * Storage keys are `/`-separated paths, so each segment is percent-encoded
+ * individually — the slashes stay literal path separators while any
+ * reserved character inside a segment (`?`, `#`, `%`, space, …) can't be
+ * reinterpreted as a query/fragment delimiter. Keys are backend-generated
+ * today, so this is defence-in-depth against a future key source.
  */
 export function fileUrl(key: string): string {
-    return `${BASE}/v1/files/${key}`;
+    const encoded = key.split('/').map(encodeURIComponent).join('/');
+    return `${BASE}/v1/files/${encoded}`;
 }
 
 /**