Add Chromebook compatibility fixes and optimizations

Implemented comprehensive Chromebook-specific fixes including viewport adjustments, enhanced touch and keyboard detection, improved scrolling and keyboard navigation hooks, and extensive CSS optimizations for better usability. Updated chat and dashboard interfaces for larger touch targets, better focus management, and responsive layouts. Added documentation in docs/CHROMEBOOK-FIXES.md and new hooks for Chromebook scroll and keyboard handling.

hooks/use-chromebook-scroll.tsx

@@ -0,0 +1,86 @@
+import { useEffect, useRef } from 'react';
+
+/**
+ * Hook to enhance scrolling behavior for Chromebooks and touch devices
+ */
+export function useChromebookScroll() {
+  const containerRef = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    const container = containerRef.current;
+    if (!container) return;
+
+    // Enhanced scrolling for Chromebooks
+    const handleTouchStart = (e: TouchEvent) => {
+      // Prevent default touch behavior that might interfere with scrolling
+      if (e.touches.length === 1) {
+        // Single touch - allow normal scrolling
+        return;
+      }
+      
+      // Multi-touch - prevent zoom gestures
+      if (e.touches.length > 1) {
+        e.preventDefault();
+      }
+    };
+
+    const handleTouchMove = (e: TouchEvent) => {
+      // Allow momentum scrolling on Chromebooks
+      if (e.touches.length === 1) {
+        // Single touch scrolling - allow default behavior
+        return;
+      }
+      
+      // Multi-touch - prevent zoom
+      if (e.touches.length > 1) {
+        e.preventDefault();
+      }
+    };
+
+    const handleWheel = (e: WheelEvent) => {
+      // Enhanced wheel scrolling for Chromebook trackpads
+      const delta = e.deltaY;
+      const container = e.currentTarget as HTMLElement;
+      
+      // Smooth scrolling for Chromebook trackpads
+      if (Math.abs(delta) > 0) {
+        container.scrollBy({
+          top: delta * 0.5, // Reduce scroll speed for better control
+          behavior: 'smooth'
+        });
+      }
+    };
+
+    // Add event listeners
+    container.addEventListener('touchstart', handleTouchStart, { passive: false });
+    container.addEventListener('touchmove', handleTouchMove, { passive: false });
+    container.addEventListener('wheel', handleWheel, { passive: true });
+
+    // Cleanup
+    return () => {
+      container.removeEventListener('touchstart', handleTouchStart);
+      container.removeEventListener('touchmove', handleTouchMove);
+      container.removeEventListener('wheel', handleWheel);
+    };
+  }, []);
+
+  return containerRef;
+}
+
+/**
+ * Hook for smooth scrolling to bottom (useful for chat interfaces)
+ */
+export function useSmoothScrollToBottom() {
+  const scrollToBottom = (container: HTMLElement) => {
+    container.scrollTo({
+      top: container.scrollHeight,
+      behavior: 'smooth'
+    });
+  };
+
+  const scrollToBottomInstant = (container: HTMLElement) => {
+    container.scrollTop = container.scrollHeight;
+  };
+
+  return { scrollToBottom, scrollToBottomInstant };
+}