diff --git a/scss/westgate/_topbar.scss b/scss/westgate/_topbar.scss
index 1684bc0..fead2c1 100644
--- a/scss/westgate/_topbar.scss
+++ b/scss/westgate/_topbar.scss
@@ -172,10 +172,23 @@ $wg-topbar-panel-bg: rgba(21, 17, 26, 0.98);
 
 .wg-topbar .notifications-dropdown,
 .wg-topbar .chats-dropdown,
-.wg-topbar .drafts-dropdown {
+.wg-topbar .drafts-dropdown,
+.wg-topbar .unread-dropdown {
   width: min(24rem, calc(100vw - 1.5rem));
 }
 
+.wg-topbar .wg-unread-item {
+  display: flex;
+  align-items: baseline;
+  gap: 0.5rem;
+}
+
+.wg-topbar .wg-unread-item__category {
+  margin-left: auto;
+  flex-shrink: 0;
+  opacity: 0.7;
+}
+
 .wg-topbar .dropdown-item,
 .wg-topbar .btn.btn-ghost,
 .wg-topbar .btn.btn-light {
diff --git a/tests/global-topbar-contract.test.js b/tests/global-topbar-contract.test.js
index 5c15741..b63d33c 100644
--- a/tests/global-topbar-contract.test.js
+++ b/tests/global-topbar-contract.test.js
@@ -174,3 +174,9 @@ assertMatches(
 	/href="\{relative_path\}\/unread"[^>]*>[\s\S]*?component="unread\/count"/,
 	'Mobile drawer actions should include an Unread link with count badge'
 );
+
+assertIncludes(
+	stylesheet,
+	'.unread-dropdown',
+	'Topbar styles should cover the unread dropdown'
+);