:root{--bg:#f5f5f7;--surface:#fff;--text:#1d1d1f;--muted:#6e6e73;--line:#e7e7eb;--blue:#0066cc;--blue-soft:#eef5ff;--green:#21704a;--green-soft:#edf7f0;--amber:#855500;--amber-soft:#fff6df;--red:#b42318;--red-soft:#fff0ef;--radius:20px;--font:Arial,"Segoe UI",sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:14px;line-height:1.55}button,input,textarea,select{font:inherit}button{cursor:pointer;border:0;border-radius:11px;min-height:42px;padding:10px 17px;background:#f0f0f3;color:var(--text);font-weight:600;transition:background .18s,transform .18s}button:hover{background:#e6e6ec}button:active{transform:translateY(1px)}button:disabled{opacity:.5;cursor:wait}button.primary{background:var(--blue);color:white}button.primary:hover{background:#0054a8}button.secondary{background:var(--blue-soft);color:var(--blue)}button.danger{color:var(--red);background:var(--red-soft)}button.small{font-size:12px;min-height:34px;padding:6px 12px}.full{width:100%}input,textarea,select{background:white;border:1px solid #d0d0d5;border-radius:10px;padding:11px 13px;max-width:100%;min-height:44px;width:100%;color:var(--text)}textarea{resize:vertical;min-height:120px}label{display:block;margin:16px 0 7px;font-weight:600;font-size:13px}input:focus,textarea:focus,select:focus{outline:3px solid #0066cc22;border-color:var(--blue)}button:focus-visible,a:focus-visible{outline:3px solid var(--blue);outline-offset:3px}[hidden]{display:none!important}h1,h2,h3,p{margin:0}h1{font-size:36px;letter-spacing:-1px;line-height:1.2}h2{font-size:22px;letter-spacing:-.5px}h3{font-size:16px}p{color:var(--muted)}a{color:var(--blue)}.wordmark{font-size:32px;font-weight:800;letter-spacing:-1.6px;direction:ltr;display:inline-block}.wordmark span{color:var(--blue)}.login-shell{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:38px 20px;background:var(--bg)}.login-brand{text-align:center;margin-bottom:38px}.eyebrow{display:block;font-size:9px;letter-spacing:2.7px;color:var(--muted);margin-top:5px}.login-card{background:var(--surface);width:min(100%,440px);padding:38px;border:1px solid var(--line);border-radius:26px}.section-label{color:var(--blue);font-size:12px;font-weight:600;margin-bottom:14px}.login-card h1{font-size:43px;line-height:1.12}.login-card p{margin-top:18px}.login-card form{margin-top:30px}.login-card button{margin-top:18px}.fine{font-size:11px;line-height:1.7}.login-foot{font-size:11px;color:var(--muted);margin-top:30px}.form-error{color:var(--red);font-size:13px;margin-top:12px;min-height:20px}.workspace{display:grid;grid-template-columns:224px minmax(0,1fr);min-height:100dvh}.sidebar{background:#fafafa;border-left:1px solid var(--line);padding:28px 20px;display:flex;flex-direction:column;position:sticky;top:0;height:100dvh}.brand{padding:0 10px 36px}.brand-sub{display:block;font-size:11px;color:var(--muted);margin-top:4px}.nav-label{font-size:10px;font-weight:600;color:var(--muted);margin:0 13px 9px}.integrations{margin-top:30px}.sidebar nav{display:grid;gap:5px}.sidebar nav button{text-align:right;background:none;color:var(--muted);font-size:13px;min-height:44px}.sidebar nav button.active{background:#e9edf3;color:var(--text)}.sidebar-bottom{margin-top:auto;padding:24px 12px 0;border-top:1px solid var(--line)}.sidebar-bottom p{font-size:11px;margin-top:4px}.private-mark{font-size:12px;font-weight:600}.text-button{background:none;padding:8px 0;font-size:11px;color:var(--muted);min-height:36px}.main-shell{min-width:0}.topbar{height:78px;padding:0 44px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);background:#fafafa}.breadcrumb{font-size:11px;color:var(--muted)}#breadcrumb-current{color:var(--text)}.top-meta{display:flex;align-items:center;gap:20px}.avatar{border-radius:50%;height:32px;width:32px;background:#e7e8ec;display:grid;place-items:center;font-weight:600;font-size:13px}.live-indicator{font-size:11px;color:var(--green)}.live-indicator:before{content:"";display:inline-block;width:6px;height:6px;background:currentColor;border-radius:50%;margin-left:6px}main{max-width:1360px;margin:auto;padding:42px 44px 24px}.page-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:32px}.page-head p{margin-top:10px;font-size:13px}.kicker{font-size:11px;font-weight:600;color:var(--muted);margin-bottom:10px}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:34px}.metric{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:22px}.metric-label{font-size:12px;color:var(--muted)}.metric-value{display:block;font-size:34px;letter-spacing:-1.2px;font-weight:600;margin-top:12px;line-height:1.1}.metric-note{font-size:10px;color:var(--muted);margin-top:10px}.section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.section-head h2{font-size:19px}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.empty{padding:55px 28px;text-align:center}.empty h3{font-size:20px;margin-bottom:10px}.empty p{max-width:390px;margin:0 auto 22px;font-size:13px}.accounts-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:17px}.account-card{padding:24px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);display:flex;flex-direction:column;gap:19px}.account-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.account-name{font-size:17px;font-weight:600;overflow-wrap:anywhere}.phone{direction:ltr;display:block;text-align:right;font-size:12px;color:var(--muted);margin-top:5px}.pill{display:inline-flex;align-items:center;white-space:nowrap;border-radius:7px;font-size:10px;padding:4px 8px;background:#f0f0f3;color:var(--muted)}.pill.green{background:var(--green-soft);color:var(--green)}.pill.amber{background:var(--amber-soft);color:var(--amber)}.pill.red{background:var(--red-soft);color:var(--red)}.account-stats{display:grid;grid-template-columns:1fr 1fr;border-block:1px solid var(--line);padding:14px 0}.account-stats span{display:block;font-size:11px;color:var(--muted)}.account-stats strong{font-size:20px;font-weight:500}.card-actions{display:flex;gap:8px;flex-wrap:wrap}.notice{padding:20px 24px;border:1px solid var(--line);border-radius:16px;display:flex;align-items:start;justify-content:space-between;gap:28px;background:#f0f2f5;margin-top:28px}.notice p{font-size:12px;margin-top:5px;max-width:690px}.notice strong{font-size:13px}.toolbar{display:flex;align-items:center;gap:12px;margin-bottom:20px;flex-wrap:wrap}.toolbar select,.toolbar input{width:240px;max-width:100%;font-size:12px}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;font-size:12px;text-align:right}th{font-size:10px;font-weight:600;color:var(--muted);background:#fafafa;padding:15px 18px;white-space:nowrap}td{padding:17px 18px;border-top:1px solid var(--line);vertical-align:middle}.message-text{max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mono{font-family:Consolas,monospace;font-size:11px;direction:ltr;unicode-bidi:plaintext;overflow-wrap:anywhere}.page-foot{max-width:1360px;padding:22px 44px 30px;margin:auto;font-size:10px;color:var(--muted)}dialog{border:1px solid var(--line);border-radius:24px;padding:26px 30px;max-width:calc(100vw - 28px);width:540px;background:var(--surface);color:var(--text);max-height:90dvh;overflow:auto}dialog::backdrop{background:#1d1d1f55;backdrop-filter:blur(5px)}.modal-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:10px}.modal-top h2{font-size:22px}.close-button{background:none;color:var(--muted);font-size:11px;min-height:36px;padding:6px}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:24px}.form-hint{font-size:11px;color:var(--muted);margin-top:8px}.field-pair{display:grid;grid-template-columns:1fr 1fr;gap:16px}.qr-block{text-align:center;padding:12px}.qr-block img{width:250px;max-width:100%;border-radius:16px}.qr-block p{font-size:12px;margin-top:12px}.error-note{color:var(--red);font-size:11px}.toast{position:fixed;bottom:24px;left:24px;background:var(--text);color:white;max-width:calc(100vw - 48px);padding:15px 22px;border-radius:13px;font-size:13px;z-index:100}.key-reveal{background:#f5f5f7;padding:17px;border-radius:12px;margin-top:20px;user-select:all;overflow-wrap:anywhere;font:12px Consolas,monospace;direction:ltr}.checkbox-list{display:grid;gap:8px;margin:12px 0}.checkbox-list label{margin:0;display:flex;align-items:center;gap:9px;font-weight:400}.checkbox-list input{width:17px;min-height:17px}.guide-section{padding:26px 30px;border-bottom:1px solid var(--line)}.guide-section:last-child{border:0}.guide-section p{margin-top:10px;font-size:13px}.guide-section code{direction:ltr;display:block;overflow-wrap:anywhere;background:#f5f5f7;padding:14px;border-radius:10px;font-size:12px;margin-top:14px}.status-error{color:var(--red)}.welcome-copy{max-width:600px}.capsule{display:inline-block;border:1px solid var(--line);border-radius:30px;font-size:11px;padding:7px 13px;color:var(--muted)}.loading{padding:60px;text-align:center;color:var(--muted)}
@media(max-width:1050px){.workspace{grid-template-columns:185px minmax(0,1fr)}main{padding:30px 24px}.topbar{padding-inline:24px}.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.sidebar{padding-inline:12px}.page-foot{padding-inline:24px}}
@media(max-width:680px){.workspace{display:block}.sidebar{position:static;height:auto;padding:14px 16px;border-left:0;border-bottom:1px solid var(--line)}.brand{padding:0 4px 12px;display:flex;align-items:center;justify-content:space-between}.wordmark{font-size:26px}.brand-sub{margin:0}.nav-label,.sidebar-bottom{display:none}.sidebar nav{display:flex;overflow:auto;gap:4px}.sidebar nav button{white-space:nowrap;font-size:11px;padding:9px 12px;min-height:40px}.topbar{height:54px;padding-inline:20px}.top-meta{gap:10px}.avatar{height:26px;width:26px}.breadcrumb{font-size:10px}main{padding:28px 18px 20px}.page-head{align-items:flex-start;gap:12px;margin-bottom:25px}.page-head h1{font-size:27px}.page-head button{font-size:11px;padding:10px 12px;white-space:nowrap}.page-head p{font-size:12px;max-width:250px}.metric{padding:18px}.metric-value{font-size:28px}.metric-note{font-size:9px}.metrics{gap:10px;margin-bottom:26px}.accounts-grid{grid-template-columns:1fr}.notice{flex-direction:column;gap:14px;padding:18px}.page-foot{padding-inline:20px;font-size:9px}.login-card{padding:29px}.login-card h1{font-size:38px}.login-brand{margin-bottom:26px}dialog{padding:22px}.field-pair{grid-template-columns:1fr}.guide-section{padding:22px}.toolbar select{width:100%}.toast{bottom:max(16px,env(safe-area-inset-bottom));left:16px}.modal-actions button{flex:1}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.integration-panel{padding:26px 30px}.integration-panel>p{font-size:13px;margin-top:10px}.copy-field{display:flex;gap:8px;align-items:center}.copy-field input{min-width:0;flex:1}.copy-field button{flex-shrink:0}.integration-actions{margin:20px 0 0}.request-example{background:#f5f5f7;padding:18px;border-radius:12px;font:12px Consolas,monospace;overflow:auto;text-align:left}.chat-layout{display:grid;grid-template-columns:minmax(230px,320px) minmax(0,1fr);gap:18px}.chat-list{overflow:auto;max-height:700px}.chat-item{display:flex;flex-direction:column;align-items:stretch;width:100%;gap:7px;background:white;text-align:right;border-radius:0;border-bottom:1px solid var(--line);padding:18px}.chat-item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-item small{color:var(--muted);font-weight:400}.chat-item .pill{align-self:flex-start}.chat-thread{padding:20px;min-width:0}.thread-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:20px}.chat-message{padding:14px 16px;margin:10px 0;border-radius:14px;background:#f5f5f7;max-width:85%;overflow-wrap:anywhere}.chat-message.outgoing{background:#eaf3ff;margin-right:auto}.chat-message p{white-space:pre-wrap;margin:6px 0;font-size:14px}.chat-message small,.chat-message time{font-size:10px;color:var(--muted)}.chat-message>div{display:flex;align-items:center;justify-content:space-between;gap:12px}.chat-message .pill{font-size:10px}
@media(max-width:680px){.integration-panel{padding:20px}.copy-field{flex-wrap:wrap}.copy-field input{flex-basis:100%}.chat-layout{grid-template-columns:1fr}.chat-list{max-height:280px}.chat-message{max-width:95%}}
.chat-thread{height:740px;display:flex;flex-direction:column}.thread-head{flex-shrink:0}#thread-messages{overflow:auto;min-height:0;flex:1;padding:0 3px}.chat-list{max-height:740px}@media(max-width:680px){.chat-thread{height:600px}.chat-list{max-height:280px}}
.chat-image,.chat-video{display:block;max-width:100%;max-height:300px;border-radius:10px;margin:8px 0;object-fit:contain}.media-download{font-size:11px}.thread-reply{border-top:1px solid var(--line);padding-top:12px;flex-shrink:0}.thread-reply label{margin-top:0}.thread-reply textarea{min-height:70px;max-height:150px}.reply-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:8px}.reply-controls input[type=file]{min-width:0;flex:1;font-size:11px}.reply-controls .file-choice{font-size:11px;color:var(--muted);width:100%}.thread-reply .form-hint{font-size:10px}.chat-thread{height:850px}.chat-list{max-height:850px}@media(max-width:680px){.chat-thread{height:750px}.chat-list{max-height:280px}.chat-image,.chat-video{max-height:220px}.reply-controls input[type=file]{flex-basis:100%}}
.backup-panel{margin-top:20px}.backup-panel select{min-width:0;flex:1}.backup-panel h2{font-size:20px}
/* WhatsApp conversation workspace */
.number-tools{margin:0 0 20px;border:1px solid var(--line);border-radius:14px;background:#fff}.number-tools>summary{padding:15px 20px;cursor:pointer;font-size:13px;color:#52616a;font-weight:600}.number-tools .integration-panel{border:0;border-radius:0;margin:0}.number-tools .backup-panel{border-top:1px solid var(--line)}.conversation-title{justify-content:flex-start;gap:8px}.conversation-title h2{margin-left:auto}.chat-layout{grid-template-columns:330px minmax(0,1fr);gap:0;height:calc(100dvh - 280px);min-height:560px;max-height:900px;border:1px solid #dbe1e5;border-radius:16px;overflow:hidden;background:#efeae2;box-shadow:0 5px 24px #111b2108}.chat-list-panel{display:flex;flex-direction:column;min-width:0;min-height:0;height:100%;background:#fff;border-left:1px solid #dbe1e5}.chat-list-head{display:flex;align-items:center;justify-content:space-between;padding:20px;background:#f0f2f5}.chat-list-head h3{font-size:21px;font-weight:600;color:#111b21}.chat-list-head>span{font-size:11px;color:#667781}.chat-search-wrap{padding:12px 14px 8px}.chat-search-wrap input{min-height:39px;border:0;border-radius:9px;background:#f0f2f5;font-size:12px;margin:0}.chat-filters{display:flex;gap:6px;padding:4px 14px 12px}.chat-filters button{min-height:30px;padding:5px 13px;border-radius:18px;color:#667781;background:#f0f2f5;font-size:11px;font-weight:400}.chat-filters .selected{background:#d9fdd3;color:#008069}.chat-list{flex:1;max-height:none;overflow:auto}.chat-item{display:flex;flex-direction:row;align-items:center;gap:12px;min-height:84px;padding:14px 16px;border-bottom:1px solid #f0f2f5;font-weight:400}.chat-item:hover{background:#f5f6f6}.chat-item.active-chat{background:#f0f2f5}.chat-avatar{display:grid!important;place-items:center;flex:0 0 44px;height:44px;width:44px;border-radius:50%;background:#d7e9e4;color:#36645a;font-size:16px;font-weight:500;white-space:nowrap!important}.group-avatar{background:#dfe5e7;color:#617783}.chat-item-body{display:block;min-width:0;flex:1}.chat-item-top{display:flex!important;align-items:center;justify-content:space-between;gap:9px}.chat-item-top strong{color:#111b21;font-size:14px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-item-top time{font-size:10px;color:#667781;white-space:nowrap}.chat-preview{display:flex!important;align-items:center;gap:4px;color:#667781;font-size:12px;line-height:1.5;white-space:nowrap!important;margin-top:5px;overflow:hidden;text-overflow:ellipsis}.chat-item-extra{display:block!important;color:#87949a;font-size:10px;margin-top:4px}.chat-thread{height:100%;min-height:0;padding:0;border:0;border-radius:0;background:#efeae2}.thread-head{height:72px;min-height:72px;padding:12px 20px;gap:12px;background:#f0f2f5;margin:0;border-bottom:1px solid #dbe1e5}.thread-contact{flex:1;min-width:0}.thread-contact h3{font-size:15px;color:#111b21;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.thread-contact>span{display:block;font-size:11px;color:#667781;margin-top:4px;unicode-bidi:plaintext}.thread-head>button{background:none;color:#667781;font-size:11px}.chat-back{display:none}.chat-thread>#thread-messages{padding:20px 34px;background-color:#efeae2;background-image:radial-gradient(#d8d2c755 0.7px,transparent 0.7px);background-size:18px 18px}.chat-message{max-width:78%;width:fit-content;min-width:95px;padding:9px 12px 5px;border-radius:8px;position:relative;background:white;box-shadow:0 1px 1px #0b141a20;margin:9px 0 9px auto;color:#111b21}.chat-message.outgoing{background:#d9fdd3;margin-right:auto;margin-left:0}.chat-message.incoming{margin-left:auto;margin-right:0}.chat-message p{font-size:14px;line-height:1.65;color:#111b21;margin:0 0 3px}.bubble-sender{display:block;font-size:12px;color:#008069;font-weight:600;margin-bottom:5px}.chat-message>.bubble-meta{display:flex;align-items:center;justify-content:flex-end;gap:5px;margin-top:1px}.chat-message time{color:#667781;font-size:10px}.message-check{display:inline-block;color:#667781;font:11px Arial;letter-spacing:-1px;white-space:nowrap;direction:ltr}.message-check.was-read{color:#53bdeb}.receipt-button{min-height:20px;padding:0 2px;background:none;border:0}.chat-day{width:fit-content;margin:8px auto 15px;padding:5px 12px;border-radius:7px;background:#ffffffd9;color:#54656f;font-size:10px;box-shadow:0 1px 1px #0b141a14}.thread-reply{padding:12px 16px;background:#f0f2f5;border-top:1px solid #dbe1e5;position:relative}.thread-reply textarea{min-height:46px;height:46px;max-height:150px;padding:12px 16px;margin:0;background:white;border:0;border-radius:16px;font-size:14px}.reply-controls{margin-top:8px;gap:8px;justify-content:space-between}.reply-controls .file-choice{width:auto;margin:0;padding:7px 12px;border-radius:16px;color:#008069;background:white;font-size:11px;cursor:pointer}.reply-controls input[type=file]{position:absolute;width:1px;height:1px;min-height:0;clip-path:inset(50%);overflow:hidden}.reply-controls button.primary{background:#008069;color:white;padding:9px 20px;min-height:36px;border-radius:18px}.attachment-name{flex:1;min-width:0;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#667781}.thread-reply .form-hint{display:none}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.chat-thread>.empty{margin:auto;color:#667781}.chat-image,.chat-video{max-height:280px}.chat-layout button:focus-visible{outline:2px solid #008069;outline-offset:-3px}
@media(max-width:1050px){.chat-layout{grid-template-columns:280px minmax(0,1fr)}.chat-thread>#thread-messages{padding:18px}}
@media(max-width:680px){.chat-layout{display:block;height:calc(100dvh - 190px);min-height:530px;border-radius:12px}.chat-list-panel{border:0}.chat-thread{display:none}.has-active-chat .chat-list-panel{display:none}.has-active-chat .chat-thread{display:flex}.chat-back{display:block}.chat-message{max-width:88%}.thread-head{padding:10px 12px}.thread-head .chat-avatar{flex-basis:36px;width:36px;height:36px;font-size:13px}.thread-head>button{padding:5px;min-height:32px}.chat-thread>#thread-messages{padding:14px}.conversation-title h2{font-size:18px}.conversation-title button{font-size:10px;padding:7px 8px}.reply-controls input[type=file]{flex-basis:0}.number-tools>summary{font-size:12px}.chat-item{min-height:83px}}
.chat-focus-close{display:none;min-height:30px;background:transparent;color:#667781;font-size:11px;padding:5px 9px}.chat-expanded .chat-focus-close{display:block}.chat-layout.chat-expanded{position:fixed;inset:20px;z-index:50;height:auto;max-height:none;min-height:0;box-shadow:0 10px 80px #111b2144}.chat-focused{overflow:hidden}.chat-expanded .chat-list-head{gap:8px}@media(max-width:680px){.chat-layout.chat-expanded{inset:0;border:0;border-radius:0}.chat-expanded .thread-head{padding-top:max(12px,env(safe-area-inset-top));height:auto;min-height:72px}.chat-expanded .thread-reply{padding-bottom:max(12px,env(safe-area-inset-bottom))}.chat-expanded .thread-head>button{font-size:10px}}
@media(max-width:680px){.thread-head #reply-chat{display:none}.thread-head #edit-chat-name{font-size:10px;padding:5px}.thread-head .thread-contact{min-width:40px}}