@loafmarkets/ui 0.1.169 → 0.1.170

package/dist/index.js

@@ -8695,41 +8695,38 @@ function PropertyOverview({
     ) }),
     /* @__PURE__ */ jsxRuntime.jsxs(Section, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(SectionHeader, { children: "Asset Details" }),
-      /* @__PURE__ */ jsxRuntime.jsxs(AssetPanelsGrid, { children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(MetricsPanel, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(MetricsPanelTitle, { children: "Key Metrics" }),
-          (landSize != null || buildingSize != null) && /* @__PURE__ */ jsxRuntime.jsxs(LandFloorCard, { children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { flex: 1 }, children: [
-              /* @__PURE__ */ jsxRuntime.jsx(MetricLabel, { children: "Land" }),
-              /* @__PURE__ */ jsxRuntime.jsxs(MetricValueRow, { children: [
-                /* @__PURE__ */ jsxRuntime.jsx(MetricBig, { children: landSize?.toLocaleString() ?? "\u2014" }),
-                /* @__PURE__ */ jsxRuntime.jsx(MetricUnit, { children: "sqm" })
-              ] })
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsx("div", { style: { width: 1, background: "rgba(212,175,55,0.3)" } }),
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { flex: 1 }, children: [
-              /* @__PURE__ */ jsxRuntime.jsx(MetricLabel, { children: "Floor" }),
-              /* @__PURE__ */ jsxRuntime.jsxs(MetricValueRow, { children: [
-                /* @__PURE__ */ jsxRuntime.jsx(MetricBig, { children: buildingSize?.toLocaleString() ?? "\u2014" }),
-                /* @__PURE__ */ jsxRuntime.jsx(MetricUnit, { children: "sqm" })
-              ] })
+      /* @__PURE__ */ jsxRuntime.jsxs(StatsGrid, { children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(StatsColumn, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(StatsColumnHeader, { children: "Key Metrics" }),
+          landSize != null && /* @__PURE__ */ jsxRuntime.jsxs(StatRow, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(StatLabel, { children: "Land Size" }),
+            /* @__PURE__ */ jsxRuntime.jsxs(StatValue, { children: [
+              landSize.toLocaleString(),
+              " sqm"
+            ] })
+          ] }),
+          buildingSize != null && /* @__PURE__ */ jsxRuntime.jsxs(StatRow, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(StatLabel, { children: "Floor Area" }),
+            /* @__PURE__ */ jsxRuntime.jsxs(StatValue, { children: [
+              buildingSize.toLocaleString(),
+              " sqm"
             ] })
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(FeaturesGrid, { children: features.map((item, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
-            item.icon && /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "rgba(255,255,255,0.6)", display: "flex", alignItems: "center", opacity: 0.45, flexShrink: 0 }, children: item.icon }),
-            item.value && /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "1.1rem", fontWeight: 700, color: "#fff", lineHeight: 1 }, children: item.value }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "0.85rem", color: "rgba(255,255,255,0.6)", fontWeight: 400 }, children: item.label })
+          /* @__PURE__ */ jsxRuntime.jsx(AssetFeatureRow, { children: features.map((item, i) => /* @__PURE__ */ jsxRuntime.jsxs(AssetFeatureItem, { children: [
+            item.icon && /* @__PURE__ */ jsxRuntime.jsx(AssetFeatureIcon, { children: item.icon }),
+            item.value && /* @__PURE__ */ jsxRuntime.jsx(AssetFeatureValue, { children: item.value }),
+            /* @__PURE__ */ jsxRuntime.jsx(AssetFeatureLabel, { children: item.label })
           ] }, i)) })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs(InfoPanel, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(MetricsPanelTitle, { children: "Property Info" }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "flex", flexDirection: "column", gap: "0.85rem" }, children: propertyInfo.map((item, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
-            /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "0.8rem", color: "rgba(255,255,255,0.6)", fontWeight: 400 }, children: item.label }),
-            /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { fontSize: "0.95rem", fontWeight: 600, color: item.status === "active" ? "#4CAF50" : item.status === "progress" ? "#D4AF37" : "#fff", display: "flex", alignItems: "center", gap: "0.4rem" }, children: [
-              item.status && /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "inline-block", width: 6, height: 6, borderRadius: "50%", background: item.status === "active" ? "#4CAF50" : "#D4AF37", boxShadow: item.status === "active" ? "0 0 6px rgba(76,175,80,0.5)" : "0 0 6px rgba(212,175,55,0.5)" } }),
+        /* @__PURE__ */ jsxRuntime.jsxs(StatsColumn, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(StatsColumnHeader, { children: "Property Info" }),
+          propertyInfo.map((item, i) => /* @__PURE__ */ jsxRuntime.jsxs(StatRow, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(StatLabel, { children: item.label }),
+            /* @__PURE__ */ jsxRuntime.jsxs(StatValue, { style: { color: item.status === "active" ? "#4ade80" : item.status === "progress" ? "#D4AF37" : void 0 }, children: [
+              item.status && /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "inline-block", width: 6, height: 6, borderRadius: "50%", background: item.status === "active" ? "#4ade80" : "#D4AF37", marginRight: 6 } }),
               item.value
             ] })
-          ] }, i)) })
+          ] }, i))
         ] })
       ] })
     ] }),
