diff --git a/ui/index.css b/ui/index.css
index 4c3ec99f..a84da795 100644
--- a/ui/index.css
+++ b/ui/index.css
@@ -213,6 +213,9 @@
   .ps {
     @import "tailwindcss/preflight.css";
   }
+  body {
+    @apply bg-black!;
+  }
 }
 
 [data-radix-popper-content-wrapper] {
diff --git a/ui/studio/Studio.tsx b/ui/studio/Studio.tsx
index 6f7e2fe3..236c5c69 100644
--- a/ui/studio/Studio.tsx
+++ b/ui/studio/Studio.tsx
@@ -165,25 +165,27 @@ function StudioContent() {
               )}
             </AnimatePresence>
 
-            <motion.div
-              className="flex h-full min-h-0 min-w-0 flex-1 flex-col self-stretch overflow-hidden rounded-lg bg-secondary p-px"
-              data-testid="studio-main-pane"
-              transition={{ duration: 0.14 }}
-            >
-              {shouldShowStartupIntrospectionRecovery ? (
-                <StartupIntrospectionRecoveryView
-                  errorState={errorState}
-                  isRetrying={isRefetching}
-                  onRetry={() => void refetch()}
-                />
-              ) : shouldShowDatabaseUnavailableView ? (
-                <DatabaseUnavailableView
-                  hasStreamsServer={typeof streamsUrl === "string"}
-                />
-              ) : (
-                <View />
-              )}
-            </motion.div>
+            <div className="p-3 flex h-full min-h-0 min-w-0 flex-1 flex-col self-stretch overflow-hidden rounded-xl text-card-foreground">
+              <motion.div
+                className="flex h-full flex-col self-stretch overflow-hidden border border-table-border rounded-xl"
+                data-testid="studio-main-pane"
+                transition={{ duration: 0.14 }}
+              >
+                {shouldShowStartupIntrospectionRecovery ? (
+                  <StartupIntrospectionRecoveryView
+                    errorState={errorState}
+                    isRetrying={isRefetching}
+                    onRetry={() => void refetch()}
+                  />
+                ) : shouldShowDatabaseUnavailableView ? (
+                  <DatabaseUnavailableView
+                    hasStreamsServer={typeof streamsUrl === "string"}
+                  />
+                ) : (
+                  <View />
+                )}
+              </motion.div>
+            </div>
           </div>
         </div>
       </StudioCommandPaletteProvider>
diff --git a/ui/studio/grid/DataGridPagination.tsx b/ui/studio/grid/DataGridPagination.tsx
index d302b1ba..4b017a6d 100644
--- a/ui/studio/grid/DataGridPagination.tsx
+++ b/ui/studio/grid/DataGridPagination.tsx
@@ -121,8 +121,8 @@ export function DataGridPagination(props: DataGridPaginationProps) {
   }
 
   return (
-    <div className="rounded-b-lg overflow-visible sticky bottom-0 left-0 border-t-0 w-full z-20 p-0">
-      <div className="flex items-center justify-between gap-2 py-3 px-2 border-t border-table-border backdrop-blur-sm bg-background/90">
+    <div className="rounded-b-xl overflow-visible sticky bottom-0 left-0 border-t-0 w-full z-20 p-0">
+      <div className="rounded-b-xl flex items-center justify-between gap-2 py-3 px-2 border-t border-table-border backdrop-blur-sm bg-background/90">
         {variant === "basic" ? (
           <div className="flex items-center gap-2">
             <Button
diff --git a/ui/studio/views/stream/StreamView.tsx b/ui/studio/views/stream/StreamView.tsx
index 134d10b4..54e22df3 100644
--- a/ui/studio/views/stream/StreamView.tsx
+++ b/ui/studio/views/stream/StreamView.tsx
@@ -1849,7 +1849,7 @@ function ActiveStreamView(props: {
           </div>
 
           <div
-            className="border-t border-table-border bg-background/90 px-2 py-3 backdrop-blur-sm"
+            className="border-t rounded-b-xl border-table-border bg-background/90 px-2 py-3 backdrop-blur-sm"
             data-testid="stream-footer"
           >
             <div className="flex flex-wrap items-center justify-start gap-2">