diff --git a/packages/app-store/routing-forms/components/RoutingNavBar.tsx b/packages/app-store/routing-forms/components/RoutingNavBar.tsx
index 5bc0e1b61a..af333e0335 100644
--- a/packages/app-store/routing-forms/components/RoutingNavBar.tsx
+++ b/packages/app-store/routing-forms/components/RoutingNavBar.tsx
@@ -21,6 +21,7 @@ export default function RoutingNavBar({
     },
     {
       name: "Reporting",
+      target: "_blank",
       href: `${appUrl}/reporting/${form?.id}`,
       className: "pointer-events-none opacity-30 lg:pointer-events-auto lg:opacity-100",
     },
diff --git a/packages/app-store/routing-forms/pages/reporting/[...appPages].tsx b/packages/app-store/routing-forms/pages/reporting/[...appPages].tsx
index a312f8908e..1c2f9e0940 100644
--- a/packages/app-store/routing-forms/pages/reporting/[...appPages].tsx
+++ b/packages/app-store/routing-forms/pages/reporting/[...appPages].tsx
@@ -166,18 +166,16 @@ const Reporter = ({ form }: { form: inferSSRProps<typeof getServerSideProps>["fo
     []
   );
   return (
-    <div className="flex flex-col-reverse md:flex-row">
-      <div className="cal-query-builder bg-default w-full ltr:mr-2 rtl:ml-2">
-        <Query
-          {...config}
-          value={query.state.tree}
-          onChange={(immutableTree, config) => {
-            onChange(immutableTree, config as QueryBuilderUpdatedConfig);
-          }}
-          renderBuilder={renderBuilder}
-        />
-        <Result formId={form.id} jsonLogicQuery={jsonLogicQuery as JsonLogicQuery} />
-      </div>
+    <div className="cal-query-builder bg-default fixed inset-0 w-full overflow-scroll pt-12 ltr:mr-2 rtl:ml-2 sm:pt-0">
+      <Query
+        {...config}
+        value={query.state.tree}
+        onChange={(immutableTree, config) => {
+          onChange(immutableTree, config as QueryBuilderUpdatedConfig);
+        }}
+        renderBuilder={renderBuilder}
+      />
+      <Result formId={form.id} jsonLogicQuery={jsonLogicQuery as JsonLogicQuery} />
     </div>
   );
 };
diff --git a/packages/app-store/routing-forms/playwright/tests/basic.e2e.ts b/packages/app-store/routing-forms/playwright/tests/basic.e2e.ts
index 24933bbc57..c122649020 100644
--- a/packages/app-store/routing-forms/playwright/tests/basic.e2e.ts
+++ b/packages/app-store/routing-forms/playwright/tests/basic.e2e.ts
@@ -261,6 +261,7 @@ test.describe("Routing Forms", () => {
         ["custom-page", ""],
       ]);
 
+      await page.goto(`apps/routing-forms/route-builder/${routingForm.id}`);
       const [download] = await Promise.all([
         // Start waiting for the download
         page.waitForEvent("download"),
@@ -399,6 +400,7 @@ async function fillSeededForm(page: Page, routingFormId: string) {
   await gotoRoutingLink({ page, formId: routingFormId });
   await page.fill('[data-testid="form-field-Test field"]', "event-routing");
   page.click('button[type="submit"]');
+
   await page.waitForURL((url) => {
     return url.pathname.endsWith("/pro/30min");
   });
diff --git a/packages/ui/components/navigation/tabs/HorizontalTabItem.tsx b/packages/ui/components/navigation/tabs/HorizontalTabItem.tsx
index 18f8754c21..2cfe7170a1 100644
--- a/packages/ui/components/navigation/tabs/HorizontalTabItem.tsx
+++ b/packages/ui/components/navigation/tabs/HorizontalTabItem.tsx
@@ -12,6 +12,7 @@ export type HorizontalTabItemProps = {
   name: string;
   disabled?: boolean;
   className?: string;
+  target?: string;
   href: string;
   linkShallow?: boolean;
   linkScroll?: boolean;
@@ -43,6 +44,7 @@ const HorizontalTabItem = function ({
         props.disabled && "pointer-events-none !opacity-30",
         props.className
       )}
+      target={props.target ? props.target : undefined}
       data-testid={`horizontal-tab-${name}`}
       aria-current={isCurrent ? "page" : undefined}>
       {props.icon && (