"scrape design inspiration from:
 - bubble.io (clean SaaS)
 - shadcn.com (component excellence)
 - ui.aceternity.com (unique animations)
 Save screenshots to: temp/design-inspiration/"

"fork terminal use gemini to implement UI:
 Component: {Name}
 Purpose: {Description}
 Requirements: {List}
 Read: .ai/design.json (if exists)
 Reference: temp/design-inspiration/ (if exists)
 Create: src/components/{ComponentName}.tsx
 Apply: Framer Motion for animations
 Ensure: TypeScript strict, accessible (WCAG AA)"

"Review Gemini's implementation:
 Check: TypeScript types, accessibility, performance
 Test: npm run build && npm run lint
 Validate: Matches design system
 If issues: Provide feedback to Gemini for fixes"

// GOOD: Using design system
import design from '@/ai/design.json';
const className = `bg-[${design.colors.primary[500]}]`;

// BAD: Hard-coded colors
const className = "bg-purple-500"; // Generic!

"Create PromptInput component:
Purpose: Main input where users enter requests
Inspiration: Linear command palette + Raycast search

Requirements:
- Large textarea (4 lines, auto-expand to 12)
- Floating placeholder animation
- Gradient border on focus
- Character counter (subtle, bottom-right)
- Submit button with loading state
- Cmd+Enter shortcut

Interactions:
- Focus: Border gradient animates in
- Placeholder: Slides up and shrinks
- Auto-save: localStorage every 2s
- Loading: Pulsing gradient on border

Create: src/components/PromptInput.tsx"