🎨 fix(theme): align UI controls with global radius tokens

Remove hard-coded and capped border radius overrides so shared controls and feature actions consistently follow the active theme radius.

- Replace fixed radius utilities with semantic theme-aware radius tokens
- Remove redundant `rounded-full` and pixel-based overrides from header, toolbar, Playground, and utility actions
- Drop unused `StatusBadge` rounded prop usage
- Keep existing component behavior intact while improving global theme consistency

web/default/src/components/ai-elements/branch.tsx

@@ -159,7 +159,7 @@ export const BranchPrevious = ({
     <Button
       aria-label={t('Previous branch')}
       className={cn(
-        'text-muted-foreground size-7 shrink-0 rounded-full transition-colors',
+        'text-muted-foreground size-7 shrink-0 transition-colors',
         'hover:bg-accent hover:text-foreground',
         'disabled:pointer-events-none disabled:opacity-50',
         className
@@ -190,7 +190,7 @@ export const BranchNext = ({
     <Button
       aria-label={t('Next branch')}
       className={cn(
-        'text-muted-foreground size-7 shrink-0 rounded-full transition-colors',
+        'text-muted-foreground size-7 shrink-0 transition-colors',
         'hover:bg-accent hover:text-foreground',
         'disabled:pointer-events-none disabled:opacity-50',
         className

web/default/src/components/ai-elements/conversation.tsx

@@ -90,7 +90,7 @@ export const ConversationScrollButton = ({
     !isAtBottom && (
       <Button
         className={cn(
-          'absolute bottom-4 left-[50%] translate-x-[-50%] rounded-full',
+          'absolute bottom-4 left-[50%] translate-x-[-50%]',
           className
         )}
         onClick={handleScrollToBottom}

web/default/src/components/ai-elements/inline-citation.tsx

@@ -68,11 +68,7 @@ export const InlineCitationCardTrigger = ({
     delay={0}
     closeDelay={0}
     render={
-      <Badge
-        className={cn('ml-1 rounded-full', className)}
-        variant='secondary'
-        {...props}
-      >
+      <Badge className={cn('ml-1', className)} variant='secondary' {...props}>
         {sources[0] ? (
           <>
             {new URL(sources[0]).hostname}{' '}

web/default/src/components/ai-elements/prompt-input.tsx

@@ -429,7 +429,7 @@ export type PromptInputProps = Omit<
   ) => void | Promise<void>
   /**
    * Optional className applied to the inner InputGroup wrapper
-   * (useful for customizing rounded corners, e.g., rounded-[20px]).
+   * (useful for layout or semantic radius utilities such as rounded-xl).
    */
   groupClassName?: string
 }

web/default/src/components/ai-elements/suggestion.tsx

@@ -40,7 +40,7 @@ export const Suggestion = ({
 
   return (
     <Button
-      className={cn('cursor-pointer rounded-full px-4', className)}
+      className={cn('cursor-pointer px-4', className)}
       onClick={handleClick}
       size={size}
       type='button'

web/default/src/components/ai-elements/tool.tsx

@@ -65,7 +65,7 @@ const getStatusBadge = (status: ExtendedToolState) => {
   }
 
   return (
-    <Badge className='gap-1.5 rounded-full text-xs' variant='secondary'>
+    <Badge className='gap-1.5 text-xs' variant='secondary'>
       {icons[status]}
       {labels[status]}
     </Badge>