Demo Role
4 permissions active

Guided Security Tour

Secure

Step through each security layer. Learn why each measure exists, what it prevents, and what happens in failure scenarios. Click any step to expand it.

Why It Matters

Even with HTTPS, servers could log request bodies, be compromised, or have buggy code. Client-side encryption means the server only ever receives ciphertext - your SSN is unreadable by the application code itself.

What Happens

When you type an SSN and click away, the browser runs AES-256-GCM encryption using the Web Crypto API. The plaintext is immediately wiped from React state. Only the ciphertext is sent over the network.

What Happens If...

Correct SSN enteredAllowed

Encrypted client-side → stored as ciphertext → only masked value shown

Server gets compromisedBlocked

Attacker sees only ciphertext. DEK is separate from data. Double-encrypted.

Network traffic interceptedBlocked

Layer 2 (HTTPS) + Layer 3 (AES-GCM) both broken before this matters

🛡

Ready to see it live?

Each layer is demonstrated in the interactive demo pages. Try submitting a real (fake) SSN and watch the encryption happen in real time.