more stuff to improve robustness

frontend/src/components/DevPanel.tsx

@@ -1,12 +1,13 @@
 import { useState, useCallback } from 'react';
 import { useEditorStore } from '../store/editorStore';
-import { Terminal, ChevronDown, ChevronUp, Play, Wifi } from 'lucide-react';
+import { Terminal, ChevronDown, ChevronUp, Play, Wifi, AlertTriangle } from 'lucide-react';
 
 export default function DevPanel() {
   const [open, setOpen] = useState(false);
   const [pathInput, setPathInput] = useState('');
   const [testResult, setTestResult] = useState<string | null>(null);
   const [testing, setTesting] = useState(false);
+  const [showResetConfirm, setShowResetConfirm] = useState(false);
 
   const { backendUrl, videoPath, loadVideo } = useEditorStore();
 
@@ -121,6 +122,37 @@ export default function DevPanel() {
               {testResult}
             </pre>
           )}
+          {/* Danger Zone */}
+          <div className="space-y-1">
+            <div className="text-[#ef4444] uppercase tracking-wider text-[9px]">Danger Zone</div>
+            {!showResetConfirm ? (
+              <button
+                onClick={() => setShowResetConfirm(true)}
+                className="w-full px-2 py-1.5 rounded border border-red-500/40 text-red-400 hover:bg-red-500/10 text-xs flex items-center justify-center gap-1.5"
+              >
+                <AlertTriangle className="w-3 h-3" />
+                Reset Editor State
+              </button>
+            ) : (
+              <div className="bg-[#1e1020] border border-red-500/40 rounded p-2 space-y-1.5">
+                <p className="text-[#fca5a5] text-[10px]">This will clear all editor data and reload the page. Unsaved changes will be lost.</p>
+                <div className="flex gap-1">
+                  <button
+                    onClick={() => setShowResetConfirm(false)}
+                    className="flex-1 px-2 py-1 rounded text-[10px] text-[#6b7280] hover:text-white hover:bg-[#2a2d3e]"
+                  >
+                    Cancel
+                  </button>
+                  <button
+                    onClick={() => { useEditorStore.getState().reset(); window.location.reload(); }}
+                    className="flex-1 px-2 py-1 rounded text-[10px] border border-red-500/40 text-red-400 hover:bg-red-500/10"
+                  >
+                    Confirm Reset
+                  </button>
+                </div>
+              </div>
+            )}
+          </div>
         </div>
       )}
     </div>