fix: improve mobile layout

public/styles.css

@@ -2633,6 +2633,32 @@ p {
 	}
 }
 
+/* Compact mobile layout for overlay */
+@media (max-width: 480px) {
+	.member-overlay-content {
+		width: calc(100% - 16px);
+		margin: 8px;
+		border-radius: 12px;
+	}
+
+	.member-overlay-header {
+		padding: 12px 14px 8px;
+	}
+
+	.member-overlay-body {
+		padding: 0px;
+		max-height: calc(90vh - 80px);
+	}
+
+	.member-overlay-body .member-card .member-header {
+		padding: 12px 12px 0;
+	}
+
+	.member-overlay-body .member-card .member-details {
+		padding: 0 12px;
+	}
+}
+
 /* Test page styles */
 .test-section {
     background: rgba(255, 255, 255, 0.05);
@@ -2686,3 +2712,82 @@ p {
     color: rgba(255, 255, 255, 0.5);
     text-align: center;
 }
+
+/* Responsive design for progress and results */
+@media (max-width: 768px) {
+	.progress-info,
+	.results-summary {
+		flex-direction: column;
+		gap: 0.5rem;
+	}
+	
+	.progress-info span,
+	.results-summary span {
+		text-align: center;
+	}
+	
+	.overall-progress {
+		flex-direction: column;
+		gap: 0.75rem;
+	}
+	
+	.progress-text {
+		text-align: center;
+		min-width: auto;
+	}
+	
+	.results-actions {
+		flex-direction: column;
+		gap: 0.75rem;
+	}
+	
+	.clear-btn,
+	.refresh-btn {
+		width: 100%;
+		justify-content: center;
+	}
+}
+
+/* Mobile-responsive cluster header toolbar */
+@media (max-width: 480px) {
+	.cluster-header {
+		flex-direction: column;
+		align-items: stretch;
+		gap: 0.75rem;
+		padding: 0.75rem 0.5rem;
+	}
+	
+	.cluster-header-left {
+		display: flex;
+		justify-content: center;
+	}
+	
+	.primary-node-info {
+		flex-direction: row;
+		align-items: center;
+		gap: 0.5rem;
+		padding: 0.75rem;
+		text-align: center;
+	}
+	
+	.primary-node-label {
+		font-size: 0.95rem;
+	}
+	
+	.primary-node-ip {
+		font-size: 0.95rem;
+		padding: 0.4rem 0.6rem;
+	}
+	
+	.primary-node-refresh {
+		padding: 0.4rem;
+		margin-top: 0;
+	}
+	
+	.refresh-btn {
+		width: 100%;
+		justify-content: center;
+		padding: 0.75rem;
+		font-size: 0.95rem;
+	}
+}