@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600&family=Inter:wght@400;500;600&display=swap";:root{--sidebar-width:350px}:root[data-theme=dark]{--primary-color:#3b82f6;--primary-dark:#2563eb;--primary-glow:#3b82f666;--bg-default:#0f172a;--bg-panel:#1e293b;--bg-chat:transparent;--bg-glass:#1e293bd9;--bg-transparent:#0f172a66;--wa-bg-color:#0b141a;--wa-bg-opacity:.05;--text-primary:#f8fafc;--text-secondary:#94a3b8;--border-color:#ffffff1a;--msg-out:#3b82f6;--msg-in:#334155;--system-msg:#ffffff0d}:root[data-theme=light]{--primary-color:#3b82f6;--primary-dark:#2563eb;--primary-glow:#3b82f64d;--bg-default:#f1f5f9;--bg-panel:#fff;--bg-chat:transparent;--bg-glass:#ffffffd9;--bg-transparent:#ffffff80;--wa-bg-color:#efeae2;--wa-bg-opacity:.08;--text-primary:#0f172a;--text-secondary:#64748b;--border-color:#0000001a;--msg-out:#3b82f6;--msg-in:#fff;--system-msg:#0000000d}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-default);color:var(--text-primary);justify-content:center;align-items:center;height:100vh;margin:0;font-family:Inter,sans-serif;transition:background-color .3s;display:flex;overflow:hidden}[data-theme=dark] body{background-image:radial-gradient(at 0 0,#3b82f61a,#0000 40%),radial-gradient(at 100% 100%,#8b5cf61a,#0000 40%)}[data-theme=light] body{background-image:radial-gradient(at 0 0,#3b82f626,#0000 40%),radial-gradient(at 100% 100%,#10b9811a,#0000 40%)}h1,h2,h3,.chat-title,.user-name{letter-spacing:-.02em;font-family:Outfit,sans-serif}#root{background:0 0;width:100%;max-width:1600px;height:100%;display:flex}@media (width>=1000px){#root{background:0 0;border-radius:20px;width:95%;height:95%;margin-top:15px;overflow:hidden;box-shadow:0 25px 50px -12px #00000080,0 0 0 1px #ffffff0d}}.login-container{background:0 0;justify-content:center;align-items:center;gap:60px;width:100%;max-width:1400px;height:100%;margin:0 auto;padding:0 40px;display:flex;position:relative}.split-login-card{background:var(--bg-glass);-webkit-backdrop-filter:blur(40px);width:95%;max-width:1000px;height:600px;box-shadow:0 25px 50px -12px #00000080, 0 0 0 1px var(--border-color);border-radius:24px;animation:.6s cubic-bezier(.16,1,.3,1) forwards slideUp;display:flex;overflow:hidden}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.split-left{color:#fff;background:linear-gradient(135deg,#1e293b 0%,#0f172a 100%);flex-direction:column;flex:1;justify-content:center;padding:60px;display:flex;position:relative}.hero-title{letter-spacing:-1px;margin-bottom:24px;font-family:Georgia,serif;font-size:56px;font-weight:700;line-height:1.1}.hero-highlight{color:#60a5fa}.hero-subtitle{color:#94a3b8;max-width:320px;margin-bottom:40px;font-size:16px;line-height:1.6}.feature-list{flex-direction:column;gap:16px;display:flex}.feature-item{color:#cbd5e1;align-items:center;gap:12px;font-size:15px;display:flex}.feature-item svg{color:#60a5fa}.typing-cursor{font-size:24px;font-weight:700;animation:1s step-end infinite blink-cursor;position:absolute;bottom:60px;left:60px}@keyframes blink-cursor{50%{opacity:0}}.split-right{background:var(--bg-default);flex-direction:column;flex:1;justify-content:center;padding:60px;display:flex}.brand-header{align-items:center;gap:12px;margin-bottom:40px;display:flex}.brand-logo{background:var(--primary-color);width:40px;height:40px;box-shadow:0 4px 12px var(--primary-glow);border-radius:10px;justify-content:center;align-items:center;display:flex}.brand-name{color:var(--text-primary);letter-spacing:-.5px;font-size:20px;font-weight:700}.form-header h2{color:var(--text-primary);letter-spacing:-.5px;margin-bottom:8px;font-size:28px;font-weight:600}.form-header p{color:var(--text-secondary);margin-bottom:32px;font-size:15px}.form-error{color:#ef4444;background:#ef44441a;border:1px solid #ef444433;border-radius:12px;margin-bottom:20px;padding:12px;font-size:13px}.split-form{flex-direction:column;gap:20px;display:flex}.split-input-group label{color:var(--text-primary);margin-bottom:8px;font-size:13px;font-weight:500;display:block}.input-wrapper{align-items:center;display:flex;position:relative}.input-icon{color:var(--text-secondary);position:absolute;left:16px}.input-wrapper input{border:1px solid var(--border-color);width:100%;color:var(--text-primary);background:0 0;border-radius:12px;outline:none;padding:14px 16px 14px 44px;font-size:15px;transition:all .2s}.input-wrapper input:focus{border-color:var(--primary-color);box-shadow:0 0 0 4px var(--primary-glow)}.split-submit-btn{background:var(--primary-color);color:#fff;cursor:pointer;width:100%;box-shadow:0 4px 12px var(--primary-glow);border:none;border-radius:12px;margin-top:8px;padding:16px;font-size:16px;font-weight:600;transition:all .2s}.split-submit-btn:hover{background:var(--primary-dark);transform:translateY(-1px)}.split-footer{text-align:center;color:var(--text-secondary);margin-top:32px;font-size:14px}.split-footer span{color:var(--primary-color);cursor:pointer;font-weight:500}.local-key-notice{color:var(--text-secondary);text-align:center;margin-top:16px;font-size:12px}@media (width<=800px){.split-login-card{flex-direction:column;height:auto;max-height:90vh;overflow-y:auto}.split-left,.split-right{padding:40px}}.app-container{background-color:var(--bg-glass);width:100%;height:100%;display:flex}.sidebar{width:var(--sidebar-width);border-right:1px solid var(--border-color);background-color:#00000026;flex-direction:column;flex-shrink:0;display:flex}.sidebar-header{border-bottom:1px solid var(--border-color);background:0 0;align-items:center;height:70px;padding:0 20px;display:flex}.avatar{color:#fff;background:linear-gradient(135deg,#475569,#1e293b);border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;font-weight:700;transition:transform .3s;display:flex;overflow:hidden;box-shadow:0 2px 10px #0003}.avatar:hover{transform:scale(1.05)}.sidebar-search{border-bottom:1px solid var(--border-color);padding:16px}.search-input-wrapper{background-color:#8080801a;border:1px solid #0000;border-radius:12px;align-items:center;height:42px;padding:0 16px;transition:border-color .3s,background-color .3s;display:flex}.search-input-wrapper:focus-within{background-color:#80808026;border-color:#8080804d}.search-input-wrapper input{width:100%;color:var(--text-primary);background:0 0;border:none;outline:none;padding:10px;font-size:15px}.users-list{flex:1;overflow-y:auto}.users-list::-webkit-scrollbar{width:6px}.users-list::-webkit-scrollbar-thumb{background-color:#ffffff1a;border-radius:3px}.user-item{cursor:pointer;border-bottom:1px solid #ffffff05;align-items:center;padding:14px 20px;transition:all .2s;display:flex}.user-item:hover{background-color:#ffffff0d;padding-left:24px}.user-info{flex:1;margin-left:15px}.user-name{color:var(--text-primary);margin-bottom:4px;font-size:16px;font-weight:500}.user-status{color:var(--text-secondary);align-items:center;gap:6px;font-size:13px;display:flex}.status-dot{background-color:#10b981;border-radius:50%;width:8px;height:8px;box-shadow:0 0 8px #10b98199}.chat-area{background-color:var(--wa-bg-color);flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.chat-area:before{content:"";opacity:var(--wa-bg-opacity);z-index:0;pointer-events:none;background-image:url(https://user-images.githubusercontent.com/15075759/28719144-86dc0f70-73b1-11e7-911d-60d70fcded21.png);background-repeat:repeat;background-size:400px;position:absolute;inset:0}.chat-header{background:var(--bg-panel);border-bottom:1px solid var(--border-color);z-index:10;cursor:pointer;align-items:center;height:70px;padding:0 24px;transition:background-color .2s;display:flex}.chat-header:hover{background:#1e293be6}.chat-header-info{margin-left:16px}.chat-title{color:var(--text-primary);font-size:18px;font-weight:600}.chat-subtitle{color:var(--primary-color);margin-top:2px;font-size:13px;font-weight:500}.chat-messages{z-index:1;flex-direction:column;flex:1;gap:16px;padding:24px 10%;display:flex;position:relative;overflow-y:auto}.chat-messages::-webkit-scrollbar{width:6px}.chat-messages::-webkit-scrollbar-thumb{background-color:#ffffff1a;border-radius:3px}.message-wrapper{flex-direction:column;max-width:70%;animation:.3s cubic-bezier(.175,.885,.32,1.275) popIn;display:flex}@keyframes popIn{0%{opacity:0;transform:scale(.95)translateY(10px)}to{opacity:1;transform:scale(1)translateY(0)}}.message-wrapper.sent{align-self:flex-end}.message-wrapper.received{align-self:flex-start}.message-wrapper.system{align-self:center;max-width:90%}.message-bubble{word-wrap:break-word;border-radius:18px;padding:12px 16px;font-size:15px;line-height:1.5;position:relative;box-shadow:0 2px 8px #0000000d}.message-wrapper.sent .message-bubble{background:var(--msg-out);color:#fff;border-bottom-right-radius:4px}.message-wrapper.received .message-bubble{background-color:var(--msg-in);color:var(--text-primary);border:1px solid #ffffff0d;border-bottom-left-radius:4px;box-shadow:0 4px 16px #0000001f,0 1px 3px #00000014}.message-wrapper.system .message-bubble{background-color:var(--system-msg);color:var(--text-secondary);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid #ffffff0d;border-radius:12px;padding:8px 16px;font-size:13px}.delete-btn{opacity:0;visibility:hidden;pointer-events:none}.message-wrapper:hover .delete-btn{opacity:1;visibility:visible;pointer-events:auto}.message-sender{color:#a855f7;margin-bottom:4px;font-size:13px;font-weight:600}.message-time{opacity:.7;float:right;margin-top:8px;margin-bottom:-4px;margin-left:12px;font-size:11px}.chat-input-container{background:var(--bg-panel);border-top:1px solid var(--border-color);z-index:10;align-items:center;gap:16px;min-height:76px;padding:0 24px;display:flex;position:relative}.chat-input-wrapper{background-color:#8080801a;border:1px solid #0000;border-radius:20px;flex:1;align-items:center;padding:12px 20px;transition:border-color .3s,background-color .3s;display:flex}.chat-input-wrapper:focus-within{background-color:#80808026;border-color:#8080804d}.chat-input-wrapper input{width:100%;color:var(--text-primary);background:0 0;border:none;outline:none;font-size:15px}.chat-input-wrapper input::placeholder{color:var(--text-secondary)}.icon-btn{cursor:pointer;color:var(--text-secondary);background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:8px;transition:all .2s;display:flex}.icon-btn:hover{color:var(--text-primary);background:#ffffff1a;transform:scale(1.1)}.icon-btn.primary{color:var(--primary-color)}.icon-btn.primary:hover{background:var(--primary-glow);color:#fff}.typing-indicator{color:var(--primary-color);align-items:center;gap:6px;padding:8px 16px;font-size:13px;font-weight:500;display:flex}.typing-dot{background-color:currentColor;border-radius:50%;width:4px;height:4px;animation:1.4s ease-in-out infinite both typingBounce}.typing-dot:first-child{animation-delay:-.32s}.typing-dot:nth-child(2){animation-delay:-.16s}@keyframes typingBounce{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}@media (width<=768px){.sidebar{display:none}.chat-area{width:100%}.chat-messages{padding:20px 16px}.message-wrapper{max-width:85%}}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1000;background:#0009;justify-content:center;align-items:center;animation:.3s fadeIn;display:flex;position:fixed;inset:0}.modal-content{background:var(--bg-panel);border:1px solid var(--border-color);border-radius:24px;flex-direction:column;align-items:center;width:90%;max-width:400px;padding:32px;animation:.3s cubic-bezier(.175,.885,.32,1.275) scaleUp;display:flex;position:relative;box-shadow:0 25px 50px -12px #00000080}.modal-close{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:50%;padding:8px;display:flex;position:absolute;top:16px;right:16px}.modal-close:hover{color:#fff;background:#ffffff1a}.modal-avatar{object-fit:cover;border:4px solid var(--bg-default);aspect-ratio:1;border-radius:50%;flex-shrink:0;width:180px;height:180px;margin-bottom:20px;box-shadow:0 8px 24px #0000004d}.modal-title{margin-bottom:4px;font-size:24px;font-weight:600}.modal-subtitle{color:#10b981;margin-bottom:24px;font-size:14px;font-weight:500}.modal-section{background:var(--bg-default);border-radius:12px;width:100%;margin-bottom:16px;padding:16px}.modal-section-title{text-transform:uppercase;color:var(--text-secondary);letter-spacing:.5px;margin-bottom:8px;font-size:12px;font-weight:600}.modal-section-content{color:var(--text-primary);word-break:break-all;background:#0003;border:1px solid #ffffff0d;border-radius:8px;padding:12px;font-family:monospace;font-size:13px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleUp{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.toast-container{z-index:1000;pointer-events:none;position:fixed;bottom:100px;left:50%;transform:translate(-50%)}.toast{color:#fff;background:linear-gradient(135deg,#f59e0b,#ef4444);border-radius:30px;align-items:center;gap:8px;padding:12px 24px;font-size:14px;font-weight:500;animation:.4s cubic-bezier(.175,.885,.32,1.275) forwards toastPop;display:flex;box-shadow:0 10px 25px #ef444466}@keyframes toastPop{0%{opacity:0;transform:translateY(20px)scale(.9)}to{opacity:1;transform:translateY(0)scale(1)}}@media (width<=900px){#root{border-radius:0;width:100%;max-width:100%;height:100dvh;margin:0;overflow:hidden}body{height:100dvh;overflow:hidden}.app-container{width:100%;height:100dvh;overflow:hidden}.sidebar{flex-direction:column;height:100dvh;display:flex;overflow:hidden;width:100%!important}.sidebar-header{flex-shrink:0;height:auto;min-height:64px;padding:10px 16px}.users-list{-webkit-overflow-scrolling:touch;flex:1;overflow-y:auto}.user-item{min-height:60px;padding:14px 16px}.user-item:hover{padding-left:16px}.user-name{font-size:15px}.chat-area{flex-direction:column;height:100dvh;flex:none!important;width:100%!important}.chat-header{flex-shrink:0;height:60px;padding:0 10px}.chat-messages{-webkit-overflow-scrolling:touch;flex:1;padding:10px 8px;overflow-y:auto}.message-bubble{font-size:15px;max-width:80vw!important}.chat-input-container{flex-shrink:0;gap:6px;padding:8px}.chat-input{min-height:44px;border-radius:24px!important;padding:10px 14px!important;font-size:16px!important}.send-button{flex-shrink:0;border-radius:50%!important;width:44px!important;min-width:44px!important;height:44px!important;min-height:44px!important}.login-container{align-items:center;padding:3vh 16px 16px}.split-login-card{border-radius:20px;flex-direction:column;width:100%;max-width:100%;height:auto;max-height:97dvh;overflow-y:auto}.split-left{display:none}.split-right{flex:none;width:100%;padding:32px 24px}.modal-content{width:90%;max-width:360px}.unread-badge{min-width:20px;height:20px;font-size:11px}}.mobile-back-btn{display:none}@media (width<=900px){.mobile-back-btn{color:var(--text-primary);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;min-width:42px;min-height:42px;margin-right:6px;padding:8px;display:flex!important}.mobile-back-btn:active{background:#80808033}}@media (width<=480px){.action-pill-btn span{display:none}.action-pill-btn{justify-content:center;min-width:40px;min-height:40px;border-radius:50%!important;padding:8px!important}}