diff --git a/apps/client/src/features/page/tree/components/doc-tree.tsx b/apps/client/src/features/page/tree/components/doc-tree.tsx
index f74d0680..69d88fe2 100644
--- a/apps/client/src/features/page/tree/components/doc-tree.tsx
+++ b/apps/client/src/features/page/tree/components/doc-tree.tsx
@@ -510,6 +510,12 @@ function DocTreeInner<T extends object>(
                 top: 0,
                 left: 0,
                 width: '100%',
+                // Give the row slot the exact virtualizer stride height so the
+                // inner highlight can fill and vertically center within it.
+                // Without a definite height here, `.node`'s `height: 100%`
+                // collapses to content height and the selection pill ends up
+                // top-aligned (asymmetric) inside the stride.
+                height: rowHeight,
                 transform: `translateY(${virtualItem.start}px)`,
               }}
             >
diff --git a/apps/client/src/features/page/tree/components/space-tree-node-menu.tsx b/apps/client/src/features/page/tree/components/space-tree-node-menu.tsx
index d65a9c41..6a33445d 100644
--- a/apps/client/src/features/page/tree/components/space-tree-node-menu.tsx
+++ b/apps/client/src/features/page/tree/components/space-tree-node-menu.tsx
@@ -124,6 +124,7 @@ export function NodeMenu({ node, canEdit }: NodeMenuProps) {
       <Menu shadow="md" width={200}>
         <Menu.Target>
           <ActionIcon
+            size={20}
             variant="subtle"
             color="gray"
             className={classes.actionIcon}
diff --git a/apps/client/src/features/page/tree/components/space-tree-row.tsx b/apps/client/src/features/page/tree/components/space-tree-row.tsx
index e55373c2..df371498 100644
--- a/apps/client/src/features/page/tree/components/space-tree-row.tsx
+++ b/apps/client/src/features/page/tree/components/space-tree-row.tsx
@@ -273,6 +273,7 @@ function CreateNode({
 
   return (
     <ActionIcon
+      size={20}
       variant="subtle"
       color="gray"
       className={classes.actionIcon}
diff --git a/apps/client/src/features/page/tree/styles/tree.module.css b/apps/client/src/features/page/tree/styles/tree.module.css
index 6ed758e6..e018af73 100644
--- a/apps/client/src/features/page/tree/styles/tree.module.css
+++ b/apps/client/src/features/page/tree/styles/tree.module.css
@@ -17,7 +17,11 @@
     border-radius: 4px;
     display: flex;
     align-items: center;
-    height: 100%;
+    /* Inset the highlight pill by 2px top + 2px bottom inside the full-height
+       row slot. rowWrapper (height: 100%, align-items: center) vertically
+       centers this pill in the stride, giving an even gap between rows and
+       symmetric padding around the row content. */
+    height: calc(100% - 4px);
     width: 100%;
     text-decoration: none;
     color: light-dark(var(--mantine-color-gray-7), var(--mantine-color-dark-0));
@@ -77,10 +81,6 @@
     display: flex;
 }
 
-[role="treeitem"] {
-    padding-bottom: 2px;
-}
-
 /* Strip the browser's default <ul> bullet + indent from the DocTree
    <ul role="tree"> and nested <ul role="group"> nodes. The tree's own indent
    is driven by paddingLeft on .rowWrapper. */
@@ -98,6 +98,9 @@
     display: flex;
     align-items: center;
     border-radius: 4px;
+    /* Fill the full row slot (the <li> is sized to the virtualizer stride) so
+       align-items: center can vertically center the inset `.node` pill. */
+    height: 100%;
 }
 
 .node[data-dragging="true"] {
diff --git a/apps/client/src/features/share/components/share.module.css b/apps/client/src/features/share/components/share.module.css
index ebf1e74c..11c8a6b2 100644
--- a/apps/client/src/features/share/components/share.module.css
+++ b/apps/client/src/features/share/components/share.module.css
@@ -10,7 +10,6 @@
 .treeNode {
   text-decoration: none;
   user-select: none;
-  padding-bottom: 0;
 }
 
 .navbar,