Bottom nav: flex space-around for proper edge-to-edge distribution

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

app.js

@@ -1309,8 +1309,8 @@ function switchNavMode(mode){
   const lib=document.getElementById('bnav-library');
   const disc=document.getElementById('bnav-discover');
   if(!lib||!disc)return;
-  lib.style.display=mode==='library'?'grid':'none';
-  disc.style.display=mode==='discover'?'grid':'none';
+  lib.style.display=mode==='library'?'flex':'none';
+  disc.style.display=mode==='discover'?'flex':'none';
   document.getElementById('bnav-tab-library')?.classList.toggle('active',mode==='library');
   document.getElementById('bnav-tab-discover')?.classList.toggle('active',mode==='discover');
 }

styles.css

@@ -386,7 +386,7 @@ nav{flex:1;overflow-y:auto;padding:4px 10px}
 .bnav-tabs{display:flex;width:100%;padding:4px 8px 2px;flex-shrink:0;gap:4px}
 .bnav-tab{flex:1;padding:3px 0;border-radius:7px;border:none;font-family:var(--font);font-size:10px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--text3);cursor:pointer;background:none;transition:color .15s,background .15s;-webkit-tap-highlight-color:transparent}
 .bnav-tab.active{background:var(--surface2);color:var(--text)}
-.bnav-pages{display:grid;grid-template-columns:repeat(4,1fr);align-items:stretch;width:100%;flex:1}
+.bnav-pages{display:flex;justify-content:space-around;align-items:center;width:100%;flex:1;padding:0 8px}
 
 @media(max-width:768px){
   .bottom-nav{display:flex;flex-direction:column;justify-content:flex-start}
@@ -399,8 +399,8 @@ nav{flex:1;overflow-y:auto;padding:4px 10px}
   .preview-bar{bottom:calc(var(--player-h) + 80px)}
   .toast-container{bottom:calc(var(--player-h) + 80px + 16px)}
   .jobs-panel{bottom:calc(var(--player-h) + 80px + 16px)}
-  .bnav-pages{grid-template-columns:repeat(4,1fr)}
-  .bnav-item{min-width:0;width:100%;padding:6px 2px;box-sizing:border-box}
+  .bnav-pages{padding:0 4px}
+  .bnav-item{flex:1;min-width:0;padding:6px 2px;box-sizing:border-box}
   #settings-modal{align-items:flex-start;padding-top:max(env(safe-area-inset-top),16px);padding-bottom:calc(var(--player-h) + 80px + env(safe-area-inset-bottom) + 8px)}
   #settings-modal .modal{max-height:100%!important;overflow:hidden}
 }

sw.js

@@ -1,4 +1,4 @@
-const CACHE = 'ns-v13';
+const CACHE = 'ns-v14';
 const PRECACHE = ['/', 'index.html', 'styles.css', 'app.js', 'sw.js'];
 const SKIP_URLS = ['/rest/stream', '/rest/download', '/config.js'];