Desktop Tab-Grid: Gesundheit (5 Sp.), Admin (4 Sp.), Karte-Legende (8 Sp.), SW by-v332

backend/static/css/layout.css

@@ -641,6 +641,46 @@
     white-space:     nowrap;
   }
 
+  /* Gesundheit: Tabs auf 2 Zeilen */
+  #page-health .by-tabs {
+    display:               grid;
+    grid-template-columns: repeat(var(--health-tab-cols, 5), minmax(0, 1fr));
+    overflow:              visible;
+    gap:                   var(--space-1);
+    padding-bottom:        var(--space-2);
+  }
+  #page-health .by-tabs .by-tab {
+    justify-content: center;
+    text-align:      center;
+    white-space:     nowrap;
+  }
+
+  /* Admin: Tabs auf 2 Zeilen */
+  #page-admin .adm-tabs {
+    display:               grid;
+    grid-template-columns: repeat(var(--adm-tab-cols, 4), minmax(0, 1fr));
+    overflow:              visible;
+    gap:                   var(--space-1);
+    padding-bottom:        var(--space-2);
+  }
+  #page-admin .adm-tabs .by-tab {
+    justify-content: center;
+    text-align:      center;
+    white-space:     nowrap;
+  }
+
+  /* Karte: Legende auf 2 Zeilen */
+  .map-legend {
+    display:               grid;
+    grid-template-columns: repeat(var(--map-legend-cols, 8), minmax(0, 1fr));
+    overflow:              visible;
+    flex-wrap:             wrap;
+    gap:                   var(--space-1);
+  }
+  .map-legend .map-legend-btn {
+    justify-content: center;
+  }
+
   /* Suche + Threads volle Breite */
   .forum-main-col {
     display:        flex;

backend/static/js/app.js

@@ -3,7 +3,7 @@
    Router, State-Management, Navigation, Initialisierung.
    ============================================================ */
 
-const APP_VER = '319'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
+const APP_VER = '320'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
 
 const App = (() => {
 

backend/static/js/pages/admin.js

@@ -56,6 +56,8 @@ window.Page_admin = (() => {
         <div id="adm-content"></div>
     `;
 
+    _container.querySelector('#adm-tabs')
+      ?.style.setProperty('--adm-tab-cols', Math.ceil(TABS.length / 2));
     _container.querySelectorAll('#adm-tabs .by-tab').forEach(btn => {
       btn.addEventListener('click', () => {
         _tab = btn.dataset.tab;

backend/static/js/pages/health.js

@@ -290,6 +290,8 @@ window.Page_health = (() => {
         ${t.icon} ${t.label}
       </button>
     `).join('');
+    const count = tabsEl.querySelectorAll('.by-tab').length;
+    tabsEl.style.setProperty('--health-tab-cols', Math.ceil(count / 2));
     tabsEl.querySelectorAll('.by-tab').forEach(btn => {
       btn.addEventListener('click', () => {
         _activeTab = btn.dataset.tab;

backend/static/js/pages/map.js

@@ -231,6 +231,10 @@ window.Page_map = (() => {
       </div>
     `;
 
+    const legendBtns = Object.keys(TYPEN).filter(k => k !== 'giftkoeder').length + 1; // +1 Alle-Btn
+    document.getElementById('map-legend')
+      ?.style.setProperty('--map-legend-cols', Math.ceil(legendBtns / 2));
+
     document.getElementById('map-legend').addEventListener('click', e => {
       const btn = e.target.closest('.map-legend-btn');
       if (!btn) return;

backend/static/sw.js

@@ -3,7 +3,7 @@
    Offline-Cache + Push Notifications + Tile-Cache
    ============================================================ */
 
-const CACHE_VERSION = 'by-v331';
+const CACHE_VERSION = 'by-v332';
 const CACHE_STATIC  = `${CACHE_VERSION}-static`;
 const CACHE_TILES   = 'ban-yaro-tiles-v1';  // bleibt über SW-Updates erhalten