can add scenarios and it mostly works

src/pages/_app.tsx

@@ -3,6 +3,7 @@ import { SessionProvider } from "next-auth/react";
 import { type AppType } from "next/app";
 import { api } from "~/utils/api";
 import { ChakraProvider } from "@chakra-ui/react";
+import theme from "~/utils/theme";
 
 const MyApp: AppType<{ session: Session | null }> = ({
   Component,
@@ -10,7 +11,7 @@ const MyApp: AppType<{ session: Session | null }> = ({
 }) => {
   return (
     <SessionProvider session={session}>
-      <ChakraProvider>
+      <ChakraProvider theme={theme}>
         <Component {...pageProps} />
       </ChakraProvider>
     </SessionProvider>

src/pages/experiments/[id].tsx

@@ -24,7 +24,7 @@ export default function Experiment() {
 
   return (
     <AppNav title={experiment.data?.label}>
-      <Box sx={{ minHeight: "100vh" }}>
+      <Box minH="100vh" mb={50}>
         <OutputsTable experimentId={router.query.id as string | undefined} />
       </Box>
     </AppNav>