Initial Release: WebPass V2 with Steganography, Crypto Vault, and Cloud Toggle

.gitignore

@@ -0,0 +1,7 @@
+venv/
+__pycache__/
+*.pyc
+instance/
+*.db
+.env
+uploads/

Dockerfile

@@ -0,0 +1,20 @@
+# Use lightweight Python 3.12 image
+FROM python:3.12-slim
+
+WORKDIR /app
+
+# Install Nmap just so the Python library imports don't crash the server
+RUN apt-get update && apt-get install -y nmap && rm -rf /var/lib/apt/lists/*
+
+# Copy requirements and install
+COPY requirements.txt .
+RUN pip install --no-cache-dir -r requirements.txt
+
+# Copy all your code
+COPY . .
+
+# Hugging Face exposes port 7860
+EXPOSE 7860
+
+# Run the app with Gunicorn
+CMD ["gunicorn", "-b", "0.0.0.0:7860", "wsgi:app"]

test.py

@@ -0,0 +1,25 @@
+from sqlalchemy import text
+from webpass import create_app, db
+
+app = create_app()
+
+with app.app_context():
+    print("[-] Disabling Foreign Key Checks...")
+    # This tells MySQL: "Don't complain about connections between tables, just delete them."
+    db.session.execute(text("SET FOREIGN_KEY_CHECKS = 0"))
+    
+    print("[-] Manually dropping ghost 'credential' table...")
+    # Explicitly delete the table that is causing the error
+    db.session.execute(text("DROP TABLE IF EXISTS credential"))
+    
+    print("[-] Dropping all remaining tables...")
+    db.drop_all()
+    
+    print("[-] Creating new schema (User, BiometricDevice, DeadDrop)...")
+    db.create_all()
+    
+    print("[-] Re-enabling Foreign Key Checks...")
+    db.session.execute(text("SET FOREIGN_KEY_CHECKS = 1"))
+    db.session.commit()
+    
+    print("[+] Database reset successful!")

webpass/__init__.py

@@ -0,0 +1,125 @@
+import os
+from flask import Flask, session, redirect, url_for, request
+from flask_sqlalchemy import SQLAlchemy
+from flask_login import LoginManager, user_logged_in, current_user
+from flask_dance.contrib.google import make_google_blueprint
+from flask_socketio import SocketIO
+from flask_wtf.csrf import CSRFProtect
+from flask_mail import Mail
+from flask_migrate import Migrate
+from flask_limiter import Limiter
+from flask_limiter.util import get_remote_address
+from flask_cors import CORS
+
+# Import the Config CLASS
+from .config import Config 
+
+# Initialize Extensions
+db = SQLAlchemy()
+socketio = SocketIO()
+csrf = CSRFProtect()
+login_manager = LoginManager()
+mail = Mail()
+migrate = Migrate()
+limiter = Limiter(key_func=get_remote_address, default_limits=["200 per day", "50 per hour"])
+
+def create_app():
+    app = Flask(__name__)
+    
+    # LOAD CONFIGURATION
+    app.config.from_object(Config)
+
+    # --- ENVIRONMENT DETECTION (Cloud vs Local) ---
+    IS_CLOUD = os.environ.get('SPACE_ID') is not None
+    if IS_CLOUD:
+        # Override with SQLite for Hugging Face to prevent MySQL crashes
+        app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///cloud_demo.db'
+        print("[-] Running in CLOUD MODE (Hugging Face) - Using SQLite")
+    else:
+        print("[-] Running in LOCAL MODE - Using Configured Database (MySQL)")
+
+    # Initialize Plugins
+    db.init_app(app)
+    socketio.init_app(app, async_mode='threading', cors_allowed_origins="*")
+    csrf.init_app(app)
+    login_manager.init_app(app)
+    mail.init_app(app)
+    migrate.init_app(app, db)
+    
+    CORS(app, resources={r"/*": {"origins": "*"}}, supports_credentials=True)
+    
+    login_manager.login_view = 'auth.login' 
+
+    from webpass.models import User
+    @login_manager.user_loader
+    def load_user(user_id):
+        return User.query.get(int(user_id))
+
+    # 1. SECURITY: RESET BIO
+    @user_logged_in.connect_via(app)
+    def on_user_logged_in(sender, user, **extra):
+        session['bio_verified'] = False
+        session.permanent = True
+
+    # 2. REGISTER BLUEPRINTS
+    from webpass.routes.auth import auth_bp
+    from webpass.routes.dashboard import dashboard_bp
+    from webpass.routes.bio_auth import bio_bp
+    from webpass.routes.api import api_bp
+    from webpass.routes.otp import otp_bp
+    from webpass.routes.share import share_bp
+    from webpass.routes.stego import stego_bp
+    from webpass.routes.tools import tools_bp 
+
+    app.register_blueprint(auth_bp)
+    app.register_blueprint(dashboard_bp, url_prefix='/dashboard')
+    app.register_blueprint(bio_bp)
+    app.register_blueprint(api_bp, url_prefix='/api')
+    app.register_blueprint(otp_bp)
+    app.register_blueprint(share_bp)
+    app.register_blueprint(stego_bp)
+    app.register_blueprint(tools_bp)
+    
+    # 3. GOOGLE OAUTH
+    google_bp = make_google_blueprint(
+        client_id     = app.config["GOOGLE_OAUTH_CLIENT_ID"],
+        client_secret = app.config["GOOGLE_OAUTH_CLIENT_SECRET"],
+        scope = ["openid", "https://www.googleapis.com/auth/userinfo.email", "https://www.googleapis.com/auth/userinfo.profile"],
+        redirect_to = "auth.authorize"
+    )
+    google_bp.authorization_url_params["prompt"] = "select_account"
+    app.register_blueprint(google_bp, url_prefix='/login')
+
+    # 4. GLOBAL GATEKEEPER
+    @app.before_request
+    def require_biometric_auth():
+        session.permanent = True
+        allowed_endpoints = [
+            'google.login', 'google.authorized', 'auth.login', 'auth.authorize', 'auth.logout', 
+            'static', 'bio.lock_screen', 'bio.mobile_authenticate', 'bio.finalize_login', 
+            'bio.register_begin', 'bio.register_complete', 'bio.auth_begin', 'bio.auth_complete',
+            'share.view_drop_page', 'share.reveal_drop_api', 'share.create_share', 'share.share_ui'
+        ]
+        if request.endpoint and request.endpoint not in allowed_endpoints:
+            if current_user.is_authenticated:
+                if not session.get('bio_verified'):
+                    return redirect(url_for('bio.lock_screen'))
+
+    # 5. SECURITY HEADERS
+    @app.after_request
+    def add_security_headers(response):
+        response.headers['Strict-Transport-Security'] = 'max-age=31536000; includeSubDomains'
+        response.headers['X-Frame-Options'] = 'SAMEORIGIN'
+        return response
+
+    from webpass.models import BiometricDevice
+    @app.context_processor
+    def inject_credential_status():
+        if current_user.is_authenticated:
+            try:
+                device = BiometricDevice.query.filter_by(user_id=current_user.id).first()
+                return dict(has_credentials=bool(device))
+            except: pass
+        return dict(has_credentials=False)
+
+    return app

webpass/config.py

@@ -0,0 +1,40 @@
+import os
+from datetime import timedelta
+from dotenv import load_dotenv
+
+# Load variables from .env file if it exists (for local testing)
+load_dotenv()
+
+class Config:
+    # 1. BASIC CONFIG
+    SECRET_KEY = os.environ.get("FLASK_SECRET", "fallback-dev-key-123")
+    # Will use SQLite in cloud via __init__.py, but defaults to local MySQL here
+    SQLALCHEMY_DATABASE_URI = os.environ.get("DATABASE_URL", "sqlite:///fallback.db")
+    SQLALCHEMY_TRACK_MODIFICATIONS = False
+
+    # 2. EMAIL CONFIG
+    MAIL_SERVER         = "smtp.gmail.com"
+    MAIL_PORT           = 587
+    MAIL_USE_TLS        = True
+    MAIL_USERNAME       = os.environ.get("MAIL_USERNAME")
+    MAIL_PASSWORD       = os.environ.get("MAIL_PASSWORD")
+    MAIL_DEFAULT_SENDER = os.environ.get("MAIL_USERNAME")
+
+    # 3. GOOGLE OAUTH CONFIG
+    OAUTHLIB_INSECURE_TRANSPORT = True 
+    GOOGLE_OAUTH_CLIENT_ID     = os.environ.get("GOOGLE_OAUTH_CLIENT_ID")
+    GOOGLE_OAUTH_CLIENT_SECRET = os.environ.get("GOOGLE_OAUTH_CLIENT_SECRET")
+
+    # 4. COOKIE & SESSION SECURITY
+    SESSION_COOKIE_SECURE   = False
+    SESSION_COOKIE_HTTPONLY = True
+    SESSION_COOKIE_SAMESITE = 'Lax'
+    PERMANENT_SESSION_LIFETIME = timedelta(minutes=5)
+    SESSION_REFRESH_EACH_REQUEST = True
+    REMEMBER_COOKIE_DURATION = timedelta(minutes=5)
+    REMEMBER_COOKIE_SECURE = False
+    REMEMBER_COOKIE_HTTPONLY = True
+
+    # 5. UNIVERSAL ACCESS (NGROK)
+    NGROK_URL = os.environ.get("NGROK_URL")
+    OVERWRITE_REDIRECT_URI  = os.environ.get("OVERWRITE_REDIRECT_URI")

webpass/crypto_utils.py

@@ -0,0 +1,209 @@
+from cryptography.hazmat.primitives import hashes, padding
+import os
+import json
+import base64
+from cryptography.hazmat.primitives.ciphers import Cipher, algorithms, modes
+from cryptography.hazmat.primitives.kdf.pbkdf2 import PBKDF2HMAC
+from cryptography.hazmat.primitives import hashes, padding
+
+# --- Helper: Generate AES Key ---
+def generate_key(password: str, salt: bytes) -> bytes:
+    kdf = PBKDF2HMAC(
+        algorithm=hashes.SHA256(),
+        length=32,
+        salt=salt,
+        iterations=100000,
+    )
+    return kdf.derive(password.encode())
+
+# --- Encrypt password with key ---
+def encrypt_password(password: str, key: bytes):
+    iv = os.urandom(16)
+    cipher = Cipher(algorithms.AES(key), modes.CBC(iv))
+    encryptor = cipher.encryptor()
+    padder = padding.PKCS7(128).padder()
+    padded = padder.update(password.encode()) + padder.finalize()
+    encrypted = encryptor.update(padded) + encryptor.finalize()
+    return base64.b64encode(iv + encrypted).decode()
+
+# --- Decrypt password with key ---
+def decrypt_password(encrypted_password: str, key: bytes):
+    raw = base64.b64decode(encrypted_password)
+    iv, encrypted = raw[:16], raw[16:]
+    cipher = Cipher(algorithms.AES(key), modes.CBC(iv))
+    decryptor = cipher.decryptor()
+    padded = decryptor.update(encrypted) + decryptor.finalize()
+    unpadder = padding.PKCS7(128).unpadder()
+    return (unpadder.update(padded) + unpadder.finalize()).decode()
+
+# --- Store password ---
+def store_password(account: str, username: str, password: str, master_password: str):
+    salt = os.urandom(16)
+    key = generate_key(master_password, salt)
+    encrypted_pw = encrypt_password(password, key)
+    data = {"account": account, "username": username, "password": encrypted_pw, "salt": base64.b64encode(salt).decode()}
+    
+    try:
+        with open("passwords.json", "r") as f:
+            records = json.load(f)
+    except FileNotFoundError:
+        records = []
+
+    records = [r for r in records if r["account"] != account]
+    records.append(data)
+
+    with open("passwords.json", "w") as f:
+        json.dump(records, f, indent=4)
+    print(f"[+] Password stored for account: {account}")
+
+# --- Retrieve password ---
+def retrieve_password(account: str, master_password: str):
+    try:
+        with open("passwords.json", "r") as f:
+            records = json.load(f)
+    except FileNotFoundError:
+        print("[-] No stored passwords.")
+        return None
+
+    for r in records:
+        if r["account"] == account:
+            salt = base64.b64decode(r["salt"])
+            key = generate_key(master_password, salt)
+            try:
+                return decrypt_password(r["password"], key)
+            except:
+                print("[-] Master password incorrect.")
+                return None
+    print("[-] Account not found.")
+    return None
+
+# --- Encrypt file ---
+def encrypt_file(file_path: str, account: str, master_password: str):
+    password = retrieve_password(account, master_password)
+    if not password:
+        print("[-] Password retrieval failed.")
+        return
+
+    try:
+        with open(file_path, "rb") as f:
+            content = f.read()
+    except FileNotFoundError:
+        print("[-] File not found.")
+        return
+
+    salt = os.urandom(16)
+    iv = os.urandom(16)
+    key = generate_key(password, salt)
+
+    cipher = Cipher(algorithms.AES(key), modes.CBC(iv))
+    encryptor = cipher.encryptor()
+    padder = padding.PKCS7(128).padder()
+    padded = padder.update(content) + padder.finalize()
+    encrypted = encryptor.update(padded) + encryptor.finalize()
+
+    enc_file = file_path + ".enc"
+    with open(enc_file, "wb") as f:
+        f.write(encrypted)
+
+    meta = {
+        "salt": base64.b64encode(salt).decode(),
+        "iv": base64.b64encode(iv).decode(),
+        "account": account
+    }
+    with open(enc_file + ".meta", "w") as f:
+        json.dump(meta, f)
+
+    print(f"[+] File encrypted as: {enc_file}")
+
+# --- Decrypt file ---
+def decrypt_file(enc_file: str, master_password: str):
+    meta_file = enc_file + ".meta"
+    if not os.path.exists(meta_file):
+        print("[-] Metadata file not found.")
+        return
+
+    try:
+        with open(meta_file, "r") as f:
+            meta = json.load(f)
+    except Exception as e:
+        print("[-] Failed to read metadata:", e)
+        return
+
+    account = meta["account"]
+    salt = base64.b64decode(meta["salt"])
+    iv = base64.b64decode(meta["iv"])
+
+    password = retrieve_password(account, master_password)
+    if not password:
+        print("[-] Failed to retrieve password.")
+        return
+
+    key = generate_key(password, salt)
+
+    try:
+        with open(enc_file, "rb") as f:
+            encrypted = f.read()
+    except FileNotFoundError:
+        print("[-] Encrypted file not found.")
+        return
+
+    cipher = Cipher(algorithms.AES(key), modes.CBC(iv))
+    decryptor = cipher.decryptor()
+    padded = decryptor.update(encrypted) + decryptor.finalize()
+
+    unpadder = padding.PKCS7(128).unpadder()
+    try:
+        data = unpadder.update(padded) + unpadder.finalize()
+    except Exception as e:
+        print("[-] Decryption failed:", e)
+        return
+
+    dec_file = enc_file.replace(".enc", "_decrypted")
+    with open(dec_file, "wb") as f:
+        f.write(data)
+
+    print(f"[+] File decrypted to: {dec_file}")
+
+# --- Main Loop ---
+if __name__ == "__main__":
+    while True:
+        print("\nChoose Action:")
+        print("1. Store password")
+        print("2. Encrypt file")
+        print("3. Decrypt file")
+        print("4. Retrieve password")
+        print("Type 'exit' to quit.")
+
+        choice = input("\nEnter choice (1-4 or 'exit'): ").strip().lower()
+
+        if choice == "1":
+            acc = input("Account: ")
+            user = input("Username/Email: ")
+            pw = input("Password: ")
+            m_pw = input("Master Password: ")
+            store_password(acc, user, pw, m_pw)
+
+        elif choice == "2":
+            path = input("File path to encrypt: ")
+            acc = input("Account to use: ")
+            m_pw = input("Master Password: ")
+            encrypt_file(path, acc, m_pw)
+
+        elif choice == "3":
+            path = input("Encrypted file path: ")
+            m_pw = input("Master Password: ")
+            decrypt_file(path, m_pw)
+
+        elif choice == "4":
+            acc = input("Account: ")
+            m_pw = input("Master Password: ")
+            pw = retrieve_password(acc, m_pw)
+            if pw:
+                print(f"[+] Retrieved Password: {pw}")
+
+        elif choice == "exit":
+            print("Exiting program. Goodbye!")
+            break
+
+        else:
+            print("Invalid choice. Please enter 1, 2, 3, 4, or 'exit'.")

webpass/models.py

@@ -0,0 +1,38 @@
+# webpass/models.py
+from flask_login import UserMixin
+from . import db
+
+class User(UserMixin, db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    email = db.Column(db.String(150), unique=True)
+    password = db.Column(db.String(150))
+    first_name = db.Column(db.String(150))
+    google_id = db.Column(db.String(150))
+    
+    # --- THE FIX: Change these to db.Text ---
+    profile_image = db.Column(db.Text)      # <--- Was likely db.String(something)
+    orig_profile_image = db.Column(db.Text) # <--- Was likely db.String(something)
+    
+    # Relationship to biometric keys
+    biometric_devices = db.relationship("BiometricDevice", backref="user", lazy=True)
+
+class BiometricDevice(db.Model):
+    """
+    Stores the Public Key for WebAuthn/FIDO2 Authentication.
+    """
+    __tablename__ = "biometric_device"
+    id            = db.Column(db.Integer, primary_key=True)
+    user_id       = db.Column(db.Integer, db.ForeignKey("user.id"), nullable=False)
+    credential_id = db.Column(db.String(255), unique=True, nullable=False) # The ID of the key on the phone
+    public_key    = db.Column(db.LargeBinary, nullable=False)              # The actual public key
+    sign_count    = db.Column(db.Integer, default=0)                       # Replay protection
+
+class DeadDrop(db.Model):
+    __tablename__ = "dead_drop"
+    id = db.Column(db.String(36), primary_key=True)
+    ciphertext = db.Column(db.Text, nullable=False)
+    iv = db.Column(db.String(64), nullable=False)
+    salt = db.Column(db.String(64), nullable=False)
+    expires_at = db.Column(db.DateTime, nullable=False)
+    created_at = db.Column(db.DateTime)
+    view_time = db.Column(db.Integer, default=30) # NEW: Time in seconds

webpass/network_monitor.py

@@ -0,0 +1,57 @@
+# network_monitor.py
+import time
+from scapy.sendrecv import AsyncSniffer
+from scapy.all import IP, TCP, UDP, DNS
+
+def process_packet(pkt):
+    """Processes a Scapy packet into a simple dictionary."""
+    d = {"timestamp": pkt.time}
+    if pkt.haslayer(IP):
+        ip = pkt[IP]
+        d.update(src=ip.src, dst=ip.dst, ttl=ip.ttl, length=len(pkt))
+        if pkt.haslayer(TCP):
+            t = pkt[TCP]
+            d.update(
+                proto=6, src_port=t.sport, dst_port=t.dport, flags=str(t.flags),
+                info=f"TCP {ip.src}:{t.sport} → {ip.dst}:{t.dport}"
+            )
+        elif pkt.haslayer(UDP):
+            u = pkt[UDP]
+            d.update(proto=17, src_port=u.sport, dst_port=u.dport, flags="-")
+            if pkt.haslayer(DNS) and hasattr(pkt[DNS], 'qd') and pkt[DNS].qd is not None:
+                qname = pkt[DNS].qd.qname
+                # qname can be bytes, decode safely
+                qname_str = qname.decode(errors='ignore') if isinstance(qname, bytes) else str(qname)
+                d.update(proto="DNS", info=f"DNS Query for {qname_str}")
+            else:
+                d.update(info=f"UDP {ip.src}:{u.sport} → {ip.dst}:{u.dport}")
+        else:
+            d.setdefault("proto", ip.proto)
+    else:
+        d.update(src="N/A", dst="N/A", proto="Other", length=len(pkt))
+    return d
+
+def start_packet_capture(app, socketio, interface=None, filter_expr="ip"):
+    """
+    Sniffs packets in a background thread, adds them to the app's deque,
+    and emits every packet to connected clients.
+    """
+    def _handle(pkt):
+        try:
+            data = process_packet(pkt)
+        except Exception:
+            return  # Ignore packets that cause processing errors
+
+        # 1. Store the packet in the historical backlog
+        app.captured_packets.append(data)
+
+        # 2. Emit EVERY packet to the live feed (filter removed)
+        socketio.emit("new_packet", data)
+
+    sniffer = AsyncSniffer(
+        iface=interface,
+        filter=filter_expr,
+        prn=_handle,
+        store=False
+    )
+    sniffer.start()

webpass/routes/_decorators.py

@@ -0,0 +1,34 @@
+from functools import wraps
+from flask import session, redirect, url_for, request
+
+def otp_required(f):
+    """
+    Strict OTP Gatekeeper.
+    1. Checks if 'otp_verified' is True.
+    2. If True, consumes the flag and lets user pass.
+    3. If False, redirects to '/otp/send' to trigger the email.
+    """
+    @wraps(f)
+    def decorated(*args, **kwargs):
+        # Check if user has passed OTP verification
+        if session.get("otp_verified"):
+            # CONSUME THE FLAG (Strict Mode)
+            # This ensures they must verify again if they leave and come back
+            session.pop("otp_verified", None) 
+            return f(*args, **kwargs)
+        
+        # FIX: Redirect to 'otp.send_otp' first (to send email), not 'verify_otp'
+        next_url = request.path
+        return redirect(url_for("otp.send_otp", next=next_url))
+    return decorated
+
+def biometric_required(f):
+    """
+    Blocks access unless the user has passed the Biometric (QR/Fingerprint) check.
+    """
+    @wraps(f)
+    def decorated_function(*args, **kwargs):
+        if not session.get('bio_verified'):
+            return redirect(url_for('bio.lock_screen'))
+        return f(*args, **kwargs)
+    return decorated_function

webpass/routes/api.py

@@ -0,0 +1,56 @@
+import re
+import requests
+from flask import Blueprint, jsonify, current_app
+from flask_login import login_required
+
+# Note: We removed 'Credential' and 'db' imports because 
+# the old Master Password system is replaced by Biometrics.
+
+api_bp = Blueprint("api", __name__, url_prefix="/api")
+
+# ==========================================
+# 1. NETWORK MONITOR API
+# ==========================================
+@api_bp.route("/packets", methods=["GET"])
+@login_required
+def get_packets():
+    """
+    Returns the complete, unfiltered list of captured packets.
+    Used by the Network Monitor page (network.js).
+    """
+    # current_app.captured_packets is populated by wsgi.py
+    return jsonify(list(current_app.captured_packets))
+
+
+# ==========================================
+# 2. WATCHTOWER (HIBP) PROXY
+# ==========================================
+@api_bp.route("/watchtower/pwned-check/<prefix>", methods=["GET"])
+def check_pwned_proxy(prefix):
+    """
+    Proxies the HaveIBeenPwned request to protect user privacy (k-Anonymity).
+    Expects a 5-character SHA-1 hash prefix.
+    """
+    # Validate prefix (must be 5 hex chars)
+    if not re.fullmatch(r"[A-F0-9]{5}", prefix.upper()):
+        return jsonify({"error": "Invalid prefix format"}), 400
+
+    # Custom User-Agent is required by HIBP API
+    headers = {
+        "User-Agent": "WebPass-FinalYearProject"
+    }
+    url = f"https://api.pwnedpasswords.com/range/{prefix}"
+    
+    try:
+        # Short timeout to prevent server hanging
+        resp = requests.get(url, headers=headers, timeout=3)
+        
+        # If API is down or limits reached, fail open (return empty)
+        if resp.status_code != 200:
+            return jsonify([]), 200 
+        
+        # Return the raw text body (list of suffixes:count)
+        return resp.text, 200, {'Content-Type': 'text/plain'}
+    except Exception as e:
+        print(f"HIBP Error: {e}")
+        return jsonify([]), 200

webpass/routes/auth.py

@@ -0,0 +1,67 @@
+# webpass/routes/auth.py
+
+from flask import Blueprint, render_template, redirect, url_for, flash
+from flask_login import login_user, logout_user
+from flask_dance.contrib.google import google
+from oauthlib.oauth2.rfc6749.errors import TokenExpiredError
+
+from .. import db
+from ..models import User
+
+auth_bp = Blueprint("auth", __name__)
+
+@auth_bp.route("/")
+def index():
+    return redirect(url_for("auth.login"))
+
+@auth_bp.route("/login")
+def login():
+    return render_template("login.html")
+
+@auth_bp.route("/authorize")
+def authorize():
+    # Kick off OAuth if we have no token
+    if not google.authorized:
+        return redirect(url_for("google.login"))
+
+    # Try fetching the Google profile, handle expired tokens
+    try:
+        resp = google.get("/oauth2/v2/userinfo")
+    except TokenExpiredError:
+        flash("Session expired, please sign in again.", "warning")
+        return redirect(url_for("google.login"))
+
+    if not resp.ok:
+        flash("Could not fetch your Google profile.", "danger")
+        return redirect(url_for("auth.login"))
+
+    info  = resp.json()
+    email = info["email"]
+    gid   = info["id"]
+    pic   = info.get("picture")
+
+    # Find or create local user
+    user = User.query.filter_by(email=email).first()
+    if not user:
+        user = User(
+            email              = email,
+            google_id          = gid,
+            profile_image      = pic,
+            orig_profile_image = pic
+        )
+        db.session.add(user)
+    else:
+        if not user.orig_profile_image:
+            user.orig_profile_image = pic
+
+    db.session.commit()
+    login_user(user)
+
+    # Redirect directly to /dashboard
+    return redirect("/dashboard")
+
+@auth_bp.route("/logout")
+def logout():
+    logout_user()
+    flash("Logged out successfully.", "info")
+    return redirect(url_for("auth.login"))

webpass/routes/bio_auth.py

@@ -0,0 +1,166 @@
+import json
+import os
+import base64
+from flask import Blueprint, render_template, request, session, jsonify, url_for, current_app, redirect
+from flask_login import login_required, current_user
+from fido2.server import Fido2Server
+from fido2.webauthn import PublicKeyCredentialRpEntity, PublicKeyCredentialUserEntity, AttestedCredentialData
+from fido2.utils import websafe_decode, websafe_encode
+from fido2 import cbor
+from fido2.cose import CoseKey
+from webpass import db, socketio, csrf
+from webpass.models import BiometricDevice, User
+
+bio_bp = Blueprint('bio', __name__)
+
+VERIFIED_CHANNELS = {}
+
+def get_server():
+    # Dynamically grab the host (works for localhost and ngrok)
+    host = request.host.split(':')[0]
+    rp = PublicKeyCredentialRpEntity(id=host, name="WebPass Secure")
+    return Fido2Server(rp)
+
+def make_serializable(data):
+    if isinstance(data, bytes): return websafe_encode(data)
+    elif isinstance(data, dict): return {k: make_serializable(v) for k, v in data.items()}
+    elif isinstance(data, list): return [make_serializable(i) for i in data]
+    return data
+
+def get_user_from_channel(channel_str):
+    if not channel_str or '.' not in channel_str: return None
+    try:
+        user_id = int(channel_str.split('.')[-1])
+        return User.query.get(user_id)
+    except: return None
+
+# --- ROUTES ---
+
+@bio_bp.route('/biometric-lock')
+@login_required
+def lock_screen():
+    if session.get('bio_verified'): return redirect('/dashboard/')
+    
+    rand_str = base64.urlsafe_b64encode(os.urandom(10)).decode().rstrip('=')
+    channel_id = f"{rand_str}.{current_user.id}"
+    
+    # --- NGROK INTEGRATION ---
+    ngrok_base = current_app.config.get('NGROK_URL')
+    
+    if ngrok_base:
+        # Strip trailing slash if present
+        if ngrok_base.endswith('/'): ngrok_base = ngrok_base[:-1]
+        mobile_path = url_for('bio.mobile_authenticate', channel=channel_id)
+        mobile_url = f"{ngrok_base}{mobile_path}"
+    else:
+        mobile_url = url_for('bio.mobile_authenticate', channel=channel_id, _external=True)
+        
+    return render_template('bio_lock.html', mobile_url=mobile_url, channel_id=channel_id)
+
+@bio_bp.route('/api/bio/finalize-login/<channel>')
+@login_required
+def finalize_login(channel):
+    if channel in VERIFIED_CHANNELS:
+        session['bio_verified'] = True
+        del VERIFIED_CHANNELS[channel]
+        return jsonify({"status": "success", "redirect": "/dashboard/"})
+    return jsonify({"status": "pending"}), 400
+
+@bio_bp.route('/mobile-auth/<channel>')
+def mobile_authenticate(channel):
+    user = get_user_from_channel(channel)
+    if not user: return "Invalid Link", 404
+    has_reg = len(user.biometric_devices) > 0
+    return render_template('bio_mobile.html', channel=channel, has_registered=has_reg, user_email=user.email)
+
+# --- API (Standard Logic) ---
+
+@bio_bp.route('/api/bio/register/begin', methods=['POST'])
+@csrf.exempt 
+def register_begin():
+    data = request.get_json() or {}
+    user = get_user_from_channel(data.get('channel'))
+    if not user and current_user.is_authenticated: user = current_user
+    if not user: return jsonify({"error": "User lost"}), 400
+    
+    user_entity = PublicKeyCredentialUserEntity(id=str(user.id).encode(), name=user.email, display_name=user.email)
+    server = get_server()
+    registration_data, state = server.register_begin(
+        user_entity, 
+        [{"id": d.credential_id, "type": "public-key"} for d in user.biometric_devices],
+        user_verification="preferred"
+    )
+    session['fido_state'] = state
+    resp = dict(registration_data)
+    if 'publicKey' in resp: resp = resp['publicKey']
+    return jsonify(make_serializable(resp))
+
+@bio_bp.route('/api/bio/register/complete', methods=['POST'])
+@csrf.exempt 
+def register_complete():
+    try:
+        data = request.json
+        user = get_user_from_channel(data.get('channel'))
+        if not user: return jsonify({"error": "User not found"}), 400
+
+        server = get_server()
+        auth_data = server.register_complete(session.pop('fido_state'), data['response'])
+        
+        cred = BiometricDevice(
+            user_id=user.id,
+            credential_id=websafe_encode(auth_data.credential_data.credential_id),
+            public_key=cbor.encode(auth_data.credential_data.public_key),
+            # --- THE FIX: Removed '.authenticator_data' ---
+            sign_count=auth_data.counter 
+        )
+        db.session.add(cred)
+        db.session.commit()
+        return jsonify({"status": "ok"})
+    except Exception as e:
+        print(f"REG ERROR: {e}")
+        return jsonify({"error": str(e)}), 400
+
+@bio_bp.route('/api/bio/auth/begin', methods=['POST'])
+@csrf.exempt 
+def auth_begin():
+    data = request.get_json() or {}
+    user = get_user_from_channel(data.get('channel'))
+    creds = [{"type": "public-key", "id": websafe_decode(d.credential_id)} for d in user.biometric_devices] if user else []
+    
+    server = get_server()
+    auth_data, state = server.authenticate_begin(creds)
+    session['fido_state'] = state
+    
+    resp = dict(auth_data)
+    if 'publicKey' in resp: resp = resp['publicKey']
+    return jsonify(make_serializable(resp))
+
+@bio_bp.route('/api/bio/auth/complete', methods=['POST'])
+@csrf.exempt 
+def auth_complete():
+    try:
+        data = request.json
+        device = BiometricDevice.query.filter_by(credential_id=data['credentialId']).first()
+        if not device: return jsonify({"error": "Unknown device"}), 400
+        
+        server = get_server()
+        cred_data = AttestedCredentialData.create(
+            b'\x00'*16, websafe_decode(device.credential_id), CoseKey.parse(cbor.decode(device.public_key))
+        )
+        server.authenticate_complete(session.pop('fido_state'), [cred_data], data['response'])
+        
+        device.sign_count += 1
+        db.session.commit()
+        
+        if data.get('channel'):
+            VERIFIED_CHANNELS[data['channel']] = True
+            socketio.emit('unlock_command', {'status': 'success'}, to=data['channel'])
+            
+        return jsonify({"status": "ok"})
+    except Exception as e:
+        return jsonify({"error": str(e)}), 500
+
+@socketio.on('join_channel')
+def on_join(data):
+    from flask_socketio import join_room
+    if data.get('channel'): join_room(data['channel'])

webpass/routes/dashboard.py

@@ -0,0 +1,269 @@
+import os
+import base64
+import json
+from io import BytesIO
+from uuid import uuid4
+
+from flask import (
+    Blueprint,
+    render_template,
+    request,
+    redirect,
+    url_for,
+    flash,
+    current_app,
+    send_file,
+    session
+)
+from flask_login import login_required, current_user, logout_user
+from werkzeug.utils import secure_filename
+from PIL import Image
+from cryptography.fernet import Fernet, InvalidToken
+
+from webpass import db
+from webpass.crypto_utils import generate_key
+from webpass.routes._decorators import otp_required, biometric_required
+
+dashboard_bp = Blueprint('dashboard', __name__, url_prefix='/dashboard')
+
+UPLOAD_FOLDER = 'uploads'
+ALLOWED_EXT   = {'png', 'jpg', 'jpeg', 'gif'}
+
+# Detect Cloud Environment
+IS_CLOUD = os.environ.get('SPACE_ID') is not None
+
+def allowed_file(filename):
+    return '.' in filename and filename.rsplit('.', 1)[1].lower() in ALLOWED_EXT
+
+@dashboard_bp.before_request
+def block_direct_access():
+    if not current_user.is_authenticated:
+        return
+    ref  = request.headers.get('Referer', '')
+    host = request.host_url
+    if not ref.startswith(host):
+        logout_user()
+        return redirect(url_for('auth.login'))
+
+# --- DASHBOARD & PROFILE ---
+
+@dashboard_bp.route('/', methods=['GET'])
+@login_required
+@biometric_required 
+def dashboard():
+    return render_template(
+        'dashboard.html',
+        has_credentials=True, 
+        show_change_modal=False,
+        show_encrypt_modal=(request.args.get('modal')=='encrypt'),
+        show_decrypt_modal=(request.args.get('modal')=='decrypt')
+    )
+
+@dashboard_bp.route('/secure-tools')
+@login_required
+@biometric_required 
+@otp_required       
+def secure_tools():
+    return render_template('vault.html')
+
+@dashboard_bp.route('/network')
+@login_required
+@biometric_required 
+@otp_required       
+def network_monitor():
+    # CLOUD SAFETY TOGGLE
+    if IS_CLOUD:
+        flash("Cloud Deployment Detected: Active hardware network sniffing is disabled for security. Clone from GitHub and run locally to unlock!", "info")
+        return render_template("network_demo.html")
+        
+    return render_template('network.html')
+
+@dashboard_bp.route('/profile', methods=['GET', 'POST'])
+@login_required
+def profile():
+    if request.method == 'POST':
+        file = request.files.get('avatar')
+        if file and allowed_file(file.filename):
+            ext      = os.path.splitext(secure_filename(file.filename))[1]
+            filename = f"{uuid4().hex}{ext}"
+            upload_dir = os.path.join(current_app.root_path, 'static', UPLOAD_FOLDER)
+            os.makedirs(upload_dir, exist_ok=True)
+            save_path = os.path.join(upload_dir, filename)
+            file.save(save_path)
+
+            img = Image.open(save_path)
+            w, h   = img.size
+            side   = min(w, h)
+            left   = (w - side) // 2
+            top    = (h - side) // 2
+            img    = img.crop((left, top, left+side, top+side))
+            img    = img.resize((128, 128), Image.LANCZOS)
+            img.save(save_path)
+
+            current_user.profile_image = url_for(
+                'static', filename=f"{UPLOAD_FOLDER}/{filename}"
+            )
+            db.session.commit()
+            flash('Avatar updated!', 'success')
+            return redirect(url_for('dashboard.profile'))
+
+        flash('Please upload a valid image file.', 'warning')
+
+    return render_template('profile.html')
+
+@dashboard_bp.route('/profile/remove_avatar', methods=['POST'])
+@login_required
+def remove_avatar():
+    user = current_user._get_current_object()
+    if user.orig_profile_image:
+        user.profile_image = user.orig_profile_image
+        db.session.commit()
+        flash('Custom avatar removed.', 'success')
+    else:
+        flash('No custom avatar to remove.', 'info')
+    return redirect(url_for('dashboard.profile'))
+
+# --- FILE ENCRYPTION (Legacy Server-Side Routes Kept Intact) ---
+
+@dashboard_bp.route('/encrypt', methods=['GET', 'POST'])
+@login_required
+def encrypt_file():
+    if request.method == 'POST':
+        uploaded  = request.files.get('file')
+        custom_pw = request.form.get('master_password','') 
+
+        if not uploaded or not custom_pw:
+            flash('File and Password are required.', 'warning')
+            return redirect(url_for('dashboard.dashboard', modal='encrypt'))
+
+        tmpdir = os.path.join(current_app.instance_path, 'tmp')
+        os.makedirs(tmpdir, exist_ok=True)
+        tmpname = f"{uuid4().hex}.encpending"
+        tmppath = os.path.join(tmpdir, tmpname)
+        uploaded.save(tmppath)
+
+        file_salt = os.urandom(16)
+
+        session['encrypt_pending'] = {
+            'filepath': tmppath,
+            'orig_name': secure_filename(uploaded.filename),
+            'password': custom_pw,
+            'salt': base64.b64encode(file_salt).decode()
+        }
+
+        return redirect(url_for('otp.send_otp',
+                                next=url_for('dashboard.encrypt_confirm'),
+                                feature='File Encryption'))
+
+    return redirect(url_for('dashboard.dashboard', modal='encrypt'))
+
+@dashboard_bp.route('/encrypt/confirm', methods=['GET'])
+@login_required
+@otp_required
+def encrypt_confirm():
+    data = session.pop('encrypt_pending', None)
+    if not data:
+        flash('No encryption in progress.', 'warning')
+        return redirect(url_for('dashboard.dashboard'))
+
+    salt = base64.b64decode(data['salt'])
+    raw_key = generate_key(data['password'], salt)
+    fernet_key = base64.urlsafe_b64encode(raw_key)
+    f = Fernet(fernet_key)
+
+    with open(data['filepath'], 'rb') as f_in:
+        ciphertext = f.encrypt(f_in.read())
+    os.remove(data['filepath'])
+
+    final_data = salt + ciphertext
+
+    buf = BytesIO(final_data)
+    buf.seek(0)
+    download_name = data['orig_name'] + '.enc'
+    
+    return send_file(
+        buf,
+        as_attachment=True,
+        download_name=download_name,
+        mimetype='application/octet-stream'
+    )
+
+# --- FILE DECRYPTION (Legacy Server-Side Routes Kept Intact) ---
+
+@dashboard_bp.route('/decrypt', methods=['GET', 'POST'])
+@login_required
+def decrypt_file():
+    if request.method == 'POST':
+        uploaded  = request.files.get('file')
+        custom_pw = request.form.get('master_password','')
+
+        if not uploaded or not custom_pw:
+            flash('File and Password are required.', 'warning')
+            return redirect(url_for('dashboard.dashboard', modal='decrypt'))
+
+        tmpdir = os.path.join(current_app.instance_path, 'tmp')
+        os.makedirs(tmpdir, exist_ok=True)
+        tmpname = f"{uuid4().hex}.decpending"
+        tmppath = os.path.join(tmpdir, tmpname)
+        uploaded.save(tmppath)
+
+        session['decrypt_pending'] = {
+            'filepath': tmppath,
+            'orig_name': secure_filename(uploaded.filename),
+            'password': custom_pw
+        }
+
+        return redirect(url_for('otp.send_otp',
+                                next=url_for('dashboard.decrypt_confirm'),
+                                feature='File Decryption'))
+
+    return redirect(url_for('dashboard.dashboard', modal='decrypt'))
+
+@dashboard_bp.route('/decrypt/confirm', methods=['GET'])
+@login_required
+@otp_required
+def decrypt_confirm():
+    data = session.pop('decrypt_pending', None)
+    if not data:
+        flash('No decryption in progress.', 'warning')
+        return redirect(url_for('dashboard.dashboard'))
+
+    try:
+        with open(data['filepath'], 'rb') as f_in:
+            file_content = f_in.read()
+            
+        if len(file_content) < 16:
+            raise InvalidToken
+            
+        salt = file_content[:16]
+        ciphertext = file_content[16:]
+
+        raw_key = generate_key(data['password'], salt)
+        fernet_key = base64.urlsafe_b64encode(raw_key)
+        f = Fernet(fernet_key)
+
+        plaintext = f.decrypt(ciphertext)
+        
+    except InvalidToken:
+        if os.path.exists(data['filepath']): os.remove(data['filepath'])
+        flash('Decryption failed: Wrong password or corrupted file.', 'danger')
+        return redirect(url_for('dashboard.dashboard', modal='decrypt'))
+    except Exception as e:
+        if os.path.exists(data['filepath']): os.remove(data['filepath'])
+        flash(f'Error: {str(e)}', 'danger')
+        return redirect(url_for('dashboard.dashboard', modal='decrypt'))
+
+    os.remove(data['filepath'])
+
+    buf = BytesIO(plaintext)
+    buf.seek(0)
+    filename = data['orig_name']
+    if filename.lower().endswith('.enc'):
+        filename = filename[:-4]
+        
+    return send_file(
+        buf,
+        as_attachment=True,
+        download_name=filename,
+        mimetype='application/octet-stream'
+    )

webpass/routes/otp.py

@@ -0,0 +1,94 @@
+import random
+import time
+
+from flask import (
+    Blueprint,
+    render_template,
+    request,
+    session,
+    redirect,
+    url_for,
+    flash
+)
+from flask_login import login_required, current_user
+from flask_mail import Message
+
+# Ensure these are imported from your main app package
+from webpass import mail, csrf, limiter
+
+otp_bp = Blueprint("otp", __name__)
+
+@otp_bp.route("/otp/send")
+@login_required
+@csrf.exempt
+@limiter.limit("3 per minute", key_func=lambda: str(current_user.id))
+def send_otp():
+    """
+    Generates OTP, sends email, and redirects to verification page.
+    """
+    # 1. Capture where the user was trying to go
+    next_url = request.args.get("next") or url_for("dashboard.dashboard")
+    feature = request.args.get("feature", "Sensitive Action")
+
+    # 2. Generate Code
+    code = f"{random.randint(0, 999999):06d}"
+    
+    # 3. Store in Session
+    session["otp_code"]     = code
+    session["otp_expiry"]   = time.time() + 5 * 60  # 5 minutes
+    session["otp_next"]     = next_url
+    session["otp_feature"]  = feature
+
+    # 4. Send Email
+    try:
+        msg = Message(
+            subject=f"Your OTP for {feature}",
+            recipients=[current_user.email],
+            body=(
+                f"Your one-time code for accessing {feature} is:\n\n"
+                f"    {code}\n\n"
+                "It expires in 5 minutes."
+            )
+        )
+        mail.send(msg)
+        flash(f"An OTP has been sent to {current_user.email}", "info")
+    except Exception as e:
+        print(f"Error sending email: {e}")
+        flash("Failed to send OTP email. Please checks logs.", "danger")
+
+    # 5. Redirect to Enter Code
+    return redirect(url_for("otp.verify_otp"))
+
+
+@otp_bp.route("/otp/verify", methods=["GET", "POST"])
+@login_required
+@csrf.exempt
+def verify_otp():
+    """
+    Checks the code entered by the user.
+    """
+    feature = session.get("otp_feature", "Sensitive Action")
+
+    if request.method == "POST":
+        entered = request.form.get("otp", "").strip()
+        code    = session.get("otp_code")
+        expiry  = session.get("otp_expiry", 0)
+
+        # 1. Check Validity
+        if code and time.time() < expiry and entered == code:
+            # Clear sensitive session data
+            session.pop("otp_code", None)
+            session.pop("otp_expiry", None)
+            session.pop("otp_feature", None)
+            
+            # 2. Set the 'Verified' Flag
+            session["otp_verified"] = True
+            
+            # 3. Redirect back to the tool (Dead Drop, Stego, etc.)
+            next_url = session.pop("otp_next", url_for("dashboard.dashboard"))
+            return redirect(next_url)
+
+        flash("Invalid or expired OTP, please try again.", "danger")
+        return redirect(url_for("otp.verify_otp"))
+
+    return render_template("verify_otp.html", feature=feature)

webpass/routes/share.py

@@ -0,0 +1,101 @@
+import uuid
+import datetime
+from flask import Blueprint, render_template, request, jsonify, url_for, current_app
+from flask_login import login_required
+from webpass import db, limiter, csrf
+from webpass.models import DeadDrop
+from webpass.routes._decorators import biometric_required, otp_required
+
+share_bp = Blueprint("share", __name__)
+
+@share_bp.route("/share/create", methods=["GET"])
+@login_required
+@biometric_required 
+@otp_required
+def share_ui():
+    return render_template("share.html")
+
+@share_bp.route("/share/create", methods=["POST"])
+@limiter.limit("5 per minute")
+@csrf.exempt 
+def create_share():
+    data = request.get_json()
+    if not data: return jsonify({"error": "No JSON payload"}), 400
+
+    ciphertext = data.get("ciphertext")
+    iv         = data.get("iv")
+    salt       = data.get("salt")
+    ttl        = data.get("ttl", 60) # Link expiry
+    view_time  = data.get("view_time", 30) # Message view time
+
+    if not (ciphertext and iv and salt):
+        return jsonify({"error": "Missing crypto fields"}), 400
+
+    drop_id = str(uuid.uuid4())
+    
+    try:
+        minutes = int(ttl)
+        view_time_sec = int(view_time)
+        if view_time_sec <= 0: view_time_sec = 30
+    except ValueError:
+        minutes = 60
+        view_time_sec = 30
+    
+    expires_at = datetime.datetime.utcnow() + datetime.timedelta(minutes=minutes)
+
+    new_drop = DeadDrop(
+        id=drop_id, ciphertext=ciphertext, iv=iv, salt=salt,
+        expires_at=expires_at, created_at=datetime.datetime.utcnow(),
+        view_time=view_time_sec
+    )
+    db.session.add(new_drop)
+    db.session.commit()
+
+    relative_path = url_for('share.view_drop_page', drop_id=drop_id)
+    ngrok_base = current_app.config.get('NGROK_URL')
+    
+    if ngrok_base:
+        if ngrok_base.endswith('/'): ngrok_base = ngrok_base[:-1]
+        full_link = f"{ngrok_base}{relative_path}"
+    else:
+        full_link = url_for('share.view_drop_page', drop_id=drop_id, _external=True)
+
+    return jsonify({"id": drop_id, "link": full_link})
+
+@share_bp.route("/share/v/<drop_id>", methods=["GET"])
+def view_drop_page(drop_id):
+    drop = DeadDrop.query.get(drop_id)
+    if not drop:
+        return render_template("share_error.html", message="This link has expired or never existed.")
+    
+    if datetime.datetime.utcnow() > drop.expires_at:
+        db.session.delete(drop)
+        db.session.commit()
+        return render_template("share_error.html", message="This link has expired.")
+
+    return render_template("share_view.html", drop_id=drop_id)
+
+@share_bp.route("/api/share/<drop_id>", methods=["POST"])
+@limiter.limit("10 per minute")
+@csrf.exempt
+def reveal_drop_api(drop_id):
+    drop = DeadDrop.query.get(drop_id)
+    if not drop: return jsonify({"error": "Not found"}), 410
+
+    if datetime.datetime.utcnow() > drop.expires_at:
+        db.session.delete(drop)
+        db.session.commit()
+        return jsonify({"error": "Expired"}), 410
+
+    payload = {
+        "ciphertext": drop.ciphertext,
+        "iv": drop.iv,
+        "salt": drop.salt,
+        "view_time": drop.view_time # SENDING TIMER TO FRONTEND
+    }
+
+    # BURN IT
+    db.session.delete(drop)
+    db.session.commit()
+
+    return jsonify(payload)

webpass/routes/stego.py

@@ -0,0 +1,114 @@
+from flask import Blueprint, render_template, request, send_file, flash, redirect, url_for
+from flask_login import login_required
+from webpass.routes._decorators import biometric_required, otp_required
+# Import the new universal functions
+from webpass.stego_utils import encode_data, decode_data
+
+stego_bp = Blueprint('stego', __name__)
+
+ALLOWED_EXTENSIONS = {'png', 'jpg', 'jpeg'}
+
+def allowed_file(filename):
+    return '.' in filename and \
+           filename.rsplit('.', 1)[1].lower() in ALLOWED_EXTENSIONS
+
+@stego_bp.route('/steganography', methods=['GET'])
+@login_required
+@biometric_required
+@otp_required
+def ui():
+    return render_template('stego.html')
+
+@stego_bp.route('/steganography/hide', methods=['POST'])
+@login_required
+def hide():
+    if 'cover_image' not in request.files:
+        flash('Missing cover image.', 'warning')
+        return redirect(url_for('stego.ui'))
+        
+    cover = request.files['cover_image']
+    password = request.form.get('stego_password', '')
+    mode = request.form.get('mode', 'text') # 'text' or 'file'
+    
+    if cover.filename == '' or not allowed_file(cover.filename):
+        flash('Invalid cover image.', 'warning')
+        return redirect(url_for('stego.ui'))
+
+    if not password:
+        flash('Password is required.', 'warning')
+        return redirect(url_for('stego.ui'))
+
+    try:
+        if mode == 'text':
+            secret_text = request.form.get('secret_text', '')
+            if not secret_text:
+                flash("Secret text is empty.", "warning")
+                return redirect(url_for('stego.ui'))
+            
+            output = encode_data(cover, secret_text, password)
+            
+        elif mode == 'file':
+            if 'secret_file' not in request.files:
+                flash("No secret file uploaded.", "warning")
+                return redirect(url_for('stego.ui'))
+            
+            secret_file = request.files['secret_file']
+            if secret_file.filename == '':
+                flash("No secret file selected.", "warning")
+                return redirect(url_for('stego.ui'))
+                
+            output = encode_data(cover, secret_file, password, filename=secret_file.filename)
+            
+        return send_file(
+            output,
+            mimetype='image/png',
+            as_attachment=True,
+            download_name='secure_stego_image.png'
+        )
+        
+    except ValueError as e:
+        flash(f'Error: {str(e)}', 'danger')
+    except Exception as e:
+        flash(f'System Error: {str(e)}', 'danger')
+        
+    return redirect(url_for('stego.ui'))
+
+@stego_bp.route('/steganography/reveal', methods=['POST'])
+@login_required
+def reveal():
+    if 'stego_image' not in request.files:
+        flash('Missing image.', 'warning')
+        return redirect(url_for('stego.ui'))
+        
+    file = request.files['stego_image']
+    password = request.form.get('stego_password', '')
+    
+    if file.filename == '' or not allowed_file(file.filename):
+        flash('Invalid file.', 'warning')
+        return redirect(url_for('stego.ui'))
+        
+    if not password:
+        flash('Password is required.', 'warning')
+        return redirect(url_for('stego.ui'))
+    
+    try:
+        result = decode_data(file, password)
+        
+        if result['type'] == 'file':
+            # It's a file! Send it as a download
+            return send_file(
+                result['file_bytes'],
+                as_attachment=True,
+                download_name=result['filename']
+            )
+        else:
+            # It's text! Show it on screen
+            flash(f'Successfully Decoded Text', 'success')
+            return render_template('stego.html', revealed_secret=result['content'])
+            
+    except ValueError as e:
+        flash(str(e), 'danger')
+        return redirect(url_for('stego.ui'))
+    except Exception as e:
+        flash(f'System Error: {str(e)}', 'danger')
+        return redirect(url_for('stego.ui'))

webpass/routes/tools.py

@@ -0,0 +1,184 @@
+import io
+import hashlib
+import requests
+from PIL import Image, ExifTags
+from flask import Blueprint, render_template, request, jsonify, send_file, flash, redirect, url_for
+from flask_login import login_required
+from webpass.routes._decorators import biometric_required, otp_required
+
+tools_bp = Blueprint('tools', __name__)
+
+# --- HELPER: ADVANCED GPS DECODER ---
+def get_decimal_from_dms(dms, ref):
+    """
+    Converts GPS (Degrees, Minutes, Seconds) to Decimal format.
+    """
+    degrees = dms[0]
+    minutes = dms[1]
+    seconds = dms[2]
+    
+    decimal = degrees + (minutes / 60.0) + (seconds / 3600.0)
+    
+    if ref in ['S', 'W']:
+        decimal = -decimal
+    return decimal
+
+def get_geotagging(exif):
+    if not exif:
+        return None
+    
+    geotagging = {}
+    gps_info = exif.get(34853) # 34853 is the GPS Info Tag ID
+    
+    if not gps_info:
+        return None
+
+    # Decode GPS Tags using PIL.ExifTags.GPSTAGS
+    for key in gps_info.keys():
+        decode = ExifTags.GPSTAGS.get(key, key)
+        geotagging[decode] = gps_info[key]
+    
+    # Calculate actual coordinates
+    if 'GPSLatitude' in geotagging and 'GPSLatitudeRef' in geotagging and \
+       'GPSLongitude' in geotagging and 'GPSLongitudeRef' in geotagging:
+        
+        lat = get_decimal_from_dms(geotagging['GPSLatitude'], geotagging['GPSLatitudeRef'])
+        lon = get_decimal_from_dms(geotagging['GPSLongitude'], geotagging['GPSLongitudeRef'])
+        
+        return {
+            "latitude": lat,
+            "longitude": lon,
+            "map_url": f"https://www.google.com/maps?q={lat},{lon}",
+            "raw": geotagging
+        }
+    
+    return None
+
+# --- 1. GHOST METADATA WIPER ---
+
+@tools_bp.route('/tools/metadata', methods=['GET'])
+@login_required
+@biometric_required
+@otp_required
+def metadata_ui():
+    return render_template('metadata.html')
+
+@tools_bp.route('/tools/metadata/scan', methods=['POST'])
+@login_required
+def metadata_scan():
+    if 'image' not in request.files:
+        return jsonify({'error': 'No image uploaded'}), 400
+    
+    file = request.files['image']
+    try:
+        img = Image.open(file)
+        raw_exif = img._getexif()
+        
+        privacy_report = {
+            "critical": {},   # GPS, Serial Numbers, Dates
+            "technical": {},  # Lens, ISO, Shutter
+            "status": "clean"
+        }
+
+        if raw_exif:
+            # 1. EXTRACT GPS (The "Scary" Part)
+            gps_data = get_geotagging(raw_exif)
+            if gps_data:
+                privacy_report['critical']['GPS Location'] = f"{gps_data['latitude']:.5f}, {gps_data['longitude']:.5f}"
+                privacy_report['critical']['Map Link'] = gps_data['map_url']
+                privacy_report['status'] = "danger"
+            
+            # 2. EXTRACT STANDARD TAGS
+            for tag, value in raw_exif.items():
+                tag_name = ExifTags.TAGS.get(tag, tag)
+                
+                # Skip binary/unreadable data
+                if isinstance(value, (bytes, bytearray)):
+                    continue
+                
+                str_val = str(value)
+
+                # categorize interesting tags
+                if tag_name in ['Make', 'Model', 'Software', 'BodySerialNumber', 'LensModel', 'LensSerialNumber', 'Artist', 'HostComputer']:
+                    privacy_report['critical'][tag_name] = str_val
+                    privacy_report['status'] = "danger" if privacy_report['status'] == "clean" else "danger"
+                
+                elif tag_name in ['DateTime', 'DateTimeOriginal', 'DateTimeDigitized']:
+                    privacy_report['critical'][tag_name] = str_val
+                
+                elif tag_name in ['ExposureTime', 'FNumber', 'ISOSpeedRatings', 'FocalLength', 'Flash', 'WhiteBalance']:
+                    privacy_report['technical'][tag_name] = str_val
+
+        # If we found nothing
+        if not privacy_report['critical'] and not privacy_report['technical']:
+            return jsonify({'status': 'clean', 'message': 'No hidden metadata found.'})
+
+        return jsonify({'status': 'infected', 'data': privacy_report})
+        
+    except Exception as e:
+        return jsonify({'error': str(e)}), 500
+
+@tools_bp.route('/tools/metadata/wipe', methods=['POST'])
+@login_required
+def metadata_wipe():
+    if 'image' not in request.files:
+        return redirect(url_for('tools.metadata_ui'))
+    
+    file = request.files['image']
+    try:
+        img = Image.open(file)
+        
+        # Strip metadata by creating a fresh image copy
+        data = list(img.getdata())
+        clean_img = Image.new(img.mode, img.size)
+        clean_img.putdata(data)
+        
+        output = io.BytesIO()
+        # Clean save (format handling)
+        fmt = img.format or "JPEG"
+        clean_img.save(output, format=fmt)
+        output.seek(0)
+        
+        return send_file(
+            output,
+            mimetype=file.content_type,
+            as_attachment=True,
+            download_name=f"ghost_clean_{file.filename}"
+        )
+    except Exception as e:
+        flash(f"Error processing image: {str(e)}", "danger")
+        return redirect(url_for('tools.metadata_ui'))
+
+# --- 2. BREACH CHECKER (Keep existing code) ---
+
+@tools_bp.route('/tools/breach', methods=['GET'])
+@login_required
+@biometric_required
+@otp_required
+def breach_ui():
+    return render_template('breach.html')
+
+@tools_bp.route('/tools/breach/check', methods=['POST'])
+@login_required
+def breach_check():
+    password = request.json.get('password', '')
+    if not password: return jsonify({'error': 'Password required'}), 400
+
+    sha1 = hashlib.sha1(password.encode('utf-8')).hexdigest().upper()
+    prefix, suffix = sha1[:5], sha1[5:]
+
+    try:
+        res = requests.get(f"https://api.pwnedpasswords.com/range/{prefix}")
+        if res.status_code != 200: return jsonify({'error': 'API Error'}), 500
+
+        hashes = (line.split(':') for line in res.text.splitlines())
+        count = 0
+        for h, c in hashes:
+            if h == suffix:
+                count = int(c)
+                break
+        
+        return jsonify({'leaked': count > 0, 'count': count})
+        
+    except Exception as e:
+        return jsonify({'error': str(e)}), 500

webpass/security_utils.py

@@ -0,0 +1,61 @@
+# webpass/security_utils.py
+import os
+from urllib.parse import urlparse, urljoin
+from flask import request
+from cryptography.hazmat.primitives import padding
+from cryptography.hazmat.primitives.ciphers import Cipher, algorithms, modes
+
+def is_safe_url(target):
+    """
+    Ensures the redirect target is safe and belongs to OUR website.
+    Prevents Open Redirect Vulnerabilities (OWASP Top 10).
+    """
+    ref_url = urlparse(request.host_url)
+    test_url = urlparse(urljoin(request.host_url, target))
+    return test_url.scheme in ('http', 'https') and \
+           ref_url.netloc == test_url.netloc
+
+def encrypt_stream(input_stream, output_stream, key, iv):
+    """
+    Encrypts data in small chunks (64KB) so we never load the whole file into RAM.
+    Fixes Denial of Service (DoS) vulnerability via memory exhaustion.
+    """
+    cipher = Cipher(algorithms.AES(key), modes.CBC(iv))
+    encryptor = cipher.encryptor()
+    padder = padding.PKCS7(128).padder()
+    chunk_size = 64 * 1024  # 64KB chunks
+
+    while True:
+        chunk = input_stream.read(chunk_size)
+        if not chunk:
+            break
+        # Update padder with new chunk, it yields full blocks if available
+        padded_data = padder.update(chunk)
+        if padded_data:
+            output_stream.write(encryptor.update(padded_data))
+    
+    # Finalize padding and encryption
+    output_stream.write(encryptor.update(padder.finalize()))
+    output_stream.write(encryptor.finalize())
+
+def decrypt_stream(input_stream, output_stream, key, iv):
+    """
+    Decrypts data in small chunks (64KB).
+    """
+    cipher = Cipher(algorithms.AES(key), modes.CBC(iv))
+    decryptor = cipher.decryptor()
+    unpadder = padding.PKCS7(128).unpadder()
+    chunk_size = 64 * 1024
+
+    while True:
+        chunk = input_stream.read(chunk_size)
+        if not chunk:
+            break
+        
+        decrypted_chunk = decryptor.update(chunk)
+        if decrypted_chunk:
+            output_stream.write(unpadder.update(decrypted_chunk))
+            
+    # Finalize decryption and unpadding
+    output_stream.write(unpadder.update(decryptor.finalize()))
+    output_stream.write(unpadder.finalize())

webpass/static/css/login.css

@@ -0,0 +1,115 @@
+@import url("https://fonts.googleapis.com/css?family=Raleway:400,700");
+*, *:before, *:after {
+  box-sizing: border-box;
+}
+
+body {
+  min-height: 100vh;
+  font-family: "Raleway", sans-serif;
+  margin: 0;
+  padding: 0;
+  overflow: hidden;
+}
+
+.container {
+  position: absolute;
+  width: 100vw;
+  height: 100vh;
+  top: 0;
+  left: 0;
+  overflow: hidden;
+}
+
+.top:before, .top:after, .bottom:before, .bottom:after {
+  content: "";
+  display: block;
+  position: absolute;
+  width: 200vmax;
+  height: 200vmax;
+  top: 50%;
+  left: 50%;
+  margin-top: -100vmax;
+  transform-origin: 0 50%;
+  transition: all 0.5s cubic-bezier(0.445, 0.05, 0, 1);
+  z-index: 20;
+  opacity: 0.65;
+  transition-delay: 0.2s;
+}
+.top:before { transform: rotate(45deg); background: #e46569; }
+.top:after { transform: rotate(135deg); background: #ecaf81; }
+.bottom:before { transform: rotate(-45deg); background: #60b8d4; }
+.bottom:after { transform: rotate(-135deg); background: #3745b5; }
+
+.container:hover .top:before,
+.container:hover .top:after,
+.container:hover .bottom:before,
+.container:hover .bottom:after,
+.container:active .top:before,
+.container:active .top:after,
+.container:active .bottom:before,
+.container:active .bottom:after {
+  margin-left: 200px;
+  transform-origin: -200px 50%;
+  transition-delay: 0s;
+}
+
+/* Only show the content on hover, with no box, border, or background */
+.center {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  padding: 0; /* No padding for box effect */
+  opacity: 0;
+  pointer-events: none;
+  background: none;
+  box-shadow: none;
+  border: none;
+  outline: none;
+  z-index: 10;
+  transition: opacity 0.5s cubic-bezier(0.445, 0.05, 0, 1);
+  transition-delay: 0s;
+}
+
+.container:hover .center,
+.container:active .center {
+  opacity: 1;
+  pointer-events: auto;
+  background: none;
+  box-shadow: none;
+  border: none;
+  outline: none;
+  transition-delay: 0.2s;
+}
+
+.center h2 {
+  margin-bottom: 20px;
+  font-weight: 700;
+  color: #333;
+  background: none;
+  border: none;
+  outline: none;
+}
+
+/* Google button styling */
+.google-btn {
+  display: inline-block;
+  padding: 10px 20px;
+  font-size: 16px;
+  font-weight: 600;
+  color: #fff;
+  background: #4285F4;
+  border: none;
+  border-radius: 2px;
+  text-decoration: none;
+  box-shadow: 0 2px 4px rgba(0,0,0,0.2);
+  transition: background 0.2s;
+  margin-top: 10px;
+}
+.google-btn:hover {
+  background: #3367D6;
+}

