@flamingo-stack/openframe-frontend-core 0.0.439 → 0.0.440

package/dist/components/index.js

@@ -4,7 +4,7 @@ import "../chunk-GZ4C3XW6.js";
 import {
   GROUP_PAGE_SIZE,
   RelatedContentSection
-} from "../chunk-WPVBTVI3.js";
+} from "../chunk-AGV26PUR.js";
 import {
   DeliveryLists,
   DeliveryTable,
@@ -21,7 +21,7 @@ import {
   useLegalDocs,
   usePaginationLoading,
   useRoadmapVoting
-} from "../chunk-WAGTZVQN.js";
+} from "../chunk-IAZ5AN2E.js";
 import {
   AnnouncementBarSkeleton,
   ArticleLayoutSkeleton,
@@ -54,17 +54,17 @@ import {
   useDocNavigation,
   useDocumentTree,
   useScrollSpy
-} from "../chunk-PBTY7AH5.js";
+} from "../chunk-YZJUHEPZ.js";
 import {
   FileDownloadCard,
   GoogleSheetsViewer,
   PdfViewer
-} from "../chunk-2ELBNZJ3.js";
+} from "../chunk-QAG357PE.js";
 import {
   FaqAccordion,
   FaqDocumentPage,
   FaqSection
-} from "../chunk-P7PISHM5.js";
+} from "../chunk-Y3NFB6HR.js";
 import {
   DeliveryRow,
   DevCardRowContent,
@@ -75,11 +75,11 @@ import {
   EmptyState,
   UnifiedPagination,
   init_unified_pagination
-} from "../chunk-EGRZHR7J.js";
+} from "../chunk-SM26C2L7.js";
 import {
   ArticleAuthorByline,
   DetailPageSkeleton
-} from "../chunk-PEIR7D25.js";
+} from "../chunk-7KNOHGMI.js";
 import {
   DocSearchBar,
   DocSearchResultRow,
@@ -87,10 +87,10 @@ import {
   mapDocSearchResults,
   resolveSearchResultAction,
   useDocSearch
-} from "../chunk-7WM77CSW.js";
+} from "../chunk-JYI4R25Q.js";
 import {
   useSelfFetch
-} from "../chunk-QXYOGJQJ.js";
+} from "../chunk-7KDR5P23.js";
 import {
   ADMIN_APPROVAL_REQUEST_CONTEXT_TYPE,
   AIEnrichButton,
@@ -626,7 +626,6 @@ import {
   SoftwareSourceBadge,
   SourceActionButton,
   SquareAvatar,
-  SquareAvatar2,
   SsoAuthShell,
   SsoProviderButtons,
   StackedRowsPanel,
@@ -893,7 +892,7 @@ import {
   useVideoOriginPreconnect,
   useVideoWarmup,
   usesCanonicalStatusStyle
-} from "../chunk-NQQ4NLUT.js";
+} from "../chunk-ZQYFDYWV.js";
 import {
   CommandApprovalToast,
   ToastCard,
@@ -912,7 +911,7 @@ import {
   showToast,
   useOnboardingState,
   useToast
-} from "../chunk-RVWC4P3H.js";
+} from "../chunk-2BTDPDME.js";
 import "../chunk-OYGFWWLQ.js";
 import {
   useChatRuntime,
@@ -959,7 +958,7 @@ import {
   SplitButton,
   buttonVariants,
   init_button2 as init_button
-} from "../chunk-4ACSUJ7Q.js";
+} from "../chunk-6CITW5BD.js";
 import "../chunk-6U3IUD57.js";
 import {
   init_next_link,
@@ -1229,7 +1228,7 @@ function AnnouncementBar({
                   className: "relative shrink-0 w-5 h-5 md:w-6 md:h-6"
                 }
               ),
-              /* @__PURE__ */ jsxs("p", { className: "font-body flex-1 min-w-0 max-w-full text-[13px] md:text-sm leading-snug truncate mb-0", children: [
+              /* @__PURE__ */ jsxs("p", { className: "flex-1 min-w-0 max-w-full text-h6 truncate mb-0", children: [
                 /* @__PURE__ */ jsx("span", { className: "font-semibold", children: displayAnnouncement.title }),
                 displayAnnouncement.description && /* @__PURE__ */ jsxs("span", { className: "hidden sm:inline opacity-80", children: [
                   " \xB7 ",
@@ -1379,7 +1378,7 @@ function VendorIcon({
       )
     }
   ) : /* @__PURE__ */ jsx2("div", { className: cn(
-    "flex items-center justify-center text-xs font-medium uppercase",
+    "flex items-center justify-center text-h6 uppercase",
     backgroundStyle === "white" ? "text-[#333333]" : "text-ods-text-secondary"
   ), children: vendor.title?.substring(0, 2) || "??" }) });
 }
@@ -1398,7 +1397,7 @@ function CategoriesCart({
     next_link_default,
     {
       href: `/vendors?category=${category.slug}`,
-      className: `block bg-ods-card border border-ods-border rounded-lg p-3 md:p-4 pb-4 md:pb-6 hover:border-[#FFC008] transition-colors group relative ${className}`,
+      className: `block bg-ods-card border border-ods-border rounded-lg p-3 md:p-4 pb-4 md:pb-6 hover:border-ods-accent transition-colors group relative ${className}`,
       children: /* @__PURE__ */ jsxs2("div", { className: "flex flex-col gap-4 md:gap-6", children: [
         /* @__PURE__ */ jsxs2("div", { className: "relative w-full h-8 md:h-10 overflow-hidden", children: [
           /* @__PURE__ */ jsx3("div", { className: "flex gap-2 md:gap-3 w-full", children: isLoading ? (
@@ -1424,7 +1423,7 @@ function CategoriesCart({
               "div",
               {
                 className: "w-8 h-8 md:w-10 md:h-10 bg-ods-border rounded flex items-center justify-center opacity-30 flex-shrink-0",
-                children: /* @__PURE__ */ jsx3("div", { className: "w-4 h-4 md:w-6 md:h-6 bg-[#888888] rounded-sm" })
+                children: /* @__PURE__ */ jsx3("div", { className: "w-4 h-4 md:w-6 md:h-6 bg-ods-skeleton rounded-sm" })
               },
               index
             ))
@@ -1435,7 +1434,7 @@ function CategoriesCart({
         /* @__PURE__ */ jsxs2("div", { className: "flex flex-col gap-2", children: [
           /* @__PURE__ */ jsxs2("div", { className: "flex flex-col gap-1", children: [
             /* @__PURE__ */ jsx3("h3", { className: "text-xl md:text-2xl font-bold text-ods-text-primary group-hover:text-ods-accent transition-colors leading-[1.33] font-body", children: category.name }),
-            /* @__PURE__ */ jsxs2("p", { className: "text-sm md:text-base font-medium text-ods-text-secondary leading-[1.43] font-body", children: [
+            /* @__PURE__ */ jsxs2("p", { className: "text-h6 text-ods-text-secondary", children: [
               subcategoryCount || 0,
               " Subcategories \u2022 ",
               vendorCount || 0,
@@ -1443,13 +1442,13 @@ function CategoriesCart({
             ] })
           ] }),
           /* @__PURE__ */ jsxs2("div", { className: "flex items-start md:items-end justify-between gap-4 md:gap-6", children: [
-            /* @__PURE__ */ jsx3("p", { className: "font-['DM_Sans'] font-medium text-lg leading-[1.33] text-ods-text-primary flex-1", children: category.description }),
+            /* @__PURE__ */ jsx3("p", { className: "text-h4 text-ods-text-primary flex-1", children: category.description }),
             /* @__PURE__ */ jsx3(
               "div",
               {
-                className: "flex items-center justify-center w-10 h-10 md:w-12 md:h-12 bg-transparent border border-ods-border rounded-md group-hover:bg-[#FFC008] transition-colors flex-shrink-0",
+                className: "flex items-center justify-center w-10 h-10 md:w-12 md:h-12 bg-transparent border border-ods-border rounded-md group-hover:bg-ods-accent transition-colors flex-shrink-0",
                 "aria-label": `View ${category.name} category`,
-                children: /* @__PURE__ */ jsx3(ChevronRight, { className: "w-5 h-5 md:w-6 md:h-6 text-ods-text-primary group-hover:text-black transition-colors" })
+                children: /* @__PURE__ */ jsx3(ChevronRight, { className: "w-5 h-5 md:w-6 md:h-6 text-ods-text-primary group-hover:text-ods-text-on-accent transition-colors" })
               }
             )
           ] })
@@ -1462,22 +1461,22 @@ function CategoriesCart({
 // src/components/category-card.tsx
 import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
 function CategoryCard({ name, description, categoryCount, productCount, icons = [] }) {
-  return /* @__PURE__ */ jsxs3("article", { className: "bg-[#1A1A1A] border border-[#424242] rounded-[12px] p-8 flex flex-col min-w-0 box-border", children: [
-    /* @__PURE__ */ jsx4("div", { className: "flex gap-6 mb-8 justify-center items-center", children: (icons.length > 0 ? icons : Array(10).fill(null)).map((icon, i) => /* @__PURE__ */ jsx4("div", { className: "w-10 h-10 bg-gray-700 rounded flex items-center justify-center", children: icon }, i)) }),
+  return /* @__PURE__ */ jsxs3("article", { className: "bg-ods-card border border-ods-border rounded-[12px] p-8 flex flex-col min-w-0 box-border", children: [
+    /* @__PURE__ */ jsx4("div", { className: "flex gap-6 mb-8 justify-center items-center", children: (icons.length > 0 ? icons : Array(10).fill(null)).map((icon, i) => /* @__PURE__ */ jsx4("div", { className: "w-10 h-10 bg-ods-skeleton rounded flex items-center justify-center", children: icon }, i)) }),
     /* @__PURE__ */ jsxs3("div", { className: "flex-1 flex flex-col", children: [
       /* @__PURE__ */ jsx4("h2", { className: "text-[24px] font-bold text-ods-text-primary mb-2 text-left leading-tight", children: name }),
-      /* @__PURE__ */ jsxs3("div", { className: "text-[16px] text-ods-text-secondary mb-4 text-left", children: [
+      /* @__PURE__ */ jsxs3("div", { className: "text-h6 text-ods-text-secondary mb-4 text-left", children: [
         categoryCount,
         " Categories \u2022 ",
         productCount,
         " Products"
       ] }),
       /* @__PURE__ */ jsxs3("div", { className: "flex flex-row items-start", children: [
-        /* @__PURE__ */ jsx4("p", { className: "text-[16px] text-ods-text-primary text-left leading-snug flex-1", children: description }),
+        /* @__PURE__ */ jsx4("p", { className: "text-h6 text-ods-text-primary text-left flex-1", children: description }),
         /* @__PURE__ */ jsx4(
           "button",
           {
-            className: "w-12 h-12 flex items-center justify-center border border-ods-border rounded-[6px] bg-transparent hover:bg-[#FFC008] transition-colors ml-4",
+            className: "w-12 h-12 flex items-center justify-center border border-ods-border rounded-[6px] bg-transparent hover:bg-ods-accent transition-colors ml-4",
             style: { minWidth: 48, minHeight: 48 },
             "aria-label": `View ${name}`,
             children: /* @__PURE__ */ jsx4("svg", { width: "24", height: "24", fill: "none", stroke: "#FAFAFA", strokeWidth: "2", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx4("path", { d: "M9 18l6-6-6-6" }) })
@@ -1519,7 +1518,7 @@ function VendorDisplayButton({ vendor, onClick, variant = "default", externalUrl
               className: "w-full h-full object-cover"
             }
           ) }) : /* @__PURE__ */ jsx5("div", { className: "w-5 h-5 rounded bg-ods-border flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx5("span", { className: "text-ods-text-secondary text-[10px] font-medium", children: vendor.title.charAt(0).toUpperCase() }) }),
-          /* @__PURE__ */ jsx5("span", { className: "text-sm font-medium text-ods-text-primary", children: vendor.title })
+          /* @__PURE__ */ jsx5("span", { className: "text-h6 text-ods-text-primary", children: vendor.title })
         ]
       }
     );
@@ -1539,7 +1538,7 @@ function VendorDisplayButton({ vendor, onClick, variant = "default", externalUrl
             height: 24,
             className: "rounded object-cover"
           }
-        ) }) : /* @__PURE__ */ jsx5("div", { className: "w-8 h-8 bg-ods-border border border-ods-border rounded-lg flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx5("span", { className: "text-ods-text-primary text-[12px] font-medium", children: vendor.title.charAt(0) }) }),
+        ) }) : /* @__PURE__ */ jsx5("div", { className: "w-8 h-8 bg-ods-border border border-ods-border rounded-lg flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx5("span", { className: "text-ods-text-primary text-h6", children: vendor.title.charAt(0) }) }),
         /* @__PURE__ */ jsx5("span", { className: "text-h4 text-ods-text-primary truncate min-w-0", title: vendor.title, children: vendor.title })
       ]
     }
@@ -1680,19 +1679,19 @@ function UserSummary({
         ] }),
         (authProviders?.length || showEditButton) && /* @__PURE__ */ jsxs5("div", { className: "hidden md:flex flex-col items-end justify-between flex-shrink-0 min-h-[6rem]", children: [
           authProviders && authProviders.length > 0 && /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ jsx7("span", { className: "text-xs text-ods-text-secondary whitespace-nowrap select-none", children: "Authorized by" }),
+            /* @__PURE__ */ jsx7("span", { className: "text-h6 text-ods-text-secondary whitespace-nowrap select-none", children: "Authorized by" }),
             /* @__PURE__ */ jsx7("div", { className: "flex items-center gap-2", children: authProviders.map((p) => /* @__PURE__ */ jsx7("div", { className: "flex items-center justify-center w-4 h-4", children: getAuthProviderIcon(p) }, p)) })
           ] }),
-          showEditButton && /* @__PURE__ */ jsx7("div", { className: "text-xs text-ods-text-secondary", children: "Edit Profile" })
+          showEditButton && /* @__PURE__ */ jsx7("div", { className: "text-h6 text-ods-text-secondary", children: "Edit Profile" })
         ] })
       ] })
     ] }),
     (authProviders?.length || showEditButton) && /* @__PURE__ */ jsxs5("div", { className: "flex md:hidden items-center justify-between w-full gap-4", children: [
       authProviders && authProviders.length > 0 && /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx7("span", { className: "text-xs text-ods-text-secondary whitespace-nowrap select-none", children: "Authorized by" }),
+        /* @__PURE__ */ jsx7("span", { className: "text-h6 text-ods-text-secondary whitespace-nowrap select-none", children: "Authorized by" }),
         /* @__PURE__ */ jsx7("div", { className: "flex items-center gap-2", children: authProviders.map((p) => /* @__PURE__ */ jsx7("div", { className: "flex items-center justify-center w-4 h-4", children: getAuthProviderIcon(p) }, p)) })
       ] }),
-      showEditButton && /* @__PURE__ */ jsx7("div", { className: "text-xs text-ods-text-secondary", children: "Edit Profile" })
+      showEditButton && /* @__PURE__ */ jsx7("div", { className: "text-h6 text-ods-text-secondary", children: "Edit Profile" })
     ] })
   ] });
 }
@@ -1733,7 +1732,7 @@ function CommentCard({
             })
           }
         ),
-        /* @__PURE__ */ jsx8("span", { className: "font-['DM_Sans'] font-medium text-[14px] leading-[1.43] text-ods-text-secondary whitespace-nowrap flex-shrink-0", children: formatActivityTime(comment.createdAt) })
+        /* @__PURE__ */ jsx8("span", { className: "text-h6 text-ods-text-secondary whitespace-nowrap flex-shrink-0", children: formatActivityTime(comment.createdAt) })
       ] }) : context === "vendor" && comment.user ? /* @__PURE__ */ jsx8(
         UserSummary,
         {
@@ -2118,7 +2117,7 @@ function FilterChip({
   const baseClasses = cn(
     "inline-flex items-center justify-center rounded-full font-medium transition-all duration-200 shrink-0 group cursor-pointer",
     "hover:shadow-md hover:scale-105 focus:outline-none focus:ring-2 focus:ring-offset-2",
-    "font-['DM_Sans'] leading-none",
+    "font-body leading-none",
     // Size variants - enhanced mobile sizing for better visibility and touch targets
     size === "sm" ? "text-sm pl-3 pr-3 py-1 md:text-sm md:pl-3 md:pr-3 md:py-1" : "text-sm pl-3 pr-3 py-2 md:text-sm md:pl-3 md:pr-3 md:py-2",
     // Add gap only if removable (has X button) - placed after text
@@ -2128,13 +2127,13 @@ function FilterChip({
   );
   const variantClasses = {
     // Legacy variants (for backward compatibility)
-    selected: "bg-[#2A2A2A] text-[#E8E8E8] border border-[#FFC008] hover:bg-ods-border hover:border-[#FFD951] focus:ring-[#FFC008] focus:ring-offset-[#161616]",
-    unselected: "bg-[#2A2A2A] text-[#CCCCCC] border border-[#4A4A4A] hover:bg-ods-border hover:border-[#5A5A5A] hover:text-ods-text-primary focus:ring-[#4A4A4A] focus:ring-offset-[#161616]",
-    info: "bg-ods-border text-[#CCCCCC] border border-[#5A5A5A] cursor-default hover:scale-100 hover:shadow-none focus:ring-[#5A5A5A] focus:ring-offset-[#161616]",
+    selected: "bg-ods-bg-surface text-ods-text-primary border border-ods-accent hover:bg-ods-border hover:border-ods-accent-hover focus:ring-ods-accent focus:ring-offset-ods-bg",
+    unselected: "bg-ods-bg-surface text-ods-text-secondary border border-ods-border hover:bg-ods-border hover:border-ods-border-hover hover:text-ods-text-primary focus:ring-ods-border focus:ring-offset-ods-bg",
+    info: "bg-ods-border text-ods-text-secondary border border-ods-border-hover cursor-default hover:scale-100 hover:shadow-none focus:ring-ods-border-hover focus:ring-offset-ods-bg",
     // New subtle selected variants - same backgrounds/text, only border colors different
-    category: "bg-[#2A2A2A] text-[#E8E8E8] border border-[#FFC008]/40 hover:bg-ods-border hover:border-[#FFC008]/60 hover:text-ods-text-primary focus:ring-[#FFC008]/40 focus:ring-offset-[#161616]",
-    subcategory: "bg-[#2A2A2A] text-[#E8E8E8] border border-[#FFC008]/60 hover:bg-ods-border hover:border-[#FFC008]/80 hover:text-ods-text-primary focus:ring-[#FFC008]/60 focus:ring-offset-[#161616]",
-    tag: "bg-[#2A2A2A] text-ods-text-primary border border-[#FFC008]/20 hover:bg-ods-border hover:border-[#FFC008]/30 hover:text-ods-text-primary focus:ring-[#FFC008]/20 focus:ring-offset-[#161616]"
+    category: "bg-ods-bg-surface text-ods-text-primary border border-ods-accent/40 hover:bg-ods-border hover:border-ods-accent/60 hover:text-ods-text-primary focus:ring-ods-accent/40 focus:ring-offset-ods-bg",
+    subcategory: "bg-ods-bg-surface text-ods-text-primary border border-ods-accent/60 hover:bg-ods-border hover:border-ods-accent/80 hover:text-ods-text-primary focus:ring-ods-accent/60 focus:ring-offset-ods-bg",
+    tag: "bg-ods-bg-surface text-ods-text-primary border border-ods-accent/20 hover:bg-ods-border hover:border-ods-accent/30 hover:text-ods-text-primary focus:ring-ods-accent/20 focus:ring-offset-ods-bg"
   };
   return /* @__PURE__ */ jsxs9(
     "div",
@@ -2151,7 +2150,7 @@ function FilterChip({
       "aria-disabled": disabled,
       children: [
         /* @__PURE__ */ jsx11("span", { className: cn(
-          "truncate font-['DM_Sans'] font-medium leading-none text-center",
+          "truncate font-body font-medium leading-none text-center",
           size === "sm" ? "max-w-[100px] md:max-w-[120px]" : "max-w-[120px] md:max-w-[140px]"
         ), title: label, children: label }),
         removable && onRemove && /* @__PURE__ */ jsx11(
@@ -2168,7 +2167,7 @@ function FilterChip({
               "flex items-center justify-center w-4 h-4 md:w-4 md:h-4 rounded-full",
               "transition-all duration-200 shrink-0",
               "group-hover:scale-110 focus:outline-none focus:ring-2 focus:ring-offset-1",
-              variant === "category" ? "hover:bg-[#4A4A4A] text-[#E8E8E8] focus:ring-[#E8E8E8] focus:ring-offset-[#2A2A2A]" : variant === "subcategory" ? "hover:bg-[#4A4A4A] text-[#E8E8E8] focus:ring-[#E8E8E8] focus:ring-offset-[#2A2A2A]" : variant === "tag" ? "hover:bg-[#4A4A4A] text-[#E8E8E8] focus:ring-[#E8E8E8] focus:ring-offset-[#2A2A2A]" : "hover:bg-[#4A4A4A] text-[#E8E8E8] focus:ring-[#E8E8E8] focus:ring-offset-[#2A2A2A]",
+              variant === "category" ? "hover:bg-ods-bg-hover text-ods-text-primary focus:ring-ods-border-focus focus:ring-offset-ods-bg-surface" : variant === "subcategory" ? "hover:bg-ods-bg-hover text-ods-text-primary focus:ring-ods-border-focus focus:ring-offset-ods-bg-surface" : variant === "tag" ? "hover:bg-ods-bg-hover text-ods-text-primary focus:ring-ods-border-focus focus:ring-offset-ods-bg-surface" : "hover:bg-ods-bg-hover text-ods-text-primary focus:ring-ods-border-focus focus:ring-offset-ods-bg-surface",
               disabled && "opacity-50 cursor-not-allowed hover:scale-100"
             ),
             "aria-label": `Remove ${label} filter`,
@@ -2232,7 +2231,7 @@ function renderSocialIcon(platform) {
     case "fb":
       return /* @__PURE__ */ jsx12(FacebookIcon, { className: "w-5 h-5" });
     case "copy":
-      return /* @__PURE__ */ jsx12(CopyIcon, { className: "w-5 h-5", color: "var(--ods-text-primary)" });
+      return /* @__PURE__ */ jsx12(CopyIcon, { className: "w-5 h-5", color: "var(--color-text-primary)" });
     default:
       return /* @__PURE__ */ jsx12(GlobeIcon, { className: "w-5 h-5" });
   }
@@ -2300,9 +2299,9 @@ function Footer({ config, renderLink }) {
   return /* @__PURE__ */ jsx13(UniversalFooter, { config, renderLink });
 }
 function UniversalFooter({ config, renderLink }) {
-  const defaultRenderLink = (link) => /* @__PURE__ */ jsx13("a", { href: link.href, className: "font-body font-medium text-md md:text-md leading-[1.33] text-ods-text-primary hover:text-ods-accent-primary transition-colors", children: link.label });
+  const defaultRenderLink = (link) => /* @__PURE__ */ jsx13("a", { href: link.href, className: "font-body font-medium text-md md:text-md leading-[1.33] text-ods-text-primary hover:text-ods-accent transition-colors", children: link.label });
   const linkRenderer = renderLink || defaultRenderLink;
-  return /* @__PURE__ */ jsxs11("footer", { className: `w-full flex flex-col justify-center items-center ${config.backgroundColor || "bg-ods-bg-card"} px-6 py-10 relative gap-6 md:gap-6 min-h-[auto] md:min-h-[248px] z-[44] border-t border-ods-border`, children: [
+  return /* @__PURE__ */ jsxs11("footer", { className: `w-full flex flex-col justify-center items-center ${config.backgroundColor || "bg-ods-card"} px-6 py-10 relative gap-6 md:gap-6 min-h-[auto] md:min-h-[248px] z-[44] border-t border-ods-border`, children: [
     /* @__PURE__ */ jsxs11("div", { className: "w-full grid grid-cols-2 lg:grid-cols-4 gap-6 md:gap-8 items-start", children: [
       /* @__PURE__ */ jsxs11("div", { className: "flex flex-col gap-4 md:gap-6 items-start text-left col-span-2 md:col-span-1 lg:col-span-1", children: [
         /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2", children: [
@@ -2773,9 +2772,9 @@ function HeroImageUploader({ imageUrl, onChange, uploadEndpoint, height = 300, o
         onClick: openDialog,
         children: uploading ? /* @__PURE__ */ jsx15(Loader2, { className: "h-8 w-8 animate-spin text-ods-accent" }) : /* @__PURE__ */ jsxs12(Fragment4, { children: [
           /* @__PURE__ */ jsx15(ImageIcon2, { className: "h-12 w-12 text-ods-text-secondary" }),
-          /* @__PURE__ */ jsx15("span", { className: "text-ods-text-primary font-['DM_Sans'] text-[16px] font-medium mt-2", children: "Upload cover image" }),
-          /* @__PURE__ */ jsx15("span", { className: "text-ods-text-secondary font-['DM_Sans'] text-[14px] mt-1", children: "Click to upload or drag and drop" }),
-          /* @__PURE__ */ jsx15("span", { className: "text-ods-text-secondary font-['DM_Sans'] text-[12px]", children: "PNG, JPEG, WebP, GIF up to 5MB" })
+          /* @__PURE__ */ jsx15("span", { className: "text-ods-text-primary text-h6 mt-2", children: "Upload cover image" }),
+          /* @__PURE__ */ jsx15("span", { className: "text-ods-text-secondary text-h6 mt-1", children: "Click to upload or drag and drop" }),
+          /* @__PURE__ */ jsx15("span", { className: "text-ods-text-secondary text-h6", children: "PNG, JPEG, WebP, GIF up to 5MB" })
         ] })
       }
     ),
@@ -3070,7 +3069,7 @@ var ImageCropper = ({
         ),
         /* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-4", children: [
           /* @__PURE__ */ jsxs14("div", { className: "flex items-center gap-3", children: [
-            /* @__PURE__ */ jsx17("span", { className: "min-w-[60px] text-sm", children: "Zoom" }),
+            /* @__PURE__ */ jsx17("span", { className: "min-w-[60px] text-h6", children: "Zoom" }),
             /* @__PURE__ */ jsx17(
               Slider,
               {
@@ -3085,7 +3084,7 @@ var ImageCropper = ({
             )
           ] }),
           /* @__PURE__ */ jsxs14("div", { className: "flex items-center gap-3", children: [
-            /* @__PURE__ */ jsx17("span", { className: "min-w-[60px] text-sm", children: "Rotate" }),
+            /* @__PURE__ */ jsx17("span", { className: "min-w-[60px] text-h6", children: "Rotate" }),
             /* @__PURE__ */ jsx17(
               Slider,
               {
@@ -3135,9 +3134,9 @@ var ImageCropper = ({
 init_cn();
 import { jsx as jsx18, jsxs as jsxs15 } from "react/jsx-runtime";
 function MetricValue({ value, label, className }) {
-  return /* @__PURE__ */ jsxs15("div", { className: cn('flex items-end gap-2 whitespace-nowrap font-["DM_Sans"] text-lg leading-[24px] text-ods-text-primary', className), children: [
+  return /* @__PURE__ */ jsxs15("div", { className: cn("flex items-end gap-2 whitespace-nowrap text-h4 text-ods-text-primary", className), children: [
     value,
-    /* @__PURE__ */ jsx18("span", { className: "text-sm text-ods-text-secondary", children: label })
+    /* @__PURE__ */ jsx18("span", { className: "text-h6 text-ods-text-secondary", children: label })
   ] });
 }
 
@@ -3146,7 +3145,15 @@ init_cn();
 import { jsx as jsx19, jsxs as jsxs16 } from "react/jsx-runtime";
 function MSPDisplay({ name, logoUrl, size = 40, className }) {
   return /* @__PURE__ */ jsxs16("div", { className: cn("flex items-center gap-2 min-w-0", className), children: [
-    /* @__PURE__ */ jsx19(SquareAvatar2, { src: logoUrl ?? void 0, fallbackName: name, size }),
+    /* @__PURE__ */ jsx19(
+      SquareAvatar,
+      {
+        src: logoUrl ? getProxiedImageUrl(logoUrl) || logoUrl : void 0,
+        fallback: name,
+        alt: name,
+        sizePx: size
+      }
+    ),
     /* @__PURE__ */ jsx19("h2", { className: "truncate pl-2", children: name })
   ] });
 }
@@ -3163,30 +3170,30 @@ import { jsx as jsx21, jsxs as jsxs18 } from "react/jsx-runtime";
 var PRICING_STYLES = {
   // Comparison table style (current default)
   comparison: {
-    priceTextSize: "text-[16px]",
+    priceTextSize: "text-h6",
     priceTextColor: "text-ods-text-primary",
-    secondaryTextSize: "text-[16px]",
+    secondaryTextSize: "text-h6",
     secondaryTextColor: "text-ods-text-secondary",
     showTildePrefix: false,
-    fontFamily: "font-['DM_Sans']"
+    fontFamily: "font-body"
   },
   // Vendor dropdown compact style (Figma design)
   compact: {
-    priceTextSize: "text-[12px]",
+    priceTextSize: "text-h6",
     priceTextColor: "text-ods-text-secondary",
-    secondaryTextSize: "text-[12px]",
+    secondaryTextSize: "text-h6",
     secondaryTextColor: "text-ods-text-secondary",
     showTildePrefix: true,
-    fontFamily: "font-['DM_Sans']"
+    fontFamily: "font-body"
   },
   // Card style for vendor cards
   card: {
-    priceTextSize: "text-[14px]",
+    priceTextSize: "text-h6",
     priceTextColor: "text-ods-text-primary",
-    secondaryTextSize: "text-[14px]",
+    secondaryTextSize: "text-h6",
     secondaryTextColor: "text-ods-text-secondary",
     showTildePrefix: true,
-    fontFamily: "font-['DM_Sans']"
+    fontFamily: "font-body"
   }
 };
 function PricingDisplay({
@@ -3320,7 +3327,7 @@ function ResultsCount({
   const plural = resultType === "vendors" ? "vendors" : "posts";
   const singular = resultType === "vendors" ? "vendor" : "post";
   const displayType = totalResults === 1 ? singular : plural;
-  return /* @__PURE__ */ jsx22("div", { className: "mb-6", children: /* @__PURE__ */ jsx22("p", { className: "text-ods-text-secondary text-sm font-['DM_Sans']", children: totalResults > 0 && /* @__PURE__ */ jsxs19(Fragment5, { children: [
+  return /* @__PURE__ */ jsx22("div", { className: "mb-6", children: /* @__PURE__ */ jsx22("p", { className: "text-ods-text-secondary text-h6", children: totalResults > 0 && /* @__PURE__ */ jsxs19(Fragment5, { children: [
     "Showing ",
     startIndex,
     "-",
@@ -3440,7 +3447,7 @@ function VendorTag({
             {
               className: "w-4 h-4 bg-ods-accent rounded-sm flex items-center justify-center flex-shrink-0",
               style: accentColor ? { backgroundColor: accentColor } : void 0,
-              children: /* @__PURE__ */ jsx24(OpenSourceIcon2, { width: 10, height: 10, className: "text-[#1A1A1A]" })
+              children: /* @__PURE__ */ jsx24(OpenSourceIcon2, { width: 10, height: 10, className: "text-ods-text-on-accent" })
             }
           )
         };
@@ -3473,12 +3480,12 @@ function VendorTag({
       case "free":
         return {
           text: text || "Free",
-          icon: /* @__PURE__ */ jsx24("div", { className: "w-4 h-4 bg-ods-accent rounded-sm flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx24("span", { className: "text-[#1A1A1A] text-[8px] font-bold", children: "$" }) })
+          icon: /* @__PURE__ */ jsx24("div", { className: "w-4 h-4 bg-ods-accent rounded-sm flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx24("span", { className: "text-ods-text-on-accent text-[8px] font-bold", children: "$" }) })
         };
       case "freemium":
         return {
           text: text || "Freemium",
-          icon: /* @__PURE__ */ jsx24("div", { className: "w-4 h-4 bg-ods-accent rounded-sm flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx24("span", { className: "text-[#1A1A1A] text-[8px] font-bold", children: "$" }) })
+          icon: /* @__PURE__ */ jsx24("div", { className: "w-4 h-4 bg-ods-accent rounded-sm flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx24("span", { className: "text-ods-text-on-accent text-[8px] font-bold", children: "$" }) })
         };
       case "paid":
         return {
@@ -3488,19 +3495,19 @@ function VendorTag({
       case "enterprise":
         return {
           text: text || "Enterprise",
-          icon: /* @__PURE__ */ jsx24("div", { className: "w-4 h-4 bg-ods-accent rounded-sm flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx24("span", { className: "text-[#1A1A1A] text-[8px] font-bold", children: "E" }) })
+          icon: /* @__PURE__ */ jsx24("div", { className: "w-4 h-4 bg-ods-accent rounded-sm flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx24("span", { className: "text-ods-text-on-accent text-[8px] font-bold", children: "E" }) })
         };
       case "recommended":
         return {
           text: text || "Recommended",
-          icon: /* @__PURE__ */ jsx24("div", { className: "w-4 h-4 bg-ods-accent rounded-sm flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx24("span", { className: "text-[#1A1A1A] text-[8px] font-bold", children: "\u2605" }) })
+          icon: /* @__PURE__ */ jsx24("div", { className: "w-4 h-4 bg-ods-accent rounded-sm flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx24("span", { className: "text-ods-text-on-accent text-[8px] font-bold", children: "\u2605" }) })
         };
       case "classification":
         const classificationType = text?.toLowerCase();
         if (classificationType === "open_source") {
           return {
             text: "Open Source",
-            icon: /* @__PURE__ */ jsx24("div", { className: "w-4 h-4 bg-ods-accent rounded-sm flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx24(OpenSourceIcon2, { width: 10, height: 10, className: "text-[#1A1A1A]" }) })
+            icon: /* @__PURE__ */ jsx24("div", { className: "w-4 h-4 bg-ods-accent rounded-sm flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx24(OpenSourceIcon2, { width: 10, height: 10, className: "text-ods-text-on-accent" }) })
           };
         } else if (classificationType === "commercial") {
           return {
@@ -3515,7 +3522,7 @@ function VendorTag({
         } else {
           return {
             text: text || "Classification",
-            icon: /* @__PURE__ */ jsx24("div", { className: "w-4 h-4 bg-ods-accent rounded-sm flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx24("span", { className: "text-[#1A1A1A] text-[8px] font-bold", children: "C" }) })
+            icon: /* @__PURE__ */ jsx24("div", { className: "w-4 h-4 bg-ods-accent rounded-sm flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx24("span", { className: "text-ods-text-on-accent text-[8px] font-bold", children: "C" }) })
           };
         }
       case "openframe_selected":
@@ -3534,9 +3541,8 @@ function VendorTag({
   return /* @__PURE__ */ jsxs21("div", { className: cn(baseClasses, className, hidden && "invisible"), children: [
     icon,
     /* @__PURE__ */ jsx24("span", { className: cn(
-      "font-mono font-semibold uppercase",
-      textColor ? textColor : "text-ods-text-primary",
-      size === "sm" ? "text-[10px]" : "text-xs"
+      "text-h5 font-semibold",
+      textColor ? textColor : "text-ods-text-primary"
     ), children: displayText })
   ] });
 }
@@ -3785,16 +3791,16 @@ import { jsx as jsx27, jsxs as jsxs23 } from "react/jsx-runtime";
 function ProfileLoadingSkeleton({ className }) {
   return /* @__PURE__ */ jsxs23("div", { className: cn("space-y-6", className), children: [
     /* @__PURE__ */ jsxs23("div", { className: "flex items-center space-x-4", children: [
-      /* @__PURE__ */ jsx27("div", { className: "h-16 w-16 bg-gray-200 rounded-full animate-pulse" }),
+      /* @__PURE__ */ jsx27("div", { className: "h-16 w-16 bg-ods-skeleton rounded-full animate-pulse" }),
       /* @__PURE__ */ jsxs23("div", { className: "space-y-2", children: [
-        /* @__PURE__ */ jsx27("div", { className: "h-4 w-32 bg-gray-200 rounded animate-pulse" }),
-        /* @__PURE__ */ jsx27("div", { className: "h-3 w-24 bg-gray-200 rounded animate-pulse" })
+        /* @__PURE__ */ jsx27("div", { className: "h-4 w-32 bg-ods-skeleton rounded animate-pulse" }),
+        /* @__PURE__ */ jsx27("div", { className: "h-3 w-24 bg-ods-skeleton rounded animate-pulse" })
       ] })
     ] }),
     /* @__PURE__ */ jsxs23("div", { className: "space-y-4", children: [
-      /* @__PURE__ */ jsx27("div", { className: "h-4 w-full bg-gray-200 rounded animate-pulse" }),
-      /* @__PURE__ */ jsx27("div", { className: "h-4 w-3/4 bg-gray-200 rounded animate-pulse" }),
-      /* @__PURE__ */ jsx27("div", { className: "h-4 w-1/2 bg-gray-200 rounded animate-pulse" })
+      /* @__PURE__ */ jsx27("div", { className: "h-4 w-full bg-ods-skeleton rounded animate-pulse" }),
+      /* @__PURE__ */ jsx27("div", { className: "h-4 w-3/4 bg-ods-skeleton rounded animate-pulse" }),
+      /* @__PURE__ */ jsx27("div", { className: "h-4 w-1/2 bg-ods-skeleton rounded animate-pulse" })
     ] })
   ] });
 }
@@ -3837,7 +3843,7 @@ function CategoryCardSkeleton({ className }) {
     "article",
     {
       className: cn(
-        "bg-[#1A1A1A] border border-[#424242] rounded-[12px] p-8 flex flex-col min-w-0 box-border",
+        "bg-ods-card border border-ods-border rounded-[12px] p-8 flex flex-col min-w-0 box-border",
         className
       ),
       role: "status",
@@ -3910,63 +3916,63 @@ function MarginReportSkeleton({ animate = true, description, overlayContent }) {
   return /* @__PURE__ */ jsxs28("main", { className: `bg-ods-bg ${animate ? "animate-pulse" : ""} relative min-h-screen`, children: [
     /* @__PURE__ */ jsxs28("div", { className: "max-w-[1920px] px-6 md:px-20 py-6 md:py-10 mx-auto space-y-10", children: [
       /* @__PURE__ */ jsxs28("div", { className: "space-y-3", children: [
-        /* @__PURE__ */ jsx32("div", { className: "h-10 w-72 bg-[#2A2A2A] rounded" }),
-        /* @__PURE__ */ jsx32("div", { className: "h-4 w-80 bg-[#2A2A2A] rounded" })
+        /* @__PURE__ */ jsx32("div", { className: "h-10 w-72 bg-ods-skeleton rounded" }),
+        /* @__PURE__ */ jsx32("div", { className: "h-4 w-80 bg-ods-skeleton rounded" })
       ] }),
       /* @__PURE__ */ jsx32("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-6", children: Array.from({ length: 3 }).map((_, i) => /* @__PURE__ */ jsx32("div", { className: "h-32 bg-ods-card border border-ods-border rounded" }, i)) }),
       /* @__PURE__ */ jsxs28("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: [
         /* @__PURE__ */ jsxs28("div", { className: "bg-ods-card border border-ods-border rounded-lg p-6 flex items-center gap-4 animate-pulse", children: [
-          /* @__PURE__ */ jsx32("div", { className: "w-14 h-14 rounded-lg bg-[#2A2A2A]" }),
+          /* @__PURE__ */ jsx32("div", { className: "w-14 h-14 rounded-lg bg-ods-skeleton" }),
           /* @__PURE__ */ jsxs28("div", { className: "flex-1 space-y-2", children: [
-            /* @__PURE__ */ jsx32("div", { className: "h-4 bg-[#2A2A2A] rounded w-3/4" }),
-            /* @__PURE__ */ jsx32("div", { className: "h-3 bg-[#2A2A2A] rounded w-1/2" })
+            /* @__PURE__ */ jsx32("div", { className: "h-4 bg-ods-skeleton rounded w-3/4" }),
+            /* @__PURE__ */ jsx32("div", { className: "h-3 bg-ods-skeleton rounded w-1/2" })
           ] })
         ] }),
         /* @__PURE__ */ jsxs28("div", { className: "bg-ods-card border border-ods-border rounded-lg p-6 flex flex-col gap-4 animate-pulse", children: [
           /* @__PURE__ */ jsxs28("div", { className: "flex items-center justify-between gap-4", children: [
             /* @__PURE__ */ jsxs28("div", { className: "flex items-center gap-2", children: [
-              /* @__PURE__ */ jsx32("div", { className: "w-10 h-10 rounded-lg bg-[#2A2A2A]" }),
+              /* @__PURE__ */ jsx32("div", { className: "w-10 h-10 rounded-lg bg-ods-skeleton" }),
               /* @__PURE__ */ jsxs28("div", { className: "space-y-1", children: [
-                /* @__PURE__ */ jsx32("div", { className: "h-4 w-32 bg-[#2A2A2A] rounded" }),
-                /* @__PURE__ */ jsx32("div", { className: "h-3 w-20 bg-[#2A2A2A] rounded" })
+                /* @__PURE__ */ jsx32("div", { className: "h-4 w-32 bg-ods-skeleton rounded" }),
+                /* @__PURE__ */ jsx32("div", { className: "h-3 w-20 bg-ods-skeleton rounded" })
               ] })
             ] }),
-            /* @__PURE__ */ jsx32("div", { className: "h-6 w-36 bg-[#2A2A2A] rounded" })
+            /* @__PURE__ */ jsx32("div", { className: "h-6 w-36 bg-ods-skeleton rounded" })
           ] }),
-          /* @__PURE__ */ jsx32("div", { className: "h-4 w-40 bg-[#2A2A2A] rounded mt-4" })
+          /* @__PURE__ */ jsx32("div", { className: "h-4 w-40 bg-ods-skeleton rounded mt-4" })
         ] })
       ] }),
       /* @__PURE__ */ jsx32("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: ["Commercial Stack", "Open-Source Stack"].map((label, idx) => /* @__PURE__ */ jsxs28("div", { className: "bg-ods-card border border-ods-border rounded-lg overflow-hidden flex flex-col animate-pulse", children: [
         /* @__PURE__ */ jsxs28("div", { className: "flex items-center justify-between px-6 py-4", children: [
-          /* @__PURE__ */ jsx32("div", { className: "h-6 w-40 bg-[#2A2A2A] rounded" }),
+          /* @__PURE__ */ jsx32("div", { className: "h-6 w-40 bg-ods-skeleton rounded" }),
           /* @__PURE__ */ jsxs28("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ jsx32("div", { className: "h-5 w-20 bg-[#2A2A2A] rounded" }),
-            /* @__PURE__ */ jsx32("div", { className: "h-4 w-10 bg-[#2A2A2A] rounded" })
+            /* @__PURE__ */ jsx32("div", { className: "h-5 w-20 bg-ods-skeleton rounded" }),
+            /* @__PURE__ */ jsx32("div", { className: "h-4 w-10 bg-ods-skeleton rounded" })
           ] })
         ] }),
         /* @__PURE__ */ jsx32("div", { className: "flex-1 flex flex-col gap-3 p-3", children: Array.from({ length: 5 }).map((_, j) => /* @__PURE__ */ jsxs28("div", { className: "bg-ods-bg border border-ods-border rounded-lg px-4 py-3 flex items-center justify-between", children: [
           /* @__PURE__ */ jsxs28("div", { className: "flex items-center gap-3 min-w-0", children: [
-            /* @__PURE__ */ jsx32("div", { className: "w-12 h-12 bg-[#2A2A2A] rounded-lg flex-shrink-0" }),
+            /* @__PURE__ */ jsx32("div", { className: "w-12 h-12 bg-ods-skeleton rounded-lg flex-shrink-0" }),
             /* @__PURE__ */ jsxs28("div", { className: "flex flex-col min-w-0", children: [
-              /* @__PURE__ */ jsx32("div", { className: "h-4 w-32 bg-[#2A2A2A] rounded" }),
-              /* @__PURE__ */ jsx32("div", { className: "hidden md:block h-3 w-24 bg-[#2A2A2A] rounded mt-1" })
+              /* @__PURE__ */ jsx32("div", { className: "h-4 w-32 bg-ods-skeleton rounded" }),
+              /* @__PURE__ */ jsx32("div", { className: "hidden md:block h-3 w-24 bg-ods-skeleton rounded mt-1" })
             ] })
           ] }),
           /* @__PURE__ */ jsxs28("div", { className: "flex items-center gap-1 flex-shrink-0", children: [
-            /* @__PURE__ */ jsx32("div", { className: "h-4 w-16 bg-[#2A2A2A] rounded" }),
-            /* @__PURE__ */ jsx32("div", { className: "h-3 w-8 bg-[#2A2A2A] rounded" })
+            /* @__PURE__ */ jsx32("div", { className: "h-4 w-16 bg-ods-skeleton rounded" }),
+            /* @__PURE__ */ jsx32("div", { className: "h-3 w-8 bg-ods-skeleton rounded" })
           ] })
         ] }, j)) })
       ] }, idx)) }),
-      /* @__PURE__ */ jsx32("div", { className: "h-6 w-60 bg-[#2A2A2A] rounded" }),
+      /* @__PURE__ */ jsx32("div", { className: "h-6 w-60 bg-ods-skeleton rounded" }),
       /* @__PURE__ */ jsx32("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6", children: Array.from({ length: 3 }).map((_, i) => /* @__PURE__ */ jsx32("div", { className: "h-48 bg-ods-card border border-ods-border rounded" }, i)) }),
       /* @__PURE__ */ jsxs28("div", { className: "border border-ods-border rounded-3xl p-8 space-y-6", children: [
         /* @__PURE__ */ jsxs28("div", { className: "flex items-start gap-6", children: [
           /* @__PURE__ */ jsxs28("div", { className: "flex-1 space-y-2 min-w-0", children: [
-            /* @__PURE__ */ jsx32("div", { className: "h-8 w-72 bg-[#2A2A2A] rounded" }),
-            /* @__PURE__ */ jsx32("div", { className: "h-4 w-3/4 bg-[#2A2A2A] rounded" })
+            /* @__PURE__ */ jsx32("div", { className: "h-8 w-72 bg-ods-skeleton rounded" }),
+            /* @__PURE__ */ jsx32("div", { className: "h-4 w-3/4 bg-ods-skeleton rounded" })
           ] }),
-          /* @__PURE__ */ jsx32("div", { className: "w-12 h-12 bg-[#2A2A2A] rounded-md shrink-0" })
+          /* @__PURE__ */ jsx32("div", { className: "w-12 h-12 bg-ods-skeleton rounded-md shrink-0" })
         ] }),
         /* @__PURE__ */ jsx32("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6", children: Array.from({ length: 3 }).map((_, i) => /* @__PURE__ */ jsx32("div", { className: "h-32 bg-ods-card border border-ods-border rounded" }, i)) })
       ] })
@@ -3984,7 +3990,7 @@ import { jsx as jsx33, jsxs as jsxs29 } from "react/jsx-runtime";
 function UsersGridSkeleton({ rows = 10, className }) {
   const skeletonRows = Array.from({ length: rows });
   return /* @__PURE__ */ jsx33("div", { className: cn("overflow-x-auto rounded-lg border border-ods-border bg-ods-card animate-pulse", className), children: /* @__PURE__ */ jsxs29("table", { className: "min-w-full divide-y divide-ods-border", children: [
-    /* @__PURE__ */ jsx33("thead", { className: "bg-[#2A2A2A]", children: /* @__PURE__ */ jsx33("tr", { children: ["Name", "Email", "Role", "Created", "Last Sign-In"].map((h) => /* @__PURE__ */ jsx33("th", { className: "px-4 py-3 text-left text-[12px] font-medium text-ods-text-primary font-['DM_Sans']", children: h }, h)) }) }),
+    /* @__PURE__ */ jsx33("thead", { className: "bg-ods-skeleton", children: /* @__PURE__ */ jsx33("tr", { children: ["Name", "Email", "Role", "Created", "Last Sign-In"].map((h) => /* @__PURE__ */ jsx33("th", { className: "px-4 py-3 text-left text-h6 text-ods-text-primary", children: h }, h)) }) }),
     /* @__PURE__ */ jsx33("tbody", { className: "divide-y divide-ods-border", children: skeletonRows.map((_, idx) => /* @__PURE__ */ jsx33("tr", { children: Array.from({ length: 5 }).map((__, cell) => /* @__PURE__ */ jsx33("td", { className: "px-4 py-3 whitespace-nowrap", children: /* @__PURE__ */ jsx33("div", { className: "h-4 bg-ods-border rounded w-full" }) }, cell)) }, idx)) })
   ] }) });
 }
@@ -4188,18 +4194,18 @@ function YesNoDisplay({
   if (customText) {
     return /* @__PURE__ */ jsxs33("div", { className: `flex items-center gap-2 ${className}`, children: [
       /* @__PURE__ */ jsx39(CheckCircleIcon2, { className: "h-6 w-6" }),
-      /* @__PURE__ */ jsx39("span", { className: "text-ods-text-primary text-[16px]", children: customText })
+      /* @__PURE__ */ jsx39("span", { className: "text-ods-text-primary text-h6", children: customText })
     ] });
   }
   if (value) {
     return /* @__PURE__ */ jsxs33("div", { className: `flex items-center gap-2 ${className}`, children: [
       /* @__PURE__ */ jsx39(CheckCircleIcon2, { className: "h-6 w-6" }),
-      /* @__PURE__ */ jsx39("span", { className: "text-ods-text-primary text-[16px]", children: yesText })
+      /* @__PURE__ */ jsx39("span", { className: "text-ods-text-primary text-h6", children: yesText })
     ] });
   }
   return /* @__PURE__ */ jsxs33("div", { className: `flex items-center gap-2 ${className}`, children: [
     /* @__PURE__ */ jsx39(XCircleIcon, { className: "h-6 w-6" }),
-    /* @__PURE__ */ jsx39("span", { className: "text-ods-text-secondary text-[16px]", children: noText })
+    /* @__PURE__ */ jsx39("span", { className: "text-ods-text-secondary text-h6", children: noText })
   ] });
 }
 function evaluateFeatureValue(value, dataType) {
@@ -4352,7 +4358,7 @@ var inputClassName = cn(
   "disabled:cursor-not-allowed disabled:opacity-50 touch-manipulation",
   // Admin theme colors
   "bg-ods-card border-ods-border text-ods-text-primary",
-  "placeholder:text-[#767676] focus-visible:ring-[#FFC008]",
+  "placeholder:text-ods-text-muted focus-visible:ring-ods-accent",
   "md:text-sm text-base"
   // Mobile zoom prevention
 );
@@ -4369,7 +4375,7 @@ function DateTimePicker({
   dateFormat = "MMMM d, yyyy h:mm aa"
 }) {
   return /* @__PURE__ */ jsxs35("div", { className: cn("space-y-2", className), children: [
-    label && /* @__PURE__ */ jsx41(Label, { className: "font-['Azeret_Mono'] text-[12px] font-semibold leading-[1em] tracking-[-0.02em] text-ods-text-secondary uppercase", children: label }),
+    label && /* @__PURE__ */ jsx41(Label, { className: "text-h5 font-semibold text-ods-text-secondary", children: label }),
     /* @__PURE__ */ jsx41("div", { className: "w-full", children: /* @__PURE__ */ jsx41(
       DatePicker2,
       {
@@ -4507,7 +4513,7 @@ function AuthorDetailView({
   const bioText = formatBioText(author.about);
   return /* @__PURE__ */ jsxs36("div", { className: cn("flex flex-col gap-5 md:gap-6", className), children: [
     /* @__PURE__ */ jsxs36("div", { className: "flex gap-6 w-full items-start", children: [
-      /* @__PURE__ */ jsx42("div", { className: "relative shrink-0 h-24 w-24", children: /* @__PURE__ */ jsx42("div", { className: "rounded-full overflow-hidden bg-ods-bg-secondary border border-ods-border w-full h-full relative", children: proxiedAvatar ? /* @__PURE__ */ jsx42(
+      /* @__PURE__ */ jsx42("div", { className: "relative shrink-0 h-24 w-24", children: /* @__PURE__ */ jsx42("div", { className: "rounded-full overflow-hidden bg-ods-bg-surface border border-ods-border w-full h-full relative", children: proxiedAvatar ? /* @__PURE__ */ jsx42(
         next_image_default,
         {
           src: proxiedAvatar,
@@ -4516,7 +4522,7 @@ function AuthorDetailView({
           className: "object-cover",
           unoptimized: true
         }
-      ) : /* @__PURE__ */ jsx42("div", { className: "flex items-center justify-center h-full w-full text-3xl text-ods-text-secondary font-['Azeret_Mono']", children: author.fullName.charAt(0).toUpperCase() }) }) }),
+      ) : /* @__PURE__ */ jsx42("div", { className: "flex items-center justify-center h-full w-full text-3xl text-ods-text-secondary font-heading", children: author.fullName.charAt(0).toUpperCase() }) }) }),
       /* @__PURE__ */ jsxs36("div", { className: "min-w-0 flex flex-col justify-center gap-2", children: [
         /* @__PURE__ */ jsx42("p", { className: "text-h2 text-ods-text-primary leading-none truncate", children: author.fullName }),
         subtitle && /* @__PURE__ */ jsx42("p", { className: "font-body text-lg text-ods-text-secondary leading-none truncate", children: subtitle }),
@@ -4534,7 +4540,7 @@ function AuthorDetailView({
         )
       ] })
     ] }),
-    bioText && /* @__PURE__ */ jsx42("p", { className: "font-body text-base leading-relaxed text-ods-text-secondary", children: bioText }),
+    bioText && /* @__PURE__ */ jsx42("p", { className: "text-h6 text-ods-text-secondary", children: bioText }),
     author.knowsAbout.length > 0 && /* @__PURE__ */ jsx42("div", { className: "flex flex-wrap gap-2", children: author.knowsAbout.map((topic) => /* @__PURE__ */ jsx42(StatusBadge, { text: topic, variant: "button", colorScheme: "cyan", singleLine: true }, topic)) }),
     children
   ] });