layout and remote fix

src/lib/utils/layoutShell.ts

@@ -1,20 +1,18 @@
 /**
- * Pure layout-shell logic for the app's fixed bottom UI (mini player stacked
- * over the bottom nav).
+ * Pure layout-shell visibility rules for the app's bottom UI (mini player
+ * stacked over the bottom nav).
  *
  * These rules used to live as inline `$derived` booleans scattered across the
- * root and library `+layout.svelte` files, and diverged per platform/route —
- * which is exactly how the "last row hidden behind the nav" bug kept coming
- * back. The invariant is now a single source of truth:
+ * root and library `+layout.svelte` files and diverged per platform/route.
  *
- *   - The ROOT layout owns the single fixed bottom UI on every route/platform.
- *     There is no per-route/per-platform second mini player.
- *   - Whatever fixed bottom UI is showing has a live-measured height
- *     (`bottomUiHeight`), and every scroll container reserves exactly that much
- *     bottom space so the last row can never render behind the nav.
+ * The overlap bug ("last row hidden behind the nav") is now solved
+ * STRUCTURALLY, not by these rules: the bottom UI is rendered as an in-flow
+ * flex child below the scroller (see BottomUi.svelte), so the scroller is
+ * physically bounded above it and can never render behind it. There is no
+ * measurement and no reserved padding. These functions only decide *whether*
+ * each piece is visible on a given route.
  *
- * Keeping this pure makes the invariant unit-testable (jsdom has no layout
- * engine, so the geometry itself can't be tested — but the decision logic can).
+ * Keeping them pure makes the visibility contract unit-testable.
  *
  * TRACES: UR-005 | DR-009
  */
@@ -56,41 +54,24 @@ export function showGlobalMiniPlayer({ pathname }: { pathname: string }): boolea
 }
 
 /**
- * Routes that own their own full-height layout (their own scroll container +
- * bottom-space reservation). The root leaves these as a plain non-scrolling box
- * and does NOT add bottom padding — the route reserves `bottomUiHeight` itself.
- * Every other route scrolls in the root wrapper, which reserves the space.
+ * Routes that render their own full-height flex column (header + scroller +
+ * their own in-flow BottomUi). The root leaves these as a plain clipped box and
+ * does not render its own BottomUi. Every other route renders into the root's
+ * scroller, with the root's in-flow BottomUi as a flex sibling below it.
  */
 export function routeOwnsLayout({ pathname }: { pathname: string }): boolean {
   return (
     pathname.startsWith("/library") ||
-    pathname.startsWith("/settings") ||
     pathname.startsWith("/player/") ||
     pathname.startsWith("/login")
   );
 }
 
 /**
- * Whether any fixed bottom UI is showing for this route (mini player, nav, or
- * both). When true, the active scroll container must reserve `bottomUiHeight`.
+ * Whether any bottom UI is showing for this route (mini player, nav, or both).
+ * The bottom UI is rendered in flex flow below the scroller (see BottomUi.svelte),
+ * so this is purely a visibility question — there is no padding to reserve.
  */
 export function showBottomUi(input: BottomUiVisibilityInput): boolean {
   return showBottomNav(input) || showGlobalMiniPlayer({ pathname: input.pathname });
 }
-
-/**
- * The bottom padding (in CSS) a scroll container must reserve so its last row
- * clears the fixed bottom UI. `bottomUiHeight` is the live-measured height of
- * the root's fixed bottom UI wrapper.
- *
- * @param bottomUiHeight measured height in px of the fixed bottom UI (0 if none)
- * @param extraRem       breathing room added on top (routes that own their
- *                       layout add 1rem; the root wrapper reserves an exact fit)
- */
-export function reservedBottomPadding(
-  bottomUiHeight: number,
-  extraRem = 0,
-): string {
-  const px = Math.max(0, bottomUiHeight);
-  return extraRem > 0 ? `calc(${px}px + ${extraRem}rem)` : `${px}px`;
-}