webpass/static/css/modern.css

@@ -0,0 +1,130 @@
+:root {
+    --main-bg: #0f172a;       /* Deep Navy */
+    --second-bg: #1e293b;     /* Lighter Navy */
+    --sidebar-bg: #0b1120;    /* Darkest Navy */
+    --text-color: #cbd5e1;    /* Soft White */
+    --accent-color: #0ea5e9;  /* Cyber Blue */
+    --accent-glow: rgba(14, 165, 233, 0.5);
+    --glass-bg: rgba(30, 41, 59, 0.7);
+    --glass-border: 1px solid rgba(255, 255, 255, 0.1);
+}
+
+body {
+    background-color: var(--main-bg);
+    color: var(--text-color);
+    font-family: 'Inter', sans-serif;
+    overflow-x: hidden;
+}
+
+h1, h2, h3, h4, h5, h6, .font-monospace {
+    font-family: 'JetBrains Mono', monospace;
+    color: #fff;
+}
+
+/* Sidebar Styling */
+#wrapper { overflow-x: hidden; }
+.cyber-sidebar {
+    min-height: 100vh;
+    margin-left: -15rem;
+    transition: margin 0.25s ease-out;
+    background-color: var(--sidebar-bg);
+    border-right: 1px solid rgba(255,255,255,0.05);
+}
+.cyber-sidebar .list-group { width: 15rem; }
+#wrapper.toggled .cyber-sidebar { margin-left: 0; }
+#page-content-wrapper { width: 100%; transition: margin 0.25s ease-out; }
+
+@media (min-width: 768px) {
+    .cyber-sidebar { margin-left: 0; }
+    #wrapper.toggled .cyber-sidebar { margin-left: -15rem; }
+}
+
+.sidebar-heading { color: var(--accent-color); letter-spacing: 2px; }
+.list-group-item { 
+    border: none; padding: 15px 30px; 
+    color: var(--text-color); 
+    transition: all 0.3s; 
+    border-left: 3px solid transparent;
+}
+.list-group-item:hover { 
+    color: var(--accent-color); 
+    background: rgba(255,255,255,0.03) !important;
+    padding-left: 35px;
+}
+.active-link { 
+    color: var(--accent-color) !important; 
+    background: linear-gradient(90deg, rgba(14,165,233,0.1), transparent) !important; 
+    border-left: 3px solid var(--accent-color); 
+}
+.locked-link { opacity: 0.5; cursor: not-allowed; }
+
+/* Cyber Glass Cards */
+.cyber-card {
+    background: var(--glass-bg);
+    backdrop-filter: blur(12px);
+    -webkit-backdrop-filter: blur(12px);
+    border: var(--glass-border);
+    border-radius: 16px;
+    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.3);
+    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s;
+}
+.cyber-card:hover {
+    transform: translateY(-5px);
+    box-shadow: 0 10px 40px rgba(14, 165, 233, 0.15);
+    border-color: rgba(14, 165, 233, 0.3);
+}
+
+/* Neon Buttons */
+.btn-cyber {
+    background: linear-gradient(135deg, var(--accent-color), #3b82f6);
+    border: none;
+    color: white;
+    font-weight: 600;
+    padding: 12px 24px;
+    border-radius: 8px;
+    transition: all 0.3s;
+    box-shadow: 0 4px 15px rgba(14, 165, 233, 0.3);
+}
+.btn-cyber:hover {
+    box-shadow: 0 0 25px var(--accent-color);
+    transform: scale(1.02);
+    color: white;
+}
+
+/* Form Inputs */
+.form-control {
+    background: rgba(0,0,0,0.3);
+    border: 1px solid rgba(255,255,255,0.1);
+    color: white;
+    padding: 12px;
+}
+.form-control:focus {
+    background: rgba(0,0,0,0.5);
+    border-color: var(--accent-color);
+    box-shadow: 0 0 0 2px rgba(14, 165, 233, 0.25);
+    color: white;
+}
+
+/* Animations */
+.fade-in-up { animation: fadeInUp 0.6s ease forwards; opacity: 0; transform: translateY(20px); }
+@keyframes fadeInUp { to { opacity: 1; transform: translateY(0); } }
+
+.cyber-alert {
+    background: rgba(14, 165, 233, 0.1);
+    border: 1px solid var(--accent-color);
+    color: white;
+    backdrop-filter: blur(5px);
+}
+
+/* Watchtower Badges */
+.watchtower-badge {
+    margin-top: 10px;
+    padding: 8px 12px;
+    border-radius: 6px;
+    font-size: 0.85rem;
+    display: flex; align-items: center; gap: 8px;
+    animation: slideDown 0.3s ease-out;
+}
+.watchtower-badge.safe { background: rgba(16, 185, 129, 0.15); border: 1px solid #10b981; color: #10b981; }
+.watchtower-badge.danger { background: rgba(239, 68, 68, 0.15); border: 1px solid #ef4444; color: #ef4444; }
+@keyframes slideDown { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } }

webpass/static/js/dashboard.js

@@ -0,0 +1,176 @@
+document.addEventListener("DOMContentLoaded", () => {
+  const show = id => document.getElementById(id)?.classList.remove("d-none");
+  const hide = id => document.getElementById(id)?.classList.add("d-none");
+  const setErr = (id, msg) => {
+    const el = document.getElementById(id);
+    if (!el) return;
+    el.textContent = msg;
+    show(id);
+  };
+
+  // View credential on modal show
+  document.getElementById("viewModal")
+    .addEventListener("show.bs.modal", () => {
+      const details = document.getElementById("credentialDetails");
+      details.textContent = "Loading…";
+      fetch("/api/credentials")
+        .then(r => r.json())
+        .then(data => {
+          if (data.status === "ok" && data.credential) {
+            const c = data.credential;
+            details.textContent =
+              `Account: ${c.account}\nUsername: ${c.username}`;
+          } else {
+            details.textContent = "No credentials found.";
+          }
+        })
+        .catch(() => {
+          details.textContent = "Error loading credentials.";
+        });
+    });
+
+  // Toggle links/buttons based on existing credentials
+  (async function checkCredential() {
+    try {
+      const res  = await fetch("/api/credentials");
+      const data = await res.json();
+      if (data.status === "ok" && data.credential) {
+        hide("storeLink");
+        show("changeLink");
+        show("viewLink");
+        show("encryptLink");
+        show("decryptLink");
+        document.getElementById("account_change").value  = data.credential.account;
+        document.getElementById("username_change").value = data.credential.username;
+      } else {
+        show("storeLink");
+        hide("changeLink");
+        hide("viewLink");
+        hide("encryptLink");
+        hide("decryptLink");
+      }
+    } catch {
+      show("storeLink");
+      hide("changeLink");
+      hide("viewLink");
+      hide("encryptLink");
+      hide("decryptLink");
+    }
+  })();
+
+  // Create / Change credential
+  document.getElementById("changeForm")
+    .addEventListener("submit", async e => {
+      e.preventDefault();
+      hide("changeError");
+
+      const form    = e.target;
+      const payload = {
+        account:             form.account?.value.trim(),
+        username:            form.username?.value.trim(),
+        password:            form.password?.value,
+        old_master_password: form.old_master_password?.value,
+        new_master_password: form.new_master_password?.value,
+        confirm_new_master:  form.confirm_new_master?.value,
+        master_password:     form.master_password?.value
+      };
+
+      // Client-side validation
+      if (payload.account && !/^\d+$/.test(payload.account)) {
+        return setErr("changeError", "Account must be numeric");
+      }
+      if (payload.new_master_password &&
+          payload.new_master_password !== payload.confirm_new_master) {
+        return setErr("changeError", "New passwords do not match");
+      }
+
+      const res    = await fetch("/api/credential", {
+        method:  "POST",
+        headers: { "Content-Type": "application/json" },
+        body:    JSON.stringify(payload)
+      });
+      const result = await res.json();
+
+      if (!res.ok) {
+        return setErr("changeError", result.error || "Failed to save");
+      }
+      // success: reload dashboard to reflect changes
+      window.location.reload();
+    });
+
+  // Encrypt File
+  document.getElementById("encryptForm")
+    .addEventListener("submit", async e => {
+      e.preventDefault();
+      hide("encryptError");
+
+      const res = await fetch("/api/encrypt-file", {
+        method: "POST",
+        body:   new FormData(e.target)
+      });
+
+      if (!res.ok) {
+        const err = await res.json();
+        document.getElementById("encryptError").textContent =
+          err.error || "Encryption failed";
+        show("encryptError");
+        return;
+      }
+
+      const blob = await res.blob();
+      const url  = URL.createObjectURL(blob);
+      const a    = document.createElement("a");
+      a.href     = url;
+      a.download = res.headers.get("Content-Disposition")
+                    ?.split("filename=")[1] || "encrypted_file.zip";
+      document.body.append(a);
+      a.click();
+      a.remove();
+      URL.revokeObjectURL(url);
+      bootstrap.Modal.getInstance(
+        document.getElementById("encryptModal")
+      ).hide();
+    });
+
+  // Decrypt File
+  document.getElementById("decryptForm")
+    .addEventListener("submit", async e => {
+      e.preventDefault();
+      hide("decryptError");
+
+      const res = await fetch("/api/decrypt-file", {
+        method: "POST",
+        body:   new FormData(e.target)
+      });
+
+      if (!res.ok) {
+        const err = await res.json();
+        document.getElementById("decryptError").textContent =
+          err.error || "Decryption failed";
+        show("decryptError");
+        return;
+      }
+
+      const blob = await res.blob();
+      const url  = URL.createObjectURL(blob);
+      const a    = document.createElement("a");
+      a.href     = url;
+      a.download = res.headers.get("Content-Disposition")
+                    ?.split("filename=")[1] || "decrypted_file.zip";
+      document.body.append(a);
+      a.click();
+      a.remove();
+      URL.revokeObjectURL(url);
+      bootstrap.Modal.getInstance(
+        document.getElementById("decryptModal")
+      ).hide();
+    });
+
+  // Sidebar toggle
+  document.getElementById('menu-toggle')
+    ?.addEventListener('click', e => {
+      e.preventDefault();
+      document.getElementById('wrapper')?.classList.toggle('toggled');
+    });
+
+});

webpass/static/js/file_tools.js

@@ -0,0 +1,81 @@
+document.addEventListener("DOMContentLoaded", () => {
+  // ENCRYPT
+  const encryptForm  = document.getElementById("encryptForm");
+  const encryptError = document.getElementById("encryptError");
+
+  encryptForm.addEventListener("submit", async e => {
+    e.preventDefault();
+    encryptError.classList.add("d-none");
+    const form = new FormData(encryptForm);
+
+    try {
+      const res = await fetch("/api/encrypt-file", {
+        method: "POST",
+        body: form,
+        credentials: "same-origin"
+      });
+      if (!res.ok) {
+        const err = await res.json();
+        throw new Error(err.error || res.statusText);
+      }
+      const blob = await res.blob();
+      const cd   = res.headers.get("Content-Disposition");
+      const name = cd?.split("filename=")[1] || "encrypted.zip";
+      const url  = URL.createObjectURL(blob);
+      const a    = document.createElement("a");
+      a.href     = url;
+      a.download = name;
+      document.body.appendChild(a);
+      a.click();
+      a.remove();
+      URL.revokeObjectURL(url);
+      bootstrap.Modal.getInstance(
+        encryptForm.closest(".modal")
+      ).hide();
+    }
+    catch (err) {
+      encryptError.textContent = err.message;
+      encryptError.classList.remove("d-none");
+    }
+  });
+
+  // DECRYPT
+  const decryptForm  = document.getElementById("decryptForm");
+  const decryptError = document.getElementById("decryptError");
+
+  decryptForm.addEventListener("submit", async e => {
+    e.preventDefault();
+    decryptError.classList.add("d-none");
+    const form = new FormData(decryptForm);
+
+    try {
+      const res = await fetch("/api/decrypt-file", {
+        method: "POST",
+        body: form,
+        credentials: "same-origin"
+      });
+      if (!res.ok) {
+        const err = await res.json();
+        throw new Error(err.error || res.statusText);
+      }
+      const blob = await res.blob();
+      const cd   = res.headers.get("Content-Disposition");
+      const name = cd?.split("filename=")[1] || "decrypted.bin";
+      const url  = URL.createObjectURL(blob);
+      const a    = document.createElement("a");
+      a.href     = url;
+      a.download = name;
+      document.body.appendChild(a);
+      a.click();
+      a.remove();
+      URL.revokeObjectURL(url);
+      bootstrap.Modal.getInstance(
+        decryptForm.closest(".modal")
+      ).hide();
+    }
+    catch (err) {
+      decryptError.textContent = err.message;
+      decryptError.classList.remove("d-none");
+    }
+  });
+});

webpass/static/js/flash_modal.js

@@ -0,0 +1,27 @@
+document.addEventListener("DOMContentLoaded", () => {
+  let messages = [];
+  const el = document.getElementById("flash-data");
+  if (el) {
+    try {
+      messages = JSON.parse(el.textContent) || [];
+    } catch (e) {
+      console.warn("Invalid flash-data JSON", e);
+    }
+  }
+  if (!messages.length) return;
+
+  // Show first flash only
+  const [ category, message ] = messages[0];
+  const body = document.getElementById("flashModalBody");
+  body.className = "alert alert-" + category;
+  body.textContent = message;
+
+  const modalEl = document.getElementById("flashModal");
+  const modal   = new bootstrap.Modal(modalEl);
+  modal.show();
+
+  setTimeout(() => {
+    modalEl.classList.add("hide");
+    setTimeout(() => modal.hide(), 500);
+  }, 5000);
+});

webpass/static/js/network.js

@@ -0,0 +1,157 @@
+document.addEventListener("DOMContentLoaded", () => {
+  let table = null;
+  const allPackets = [];
+  const protoCounts = { TCP: 0, UDP: 0, DNS: 0, Other: 0 };
+  const srcCounts = {};
+  let protocolChart = null;
+  
+  // --- New variables for smoother, dynamic updates ---
+  let uiUpdateScheduled = false;
+  const UI_UPDATE_INTERVAL = 1000; // Update heavy visuals once per second
+
+  function initChart() {
+    const ctx = document.getElementById('protocolChart')?.getContext('2d');
+    if (!ctx) return;
+    protocolChart = new Chart(ctx, {
+      type: 'doughnut',
+      data: {
+        labels: ['TCP', 'UDP', 'DNS', 'Other'],
+        datasets: [{ data: [0, 0, 0, 0], backgroundColor: ['#0d6efd', '#ffc107', '#dc3545', '#6f42c1'] }]
+      },
+      options: { responsive: true, maintainAspectRatio: false, plugins: { legend: { position: 'bottom' } } }
+    });
+  }
+
+  function initDataTable() {
+    const cols = ["Time", "Source", "Destination", "Protocol", "Length"];
+    let headerRow = '<tr>';
+    cols.forEach(txt => headerRow += `<th>${txt}</th>`);
+    headerRow += '</tr>';
+    $("#table-header").html(headerRow);
+
+    table = $('#packet-table').DataTable({
+      deferRender:    true,
+      scroller:       true,
+      scrollY:        "60vh",
+      scrollCollapse: true,
+      paging:         true, 
+      lengthChange:   false,
+      info:           true,
+      order:          [[0, 'desc']],
+      language:       { search: "", searchPlaceholder: "Search..." },
+      createdRow: function(row, data, dataIndex) {
+        if (allPackets[dataIndex]) {
+            $(row).data('packet', allPackets[dataIndex]);
+        }
+      }
+    });
+  }
+
+  function getProtocol(pkt) {
+    if (pkt.proto === "DNS") return "DNS";
+    if (pkt.proto === 6) return "TCP";
+    if (pkt.proto === 17) return "UDP";
+    return "Other";
+  }
+
+  // --- Main Update Logic ---
+  // This function updates all the heavy visual elements
+  function updateHeavyVisuals() {
+    // Update KPI cards (except total, which is updated instantly)
+    $('#count-TCP').text(protoCounts.TCP);
+    $('#count-UDP').text(protoCounts.UDP);
+    $('#count-DNS').text(protoCounts.DNS);
+
+    if (protocolChart) {
+      protocolChart.data.datasets[0].data = [protoCounts.TCP, protoCounts.UDP, protoCounts.DNS, protoCounts.Other];
+      protocolChart.update('none'); // 'none' for smooth animation
+    }
+
+    const topSources = Object.entries(srcCounts).sort(([, a], [, b]) => b - a).slice(0, 5);
+    const ul = $("#top-sources").empty();
+    topSources.forEach(([ip, count]) => {
+      $("<li>").addClass("list-group-item d-flex justify-content-between align-items-center").html(`${ip} <span class="badge bg-primary rounded-pill">${count}</span>`).appendTo(ul);
+    });
+  }
+  
+  // This function processes all historical data once on load
+  function processHistoricalData(historicalPackets) {
+      historicalPackets.forEach(pkt => {
+        allPackets.push(pkt);
+        const proto = getProtocol(pkt);
+        if (protoCounts.hasOwnProperty(proto)) protoCounts[proto]++;
+        srcCounts[pkt.src] = (srcCounts[pkt.src] || 0) + 1;
+      });
+      
+      const rowsToAdd = allPackets.map(p => {
+        const time = new Date(p.timestamp * 1000).toLocaleTimeString();
+        return [time, p.src, p.dst, getProtocol(p), p.length || '-'];
+      });
+
+      table.rows.add(rowsToAdd).draw();
+      $('#count-All').text(allPackets.length);
+      updateHeavyVisuals(); // Update heavy visuals once after history is loaded
+  }
+
+  // --- INITIALIZATION AND DATA LOADING ---
+  initChart();
+  initDataTable();
+
+  fetch("/api/packets")
+    .then(r => r.ok ? r.json() : [])
+    .then(processHistoricalData)
+    .catch(err => console.error("Error loading history:", err));
+
+  // --- LIVE SOCKET.IO UPDATES ---
+  const socket = io();
+  socket.on('new_packet', pkt => {
+    // 1. Instantly update the in-memory data
+    allPackets.push(pkt);
+    const proto = getProtocol(pkt);
+    if (protoCounts.hasOwnProperty(proto)) protoCounts[proto]++;
+    srcCounts[pkt.src] = (srcCounts[pkt.src] || 0) + 1;
+
+    // 2. Instantly update the total count and add the row to the table
+    $('#count-All').text(allPackets.length);
+    const time = new Date(pkt.timestamp * 1000).toLocaleTimeString();
+    
+    // ** THIS IS THE BUG FIX **
+    // It was `p.length` before, which is undefined. It is now `pkt.length`.
+    const rowData = [time, pkt.src, pkt.dst, getProtocol(pkt), pkt.length || '-'];
+    table.row.add(rowData).draw(false);
+
+    // 3. Schedule a throttled update for the heavy visuals
+    if (!uiUpdateScheduled) {
+      uiUpdateScheduled = true;
+      setTimeout(() => {
+        updateHeavyVisuals();
+        uiUpdateScheduled = false;
+      }, UI_UPDATE_INTERVAL);
+    }
+  });
+
+  // --- EVENT HANDLERS ---
+  $("#packet-table tbody").on("click", "tr", function(){
+    const pkt = $(this).data('packet');
+    if (!pkt) return;
+    let html = '<ul class="list-group">';
+    Object.entries(pkt).forEach(([k,v])=> {
+      html += `<li class="list-group-item"><strong>${k}:</strong> ${v}</li>`;
+    });
+    html += '</ul>';
+    $("#packet-detail-body").html(html);
+    new bootstrap.Modal($("#packetDetailModal")).show();
+  });
+
+  $("#download-btn").on("click", () => {
+    if (!allPackets.length) {
+      return alert("No packet data to download.");
+    }
+    const ws = XLSX.utils.json_to_sheet(allPackets);
+    const wb = XLSX.utils.book_new();
+    XLSX.utils.book_append_sheet(wb, ws, "NetworkData");
+    const ts = new Date().toISOString().replace(/[:.]/g,"-");
+    const name = `network_data_${ts}.xlsx`;
+    XLSX.writeFile(wb, name);
+  });
+});

webpass/static/js/watchtower.js

@@ -0,0 +1,77 @@
+// static/js/watchtower.js
+
+const Watchtower = {
+    // 1. SHA-1 Hash (Required for HIBP API)
+    sha1: async (message) => {
+        const msgBuffer = new TextEncoder().encode(message);
+        const hashBuffer = await crypto.subtle.digest('SHA-1', msgBuffer);
+        const hashArray = Array.from(new Uint8Array(hashBuffer));
+        return hashArray.map(b => b.toString(16).padStart(2, '0')).join('').toUpperCase();
+    },
+
+    // 2. The Check Function
+    checkPassword: async (password) => {
+        if (!password) return 0;
+
+        // Hash it
+        const hash = await Watchtower.sha1(password);
+        const prefix = hash.substring(0, 5);
+        const suffix = hash.substring(5);
+
+        try {
+            // Ask our backend proxy
+            const res = await fetch(`/api/watchtower/pwned-check/${prefix}`);
+            const text = await res.text();
+
+            // Parse response (Suffix:Count)
+            // Example line: 0018A45C4D985303FC1:1
+            const lines = text.split('\n');
+            for (const line of lines) {
+                const [serverSuffix, count] = line.split(':');
+                if (serverSuffix.trim() === suffix) {
+                    return parseInt(count); // Found a match!
+                }
+            }
+            return 0; // No match found (Safe)
+        } catch (err) {
+            console.error("Watchtower Check Failed:", err);
+            return -1; // Error state
+        }
+    }
+};
+
+// Auto-hook into password fields
+document.addEventListener("DOMContentLoaded", () => {
+    const passInputs = document.querySelectorAll('input[type="password"].watchtower-monitor');
+    
+    passInputs.forEach(input => {
+        // Create the warning badge
+        const badge = document.createElement("div");
+        badge.className = "mt-1 small fw-bold d-none";
+        input.parentNode.appendChild(badge);
+
+        let timeout = null;
+        input.addEventListener("input", () => {
+            clearTimeout(timeout);
+            badge.classList.add("d-none");
+            
+            // Debounce to avoid spamming API while typing
+            timeout = setTimeout(async () => {
+                const val = input.value;
+                if (val.length < 4) return;
+
+                const count = await Watchtower.checkPassword(val);
+                
+                if (count > 0) {
+                    badge.innerHTML = `<i class="bi bi-exclamation-triangle-fill text-danger"></i> 
+                        <span class="text-danger">This password appears in ${count.toLocaleString()} known data breaches!</span>`;
+                    badge.classList.remove("d-none");
+                } else if (count === 0) {
+                    badge.innerHTML = `<i class="bi bi-shield-check text-success"></i> 
+                        <span class="text-success">No breaches found.</span>`;
+                    badge.classList.remove("d-none");
+                }
+            }, 500);
+        });
+    });
+});

webpass/static/js/zk_crypto.js

@@ -0,0 +1,91 @@
+// static/js/zk_crypto.js
+
+const ZKCrypto = {
+    // 1. Generate a random salt/IV
+    randomBytes: (len) => window.crypto.getRandomValues(new Uint8Array(len)),
+
+    // 2. Derive a robust AES-GCM Key from the Master Password
+    deriveKey: async (password, salt) => {
+        const enc = new TextEncoder();
+        const keyMaterial = await window.crypto.subtle.importKey(
+            "raw", enc.encode(password), { name: "PBKDF2" }, false, ["deriveKey"]
+        );
+        return window.crypto.subtle.deriveKey(
+            {
+                name: "PBKDF2",
+                salt: salt,
+                iterations: 100000, 
+                hash: "SHA-256"
+            },
+            keyMaterial,
+            { name: "AES-GCM", length: 256 },
+            false,
+            ["encrypt", "decrypt"]
+        );
+    },
+
+    // 3. Encrypt File (Zero Knowledge - Outputs raw bytes for .enc)
+    encryptFile: async (file, password) => {
+        const salt = ZKCrypto.randomBytes(16);
+        const iv = ZKCrypto.randomBytes(12);
+        const key = await ZKCrypto.deriveKey(password, salt);
+
+        // Read the file as an ArrayBuffer
+        const fileBuffer = await file.arrayBuffer();
+        
+        // Encrypt the file
+        const encrypted = await window.crypto.subtle.encrypt(
+            { name: "AES-GCM", iv: iv }, 
+            key, 
+            fileBuffer
+        );
+
+        // Pack the payload: [16 bytes Salt] + [12 bytes IV] + [Ciphertext]
+        const encryptedArray = new Uint8Array(encrypted);
+        const payload = new Uint8Array(16 + 12 + encryptedArray.byteLength);
+        
+        payload.set(salt, 0);
+        payload.set(iv, 16);
+        payload.set(encryptedArray, 28);
+
+        return payload; // vault.html wraps this in a Blob and downloads as .enc
+    },
+
+    // 4. Decrypt File (Reads .enc format)
+    decryptFile: async (encFile, password) => {
+        const payload = new Uint8Array(await encFile.arrayBuffer());
+
+        // A valid .enc file must be at least 28 bytes (Salt + IV)
+        if (payload.byteLength < 28) {
+            throw new Error("Invalid or corrupted file format.");
+        }
+
+        // Extract the Salt, IV, and Ciphertext
+        const salt = payload.slice(0, 16);
+        const iv = payload.slice(16, 28);
+        const ciphertext = payload.slice(28);
+
+        const key = await ZKCrypto.deriveKey(password, salt);
+
+        // Decrypt
+        const decryptedBuffer = await window.crypto.subtle.decrypt(
+            { name: "AES-GCM", iv: iv }, 
+            key, 
+            ciphertext
+        );
+
+        // Strip the ".enc" extension to restore the original file name
+        let originalName = encFile.name;
+        if (originalName.endsWith(".enc")) {
+            originalName = originalName.slice(0, -4);
+        }
+
+        return {
+            data: decryptedBuffer,
+            name: originalName
+        };
+    }
+};
+
+// Make it globally available for your HTML files
+window.ZKCrypto = ZKCrypto;

webpass/stego_utils.py

@@ -0,0 +1,165 @@
+from PIL import Image
+import io
+import json
+import base64
+from webpass.crypto_utils import generate_key, encrypt_password, decrypt_password
+
+# --- HELPER: BINARY CONVERSION ---
+def str_to_bin(message):
+    return ''.join(format(ord(c), '08b') for c in message)
+
+def bin_to_str(binary):
+    chars = [binary[i:i+8] for i in range(0, len(binary), 8)]
+    return ''.join(chr(int(c, 2)) for c in chars)
+
+# --- CORE LOGIC ---
+
+def encode_data(cover_image, data, password, filename=None):
+    """
+    Universal Encoder: Handles both TEXT and FILES.
+    1. Wraps data in a JSON payload.
+    2. Encrypts the JSON string.
+    3. Embeds into pixels.
+    """
+    # 1. Prepare Payload (JSON)
+    if filename:
+        # It's a file: Base64 encode the bytes first
+        b64_data = base64.b64encode(data.read()).decode('utf-8')
+        payload_dict = {
+            "type": "file",
+            "filename": filename,
+            "content": b64_data
+        }
+    else:
+        # It's text
+        payload_dict = {
+            "type": "text",
+            "content": data
+        }
+
+    # Convert to string
+    raw_payload = json.dumps(payload_dict)
+
+    # 2. Encrypt (AES-256)
+    static_salt = b'WebPass_Stego_Salt' 
+    key = generate_key(password, static_salt)
+    encrypted_payload = encrypt_password(raw_payload, key)
+
+    # 3. Add Delimiter
+    final_message = encrypted_secret = encrypted_payload + "#####END#####"
+    binary_message = str_to_bin(final_message)
+    data_len = len(binary_message)
+
+    # 4. Image Processing
+    img = Image.open(cover_image)
+    img = img.convert("RGB")
+    pixels = list(img.getdata())
+    
+    max_capacity = len(pixels) * 3
+    if data_len > max_capacity:
+        raise ValueError(f"File too large! Need {data_len} bits, image has {max_capacity}.")
+
+    new_pixels = []
+    idx = 0
+
+    for pixel in pixels:
+        if idx < data_len:
+            r, g, b = pixel
+            if idx < data_len:
+                r = int(format(r, '08b')[:-1] + binary_message[idx], 2)
+                idx += 1
+            if idx < data_len:
+                g = int(format(g, '08b')[:-1] + binary_message[idx], 2)
+                idx += 1
+            if idx < data_len:
+                b = int(format(b, '08b')[:-1] + binary_message[idx], 2)
+                idx += 1
+            new_pixels.append((r, g, b))
+        else:
+            new_pixels.append(pixel)
+
+    img.putdata(new_pixels)
+    
+    output = io.BytesIO()
+    img.save(output, format="PNG")
+    output.seek(0)
+    return output
+
+def decode_data(stego_image, password):
+    """
+    Universal Decoder.
+    Returns a dictionary: {"type": "text"|"file", "content": ..., "filename": ...}
+    """
+    img = Image.open(stego_image)
+    img = img.convert("RGB")
+    pixels = list(img.getdata())
+
+    binary_data = ""
+    encrypted_payload = ""
+
+    # 1. Extract Bits
+    # Optimization: We check for delimiter every 1000 pixels to avoid decoding massive images unnecessarily
+    count = 0
+    for pixel in pixels:
+        r, g, b = pixel
+        binary_data += format(r, '08b')[-1]
+        binary_data += format(g, '08b')[-1]
+        binary_data += format(b, '08b')[-1]
+        
+        count += 1
+        # Check every ~100 bytes (800 bits)
+        if count % 270 == 0: 
+            # Quick check on the tail
+            current_tail = binary_data[-800:] # rough check
+            # Full convert is expensive, so we do it partially or wait until we have enough
+            # For robustness, we check properly:
+            pass # (Skipping optimization for code clarity/stability)
+
+    # Full extraction (Stable approach)
+    # Note: In production, you'd stop reading once delimiter is found.
+    # For now, let's look for the delimiter in the binary stream logic.
+    # To save memory, we'll convert chunks.
+    
+    # RE-IMPLEMENTATION FOR SPEED:
+    # We will build the string character by character
+    chars = []
+    for i in range(0, len(binary_data), 8):
+        byte = binary_data[i:i+8]
+        if len(byte) < 8: break
+        char = chr(int(byte, 2))
+        chars.append(char)
+        if len(chars) > 13 and "".join(chars[-13:]) == "#####END#####":
+            encrypted_payload = "".join(chars[:-13])
+            break
+    
+    if not encrypted_payload:
+        raise ValueError("No hidden payload found.")
+
+    # 2. Decrypt
+    try:
+        static_salt = b'WebPass_Stego_Salt'
+        key = generate_key(password, static_salt)
+        json_payload = decrypt_password(encrypted_payload, key)
+    except:
+        raise ValueError("Incorrect password.")
+
+    # 3. Parse JSON
+    try:
+        data = json.loads(json_payload)
+        
+        if data['type'] == 'file':
+            # Decode the file bytes
+            file_bytes = base64.b64decode(data['content'])
+            return {
+                "type": "file",
+                "filename": data['filename'],
+                "file_bytes": io.BytesIO(file_bytes)
+            }
+        else:
+            return {
+                "type": "text",
+                "content": data['content']
+            }
+    except json.JSONDecodeError:
+        # Fallback for old legacy text-only stego images
+        return {"type": "text", "content": json_payload}

webpass/templates/base.html

@@ -0,0 +1,128 @@
+<!DOCTYPE html>
+<html lang="en" data-bs-theme="dark">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>{% block title %}WebPass{% endblock %}</title>
+    
+    <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;700&family=Inter:wght@300;400;600&display=swap" rel="stylesheet">
+    
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.0/font/bootstrap-icons.css">
+    
+    <link rel="stylesheet" href="https://cdn.datatables.net/1.13.6/css/dataTables.bootstrap5.min.css">
+    
+    <link rel="stylesheet" href="{{ url_for('static', filename='css/modern.css') }}">
+    
+    <script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
+    <script src="https://cdn.socket.io/4.6.0/socket.io.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js"></script>
+</head>
+<body>
+
+    <div class="d-flex" id="wrapper">
+        <div class="cyber-sidebar border-end" id="sidebar-wrapper">
+            <div class="sidebar-heading text-center py-4 primary-text fs-4 fw-bold text-uppercase border-bottom">
+                <i class="bi bi-shield-lock-fill me-2"></i>WebPass
+            </div>
+            <div class="list-group list-group-flush my-3">
+                <a href="{{ url_for('dashboard.dashboard') }}" class="list-group-item list-group-item-action bg-transparent second-text">
+                    <i class="bi bi-grid-1x2-fill me-2"></i>Dashboard
+                </a>
+
+                {% if has_credentials %}
+                <a href="{{ url_for('dashboard.secure_tools') }}" class="list-group-item list-group-item-action bg-transparent second-text">
+                    <i class="bi bi-safe2-fill me-2"></i>Zero-Know Vault
+                </a>
+                {% else %}
+                <a href="{{ url_for('dashboard.profile') }}" class="list-group-item list-group-item-action bg-transparent text-muted locked-link">
+                    <i class="bi bi-lock-fill me-2"></i>Zero-Know Vault
+                </a>
+                {% endif %}
+
+                {% if has_credentials %}
+                <a href="{{ url_for('share.share_ui') }}" class="list-group-item list-group-item-action bg-transparent second-text">
+                    <i class="bi bi-send-x-fill me-2"></i>Dead Drop
+                </a>
+                {% else %}
+                <a href="{{ url_for('dashboard.profile') }}" class="list-group-item list-group-item-action bg-transparent text-muted locked-link">
+                    <i class="bi bi-lock-fill me-2"></i>Dead Drop
+                </a>
+                {% endif %}
+                
+                {% if has_credentials %}
+                <a href="{{ url_for('stego.ui') }}" class="list-group-item list-group-item-action bg-transparent second-text">
+                    <i class="bi bi-eye-slash-fill me-2"></i>Steganography
+                </a>
+                {% else %}
+                <a href="{{ url_for('dashboard.profile') }}" class="list-group-item list-group-item-action bg-transparent text-muted locked-link">
+                    <i class="bi bi-eye-slash-fill me-2"></i>Steganography
+                </a>
+                {% endif %}
+
+                {% if has_credentials %}
+                <a href="{{ url_for('dashboard.network_monitor') }}" class="list-group-item list-group-item-action bg-transparent second-text">
+                    <i class="bi bi-activity me-2"></i>Net Monitor
+                </a>
+                {% else %}
+                <a href="{{ url_for('dashboard.profile') }}" class="list-group-item list-group-item-action bg-transparent text-muted locked-link">
+                    <i class="bi bi-lock-fill me-2"></i>Net Monitor
+                </a>
+                {% endif %}
+
+                <a href="{{ url_for('dashboard.profile') }}" class="list-group-item list-group-item-action bg-transparent second-text">
+                    <i class="bi bi-person-circle me-2"></i>Profile
+                </a>
+                
+                <a href="{{ url_for('auth.logout') }}" class="list-group-item list-group-item-action bg-transparent text-danger fw-bold mt-5 logout-btn">
+                    <i class="bi bi-box-arrow-left me-2"></i>Logout
+                </a>
+            </div>
+        </div>
+
+        <div id="page-content-wrapper">
+            <nav class="navbar navbar-expand-lg navbar-dark bg-transparent py-4 px-4">
+                <div class="d-flex align-items-center">
+                    <i class="bi bi-list fs-3 me-3 text-white" id="menu-toggle" style="cursor: pointer;"></i>
+                    <h2 class="fs-2 m-0 text-white fw-bold">{% block page_title %}{% endblock %}</h2>
+                </div>
+            </nav>
+
+            <div class="container-fluid px-4 pb-5">
+                {% with messages = get_flashed_messages(with_categories=true) %}
+                  {% if messages %}
+                    {% for category, message in messages %}
+                      <div class="alert alert-{{ category }} alert-dismissible fade show cyber-alert" role="alert">
+                        <i class="bi bi-info-circle-fill me-2"></i> {{ message }}
+                        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
+                      </div>
+                    {% endfor %}
+                  {% endif %}
+                {% endwith %}
+
+                {% block content %}{% endblock %}
+            </div>
+        </div>
+    </div>
+
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
+    
+    <script>
+        // Sidebar Toggle
+        var el = document.getElementById("wrapper");
+        var toggleButton = document.getElementById("menu-toggle");
+        toggleButton.onclick = function () {
+            el.classList.toggle("toggled");
+        };
+
+        // Active Link Highlighter
+        const currentPath = window.location.pathname;
+        document.querySelectorAll('.list-group-item').forEach(link => {
+            if(link.getAttribute('href') === currentPath) {
+                link.classList.add('active-link');
+            }
+        });
+    </script>
+    {% block scripts %}{% endblock %}
+</body>
+</html>

webpass/templates/bio_lock.html

@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>WebPass Locked</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.1/socket.io.js"></script>
+    
+    <style>
+        body { background-color: #121212; color: #ffffff; height: 100vh; display: flex; align-items: center; justify-content: center; font-family: 'Segoe UI', sans-serif; }
+        .lock-container { background: #1e1e1e; padding: 40px; border-radius: 20px; box-shadow: 0 0 30px rgba(0, 255, 136, 0.1); text-align: center; max-width: 400px; width: 100%; border: 1px solid #333; }
+        .qr-box { background: white; padding: 15px; border-radius: 10px; margin: 20px auto; width: fit-content; }
+        .status-text { color: #00ff88; margin-top: 15px; font-size: 0.9rem; min-height: 20px; }
+    </style>
+</head>
+<body>
+
+<div class="lock-container">
+    <h2 class="mb-3">Biometric Lock</h2>
+    <p class="text-muted">Scan to Unlock</p>
+    <div class="qr-box"><div id="qrcode"></div></div>
+    <div class="status-text" id="status">Waiting for device...</div>
+</div>
+
+<script>
+    var socket = io();
+    var channel = "{{ channel_id }}";
+    
+    socket.on('connect', function() {
+        socket.emit('join_channel', { channel: channel });
+    });
+
+    // --- THE FIX: DESKTOP CLAIMS SESSION ---
+    socket.on('unlock_command', function(data) {
+        document.getElementById('status').innerText = "Identity Verified! Logging in...";
+        
+        // Call the server to update THIS browser's session
+        fetch('/api/bio/finalize-login/' + channel)
+            .then(response => response.json())
+            .then(data => {
+                if (data.status === 'success') {
+                    window.location.href = data.redirect;
+                } else {
+                    console.error("Session update failed");
+                }
+            })
+            .catch(err => console.error(err));
+    });
+
+    new QRCode(document.getElementById("qrcode"), {
+        text: "{{ mobile_url }}",
+        width: 180,
+        height: 180
+    });
+</script>
+</body>
+</html>

webpass/templates/bio_mobile.html

@@ -0,0 +1,211 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
+    <title>Secure Login</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">
+    
+    <style>
+        body {
+            background-color: #0d0d0d;
+            color: #e0e0e0;
+            height: 100vh;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+        }
+        .auth-card {
+            background: #1a1a1a;
+            border: 1px solid #333;
+            border-radius: 24px;
+            padding: 2rem;
+            width: 90%;
+            max-width: 400px;
+            text-align: center;
+            box-shadow: 0 10px 30px rgba(0,0,0,0.5);
+            transition: transform 0.3s ease;
+        }
+        .btn-action {
+            width: 100%;
+            padding: 16px;
+            font-size: 1.1rem;
+            border-radius: 16px;
+            margin-top: 1.5rem;
+            font-weight: 600;
+            transition: all 0.2s;
+        }
+        .btn-auth {
+            background: linear-gradient(135deg, #00b09b, #96c93d);
+            border: none;
+            color: white;
+            box-shadow: 0 4px 15px rgba(0, 255, 136, 0.3);
+        }
+        .btn-auth:active { transform: scale(0.98); }
+        
+        .btn-reg {
+            background: linear-gradient(135deg, #4facfe, #00f2fe);
+            border: none;
+            color: white;
+            box-shadow: 0 4px 15px rgba(0, 168, 255, 0.3);
+        }
+        
+        .user-badge {
+            background: #2a2a2a;
+            padding: 8px 16px;
+            border-radius: 50px;
+            font-size: 0.9rem;
+            color: #aaa;
+            display: inline-block;
+            margin-bottom: 20px;
+        }
+        
+        .icon-box {
+            font-size: 3rem;
+            margin-bottom: 1rem;
+            color: #fff;
+        }
+        
+        .status-msg {
+            margin-top: 15px;
+            font-size: 0.9rem;
+            height: 24px;
+        }
+        .text-success-custom { color: #00ff88; }
+        .text-error-custom { color: #ff5555; }
+        
+        /* Utility to hide elements */
+        .d-none { display: none !important; }
+    </style>
+</head>
+<body>
+
+<div class="auth-card">
+    <div class="icon-box">
+        <i class="bi bi-shield-lock-fill"></i>
+    </div>
+    
+    <h3 class="mb-2">WebPass Secure</h3>
+    <div class="user-badge"><i class="bi bi-person-fill"></i> {{ user_email }}</div>
+    
+    <div id="section-auth" class="{% if not has_registered %}d-none{% endif %}">
+        <p class="text-muted small">Verify your identity to unlock your desktop.</p>
+        <button onclick="authenticate()" class="btn btn-action btn-auth">
+            <i class="bi bi-fingerprint me-2"></i> Authenticate
+        </button>
+    </div>
+
+    <div id="section-reg" class="{% if has_registered %}d-none{% endif %}">
+        <p class="text-muted small">Setup this device for secure login.</p>
+        <button onclick="register()" class="btn btn-action btn-reg">
+            <i class="bi bi-plus-circle-fill me-2"></i> Register Device
+        </button>
+    </div>
+
+    <div id="section-success" class="d-none">
+        <div class="text-success-custom" style="font-size: 4rem;">
+            <i class="bi bi-check-circle-fill"></i>
+        </div>
+        <h4 class="mt-3">Verified!</h4>
+        <p class="text-muted">Check your desktop screen.</p>
+    </div>
+
+    <div id="status" class="status-msg text-muted"></div>
+</div>
+
+<script src="https://unpkg.com/@simplewebauthn/browser/dist/bundle/index.umd.min.js"></script>
+<script>
+    const { startRegistration, startAuthentication } = SimpleWebAuthnBrowser;
+
+    // Extract Channel from URL path
+    const pathParts = window.location.pathname.split('/').filter(p => p.length > 0);
+    const CHANNEL_ID = pathParts[pathParts.length - 1];
+
+    function log(msg, type='normal') {
+        const el = document.getElementById('status');
+        el.innerText = msg;
+        if(type === 'error') el.className = 'status-msg text-error-custom';
+        else if(type === 'success') el.className = 'status-msg text-success-custom';
+        else el.className = 'status-msg text-muted';
+    }
+
+    async function register() {
+        log("Requesting setup...");
+        try {
+            const resp = await fetch('/api/bio/register/begin', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ channel: CHANNEL_ID }) 
+            });
+
+            if (!resp.ok) throw new Error("Server rejected setup request");
+            
+            const options = await resp.json();
+            const attResp = await startRegistration(options);
+
+            const verifyResp = await fetch('/api/bio/register/complete', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ response: attResp, channel: CHANNEL_ID })
+            });
+
+            const verifyJson = await verifyResp.json();
+            if (verifyJson.status === 'ok') {
+                log("Setup Complete!", "success");
+                
+                // UX: Switch to Auth Mode immediately
+                document.getElementById('section-reg').classList.add('d-none');
+                document.getElementById('section-auth').classList.remove('d-none');
+                
+                // Optional: Auto-trigger auth? Or let user click. 
+                // Let's let user click to be clear what happened.
+                alert("Registration Successful! Now click Authenticate to unlock.");
+            } else {
+                throw new Error("Verification failed");
+            }
+
+        } catch (error) {
+            log("Error: " + error.message, "error");
+        }
+    }
+
+    async function authenticate() {
+        log("Requesting verification...");
+        try {
+            const resp = await fetch('/api/bio/auth/begin', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ channel: CHANNEL_ID })
+            });
+
+            if (!resp.ok) throw new Error("Server rejected auth request");
+
+            const options = await resp.json();
+            const asseResp = await startAuthentication(options);
+
+            const verifyResp = await fetch('/api/bio/auth/complete', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ credentialId: asseResp.id, response: asseResp, channel: CHANNEL_ID })
+            });
+
+            const verifyJson = await verifyResp.json();
+            if (verifyJson.status === 'ok') {
+                // UX: Show Success Screen
+                document.getElementById('section-auth').classList.add('d-none');
+                document.getElementById('section-reg').classList.add('d-none');
+                document.getElementById('section-success').classList.remove('d-none');
+                log(""); // Clear status text
+            } else {
+                log("Authentication Failed", "error");
+            }
+
+        } catch (error) {
+            log("Error: " + error.message, "error");
+        }
+    }
+</script>
+</body>
+</html>

