diff --git a/blocksuite/affine/block-embed/src/embed-synced-doc-block/embed-synced-doc-block.ts b/blocksuite/affine/block-embed/src/embed-synced-doc-block/embed-synced-doc-block.ts
index 5ecc8fd69..0a1588ba8 100644
--- a/blocksuite/affine/block-embed/src/embed-synced-doc-block/embed-synced-doc-block.ts
+++ b/blocksuite/affine/block-embed/src/embed-synced-doc-block/embed-synced-doc-block.ts
@@ -231,6 +231,7 @@ export class EmbedSyncedDocBlockComponent extends EmbedBlockComponent<EmbedSynce
             [theme]: true,
             surface: false,
             selected: this.selected$.value,
+            'show-hover-border': true,
           })}
           @click=${this._handleClick}
           style=${containerStyleMap}
diff --git a/blocksuite/affine/block-embed/src/embed-synced-doc-block/styles.ts b/blocksuite/affine/block-embed/src/embed-synced-doc-block/styles.ts
index d4b12ab6a..12842767b 100644
--- a/blocksuite/affine/block-embed/src/embed-synced-doc-block/styles.ts
+++ b/blocksuite/affine/block-embed/src/embed-synced-doc-block/styles.ts
@@ -57,10 +57,13 @@ export const blockStyles = css`
   }
 
   .affine-embed-synced-doc-container {
-    border: 1px solid var(--affine-border-color);
+    border: 1px solid transparent;
     border-radius: 8px;
     overflow: hidden;
   }
+  .affine-embed-synced-doc-container.show-hover-border:hover {
+    border-color: var(--affine-border-color);
+  }
   .affine-embed-synced-doc-container.page {
     display: block;
     width: 100%;
@@ -151,7 +154,12 @@ export const blockStyles = css`
   }
 
   .affine-embed-synced-doc-container.surface {
+    border-color: var(--affine-border-color);
     background: var(--affine-background-primary-color);
+
+    affine-preview-root {
+      padding: 0 24px;
+    }
   }
 
   .affine-embed-synced-doc-container
