style(mp-card): restyle mp-card__tag to filled chips; sync design-system portfolio-card specimen to real homepage card

public/css/main.css

@@ -3349,15 +3349,17 @@ html[data-theme="light"] .hero__portrait-shell {
 .mp-card__tag {
   display: inline-flex;
   align-items: center;
-  padding: 0.22rem 0.58rem;
-  font-size: 0.72rem;
-  font-weight: 600;
-  letter-spacing: 0.05em;
-  text-transform: lowercase;
+  min-height: 1.95rem;
+  padding: 0.25rem 0.82rem;
+  border: 0;
+  border-radius: var(--radius-btn);
+  background: color-mix(in srgb, var(--surface) 62%, var(--bg-elevated) 38%);
   color: var(--text-muted);
-  border: 1px solid color-mix(in srgb, var(--line) 92%, var(--text-muted));
-  border-radius: 999px;
-  line-height: 1.2;
+  font-size: 0.78rem;
+  font-weight: 500;
+  letter-spacing: 0.01em;
+  text-transform: none;
+  white-space: nowrap;
 }
 
 .mp-card__media {