Cleaned a bit more

tools/editor/styles/components/btn.css

@@ -19,6 +19,10 @@
   margin-top: 0.375rem;
 }
 
+.btn:hover:not(:disabled) {
+  border-color: var(--accent-dim);
+}
+
 .btn:disabled {
   opacity: 0.35;
   cursor: not-allowed;

tools/editor/styles/components/empty-state.css

@@ -1,6 +1,9 @@
 /* Component – Empty state */
 
 .empty-state {
+  background: var(--bg-surface);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
   border-style: dashed;
   padding: 3rem;
   text-align: center;

tools/editor/styles/components/load-area.css

@@ -14,5 +14,6 @@
 
 .load-area:hover,
 .load-area.drag-over {
+  border-color: var(--accent-dim);
   color: var(--text);
 }

tools/editor/styles/components/tool-card.css

@@ -1,6 +1,9 @@
 /* Component – Tool card */
 
 .tool-card {
+  background: var(--bg-surface);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
   padding: 1.25rem;
   display: flex;
   flex-direction: column;
@@ -11,6 +14,7 @@
 }
 
 .tool-card:hover {
+  border-color: var(--accent-dim);
   text-decoration: none;
 }
 

tools/editor/styles/components/tool-panel.css

@@ -1,6 +1,9 @@
 /* Component – Tool panel */
 
 .tool-panel {
+  background: var(--bg-surface);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
   width: 210px;
   flex-shrink: 0;
   overflow: hidden;

tools/editor/styles/components/tool-preview.css

@@ -1,8 +1,15 @@
 /* Component – Tool preview */
 
 .tool-preview {
+  background: var(--bg-surface);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
   flex: 1;
   position: relative;
   min-height: 300px;
   transition: border-color var(--speed);
 }
+
+.tool-preview.drag-over {
+  border-color: var(--accent-dim);
+}

tools/editor/styles/main.css

@@ -5,7 +5,6 @@
 @import "elements.css";
 
 /* Objects */
-@import "objects/surface.css";
 @import "objects/section-label.css";
 @import "objects/page.css";
 @import "objects/section.css";

tools/editor/styles/objects/surface.css

@@ -1,19 +0,0 @@
-/* Object – Shared surface base (background, border, radius) */
-
-.tool-card,
-.tool-panel,
-.tool-preview,
-.empty-state {
-  background: var(--bg-surface);
-  border: 1px solid var(--border);
-  border-radius: var(--radius);
-}
-
-/* Hover accent border – interactive surfaces that highlight on focus/drag */
-.tool-card:hover,
-.btn:hover:not(:disabled),
-.load-area:hover,
-.load-area.drag-over,
-.tool-preview.drag-over {
-  border-color: var(--accent-dim);
-}