diff --git a/assets/svelte/components/ui/card/expandable-card-header.svelte b/assets/svelte/components/ui/card/expandable-card-header.svelte
new file mode 100644
index 000000000..d9e80cdf2
--- /dev/null
+++ b/assets/svelte/components/ui/card/expandable-card-header.svelte
@@ -0,0 +1,35 @@
+<script lang="ts">
+  import { CardHeader, CardTitle } from ".";
+  import { ChevronDown } from "lucide-svelte";
+  import { Button as ButtonPrimitive } from "bits-ui";
+
+  export let expanded: boolean = false;
+  export let disabled: boolean = false;
+  export let builders: $$Props["builders"] = [];
+
+  function handleClick() {
+    if (disabled) return;
+    expanded = !expanded;
+  }
+</script>
+
+<CardHeader class="flex flex-row items-center justify-between">
+  <ButtonPrimitive.Root
+    class="flex flex-row items-center justify-between w-full cursor-pointer"
+    on:click={handleClick}
+    type="button"
+    {builders}
+    {disabled}
+  >
+    <CardTitle class="flex items-center gap-2">
+      <slot />
+    </CardTitle>
+    <div
+      class="transition-transform duration-200"
+      class:rotate-180={expanded}
+      class:text-gray-300={disabled}
+    >
+      <ChevronDown class="h-4 w-4" />
+    </div>
+  </ButtonPrimitive.Root>
+</CardHeader>
diff --git a/assets/svelte/components/ui/card/expandable-card.svelte b/assets/svelte/components/ui/card/expandable-card.svelte
index 022aeb4b6..5a02dff55 100644
--- a/assets/svelte/components/ui/card/expandable-card.svelte
+++ b/assets/svelte/components/ui/card/expandable-card.svelte
@@ -1,40 +1,40 @@
 <script lang="ts">
-  import { Card, CardContent, CardHeader, CardTitle } from ".";
-  import { ChevronDown } from "lucide-svelte";
+  import { Card, CardContent } from ".";
+  import * as Tooltip from "$lib/components/ui/tooltip";
+  import { Info } from "lucide-svelte";
+  import ExpandableCardHeader from "./expandable-card-header.svelte";
 
   export let expanded: boolean = false;
   export let disabled: boolean = false;
-
-  function handleClick() {
-    if (disabled) return;
-    expanded = !expanded;
-  }
+  export let titleTooltip: string | null = null;
 </script>
 
 <Card>
