.loading-screen{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#0a0a0f;transition:opacity .5s ease,visibility .5s ease}.loading-screen.fade-out{opacity:0;visibility:hidden}.loading-spinner{position:relative;width:64px;height:64px}.loading-spinner:before,.loading-spinner:after{content:"";position:absolute;border-radius:50%}.loading-spinner:before{top:0;right:0;bottom:0;left:0;border:3px solid rgba(102,126,234,.2);border-top-color:#667eea;animation:spin .8s linear infinite}.loading-spinner:after{top:8px;right:8px;bottom:8px;left:8px;border:3px solid rgba(118,75,162,.15);border-bottom-color:#764ba2;animation:spin 1.2s linear infinite reverse}@keyframes spin{to{transform:rotate(360deg)}}.loading-heart{font-size:2rem;margin-top:1.5rem;animation:heartPulse 1.5s ease-in-out infinite}@keyframes heartPulse{0%,to{transform:scale(1);opacity:.6}50%{transform:scale(1.2);opacity:1}}.loading-text{margin-top:1rem;font-size:.85rem;color:#fff6;letter-spacing:.15em;text-transform:uppercase;animation:textPulse 2s ease-in-out infinite}@keyframes textPulse{0%,to{opacity:.4}50%{opacity:.8}}.loading-dots:after{content:"";animation:dots 1.5s steps(4,end) infinite}@keyframes dots{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}to{content:""}}.skeleton{background:linear-gradient(90deg,#ffffff0d 25%,#ffffff1a,#ffffff0d 75%);background-size:200% 100%;animation:shimmer 1.5s ease-in-out infinite;border-radius:8px}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;background:#0a0a0f;color:#e0e0e0;min-height:100dvh;overflow-x:hidden;position:relative}.bg-layer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;overflow:hidden;background:linear-gradient(135deg,#0a0a0f,#1a0a2e,#0a1628)}.bg-blob{position:absolute;border-radius:50%;filter:blur(80px);opacity:.4;animation:blobFloat 20s ease-in-out infinite}.bg-blob:nth-child(1){width:600px;height:600px;background:radial-gradient(circle,#667eea 0%,transparent 70%);top:-10%;left:-10%;animation-duration:25s}.bg-blob:nth-child(2){width:500px;height:500px;background:radial-gradient(circle,#764ba2 0%,transparent 70%);bottom:-15%;right:-10%;animation-duration:20s;animation-delay:-5s}.bg-blob:nth-child(3){width:400px;height:400px;background:radial-gradient(circle,#667eea44 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);animation-duration:30s;animation-delay:-10s}.bg-blob:nth-child(4){width:300px;height:300px;background:radial-gradient(circle,#f093fb33 0%,transparent 70%);top:20%;right:15%;animation-duration:22s;animation-delay:-7s}@keyframes blobFloat{0%,to{transform:translate(0) scale(1)}25%{transform:translate(50px,-30px) scale(1.1)}50%{transform:translate(-20px,40px) scale(.95)}75%{transform:translate(30px,20px) scale(1.05)}}.bg-particles{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.particle{position:absolute;width:3px;height:3px;background:#667eea80;border-radius:50%;animation:particleFloat linear infinite}.particle:nth-child(odd){background:#764ba266;width:2px;height:2px}.particle:nth-child(3n){background:#f093fb4d;width:4px;height:4px}@keyframes particleFloat{0%{transform:translateY(100vh) rotate(0);opacity:0}10%{opacity:1}90%{opacity:1}to{transform:translateY(-10vh) rotate(720deg);opacity:0}}.bg-grid{position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(rgba(102,126,234,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(102,126,234,.03) 1px,transparent 1px);background-size:60px 60px;mask-image:radial-gradient(ellipse at center,black 30%,transparent 70%);-webkit-mask-image:radial-gradient(ellipse at center,black 30%,transparent 70%)}.bg-glow{position:absolute;width:400px;height:400px;border-radius:50%;background:radial-gradient(circle,rgba(102,126,234,.15) 0%,transparent 70%);pointer-events:none;transition:transform .3s ease-out;transform:translate(-50%,-50%)}#root{width:100%;max-width:1200px;margin:0 auto;padding:8vh 2rem 3rem;position:relative;z-index:1}.container{text-align:center;animation:fadeInUp .6s ease-out}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.main-layout{display:grid;grid-template-columns:1fr 340px;gap:2rem;align-items:start}.main-content{min-width:0}.info-sidebar{position:sticky;top:3rem}.info-card{background:#1a1a28b3;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(102,126,234,.15);border-radius:20px;padding:1.75rem;text-align:left;position:relative;overflow:hidden}.info-card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:20px;padding:1px;background:linear-gradient(135deg,rgba(102,126,234,.25),transparent 40%,transparent 60%,rgba(118,75,162,.25));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}.info-icon{width:48px;height:48px;border-radius:14px;background:linear-gradient(135deg,#667eea33,#764ba233);border:1px solid rgba(102,126,234,.25);display:flex;align-items:center;justify-content:center;font-size:1.4rem;margin-bottom:1rem}.info-card h3{font-size:1.1rem;font-weight:700;color:#e0e0e0;margin-bottom:.5rem;background:none;-webkit-text-fill-color:#e0e0e0}.info-text{font-size:.85rem;line-height:1.6;color:#ffffff80;margin-bottom:1.25rem}.info-text strong{color:#fffc}.analogy-box{background:#667eea14;border:1px solid rgba(102,126,234,.15);border-radius:12px;padding:1rem;margin-bottom:1.25rem}.analogy-label{display:block;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#667eea;margin-bottom:.5rem}.analogy-box p{font-size:.82rem;line-height:1.6;color:#fff9}.analogy-box p strong{color:#ffffffd9}.info-steps{display:flex;flex-direction:column;gap:.6rem;margin-bottom:1.25rem}.info-step{display:flex;align-items:center;gap:.6rem;font-size:.82rem;color:#fff9;line-height:1.4}.step-num{flex-shrink:0;width:26px;height:26px;border-radius:8px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:.7rem;font-weight:700;display:flex;align-items:center;justify-content:center}.info-step em{color:#fffc;font-style:normal}.fun-fact{background:#f093fb0f;border:1px solid rgba(240,147,251,.15);border-radius:12px;padding:1rem;margin-bottom:1rem}.fun-fact-label{display:block;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#f093fb;margin-bottom:.4rem}.fun-fact p{font-size:.8rem;line-height:1.5;color:#ffffff80}.fun-fact p strong{color:#ffffffbf}.info-disclaimer{background:#ffab000f;border:1px solid rgba(255,171,0,.12);border-radius:10px;padding:.75rem}.info-disclaimer p{font-size:.72rem;line-height:1.5;color:#ffab00b3}.info-disclaimer em{color:#ffab00d9;font-style:normal}.glass-card{background:#1a1a28cc;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(102,126,234,.15);border-radius:20px;padding:2rem;position:relative;overflow:hidden;transition:all .3s ease}.glass-card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:20px;padding:1px;background:linear-gradient(135deg,rgba(102,126,234,.3),transparent,rgba(118,75,162,.3));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}.glass-card:hover{border-color:#667eea4d;box-shadow:0 8px 32px #667eea1a}h1{font-size:2.5rem;margin-bottom:.25rem;background:linear-gradient(135deg,#667eea,#f093fb,#764ba2);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:shimmerText 3s ease-in-out infinite}@keyframes shimmerText{0%,to{background-position:0% center}50%{background-position:200% center}}.subtitle{color:#fff6;margin-bottom:2rem;font-size:1rem;font-weight:400}h2{font-size:1.35rem;margin-bottom:.25rem;color:#e0e0e0;font-weight:600}.tabs{display:flex;gap:.5rem;justify-content:center;margin-bottom:2rem;padding:.35rem;border-radius:16px;background:#1a1a2880;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.08);position:relative}.tab{flex:1;padding:.75rem 1.25rem;font-size:.9rem;border:none;border-radius:12px;cursor:pointer;font-weight:600;background:transparent;color:#fff6;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;z-index:1}.tab:hover{color:#fffc}.tab.active{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 4px 15px #667eea4d}.send-form{text-align:left;margin-top:1rem}.form-group{margin-bottom:1.25rem}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.form-group label{display:block;font-size:.75rem;font-weight:600;color:#ffffff80;margin-bottom:.5rem;text-transform:uppercase;letter-spacing:.08em}.form-group label .key-hint{display:inline-flex;align-items:center;gap:.25rem;margin-left:.5rem;padding:.15rem .5rem;background:#667eea1a;border:1px solid rgba(102,126,234,.2);border-radius:4px;font-size:.65rem;font-weight:700;color:#667eea;letter-spacing:.05em}.form-group input,.form-group textarea{width:100%;padding:.85rem 1rem;font-size:.95rem;font-family:inherit;background:#0a0a0f99;color:#e0e0e0;border:1px solid rgba(255,255,255,.1);border-radius:12px;outline:none;transition:all .3s ease;-moz-appearance:textfield}.form-group input[type=number]::-webkit-inner-spin-button,.form-group input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.number-input-wrapper{display:flex;align-items:center;gap:0;border:1px solid rgba(255,255,255,.1);border-radius:12px;overflow:hidden;transition:all .3s ease}.number-input-wrapper input{flex:1;border:none;border-radius:12px 0 0 12px;padding-right:.5rem;background:transparent}.spin-controls{display:flex;flex-direction:column;gap:0}.spin-btn{display:flex;align-items:center;justify-content:center;width:36px;height:21.5px;border:1px solid rgba(255,255,255,.1);border-left:none;background:#0a0a0f99;color:#fff6;cursor:pointer;font-size:.7rem;transition:all .2s ease;padding:0}.spin-btn:first-child{border-radius:0 12px 0 0;border-bottom:1px solid rgba(255,255,255,.05)}.spin-btn:last-child{border-radius:0 0 12px}.spin-btn:hover{background:#667eea26;color:#667eea;border-color:#667eea4d}.spin-btn:active{background:#667eea40;transform:scale(.95)}.form-group input:focus,.form-group textarea:focus{border-color:#667eea;box-shadow:0 0 0 4px #667eea26,0 0 20px #667eea1a;background:#0a0a0fcc}.number-input-wrapper:has(input:focus){border-color:#667eea;box-shadow:0 0 0 4px #667eea26,0 0 20px #667eea1a}.number-input-wrapper:has(input:focus) .spin-btn{border-color:#667eea4d}.number-input-wrapper:has(input:focus) .spin-btn:hover{background:#667eea40}.form-group input::placeholder,.form-group textarea::placeholder{color:#fff3}.form-group textarea{resize:vertical;min-height:80px}.phone-otp-row{display:flex;gap:.5rem;align-items:center}.phone-otp-row input{flex:1}.otp-btn{flex-shrink:0;padding:.65rem 1rem;font-size:.8rem;background:#667eea26;border:1px solid rgba(102,126,234,.3);border-radius:10px;color:#667eea;font-weight:600;cursor:pointer;transition:all .2s ease;white-space:nowrap;font-family:inherit}.otp-btn:hover:not(:disabled){background:#667eea40;border-color:#667eea}.otp-btn:disabled{opacity:.5;cursor:not-allowed}.verified-badge{flex-shrink:0;padding:.65rem 1rem;font-size:.8rem;background:#2ed5731f;border:1px solid rgba(46,213,115,.25);border-radius:10px;color:#2ed573;font-weight:600;white-space:nowrap}.otp-input-section{background:#667eea0f;border:1px solid rgba(102,126,234,.15);border-radius:12px;padding:1rem;margin-bottom:1rem;margin-top:-.5rem}.otp-input-row{display:flex;gap:.5rem;align-items:center}.otp-input{flex:1;padding:.7rem .9rem;font-size:1.1rem;font-family:Fira Code,Consolas,monospace;font-weight:700;letter-spacing:.3em;text-align:center;background:#0a0a0f99;color:#e0e0e0;border:1px solid rgba(255,255,255,.1);border-radius:10px;outline:none;transition:all .3s ease}.otp-input:focus{border-color:#667eea;box-shadow:0 0 0 4px #667eea26}.otp-verify-btn{flex-shrink:0;padding:.7rem 1rem;font-size:.85rem;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:10px;color:#fff;font-weight:600;cursor:pointer;transition:all .2s ease;font-family:inherit}.otp-verify-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #667eea4d}.otp-hint{font-size:.75rem;color:#fff6;margin-top:.5rem;text-align:center}.otp-error{font-size:.82rem;color:#ff4757;background:#ff475714;border:1px solid rgba(255,71,87,.2);border-radius:8px;padding:.5rem .75rem;margin-bottom:1rem;margin-top:-.5rem}.password-row{display:flex;gap:0;align-items:center;border:1px solid rgba(255,255,255,.1);border-radius:12px;overflow:hidden;transition:all .3s ease}.password-row input{flex:1;border:none;border-radius:12px 0 0 12px;padding-right:.5rem;background:#0a0a0f99}.password-row:focus-within{border-color:#667eea;box-shadow:0 0 0 4px #667eea26,0 0 20px #667eea1a}.toggle-pw{flex-shrink:0;width:44px;height:100%;border:none;border-left:1px solid rgba(255,255,255,.08);background:#1a1a2880;color:#fff6;cursor:pointer;font-size:1rem;transition:all .2s ease;border-radius:0}.toggle-pw:hover{background:#667eea26;color:#667eea}.password-hint{font-size:.72rem;color:#ffab00b3;margin-top:.4rem;padding-left:.25rem}.toggle-label{display:flex;align-items:center;gap:1rem;cursor:pointer;-webkit-user-select:none;user-select:none}.toggle-label input[type=checkbox]{display:none}.toggle-slider{position:relative;width:44px;height:24px;border-radius:12px;background:#ffffff26;transition:all .3s ease;flex-shrink:0;padding:2px}.toggle-slider:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:all .3s ease}.toggle-label input:checked+.toggle-slider{background:linear-gradient(135deg,#667eea,#764ba2)}.toggle-label input:checked+.toggle-slider:after{transform:translate(20px)}.toggle-text{font-size:.82rem;color:#fff9;line-height:1.6}.toggle-hint{font-size:.78rem;font-weight:500;padding:.4rem .65rem;border-radius:8px;margin-top:.4rem;transition:all .3s ease}.toggle-hint:has(+.toggle-label input:checked),.toggle-label:has(input:checked)~.toggle-hint{color:#2ed573;background:#2ed5731a}.toggle-label:not(:has(input:checked))~.toggle-hint{color:#f093fb;background:#f093fb14}.how-it-works{display:grid;grid-template-columns:100px 1fr;gap:1.25rem;align-items:start;margin-bottom:1.25rem}.flow-card{display:flex;flex-direction:column;align-items:center;gap:.25rem;background:#1a1a2880;border:1px solid rgba(102,126,234,.15);border-radius:14px;padding:.75rem .5rem}.flow-item{display:flex;flex-direction:column;align-items:center;gap:.1rem}.flow-icon{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.15rem}.flow-icon-send{background:#667eea26;border:1px solid rgba(102,126,234,.25)}.flow-icon-lock{background:#ffab001f;border:1px solid rgba(255,171,0,.25)}.flow-icon-wa{background:#25d3661f;border:1px solid rgba(37,211,102,.25)}.flow-icon-unlock{background:#2ed5731f;border:1px solid rgba(46,213,115,.25)}.flow-label{font-size:.6rem;font-weight:700;color:#ffffff80;text-transform:uppercase;letter-spacing:.05em;margin-top:.15rem}.flow-arrow{font-size:.85rem;color:#667eea80;line-height:1}.password-display-card{background:#f093fb14;border:1px solid rgba(240,147,251,.2);border-radius:12px;padding:1rem;margin-top:.5rem}.password-display-row{display:flex;align-items:center;gap:.5rem}.password-display-value{flex:1;background:#0a0a0f99;border:1px solid rgba(240,147,251,.25);border-radius:8px;padding:.65rem .85rem;font-family:Fira Code,Consolas,monospace;font-size:1.1rem;font-weight:700;letter-spacing:.15em;color:#f093fb;text-align:center}.copy-pw-btn{flex-shrink:0;padding:.65rem .85rem;font-size:.82rem;background:#f093fb26;border:1px solid rgba(240,147,251,.3);border-radius:8px;color:#f093fb;font-weight:600;cursor:pointer;transition:all .2s ease;font-family:inherit;white-space:nowrap}.copy-pw-btn:hover{background:#f093fb40;border-color:#f093fb}.copy-pw-btn:active{transform:scale(.95)}button{padding:.85rem 1.5rem;font-size:.95rem;border:none;border-radius:12px;cursor:pointer;font-weight:600;font-family:inherit;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}button:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,transparent,rgba(255,255,255,.1),transparent);transform:translate(-100%);transition:transform .5s ease}button:hover:after{transform:translate(100%)}button:disabled{opacity:.5;cursor:not-allowed}button:active:not(:disabled){transform:scale(.98)}.btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 4px 15px #667eea40}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 25px #667eea66}.btn-primary:active:not(:disabled){transform:translateY(0) scale(.98)}.btn-send-wa{width:100%;margin-top:.5rem;padding:1rem;font-size:1rem}.btn-secondary{background:#ffffff0d;color:#ffffffb3;border:1px solid rgba(255,255,255,.1);text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.btn-secondary:hover{background:#ffffff1a;border-color:#667eea80;color:#fff}.status-badge{display:inline-block;padding:.35rem 1rem;border-radius:20px;font-size:.8rem;font-weight:600;margin-bottom:1rem;animation:fadeInUp .3s ease-out}.status-badge.loading{background:#667eea26;color:#667eea;border:1px solid rgba(102,126,234,.2)}.status-badge.success{background:#2ed57326;color:#2ed573;border:1px solid rgba(46,213,115,.2)}.status-badge.error{background:#ff475726;color:#ff4757;border:1px solid rgba(255,71,87,.2)}.response-box{background:#1a1a28b3;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:1.25rem;text-align:left;margin-top:1rem;animation:fadeInUp .3s ease-out}.response-box.loading{display:flex;align-items:center;justify-content:center;color:#667eea;border-color:#667eea33}.response-box.error{border-color:#ff47574d;background:#ff475714}.response-box.success{border-color:#2ed5734d;background:#2ed5730d}pre{white-space:pre-wrap;word-wrap:break-word;font-family:Fira Code,Consolas,monospace;font-size:.85rem;line-height:1.6;color:#fff9}.decrypt-card{background:#1a1a28b3;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:1.5rem;text-align:left;margin-top:1rem;animation:fadeInUp .4s ease-out}.decrypt-label{font-size:.7rem;font-weight:600;color:#fff6;text-transform:uppercase;letter-spacing:.08em;margin-bottom:.5rem;display:flex;align-items:center;gap:.5rem}.decrypt-value{background:#0a0a0f99;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:1rem;font-family:Fira Code,Consolas,monospace;font-size:.9rem;line-height:1.6;word-break:break-word;white-space:pre-wrap}.decrypt-value.encrypted{border-color:#667eea4d;color:#667eea}.decrypt-value.decrypted{border-color:#2ed5734d;color:#2ed573;background:#2ed5730d}.decrypt-arrow{text-align:center;font-size:1.25rem;color:#667eea80;margin:.75rem 0}.shift-badge{display:inline-flex;align-items:center;gap:.35rem;background:linear-gradient(135deg,#667eea33,#764ba233);color:#667eea;padding:.35rem .75rem;border-radius:8px;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;border:1px solid rgba(102,126,234,.3);box-shadow:0 2px 8px #667eea26}.shift-badge:before{content:"🔑";font-size:.8rem}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#667eea4d;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#667eea80}@media(max-width:640px){#root{padding:1.5rem 1rem}h1{font-size:2rem}.glass-card{padding:1.5rem;border-radius:16px}.tabs{border-radius:12px}.tab{padding:.65rem 1rem;font-size:.85rem}.main-layout{grid-template-columns:1fr}.info-sidebar{position:static}.info-card{order:-1;margin-bottom:1.5rem}.how-it-works{grid-template-columns:1fr}.flow-card{flex-direction:row;flex-wrap:wrap;justify-content:center;gap:.5rem}.flow-arrow{transform:rotate(-90deg)}.toggle-hint{font-size:.72rem;padding:.35rem .5rem}}.app-footer{margin-top:3rem;padding:1.5rem 0;text-align:center;border-top:1px solid rgba(255,255,255,.06)}.app-footer p{font-size:.8rem;color:#ffffff59}.app-footer strong{color:#fff9}.app-footer a{color:#667eea;text-decoration:none;transition:color .2s ease}.app-footer a:hover{color:#f093fb}