@@ -8761,46 +8758,71 @@ function PropertyOverview({
     ] }),
     /* @__PURE__ */ jsxRuntime.jsxs(Section, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(SectionHeader, { children: "Tokenholder Security" }),
-      /* @__PURE__ */ jsxRuntime.jsxs(SecurityTable, { children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(SecurityRow, { children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(SecurityRowLeft, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(SecurityRowLabel, { children: "Legal Structuring" }),
-            /* @__PURE__ */ jsxRuntime.jsx(SecurityRowLogo, { children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: "/Baker_McKenzie.png", alt: "Baker McKenzie", style: { height: "22px", filter: "brightness(0) invert(1)", opacity: 0.8 } }) })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(SecurityRowRight, { children: /* @__PURE__ */ jsxRuntime.jsxs(SecurityRowLinks, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(SecurityDocLink, { href: "#documents", children: "Legal Opinion" }),
-            /* @__PURE__ */ jsxRuntime.jsx(SecurityDocLink, { href: "#documents", children: "Structuring Memo" })
-          ] }) })
+      /* @__PURE__ */ jsxRuntime.jsxs(SecurityCardsGrid, { children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(SecurityCard, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(SecurityCardIcon, { children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9 12l2 2 4-4" }),
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 3l8 4.5v5c0 5-3.5 8.5-8 10.5-4.5-2-8-5.5-8-10.5v-5l8-4.5z" })
+          ] }) }),
+          /* @__PURE__ */ jsxRuntime.jsxs(SecurityCardContent, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(SecurityCardTitle, { children: "Legal Structuring" }),
+            /* @__PURE__ */ jsxRuntime.jsx(SecurityCardProvider, { children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: "/Baker_McKenzie.png", alt: "Baker McKenzie", style: { height: 16, filter: "brightness(0) invert(1)", opacity: 0.7 } }) }),
+            /* @__PURE__ */ jsxRuntime.jsxs(SecurityCardLinks, { children: [
+              /* @__PURE__ */ jsxRuntime.jsx(SecurityDocLink, { href: "#documents", children: "Legal Opinion" }),
+              /* @__PURE__ */ jsxRuntime.jsx(SecurityDocLink, { href: "#documents", children: "Structuring Memo" })
+            ] })
+          ] })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs(SecurityRow, { children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(SecurityRowLeft, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(SecurityRowLabel, { children: "Security Interest in Asset" }),
-            /* @__PURE__ */ jsxRuntime.jsxs(SecurityRowValue, { children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(SecurityCard, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(SecurityCardIcon, { children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "3", y: "11", width: "18", height: "11", rx: "2" }),
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M7 11V7a5 5 0 0 1 10 0v4" })
+          ] }) }),
+          /* @__PURE__ */ jsxRuntime.jsxs(SecurityCardContent, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(SecurityCardTitle, { children: "Security Interest in Asset" }),
+            /* @__PURE__ */ jsxRuntime.jsxs(SecurityCardStatus, { children: [
               /* @__PURE__ */ jsxRuntime.jsx(SecurityStatusDot, {}),
               "Secured \u2014 NSW Land Registry"
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs(SecurityCardLinks, { children: [
+              /* @__PURE__ */ jsxRuntime.jsx(SecurityDocLink, { href: "#documents", children: "Mortgage Agreement" }),
+              /* @__PURE__ */ jsxRuntime.jsx(SecurityDocLink, { href: "#documents", children: "Registry Filing" })
             ] })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(SecurityRowRight, { children: /* @__PURE__ */ jsxRuntime.jsxs(SecurityRowLinks, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(SecurityDocLink, { href: "#documents", children: "Mortgage Agreement" }),
-            /* @__PURE__ */ jsxRuntime.jsx(SecurityDocLink, { href: "#documents", children: "Registry Filing" })
-          ] }) })
+          ] })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs(SecurityRow, { children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(SecurityRowLeft, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(SecurityRowLabel, { children: "Bankruptcy Remote" }),
-            /* @__PURE__ */ jsxRuntime.jsxs(SecurityRowValue, { children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(SecurityCard, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(SecurityCardIcon, { children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M3 21h18" }),
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M5 21V7l8-4v18" }),
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M19 21V11l-6-4" }),
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9 9v.01" }),
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9 12v.01" }),
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9 15v.01" }),
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9 18v.01" })
+          ] }) }),
+          /* @__PURE__ */ jsxRuntime.jsxs(SecurityCardContent, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(SecurityCardTitle, { children: "Bankruptcy Remote" }),
+            /* @__PURE__ */ jsxRuntime.jsxs(SecurityCardStatus, { children: [
               /* @__PURE__ */ jsxRuntime.jsx(SecurityStatusDot, {}),
               "Active \u2014 Dedicated SPV"
-            ] })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(SecurityRowRight, { children: /* @__PURE__ */ jsxRuntime.jsx(SecurityRowLinks, { children: /* @__PURE__ */ jsxRuntime.jsx(SecurityDocLink, { href: "#documents", children: "SPV Constitution" }) }) })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx(SecurityCardLinks, { children: /* @__PURE__ */ jsxRuntime.jsx(SecurityDocLink, { href: "#documents", children: "SPV Constitution" }) })
+          ] })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs(SecurityRow, { $noBorder: true, children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(SecurityRowLeft, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(SecurityRowLabel, { children: "Independent Valuation" }),
-            /* @__PURE__ */ jsxRuntime.jsx(SecurityRowLogo, { children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: "/savills.png", alt: "Savills", style: { height: "18px", filter: "brightness(0) invert(1)", opacity: 0.8 } }) })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(SecurityRowRight, { children: /* @__PURE__ */ jsxRuntime.jsx(SecurityRowLinks, { children: /* @__PURE__ */ jsxRuntime.jsx(SecurityDocLink, { href: "#documents", children: "Valuation Report" }) }) })
+        /* @__PURE__ */ jsxRuntime.jsxs(SecurityCard, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(SecurityCardIcon, { children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M16 3h5v5" }),
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M8 3H3v5" }),
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 22l-4-4 4-4" }),
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 22l4-4-4-4" }),
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M21 3l-9 9" }),
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M3 3l9 9" })
+          ] }) }),
+          /* @__PURE__ */ jsxRuntime.jsxs(SecurityCardContent, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(SecurityCardTitle, { children: "Independent Valuation" }),
+            /* @__PURE__ */ jsxRuntime.jsx(SecurityCardProvider, { children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: "/savills.png", alt: "Savills", style: { height: 14, filter: "brightness(0) invert(1)", opacity: 0.7 } }) }),
+            /* @__PURE__ */ jsxRuntime.jsx(SecurityCardLinks, { children: /* @__PURE__ */ jsxRuntime.jsx(SecurityDocLink, { href: "#documents", children: "Valuation Report" }) })
+          ] })
         ] })
       ] })
     ] })
