diff --git a/apps/web/src/layout/Sidebar.tsx b/apps/web/src/layout/Sidebar.tsx
index 4f18822..84079ce 100644
--- a/apps/web/src/layout/Sidebar.tsx
+++ b/apps/web/src/layout/Sidebar.tsx
@@ -8,6 +8,7 @@ import type {
 } from '@dorfteich/shared';
 import { buildTree, collectSubtreeIds, labelDepth } from '@dorfteich/shared';
 import { useQuery, useQueryClient } from '@tanstack/react-query';
+import { ChevronRight, FileText, Folder, FolderOpen } from 'lucide-react';
 import { useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Link } from 'react-router-dom';
@@ -527,11 +528,14 @@ function PageTreeLevel(props: PageTreeLevelProps): React.JSX.Element {
                   )}
                   onClick={() => onToggleCollapsed(node.id)}
                 >
-                  ▸
+                  <ChevronRight aria-hidden />
                 </button>
               ) : (
                 <span className="sidebar__caret sidebar__caret--leaf" aria-hidden />
               )}
+              <span className="sidebar__page-icon" aria-hidden>
+                {hasChildren ? isCollapsed ? <Folder /> : <FolderOpen /> : <FileText />}
+              </span>
               <PageLink page={node} pondSlug={pondSlug} pageSlug={pageSlug} />
               {canReorder && (
                 <span className="sidebar__reorder">
diff --git a/apps/web/src/styles/base.css b/apps/web/src/styles/base.css
index ec884b3..b7dc451 100644
--- a/apps/web/src/styles/base.css
+++ b/apps/web/src/styles/base.css
@@ -198,23 +198,40 @@ button {
   white-space: nowrap;
 }
 
+/* In the tree, the nested children <ul> is a SECOND flex item of the
+   .sidebar__page-item <li>. Stack it below the parent row (#122) — the
+   base rule's flex row centered the parent vertically BESIDE its children. */
+.sidebar__pages--tree .sidebar__page-item {
+  flex-direction: column;
+  align-items: stretch;
+  gap: 0;
+}
+
 .sidebar__tree-children {
-  margin: 0 0 0 var(--space-3);
+  /* Per-level indent: about two characters is plenty (#122). */
+  margin: 0 0 0 1.25em;
 }
 
 .sidebar__caret {
   flex: 0 0 auto;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
   width: 1rem;
   border: 0;
   background: none;
   padding: 0;
   cursor: pointer;
   color: var(--color-text-muted);
-  font-size: 0.7rem;
   transform: rotate(90deg);
   transition: transform 0.12s ease;
 }
 
+.sidebar__caret svg {
+  width: 0.9rem;
+  height: 0.9rem;
+}
+
 .sidebar__caret--collapsed {
   transform: rotate(0deg);
 }
@@ -223,6 +240,19 @@ button {
   cursor: default;
 }
 
+/* Folder pages vs. leaf pages read differently at a glance (#122). */
+.sidebar__page-icon {
+  flex: 0 0 auto;
+  display: inline-flex;
+  align-items: center;
+  color: var(--color-text-muted);
+}
+
+.sidebar__page-icon svg {
+  width: 0.875rem;
+  height: 0.875rem;
+}
+
 /* Label view (issue #108): pages grouped under the label tree. */
 .sidebar__label-group {
   margin-bottom: var(--space-2);
@@ -322,11 +352,12 @@ button {
 
 .sidebar__page {
   display: block;
-  padding: var(--space-1) var(--space-2);
+  /* Compact rows (#122): deep imported trees need to fit on one screen. */
+  padding: 0.125rem var(--space-2);
   border-radius: var(--radius);
   color: var(--color-text);
   text-decoration: none;
-  font-size: 0.95rem;
+  font-size: 0.875rem;
 }
 
 .sidebar__page:hover {