feat(v1.2.1): add security monitoring components

- Add Storage Indicator (browser localStorage/sessionStorage monitor)
- Add Security Warnings (educational panel on JS limitations)
- Add Clipboard Tracker (copy event detection with clear function)
- Add data-sensitive attributes to sensitive fields

Security Features:
- Real-time storage monitoring with sensitive data highlighting
- Clipboard activity tracking with character count
- System clipboard clearing functionality
- Collapsible floating widgets (non-intrusive)
- Auto-refresh storage display every 2s
- Educational warnings about GC, string immutability, etc.

UI/UX:
- Floating widgets: Storage (bottom-right), Warnings (bottom-left), Clipboard (bottom-right stacked)
- Color-coded alerts (red=sensitive, orange=activity, yellow=warnings)
- Responsive and clean design with TailwindCSS

src/App.tsx

@@ -19,6 +19,9 @@ import { validateBip39Mnemonic } from './lib/bip39';
 import { buildPlaintext, encryptToSeedPgp, decryptSeedPgp } from './lib/seedpgp';
 import type { SeedPgpPlaintext } from './lib/types';
 import * as openpgp from 'openpgp';
+import { StorageIndicator } from './components/StorageIndicator';
+import { SecurityWarnings } from './components/SecurityWarnings';
+import { ClipboardTracker } from './components/ClipboardTracker';
 
 console.log("OpenPGP.js version:", openpgp.config.versionString);
 
@@ -197,6 +200,7 @@ function App() {
                       <label className="text-sm font-semibold text-slate-700">BIP39 Mnemonic</label>
                       <textarea
                         className="w-full h-32 p-4 bg-slate-50 border border-slate-200 rounded-xl text-sm font-mono focus:outline-none focus:ring-2 focus:ring-blue-500 transition-all resize-none"
+                        data-sensitive="BIP39 Mnemonic"
                         placeholder="Enter your 12 or 24 word seed phrase..."
                         value={mnemonic}
                         onChange={(e) => setMnemonic(e.target.value)}
@@ -236,6 +240,7 @@ function App() {
                     <PgpKeyInput
                       label="PGP Private Key (Optional)"
                       icon={FileKey}
+                      data-sensitive="PGP Private Key"
                       placeholder="-----BEGIN PGP PRIVATE KEY BLOCK-----&#10;&#10;Paste or drag & drop your private key..."
                       value={privateKeyInput}
                       onChange={setPrivateKeyInput}
@@ -248,6 +253,7 @@ function App() {
                           <Lock className="absolute left-3 top-3 text-slate-400" size={16} />
                           <input
                             type="password"
+                            data-sensitive="Message Password"
                             className="w-full pl-10 pr-4 py-2.5 bg-white border border-slate-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 transition-all"
                             placeholder="Unlock private key..."
                             value={privateKeyPassphrase}
@@ -428,7 +434,17 @@ function App() {
           onClose={() => setShowQRScanner(false)}
         />
       )}
+      <div className="max-w-4xl mx-auto p-8">
+        <h1>SeedPGP v1.2.0</h1>
+        {/* ... rest of your app ... */}
+      </div>
+
+      {/* Floating Storage Monitor - bottom right */}
+      <StorageIndicator />
+      <SecurityWarnings />       {/* Bottom-left */}
+      <ClipboardTracker />       {/* Top-right */}
     </>
+
   );
 
 }