feat: memberlist filter

public/styles/main.css

@@ -95,7 +95,10 @@ p {
 }
 
 .cluster-header-left {
-    /* Placeholder for future content if needed */
+    display: flex;
+    align-items: center;
+    gap: 1rem;
+    flex-wrap: wrap;
 }
 
 .primary-node-info {
@@ -176,6 +179,95 @@ p {
     background: rgba(255, 255, 255, 0.1);
 }
 
+/* Cluster Filters */
+.cluster-filters {
+    display: flex;
+    align-items: center;
+}
+
+.filter-group {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    padding: 0.4rem 0.75rem;
+    background: rgba(255, 255, 255, 0.05);
+    border-radius: 6px;
+    border: 1px solid rgba(255, 255, 255, 0.1);
+}
+
+.filter-label {
+    font-size: 0.85rem;
+    color: var(--text-secondary);
+    white-space: nowrap;
+}
+
+.filter-select {
+    background: rgba(255, 255, 255, 0.08);
+    border: 1px solid rgba(255, 255, 255, 0.15);
+    border-radius: 4px;
+    color: var(--text-primary);
+    font-size: 0.85rem;
+    padding: 0.3rem 0.5rem;
+    min-width: 120px;
+    cursor: pointer;
+    transition: all 0.2s ease;
+}
+
+.filter-select:hover {
+    background: rgba(255, 255, 255, 0.12);
+    border-color: rgba(255, 255, 255, 0.2);
+}
+
+.filter-select:focus {
+    outline: none;
+    background: rgba(255, 255, 255, 0.15);
+    border-color: var(--accent-color);
+    box-shadow: 0 0 0 2px rgba(var(--accent-color-rgb), 0.2);
+}
+
+.filter-select option {
+    background: #1a202c;
+    color: var(--text-primary);
+    padding: 0.75rem 1rem;
+    font-size: 0.85rem;
+    font-weight: 500;
+    border: none;
+}
+
+.filter-select option:hover {
+    background: #2d3748;
+}
+
+.filter-select option:checked {
+    background: #667eea;
+    color: var(--text-primary);
+    font-weight: 600;
+}
+
+.clear-filters-btn {
+    background: rgba(255, 255, 255, 0.08);
+    border: 1px solid rgba(255, 255, 255, 0.15);
+    border-radius: 4px;
+    color: var(--text-secondary);
+    padding: 0.3rem;
+    cursor: pointer;
+    transition: all 0.2s ease;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.clear-filters-btn:hover {
+    background: rgba(255, 255, 255, 0.12);
+    border-color: rgba(255, 255, 255, 0.2);
+    color: var(--text-primary);
+}
+
+.clear-filters-btn:disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+}
+
 .primary-node-refresh:active {
     transform: scale(0.95);
 }
@@ -4002,9 +4094,39 @@ select.param-input:focus {
 	
 	.cluster-header-left {
 		display: flex;
+		flex-direction: column;
+		gap: 0.75rem;
+		align-items: stretch;
+	}
+	
+	.cluster-filters {
 		justify-content: center;
 	}
 	
+	.filter-group {
+		flex-direction: column;
+		gap: 0.5rem;
+		padding: 0.75rem;
+		width: 100%;
+	}
+	
+	.filter-label {
+		text-align: center;
+		font-size: 0.9rem;
+	}
+	
+	.filter-select {
+		width: 100%;
+		min-width: auto;
+		padding: 0.5rem;
+		font-size: 0.9rem;
+	}
+	
+	.clear-filters-btn {
+		align-self: center;
+		padding: 0.5rem;
+	}
+	
 	.primary-node-info {
 		flex-direction: row;
 		align-items: center;