diff --git a/src/app/shared/nodes/container-node/container-node.html b/src/app/shared/nodes/container-node/container-node.html
index 7206654..5898787 100644
--- a/src/app/shared/nodes/container-node/container-node.html
+++ b/src/app/shared/nodes/container-node/container-node.html
@@ -76,7 +76,7 @@
   </div>
 
   @if (nameEditorOpen) {
-  <div class="llm-modal-backdrop" (pointerdown)="$event.stopPropagation()" (click)="cancelNameEditor($event)">
+  <dialog #nameEditorDialog class="llm-modal-backdrop" (pointerdown)="$event.stopPropagation()" (click)="onNameEditorDialogClick($event)" (cancel)="cancelNameEditor($event)">
     <div class="llm-modal" (pointerdown)="$event.stopPropagation()" (click)="$event.stopPropagation()">
       <div class="llm-modal-title">Edit Name</div>
       <div class="llm-modal-field">
@@ -94,7 +94,7 @@
         <button type="button" class="llm-btn llm-btn-primary" [disabled]="!draftName.trim()" (pointerdown)="$event.stopPropagation()" (click)="saveNameEditor($event)">Save</button>
       </div>
     </div>
-  </div>
+  </dialog>
   }
 
   <div class="container-node__ports">
diff --git a/src/app/shared/nodes/container-node/container-node.ts b/src/app/shared/nodes/container-node/container-node.ts
index 304e307..60b6288 100644
--- a/src/app/shared/nodes/container-node/container-node.ts
+++ b/src/app/shared/nodes/container-node/container-node.ts
@@ -1,5 +1,5 @@
 import { CommonModule } from '@angular/common';
-import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, HostBinding, HostListener, Input, OnDestroy, inject } from '@angular/core';
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, HostBinding, HostListener, Input, OnDestroy, effect, inject, viewChild } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 import { MatTooltipModule } from '@angular/material/tooltip';
 import { currentFlowPortValueKind, flowValueKindLabel, FlowData, FLOW_DEPENDANT_PORT_KEY, FLOW_DEPENDENCY_PORT_KEY } from '@models/flow';