@@ -9132,68 +9154,35 @@ var StatValue = styled9__default.default.span`
   color: ${(p) => p.$gold ? "#D4AF37" : "#fff"};
   font-variant-numeric: tabular-nums;
 `;
-var AssetPanelsGrid = styled9__default.default.div`
-  display: grid;
-  grid-template-columns: 1fr 1fr;
-  gap: 1rem;
-  @media (max-width: 768px) { grid-template-columns: 1fr; }
-`;
-var MetricsPanel = styled9__default.default.div`
-  background: rgba(255,255,255,0.025);
-  border-radius: 10px;
-  border: 1px solid rgba(255,255,255,0.06);
-  padding: 1.25rem 1.5rem;
-  overflow: hidden;
-`;
-var InfoPanel = styled9__default.default(MetricsPanel)``;
-var MetricsPanelTitle = styled9__default.default.div`
-  font-size: 0.65rem;
-  color: #D4AF37;
-  text-transform: uppercase;
-  letter-spacing: 0.12em;
-  font-weight: 600;
-  margin-bottom: 1rem;
-  padding-bottom: 0.75rem;
-  border-bottom: 1px solid rgba(255,255,255,0.06);
-`;
-var LandFloorCard = styled9__default.default.div`
-  background: linear-gradient(135deg, rgba(212,175,55,0.12), rgba(184,134,11,0.06));
-  border-radius: 10px;
-  padding: 0.85rem 1rem;
-  border: 1px solid rgba(212,175,55,0.25);
+var AssetFeatureRow = styled9__default.default.div`
   display: flex;