webpass/templates/breach.html

@@ -0,0 +1,91 @@
+{% extends "base.html" %}
+{% block title %}Breach Checker{% endblock %}
+{% block page_title %}OSINT Data Watch{% endblock %}
+
+{% block content %}
+<div class="row justify-content-center mt-5">
+    <div class="col-lg-6 fade-in-up">
+        <div class="cyber-card p-5">
+            <h3 class="text-danger mb-4 text-center"><i class="bi bi-shield-lock-fill me-2"></i>Have You Been Pwned?</h3>
+            <p class="text-muted text-center mb-4">
+                We search 11 Billion leaked records. Your password is <strong>never sent</strong> to us or the database (we use K-Anonymity Hashing).
+            </p>
+
+            <div class="mb-3">
+                <label class="form-label text-accent">Test Password</label>
+                <div class="input-group">
+                    <input type="password" id="pwInput" class="form-control" placeholder="Enter a password...">
+                    <button class="btn btn-outline-secondary" type="button" onclick="togglePw()">
+                        <i class="bi bi-eye"></i>
+                    </button>
+                </div>
+            </div>
+
+            <button class="btn btn-outline-danger w-100 py-3 mb-4" onclick="checkBreach()">
+                <i class="bi bi-search me-2"></i>Run OSINT Check
+            </button>
+
+            <div id="result-safe" class="d-none alert alert-success text-center fade-in-up">
+                <i class="bi bi-check-circle-fill fs-1"></i><br>
+                <strong>Safe!</strong><br>
+                This password was not found in any known data breaches.
+            </div>
+
+            <div id="result-leak" class="d-none alert alert-danger text-center fade-in-up">
+                <i class="bi bi-exclamation-octagon-fill fs-1"></i><br>
+                <strong>COMPROMISED!</strong><br>
+                This password appears in <span id="leak-count" class="fw-bold fs-4">0</span> known data breaches.<br>
+                Change it immediately.
+            </div>
+        </div>
+    </div>
+</div>
+{% endblock %}
+
+{% block scripts %}
+<script>
+function togglePw() {
+    const x = document.getElementById("pwInput");
+    x.type = x.type === "password" ? "text" : "password";
+}
+
+async function checkBreach() {
+    const pw = document.getElementById("pwInput").value;
+    if (!pw) return;
+
+    const btn = document.querySelector('button[onclick="checkBreach()"]');
+    const originalText = btn.innerHTML;
+    btn.innerHTML = '<span class="spinner-border spinner-border-sm"></span> Scanning Dark Web...';
+    btn.disabled = true;
+
+    try {
+        const res = await fetch("{{ url_for('tools.breach_check') }}", {
+            method: "POST",
+            headers: { 
+                "Content-Type": "application/json",
+                "X-CSRFToken": "{{ csrf_token() }}"
+            },
+            body: JSON.stringify({ password: pw })
+        });
+        
+        const data = await res.json();
+        
+        document.getElementById("result-safe").classList.add("d-none");
+        document.getElementById("result-leak").classList.add("d-none");
+
+        if (data.leaked) {
+            document.getElementById("leak-count").textContent = data.count.toLocaleString();
+            document.getElementById("result-leak").classList.remove("d-none");
+        } else {
+            document.getElementById("result-safe").classList.remove("d-none");
+        }
+
+    } catch (e) {
+        alert("System Error: " + e);
+    }
+
+    btn.innerHTML = originalText;
+    btn.disabled = false;
+}
+</script>
+{% endblock %}

