fix: Resolve pan control configuration issues

- Fix middle and right click settings being switched
- Resolve conflict when both middle and right click are enabled
- Correct inverted Ctrl/Alt toggle display states

Closes #57

packages/fossflow-lib/src/components/PanSettings/PanSettings.tsx

@@ -74,7 +74,7 @@ export const PanSettings = () => {
         <FormControlLabel
           control={
             <Switch
-              checked={panSettings.ctrlClickPan}
+              checked={!panSettings.ctrlClickPan}
               onChange={() => handleToggle('ctrlClickPan')}
             />
           }
@@ -84,7 +84,7 @@ export const PanSettings = () => {
         <FormControlLabel
           control={
             <Switch
-              checked={panSettings.altClickPan}
+              checked={!panSettings.altClickPan}
               onChange={() => handleToggle('altClickPan')}
             />
           }

packages/fossflow-lib/src/interaction/usePanHandlers.ts

@@ -51,20 +51,20 @@ export const usePanHandlers = () => {
   const handleMouseDown = useCallback((e: SlimMouseEvent): boolean => {
     const panSettings = uiState.panSettings;
     
-    // Middle click pan
-    if (panSettings.middleClickPan && e.button === 1) {
-      e.preventDefault();
-      startPan('middle');
-      return true;
-    }
-    
-    // Right click pan
+    // Right click pan (button 2)
     if (panSettings.rightClickPan && e.button === 2) {
       e.preventDefault();
       startPan('right');
       return true;
     }
     
+    // Middle click pan (button 1)
+    if (panSettings.middleClickPan && e.button === 1) {
+      e.preventDefault();
+      startPan('middle');
+      return true;
+    }
+    
     // Ctrl + click pan
     if (panSettings.ctrlClickPan && e.ctrlKey && e.button === 0) {
       e.preventDefault();