@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#172b4d;--muted:#6b7d97;--green:#075cde;--line:#e1e8f3;--cream:#f3f6fc}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font:14px 'DM Sans',sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #6ba6ff;outline-offset:3px}aside{position:fixed;inset:0 auto 0 0;width:238px;background:#0b2149;border-right:1px solid var(--line);padding:30px 18px;display:flex;flex-direction:column}.brand{font:800 20px Manrope,sans-serif;color:var(--green);text-decoration:none;display:flex;gap:9px;align-items:center;padding:0 9px}.workspace{font-size:10px;letter-spacing:1.6px;margin:47px 12px 18px;color:var(--muted)}.workspace span{display:block;letter-spacing:0;margin-top:7px;font-size:12px}nav{display:grid;gap:6px}.nav{border:0;background:none;text-align:left;color:#b7c8e4;padding:13px 12px;border-radius:8px}.nav.active{background:#153b73;color:var(--green);font-weight:700}.nav b{float:right}.section-label{font-size:10px;letter-spacing:1.8px;color:var(--muted);margin:34px 12px 14px}.channel-btn{display:flex;align-items:center;gap:10px;border:0;background:none;width:100%;padding:10px 12px;text-align:left;color:#b7c8e4}.channel-btn.selected{background:#153b73;border-radius:8px}.channel-btn span:last-child{margin-left:auto;color:#8ca5c9}.channel-icon{display:inline-flex;align-items:center;justify-content:center;width:27px;height:27px;border-radius:8px;font-size:10px;font-weight:800;background:#edf0ee;color:#3c6050}.ebay{background:#eef0ff;color:#4c61a6}.tiktok{background:#eeecef;color:#4f4154}.whatsapp{background:#e5f2e7;color:#367e50}.gmail{background:#faece5;color:#aa6951}.team{margin-top:auto;border-top:1px solid var(--line);padding:23px 8px 13px;display:flex;align-items:center;gap:10px}.avatar{width:36px;height:36px;background:#e8f0ff;border-radius:50%;display:grid;place-items:center;font-weight:700;color:#075cde}.team small{display:block;font-size:10px;margin-top:4px;color:var(--muted)}.online{width:7px;height:7px;background:#57ccaa;border-radius:50%;margin-left:auto}.settings{border:0;background:none;text-align:left;padding:13px;color:#b7c8e4}main{margin-left:238px;padding:35px 38px 0;max-width:1800px}header{display:flex;align-items:center;justify-content:space-between;gap:20px}.eyebrow{color:var(--muted);font-size:11px;letter-spacing:.5px}h1{font:800 29px Manrope,sans-serif;letter-spacing:-1px;margin:8px 0 24px}.prototype{font-size:10px;border:1px solid #d5e3fa;background:#eaf2ff;border-radius:20px;padding:8px 12px;color:#315d9c;white-space:nowrap}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:5px 0 25px}.stats>div{background:#fff;border:1px solid var(--line);border-radius:11px;padding:18px 21px;position:relative}.stats small{display:block;color:#617594;font-size:12px}.stats strong{display:block;font:700 28px Manrope;margin:7px 0}.stats span{color:#8190a8;font-size:10px}.desk{display:grid;grid-template-columns:340px minmax(0,1fr);border:1px solid var(--line);border-radius:13px;background:#fff;overflow:hidden;min-height:560px;height:calc(100vh - 305px)}.list-panel{border-right:1px solid var(--line);overflow:auto}.list-top{padding:20px 20px 14px;position:sticky;top:0;background:#fff;z-index:1}h2{font:700 17px Manrope;margin:0 0 17px}input,select,textarea{border:1px solid var(--line);border-radius:7px;background:#f7f9fd;color:var(--ink);padding:10px;width:100%}input::placeholder,textarea::placeholder{color:#8493aa;font-size:12px}.filters{display:flex;gap:8px;margin-top:10px;align-items:center}.filters select{font-size:11px;padding:7px}.filters button{background:none;border:0;font-size:10px;color:var(--muted);white-space:nowrap}.thread{display:block;width:100%;background:#fff;border:0;border-top:1px solid #edf1f8;padding:18px 20px;text-align:left;border-left:3px solid transparent}.thread.active{background:#edf4ff;border-left-color:#0868f9}.thread-top{display:flex;gap:9px;align-items:center}.thread-top strong{font-size:12px}.thread-top time{margin-left:auto;font-size:10px;color:#8190a8}.thread h3{font-size:12px;margin:11px 0 6px;font-weight:600}.thread p{font-size:11px;color:#71809a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0 0 11px}.thread-bottom{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#71809a}.badge{display:inline-block;border-radius:5px;padding:4px 7px;font-size:10px;background:#edf1f8;color:#617594}.badge.new{background:#e6efff;color:#075cde}.badge.needs-action{background:#fff0f0;color:#ba293b}.badge.complete{background:#e6f2e9;color:#5c8963}#conversation{display:flex;flex-direction:column;min-width:0;overflow:hidden}.conv-head{padding:22px 25px;border-bottom:1px solid var(--line);display:flex;gap:12px;align-items:center}.conv-head h2{margin:0 0 5px;font-size:16px}.conv-head small{font-size:10px;color:var(--muted)}.back{display:none}.conv-tools{padding:12px 23px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line);font-size:11px}.conv-tools select{padding:7px;width:auto;font-size:11px}.conv-tools .owner{margin-right:auto;color:#6b7d97}.secondary{border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--green);padding:8px 10px;font-size:11px}.messages{overflow:auto;padding:22px 25px;flex:1;background:#fbfcff}.date{text-align:center;font-size:10px;color:#8190a8;margin-bottom:22px}.message{max-width:85%;margin-bottom:19px}.message .meta{font-size:10px;color:#71809a;margin-bottom:7px}.bubble{padding:13px 15px;border:1px solid #e1e8f3;background:#fff;border-radius:0 10px 10px;font-size:12px;line-height:1.7;white-space:pre-wrap}.message.out{margin-left:auto}.out .bubble{background:#eaf2ff;border-color:#d6e5ff;border-radius:10px 0 10px 10px}.out .meta{text-align:right}.note{max-width:100%;background:#fcf5df;border:1px solid #f0e6c6;border-radius:7px;padding:12px 14px;font-size:11px;line-height:1.6;margin-bottom:17px;white-space:pre-wrap}.note strong{font-size:10px;color:#9d8545;display:block;margin-bottom:4px}.compose{padding:15px 24px 18px;border-top:1px solid var(--line)}.compose-tabs{display:flex;gap:16px;margin-bottom:10px}.compose-tabs button{background:none;border:0;padding:0 0 6px;color:#71809a;font-size:11px}.compose-tabs button.active{color:var(--green);border-bottom:2px solid var(--green)}.compose textarea{resize:vertical;min-height:65px;border:0;background:#f6f8fd;font-size:12px}.compose-actions{display:flex;justify-content:space-between;align-items:center;margin-top:10px}.compose-actions span{font-size:10px;color:#71809a}.primary{border:0;background:var(--green);color:#fff;border-radius:7px;padding:10px 14px;font-size:12px}.primary:hover{background:#004bbd}footer{display:flex;justify-content:space-between;padding:15px 0;color:#71809a;font-size:10px}footer button{background:none;border:0;color:#71809a;font-size:10px}dialog{border:1px solid var(--line);border-radius:16px;max-width:460px;width:calc(100% - 32px);padding:28px;box-shadow:0 30px 90px #0b214933;color:var(--ink)}dialog::backdrop{background:#0b214966}dialog h2{margin-top:10px}dialog label{display:block;font-size:12px;margin:18px 0 8px}dialog label select,dialog label textarea{margin-top:8px}dialog textarea{min-height:100px}.muted{font-size:12px;color:var(--muted);line-height:1.7}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}.dialog-actions button:first-child{border:0;background:none;color:var(--muted)}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:var(--ink);color:#fff;border-radius:8px;padding:13px 20px;font-size:12px;display:none;z-index:5}.empty{padding:40px 25px;color:var(--muted);font-size:12px;text-align:center}
@media(min-width:1500px){.desk{grid-template-columns:390px minmax(0,1fr)}}@media(max-width:1150px){aside{width:195px;padding:25px 10px}.brand{font-size:17px}main{margin-left:195px;padding:26px 22px 0}.desk{grid-template-columns:290px minmax(0,1fr)}.prototype{font-size:9px}.stats>div{padding:14px}.conv-tools{flex-wrap:wrap}.conv-tools .owner{width:100%}}@media(max-width:820px){aside{position:static;width:100%;padding:16px;display:block;border-bottom:1px solid var(--line)}.workspace,.section-label,.channels,.team,.settings{display:none}.brand{font-size:20px}nav{display:flex;overflow:auto;margin-top:16px;gap:6px}.nav{font-size:11px;white-space:nowrap;padding:9px}.nav b{margin-left:8px}main{margin:0;padding:20px 16px 0}header{align-items:flex-start}.eyebrow{font-size:10px}h1{font-size:25px;margin-bottom:18px}.prototype{max-width:100px;white-space:normal;text-align:center;line-height:1.5;padding:6px}.stats{gap:8px;margin:0 0 18px}.stats>div{padding:12px}.stats small{font-size:10px}.stats span{display:none}.stats strong{font-size:24px;margin-bottom:0}.desk{display:block;height:calc(100dvh - 300px);min-height:480px}.list-panel{height:100%;border:0}#conversation{display:none;height:100%}.desk.show-thread .list-panel{display:none}.desk.show-thread #conversation{display:flex}.back{display:block;border:0;background:none;font-size:22px;color:var(--green);padding:0 7px 0 0}.conv-head{padding:16px}.conv-head h2{font-size:14px}.conv-tools{padding:10px 16px}.conv-tools .owner{width:auto}.messages{padding:20px 16px}.compose{padding:12px 16px}.compose-actions span{font-size:9px}.message{max-width:93%}footer{font-size:9px;gap:10px}}

/* Cre8ive Layers brand */
aside{border:0;box-shadow:5px 0 24px #0b214909;overflow-y:auto}
.brand{flex-direction:column;text-align:center;gap:10px;padding:0;color:#fff}
.brand img{width:104px;height:108px;object-fit:contain;filter:drop-shadow(0 5px 8px #0003)}
.brand strong{font:800 17px Manrope,sans-serif;letter-spacing:.5px;display:block;color:#fff}
.brand small{display:block;font:500 11px 'DM Sans',sans-serif;letter-spacing:2px;color:#a8c5ef;margin-top:5px;text-transform:uppercase}
.workspace{margin-top:26px;color:#8fa8ce}.workspace span{color:#c6d7ee}
.nav{position:relative}.nav.active{color:#fff;background:#153b73}.nav.active::before{content:'';position:absolute;left:0;top:11px;bottom:11px;width:3px;background:#ff3545;border-radius:4px}
.nav:hover,.channel-btn:hover{background:#123461;color:#fff}.section-label{color:#8fa8ce;margin-top:26px}.channel-btn.selected{color:#fff}
.team{border-color:#29416a;color:#fff;flex-shrink:0;margin-top:auto}.team small{color:#9fb7db}.settings{color:#b7c8e4}.settings:hover{color:#fff}
header .eyebrow{color:#075cde;font-weight:700;letter-spacing:1.5px;font-size:10px}h1{color:#0b2149}
.stats>div{border-top:3px solid #0868f9;box-shadow:0 3px 12px #10234b03}.stats>div:first-child{border-top-color:#f22d42}.stats>div:first-child strong{color:#d6283e}.stats strong{color:#0b3f91}
.desk{box-shadow:0 8px 30px #0b214906}.thread.active{border-left-color:#0868f9}.thread.active .thread-top strong{color:#064bad}
.compose-tabs button.active{color:#075cde;border-color:#075cde}.primary{box-shadow:0 3px 8px #075cde20}.primary:hover{background:#004bbd}
.channel-icon{background:#edf2fc;color:#476389}.avatar{background:#e8f0ff;color:#075cde}.online{box-shadow:0 0 0 3px #16385d}
@media(max-height:820px) and (min-width:821px){aside{padding-top:18px;padding-bottom:12px}.brand img{width:80px;height:83px}.brand strong{font-size:15px}.workspace{margin-top:20px;margin-bottom:12px}.nav{padding-top:10px;padding-bottom:10px}.section-label{margin-top:20px}.channel-btn{padding-top:7px;padding-bottom:7px}.team{padding-top:16px}}
@media(max-width:1150px) and (min-width:821px){.brand strong{font-size:15px}.brand img{width:92px;height:96px}}
@media(max-width:820px){aside{padding:12px 16px}.brand{flex-direction:row;text-align:left;gap:12px;justify-content:flex-start}.brand img{width:57px;height:60px}.brand strong{font-size:16px}.brand small{font-size:9px;letter-spacing:1.7px}.nav{color:#b7c8e4}.nav.active{color:#fff}nav{margin-top:12px}.desk{height:calc(100dvh - 340px)}header .eyebrow{font-size:8px;letter-spacing:1.1px}.stats strong{font-size:24px}}

/* Locally bundled channel brand logos */
.channel-icon{background:#fff;flex:0 0 29px;width:29px;height:29px;border-radius:7px;border:1px solid #e6ebf3;overflow:hidden}
.channel-icon img{display:block;width:19px;height:19px;object-fit:contain}
.channel-icon.ebay img{width:25px;height:19px}
.channel-btn .channel-icon{box-shadow:0 2px 5px #00000012}

.header-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}.header-controls .muted{font-size:10px;margin:0}#mobile-connections{display:none}.settings{text-decoration:none;font-size:12px}.team{margin-top:auto}.connection-header{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}#connections-dialog{max-width:750px;max-height:88dvh;overflow:auto}.connection-card{border:1px solid var(--line);border-radius:10px;padding:18px;margin:16px 0}.connection-card h3{display:flex;align-items:center;gap:10px;margin:0 0 8px;font-size:15px}.connection-card label{font-size:11px;margin:12px 0}.connection-card .fields{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}.connection-card button{margin-right:6px;margin-top:8px}.connection-state{font-size:10px;padding:4px 7px;background:#edf2fc;border-radius:5px;margin-left:auto;color:#43658e}.callback-url{display:block;padding:10px;background:#f3f6fc;border-radius:6px;overflow-wrap:anywhere;font:11px monospace;user-select:all}.error-message{color:#b12c3c}.connection-card .muted{font-size:11px}button:disabled{opacity:.55;cursor:not-allowed}#connections-dialog p{line-height:1.65}.nav b{float:none;margin-left:5px}nav{scrollbar-width:none}nav::-webkit-scrollbar{display:none}.workspace{margin-top:18px}.section-label{margin-top:18px}.channel-btn{padding-top:8px;padding-bottom:8px}.team{padding-top:16px}.settings{padding:10px 12px}.signed-in{color:#8fa8ce;font-size:10px}.status-error{background:#fff1f1;color:#b12c3c}.compose-actions .muted{max-width:65%}
@media(max-width:820px){#mobile-connections{display:block}.header-controls{max-width:115px;gap:7px}.header-controls .muted{display:none}.connection-card .fields{grid-template-columns:1fr}#connections-dialog{padding:20px}.connection-header h2{font-size:16px}aside .settings{display:none}.desk{min-height:500px}}
@media(min-width:821px){.desk{min-height:380px;height:calc(100dvh - 305px)}}
@media(max-height:820px) and (min-width:821px){.brand{gap:6px}.brand img{width:62px;height:64px}.brand strong{font-size:14px}.brand small{font-size:9px}.workspace{margin:14px 12px 10px}.nav{padding-top:8px;padding-bottom:8px}.section-label{margin-top:16px;margin-bottom:10px}.channel-btn{padding-top:5px;padding-bottom:5px}.team{padding-top:12px;padding-bottom:8px}.settings{padding-top:8px;padding-bottom:8px}}