webpass/templates/dashboard.html

@@ -0,0 +1,191 @@
+{% extends "base.html" %}
+{% block title %}Command Center{% endblock %}
+{% block page_title %}Dashboard{% endblock %}
+
+{% block content %}
+<div class="row g-4 mb-4">
+    <div class="col-md-3 fade-in-up" style="animation-delay: 0.1s;">
+        <div class="cyber-card p-3 d-flex justify-content-between align-items-center">
+            <div>
+                <h6 class="text-muted text-uppercase small">Identity</h6>
+                <h4 class="mb-0">{{ credential.username if credential else 'Guest' }}</h4>
+            </div>
+            <div class="bg-primary bg-opacity-10 p-3 rounded-circle">
+                <i class="bi bi-person-bounding-box fs-4 text-primary"></i>
+            </div>
+        </div>
+    </div>
+    
+    <div class="col-md-3 fade-in-up" style="animation-delay: 0.2s;">
+        <div class="cyber-card p-3 d-flex justify-content-between align-items-center">
+            <div>
+                <h6 class="text-muted text-uppercase small">System Status</h6>
+                <h4 class="mb-0 text-success">Online</h4>
+            </div>
+            <div class="bg-success bg-opacity-10 p-3 rounded-circle">
+                <i class="bi bi-cpu fs-4 text-success"></i>
+            </div>
+        </div>
+    </div>
+
+    <div class="col-md-3 fade-in-up" style="animation-delay: 0.3s;">
+        <div class="cyber-card p-3 d-flex justify-content-between align-items-center">
+            <div>
+                <h6 class="text-muted text-uppercase small">Encryption</h6>
+                <h4 class="mb-0">AES-GCM</h4>
+            </div>
+            <div class="bg-warning bg-opacity-10 p-3 rounded-circle">
+                <i class="bi bi-shield-check fs-4 text-warning"></i>
+            </div>
+        </div>
+    </div>
+
+    <div class="col-md-3 fade-in-up" style="animation-delay: 0.4s;">
+        <div class="cyber-card p-3 d-flex justify-content-between align-items-center">
+            <div>
+                <h6 class="text-muted text-uppercase small">Connection</h6>
+                <h4 class="mb-0">Secure</h4>
+            </div>
+            <div class="bg-danger bg-opacity-10 p-3 rounded-circle">
+                <i class="bi bi-wifi fs-4 text-danger"></i>
+            </div>
+        </div>
+    </div>
+</div>
+
+<div class="row g-4">
+    <div class="col-lg-8 fade-in-up" style="animation-delay: 0.5s;">
+        <div class="cyber-card h-100 p-4 border-start border-4 border-info">
+            <h4 class="mb-4 text-white"><i class="bi bi-grid-fill me-2 text-info"></i>Operations Grid</h4>
+            
+            <div class="row g-3">
+                <div class="col-md-4">
+                    {% if has_credentials %}
+                        <a href="{{ url_for('dashboard.secure_tools') }}" class="btn btn-outline-info w-100 py-4 d-flex flex-column align-items-center justify-content-center gap-2 h-100 border-2">
+                            <i class="bi bi-file-earmark-lock fs-1"></i> 
+                            <span class="fw-bold">File Vault</span>
+                        </a>
+                    {% else %}
+                        <a href="{{ url_for('dashboard.profile') }}" class="btn btn-dark w-100 py-4 d-flex flex-column align-items-center justify-content-center gap-2 h-100 border-secondary text-muted">
+                            <i class="bi bi-lock-fill fs-1"></i> 
+                            <span>Setup Vault</span>
+                        </a>
+                    {% endif %}
+                </div>
+
+                <div class="col-md-4">
+                    {% if has_credentials %}
+                        <a href="{{ url_for('share.share_ui') }}" class="btn btn-outline-warning w-100 py-4 d-flex flex-column align-items-center justify-content-center gap-2 h-100 border-2">
+                            <i class="bi bi-send-exclamation fs-1"></i> 
+                            <span class="fw-bold">Dead Drop</span>
+                        </a>
+                    {% else %}
+                        <button class="btn btn-dark w-100 py-4 d-flex flex-column align-items-center justify-content-center gap-2 h-100 border-secondary text-muted" disabled>
+                            <i class="bi bi-lock-fill fs-1"></i>
+                        </button>
+                    {% endif %}
+                </div>
+
+                <div class="col-md-4">
+                    {% if has_credentials %}
+                        <a href="{{ url_for('stego.ui') }}" class="btn btn-outline-success w-100 py-4 d-flex flex-column align-items-center justify-content-center gap-2 h-100 border-2">
+                            <i class="bi bi-eye-slash-fill fs-1"></i> 
+                            <span class="fw-bold">Steganography</span>
+                        </a>
+                    {% else %}
+                        <button class="btn btn-dark w-100 py-4 d-flex flex-column align-items-center justify-content-center gap-2 h-100 border-secondary text-muted" disabled>
+                            <i class="bi bi-lock-fill fs-1"></i>
+                        </button>
+                    {% endif %}
+                </div>
+
+                <div class="col-md-4 mt-3">
+                    {% if has_credentials %}
+                        <a href="{{ url_for('tools.metadata_ui') }}" class="btn btn-outline-light w-100 py-4 d-flex flex-column align-items-center justify-content-center gap-2 h-100 border-2">
+                            <i class="bi bi-eraser-fill fs-1"></i> 
+                            <span class="fw-bold">Ghost Wiper</span>
+                        </a>
+                    {% else %}
+                         <button class="btn btn-dark w-100 py-4 d-flex flex-column align-items-center justify-content-center gap-2 h-100 border-secondary text-muted" disabled>
+                            <i class="bi bi-lock-fill fs-1"></i>
+                        </button>
+                    {% endif %}
+                </div>
+
+                 <div class="col-md-4 mt-3">
+                    {% if has_credentials %}
+                        <a href="{{ url_for('tools.breach_ui') }}" class="btn btn-outline-danger w-100 py-4 d-flex flex-column align-items-center justify-content-center gap-2 h-100 border-2">
+                            <i class="bi bi-shield-lock-fill fs-1"></i> 
+                            <span class="fw-bold">Breach Check</span>
+                        </a>
+                    {% else %}
+                         <button class="btn btn-dark w-100 py-4 d-flex flex-column align-items-center justify-content-center gap-2 h-100 border-secondary text-muted" disabled>
+                            <i class="bi bi-lock-fill fs-1"></i>
+                        </button>
+                    {% endif %}
+                </div>
+                 
+                 <div class="col-md-4 mt-3">
+                    {% if has_credentials %}
+                        <a href="{{ url_for('dashboard.network_monitor') }}" class="btn btn-outline-primary w-100 py-4 d-flex flex-column align-items-center justify-content-center gap-2 h-100 border-2">
+                            <i class="bi bi-activity fs-1"></i> 
+                            <span class="fw-bold">Net Monitor</span>
+                        </a>
+                    {% else %}
+                         <button class="btn btn-dark w-100 py-4 d-flex flex-column align-items-center justify-content-center gap-2 h-100 border-secondary text-muted" disabled>
+                            <i class="bi bi-lock-fill fs-1"></i>
+                        </button>
+                    {% endif %}
+                </div>
+
+                <div class="col-12 mt-4">
+                    <label class="text-muted small mb-2 text-uppercase fw-bold">Quick Watchtower Check</label>
+                    <div class="input-group">
+                        <span class="input-group-text bg-dark border-secondary text-danger"><i class="bi bi-tower"></i></span>
+                        <input type="password" id="watchtower-input" class="form-control watchtower-monitor" placeholder="Test a password for leaks (k-Anonymity)...">
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    
+    <div class="col-lg-4 fade-in-up" style="animation-delay: 0.6s;">
+        <div class="cyber-card h-100 p-4">
+            <h4 class="mb-3 text-white">System Log</h4>
+            <div class="border-start border-secondary ps-3 ms-2">
+                <div class="mb-3">
+                    <small class="text-muted d-block">10:42:01 AM</small>
+                    <span class="text-success"><i class="bi bi-check-circle me-1"></i> Zero-Knowledge Engine Ready</span>
+                </div>
+                <div class="mb-3">
+                    <small class="text-muted d-block">10:42:05 AM</small>
+                    <span class="text-info"><i class="bi bi-database me-1"></i> Database Connected</span>
+                </div>
+                <div class="mb-3">
+                    <small class="text-muted d-block">10:42:06 AM</small>
+                    <span class="text-warning"><i class="bi bi-shield-exclamation me-1"></i> HIBP API Latency: 45ms</span>
+                </div>
+                 <div class="mb-3">
+                    <small class="text-muted d-block">10:42:08 AM</small>
+                    <span class="text-light"><i class="bi bi-eye-slash me-1"></i> Steganography Module Loaded</span>
+                </div>
+            </div>
+            
+            <div class="mt-4 pt-4 border-top border-secondary">
+                <small class="text-muted text-uppercase">Current Session</small>
+                <div class="d-flex align-items-center mt-2">
+                    <img src="{{ current_user.profile_image }}" class="rounded-circle me-3 border border-secondary" width="40" height="40">
+                    <div>
+                        <div class="text-white small fw-bold">{{ current_user.email }}</div>
+                        <div class="text-success x-small" style="font-size: 0.75rem;">● Active</div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+{% endblock %}
+
+{% block scripts %}
+<script src="{{ url_for('static', filename='js/watchtower.js') }}"></script>
+{% endblock %}

