2FA Cloud Manager<\/title>\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n <script src=\"https:\/\/cdn.jsdelivr.net\/gh\/hectorm\/otpauth@master\/dist\/otpauth.umd.min.js\"><\/script>\n \n <script src=\"https:\/\/www.gstatic.com\/firebasejs\/10.7.1\/firebase-app-compat.js\"><\/script>\n <script src=\"https:\/\/www.gstatic.com\/firebasejs\/10.7.1\/firebase-auth-compat.js\"><\/script>\n <script src=\"https:\/\/www.gstatic.com\/firebasejs\/10.7.1\/firebase-firestore-compat.js\"><\/script>\n\n <style>\n body { \n -webkit-tap-highlight-color: transparent; \n margin: 0; \n padding: 0; \n background-color: #f8fafc; \n font-family: system-ui, -apple-system, sans-serif;\n overscroll-behavior-y: contain;\n }\n .app-container { max-width: 480px; margin: 0 auto; padding: 16px; }\n .card { background: white; border-radius: 1.5rem; padding: 1.25rem; border: 1px solid #e2e8f0; box-shadow: 0 4px 15px -3px rgba(0,0,0,0.05); margin-bottom: 1.25rem; }\n .btn-primary { \n width: 100%; \n background: #2563eb; \n color: white; \n padding: 1rem; \n border-radius: 1rem; \n font-weight: 800; \n cursor: pointer; \n border: none; \n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n box-shadow: 0 4px 12px rgba(37, 99, 235, 0.2);\n text-transform: uppercase;\n letter-spacing: 0.025em;\n }\n .btn-primary:active { transform: scale(0.96); background: #1d4ed8; }\n .result-card { \n background: #0f172a; \n border-radius: 2rem; \n padding: 1.5rem; \n color: white; \n display: none; \n animation: slideUp 0.5s cubic-bezier(0.16, 1, 0.3, 1);\n box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.2);\n scroll-margin-top: 20px;\n }\n @keyframes slideUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } }\n .otp-box { \n background: linear-gradient(145deg, #1e293b, #0f172a); \n border: 1px solid rgba(255,255,255,0.1); \n border-radius: 1.25rem; \n padding: 1.75rem 1rem; \n text-align: center; \n cursor: pointer; \n margin-bottom: 1.25rem;\n position: relative;\n overflow: hidden;\n }\n .otp-code { \n font-family: 'Monaco', 'Courier New', monospace; \n font-size: 3rem; \n font-weight: 900; \n letter-spacing: 0.2em; \n color: #38bdf8; \n text-shadow: 0 0 25px rgba(56, 189, 248, 0.4);\n margin-left: 0.2em;\n }\n .progress-container { position: absolute; bottom: 0; left: 0; width: 100%; height: 4px; background: rgba(255,255,255,0.05); }\n .progress-bar { height: 100%; background: #38bdf8; width: 100%; transition: width 1s linear; }\n .info-row { \n display: flex; \n justify-content: space-between; \n align-items: center; \n background: rgba(255,255,255,0.05); \n padding: 1rem; \n border-radius: 1rem; \n margin-top: 0.75rem; \n border: 1px solid rgba(255,255,255,0.08); \n }\n textarea { \n width: 100%; \n height: 150px; \n padding: 14px; \n background: #f1f5f9; \n border: 2px solid transparent; \n border-radius: 1rem; \n font-family: 'ui-monospace', monospace; \n font-size: 14px; \n outline: none; \n margin-bottom: 12px; \n resize: none; \n transition: all 0.3s;\n color: #334155;\n }\n textarea:focus { border-color: #2563eb; background: white; box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.1); }\n .toast { \n position: fixed; \n bottom: 40px; \n left: 50%; \n transform: translateX(-50%); \n background: rgba(15, 23, 42, 0.9); \n backdrop-filter: blur(8px);\n color: white; \n padding: 12px 28px; \n border-radius: 50px; \n font-size: 14px; \n font-weight: 700; \n display: none; \n z-index: 1000; \n box-shadow: 0 10px 25px rgba(0,0,0,0.3);\n border: 1px solid rgba(255,255,255,0.1);\n }\n .status-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; margin-right: 8px; }\n <\/style>\n<\/head>\n<body>\n <div class=\"app-container\">\n <div class=\"flex justify-between items-end mb-6 px-1\">\n <div class=\"flex flex-col\">\n <span class=\"text-[11px] font-black text-slate-400 uppercase tracking-[0.2em] mb-1\">D\u1eef li\u1ec7u Cloud<\/span>\n <div class=\"flex items-center bg-white px-3 py-1.5 rounded-full border border-slate-200 shadow-sm\">\n <span id=\"status-dot\" class=\"status-dot bg-slate-300\"><\/span>\n <span id=\"sync-text\" class=\"text-xs font-bold text-slate-500 uppercase\">\u0110ang k\u1ebft n\u1ed1i…<\/span>\n <\/div>\n <\/div>\n <div class=\"text-right\">\n <span class=\"text-[11px] font-black text-slate-400 uppercase tracking-[0.2em] mb-1\">L\u00e0m m\u1edbi sau<\/span>\n <p id=\"timer-box\" class=\"text-lg font-black text-blue-600 font-mono leading-none\">30s<\/p>\n <\/div>\n <\/div>\n\n <div class=\"card\">\n <div class=\"flex justify-between items-center mb-4\">\n <h2 class=\"text-[13px] font-black text-slate-800 tracking-tight uppercase\">Danh s\u00e1ch \u0111\u1ee3i<\/h2>\n <span id=\"line-count\" class=\"bg-blue-600 text-white px-3 py-1 rounded-lg text-[11px] font-black shadow-md\">0 D\u00d2NG<\/span>\n <\/div>\n <textarea id=\"input-list\" placeholder=\"\u0110\u1ecbnh d\u1ea1ng: UID|Pass|Key2FA...\"><\/textarea>\n <button id=\"next-btn\" class=\"btn-primary flex items-center justify-center gap-3\">\n <span>L\u1ea5y d\u00f2ng ti\u1ebfp theo<\/span>\n <svg width=\"20\" height=\"20\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" viewBox=\"0 0 24 24\"><path d=\"M13 5l7 7-7 7M5 5l7 7-7 7\"><\/path><\/svg>\n <\/button>\n <\/div>\n\n <div id=\"result-area\" class=\"result-card\">\n <div id=\"otp-click\" class=\"otp-box active:scale-95 transition-all\">\n <p class=\"text-[11px] text-blue-400\/70 font-black uppercase tracking-[0.3em] mb-3\">M\u00e3 x\u00e1c th\u1ef1c 2FA<\/p>\n <div id=\"otp-display\" class=\"otp-code\">——<\/div>\n <p class=\"text-[10px] text-white\/30 font-bold uppercase mt-4\">Ch\u1ea1m \u0111\u1ec3 sao ch\u00e9p nhanh<\/p>\n <div class=\"progress-container\">\n <div id=\"otp-progress\" class=\"progress-bar\"><\/div>\n <\/div>\n <\/div>\n \n <div class=\"space-y-3\">\n <div class=\"info-row\">\n <div class=\"overflow-hidden flex-1 mr-4\">\n <p class=\"text-[10px] text-white\/40 font-black uppercase tracking-wider mb-1\">T\u00e0i kho\u1ea3n (UID)<\/p>\n <p id=\"uid-display\" class=\"text-base font-bold font-mono truncate text-blue-100\">—<\/p>\n <\/div>\n <button onclick=\"copyText('uid-display')\" class=\"bg-blue-600 text-white px-5 py-2.5 rounded-xl text-[12px] font-black active:scale-90 transition-all shadow-lg\">CH\u00c9P<\/button>\n <\/div>\n \n <div class=\"info-row\">\n <div class=\"overflow-hidden flex-1 mr-4\">\n <p class=\"text-[10px] text-white\/40 font-black uppercase tracking-wider mb-1\">M\u1eadt kh\u1ea9u<\/p>\n <p id=\"pass-display\" class=\"text-base font-bold font-mono truncate text-blue-100\">—<\/p>\n <\/div>\n <button onclick=\"copyText('pass-display')\" class=\"bg-blue-600 text-white px-5 py-2.5 rounded-xl text-[12px] font-black active:scale-90 transition-all shadow-lg\">CH\u00c9P<\/button>\n <\/div>\n <\/div>\n <\/div>\n\n <div id=\"error-help\" class=\"mt-4 p-4 bg-red-50 border border-red-100 rounded-2xl hidden\">\n <p class=\"text-[12px] text-red-600 font-bold mb-2\">L\u1ed7i k\u1ebft n\u1ed1i Firebase:<\/p>\n <p class=\"text-[11px] text-red-500 leading-relaxed\">\n 1. M\u1edf Firebase Console d\u1ef1 \u00e1n <b>hiep2-199b8<\/b>.<br>\n 2. V\u00e0o Authentication -> Sign-in Method -> B\u1eadt <b>Anonymous<\/b>.<br>\n 3. V\u00e0o Firestore -> Rules -> S\u1eeda th\u00e0nh <code>allow read, write: if true;<\/code>\n <\/p>\n <\/div>\n <\/div>\n\n <div id=\"toast\" class=\"toast\">\u0110\u00c3 SAO CH\u00c9P TH\u00c0NH C\u00d4NG<\/div>\n\n <script>\n \/\/ C\u1eadp nh\u1eadt Firebase Config m\u1edbi t\u1ea1i \u0111\u00e2y\n const firebaseConfig = {\n apiKey: \"AIzaSyDYY6smBxhYe3XY5TeHXyNjhd8OpHi4vVw\",\n authDomain: \"hiep2-199b8.firebaseapp.com\",\n projectId: \"hiep2-199b8\",\n storageBucket: \"hiep2-199b8.firebasestorage.app\",\n messagingSenderId: \"139932187672\",\n appId: \"1:139932187672:web:a8173f4c190209d6e3d76d\",\n measurementId: \"G-ZJE32R9CXN\"\n };\n\n const APP_ID = 'hiep-2fa-cloud-v2';\n let currentUser = null;\n let currentSecret = '';\n let db = null;\n\n function updateStatus(text, type) {\n const dot = document.getElementById('status-dot');\n const txt = document.getElementById('sync-text');\n txt.innerText = text;\n if (type === 'ok') {\n dot.className = 'status-dot bg-emerald-500 shadow-[0_0_10px_rgba(16,185,129,0.6)]';\n txt.className = 'text-xs font-bold text-emerald-600 uppercase tracking-tighter';\n } else if (type === 'error') {\n dot.className = 'status-dot bg-red-500 shadow-[0_0_10px_rgba(239,68,68,0.6)]';\n txt.className = 'text-xs font-bold text-red-600 uppercase tracking-tighter';\n document.getElementById('error-help').classList.remove('hidden');\n }\n }\n\n window.copyText = function(id) {\n const text = document.getElementById(id).innerText;\n if (text.includes('-') || text === 'ERROR') return;\n \n const el = document.createElement('textarea');\n el.value = text;\n document.body.appendChild(el);\n el.select();\n document.execCommand('copy');\n document.body.removeChild(el);\n\n const toast = document.getElementById('toast');\n toast.style.display = 'block';\n setTimeout(() => toast.style.display = 'none', 1500);\n \n if (navigator.vibrate) navigator.vibrate(30);\n };\n\n function generateOTP() {\n if (!currentSecret) return;\n try {\n const cleanSecret = currentSecret.replace(\/\\s+\/g, '').toUpperCase();\n const totp = new OTPAuth.TOTP({ secret: cleanSecret });\n document.getElementById('otp-display').innerText = totp.generate();\n } catch (e) {\n document.getElementById('otp-display').innerText = 'ERROR';\n }\n }\n\n function updateLineCount() {\n const val = document.getElementById('input-list').value.trim();\n const count = val ? val.split('\\n').length : 0;\n document.getElementById('line-count').innerText = count + ' D\u00d2NG';\n }\n\n async function syncToCloud(content) {\n if (!currentUser || !db) return;\n try {\n const docRef = db.collection('artifacts').doc(APP_ID).collection('public').doc('data').collection('storage').doc('shared');\n await docRef.set({ list: content, timestamp: Date.now() }, { merge: true });\n } catch (e) { console.error(\"Cloud Error:\", e); }\n }\n\n document.addEventListener('DOMContentLoaded', () => {\n const area = document.getElementById('input-list');\n \n if (!firebase.apps.length) firebase.initializeApp(firebaseConfig);\n const auth = firebase.auth();\n db = firebase.firestore();\n\n auth.signInAnonymously().then(cred => {\n currentUser = cred.user;\n updateStatus(`\u0110\u00e3 k\u1ebft n\u1ed1i: ${currentUser.uid.substring(0,6)}`, 'ok');\n\n const docRef = db.collection('artifacts').doc(APP_ID).collection('public').doc('data').collection('storage').doc('shared');\n docRef.onSnapshot(doc => {\n if (doc.exists && document.activeElement !== area) {\n area.value = doc.data().list || '';\n updateLineCount();\n }\n }, err => {\n updateStatus(\"L\u1ed7i ph\u00e2n quy\u1ec1n Firestore\", \"error\");\n });\n }).catch(err => {\n updateStatus(`L\u1ed7i \u0111\u0103ng nh\u1eadp: ${err.code}`, \"error\");\n });\n\n setInterval(() => {\n const now = Date.now();\n const seconds = 30 - (Math.floor(now \/ 1000) % 30);\n const msInCycle = now % 30000;\n const progress = ((30000 - msInCycle) \/ 30000) * 100;\n \n document.getElementById('timer-box').innerText = seconds + 's';\n document.getElementById('otp-progress').style.width = progress + '%';\n \n if (seconds === 30) generateOTP();\n }, 100);\n\n document.getElementById('next-btn').onclick = () => {\n const raw = area.value.trim();\n if (!raw) return;\n \n const lines = raw.split('\\n');\n const current = lines.shift();\n const remainder = lines.join('\\n');\n \n area.value = remainder;\n updateLineCount();\n syncToCloud(remainder);\n\n const p = current.split(\/[|\\t]+\/).map(x => x.trim());\n if (p.length >= 2) {\n document.getElementById('uid-display').innerText = p[0];\n document.getElementById('pass-display').innerText = p[1];\n currentSecret = p[2] || '';\n \n const resultArea = document.getElementById('result-area');\n resultArea.style.display = 'block';\n generateOTP();\n \n resultArea.scrollIntoView({ behavior: 'smooth', block: 'start' });\n }\n };\n\n document.getElementById('otp-click').onclick = () => copyText('otp-display');\n \n area.oninput = () => {\n updateLineCount();\n clearTimeout(window.saveDebounce);\n window.saveDebounce = setTimeout(() => syncToCloud(area.value), 1000);\n };\n });\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<div class=\"mh-excerpt\"><p>2FA Cloud Manager D\u1eef li\u1ec7u Cloud \u0110ang k\u1ebft n\u1ed1i… L\u00e0m m\u1edbi sau 30s Danh s\u00e1ch \u0111\u1ee3i 0 D\u00d2NG L\u1ea5y d\u00f2ng ti\u1ebfp theo M\u00e3 x\u00e1c th\u1ef1c <a class=\"mh-excerpt-more\" href=\"https:\/\/tinbamien.com\/?page_id=6\" title=\"\">[…]<\/a><\/p>\n<\/div>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-6","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/tinbamien.com\/index.php?rest_route=\/wp\/v2\/pages\/6","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tinbamien.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tinbamien.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/tinbamien.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tinbamien.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=6"}],"version-history":[{"count":2,"href":"https:\/\/tinbamien.com\/index.php?rest_route=\/wp\/v2\/pages\/6\/revisions"}],"predecessor-version":[{"id":20,"href":"https:\/\/tinbamien.com\/index.php?rest_route=\/wp\/v2\/pages\/6\/revisions\/20"}],"wp:attachment":[{"href":"https:\/\/tinbamien.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=6"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":6,"date":"2026-04-07T13:21:39","date_gmt":"2026-04-07T13:21:39","guid":{"rendered":"https:\/\/tinbamien.com\/?page_id=6"},"modified":"2026-04-07T13:35:13","modified_gmt":"2026-04-07T13:35:13","slug":"6-2","status":"publish","type":"page","link":"https:\/\/tinbamien.com\/?page_id=6","title":{"rendered":""},"content":{"rendered":"\n\n\n\n \n \n 2FA Cloud Manager<\/title>\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n <script src=\"https:\/\/cdn.jsdelivr.net\/gh\/hectorm\/otpauth@master\/dist\/otpauth.umd.min.js\"><\/script>\n \n <script src=\"https:\/\/www.gstatic.com\/firebasejs\/10.7.1\/firebase-app-compat.js\"><\/script>\n <script src=\"https:\/\/www.gstatic.com\/firebasejs\/10.7.1\/firebase-auth-compat.js\"><\/script>\n <script src=\"https:\/\/www.gstatic.com\/firebasejs\/10.7.1\/firebase-firestore-compat.js\"><\/script>\n\n <style>\n body { \n -webkit-tap-highlight-color: transparent; \n margin: 0; \n padding: 0; \n background-color: #f8fafc; \n font-family: system-ui, -apple-system, sans-serif;\n overscroll-behavior-y: contain;\n }\n .app-container { max-width: 480px; margin: 0 auto; padding: 16px; }\n .card { background: white; border-radius: 1.5rem; padding: 1.25rem; border: 1px solid #e2e8f0; box-shadow: 0 4px 15px -3px rgba(0,0,0,0.05); margin-bottom: 1.25rem; }\n .btn-primary { \n width: 100%; \n background: #2563eb; \n color: white; \n padding: 1rem; \n border-radius: 1rem; \n font-weight: 800; \n cursor: pointer; \n border: none; \n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n box-shadow: 0 4px 12px rgba(37, 99, 235, 0.2);\n text-transform: uppercase;\n letter-spacing: 0.025em;\n }\n .btn-primary:active { transform: scale(0.96); background: #1d4ed8; }\n .result-card { \n background: #0f172a; \n border-radius: 2rem; \n padding: 1.5rem; \n color: white; \n display: none; \n animation: slideUp 0.5s cubic-bezier(0.16, 1, 0.3, 1);\n box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.2);\n scroll-margin-top: 20px;\n }\n @keyframes slideUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } }\n .otp-box { \n background: linear-gradient(145deg, #1e293b, #0f172a); \n border: 1px solid rgba(255,255,255,0.1); \n border-radius: 1.25rem; \n padding: 1.75rem 1rem; \n text-align: center; \n cursor: pointer; \n margin-bottom: 1.25rem;\n position: relative;\n overflow: hidden;\n }\n .otp-code { \n font-family: 'Monaco', 'Courier New', monospace; \n font-size: 3rem; \n font-weight: 900; \n letter-spacing: 0.2em; \n color: #38bdf8; \n text-shadow: 0 0 25px rgba(56, 189, 248, 0.4);\n margin-left: 0.2em;\n }\n .progress-container { position: absolute; bottom: 0; left: 0; width: 100%; height: 4px; background: rgba(255,255,255,0.05); }\n .progress-bar { height: 100%; background: #38bdf8; width: 100%; transition: width 1s linear; }\n .info-row { \n display: flex; \n justify-content: space-between; \n align-items: center; \n background: rgba(255,255,255,0.05); \n padding: 1rem; \n border-radius: 1rem; \n margin-top: 0.75rem; \n border: 1px solid rgba(255,255,255,0.08); \n }\n textarea { \n width: 100%; \n height: 150px; \n padding: 14px; \n background: #f1f5f9; \n border: 2px solid transparent; \n border-radius: 1rem; \n font-family: 'ui-monospace', monospace; \n font-size: 14px; \n outline: none; \n margin-bottom: 12px; \n resize: none; \n transition: all 0.3s;\n color: #334155;\n }\n textarea:focus { border-color: #2563eb; background: white; box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.1); }\n .toast { \n position: fixed; \n bottom: 40px; \n left: 50%; \n transform: translateX(-50%); \n background: rgba(15, 23, 42, 0.9); \n backdrop-filter: blur(8px);\n color: white; \n padding: 12px 28px; \n border-radius: 50px; \n font-size: 14px; \n font-weight: 700; \n display: none; \n z-index: 1000; \n box-shadow: 0 10px 25px rgba(0,0,0,0.3);\n border: 1px solid rgba(255,255,255,0.1);\n }\n .status-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; margin-right: 8px; }\n <\/style>\n<\/head>\n<body>\n <div class=\"app-container\">\n <div class=\"flex justify-between items-end mb-6 px-1\">\n <div class=\"flex flex-col\">\n <span class=\"text-[11px] font-black text-slate-400 uppercase tracking-[0.2em] mb-1\">D\u1eef li\u1ec7u Cloud<\/span>\n <div class=\"flex items-center bg-white px-3 py-1.5 rounded-full border border-slate-200 shadow-sm\">\n <span id=\"status-dot\" class=\"status-dot bg-slate-300\"><\/span>\n <span id=\"sync-text\" class=\"text-xs font-bold text-slate-500 uppercase\">\u0110ang k\u1ebft n\u1ed1i…<\/span>\n <\/div>\n <\/div>\n <div class=\"text-right\">\n <span class=\"text-[11px] font-black text-slate-400 uppercase tracking-[0.2em] mb-1\">L\u00e0m m\u1edbi sau<\/span>\n <p id=\"timer-box\" class=\"text-lg font-black text-blue-600 font-mono leading-none\">30s<\/p>\n <\/div>\n <\/div>\n\n <div class=\"card\">\n <div class=\"flex justify-between items-center mb-4\">\n <h2 class=\"text-[13px] font-black text-slate-800 tracking-tight uppercase\">Danh s\u00e1ch \u0111\u1ee3i<\/h2>\n <span id=\"line-count\" class=\"bg-blue-600 text-white px-3 py-1 rounded-lg text-[11px] font-black shadow-md\">0 D\u00d2NG<\/span>\n <\/div>\n <textarea id=\"input-list\" placeholder=\"\u0110\u1ecbnh d\u1ea1ng: UID|Pass|Key2FA...\"><\/textarea>\n <button id=\"next-btn\" class=\"btn-primary flex items-center justify-center gap-3\">\n <span>L\u1ea5y d\u00f2ng ti\u1ebfp theo<\/span>\n <svg width=\"20\" height=\"20\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" viewBox=\"0 0 24 24\"><path d=\"M13 5l7 7-7 7M5 5l7 7-7 7\"><\/path><\/svg>\n <\/button>\n <\/div>\n\n <div id=\"result-area\" class=\"result-card\">\n <div id=\"otp-click\" class=\"otp-box active:scale-95 transition-all\">\n <p class=\"text-[11px] text-blue-400\/70 font-black uppercase tracking-[0.3em] mb-3\">M\u00e3 x\u00e1c th\u1ef1c 2FA<\/p>\n <div id=\"otp-display\" class=\"otp-code\">——<\/div>\n <p class=\"text-[10px] text-white\/30 font-bold uppercase mt-4\">Ch\u1ea1m \u0111\u1ec3 sao ch\u00e9p nhanh<\/p>\n <div class=\"progress-container\">\n <div id=\"otp-progress\" class=\"progress-bar\"><\/div>\n <\/div>\n <\/div>\n \n <div class=\"space-y-3\">\n <div class=\"info-row\">\n <div class=\"overflow-hidden flex-1 mr-4\">\n <p class=\"text-[10px] text-white\/40 font-black uppercase tracking-wider mb-1\">T\u00e0i kho\u1ea3n (UID)<\/p>\n <p id=\"uid-display\" class=\"text-base font-bold font-mono truncate text-blue-100\">—<\/p>\n <\/div>\n <button onclick=\"copyText('uid-display')\" class=\"bg-blue-600 text-white px-5 py-2.5 rounded-xl text-[12px] font-black active:scale-90 transition-all shadow-lg\">CH\u00c9P<\/button>\n <\/div>\n \n <div class=\"info-row\">\n <div class=\"overflow-hidden flex-1 mr-4\">\n <p class=\"text-[10px] text-white\/40 font-black uppercase tracking-wider mb-1\">M\u1eadt kh\u1ea9u<\/p>\n <p id=\"pass-display\" class=\"text-base font-bold font-mono truncate text-blue-100\">—<\/p>\n <\/div>\n <button onclick=\"copyText('pass-display')\" class=\"bg-blue-600 text-white px-5 py-2.5 rounded-xl text-[12px] font-black active:scale-90 transition-all shadow-lg\">CH\u00c9P<\/button>\n <\/div>\n <\/div>\n <\/div>\n\n <div id=\"error-help\" class=\"mt-4 p-4 bg-red-50 border border-red-100 rounded-2xl hidden\">\n <p class=\"text-[12px] text-red-600 font-bold mb-2\">L\u1ed7i k\u1ebft n\u1ed1i Firebase:<\/p>\n <p class=\"text-[11px] text-red-500 leading-relaxed\">\n 1. M\u1edf Firebase Console d\u1ef1 \u00e1n <b>hiep2-199b8<\/b>.<br>\n 2. V\u00e0o Authentication -> Sign-in Method -> B\u1eadt <b>Anonymous<\/b>.<br>\n 3. V\u00e0o Firestore -> Rules -> S\u1eeda th\u00e0nh <code>allow read, write: if true;<\/code>\n <\/p>\n <\/div>\n <\/div>\n\n <div id=\"toast\" class=\"toast\">\u0110\u00c3 SAO CH\u00c9P TH\u00c0NH C\u00d4NG<\/div>\n\n <script>\n \/\/ C\u1eadp nh\u1eadt Firebase Config m\u1edbi t\u1ea1i \u0111\u00e2y\n const firebaseConfig = {\n apiKey: \"AIzaSyDYY6smBxhYe3XY5TeHXyNjhd8OpHi4vVw\",\n authDomain: \"hiep2-199b8.firebaseapp.com\",\n projectId: \"hiep2-199b8\",\n storageBucket: \"hiep2-199b8.firebasestorage.app\",\n messagingSenderId: \"139932187672\",\n appId: \"1:139932187672:web:a8173f4c190209d6e3d76d\",\n measurementId: \"G-ZJE32R9CXN\"\n };\n\n const APP_ID = 'hiep-2fa-cloud-v2';\n let currentUser = null;\n let currentSecret = '';\n let db = null;\n\n function updateStatus(text, type) {\n const dot = document.getElementById('status-dot');\n const txt = document.getElementById('sync-text');\n txt.innerText = text;\n if (type === 'ok') {\n dot.className = 'status-dot bg-emerald-500 shadow-[0_0_10px_rgba(16,185,129,0.6)]';\n txt.className = 'text-xs font-bold text-emerald-600 uppercase tracking-tighter';\n } else if (type === 'error') {\n dot.className = 'status-dot bg-red-500 shadow-[0_0_10px_rgba(239,68,68,0.6)]';\n txt.className = 'text-xs font-bold text-red-600 uppercase tracking-tighter';\n document.getElementById('error-help').classList.remove('hidden');\n }\n }\n\n window.copyText = function(id) {\n const text = document.getElementById(id).innerText;\n if (text.includes('-') || text === 'ERROR') return;\n \n const el = document.createElement('textarea');\n el.value = text;\n document.body.appendChild(el);\n el.select();\n document.execCommand('copy');\n document.body.removeChild(el);\n\n const toast = document.getElementById('toast');\n toast.style.display = 'block';\n setTimeout(() => toast.style.display = 'none', 1500);\n \n if (navigator.vibrate) navigator.vibrate(30);\n };\n\n function generateOTP() {\n if (!currentSecret) return;\n try {\n const cleanSecret = currentSecret.replace(\/\\s+\/g, '').toUpperCase();\n const totp = new OTPAuth.TOTP({ secret: cleanSecret });\n document.getElementById('otp-display').innerText = totp.generate();\n } catch (e) {\n document.getElementById('otp-display').innerText = 'ERROR';\n }\n }\n\n function updateLineCount() {\n const val = document.getElementById('input-list').value.trim();\n const count = val ? val.split('\\n').length : 0;\n document.getElementById('line-count').innerText = count + ' D\u00d2NG';\n }\n\n async function syncToCloud(content) {\n if (!currentUser || !db) return;\n try {\n const docRef = db.collection('artifacts').doc(APP_ID).collection('public').doc('data').collection('storage').doc('shared');\n await docRef.set({ list: content, timestamp: Date.now() }, { merge: true });\n } catch (e) { console.error(\"Cloud Error:\", e); }\n }\n\n document.addEventListener('DOMContentLoaded', () => {\n const area = document.getElementById('input-list');\n \n if (!firebase.apps.length) firebase.initializeApp(firebaseConfig);\n const auth = firebase.auth();\n db = firebase.firestore();\n\n auth.signInAnonymously().then(cred => {\n currentUser = cred.user;\n updateStatus(`\u0110\u00e3 k\u1ebft n\u1ed1i: ${currentUser.uid.substring(0,6)}`, 'ok');\n\n const docRef = db.collection('artifacts').doc(APP_ID).collection('public').doc('data').collection('storage').doc('shared');\n docRef.onSnapshot(doc => {\n if (doc.exists && document.activeElement !== area) {\n area.value = doc.data().list || '';\n updateLineCount();\n }\n }, err => {\n updateStatus(\"L\u1ed7i ph\u00e2n quy\u1ec1n Firestore\", \"error\");\n });\n }).catch(err => {\n updateStatus(`L\u1ed7i \u0111\u0103ng nh\u1eadp: ${err.code}`, \"error\");\n });\n\n setInterval(() => {\n const now = Date.now();\n const seconds = 30 - (Math.floor(now \/ 1000) % 30);\n const msInCycle = now % 30000;\n const progress = ((30000 - msInCycle) \/ 30000) * 100;\n \n document.getElementById('timer-box').innerText = seconds + 's';\n document.getElementById('otp-progress').style.width = progress + '%';\n \n if (seconds === 30) generateOTP();\n }, 100);\n\n document.getElementById('next-btn').onclick = () => {\n const raw = area.value.trim();\n if (!raw) return;\n \n const lines = raw.split('\\n');\n const current = lines.shift();\n const remainder = lines.join('\\n');\n \n area.value = remainder;\n updateLineCount();\n syncToCloud(remainder);\n\n const p = current.split(\/[|\\t]+\/).map(x => x.trim());\n if (p.length >= 2) {\n document.getElementById('uid-display').innerText = p[0];\n document.getElementById('pass-display').innerText = p[1];\n currentSecret = p[2] || '';\n \n const resultArea = document.getElementById('result-area');\n resultArea.style.display = 'block';\n generateOTP();\n \n resultArea.scrollIntoView({ behavior: 'smooth', block: 'start' });\n }\n };\n\n document.getElementById('otp-click').onclick = () => copyText('otp-display');\n \n area.oninput = () => {\n updateLineCount();\n clearTimeout(window.saveDebounce);\n window.saveDebounce = setTimeout(() => syncToCloud(area.value), 1000);\n };\n });\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<div class=\"mh-excerpt\"><p>2FA Cloud Manager D\u1eef li\u1ec7u Cloud \u0110ang k\u1ebft n\u1ed1i… L\u00e0m m\u1edbi sau 30s Danh s\u00e1ch \u0111\u1ee3i 0 D\u00d2NG L\u1ea5y d\u00f2ng ti\u1ebfp theo M\u00e3 x\u00e1c th\u1ef1c <a class=\"mh-excerpt-more\" href=\"https:\/\/tinbamien.com\/?page_id=6\" title=\"\">[…]<\/a><\/p>\n<\/div>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-6","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/tinbamien.com\/index.php?rest_route=\/wp\/v2\/pages\/6","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tinbamien.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tinbamien.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/tinbamien.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tinbamien.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=6"}],"version-history":[{"count":2,"href":"https:\/\/tinbamien.com\/index.php?rest_route=\/wp\/v2\/pages\/6\/revisions"}],"predecessor-version":[{"id":20,"href":"https:\/\/tinbamien.com\/index.php?rest_route=\/wp\/v2\/pages\/6\/revisions\/20"}],"wp:attachment":[{"href":"https:\/\/tinbamien.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=6"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}