Add relationship child creation, auto-align, delete shortcut, and improve UX

Features:
- Add "Add Child" buttons (Male/Female/Unknown) in RelationshipPanel
  to create children directly from a selected relationship
- Add "Auto Align" button in toolbar to reset all element positions
- Add Delete/Backspace keyboard shortcut to delete selected elements
- Add text labels to all toolbar buttons for better discoverability

Documentation:
- Update README with Node.js installation instructions for beginners
- Add npm install step for first-time setup
- Document keyboard shortcuts and relationship editing features
- Add Windows-specific instructions

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

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

src/components/App/App.tsx

@@ -14,12 +14,24 @@ import { usePedigreeStore, useTemporalStore } from '@/store/pedigreeStore';
 import styles from './App.module.css';
 
 export function App() {
-  const { clearSelection, selectedRelationshipId } = usePedigreeStore();
+  const {
+    clearSelection,
+    selectedPersonId,
+    selectedRelationshipId,
+    deletePerson,
+    deleteRelationship,
+  } = usePedigreeStore();
   const temporal = useTemporalStore();
 
   // Keyboard shortcuts
   useEffect(() => {
     const handleKeyDown = (e: KeyboardEvent) => {
+      // Don't handle shortcuts when typing in inputs
+      const target = e.target as HTMLElement;
+      if (target.tagName === 'INPUT' || target.tagName === 'TEXTAREA' || target.tagName === 'SELECT') {
+        return;
+      }
+
       // Undo: Ctrl/Cmd + Z
       if ((e.ctrlKey || e.metaKey) && e.key === 'z' && !e.shiftKey) {
         e.preventDefault();
@@ -36,11 +48,21 @@ export function App() {
       if (e.key === 'Escape') {
         clearSelection();
       }
+
+      // Delete or Backspace: Delete selected element
+      if (e.key === 'Delete' || e.key === 'Backspace') {
+        e.preventDefault();
+        if (selectedPersonId) {
+          deletePerson(selectedPersonId);
+        } else if (selectedRelationshipId) {
+          deleteRelationship(selectedRelationshipId);
+        }
+      }
     };
 
     window.addEventListener('keydown', handleKeyDown);
     return () => window.removeEventListener('keydown', handleKeyDown);
-  }, [clearSelection, temporal]);
+  }, [clearSelection, selectedPersonId, selectedRelationshipId, deletePerson, deleteRelationship, temporal]);
 
   return (
     <div className={styles.app}>