webpass/templates/index.html

@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <!-- Critical meta tag for mobile responsiveness -->
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>Home – Password Vault</title>
+  <!-- Bootstrap CSS -->
+  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet">
+</head>
+<body>
+  <!-- Navigation Bar -->
+  <nav class="navbar navbar-light bg-light">
+    <div class="container-fluid">
+      <span class="navbar-brand">Password Vault</span>
+      <a class="nav-link" href="{{ url_for('logout') }}">Logout</a>
+    </div>
+  </nav>
+  
+  <div class="container mt-4">
+    <h1>Welcome, {{ current_user.email }}!</h1>
+    <!-- Your home page content goes here -->
+  </div>
+  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js"></script>
+</body>
+</html>

webpass/templates/login.html

@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <title>Sign In – Password Vault</title>
+  <link rel="stylesheet" href="{{ url_for('static', filename='css/login.css') }}">
+  <script src="https://kit.fontawesome.com/your-kit-id.js" crossorigin="anonymous"></script>
+</head>
+<body>
+  <div class="container">
+    <div class="top"></div>
+    <div class="bottom"></div>
+    <div class="center">
+      <h2>Please Sign In</h2>
+
+      <!-- Only change: point at google.login so Flask-Dance redirects -->
+      <a href="{{ url_for('google.login') }}" class="google-btn">
+        <i class="fab fa-google me-2"></i>Sign in with Google
+      </a>
+    </div>
+  </div>
+</body>
+</html>

