feat(webui): centralize contextual table actions

webui/src/styles/badges.css

@@ -1,6 +1,6 @@
 .status-badge { display: inline-flex; align-items: center; height: 24px; border-radius: 99px; padding: 0 9px; font-size: 12px; font-weight: 800; background: var(--status-neutral-bg); color: var(--text-soft); text-transform: uppercase; }
 .status-ready, .status-sent, .status-appended, .status-success, .status-active { background: var(--success-soft); color: var(--success-text-strong); }
 .status-warning, .status-needs-review, .status-pending { background: var(--warning-soft); color: var(--warning-text-strong); }
-.status-blocked, .status-failed, .status-failed-permanent { background: var(--danger-bg); color: var(--danger-text-strong); }
+.status-blocked, .status-error, .status-danger, .status-failed, .status-failed-permanent { background: var(--danger-bg); color: var(--danger-text-strong); }
 .status-queued, .status-sending { background: var(--info-soft); color: var(--info-text-strong); }
 .status-inactive, .status-locked { background: var(--status-neutral-bg); color: var(--text-soft); }

webui/src/styles/components.css

@@ -117,10 +117,6 @@
   font-size: 12px;
   line-height: 1.35;
 }
-.recipient-editor-table th:nth-child(2),
-.recipient-editor-table td:nth-child(2) { min-width: 430px; }
-.recipient-editor-table th:last-child,
-.recipient-editor-table td:last-child { width: 92px; text-align: right; }
 .recipient-field-input,
 .recipient-attachments-input {
   min-width: 150px;
@@ -957,15 +953,6 @@
   align-self: start;
 }
 
-.admin-icon-actions {
-  display: grid;
-  grid-auto-flow: column;
-  grid-auto-columns: 36px;
-  justify-content: end;
-  gap: 5px;
-  width: 100%;
-}
-
 .admin-icon-button.btn {
   display: inline-grid;
   place-items: center;
@@ -985,11 +972,19 @@
   gap: 14px;
 }
 
+.admin-form-grid > .wide {
+  grid-column: 1 / -1;
+}
+
 .admin-form-grid.two-columns,
 .admin-assignment-grid {
   grid-template-columns: repeat(2, minmax(0, 1fr));
 }
 
+.admin-form-grid.three-columns {
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+}
+
 .admin-assignment-grid {
   display: grid;
   gap: 18px;
@@ -1034,6 +1029,7 @@
 
 @media (max-width: 850px) {
   .admin-form-grid.two-columns,
+  .admin-form-grid.three-columns,
   .admin-assignment-grid,
   .admin-permission-groups {
     grid-template-columns: 1fr;
@@ -1803,6 +1799,27 @@
   white-space: nowrap;
 }
 
+.split-field-action {
+  gap: 0;
+}
+
+.split-field-action > input,
+.split-field-action > select,
+.split-field-action > textarea {
+  border-top-right-radius: 0 !important;
+  border-bottom-right-radius: 0 !important;
+}
+
+.split-field-action > button,
+.split-field-action > .button,
+.split-field-action > .btn {
+  align-self: stretch;
+  margin-left: -1px;
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+  box-shadow: none;
+}
+
 .field-input-missing {
   border-color: var(--danger-border-deep) !important;
   box-shadow: var(--danger-focus-ring) !important;

webui/src/styles/forms.css

@@ -1,10 +1,25 @@
 .form-grid { display: grid; gap: 18px; }
-.form-grid.compact { grid-template-columns: 1fr 1fr; }
+.form-grid.compact,
+.form-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
+.form-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
+.form-grid.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
+.form-grid > .wide { grid-column: 1 / -1; }
+.responsive-form-grid { align-items: start; }
 .form-field { display: grid; gap: 7px; }
 .form-label { font-weight: 700; font-size: 13px; color: var(--text-label); }
 .form-help { font-size: 12px; color: var(--muted); }
 input, select, textarea { border: var(--border-line); border-radius: 5px; background: var(--surface); font: inherit; padding: 10px 12px; color: var(--text); width: 100%; box-shadow: var(--shadow-control-inset); }
 textarea { resize: vertical; }
+
+@media (max-width: 1100px) {
+  .form-grid.compact.responsive-form-grid { grid-template-columns: 1fr; }
+}
+
+@media (max-width: 980px) {
+  .form-grid.two,
+  .form-grid.three,
+  .form-grid.four { grid-template-columns: 1fr; }
+}
 .form-field:has(input:disabled, select:disabled, textarea:disabled, input[readonly], textarea[readonly]) .form-label { color: var(--control-disabled-label); }
 input:disabled:not([type="checkbox"]):not([type="radio"]),
 select:disabled,

webui/src/styles/tables.css

@@ -653,17 +653,17 @@
   padding: 8px 10px;
 }
 
-/* Consistent row-level collection actions for editable DataGrid tables. */
-.data-grid-row-actions {
-  display: grid;
-  grid-template-columns: repeat(4, 36px);
+/* Consistent, context-aware row actions for tables and DataGrids. */
+.table-action-group {
+  display: flex;
+  flex-wrap: nowrap;
   align-items: center;
   justify-content: end;
   gap: 4px;
   width: 100%;
 }
 
-.data-grid-row-action.btn {
+.table-action-button.btn {
   display: inline-grid;
   place-items: center;
   width: 36px;
@@ -672,10 +672,20 @@
   padding: 0;
 }
 
-.data-grid-row-action.btn:disabled {
+.table-action-button.btn:disabled {
   opacity: .45;
 }
 
+.table-action-button.btn svg {
+  width: 17px;
+  height: 17px;
+}
+
+.table-action-icon {
+  display: inline-grid;
+  place-items: center;
+}
+
 .data-grid-empty-message {
   color: var(--muted);
   min-height: 64px;