Add welcome modal with author info and privacy policy

Features:
- Display welcome popup on first visit
- Auto-detect browser language (Chinese/English)
- Show author motivation (Usher syndrome research support)
- Privacy policy: no data collection, browser-only operations
- Use localStorage to remember dismissal
- Responsive design for mobile devices

🤖 Generated with [Claude Code](https://claude.com/claude-code)

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

src/components/App/App.tsx

@@ -4,15 +4,18 @@
  * Main application layout
  */
 
-import { useEffect } from 'react';
+import { useEffect, useState } from 'react';
 import { PedigreeCanvas } from '../PedigreeCanvas/PedigreeCanvas';
 import { Toolbar } from '../Toolbar/Toolbar';
 import { PropertyPanel } from '../PropertyPanel/PropertyPanel';
 import { RelationshipPanel } from '../RelationshipPanel/RelationshipPanel';
 import { FilePanel } from '../FilePanel/FilePanel';
+import { WelcomeModal } from '../WelcomeModal/WelcomeModal';
 import { usePedigreeStore, useTemporalStore } from '@/store/pedigreeStore';
 import styles from './App.module.css';
 
+const WELCOME_DISMISSED_KEY = 'pedigree-draw-welcome-dismissed';
+
 export function App() {
   const {
     clearSelection,
@@ -23,6 +26,15 @@ export function App() {
   } = usePedigreeStore();
   const temporal = useTemporalStore();
 
+  // Welcome modal state - check localStorage on init
+  const [showWelcome, setShowWelcome] = useState(() => {
+    return localStorage.getItem(WELCOME_DISMISSED_KEY) !== 'true';
+  });
+
+  const handleCloseWelcome = () => {
+    setShowWelcome(false);
+  };
+
   // Keyboard shortcuts
   useEffect(() => {
     const handleKeyDown = (e: KeyboardEvent) => {
@@ -85,6 +97,8 @@ export function App() {
         <span>Pedigree Draw - For genetic counselors and bioinformatics professionals</span>
         <span>NSGC Standard Symbols</span>
       </footer>
+
+      {showWelcome && <WelcomeModal onClose={handleCloseWelcome} />}
     </div>
   );
 }