diff --git a/static/css/app.css b/static/css/app.css
index 3cb6623..7fe08f1 100644
--- a/static/css/app.css
+++ b/static/css/app.css
@@ -149,7 +149,7 @@ a:hover {
 .main-content {
   max-width: 1100px;
   margin: 0 auto;
-  padding: calc(var(--nav-h) + 0.75rem) 1.5rem calc(var(--bar-h) + 2rem);
+  padding: calc(var(--nav-h) + 3rem) 1.5rem calc(var(--bar-h) + 2rem);
   height: 100%;
   overflow-y: auto;
 }
@@ -315,6 +315,18 @@ a:hover {
   gap: 0;
 }
 
+/* Haupttab-Leiste: immer sichtbar unterhalb der Navbar */
+#tabs {
+  position: fixed;
+  top: var(--nav-h);
+  left: 0;
+  right: 0;
+  z-index: 150;
+  background: var(--bg);
+  margin-bottom: 0;
+  padding: 0 0.5rem;
+}
+
 .tab-btn {
   background: none;
   border: none;
@@ -736,7 +748,10 @@ a:hover {
 
 @media (max-width: 600px) {
   .main-content {
-    padding: calc(var(--nav-h) + 0.5rem) 0.75rem calc(var(--bar-h) + 1.5rem);
+    padding: calc(var(--nav-h) + 3rem) 0.75rem calc(var(--bar-h) + 1.5rem);
+  }
+  #tabs {
+    padding: 0 0.25rem;
   }
 
   .now-playing-bar {
@@ -1486,20 +1501,6 @@ body.dnd-mode .timer-display {
   padding: 4px 0 8px;
 }
 
-.offline-banner {
-  position: fixed;
-  top: var(--nav-h);
-  left: 0;
-  right: 0;
-  background: var(--accent);
-  color: #fff;
-  text-align: center;
-  font-size: 12px;
-  padding: 4px 8px;
-  z-index: 250;
-  pointer-events: none;
-}
-
 .book-key-bar {
   display: flex;
   align-items: center;
diff --git a/static/js/app.js b/static/js/app.js
index 5eeb975..ac1f457 100644
--- a/static/js/app.js
+++ b/static/js/app.js
@@ -1040,22 +1040,9 @@ const TOP_TABS = ['radio', 'focus', 'podcasts', 'books'];
 const RADIO_SUB_TABS = ['search', 'saved', 'history'];
 
 function showOfflineBanner(offline) {
-  let banner = $('offline-banner');
-  if (offline) {
-    if (!banner) {
-      banner = document.createElement('div');
-      banner.id = 'offline-banner';
-      banner.className = 'offline-banner';
-      banner.textContent = 'Offline — nur gecachte Bücher verfügbar';
-      document.body.prepend(banner);
-    }
-    const uploadArea = $('book-upload-area');
-    if (uploadArea) uploadArea.style.display = 'none';
-  } else {
-    if (banner) banner.remove();
-    const uploadArea = $('book-upload-area');
-    if (uploadArea) uploadArea.style.display = '';
-  }
+  document.body.classList.toggle('app-offline', offline);
+  const uploadArea = $('book-upload-area');
+  if (uploadArea) uploadArea.style.display = offline ? 'none' : '';
 }
 
 function showTab(name) {
diff --git a/static/js/sw.js b/static/js/sw.js
index 83d3bb8..8b05f8a 100644
--- a/static/js/sw.js
+++ b/static/js/sw.js
@@ -2,7 +2,7 @@
  * diora service worker — caches the app shell for offline use.
  */
 
-const CACHE = 'diora-v10';
+const CACHE = 'diora-v11';
 const PODCAST_CACHE = 'diora-podcast-v1';
 const SHELL = [
   '/static/css/app.css',