diff --git a/src/components/HeaderControls.vue b/src/components/HeaderControls.vue
index 2fe5596..301ce95 100644
--- a/src/components/HeaderControls.vue
+++ b/src/components/HeaderControls.vue
@@ -211,6 +211,9 @@ onBeforeUnmount(() => {
   gap: 1rem;
 }
 
+@media (max-width: 600px) {
+  .header-controls { gap: 0.1rem; }
+}
 /* Group search + spacer so outer gap doesn't create unwanted space */
 .search-with-spacer {
   display: flex;