feat: transform UI to dark cyberpunk theme

- Eliminate all white/light boxes and backgrounds
- Fix drag-drop zone with neon cyberpunk colors (#00f0ff, #ff006e, #16213e)
- Fix restored mnemonic display with matrix green (#39ff14)
- Fix security options panel with dark gradient
- Fix all remaining slate-700/slate-800 labels to cyberpunk neon
- Fix info banners and text colors
- Update badge components with cyberpunk color scheme
- Apply consistent dark theme across all components

src/components/badges/ClipboardBadge.tsx

@@ -18,10 +18,10 @@ const ClipboardBadge: React.FC<ClipboardBadgeProps> = ({ events, onOpenClipboard
   // Determine badge style based on clipboard count
   const badgeStyle = 
     count === 0 
-      ? "text-green-500 bg-green-500/10 border-green-500/20" // Safe
+      ? "text-[#39ff14] bg-[#39ff14]/10 border-[#39ff14]/20" // Safe
       : count < 5
-      ? "text-amber-500 bg-amber-500/10 border-amber-500/30 font-semibold" // Warning
-      : "text-red-500 bg-red-500/10 border-red-500/30 font-bold animate-pulse"; // Danger
+      ? "text-[#ff006e] bg-[#ff006e]/10 border-[#ff006e]/30 font-semibold" // Warning
+      : "text-[#ff006e] bg-[#ff006e]/10 border-[#ff006e]/30 font-bold animate-pulse"; // Danger
 
   return (
     <button

src/components/badges/EditLockBadge.tsx

@@ -12,8 +12,8 @@ const EditLockBadge: React.FC<EditLockBadgeProps> = ({ isLocked, onToggle }) =>
       onClick={onToggle}
       className={`flex items-center gap-2 px-3 py-1.5 rounded-lg border transition-all hover:scale-105 ${
         isLocked
-          ? 'text-amber-500 bg-amber-500/10 border-amber-500/30 font-semibold'
-          : 'text-green-500 bg-green-500/10 border-green-500/30'
+          ? 'text-[#ff006e] bg-[#ff006e]/10 border-[#ff006e]/30 font-semibold'
+          : 'text-[#39ff14] bg-[#39ff14]/10 border-[#39ff14]/30'
       }`}
       title={isLocked ? 'Click to unlock and edit' : 'Click to lock and blur sensitive data'}
     >