:root{color:#17231d;font-synthesis:none;text-rendering:optimizelegibility;--bg:#f4f7f4;--surface:#fff;--surface-soft:#f7faf8;--surface-raised:#fff;--sidebar:#f8faf8;--line:#dce5df;--line-strong:#c8d5cd;--text:#17231d;--muted:#687a70;--faint:#8c9b93;--green:#0a8f5b;--green-dark:#08734a;--green-soft:#e8f7ef;--green-line:#bce7d3;--ink:#111915;--danger:#c93b3b;--danger-soft:#fff1f0;--warning:#a46a00;--warning-soft:#fff8e8;--shadow:0 18px 55px #1a3a2b14;--bubble-in:#fff;--bubble-out:#dcf7e7;--chat-bg:radial-gradient(circle at 16% 12%, #1e8f5b0f, transparent 28rem), linear-gradient(#edf3ef, #f6f8f6);background:#f4f7f4;font-family:Inter,SF Pro Text,PingFang SC,Microsoft YaHei,ui-sans-serif,system-ui,sans-serif}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#eaf2ed;--bg:#0b120f;--surface:#111b16;--surface-soft:#15211b;--surface-raised:#18271f;--sidebar:#0f1813;--line:#24382d;--line-strong:#334b3e;--text:#eaf2ed;--muted:#94a99e;--faint:#70877a;--green:#2bc985;--green-dark:#21ae72;--green-soft:#102d21;--green-line:#20543b;--ink:#06100b;--danger:#ff8781;--danger-soft:#2c1515;--warning:#f0bd5a;--warning-soft:#2b2212;--shadow:0 18px 55px #00000052;--bubble-in:#17251e;--bubble-out:#153a29;--chat-bg:radial-gradient(circle at 18% 8%, #2bc98514, transparent 28rem), linear-gradient(#0d1611, #101a15);background:#0b120f}*{box-sizing:border-box}html,body,#root{min-width:320px;min-height:100%}body{background:var(--bg);min-height:100vh;color:var(--text);margin:0}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}input,textarea,select{border:1px solid var(--line);width:100%;color:var(--text);background:var(--surface);border-radius:10px;outline:none;padding:10px 12px;transition:border-color .14s,box-shadow .14s}input:focus,textarea:focus,select:focus{border-color:var(--green);box-shadow:0 0 0 3px color-mix(in srgb, var(--green) 14%, transparent)}textarea{resize:vertical}button{border:0}.eyebrow{color:var(--green);letter-spacing:.15em;text-transform:uppercase;margin:0 0 7px;font-size:11px;font-weight:800}.muted{color:var(--muted)}.primary-button{color:#fff;background:var(--green);border-radius:10px;padding:11px 16px;font-weight:750;transition:background .14s,transform .14s}.primary-button:hover:not(:disabled){background:var(--green-dark);transform:translateY(-1px)}.icon-button{border:1px solid var(--line);width:36px;height:36px;color:var(--muted);background:0 0;border-radius:10px;place-items:center;display:inline-grid}.icon-button:hover{color:var(--text);background:var(--surface-soft)}.whatsapp-mark{color:#fff;background:#19a561;border-radius:12px;flex:none;place-items:center;width:40px;height:40px;display:inline-grid;box-shadow:0 8px 22px #19a56138}.global-error{z-index:100;max-width:min(620px,100vw - 32px);color:var(--danger);background:var(--danger-soft);border:1px solid #efc5c2;border-radius:10px;padding:12px 16px;position:fixed;top:18px;left:50%;transform:translate(-50%)}.screen-center{place-content:center;gap:20px;min-height:100vh;display:grid}.brand-loader{letter-spacing:-.02em;align-items:center;gap:12px;font-size:18px;display:flex}.loading-bar{background:var(--line);border-radius:999px;width:220px;height:4px;overflow:hidden}.loading-bar:after{border-radius:inherit;background:var(--green);content:"";width:45%;height:100%;animation:1.15s ease-in-out infinite loading-slide;display:block}@keyframes loading-slide{0%{transform:translate(-100%)}to{transform:translate(260%)}}.auth-page{background:var(--surface);grid-template-columns:minmax(420px,1.15fr) minmax(420px,.85fr);min-height:100vh;display:grid}.auth-intro{color:#f5fff9;background:radial-gradient(circle at 18% 12%,#4ae09638,#0000 26rem),linear-gradient(145deg,#0a3d27,#07150e 72%);flex-direction:column;justify-content:center;min-height:100vh;padding:clamp(40px,8vw,120px);display:flex}.auth-brand{align-items:center;gap:12px;font-size:17px;display:flex;position:absolute;top:34px}.auth-kicker{color:#59d996;letter-spacing:.18em;text-transform:uppercase;margin:0 0 20px;font-size:12px;font-weight:800}.auth-intro h1{letter-spacing:-.06em;max-width:680px;margin:0;font-size:clamp(42px,5.4vw,76px);line-height:1.02}.auth-intro>p:not(.auth-kicker){color:#ebfff4ad;max-width:570px;margin:26px 0 0;font-size:16px;line-height:1.75}.auth-proof{flex-wrap:wrap;gap:9px;margin-top:34px;display:flex}.auth-proof span{color:#e5fff0c2;background:#ffffff0a;border:1px solid #baffd929;border-radius:999px;padding:7px 11px;font-size:12px}.auth-card{flex-direction:column;place-self:center;gap:28px;width:min(430px,100% - 48px);display:flex}.auth-card h2{letter-spacing:-.035em;margin:0;font-size:30px}.auth-card .muted{margin:9px 0 0;line-height:1.6}.auth-form{gap:16px;display:grid}.auth-form label,.profile-form label,.composer-row label{color:var(--muted);gap:7px;font-size:12px;font-weight:650;display:grid}.auth-submit{width:100%;margin-top:5px;padding:13px 18px}.auth-footnote{color:var(--faint);margin:0;font-size:12px;line-height:1.6}.inline-error{border:1px solid color-mix(in srgb, var(--danger) 24%, transparent);color:var(--danger);background:var(--danger-soft);border-radius:9px;padding:10px 12px;font-size:13px}.crm-shell{flex-direction:column;height:100vh;min-height:100vh;display:flex;overflow:hidden}.topbar{border-bottom:1px solid var(--line);background:color-mix(in srgb, var(--surface) 92%, transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);grid-template-columns:minmax(220px,1fr) auto minmax(220px,1fr);align-items:center;gap:22px;min-height:64px;padding:0 20px;display:grid}.brand{align-items:center;gap:11px;display:flex}.brand .whatsapp-mark{border-radius:10px;width:35px;height:35px}.brand>div{gap:2px;display:grid}.brand strong{letter-spacing:-.015em;font-size:14px}.brand span{color:var(--muted);font-size:11px}.topbar-center{color:var(--muted);justify-content:center;align-items:center;gap:8px;font-size:11px;display:flex}.connection-dot,.status-light{background:var(--faint);border-radius:50%;flex:none;width:7px;height:7px}.connection-dot.online,.status-light.ready{background:#1eb874;box-shadow:0 0 0 4px #1eb8741a}.connection-dot.offline,.status-light.blocked{background:var(--warning)}.topbar-divider{background:var(--line);width:1px;height:16px;margin:0 6px}.channel-label{color:var(--text)}.channel-mode{border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:3px 7px;font-size:10px}.channel-mode.mode-cloud_api,.channel-mode.mode-business_app_coexistence{border-color:var(--green-line);color:var(--green);background:var(--green-soft)}.topbar-actions{justify-content:flex-end;align-items:center;gap:7px;display:flex}.user-name{max-width:120px;color:var(--muted);text-overflow:ellipsis;white-space:nowrap;margin:0 3px;font-size:12px;overflow:hidden}.inbox-layout{background:var(--surface);flex:1;grid-template-columns:minmax(280px,330px) minmax(460px,1fr) minmax(300px,350px);min-height:0;display:grid}.conversation-panel,.chat-panel,.profile-panel{min-width:0;min-height:0}.conversation-panel{border-right:1px solid var(--line);background:var(--sidebar);flex-direction:column;display:flex}.conversation-heading{justify-content:space-between;align-items:flex-end;padding:20px 18px 13px;display:flex}.conversation-heading h1{letter-spacing:-.035em;margin:0;font-size:22px}.conversation-count{min-width:27px;height:27px;color:var(--muted);background:var(--surface);border-radius:9px;place-items:center;font-size:11px;display:grid}.search-box{border:1px solid var(--line);color:var(--faint);background:var(--surface);border-radius:10px;align-items:center;gap:8px;margin:0 14px 12px;padding:0 10px;display:flex}.search-box input{box-shadow:none;background:0 0;border:0;padding:10px 0}.conversation-list{flex:1;min-height:0;padding:0 8px;overflow-y:auto}.conversation-row{width:100%;color:var(--text);text-align:left;background:0 0;border-radius:11px;gap:11px;padding:12px 10px;transition:background .13s;display:flex}.conversation-row:hover{background:var(--surface)}.conversation-row.active{background:var(--surface);box-shadow:inset 3px 0 0 var(--green)}.avatar{width:38px;height:38px;color:var(--green);background:var(--green-soft);border-radius:12px;flex:none;place-items:center;font-size:13px;font-weight:800;display:grid}.avatar.large{border-radius:14px;width:43px;height:43px;font-size:15px}.conversation-copy{flex:1;gap:4px;min-width:0;display:grid}.conversation-line{justify-content:space-between;align-items:center;gap:9px;min-width:0;display:flex}.conversation-line strong{text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.conversation-line time{color:var(--faint);flex:none;font-size:9px}.conversation-line.second{color:var(--muted);font-size:11px}.preview{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.conversation-phone{color:var(--faint);font-size:10px}.unread-badge{color:#fff;background:var(--green);border-radius:999px;flex:none;place-items:center;min-width:19px;height:19px;padding:0 5px;font-size:9px;font-weight:800;display:grid}.empty-list{color:var(--muted);text-align:center;justify-items:center;gap:10px;padding:70px 24px;display:grid}.empty-list .whatsapp-mark{opacity:.72;width:46px;height:46px}.empty-list strong{color:var(--text);font-size:13px}.empty-list p{max-width:220px;margin:0;font-size:11px;line-height:1.6}.channel-state{border:1px solid var(--line);background:var(--surface);border-radius:11px;align-items:flex-start;gap:9px;margin:10px;padding:12px;display:flex}.channel-state .status-light{margin-top:4px}.channel-state>div{gap:3px;display:grid}.channel-state strong{font-size:11px}.channel-state small{color:var(--muted);font-size:9px;line-height:1.45}.chat-panel{background:var(--chat-bg);flex-direction:column;display:flex}.chat-header{border-bottom:1px solid var(--line);background:color-mix(in srgb, var(--surface) 94%, transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);justify-content:space-between;align-items:center;gap:16px;min-height:74px;padding:12px 20px;display:flex}.chat-person{align-items:center;gap:11px;min-width:0;display:flex}.chat-person>div{min-width:0}.chat-person h2{letter-spacing:-.02em;text-overflow:ellipsis;white-space:nowrap;margin:0;font-size:15px;overflow:hidden}.chat-person p{color:var(--muted);margin:3px 0 0;font-size:10px}.chat-header-meta{color:var(--muted);align-items:center;gap:8px;font-size:10px;display:flex}.sender-number,.window-pill{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:5px 8px}.window-pill.open{border-color:var(--green-line);color:var(--green);background:var(--green-soft)}.window-pill.closed{border-color:color-mix(in srgb, var(--warning) 25%, var(--line));color:var(--warning);background:var(--warning-soft)}.message-scroll{flex-direction:column;flex:1;min-height:0;padding:24px clamp(18px,4vw,52px) 18px;display:flex;overflow-y:auto}.message-bubble{border:1px solid var(--line);background:var(--bubble-in);border-radius:13px;width:fit-content;max-width:min(68%,680px);margin:0 0 9px;padding:9px 11px 7px;box-shadow:0 3px 12px #1432230a}.message-bubble.customer{border-top-left-radius:4px;align-self:flex-start}.message-bubble.own{border-color:var(--green-line);background:var(--bubble-out);border-top-right-radius:4px;align-self:flex-end}.message-bubble.failed{border-color:color-mix(in srgb, var(--danger) 45%, var(--line))}.bubble-content p{white-space:pre-wrap;overflow-wrap:anywhere;margin:0;font-size:13px;line-height:1.55}.message-type-tag{color:var(--muted);text-transform:uppercase;background:#6482731a;border-radius:5px;margin-bottom:5px;padding:2px 6px;font-size:9px;display:inline-block}.bubble-meta{color:var(--faint);justify-content:flex-end;align-items:center;gap:7px;margin-top:4px;font-size:9px;display:flex}.delivery-status{color:var(--muted)}.delivery-status.status-delivered,.delivery-status.status-read{color:var(--green)}.delivery-status.status-failed{color:var(--danger)}.message-error{color:var(--danger);background:var(--danger-soft);border-radius:7px;margin-top:7px;padding:7px 8px;font-size:10px;line-height:1.4}.thread-loading,.empty-messages{color:var(--muted);margin:auto;font-size:12px}.empty-chat{max-width:390px;color:var(--muted);text-align:center;justify-items:center;margin:auto;display:grid}.empty-chat-icon{border:1px solid var(--green-line);background:var(--green-soft);border-radius:22px;place-items:center;width:72px;height:72px;margin-bottom:18px;display:grid}.empty-chat h2{color:var(--text);margin:0;font-size:19px}.empty-chat p{margin:9px 0 0;font-size:12px;line-height:1.7}.composer-panel{border-top:1px solid var(--line);background:var(--surface);padding:12px 16px 14px}.composer-panel textarea{min-height:72px;box-shadow:none;background:0 0;border:0}.composer-footer{border-top:1px solid var(--line);color:var(--muted);justify-content:space-between;align-items:center;gap:12px;padding-top:9px;font-size:10px;display:flex}.composer-footer>div{align-items:center;gap:10px;display:flex}.send-button{color:#fff;background:var(--green);border-radius:9px;align-items:center;gap:7px;padding:9px 15px;font-size:12px;font-weight:750;display:flex}.retry-banner{color:var(--danger);background:var(--danger-soft);border-radius:8px;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px;padding:8px 10px;font-size:11px;display:flex}.retry-banner button{color:var(--danger);background:0 0;border-radius:6px;padding:4px 9px;font-weight:700}.profile-panel{border-left:1px solid var(--line);background:var(--sidebar);overflow-y:auto}.profile-empty{padding:28px 22px}.profile-empty h2{margin:0;font-size:16px}.profile-empty p{color:var(--muted);font-size:12px;line-height:1.7}.profile-form{gap:15px;padding:20px;display:grid}.profile-heading{justify-content:space-between;align-items:flex-start;display:flex}.profile-heading h2{letter-spacing:-.025em;margin:0;font-size:18px}.profile-id{color:var(--faint);font-family:SFMono-Regular,Consolas,monospace;font-size:9px}.profile-phone-card{border:1px solid var(--line);background:var(--surface);border-radius:12px;align-items:center;gap:11px;padding:13px;display:flex}.profile-phone-card>div{gap:3px;min-width:0;display:grid}.profile-phone-card strong{text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.profile-phone-card span:not(.avatar){color:var(--muted);font-size:10px}.form-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.channel-detail{border-top:1px solid var(--line);margin-top:5px;padding-top:16px}.channel-detail dl{gap:8px;margin:0;display:grid}.channel-detail dl>div{grid-template-columns:80px minmax(0,1fr);gap:8px;font-size:9px;display:grid}.channel-detail dt{color:var(--faint)}.channel-detail dd{min-width:0;color:var(--muted);text-overflow:ellipsis;white-space:nowrap;margin:0;font-family:SFMono-Regular,Consolas,monospace;overflow:hidden}.toast{z-index:90;border:1px solid var(--line);background:var(--surface-raised);max-width:min(460px,100vw - 36px);box-shadow:var(--shadow);border-radius:10px;align-items:center;gap:12px;padding:10px 12px;font-size:11px;display:flex;position:fixed;top:76px;right:18px}.toast span{flex:1}.toast button{color:inherit;opacity:.72;background:0 0;font-size:10px}.toast-error{border-color:color-mix(in srgb, var(--danger) 35%, var(--line));color:var(--danger)}.toast-success{border-color:var(--green-line);color:var(--green)}@media (width<=1120px){.inbox-layout{grid-template-columns:280px minmax(420px,1fr) 300px}.chat-header-meta .sender-number{display:none}}@media (width<=940px){.crm-shell{height:auto;min-height:100vh;overflow:auto}.topbar{grid-template-columns:1fr auto}.topbar-center{display:none}.inbox-layout{grid-template-columns:280px minmax(0,1fr);align-items:stretch}.chat-panel{min-height:72vh}.profile-panel{border-top:1px solid var(--line);border-left:0;grid-column:1/-1}.profile-form{width:100%;max-width:680px;margin:0 auto}}@media (width<=700px){.auth-page{grid-template-columns:1fr}.auth-intro{min-height:310px;padding:98px 28px 34px}.auth-intro h1{font-size:38px}.auth-intro>p:not(.auth-kicker){font-size:14px}.auth-card{width:calc(100% - 36px);padding:40px 0 50px}.topbar{padding:0 12px}.brand span,.user-name{display:none}.inbox-layout{flex-direction:column;display:flex}.conversation-panel{border-right:0;border-bottom:1px solid var(--line);max-height:340px}.conversation-list{min-height:160px}.channel-state{display:none}.chat-panel{min-height:76vh}.chat-header{flex-direction:column;align-items:flex-start;gap:8px}.chat-header-meta{padding-left:54px}.message-scroll{padding:18px 12px}.message-bubble{max-width:84%}.composer-panel{padding:10px 10px 12px}.composer-footer>span{display:none}.composer-footer{justify-content:flex-end}.profile-form{padding:18px 14px 30px}.toast{max-width:none;inset:auto 10px 10px}}
