@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";
:root{--mac-bg:#f5f5f7;--mac-sidebar-bg:#f6f6f8b8;--mac-sidebar-selected:#0a84ff;--mac-border:#00000014;--mac-text:#1d1d1f;--mac-text-secondary:#6e6e73;--mac-text-muted:#86868b;--mac-blue:#007aff;--mac-blue-hover:#0071eb;--mac-bubble-received:#e9e9eb;--mac-bubble-sent:#007aff;--mac-input-bg:#fff;--mac-chat-bg:#fff;--mac-header-bg:#ffffffb8;--mac-shadow:0 24px 80px #0000001f,0 0 0 .5px #0000000f;--mac-scrollbar-thumb:#00000026;--mac-new-compose-bg:#0000000a}@media (prefers-color-scheme:dark){:root{--mac-bg:#1c1c1e;--mac-sidebar-bg:#1c1c1eb8;--mac-sidebar-selected:#0a84ff;--mac-border:#ffffff14;--mac-text:#f5f5f7;--mac-text-secondary:#a1a1a6;--mac-text-muted:#6e6e73;--mac-blue:#0a84ff;--mac-blue-hover:#409cff;--mac-bubble-received:#2c2c2e;--mac-bubble-sent:#0a84ff;--mac-input-bg:#2c2c2e;--mac-chat-bg:#000;--mac-header-bg:#1c1c1eb8;--mac-shadow:0 24px 80px #0006,0 0 0 .5px #ffffff1a;--mac-scrollbar-thumb:#ffffff26;--mac-new-compose-bg:#ffffff0f}}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);justify-content:center;align-items:center;height:100dvh;font-family:Inter,-apple-system,BlinkMacSystemFont,SF Pro Display,Segoe UI,Roboto,sans-serif;display:flex;overflow:hidden}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--mac-scrollbar-thumb);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#00000040}.mac-window{background-color:var(--mac-bg);width:90vw;max-width:1200px;height:88vh;box-shadow:var(--mac-shadow);border-radius:12px;animation:.4s cubic-bezier(.16,1,.3,1) windowAppear;display:flex;position:relative;overflow:hidden}@keyframes windowAppear{0%{opacity:0;transform:scale(.96)translateY(12px)}to{opacity:1;transform:scale(1)translateY(0)}}.sidebar{background-color:var(--mac-sidebar-bg);-webkit-backdrop-filter:blur(40px)saturate(180%);border-right:1px solid var(--mac-border);flex-direction:column;width:280px;min-width:280px;display:flex}.sidebar-header{border-bottom:1px solid var(--mac-border);-webkit-app-region:drag;flex-shrink:0;justify-content:space-between;align-items:center;height:52px;padding:0 16px;display:flex}.traffic-lights{align-items:center;gap:8px;display:flex}.light{border-radius:50%;width:12px;height:12px;transition:opacity .15s}.light:hover{opacity:.8}.light.red{background-color:#ff5f57}.light.yellow{background-color:#febc2e}.light.green{background-color:#28c840}.sidebar-title{color:var(--mac-text-secondary);letter-spacing:-.01em;font-size:13px;font-weight:600}.sidebar-search{flex-shrink:0;padding:12px 12px 8px}.search-input{background-color:var(--mac-new-compose-bg);width:100%;color:var(--mac-text);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2386868b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");background-position:8px;background-repeat:no-repeat;border:none;border-radius:8px;outline:none;padding:7px 10px 7px 30px;font-family:inherit;font-size:13px;transition:background-color .15s}.search-input::placeholder{color:var(--mac-text-muted)}.search-input:focus{background-color:var(--mac-input-bg);box-shadow:0 0 0 3px #0a84ff4d}.sidebar-content{flex:1;padding:4px 0;overflow-y:auto}.thread-item{cursor:pointer;border-radius:8px;margin:1px 8px;padding:10px 16px;transition:background-color .12s}.thread-item:hover{background-color:var(--mac-new-compose-bg)}.thread-item.active{background-color:var(--mac-sidebar-selected)}.thread-item.active .thread-name,.thread-item.active .thread-time,.thread-item.active .thread-preview{color:#fff}.thread-top-row{justify-content:space-between;align-items:baseline;margin-bottom:3px;display:flex}.thread-name{color:var(--mac-text);letter-spacing:-.01em;text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:13px;font-weight:600;overflow:hidden}.thread-time{color:var(--mac-text-muted);flex-shrink:0;margin-left:8px;font-size:11px}.thread-preview{color:var(--mac-text-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:12.5px;line-height:1.35;overflow:hidden}.empty-sidebar{text-align:center;color:var(--mac-text-muted);padding:24px 20px;font-size:13px;line-height:1.5}.empty-sidebar .phone-number{color:var(--mac-blue);margin-top:8px;font-weight:600;display:block}.new-message-btn{background-color:var(--mac-blue);color:#fff;cursor:pointer;border:none;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;gap:6px;margin:8px 12px 12px;padding:8px;font-family:inherit;font-size:13px;font-weight:500;transition:background-color .15s,transform .1s;display:flex}.new-message-btn:hover{background-color:var(--mac-blue-hover)}.new-message-btn:active{transform:scale(.97)}.chat-area{background-color:var(--mac-chat-bg);flex-direction:column;flex:1;min-width:0;display:flex}.chat-header{border-bottom:1px solid var(--mac-border);background-color:var(--mac-header-bg);-webkit-backdrop-filter:blur(40px)saturate(180%);flex-shrink:0;align-items:center;height:52px;padding:0 20px;display:flex}.chat-header-content{align-items:center;gap:10px;display:flex}.chat-header-avatar{color:#fff;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;font-size:12px;font-weight:600;display:flex}.chat-header-name{color:var(--mac-text);letter-spacing:-.01em;font-size:14px;font-weight:600}.chat-header-placeholder{color:var(--mac-text-muted);font-size:14px;font-weight:500}.chat-messages{flex-direction:column;flex:1;gap:4px;padding:20px;display:flex;overflow-y:auto}.message-group{flex-direction:column;gap:2px;display:flex}.message{word-wrap:break-word;border-radius:18px;max-width:60%;padding:8px 14px;font-size:14px;line-height:1.4;animation:.2s cubic-bezier(.16,1,.3,1) messageIn}@keyframes messageIn{0%{opacity:0;transform:translateY(6px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.message.received{background-color:var(--mac-bubble-received);color:var(--mac-text);border-bottom-left-radius:6px;align-self:flex-start}.message.sent{color:#fff;background:linear-gradient(135deg,#007aff,#0a84ff);border-bottom-right-radius:6px;align-self:flex-end}.message-time{color:var(--mac-text-muted);margin-top:4px;padding:0 4px;font-size:11px}.message-time.sent{text-align:right}.empty-chat{color:var(--mac-text-muted);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:12px;display:flex}.empty-chat-icon{opacity:.6;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;display:flex}.empty-chat-title{color:var(--mac-text);font-size:18px;font-weight:600}.empty-chat-subtitle{color:var(--mac-text-muted);text-align:center;max-width:280px;font-size:13px;line-height:1.5}.chat-input-area{border-top:1px solid var(--mac-border);background-color:var(--mac-chat-bg);flex-shrink:0;padding:12px 16px 16px}.input-wrapper{background-color:var(--mac-input-bg);border:1px solid var(--mac-border);border-radius:22px;align-items:center;padding:4px 6px 4px 16px;transition:border-color .15s,box-shadow .15s;display:flex}.input-wrapper:focus-within{border-color:var(--mac-blue);box-shadow:0 0 0 3px #0a84ff26}.chat-input{color:var(--mac-text);background:0 0;border:none;outline:none;flex:1;padding:8px 4px;font-family:inherit;font-size:14px}.chat-input::placeholder{color:var(--mac-text-muted)}.send-button{background-color:var(--mac-blue);color:#fff;cursor:pointer;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;transition:background-color .15s,transform .1s;display:flex}.send-button:hover{background-color:var(--mac-blue-hover);transform:scale(1.05)}.send-button:active{transform:scale(.92)}.send-button:disabled{opacity:.35;cursor:not-allowed;transform:none}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;background:#0000004d;justify-content:center;align-items:center;animation:.15s fadeIn;display:flex;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal{background:var(--mac-bg);border-radius:12px;width:380px;padding:24px;animation:.2s cubic-bezier(.16,1,.3,1) modalIn;box-shadow:0 20px 60px #0003}@keyframes modalIn{0%{opacity:0;transform:scale(.95)translateY(8px)}to{opacity:1;transform:scale(1)translateY(0)}}.modal h3{color:var(--mac-text);margin-bottom:16px;font-size:16px;font-weight:600}.modal-input{border:1px solid var(--mac-border);width:100%;color:var(--mac-text);background:var(--mac-input-bg);border-radius:8px;outline:none;margin-bottom:16px;padding:10px 12px;font-family:inherit;font-size:14px;transition:border-color .15s,box-shadow .15s}.modal-input:focus{border-color:var(--mac-blue);box-shadow:0 0 0 3px #0a84ff26}.modal-actions{justify-content:flex-end;gap:8px;display:flex}.modal-actions button{cursor:pointer;border-radius:8px;padding:8px 16px;font-family:inherit;font-size:13px;font-weight:500;transition:background-color .15s,transform .1s}.modal-cancel{background:var(--mac-new-compose-bg);border:1px solid var(--mac-border);color:var(--mac-text)}.modal-cancel:hover{background:var(--mac-border)}.modal-confirm{background:var(--mac-blue);color:#fff;border:none}.modal-confirm:hover{background:var(--mac-blue-hover)}.modal-confirm:disabled{opacity:.5;cursor:not-allowed}@media (max-width:768px){body{background:var(--mac-bg)}.mac-window{width:100vw;height:100dvh;box-shadow:none;border-radius:0}.sidebar{z-index:10;width:100%;height:100%;transition:transform .3s cubic-bezier(.16,1,.3,1);position:absolute}.sidebar.hidden{transform:translate(-100%)}}.toast{z-index:200;cursor:pointer;border-radius:10px;align-items:center;gap:8px;max-width:500px;padding:10px 20px;font-family:inherit;font-size:13px;animation:.25s cubic-bezier(.16,1,.3,1) toastIn;display:flex;position:fixed;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 8px 32px #00000026}@keyframes toastIn{0%{opacity:0;transform:translate(-50%)translateY(12px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.toast-warning{color:#856404;background:#fff3cd;border:1px solid #ffc107}.toast-error{color:#721c24;background:#f8d7da;border:1px solid #f5c6cb}.toast-info{color:#0c5460;background:#d1ecf1;border:1px solid #bee5eb}@media (prefers-color-scheme:dark){.toast-warning{color:#ffc107;background:#332b00;border-color:#665600}.toast-error{color:#f5c6cb;background:#330a0a;border-color:#661414}.toast-info{color:#bee5eb;background:#0a2e33;border-color:#145c66}}.login-screen{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);justify-content:center;align-items:center;width:100vw;height:100dvh;display:flex}.login-card{-webkit-backdrop-filter:blur(40px)saturate(180%);text-align:center;background:#ffffff1f;border:1px solid #ffffff2e;border-radius:20px;flex-direction:column;align-items:center;width:380px;padding:48px 40px;animation:.4s cubic-bezier(.16,1,.3,1) windowAppear;display:flex;box-shadow:0 24px 80px #00000040}.login-logo{background:linear-gradient(135deg,#ffffff40,#ffffff0d);border:1px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:64px;height:64px;margin-bottom:20px;display:flex}.login-title{color:#fff;letter-spacing:-.02em;margin-bottom:4px;font-size:22px;font-weight:700}.login-subtitle{color:#ffffffa6;margin-bottom:28px;font-size:14px}.login-error{color:#ffb4ab;text-align:left;background:#ff3b3033;border:1px solid #ff3b304d;border-radius:10px;align-items:center;gap:8px;width:100%;margin-bottom:20px;padding:10px 14px;font-size:13px;display:flex}.login-btn{color:#fff;cursor:pointer;background:#ffffff26;border:1px solid #ffffff26;border-radius:12px;justify-content:center;align-items:center;gap:10px;width:100%;padding:12px 20px;font-family:inherit;font-size:15px;font-weight:600;transition:background-color .2s,transform .1s;display:flex}.login-btn:hover{background:#ffffff40}.login-btn:active{transform:scale(.97)}.login-domain-note{color:#fff6;margin-top:16px;font-size:11px}.login-spinner{border:3px solid #fff3;border-top-color:#fff;border-radius:50%;width:28px;height:28px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.auth-bar{z-index:50;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#00000040;border-bottom-left-radius:10px;align-items:center;gap:10px;padding:8px 16px;font-size:12px;display:flex;position:fixed;top:0;right:0}.auth-user{color:#ffffffb3}.auth-signout{color:#fff;cursor:pointer;background:#ffffff26;border:1px solid #fff3;border-radius:6px;padding:4px 10px;font-family:inherit;font-size:11px;transition:background-color .15s}.auth-signout:hover{background:#ffffff40}.thread-phone-sub{color:#00000059;font-variant-numeric:tabular-nums;margin-top:1px;font-size:11px}.chat-header-info{flex-direction:column;gap:1px;display:flex}.chat-header-name{cursor:pointer;border-radius:4px;margin:-1px -4px;padding:1px 4px;transition:background-color .15s}.chat-header-name:hover{background:#ffffff14}.chat-header-phone{color:#0006;padding-left:4px;font-size:11px}.label-popover-overlay{z-index:100;background:#0006;justify-content:center;align-items:center;animation:.15s fadeIn;display:flex;position:fixed;inset:0}.label-popover{background:#2a2a2e;border:1px solid #ffffff1f;border-radius:14px;width:320px;padding:20px 24px;animation:.2s cubic-bezier(.16,1,.3,1) windowAppear;box-shadow:0 20px 60px #00000080}.label-popover-label{color:#fff9;margin-bottom:8px;font-size:13px;font-weight:600;display:block}.label-edit-input{color:#fff;box-sizing:border-box;background:#1a1a1e;border:1px solid #ffffff26;border-radius:8px;outline:none;width:100%;padding:10px 12px;font-family:inherit;font-size:15px;transition:border-color .15s}.label-edit-input:focus{border-color:#667eea}.label-edit-input::placeholder{color:#ffffff40}.label-popover-actions{justify-content:flex-end;gap:8px;margin-top:14px;display:flex}.label-popover-cancel,.label-popover-save{cursor:pointer;border:none;border-radius:8px;padding:7px 16px;font-family:inherit;font-size:13px;font-weight:600;transition:background-color .15s}.label-popover-cancel{color:#ffffffb3;background:#ffffff14}.label-popover-cancel:hover{background:#ffffff24}.label-popover-save{color:#fff;background:#667eea}.label-popover-save:hover{background:#5a6fd6}.message-attachment{max-width:100%;margin-bottom:4px}.attachment-image{cursor:zoom-in;border-radius:12px;max-width:100%;display:block}.attachment-file{color:inherit;border:1px solid var(--mac-border);background:#0000000d;border-radius:10px;align-items:center;gap:8px;padding:10px;font-size:13px;text-decoration:none;display:flex}.message.sent .attachment-file{background:#ffffff1a}.attachment-file:hover{background:#00000014}.message.emoji-only{padding:0;font-size:48px;line-height:1;background:0 0!important}.message.emoji-only.received{border-radius:0}.message.emoji-only.sent{color:initial;background:0 0}