-  gap: 1rem;
-  margin-bottom: 0.75rem;
+  flex-wrap: wrap;
+  gap: 0.5rem 1.25rem;
+  padding-top: 0.75rem;
+  margin-top: 0.25rem;
+  border-top: 1px solid rgba(255,255,255,0.04);
 `;
-var MetricLabel = styled9__default.default.div`
-  font-size: 0.65rem;
-  color: #D4AF37;
-  text-transform: uppercase;
-  letter-spacing: 0.1em;
-  margin-bottom: 0.4rem;
-  font-weight: 500;
+var AssetFeatureItem = styled9__default.default.div`
+  display: flex;
+  align-items: center;
+  gap: 0.35rem;
 `;
-var MetricValueRow = styled9__default.default.div`
+var AssetFeatureIcon = styled9__default.default.span`
+  color: rgba(255,255,255,0.35);
   display: flex;
-  align-items: baseline;
-  gap: 0.25rem;
+  align-items: center;
+  flex-shrink: 0;
 `;
-var MetricBig = styled9__default.default.span`
-  font-size: 1.5rem;
-  font-weight: 700;
-  color: #D4AF37;
+var AssetFeatureValue = styled9__default.default.span`
+  font-size: 0.95rem;
+  font-weight: 600;
+  color: #fff;
   line-height: 1;
 `;
-var MetricUnit = styled9__default.default.span`
-  font-size: 0.7rem;
-  color: rgba(212,175,55,0.7);
-  font-weight: 500;
-`;
-var FeaturesGrid = styled9__default.default.div`
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-  gap: 0.75rem;
-  @media (max-width: 768px) { grid-template-columns: repeat(2, 1fr); }
+var AssetFeatureLabel = styled9__default.default.span`
+  font-size: 0.8rem;
+  color: rgba(255,255,255,0.5);
+  font-weight: 400;
 `;
 var TradingHoursCard = styled9__default.default.div`
   background: rgba(255,255,255,0.025);
@@ -9228,40 +9217,56 @@ var TradingHoursNote = styled9__default.default.div`
   color: rgba(255,255,255,0.35);
   border-top: 1px solid rgba(255,255,255,0.04);
 `;
-var SecurityTable = styled9__default.default.div`
+var SecurityCardsGrid = styled9__default.default.div`
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 0.75rem;
+  @media (max-width: 768px) { grid-template-columns: 1fr; }
+`;
+var SecurityCard = styled9__default.default.div`
+  background: rgba(255,255,255,0.025);
+  border: 1px solid rgba(255,255,255,0.06);
+  border-radius: 10px;
+  padding: 1.25rem;
   display: flex;
-  flex-direction: column;
+  gap: 1rem;
+  transition: border-color 0.2s ease;
+  &:hover { border-color: rgba(255,255,255,0.12); }
 `;
-var SecurityRow = styled9__default.default.div`
+var SecurityCardIcon = styled9__default.default.div`
+  width: 40px;
+  height: 40px;
+  border-radius: 10px;
+  background: rgba(74,222,128,0.08);
+  border: 1px solid rgba(74,222,128,0.15);
   display: flex;
   align-items: center;
-  justify-content: space-between;
-  padding: 1rem 0;
-  border-bottom: ${({ $noBorder }) => $noBorder ? "none" : "1px solid rgba(255,255,255,0.06)"};
-  gap: 1rem;
-  @media (max-width: 640px) { flex-direction: column; align-items: flex-start; }
+  justify-content: center;
+  flex-shrink: 0;
+  color: #4ade80;
 `;
-var SecurityRowLeft = styled9__default.default.div`
+var SecurityCardContent = styled9__default.default.div`
   display: flex;
   flex-direction: column;
   gap: 4px;
+  min-width: 0;
 `;
-var SecurityRowLabel = styled9__default.default.div`
-  font-size: 0.88rem;
+var SecurityCardTitle = styled9__default.default.div`
+  font-size: 0.85rem;
   font-weight: 600;
   color: #fff;
 `;
