fix(editor): incorrect z-index in dom renderer (#13465)

#### PR Dependency Tree


* **PR #13464**
  * **PR #13465** 👈
    * **PR #13471**
      * **PR #13472**
        * **PR #13473**

This tree was auto-generated by
[Charcoal](https://github.com/danerwilliams/charcoal)

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **Bug Fixes**
* Improved stacking order across canvas elements (shapes, connectors,
brush, highlighter), reducing unexpected overlap.
* Corrected z-index application for placeholders and fully rendered
elements to ensure consistent layering during edits.
* **Refactor**
* Centralized z-index handling for canvas elements to provide
predictable, uniform layering behavior across the app.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

blocksuite/affine/blocks/surface/src/renderer/dom-renderer.ts

@@ -298,7 +298,10 @@ export class DomRenderer {
       viewportBounds,
       zoom
     );
-    Object.assign(domElement.style, geometricStyles);
+    const zIndexStyle = {
+      'z-index': this.layerManager.getZIndex(elementModel),
+    };
+    Object.assign(domElement.style, geometricStyles, zIndexStyle);
     Object.assign(domElement.style, PLACEHOLDER_RESET_STYLES);
 
     // Clear classes specific to shapes, if applicable
@@ -335,7 +338,10 @@ export class DomRenderer {
       zoom
     );
     const opacityStyle = getOpacity(elementModel);
-    Object.assign(domElement.style, geometricStyles, opacityStyle);
+    const zIndexStyle = {
+      'z-index': this.layerManager.getZIndex(elementModel),
+    };
+    Object.assign(domElement.style, geometricStyles, opacityStyle, zIndexStyle);
 
     this._renderElement(elementModel, domElement);
   }

blocksuite/affine/gfx/brush/src/renderer/dom/brush.ts

@@ -65,8 +65,5 @@ export const BrushDomRendererExtension = DomElementRendererExtension(
     domElement.style.height = `${h * zoom}px`;
     domElement.style.overflow = 'visible';
     domElement.style.pointerEvents = 'none';
-
-    // Set z-index for layering
-    domElement.style.zIndex = renderer.layerManager.getZIndex(model).toString();
   }
 );

blocksuite/affine/gfx/brush/src/renderer/dom/highlighter.ts

@@ -69,8 +69,5 @@ export const HighlighterDomRendererExtension = DomElementRendererExtension(
     domElement.style.height = `${h * zoom}px`;
     domElement.style.overflow = 'visible';
     domElement.style.pointerEvents = 'none';
-
-    // Set z-index for layering
-    domElement.style.zIndex = renderer.layerManager.getZIndex(model).toString();
   }
 );

blocksuite/affine/gfx/connector/src/element-renderer/connector-dom/index.ts

@@ -359,9 +359,6 @@ export const connectorDomRenderer = (
   element.style.overflow = 'visible';
   element.style.pointerEvents = 'none';
 
-  // Set z-index for layering
-  element.style.zIndex = renderer.layerManager.getZIndex(model).toString();
-
   // Render label if present
   renderConnectorLabel(model, element, renderer, zoom);
 };

blocksuite/affine/gfx/shape/src/element-renderer/shape-dom/index.ts

@@ -181,8 +181,6 @@ export const shapeDomRenderer = (
 
   applyTransformStyles(model, element);
 
-  element.style.zIndex = renderer.layerManager.getZIndex(model).toString();
-
   manageClassNames(model, element);
   applyShadowStyles(model, element, renderer);
 };