webpass/templates/metadata.html

@@ -0,0 +1,143 @@
+{% extends "base.html" %}
+{% block title %}Ghost Metadata Wiper{% endblock %}
+{% block page_title %}OpSec Imaging Station{% endblock %}
+
+{% block content %}
+<div class="row justify-content-center mt-4">
+    <div class="col-lg-8 fade-in-up">
+        <div class="cyber-card p-5 text-center">
+            <h3 class="text-info mb-4"><i class="bi bi-eraser-fill me-2"></i>Ghost Metadata Wiper</h3>
+            <p class="text-muted mb-4">
+                Advanced Forensic Scan. Detects hidden <strong>GPS Coordinates, Serial Numbers, and Timestamp</strong> data embedded by cameras and phones.
+            </p>
+
+            <div class="mb-4">
+                <input type="file" id="imageInput" class="form-control" accept="image/*">
+                <button class="btn btn-cyber mt-3 w-100 py-3" onclick="scanImage()">
+                    <i class="bi bi-upc-scan me-2"></i>Run Forensic Analysis
+                </button>
+            </div>
+
+            <div id="scan-animation" class="d-none my-4">
+                <div class="progress" style="height: 5px;">
+                    <div class="progress-bar progress-bar-striped progress-bar-animated bg-info" style="width: 100%"></div>
+                </div>
+                <small class="text-info blink-text">DECODING EXIF LAYERS...</small>
+            </div>
+
+            <div id="result-area" class="d-none text-start bg-dark border border-secondary p-3 rounded">
+                <div class="d-flex justify-content-between align-items-center mb-3">
+                    <h5 class="text-white mb-0">Scan Report</h5>
+                    <span id="threat-level" class="badge bg-secondary">Unknown</span>
+                </div>
+
+                <h6 class="text-danger text-uppercase small fw-bold mb-2"><i class="bi bi-shield-exclamation me-1"></i>Privacy Risks (Critical)</h6>
+                <ul id="critical-list" class="list-group list-group-flush mb-4 text-monospace small">
+                    </ul>
+
+                <h6 class="text-muted text-uppercase small fw-bold mb-2"><i class="bi bi-camera me-1"></i>Device Fingerprint (Technical)</h6>
+                <ul id="technical-list" class="list-group list-group-flush mb-3 text-monospace small text-muted">
+                    </ul>
+
+                <div id="clean-action" class="d-none text-center border-top border-secondary pt-3">
+                    <div class="alert alert-danger mb-3 border-danger bg-danger bg-opacity-10">
+                        <i class="bi bi-geo-alt-fill me-2"></i><strong>Location/Identity Data Found!</strong><br>
+                        This image reveals where and when it was taken.
+                    </div>
+                    <form action="{{ url_for('tools.metadata_wipe') }}" method="POST" enctype="multipart/form-data">
+                        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
+                        <p class="text-muted small">Upload again to confirm wipe & download safe copy.</p>
+                        <input type="file" name="image" class="form-control mb-2" required>
+                        <button type="submit" class="btn btn-success w-100 fw-bold">
+                            <i class="bi bi-shield-check me-2"></i>WIPE METADATA & DOWNLOAD
+                        </button>
+                    </form>
+                </div>
+                
+                <div id="clean-msg" class="d-none text-center mt-3">
+                    <div class="alert alert-success border-success bg-success bg-opacity-10">
+                        <i class="bi bi-check-circle-fill me-2"></i><strong>Clean.</strong><br> No hidden metadata found.
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+{% endblock %}
+
+{% block scripts %}
+<script>
+async function scanImage() {
+    const input = document.getElementById('imageInput');
+    if (input.files.length === 0) { alert("Select an image first."); return; }
+
+    document.getElementById('scan-animation').classList.remove('d-none');
+    document.getElementById('result-area').classList.add('d-none');
+
+    const formData = new FormData();
+    formData.append('image', input.files[0]);
+
+    try {
+        const res = await fetch("{{ url_for('tools.metadata_scan') }}", {
+            method: "POST",
+            body: formData,
+            headers: { "X-CSRFToken": "{{ csrf_token() }}" }
+        });
+        
+        const data = await res.json();
+        
+        document.getElementById('scan-animation').classList.add('d-none');
+        document.getElementById('result-area').classList.remove('d-none');
+        
+        const critList = document.getElementById('critical-list');
+        const techList = document.getElementById('technical-list');
+        critList.innerHTML = "";
+        techList.innerHTML = "";
+
+        if (data.status === 'clean') {
+            document.getElementById('clean-msg').classList.remove('d-none');
+            document.getElementById('clean-action').classList.add('d-none');
+            document.getElementById('threat-level').className = "badge bg-success";
+            document.getElementById('threat-level').textContent = "SAFE";
+            critList.innerHTML = "<li class='list-group-item bg-transparent text-muted'>No critical data found.</li>";
+        } else {
+            // Found Data!
+            document.getElementById('clean-msg').classList.add('d-none');
+            document.getElementById('clean-action').classList.remove('d-none');
+            document.getElementById('threat-level').className = "badge bg-danger blink-text";
+            document.getElementById('threat-level').textContent = "COMPROMISED";
+
+            // Fill Critical Data
+            if (Object.keys(data.data.critical).length > 0) {
+                for (const [key, val] of Object.entries(data.data.critical)) {
+                    let displayVal = val;
+                    // If it's a map link, make it clickable
+                    if (key === 'Map Link') {
+                        displayVal = `<a href="${val}" target="_blank" class="text-info text-decoration-none"><i class="bi bi-box-arrow-up-right me-1"></i>View on Google Maps</a>`;
+                    }
+                    const li = document.createElement('li');
+                    li.className = "list-group-item bg-transparent text-light border-secondary d-flex justify-content-between";
+                    li.innerHTML = `<span class="text-danger fw-bold">${key}</span> <span>${displayVal}</span>`;
+                    critList.appendChild(li);
+                }
+            } else {
+                 critList.innerHTML = "<li class='list-group-item bg-transparent text-muted'>None detected.</li>";
+            }
+
+            // Fill Technical Data
+            if (Object.keys(data.data.technical).length > 0) {
+                for (const [key, val] of Object.entries(data.data.technical)) {
+                    const li = document.createElement('li');
+                    li.className = "list-group-item bg-transparent text-muted border-secondary d-flex justify-content-between";
+                    li.innerHTML = `<span>${key}</span> <span class="text-light">${val}</span>`;
+                    techList.appendChild(li);
+                }
+            }
+        }
+    } catch (e) {
+        alert("Scan Error: " + e);
+        document.getElementById('scan-animation').classList.add('d-none');
+    }
+}
+</script>
+{% endblock %}

