Keep the audiobooks frame alive when switching tabs

The frame was rebuilt with the page content on every route change, which
stopped playback. It now lives outside the view and is only shown or hidden.

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

public/style.css

@@ -194,3 +194,10 @@ input[type=search] { width: 100%; min-height: 44px; padding: 0 14px; border-radi
 
 /* Editor inside the Office tab: keep the nav, drop the page padding so the editor fills the space */
 body.inedit #view { padding: 0; display: flex; flex-direction: column; }
+
+/* Audiobooks frame lives outside #view so it keeps playing when you change tabs */
+#audiowrap.off { position: fixed; left: -9999px; top: 0; width: 360px; height: 480px; overflow: hidden; }
+#audiowrap.on { flex: 1; min-height: 0; padding: 0 calc(var(--sar) + 16px) 16px calc(var(--sal) + 16px); }
+#audiowrap iframe { width: 100%; height: 100%; border: 1px solid var(--line); border-radius: 16px; background: var(--panel); }
+body.onaudio #view { flex: none; overflow: visible; padding-bottom: 8px; }
+@media (min-width: 768px) { #audiowrap.on { padding-right: 32px; padding-left: 32px; padding-bottom: 24px; } }