Refine invoice template editor interactions

frontend/src/styles/global.css

@@ -810,8 +810,7 @@ a {
 
 .invoice-template__palette {
   display: grid;
-  gap: 10px;
-  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 18px;
   min-height: 0;
   overflow-y: auto;
   padding-right: 6px;
@@ -819,6 +818,25 @@ a {
   scrollbar-gutter: stable;
 }
 
+.invoice-template__palette-group {
+  display: grid;
+  gap: 10px;
+}
+
+.invoice-template__palette-group-header h5 {
+  margin: 0;
+  color: var(--muted);
+  font-size: 0.8rem;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+
+.invoice-template__palette-grid {
+  display: grid;
+  gap: 10px;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+}
+
 .invoice-template__tile {
   display: grid;
   gap: 6px;
@@ -880,7 +898,7 @@ a {
   min-width: 794px;
   height: 1123px;
   border: 1px dashed rgba(17, 109, 99, 0.22);
-  border-radius: 32px;
+  border-radius: 0;
   background:
     linear-gradient(180deg, rgba(17, 109, 99, 0.03), transparent 18%),
     linear-gradient(transparent 31px, rgba(37, 49, 58, 0.05) 32px),
@@ -902,7 +920,7 @@ a {
   position: absolute;
   inset: 28px;
   border: 1px solid rgba(37, 49, 58, 0.05);
-  border-radius: 20px;
+  border-radius: 0;
   pointer-events: none;
 }
 
@@ -942,6 +960,10 @@ a {
   background: rgba(17, 109, 99, 0.08);
 }
 
+.invoice-template__canvas-element.is-selected {
+  border-radius: 0;
+}
+
 .invoice-template__canvas-element.is-dragging {
   cursor: grabbing;
   z-index: 2;
@@ -1141,7 +1163,7 @@ a {
     padding-right: 0;
   }
 
-  .invoice-template__palette {
+  .invoice-template__palette-grid {
     grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
   }