fix: prevent grid right-edge overflow by gating Responsive on containerWidth

Gate <Responsive> rendering on containerWidth > 0 so it only mounts after
ResizeObserver has measured the container. Use availableWidth directly as
the width prop (no window.innerWidth fallback) since the component now only
renders when containerWidth is known. This prevents the grid from rendering
wider than its container (which caused the rightmost column to overflow the
right edge).

https://claude.ai/code/session_01H1sqbcFmtwwsdNTJcJHJWd

web/src/views/live/DraggableGridLayout.tsx

@@ -710,9 +710,9 @@ export default function DraggableGridLayout({
             currentGroups={groups}
             activeGroup={group}
           />
-          <Responsive
+          {containerWidth > 0 && <Responsive
             className="grid-layout"
-            width={availableWidth || window.innerWidth}
+            width={availableWidth}
             layouts={{
               lg: currentGridLayout,
               md: currentGridLayout,
@@ -887,7 +887,7 @@ export default function DraggableGridLayout({
                 </GridLiveContextMenu>
               );
             })}
-          </Responsive>
+          </Responsive>}
           {isDesktop && (
             <div
               className={cn(