@metropolle/design-system 1.2026.0-1.22.1838 → 1.2026.0-1.24.1601

package/dist/css/components.css

@@ -1135,6 +1135,7 @@ html[data-theme="light"] select.mds-input {
 
 /* Select Search */
 .mds-select-search {
+  position: relative; /* Required for absolute positioning of search icon */
   flex-shrink: 0; /* Don't shrink in flex container */
   padding: 8px;
   border-bottom: 1px solid rgba(255, 255, 255, 0.1);
@@ -3807,65 +3808,85 @@ html[data-theme="light"] .mds-profile-card__verified-trigger {
 }
 
 .mds-profile-card__verified-popup {
+  /* Position to the LEFT of the trigger icon */
   position: absolute;
-  top: calc(100% + 12px);
-  right: 0;
-  padding: 16px;
+  top: 50%;
+  right: calc(100% + 12px);
+  transform: translateY(-50%);
+  padding: 32px 40px;
   /* Liquid Glass popup */
-  background: rgba(20, 20, 30, 0.75);
-  backdrop-filter: blur(16px) saturate(140%);
-  -webkit-backdrop-filter: blur(16px) saturate(140%);
-  border-radius: 14px;
-  border: 1px solid rgba(255, 255, 255, 0.1);
+  background: rgba(20, 20, 30, 0.9);
+  backdrop-filter: blur(24px) saturate(160%);
+  -webkit-backdrop-filter: blur(24px) saturate(160%);
+  border-radius: 20px;
+  border: 1px solid rgba(255, 255, 255, 0.15);
   box-shadow:
-    0 8px 24px rgba(0, 0, 0, 0.25),
-    inset 0 1px 0 rgba(255, 255, 255, 0.05);
-  min-width: 180px;
-  z-index: 20;
+    0 16px 48px rgba(0, 0, 0, 0.4),
+    inset 0 1px 0 rgba(255, 255, 255, 0.1);
+  min-width: 320px;
+  z-index: 100;
 }
 
 html[data-theme="light"] .mds-profile-card__verified-popup {
-  background: rgba(255, 255, 255, 0.7);
-  border: 1px solid rgba(255, 255, 255, 0.9);
+  background: rgba(255, 255, 255, 0.92);
+  border: 1px solid rgba(255, 255, 255, 0.98);
   box-shadow:
-    0 8px 24px rgba(0, 0, 0, 0.08),
+    0 16px 48px rgba(0, 0, 0, 0.15),
     inset 0 1px 0 rgba(255, 255, 255, 1);
 }
 
+/* Mobile: popup centered on screen */
+@media (max-width: 768px) {
+  .mds-profile-card__verified-popup {
+    position: fixed;
+    top: 50%;
+    left: 0;
+    right: 0;
+    bottom: auto;
+    transform: translateY(-50%);
+    width: 280px;
+    min-width: auto;
+    margin-left: auto;
+    margin-right: auto;
+    padding: 24px 28px;
+    z-index: 1000;
+  }
+}
+
 .mds-profile-card__verified-header {
   font-family: 'OCR-B', 'OCR B Std', 'Courier New', monospace;
-  font-size: 12px;
+  font-size: 16px;
   font-weight: bold;
   color: #00d4aa;
   letter-spacing: 0.08em;
   text-transform: uppercase;
-  margin-bottom: 14px;
+  margin-bottom: 20px;
   white-space: nowrap;
 }
 
 .mds-profile-card__verified-stats {
   display: flex;
   flex-direction: column;
-  gap: 10px;
+  gap: 14px;
 }
 
 .mds-profile-card__stat-item {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  gap: 20px;
+  gap: 32px;
 }
 
 .mds-profile-card__stat-label {
   font-family: 'OCR-B', 'OCR B Std', 'Courier New', monospace;
-  font-size: 11px;
+  font-size: 14px;
   color: var(--mds-color-text-tertiary, rgba(255, 255, 255, 0.5));
   letter-spacing: 0.06em;
 }
 
 .mds-profile-card__stat-value {
   font-family: 'OCR-B', 'OCR B Std', 'Courier New', monospace;
-  font-size: 11px;
+  font-size: 14px;
   letter-spacing: 0.06em;
   text-transform: uppercase;
   color: var(--mds-color-text-tertiary, rgba(255, 255, 255, 0.5));
@@ -3875,12 +3896,66 @@ html[data-theme="light"] .mds-profile-card__verified-popup {
   color: #00d4aa;
 }
 
+/* FEAT-090: Verification Score Checks */
+.mds-profile-card__verified-checks {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  margin: 16px 0;
+}
+
+.mds-profile-card__check-item {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  font-family: 'OCR-B', 'OCR B Std', 'Courier New', monospace;
+  font-size: 12px;
+  letter-spacing: 0.04em;
+}
+
+.mds-profile-card__check-icon {
+  width: 18px;
+  height: 18px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 50%;
+  font-size: 11px;
+  font-weight: bold;
+  background: rgba(255, 255, 255, 0.05);
+  color: rgba(255, 255, 255, 0.3);
+  flex-shrink: 0;
+}
+
+.mds-profile-card__check-icon--passed {
+  background: rgba(0, 212, 170, 0.15);
+  color: #00d4aa;
+}
+
+html[data-theme="light"] .mds-profile-card__check-icon {
+  background: rgba(0, 0, 0, 0.05);
+  color: rgba(0, 0, 0, 0.3);
+}
+
+html[data-theme="light"] .mds-profile-card__check-icon--passed {
+  background: rgba(0, 180, 140, 0.15);
+  color: #00b48c;
+}
+
+.mds-profile-card__check-label {
+  color: var(--mds-color-text-secondary, rgba(255, 255, 255, 0.7));
+}
+
+html[data-theme="light"] .mds-profile-card__check-label {
+  color: rgba(0, 0, 0, 0.7);
+}
+
 .mds-profile-card__verified-footer {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  margin-top: 14px;
-  padding-top: 10px;
+  margin-top: 20px;
+  padding-top: 16px;
   border-top: 1px solid rgba(255, 255, 255, 0.08);
 }
 
@@ -3891,7 +3966,7 @@ html[data-theme="light"] .mds-profile-card__verified-footer {
 .mds-profile-card__verified-sequence,
 .mds-profile-card__verified-date {
   font-family: 'OCR-B', 'OCR B Std', 'Courier New', monospace;
-  font-size: 10px;
+  font-size: 12px;
   color: var(--mds-color-text-tertiary, rgba(255, 255, 255, 0.4));
   letter-spacing: 0.06em;
   text-transform: uppercase;
@@ -4088,3 +4163,239 @@ html[data-theme="light"] .mds-profile-card__photo-modal-image {
     0 10px 30px rgba(0, 0, 0, 0.08),
     inset 0 1px 0 rgba(255, 255, 255, 1);
 }
+
+/* =============================================================================
+   FEAT-090: Verification Score Components (Settings Page)
+   ============================================================================= */
+
+.mds-verification-score-display {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 8px;
+  padding: 24px 40px;
+  border-radius: 16px;
+  background: rgba(255, 255, 255, 0.05);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+}
+
+html[data-theme="light"] .mds-verification-score-display {
+  background: rgba(0, 0, 0, 0.02);
+  border-color: rgba(0, 0, 0, 0.1);
+}
+
+.mds-verification-score-number {
+  font-family: 'OCR-B', 'OCR B Std', 'Courier New', monospace;
+  font-size: 4rem;
+  font-weight: bold;
+  line-height: 1;
+  color: #00d4aa;
+}
+
+html[data-theme="light"] .mds-verification-score-number {
+  color: #00b48c;
+}
+
+.mds-verification-score-label {
+  font-size: 0.875rem;
+  text-transform: uppercase;
+  letter-spacing: 0.1em;
+  color: var(--mds-color-text-secondary, rgba(255, 255, 255, 0.6));
+}
+
+.mds-verification-checks-grid {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.mds-verification-check-card {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  padding: 16px 20px;
+  border-radius: 12px;
+  background: rgba(255, 255, 255, 0.03);
+  border: 1px solid rgba(255, 255, 255, 0.08);
+  transition: all 0.2s ease;
+}
+
+html[data-theme="light"] .mds-verification-check-card {
+  background: rgba(0, 0, 0, 0.02);
+  border-color: rgba(0, 0, 0, 0.06);
+}
+
+.mds-verification-check-card--passed {
+  background: rgba(0, 212, 170, 0.05);
+  border-color: rgba(0, 212, 170, 0.2);
+}
+
+html[data-theme="light"] .mds-verification-check-card--passed {
+  background: rgba(0, 180, 140, 0.05);
+  border-color: rgba(0, 180, 140, 0.2);
+}
+
+.mds-verification-check-icon {
+  width: 32px;
+  height: 32px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 50%;
+  font-size: 16px;
+  font-weight: bold;
+  background: rgba(255, 255, 255, 0.05);
+  color: rgba(255, 255, 255, 0.3);
+  flex-shrink: 0;
+}
+
+.mds-verification-check-card--passed .mds-verification-check-icon {
+  background: rgba(0, 212, 170, 0.15);
+  color: #00d4aa;
+}
+
+html[data-theme="light"] .mds-verification-check-icon {
+  background: rgba(0, 0, 0, 0.05);
+  color: rgba(0, 0, 0, 0.3);
+}
+
+html[data-theme="light"] .mds-verification-check-card--passed .mds-verification-check-icon {
+  background: rgba(0, 180, 140, 0.15);
+  color: #00b48c;
+}
+
+.mds-verification-check-content {
+  flex: 1;
+  min-width: 0;
+}
+
+.mds-verification-check-action {
+  flex-shrink: 0;
+}
+
+/* =============================================================================
+   FEAT-090: Verification Tab (Modal/Backoffice)
+   ============================================================================= */
+
+.mds-verification-tab {
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+  padding: 8px 0;
+}
+
+.mds-verification-score-header {
+  display: flex;
+  align-items: center;
+  gap: 20px;
+  padding: 20px;
+  background: rgba(0, 212, 170, 0.05);
+  border: 1px solid rgba(0, 212, 170, 0.15);
+  border-radius: 12px;
+}
+
+.mds-verification-score-badge {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;
+  padding: 16px 24px;
+  background: rgba(0, 212, 170, 0.1);
+  border-radius: 10px;
+}
+
+.mds-verification-score-badge .mds-verification-score-number {
+  font-family: 'OCR-B', 'OCR B Std', 'Courier New', monospace;
+  font-size: 2.5rem;
+  font-weight: bold;
+  line-height: 1;
+  color: #00d4aa;
+}
+
+.mds-verification-score-badge .mds-verification-score-label {
+  font-size: 0.625rem;
+  text-transform: uppercase;
+  letter-spacing: 0.1em;
+  color: var(--mds-color-text-secondary, rgba(255, 255, 255, 0.6));
+}
+
+.mds-verification-score-info {
+  flex: 1;
+}
+
+.mds-verification-checks-list {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.mds-verification-check-item {
+  display: flex;
+  align-items: center;
+  gap: 14px;
+  padding: 14px 16px;
+  background: rgba(255, 255, 255, 0.03);
+  border: 1px solid rgba(255, 255, 255, 0.08);
+  border-radius: 10px;
+  transition: all 0.2s ease;
+}
+
+.mds-verification-check-item--passed {
+  background: rgba(0, 212, 170, 0.05);
+  border-color: rgba(0, 212, 170, 0.2);
+}
+
+.mds-verification-check-status {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 28px;
+  height: 28px;
+  border-radius: 50%;
+  background: rgba(255, 255, 255, 0.05);
+  color: rgba(255, 255, 255, 0.3);
+  flex-shrink: 0;
+}
+
+.mds-verification-check-item--passed .mds-verification-check-status {
+  background: rgba(0, 212, 170, 0.15);
+  color: #00d4aa;
+}
+
+.mds-verification-check-content {
+  flex: 1;
+  min-width: 0;
+}
+
+html[data-theme="light"] .mds-verification-score-header {
+  background: rgba(0, 180, 140, 0.05);
+  border-color: rgba(0, 180, 140, 0.15);
+}
+
+html[data-theme="light"] .mds-verification-score-badge {
+  background: rgba(0, 180, 140, 0.1);
+}
+
+html[data-theme="light"] .mds-verification-score-badge .mds-verification-score-number {
+  color: #00b48c;
+}
+
+html[data-theme="light"] .mds-verification-check-item {
+  background: rgba(0, 0, 0, 0.02);
+  border-color: rgba(0, 0, 0, 0.06);
+}
+
+html[data-theme="light"] .mds-verification-check-item--passed {
+  background: rgba(0, 180, 140, 0.05);
+  border-color: rgba(0, 180, 140, 0.15);
+}
+
+html[data-theme="light"] .mds-verification-check-status {
+  background: rgba(0, 0, 0, 0.05);
+  color: rgba(0, 0, 0, 0.3);
+}
+
+html[data-theme="light"] .mds-verification-check-item--passed .mds-verification-check-status {
+  background: rgba(0, 180, 140, 0.15);
+  color: #00b48c;
+}

package/dist/react/components/react/ProfileCard/ProfileCard.d.ts

@@ -26,6 +26,18 @@ export interface ProfileCardUser {
     photo_url_full?: string;
     registration_sequence?: number;
     mfa_enabled?: boolean;
+    verification_score?: VerificationScore;
+}
+export interface VerificationCheck {
+    name: string;
+    description: string;
+    passed: boolean;
+}
+export interface VerificationScore {
+    score: number;
+    max_score: number;
+    breakdown: Record<string, boolean>;
+    checks: VerificationCheck[];
 }
 export interface ProfileCardProps {
     /** User data to display */

package/dist/react/components/react/ProfileCard/ProfileCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProfileCard.d.ts","sourceRoot":"","sources":["../../../../../src/components/react/ProfileCard/ProfileCard.tsx"],"names":[],"mappings":"AAEA;;;;;;GAMG;AAEH,OAAO,KAAsC,MAAM,OAAO,CAAC;AAO3D,MAAM,WAAW,eAAe;IAE9B,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IAGjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IAGtB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;IAGxB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAG/B,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,WAAW,gBAAgB;IAC/B,2BAA2B;IAC3B,IAAI,EAAE,eAAe,CAAC;IAEtB,sEAAsE;IACtE,OAAO,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAE7B,6EAA6E;IAC7E,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,gCAAgC;IAChC,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,8BAA8B;IAC9B,WAAW,CAAC,EAAE;QACZ,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,CAAC,CAAC,EAAE,MAAM,CAAC;QACX,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,OAAO,CAAC,EAAE,MAAM,CAAC;KAClB,CAAC;IAEF,8BAA8B;IAC9B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B,8CAA8C;IAC9C,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE5B,2BAA2B;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,6CAA6C;IAC7C,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B;AAwID,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,OAAgB,EAChB,UAAU,EACV,UAAkB,EAClB,WAAW,EACX,gBAAwB,EACxB,SAAS,EACT,SAAc,EACd,aAAa,GACd,EAAE,gBAAgB,2CA6QlB;AAED,eAAe,WAAW,CAAC"}
+{"version":3,"file":"ProfileCard.d.ts","sourceRoot":"","sources":["../../../../../src/components/react/ProfileCard/ProfileCard.tsx"],"names":[],"mappings":"AAEA;;;;;;GAMG;AAEH,OAAO,KAAsC,MAAM,OAAO,CAAC;AAO3D,MAAM,WAAW,eAAe;IAE9B,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IAGjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IAGtB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;IAGxB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAG/B,WAAW,CAAC,EAAE,OAAO,CAAC;IAGtB,kBAAkB,CAAC,EAAE,iBAAiB,CAAC;CACxC;AAGD,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE,OAAO,CAAC;CACjB;AAED,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACnC,MAAM,EAAE,iBAAiB,EAAE,CAAC;CAC7B;AAED,MAAM,WAAW,gBAAgB;IAC/B,2BAA2B;IAC3B,IAAI,EAAE,eAAe,CAAC;IAEtB,sEAAsE;IACtE,OAAO,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAE7B,6EAA6E;IAC7E,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,gCAAgC;IAChC,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,8BAA8B;IAC9B,WAAW,CAAC,EAAE;QACZ,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,CAAC,CAAC,EAAE,MAAM,CAAC;QACX,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,OAAO,CAAC,EAAE,MAAM,CAAC;KAClB,CAAC;IAEF,8BAA8B;IAC9B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B,8CAA8C;IAC9C,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE5B,2BAA2B;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,6CAA6C;IAC7C,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B;AAyJD,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,OAAgB,EAChB,UAAU,EACV,UAAkB,EAClB,WAAW,EACX,gBAAwB,EACxB,SAAS,EACT,SAAc,EACd,aAAa,GACd,EAAE,gBAAgB,2CAwTlB;AAED,eAAe,WAAW,CAAC"}

package/dist/react/index.esm.js

@@ -1508,6 +1508,9 @@ function UsernameLinks({ username, className }) {
 function StatItem({ label, verified }) {
     return (jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__stat-item", children: [jsxRuntimeExports.jsx("span", { className: "mds-profile-card__stat-label", children: label }), jsxRuntimeExports.jsx("span", { className: `mds-profile-card__stat-value ${verified ? 'mds-profile-card__stat-value--verified' : ''}`, children: verified ? 'Verified' : 'Not Verified' })] }));
 }
+function VerificationCheckItem({ description, passed }) {
+    return (jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__check-item", children: [jsxRuntimeExports.jsx("span", { className: `mds-profile-card__check-icon ${passed ? 'mds-profile-card__check-icon--passed' : ''}`, children: passed ? '\u2713' : '\u2717' }), jsxRuntimeExports.jsx("span", { className: "mds-profile-card__check-label", children: description })] }));
+}
 // =============================================================================
 // Main Component
 // =============================================================================
@@ -1588,10 +1591,18 @@ function ProfileCard({ user, variant = 'full', photoWidth, showSocial = false, s
     // Full size photo for modal (prioritize full, then medium)
     const photoUrlFull = user.photo_url_full || user.photo_url_medium;
     const hasRealPhoto = !!(user.photo_url_medium || user.photo_url_full);
-    return (jsxRuntimeExports.jsxs("article", { className: `mds-profile-card ${className}`, style: { '--mds-profile-card-photo-width': `${computedPhotoWidth}px` }, children: [jsxRuntimeExports.jsx("div", { className: "mds-profile-card__grain" }), jsxRuntimeExports.jsx("div", { className: "mds-profile-card__photo", children: photoSlot ? (jsxRuntimeExports.jsx("div", { className: "mds-profile-card__photo-slot", children: photoSlot })) : (jsxRuntimeExports.jsx("img", { src: photoUrl, alt: displayName, className: `mds-profile-card__avatar ${hasRealPhoto ? 'mds-profile-card__avatar--clickable' : ''}`, onClick: hasRealPhoto ? () => setShowPhotoModal(true) : undefined, role: hasRealPhoto ? 'button' : undefined, tabIndex: hasRealPhoto ? 0 : undefined, onKeyDown: hasRealPhoto ? (e) => e.key === 'Enter' && setShowPhotoModal(true) : undefined })) }), showPhotoModal && photoUrlFull && (jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__photo-modal", onClick: () => setShowPhotoModal(false), role: "dialog", "aria-modal": "true", "aria-label": "Enlarged photo - click anywhere to close", children: [jsxRuntimeExports.jsx("div", { className: "mds-profile-card__photo-modal-backdrop" }), jsxRuntimeExports.jsx("div", { className: "mds-profile-card__photo-modal-content", children: jsxRuntimeExports.jsx("img", { src: photoUrlFull, alt: displayName, className: "mds-profile-card__photo-modal-image" }) })] })), jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__content", children: [jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__identity", children: [jsxRuntimeExports.jsx("h1", { className: "mds-profile-card__name", children: displayName.toUpperCase() }), variant === 'full' && profession && (jsxRuntimeExports.jsx("p", { className: "mds-profile-card__profession", children: profession.toUpperCase() })), variant === 'compact' && (jsxRuntimeExports.jsx(UsernameLinks, { username: user.username, className: "mds-profile-card__username" }))] }), jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__details", children: [variant === 'full' && getLocation() && (jsxRuntimeExports.jsx("p", { className: "mds-profile-card__location", children: getLocation() })), variant === 'full' && (jsxRuntimeExports.jsx(UsernameLinks, { username: user.username, className: "mds-profile-card__username-detail" })), variant === 'compact' && user.email && (jsxRuntimeExports.jsx("p", { className: "mds-profile-card__email", children: user.email })), variant === 'compact' && (jsxRuntimeExports.jsxs("span", { className: "mds-profile-card__member", children: ["Member since ", memberSince] }))] }), variant === 'compact' && (jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__verification", children: [jsxRuntimeExports.jsxs("button", { className: "mds-profile-card__verified-badge", title: `Verification Level ${user.verified}`, onClick: (e) => {
+    return (jsxRuntimeExports.jsxs("article", { className: `mds-profile-card ${className}`, style: { '--mds-profile-card-photo-width': `${computedPhotoWidth}px` }, children: [jsxRuntimeExports.jsx("div", { className: "mds-profile-card__grain" }), jsxRuntimeExports.jsx("div", { className: "mds-profile-card__photo", children: photoSlot ? (jsxRuntimeExports.jsx("div", { className: "mds-profile-card__photo-slot", children: photoSlot })) : (jsxRuntimeExports.jsx("img", { src: photoUrl, alt: displayName, className: `mds-profile-card__avatar ${hasRealPhoto ? 'mds-profile-card__avatar--clickable' : ''}`, onClick: hasRealPhoto ? () => setShowPhotoModal(true) : undefined, role: hasRealPhoto ? 'button' : undefined, tabIndex: hasRealPhoto ? 0 : undefined, onKeyDown: hasRealPhoto ? (e) => e.key === 'Enter' && setShowPhotoModal(true) : undefined })) }), showPhotoModal && photoUrlFull && (jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__photo-modal", onClick: () => setShowPhotoModal(false), role: "dialog", "aria-modal": "true", "aria-label": "Enlarged photo - click anywhere to close", children: [jsxRuntimeExports.jsx("div", { className: "mds-profile-card__photo-modal-backdrop" }), jsxRuntimeExports.jsx("div", { className: "mds-profile-card__photo-modal-content", children: jsxRuntimeExports.jsx("img", { src: photoUrlFull, alt: displayName, className: "mds-profile-card__photo-modal-image" }) })] })), jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__content", children: [jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__identity", children: [jsxRuntimeExports.jsx("h1", { className: "mds-profile-card__name", children: displayName.toUpperCase() }), variant === 'full' && profession && (jsxRuntimeExports.jsx("p", { className: "mds-profile-card__profession", children: profession.toUpperCase() })), variant === 'compact' && (jsxRuntimeExports.jsx(UsernameLinks, { username: user.username, className: "mds-profile-card__username" }))] }), jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__details", children: [variant === 'full' && getLocation() && (jsxRuntimeExports.jsx("p", { className: "mds-profile-card__location", children: getLocation() })), variant === 'full' && (jsxRuntimeExports.jsx(UsernameLinks, { username: user.username, className: "mds-profile-card__username-detail" })), variant === 'compact' && user.email && (jsxRuntimeExports.jsx("p", { className: "mds-profile-card__email", children: user.email })), variant === 'compact' && (jsxRuntimeExports.jsxs("span", { className: "mds-profile-card__member", children: ["Member since ", memberSince] }))] }), variant === 'compact' && (jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__verification", children: [jsxRuntimeExports.jsxs("button", { className: "mds-profile-card__verified-badge", title: user.verification_score
+                                    ? `Verification Score: ${user.verification_score.score}`
+                                    : `Verification Level ${user.verified}`, onClick: (e) => {
                                     e.stopPropagation();
                                     setShowVerifiedPopup(!showVerifiedPopup);
-                                }, children: [Icons.shield, jsxRuntimeExports.jsxs("span", { children: ["Level ", user.verified] })] }), jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__dots", children: [jsxRuntimeExports.jsx("span", { className: `mds-profile-card__dot ${user.verified >= 1 ? 'active' : ''}`, title: "Email Verified" }), jsxRuntimeExports.jsx("span", { className: `mds-profile-card__dot ${user.verified >= 2 ? 'active' : ''}`, title: "Identity Verified" }), jsxRuntimeExports.jsx("span", { className: `mds-profile-card__dot ${user.verified >= 3 ? 'active' : ''}`, title: "Area Verified" })] })] })), showSocial && (jsxRuntimeExports.jsxs("div", { ref: socialRef, className: "mds-profile-card__social", children: [jsxRuntimeExports.jsx("button", { className: "mds-profile-card__social-trigger", onClick: (e) => {
+                                }, children: [Icons.shield, jsxRuntimeExports.jsx("span", { children: user.verification_score
+                                            ? user.verification_score.score
+                                            : `Level ${user.verified}` })] }), jsxRuntimeExports.jsx("div", { className: "mds-profile-card__dots", children: user.verification_score ? (
+                                // FEAT-090: Show 6 dots for verification score
+                                jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: user.verification_score.checks.slice(0, 6).map((check, index) => (jsxRuntimeExports.jsx("span", { className: `mds-profile-card__dot ${check.passed ? 'active' : ''}`, title: check.description }, check.name))) })) : (
+                                // Legacy: Show 3 dots for old verification levels
+                                jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsx("span", { className: `mds-profile-card__dot ${user.verified >= 1 ? 'active' : ''}`, title: "Email Verified" }), jsxRuntimeExports.jsx("span", { className: `mds-profile-card__dot ${user.verified >= 2 ? 'active' : ''}`, title: "Identity Verified" }), jsxRuntimeExports.jsx("span", { className: `mds-profile-card__dot ${user.verified >= 3 ? 'active' : ''}`, title: "Area Verified" })] })) })] })), showSocial && (jsxRuntimeExports.jsxs("div", { ref: socialRef, className: "mds-profile-card__social", children: [jsxRuntimeExports.jsx("button", { className: "mds-profile-card__social-trigger", onClick: (e) => {
                                     e.stopPropagation();
                                     setShowSocialPopup(!showSocialPopup);
                                     setShowVerifiedPopup(false);
@@ -1600,7 +1611,11 @@ function ProfileCard({ user, variant = 'full', photoWidth, showSocial = false, s
                                             e.stopPropagation();
                                             setShowVerifiedPopup(!showVerifiedPopup);
                                             setShowSocialPopup(false);
-                                        }, title: "Verification Status", children: Icons.shield }), showVerifiedPopup && (jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__verified-popup", children: [jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__verified-header", children: ["Verification Level ", user.verified] }), jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__verified-stats", children: [jsxRuntimeExports.jsx(StatItem, { label: "Email", verified: user.verified >= 1 }), jsxRuntimeExports.jsx(StatItem, { label: "Identity", verified: user.verified >= 2 }), jsxRuntimeExports.jsx(StatItem, { label: "Area", verified: user.verified >= 3 })] }), jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__verified-footer", children: [user.registration_sequence && (jsxRuntimeExports.jsxs("span", { className: "mds-profile-card__verified-sequence", children: ["User #", user.registration_sequence.toLocaleString()] })), jsxRuntimeExports.jsxs("span", { className: "mds-profile-card__verified-date", children: ["Since ", memberSince] })] })] }))] }), showRotatingInfo && (jsxRuntimeExports.jsx("div", { className: "mds-profile-card__info-dots", children: infoTexts.map((_, index) => (jsxRuntimeExports.jsx("span", { className: `mds-profile-card__info-dot ${index === currentInfoIndex ? 'active' : ''}` }, index))) }))] }))] })] }));
+                                        }, title: "Verification Status", children: Icons.shield }), showVerifiedPopup && (jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__verified-popup", children: [user.verification_score ? (
+                                            // FEAT-090: New 6-point verification score
+                                            jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__verified-header", children: ["Verificacao: ", user.verification_score.score] }), jsxRuntimeExports.jsx("div", { className: "mds-profile-card__verified-checks", children: user.verification_score.checks.map((check) => (jsxRuntimeExports.jsx(VerificationCheckItem, { description: check.description, passed: check.passed }, check.name))) })] })) : (
+                                            // Legacy: Old verification levels
+                                            jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__verified-header", children: ["Verification Level ", user.verified] }), jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__verified-stats", children: [jsxRuntimeExports.jsx(StatItem, { label: "Email", verified: user.verified >= 1 }), jsxRuntimeExports.jsx(StatItem, { label: "Identity", verified: user.verified >= 2 }), jsxRuntimeExports.jsx(StatItem, { label: "Area", verified: user.verified >= 3 })] })] })), jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__verified-footer", children: [user.registration_sequence && (jsxRuntimeExports.jsxs("span", { className: "mds-profile-card__verified-sequence", children: ["User #", user.registration_sequence.toLocaleString()] })), jsxRuntimeExports.jsxs("span", { className: "mds-profile-card__verified-date", children: ["Since ", memberSince] })] })] }))] }), showRotatingInfo && (jsxRuntimeExports.jsx("div", { className: "mds-profile-card__info-dots", children: infoTexts.map((_, index) => (jsxRuntimeExports.jsx("span", { className: `mds-profile-card__info-dot ${index === currentInfoIndex ? 'active' : ''}` }, index))) }))] }))] })] }));
 }
 
 const variantElementMap = {