Point color, radius, stroke, focus, and type tokens at the Figma scale so later sections use the same values.

Co-authored-by: Cursor <cursoragent@cursor.com>

app/components/asset/Avatar/Avatar.tsx

@@ -29,13 +29,13 @@ export interface AvatarProps {
 
 const SIZE_CLASS: Record<AvatarSizeValue, string> = {
   small:
-    "h-[var(--spacing-scale-016)] w-[var(--spacing-scale-016)] text-xx-small-label",
+    "h-[var(--space-400)] w-[var(--space-400)] text-xx-small-label",
   medium:
-    "h-[var(--spacing-scale-018)] w-[var(--spacing-scale-018)] text-xx-small-label",
+    "h-[var(--sizing-450)] w-[var(--sizing-450)] text-xx-small-label",
   large:
-    "h-[var(--spacing-scale-024)] w-[var(--spacing-scale-024)] text-xx-small-label",
+    "h-[var(--space-600)] w-[var(--space-600)] text-xx-small-label",
   xlarge:
-    "h-[var(--spacing-scale-032)] w-[var(--spacing-scale-032)] text-x-small-label",
+    "h-[var(--space-800)] w-[var(--space-800)] text-x-small-label",
 };
 
 function formatAvatarInitials(value: string): string {
@@ -92,8 +92,8 @@ const Avatar = memo<AvatarProps>(
 
     const radiusClass =
       shape === "rounded-square"
-        ? "rounded-[var(--measures-radius-200,8px)]"
-        : "rounded-[var(--radius-measures-radius-full)]";
+        ? "rounded-[var(--radius-200)]"
+        : "rounded-[var(--radius-full)]";
     const fallbackChrome =
       variant === "outlined"
         ? "border-[1.5px] border-solid border-[var(--color-content-default-brand-primary)] bg-transparent text-[var(--color-content-default-brand-primary)]"