@@ -109,6 +109,29 @@ export class ContainerNodeComponent implements OnDestroy {
   nameEditorOpen = false;
   draftName = '';
 
+  /**
+   * This template renders inside a node card, which rete.js positions with a
+   * CSS `transform` for pan/zoom, so a plain fixed-position backdrop would be
+   * confined to the node's box. A native `<dialog>` shown via `showModal()`
+   * escapes that via the browser's top layer, same fix as bias-annotations.
+   */
+  private readonly nameEditorDialog = viewChild<ElementRef<HTMLDialogElement>>('nameEditorDialog');
+
+  constructor() {
+    effect(() => {
+      const dialog = this.nameEditorDialog()?.nativeElement;
+      if (dialog && typeof dialog.showModal === 'function' && !dialog.open) {
+        dialog.showModal();
+      }
+    });
+  }
+
+  onNameEditorDialogClick(event: MouseEvent) {
+    if (event.target === this.nameEditorDialog()?.nativeElement) {
+      this.cancelNameEditor(event);
+    }
+  }
+
   get isSchemaLoading() {
     return this.schemaLoading;
   }
diff --git a/src/app/shared/nodes/generic-node/generic-node.html b/src/app/shared/nodes/generic-node/generic-node.html
index cca5630..3afd61e 100644
--- a/src/app/shared/nodes/generic-node/generic-node.html
+++ b/src/app/shared/nodes/generic-node/generic-node.html
@@ -534,7 +534,7 @@
     (annotationsChange)="updateBiasAnnotations($event)" />
 
   @if (localEditorOpen) {
-  <div class="llm-modal-backdrop" (pointerdown)="$event.stopPropagation()" (click)="closeSimpleParamEditor($event)">
+  <dialog #simpleEditorDialog class="llm-modal-backdrop" (pointerdown)="$event.stopPropagation()" (click)="onSimpleEditorDialogClick($event)" (cancel)="closeSimpleParamEditor($event)">
     <div class="llm-modal" (pointerdown)="$event.stopPropagation()" (click)="$event.stopPropagation()">
       <div class="llm-modal-title">Edit {{ localEditorLabel }}</div>
       @if (localEditorBindableAsInput && localEditorPath !== 'name') {
@@ -605,7 +605,7 @@
         <button type="button" class="llm-btn llm-btn-primary" [disabled]="!canSaveLocalEditor()" (pointerdown)="$event.stopPropagation()" (click)="saveSimpleParamEditor($event)">Save</button>
       </div>
     </div>
-  </div>
+  </dialog>
   }
 
 </div>
diff --git a/src/app/shared/nodes/generic-node/generic-node.ts b/src/app/shared/nodes/generic-node/generic-node.ts
index 4e13fe0..0af2bb4 100644
--- a/src/app/shared/nodes/generic-node/generic-node.ts
+++ b/src/app/shared/nodes/generic-node/generic-node.ts
@@ -1,5 +1,5 @@
 import { CommonModule } from '@angular/common';
-import { ChangeDetectionStrategy, ChangeDetectorRef, Component, effect, ElementRef, HostBinding, HostListener, inject, Input, OnDestroy } from '@angular/core';
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, effect, ElementRef, HostBinding, HostListener, inject, Input, OnDestroy, viewChild } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 import { MatTooltipModule } from '@angular/material/tooltip';
 import { BiasAnnotation, BiasAnnotationsDescriptor, BlockType, currentFlowPortValueKind, flowValueKindLabel, FlowBlock, FlowData, FlowPort, FlowValueKind, FLOW_DEPENDANT_PORT_KEY, FLOW_DEPENDENCY_PORT_KEY, isProbeExecutable, normalizeFlowPortValueKinds } from '@models/flow';
@@ -204,6 +204,14 @@ export class GenericNodeComponent implements OnDestroy {
   private conditionalRequiredByPath = new Map<string, boolean>();
   private refreshingConditionalRequirements = false;
 
+  /**
+   * This template renders inside a node card, which rete.js positions with a
+   * CSS `transform` for pan/zoom, so a plain fixed-position backdrop would be
+   * confined to the node's box. A native `<dialog>` shown via `showModal()`
+   * escapes that via the browser's top layer, same fix as bias-annotations.
+   */
+  private readonly simpleEditorDialog = viewChild<ElementRef<HTMLDialogElement>>('simpleEditorDialog');
+
   constructor() {
     effect(() => {
       const descriptorSignal = (this.blocksService as BlocksService & {
@@ -214,6 +222,19 @@ export class GenericNodeComponent implements OnDestroy {
         this.data.data.__biasAnnotationsProperty = property;
       }
     });
+
+    effect(() => {
+      const dialog = this.simpleEditorDialog()?.nativeElement;
+      if (dialog && typeof dialog.showModal === 'function' && !dialog.open) {
+        dialog.showModal();
+      }
+    });
+  }
+
+  onSimpleEditorDialogClick(event: MouseEvent) {
+    if (event.target === this.simpleEditorDialog()?.nativeElement) {
+      this.closeSimpleParamEditor(event);
+    }
   }
 
   ngOnInit() {
diff --git a/src/styles.css b/src/styles.css
index a02bd28..1ae09f4 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -166,7 +166,17 @@ body.node-focus-modal-open {
   display: flex;
   align-items: center;
   justify-content: center;
+  width: 100vw;
+  height: 100vh;
+  max-width: 100vw;
+  max-height: 100vh;
+  margin: 0;
   padding: 12px;
+  border: none;
+  background: transparent;
+  color: inherit;
+}
+.llm-modal-backdrop::backdrop {
   background: rgba(15, 23, 42, 0.45);
 }