webpass/templates/network.html

@@ -0,0 +1,96 @@
+{% extends "base.html" %}
+{% block title %}Network Monitor{% endblock %}
+{% block page_title %}Network Traffic Analysis{% endblock %}
+
+{% block content %}
+<div class="row g-4 mt-2">
+    <div class="col-md-3 fade-in-up">
+        <div class="cyber-card p-3 text-center border-primary">
+            <h6 class="text-muted text-uppercase">Total Packets</h6>
+            <h2 class="text-white display-6 fw-bold" id="count-All">0</h2>
+        </div>
+    </div>
+    <div class="col-md-3 fade-in-up" style="animation-delay: 0.1s;">
+        <div class="cyber-card p-3 text-center border-info">
+            <h6 class="text-muted text-uppercase">TCP Traffic</h6>
+            <h2 class="text-info display-6 fw-bold" id="count-TCP">0</h2>
+        </div>
+    </div>
+    <div class="col-md-3 fade-in-up" style="animation-delay: 0.2s;">
+        <div class="cyber-card p-3 text-center border-warning">
+            <h6 class="text-muted text-uppercase">UDP Traffic</h6>
+            <h2 class="text-warning display-6 fw-bold" id="count-UDP">0</h2>
+        </div>
+    </div>
+    <div class="col-md-3 fade-in-up" style="animation-delay: 0.3s;">
+        <div class="cyber-card p-3 text-center border-danger">
+            <h6 class="text-muted text-uppercase">DNS Queries</h6>
+            <h2 class="text-danger display-6 fw-bold" id="count-DNS">0</h2>
+        </div>
+    </div>
+</div>
+
+<div class="row g-4 mt-3">
+    <div class="col-lg-4 fade-in-up" style="animation-delay: 0.4s;">
+        <div class="cyber-card p-4 h-100">
+            <h5 class="mb-4 text-accent">Protocol Distribution</h5>
+            <div style="height: 300px;">
+                <canvas id="protocolChart"></canvas>
+            </div>
+            <div class="mt-4">
+                <h6 class="text-muted mb-3">Top Talkers (Source IP)</h6>
+                <ul class="list-group list-group-flush" id="top-sources">
+                    <li class="list-group-item bg-transparent text-muted">Listening...</li>
+                </ul>
+            </div>
+        </div>
+    </div>
+
+    <div class="col-lg-8 fade-in-up" style="animation-delay: 0.5s;">
+        <div class="cyber-card p-4 h-100">
+            <div class="d-flex justify-content-between align-items-center mb-3">
+                <h5 class="text-white"><i class="bi bi-list-columns-reverse me-2"></i>Live Packet Feed</h5>
+                <button class="btn btn-sm btn-outline-success" id="download-btn">
+                    <i class="bi bi-download me-1"></i> Export Log
+                </button>
+            </div>
+            <div class="table-responsive">
+                <table id="packet-table" class="table table-dark table-hover table-sm w-100" style="font-size: 0.9rem;">
+                    <thead>
+                        <tr class="text-accent">
+                            <th>Time</th>
+                            <th>Source</th>
+                            <th>Destination</th>
+                            <th>Protocol</th>
+                            <th>Length</th>
+                        </tr>
+                    </thead>
+                    <tbody class="font-monospace">
+                        </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+</div>
+
+<div class="modal fade" id="packetDetailModal" tabindex="-1">
+    <div class="modal-dialog modal-dialog-centered">
+        <div class="cyber-card modal-content bg-dark text-white">
+            <div class="modal-header border-bottom border-secondary">
+                <h5 class="modal-title">Packet Inspection</h5>
+                <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
+            </div>
+            <div class="modal-body" id="packet-detail-body">
+                </div>
+        </div>
+    </div>
+</div>
+{% endblock %}
+
+{% block scripts %}
+<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
+<script src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>
+<script src="https://cdn.datatables.net/1.13.6/js/dataTables.bootstrap5.min.js"></script>
+<script src="https://cdn.sheetjs.com/xlsx-latest/package/dist/xlsx.full.min.js"></script>
+<script src="{{ url_for('static', filename='js/network.js') }}"></script>
+{% endblock %}

webpass/templates/network_demo.html

@@ -0,0 +1,27 @@
+{% extends "base.html" %}
+{% block title %}Network Monitor{% endblock %}
+{% block page_title %}Local Reconnaissance{% endblock %}
+
+{% block content %}
+<div class="row justify-content-center mt-5">
+    <div class="col-lg-8 fade-in-up">
+        <div class="cyber-card p-5 text-center border-danger">
+            <i class="bi bi-shield-lock-fill text-danger mb-3" style="font-size: 5rem;"></i>
+            <h2 class="text-white">Feature Locked in Cloud Environment</h2>
+            <p class="text-muted mt-3 fs-5">
+                The <strong>Hardware Network Monitor</strong> requires direct `root` access to the host machine's Network Interface Card (NIC) to sniff raw packets via Nmap and SocketIO.
+            </p>
+            <p class="text-muted">
+                Because this instance is deployed in a sandboxed Cloud Container (Hugging Face), hardware-level packet sniffing is disabled to comply with cloud security policies.
+            </p>
+            
+            <div class="alert alert-info mt-4 bg-dark border-info text-start d-inline-block">
+                <i class="bi bi-github me-2"></i><strong>Want to see it in action?</strong><br>
+                Clone the repository and run it locally with Administrator privileges:
+                <code class="d-block mt-2 text-success">git clone https://github.com/yourusername/webpass.git</code>
+                <code class="d-block text-success">python wsgi.py</code>
+            </div>
+        </div>
+    </div>
+</div>
+{% endblock %}

webpass/templates/profile.html

@@ -0,0 +1,69 @@
+{% extends "base.html" %}
+{% block title %}Profile{% endblock %}
+{% block page_title %}Identity Management{% endblock %}
+
+{% block content %}
+<div class="row justify-content-center mt-4">
+    <div class="col-md-6 fade-in-up">
+        <div class="cyber-card p-5 text-center h-100 border-info">
+            <div class="position-relative d-inline-block mb-4">
+                <img src="{{ current_user.profile_image }}" 
+                     class="rounded-circle border border-2 border-info shadow-lg" 
+                     style="width: 150px; height: 150px; object-fit: cover;">
+                <span class="position-absolute bottom-0 end-0 bg-success border border-dark rounded-circle p-2" title="Active"></span>
+            </div>
+            
+            <h3 class="text-white">{{ current_user.email }}</h3>
+            <p class="text-muted text-uppercase small letter-spacing-2">Authorized Operator</p>
+
+            <hr class="border-secondary my-4">
+
+            <form action="{{ url_for('dashboard.profile') }}" method="post" enctype="multipart/form-data">
+                <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
+                
+                <label class="form-label text-accent small fw-bold">UPDATE HOLOGRAM (AVATAR)</label>
+                <div class="input-group mb-3">
+                    <input type="file" name="avatar" class="form-control bg-dark border-secondary text-light" accept="image/*" required>
+                    <button class="btn btn-outline-info" type="submit"><i class="bi bi-upload"></i></button>
+                </div>
+            </form>
+            
+            {% if current_user.orig_profile_image and current_user.profile_image != current_user.orig_profile_image %}
+            <form action="{{ url_for('dashboard.remove_avatar') }}" method="post" class="mt-2">
+                <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
+                <button class="btn btn-sm btn-link text-danger text-decoration-none opacity-75 hover-opacity-100">
+                    <i class="bi bi-x-circle me-1"></i>Reset to Default
+                </button>
+            </form>
+            {% endif %}
+        </div>
+    </div>
+
+    <div class="col-md-6 fade-in-up" style="animation-delay: 0.1s;">
+        <div class="cyber-card p-5 h-100 border-success">
+            <h4 class="text-success mb-4"><i class="bi bi-shield-check me-2"></i>Security Clearance</h4>
+            
+            <div class="d-flex align-items-center mb-4">
+                <div class="bg-success bg-opacity-10 p-3 rounded me-3">
+                    <i class="bi bi-fingerprint fs-2 text-success"></i>
+                </div>
+                <div>
+                    <h5 class="mb-0 text-white">Biometric Lock</h5>
+                    <small class="text-muted">FIDO2 / WebAuthn Active</small>
+                </div>
+                <div class="ms-auto">
+                    <span class="badge bg-success">ENABLED</span>
+                </div>
+            </div>
+
+            <div class="alert alert-dark border border-secondary d-flex align-items-start">
+                <i class="bi bi-info-circle text-info me-3 mt-1"></i>
+                <div class="small text-muted">
+                    Your account is secured by <strong>Device Biometrics</strong>. 
+                    Passwords are no longer stored on this server. Access is granted solely via physical token verification (Phone/Key).
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+{% endblock %}

webpass/templates/share.html

@@ -0,0 +1,109 @@
+{% extends "base.html" %}
+{% block title %}Dead Drop{% endblock %}
+{% block page_title %}Secure Dead Drop{% endblock %}
+
+{% block content %}
+<div class="row justify-content-center mt-4">
+    <div class="col-lg-8 fade-in-up">
+        <div class="cyber-card p-5">
+            <div class="text-center mb-4">
+                <i class="bi bi-incognito fs-1 text-danger"></i>
+                <h3 class="mt-2">Self-Destructing Messages</h3>
+                <p class="text-muted">
+                    Create a one-time link. The message is encrypted in your browser, stored encrypted, and deleted immediately after viewing.
+                </p>
+            </div>
+
+            <form id="create-share-form">
+                <div class="mb-3">
+                    <label class="form-label text-accent">Secret Message</label>
+                    <textarea id="secret-text" class="form-control" rows="5" placeholder="Paste your password or secret key here..." required></textarea>
+                </div>
+                
+                <div class="mb-4">
+                    <label class="form-label text-accent">Self-Destruct View Time (Seconds)</label>
+                    <div class="input-group">
+                        <span class="input-group-text bg-dark border-secondary text-warning"><i class="bi bi-stopwatch"></i></span>
+                        <input type="number" id="view-time" class="form-control bg-dark text-white border-secondary" placeholder="e.g. 15" min="1" max="3600" required>
+                    </div>
+                    <small class="text-muted mt-1 d-block">Number of seconds the receiver has to read it before it wipes from their screen.</small>
+                </div>
+                
+                <button type="submit" class="btn btn-cyber w-100 py-3">
+                    <i class="bi bi-link-45deg me-2"></i>Generate Secure Link
+                </button>
+            </form>
+
+            <div id="result-area" class="d-none mt-4 p-3 border border-success rounded bg-dark">
+                <label class="fw-bold text-success mb-2">Your One-Time Link:</label>
+                <div class="input-group">
+                    <input type="text" id="share-link" class="form-control text-success font-monospace" readonly>
+                    <button class="btn btn-outline-success" onclick="copyLink()">Copy</button>
+                </div>
+                <div class="mt-2 text-danger small">
+                    <i class="bi bi-exclamation-triangle-fill"></i> Warning: If you close this tab, the link is lost forever.
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+{% endblock %}
+
+{% block scripts %}
+<script src="{{ url_for('static', filename='js/zk_crypto.js') }}"></script>
+<script>
+    document.getElementById("create-share-form").addEventListener("submit", async (e) => {
+    e.preventDefault();
+    
+    const password = Math.random().toString(36).slice(-10) + Math.random().toString(36).slice(-10);
+    const text = document.getElementById("secret-text").value;
+    const viewTime = document.getElementById("view-time").value;
+
+    const enc = new TextEncoder();
+    const salt = ZKCrypto.randomBytes(16);
+    const iv = ZKCrypto.randomBytes(12);
+    const key = await ZKCrypto.deriveKey(password, salt);
+    
+    const encryptedContent = await window.crypto.subtle.encrypt(
+        { name: "AES-GCM", iv: iv },
+        key,
+        enc.encode(text)
+    );
+
+    const b64Data = btoa(String.fromCharCode(...new Uint8Array(encryptedContent)));
+    const b64Salt = btoa(String.fromCharCode(...salt));
+    const b64Iv = btoa(String.fromCharCode(...iv));
+
+    const res = await fetch("/share/create", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({
+            ciphertext: b64Data,
+            iv: b64Iv,
+            salt: b64Salt,
+            ttl: 60, // Link valid for 1 hour by default before it expires
+            view_time: viewTime
+        })
+    });
+    
+    const data = await res.json();
+    
+    let finalUrl = "";
+    if (data.link) {
+        finalUrl = `${data.link}#${password}`;
+    } else {
+        finalUrl = `${window.location.origin}/share/v/${data.id}#${password}`;
+    }
+    
+    document.getElementById("share-link").value = finalUrl;
+    document.getElementById("result-area").classList.remove("d-none");
+});
+
+function copyLink() {
+    const copyText = document.getElementById("share-link");
+    copyText.select();
+    document.execCommand("copy");
+    alert("Link copied!");
+}
+</script>
+{% endblock %}

