*{margin:0;padding:0;box-sizing:border-box;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}body,html{background-color:#0b141a;color:#e9edef;height:100dvh;overflow:hidden}.brand-text{font-family:Carter One,cursive;color:#9ea3a3;letter-spacing:1px}.whatsapp-layout{display:flex;height:100dvh;width:100vw;background:#000}.chat-list-panel{width:30%;min-width:350px;max-width:450px;border-right:1px solid #2F3336;display:flex;flex-direction:column;background:#111b21;flex-shrink:0}.list-header{padding:16px;background:#202c33;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #2F3336;flex-shrink:0}.header-actions{display:flex;align-items:center;gap:12px}.copy-id-btn{background:#2a3942;color:#9ea3a3;border:none;padding:8px 12px;border-radius:9999px;font-size:13px;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:6px;transition:.2s}.copy-id-btn:hover{background:#3a4a52;color:#fff}.profile-circle{width:40px;height:40px;border-radius:50%;background-color:#536471;background-size:cover;background-position:center;border:none;cursor:pointer;flex-shrink:0}.add-contact-bar{padding:12px 12px 8px;display:flex;gap:8px;background:#111b21;flex-shrink:0}.add-contact-bar input{flex:1;padding:10px;background:#202c33;border:none;border-radius:8px;color:#e9edef;outline:none}.add-contact-bar button{background:#9ea3a3;color:#000;border:none;width:40px;border-radius:8px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.2s}.add-contact-bar button:hover{background:#e9edef}.search-contact-bar{padding:0 12px 12px;background:#111b21;border-bottom:1px solid #2F3336;flex-shrink:0}.search-input-wrapper{display:flex;align-items:center;background:#202c33;border-radius:8px;padding:0 12px}.search-input-wrapper input{flex:1;padding:10px 8px;background:transparent;border:none;color:#e9edef;outline:none;font-size:14px}.contacts-container{flex:1;overflow-y:auto}.contact-row{display:flex;padding:12px 16px;gap:16px;cursor:pointer;border-bottom:1px solid #202C33;align-items:center}.contact-row:hover,.contact-row.active{background:#2a3942}.contact-avatar{width:48px;height:48px;border-radius:50%;background-color:#333;background-size:cover;background-position:center;flex-shrink:0}.contact-preview{display:flex;flex-direction:column;flex:1;overflow:hidden}.contact-name-row{display:flex;justify-content:space-between;align-items:center}.contact-name{font-size:17px;font-weight:500}.contact-time{font-size:12px;color:#8696a0}.last-msg{font-size:14px;color:#8696a0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}.chat-screen{flex:1;display:flex;flex-direction:column;background:#0b141a;position:relative;overflow:hidden;height:100dvh}.chat-header{padding:10px 16px;background:#202c33;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #2F3336;flex-shrink:0}.chat-header-info{display:flex;flex-direction:column}.chat-name{font-size:16px;font-weight:500}.chat-status{font-size:13px;color:#8696a0}.remove-chat{color:#f91880;transition:.2s}.remove-chat:hover{background:#f918801a}.messages-scroll{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:8px;background-image:linear-gradient(to bottom,#0b141ae6,#0b141ae6)}.msg-wrapper{display:flex;width:100%;margin-bottom:4px}.msg-wrapper.me{justify-content:flex-end}.msg-wrapper.them{justify-content:flex-start}.msg-bubble{position:relative;max-width:65%;padding:8px 12px;font-size:14px;border-radius:8px;word-wrap:break-word;line-height:1.4;display:flex;flex-direction:column}.msg-wrapper.me .msg-bubble{background:#005c4b;color:#e9edef;border-top-right-radius:0}.msg-wrapper.them .msg-bubble{background:#202c33;color:#e9edef;border-top-left-radius:0}.chat-media-img{max-width:100%;border-radius:8px;margin-top:8px}.msg-meta{display:flex;justify-content:flex-end;align-items:center;gap:4px;margin-top:4px;font-size:11px;color:#fff9}.msg-actions{position:absolute;top:4px;right:4px;opacity:0;transition:.2s;cursor:pointer;color:#8696a0;background:#00000080;border-radius:4px;padding:4px}.msg-bubble:hover .msg-actions{opacity:1}.chat-footer{padding:12px 16px;background:#202c33;display:flex;align-items:center;gap:12px;position:relative;flex-shrink:0;width:100%;min-height:60px;padding-bottom:max(12px,env(safe-area-inset-bottom))}.msg-input{flex:1;padding:12px 16px;background:#2a3942;border:none;border-radius:8px;color:#e9edef;font-size:15px;outline:none}.msg-input:disabled{opacity:.5}.icon-btn{background:transparent;border:none;color:#8696a0;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:8px;border-radius:50%}.icon-btn:hover{background:#2a3942}.icon-btn:disabled{opacity:.5;cursor:not-allowed}.empty-desktop-state{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#111b21;color:#8696a0}.empty-desktop-state h2{margin-top:24px;font-weight:300;color:#e9edef}.profile-page{display:flex;flex-direction:column;height:100dvh;background:#111b21;overflow-y:auto}.header-bar{padding:16px;background:#202c33;display:flex;align-items:center;gap:16px;border-bottom:1px solid #2F3336;position:sticky;top:0;z-index:10;flex-shrink:0}.profile-content{max-width:600px;margin:0 auto;padding:32px 16px 100px;width:100%;display:flex;flex-direction:column;gap:20px}.avatar-preview{width:150px;height:150px;border-radius:50%;background-color:#202c33;background-size:cover;background-position:center;margin:0 auto}.input-group{display:flex;flex-direction:column;gap:8px}.input-group label{color:#8696a0;font-size:14px}.input-group input{background:#202c33;border:1px solid #2F3336;padding:12px;border-radius:8px;color:#e9edef;outline:none}.input-group input:focus{border-color:#9ea3a3}.btn-primary{background:#9ea3a3;color:#000;border:none;padding:14px;border-radius:8px;font-weight:700;cursor:pointer}.btn-secondary{background:#202c33;color:#e9edef;border:none;padding:14px;border-radius:8px;cursor:pointer;font-weight:700;white-space:nowrap}.btn-danger{background:#f918801a;color:#f91880;border:1px solid #F91880;padding:14px;border-radius:8px;font-weight:700;cursor:pointer;white-space:nowrap}.advanced-settings{margin-top:40px;padding-top:32px;border-top:1px solid #2F3336;display:flex;flex-direction:column;gap:16px}.key-box{background:#202c33;padding:16px;border-radius:8px;border:1px solid #536471}.warning-box{border:1px dashed #F91880;background:#f918800d}.key-display{display:flex;align-items:center;gap:8px;margin-top:8px}.key-display input{flex:1;background:#111b21;border:1px solid #2F3336;padding:12px;color:#f91880;outline:none;font-family:monospace;border-radius:4px}.key-display button{background:#9ea3a3;border:none;padding:12px;border-radius:4px;color:#000;cursor:pointer;font-weight:700;flex-shrink:0}.legal-page{display:flex;flex-direction:column;height:100dvh;background:#111b21;overflow-y:auto}.legal-header{padding:16px;background:#202c33;display:flex;align-items:center;gap:16px;border-bottom:1px solid #2F3336;position:sticky;top:0;z-index:10;flex-shrink:0}.legal-content{max-width:800px;margin:0 auto;padding:40px 24px 100px;color:#e9edef;line-height:1.6}.legal-hero{text-align:center;margin-bottom:48px;display:flex;flex-direction:column;align-items:center;gap:16px}.legal-hero h2{color:#9ea3a3;font-size:28px;text-wrap:balance}.legal-warning{color:#f91880;font-weight:700;font-size:15px;text-wrap:balance;background:#f918801a;padding:12px 20px;border-radius:8px;border:1px dashed #F91880}.legal-section{margin-bottom:32px;background:#1a2329;padding:24px;border-radius:12px;border:1px solid #2F3336}.legal-section h3{margin-bottom:12px;color:#e9edef;font-size:18px;text-wrap:pretty}.legal-section p{color:#8696a0;font-size:15px;text-wrap:pretty;line-height:1.7}.auth-wrapper{display:flex;align-items:center;justify-content:center;height:100dvh;background-color:#0b141a;padding:20px}.auth-modal{background:#111b21;border:1px solid #2F3336;border-radius:16px;padding:48px 40px;width:100%;max-width:450px;display:flex;flex-direction:column;align-items:center;text-align:center;box-shadow:0 10px 30px #00000080}.auth-icon-wrapper{background:#202c33;padding:16px;border-radius:50%;margin-bottom:24px;border:1px solid #2F3336}.auth-logo{font-size:32px;margin-bottom:8px}.auth-modal h2{font-size:24px;margin-bottom:12px;color:#e9edef}.auth-sub{color:#8696a0;margin-bottom:32px;font-size:14px;line-height:1.5;text-wrap:balance}.auth-btn-primary{width:100%;background-color:#9ea3a3;color:#000;border:none;border-radius:8px;padding:16px;font-size:16px;font-weight:700;cursor:pointer;margin-bottom:24px;transition:.2s}.auth-btn-primary:hover{background-color:#fff;transform:translateY(-2px)}.divider{width:100%;display:flex;align-items:center;text-align:center;color:#536471;margin-bottom:24px}.divider:before,.divider:after{content:"";flex:1;border-bottom:1px solid #2F3336}.divider span{padding:0 16px;font-size:12px;font-weight:700;letter-spacing:1px}.login-form{width:100%;display:flex;flex-direction:column;gap:16px}.auth-input{width:100%;background:#202c33;border:1px solid #2F3336;border-radius:8px;padding:16px;color:#e9edef;outline:none;font-size:15px;text-align:center;transition:.2s}.auth-input:focus{border-color:#9ea3a3;background:#2a3942}.auth-btn-secondary{width:100%;background:transparent;border:1px solid #9EA3A3;color:#9ea3a3;border-radius:8px;padding:16px;font-size:16px;font-weight:700;cursor:pointer;transition:.2s}.auth-btn-secondary:hover{background:#9ea3a31a}.auth-error{color:#f91880;font-size:13px;margin-top:4px;text-wrap:balance}.custom-modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100dvh;background:#000000bf;display:flex;align-items:center;justify-content:center;z-index:9999;opacity:0;pointer-events:none;transition:.2s}.custom-modal-overlay.active{opacity:1;pointer-events:all}.custom-modal{background:#111b21;border:1px solid #2F3336;border-radius:12px;width:90%;max-width:400px;display:flex;flex-direction:column;overflow:hidden;transform:scale(.95);transition:.2s cubic-bezier(.16,1,.3,1)}.custom-modal-overlay.active .custom-modal{transform:scale(1)}.custom-modal-header{padding:16px 20px;background:#202c33;border-bottom:1px solid #2F3336;font-weight:700;color:#e9edef;font-size:18px}.custom-modal-body{padding:20px;color:#8696a0;font-size:15px;line-height:1.5;text-wrap:pretty}.custom-modal-footer{display:flex;border-top:1px solid #2F3336}.custom-modal-btn{flex:1;padding:16px;background:transparent;border:none;cursor:pointer;font-weight:700;font-size:15px;transition:.2s;color:#9ea3a3}.custom-modal-btn.cancel{border-right:1px solid #2F3336}.custom-modal-btn.cancel:hover{background:#2a3942}.custom-modal-btn.confirm{color:#e9edef}.custom-modal-btn.confirm.danger{color:#f91880}.custom-modal-btn.confirm:hover{background:#2a3942}@media (max-width: 768px){.chat-list-panel{width:100%;max-width:100%}.chat-screen{width:100%;position:absolute;top:0;left:0;height:100dvh;z-index:100}.msg-bubble{max-width:85%}.msg-actions{opacity:1;background:transparent;position:relative;top:0;right:0;padding:0;margin-top:8px}}