The bottom nav rides every page: Feed, Messages, Notifications, Wallet.

It now shows across the signed-in app and a visitor's public pages (never
over sign-in, onboarding or the lock prompt), marks the current page, and
carries the unread dot. Home is renamed Feed, and the Messages button leaves
the header.

Co-Authored-By: Claude Opus 5.5 <[email protected]>

1 files changed, 9 insertions, 4 deletions

diff --git a/src/style.css b/src/style.css
index 3a8c036..9696e7b 100644
--- a/src/style.css
+++ b/src/style.css
@@ -770,20 +770,25 @@ html.no-scroll { overflow: hidden; scrollbar-gutter: auto; }
    feed near the top, out of the way of the thumb, and takes you up to them
    when tapped. Fixed, not sticky: the feed is the page scroller, and a
    sticky element inside the card would scroll away with the card. */
-.feed-page { padding-bottom: calc(82px + env(safe-area-inset-bottom, 0px)); }
-.feed-bottom-nav {
+#app:has(> .app-bottom-nav) { padding-bottom: calc(82px + env(safe-area-inset-bottom, 0px)); }
+.app-bottom-nav {
   position: fixed; bottom: 0; left: 50%; transform: translateX(-50%);
   z-index: 30; display: flex; width: min(100%, 560px); box-sizing: border-box;
   padding: 6px 4px calc(6px + env(safe-area-inset-bottom, 0px));
   background: var(--paper); border-top: 1px solid var(--line);
   box-shadow: 0 -4px 18px rgba(0, 0, 0, .06);
 }
-.feed-nav-button {
+.app-nav-button {
   display: flex; flex: 1; min-width: 0; flex-direction: column; align-items: center;
   justify-content: center; gap: 3px; min-height: 52px; padding: 4px;
   border: 0; background: transparent; color: var(--ink); font-size: 11px;
 }
-.feed-nav-button > span:first-child { display: flex; }
+.app-nav-button > span:first-child { display: flex; position: relative; }
+.app-nav-button[aria-current="page"] { background: var(--accent-soft); }
+.app-nav-button.unread > span:first-child::after {
+  content: ''; position: absolute; top: -2px; right: -4px; width: 7px; height: 7px;
+  border-radius: 50%; background: var(--green); border: 1px solid var(--paper);
+}
 .feed-page .feed-new-pill {
   bottom: calc(env(safe-area-inset-bottom, 0px) + 82px);
 }