优化交互

src/index.css

@@ -99,16 +99,6 @@ body {
   color: var(--color-ps-accent);
 }
 
-.ps-tool-btn.active::before {
-  content: '';
-  position: absolute;
-  left: 0;
-  top: 0;
-  bottom: 0;
-  width: 2px;
-  background: var(--color-ps-accent);
-}
-
 .ps-options-bar {
   height: 36px;
   background: var(--color-ps-header);
@@ -672,6 +662,33 @@ body {
   outline-offset: 0;
 }
 
+.ps-unselected-dim-layer {
+  position: absolute;
+  inset: 0;
+  overflow: hidden;
+  pointer-events: none;
+  z-index: 2;
+  opacity: 0;
+  transition: opacity 0.12s ease;
+}
+
+.ps-unselected-dim-layer--visible {
+  opacity: 1;
+}
+
+.ps-unselected-dim {
+  position: absolute;
+  background: rgba(255, 255, 255, 0.3);
+}
+
+.ps-selected-lift-layer {
+  position: absolute;
+  inset: 0;
+  overflow: hidden;
+  pointer-events: none;
+  z-index: 3;
+}
+
 .ps-handle {
   position: absolute;
   width: 8px;
@@ -1350,6 +1367,26 @@ body {
     border-right: 1px solid #1a1a1a;
   }
 
+  .mobile-design-props-nav-spacer {
+    flex: 1;
+    min-height: 8px;
+  }
+
+  .mobile-design-props-nav-delete:disabled {
+    opacity: 0.35;
+    cursor: not-allowed;
+  }
+
+  .mobile-design-props-nav-delete:not(:disabled) {
+    color: #e57373;
+  }
+
+  .mobile-design-props-nav-delete:not(:disabled).active,
+  .mobile-design-props-nav-delete:not(:disabled):active {
+    background: rgba(239, 68, 68, 0.18);
+    color: #fca5a5;
+  }
+
   .mobile-design-props-nav-btn {
     display: flex;
     flex-direction: column;