Update About sections to be more concise and clarify simulation aspects

Author: franklioxygen

src/components/FocalLength.tsx

@@ -233,15 +233,8 @@ const FocalLength: React.FC<FocalLengthProps> = () => {
 
       <div className="mt-4 p-4 bg-gray-50 rounded-lg">
         <h3 className="text-md font-medium text-gray-700 mb-2">About Focal Length</h3>
-        <p className="text-sm text-gray-600 mb-2">
-          Focal length determines the field of view (FOV) of a camera. A shorter focal length 
-          (e.g., 14mm) gives a wider view, while a longer focal length (e.g., 200mm) produces a 
-          narrower, zoomed-in view.
-        </p>
         <p className="text-sm text-gray-600">
-          The red rectangle represents what would be visible in the frame at the 
-          selected focal length. Click anywhere on the image to move the frame and explore 
-          different compositions. This is a simplified visualization based on a full-frame (36mm) sensor.
+          Simulated view of how focal length affects field of view and apparent distance in photography.
         </p>
       </div>
     </div>

src/components/ImageGallery.tsx

@@ -93,9 +93,7 @@ const ImageGallery: React.FC<ImageGalleryProps> = ({ selectedPixels }) => {
       <div className="mt-8 p-4 bg-gray-50 rounded-lg">
         <h3 className="text-md font-medium text-gray-700 mb-2">About This Gallery</h3>
         <p className="text-sm text-gray-600">
-          This gallery shows sample images for each megapixel resolution, maintaining their original aspect ratios.
-          Each image is displayed at a size that fits your screen while preserving the relative proportions of the original resolution.
-          The dimensions shown represent the actual pixel dimensions of the camera sensor at each megapixel setting.
+          Sample images showing simulated clarity differences between megapixel resolutions.
         </p>
       </div>
     </div>

src/components/PixelComparison.tsx

@@ -168,11 +168,7 @@ const PixelComparison: React.FC<PixelComparisonProps> = ({ selectedPixels }) =>
       <div className="mt-8 p-4 bg-gray-50 rounded-lg">
         <h3 className="text-md font-medium text-gray-700 mb-2">About This Comparison</h3>
         <p className="text-sm text-gray-600">
-          This visual representation shows the exact relative sizes of different camera resolutions. 
-          All blocks are scaled proportionally to maintain the exact size relationships between 
-          resolutions. {isStacked 
-            ? "In stack mode, all blocks are perfectly centered and layered with smaller resolutions on top of larger ones."
-            : "Toggle the stack option to view blocks stacked on top of each other with their centers aligned."}
+          Visual comparison of relative sensor sizes at different megapixel resolutions.
         </p>
       </div>
     </div>