diff --git a/blocksuite/affine/block-root/src/preview/preview-root-block.ts b/blocksuite/affine/block-root/src/preview/preview-root-block.ts
index 511689c5a..28cc7d1b3 100644
--- a/blocksuite/affine/block-root/src/preview/preview-root-block.ts
+++ b/blocksuite/affine/block-root/src/preview/preview-root-block.ts
@@ -10,7 +10,6 @@ export class PreviewRootBlockComponent extends BlockComponent {
   static override styles = css`
     affine-preview-root {
       display: block;
-      padding: 0 24px;
     }
   `;
 
diff --git a/blocksuite/affine/components/src/rich-text/inline/presets/nodes/footnote-node/footnote-node.ts b/blocksuite/affine/components/src/rich-text/inline/presets/nodes/footnote-node/footnote-node.ts
index fb122a4b5..5422ba628 100644
--- a/blocksuite/affine/components/src/rich-text/inline/presets/nodes/footnote-node/footnote-node.ts
+++ b/blocksuite/affine/components/src/rich-text/inline/presets/nodes/footnote-node/footnote-node.ts
@@ -36,20 +36,22 @@ export class AffineFootnoteNode extends WithDisposable(ShadowlessElement) {
       cursor: pointer;
     }
 
-    .footnote-content-default {
-      display: inline-block;
-      background: ${unsafeCSSVarV2('block/footnote/numberBgHover')};
-      color: ${unsafeCSSVarV2('button/pureWhiteText')};
-      width: 14px;
-      height: 14px;
-      line-height: 14px;
-      font-size: 10px;
-      font-weight: 400;
-      border-radius: 50%;
-      text-align: center;
-      text-overflow: ellipsis;
-      font-family: ${unsafeCSS(baseTheme.fontSansFamily)};
-      transition: background 0.3s ease-in-out;
+    .footnote-node {
+      .footnote-content-default {
+        display: inline-block;
+        background: ${unsafeCSSVarV2('block/footnote/numberBgHover')};
+        color: ${unsafeCSSVarV2('button/pureWhiteText')};
+        width: 14px;
+        height: 14px;
+        line-height: 14px;
+        font-size: 10px;
+        font-weight: 400;
+        border-radius: 50%;
+        text-align: center;
+        text-overflow: ellipsis;
+        font-family: ${unsafeCSS(baseTheme.fontSansFamily)};
+        transition: background 0.3s ease-in-out;
+      }
     }
 
     .footnote-node.hover-effect {
diff --git a/packages/frontend/core/src/blocksuite/extensions/entry/enable-preview.ts b/packages/frontend/core/src/blocksuite/extensions/entry/enable-preview.ts
index 5dc67de57..2a71aabb5 100644
--- a/packages/frontend/core/src/blocksuite/extensions/entry/enable-preview.ts
+++ b/packages/frontend/core/src/blocksuite/extensions/entry/enable-preview.ts
@@ -8,7 +8,6 @@ import {
 import {
   ColorScheme,
   createSignalFromObservable,
-  FootNoteNodeConfigExtension,
   type Signal,
   SpecProvider,
   type ThemeExtension,
@@ -80,11 +79,6 @@ function getPagePreviewThemeExtension(framework: FrameworkProvider) {
   return AffinePagePreviewThemeExtension;
 }
 
-// Disable hover effect for footnote node in center peek preview mode
-const footnodeConfig = FootNoteNodeConfigExtension({
-  disableHoverEffect: true,
-});
-
 const fontConfig = getFontConfigExtension();
 
 let _framework: FrameworkProvider;
@@ -108,7 +102,6 @@ export function enablePreviewExtension(framework: FrameworkProvider): void {
 
   _previewExtensions = [
     ...AIChatBlockSpec,
-    footnodeConfig,
     fontConfig,
     getThemeExtension(framework),
     getPagePreviewThemeExtension(framework),
diff --git a/packages/frontend/core/src/blocksuite/extensions/footnote-config.ts b/packages/frontend/core/src/blocksuite/extensions/footnote-config.ts
new file mode 100644
index 000000000..22ba8302c
--- /dev/null
+++ b/packages/frontend/core/src/blocksuite/extensions/footnote-config.ts
@@ -0,0 +1,17 @@
+import {
+  FootNoteNodeConfigExtension,
+  type SpecBuilder,
+} from '@blocksuite/affine/blocks';
+
+// Disable hover effect for footnote node
+const disableHoverEffectConfig = {
+  disableHoverEffect: true,
+};
+
+export function enableFootnoteConfigExtension(
+  specBuilder: SpecBuilder,
+  config = disableHoverEffectConfig
+) {
+  const footNoteConfig = FootNoteNodeConfigExtension(config);
+  return specBuilder.extend([footNoteConfig]);
+}
diff --git a/packages/frontend/core/src/blocksuite/extensions/index.ts b/packages/frontend/core/src/blocksuite/extensions/index.ts
index bbc9b34f6..5882bf3a3 100644
--- a/packages/frontend/core/src/blocksuite/extensions/index.ts
+++ b/packages/frontend/core/src/blocksuite/extensions/index.ts
@@ -1,2 +1,3 @@
 export * from './entry/enable-affine';
 export * from './entry/enable-mobile';
+export * from './footnote-config';
diff --git a/packages/frontend/core/src/desktop/pages/workspace/detail-page/tabs/chat.tsx b/packages/frontend/core/src/desktop/pages/workspace/detail-page/tabs/chat.tsx
index fa1237e32..d35f2965a 100644
--- a/packages/frontend/core/src/desktop/pages/workspace/detail-page/tabs/chat.tsx
+++ b/packages/frontend/core/src/desktop/pages/workspace/detail-page/tabs/chat.tsx
@@ -1,5 +1,6 @@
 import { ChatPanel } from '@affine/core/blocksuite/ai';
 import type { AffineEditorContainer } from '@affine/core/blocksuite/block-suite-editor';
+import { enableFootnoteConfigExtension } from '@affine/core/blocksuite/extensions';
 import { AINetworkSearchService } from '@affine/core/modules/ai-button/services/network-search';
 import { DocDisplayMetaService } from '@affine/core/modules/doc-display-meta';
 import { DocSearchMenuService } from '@affine/core/modules/doc-search-menu/services';
@@ -84,7 +85,9 @@ export const EditorChatPanel = forwardRef(function EditorChatPanel(
           );
         },
       };
-      const previewSpecBuilder = SpecProvider._.getSpec('preview:page');
+      const previewSpecBuilder = enableFootnoteConfigExtension(
+        SpecProvider._.getSpec('preview:page')
+      );
       chatPanelRef.current.previewSpecBuilder = previewSpecBuilder;
     } else {
       chatPanelRef.current.host = editor.host;
diff --git a/packages/frontend/core/src/modules/peek-view/view/ai-chat-block-peek-view/index.tsx b/packages/frontend/core/src/modules/peek-view/view/ai-chat-block-peek-view/index.tsx
index a7e7e7e13..3ea325aa8 100644
--- a/packages/frontend/core/src/modules/peek-view/view/ai-chat-block-peek-view/index.tsx
+++ b/packages/frontend/core/src/modules/peek-view/view/ai-chat-block-peek-view/index.tsx
@@ -1,6 +1,7 @@
 import { toReactNode } from '@affine/component';
 import { AIChatBlockPeekViewTemplate } from '@affine/core/blocksuite/ai';
 import type { AIChatBlockModel } from '@affine/core/blocksuite/ai/blocks/ai-chat-block/model/ai-chat-model';
+import { enableFootnoteConfigExtension } from '@affine/core/blocksuite/extensions';
 import { AINetworkSearchService } from '@affine/core/modules/ai-button/services/network-search';
 import type { EditorHost } from '@blocksuite/affine/block-std';
 import { SpecProvider } from '@blocksuite/affine/blocks';
@@ -19,7 +20,9 @@ export const AIChatBlockPeekView = ({
   const framework = useFramework();
   const searchService = framework.get(AINetworkSearchService);
   return useMemo(() => {
-    const previewSpecBuilder = SpecProvider._.getSpec('preview:page');
+    const previewSpecBuilder = enableFootnoteConfigExtension(
+      SpecProvider._.getSpec('preview:page')
+    );
     const networkSearchConfig = {
       visible: searchService.visible,
       enabled: searchService.enabled,