diff --git a/apps/web/src/views/ActivityDetailView.vue b/apps/web/src/views/ActivityDetailView.vue
index e48a2b0..88d19c9 100644
--- a/apps/web/src/views/ActivityDetailView.vue
+++ b/apps/web/src/views/ActivityDetailView.vue
@@ -1522,19 +1522,24 @@ dd {
 .share-members {
   list-style: none;
   margin: 0;
-  padding: 0.15rem 0.65rem 0.5rem;
+  padding: 0.15rem 0.55rem 0.55rem;
   max-height: 14rem;
   overflow: auto;
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(13.5rem, 1fr));
-  gap: 0.2rem 0.75rem;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.35rem;
 }
 
 .share-members li {
-  display: flex;
-  justify-content: space-between;
-  gap: 0.5rem;
-  min-width: 0;
+  display: inline-flex;
+  align-items: center;
+  gap: 0.35rem;
+  max-width: 100%;
+  margin: 0;
+  padding: 0.12rem 0.45rem 0.12rem 0.15rem;
+  border: 1px solid #e2e8f0;
+  border-radius: 999px;
+  background: #fff;
   font-size: 0.8rem;
   font-weight: 500;
   color: #334155;
@@ -1550,10 +1555,17 @@ dd {
 .share-members em {
   flex: 0 0 auto;
   font-style: normal;
-  color: #94a3b8;
+  font-size: 0.68rem;
+  font-weight: 600;
+  line-height: 1.4;
+  padding: 0.05rem 0.4rem;
+  border-radius: 999px;
+  background: #f1f5f9;
+  color: #64748b;
 }
 
 .share-members li.done em {
+  background: #f0fdfa;
   color: #0f766e;
 }