frontend/src/components/posts/PostsFilterBar.vue

@@ -13,7 +13,7 @@
       clearable
       no-filter
       return-object
-      style="min-width: 240px"
+      class="fc-posts-filters__artist"
       @update:search="onArtistSearch"
       @update:model-value="onArtistPicked"
     />
@@ -25,7 +25,7 @@
       density="compact"
       hide-details
       clearable
-      style="min-width: 180px"
+      class="fc-posts-filters__platform"
       @update:model-value="emitFilters"
     />
 
@@ -135,6 +135,14 @@ watch(() => props.platform, (val) => {
   display: flex;
   gap: 0.75rem;
   align-items: center;
+  flex-wrap: wrap;
   padding-bottom: 1rem;
 }
+.fc-posts-filters__artist { min-width: 240px; flex: 1 1 240px; max-width: 360px; }
+.fc-posts-filters__platform { min-width: 180px; flex: 1 1 180px; max-width: 240px; }
+/* Phones: each field takes a full-width row instead of overflowing. */
+@media (max-width: 600px) {
+  .fc-posts-filters__artist,
+  .fc-posts-filters__platform { min-width: 100%; max-width: none; flex-basis: 100%; }
+}
 </style>

frontend/src/components/subscriptions/SubscriptionsTab.vue

@@ -26,14 +26,14 @@
         :items="STATUS_OPTIONS"
         :disabled="needsAttention"
         density="compact" variant="outlined" hide-details
-        style="max-width: 180px"
+        class="fc-subs__status"
       />
       <v-text-field
         v-model="search"
         density="compact" variant="outlined" hide-details clearable
         prepend-inner-icon="mdi-magnify"
         placeholder="Search subscriptions"
-        style="max-width: 320px"
+        class="fc-subs__search"
       />
     </div>
 
@@ -568,6 +568,14 @@ async function bulkDelete() {
   padding: 8px 0 1rem;
 }
 .fc-subs__bar .v-chip { cursor: pointer; }
+.fc-subs__status { max-width: 180px; }
+.fc-subs__search { max-width: 320px; flex: 1 1 200px; }
+/* Phones: status + search each take a full-width row; drop the spacer that
+   would otherwise eat a row pushing them around. */
+@media (max-width: 600px) {
+  .fc-subs__status, .fc-subs__search { max-width: none; flex-basis: 100%; }
+  .fc-subs__bar :deep(.v-spacer) { display: none; }
+}
 .fc-subs__loading, .fc-subs__empty {
   display: flex; justify-content: center; padding: 2rem;
   color: rgb(var(--v-theme-on-surface-variant));