diff --git a/js/web/src/routes/dashboard/multistream/index.tsx b/js/web/src/routes/dashboard/multistream/index.tsx
index 12029a78..8db3251d 100644
--- a/js/web/src/routes/dashboard/multistream/index.tsx
+++ b/js/web/src/routes/dashboard/multistream/index.tsx
@@ -1,3 +1,4 @@
+import { place } from "streamplace";
 import { Button } from "@/components/ui/button";
 import {
   Dialog,
@@ -70,10 +71,10 @@ function MultistreamManager() {
     if (!agent) return;
     try {
       setLoading(true);
-      const res = await agent.place.stream.multistream.listTargets({
+      const res = await agent.client.call(place.stream.multistream.listTargets, {
         limit: 50,
       });
-      setTargets(res.data.targets as unknown as MultistreamTarget[]);
+      setTargets(res.targets as unknown as MultistreamTarget[]);
     } catch (error: any) {
       console.error("Failed to load multistream targets:", error);
       toast.error(error.message || "Failed to load targets");
@@ -105,24 +106,24 @@ function MultistreamManager() {
       setFormError("");
 
       if (editingTarget) {
-        await agent.place.stream.multistream.putTarget({
+        await agent.client.call(place.stream.multistream.putTarget, {
           multistreamTarget: {
             $type: "place.stream.multistream.target" as const,
             name: data.name || undefined,
-            url: data.url,
+            url: data.url as any,
             active: data.active,
-            createdAt: editingTarget.record.createdAt,
+            createdAt: editingTarget.record.createdAt as any,
           },
           rkey: editingTarget.uri.split("/").pop() || "",
         });
       } else {
-        await agent.place.stream.multistream.createTarget({
+        await agent.client.call(place.stream.multistream.createTarget, {
           multistreamTarget: {
             $type: "place.stream.multistream.target" as const,
             name: data.name || undefined,
-            url: data.url,
+            url: data.url as any,
             active: data.active,
-            createdAt: new Date().toISOString(),
+            createdAt: new Date().toISOString() as any,
           },
         });
       }
@@ -144,9 +145,9 @@ function MultistreamManager() {
     if (!agent) return;
     try {
       setTogglingUris((prev) => new Set(prev).add(target.uri));
-      await agent.place.stream.multistream.putTarget({
+      await agent.client.call(place.stream.multistream.putTarget, {
         multistreamTarget: {
-          ...target.record,
+          ...target.record as any,
           $type: "place.stream.multistream.target" as const,
           active: newActive,
         },
@@ -168,7 +169,7 @@ function MultistreamManager() {
     if (!agent || !deleteTarget) return;
     try {
       setDeletingUris((prev) => new Set(prev).add(deleteTarget.uri));
-      await agent.place.stream.multistream.deleteTarget({
+      await agent.client.call(place.stream.multistream.deleteTarget, {
         rkey: deleteTarget.uri.split("/").pop() || "",
       });
       setDeleteTarget(null);
@@ -204,7 +205,7 @@ function MultistreamManager() {
   };
 
   return (
-    <div className="space-y-6">
+    <div className="mx-auto w-full max-w-2xl space-y-6 py-4">
       <div>
         <h1 className="font-display text-xl font-semibold">
           {t("multistream-targets")}
diff --git a/js/web/src/routes/dashboard/recommendations/index.tsx b/js/web/src/routes/dashboard/recommendations/index.tsx
index b96edc67..60aad7bf 100644
--- a/js/web/src/routes/dashboard/recommendations/index.tsx
+++ b/js/web/src/routes/dashboard/recommendations/index.tsx
@@ -1,3 +1,4 @@
+import { place } from "streamplace";
 import { Button } from "@/components/ui/button";
 import { CardMenuSection } from "@/components/ui/card";
 import {
@@ -245,12 +246,12 @@ function RecommendationsManager() {
       }
       try {
         setSearching(true);
-        const response = await agent.place.stream.live.searchActorsTypeahead({
+        const response = await agent.client.call(place.stream.live.searchActorsTypeahead, {
           q: query,
           limit: 10,
         });
         setSearchResults(
-          response.data.actors.map((a: any) => ({
+          response.actors.map((a: any) => ({
             did: a.did,
             handle: a.handle,
           })),
@@ -355,7 +356,7 @@ function RecommendationsManager() {
   }
 
   return (
-    <div className="space-y-4">
+    <div className="mx-auto w-full max-w-2xl space-y-4 pt-4">
       <div className="flex items-center justify-between">
         <div>
           <h1 className="font-display text-xl font-semibold">
diff --git a/js/web/src/routes/dashboard/stream/index.tsx b/js/web/src/routes/dashboard/stream/index.tsx
index 82c6b5fd..10eb029b 100644
--- a/js/web/src/routes/dashboard/stream/index.tsx
+++ b/js/web/src/routes/dashboard/stream/index.tsx
@@ -331,7 +331,7 @@ function MetadataSection() {
   const currentYear = useMemo(() => new Date().getFullYear(), []);
 
   return (
-    <div className="space-y-6">
+    <div className="mx-auto w-full max-w-2xl space-y-6 py-4">
       <h2 className="font-display text-lg font-semibold">
         {t("metadata", { defaultValue: "Metadata" })}
       </h2>
diff --git a/js/web/src/routes/dashboard/webhooks/index.tsx b/js/web/src/routes/dashboard/webhooks/index.tsx
index 0a3b964b..b661a0e1 100644
--- a/js/web/src/routes/dashboard/webhooks/index.tsx
+++ b/js/web/src/routes/dashboard/webhooks/index.tsx
@@ -1,3 +1,4 @@
+import { place } from "streamplace";
 import { Button } from "@/components/ui/button";
 import { CardMenuSection } from "@/components/ui/card";
 import {
@@ -81,10 +82,10 @@ function WebhookManager() {
     if (!agent) return;
     try {
       setLoading(true);
-      const response = await agent.place.stream.server.listWebhooks({
+      const response = await agent.client.call(place.stream.server.listWebhooks, {
         limit: 50,
       });
-      const hooks = (response.data.webhooks as Webhook[] | undefined) ?? [];
+      const hooks = (response.webhooks as Webhook[] | undefined) ?? [];
       setWebhooks(hooks);
     } catch (error: any) {
       console.error("Failed to load webhooks:", error);
@@ -128,12 +129,12 @@ function WebhookManager() {
       };
 
       if (editingWebhook) {
-        await agent.place.stream.server.updateWebhook({
+        await agent.client.call(place.stream.server.updateWebhook, {
           id: editingWebhook.id,
           ...payload,
-        });
+        } as any);
       } else {
-        await agent.place.stream.server.createWebhook(payload);
+        await agent.client.call(place.stream.server.createWebhook, payload as any);
       }
 
       setShowForm(false);
@@ -151,7 +152,7 @@ function WebhookManager() {
     if (!agent || !deleteTarget) return;
     try {
       setDeletingIds((prev) => new Set(prev).add(deleteTarget.id));
-      await agent.place.stream.server.deleteWebhook({ id: deleteTarget.id });
+      await agent.client.call(place.stream.server.deleteWebhook, { id: deleteTarget.id });
       setDeleteTarget(null);
       await loadWebhooks();
     } catch (error: any) {
@@ -167,7 +168,7 @@ function WebhookManager() {
   };
 
   return (
-    <div className="space-y-6">
+    <div className="mx-auto w-full max-w-2xl space-y-6 py-4">
       <div>
         <h1 className="font-display text-xl font-semibold">
           {t("webhook-integrations")}