diff --git a/app/static/css/style.css b/app/static/css/style.css
index db5b849..33bd99d 100644
--- a/app/static/css/style.css
+++ b/app/static/css/style.css
@@ -175,6 +175,62 @@ main {
         padding: 0.3rem !important;
         font-size: 0.7rem;
     }
+
+    /* Navbar: Hide "Refresh" text on mobile, show only icon */
+    #refreshBtn .btn-text {
+        display: none;
+    }
+
+    /* Navbar: Reduce gap between elements */
+    .navbar .d-flex {
+        gap: 0.25rem !important;
+    }
+
+    /* Navbar: Smaller selectors on mobile */
+    #channelSelector,
+    #dateSelector {
+        min-width: 80px !important;
+        font-size: 0.75rem;
+        padding: 0.25rem 0.5rem;
+    }
+
+    /* Navbar: Smaller buttons */
+    .navbar .btn-sm {
+        padding: 0.25rem 0.4rem;
+        font-size: 0.875rem;
+    }
+
+    /* Modal: Better mobile layout */
+    .modal-dialog {
+        margin: 0.5rem;
+    }
+
+    .modal-body {
+        padding: 0.75rem;
+    }
+
+    /* Modal: Smaller channel keys on mobile */
+    .list-group-item small {
+        font-size: 0.65rem;
+        word-break: break-all;
+    }
+
+    /* Modal: Compact channel list */
+    .list-group-item {
+        padding: 0.5rem;
+    }
+
+    /* Modal: Stack buttons vertically on very small screens */
+    @media (max-width: 400px) {
+        .btn-group {
+            flex-direction: column;
+        }
+
+        .btn-group .btn {
+            border-radius: 0.375rem !important;
+            margin-bottom: 0.25rem;
+        }
+    }
 }
 
 /* Loading State */
diff --git a/app/templates/base.html b/app/templates/base.html
index 5db61bd..9ec9adf 100644
--- a/app/templates/base.html
+++ b/app/templates/base.html
@@ -34,7 +34,7 @@
             </span>
             <div class="d-flex align-items-center gap-2">
                 <button class="btn btn-outline-light btn-sm" id="refreshBtn" title="Refresh messages">
-                    <i class="bi bi-arrow-clockwise"></i> Refresh
+                    <i class="bi bi-arrow-clockwise"></i> <span class="btn-text">Refresh</span>
                 </button>
                 <select id="channelSelector" class="form-select form-select-sm" style="width: auto; min-width: 120px;" title="Select channel">
                     <option value="0">Public</option>