diff --git a/js/web/src/components/dashboard/widget-leaf.tsx b/js/web/src/components/dashboard/widget-leaf.tsx
index 6a449f60a..34395a497 100644
--- a/js/web/src/components/dashboard/widget-leaf.tsx
+++ b/js/web/src/components/dashboard/widget-leaf.tsx
@@ -143,7 +143,7 @@ export function WidgetLeaf({
                 className="fixed inset-0 z-40"
                 onClick={() => setDropdownOpen(false)}
               />
-              <div className="absolute top-full left-0 z-50 mt-1 min-w-[160px] overflow-hidden rounded-md border border-(--color-border) bg-(--color-bg-elevated) shadow-md">
+              <div className="absolute top-full left-0 z-50 mt-1 min-w-40 overflow-hidden rounded-md border border-(--color-border) bg-(--color-bg-elevated) shadow-md">
                 {WIDGET_KEYS.filter((k) => k !== "blank").map((key) => {
                   const wMeta = getWidgetMeta(key);
                   if (!wMeta) return null;
diff --git a/js/web/src/components/stream/chat-panel.tsx b/js/web/src/components/stream/chat-panel.tsx
index af606c1b3..33626eaa6 100644
--- a/js/web/src/components/stream/chat-panel.tsx
+++ b/js/web/src/components/stream/chat-panel.tsx
@@ -129,7 +129,7 @@ export function ChatPanel({
             <ArrowDown className="h-4 w-4" />
           )}
           {newMessageCount > 0 && (
-            <span className="absolute -top-1 -right-1 flex h-4 min-w-[16px] items-center justify-center rounded-full bg-(--color-accent) px-1 text-[10px] font-medium text-white">
+            <span className="absolute -top-1 -right-1 flex h-4 min-w-4 items-center justify-center rounded-full bg-(--color-accent) px-1 text-[10px] font-medium text-white">
               {newMessageCount}
             </span>
           )}
@@ -215,7 +215,7 @@ function ChatMessage({
       </div>
 
       {message.replyTo && (
-        <div className="pl-[60px]">
+        <div className="pl-15">
           <ReplyBanner parent={message.replyTo} authors={authors} />
         </div>
       )}
diff --git a/js/web/src/routes/$user/index.tsx b/js/web/src/routes/$user/index.tsx
index 94a4945a8..5786f1046 100644
--- a/js/web/src/routes/$user/index.tsx
+++ b/js/web/src/routes/$user/index.tsx
@@ -137,7 +137,7 @@ function StreamBody({ store, user }: { store: LivestreamStore; user: string }) {
   return (
     <div className="flex h-full flex-col gap-3">
       <div
-        className={`z-0 flex min-h-0 flex-1 gap-4 transition-[margin] duration-300 ease-in-out ${chatOpen ? "mr-[360px]" : "mr-0"}`}
+        className={`z-0 flex min-h-0 flex-1 gap-4 transition-[margin] duration-300 ease-in-out ${chatOpen ? "mr-90" : "mr-0"}`}
       >
         <div className="min-w-0 flex-1 overflow-y-auto">
           <VideoSection store={store} user={user} liveness={liveness} />
@@ -154,7 +154,7 @@ function StreamBody({ store, user }: { store: LivestreamStore; user: string }) {
       </div>
 
       <div
-        className={`fixed ${theatre ? "top-0" : "top-12"} right-0 bottom-0 z-20 flex w-[360px] max-w-90 flex-col overflow-hidden transition-transform duration-300 ease-in-out ${
+        className={`fixed ${theatre ? "top-0" : "top-12"} right-0 bottom-0 z-20 flex w-90 max-w-90 flex-col overflow-hidden transition-transform duration-300 ease-in-out ${
           chatOpen ? "translate-x-0" : "translate-x-full"
         }`}
       >