diff --git a/src/Exceptionless.Web/ClientApp/src/app.css b/src/Exceptionless.Web/ClientApp/src/app.css
index 49c5cf7d8f..db2060803e 100644
--- a/src/Exceptionless.Web/ClientApp/src/app.css
+++ b/src/Exceptionless.Web/ClientApp/src/app.css
@@ -152,11 +152,7 @@
     }
 
     html {
-        overflow-y: scroll;
-    }
-
-    html:has([data-slot='sheet-content']) {
-        overflow-y: hidden;
+        overflow: hidden;
     }
 
     body {
diff --git a/src/Exceptionless.Web/ClientApp/src/lib/features/events/components/event-detail-sheet.svelte b/src/Exceptionless.Web/ClientApp/src/lib/features/events/components/event-detail-sheet.svelte
index d19ca71401..788705dab2 100644
--- a/src/Exceptionless.Web/ClientApp/src/lib/features/events/components/event-detail-sheet.svelte
+++ b/src/Exceptionless.Web/ClientApp/src/lib/features/events/components/event-detail-sheet.svelte
@@ -38,16 +38,17 @@
     <Sheet.Content
         class="top-15.25! bottom-0! h-auto! w-full transform-gpu overflow-y-auto rounded-l-lg border-l shadow-2xl duration-150 ease-out will-change-transform sm:max-w-full! md:w-5/6!"
         overlayProps={{ class: 'top-15.25! bg-black/5 supports-backdrop-filter:backdrop-blur-none!' }}
+        preventScroll={false}
     >
-        <Sheet.Header>
-            <Sheet.Title class="flex items-center gap-2">
+        <Sheet.Header class="pt-4.5 pb-0">
+            <Sheet.Title class="flex items-center gap-2 text-2xl font-semibold tracking-tight" level={3}>
                 Event Details
                 <Button aria-label="Open event details in new window" href={resolvedHref} size="icon-sm" title="Open in new window" variant="ghost">
                     <ExternalLink aria-hidden="true" />
                 </Button>
             </Sheet.Title>
         </Sheet.Header>
-        <div class="px-4">
+        <div class="mt-0.5 px-4">
             {#if eventId}
                 <EventsOverview {filterChanged} id={eventId} {handleError} />
             {/if}
diff --git a/src/Exceptionless.Web/ClientApp/src/lib/features/saved-views/components/column-management-dialog.svelte b/src/Exceptionless.Web/ClientApp/src/lib/features/saved-views/components/column-management-dialog.svelte
new file mode 100644
index 0000000000..2ca3904b1e
--- /dev/null
+++ b/src/Exceptionless.Web/ClientApp/src/lib/features/saved-views/components/column-management-dialog.svelte
@@ -0,0 +1,196 @@
+<script module lang="ts">
+    import type { RowData } from '@tanstack/svelte-table';
+
+    type TData = RowData;
+</script>
+
+<script generics="TData extends RowData" lang="ts">
+    import type { StockFeatures, Table } from '@tanstack/svelte-table';
+
+    import { Muted } from '$comp/typography';
+    import { Button } from '$comp/ui/button';
+    import * as Dialog from '$comp/ui/dialog';
+    import ChevronDown from '@lucide/svelte/icons/chevron-down';
+    import ChevronUp from '@lucide/svelte/icons/chevron-up';
+    import GripVertical from '@lucide/svelte/icons/grip-vertical';
+    import Plus from '@lucide/svelte/icons/plus';
+    import X from '@lucide/svelte/icons/x';
+
+    interface Props {
+        open: boolean;
+        table: Table<StockFeatures, TData>;
+    }
+
+    let { open = $bindable(), table }: Props = $props();
+
+    let draggedColumnId = $state<null | string>(null);
+
+    const allColumns = $derived(table.getAllLeafColumns().filter((column) => column.id !== 'select'));
+    const visibleColumns = $derived(allColumns.filter((column) => column.getIsVisible()));
+    const availableColumns = $derived(allColumns.filter((column) => column.getCanHide() && !column.getIsVisible()));
+
+    function getColumnLabel(column: (typeof allColumns)[number]): string {
+        if (typeof column.columnDef.header === 'string') {
+            return column.columnDef.header;
+        }
+
+        return column.id.replace(/[_-]/g, ' ').replace(/\w\S*/g, (word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase());
+    }
+
+    function addColumn(column: (typeof allColumns)[number]): void {
+        column.toggleVisibility(true);
+    }
+
+    function removeColumn(column: (typeof allColumns)[number]): void {
+        if (visibleColumns.length > 1) {
+            column.toggleVisibility(false);
+        }
+    }
+
+    function canRemoveColumn(column: (typeof allColumns)[number]): boolean {
+        return column.getCanHide() && visibleColumns.length > 1;
+    }
+
+    function moveColumnUp(columnId: string): void {
+        const columnIds = visibleColumns.map((c) => c.id);
+        const index = columnIds.indexOf(columnId);
+        if (index <= 0) {
+            return;
+        }
+
+        const temp = columnIds[index]!;
+        columnIds[index] = columnIds[index - 1]!;
+        columnIds[index - 1] = temp;
+        applyColumnOrder(columnIds);
+    }
+
+    function moveColumnDown(columnId: string): void {
+        const columnIds = visibleColumns.map((c) => c.id);
+        const index = columnIds.indexOf(columnId);
+        if (index === -1 || index >= columnIds.length - 1) {
+            return;
+        }
+
+        const temp = columnIds[index]!;
+        columnIds[index] = columnIds[index + 1]!;
+        columnIds[index + 1] = temp;
+        applyColumnOrder(columnIds);
+    }
+
+    function applyColumnOrder(columnIds: string[]): void {
+        const hiddenIds = allColumns.filter((c) => !c.getIsVisible()).map((c) => c.id);
+        table.setColumnOrder(['select', ...columnIds, ...hiddenIds]);
+    }
+
+    function handleDragStart(event: DragEvent, columnId: string): void {
+        draggedColumnId = columnId;
+        if (event.dataTransfer) {
+            event.dataTransfer.effectAllowed = 'move';
+            event.dataTransfer.setData('text/plain', columnId);
+        }
+    }
+
+    function handleDragOver(event: DragEvent, targetColumnId: string): void {
+        event.preventDefault();
+        if (event.dataTransfer) {
+            event.dataTransfer.dropEffect = 'move';
+        }
+
+        if (draggedColumnId && draggedColumnId !== targetColumnId) {
+            const columnIds = visibleColumns.map((c) => c.id);
+            const fromIndex = columnIds.indexOf(draggedColumnId);
+            const toIndex = columnIds.indexOf(targetColumnId);
+            if (fromIndex === -1 || toIndex === -1) {
+                return;
+            }
+
+            const [moved] = columnIds.splice(fromIndex, 1);
+            if (moved) {
+                columnIds.splice(toIndex, 0, moved);
+                applyColumnOrder(columnIds);
+            }
+        }
+    }
+
+    function handleDragEnd(): void {
+        draggedColumnId = null;
+    }
+</script>
+
+<Dialog.Root bind:open>
+    <Dialog.Content class="sm:max-w-2xl" preventScroll={false} overlayClass="bg-black/20 supports-backdrop-filter:backdrop-blur-none">
+        <Dialog.Header>
+            <Dialog.Title>Manage Columns</Dialog.Title>
+            <Dialog.Description>
+                <Muted class="text-xs">Add columns from the available list and reorder selected columns.</Muted>
+            </Dialog.Description>
+        </Dialog.Header>
+
+        <div class="grid grid-cols-2 gap-4">
+            <!-- Available columns -->
+            <div class="flex flex-col gap-2">
+                <h3 class="text-sm font-medium">Available</h3>
+                <div class="border-input rounded-md border">
+                    <div class="max-h-64 overflow-y-auto p-2">
+                        {#if availableColumns.length === 0}
+                            <p class="text-muted-foreground py-4 text-center text-sm">All columns are visible</p>
+                        {:else}
+                            {#each availableColumns as column (column.id)}
+                                <div class="hover:bg-accent flex items-center justify-between rounded-sm px-2 py-1.5 text-sm">
+                                    <span>{getColumnLabel(column)}</span>
+                                    <Button variant="ghost" size="icon-xs" onclick={() => addColumn(column)} title="Add column">
+                                        <Plus class="size-3.5" />
+                                    </Button>
+                                </div>
+                            {/each}
+                        {/if}
+                    </div>
+                </div>
+            </div>
+
+            <!-- Selected columns -->
+            <div class="flex flex-col gap-2">
+                <h3 class="text-sm font-medium">Selected</h3>
+                <div class="border-input rounded-md border">
+                    <div class="max-h-64 overflow-y-auto p-2" role="list">
+                        {#each visibleColumns as column, index (column.id)}
+                            <div
+                                class={[
+                                    'group/column flex cursor-grab items-center gap-1 rounded-sm px-2 py-1.5 text-sm active:cursor-grabbing',
+                                    draggedColumnId === column.id && 'bg-accent/70'
+                                ]}
+                                draggable="true"
+                                ondragstart={(event) => handleDragStart(event, column.id)}
+                                ondragover={(event) => handleDragOver(event, column.id)}
+                                ondragend={handleDragEnd}
+                                role="listitem"
+                            >
+                                <GripVertical class="text-muted-foreground/60 size-3.5 shrink-0 opacity-0 transition-opacity group-hover/column:opacity-100" />
+                                <span class="min-w-0 flex-1 truncate">{getColumnLabel(column)}</span>
+                                <div class="flex shrink-0 items-center gap-0.5 opacity-0 transition-opacity group-hover/column:opacity-100">
+                                    <Button variant="ghost" size="icon-xs" onclick={() => moveColumnUp(column.id)} disabled={index === 0} title="Move up">
+                                        <ChevronUp class="size-3.5" />
+                                    </Button>
+                                    <Button
+                                        variant="ghost"
+                                        size="icon-xs"
+                                        onclick={() => moveColumnDown(column.id)}
+                                        disabled={index === visibleColumns.length - 1}
+                                        title="Move down"
+                                    >
+                                        <ChevronDown class="size-3.5" />
+                                    </Button>
+                                    {#if canRemoveColumn(column)}
+                                        <Button variant="ghost" size="icon-xs" onclick={() => removeColumn(column)} title="Remove column">
+                                            <X class="size-3.5" />
+                                        </Button>
+                                    {/if}
+                                </div>
+                            </div>
+                        {/each}
+                    </div>
+                </div>
+            </div>
+        </div>
+    </Dialog.Content>
+</Dialog.Root>
diff --git a/src/Exceptionless.Web/ClientApp/src/lib/features/saved-views/components/saved-view-picker.svelte b/src/Exceptionless.Web/ClientApp/src/lib/features/saved-views/components/saved-view-picker.svelte
index 43ceebd333..1b775a7c13 100644
--- a/src/Exceptionless.Web/ClientApp/src/lib/features/saved-views/components/saved-view-picker.svelte
+++ b/src/Exceptionless.Web/ClientApp/src/lib/features/saved-views/components/saved-view-picker.svelte
@@ -15,7 +15,7 @@
     import { serializeFilters } from '$features/events/components/filters/helpers.svelte';
     import { organization } from '$features/organizations/context.svelte';
     import { getMeQuery } from '$features/users/api.svelte';
-    import GripVertical from '@lucide/svelte/icons/grip-vertical';
+    import Columns3 from '@lucide/svelte/icons/columns-3';
     import Pencil from '@lucide/svelte/icons/pencil';
     import Plus from '@lucide/svelte/icons/plus';
     import Save from '@lucide/svelte/icons/save';
@@ -37,6 +37,7 @@
         postSavedView,
         restoreDeletedSavedView
     } from '../api.svelte';
+    import ColumnManagementDialog from './column-management-dialog.svelte';
     import DeleteViewDialog from './delete-view-dialog.svelte';
     import RenameViewDialog from './rename-view-dialog.svelte';
     import SaveViewDialog from './save-view-dialog.svelte';
@@ -94,7 +95,7 @@
     let isSaveDialogOpen = $state(false);
     let isRenameDialogOpen = $state(false);
     let isDeleteDialogOpen = $state(false);
-    let draggedColumnId = $state<null | string>(null);
+    let isColumnDialogOpen = $state(false);
     let viewToDelete = $state<null | SavedView>(null);
 
     const organizationId = $derived(organization.current);
@@ -180,9 +181,8 @@
 
     const activeView = $derived(activeSavedView);
     const predefinedViewTarget = $derived(activeView ?? duplicateView);
-    const hideableColumns = $derived(table.getAllLeafColumns().filter((column) => column.getCanHide()));
+
     const reorderableColumns = $derived(table.getAllLeafColumns().filter((column) => column.id !== 'select'));
-    const visibleHideableColumnCount = $derived(hideableColumns.filter((column) => column.getIsVisible()).length);
 
     async function openSaveDialog() {
         await tick();
@@ -194,24 +194,6 @@
         isRenameDialogOpen = true;
     }
 
-    function canToggleColumn(column: (typeof hideableColumns)[number]): boolean {
-        return !column.getIsVisible() || visibleHideableColumnCount > 1;
-    }
-
-    function toggleColumn(column: (typeof hideableColumns)[number]): void {
-        if (canToggleColumn(column)) {
-            column.toggleVisibility();
-        }
-    }
-
-    function getColumnLabel(column: (typeof reorderableColumns)[number]): string {
-        if (typeof column.columnDef.header === 'string') {
-            return column.columnDef.header;
-        }
-
-        return column.id.replace(/[_-]/g, ' ').replace(/\w\S*/g, (word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase());
-    }
-
     function getSavedColumnOrder(): string[] | undefined {
         const currentColumnIds = new Set(table.getAllLeafColumns().map((column) => column.id));
         const savedColumnOrder = (columnOrder ?? []).filter((columnId) => columnId !== 'select' && currentColumnIds.has(columnId));
@@ -219,49 +201,6 @@
         return savedColumnOrder.length > 0 ? savedColumnOrder : undefined;
     }
 
-    function handleColumnDragEnd(): void {
-        draggedColumnId = null;
-    }
-
-    function handleColumnDragOver(event: DragEvent, targetColumnId: string): void {
-        event.preventDefault();
-        if (event.dataTransfer) {
-            event.dataTransfer.dropEffect = 'move';
-        }
-
-        if (draggedColumnId && draggedColumnId !== targetColumnId) {
-            moveColumn(draggedColumnId, targetColumnId);
-        }
-    }
-
-    function handleColumnDragStart(event: DragEvent, columnId: string): void {
-        draggedColumnId = columnId;
-        if (event.dataTransfer) {
-            event.dataTransfer.effectAllowed = 'move';
-            event.dataTransfer.setData('text/plain', columnId);
-        }
-    }
-
-    function moveColumn(columnId: string, targetColumnId: string): void {
-        const columnIds = reorderableColumns.map((column) => column.id);
-        const columnIndex = columnIds.indexOf(columnId);
-        const targetIndex = columnIds.indexOf(targetColumnId);
-        if (columnIndex === -1 || targetIndex < 0 || targetIndex >= columnIds.length) {
-            return;
-        }
-
-        const [movedColumnId] = columnIds.splice(columnIndex, 1);
-        if (!movedColumnId) {
-            return;
-        }
-
-        columnIds.splice(targetIndex, 0, movedColumnId);
-
-        const allColumnIds = table.getAllLeafColumns().map((column) => column.id);
-        const extraColumnIds = allColumnIds.filter((id) => id !== 'select' && !columnIds.includes(id));
-        table.setColumnOrder(['select', ...columnIds, ...extraColumnIds]);
-    }
-
     async function openDeleteDialog(savedView: SavedView) {
         viewToDelete = savedView;
         await tick();
@@ -485,46 +424,10 @@
         {#if reorderableColumns.length > 0}
             <DropdownMenu.Separator />
             <DropdownMenu.Group>
-                <DropdownMenu.Label>Columns</DropdownMenu.Label>
-                <div role="list">
-                    {#each reorderableColumns as column (column.id)}
-                        <div
-                            class={[
-                                'group/column flex cursor-grab items-center gap-1 rounded-md py-0.5 pr-1.5 active:cursor-grabbing',
-                                draggedColumnId === column.id && 'bg-accent/70'
-                            ]}
-                            draggable="true"
-                            ondragend={handleColumnDragEnd}
-                            ondragover={(event) => handleColumnDragOver(event, column.id)}
-                            ondragstart={(event) => handleColumnDragStart(event, column.id)}
-                            role="listitem"
-                        >
-                            {#if column.getCanHide()}
-                                <DropdownMenu.CheckboxItem
-                                    checked={column.getIsVisible()}
-                                    class="min-w-0 flex-1"
-                                    disabled={!canToggleColumn(column)}
-                                    onclick={(event) => {
-                                        event.preventDefault();
-                                        toggleColumn(column);
-                                    }}
-                                    onSelect={(event) => event.preventDefault()}
-                                >
-                                    <span class="truncate">{getColumnLabel(column)}</span>
-                                </DropdownMenu.CheckboxItem>
-                            {:else}
-                                <span class="flex min-w-0 flex-1 items-center gap-1.5 px-1.5 py-1 text-sm">
-                                    <span class="mr-2 size-4" aria-hidden="true"></span>
-                                    <span class="truncate">{getColumnLabel(column)}</span>
-                                </span>
-                            {/if}
-                            <GripVertical
-                                class="text-muted-foreground/60 size-4 shrink-0 opacity-0 transition-opacity group-focus-within/column:opacity-100 group-hover/column:opacity-100"
-                                aria-hidden="true"
-                            />
-                        </div>
-                    {/each}
-                </div>
+                <DropdownMenu.Item onclick={() => (isColumnDialogOpen = true)}>
+                    <Columns3 class="mr-2 size-4" aria-hidden="true" />
+                    Manage Columns...
+                </DropdownMenu.Item>
             </DropdownMenu.Group>
         {/if}
     </DropdownMenu.Content>
@@ -558,3 +461,7 @@
 {#if isDeleteDialogOpen}
     <DeleteViewDialog bind:open={isDeleteDialogOpen} {viewToDelete} onDelete={handleDelete} />
 {/if}
+
+{#if isColumnDialogOpen}
+    <ColumnManagementDialog bind:open={isColumnDialogOpen} {table} />
+{/if}
diff --git a/src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/faceted-filter/faceted-filter-actions.svelte b/src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/faceted-filter/faceted-filter-actions.svelte
index ca328a662d..6ab6c1d13e 100644
--- a/src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/faceted-filter/faceted-filter-actions.svelte
+++ b/src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/faceted-filter/faceted-filter-actions.svelte
@@ -16,10 +16,10 @@
 <div class="flex flex-col">
     <Separator />
     {#if showClear}
-        <Button class="justify-center text-center" variant="ghost" onclick={clear}>Clear Filter</Button>
+        <Button variant="ghost" onclick={clear}>Clear Filter</Button>
     {/if}
     {#if toggleHidden}
-        <Button class="justify-center text-center" variant="ghost" onclick={toggleHidden}>{hidden ? 'Show Filter' : 'Hide Filter'}</Button>
+        <Button variant="ghost" onclick={toggleHidden}>{hidden ? 'Show Filter' : 'Hide Filter'}</Button>
     {/if}
-    <Button class="justify-center text-center" variant="ghost" onclick={remove}>Remove Filter</Button>
+    <Button variant="ghost" onclick={remove}>Remove Filter</Button>
 </div>
diff --git a/src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/faceted-filter/faceted-filter-builder.svelte b/src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/faceted-filter/faceted-filter-builder.svelte
index 365e3ce714..ec2bf1766e 100644
--- a/src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/faceted-filter/faceted-filter-builder.svelte
+++ b/src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/faceted-filter/faceted-filter-builder.svelte
@@ -231,14 +231,13 @@
         <div class="flex flex-col">
             <Separator />
             {#if hiddenFilterCount > 0}
-                <Button class="justify-center text-center" variant="ghost" onclick={toggleHiddenFilters}>
+                <Button variant="ghost" onclick={toggleHiddenFilters}>
                     {showHiddenFilters ? 'Hide Hidden Filters' : `Show ${hiddenFilterLabel}`}
                 </Button>
             {/if}
             {#if filters.some((f) => f.type !== 'date')}
-                <Button class="justify-center text-center" variant="ghost" onclick={onRemoveAll}>Clear Filters</Button>
+                <Button variant="ghost" onclick={onRemoveAll}>Clear Filters</Button>
             {/if}
-            <Button class="justify-center text-center" variant="ghost" onclick={onClose}>Close</Button>
         </div>
     </Popover.Content>
 </Popover.Root>
diff --git a/src/Exceptionless.Web/ClientApp/src/lib/features/stacks/components/issue-detail-sheet.svelte b/src/Exceptionless.Web/ClientApp/src/lib/features/stacks/components/issue-detail-sheet.svelte
index 438b73106a..1c6939b377 100644
--- a/src/Exceptionless.Web/ClientApp/src/lib/features/stacks/components/issue-detail-sheet.svelte
+++ b/src/Exceptionless.Web/ClientApp/src/lib/features/stacks/components/issue-detail-sheet.svelte
@@ -37,16 +37,17 @@
     <Sheet.Content
         class="top-15.25! bottom-0! h-auto! w-full transform-gpu overflow-y-auto rounded-l-lg border-l shadow-2xl duration-150 ease-out will-change-transform sm:max-w-full! md:w-5/6!"
         overlayProps={{ class: 'top-15.25! bg-black/5 supports-backdrop-filter:backdrop-blur-none!' }}
+        preventScroll={false}
     >
-        <Sheet.Header>
-            <Sheet.Title class="flex items-center gap-2">
+        <Sheet.Header class="pt-4.5 pb-0">
+            <Sheet.Title class="flex items-center gap-2 text-2xl font-semibold tracking-tight" level={3}>
                 Issue Details
                 <Button aria-label="Open issue details in new window" href={resolvedHref} size="icon-sm" title="Open in new window" variant="ghost">
                     <ExternalLink aria-hidden="true" />
                 </Button>
             </Sheet.Title>
         </Sheet.Header>
-        <div class="px-4">
+        <div class="mt-0.5 px-4">
             {#if stackId}
                 <IssueDetails {filterChanged} {handleError} {stackId} />
             {/if}
diff --git a/src/Exceptionless.Web/ClientApp/src/lib/features/stacks/components/stack-card.svelte b/src/Exceptionless.Web/ClientApp/src/lib/features/stacks/components/stack-card.svelte
index 84f770d87e..b6af7d032c 100644
--- a/src/Exceptionless.Web/ClientApp/src/lib/features/stacks/components/stack-card.svelte
+++ b/src/Exceptionless.Web/ClientApp/src/lib/features/stacks/components/stack-card.svelte
@@ -113,7 +113,9 @@
 </script>
 
 {#if stackQuery.isSuccess}
-    <Card.Root>
+    <Card.Root
+        class="relative overflow-hidden ring-[color-mix(in_oklab,var(--chart-1)_42%,transparent)] before:absolute before:inset-x-0 before:top-0 before:h-1 before:bg-[linear-gradient(90deg,var(--chart-1),var(--chart-2))] before:content-['']"
+    >
         <Card.Header>
             <Card.Title class="flex flex-row items-center justify-between text-lg font-semibold">
                 <div class="mb-2 flex w-0 min-w-0 flex-1 flex-col lg:mb-0">
diff --git a/src/Exceptionless.Web/ClientApp/src/routes/(app)/(components)/layouts/navbar.svelte b/src/Exceptionless.Web/ClientApp/src/routes/(app)/(components)/layouts/navbar.svelte
index ca2625356f..058f6ceadf 100644
--- a/src/Exceptionless.Web/ClientApp/src/routes/(app)/(components)/layouts/navbar.svelte
+++ b/src/Exceptionless.Web/ClientApp/src/routes/(app)/(components)/layouts/navbar.svelte
@@ -20,7 +20,7 @@
 </script>
 
 <nav class="bg-background text-foreground fixed z-30 w-full border-b">
-    <div class="px-3 py-3 lg:px-5 lg:pl-3">
+    <div class="px-4 py-3">
         <div class="flex items-center justify-between">
             <div class="flex items-center justify-start">
                 <Sidebar.Trigger variant="outline" class="size-9" />
@@ -33,7 +33,7 @@
                     {/if}
                 </A>
             </div>
-            <div class="flex items-center gap-x-2 lg:gap-x-3">
+            <div class="flex items-center gap-2">
                 <Button class="w-44 justify-start sm:w-56 md:w-72" onclick={openCommand} size="default" variant="outline">
                     <Search />
                     <span class="text-muted-foreground flex items-center gap-1.5">Type <Kbd.Root>/</Kbd.Root> to search</span>
diff --git a/src/Exceptionless.Web/ClientApp/src/routes/(app)/(components)/navigation-command.svelte b/src/Exceptionless.Web/ClientApp/src/routes/(app)/(components)/navigation-command.svelte
index 2cb41c5a8e..4fd7bd4404 100644
--- a/src/Exceptionless.Web/ClientApp/src/routes/(app)/(components)/navigation-command.svelte
+++ b/src/Exceptionless.Web/ClientApp/src/routes/(app)/(components)/navigation-command.svelte
@@ -249,73 +249,116 @@
         closeCommandWindow();
         await openKeyboardShortcuts();
     }
+
+    const PAGE_JUMP_SIZE = 7;
+    let commandValue = $state('');
+
+    function handleKeydown(event: KeyboardEvent): void {
+        if (event.key !== 'PageDown' && event.key !== 'PageUp') {
+            return;
+        }
+
+        event.preventDefault();
+
+        const root = event.currentTarget;
+        if (!(root instanceof HTMLElement)) {
+            return;
+        }
+
+        const items = Array.from(root.querySelectorAll<HTMLElement>('[data-command-item]:not([aria-disabled="true"])'));
+        const visibleItems = items.filter((item) => {
+            const group = item.closest('[data-command-group]');
+            return !group?.hasAttribute('hidden');
+        });
+
+        if (visibleItems.length === 0) {
+            return;
+        }
+
+        const currentIndex = visibleItems.findIndex((item) => item.hasAttribute('data-selected'));
+        let targetIndex: number;
+
+        if (event.key === 'PageDown') {
+            targetIndex = currentIndex === -1 ? PAGE_JUMP_SIZE - 1 : Math.min(currentIndex + PAGE_JUMP_SIZE, visibleItems.length - 1);
+        } else {
+            targetIndex = currentIndex === -1 ? 0 : Math.max(currentIndex - PAGE_JUMP_SIZE, 0);
+        }
+
+        const targetValue = visibleItems[targetIndex]?.getAttribute('data-value');
+        if (targetValue) {
+            commandValue = targetValue;
+            visibleItems[targetIndex]?.scrollIntoView({ block: 'nearest' });
+        }
+    }
 </script>
 
 {#key resetKey}
-    <Command.Dialog bind:open filter={filterCommandItem}>
+    <Command.Dialog bind:open bind:value={commandValue} filter={filterCommandItem} onkeydown={handleKeydown}>
         <Command.Input bind:value={searchText} placeholder="Search or jump to..." />
         <Command.List>
             <Command.Empty>No results found.</Command.Empty>
             {#if hasSearchText && showRemoteSearchResults}
-                {#if showEventSearchResults}
-                    <Command.Group heading="Events" value="Search Events">
-                        {#if eventSearchQuery.isPending}
-                            <Command.Item disabled value={`Searching events ${debouncedSearchText}`}>
-                                <Activity />
-                                <span>Searching events...</span>
-                            </Command.Item>
-                        {:else}
-                            {#each eventMatches as event (event.id)}
-                                <Command.LinkItem href={getEventHref(event)} onclick={closeCommandWindow} value={getResultValue('Event', event)}>
+                {#key debouncedSearchText}
+                    {#if showEventSearchResults}
+                        <Command.Group heading="Events" value="Search Events">
+                            {#if eventSearchQuery.isPending}
+                                <Command.Item disabled value={`Searching events ${debouncedSearchText}`}>
                                     <Activity />
-                                    <div class="flex min-w-0 flex-col">
-                                        <span class="truncate">{getResultTitle(event)}</span>
-                                        {#if getResultDescription(event)}
-                                            <span class="text-muted-foreground truncate text-xs">{getResultDescription(event)}</span>
-                                        {/if}
-                                    </div>
-                                </Command.LinkItem>
-                            {/each}
-                            {#if hasMoreEventMatches}
-                                <Command.LinkItem href={eventSearchHref} onclick={closeCommandWindow} value={`View all events ${debouncedSearchText}`}>
-                                    <Search />
-                                    <span>View all matching events</span>
-                                </Command.LinkItem>
+                                    <span>Searching events...</span>
+                                </Command.Item>
+                            {:else}
+                                {#each eventMatches as event (event.id)}
+                                    <Command.LinkItem href={getEventHref(event)} onclick={closeCommandWindow} value={getResultValue('Event', event)}>
+                                        <Activity />
+                                        <div class="flex min-w-0 flex-col">
+                                            <span class="truncate">{getResultTitle(event)}</span>
+                                            {#if getResultDescription(event)}
+                                                <span class="text-muted-foreground truncate text-xs">{getResultDescription(event)}</span>
+                                            {/if}
+                                        </div>
+                                    </Command.LinkItem>
+                                {/each}
+                                {#if hasMoreEventMatches}
+                                    <Command.LinkItem href={eventSearchHref} onclick={closeCommandWindow} value={`View all events ${debouncedSearchText}`}>
+                                        <Search />
+                                        <span>View all matching events</span>
+                                    </Command.LinkItem>
+                                {/if}
                             {/if}
-                        {/if}
-                    </Command.Group>
-                {/if}
-                {#if showEventSearchResults && showIssueSearchResults}
-                    <Command.Separator />
-                {/if}
-                {#if showIssueSearchResults}
-                    <Command.Group heading="Issues" value="Search Issues">
-                        {#if issueSearchQuery.isPending}
-                            <Command.Item disabled value={`Searching issues ${debouncedSearchText}`}>
-                                <Bug />
-                                <span>Searching issues...</span>
-                            </Command.Item>
-                        {:else}
-                            {#each issueMatches as issue (issue.id)}
-                                <Command.LinkItem href={getIssueHref(issue)} onclick={closeCommandWindow} value={getResultValue('Issue', issue)}>
+                        </Command.Group>
+                    {/if}
+                    {#if showEventSearchResults && showIssueSearchResults}
+                        <Command.Separator />
+                    {/if}
+                    {#if showIssueSearchResults}
+                        <Command.Group heading="Issues" value="Search Issues">
+                            {#if issueSearchQuery.isPending}
+                                <Command.Item disabled value={`Searching issues ${debouncedSearchText}`}>
                                     <Bug />
-                                    <div class="flex min-w-0 flex-col">
-                                        <span class="truncate">{getResultTitle(issue)}</span>
-                                        {#if getResultDescription(issue)}
-                                            <span class="text-muted-foreground truncate text-xs">{getResultDescription(issue)}</span>
-                                        {/if}
-                                    </div>
-                                </Command.LinkItem>
-                            {/each}
-                            {#if hasMoreIssueMatches}
-                                <Command.LinkItem href={issueSearchHref} onclick={closeCommandWindow} value={`View all issues ${debouncedSearchText}`}>
-                                    <Search />
-                                    <span>View all matching issues</span>
-                                </Command.LinkItem>
+                                    <span>Searching issues...</span>
+                                </Command.Item>
+                            {:else}
+                                {#each issueMatches as issue (issue.id)}
+                                    <Command.LinkItem href={getIssueHref(issue)} onclick={closeCommandWindow} value={getResultValue('Issue', issue)}>
+                                        <Bug />
+                                        <div class="flex min-w-0 flex-col">
+                                            <span class="truncate">{getResultTitle(issue)}</span>
+                                            {#if getResultDescription(issue)}
+                                                <span class="text-muted-foreground truncate text-xs">{getResultDescription(issue)}</span>
+                                            {/if}
+                                        </div>
+                                    </Command.LinkItem>
+                                {/each}
+                                {#if hasMoreIssueMatches}
+                                    <Command.LinkItem href={issueSearchHref} onclick={closeCommandWindow} value={`View all issues ${debouncedSearchText}`}>
+                                        <Search />
+                                        <span>View all matching issues</span>
+                                    </Command.LinkItem>
+                                {/if}
                             {/if}
-                        {/if}
-                    </Command.Group>
-                {/if}
+                        </Command.Group>
+                    {/if}
+                {/key}
                 <Command.Separator />
             {/if}
             {#each Object.entries(groupedRoutes) as [group, items], index (group)}
diff --git a/src/Exceptionless.Web/ClientApp/src/routes/(app)/+layout.svelte b/src/Exceptionless.Web/ClientApp/src/routes/(app)/+layout.svelte
index a76a8df242..6e62935177 100644
--- a/src/Exceptionless.Web/ClientApp/src/routes/(app)/+layout.svelte
+++ b/src/Exceptionless.Web/ClientApp/src/routes/(app)/+layout.svelte
@@ -366,35 +366,7 @@
 
     const filteredRoutes = $derived.by(() => {
         const context: NavigationItemContext = { authenticated: isAuthenticated, impersonating: isImpersonating, user: meQuery.data };
-        const allRoutes = routes()
-            .filter((route) => (route.show ? route.show(context) : true))
-            .map((route) => {
-                if (route.group !== 'Dashboards') {
-                    return route;
-                }
-
-                if (route.href === resolve('/(app)/events') && page.params.eventId) {
-                    return {
-                        ...route,
-                        children: [
-                            ...(route.children ?? []),
-                            { href: resolve('/(app)/events/[eventId=objectid]', { eventId: page.params.eventId }), title: 'Details' }
-                        ]
-                    };
-                }
-
-                if (route.href === resolve('/(app)/issues') && page.params.stackId) {
-                    return {
-                        ...route,
-                        children: [
-                            ...(route.children ?? []),
-                            { href: resolve('/(app)/issues/[stackId=objectid]', { stackId: page.params.stackId }), title: 'Details' }
-                        ]
-                    };
-                }
-
-                return route;
-            });
+        const allRoutes = routes().filter((route) => (route.show ? route.show(context) : true));
 
         const savedViews = (savedViewsQuery.data ?? []).filter((savedView) => !isSavedViewDeleted(savedView));
         if (savedViews.length === 0) {
@@ -486,8 +458,8 @@
             />
         {/snippet}
     </Sidebar>
-    <div class="flex min-h-screen min-w-0 flex-1 pt-16">
-        <div class="text-secondary-foreground flex min-h-full min-w-0 flex-1 flex-col overflow-x-hidden overflow-y-auto">
+    <div class="flex h-screen min-w-0 flex-1 flex-col overflow-hidden pt-16">
+        <div class="text-secondary-foreground flex min-h-0 min-w-0 flex-1 scrollbar-gutter-stable flex-col overflow-x-hidden overflow-y-auto">
             <main class="flex-1 px-4 pt-4">
                 <NavigationCommand
                     bind:open={isCommandOpen}