diff --git a/src/app/globals.css b/src/app/globals.css
index 0882431..824280e 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -737,12 +737,17 @@ html {
   display: flex;
   align-items: center;
   gap: 0.5rem;
+  /* Collapse the inherited line-height (body: 1.7) so the text's line-box
+     matches the icon's geometric height — without this, align-items:
+     center floats the icon above the optical midline of the text. */
+  line-height: 1;
 }
 
 .profile-join-date {
   display: flex;
   align-items: center;
   gap: 0.5rem;
+  line-height: 1;
 }
 
 /* Skeleton Loading Styles */
diff --git a/src/components/PostPreview.tsx b/src/components/PostPreview.tsx
index ffd9c93..4615cde 100644
--- a/src/components/PostPreview.tsx
+++ b/src/components/PostPreview.tsx
@@ -1237,6 +1237,9 @@ export default function PostPreview({ post, parent }: PostPreviewProps) {
           borderTop: '1px solid var(--border-color)',
           fontSize: '0.875rem',
           color: 'var(--text-tertiary)',
+          // Collapse inherited line-height so icons align to the text
+          // midline (body's default of 1.7 was floating them above).
+          lineHeight: 1,
         }}
       >
         <div style={{ display: 'flex', alignItems: 'center', gap: '0.375rem' }}>
diff --git a/src/components/explore/EngagementSidecar.tsx b/src/components/explore/EngagementSidecar.tsx
index 965b133..5ea2300 100644
--- a/src/components/explore/EngagementSidecar.tsx
+++ b/src/components/explore/EngagementSidecar.tsx
@@ -86,10 +86,26 @@ export default function EngagementSidecar({ did, collection, atUri }: Props) {
       {items.map((item) => (
         <div
           key={item.label}
-          style={{ display: 'inline-flex', alignItems: 'center', gap: '0.4rem' }}
+          style={{
+            display: 'inline-flex',
+            alignItems: 'center',
+            gap: '0.4rem',
+            // Collapse line-height so icon and number sit on the same
+            // optical line (body's 1.7 line-height was floating the icon
+            // above the text midline).
+            lineHeight: 1,
+          }}
           title={item.label}
         >
-          <span style={{ color: 'var(--text-tertiary)' }}>{item.icon}</span>
+          <span
+            style={{
+              color: 'var(--text-tertiary)',
+              display: 'inline-flex',
+              alignItems: 'center',
+            }}
+          >
+            {item.icon}
+          </span>
           <span style={{ fontVariantNumeric: 'tabular-nums', color: 'var(--text-primary)' }}>
             {item.value.toLocaleString()}
           </span>