Hybrid Cryptography Diagrams<\/title>\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n \n body {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n padding: 20px;\n min-height: 100vh;\n }\n \n .container {\n max-width: 1400px;\n margin: 0 auto;\n }\n \n h1 {\n text-align: center;\n color: white;\n margin-bottom: 30px;\n font-size: 2.5em;\n text-shadow: 2px 2px 4px rgba(0,0,0,0.3);\n }\n \n .diagram-section {\n background: white;\n border-radius: 15px;\n padding: 30px;\n margin-bottom: 30px;\n box-shadow: 0 10px 30px rgba(0,0,0,0.3);\n }\n \n .diagram-title {\n font-size: 1.8em;\n color: #667eea;\n margin-bottom: 20px;\n border-bottom: 3px solid #667eea;\n padding-bottom: 10px;\n }\n \n .diagram-container {\n margin: 20px 0;\n padding: 20px;\n background: #f8f9fa;\n border-radius: 10px;\n overflow-x: auto;\n }\n \n svg {\n max-width: 100%;\n height: auto;\n }\n \n .legend {\n display: flex;\n flex-wrap: wrap;\n gap: 20px;\n margin-top: 20px;\n padding: 15px;\n background: #e9ecef;\n border-radius: 8px;\n }\n \n .legend-item {\n display: flex;\n align-items: center;\n gap: 8px;\n }\n \n .legend-color {\n width: 30px;\n height: 20px;\n border-radius: 4px;\n border: 1px solid #999;\n }\n \n .tabs {\n display: flex;\n gap: 10px;\n margin-bottom: 20px;\n border-bottom: 2px solid #dee2e6;\n }\n \n .tab {\n padding: 12px 24px;\n background: #e9ecef;\n border: none;\n border-radius: 8px 8px 0 0;\n cursor: pointer;\n font-size: 1.1em;\n transition: all 0.3s;\n }\n \n .tab:hover {\n background: #dee2e6;\n }\n \n .tab.active {\n background: #667eea;\n color: white;\n }\n \n .tab-content {\n display: none;\n }\n \n .tab-content.active {\n display: block;\n }\n \n .note {\n background: #fff3cd;\n border-left: 4px solid #ffc107;\n padding: 15px;\n margin: 15px 0;\n border-radius: 4px;\n }\n \n .code-block {\n background: #2d2d2d;\n color: #f8f8f2;\n padding: 15px;\n border-radius: 8px;\n overflow-x: auto;\n font-family: 'Courier New', monospace;\n margin: 15px 0;\n }\n \n @media (max-width: 768px) {\n h1 {\n font-size: 1.8em;\n }\n .diagram-title {\n font-size: 1.4em;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"container\">\n\n \n <div class=\"diagram-section\">\n <h2 class=\"diagram-title\">1\ufe0f\u20e3 Hybrid Cryptography Overview<\/h2>\n <div class=\"diagram-container\">\n <svg viewBox=\"0 0 1200 600\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n \n <rect width=\"1200\" height=\"600\" fill=\"#f8f9fa\"\/>\n \n \n <g id=\"sender\">\n <rect x=\"50\" y=\"50\" width=\"500\" height=\"500\" fill=\"#e3f2fd\" stroke=\"#1976d2\" stroke-width=\"3\" rx=\"10\"\/>\n <text x=\"300\" y=\"90\" text-anchor=\"middle\" font-size=\"24\" font-weight=\"bold\" fill=\"#1976d2\">SENDER<\/text>\n \n \n <rect x=\"100\" y=\"120\" width=\"400\" height=\"80\" fill=\"#fff\" stroke=\"#1976d2\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"300\" y=\"150\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Step 1: Generate Session Key<\/text>\n <text x=\"300\" y=\"175\" text-anchor=\"middle\" font-size=\"14\">session_key = RANDOM(32 bytes)<\/text>\n \n \n <rect x=\"100\" y=\"220\" width=\"400\" height=\"100\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"300\" y=\"245\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Step 2: Asymmetric Encryption<\/text>\n <text x=\"300\" y=\"270\" text-anchor=\"middle\" font-size=\"14\">X25519 + Sealed Box<\/text>\n <text x=\"300\" y=\"290\" text-anchor=\"middle\" font-size=\"13\" fill=\"#666\">enc_session_key = Encrypt(session_key, receiver_public_key)<\/text>\n \n \n <rect x=\"100\" y=\"340\" width=\"400\" height=\"100\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"300\" y=\"365\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Step 3: Symmetric Encryption<\/text>\n <text x=\"300\" y=\"390\" text-anchor=\"middle\" font-size=\"14\">ChaCha20-Poly1305 AEAD<\/text>\n <text x=\"300\" y=\"410\" text-anchor=\"middle\" font-size=\"13\" fill=\"#666\">ciphertext+tag = Encrypt(message, session_key)<\/text>\n \n \n <rect x=\"100\" y=\"460\" width=\"400\" height=\"60\" fill=\"#f8d7da\" stroke=\"#dc3545\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"300\" y=\"495\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Step 4: Send to Receiver<\/text>\n <\/g>\n \n \n <g id=\"arrow\">\n <line x1=\"550\" y1=\"300\" x2=\"650\" y2=\"300\" stroke=\"#666\" stroke-width=\"4\"\/>\n <polygon points=\"650,300 635,290 635,310\" fill=\"#666\"\/>\n <text x=\"600\" y=\"285\" text-anchor=\"middle\" font-size=\"11\" fill=\"#666\">Secure Transmission<\/text>\n\t\t\t\t\t\t<text x=\"600\" y=\"320\" text-anchor=\"middle\" font-size=\"11\" fill=\"#666\">mTLS<\/text>\n <\/g>\n \n \n <g id=\"receiver\">\n <rect x=\"650\" y=\"50\" width=\"500\" height=\"500\" fill=\"#fff3e0\" stroke=\"#f57c00\" stroke-width=\"3\" rx=\"10\"\/>\n <text x=\"900\" y=\"90\" text-anchor=\"middle\" font-size=\"24\" font-weight=\"bold\" fill=\"#f57c00\">RECEIVER<\/text>\n \n \n <rect x=\"700\" y=\"120\" width=\"400\" height=\"60\" fill=\"#f8d7da\" stroke=\"#dc3545\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"900\" y=\"155\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Step 1: Receive Encrypted Message<\/text>\n \n \n <rect x=\"700\" y=\"200\" width=\"400\" height=\"100\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"900\" y=\"225\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Step 2: Asymmetric Decryption<\/text>\n <text x=\"900\" y=\"250\" text-anchor=\"middle\" font-size=\"14\">X25519 + Sealed Box<\/text>\n <text x=\"900\" y=\"270\" text-anchor=\"middle\" font-size=\"13\" fill=\"#666\">session_key = Decrypt(enc_session_key, private_key)<\/text>\n \n \n <rect x=\"700\" y=\"320\" width=\"400\" height=\"120\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"900\" y=\"345\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Step 3: Verify and Decrypt<\/text>\n <text x=\"900\" y=\"370\" text-anchor=\"middle\" font-size=\"14\">ChaCha20-Poly1305 AEAD<\/text>\n <text x=\"900\" y=\"390\" text-anchor=\"middle\" font-size=\"13\" fill=\"#666\">1. Verify Tag (Authentication)<\/text>\n <text x=\"900\" y=\"410\" text-anchor=\"middle\" font-size=\"13\" fill=\"#666\">2. Decrypt(ciphertext, session_key)<\/text>\n \n \n <rect x=\"700\" y=\"460\" width=\"400\" height=\"60\" fill=\"#d1ecf1\" stroke=\"#0c5460\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"900\" y=\"495\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Step 4: Original Message Recovered \u2713<\/text>\n <\/g>\n <\/svg>\n <\/div>\n \n <div class=\"legend\">\n <div class=\"legend-item\">\n <div class=\"legend-color\" style=\"background: #fff3cd;\"><\/div>\n <span>Asymmetric Encryption (X25519)<\/span>\n <\/div>\n <div class=\"legend-item\">\n <div class=\"legend-color\" style=\"background: #d4edda;\"><\/div>\n <span>Symmetric Encryption (ChaCha20)<\/span>\n <\/div>\n <div class=\"legend-item\">\n <div class=\"legend-color\" style=\"background: #f8d7da;\"><\/div>\n <span>Data Transmission<\/span>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"diagram-section\">\n <h2 class=\"diagram-title\">2\ufe0f\u20e3 Detailed Encryption Flow (Sender)<\/h2>\n <div class=\"diagram-container\">\n <svg viewBox=\"0 0 1200 800\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n <rect width=\"1200\" height=\"800\" fill=\"#f8f9fa\"\/>\n \n \n <g id=\"input\">\n <rect x=\"100\" y=\"50\" width=\"300\" height=\"80\" fill=\"#e3f2fd\" stroke=\"#1976d2\" stroke-width=\"2\" rx=\"8\"\/>\n <text x=\"250\" y=\"85\" text-anchor=\"middle\" font-size=\"18\" font-weight=\"bold\">Input<\/text>\n <text x=\"250\" y=\"110\" text-anchor=\"middle\" font-size=\"14\">Plaintext: “Hello World”<\/text>\n <\/g>\n \n \n <g id=\"step1\">\n <rect x=\"100\" y=\"170\" width=\"300\" height=\"100\" fill=\"#fff\" stroke=\"#666\" stroke-width=\"2\" rx=\"8\"\/>\n <text x=\"250\" y=\"200\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">1. Generate Session Key<\/text>\n <text x=\"250\" y=\"225\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">session_key = os.urandom(32)<\/text>\n <text x=\"250\" y=\"245\" text-anchor=\"middle\" font-size=\"12\" fill=\"#666\">256-bit random key<\/text>\n <\/g>\n <line x1=\"250\" y1=\"130\" x2=\"250\" y2=\"170\" stroke=\"#666\" stroke-width=\"2\" marker-end=\"url(#arrowhead)\"\/>\n \n \n <g id=\"step2\">\n <rect x=\"100\" y=\"310\" width=\"300\" height=\"120\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"2\" rx=\"8\"\/>\n <text x=\"250\" y=\"340\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">2. Encrypt Session Key<\/text>\n <text x=\"250\" y=\"365\" text-anchor=\"middle\" font-size=\"14\">X25519 + Sealed Box<\/text>\n <text x=\"250\" y=\"385\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">sealed_box = SealedBox(public_key)<\/text>\n <text x=\"250\" y=\"405\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">enc_session_key = sealed_box.encrypt()<\/text>\n <\/g>\n <line x1=\"250\" y1=\"270\" x2=\"250\" y2=\"310\" stroke=\"#666\" stroke-width=\"2\" marker-end=\"url(#arrowhead)\"\/>\n \n \n <g id=\"step3\">\n <rect x=\"100\" y=\"470\" width=\"300\" height=\"100\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\" rx=\"8\"\/>\n <text x=\"250\" y=\"500\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">3. Generate Nonce<\/text>\n <text x=\"250\" y=\"525\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">nonce = os.urandom(12)<\/text>\n <text x=\"250\" y=\"545\" text-anchor=\"middle\" font-size=\"12\" fill=\"#666\">96-bit random nonce<\/text>\n <\/g>\n <line x1=\"250\" y1=\"430\" x2=\"250\" y2=\"470\" stroke=\"#666\" stroke-width=\"2\" marker-end=\"url(#arrowhead)\"\/>\n \n \n <g id=\"step4\">\n <rect x=\"100\" y=\"610\" width=\"300\" height=\"140\" fill=\"#d1ecf1\" stroke=\"#0c5460\" stroke-width=\"2\" rx=\"8\"\/>\n <text x=\"250\" y=\"640\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">4. ChaCha20 Encryption<\/text>\n <text x=\"250\" y=\"665\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">cipher = ChaCha20Poly1305(session_key)<\/text>\n <text x=\"250\" y=\"685\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">result = cipher.encrypt(nonce, plaintext)<\/text>\n <text x=\"250\" y=\"710\" text-anchor=\"middle\" font-size=\"11\" fill=\"#0c5460\">\u2193 result = ciphertext || tag<\/text>\n <text x=\"250\" y=\"730\" text-anchor=\"middle\" font-size=\"11\" fill=\"#0c5460\">(n bytes) || (16 bytes)<\/text>\n <\/g>\n <line x1=\"250\" y1=\"570\" x2=\"250\" y2=\"610\" stroke=\"#666\" stroke-width=\"2\" marker-end=\"url(#arrowhead)\"\/>\n \n \n <g id=\"keys\">\n <rect x=\"500\" y=\"170\" width=\"600\" height=\"280\" fill=\"#ffe6e6\" stroke=\"#dc3545\" stroke-width=\"2\" rx=\"8\"\/>\n <text x=\"800\" y=\"200\" text-anchor=\"middle\" font-size=\"18\" font-weight=\"bold\" fill=\"#dc3545\">\ud83d\udd11 Key Usage<\/text>\n \n \n <rect x=\"550\" y=\"230\" width=\"500\" height=\"70\" fill=\"#fff\" stroke=\"#666\" stroke-width=\"1\" rx=\"5\"\/>\n <text x=\"800\" y=\"255\" text-anchor=\"middle\" font-size=\"14\" font-weight=\"bold\">Receiver Public Key (X25519)<\/text>\n <text x=\"800\" y=\"275\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">32 bytes – for Session Key encryption<\/text>\n \n \n <rect x=\"550\" y=\"320\" width=\"500\" height=\"70\" fill=\"#fff\" stroke=\"#666\" stroke-width=\"1\" rx=\"5\"\/>\n <text x=\"800\" y=\"345\" text-anchor=\"middle\" font-size=\"14\" font-weight=\"bold\">Session Key (ChaCha20)<\/text>\n <text x=\"800\" y=\"365\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">32 bytes – for main message encryption<\/text>\n \n \n <rect x=\"550\" y=\"410\" width=\"500\" height=\"70\" fill=\"#fff\" stroke=\"#666\" stroke-width=\"1\" rx=\"5\"\/>\n <text x=\"800\" y=\"435\" text-anchor=\"middle\" font-size=\"14\" font-weight=\"bold\">Nonce (ChaCha20)<\/text>\n <text x=\"800\" y=\"455\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">12 bytes – unique for each message<\/text>\n \n \n <\/g>\n \n \n <g id=\"output\">\n <rect x=\"500\" y=\"550\" width=\"600\" height=\"200\" fill=\"#e8f5e9\" stroke=\"#4caf50\" stroke-width=\"3\" rx=\"8\"\/>\n <text x=\"800\" y=\"580\" text-anchor=\"middle\" font-size=\"18\" font-weight=\"bold\" fill=\"#4caf50\">\ud83d\udce6 Final Output (JSON)<\/text>\n <text x=\"800\" y=\"610\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">message_id: “sender-abc-receiver”<\/text>\n <text x=\"800\" y=\"635\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">enc_session_key: “base64…”<\/text>\n <text x=\"800\" y=\"660\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">nonce: “base64…”<\/text>\n <text x=\"800\" y=\"685\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">ciphertext: “base64…” \u2190 includes tag<\/text>\n <text x=\"800\" y=\"710\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">sent_time: “2025-10-15T…”<\/text>\n <\/g>\n \n \n <defs>\n <marker id=\"arrowhead\" markerWidth=\"10\" markerHeight=\"10\" refX=\"9\" refY=\"3\" orient=\"auto\">\n <polygon points=\"0 0, 10 3, 0 6\" fill=\"#666\"\/>\n <\/marker>\n <marker id=\"arrowhead2\" markerWidth=\"10\" markerHeight=\"10\" refX=\"9\" refY=\"3\" orient=\"auto\">\n <polygon points=\"0 0, 10 3, 0 6\" fill=\"#666\"\/>\n <\/marker>\n <\/defs>\n <\/svg>\n <\/div>\n \n <div class=\"note\">\n <strong>Important Note:<\/strong> Session Key is used only for one message and then discarded (Forward Secrecy).\n <\/div>\n <\/div>\n \n \n <div class=\"diagram-section\">\n <h2 class=\"diagram-title\">3\ufe0f\u20e3 Detailed Decryption Flow (Receiver)<\/h2>\n <div class=\"diagram-container\">\n <svg viewBox=\"0 0 1200 700\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n <rect width=\"1200\" height=\"700\" fill=\"#f8f9fa\"\/>\n \n \n <g id=\"input-receive\">\n <rect x=\"100\" y=\"50\" width=\"500\" height=\"120\" fill=\"#ffe6e6\" stroke=\"#dc3545\" stroke-width=\"2\" rx=\"8\"\/>\n <text x=\"350\" y=\"80\" text-anchor=\"middle\" font-size=\"18\" font-weight=\"bold\">\ud83d\udcec Receive Encrypted Message<\/text>\n <text x=\"350\" y=\"105\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">enc_session_key: “base64…”<\/text>\n <text x=\"350\" y=\"125\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">nonce: “base64…”<\/text>\n <text x=\"350\" y=\"145\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">ciphertext: “base64…” (includes tag)<\/text>\n <\/g>\n \n \n <g id=\"decrypt-session\">\n <rect x=\"100\" y=\"210\" width=\"500\" height=\"120\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"2\" rx=\"8\"\/>\n <text x=\"350\" y=\"240\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">1. Decrypt Session Key<\/text>\n <text x=\"350\" y=\"265\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">sealed_box = SealedBox(private_key)<\/text>\n <text x=\"350\" y=\"285\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">session_key = sealed_box.decrypt(enc_session_key)<\/text>\n <text x=\"350\" y=\"310\" text-anchor=\"middle\" font-size=\"11\" fill=\"#666\">Using X25519 private key<\/text>\n <\/g>\n <line x1=\"350\" y1=\"170\" x2=\"350\" y2=\"210\" stroke=\"#666\" stroke-width=\"2\" marker-end=\"url(#arrow)\"\/>\n \n \n <g id=\"tag-separation\">\n <rect x=\"100\" y=\"370\" width=\"500\" height=\"140\" fill=\"#d1ecf1\" stroke=\"#0c5460\" stroke-width=\"3\" rx=\"8\"\/>\n <text x=\"350\" y=\"400\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">2. Automatic Tag Separation<\/text>\n <text x=\"350\" y=\"425\" text-anchor=\"middle\" font-size=\"13\" fill=\"#0c5460\">\u2699\ufe0f Happens inside cipher.decrypt():<\/text>\n <text x=\"350\" y=\"450\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">ciphertext = data[:-16]<\/text>\n <text x=\"350\" y=\"470\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">tag_received = data[-16:]<\/text>\n <text x=\"350\" y=\"490\" text-anchor=\"middle\" font-size=\"11\" fill=\"#dc3545\">\u26a0\ufe0f You don\u2019t do anything! Library handles it<\/text>\n <\/g>\n <line x1=\"350\" y1=\"330\" x2=\"350\" y2=\"370\" stroke=\"#666\" stroke-width=\"2\" marker-end=\"url(#arrow)\"\/>\n \n \n <g id=\"verify-decrypt\">\n <rect x=\"100\" y=\"550\" width=\"500\" height=\"120\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\" rx=\"8\"\/>\n <text x=\"350\" y=\"580\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">3. Verify and Decrypt<\/text>\n <text x=\"350\" y=\"605\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">cipher = ChaCha20Poly1305(session_key)<\/text>\n <text x=\"350\" y=\"625\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">plaintext = cipher.decrypt(nonce, ciphertext_with_tag)<\/text>\n <text x=\"350\" y=\"650\" text-anchor=\"middle\" font-size=\"11\" fill=\"#28a745\">\u2713 Tag verified, message is valid<\/text>\n <\/g>\n <line x1=\"350\" y1=\"510\" x2=\"350\" y2=\"550\" stroke=\"#666\" stroke-width=\"2\" marker-end=\"url(#arrow)\"\/>\n \n \n <g id=\"tag-detail\">\n <rect x=\"650\" y=\"210\" width=\"500\" height=\"300\" fill=\"#fff3e0\" stroke=\"#f57c00\" stroke-width=\"3\" rx=\"8\"\/>\n <text x=\"900\" y=\"240\" text-anchor=\"middle\" font-size=\"18\" font-weight=\"bold\" fill=\"#f57c00\">\ud83d\udd0d Tag Verification Details<\/text>\n \n <rect x=\"700\" y=\"270\" width=\"400\" height=\"60\" fill=\"#fff\" stroke=\"#666\" stroke-width=\"1\" rx=\"5\"\/>\n <text x=\"900\" y=\"295\" text-anchor=\"middle\" font-size=\"13\">1. Compute tag_computed from ciphertext<\/text>\n <text x=\"900\" y=\"313\" text-anchor=\"middle\" font-size=\"11\" font-family=\"monospace\">tag_computed = Poly1305(ciphertext)<\/text>\n \n <rect x=\"700\" y=\"350\" width=\"400\" height=\"60\" fill=\"#fff\" stroke=\"#666\" stroke-width=\"1\" rx=\"5\"\/>\n <text x=\"900\" y=\"375\" text-anchor=\"middle\" font-size=\"13\">2. Compare with tag_received<\/text>\n <text x=\"900\" y=\"393\" text-anchor=\"middle\" font-size=\"11\" font-family=\"monospace\">if tag_computed == tag_received<\/text>\n \n <g id=\"tag-result\">\n <rect x=\"700\" y=\"430\" width=\"190\" height=\"60\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"795\" y=\"455\" text-anchor=\"middle\" font-size=\"12\" fill=\"#28a745\">\u2713 Valid<\/text>\n <text x=\"795\" y=\"473\" text-anchor=\"middle\" font-size=\"10\">Decrypt<\/text>\n \n <rect x=\"910\" y=\"430\" width=\"190\" height=\"60\" fill=\"#f8d7da\" stroke=\"#dc3545\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"1005\" y=\"455\" text-anchor=\"middle\" font-size=\"12\" fill=\"#dc3545\">\u2717 Invalid<\/text>\n <text x=\"1005\" y=\"473\" text-anchor=\"middle\" font-size=\"10\">Reject<\/text>\n <\/g>\n <\/g>\n \n \n <path d=\"M 600 440 L 650 390\" stroke=\"#0c5460\" stroke-width=\"2\" stroke-dasharray=\"5,5\" marker-end=\"url(#arrow)\"\/>\n \n \n <defs>\n <marker id=\"arrow\" markerWidth=\"10\" markerHeight=\"10\" refX=\"9\" refY=\"3\" orient=\"auto\">\n <polygon points=\"0 0, 10 3, 0 6\" fill=\"#666\"\/>\n <\/marker>\n <\/defs>\n <\/svg>\n <\/div>\n \n <div class=\"note\">\n <strong>\u26a0\ufe0f Key Note:<\/strong> In version 2.0, you don\u2019t write any additional code for tag separation. The cryptography library handles everything automatically and securely.\n <\/div>\n <\/div>\n \n \n <div class=\"diagram-section\">\n <h2 class=\"diagram-title\">4\ufe0f\u20e3 Detailed Ciphertext + Tag Structure<\/h2>\n <div class=\"diagram-container\">\n <svg viewBox=\"0 0 1200 500\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n <rect width=\"1200\" height=\"500\" fill=\"#f8f9fa\"\/>\n \n \n <text x=\"600\" y=\"40\" text-anchor=\"middle\" font-size=\"22\" font-weight=\"bold\">Byte Structure of cipher.encrypt() Output<\/text>\n \n \n <g id=\"byte-array\">\n \n <rect x=\"100\" y=\"100\" width=\"800\" height=\"100\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"3\" rx=\"5\"\/>\n <text x=\"500\" y=\"145\" text-anchor=\"middle\" font-size=\"18\" font-weight=\"bold\" fill=\"#28a745\">Ciphertext<\/text>\n <text x=\"500\" y=\"170\" text-anchor=\"middle\" font-size=\"14\" fill=\"#666\">n bytes (length of original message)<\/text>\n \n \n <rect x=\"900\" y=\"100\" width=\"200\" height=\"100\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"3\" rx=\"5\"\/>\n <text x=\"1000\" y=\"145\" text-anchor=\"middle\" font-size=\"18\" font-weight=\"bold\" fill=\"#f57c00\">Tag<\/text>\n <text x=\"1000\" y=\"170\" text-anchor=\"middle\" font-size=\"14\" fill=\"#666\">16 bytes (fixed)<\/text>\n \n \n <text x=\"100\" y=\"85\" font-size=\"12\" fill=\"#666\">0<\/text>\n <text x=\"500\" y=\"85\" text-anchor=\"middle\" font-size=\"12\" fill=\"#666\">n-1<\/text>\n <text x=\"900\" y=\"85\" font-size=\"12\" fill=\"#666\">n<\/text>\n <text x=\"1100\" y=\"85\" text-anchor=\"end\" font-size=\"12\" fill=\"#666\">n+15<\/text>\n \n \n <line x1=\"100\" y1=\"90\" x2=\"100\" y2=\"100\" stroke=\"#666\" stroke-width=\"1\"\/>\n <line x1=\"900\" y1=\"90\" x2=\"900\" y2=\"100\" stroke=\"#666\" stroke-width=\"1\"\/>\n <line x1=\"1100\" y1=\"90\" x2=\"1100\" y2=\"100\" stroke=\"#666\" stroke-width=\"1\"\/>\n <\/g>\n \n \n <g id=\"example\">\n <text x=\"600\" y=\"250\" text-anchor=\"middle\" font-size=\"18\" font-weight=\"bold\">Example: Message “HELLO” (5 bytes)<\/text>\n \n \n <g id=\"hello-bytes\">\n \n <rect x=\"300\" y=\"280\" width=\"60\" height=\"60\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\"\/>\n <text x=\"330\" y=\"315\" text-anchor=\"middle\" font-size=\"14\" font-family=\"monospace\">A3<\/text>\n \n <rect x=\"360\" y=\"280\" width=\"60\" height=\"60\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\"\/>\n <text x=\"390\" y=\"315\" text-anchor=\"middle\" font-size=\"14\" font-family=\"monospace\">F2<\/text>\n \n <rect x=\"420\" y=\"280\" width=\"60\" height=\"60\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\"\/>\n <text x=\"450\" y=\"315\" text-anchor=\"middle\" font-size=\"14\" font-family=\"monospace\">C1<\/text>\n \n <rect x=\"480\" y=\"280\" width=\"60\" height=\"60\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\"\/>\n <text x=\"510\" y=\"315\" text-anchor=\"middle\" font-size=\"14\" font-family=\"monospace\">D4<\/text>\n \n <rect x=\"540\" y=\"280\" width=\"60\" height=\"60\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\"\/>\n <text x=\"570\" y=\"315\" text-anchor=\"middle\" font-size=\"14\" font-family=\"monospace\">E5<\/text>\n \n <text x=\"430\" y=\"365\" text-anchor=\"middle\" font-size=\"12\" fill=\"#28a745\">5 bytes ciphertext<\/text>\n \n \n <rect x=\"620\" y=\"280\" width=\"40\" height=\"60\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"2\"\/>\n <text x=\"640\" y=\"315\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">7A<\/text>\n \n <rect x=\"660\" y=\"280\" width=\"40\" height=\"60\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"2\"\/>\n <text x=\"680\" y=\"315\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">8B<\/text>\n \n <text x=\"720\" y=\"310\" text-anchor=\"start\" font-size=\"14\">…<\/text>\n \n <rect x=\"760\" y=\"280\" width=\"40\" height=\"60\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"2\"\/>\n <text x=\"780\" y=\"315\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">3F<\/text>\n \n <rect x=\"800\" y=\"280\" width=\"40\" height=\"60\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"2\"\/>\n <text x=\"820\" y=\"315\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">2C<\/text>\n \n <text x=\"710\" y=\"365\" text-anchor=\"middle\" font-size=\"12\" fill=\"#f57c00\">16 bytes tag<\/text>\n <\/g>\n \n \n <rect x=\"300\" y=\"390\" width=\"540\" height=\"50\" fill=\"#e3f2fd\" stroke=\"#1976d2\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"570\" y=\"420\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Total Length: 21 bytes (5 + 16)<\/text>\n <\/g>\n <\/svg>\n <\/div>\n \n <div class=\"code-block\">\n# Example in Python:\nplaintext = b”HELLO” # 5 bytes\ncipher = ChaCha20Poly1305(session_key)\nresult = cipher.encrypt(nonce, plaintext, None)\n\nprint(f”Plaintext length: {len(plaintext)}”) # 5\nprint(f”Result length: {len(result)}”) # 21\nprint(f”Ciphertext: {result[:-16].hex()}”) # first 5 bytes\nprint(f”Tag: {result[-16:].hex()}”) # last 16 bytes\n <\/div>\n <\/div>\n \n \n <div class=\"diagram-section\">\n <h2 class=\"diagram-title\">5\ufe0f\u20e3 Complete Message Flow from Sender to Receiver<\/h2>\n \n <div class=\"tabs\">\n <button class=\"tab active\" onclick=\"showTab('tab1')\">Overview<\/button>\n <button class=\"tab\" onclick=\"showTab('tab2')\">Encryption Details<\/button>\n <\/div>\n \n <div id=\"tab1\" class=\"tab-content active\">\n <div class=\"diagram-container\">\n <svg viewBox=\"0 0 1200 600\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n <rect width=\"1200\" height=\"600\" fill=\"#f8f9fa\"\/>\n \n \n <line x1=\"100\" y1=\"300\" x2=\"1100\" y2=\"300\" stroke=\"#666\" stroke-width=\"4\"\/>\n \n \n <g id=\"step-1\">\n <circle cx=\"150\" cy=\"300\" r=\"40\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"3\"\/>\n <text x=\"150\" y=\"310\" text-anchor=\"middle\" font-size=\"20\" font-weight=\"bold\">1<\/text>\n <rect x=\"100\" y=\"100\" width=\"100\" height=\"150\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"150\" y=\"130\" text-anchor=\"middle\" font-size=\"12\" font-weight=\"bold\">Public Key<\/text>\n <text x=\"150\" y=\"150\" text-anchor=\"middle\" font-size=\"10\">of Receiver<\/text>\n <text x=\"150\" y=\"165\" text-anchor=\"middle\" font-size=\"10\">from<\/text>\n <text x=\"150\" y=\"180\" text-anchor=\"middle\" font-size=\"10\">Server<\/text>\n <line x1=\"150\" y1=\"250\" x2=\"150\" y2=\"260\" stroke=\"#ffc107\" stroke-width=\"2\" marker-end=\"url(#arrow1)\"\/>\n <\/g>\n \n \n <g id=\"step-2\">\n <circle cx=\"350\" cy=\"300\" r=\"40\" fill=\"#d1ecf1\" stroke=\"#0c5460\" stroke-width=\"3\"\/>\n <text x=\"350\" y=\"310\" text-anchor=\"middle\" font-size=\"20\" font-weight=\"bold\">2<\/text>\n <rect x=\"300\" y=\"100\" width=\"100\" height=\"150\" fill=\"#d1ecf1\" stroke=\"#0c5460\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"350\" y=\"130\" text-anchor=\"middle\" font-size=\"12\" font-weight=\"bold\">Session Key<\/text>\n <text x=\"350\" y=\"150\" text-anchor=\"middle\" font-size=\"10\">Random<\/text>\n <text x=\"350\" y=\"165\" text-anchor=\"middle\" font-size=\"10\">32 bytes<\/text>\n <text x=\"350\" y=\"180\" text-anchor=\"middle\" font-size=\"10\">Generate<\/text>\n <line x1=\"350\" y1=\"250\" x2=\"350\" y2=\"260\" stroke=\"#0c5460\" stroke-width=\"2\" marker-end=\"url(#arrow1)\"\/>\n <\/g>\n \n \n <g id=\"step-3\">\n <circle cx=\"550\" cy=\"300\" r=\"40\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"3\"\/>\n <text x=\"550\" y=\"310\" text-anchor=\"middle\" font-size=\"20\" font-weight=\"bold\">3<\/text>\n <rect x=\"500\" y=\"100\" width=\"100\" height=\"150\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"550\" y=\"120\" text-anchor=\"middle\" font-size=\"11\" font-weight=\"bold\">Encrypt<\/text>\n <text x=\"550\" y=\"140\" text-anchor=\"middle\" font-size=\"9\">Session Key<\/text>\n <text x=\"550\" y=\"155\" text-anchor=\"middle\" font-size=\"9\">with Public Key<\/text>\n <text x=\"550\" y=\"175\" text-anchor=\"middle\" font-size=\"9\">Message with<\/text>\n <text x=\"550\" y=\"190\" text-anchor=\"middle\" font-size=\"9\">Session Key<\/text>\n <line x1=\"550\" y1=\"250\" x2=\"550\" y2=\"260\" stroke=\"#28a745\" stroke-width=\"2\" marker-end=\"url(#arrow1)\"\/>\n <\/g>\n \n \n <g id=\"step-4\">\n <circle cx=\"750\" cy=\"300\" r=\"40\" fill=\"#f8d7da\" stroke=\"#dc3545\" stroke-width=\"3\"\/>\n <text x=\"750\" y=\"310\" text-anchor=\"middle\" font-size=\"20\" font-weight=\"bold\">4<\/text>\n <rect x=\"700\" y=\"100\" width=\"100\" height=\"150\" fill=\"#f8d7da\" stroke=\"#dc3545\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"750\" y=\"130\" text-anchor=\"middle\" font-size=\"12\" font-weight=\"bold\">Send<\/text>\n <text x=\"750\" y=\"150\" text-anchor=\"middle\" font-size=\"10\">via<\/text>\n <text x=\"750\" y=\"165\" text-anchor=\"middle\" font-size=\"10\">TLS<\/text>\n <text x=\"750\" y=\"180\" text-anchor=\"middle\" font-size=\"10\">to Server<\/text>\n <line x1=\"750\" y1=\"250\" x2=\"750\" y2=\"260\" stroke=\"#dc3545\" stroke-width=\"2\" marker-end=\"url(#arrow1)\"\/>\n <\/g>\n \n \n <g id=\"step-5\">\n <circle cx=\"950\" cy=\"300\" r=\"40\" fill=\"#e3f2fd\" stroke=\"#1976d2\" stroke-width=\"3\"\/>\n <text x=\"950\" y=\"310\" text-anchor=\"middle\" font-size=\"20\" font-weight=\"bold\">5<\/text>\n <rect x=\"900\" y=\"380\" width=\"100\" height=\"150\" fill=\"#e3f2fd\" stroke=\"#1976d2\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"950\" y=\"410\" text-anchor=\"middle\" font-size=\"11\" font-weight=\"bold\">Decrypt<\/text>\n <text x=\"950\" y=\"430\" text-anchor=\"middle\" font-size=\"9\">Session Key<\/text>\n <text x=\"950\" y=\"445\" text-anchor=\"middle\" font-size=\"9\">with Private Key<\/text>\n <text x=\"950\" y=\"465\" text-anchor=\"middle\" font-size=\"9\">Message with<\/text>\n <text x=\"950\" y=\"480\" text-anchor=\"middle\" font-size=\"9\">Session Key<\/text>\n <line x1=\"950\" y1=\"340\" x2=\"950\" y2=\"380\" stroke=\"#1976d2\" stroke-width=\"2\" marker-end=\"url(#arrow1)\"\/>\n <\/g>\n \n \n <path d=\"M 190 300 L 310 300\" stroke=\"#666\" stroke-width=\"3\" marker-end=\"url(#arrow1)\"\/>\n <path d=\"M 390 300 L 510 300\" stroke=\"#666\" stroke-width=\"3\" marker-end=\"url(#arrow1)\"\/>\n <path d=\"M 590 300 L 710 300\" stroke=\"#666\" stroke-width=\"3\" marker-end=\"url(#arrow1)\"\/>\n <path d=\"M 790 300 L 910 300\" stroke=\"#666\" stroke-width=\"3\" marker-end=\"url(#arrow1)\"\/>\n \n <defs>\n <marker id=\"arrow1\" markerWidth=\"10\" markerHeight=\"10\" refX=\"9\" refY=\"3\" orient=\"auto\">\n <polygon points=\"0 0, 10 3, 0 6\" fill=\"#666\"\/>\n <\/marker>\n <\/defs>\n <\/svg>\n <\/div>\n <\/div>\n \n <div id=\"tab2\" class=\"tab-content\">\n <div class=\"code-block\">\n# Complete Encryption Flow in Sender.py\n\n# 1. Retrieve receiver’s public key\nwith open(f”keys\/{receiver_id}_public.key”, “r”) as f:\n public_key_b64 = f.read().strip()\n\n# 2. Create sealed box for asymmetric encryption\npublic_key = PublicKey(b64decode(public_key_b64))\nsealed_box = SealedBox(public_key)\n\n# 3. Generate random session key\nsession_key = os.urandom(32) # 256-bit\n\n# 4. Encrypt session key with public key\nenc_session_key = sealed_box.encrypt(session_key)\n\n# 5. Generate random nonce\nnonce = os.urandom(12) # 96-bit\n\n# 6. Encrypt message with ChaCha20-Poly1305\ncipher = ChaCha20Poly1305(session_key)\nmessage_bytes = message[“content”].encode(‘utf-8’)\nciphertext_with_tag = cipher.encrypt(nonce, message_bytes, None)\n# \u2191 includes ciphertext + tag (16 bytes)\n\n# 7. Construct final message\nencrypted_message = {\n “message_id”: f”{sender_id}-{correlation_id}-{receiver_id}”,\n “receiver_client_id”: receiver_id,\n “enc_session_key”: b64encode(enc_session_key).decode(‘utf-8’),\n “nonce”: b64encode(nonce).decode(‘utf-8’),\n “ciphertext”: b64encode(ciphertext_with_tag).decode(‘utf-8’),\n “sent_time”: datetime.now(timezone.utc).isoformat()\n}\n\n# 8. Send to server\ncommand = f”publish {exchange_name} {routing_key} {json.dumps(encrypted_message)}\\n”\nwriter.write(command.encode(‘utf-8’))\n <\/div>\n \n <div class=\"code-block\" style=\"margin-top: 20px;\">\n# Complete Decryption Flow in Receiver.py\n\n# 1. Receive encrypted message\nmessage_data = json.loads(message_str)\n\n# 2. Decrypt session key with private key\nenc_session_key = b64decode(message_data[“enc_session_key”])\nsealed_box = SealedBox(PRIVATE_KEY)\nsession_key = sealed_box.decrypt(enc_session_key)\n\n# 3. Extract nonce and ciphertext+tag\nnonce = b64decode(message_data[“nonce”])\nciphertext_with_tag = b64decode(message_data[“ciphertext”])\n\n# 4. Decrypt and verify message\ncipher = ChaCha20Poly1305(session_key)\ntry:\n plaintext_bytes = cipher.decrypt(nonce, ciphertext_with_tag, None)\n # \u2191 Inside this function:\n # – Tag is separated\n # – Tag is verified\n # – If valid, decrypts\n \n plaintext = plaintext_bytes.decode(‘utf-8’)\n print(f”Message received: {plaintext}”)\n \nexcept InvalidTag:\n print(“\u274c Message tampered or corrupted!”)\n <\/div>\n <\/div>\n \n <div id=\"tab3\" class=\"tab-content\">\n <div class=\"diagram-container\">\n <svg viewBox=\"0 0 1200 700\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n <rect width=\"1200\" height=\"700\" fill=\"#f8f9fa\"\/>\n \n \n <text x=\"600\" y=\"40\" text-anchor=\"middle\" font-size=\"24\" font-weight=\"bold\">Version 1.x vs 2.0 Comparison<\/text>\n \n \n <g id=\"v1\">\n <rect x=\"50\" y=\"80\" width=\"550\" height=\"550\" fill=\"#ffe6e6\" stroke=\"#dc3545\" stroke-width=\"3\" rx=\"10\"\/>\n <text x=\"325\" y=\"120\" text-anchor=\"middle\" font-size=\"20\" font-weight=\"bold\" fill=\"#dc3545\">\u274c Version 1.x (Non-standard)<\/text>\n \n \n <rect x=\"100\" y=\"150\" width=\"450\" height=\"200\" fill=\"#fff\" stroke=\"#666\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"325\" y=\"175\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Sender<\/text>\n <text x=\"325\" y=\"200\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">result = cipher.encrypt(…)<\/text>\n <text x=\"325\" y=\"220\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\" fill=\"#dc3545\">tag = result[-16:] # \u274c Manual<\/text>\n <text x=\"325\" y=\"240\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\" fill=\"#dc3545\">ciphertext = result[:-16] # \u274c Manual<\/text>\n <text x=\"325\" y=\"270\" text-anchor=\"middle\" font-size=\"11\" fill=\"#666\">Send tag separately in JSON<\/text>\n <text x=\"325\" y=\"290\" text-anchor=\"middle\" font-size=\"11\" fill=\"#666\">“tag”: “…”, “ciphertext”: “…”<\/text>\n <text x=\"325\" y=\"320\" text-anchor=\"middle\" font-size=\"10\" fill=\"#dc3545\">\u26a0\ufe0f Dangerous and unnecessary<\/text>\n \n \n <rect x=\"100\" y=\"380\" width=\"450\" height=\"200\" fill=\"#fff\" stroke=\"#666\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"325\" y=\"405\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Receiver<\/text>\n <text x=\"325\" y=\"430\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\" fill=\"#dc3545\">tag = b64decode(msg[“tag”]) # \u274c Manual<\/text>\n <text x=\"325\" y=\"450\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\" fill=\"#dc3545\">ct = b64decode(msg[“ciphertext”])<\/text>\n <text x=\"325\" y=\"470\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\" fill=\"#dc3545\">combined = ct + tag # \u274c Recombine<\/text>\n <text x=\"325\" y=\"490\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">plaintext = cipher.decrypt(nonce, combined)<\/text>\n <text x=\"325\" y=\"520\" text-anchor=\"middle\" font-size=\"10\" fill=\"#dc3545\">\u26a0\ufe0f Complex and error-prone<\/text>\n <text x=\"325\" y=\"540\" text-anchor=\"middle\" font-size=\"10\" fill=\"#dc3545\">3 lines of unnecessary code<\/text>\n <\/g>\n \n \n <g id=\"v2\">\n <rect x=\"650\" y=\"80\" width=\"500\" height=\"550\" fill=\"#e8f5e9\" stroke=\"#4caf50\" stroke-width=\"3\" rx=\"10\"\/>\n <text x=\"900\" y=\"120\" text-anchor=\"middle\" font-size=\"20\" font-weight=\"bold\" fill=\"#4caf50\">\u2705 Version 2.0 (Standard)<\/text>\n \n \n <rect x=\"700\" y=\"150\" width=\"400\" height=\"200\" fill=\"#fff\" stroke=\"#666\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"900\" y=\"175\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Sender<\/text>\n <text x=\"900\" y=\"200\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\" fill=\"#4caf50\">result = cipher.encrypt(…)<\/text>\n <text x=\"900\" y=\"220\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\" fill=\"#4caf50\"># \u2705 Includes tag<\/text>\n <text x=\"900\" y=\"250\" text-anchor=\"middle\" font-size=\"11\" fill=\"#666\">Send together in JSON<\/text>\n <text x=\"900\" y=\"270\" text-anchor=\"middle\" font-size=\"11\" fill=\"#666\">“ciphertext”: “…” (includes tag)<\/text>\n <text x=\"900\" y=\"300\" text-anchor=\"middle\" font-size=\"10\" fill=\"#4caf50\">\u2713 Simple and secure<\/text>\n <text x=\"900\" y=\"320\" text-anchor=\"middle\" font-size=\"10\" fill=\"#4caf50\">\u2713 RFC 7539 standard<\/text>\n \n \n <rect x=\"700\" y=\"380\" width=\"400\" height=\"200\" fill=\"#fff\" stroke=\"#666\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"900\" y=\"405\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Receiver<\/text>\n <text x=\"900\" y=\"430\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\" fill=\"#4caf50\">data = b64decode(msg[“ciphertext”])<\/text>\n <text x=\"900\" y=\"450\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\" fill=\"#4caf50\">plaintext = cipher.decrypt(nonce, data)<\/text>\n <text x=\"900\" y=\"470\" text-anchor=\"middle\" font-size=\"12\" fill=\"#4caf50\"># \u2705 Library handles tag<\/text>\n <text x=\"900\" y=\"500\" text-anchor=\"middle\" font-size=\"10\" fill=\"#4caf50\">\u2713 Less code<\/text>\n <text x=\"900\" y=\"520\" text-anchor=\"middle\" font-size=\"10\" fill=\"#4caf50\">\u2713 Zero error probability<\/text>\n <text x=\"900\" y=\"540\" text-anchor=\"middle\" font-size=\"10\" fill=\"#4caf50\">\u2713 Constant-time operations<\/text>\n <\/g>\n \n \n <text x=\"600\" y=\"350\" text-anchor=\"middle\" font-size=\"18\" fill=\"#666\">\u2192<\/text>\n <\/svg>\n <\/div>\n \n <div class=\"note\">\n Enhanced data and fully compliant with international standards.\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n \n <script>\n function showTab(tabId) {\n \/\/ Remove active class from all tabs and contents\n document.querySelectorAll('.tab').forEach(tab => tab.classList.remove('active'));\n document.querySelectorAll('.tab-content').forEach(content => content.classList.remove('active'));\n \n \/\/ Add active class to clicked tab and corresponding content\n document.querySelector(`button[onclick=\"showTab('${tabId}')\"]`).classList.add('active');\n document.getElementById(tabId).classList.add('active');\n }\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Hybrid Cryptography Diagrams 1\ufe0f\u20e3 Hybrid Cryptography Overview SENDER Step 1: Generate Session Key session_key = RANDOM(32 bytes) Step 2: Asymmetric Encryption X25519 + Sealed Box enc_session_key = Encrypt(session_key, receiver_public_key) Step 3: Symmetric Encryption ChaCha20-Poly1305 AEAD ciphertext+tag = Encrypt(message, session_key) Step 4: Send to Receiver Secure Transmission mTLS RECEIVER Step 1: Receive Encrypted Message Step 2: […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-9","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ciphermq.com\/docs\/index.php\/wp-json\/wp\/v2\/pages\/9","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ciphermq.com\/docs\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ciphermq.com\/docs\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ciphermq.com\/docs\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ciphermq.com\/docs\/index.php\/wp-json\/wp\/v2\/comments?post=9"}],"version-history":[{"count":6,"href":"https:\/\/ciphermq.com\/docs\/index.php\/wp-json\/wp\/v2\/pages\/9\/revisions"}],"predecessor-version":[{"id":31,"href":"https:\/\/ciphermq.com\/docs\/index.php\/wp-json\/wp\/v2\/pages\/9\/revisions\/31"}],"wp:attachment":[{"href":"https:\/\/ciphermq.com\/docs\/index.php\/wp-json\/wp\/v2\/media?parent=9"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":9,"date":"2025-10-15T11:33:07","date_gmt":"2025-10-15T11:33:07","guid":{"rendered":"https:\/\/ciphermq.com\/docs\/?page_id=9"},"modified":"2025-10-15T11:55:26","modified_gmt":"2025-10-15T11:55:26","slug":"ciphermq-hybrid-cryptography-diagrams","status":"publish","type":"page","link":"https:\/\/ciphermq.com\/docs\/index.php\/ciphermq-hybrid-cryptography-diagrams\/","title":{"rendered":"\ud83d\udd10 Hybrid Cryptography Diagrams"},"content":{"rendered":"\n\n\n\n \n \n Hybrid Cryptography Diagrams<\/title>\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n \n body {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n padding: 20px;\n min-height: 100vh;\n }\n \n .container {\n max-width: 1400px;\n margin: 0 auto;\n }\n \n h1 {\n text-align: center;\n color: white;\n margin-bottom: 30px;\n font-size: 2.5em;\n text-shadow: 2px 2px 4px rgba(0,0,0,0.3);\n }\n \n .diagram-section {\n background: white;\n border-radius: 15px;\n padding: 30px;\n margin-bottom: 30px;\n box-shadow: 0 10px 30px rgba(0,0,0,0.3);\n }\n \n .diagram-title {\n font-size: 1.8em;\n color: #667eea;\n margin-bottom: 20px;\n border-bottom: 3px solid #667eea;\n padding-bottom: 10px;\n }\n \n .diagram-container {\n margin: 20px 0;\n padding: 20px;\n background: #f8f9fa;\n border-radius: 10px;\n overflow-x: auto;\n }\n \n svg {\n max-width: 100%;\n height: auto;\n }\n \n .legend {\n display: flex;\n flex-wrap: wrap;\n gap: 20px;\n margin-top: 20px;\n padding: 15px;\n background: #e9ecef;\n border-radius: 8px;\n }\n \n .legend-item {\n display: flex;\n align-items: center;\n gap: 8px;\n }\n \n .legend-color {\n width: 30px;\n height: 20px;\n border-radius: 4px;\n border: 1px solid #999;\n }\n \n .tabs {\n display: flex;\n gap: 10px;\n margin-bottom: 20px;\n border-bottom: 2px solid #dee2e6;\n }\n \n .tab {\n padding: 12px 24px;\n background: #e9ecef;\n border: none;\n border-radius: 8px 8px 0 0;\n cursor: pointer;\n font-size: 1.1em;\n transition: all 0.3s;\n }\n \n .tab:hover {\n background: #dee2e6;\n }\n \n .tab.active {\n background: #667eea;\n color: white;\n }\n \n .tab-content {\n display: none;\n }\n \n .tab-content.active {\n display: block;\n }\n \n .note {\n background: #fff3cd;\n border-left: 4px solid #ffc107;\n padding: 15px;\n margin: 15px 0;\n border-radius: 4px;\n }\n \n .code-block {\n background: #2d2d2d;\n color: #f8f8f2;\n padding: 15px;\n border-radius: 8px;\n overflow-x: auto;\n font-family: 'Courier New', monospace;\n margin: 15px 0;\n }\n \n @media (max-width: 768px) {\n h1 {\n font-size: 1.8em;\n }\n .diagram-title {\n font-size: 1.4em;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"container\">\n\n \n <div class=\"diagram-section\">\n <h2 class=\"diagram-title\">1\ufe0f\u20e3 Hybrid Cryptography Overview<\/h2>\n <div class=\"diagram-container\">\n <svg viewBox=\"0 0 1200 600\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n \n <rect width=\"1200\" height=\"600\" fill=\"#f8f9fa\"\/>\n \n \n <g id=\"sender\">\n <rect x=\"50\" y=\"50\" width=\"500\" height=\"500\" fill=\"#e3f2fd\" stroke=\"#1976d2\" stroke-width=\"3\" rx=\"10\"\/>\n <text x=\"300\" y=\"90\" text-anchor=\"middle\" font-size=\"24\" font-weight=\"bold\" fill=\"#1976d2\">SENDER<\/text>\n \n \n <rect x=\"100\" y=\"120\" width=\"400\" height=\"80\" fill=\"#fff\" stroke=\"#1976d2\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"300\" y=\"150\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Step 1: Generate Session Key<\/text>\n <text x=\"300\" y=\"175\" text-anchor=\"middle\" font-size=\"14\">session_key = RANDOM(32 bytes)<\/text>\n \n \n <rect x=\"100\" y=\"220\" width=\"400\" height=\"100\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"300\" y=\"245\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Step 2: Asymmetric Encryption<\/text>\n <text x=\"300\" y=\"270\" text-anchor=\"middle\" font-size=\"14\">X25519 + Sealed Box<\/text>\n <text x=\"300\" y=\"290\" text-anchor=\"middle\" font-size=\"13\" fill=\"#666\">enc_session_key = Encrypt(session_key, receiver_public_key)<\/text>\n \n \n <rect x=\"100\" y=\"340\" width=\"400\" height=\"100\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"300\" y=\"365\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Step 3: Symmetric Encryption<\/text>\n <text x=\"300\" y=\"390\" text-anchor=\"middle\" font-size=\"14\">ChaCha20-Poly1305 AEAD<\/text>\n <text x=\"300\" y=\"410\" text-anchor=\"middle\" font-size=\"13\" fill=\"#666\">ciphertext+tag = Encrypt(message, session_key)<\/text>\n \n \n <rect x=\"100\" y=\"460\" width=\"400\" height=\"60\" fill=\"#f8d7da\" stroke=\"#dc3545\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"300\" y=\"495\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Step 4: Send to Receiver<\/text>\n <\/g>\n \n \n <g id=\"arrow\">\n <line x1=\"550\" y1=\"300\" x2=\"650\" y2=\"300\" stroke=\"#666\" stroke-width=\"4\"\/>\n <polygon points=\"650,300 635,290 635,310\" fill=\"#666\"\/>\n <text x=\"600\" y=\"285\" text-anchor=\"middle\" font-size=\"11\" fill=\"#666\">Secure Transmission<\/text>\n\t\t\t\t\t\t<text x=\"600\" y=\"320\" text-anchor=\"middle\" font-size=\"11\" fill=\"#666\">mTLS<\/text>\n <\/g>\n \n \n <g id=\"receiver\">\n <rect x=\"650\" y=\"50\" width=\"500\" height=\"500\" fill=\"#fff3e0\" stroke=\"#f57c00\" stroke-width=\"3\" rx=\"10\"\/>\n <text x=\"900\" y=\"90\" text-anchor=\"middle\" font-size=\"24\" font-weight=\"bold\" fill=\"#f57c00\">RECEIVER<\/text>\n \n \n <rect x=\"700\" y=\"120\" width=\"400\" height=\"60\" fill=\"#f8d7da\" stroke=\"#dc3545\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"900\" y=\"155\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Step 1: Receive Encrypted Message<\/text>\n \n \n <rect x=\"700\" y=\"200\" width=\"400\" height=\"100\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"900\" y=\"225\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Step 2: Asymmetric Decryption<\/text>\n <text x=\"900\" y=\"250\" text-anchor=\"middle\" font-size=\"14\">X25519 + Sealed Box<\/text>\n <text x=\"900\" y=\"270\" text-anchor=\"middle\" font-size=\"13\" fill=\"#666\">session_key = Decrypt(enc_session_key, private_key)<\/text>\n \n \n <rect x=\"700\" y=\"320\" width=\"400\" height=\"120\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"900\" y=\"345\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Step 3: Verify and Decrypt<\/text>\n <text x=\"900\" y=\"370\" text-anchor=\"middle\" font-size=\"14\">ChaCha20-Poly1305 AEAD<\/text>\n <text x=\"900\" y=\"390\" text-anchor=\"middle\" font-size=\"13\" fill=\"#666\">1. Verify Tag (Authentication)<\/text>\n <text x=\"900\" y=\"410\" text-anchor=\"middle\" font-size=\"13\" fill=\"#666\">2. Decrypt(ciphertext, session_key)<\/text>\n \n \n <rect x=\"700\" y=\"460\" width=\"400\" height=\"60\" fill=\"#d1ecf1\" stroke=\"#0c5460\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"900\" y=\"495\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Step 4: Original Message Recovered \u2713<\/text>\n <\/g>\n <\/svg>\n <\/div>\n \n <div class=\"legend\">\n <div class=\"legend-item\">\n <div class=\"legend-color\" style=\"background: #fff3cd;\"><\/div>\n <span>Asymmetric Encryption (X25519)<\/span>\n <\/div>\n <div class=\"legend-item\">\n <div class=\"legend-color\" style=\"background: #d4edda;\"><\/div>\n <span>Symmetric Encryption (ChaCha20)<\/span>\n <\/div>\n <div class=\"legend-item\">\n <div class=\"legend-color\" style=\"background: #f8d7da;\"><\/div>\n <span>Data Transmission<\/span>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"diagram-section\">\n <h2 class=\"diagram-title\">2\ufe0f\u20e3 Detailed Encryption Flow (Sender)<\/h2>\n <div class=\"diagram-container\">\n <svg viewBox=\"0 0 1200 800\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n <rect width=\"1200\" height=\"800\" fill=\"#f8f9fa\"\/>\n \n \n <g id=\"input\">\n <rect x=\"100\" y=\"50\" width=\"300\" height=\"80\" fill=\"#e3f2fd\" stroke=\"#1976d2\" stroke-width=\"2\" rx=\"8\"\/>\n <text x=\"250\" y=\"85\" text-anchor=\"middle\" font-size=\"18\" font-weight=\"bold\">Input<\/text>\n <text x=\"250\" y=\"110\" text-anchor=\"middle\" font-size=\"14\">Plaintext: “Hello World”<\/text>\n <\/g>\n \n \n <g id=\"step1\">\n <rect x=\"100\" y=\"170\" width=\"300\" height=\"100\" fill=\"#fff\" stroke=\"#666\" stroke-width=\"2\" rx=\"8\"\/>\n <text x=\"250\" y=\"200\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">1. Generate Session Key<\/text>\n <text x=\"250\" y=\"225\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">session_key = os.urandom(32)<\/text>\n <text x=\"250\" y=\"245\" text-anchor=\"middle\" font-size=\"12\" fill=\"#666\">256-bit random key<\/text>\n <\/g>\n <line x1=\"250\" y1=\"130\" x2=\"250\" y2=\"170\" stroke=\"#666\" stroke-width=\"2\" marker-end=\"url(#arrowhead)\"\/>\n \n \n <g id=\"step2\">\n <rect x=\"100\" y=\"310\" width=\"300\" height=\"120\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"2\" rx=\"8\"\/>\n <text x=\"250\" y=\"340\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">2. Encrypt Session Key<\/text>\n <text x=\"250\" y=\"365\" text-anchor=\"middle\" font-size=\"14\">X25519 + Sealed Box<\/text>\n <text x=\"250\" y=\"385\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">sealed_box = SealedBox(public_key)<\/text>\n <text x=\"250\" y=\"405\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">enc_session_key = sealed_box.encrypt()<\/text>\n <\/g>\n <line x1=\"250\" y1=\"270\" x2=\"250\" y2=\"310\" stroke=\"#666\" stroke-width=\"2\" marker-end=\"url(#arrowhead)\"\/>\n \n \n <g id=\"step3\">\n <rect x=\"100\" y=\"470\" width=\"300\" height=\"100\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\" rx=\"8\"\/>\n <text x=\"250\" y=\"500\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">3. Generate Nonce<\/text>\n <text x=\"250\" y=\"525\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">nonce = os.urandom(12)<\/text>\n <text x=\"250\" y=\"545\" text-anchor=\"middle\" font-size=\"12\" fill=\"#666\">96-bit random nonce<\/text>\n <\/g>\n <line x1=\"250\" y1=\"430\" x2=\"250\" y2=\"470\" stroke=\"#666\" stroke-width=\"2\" marker-end=\"url(#arrowhead)\"\/>\n \n \n <g id=\"step4\">\n <rect x=\"100\" y=\"610\" width=\"300\" height=\"140\" fill=\"#d1ecf1\" stroke=\"#0c5460\" stroke-width=\"2\" rx=\"8\"\/>\n <text x=\"250\" y=\"640\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">4. ChaCha20 Encryption<\/text>\n <text x=\"250\" y=\"665\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">cipher = ChaCha20Poly1305(session_key)<\/text>\n <text x=\"250\" y=\"685\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">result = cipher.encrypt(nonce, plaintext)<\/text>\n <text x=\"250\" y=\"710\" text-anchor=\"middle\" font-size=\"11\" fill=\"#0c5460\">\u2193 result = ciphertext || tag<\/text>\n <text x=\"250\" y=\"730\" text-anchor=\"middle\" font-size=\"11\" fill=\"#0c5460\">(n bytes) || (16 bytes)<\/text>\n <\/g>\n <line x1=\"250\" y1=\"570\" x2=\"250\" y2=\"610\" stroke=\"#666\" stroke-width=\"2\" marker-end=\"url(#arrowhead)\"\/>\n \n \n <g id=\"keys\">\n <rect x=\"500\" y=\"170\" width=\"600\" height=\"280\" fill=\"#ffe6e6\" stroke=\"#dc3545\" stroke-width=\"2\" rx=\"8\"\/>\n <text x=\"800\" y=\"200\" text-anchor=\"middle\" font-size=\"18\" font-weight=\"bold\" fill=\"#dc3545\">\ud83d\udd11 Key Usage<\/text>\n \n \n <rect x=\"550\" y=\"230\" width=\"500\" height=\"70\" fill=\"#fff\" stroke=\"#666\" stroke-width=\"1\" rx=\"5\"\/>\n <text x=\"800\" y=\"255\" text-anchor=\"middle\" font-size=\"14\" font-weight=\"bold\">Receiver Public Key (X25519)<\/text>\n <text x=\"800\" y=\"275\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">32 bytes – for Session Key encryption<\/text>\n \n \n <rect x=\"550\" y=\"320\" width=\"500\" height=\"70\" fill=\"#fff\" stroke=\"#666\" stroke-width=\"1\" rx=\"5\"\/>\n <text x=\"800\" y=\"345\" text-anchor=\"middle\" font-size=\"14\" font-weight=\"bold\">Session Key (ChaCha20)<\/text>\n <text x=\"800\" y=\"365\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">32 bytes – for main message encryption<\/text>\n \n \n <rect x=\"550\" y=\"410\" width=\"500\" height=\"70\" fill=\"#fff\" stroke=\"#666\" stroke-width=\"1\" rx=\"5\"\/>\n <text x=\"800\" y=\"435\" text-anchor=\"middle\" font-size=\"14\" font-weight=\"bold\">Nonce (ChaCha20)<\/text>\n <text x=\"800\" y=\"455\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">12 bytes – unique for each message<\/text>\n \n \n <\/g>\n \n \n <g id=\"output\">\n <rect x=\"500\" y=\"550\" width=\"600\" height=\"200\" fill=\"#e8f5e9\" stroke=\"#4caf50\" stroke-width=\"3\" rx=\"8\"\/>\n <text x=\"800\" y=\"580\" text-anchor=\"middle\" font-size=\"18\" font-weight=\"bold\" fill=\"#4caf50\">\ud83d\udce6 Final Output (JSON)<\/text>\n <text x=\"800\" y=\"610\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">message_id: “sender-abc-receiver”<\/text>\n <text x=\"800\" y=\"635\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">enc_session_key: “base64…”<\/text>\n <text x=\"800\" y=\"660\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">nonce: “base64…”<\/text>\n <text x=\"800\" y=\"685\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">ciphertext: “base64…” \u2190 includes tag<\/text>\n <text x=\"800\" y=\"710\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">sent_time: “2025-10-15T…”<\/text>\n <\/g>\n \n \n <defs>\n <marker id=\"arrowhead\" markerWidth=\"10\" markerHeight=\"10\" refX=\"9\" refY=\"3\" orient=\"auto\">\n <polygon points=\"0 0, 10 3, 0 6\" fill=\"#666\"\/>\n <\/marker>\n <marker id=\"arrowhead2\" markerWidth=\"10\" markerHeight=\"10\" refX=\"9\" refY=\"3\" orient=\"auto\">\n <polygon points=\"0 0, 10 3, 0 6\" fill=\"#666\"\/>\n <\/marker>\n <\/defs>\n <\/svg>\n <\/div>\n \n <div class=\"note\">\n <strong>Important Note:<\/strong> Session Key is used only for one message and then discarded (Forward Secrecy).\n <\/div>\n <\/div>\n \n \n <div class=\"diagram-section\">\n <h2 class=\"diagram-title\">3\ufe0f\u20e3 Detailed Decryption Flow (Receiver)<\/h2>\n <div class=\"diagram-container\">\n <svg viewBox=\"0 0 1200 700\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n <rect width=\"1200\" height=\"700\" fill=\"#f8f9fa\"\/>\n \n \n <g id=\"input-receive\">\n <rect x=\"100\" y=\"50\" width=\"500\" height=\"120\" fill=\"#ffe6e6\" stroke=\"#dc3545\" stroke-width=\"2\" rx=\"8\"\/>\n <text x=\"350\" y=\"80\" text-anchor=\"middle\" font-size=\"18\" font-weight=\"bold\">\ud83d\udcec Receive Encrypted Message<\/text>\n <text x=\"350\" y=\"105\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">enc_session_key: “base64…”<\/text>\n <text x=\"350\" y=\"125\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">nonce: “base64…”<\/text>\n <text x=\"350\" y=\"145\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">ciphertext: “base64…” (includes tag)<\/text>\n <\/g>\n \n \n <g id=\"decrypt-session\">\n <rect x=\"100\" y=\"210\" width=\"500\" height=\"120\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"2\" rx=\"8\"\/>\n <text x=\"350\" y=\"240\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">1. Decrypt Session Key<\/text>\n <text x=\"350\" y=\"265\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">sealed_box = SealedBox(private_key)<\/text>\n <text x=\"350\" y=\"285\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">session_key = sealed_box.decrypt(enc_session_key)<\/text>\n <text x=\"350\" y=\"310\" text-anchor=\"middle\" font-size=\"11\" fill=\"#666\">Using X25519 private key<\/text>\n <\/g>\n <line x1=\"350\" y1=\"170\" x2=\"350\" y2=\"210\" stroke=\"#666\" stroke-width=\"2\" marker-end=\"url(#arrow)\"\/>\n \n \n <g id=\"tag-separation\">\n <rect x=\"100\" y=\"370\" width=\"500\" height=\"140\" fill=\"#d1ecf1\" stroke=\"#0c5460\" stroke-width=\"3\" rx=\"8\"\/>\n <text x=\"350\" y=\"400\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">2. Automatic Tag Separation<\/text>\n <text x=\"350\" y=\"425\" text-anchor=\"middle\" font-size=\"13\" fill=\"#0c5460\">\u2699\ufe0f Happens inside cipher.decrypt():<\/text>\n <text x=\"350\" y=\"450\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">ciphertext = data[:-16]<\/text>\n <text x=\"350\" y=\"470\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">tag_received = data[-16:]<\/text>\n <text x=\"350\" y=\"490\" text-anchor=\"middle\" font-size=\"11\" fill=\"#dc3545\">\u26a0\ufe0f You don\u2019t do anything! Library handles it<\/text>\n <\/g>\n <line x1=\"350\" y1=\"330\" x2=\"350\" y2=\"370\" stroke=\"#666\" stroke-width=\"2\" marker-end=\"url(#arrow)\"\/>\n \n \n <g id=\"verify-decrypt\">\n <rect x=\"100\" y=\"550\" width=\"500\" height=\"120\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\" rx=\"8\"\/>\n <text x=\"350\" y=\"580\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">3. Verify and Decrypt<\/text>\n <text x=\"350\" y=\"605\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">cipher = ChaCha20Poly1305(session_key)<\/text>\n <text x=\"350\" y=\"625\" text-anchor=\"middle\" font-size=\"13\" font-family=\"monospace\">plaintext = cipher.decrypt(nonce, ciphertext_with_tag)<\/text>\n <text x=\"350\" y=\"650\" text-anchor=\"middle\" font-size=\"11\" fill=\"#28a745\">\u2713 Tag verified, message is valid<\/text>\n <\/g>\n <line x1=\"350\" y1=\"510\" x2=\"350\" y2=\"550\" stroke=\"#666\" stroke-width=\"2\" marker-end=\"url(#arrow)\"\/>\n \n \n <g id=\"tag-detail\">\n <rect x=\"650\" y=\"210\" width=\"500\" height=\"300\" fill=\"#fff3e0\" stroke=\"#f57c00\" stroke-width=\"3\" rx=\"8\"\/>\n <text x=\"900\" y=\"240\" text-anchor=\"middle\" font-size=\"18\" font-weight=\"bold\" fill=\"#f57c00\">\ud83d\udd0d Tag Verification Details<\/text>\n \n <rect x=\"700\" y=\"270\" width=\"400\" height=\"60\" fill=\"#fff\" stroke=\"#666\" stroke-width=\"1\" rx=\"5\"\/>\n <text x=\"900\" y=\"295\" text-anchor=\"middle\" font-size=\"13\">1. Compute tag_computed from ciphertext<\/text>\n <text x=\"900\" y=\"313\" text-anchor=\"middle\" font-size=\"11\" font-family=\"monospace\">tag_computed = Poly1305(ciphertext)<\/text>\n \n <rect x=\"700\" y=\"350\" width=\"400\" height=\"60\" fill=\"#fff\" stroke=\"#666\" stroke-width=\"1\" rx=\"5\"\/>\n <text x=\"900\" y=\"375\" text-anchor=\"middle\" font-size=\"13\">2. Compare with tag_received<\/text>\n <text x=\"900\" y=\"393\" text-anchor=\"middle\" font-size=\"11\" font-family=\"monospace\">if tag_computed == tag_received<\/text>\n \n <g id=\"tag-result\">\n <rect x=\"700\" y=\"430\" width=\"190\" height=\"60\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"795\" y=\"455\" text-anchor=\"middle\" font-size=\"12\" fill=\"#28a745\">\u2713 Valid<\/text>\n <text x=\"795\" y=\"473\" text-anchor=\"middle\" font-size=\"10\">Decrypt<\/text>\n \n <rect x=\"910\" y=\"430\" width=\"190\" height=\"60\" fill=\"#f8d7da\" stroke=\"#dc3545\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"1005\" y=\"455\" text-anchor=\"middle\" font-size=\"12\" fill=\"#dc3545\">\u2717 Invalid<\/text>\n <text x=\"1005\" y=\"473\" text-anchor=\"middle\" font-size=\"10\">Reject<\/text>\n <\/g>\n <\/g>\n \n \n <path d=\"M 600 440 L 650 390\" stroke=\"#0c5460\" stroke-width=\"2\" stroke-dasharray=\"5,5\" marker-end=\"url(#arrow)\"\/>\n \n \n <defs>\n <marker id=\"arrow\" markerWidth=\"10\" markerHeight=\"10\" refX=\"9\" refY=\"3\" orient=\"auto\">\n <polygon points=\"0 0, 10 3, 0 6\" fill=\"#666\"\/>\n <\/marker>\n <\/defs>\n <\/svg>\n <\/div>\n \n <div class=\"note\">\n <strong>\u26a0\ufe0f Key Note:<\/strong> In version 2.0, you don\u2019t write any additional code for tag separation. The cryptography library handles everything automatically and securely.\n <\/div>\n <\/div>\n \n \n <div class=\"diagram-section\">\n <h2 class=\"diagram-title\">4\ufe0f\u20e3 Detailed Ciphertext + Tag Structure<\/h2>\n <div class=\"diagram-container\">\n <svg viewBox=\"0 0 1200 500\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n <rect width=\"1200\" height=\"500\" fill=\"#f8f9fa\"\/>\n \n \n <text x=\"600\" y=\"40\" text-anchor=\"middle\" font-size=\"22\" font-weight=\"bold\">Byte Structure of cipher.encrypt() Output<\/text>\n \n \n <g id=\"byte-array\">\n \n <rect x=\"100\" y=\"100\" width=\"800\" height=\"100\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"3\" rx=\"5\"\/>\n <text x=\"500\" y=\"145\" text-anchor=\"middle\" font-size=\"18\" font-weight=\"bold\" fill=\"#28a745\">Ciphertext<\/text>\n <text x=\"500\" y=\"170\" text-anchor=\"middle\" font-size=\"14\" fill=\"#666\">n bytes (length of original message)<\/text>\n \n \n <rect x=\"900\" y=\"100\" width=\"200\" height=\"100\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"3\" rx=\"5\"\/>\n <text x=\"1000\" y=\"145\" text-anchor=\"middle\" font-size=\"18\" font-weight=\"bold\" fill=\"#f57c00\">Tag<\/text>\n <text x=\"1000\" y=\"170\" text-anchor=\"middle\" font-size=\"14\" fill=\"#666\">16 bytes (fixed)<\/text>\n \n \n <text x=\"100\" y=\"85\" font-size=\"12\" fill=\"#666\">0<\/text>\n <text x=\"500\" y=\"85\" text-anchor=\"middle\" font-size=\"12\" fill=\"#666\">n-1<\/text>\n <text x=\"900\" y=\"85\" font-size=\"12\" fill=\"#666\">n<\/text>\n <text x=\"1100\" y=\"85\" text-anchor=\"end\" font-size=\"12\" fill=\"#666\">n+15<\/text>\n \n \n <line x1=\"100\" y1=\"90\" x2=\"100\" y2=\"100\" stroke=\"#666\" stroke-width=\"1\"\/>\n <line x1=\"900\" y1=\"90\" x2=\"900\" y2=\"100\" stroke=\"#666\" stroke-width=\"1\"\/>\n <line x1=\"1100\" y1=\"90\" x2=\"1100\" y2=\"100\" stroke=\"#666\" stroke-width=\"1\"\/>\n <\/g>\n \n \n <g id=\"example\">\n <text x=\"600\" y=\"250\" text-anchor=\"middle\" font-size=\"18\" font-weight=\"bold\">Example: Message “HELLO” (5 bytes)<\/text>\n \n \n <g id=\"hello-bytes\">\n \n <rect x=\"300\" y=\"280\" width=\"60\" height=\"60\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\"\/>\n <text x=\"330\" y=\"315\" text-anchor=\"middle\" font-size=\"14\" font-family=\"monospace\">A3<\/text>\n \n <rect x=\"360\" y=\"280\" width=\"60\" height=\"60\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\"\/>\n <text x=\"390\" y=\"315\" text-anchor=\"middle\" font-size=\"14\" font-family=\"monospace\">F2<\/text>\n \n <rect x=\"420\" y=\"280\" width=\"60\" height=\"60\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\"\/>\n <text x=\"450\" y=\"315\" text-anchor=\"middle\" font-size=\"14\" font-family=\"monospace\">C1<\/text>\n \n <rect x=\"480\" y=\"280\" width=\"60\" height=\"60\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\"\/>\n <text x=\"510\" y=\"315\" text-anchor=\"middle\" font-size=\"14\" font-family=\"monospace\">D4<\/text>\n \n <rect x=\"540\" y=\"280\" width=\"60\" height=\"60\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\"\/>\n <text x=\"570\" y=\"315\" text-anchor=\"middle\" font-size=\"14\" font-family=\"monospace\">E5<\/text>\n \n <text x=\"430\" y=\"365\" text-anchor=\"middle\" font-size=\"12\" fill=\"#28a745\">5 bytes ciphertext<\/text>\n \n \n <rect x=\"620\" y=\"280\" width=\"40\" height=\"60\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"2\"\/>\n <text x=\"640\" y=\"315\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">7A<\/text>\n \n <rect x=\"660\" y=\"280\" width=\"40\" height=\"60\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"2\"\/>\n <text x=\"680\" y=\"315\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">8B<\/text>\n \n <text x=\"720\" y=\"310\" text-anchor=\"start\" font-size=\"14\">…<\/text>\n \n <rect x=\"760\" y=\"280\" width=\"40\" height=\"60\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"2\"\/>\n <text x=\"780\" y=\"315\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">3F<\/text>\n \n <rect x=\"800\" y=\"280\" width=\"40\" height=\"60\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"2\"\/>\n <text x=\"820\" y=\"315\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">2C<\/text>\n \n <text x=\"710\" y=\"365\" text-anchor=\"middle\" font-size=\"12\" fill=\"#f57c00\">16 bytes tag<\/text>\n <\/g>\n \n \n <rect x=\"300\" y=\"390\" width=\"540\" height=\"50\" fill=\"#e3f2fd\" stroke=\"#1976d2\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"570\" y=\"420\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Total Length: 21 bytes (5 + 16)<\/text>\n <\/g>\n <\/svg>\n <\/div>\n \n <div class=\"code-block\">\n# Example in Python:\nplaintext = b”HELLO” # 5 bytes\ncipher = ChaCha20Poly1305(session_key)\nresult = cipher.encrypt(nonce, plaintext, None)\n\nprint(f”Plaintext length: {len(plaintext)}”) # 5\nprint(f”Result length: {len(result)}”) # 21\nprint(f”Ciphertext: {result[:-16].hex()}”) # first 5 bytes\nprint(f”Tag: {result[-16:].hex()}”) # last 16 bytes\n <\/div>\n <\/div>\n \n \n <div class=\"diagram-section\">\n <h2 class=\"diagram-title\">5\ufe0f\u20e3 Complete Message Flow from Sender to Receiver<\/h2>\n \n <div class=\"tabs\">\n <button class=\"tab active\" onclick=\"showTab('tab1')\">Overview<\/button>\n <button class=\"tab\" onclick=\"showTab('tab2')\">Encryption Details<\/button>\n <\/div>\n \n <div id=\"tab1\" class=\"tab-content active\">\n <div class=\"diagram-container\">\n <svg viewBox=\"0 0 1200 600\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n <rect width=\"1200\" height=\"600\" fill=\"#f8f9fa\"\/>\n \n \n <line x1=\"100\" y1=\"300\" x2=\"1100\" y2=\"300\" stroke=\"#666\" stroke-width=\"4\"\/>\n \n \n <g id=\"step-1\">\n <circle cx=\"150\" cy=\"300\" r=\"40\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"3\"\/>\n <text x=\"150\" y=\"310\" text-anchor=\"middle\" font-size=\"20\" font-weight=\"bold\">1<\/text>\n <rect x=\"100\" y=\"100\" width=\"100\" height=\"150\" fill=\"#fff3cd\" stroke=\"#ffc107\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"150\" y=\"130\" text-anchor=\"middle\" font-size=\"12\" font-weight=\"bold\">Public Key<\/text>\n <text x=\"150\" y=\"150\" text-anchor=\"middle\" font-size=\"10\">of Receiver<\/text>\n <text x=\"150\" y=\"165\" text-anchor=\"middle\" font-size=\"10\">from<\/text>\n <text x=\"150\" y=\"180\" text-anchor=\"middle\" font-size=\"10\">Server<\/text>\n <line x1=\"150\" y1=\"250\" x2=\"150\" y2=\"260\" stroke=\"#ffc107\" stroke-width=\"2\" marker-end=\"url(#arrow1)\"\/>\n <\/g>\n \n \n <g id=\"step-2\">\n <circle cx=\"350\" cy=\"300\" r=\"40\" fill=\"#d1ecf1\" stroke=\"#0c5460\" stroke-width=\"3\"\/>\n <text x=\"350\" y=\"310\" text-anchor=\"middle\" font-size=\"20\" font-weight=\"bold\">2<\/text>\n <rect x=\"300\" y=\"100\" width=\"100\" height=\"150\" fill=\"#d1ecf1\" stroke=\"#0c5460\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"350\" y=\"130\" text-anchor=\"middle\" font-size=\"12\" font-weight=\"bold\">Session Key<\/text>\n <text x=\"350\" y=\"150\" text-anchor=\"middle\" font-size=\"10\">Random<\/text>\n <text x=\"350\" y=\"165\" text-anchor=\"middle\" font-size=\"10\">32 bytes<\/text>\n <text x=\"350\" y=\"180\" text-anchor=\"middle\" font-size=\"10\">Generate<\/text>\n <line x1=\"350\" y1=\"250\" x2=\"350\" y2=\"260\" stroke=\"#0c5460\" stroke-width=\"2\" marker-end=\"url(#arrow1)\"\/>\n <\/g>\n \n \n <g id=\"step-3\">\n <circle cx=\"550\" cy=\"300\" r=\"40\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"3\"\/>\n <text x=\"550\" y=\"310\" text-anchor=\"middle\" font-size=\"20\" font-weight=\"bold\">3<\/text>\n <rect x=\"500\" y=\"100\" width=\"100\" height=\"150\" fill=\"#d4edda\" stroke=\"#28a745\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"550\" y=\"120\" text-anchor=\"middle\" font-size=\"11\" font-weight=\"bold\">Encrypt<\/text>\n <text x=\"550\" y=\"140\" text-anchor=\"middle\" font-size=\"9\">Session Key<\/text>\n <text x=\"550\" y=\"155\" text-anchor=\"middle\" font-size=\"9\">with Public Key<\/text>\n <text x=\"550\" y=\"175\" text-anchor=\"middle\" font-size=\"9\">Message with<\/text>\n <text x=\"550\" y=\"190\" text-anchor=\"middle\" font-size=\"9\">Session Key<\/text>\n <line x1=\"550\" y1=\"250\" x2=\"550\" y2=\"260\" stroke=\"#28a745\" stroke-width=\"2\" marker-end=\"url(#arrow1)\"\/>\n <\/g>\n \n \n <g id=\"step-4\">\n <circle cx=\"750\" cy=\"300\" r=\"40\" fill=\"#f8d7da\" stroke=\"#dc3545\" stroke-width=\"3\"\/>\n <text x=\"750\" y=\"310\" text-anchor=\"middle\" font-size=\"20\" font-weight=\"bold\">4<\/text>\n <rect x=\"700\" y=\"100\" width=\"100\" height=\"150\" fill=\"#f8d7da\" stroke=\"#dc3545\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"750\" y=\"130\" text-anchor=\"middle\" font-size=\"12\" font-weight=\"bold\">Send<\/text>\n <text x=\"750\" y=\"150\" text-anchor=\"middle\" font-size=\"10\">via<\/text>\n <text x=\"750\" y=\"165\" text-anchor=\"middle\" font-size=\"10\">TLS<\/text>\n <text x=\"750\" y=\"180\" text-anchor=\"middle\" font-size=\"10\">to Server<\/text>\n <line x1=\"750\" y1=\"250\" x2=\"750\" y2=\"260\" stroke=\"#dc3545\" stroke-width=\"2\" marker-end=\"url(#arrow1)\"\/>\n <\/g>\n \n \n <g id=\"step-5\">\n <circle cx=\"950\" cy=\"300\" r=\"40\" fill=\"#e3f2fd\" stroke=\"#1976d2\" stroke-width=\"3\"\/>\n <text x=\"950\" y=\"310\" text-anchor=\"middle\" font-size=\"20\" font-weight=\"bold\">5<\/text>\n <rect x=\"900\" y=\"380\" width=\"100\" height=\"150\" fill=\"#e3f2fd\" stroke=\"#1976d2\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"950\" y=\"410\" text-anchor=\"middle\" font-size=\"11\" font-weight=\"bold\">Decrypt<\/text>\n <text x=\"950\" y=\"430\" text-anchor=\"middle\" font-size=\"9\">Session Key<\/text>\n <text x=\"950\" y=\"445\" text-anchor=\"middle\" font-size=\"9\">with Private Key<\/text>\n <text x=\"950\" y=\"465\" text-anchor=\"middle\" font-size=\"9\">Message with<\/text>\n <text x=\"950\" y=\"480\" text-anchor=\"middle\" font-size=\"9\">Session Key<\/text>\n <line x1=\"950\" y1=\"340\" x2=\"950\" y2=\"380\" stroke=\"#1976d2\" stroke-width=\"2\" marker-end=\"url(#arrow1)\"\/>\n <\/g>\n \n \n <path d=\"M 190 300 L 310 300\" stroke=\"#666\" stroke-width=\"3\" marker-end=\"url(#arrow1)\"\/>\n <path d=\"M 390 300 L 510 300\" stroke=\"#666\" stroke-width=\"3\" marker-end=\"url(#arrow1)\"\/>\n <path d=\"M 590 300 L 710 300\" stroke=\"#666\" stroke-width=\"3\" marker-end=\"url(#arrow1)\"\/>\n <path d=\"M 790 300 L 910 300\" stroke=\"#666\" stroke-width=\"3\" marker-end=\"url(#arrow1)\"\/>\n \n <defs>\n <marker id=\"arrow1\" markerWidth=\"10\" markerHeight=\"10\" refX=\"9\" refY=\"3\" orient=\"auto\">\n <polygon points=\"0 0, 10 3, 0 6\" fill=\"#666\"\/>\n <\/marker>\n <\/defs>\n <\/svg>\n <\/div>\n <\/div>\n \n <div id=\"tab2\" class=\"tab-content\">\n <div class=\"code-block\">\n# Complete Encryption Flow in Sender.py\n\n# 1. Retrieve receiver’s public key\nwith open(f”keys\/{receiver_id}_public.key”, “r”) as f:\n public_key_b64 = f.read().strip()\n\n# 2. Create sealed box for asymmetric encryption\npublic_key = PublicKey(b64decode(public_key_b64))\nsealed_box = SealedBox(public_key)\n\n# 3. Generate random session key\nsession_key = os.urandom(32) # 256-bit\n\n# 4. Encrypt session key with public key\nenc_session_key = sealed_box.encrypt(session_key)\n\n# 5. Generate random nonce\nnonce = os.urandom(12) # 96-bit\n\n# 6. Encrypt message with ChaCha20-Poly1305\ncipher = ChaCha20Poly1305(session_key)\nmessage_bytes = message[“content”].encode(‘utf-8’)\nciphertext_with_tag = cipher.encrypt(nonce, message_bytes, None)\n# \u2191 includes ciphertext + tag (16 bytes)\n\n# 7. Construct final message\nencrypted_message = {\n “message_id”: f”{sender_id}-{correlation_id}-{receiver_id}”,\n “receiver_client_id”: receiver_id,\n “enc_session_key”: b64encode(enc_session_key).decode(‘utf-8’),\n “nonce”: b64encode(nonce).decode(‘utf-8’),\n “ciphertext”: b64encode(ciphertext_with_tag).decode(‘utf-8’),\n “sent_time”: datetime.now(timezone.utc).isoformat()\n}\n\n# 8. Send to server\ncommand = f”publish {exchange_name} {routing_key} {json.dumps(encrypted_message)}\\n”\nwriter.write(command.encode(‘utf-8’))\n <\/div>\n \n <div class=\"code-block\" style=\"margin-top: 20px;\">\n# Complete Decryption Flow in Receiver.py\n\n# 1. Receive encrypted message\nmessage_data = json.loads(message_str)\n\n# 2. Decrypt session key with private key\nenc_session_key = b64decode(message_data[“enc_session_key”])\nsealed_box = SealedBox(PRIVATE_KEY)\nsession_key = sealed_box.decrypt(enc_session_key)\n\n# 3. Extract nonce and ciphertext+tag\nnonce = b64decode(message_data[“nonce”])\nciphertext_with_tag = b64decode(message_data[“ciphertext”])\n\n# 4. Decrypt and verify message\ncipher = ChaCha20Poly1305(session_key)\ntry:\n plaintext_bytes = cipher.decrypt(nonce, ciphertext_with_tag, None)\n # \u2191 Inside this function:\n # – Tag is separated\n # – Tag is verified\n # – If valid, decrypts\n \n plaintext = plaintext_bytes.decode(‘utf-8’)\n print(f”Message received: {plaintext}”)\n \nexcept InvalidTag:\n print(“\u274c Message tampered or corrupted!”)\n <\/div>\n <\/div>\n \n <div id=\"tab3\" class=\"tab-content\">\n <div class=\"diagram-container\">\n <svg viewBox=\"0 0 1200 700\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n <rect width=\"1200\" height=\"700\" fill=\"#f8f9fa\"\/>\n \n \n <text x=\"600\" y=\"40\" text-anchor=\"middle\" font-size=\"24\" font-weight=\"bold\">Version 1.x vs 2.0 Comparison<\/text>\n \n \n <g id=\"v1\">\n <rect x=\"50\" y=\"80\" width=\"550\" height=\"550\" fill=\"#ffe6e6\" stroke=\"#dc3545\" stroke-width=\"3\" rx=\"10\"\/>\n <text x=\"325\" y=\"120\" text-anchor=\"middle\" font-size=\"20\" font-weight=\"bold\" fill=\"#dc3545\">\u274c Version 1.x (Non-standard)<\/text>\n \n \n <rect x=\"100\" y=\"150\" width=\"450\" height=\"200\" fill=\"#fff\" stroke=\"#666\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"325\" y=\"175\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Sender<\/text>\n <text x=\"325\" y=\"200\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">result = cipher.encrypt(…)<\/text>\n <text x=\"325\" y=\"220\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\" fill=\"#dc3545\">tag = result[-16:] # \u274c Manual<\/text>\n <text x=\"325\" y=\"240\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\" fill=\"#dc3545\">ciphertext = result[:-16] # \u274c Manual<\/text>\n <text x=\"325\" y=\"270\" text-anchor=\"middle\" font-size=\"11\" fill=\"#666\">Send tag separately in JSON<\/text>\n <text x=\"325\" y=\"290\" text-anchor=\"middle\" font-size=\"11\" fill=\"#666\">“tag”: “…”, “ciphertext”: “…”<\/text>\n <text x=\"325\" y=\"320\" text-anchor=\"middle\" font-size=\"10\" fill=\"#dc3545\">\u26a0\ufe0f Dangerous and unnecessary<\/text>\n \n \n <rect x=\"100\" y=\"380\" width=\"450\" height=\"200\" fill=\"#fff\" stroke=\"#666\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"325\" y=\"405\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Receiver<\/text>\n <text x=\"325\" y=\"430\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\" fill=\"#dc3545\">tag = b64decode(msg[“tag”]) # \u274c Manual<\/text>\n <text x=\"325\" y=\"450\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\" fill=\"#dc3545\">ct = b64decode(msg[“ciphertext”])<\/text>\n <text x=\"325\" y=\"470\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\" fill=\"#dc3545\">combined = ct + tag # \u274c Recombine<\/text>\n <text x=\"325\" y=\"490\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\">plaintext = cipher.decrypt(nonce, combined)<\/text>\n <text x=\"325\" y=\"520\" text-anchor=\"middle\" font-size=\"10\" fill=\"#dc3545\">\u26a0\ufe0f Complex and error-prone<\/text>\n <text x=\"325\" y=\"540\" text-anchor=\"middle\" font-size=\"10\" fill=\"#dc3545\">3 lines of unnecessary code<\/text>\n <\/g>\n \n \n <g id=\"v2\">\n <rect x=\"650\" y=\"80\" width=\"500\" height=\"550\" fill=\"#e8f5e9\" stroke=\"#4caf50\" stroke-width=\"3\" rx=\"10\"\/>\n <text x=\"900\" y=\"120\" text-anchor=\"middle\" font-size=\"20\" font-weight=\"bold\" fill=\"#4caf50\">\u2705 Version 2.0 (Standard)<\/text>\n \n \n <rect x=\"700\" y=\"150\" width=\"400\" height=\"200\" fill=\"#fff\" stroke=\"#666\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"900\" y=\"175\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Sender<\/text>\n <text x=\"900\" y=\"200\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\" fill=\"#4caf50\">result = cipher.encrypt(…)<\/text>\n <text x=\"900\" y=\"220\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\" fill=\"#4caf50\"># \u2705 Includes tag<\/text>\n <text x=\"900\" y=\"250\" text-anchor=\"middle\" font-size=\"11\" fill=\"#666\">Send together in JSON<\/text>\n <text x=\"900\" y=\"270\" text-anchor=\"middle\" font-size=\"11\" fill=\"#666\">“ciphertext”: “…” (includes tag)<\/text>\n <text x=\"900\" y=\"300\" text-anchor=\"middle\" font-size=\"10\" fill=\"#4caf50\">\u2713 Simple and secure<\/text>\n <text x=\"900\" y=\"320\" text-anchor=\"middle\" font-size=\"10\" fill=\"#4caf50\">\u2713 RFC 7539 standard<\/text>\n \n \n <rect x=\"700\" y=\"380\" width=\"400\" height=\"200\" fill=\"#fff\" stroke=\"#666\" stroke-width=\"2\" rx=\"5\"\/>\n <text x=\"900\" y=\"405\" text-anchor=\"middle\" font-size=\"16\" font-weight=\"bold\">Receiver<\/text>\n <text x=\"900\" y=\"430\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\" fill=\"#4caf50\">data = b64decode(msg[“ciphertext”])<\/text>\n <text x=\"900\" y=\"450\" text-anchor=\"middle\" font-size=\"12\" font-family=\"monospace\" fill=\"#4caf50\">plaintext = cipher.decrypt(nonce, data)<\/text>\n <text x=\"900\" y=\"470\" text-anchor=\"middle\" font-size=\"12\" fill=\"#4caf50\"># \u2705 Library handles tag<\/text>\n <text x=\"900\" y=\"500\" text-anchor=\"middle\" font-size=\"10\" fill=\"#4caf50\">\u2713 Less code<\/text>\n <text x=\"900\" y=\"520\" text-anchor=\"middle\" font-size=\"10\" fill=\"#4caf50\">\u2713 Zero error probability<\/text>\n <text x=\"900\" y=\"540\" text-anchor=\"middle\" font-size=\"10\" fill=\"#4caf50\">\u2713 Constant-time operations<\/text>\n <\/g>\n \n \n <text x=\"600\" y=\"350\" text-anchor=\"middle\" font-size=\"18\" fill=\"#666\">\u2192<\/text>\n <\/svg>\n <\/div>\n \n <div class=\"note\">\n Enhanced data and fully compliant with international standards.\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n \n <script>\n function showTab(tabId) {\n \/\/ Remove active class from all tabs and contents\n document.querySelectorAll('.tab').forEach(tab => tab.classList.remove('active'));\n document.querySelectorAll('.tab-content').forEach(content => content.classList.remove('active'));\n \n \/\/ Add active class to clicked tab and corresponding content\n document.querySelector(`button[onclick=\"showTab('${tabId}')\"]`).classList.add('active');\n document.getElementById(tabId).classList.add('active');\n }\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Hybrid Cryptography Diagrams 1\ufe0f\u20e3 Hybrid Cryptography Overview SENDER Step 1: Generate Session Key session_key = RANDOM(32 bytes) Step 2: Asymmetric Encryption X25519 + Sealed Box enc_session_key = Encrypt(session_key, receiver_public_key) Step 3: Symmetric Encryption ChaCha20-Poly1305 AEAD ciphertext+tag = Encrypt(message, session_key) Step 4: Send to Receiver Secure Transmission mTLS RECEIVER Step 1: Receive Encrypted Message Step 2: […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-9","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ciphermq.com\/docs\/index.php\/wp-json\/wp\/v2\/pages\/9","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ciphermq.com\/docs\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ciphermq.com\/docs\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ciphermq.com\/docs\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ciphermq.com\/docs\/index.php\/wp-json\/wp\/v2\/comments?post=9"}],"version-history":[{"count":6,"href":"https:\/\/ciphermq.com\/docs\/index.php\/wp-json\/wp\/v2\/pages\/9\/revisions"}],"predecessor-version":[{"id":31,"href":"https:\/\/ciphermq.com\/docs\/index.php\/wp-json\/wp\/v2\/pages\/9\/revisions\/31"}],"wp:attachment":[{"href":"https:\/\/ciphermq.com\/docs\/index.php\/wp-json\/wp\/v2\/media?parent=9"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}