diff --git a/.changeset/header-avatar-and-menu-stacking.md b/.changeset/header-avatar-and-menu-stacking.md
new file mode 100644
index 0000000..5f39685
--- /dev/null
+++ b/.changeset/header-avatar-and-menu-stacking.md
@@ -0,0 +1,10 @@
+---
+'@pdsjs/git': patch
+---
+
+The repository browser's title bar opens with the account's face, ahead of the
+address it belongs to, and a menu that opens over a commit now covers the faces
+under it. The author facepile stacks its faces so the author reads whole in
+front of anyone credited beside them, and that stacking reached the whole page:
+a face drew over the theme, clone and branch menus. The pile isolates its own
+order, and each menu takes a layer above the page.
diff --git a/packages/git-ui/src/app.jsx b/packages/git-ui/src/app.jsx
index ef94ba4..ca89a90 100644
--- a/packages/git-ui/src/app.jsx
+++ b/packages/git-ui/src/app.jsx
@@ -168,6 +168,23 @@ export function App() {
             below, so no one bar carries three different jobs. */}
         <header className="shrink-0 border-border border-b bg-muted">
           <div className="flex h-14 items-center gap-3 px-(--gutter)">
+            {ready && (
+              <Link
+                href="/"
+                title={accountInfo.handle}
+                className="flex shrink-0"
+              >
+                <Avatar
+                  src={owner()?.avatar || undefined}
+                  fallback={
+                    <span className="text-[10px] text-faint">
+                      {initial(owner()?.displayName || accountInfo.handle)}
+                    </span>
+                  }
+                  className="size-7"
+                />
+              </Link>
+            )}
             <nav className="flex min-w-0 shrink items-center gap-2 text-[15px]">
               {/* On a narrow window the repository's own name is the one that
                   has to survive. The avatar carries the way back to the list
@@ -207,19 +224,6 @@ export function App() {
             </nav>
             <div className="ml-auto flex shrink-0 items-center gap-1 pl-2">
               <ThemeMenu />
-              {ready && (
-                <Link href="/" title={accountInfo.handle} className="flex">
-                  <Avatar
-                    src={owner()?.avatar || undefined}
-                    fallback={
-                      <span className="text-[10px] text-faint">
-                        {initial(owner()?.displayName || accountInfo.handle)}
-                      </span>
-                    }
-                    className="size-7"
-                  />
-                </Link>
-              )}
             </div>
           </div>
         </header>
diff --git a/packages/git-ui/src/components/molecules/author-facepile.jsx b/packages/git-ui/src/components/molecules/author-facepile.jsx
index f8c9fd7..ee0343e 100644
--- a/packages/git-ui/src/components/molecules/author-facepile.jsx
+++ b/packages/git-ui/src/components/molecules/author-facepile.jsx
@@ -10,7 +10,8 @@ const FACES = 3;
  * The author stands in front and everyone credited beside them tucks in
  * behind, so the face a reader looks for first is the one that is whole.
  * These are classes rather than a style, because the avatar takes a class
- * name and nothing else.
+ * name and nothing else. The pile isolates them, so a face never rises
+ * above a menu that opens over it.
  */
 const DEPTH = ['z-30', 'z-20', 'z-10'];
 
@@ -50,7 +51,7 @@ export function AuthorFacepile({ ident, message, className }) {
       className={cn('inline-flex min-w-0 items-center gap-2', className)}
       title={people.map((person) => person.title).join('\n')}
     >
-      <span className="flex shrink-0 items-center">
+      <span className="isolate flex shrink-0 items-center">
         {shown.map((person, index) => (
           <Avatar
             key={person.name}
diff --git a/packages/git-ui/src/components/molecules/code-menu.jsx b/packages/git-ui/src/components/molecules/code-menu.jsx
index 6ea315e..30ec25f 100644
--- a/packages/git-ui/src/components/molecules/code-menu.jsx
+++ b/packages/git-ui/src/components/molecules/code-menu.jsx
@@ -46,7 +46,7 @@ export function CodeMenu({ repo, httpClone }) {
         <ChevronDownIcon className="size-3.5 shrink-0 text-faint" />
       </Popover.Trigger>
       <Popover.Portal>
-        <Popover.Positioner sideOffset={6} align="end">
+        <Popover.Positioner className="z-50" sideOffset={6} align="end">
           <Popover.Popup className="w-[min(22rem,calc(100vw-2rem))] rounded-2xl border border-border bg-card p-3 shadow-lg outline-none">
             <Popover.Title className="mb-2 font-semibold text-[13px]">
               Clone this repository
diff --git a/packages/git-ui/src/components/molecules/ref-select.jsx b/packages/git-ui/src/components/molecules/ref-select.jsx
index 3a1f69c..7182907 100644
--- a/packages/git-ui/src/components/molecules/ref-select.jsx
+++ b/packages/git-ui/src/components/molecules/ref-select.jsx
@@ -34,7 +34,11 @@ export function RefSelect({ repo, value, onSelect, className }) {
         </Select.Icon>
       </Select.Trigger>
       <Select.Portal>
-        <Select.Positioner sideOffset={6} alignItemWithTrigger={false}>
+        <Select.Positioner
+          className="z-50"
+          sideOffset={6}
+          alignItemWithTrigger={false}
+        >
           <Select.Popup className="max-h-80 min-w-[var(--anchor-width)] overflow-y-auto rounded-xl border border-border bg-card p-1 shadow-lg outline-none">
             {groups.map(([label, names]) => (
               <Select.Group key={label}>
diff --git a/packages/git-ui/src/components/molecules/theme-menu.jsx b/packages/git-ui/src/components/molecules/theme-menu.jsx
index fba5817..a768e5b 100644
--- a/packages/git-ui/src/components/molecules/theme-menu.jsx
+++ b/packages/git-ui/src/components/molecules/theme-menu.jsx
@@ -23,7 +23,7 @@ export function ThemeMenu() {
         <PaletteIcon className="size-4" />
       </Popover.Trigger>
       <Popover.Portal>
-        <Popover.Positioner sideOffset={6} align="end">
+        <Popover.Positioner className="z-50" sideOffset={6} align="end">
           <Popover.Popup className="w-56 rounded-[4px] border border-border bg-card p-1 shadow-lg outline-none">
             {all.map((one) => (
               <button