diff --git a/packages/ui/src/lib/components/persona.svelte b/packages/ui/src/lib/components/persona.svelte
index 8c31694..d609e49 100644
--- a/packages/ui/src/lib/components/persona.svelte
+++ b/packages/ui/src/lib/components/persona.svelte
@@ -40,19 +40,11 @@
 
 <style lang="scss">
 	.picture {
-		flex: 0 0 90px;
+		flex: 0 0 92px;
 		aspect-ratio: 1;
 
-		@media (min-width: 412px) {
-			flex-basis: 100px;
-		}
-
-		@media (min-width: 688px) {
-			flex-basis: 90px;
-		}
-
-		@media (min-width: 844px) {
-			flex-basis: 100px;
+		@media (min-width: 398px) {
+			flex-basis: 99px;
 		}
 
 		img {
@@ -66,25 +58,35 @@
 		display: flex;
 		flex-direction: column;
 		gap: var(--spacing-8);
+		min-height: 92px;
+
+		@media (min-width: 398px) {
+			min-height: 99px;
+		}
 
 		.header {
-			font-size: 16px;
+			font-size: var(--font-size-lg);
 			font-weight: 600;
 		}
 
 		.description {
-			font-size: 14px;
+			font-size: var(--font-size-normal);
+			flex-grow: 1;
 		}
 
 		.post-count {
-			font-size: 12px;
+			font-size: var(--font-size-normal);
 			display: flex;
 			flex-direction: row;
+			flex-wrap: wrap;
 			align-items: center;
 			justify-content: flex-start;
-			flex-wrap: nowrap;
 			gap: var(--spacing-12);
 
+			@media (min-width: 398px) {
+				font-size: var(--font-size-sm);
+			}
+
 			> div {
 				display: flex;
 				flex-direction: row;
@@ -97,7 +99,6 @@
 			.rep {
 				background-color: var(--grey-200);
 				border-radius: 9px;
-				font-size: var(--font-size-sm);
 				font-weight: var(--font-weight-sb);
 				padding-left: var(--spacing-6);
 				padding-right: var(--spacing-4);