fix mobile screen issues

src/layouts/AdminLayout.jsx

@@ -183,7 +183,11 @@ export default function AdminLayout() {
           An opaque shell here would cover it and every Admin page would lose the
           tint at once — which is exactly why the canvas is one layer and not a
           background repeated on each page. */}
-      <div className="min-h-screen">
+      {/* `dvh` rather than `vh`: `100vh` on a phone is the viewport with the
+          browser chrome retracted, so a `min-h-screen` shell is always taller
+          than the screen actually showing it and every page starts life
+          scrollable by the height of the address bar. */}
+      <div className="min-h-dvh">
         {/* Single bar header in the new Admin design system */}
         <header className="sticky top-0 z-40 border-b border-border bg-white/85 backdrop-blur-xl">
           <div className="flex h-14 items-center justify-between gap-4 px-4 lg:px-6">
@@ -323,9 +327,20 @@ export default function AdminLayout() {
           </SheetContent>
         </Sheet>
 
-        {/* Main layout body */}
+        {/* Main layout body.
+
+            One column on a phone and two from `md`, which is the same
+            breakpoint AssistantPanel switches presentation on: below it Owliver
+            is an overlay and contributes nothing to this row, so `main` has the
+            whole shell rather than sharing it with a track wider than the
+            screen.
+
+            The extra bottom padding is for the docked Owliver pill, which is
+            fixed to the bottom-right corner. Without it the last row of a list
+            sits underneath the pill and cannot be read. Phone only: the desktop
+            spacing is unchanged. */}
         <div className="flex flex-col px-4 md:flex-row lg:px-6">
-          <main className="min-w-0 flex-1 py-6">
+          <main className="min-w-0 flex-1 pb-24 pt-6 md:py-6">
             <Outlet />
           </main>