fix(video): let the toolbar wrap on mobile — no room left for the filter field

video-app.js's toolbar isn't built from .toolbar-group, so it never got the
existing row-per-group mobile treatment. Mode buttons plus the new
All/Movies/Series control left nothing for the search field on a phone
width. Wraps now, with the filter field taking its own full-width line
like .toolbar-group's search field already does elsewhere.

1 files changed, 7 insertions, 0 deletions

diff --git a/packages/meshbay-hub/src/meshbay_hub/static/style.css b/packages/meshbay-hub/src/meshbay_hub/static/style.css
index 61404a9..975f47c 100644
--- a/packages/meshbay-hub/src/meshbay_hub/static/style.css
+++ b/packages/meshbay-hub/src/meshbay_hub/static/style.css
@@ -1859,6 +1859,13 @@ a.transfer-name {
   /* The actions sit on their own line under the toggle, and wrap within it. */
   .tb-actions { width: 100%; }
 
+  /* video-app.js's toolbar isn't built from .toolbar-group (nothing else in
+     it needs a right-hand group), so it never got the row-per-group
+     treatment above — mode buttons + the All/Movies/Series control left no
+     room at all for the filter field once both were on the same line. */
+  .video-toolbar { flex-wrap: wrap; }
+  .video-toolbar .tb-search { flex-basis: 100%; margin-left: 0; }
+
   /* Every pixel here is one the conversation does not get. */
   .group-header { margin-bottom: 10px; gap: 8px; }
   .group-tabs { margin-bottom: 10px; }