webtun 1.4.6 → 1.5.1

package/README.md

@@ -1,223 +1,139 @@
-# WebTun — Self-Hosted Web Terminal
-
-![Terminal](https://img.shields.io/badge/Terminal-Web--Native-2D5B8E?style=for-the-badge)
-![PWA](https://img.shields.io/badge/PWA-Installable-6BA428?style=for-the-badge)
-![Cloudflare](https://img.shields.io/badge/Tunnel-Cloudflare-F38020?style=for-the-badge)
-![Desktop](https://img.shields.io/badge/Desktop-Electron-47848F?style=for-the-badge)
-![License](https://img.shields.io/badge/License-MIT-green?style=for-the-badge)
-
-**Access your server from any browser — no VPN, no SSH client, no installing anything.**
-
-[![Quick Start](https://img.shields.io/badge/Quick_Start-One_Command-2D5B8E?style=for-the-badge&logo=gnu-bash)](install.sh)
-[![Download](https://img.shields.io/github/v/release/unn-known1/webtun?style=for-the-badge&logo=github)](https://github.com/unn-known1/webtun/releases/latest)
-
----
-
-## Why WebTun?
-
-| Traditional SSH | WebTun |
-|----------------|--------|
-| Need SSH client installed | Open any browser |
-| Configure VPN or port forwarding | Cloudflare Tunnel auto-configured |
-| Can't access from phone easily | PWA works on iOS/Android |
-| Share access requires key exchange | Web-based sharing in 1 click |
-| Corporate firewall blocks port 22 | Runs over HTTPS (port 443) |
-
----
-
-## Features
+<p align="center">
+  <img src="public/icon.svg" width="80" height="80" alt="WebTun">
+</p>
 
-### Core
-- **Real shell sessions** — node-pty backed, full bash/zsh support
-- **Multi-tab terminal** — drag tabs to reorder, side-by-side sessions like your desktop
-- **File explorer** — browse, upload, download, rename, delete, cut/copy/paste with conflict resolution (replace, merge, keep both, skip)
-- **WebSocket + xterm.js** — responsive, low-latency typing
+<h1 align="center">WebTun</h1>
 
-### Mobile-First UX
-- **Touch gestures** — swipe to close tabs, swipe from edge to open sidebar, pull-to-refresh file list
-- **Mobile keyboard bar** — ESC, Tab, arrow keys, Ctrl combos (Ctrl+C, Ctrl+D, etc.)
-- **Virtual keyboard aware** — terminal resizes when keyboard opens, no overlap
-- **Pinch-to-zoom** — adjust terminal font size (10–28px) with two fingers
-- **Selection mode** — toggle between terminal interaction and text selection
-- **Responsive** — optimized for phones (480px), tablets (1024px), and landscape orientation
+<p align="center">
+  <strong>Self-hosted web terminal with file explorer, Cloudflare Tunnel, and PWA support</strong><br>
+  Access your server from any browser — no VPN, no SSH client, no installing anything.
+</p>
 
-### File Explorer
-- **Multi-select** — select all / deselect all, batch delete and download files
-- **Zip / Extract** — right-click any file or folder to zip; right-click `.zip` files to extract
-- **Image viewer** — click images (.png, .jpg, .gif, .svg, .webp, .bmp, .ico) to preview inline
-- **Cut, Copy, Paste** — with conflict resolution dialog (replace, merge folders, keep both, skip, cancel)
-- **Upload with progress** — per-file progress bar via XHR
-- **Breadcrumb navigation** — tappable directory segments for quick navigation
-- **Long-press context menu** — rename, delete, download, copy on touch devices
-- **Text selection** — long-press file names to select and copy text on touch devices
-
-### Desktop App (Electron)
-- Cross-platform app for Linux & Windows
-- Runs the server as a child process — no terminal needed
-- Native window with system tray, copy/paste, and file dialogs
-- Download the latest release from [GitHub Releases](https://github.com/unn-known1/webtun/releases/latest)
-- Or build from source: `npm run dist:linux` / `npm run dist:win`
-
-### PWA (Install as App)
-- Add to iOS/Android home screen — looks and feels like native app
-- Install banner prompts on first visit (Chrome) with iOS instructions fallback
-- Works offline (shows last session state)
-- Push notifications for tunnel status
-
-### Cloudflare Tunnel (Zero-Config)
-- Create tunnel from UI — no CLI commands
-- Built-in health check warns if local server is unreachable before creating tunnel
-- Live/orphan status + target responsiveness indicator in tunnel list
-- Get public HTTPS URL instantly
-- Tunnels survive server restarts
-- Stop/kill tunnels from settings panel
+<p align="center">
+  <a href="https://github.com/unn-known1/webtun/releases/latest"><img src="https://img.shields.io/github/v/release/unn-known1/webtun?style=flat-square&logo=github" alt="Release"></a>
+  <img src="https://img.shields.io/badge/Terminal-xterm.js-2D5B8E?style=flat-square" alt="Terminal">
+  <img src="https://img.shields.io/badge/PWA-Installable-6BA428?style=flat-square" alt="PWA">
+  <img src="https://img.shields.io/badge/Tunnel-Cloudflare-F38020?style=flat-square" alt="Tunnel">
+  <img src="https://img.shields.io/badge/Desktop-Electron-47848F?style=flat-square" alt="Electron">
+  <img src="https://img.shields.io/badge/License-MIT-green?style=flat-square" alt="License">
+</p>
 
 ---
 
 ## Quick Start
 
-### npm (Recommended)
 ```bash
 npx webtun
 ```
 
-Install globally:
-```bash
-npm install -g webtun
-webtun
-```
+That's it. Open `http://localhost:3000` in your browser.
 
-**Options:**
-| Flag | Description |
-|------|-------------|
-| `--port, -p` | Port (default: 3000) |
-| `--host, -h` | Host (default: 0.0.0.0) |
-| `--pin` | Authentication PIN |
-| `--tunnel, -t` | Start Cloudflare Tunnel |
-| `--help` | Show help |
-| `--version` | Show version |
-
-**Environment Variables:**
-| Variable | Description |
-|----------|-------------|
-| `PORT` | Server port (default: 3000) |
-| `HOST` | Bind address (default: 0.0.0.0) |
-| `PIN` | Authentication PIN (empty = no auth) |
-| `SHELL` | Shell to use (default: PowerShell on Windows, bash/sh elsewhere) |
-| `WORKSPACE_ROOT` | Root directory for file operations (default: ~) |
-| `TRUST_PROXY` | Set to `true` if behind a reverse proxy (default: loopback only) |
-| `WEBTUN_SHELL` | Override shell on Windows (e.g., `/usr/bin/bash` for Git Bash) |
-
-**Examples:**
 ```bash
-npx webtun                        # Start on port 3000
-npx webtun --port 8080            # Custom port
 npx webtun --pin secret123        # With PIN protection
-npx webtun --tunnel               # With Cloudflare Tunnel
-npx webtun -p 4000 -t             # Port 4000 + tunnel
+npx webtun --tunnel               # With Cloudflare Tunnel (public URL)
+npx webtun -p 8080 -t             # Custom port + tunnel
+npx webtun --help                 # Show all options
+npx webtun --version              # Show version
 ```
 
-**Note:** npm 12+ blocks install scripts by default. Allow them for `node-pty` (native module):
-```bash
-# Allow scripts once during install
-npm install -g --allow-scripts=webtun,node-pty webtun
+### Install globally
 
-# Or allow globally (one-time setup)
-npm config set allow-scripts=webtun,node-pty --location=user
+```bash
 npm install -g webtun
+webtun
 ```
 
-Build tools are also required (for compiling native modules):
-```bash
-# Debian/Ubuntu
-sudo apt-get install -y python3 make g++
+> **npm 12+ note:** Install scripts are blocked by default. Allow them for `node-pty`:
+> ```bash
+> npm install -g --allow-scripts=webtun,node-pty webtun
+> ```
+> Build tools required for native modules: `sudo apt-get install -y python3 make g++` (Debian/Ubuntu) or `xcode-select --install` (macOS).
 
-# macOS
-xcode-select --install
-```
+### Other install methods
 
-### One-Command Install
 ```bash
+# One-command install
 bash -c "$(curl -fsSL https://raw.githubusercontent.com/unn-Known1/webtun/main/install.sh)"
-```
-
-### Manual Setup
-```bash
-git clone https://github.com/unn-Known1/webtun.git
-cd webtun
-chmod +x setup.sh && ./setup.sh
-npm start
-```
 
-### Google Colab (Instant Terminal)
-```python
-!rm -rf webtun && git clone https://github.com/unn-Known1/webtun.git && cd webtun && npm install --loglevel=error && node server.js > /tmp/webtun.log 2>&1 & sleep 4 && for i in 1 2 3; do curl -sf http://localhost:3000/api/auth/required >/dev/null && break; sleep 2; done && curl -s -X POST http://localhost:3000/api/tunnel -H 'Content-Type: application/json' -d '{"url":"http://localhost:3000"}' --max-time 20 | python3 -c "import sys,json; d=json.load(sys.stdin); print('🌐 WebTun ready at:', d.get('url','Error: '+d.get('error','')))"
+# Manual setup
+git clone https://github.com/unn-Known1/webtun.git && cd webtun && ./setup.sh && npm start
 ```
 
 ---
 
-## Architecture
+## Features
 
-```
-┌────────────────────────────────────────────────────────────────┐
-│                        Your Browser                            │
-│  ┌──────────┐  ┌───────────┐  ┌─────────────┐  ┌───────────┐   │
-│  │ Terminal │  │   File    │  │   Tunnel    │  │  Settings │   │
-│  │  (xterm) │  │ Explorer  │  │   Manager   │  │   Panel   │   │
-│  └─────┬────┘  └─────┬─────┘  └──────┬──────┘  └─────┬─────┘   │
-│        │             │               │               │         │
-└────────┼─────────────┼───────────────┼───────────────┼─────────┘
-         │  WebSocket  │  REST API     │               │
-         ▼             ▼               ▼               │
-┌────────────────────────────────────────────────────────────────┐
-│                       Node.js Server                           │
-│  ┌─────────────┐  ┌──────────────┐  ┌───────────────────────┐  │
-│  │  WebSocket  │  │   File API   │  │  Cloudflare Tunnel    │  │
-│  │   Handler   │  │ (read/write) │  │      Manager          │  │
-│  └──────┬──────┘  └──────┬───────┘  └───────────┬───────────┘  │
-│         │                │                      │              │
-│         ▼                ▼                      ▼              │
-│  ┌──────────┐  ┌──────────────────┐  ┌──────────────────────┐  │
-│  │ node-pty │  │ Local Filesystem │  │ cloudflared daemon   │  │
-│  │  (shell) │  │ (your server)    │  │ (exposes to internet)│  │
-│  └──────────┘  └──────────────────┘  └──────────────────────┘  │
-└────────────────────────────────────────────────────────────────┘
-                               │
-                               ▼
-                      ┌─────────────────┐
-                      │  Internet Users │
-                      │  (HTTPS URL)    │
-                      └─────────────────┘
-```
+### Terminal
+- **Real shell sessions** — node-pty backed, full bash/zsh/PowerShell support
+- **Multi-tab** — drag to reorder, side-by-side sessions
+- **Bracketed paste** — Ctrl+V works in TUI apps (vim, nano, htop)
+- **Command history** — keystroke-based capture, strips ANSI/control sequences
+- **tmux sessions** — persistent sessions survive page reload
 
----
+### File Explorer
+- Browse, upload, download, rename, delete files
+- **Multi-select** — batch delete, download, zip, cut, copy
+- **Zip/Extract** — right-click any file or folder
+- **Image viewer** — preview inline (png, jpg, gif, svg, webp)
+- **Conflict resolution** — replace, merge, keep both, skip
+- **Breadcrumb navigation** — tappable directory segments
+
+### Mobile
+- **Touch gestures** — swipe to close tabs, pull-to-refresh
+- **Mobile keyboard bar** — ESC, Tab, arrows, Ctrl combos
+- **Pinch-to-zoom** — adjust font size with two fingers
+- **Virtual keyboard aware** — no overlap when keyboard opens
+- **Selection mode** — toggle between interaction and text selection
+
+### Cloudflare Tunnel
+- Create tunnels from the UI — zero CLI commands
+- Built-in health check before tunnel creation
+- Live status indicators, tunnels survive restarts
+- Stop/kill tunnels from settings panel
 
-## Use Cases
+### System Stats
+- CPU, Memory, Disk, Uptime — real-time with progress bars
+- GPU detection (nvidia-smi, system_profiler, WMI)
+- Multi-GPU support with VRAM, utilization, temperature
+- Top processes sorted by CPU
 
-| Scenario | Why WebTun |
-|----------|------------|
-| **Home server access** | Access from anywhere without opening ports |
-| **Emergency debugging** | Phone/laptop without SSH client |
-| **Share terminal with friend** | No key exchange, just send URL |
-| **Colab power-up** | Persistent terminal alongside Python notebooks |
-| **Demo environment** | Spin up temp shell for presentations |
-| **Corporate restrictions** | HTTPS works where SSH is blocked |
+### Desktop (Electron)
+- Cross-platform app for Linux, Windows, macOS
+- Native window with system tray and file dialogs
+- Build: `npm run dist:linux` / `npm run dist:win` / `npm run dist:mac`
+- [Download latest release](https://github.com/unn-known1/webtun/releases/latest)
+
+### PWA
+- Install to iOS/Android home screen
+- Works offline with last session state
+- Install banner with iOS instructions fallback
 
 ---
 
-## Tunnel Manager
+## Configuration
 
-1. Open **Settings** (gear icon)
-2. Go to **Tunnel** section
-3. Enter URL (default: `http://localhost:3000`)
-4. Click **Create** — a health check pings the target first, warns if unreachable
-5. Copy the public URL — share it with anyone
-6. View all tunnels with live status indicators (green/orange)
+### CLI Flags
 
-**Note:** Tunnels created before a server restart need manual cleanup:
-```bash
-kill $(pgrep -f 'cloudflared tunnel')
-```
+| Flag | Description | Default |
+|------|-------------|---------|
+| `--port, -p` | Server port | `3000` |
+| `--host, -h` | Bind address | `0.0.0.0` |
+| `--pin` | Authentication PIN | none |
+| `--tunnel, -t` | Start Cloudflare Tunnel | off |
+| `--help` | Show help | — |
+| `--version` | Show version | — |
+
+### Environment Variables
+
+| Variable | Description | Default |
+|----------|-------------|---------|
+| `PORT` | Server port | `3000` |
+| `HOST` | Bind address | `0.0.0.0` |
+| `PIN` | Auth PIN (empty = no auth) | none |
+| `SHELL` | Shell to use | platform default |
+| `WORKSPACE_ROOT` | File explorer root | `~` |
+| `TRUST_PROXY` | Trust `X-Forwarded-For` from first proxy | `false` |
+| `WEBTUN_SHELL` | Override shell on Windows | PowerShell |
 
 ---
 
@@ -225,44 +141,53 @@ kill $(pgrep -f 'cloudflared tunnel')
 
 | Layer | Technology |
 |-------|------------|
-| Frontend | HTML + Vanilla JS (PWA, prefers-color-scheme, visualViewport, Drag & Drop) |
-| Backend | Node.js + node-pty + Express |
-| Terminal | xterm.js + fit addon |
-| Protocol | WebSocket (ws) |
+| Frontend | Vanilla JS, xterm.js, CodeMirror, PWA |
+| Backend | Node.js, Express, node-pty |
 | Tunnel | Cloudflare Tunnel (cloudflared) |
 | Desktop | Electron + electron-builder |
+| Archives | archiver v8 + yauzl |
 
 ---
 
-## Troubleshooting
+## Security
 
-| Problem | Solution |
-|---------|----------|
-| Tunnel URL not loading | Check Cloudflare account quota at [dash.cloudflare.com](https://dash.cloudflare.com) |
-| Permission denied on shell | Ensure user has shell access: `chsh -s /bin/bash` |
-| File upload fails | Check `public/uploads/` permissions: `chmod 755 public/uploads/` |
-| Port 3000 in use | Change port: `PORT=3001 npm start` |
-| Windows terminal opens PowerShell instead of Git Bash | Set `WEBTUN_SHELL=/usr/bin/bash` in `.env` |
-| Behind reverse proxy, wrong client IP | Set `TRUST_PROXY=true` in `.env` |
-| Tunnel persists after server restart | Tunnels are auto-managed; manual cleanup: `kill $(pgrep -f 'cloudflared tunnel')` |
+- PIN authentication on all API endpoints (`x-pin-token` header or `?token=` query)
+- CSP headers restrict script sources to CDN
+- WebSocket origin check prevents cross-site hijacking
+- Per-IP rate limiting on auth and search endpoints
+- npm audit clean — 0 known vulnerabilities
 
 ---
 
-## Contributing
+## Troubleshooting
 
-1. Fork → Branch → Commit → PR
-2. Follow existing code style (ES6+, no frameworks)
-3. Test locally with `npm start`
-4. Update this README if adding features
+| Problem | Solution |
+|---------|----------|
+| Tunnel not loading | Check quota at [dash.cloudflare.com](https://dash.cloudflare.com) |
+| Port 3000 in use | `PORT=3001 npm start` |
+| Shell permission denied | `chsh -s /bin/bash` |
+| Behind reverse proxy | Set `TRUST_PROXY=true` in `.env` |
+| Windows shell wrong | Set `WEBTUN_SHELL=/usr/bin/bash` in `.env` |
+| Tunnel persists after restart | `kill $(pgrep -f 'cloudflared tunnel')` |
 
 ---
 
-## License
+## Changelog
+
+### v1.5.1
+- Fixed command history saving terminal garbage instead of actual commands
+- Fixed history 401 errors on Cloudflare tunnel URLs
+- Fixed VT/ANSI parameter sequences leaking into history
+- Fixed CodeMirror `defineSimpleMode` error
+- Fixed console accessibility warnings (labels, form fields)
+- Added safe `localStorage` wrapper for Tracking Prevention compatibility
+- New terminal icon matching in-app logo
 
-MIT — do whatever you want with it.
+### v1.5.0
+- Initial release
 
 ---
 
 <p align="center">
-  <sub>Made with ❤️ by <a href="https://github.com/unn-known1">Gaurang Patel</a></sub>
+  <sub>Built by <a href="https://github.com/unn-known1">Gaurang Patel</a> · MIT License</sub>
 </p>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "webtun",
-  "version": "1.4.6",
+  "version": "1.5.1",
   "description": "Self-hosted web terminal with Cloudflare Tunnel, file explorer, and PWA support",
   "author": {
     "name": "Gaurang Patel",

package/public/icon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#c0caf5" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="4" width="20" height="16" rx="2"></rect><line x1="6" y1="8" x2="10" y2="8"></line><line x1="6" y1="12" x2="10" y2="12"></line><line x1="12" y1="8" x2="18" y2="8"></line><line x1="12" y1="12" x2="18" y2="12"></line></svg>

package/public/index.html

@@ -4,9 +4,11 @@
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
 <meta name="apple-mobile-web-app-capable" content="yes">
+<meta name="mobile-web-app-capable" content="yes">
 <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
 <meta name="theme-color" content="#1a1b26">
 <title>WebTun</title>
+<link rel="icon" href="/favicon.png" type="image/png">
 <link rel="manifest" href="/manifest.json">
 <link rel="apple-touch-icon" href="/icon-192.png">
 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@xterm/xterm@5.5.0/css/xterm.min.css">
@@ -32,6 +34,7 @@
 <script src="https://cdn.jsdelivr.net/npm/codemirror@5.65.18/mode/yaml/yaml.min.js"></script>
 <script src="https://cdn.jsdelivr.net/npm/codemirror@5.65.18/mode/sql/sql.min.js"></script>
 <script src="https://cdn.jsdelivr.net/npm/codemirror@5.65.18/mode/go/go.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/codemirror@5.65.18/addon/mode/simple.min.js"></script>
 <script src="https://cdn.jsdelivr.net/npm/codemirror@5.65.18/mode/rust/rust.min.js"></script>
 <script src="https://cdn.jsdelivr.net/npm/codemirror@5.65.18/mode/properties/properties.min.js"></script>
 <style>
@@ -857,9 +860,15 @@ svg { display: block; }
 </head>
 <body data-theme="light">
 <script>
+  // Safe localStorage wrapper — degrades gracefully when Tracking Prevention blocks storage
+  const safeStorage = {
+    getItem(k) { try { return localStorage.getItem(k); } catch(e) { return null; } },
+    setItem(k, v) { try { localStorage.setItem(k, v); } catch(e) {} },
+    removeItem(k) { try { localStorage.removeItem(k); } catch(e) {} }
+  };
   (function() {
     try {
-      const settings = JSON.parse(localStorage.getItem('wt-settings')) || {};
+      const settings = JSON.parse(safeStorage.getItem('wt-settings')) || {};
       let theme = settings.theme || 'light';
       if (theme === 'system') {
         theme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dracula' : 'light';
@@ -1061,7 +1070,7 @@ svg { display: block; }
           </div>
           <div id="editor-area">
             <textarea id="editor-textarea" spellcheck="false"></textarea>
-            <div id="editor-preview"><iframe id="editor-preview-iframe" sandbox="allow-same-origin"></iframe></div>
+            <div id="editor-preview"><iframe id="editor-preview-iframe" sandbox="allow-same-origin allow-scripts"></iframe></div>
           </div>
         </div>
       </div>
@@ -1143,7 +1152,7 @@ svg { display: block; }
         <div class="settings-section">
           <h3>Appearance</h3>
           <div class="setting-row">
-            <label>Theme</label>
+            <label for="s-theme">Theme</label>
             <select id="s-theme" onchange="applyTheme(this.value)">
               <option value="system">System</option>
               <option value="light">Light</option>
@@ -1155,11 +1164,11 @@ svg { display: block; }
             </select>
           </div>
           <div class="setting-row">
-            <label>Font Size</label>
+            <label for="s-fontsize">Font Size</label>
             <input type="number" id="s-fontsize" min="8" max="32" value="14" onchange="applyFontSize(+this.value)">
           </div>
           <div class="setting-row">
-            <label>Font Family</label>
+            <label for="s-font">Font Family</label>
             <select id="s-font" onchange="applyFont(this.value)">
               <option value="'SF Mono', 'Fira Code', Consolas, monospace">System Mono</option>
               <option value="'Fira Code', monospace">Fira Code</option>
@@ -1169,7 +1178,7 @@ svg { display: block; }
             </select>
           </div>
           <div class="setting-row">
-            <label>Cursor Style</label>
+            <label for="s-cursor">Cursor Style</label>
             <select id="s-cursor" onchange="applyCursor(this.value)">
               <option value="block">Block</option>
               <option value="underline">Underline</option>
@@ -1177,44 +1186,48 @@ svg { display: block; }
             </select>
           </div>
           <div class="setting-row">
-            <label>Cursor Blink</label>
-            <div class="toggle" id="s-blink" role="switch" tabindex="0" aria-checked="true" onclick="toggleSetting('blink')" onkeydown="if(event.key===' '||event.key==='Enter'){event.preventDefault();toggleSetting('blink')}"></div>
+            <label for="s-blink-cb">Cursor Blink</label>
+            <div class="toggle" id="s-blink" role="switch" tabindex="0" aria-checked="true" onclick="toggleSetting('blink')" onkeydown="if(event.key===' '||event.key==='Enter'){event.preventDefault();toggleSetting('blink')}"><input type="checkbox" id="s-blink-cb" style="position:absolute;opacity:0;pointer-events:none;width:0;height:0"></div>
           </div>
         </div>
         <div class="settings-section">
           <h3>Terminal</h3>
           <div class="setting-row">
-            <label>Scrollback Lines</label>
+            <label for="s-scrollback">Scrollback Lines</label>
             <input type="number" id="s-scrollback" min="100" max="100000" value="5000" onchange="applyScrollback(+this.value)">
           </div>
           <div class="setting-row">
-            <label>Bell Sound</label>
-            <div class="toggle" id="s-bell" role="switch" tabindex="0" aria-checked="false" onclick="toggleSetting('bell')" onkeydown="if(event.key===' '||event.key==='Enter'){event.preventDefault();toggleSetting('bell')}"></div>
+            <label for="s-bell-cb">Bell Sound</label>
+            <div class="toggle" id="s-bell" role="switch" tabindex="0" aria-checked="false" onclick="toggleSetting('bell')" onkeydown="if(event.key===' '||event.key==='Enter'){event.preventDefault();toggleSetting('bell')}"><input type="checkbox" id="s-bell-cb" style="position:absolute;opacity:0;pointer-events:none;width:0;height:0"></div>
+          </div>
+          <div class="setting-row">
+            <label for="s-termRightClick-cb">Right-Click Menu</label>
+            <div class="toggle on" id="s-termRightClick" role="switch" tabindex="0" aria-checked="true" onclick="toggleSetting('termRightClick')" onkeydown="if(event.key===' '||event.key==='Enter'){event.preventDefault();toggleSetting('termRightClick')}"><input type="checkbox" id="s-termRightClick-cb" style="position:absolute;opacity:0;pointer-events:none;width:0;height:0"></div>
           </div>
         </div>
         <div class="settings-section">
           <h3>Interface</h3>
           <div class="setting-row">
-            <label>Show Mobile Keys</label>
-            <div class="toggle" id="s-mobilekeys" role="switch" tabindex="0" aria-checked="false" onclick="toggleSetting('mobilekeys')" onkeydown="if(event.key===' '||event.key==='Enter'){event.preventDefault();toggleSetting('mobilekeys')}"></div>
+            <label for="s-mobilekeys-cb">Show Mobile Keys</label>
+            <div class="toggle" id="s-mobilekeys" role="switch" tabindex="0" aria-checked="false" onclick="toggleSetting('mobilekeys')" onkeydown="if(event.key===' '||event.key==='Enter'){event.preventDefault();toggleSetting('mobilekeys')}"><input type="checkbox" id="s-mobilekeys-cb" style="position:absolute;opacity:0;pointer-events:none;width:0;height:0"></div>
           </div>
           <div class="setting-row">
-            <label>Confirm on Close</label>
-            <div class="toggle on" id="s-confirmclose" role="switch" tabindex="0" aria-checked="true" onclick="toggleSetting('confirmclose')" onkeydown="if(event.key===' '||event.key==='Enter'){event.preventDefault();toggleSetting('confirmclose')}"></div>
+            <label for="s-confirmclose-cb">Confirm on Close</label>
+            <div class="toggle on" id="s-confirmclose" role="switch" tabindex="0" aria-checked="true" onclick="toggleSetting('confirmclose')" onkeydown="if(event.key===' '||event.key==='Enter'){event.preventDefault();toggleSetting('confirmclose')}"><input type="checkbox" id="s-confirmclose-cb" style="position:absolute;opacity:0;pointer-events:none;width:0;height:0"></div>
           </div>
           <div class="setting-row">
-            <label>Data Saver</label>
-            <div class="toggle" id="s-datasaver" role="switch" tabindex="0" aria-checked="false" onclick="toggleSetting('datasaver')" onkeydown="if(event.key===' '||event.key==='Enter'){event.preventDefault();toggleSetting('datasaver')}"></div>
+            <label for="s-datasaver-cb">Data Saver</label>
+            <div class="toggle" id="s-datasaver" role="switch" tabindex="0" aria-checked="false" onclick="toggleSetting('datasaver')" onkeydown="if(event.key===' '||event.key==='Enter'){event.preventDefault();toggleSetting('datasaver')}"><input type="checkbox" id="s-datasaver-cb" style="position:absolute;opacity:0;pointer-events:none;width:0;height:0"></div>
           </div>
           <div class="setting-row electron-only" style="display:none">
-            <label>Start on Login</label>
-            <div class="toggle" id="s-autostart" role="switch" tabindex="0" aria-checked="false" onclick="toggleSetting('autostart')" onkeydown="if(event.key===' '||event.key==='Enter'){event.preventDefault();toggleSetting('autostart')}"></div>
+            <label for="s-autostart-cb">Start on Login</label>
+            <div class="toggle" id="s-autostart" role="switch" tabindex="0" aria-checked="false" onclick="toggleSetting('autostart')" onkeydown="if(event.key===' '||event.key==='Enter'){event.preventDefault();toggleSetting('autostart')}"><input type="checkbox" id="s-autostart-cb" style="position:absolute;opacity:0;pointer-events:none;width:0;height:0"></div>
           </div>
         </div>
         <div class="settings-section">
           <h3>Tunnel</h3>
           <div class="setting-row" style="flex-wrap:wrap;gap:6px">
-            <label style="flex:0 0 auto">Local URL</label>
+            <label for="tunnel-url" style="flex:0 0 auto">Local URL</label>
             <div style="display:flex;flex:1;gap:6px;min-width:0">
               <input type="text" id="tunnel-url" value="http://localhost:3000" placeholder="http://localhost:PORT" style="flex:1;min-width:0">
               <button class="btn btn-primary" style="height:28px;padding:0 12px;font-size:12px;flex-shrink:0" onclick="createTunnel()">Create</button>
@@ -1343,6 +1356,7 @@ svg { display: block; }
           <div class="sys-val" id="sys-uptime-val">—</div>
           <div class="sys-sub" id="sys-uptime-sub"></div>
         </div>
+        <div id="sys-gpu-container"></div>
       </div>
       <div class="settings-section">
         <h3>Top Processes by CPU</h3>
@@ -1471,7 +1485,7 @@ let hasTmux = false;
 let settings = {
   theme: 'light', fontSize: 14, font: "'SF Mono', 'Fira Code', Consolas, monospace",
   cursor: 'block', blink: true, scrollback: 5000, bell: false,
-  mobilekeys: false, confirmclose: true, datasaver: false, autostart: false, keepAwake: false
+  mobilekeys: false, confirmclose: true, datasaver: false, autostart: false, keepAwake: false, termRightClick: true
 };
 let serverPlatform = '';
 
@@ -1505,12 +1519,12 @@ function preventDoubleTap(el, fn, delay = 1000) {
 
 function saveTabState() {
   const state = tabs.map(t => ({ id: t.id, sessionId: t.sessionId, title: t.title }));
-  try { localStorage.setItem('wt-tabs', JSON.stringify(state)); } catch(e) { console.warn('Failed to save tabs:', e); }
+  try { safeStorage.setItem('wt-tabs', JSON.stringify(state)); } catch(e) { console.warn('Failed to save tabs:', e); }
 }
 
 function loadTabState() {
   try {
-    const val = JSON.parse(localStorage.getItem('wt-tabs'));
+    const val = JSON.parse(safeStorage.getItem('wt-tabs'));
     return Array.isArray(val) ? val : [];
   } catch(e) { console.warn('loadTabState error:', e); return []; }
 }
@@ -1733,6 +1747,8 @@ function setupTabDragDrop(tabEl, id) {
 function setupTabInlineRename(tabTitleSpan, tab) {
   const startRename = (span) => {
     const input = document.createElement('input');
+    input.id = 'tab-rename-input';
+    input.name = 'tab-rename';
     input.type = 'text';
     input.value = tab.title;
     input.style.cssText = `width:${Math.max(60, tab.title.length * 9)}px;height:22px;font-size:12px;padding:0 6px`;
@@ -1902,22 +1918,27 @@ function connectWebSocket(tab, isReconnect = false) {
 
   const sendInput = data => {
     if (ws.readyState !== WebSocket.OPEN) return;
-    // On Enter, read command from terminal screen buffer (avoids echo-back pollution)
+    // On Enter, capture the command for history
     for (let i = 0; i < data.length; i++) {
       const ch = data.charCodeAt(i);
       if (ch === 13 || ch === 10) { // Enter
         try {
-          const buf = tab.term.buffer.active;
-          const line = buf.getLine(buf.baseY + buf.cursorY);
-          if (line) {
-            let text = line.translateToString(true).trim();
-            // Strip prompt prefix: find last $ # or % and take text after it
-            const promptEnd = Math.max(text.lastIndexOf('$'), text.lastIndexOf('#'), text.lastIndexOf('%'));
-            if (promptEnd >= 0 && promptEnd < text.length - 1) {
-              text = text.substring(promptEnd + 1).trim();
-            }
-            if (text) addToCmdHist(text);
+          // Prefer stored paste text
+          let text = tab._lastPasteText;
+          tab._lastPasteText = null;
+          if (text) {
+            // For multi-line pastes, take only the last line (the command)
+            const lines = text.split('\n');
+            text = lines[lines.length - 1] || lines[lines.length - 2] || text;
+            text = text.trim();
+          } else {
+            // Use the tracked input buffer (more reliable than buffer scanning)
+            text = (tab._currentInput || '').trim();
+            // Strip any leaked VT/ANSI parameter junk that bypassed the escape parser
+            text = text.replace(/^[>;\d\s]+(?=[a-zA-Z/\\~\-.])/, '').replace(/^[>;\d\s]+$/, '').trim();
           }
+          if (text) addToCmdHist(text);
+          tab._currentInput = ''; // Clear after history save
         } catch {}
       }
     }
@@ -1925,6 +1946,27 @@ function connectWebSocket(tab, isReconnect = false) {
     const buf = new Uint8Array(1 + enc.length);
     buf[0] = 0x00; buf.set(enc, 1);
     ws.send(buf.buffer);
+
+    // Update the keystroke buffer — skip all escape sequences and control characters
+    for (let i = 0; i < data.length; i++) {
+      const ch = data.charCodeAt(i);
+      if (ch === 13 || ch === 10) { // Enter (handled above)
+        continue;
+      } else if (ch === 127 || ch === 8) { // Backspace / Delete
+        if (tab._currentInput) tab._currentInput = tab._currentInput.slice(0, -1);
+      } else if (ch === 27) { // ESC — skip entire escape sequence (CSI, SS3, OSC, DCS, etc.)
+        i++; // skip first char after ESC (usually '[', 'O', ']', 'P')
+        // Skip until we find a final char or run out of data
+        while (i < data.length) {
+          const c = data.charCodeAt(i);
+          if (c >= 0x40 && c <= 0x7E) { i++; break; } // final char — sequence done
+          i++;
+        }
+      } else if (ch >= 32 && ch < 0x7F) { // Printable ASCII only
+        tab._currentInput = (tab._currentInput || '') + data[i];
+      }
+      // All other control chars (0x00-0x1F except 0x0D/0x0A) are silently dropped
+    }
   };
   const sendResize = (cols, rows) => {
     if (ws.readyState !== WebSocket.OPEN) return;
@@ -2158,6 +2200,25 @@ function initTerminal(tab) {
   tab.searchAddon = searchAddon;
   tab.closed = false;
   tab.textarea = term.textarea || term.element?.querySelector('.xterm-textarea, textarea');
+  if (tab.textarea && !tab.textarea.id) {
+    tab.textarea.id = 'xterm-helper-' + tab.id;
+    tab.textarea.name = 'terminal-input';
+  }
+
+  // Intercept paste events to use bracketed paste mode (required for TUI apps like vim, nano, mc)
+  if (tab.textarea) {
+    tab.textarea.addEventListener('paste', e => {
+      e.preventDefault();
+      const text = (e.clipboardData || window.clipboardData)?.getData('text');
+      if (!text || !tab.ws || tab.ws.readyState !== WebSocket.OPEN) return;
+      tab._lastPasteText = text;
+      const bracketed = '\x1b[200~' + text + '\x1b[201~';
+      const enc = new TextEncoder().encode(bracketed);
+      const buf = new Uint8Array(1 + enc.length);
+      buf[0] = 0x00; buf.set(enc, 1);
+      tab.ws.send(buf.buffer);
+    }, true);
+  }
 
   // term.onFocus() was removed from xterm.js — use native DOM event instead
   term.element.addEventListener('focusin', () => {
@@ -2210,6 +2271,7 @@ function initTerminal(tab) {
 
   // Terminal right-click context menu
   term.element.addEventListener('contextmenu', e => {
+    if (!settings.termRightClick) return;
     e.preventDefault();
     const menu = document.getElementById('term-ctx-menu');
     const sel = term.getSelection();
@@ -2277,18 +2339,22 @@ function initTerminal(tab) {
     if (!tab.closed) connectWebSocket(tab, false);
   });
 
-  // Scroll terminal on wheel; yield to TUI apps when mouse tracking is active
+  // Scroll terminal on wheel
   tab.wrapper.addEventListener('wheel', e => {
     if (e.ctrlKey || e.metaKey) return;
-    // When a TUI app (vim, htop, tmux…) has mouse tracking on, let the app handle scroll
+    e.preventDefault();
+    // TUI apps with mouse tracking handle scroll themselves — forward the event to xterm.js
     try {
       const core = term._core;
-      if (core && core.coreMouseService && core.coreMouseService.isMouseTrackingActive()) return;
+      if (core && core.coreMouseService && core.coreMouseService.isMouseTrackingActive()) {
+        const vp = tab.wrapper.querySelector('.xterm-viewport');
+        if (vp) vp.dispatchEvent(new WheelEvent('wheel', e));
+        return;
+      }
     } catch (_) {}
     const atTop = term.buffer.active.baseY === 0;
     const atBottom = term.buffer.active.baseY + term.rows >= term.buffer.active.length;
     if (tilesMode && ((e.deltaY < 0 && atTop) || (e.deltaY > 0 && atBottom))) return;
-    e.preventDefault();
     let delta = e.deltaY;
     if (e.deltaMode === 1) delta *= 16;
     else if (e.deltaMode === 2) delta *= 16 * term.rows;
@@ -2323,9 +2389,9 @@ function initTerminal(tab) {
         if (tab.fitAddon) tab.fitAddon.fit();
         if (!window._pinchSaveTimer) {
           window._pinchSaveTimer = setTimeout(() => {
-            const persisted = JSON.parse(localStorage.getItem('wt-settings') || '{}');
+            const persisted = JSON.parse(safeStorage.getItem('wt-settings') || '{}');
             persisted.fontSize = tab.term.options.fontSize;
-            localStorage.setItem('wt-settings', JSON.stringify(persisted));
+            safeStorage.setItem('wt-settings', JSON.stringify(persisted));
             window._pinchSaveTimer = null;
           }, 500);
         }
@@ -2965,12 +3031,20 @@ document.addEventListener('click', () => {
 
 document.getElementById('ctx-open').onclick = () => { if (!ctxTarget) return; if (isImageFile(ctxTarget.path)) openImageViewer(ctxTarget.path); else loadFiles(ctxTarget.path); };
 document.getElementById('ctx-edit').onclick = () => ctxTarget && openFileEditor(ctxTarget.path);
-document.getElementById('ctx-download').onclick = () => ctxTarget && downloadFile(ctxTarget.path);
+document.getElementById('ctx-download').onclick = () => {
+  if (selectedFiles.length > 0) { downloadSelected(); return; }
+  if (ctxTarget) downloadFile(ctxTarget.path);
+};
 document.getElementById('ctx-zip').onclick = async () => {
-  if (!ctxTarget) return;
+  const files = selectedFiles.length > 0 ? selectedFiles : (ctxTarget ? [ctxTarget.path] : []);
+  if (!files.length) return;
   const t = toast('Zipping…', 'info');
-  await zipFile(ctxTarget.path, ctxTarget.name);
+  for (const p of files) {
+    const name = p.split(/[\\/]/).pop();
+    await zipFile(p, name);
+  }
   t.remove();
+  clearSelection();
 };
 document.getElementById('ctx-extract').onclick = async () => {
   if (!ctxTarget) return;
@@ -2995,10 +3069,29 @@ document.getElementById('ctx-folder-size').onclick = async () => {
 };
 document.getElementById('ctx-rename').onclick = () => ctxTarget && startRename(ctxTarget.path, ctxTarget.name);
 document.getElementById('ctx-copy-path').onclick = () => { if (!ctxTarget) return; navigator.clipboard.writeText(ctxTarget.path).then(() => toast('Path copied')).catch(() => toast('Copy failed', 'error')); };
-document.getElementById('ctx-delete').onclick = () => ctxTarget && deleteFile(ctxTarget);
+document.getElementById('ctx-delete').onclick = () => {
+  if (selectedFiles.length > 0) { deleteSelected(); return; }
+  if (ctxTarget) deleteFile(ctxTarget);
+};
 document.getElementById('ctx-open-term').onclick = () => { if (!ctxTarget) return; newTab(`Term @ ${ctxTarget.name}`, null, ctxTarget.path); };
-document.getElementById('ctx-copy').onclick = () => { if (!ctxTarget) return; fsClipboard = { action: 'copy', path: ctxTarget.path, name: ctxTarget.name }; updatePasteUI(); toast('Copied: ' + ctxTarget.name, 'success'); };
-document.getElementById('ctx-cut').onclick = () => { if (!ctxTarget) return; fsClipboard = { action: 'cut', path: ctxTarget.path, name: ctxTarget.name }; updatePasteUI(); toast('Cut: ' + ctxTarget.name, 'success'); };
+document.getElementById('ctx-copy').onclick = () => {
+  const files = selectedFiles.length > 0
+    ? selectedFiles.map(p => ({ path: p, name: p.split(/[\\/]/).pop() }))
+    : (ctxTarget ? [{ path: ctxTarget.path, name: ctxTarget.name }] : []);
+  if (!files.length) return;
+  fsClipboard = { action: 'copy', files };
+  updatePasteUI();
+  toast(`Copied ${files.length} item(s)`, 'success');
+};
+document.getElementById('ctx-cut').onclick = () => {
+  const files = selectedFiles.length > 0
+    ? selectedFiles.map(p => ({ path: p, name: p.split(/[\\/]/).pop() }))
+    : (ctxTarget ? [{ path: ctxTarget.path, name: ctxTarget.name }] : []);
+  if (!files.length) return;
+  fsClipboard = { action: 'cut', files };
+  updatePasteUI();
+  toast(`Cut ${files.length} item(s)`, 'success');
+};
 document.getElementById('ctx-paste').onclick = () => { if (fsClipboard) pasteFile(currentPath); };
 
 function updatePasteUI() {
@@ -3013,38 +3106,44 @@ let _pasteBusy = false;
 async function pasteFile(destDir, conflictMode) {
   if (!fsClipboard || _pasteBusy) return;
   _pasteBusy = true;
-  const label = fsClipboard.action === 'copy' ? 'Copying' : 'Moving';
-  const toastEl = toast(label + '…', 'info');
-  const dest = joinPath(destDir, fsClipboard.name);
-  const ep = fsClipboard.action === 'copy' ? '/api/files/copy' : '/api/files/move';
-  const body = { source: fsClipboard.path, destination: dest };
-  if (conflictMode) body.conflict = conflictMode;
-  const r = await api(ep, {
-    method: 'POST',
-    headers: { 'Content-Type': 'application/json' },
-    body: JSON.stringify(body)
-  });
-  if (r.conflict) {
-    toastEl.remove();
-    _conflictResolve = { destDir, conflictMode: null };
-    document.getElementById('conflict-name').textContent = r.name;
-    document.getElementById('conflict-dir-hint').style.display = r.isDir ? '' : 'none';
-    document.getElementById('conflict-merge').style.display = r.isDir ? '' : 'none';
-    openOverlay('conflict-overlay');
-    return;
-  }
-  if (r.success) {
+  try {
+    // Support both old single-file and new multi-file format
+    const files = fsClipboard.files || [{ path: fsClipboard.path, name: fsClipboard.name }];
+    const label = fsClipboard.action === 'copy' ? 'Copying' : 'Moving';
+    const toastEl = toast(label + '…', 'info');
+    const ep = fsClipboard.action === 'copy' ? '/api/files/copy' : '/api/files/move';
+    let succeeded = 0, failed = 0;
+    for (const file of files) {
+      const dest = joinPath(destDir, file.name);
+      const body = { source: file.path, destination: dest };
+      if (conflictMode) body.conflict = conflictMode;
+      const r = await api(ep, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify(body)
+      });
+      if (r.conflict) {
+        toastEl.remove();
+        _conflictResolve = { destDir, conflictMode: null };
+        document.getElementById('conflict-name').textContent = r.name;
+        document.getElementById('conflict-dir-hint').style.display = r.isDir ? '' : 'none';
+        document.getElementById('conflict-merge').style.display = r.isDir ? '' : 'none';
+        openOverlay('conflict-overlay');
+        return;
+      }
+      if (r.success) succeeded++;
+      else failed++;
+    }
     toastEl.remove();
-    const label = fsClipboard.action === 'copy' ? 'Pasted' : 'Moved';
-    if (r.skipped) toast(label + ' (skipped existing)', 'info');
-    else toast(label, 'success');
+    const opLabel = fsClipboard.action === 'copy' ? 'Pasted' : 'Moved';
+    if (failed === 0) toast(opLabel + ` (${succeeded} item(s))`, 'success');
+    else if (succeeded === 0) toast(opLabel + ' failed', 'error');
+    else toast(`${opLabel} ${succeeded}, ${failed} failed`, 'warning');
     if (fsClipboard.action === 'cut') { fsClipboard = null; updatePasteUI(); }
     refreshFiles();
-  } else {
-    toastEl.remove();
-    toast(r.error || 'Operation failed', 'error');
+  } finally {
+    _pasteBusy = false;
   }
-  _pasteBusy = false;
 }
 
 function resolveConflict(mode) {
@@ -3102,18 +3201,24 @@ async function deleteFile(file) {
   else toast(r.error, 'error');
 }
 
-async function downloadFile(path) {
+async function downloadFile(filePath) {
   try {
-    const r = await fetch(`/api/files/download?path=${encodeURIComponent(path)}`, {
+    const r = await fetch(`/api/files/download?path=${encodeURIComponent(filePath)}`, {
       headers: { 'x-pin-token': authToken }
     });
     if (!r.ok) { toast('Download failed', 'error'); return; }
+    const ct = r.headers.get('content-type') || '';
     const blob = await r.blob();
     const url = URL.createObjectURL(blob);
     const a = document.createElement('a');
     a.href = url;
-    a.download = path.split(/[\\/]/).pop() || 'download';
+    let name = filePath.split(/[\\/]/).pop() || 'download';
+    // Server returns application/zip for directories — append .zip if missing
+    if (ct.includes('zip') && !name.endsWith('.zip')) name += '.zip';
+    a.download = name;
+    document.body.appendChild(a);
     a.click();
+    a.remove();
     URL.revokeObjectURL(url);
   } catch(e) { console.warn('Download failed:', e); toast('Download failed', 'error'); }
 }
@@ -3219,10 +3324,14 @@ async function deleteSelected() {
 }
 
 async function downloadSelected() {
-  for (const p of [...selectedFiles]) {
-    await downloadFile(p);
+  const files = [...selectedFiles];
+  if (!files.length) return;
+  toast(`Downloading ${files.length} item(s)…`, 'info');
+  for (let i = 0; i < files.length; i++) {
+    await downloadFile(files[i]);
+    // Small delay between downloads to avoid browser popup blocking
+    if (i < files.length - 1) await new Promise(r => setTimeout(r, 300));
   }
-  toast('Downloads started', 'success');
   clearSelection();
 }
 
@@ -3486,7 +3595,7 @@ async function openFileEditor(path) {
     const splitArea = document.getElementById('editor-split-area');
     const orientToggle = document.getElementById('editor-split-toggle');
     try {
-      const orient = localStorage.getItem('wt-editor-split-orientation');
+      const orient = safeStorage.getItem('wt-editor-split-orientation');
       const isHoriz = orient === 'horizontal';
       if (splitArea) splitArea.classList.toggle('horizontal', isHoriz);
       if (orientToggle) {
@@ -3510,7 +3619,7 @@ async function openFileEditor(path) {
     try {
       const isHoriz = splitArea && splitArea.classList.contains('horizontal');
       const key = isHoriz ? 'wt-editor-width' : 'wt-editor-height';
-      const saved = localStorage.getItem(key);
+      const saved = safeStorage.getItem(key);
       if (saved) {
         document.documentElement.style.setProperty('--editor-size', saved + 'px');
       }
@@ -3843,7 +3952,7 @@ function searchKeydown(e) {
 // ═══════════════════════════════════════════════════════
 function loadSettings() {
   try {
-    const s = JSON.parse(localStorage.getItem('wt-settings'));
+    const s = JSON.parse(safeStorage.getItem('wt-settings'));
     if (s && typeof s === 'object' && !Array.isArray(s)) {
       if (typeof s.theme === 'string' && ['system','tokyonight','light','solarized','gruvbox','dracula','monokai'].includes(s.theme)) settings.theme = s.theme;
       if (typeof s.fontSize === 'number' && s.fontSize >= 8 && s.fontSize <= 32) settings.fontSize = s.fontSize;
@@ -3863,7 +3972,7 @@ function loadSettings() {
   document.getElementById('s-scrollback').value = settings.scrollback;
   document.getElementById('s-font').value = settings.font;
   document.getElementById('s-cursor').value = settings.cursor;
-  syncToggle('blink'); syncToggle('bell'); syncToggle('mobilekeys'); syncToggle('confirmclose'); syncToggle('datasaver');
+  syncToggle('blink'); syncToggle('bell'); syncToggle('mobilekeys'); syncToggle('confirmclose'); syncToggle('datasaver'); syncToggle('termRightClick');
   syncKeepAwakeUI();
   if (settings.keepAwake && hasWakeLock) { requestWakeLock(); }
   if (isElectron) {
@@ -3875,7 +3984,7 @@ function loadSettings() {
   }
 }
 
-function saveSettings() { localStorage.setItem('wt-settings', JSON.stringify(settings)); }
+function saveSettings() { safeStorage.setItem('wt-settings', JSON.stringify(settings)); }
 
 function saveSetting(k, v) { settings[k] = v; saveSettings(); }
 
@@ -4175,7 +4284,7 @@ function setupSidebarResize() {
     document.removeEventListener('mouseup', stopResize);
     document.removeEventListener('touchmove', doResize);
     document.removeEventListener('touchend', stopResize);
-    try { localStorage.setItem('wt-sidebar-width', String(sidebar.offsetWidth)); } catch(e) { console.warn(e); }
+    try { safeStorage.setItem('wt-sidebar-width', String(sidebar.offsetWidth)); } catch(e) { console.warn(e); }
   }
   handle.addEventListener('mousedown', startResize);
   handle.addEventListener('touchstart', startResize, { passive: false });
@@ -4184,7 +4293,7 @@ function setupSidebarResize() {
 function restoreSidebarWidth() {
   if (window.innerWidth <= 768) return;
   try {
-    const savedW = localStorage.getItem('wt-sidebar-width');
+    const savedW = safeStorage.getItem('wt-sidebar-width');
     if (savedW) {
       const w = Math.max(150, Math.min(600, parseInt(savedW)));
       if (w) {
@@ -4262,7 +4371,7 @@ function setupEditorResize() {
       const v = document.documentElement.style.getPropertyValue('--editor-size');
       if (v) {
         const key = isHorizontal() ? 'wt-editor-width' : 'wt-editor-height';
-        localStorage.setItem(key, v.replace('px', ''));
+        safeStorage.setItem(key, v.replace('px', ''));
       }
     } catch(e) { console.warn(e); }
   }
@@ -4301,7 +4410,7 @@ function toggleEditorSplit() {
   // Restore saved size for this orientation
   try {
     const key = isHoriz ? 'wt-editor-width' : 'wt-editor-height';
-    const saved = localStorage.getItem(key);
+    const saved = safeStorage.getItem(key);
     if (saved) {
       document.documentElement.style.setProperty('--editor-size', saved + 'px');
     }
@@ -4313,7 +4422,7 @@ function toggleEditorSplit() {
   });
 
   // Persist orientation
-  try { localStorage.setItem('wt-editor-split-orientation', isHoriz ? 'horizontal' : 'vertical'); } catch(e) { console.warn(e); }
+  try { safeStorage.setItem('wt-editor-split-orientation', isHoriz ? 'horizontal' : 'vertical'); } catch(e) { console.warn(e); }
 }
 
 // ═══════════════════════════════════════════════════════
@@ -4589,6 +4698,8 @@ function pasteToTerminal() {
 function fallbackPaste(callback) {
   if (!_pasteInput) {
     _pasteInput = document.createElement('textarea');
+    _pasteInput.id = 'fallback-paste-area';
+    _pasteInput.name = 'paste-input';
     _pasteInput.style.cssText = 'position:fixed;left:0;top:0;width:1px;height:1px;opacity:0;z-index:-1';
     document.body.appendChild(_pasteInput);
     _pasteInput.addEventListener('paste', () => {
@@ -4822,7 +4933,7 @@ function closeOverlay(id) {
   overlay.classList.remove('open');
   removeFocusTrap();
   if (lastFocusedElement) {
-    setTimeout(() => lastFocusedElement.focus(), 50);
+    setTimeout(() => lastFocusedElement?.focus(), 50);
     lastFocusedElement = null;
   }
 }
@@ -5002,9 +5113,9 @@ function showPinScreen() {
 // BOOKMARKS
 // ═══════════════════════════════════════════════════════
 function getBookmarks() {
-  try { return JSON.parse(localStorage.getItem('wt-bookmarks')) || []; } catch(e) { console.warn('Failed to parse bookmarks:', e); return []; }
+  try { return JSON.parse(safeStorage.getItem('wt-bookmarks')) || []; } catch(e) { console.warn('Failed to parse bookmarks:', e); return []; }
 }
-function saveBookmarks(bm) { localStorage.setItem('wt-bookmarks', JSON.stringify(bm)); renderBookmarks(); }
+function saveBookmarks(bm) { safeStorage.setItem('wt-bookmarks', JSON.stringify(bm)); renderBookmarks(); }
 
 function renderBookmarks() {
   const list = document.getElementById('bookmarks-list');
@@ -5053,11 +5164,11 @@ function bookmarkCurrentDir() {
   toast('Bookmarked', 'success');
 }
 
-let bookmarksOpen = (() => { try { const v = localStorage.getItem('wt-bm-open'); return v !== null ? v === 'true' : true; } catch(e) { console.warn('Failed to read bookmarksOpen:', e); return true; } })();
+let bookmarksOpen = (() => { try { const v = safeStorage.getItem('wt-bm-open'); return v !== null ? v === 'true' : true; } catch(e) { console.warn('Failed to read bookmarksOpen:', e); return true; } })();
 function toggleBookmarks() {
   bookmarksOpen = !bookmarksOpen;
   document.getElementById('bookmarks-list').classList.toggle('open', bookmarksOpen);
-  try { localStorage.setItem('wt-bm-open', bookmarksOpen); } catch(e) { console.warn(e); }
+  try { safeStorage.setItem('wt-bm-open', bookmarksOpen); } catch(e) { console.warn(e); }
 }
 
 // ═══════════════════════════════════════════════════════
@@ -5130,10 +5241,10 @@ function finderKeydown(e) {
 const DEFAULT_CMDS = window.DEFAULT_CMDS || [];
 
 function getCmdLib() {
-  try { return JSON.parse(localStorage.getItem('wt-cmdlib')) || []; } catch(e) { return []; }
+  try { return JSON.parse(safeStorage.getItem('wt-cmdlib')) || []; } catch(e) { return []; }
 }
 function saveCmdLib(cmds) {
-  localStorage.setItem('wt-cmdlib', JSON.stringify(cmds));
+  safeStorage.setItem('wt-cmdlib', JSON.stringify(cmds));
 }
 
 function toggleCmdLib() {
@@ -5293,10 +5404,10 @@ let cmdHistMax = 50;
 let _cmdHistCache = [];
 
 function histHeaders() {
-  return { 'Content-Type': 'application/json', 'x-pin-token': localStorage.getItem('wt-pin') || '' };
+  return { 'Content-Type': 'application/json', 'x-pin-token': authToken || '' };
 }
 function histHeadersDelete() {
-  return { 'x-pin-token': localStorage.getItem('wt-pin') || '' };
+  return { 'x-pin-token': authToken || '' };
 }
 async function getCmdHist() {
   try {
@@ -5316,10 +5427,15 @@ function loadHistMax() {
 }
 async function addToCmdHist(cmd) {
   if (!cmd || !cmd.trim()) return;
-  // Strip ANSI escapes and control characters, keep only printable + space + tab
-  const clean = cmd.replace(/\x1b\[[0-9;]*[a-zA-Z~]/g, '')
-    .replace(/\x1b\][^\x07\x1b]*(?:\x07|\x1b\\)/g, '')
-    .replace(/[\x00-\x08\x0e-\x1f]/g, '')
+  // Strip all ANSI/VT escape sequences and control characters
+  const clean = cmd
+    .replace(/\x1b[^a-zA-Z0-9]*[a-zA-Z0-9~]/g, '')       // CSI: ESC [ ... final
+    .replace(/\x1b\][^\x07\x1b]*(?:\x07|\x1b\\)/g, '')    // OSC: ESC ] ... BEL/ST
+    .replace(/\x1b[OPP][^\x40-\x7e]*[\x40-\x7e]/g, '')    // SS3/DCS: ESC O/P ... final
+    .replace(/\x1b./g, '')                                   // Any other ESC sequence
+    .replace(/[\x00-\x1f\x7f]/g, '')                        // All remaining control chars
+    .replace(/^[>;\d\s]+(?=[a-zA-Z/\\~\-.])/, '')          // VT params before a real command char
+    .replace(/^[>;\d\s]+$/, '')                              // Pure VT params, no command at all
     .trim();
   if (!clean) return;
   try {
@@ -5494,6 +5610,31 @@ async function refreshSystemStats(showLoading) {
   document.getElementById('sys-uptime-val').textContent = fmtUptime(data.uptime);
   document.getElementById('sys-uptime-sub').textContent = data.hostname + ' · ' + data.platform;
 
+  const gpuContainer = document.getElementById('sys-gpu-container');
+  gpuContainer.innerHTML = '';
+  const gpuList = data.gpus || (data.gpu ? [data.gpu] : []);
+  if (gpuList.length) {
+    gpuList.forEach((g, i) => {
+      const card = document.createElement('div');
+      card.className = 'sys-card';
+      const label = gpuList.length > 1 ? `GPU ${i + 1}` : 'GPU';
+      let sub = '';
+      if (g.memTotal > 0) sub += formatSize(g.memTotal * 1024 * 1024) + ' VRAM';
+      else if (g.memTotal === 0 && g.driver !== 'lspci') sub += 'Shared memory';
+      if (g.utilization != null) sub += (sub ? ' · ' : '') + g.utilization + '% util';
+      if (g.temp) sub += (sub ? ' · ' : '') + g.temp + '°C';
+      if (g.driver && g.driver !== 'nvidia' && g.driver !== 'macos' && g.driver !== 'lspci') sub += (sub ? ' · ' : '') + 'Driver: ' + g.driver;
+      let barHtml = '';
+      if (g.memTotal > 0 && g.memUsed) {
+        const pct = Math.round((g.memUsed / g.memTotal) * 100);
+        const cls = pct > 80 ? ' danger' : pct > 50 ? ' warn' : '';
+        barHtml = `<div class="sys-bar"><div class="sys-bar-fill${cls}" style="width:${Math.min(pct, 100)}%"></div></div>`;
+      }
+      card.innerHTML = `<h3>${label}</h3><div class="sys-val">${g.name}</div><div class="sys-sub">${sub || 'No details available'}</div>${barHtml}`;
+      gpuContainer.appendChild(card);
+    });
+  }
+
   const tbody = document.getElementById('sys-proc-body');
   tbody.innerHTML = '';
   if (data.processes) {
@@ -5512,7 +5653,7 @@ async function refreshSystemStats(showLoading) {
 // ═══════════════════════════════════════════════════════
 let deferredPrompt = null;
 let installBannerDismissed = false;
-try { installBannerDismissed = localStorage.getItem('wt-install-dismissed') === 'true'; } catch(e) { console.warn(e); }
+try { installBannerDismissed = safeStorage.getItem('wt-install-dismissed') === 'true'; } catch(e) { console.warn(e); }
 
 window.addEventListener('beforeinstallprompt', e => {
   e.preventDefault();
@@ -5551,7 +5692,7 @@ function installPWA() {
 function dismissInstall() {
   document.getElementById('install-banner').style.display = 'none';
   document.getElementById('toast-container').classList.remove('banner-visible');
-  try { localStorage.setItem('wt-install-dismissed', 'true'); } catch(e) { console.warn(e); }
+  try { safeStorage.setItem('wt-install-dismissed', 'true'); } catch(e) { console.warn(e); }
   installBannerDismissed = true;
 }
 

package/server.js

@@ -48,7 +48,7 @@ const path = require('path');
 const os = require('os');
 const crypto = require('crypto');
 const { execSync, execFileSync, spawn } = require('child_process');
-const archiver = require('archiver');
+const { ZipArchive } = require('archiver');
 const yauzl = require('yauzl');
 const https = require('https');
 const http = require('http');
@@ -251,7 +251,7 @@ async function dirSize(dir) {
 function createZipArchive(entries, zipPath) {
   return new Promise((resolve, reject) => {
     const output = fs.createWriteStream(zipPath);
-    const archive = archiver('zip', { zlib: { level: 6 } });
+    const archive = new ZipArchive({ zlib: { level: 6 } });
     output.on('close', () => resolve());
     output.on('error', reject);
     archive.on('error', reject);
@@ -270,7 +270,7 @@ function createZipArchive(entries, zipPath) {
 }
 
 function streamZipDirectory(dirPath, res) {
-  const archive = archiver('zip', { zlib: { level: 6 } });
+  const archive = new ZipArchive({ zlib: { level: 6 } });
   archive.on('error', err => {
     if (!res.headersSent) res.status(500).json({ error: err.message });
     else res.end();
@@ -1605,12 +1605,69 @@ app.get('/api/system', checkPin, async (req, res) => {
     }
   } catch {}
 
+  let gpus = [];
+  try {
+    if (os.platform() === 'linux') {
+      // Try nvidia-smi first (NVIDIA GPUs — supports multi-GPU)
+      try {
+        const nvOut = await spawnRead('nvidia-smi', ['--query-gpu=name,memory.total,memory.used,memory.free,utilization.gpu,temperature.gpu', '--format=csv,noheader,nounits']);
+        if (nvOut && nvOut.trim()) {
+          for (const line of nvOut.trim().split('\n')) {
+            const parts = line.split(',').map(s => s.trim());
+            if (parts.length >= 6 && parts[0]) {
+              gpus.push({ name: parts[0], memTotal: +parts[1] || 0, memUsed: +parts[2] || 0, memFree: +parts[3] || 0, utilization: +parts[4] || 0, temp: +parts[5] || 0, driver: 'nvidia' });
+            }
+          }
+        }
+      } catch {}
+      // Fallback: lspci for any GPU (Intel, AMD, etc.)
+      if (!gpus.length) {
+        try {
+          const lspciOut = await spawnRead('lspci', []);
+          if (lspciOut && lspciOut.trim()) {
+            const lines = lspciOut.split('\n').filter(l => /VGA|3D|Display/i.test(l));
+            for (const line of lines) {
+              const name = line.replace(/^[\da-f]+:[\da-f]+\.[\da-f]+\s+/, '').trim();
+              if (name) gpus.push({ name, driver: 'lspci' });
+            }
+          }
+        } catch {}
+      }
+    } else if (os.platform() === 'darwin') {
+      const spOut = await spawnRead('system_profiler', ['SPDisplaysDataType']);
+      if (spOut) {
+        // Split by chipset sections to handle multiple GPUs
+        const sections = spOut.split(/(?=Chipset Model:)/);
+        for (const section of sections) {
+          const chipMatch = section.match(/Chipset Model:\s*(.+)/);
+          const vramMatch = section.match(/VRAM.*?:\s*(\d+)\s*MB/);
+          if (chipMatch) {
+            gpus.push({ name: chipMatch[1].trim(), memTotal: vramMatch ? +vramMatch[1] : 0, driver: 'macos' });
+          }
+        }
+      }
+    } else if (os.platform() === 'win32') {
+      const psGpu = await spawnRead('powershell.exe', ['-Command', "Get-CimInstance -ClassName Win32_VideoController | Select-Object Name,AdapterRAM,DriverVersion | ConvertTo-Json"]);
+      if (psGpu) {
+        const data = JSON.parse(psGpu);
+        const list = Array.isArray(data) ? data : [data];
+        for (const d of list) {
+          if (d && d.Name) {
+            const vramBytes = d.AdapterRAM || 0;
+            gpus.push({ name: d.Name, memTotal: Math.round(vramBytes / (1024 * 1024)), driver: d.DriverVersion || '' });
+          }
+        }
+      }
+    }
+  } catch {}
+
   res.json({
     hostname: os.hostname(),
     platform: os.platform(),
     uptime: os.uptime(),
     cpu: { model: cpuModel, count: cpuCount, usage: cpuUsage, loadAvg },
     memory: { total: totalMem, free: freeMem, used: usedMem, percent: memPercent },
+    gpus,
     disk,
     processes
   });