webpass/templates/share_error.html

@@ -0,0 +1,34 @@
+{% extends "base.html" %}
+{% block title %}Link Expired{% endblock %}
+{% block page_title %}Dead Drop Protocol{% endblock %}
+
+{% block content %}
+<div class="row justify-content-center mt-5">
+    <div class="col-md-6 fade-in-up">
+        <div class="cyber-card p-5 text-center border-danger">
+            <div class="mb-4">
+                <i class="bi bi-x-octagon-fill text-danger" style="font-size: 4rem;"></i>
+            </div>
+            
+            <h3 class="text-white mb-3">Link Terminated</h3>
+            <p class="text-muted fs-5 mb-4">
+                {{ message }}
+            </p>
+            
+            <div class="alert alert-danger bg-opacity-10 border border-danger text-danger mb-4">
+                <i class="bi bi-shield-x me-2"></i>
+                This data has been permanently incinerated from the server.
+            </div>
+
+            <div class="d-grid gap-3">
+                <a href="{{ url_for('share.share_ui') }}" class="btn btn-cyber">
+                    <i class="bi bi-plus-circle me-2"></i>Create New Drop
+                </a>
+                <a href="{{ url_for('dashboard.dashboard') }}" class="btn btn-outline-secondary">
+                    Back to Dashboard
+                </a>
+            </div>
+        </div>
+    </div>
+</div>
+{% endblock %}

webpass/templates/share_view.html

@@ -0,0 +1,129 @@
+{% extends "base.html" %}
+{% block title %}Secure Message{% endblock %}
+{% block page_title %}Dead Drop Protocol{% endblock %}
+
+{% block content %}
+<div class="row justify-content-center mt-5">
+    <div class="col-lg-6 fade-in-up">
+        <div class="cyber-card p-5 text-center">
+            
+            <div id="locked-state">
+                <div class="mb-4 position-relative d-inline-block">
+                    <i class="bi bi-file-earmark-lock2-fill text-warning" style="font-size: 4rem;"></i>
+                    <span class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-danger">
+                        1 View Left
+                    </span>
+                </div>
+                
+                <h3 class="text-white mb-3">Encrypted Transmission</h3>
+                <p class="text-muted mb-4">
+                    This message is stored in a Zero-Knowledge Vault. 
+                    Once you reveal it, it will be <strong>permanently deleted</strong> from the server and a self-destruct timer will begin.
+                </p>
+                
+                <button id="reveal-btn" class="btn btn-warning w-100 py-3 fw-bold">
+                    <i class="bi bi-eye-fill me-2"></i>Reveal Secret Message
+                </button>
+            </div>
+
+            <div id="unlocked-state" class="d-none text-start">
+                <div class="d-flex align-items-center mb-3">
+                    <i class="bi bi-unlock-fill text-success fs-2 me-3"></i>
+                    <h4 class="m-0 text-success">Decryption Successful</h4>
+                </div>
+                
+                <div class="alert alert-warning border-warning bg-warning bg-opacity-10 d-flex justify-content-between align-items-center mb-4">
+                    <div class="text-warning">
+                        <i class="bi bi-stopwatch fs-4 me-2"></i> <strong>Self-Destructing in:</strong>
+                    </div>
+                    <div id="countdown-timer" class="fs-1 fw-bold text-danger font-monospace">--</div>
+                </div>
+
+                <label class="small text-muted text-uppercase fw-bold">Message Contents:</label>
+                <div class="p-4 bg-dark border border-success rounded mt-2 position-relative">
+                    <code id="secret-content" class="text-white fs-5" style="word-break: break-all;"></code>
+                    <button class="btn btn-sm btn-outline-success position-absolute top-0 end-0 m-2" onclick="copySecret()">
+                        Copy
+                    </button>
+                </div>
+            </div>
+            
+            <div id="error-state" class="d-none">
+                <i class="bi bi-x-octagon-fill text-danger mb-3" style="font-size: 4rem;"></i>
+                <h3 class="text-danger">Access Denied</h3>
+                <p class="text-muted" id="error-msg"></p>
+                <a href="{{ url_for('share.share_ui') }}" class="btn btn-outline-light mt-3">Create New Drop</a>
+            </div>
+        </div>
+    </div>
+</div>
+
+<script src="{{ url_for('static', filename='js/zk_crypto.js') }}"></script>
+<script>
+    function copySecret() {
+        const text = document.getElementById("secret-content").innerText;
+        navigator.clipboard.writeText(text);
+        alert("Copied to clipboard!");
+    }
+
+    document.getElementById("reveal-btn").addEventListener("click", async () => {
+        const btn = document.getElementById("reveal-btn");
+        btn.disabled = true;
+        btn.innerHTML = '<span class="spinner-border spinner-border-sm me-2"></span>Decrypting...';
+
+        try {
+            const keyFromHash = window.location.hash.substring(1);
+            if (!keyFromHash) throw new Error("Decryption key missing. The link is incomplete.");
+
+            const dropId = "{{ drop_id }}";
+            const res = await fetch(`/api/share/${dropId}`, { method: "POST" });
+            
+            if (res.status === 410 || res.status === 404) {
+                throw new Error("This message has expired or has already been viewed.");
+            }
+            if (!res.ok) throw new Error("Server communication error.");
+            
+            const data = await res.json();
+
+            const key = await ZKCrypto.deriveKey(keyFromHash, Uint8Array.from(atob(data.salt), c => c.charCodeAt(0)));
+            const iv = Uint8Array.from(atob(data.iv), c => c.charCodeAt(0));
+            const encrypted = Uint8Array.from(atob(data.ciphertext), c => c.charCodeAt(0));
+
+            const decryptedBuf = await window.crypto.subtle.decrypt(
+                { name: "AES-GCM", iv: iv },
+                key,
+                encrypted
+            );
+
+            const dec = new TextDecoder();
+            const plainText = dec.decode(decryptedBuf);
+
+            document.getElementById("locked-state").classList.add("d-none");
+            document.getElementById("secret-content").textContent = plainText;
+            document.getElementById("unlocked-state").classList.remove("d-none");
+
+            // --- START COUNTDOWN TIMER ---
+            let timeLeft = data.view_time || 30; // Default fallback
+            const timerDisplay = document.getElementById("countdown-timer");
+            timerDisplay.textContent = timeLeft + "s";
+
+            const timerInterval = setInterval(() => {
+                timeLeft--;
+                timerDisplay.textContent = timeLeft + "s";
+                
+                if (timeLeft <= 0) {
+                    clearInterval(timerInterval);
+                    // Timer hit 0. Force page reload.
+                    // Because data is burned on server, reload will show 'Link Terminated'.
+                    window.location.reload(true); 
+                }
+            }, 1000);
+
+        } catch (err) {
+            document.getElementById("locked-state").classList.add("d-none");
+            document.getElementById("error-msg").textContent = err.message;
+            document.getElementById("error-state").classList.remove("d-none");
+        }
+    });
+</script>
+{% endblock %}

webpass/templates/stego.html

@@ -0,0 +1,99 @@
+{% extends "base.html" %}
+{% block title %}Universal Steganography{% endblock %}
+{% block page_title %}Covert Ops Station{% endblock %}
+
+{% block content %}
+<div class="row g-4 mt-2">
+    <div class="col-md-6 fade-in-up">
+        <div class="cyber-card p-4 h-100 border-info">
+            <h3 class="text-info mb-3"><i class="bi bi-eye-slash-fill me-2"></i>Hide Data</h3>
+            <p class="text-muted small">
+                Embed secure data into any Image file.
+            </p>
+
+            <ul class="nav nav-tabs border-secondary mb-3" id="hideTabs" role="tablist">
+                <li class="nav-item" role="presentation">
+                    <button class="nav-link active text-info bg-dark border-secondary" id="text-tab" data-bs-toggle="tab" data-bs-target="#text-pane" type="button" onclick="setMode('text')">Text</button>
+                </li>
+                <li class="nav-item" role="presentation">
+                    <button class="nav-link text-info bg-dark border-secondary" id="file-tab" data-bs-toggle="tab" data-bs-target="#file-pane" type="button" onclick="setMode('file')">File</button>
+                </li>
+            </ul>
+
+            <form action="{{ url_for('stego.hide') }}" method="POST" enctype="multipart/form-data">
+                <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
+                <input type="hidden" name="mode" id="stego-mode" value="text">
+                
+                <div class="mb-3">
+                    <label class="form-label text-accent">1. Cover Image (Container)</label>
+                    <input type="file" name="cover_image" class="form-control" accept=".png, .jpg, .jpeg" required>
+                </div>
+                
+                <div class="tab-content mb-3" id="hideTabsContent">
+                    <div class="tab-pane fade show active" id="text-pane">
+                        <label class="form-label text-accent">2. Secret Text</label>
+                        <textarea name="secret_text" class="form-control" rows="3" placeholder="Enter sensitive data..."></textarea>
+                    </div>
+                    <div class="tab-pane fade" id="file-pane">
+                        <label class="form-label text-accent">2. Secret File</label>
+                        <input type="file" name="secret_file" class="form-control">
+                        <div class="form-text text-warning"><i class="bi bi-exclamation-triangle"></i> Large files require very large cover images!</div>
+                    </div>
+                </div>
+
+                <div class="mb-3">
+                    <label class="form-label text-accent">3. Password</label>
+                    <input type="password" name="stego_password" class="form-control watchtower-monitor" placeholder="Required for encryption" required>
+                </div>
+
+                <button type="submit" class="btn btn-cyber w-100">
+                    <i class="bi bi-magic me-2"></i>Encrypt & Embed
+                </button>
+            </form>
+        </div>
+    </div>
+
+    <div class="col-md-6 fade-in-up" style="animation-delay: 0.2s;">
+        <div class="cyber-card p-4 h-100 border-warning">
+            <h3 class="text-warning mb-3"><i class="bi bi-search me-2"></i>Reveal Data</h3>
+            <p class="text-muted small">
+                Extracts hidden text OR files automatically.
+            </p>
+
+            <form action="{{ url_for('stego.reveal') }}" method="POST" enctype="multipart/form-data">
+                <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
+                
+                <div class="mb-3">
+                    <label class="form-label text-warning">Stego Image (.png)</label>
+                    <input type="file" name="stego_image" class="form-control" accept=".png" required>
+                </div>
+
+                <div class="mb-3">
+                    <label class="form-label text-warning">Password</label>
+                    <input type="password" name="stego_password" class="form-control" placeholder="Enter original password" required>
+                </div>
+
+                <button type="submit" class="btn btn-outline-warning w-100">
+                    <i class="bi bi-eye me-2"></i>Scan & Decrypt
+                </button>
+            </form>
+
+            {% if revealed_secret %}
+                <div class="mt-4 p-3 bg-dark border border-success rounded position-relative fade-in-up">
+                    <label class="small text-muted text-uppercase mb-1">Decrypted Payload:</label>
+                    <code class="text-success d-block fs-5" style="word-break: break-all;">{{ revealed_secret }}</code>
+                </div>
+            {% endif %}
+        </div>
+    </div>
+</div>
+{% endblock %}
+
+{% block scripts %}
+<script>
+    function setMode(mode) {
+        document.getElementById('stego-mode').value = mode;
+    }
+</script>
+<script src="{{ url_for('static', filename='js/watchtower.js') }}"></script>
+{% endblock %}

webpass/templates/vault.html

@@ -0,0 +1,114 @@
+{% extends "base.html" %}
+{% block title %}Vault{% endblock %}
+{% block page_title %}Zero-Knowledge Vault{% endblock %}
+
+{% block content %}
+<div class="row g-4 mt-2">
+    <div class="col-md-6 fade-in-up">
+        <div class="cyber-card p-4 h-100">
+            <h3 class="text-info"><i class="bi bi-lock-fill"></i> Encrypt</h3>
+            <p class="text-muted">Encrypts files locally using AES-GCM-256. The server never sees the key.</p>
+            <form id="zk-encrypt-form" class="mt-4">
+                <input type="file" id="enc-file" class="form-control mb-3" required>
+                <input type="password" id="enc-pass" class="form-control mb-3" placeholder="Set a unique password" required>
+                <button type="submit" class="btn btn-cyber w-100" id="btn-encrypt">Encrypt & Download</button>
+            </form>
+            <div id="enc-status" class="mt-3"></div>
+        </div>
+    </div>
+
+    <div class="col-md-6 fade-in-up" style="animation-delay: 0.2s;">
+        <div class="cyber-card p-4 h-100" style="border-color: rgba(255, 193, 7, 0.3);">
+            <h3 class="text-warning"><i class="bi bi-unlock-fill"></i> Decrypt</h3>
+            <p class="text-muted">Decrypts .enc files created by this vault.</p>
+            <form id="zk-decrypt-form" class="mt-4">
+                <input type="file" id="dec-file" class="form-control mb-3" accept=".enc" required>
+                <input type="password" id="dec-pass" class="form-control mb-3" placeholder="Enter the password" required>
+                <button type="submit" class="btn btn-outline-warning w-100" id="btn-decrypt">Decrypt & Restore</button>
+            </form>
+            <div id="dec-status" class="mt-3"></div>
+        </div>
+    </div>
+{% endblock %}
+
+{% block scripts %}
+<script src="{{ url_for('static', filename='js/zk_crypto.js') }}"></script>
+<script>
+    document.getElementById("zk-encrypt-form").addEventListener("submit", async (e) => {
+        e.preventDefault();
+        const btn = document.getElementById("btn-encrypt");
+        const status = document.getElementById("enc-status");
+        
+        try {
+            btn.disabled = true;
+            btn.textContent = "Processing...";
+            status.innerHTML = '<span class="text-info"><i class="spinner-border spinner-border-sm"></i> Encrypting...</span>';
+            
+            const file = document.getElementById("enc-file").files[0];
+            const pass = document.getElementById("enc-pass").value;
+            
+            // 1. Get raw encrypted data
+            const rawEncryptedData = await ZKCrypto.encryptFile(file, pass, "000");
+            
+            // 2. THE FIX: Wrap it in a Blob
+            const blob = new Blob([rawEncryptedData], { type: "application/octet-stream" });
+            
+            // 3. Create download link safely
+            const url = URL.createObjectURL(blob);
+            const a = document.createElement("a");
+            a.href = url;
+            a.download = file.name + ".enc"; // Changed to .enc to differentiate from standard zip
+            document.body.appendChild(a);
+            a.click();
+            document.body.removeChild(a);
+            URL.revokeObjectURL(url);
+
+            status.innerHTML = '<span class="text-success fw-bold"><i class="bi bi-check-circle"></i> Success! Download started.</span>';
+        } catch (err) {
+            status.innerHTML = `<span class="text-danger"><i class="bi bi-exclamation-triangle"></i> Error: ${err.message}</span>`;
+        } finally {
+            btn.disabled = false;
+            btn.textContent = "Encrypt & Download";
+        }
+    });
+
+    document.getElementById("zk-decrypt-form").addEventListener("submit", async (e) => {
+        e.preventDefault();
+        const btn = document.getElementById("btn-decrypt");
+        const status = document.getElementById("dec-status");
+
+        try {
+            btn.disabled = true;
+            btn.textContent = "Processing...";
+            status.innerHTML = '<span class="text-warning"><i class="spinner-border spinner-border-sm"></i> Decrypting...</span>';
+            
+            const file = document.getElementById("dec-file").files[0];
+            const pass = document.getElementById("dec-pass").value;
+            
+            // 1. Decrypt to get the raw data
+            const result = await ZKCrypto.decryptFile(file, pass);
+            
+            // 2. THE FIX: Wrap decrypted data in a Blob
+            const blob = new Blob([result.data], { type: "application/octet-stream" });
+            
+            // 3. Create download link safely
+            const url = URL.createObjectURL(blob);
+            const a = document.createElement("a");
+            a.href = url;
+            a.download = result.name || "decrypted_file";
+            document.body.appendChild(a);
+            a.click();
+            document.body.removeChild(a);
+            URL.revokeObjectURL(url);
+
+            status.innerHTML = '<span class="text-success fw-bold"><i class="bi bi-check-circle"></i> Success! File restored.</span>';
+        } catch (err) {
+            console.error(err);
+            status.innerHTML = '<span class="text-danger"><i class="bi bi-exclamation-triangle"></i> Decryption Failed. Wrong password or file.</span>';
+        } finally {
+            btn.disabled = false;
+            btn.textContent = "Decrypt & Restore";
+        }
+    });
+</script>
+{% endblock %}

webpass/templates/verify_otp.html

@@ -0,0 +1,43 @@
+{% extends "base.html" %}
+{% block title %}Verify Identity{% endblock %}
+{% block page_title %}Security Checkpoint{% endblock %}
+
+{% block content %}
+<div class="row justify-content-center mt-5">
+    <div class="col-md-5 fade-in-up">
+        <div class="cyber-card p-5 border-primary">
+            <div class="text-center mb-4">
+                <i class="bi bi-shield-lock-fill text-primary" style="font-size: 3rem;"></i>
+                <h3 class="mt-3">Two-Factor Auth</h3>
+                <p class="text-muted">
+                    An OTP has been sent to your email for <span class="text-white">{{ feature }}</span>.
+                </p>
+            </div>
+
+            <form method="POST">
+                <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
+                <div class="mb-4">
+                    <label class="form-label text-accent small text-uppercase fw-bold">Enter One-Time Code</label>
+                    <input type="text" 
+                           name="otp" 
+                           class="form-control form-control-lg text-center font-monospace fs-2 border-primary"
+                           placeholder="000000" 
+                           maxlength="6" 
+                           pattern="\d{6}" 
+                           autofocus
+                           required>
+                </div>
+                
+                <div class="d-grid gap-2">
+                    <button type="submit" class="btn btn-cyber py-3">
+                        <i class="bi bi-fingerprint me-2"></i>Verify Identity
+                    </button>
+                    <a href="{{ url_for('dashboard.dashboard') }}" class="btn btn-outline-secondary btn-sm mt-2">
+                        Cancel Action
+                    </a>
+                </div>
+            </form>
+        </div>
+    </div>
+</div>
+{% endblock %}

wsgi.py

@@ -0,0 +1,44 @@
+import os
+import sys
+from collections import deque
+# REMOVED: ProxyFix (We don't need it for Localhost login)
+
+# Allow OAuth over HTTP
+os.environ['OAUTHLIB_INSECURE_TRANSPORT'] = '1'
+
+from webpass import create_app, socketio 
+from webpass.network_monitor import start_packet_capture
+from scapy.all import conf
+
+app = create_app()
+
+# REMOVED: app.wsgi_app = ProxyFix(...) 
+# We are back to standard local running.
+
+app.captured_packets = deque(maxlen=1000)
+
+@socketio.on('connect')
+def handle_connect():
+    print(" [+] Client connected to Live Feed")
+
+def get_best_interface():
+    try:
+        iface = conf.iface
+        print(f" [*] Auto-detected best interface: {iface}")
+        return iface
+    except Exception as e:
+        print(f" [!] Error detecting interface: {e}")
+        return None
+
+if __name__ == '__main__':
+    print("--- WEBPASS SECURITY SERVER STARTING ---")
+    target_interface = get_best_interface()
+    
+    if target_interface:
+        print(f" [+] Launching Packet Sniffer on: {target_interface}")
+        start_packet_capture(app, socketio, interface=target_interface)
+
+    print(" [+] Server running on http://127.0.0.1:5000")
+    print("--------------------------------------------")
+    
+    socketio.run(app, host='127.0.0.1', port=5000, debug=True, use_reloader=False)