feat: add Unsplash search hook and API proxy routes

- Implemented `useUnsplashSearch` hook for searching Unsplash photos with debounce.
- Created Unsplash API client functions for searching photos and triggering downloads.
- Added proxy routes for Unsplash API to handle search requests and background image uploads.
- Introduced accessibility utilities for WCAG compliance checks and motion preference management.
- Developed theme sharing module for encoding and decoding theme configurations as base64url strings.

ccw/frontend/src/components/layout/AppShell.tsx

@@ -12,6 +12,7 @@ import { MainContent } from './MainContent';
 import { CliStreamMonitor } from '@/components/shared/CliStreamMonitor';
 import { NotificationPanel } from '@/components/notification';
 import { AskQuestionDialog, A2UIPopupCard } from '@/components/a2ui';
+import { BackgroundImage } from '@/components/shared/BackgroundImage';
 import { useNotificationStore, selectCurrentQuestion, selectCurrentPopupCard } from '@/stores';
 import { useWorkflowStore } from '@/stores/workflowStore';
 import { useWebSocketNotifications, useWebSocket } from '@/hooks';
@@ -160,6 +161,9 @@ export function AppShell({
 
   return (
     <div className="flex flex-col min-h-screen bg-background">
+      {/* Background image layer (z-index: -3 to -2) */}
+      <BackgroundImage />
+
       {/* Header - fixed at top */}
       <Header
         onRefresh={onRefresh}
@@ -180,7 +184,7 @@ export function AppShell({
         {/* Main content area */}
         <MainContent
           className={cn(
-            'transition-all duration-300',
+            'app-shell-content transition-all duration-300',
             sidebarCollapsed ? 'md:ml-16' : 'md:ml-64'
           )}
         >

ccw/frontend/src/components/layout/Header.tsx

@@ -59,7 +59,7 @@ export function Header({
 
   return (
     <header
-      className="flex items-center justify-between px-4 md:px-5 h-14 bg-card border-b border-border sticky top-0 z-50 shadow-sm"
+      className="relative flex items-center justify-between px-4 md:px-5 h-14 bg-card border-b border-border sticky top-0 z-50 shadow-sm"
       role="banner"
     >
       {/* Left side - Logo */}
@@ -200,6 +200,7 @@ export function Header({
           </div>
         </div>
       </div>
+      <div className="absolute bottom-0 left-0 right-0 h-0.5 bg-gradient-accent" aria-hidden="true" />
     </header>
   );
 }