-  <CardHeader class="flex flex-row items-center justify-between">
-    <button
-      type="button"
-      class="flex flex-row items-center justify-between w-full"
-      on:click={handleClick}
-      {disabled}
+  {#if titleTooltip}
+    <Tooltip.Root
+      openDelay={10}
+      class="flex flex-row items-center justify-between"
     >
-      <CardTitle class="flex items-center gap-2">
-        <slot name="title" />
-      </CardTitle>
-      <div
-        class="transition-transform duration-200"
-        class:rotate-180={expanded}
-        class:text-gray-300={disabled}
-      >
-        <ChevronDown class="h-4 w-4" />
-      </div>
-    </button>
-  </CardHeader>
+      <Tooltip.Trigger asChild let:builder>
+        <ExpandableCardHeader builders={[builder]} bind:expanded {disabled}>
+          <slot name="title" />
+        </ExpandableCardHeader>
+      </Tooltip.Trigger>
+      <Tooltip.Content class="max-w-xs space-y-2">
+        <p class="text-xs text-gray-500">
+          {titleTooltip}
+        </p>
+      </Tooltip.Content>
+    </Tooltip.Root>
+  {:else}
+    <ExpandableCardHeader bind:expanded {disabled}>
+      <slot name="title" />
+    </ExpandableCardHeader>
+  {/if}
 
   <CardContent>
     <div class="space-y-2">
-      {#if disabled || !expanded}
+      {#if !expanded}
         <slot name="summary" />
       {:else}
         <slot name="content" />
diff --git a/assets/svelte/consumers/GroupColumnsForm.svelte b/assets/svelte/consumers/GroupColumnsForm.svelte
index 151f55270..a390fc4de 100644
--- a/assets/svelte/consumers/GroupColumnsForm.svelte
+++ b/assets/svelte/consumers/GroupColumnsForm.svelte
@@ -17,7 +17,6 @@
   let defaultGroupColumns = selectedTable?.default_group_columns || [];
   let groupColumnError: string | null = null;
   let useCustomGrouping = false;
-  let isExpanded = false;
 
   $: groupColumnError = errors.sequence_filter?.group_column_attnums?.[0];
   $: defaultGroupColumns = selectedTable?.default_group_columns || [];
@@ -60,18 +59,22 @@
         .join(", ")}`
     : selectedTable?.is_event_table
       ? "Using source_database_id, source_table_oid, and record_pk for grouping, which is the default"
-      : "Using primary keys for grouping, which is the default";
+      : defaultGroupColumns.length === 0
+        ? "No primary keys available. Custom grouping is required."
+        : "Using primary keys for grouping, which is the default";
 </script>
 
 <!-- Edit Mode Card -->
 {#if isEditMode}
-  <Card>
-    <CardHeader>
-      <div class="flex items-center justify-between">
-        <CardTitle>Message grouping</CardTitle>
-      </div>
-    </CardHeader>
-    <CardContent>
+  <ExpandableCard
+    disabled={true}
+    titleTooltip="Message grouping can’t be changed for an active sink."
+  >
+    <svelte:fragment slot="title">
+      <CardTitle>Message grouping</CardTitle>
+    </svelte:fragment>
+
+    <svelte:fragment slot="summary">
       {#if !useCustomGrouping && !selectedTable.is_event_table}
         <p class="text-sm text-muted-foreground">
           Using primary keys for grouping.
@@ -83,16 +86,26 @@
           readonly={true}
         />
       {/if}
-    </CardContent>
-  </Card>
+    </svelte:fragment>
+  </ExpandableCard>
 
   <!-- Create Mode - No PKs Available -->
 {:else if selectedTable && defaultGroupColumns.length === 0}
-  <Card>
-    <CardHeader>
+  <ExpandableCard
+    expanded={!isEditMode}
+    disabled={defaultGroupColumns.length === 0}
+  >
+    <svelte:fragment slot="title">
       <CardTitle>Message grouping</CardTitle>
-    </CardHeader>
-    <CardContent>
+    </svelte:fragment>
+
+    <svelte:fragment slot="summary">
+      <p class="text-sm text-muted-foreground">
+        {summaryText}
+      </p>
+    </svelte:fragment>
+
+    <svelte:fragment slot="content">
       <p class="text-sm text-info mb-4">
         No primary keys available. Custom grouping is required.
       </p>
@@ -104,16 +117,14 @@
       {#if groupColumnError}
         <p class="text-destructive text-sm mt-2">{groupColumnError}</p>
       {/if}
-    </CardContent>
-  </Card>
+    </svelte:fragment>
+  </ExpandableCard>
 
   <!-- Create Mode - Normal -->
 {:else}
-  <ExpandableCard disabled={!selectedTable} expanded={!isEditMode}>
+  <ExpandableCard disabled={!selectedTable}>
     <svelte:fragment slot="title">
-      <div class="flex items-center justify-between">
-        <CardTitle>Message grouping</CardTitle>
-      </div>
+      <CardTitle>Message grouping</CardTitle>
     </svelte:fragment>
 
     <svelte:fragment slot="summary">
diff --git a/assets/svelte/consumers/SinkConsumerForm.svelte b/assets/svelte/consumers/SinkConsumerForm.svelte
index 73dd7461a..a418fccb8 100644
--- a/assets/svelte/consumers/SinkConsumerForm.svelte
+++ b/assets/svelte/consumers/SinkConsumerForm.svelte
@@ -354,15 +354,19 @@
     });
   }
 
-  let backfillSectionExpanded = false;
   let showMessageTypeExampleModal = false;
   let selectedExampleType: "change" | "record" = "change";
 
   let transformSectionEnabled = false;
+  let transformSectionExpanded = false;
   let backfillSectionEnabled = false;
+  let backfillSectionExpanded = false;
   $: {
     transformSectionEnabled = selectedTable && consumer.type !== "redis_stream";
+    transformSectionExpanded = transformSectionEnabled && !isEditMode;
+
     backfillSectionEnabled = selectedTable && !isEditMode;
+    backfillSectionExpanded = backfillSectionEnabled && !isEditMode;
   }
 
   let transformRefreshState: "idle" | "refreshing" | "done" = "idle";
@@ -521,7 +525,10 @@
       </CardContent>
     </Card>
 
-    <ExpandableCard disabled={!transformSectionEnabled} expanded={!isEditMode}>
+    <ExpandableCard
+      disabled={!transformSectionEnabled}
+      expanded={transformSectionExpanded}
+    >
       <svelte:fragment slot="title">
         Transforms
         <Tooltip.Root openDelay={200}>
@@ -582,7 +589,10 @@
     </ExpandableCard>
 
     {#if !isEditMode}
-      <ExpandableCard disabled={!backfillSectionEnabled} expanded={!isEditMode}>
+      <ExpandableCard
+        disabled={!backfillSectionEnabled}
+        expanded={!isEditMode && backfillSectionEnabled}
+      >
         <svelte:fragment slot="title">
           Initial backfill