diff --git a/public/app/features/trails/DataTrailBookmarks.tsx b/public/app/features/trails/DataTrailBookmarks.tsx
index 501bd2e7c9a..4793110cf03 100644
--- a/public/app/features/trails/DataTrailBookmarks.tsx
+++ b/public/app/features/trails/DataTrailBookmarks.tsx
@@ -1,5 +1,5 @@
 import { css } from '@emotion/css';
-import { useState } from 'react';
+import { useState, useEffect } from 'react';
 
 import { GrafanaTheme2 } from '@grafana/data';
 import { IconButton, useStyles2 } from '@grafana/ui';
@@ -14,9 +14,16 @@ type Props = {
 };
 
 export function DataTrailsBookmarks({ onSelect, onDelete }: Props) {
-  const [toggleBookmark, setToggleBookmark] = useState(false);
+  const [toggleBookmark, setToggleBookmark] = useState(() => {
+    const savedState = localStorage.getItem('toggleBookmark');
+    return savedState ? JSON.parse(savedState) : false;
+  });
   const styles = useStyles2(getStyles);
 
+  useEffect(() => {
+    localStorage.setItem('toggleBookmark', JSON.stringify(toggleBookmark));
+  }, [toggleBookmark]);
+
   if (getTrailStore().bookmarks.length === 0) {
     return null;
   }
diff --git a/public/app/features/trails/DataTrailsHome.tsx b/public/app/features/trails/DataTrailsHome.tsx
index 479e9e6d5e3..5c7ee62b185 100644
--- a/public/app/features/trails/DataTrailsHome.tsx
+++ b/public/app/features/trails/DataTrailsHome.tsx
@@ -103,8 +103,8 @@ function getStyles(theme: GrafanaTheme2) {
   return {
     container: css({
       display: 'flex',
-      justifyContent: 'center',
       alignItems: 'center',
+      marginTop: '84px',
       flexDirection: 'column',
       height: '100%',
       boxSizing: 'border-box', // Ensure padding doesn't cause overflow