diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/(suggestions)/empty.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/(suggestions)/empty.svelte
index e02979d30..6072015d1 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/(suggestions)/empty.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/(suggestions)/empty.svelte
@@ -1012,6 +1012,38 @@
     });
 </script>
 
+<!--{#snippet countdownProgress()}-->
+<!--    {@const COUNTDOWN_DURATION = 10000}-->
+
+<!--    <div class="countdown-wrapper" style="padding-bottom: 0;">-->
+<!--        <svg-->
+<!--            xmlns="http://www.w3.org/2000/svg"-->
+<!--            width={`var(&#45;&#45;icon-size-s)`}-->
+<!--            height={`var(&#45;&#45;icon-size-s)`}-->
+<!--            viewBox="0 0 24 24"-->
+<!--            fill="none"-->
+<!--            style="transform: rotate(-90deg)">-->
+<!--            &lt;!&ndash; Background circle &ndash;&gt;-->
+<!--            <path-->
+<!--                opacity="0.2"-->
+<!--                d="M24 12C24 18.6274 18.6274 24 12 24C5.37258 24 0 18.6274 0 12C0 5.37258 5.37258 0 12 0C18.6274 0 24 5.37258 24 12ZM2.4 12C2.4 17.3019 6.69807 21.6 12 21.6C17.3019 21.6 21.6 17.3019 21.6 12C21.6 6.69807 17.3019 2.4 12 2.4C6.69807 2.4 2.4 6.69807 2.4 12Z"-->
+<!--                fill="#56565C" />-->
+<!--            &lt;!&ndash; Progress circle &ndash;&gt;-->
+<!--            <circle-->
+<!--                cx="12"-->
+<!--                cy="12"-->
+<!--                r="10.8"-->
+<!--                fill="none"-->
+<!--                stroke="#56565C"-->
+<!--                stroke-width="2.4"-->
+<!--                stroke-dasharray="67.858"-->
+<!--                stroke-dashoffset="0"-->
+<!--                class="countdown-circle"-->
+<!--                style="animation-duration: {COUNTDOWN_DURATION}ms" />-->
+<!--        </svg>-->
+<!--    </div>-->
+<!--{/snippet}-->
+
 <svelte:window on:resize={recalcAll} on:scroll={recalcAll} on:click={handleGlobalClick} />
 
 <div
@@ -1272,22 +1304,28 @@
             <div class="floating-action-wrapper expanded" class:selection={hasSelection}>
                 <FloatingActionBar>
                     <svelte:fragment slot="start">
-                        <Typography.Caption
-                            variant="400"
-                            color="--fgcolor-neutral-primary"
-                            style="white-space: nowrap;">
+                        <Layout.Stack
+                            gap="xs"
+                            direction="row"
+                            alignItems="center"
+                            style="padding-bottom: 0;">
                             <Badge
                                 size="xs"
                                 variant="secondary"
                                 content={columnName}
                                 type={isUndoDeleteMode ? 'error' : undefined} />
 
-                            {#if isUndoDeleteMode}
-                                was deleted. You can undo this action.
-                            {:else}
-                                column selected
-                            {/if}
-                        </Typography.Caption>
+                            <Typography.Caption
+                                variant="400"
+                                color="--fgcolor-neutral-primary"
+                                style="white-space: nowrap;">
+                                {#if isUndoDeleteMode}
+                                    was deleted. You can undo this action.
+                                {:else}
+                                    column selected
+                                {/if}
+                            </Typography.Caption>
+                        </Layout.Stack>
                     </svelte:fragment>
 
                     <svelte:fragment slot="end">
@@ -1299,6 +1337,9 @@
                                     on:click={() => (selectedColumnId = null)}>
                                     Cancel
                                 </Button.Button>
+
+                                <!--{:else}-->
+                                <!--    {@render countdownProgress()}-->
                             {/if}
                             <Button.Button
                                 size="xs"
@@ -1433,7 +1474,9 @@
         position: fixed;
         overflow: visible;
         scrollbar-width: none;
+
         --columns-range-pink-border-color: rgba(253, 54, 110, 0.24);
+        --columns-range-pink-header-background-color: rgba(253, 54, 110, 0.12);
 
         &.custom-columns {
             width: unset;
@@ -1444,17 +1487,34 @@
         }
 
         &:has(.columns-range-overlay) {
-            &
-                :global(
+            :global(
+                [role='rowheader']
                     [role='cell']:has(.column-resizer-disabled):not([data-column-id^='$']):not(
-                            [data-column-id='actions']
-                        )
-                ) {
+                        [data-column-id='actions']
+                    )
+            ) {
+                background: var(--columns-range-pink-header-background-color);
+            }
+
+            :global(
+                [role='rowheader']
+                    span:has([data-column-id='$id'])
+                    + span
+                    [role='cell']:has(.column-resizer-disabled)
+            ) {
+                margin-left: -2px;
+            }
+
+            :global(
+                [role='cell']:has(.column-resizer-disabled):not([data-column-id^='$']):not(
+                        [data-column-id='actions']
+                    )
+            ) {
                 box-shadow: 0 -1px 0 0 var(--columns-range-pink-border-color) inset !important;
                 transition: box-shadow 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
             }
 
-            & :global([role='cell']:not([data-column-id='actions']) .column-resizer-disabled) {
+            :global([role='cell']:not([data-column-id='actions']) .column-resizer-disabled) {
                 border-left: var(--border-width-s, 1px) solid var(--columns-range-pink-border-color) !important;
                 transition: border-color 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
             }
@@ -1560,6 +1620,8 @@
 
             & :global(div:first-of-type) {
                 z-index: 22;
+                bottom: 24px;
+                height: 44px;
                 left: calc(65% - 480px / 2);
                 transition: all 600ms cubic-bezier(0.4, 0, 0.2, 1);
 
@@ -1587,13 +1649,9 @@
                 }
             }
 
-            &.expanded.has-selection :global(div:first-of-type) {
-                height: 44px;
-            }
-
             &.selection :global(div:first-of-type) {
                 z-index: 21;
-                bottom: 80px; /* oddly specific maybe, but diff as per design */
+                bottom: 56px; /* oddly specific maybe, but diff as per design */
                 height: fit-content;
                 padding-bottom: 10px;
                 border-bottom: unset;
@@ -1665,6 +1723,7 @@
             180deg,
             rgba(29, 29, 33, 0) 0%,
             rgba(29, 29, 33, 0.86) 85%,
+            // token - bgcolor-neutral-primary
             /* show more of the bottom area */ #1d1d21 100%
         );
     }
@@ -1687,6 +1746,7 @@
     }
 
     :global(.theme-dark) .spreadsheet-container-outer {
+        --columns-range-pink-header-background-color: unset;
         --columns-range-pink-border-color: rgba(253, 54, 110, 0.12) !important;
     }
 
@@ -1748,4 +1808,30 @@
         transform: translateY(0);
         transition-delay: var(--animation-delay, 0ms);
     }
+
+    /* Countdown progress styles */
+    //.countdown-wrapper {
+    //    display: flex;
+    //    width: var(--icon-size-s);
+    //    height: var(--icon-size-s);
+    //}
+    //
+    //:global(.countdown-circle) {
+    //    animation: countdown-progress linear forwards;
+    //}
+    //
+    //@media (prefers-reduced-motion: reduce) {
+    //    :global(.countdown-circle) {
+    //        animation: none;
+    //    }
+    //}
+    //
+    //@keyframes countdown-progress {
+    //    from {
+    //        stroke-dashoffset: 0;
+    //    }
+    //    to {
+    //        stroke-dashoffset: 67.858;
+    //    }
+    //}
 </style>
diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/(suggestions)/input.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/(suggestions)/input.svelte
index f389a56c6..70dec2963 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/(suggestions)/input.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/(suggestions)/input.svelte
@@ -70,7 +70,7 @@
 
         <!-- just being safe with extra guard! -->
         {#if $tableColumnSuggestions.enabled && featureActive}
-            <div transition:slide={{ duration: 200 }}>
+            <div class="context-input" transition:slide={{ duration: 200 }}>
                 <InputTextarea
                     id="context"
                     rows={3}
@@ -86,4 +86,8 @@
     .suggestions-switch :global(button):not(:disabled) {
         cursor: pointer;
     }
+
+    .context-input :global(.input) {
+        background: var(--bgcolor-neutral-primary);
+    }
 </style>
diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/+page.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/+page.svelte
index 63089d7f3..29446deae 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/+page.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/+page.svelte
@@ -245,7 +245,7 @@
 
                         <EmptySheetCards
                             icon={IconViewBoards}
-                            title="Generate random data"
+                            title="Generate sample data"
                             subtitle="Generate data for testing"
                             onClick={() => {
                                 $randomDataModalState.show = true;
@@ -272,14 +272,6 @@
                 {/snippet}
 
                 {#snippet actions()}
-                    <EmptySheetCards
-                        icon={IconPlus}
-                        title="Create column"
-                        subtitle="Create columns manually"
-                        onClick={() => {
-                            $showCreateColumnSheet.show = true;
-                        }} />
-
                     {#if isCloud}
                         <!-- shown on cloud -->
                         <EmptySheetCards
@@ -291,9 +283,17 @@
                             }} />
                     {/if}
 
+                    <EmptySheetCards
+                        icon={IconPlus}
+                        title="Create column"
+                        subtitle="Create columns manually"
+                        onClick={() => {
+                            $showCreateColumnSheet.show = true;
+                        }} />
+
                     <EmptySheetCards
                         icon={IconViewBoards}
-                        title="Generate random data"
+                        title="Generate sample data"
                         subtitle="Generate data for testing"
                         onClick={() => {
                             $randomDataModalState.show = true;
diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/createColumn.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/createColumn.svelte
index 97f06e128..039b0a854 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/createColumn.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/createColumn.svelte
@@ -39,6 +39,8 @@
     const tableId = page.params.table;
     const databaseId = page.params.database;
 
+    let showSuggestionsAlert = $state(true);
+
     let key: string = $state(column?.key ?? null);
     let data: Partial<Columns> = $state({
         required: column?.required ?? false,
@@ -184,9 +186,9 @@
 </script>
 
 <Layout.Stack gap="xl">
-    {#if isCloud}
+    {#if isCloud && showSuggestionsAlert}
         <div class="custom-inline-alert">
-            <Alert.Inline>
+            <Alert.Inline dismissible on:dismiss={() => (showSuggestionsAlert = false)}>
                 <svelte:fragment slot="icon">
                     <IconAINotification />
                 </svelte:fragment>
@@ -233,7 +235,10 @@
 <style lang="scss">
     .custom-inline-alert {
         & :global(article) {
+            border-radius: var(--border-radius-medium);
             padding: var(--space-4, 8px);
+            // bgcolor: bgcolor neutral primary
+            border: var(--border-width-s) solid var(--border-neutral);
         }
 
         & :global(div:first-child > :nth-child(2)) {
diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/indexes/+page.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/indexes/+page.svelte
index 11a89554e..12d664be0 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/indexes/+page.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/indexes/+page.svelte
@@ -353,14 +353,6 @@
             {/snippet}
 
             {#snippet actions()}
-                <EmptySheetCards
-                    icon={IconPlus}
-                    title="Create column"
-                    subtitle="Create columns manually"
-                    onClick={() => {
-                        $showCreateColumnSheet.show = true;
-                    }} />
-
                 {#if isCloud}
                     <EmptySheetCards
                         icon={IconAI}
@@ -369,7 +361,23 @@
                         onClick={() => {
                             $showColumnsSuggestionsModal = true;
                         }} />
+
+                    <EmptySheetCards
+                        icon={IconPlus}
+                        title="Create column"
+                        subtitle="Create columns manually"
+                        onClick={() => {
+                            $showCreateColumnSheet.show = true;
+                        }} />
                 {:else}
+                    <EmptySheetCards
+                        icon={IconPlus}
+                        title="Create column"
+                        subtitle="Create columns manually"
+                        onClick={() => {
+                            $showCreateColumnSheet.show = true;
+                        }} />
+
                     <EmptySheetCards
                         icon={IconBookOpen}
                         title="Documentation"
diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/layout/emptySheet.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/layout/emptySheet.svelte
index bba48ed0c..3c7a7acfa 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/layout/emptySheet.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/layout/emptySheet.svelte
@@ -335,7 +335,7 @@
                     alignItems="center"
                     alignContent="center"
                     style="width: 653px; max-width: {$isSmallViewport ? '353px' : undefined}">
-                    <Layout.Stack gap="l" alignItems="center" alignContent="center">
+                    <Layout.Stack gap="xs" alignItems="center" alignContent="center">
                         <Typography.Title>{title ?? `You have no ${mode} yet`}</Typography.Title>
 
                         {@render subtitle?.()}
@@ -343,15 +343,17 @@
 
                     {#if showActions && actions}
                         {@const inline = mode === 'rows-filtered'}
-                        <Layout.Stack {inline}>
-                            {#if inline}
-                                {@render actions?.()}
-                            {:else}
-                                <Layout.Grid columns={2} columnsXS={1}>
+                        <div class="controlled-width">
+                            <Layout.Stack {inline}>
+                                {#if inline}
                                     {@render actions?.()}
-                                </Layout.Grid>
-                            {/if}
-                        </Layout.Stack>
+                                {:else}
+                                    <Layout.Grid columns={2} columnsXS={1}>
+                                        {@render actions?.()}
+                                    </Layout.Grid>
+                                {/if}
+                            </Layout.Stack>
+                        </div>
                     {/if}
                 </Layout.Stack>
             </div>
@@ -434,6 +436,13 @@
         }
     }
 
+    @media (min-width: 1024px) {
+        .controlled-width {
+            width: 538px;
+            max-width: 538px;
+        }
+    }
+
     :global(.theme-dark) .spreadsheet-fade-bottom {
         background: linear-gradient(
             180deg,