-var SecurityRowValue = styled9__default.default.div`
+var SecurityCardStatus = styled9__default.default.div`
   display: flex;
   align-items: center;
   gap: 6px;
-  font-size: 0.78rem;
+  font-size: 0.75rem;
   color: rgba(255,255,255,0.5);
 `;
-var SecurityRowLogo = styled9__default.default.div`
+var SecurityCardProvider = styled9__default.default.div`
   display: flex;
   align-items: center;
-  margin-top: 2px;
+  margin-top: 1px;
 `;
 var SecurityStatusDot = styled9__default.default.span`
   width: 6px;
@@ -9271,21 +9276,17 @@ var SecurityStatusDot = styled9__default.default.span`
   display: inline-block;
   flex-shrink: 0;
 `;
-var SecurityRowRight = styled9__default.default.div`
-  display: flex;
-  align-items: center;
-  flex-shrink: 0;
-`;
-var SecurityRowLinks = styled9__default.default.div`
+var SecurityCardLinks = styled9__default.default.div`
   display: flex;
-  gap: 1.25rem;
+  gap: 0.75rem;
+  margin-top: 4px;
 `;
 var SecurityDocLink = styled9__default.default.a`
-  font-size: 0.78rem;
-  color: rgba(255,255,255,0.45);
+  font-size: 0.72rem;
+  color: rgba(255,255,255,0.4);
   text-decoration: underline;
   text-underline-offset: 3px;
-  text-decoration-color: rgba(255,255,255,0.2);
+  text-decoration-color: rgba(255,255,255,0.15);
   cursor: pointer;
   transition: color 0.15s, text-decoration-color 0.15s;
   &:hover {
@@ -10558,7 +10559,7 @@ function AssetSelectorBar({
       i > 0 && /* @__PURE__ */ jsxRuntime.jsx(Separator, { children: "|" }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(MetricLabel2, { children: m.label }),
+          /* @__PURE__ */ jsxRuntime.jsx(MetricLabel, { children: m.label }),
           /* @__PURE__ */ jsxRuntime.jsx(MetricValue, { $accent: !!m.accent, $secondary: !!m.secondary, children: m.value })
         ] }),
         m.change != null && /* @__PURE__ */ jsxRuntime.jsxs(MetricChange, { $positive: m.change >= 0, children: [
@@ -10698,7 +10699,7 @@ var SelectorMetrics = styled9__default.default.div`
     gap: 0.5rem;
   }
 `;
-var MetricLabel2 = styled9__default.default.span`
+var MetricLabel = styled9__default.default.span`
   font-size: 0.75rem;
   color: var(--color-text-secondary);
   text-transform: uppercase;
@@ -11007,14 +11008,14 @@ function OfferingProgressCard({
       ] }) : /* @__PURE__ */ jsxRuntime.jsx(PreLiveStatus, { $statusColor: statusColor, children: "Sale Not Yet Open" }),
       /* @__PURE__ */ jsxRuntime.jsxs(MetricsRow, { children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(MetricLabel3, { children: isPrivateClient ? "Token Price (Pre-Offering)" : "Token Price" }),
+          /* @__PURE__ */ jsxRuntime.jsx(MetricLabel2, { children: isPrivateClient ? "Token Price (Pre-Offering)" : "Token Price" }),
           /* @__PURE__ */ jsxRuntime.jsxs(MetricValue2, { $accent: true, children: [
             "$",
             tokenPrice.toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 2 })
           ] })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { textAlign: "right" }, children: [
-          /* @__PURE__ */ jsxRuntime.jsx(MetricLabel3, { children: isPrivateClient ? "Offering Valuation (Pre-Offering)" : "Offering Valuation" }),
+          /* @__PURE__ */ jsxRuntime.jsx(MetricLabel2, { children: isPrivateClient ? "Offering Valuation (Pre-Offering)" : "Offering Valuation" }),
           /* @__PURE__ */ jsxRuntime.jsxs(MetricValue2, { children: [
             "$",
             offeringValuation.toLocaleString()
@@ -11139,7 +11140,7 @@ var MetricsRow = styled9__default.default.div`
   border-top: 1px solid rgba(255,255,255,0.06);
   padding-top: 1rem;
 `;
-var MetricLabel3 = styled9__default.default.div`
+var MetricLabel2 = styled9__default.default.div`
   font-size: 0.6rem;
   color: var(--color-text-secondary);
   text-transform: uppercase;