diff --git a/src/renderer-streamers.ts b/src/renderer-streamers.ts
index d352fd7..15931ad 100644
--- a/src/renderer-streamers.ts
+++ b/src/renderer-streamers.ts
@@ -423,7 +423,7 @@ function renderStreamers(): void {
     const showFilter = all.length >= STREAMER_FILTER_THRESHOLD;
     if (filterInput) filterInput.style.display = showFilter ? '' : 'none';
     // Compact title margin when filter is shown — avoids double gap.
-    if (sectionTitle) sectionTitle.style.marginBottom = showFilter ? '4px' : '';
+    if (sectionTitle) sectionTitle.classList.toggle('compact', showFilter);
 
     // Empty state — small hint inside the sidebar when no streamers have
     // been added yet. Without this the user sees a heading + blank space
diff --git a/src/styles.css b/src/styles.css
index c6ed1b0..cabc77b 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -120,6 +120,14 @@ body {
     gap: 8px;
 }
 
+/* Compact spacing variant — applied when the sidebar's streamer-list
+   filter input is visible directly below the title, so the default
+   padding-bottom + the filter's own margin don't double up into a
+   visually loose gap. */
+.section-title.compact {
+    margin-bottom: 4px;
+}
+
 .streamers {
     flex: 1;
     overflow-y: auto;