Distinguish active and inactive workflow nodes

web/css/resolver-main.css

@@ -5546,6 +5546,18 @@ button.mr-info-link:disabled {
     font-weight: 500;
 }
 
+.mr-image-transfer-node-status {
+    font-weight: 650;
+}
+
+.mr-image-transfer-node-status.is-active {
+    color: var(--mr-color-success-action, var(--mr-accent, #72d38a));
+}
+
+.mr-image-transfer-node-status.is-inactive {
+    color: var(--mr-text-dim, var(--mr-text-muted));
+}
+
 .mr-image-transfer-node-preview {
     display: flex;
     flex-direction: column;

web/resolver/views/tabs_image_metadata_methods.js

@@ -1294,7 +1294,7 @@ export const imageMetadataMethods = {
                         <span class="mr-image-transfer-node-check" aria-hidden="true">${selected ? '✓' : ''}</span>
                         <span class="mr-image-transfer-node-details">
                             <span class="mr-image-transfer-node-name">${this.escapeHtml(nodeName)} · Node ${this.escapeHtml(node.nodeId)}${this.escapeHtml(scopeLabel)}</span>
-                            <span class="mr-image-transfer-node-meta">${this.escapeHtml(nodeType)} · ${countText(node.refs.length, 'model slot')}${node.active ? ' · Active' : ' · Inactive'}</span>
+                            <span class="mr-image-transfer-node-meta">${this.escapeHtml(nodeType)} · ${countText(node.refs.length, 'model slot')} · <span class="mr-image-transfer-node-status ${node.active ? 'is-active' : 'is-inactive'}">${node.active ? 'Active' : 'Inactive'}</span></span>
                         </span>
                     </button>
                     <div class="mr-image-transfer-node-preview">${previewHtml}</div>