*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{height:100%;font-size:16px}body{height:100%;font-family:Inter,system-ui,-apple-system,sans-serif;font-size:13px;line-height:1.5;-webkit-font-smoothing:antialiased}#root{height:100%;display:flex;flex-direction:column}button{cursor:pointer;font-family:inherit}input,textarea,select{font-family:inherit}a{text-decoration:none;color:inherit}:root{--brand: #3D3BFF;--brand-light: #EEEDFE;--brand-mid: #AFA9EC;--bg: #FFFFFF;--bg2: #F8F7F4;--bg3: #F1EFE8;--tx1: #2C2C2A;--tx2: #5F5E5A;--tx3: #908E87;--bd: rgba(0,0,0,.08);--bd2: rgba(0,0,0,.14);--success: #1D9E75;--warning: #EF9F27;--danger: #E24B4A;--r-sm: 6px;--r-md: 8px;--r-lg: 12px;--r-xl: 16px;--r-full: 999px;--sidebar-w: 216px;--topbar-h: 48px;--thread-w: 320px;--wa: #25D366;--wa-bg: #DCFCE7;--wa-tx: #166534;--tg: #229ED9;--tg-bg: #E0F2FE;--tg-tx: #0369A1;--sl: #4A154B;--sl-bg: #F3E8FF;--sl-tx: #6B21A8;--ig: #E1306C;--ig-bg: #FCE4EC;--ig-tx: #880E4F;--fb: #1877F2;--fb-bg: #DBEAFE;--fb-tx: #1E40AF;--xx: #111111;--xx-bg: #F1F1F1;--xx-tx: #444;--gm: #EA4335;--gm-bg: #FEE2E2;--gm-tx: #991B1B;--ol: #0078D4;--ol-bg: #DBEAFE;--ol-tx: #1E40AF;--ph: #34C759;--ph-bg: #DCFCE7;--ph-tx: #166534}@media (prefers-color-scheme: dark){:root{--bg: #1A1A18;--bg2: #242422;--bg3: #2C2C2A;--tx1: #EFEEE8;--tx2: #B4B2A9;--tx3: #5F5E5A;--bd: rgba(255,255,255,.08);--bd2: rgba(255,255,255,.14)}}.app-shell{display:flex;height:100vh;height:100dvh;overflow:hidden;background:var(--bg3)}.sidebar{width:var(--sidebar-w);min-width:var(--sidebar-w);background:var(--bg);border-right:.5px solid var(--bd);display:flex;flex-direction:column;height:100%;overflow:hidden}.main-area{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0;background:var(--bg)}.thread-panel{width:var(--thread-w);min-width:var(--thread-w);background:var(--bg);border-left:.5px solid var(--bd);display:flex;flex-direction:column;height:100%}.topbar{height:var(--topbar-h);min-height:var(--topbar-h);display:flex;align-items:center;gap:8px;padding:0 16px;border-bottom:.5px solid var(--bd);background:var(--bg)}.topbar-title{font-size:15px;font-weight:500;color:var(--tx1);flex:1}.topbar-btn{width:30px;height:28px;border-radius:var(--r-md);border:.5px solid var(--bd2);background:transparent;display:flex;align-items:center;justify-content:center;color:var(--tx2);font-size:14px}.topbar-btn:hover{background:var(--bg2)}.sb-logo{display:flex;align-items:center;gap:8px;padding:14px 14px 10px;border-bottom:.5px solid var(--bd);flex-shrink:0}.sb-logo-mark{width:26px;height:26px;border-radius:7px;background:var(--brand);display:grid;place-items:center;flex-shrink:0}.sb-logo-mark svg{width:14px;height:14px;fill:#fff}.sb-logo-text{font-size:15px;font-weight:600;color:var(--tx1)}.sb-nav{flex:1;overflow-y:auto;padding:6px}.sb-section{font-size:9px;font-weight:500;color:var(--tx3);letter-spacing:.07em;text-transform:uppercase;padding:10px 8px 3px}.sb-item{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:var(--r-md);color:var(--tx2);font-size:12px;margin-bottom:1px}.sb-item:hover{background:var(--bg2)}.sb-item.active{background:var(--brand-light);color:#3c3489;font-weight:500}.sb-item-icon{font-size:14px;flex-shrink:0;width:18px;text-align:center}.sb-item-label{flex:1}.sb-badge{border-radius:var(--r-full);font-size:9px;font-weight:500;padding:1px 5px;color:#fff;min-width:16px;text-align:center}.sb-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.sb-footer{padding:10px 12px;border-top:.5px solid var(--bd);flex-shrink:0}.sb-profile{display:flex;align-items:center;gap:8px;padding:5px 6px;border-radius:var(--r-md)}.sb-profile:hover{background:var(--bg2)}.avatar{border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:500;color:#fff;flex-shrink:0;font-size:11px}.avatar-wrap{position:relative;flex-shrink:0}.platform-dot{position:absolute;bottom:-1px;right:-1px;width:13px;height:13px;border-radius:50%;border:2px solid var(--bg)}.chips{display:flex;gap:5px;padding:8px 14px;border-bottom:.5px solid var(--bd);overflow-x:auto;flex-shrink:0;scrollbar-width:none}.chips::-webkit-scrollbar{display:none}.chip{padding:3px 10px;border-radius:var(--r-full);font-size:11px;font-weight:500;border:.5px solid var(--bd2);color:var(--tx2);background:var(--bg);white-space:nowrap;flex-shrink:0;display:flex;align-items:center;gap:4px}.chip:hover:not(.active){background:var(--bg2)}.chip.active{background:var(--brand);color:#fff;border-color:var(--brand)}.feed{flex:1;overflow-y:auto}.feed-section{padding:6px 14px 3px;font-size:9px;font-weight:500;color:var(--tx3);text-transform:uppercase;letter-spacing:.07em;background:var(--bg2)}.thread-row{display:flex;align-items:flex-start;gap:10px;padding:10px 14px;border-bottom:.5px solid var(--bd);cursor:pointer;background:var(--bg);transition:background .1s;position:relative}.thread-row:hover,.thread-row.selected{background:var(--bg2)}.thread-row.selected{background:var(--brand-light)}.thread-body{flex:1;min-width:0}.thread-header{display:flex;align-items:baseline;gap:5px;margin-bottom:2px}.thread-name{font-size:12px;color:var(--tx1)}.thread-name.unread{font-weight:500}.thread-time{font-size:10px;color:var(--tx3);margin-left:auto;flex-shrink:0}.thread-subject{font-size:12px;font-weight:500;color:var(--tx1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px}.thread-subject.read{font-weight:400}.thread-preview{font-size:11px;color:var(--tx2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.thread-tags{display:flex;gap:4px;margin-top:3px;flex-wrap:wrap}.unread-dot{width:7px;height:7px;border-radius:50%;background:var(--brand);flex-shrink:0;margin-top:4px}.platform-badge{font-size:9px;font-weight:500;padding:1px 5px;border-radius:4px}.tag-pill{font-size:9px;font-weight:500;padding:2px 6px;border-radius:4px}.reply-count{font-size:9px;font-weight:500;padding:1px 6px;border-radius:8px;background:var(--bg3);color:var(--tx2);border:.5px solid var(--bd2)}.thread-hdr{height:var(--topbar-h);min-height:var(--topbar-h);display:flex;align-items:center;gap:8px;padding:0 12px;border-bottom:.5px solid var(--bd);flex-shrink:0}.thread-messages{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px}.bubble-wrap{display:flex;gap:6px;align-items:flex-end}.bubble-wrap.out{flex-direction:row-reverse}.bubble{padding:8px 11px;border-radius:10px;max-width:78%;font-size:12px;line-height:1.45;word-break:break-word}.bubble.in{background:var(--bg2);color:var(--tx1);border-top-left-radius:2px}.bubble.out{background:var(--brand);color:#fff;border-top-right-radius:2px}.bubble-meta{font-size:9px;color:var(--tx3);text-align:right;margin-top:1px}.bubble-meta.in{text-align:left}.msg-date-divider{text-align:center;font-size:10px;color:var(--tx3);margin:4px 0}.ai-area{padding:8px 12px;border-top:.5px solid var(--bd);background:var(--bg);flex-shrink:0}.ai-label{font-size:9px;font-weight:500;color:var(--tx3);margin-bottom:5px;text-transform:uppercase;letter-spacing:.06em}.ai-pills{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:8px}.ai-pill{font-size:11px;padding:4px 9px;border-radius:var(--r-full);border:.5px solid var(--bd2);background:var(--bg);color:var(--tx2)}.ai-pill:hover{background:var(--brand-light);color:var(--brand);border-color:var(--brand)}.reply-bar{display:flex;gap:6px;align-items:center;background:var(--bg2);border-radius:var(--r-lg);padding:7px 10px;border:.5px solid var(--bd)}.reply-input{flex:1;border:none;background:transparent;outline:none;font-size:13px;color:var(--tx1);resize:none;max-height:80px}.reply-input::-moz-placeholder{color:var(--tx3)}.reply-input::placeholder{color:var(--tx3)}.send-btn{width:28px;height:28px;border-radius:var(--r-md);background:var(--brand);border:none;display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px;flex-shrink:0}.send-btn:hover{opacity:.9}.compose-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;display:flex;align-items:center;justify-content:center;z-index:100;padding:16px}.compose-card{background:var(--bg);border-radius:var(--r-lg);width:100%;max-width:540px;border:.5px solid var(--bd);overflow:hidden;box-shadow:0 20px 40px #00000026}.compose-hdr{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:.5px solid var(--bd)}.compose-field{display:flex;align-items:center;gap:8px;padding:8px 14px;border-bottom:.5px solid var(--bd)}.compose-label{font-size:11px;color:var(--tx3);width:44px;flex-shrink:0}.compose-input{flex:1;border:none;background:transparent;outline:none;font-size:13px;color:var(--tx1)}.compose-input::-moz-placeholder{color:var(--tx3)}.compose-input::placeholder{color:var(--tx3)}.platform-picker{display:flex;gap:5px;padding:8px 14px;border-bottom:.5px solid var(--bd);flex-wrap:wrap}.plt-btn{padding:3px 9px;border-radius:var(--r-full);border:.5px solid var(--bd2);font-size:10px;font-weight:500;background:var(--bg);color:var(--tx2)}.plt-btn:hover{background:var(--bg2)}.plt-btn.active{color:#fff;border-color:transparent}.compose-body{padding:12px 14px;min-height:120px;max-height:200px;overflow-y:auto}.compose-textarea{width:100%;border:none;background:transparent;outline:none;font-size:13px;color:var(--tx1);resize:none;font-family:inherit;line-height:1.5}.compose-textarea::-moz-placeholder{color:var(--tx3)}.compose-textarea::placeholder{color:var(--tx3)}.compose-footer{display:flex;align-items:center;gap:8px;padding:10px 14px;border-top:.5px solid var(--bd)}.btn{padding:7px 14px;border-radius:var(--r-md);border:.5px solid var(--bd2);background:var(--bg);color:var(--tx2);font-size:12px;font-weight:500}.btn:hover{background:var(--bg2)}.btn-primary{background:var(--brand);color:#fff;border-color:var(--brand);margin-left:auto}.btn-primary:hover{opacity:.9}.btn-danger{background:var(--danger);color:#fff;border-color:var(--danger)}.onboard-wrap{flex:1;display:flex;align-items:center;justify-content:center;background:var(--bg3);padding:16px;min-height:100vh}.ob-card{background:var(--bg);border-radius:var(--r-xl);border:.5px solid var(--bd);width:100%;max-width:380px;padding:28px}.ob-logo-wrap{width:44px;height:44px;border-radius:var(--r-lg);background:var(--brand);display:grid;place-items:center;margin:0 auto 16px}.ob-logo-wrap svg{width:22px;height:22px;fill:#fff}.ob-title{font-size:20px;font-weight:600;color:var(--tx1);text-align:center;margin-bottom:6px}.ob-sub{font-size:13px;color:var(--tx2);text-align:center;margin-bottom:22px;line-height:1.5}.ob-input{width:100%;padding:9px 12px;border-radius:var(--r-md);border:.5px solid var(--bd2);background:var(--bg);font-size:13px;color:var(--tx1);margin-bottom:10px;outline:none}.ob-input:focus{border-color:var(--brand)}.ob-btn{width:100%;padding:10px;border-radius:var(--r-md);background:var(--brand);color:#fff;border:none;font-size:14px;font-weight:500;margin-top:4px}.ob-btn:hover{opacity:.9}.ob-link{text-align:center;font-size:12px;color:var(--tx3);margin-top:12px}.ob-link span{color:var(--brand);cursor:pointer}.ob-steps{display:flex;gap:5px;justify-content:center;margin-bottom:18px}.ob-step{width:24px;height:4px;border-radius:2px;background:var(--bg3)}.ob-step.done{background:var(--brand)}.platform-connect-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--r-md);border:.5px solid var(--bd);margin-bottom:8px}.platform-connect-row.connected{border-color:var(--success)}.platform-connect-row:hover{background:var(--bg2)}.pc-name{font-size:13px;font-weight:500;color:var(--tx1);flex:1}.pc-status{font-size:11px;font-weight:500}.search-bar{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:.5px solid var(--bd);flex-shrink:0}.search-input-wrap{flex:1;display:flex;align-items:center;gap:8px;background:var(--bg2);border-radius:var(--r-md);padding:7px 11px;border:.5px solid var(--bd)}.search-input{flex:1;border:none;background:transparent;outline:none;font-size:13px;color:var(--tx1)}.search-result{display:flex;align-items:flex-start;gap:10px;padding:10px 14px;border-bottom:.5px solid var(--bd);cursor:pointer}.search-result:hover{background:var(--bg2)}.highlight{background:#fef9c3;color:#854f0b;border-radius:2px;padding:0 1px}.settings-wrap{flex:1;display:flex;overflow:hidden}.settings-nav{width:180px;min-width:180px;border-right:.5px solid var(--bd);padding:10px 8px;overflow-y:auto;background:var(--bg)}.settings-nav-item{padding:7px 10px;border-radius:var(--r-md);font-size:12px;color:var(--tx2);cursor:pointer;margin-bottom:1px}.settings-nav-item:hover{background:var(--bg2)}.settings-nav-item.active{background:var(--brand-light);color:#3c3489;font-weight:500}.settings-content{flex:1;padding:20px;overflow-y:auto}.settings-section{margin-bottom:24px}.settings-section-title{font-size:10px;font-weight:500;color:var(--tx3);text-transform:uppercase;letter-spacing:.06em;margin-bottom:10px}.settings-row{display:flex;align-items:center;justify-content:space-between;padding:11px 0;border-bottom:.5px solid var(--bd)}.settings-row:last-child{border-bottom:none}.settings-row-label{font-size:13px;color:var(--tx1);font-weight:500}.settings-row-sub{font-size:11px;color:var(--tx3);margin-top:2px}.toggle{width:38px;height:22px;border-radius:var(--r-full);cursor:pointer;position:relative;transition:background .2s;border:none;flex-shrink:0}.toggle.on{background:var(--brand)}.toggle.off{background:var(--bg3);border:.5px solid var(--bd2)}.toggle:after{content:"";position:absolute;top:2px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .2s}.toggle.on:after{left:18px}.toggle.off:after{left:2px}.notif-row{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-bottom:.5px solid var(--bd);cursor:pointer}.notif-row:hover{background:var(--bg2)}.notif-icon{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0}.notif-title{font-size:12px;font-weight:500;color:var(--tx1);margin-bottom:2px}.notif-body{flex:1;min-width:0}.notif-sub{font-size:11px;color:var(--tx2);margin-bottom:6px}.snooze-btn{font-size:10px;padding:3px 8px;border-radius:5px;border:.5px solid var(--bd2);background:var(--bg);color:var(--tx2)}.call-row{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:.5px solid var(--bd);cursor:pointer}.call-row:hover{background:var(--bg2)}.call-icon{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}.transcript-card{background:var(--bg2);border-radius:var(--r-md);padding:10px 12px;margin-top:8px;border:.5px solid var(--bd)}.wp-bar{display:flex;border-bottom:.5px solid var(--bd);background:var(--bg);flex-shrink:0}.wp-tab{flex:1;padding:10px;text-align:center;font-size:12px;font-weight:500;color:var(--tx2);border-bottom:2px solid transparent;cursor:pointer;border-top:none;border-left:none;border-right:none;background:transparent}.wp-tab.active{color:var(--brand);border-bottom-color:var(--brand)}.empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--tx3);padding:32px;text-align:center}.empty-icon{font-size:40px}.empty-title{font-size:15px;font-weight:500;color:var(--tx2)}.empty-sub{font-size:13px}.mode-toggle{display:flex;border:.5px solid var(--bd2);border-radius:var(--r-md);overflow:hidden}.mode-btn{padding:4px 10px;font-size:11px;font-weight:500;background:transparent;border:none;color:var(--tx2)}.mode-btn.active{background:var(--brand);color:#fff}.mobile-bottom-nav{display:none}@media (max-width: 767px){.sidebar,.thread-panel{display:none}.thread-panel.mobile-open{display:flex;position:fixed;top:0;right:0;bottom:0;left:0;width:100%;z-index:50}.mobile-bottom-nav{display:flex;height:56px;border-top:.5px solid var(--bd);background:var(--bg);flex-shrink:0}.mobile-nav-btn{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:10px;color:var(--tx3);background:transparent;border:none}.mobile-nav-btn.active{color:var(--brand)}.mobile-nav-btn .icon{font-size:20px}.app-shell{flex-direction:column}.settings-nav{display:none}}.spinner{width:20px;height:20px;border:2px solid var(--bd2);border-top-color:var(--brand);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-wrap{flex:1;display:flex;align-items:center;justify-content:center}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--bd2);border-radius:2px}.toast-container{position:fixed;bottom:20px;right:20px;z-index:200;display:flex;flex-direction:column;gap:8px}.toast{background:var(--tx1);color:var(--bg);padding:10px 14px;border-radius:var(--r-md);font-size:13px;font-weight:500;animation:slideIn .2s ease;max-width:320px}.toast.error{background:var(--danger)}.toast.success{background:var(--success)}@keyframes slideIn{0%{transform:translate(40px);opacity:0}to{transform:translate(0);opacity:1}}