diff --git a/src/components/md-deck/CardLayer.tsx b/src/components/md-deck/CardLayer.tsx
index 4031332..6e6ee49 100644
--- a/src/components/md-deck/CardLayer.tsx
+++ b/src/components/md-deck/CardLayer.tsx
@@ -22,7 +22,6 @@ export function CardLayer(props: CardLayerProps) {
       : props.store.state.backLayerConfigs.filter((l) => l.visible)
   );
   const dimensions = () => props.store.state.dimensions!;
-  const showBounds = () => props.store.state.isEditing;
   const selectedLayer = () => props.store.state.selectedLayer;
   const draggingState = () => props.store.state.draggingState;
 
@@ -73,7 +72,7 @@ export function CardLayer(props: CardLayerProps) {
         
         return (
           <>
-            <article
+<article
               class="absolute flex flex-col items-stretch justify-center prose prose-sm cursor-pointer"
               classList={{ 
                 'ring-2 ring-blue-500 ring-offset-1': isSelected() && !draggingState()
@@ -86,20 +85,9 @@ export function CardLayer(props: CardLayerProps) {
               innerHTML={renderLayerContent(props.cardData[layer.prop])}
               onClick={(e) => handleLayerClick(layer.prop, e)}
             />
-            <Show when={showBounds() && !isSelected()}>
-              <div
-                class="absolute border-2 border-blue-500/50 pointer-events-none select-none"
-                style={{
-                  left: `${(layer.x1 - 1) * dimensions().cellWidth}mm`,
-                  top: `${(layer.y1 - 1) * dimensions().cellHeight}mm`,
-                  width: `${(layer.x2 - layer.x1 + 1) * dimensions().cellWidth}mm`,
-                  height: `${(layer.y2 - layer.y1 + 1) * dimensions().cellHeight}mm`
-                }}
-              />
-            </Show>
             <Show when={isSelected()}>
               <div
-                class="absolute border-2 border-blue-500 pointer-events-none"
+                class="absolute border-2 border-blue-500 pointer-events-none z-10"
                 style={{
                   left: `${bounds().left}mm`,
                   top: `${bounds().top}mm`,
@@ -108,7 +96,7 @@ export function CardLayer(props: CardLayerProps) {
                 }}
               />
               <div
-                class="absolute pointer-events-auto"
+                class="absolute pointer-events-auto z-10"
                 style={{
                   left: `${bounds().left}mm`,
                   top: `${bounds().top}mm`,
@@ -119,7 +107,7 @@ export function CardLayer(props: CardLayerProps) {
               />
               <Show when={!draggingState() || draggingState()?.action !== 'drag'}>
                 <div
-                  class="absolute w-4 h-4 bg-white border-2 border-blue-500 rounded-sm cursor-nwse-resize pointer-events-auto z-10"
+                  class="absolute w-4 h-4 bg-white border-2 border-blue-500 rounded-sm cursor-nwse-resize pointer-events-auto z-20"
                   style={{
                     left: `${bounds().left - 2}mm`,
                     top: `${bounds().top - 2}mm`
@@ -127,7 +115,7 @@ export function CardLayer(props: CardLayerProps) {
                   onMouseDown={(e) => handleFrameMouseDown('resize-corner', 'nw', undefined, e)}
                 />
                 <div
-                  class="absolute w-4 h-4 bg-white border-2 border-blue-500 rounded-sm cursor-nesw-resize pointer-events-auto z-10"
+                  class="absolute w-4 h-4 bg-white border-2 border-blue-500 rounded-sm cursor-nesw-resize pointer-events-auto z-20"
                   style={{
                     left: `${bounds().left + bounds().width - 2}mm`,
                     top: `${bounds().top - 2}mm`
@@ -135,7 +123,7 @@ export function CardLayer(props: CardLayerProps) {
                   onMouseDown={(e) => handleFrameMouseDown('resize-corner', 'ne', undefined, e)}
                 />
                 <div
-                  class="absolute w-4 h-4 bg-white border-2 border-blue-500 rounded-sm cursor-nesw-resize pointer-events-auto z-10"
+                  class="absolute w-4 h-4 bg-white border-2 border-blue-500 rounded-sm cursor-nesw-resize pointer-events-auto z-20"
                   style={{
                     left: `${bounds().left - 2}mm`,
                     top: `${bounds().top + bounds().height - 2}mm`
@@ -143,7 +131,7 @@ export function CardLayer(props: CardLayerProps) {
                   onMouseDown={(e) => handleFrameMouseDown('resize-corner', 'sw', undefined, e)}
                 />
                 <div
-                  class="absolute w-4 h-4 bg-white border-2 border-blue-500 rounded-sm cursor-nwse-resize pointer-events-auto z-10"
+                  class="absolute w-4 h-4 bg-white border-2 border-blue-500 rounded-sm cursor-nwse-resize pointer-events-auto z-20"
                   style={{
                     left: `${bounds().left + bounds().width - 2}mm`,
                     top: `${bounds().top + bounds().height - 2}mm`
@@ -151,7 +139,7 @@ export function CardLayer(props: CardLayerProps) {
                   onMouseDown={(e) => handleFrameMouseDown('resize-corner', 'se', undefined, e)}
                 />
                 <div
-                  class="absolute h-2 cursor-ns-resize pointer-events-auto"
+                  class="absolute h-2 cursor-ns-resize pointer-events-auto z-10"
                   style={{
                     left: `${bounds().left}mm`,
                     top: `${bounds().top - 1}mm`,
@@ -160,7 +148,7 @@ export function CardLayer(props: CardLayerProps) {
                   onMouseDown={(e) => handleFrameMouseDown('resize-edge', undefined, 'n', e)}
                 />
                 <div
-                  class="absolute h-2 cursor-ns-resize pointer-events-auto"
+                  class="absolute h-2 cursor-ns-resize pointer-events-auto z-10"
                   style={{
                     left: `${bounds().left}mm`,
                     top: `${bounds().top + bounds().height - 1}mm`,
@@ -169,7 +157,7 @@ export function CardLayer(props: CardLayerProps) {
                   onMouseDown={(e) => handleFrameMouseDown('resize-edge', undefined, 's', e)}
                 />
                 <div
-                  class="absolute w-2 cursor-ew-resize pointer-events-auto"
+                  class="absolute w-2 cursor-ew-resize pointer-events-auto z-10"
                   style={{
                     left: `${bounds().left - 1}mm`,
                     top: `${bounds().top}mm`,
@@ -178,7 +166,7 @@ export function CardLayer(props: CardLayerProps) {
                   onMouseDown={(e) => handleFrameMouseDown('resize-edge', undefined, 'w', e)}
                 />
                 <div
-                  class="absolute w-2 cursor-ew-resize pointer-events-auto"
+                  class="absolute w-2 cursor-ew-resize pointer-events-auto z-10"
                   style={{
                     left: `${bounds().left + bounds().width - 1}mm`,
                     top: `${bounds().top}mm`,