fix(mobile): activity-filter-grid scrollable horizontal con flechas

- mobile.css: añadidas reglas para .activity-filter-grid en móvil
  (display:contents para activity-filter-col, flex row scrollable)
- mobile-ui.js: extendido selector para procesar también
  .activity-filter-grid con flechas y expand/collapse

Antes los 6 columnas de filtros se renderizaban como barras
naranjas verticales. Ahora se aplanan a una sola fila con
scroll horizontal y flechas < > para navegar.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

nodejs-project/nodejs-project/src/client/assets/styles/mobile.css

@@ -800,3 +800,57 @@ pre, code {
   cursor: pointer !important;
   letter-spacing: 0.02em !important;
 }
+
+/* ============================================================
+   ACTIVITY FILTER GRID (activity_view.js)
+   En móvil: aplanar las 6 columnas a una fila scrollable
+   ============================================================ */
+.activity-filter-grid {
+  display: flex !important;
+  flex-direction: row !important;
+  flex-wrap: nowrap !important;
+  overflow-x: auto !important;
+  overflow-y: hidden !important;
+  -webkit-overflow-scrolling: touch !important;
+  gap: 6px !important;
+  padding-bottom: 4px !important;
+  scrollbar-width: none !important;
+  width: 100% !important;
+  margin-top: 0 !important;
+}
+.activity-filter-grid::-webkit-scrollbar { display: none !important; }
+
+.activity-filter-grid .activity-filter-col {
+  display: contents !important;
+}
+
+.activity-filter-grid form {
+  flex-shrink: 0 !important;
+  width: auto !important;
+  margin: 0 !important;
+}
+
+.activity-filter-grid .filter-btn {
+  width: auto !important;
+  white-space: nowrap !important;
+  padding: 8px 14px !important;
+  min-height: 40px !important;
+  font-size: 0.85rem !important;
+}
+
+/* Wrapper aplica también al activity-filter-grid */
+.mode-buttons-wrap .activity-filter-grid {
+  flex: 1 !important;
+  overflow-x: auto !important;
+  flex-wrap: nowrap !important;
+  scrollbar-width: none !important;
+  scroll-behavior: smooth !important;
+  padding-bottom: 4px !important;
+}
+.mode-buttons-wrap .activity-filter-grid::-webkit-scrollbar {
+  display: none !important;
+}
+.mode-buttons-wrap.mode-buttons-expanded .activity-filter-grid {
+  overflow-x: visible !important;
+  flex-wrap: wrap !important;
+}

nodejs-project/nodejs-project/src/client/public/js/mobile-ui.js

@@ -2,7 +2,7 @@
   function setup() {
     if (window.innerWidth > 768) return;
 
-    document.querySelectorAll('.mode-buttons:not([data-ms])').forEach(function (cnt) {
+    document.querySelectorAll('.mode-buttons:not([data-ms]), .activity-filter-grid:not([data-ms])').forEach(function (cnt) {
       cnt.dataset.ms = '1';
 
       var items = cnt.querySelectorAll('form, button.filter-btn, a.filter-btn');