diff --git a/web/styles/app_components.css b/web/styles/app_components.css
index 5959fee46c..a85f9fa985 100644
--- a/web/styles/app_components.css
+++ b/web/styles/app_components.css
@@ -588,9 +588,11 @@ div.overlay {
 .unread_count {
     float: right;
     padding: 0 4px;
-    height: 16px;
-    line-height: 16px;
-    font-size: 12px;
+    /* 12px at 14px/em */
+    font-size: 0.8571em;
+    /* 16px at 12px/em, owing to font-size above. */
+    height: 1.3333em;
+    line-height: 1.3333em;
     font-weight: normal;
     border-radius: 4px;
     background-color: var(--color-background-unread-counter);
diff --git a/web/styles/inbox.css b/web/styles/inbox.css
index 462e37f8ba..c79726ccd5 100644
--- a/web/styles/inbox.css
+++ b/web/styles/inbox.css
@@ -324,6 +324,12 @@
             }
 
             .unread-count-focus-outline {
+                /* Because the inbox view font-size will
+                   never be smaller than the em-equivalent
+                   of 15px, we restate the base font-size
+                   here so that unreads match others in
+                   the UI at legacy size (14px). */
+                font-size: var(--base-font-size-px);
                 grid-area: unread_count;
                 display: flex;
                 align-items: center;
diff --git a/web/styles/left_sidebar.css b/web/styles/left_sidebar.css
index dc4253a1f9..4861c615b4 100644
--- a/web/styles/left_sidebar.css
+++ b/web/styles/left_sidebar.css
@@ -542,8 +542,9 @@ li.active-sub-filter {
             background: var(--color-background-hover-narrow-filter);
 
             .unread_count {
-                top: -6px;
-                right: -6px;
+                /* 6px at 12px/1em */
+                top: -0.5em;
+                right: -0.5em;
                 background: var(--color-background-unread-counter-no-alpha);
             }
         }