Reorganise components into atoms/molecules/organisms and fix Input icon colours

Moved all 17 components from ui/ into atomic design tiers: atoms (Button,
IconButton, Input, Textarea, Select, Checkbox, Radio, Switch, Badge, Tag,
Chip, Tooltip) and molecules (Alert, Accordion, Card, Dialog, Popover).
Updated all Storybook titles and cross-component imports. Changed Input
icons to primary-dark and replaced palette token references with semantic
tokens.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

src/components/atoms/Badge/Badge.stories.tsx

@@ -2,7 +2,7 @@ import type { Meta, StoryObj } from '@storybook/react-vite'
 import { Badge } from './Badge'
 
 const meta: Meta<typeof Badge> = {
-  title: 'UI/Badge',
+  title: 'Atoms/Badge',
   component: Badge,
   tags: ['autodocs'],
   argTypes: {

src/components/atoms/Button/Button.stories.tsx

@@ -2,7 +2,7 @@ import type { Meta, StoryObj } from '@storybook/react-vite'
 import { Button } from './Button'
 
 const meta: Meta<typeof Button> = {
-  title: 'UI/Button',
+  title: 'Atoms/Button',
   component: Button,
   tags: ['autodocs'],
   argTypes: {

src/components/atoms/Checkbox/Checkbox.stories.tsx

@@ -3,7 +3,7 @@ import type { Meta, StoryObj } from '@storybook/react-vite'
 import { Checkbox } from './Checkbox'
 
 const meta: Meta<typeof Checkbox> = {
-  title: 'UI/Checkbox',
+  title: 'Atoms/Checkbox',
   component: Checkbox,
   tags: ['autodocs'],
   argTypes: {

src/components/atoms/Chip/Chip.stories.tsx

@@ -3,7 +3,7 @@ import type { Meta, StoryObj } from '@storybook/react-vite'
 import { Chip } from './Chip'
 
 const meta: Meta<typeof Chip> = {
-  title: 'UI/Chip',
+  title: 'Atoms/Chip',
   component: Chip,
   tags: ['autodocs'],
   argTypes: {

src/components/atoms/IconButton/IconButton.stories.tsx

@@ -3,7 +3,7 @@ import { X, Plus, Trash2, Menu, ChevronDown, Search, ArrowRight, MoreVertical, C
 import { IconButton } from './IconButton'
 
 const meta: Meta<typeof IconButton> = {
-  title: 'UI/IconButton',
+  title: 'Atoms/IconButton',
   component: IconButton,
   tags: ['autodocs'],
   argTypes: {

src/components/atoms/Input/Input.stories.tsx

@@ -3,7 +3,7 @@ import type { Meta, StoryObj } from '@storybook/react-vite'
 import { Input } from './Input'
 
 const meta: Meta<typeof Input> = {
-  title: 'UI/Input',
+  title: 'Atoms/Input',
   component: Input,
   tags: ['autodocs'],
   argTypes: {

src/components/atoms/Input/Input.tsx

@@ -83,7 +83,7 @@ export const Input = forwardRef<HTMLInputElement, InputProps>(
             {description && (
               <p
                 id={descriptionId}
-                className={cn('text-small text-grey-01', disabled && 'opacity-50')}
+                className={cn('text-small text-text', disabled && 'opacity-50')}
               >
                 {description}
               </p>
@@ -117,7 +117,7 @@ export const Input = forwardRef<HTMLInputElement, InputProps>(
 
           {leftIcon && (
             <span
-              className={cn('inline-flex shrink-0 items-center justify-center text-grey-01 [&>svg]:size-full', styles.icon)}
+              className={cn('inline-flex shrink-0 items-center justify-center text-primary-dark [&>svg]:size-full', styles.icon)}
             >
               {leftIcon}
             </span>
@@ -134,17 +134,17 @@ export const Input = forwardRef<HTMLInputElement, InputProps>(
             aria-invalid={hasError || undefined}
             aria-describedby={describedBy}
             className={cn(
-              'min-w-0 flex-1 bg-transparent font-normal text-grey-01 outline-none',
-              'placeholder:text-grey-01/50',
+              'min-w-0 flex-1 bg-transparent font-normal text-text outline-none',
+              'placeholder:text-text/50',
               styles.input,
-              disabled && 'text-grey-01/50',
+              disabled && 'text-text/50',
             )}
             {...props}
           />
 
           {rightIcon && (
             <span
-              className={cn('inline-flex shrink-0 items-center justify-center text-grey-01 [&>svg]:size-full', styles.icon)}
+              className={cn('inline-flex shrink-0 items-center justify-center text-primary-dark [&>svg]:size-full', styles.icon)}
             >
               {rightIcon}
             </span>

src/components/atoms/Radio/Radio.stories.tsx

@@ -3,7 +3,7 @@ import type { Meta, StoryObj } from '@storybook/react-vite'
 import { Radio, RadioGroup } from './Radio'
 
 const meta: Meta<typeof RadioGroup> = {
-  title: 'UI/Radio',
+  title: 'Atoms/Radio',
   component: RadioGroup,
   tags: ['autodocs'],
   parameters: {

src/components/atoms/Select/Select.stories.tsx

@@ -21,7 +21,7 @@ const categories = [
 ]
 
 const meta: Meta<typeof Select> = {
-  title: 'UI/Select',
+  title: 'Atoms/Select',
   component: Select,
   tags: ['autodocs'],
   argTypes: {

src/components/atoms/Switch/Switch.stories.tsx

@@ -3,7 +3,7 @@ import type { Meta, StoryObj } from '@storybook/react-vite'
 import { Switch } from './Switch'
 
 const meta: Meta<typeof Switch> = {
-  title: 'UI/Switch',
+  title: 'Atoms/Switch',
   component: Switch,
   tags: ['autodocs'],
   argTypes: {

src/components/atoms/Tag/Tag.stories.tsx

@@ -5,7 +5,7 @@ import { Tag } from './Tag'
 import type { TagColor } from './Tag'
 
 const meta: Meta<typeof Tag> = {
-  title: 'UI/Tag',
+  title: 'Atoms/Tag',
   component: Tag,
   tags: ['autodocs'],
   argTypes: {

src/components/atoms/Textarea/Textarea.stories.tsx

@@ -3,7 +3,7 @@ import type { Meta, StoryObj } from '@storybook/react-vite'
 import { Textarea } from './Textarea'
 
 const meta: Meta<typeof Textarea> = {
-  title: 'UI/Textarea',
+  title: 'Atoms/Textarea',
   component: Textarea,
   tags: ['autodocs'],
   argTypes: {

src/components/atoms/Tooltip/Tooltip.stories.tsx

@@ -1,11 +1,11 @@
 import type { Meta, StoryObj } from '@storybook/react-vite'
 import { Info, HelpCircle, Trash2, Copy } from 'lucide-react'
 import { Tooltip } from './Tooltip'
-import { Button } from '@/components/ui/Button'
-import { IconButton } from '@/components/ui/IconButton'
+import { Button } from '@/components/atoms/Button'
+import { IconButton } from '@/components/atoms/IconButton'
 
 const meta: Meta<typeof Tooltip> = {
-  title: 'UI/Tooltip',
+  title: 'Atoms/Tooltip',
   component: Tooltip,
   tags: ['autodocs'],
   argTypes: {

src/components/molecules/Accordion/Accordion.stories.tsx

@@ -3,7 +3,7 @@ import { FileText, Settings, Users, Shield, Bell, HelpCircle } from 'lucide-reac
 import { Accordion, AccordionItem, AccordionTrigger, AccordionContent } from './Accordion'
 
 const meta: Meta<typeof Accordion> = {
-  title: 'UI/Accordion',
+  title: 'Molecules/Accordion',
   component: Accordion,
   tags: ['autodocs'],
   argTypes: {

src/components/molecules/Alert/Alert.stories.tsx

@@ -1,10 +1,10 @@
 import { useState } from 'react'
 import type { Meta, StoryObj } from '@storybook/react-vite'
 import { Alert } from './Alert'
-import { Button } from '@/components/ui/Button'
+import { Button } from '@/components/atoms/Button'
 
 const meta: Meta<typeof Alert> = {
-  title: 'UI/Alert',
+  title: 'Molecules/Alert',
   component: Alert,
   tags: ['autodocs'],
   argTypes: {

src/components/molecules/Card/Card.stories.tsx

@@ -3,7 +3,7 @@ import { ClipboardList, BookOpen, Info, ExternalLink } from 'lucide-react'
 import { Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter } from './Card'
 
 const meta: Meta<typeof Card> = {
-  title: 'UI/Card',
+  title: 'Molecules/Card',
   component: Card,
   tags: ['autodocs'],
   argTypes: {

src/components/molecules/Dialog/Dialog.stories.tsx

@@ -2,11 +2,11 @@ import { useState } from 'react'
 import type { Meta, StoryObj } from '@storybook/react-vite'
 import { AlertTriangle } from 'lucide-react'
 import { Dialog, DialogHeader, DialogTitle, DialogDescription, DialogContent, DialogFooter } from './Dialog'
-import { Button } from '@/components/ui/Button'
-import { Input } from '@/components/ui/Input'
+import { Button } from '@/components/atoms/Button'
+import { Input } from '@/components/atoms/Input'
 
 const meta: Meta<typeof Dialog> = {
-  title: 'UI/Dialog',
+  title: 'Molecules/Dialog',
   component: Dialog,
   tags: ['autodocs'],
   argTypes: {

src/components/molecules/Popover/Popover.stories.tsx

@@ -1,13 +1,13 @@
 import type { Meta, StoryObj } from '@storybook/react-vite'
 import { Settings, Filter, MoreVertical } from 'lucide-react'
 import { Popover, PopoverTrigger, PopoverContent, PopoverClose } from './Popover'
-import { Button } from '@/components/ui/Button'
-import { IconButton } from '@/components/ui/IconButton'
-import { Input } from '@/components/ui/Input'
-import { Checkbox } from '@/components/ui/Checkbox'
+import { Button } from '@/components/atoms/Button'
+import { IconButton } from '@/components/atoms/IconButton'
+import { Input } from '@/components/atoms/Input'
+import { Checkbox } from '@/components/atoms/Checkbox'
 
 const meta: Meta<typeof Popover> = {
-  title: 'UI/Popover',
+  title: 'Molecules/Popover',
   component: Popover,
   tags: ['autodocs'],
   argTypes: {