:root{--ink:#1e352b;--muted:#77857c;--blue:#28624c;--pale:#edf5ef;--line:#e3e9e3;--bg:#f4f5ef;--white:#fff;--mint:#e8f3eb;--shadow:0 10px 32px rgba(32,65,47,.07)}
body{background:radial-gradient(circle at 80% 0,#fff 0,#f6f6f1 38%,#f1f3ec 100%);color:var(--ink)}
.rail{position:sticky;top:0;height:100vh;flex:0 0 74px;background:#fff;border-right-color:#e8ece7;box-shadow:4px 0 24px #26453208;z-index:5}
.brand{color:#1f694d;font-size:14px;letter-spacing:.04em}
.nav{transition:background .16s ease,color .16s ease,transform .16s ease}
.nav:hover{background:#f2f6f1;color:#28624c}
.nav.active{background:#e9f3eb;color:#1d6649}
.avatar{background:#dceee1;color:#28624c}
.app{max-width:1780px;padding:20px clamp(14px,2vw,30px) 18px}
.demo-ribbon{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:34px;padding:7px 12px;margin-bottom:15px;border:1px solid #e9e5d6;border-radius:10px;background:#fffdf6;color:#6d674d;font-size:10px}
.demo-ribbon span{display:flex;align-items:center;gap:8px;font-weight:750}
.demo-ribbon i{display:block;width:7px;height:7px;border-radius:50%;background:#c58a39;box-shadow:0 0 0 3px #f4ead7}
.demo-ribbon small{font-size:10px;color:#958d71}
.eyebrow{color:#63806d}
.top{margin-bottom:16px}
.top h1{color:#203d30;font-size:26px}
.preview{background:#eaf3eb;color:#3c7256}
.preview i{background:#459169}
.layout{grid-template-columns:minmax(270px,330px) minmax(360px,1fr) minmax(220px,255px);gap:12px;min-height:calc(100dvh - 168px)}
.panel,.messages-view{border-color:#e4e9e3;border-radius:16px;box-shadow:0 8px 28px rgba(36,68,48,.055)}
.inbox{padding:16px 12px}
.focus-card{display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:9px;margin:0 0 12px;padding:10px;border:1px solid #dcebe0;border-left:3px solid #48a273;border-radius:12px;background:linear-gradient(125deg,#edf8f0,#fffdf8);transition:background .2s,border-color .2s;}
.focus-card[hidden]{display:none}
.focus-card.sla-warning{border-color:#edc673;background:linear-gradient(125deg,#fff8e8,#fffdf7)}
.focus-card.sla-overdue{border-color:#df8a7e;background:linear-gradient(125deg,#fff0ed,#fffafa)}
.focus-icon{display:grid;place-items:center;width:31px;height:31px;border-radius:10px;background:#dff2e5;color:#267347;font-size:17px}
.focus-card.sla-warning .focus-icon{background:#ffedc8;color:#996314}
.focus-card.sla-overdue .focus-icon{background:#ffe0dc;color:#a23935}
.focus-copy{min-width:0}
.focus-kicker{display:flex;align-items:center;justify-content:space-between;gap:7px;color:#718478;font-size:8px;font-weight:800;letter-spacing:.06em}
.focus-copy strong{display:block;margin-top:3px;overflow:hidden;color:#284b36;font-size:11px;text-overflow:ellipsis;white-space:nowrap}
.focus-copy p{display:-webkit-box;overflow:hidden;margin:3px 0 0;color:#6f7f73;font-size:9px;line-height:1.4;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.focus-action{border:0;border-radius:8px;background:linear-gradient(135deg,#287a55,#25684e);color:#fff;padding:8px 10px;font:inherit;font-size:9px;font-weight:750;white-space:nowrap;cursor:pointer;box-shadow:0 4px 10px #286c4e24}
.focus-action:hover{background:#205b41}
.sla-clock{display:inline-flex;align-items:center;justify-content:center;min-width:44px;padding:4px 6px;border-radius:7px;background:#e6f4ea;color:#276644;font-size:9px;font-weight:850;font-variant-numeric:tabular-nums;letter-spacing:.02em;white-space:nowrap}
.sla-clock.sla-warn{background:#fff0cf;color:#8a5c0d}
.sla-clock.sla-late{background:#ffe3df;color:#9f3935}
.focus-sla{padding:3px 6px}
.person-sla{display:table;margin-top:4px;padding:3px 6px;border-radius:7px;background:#e6f4ea;color:#276644;font-size:9px;font-weight:750;font-variant-numeric:tabular-nums}
.person-sla.sla-warn{background:#fff0cf;color:#8a5c0d}
.person-sla.sla-late{background:#ffe3df;color:#9f3935}
.inboxhead h2,.convhead h2,.detailtitle h2{color:#244735}
.inboxhead small{color:#829087}.inboxhead small b{margin-left:3px;padding:3px 6px;border-radius:6px;background:#eaf4ec;color:#28734d;font-size:9px}
.list{padding-top:7px;overflow:auto;max-height:calc(100dvh - 355px)}
.thread{padding:11px 7px;border-radius:12px;transition:background .14s ease}
.thread:hover,.thread.active{background:#f0f6f0}
.thread.active{box-shadow:inset 3px 0 #3b815d}
.thread .personavatar{background:#e5f0e5;color:#346547}
.thread:nth-child(2n) .personavatar{background:#f5ecdd;color:#8c6e40}
.threadpreview{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#77847b;font-size:11px;margin-top:5px}
.threadtop b{color:#273f32}
.threadtop time{color:#929d94}
.thread .sla-clock{flex:0 0 auto;align-self:center}
.unread{background:#d8913b}
.conversation{min-height:0}
.convhead{padding:13px 16px;border-bottom-color:#e9eee8}
.messages{background:linear-gradient(180deg,#fff 0%,#fcfdfb 100%);padding:20px}
.bubble.in{background:#f0f4ef}
.bubble.out{background:#e8f3eb;color:#1e4c36}
.bubble time{color:#829088}
.replyarea{border-top-color:#e8ede7;padding:12px 14px}
.assist{background:#f4f8f3;border-color:#e4ece3}
.assist strong{color:#35664b}
.assist button,.primary-button,.call-actions .primary-button{background:#286c4e}
.assist button:hover,.primary-button:hover,.call-actions .primary-button:hover{background:#205b41}
.replyarea textarea,.note-field,#callPurpose{border-color:#e0e7df}
.subtle,.iconbtn{border-color:#e1e8df}
.iconbtn{color:#28624c}
.details{padding:15px 13px}
.detailtitle{padding-bottom:10px;border-bottom:1px solid #eef1ec}
.profilecard{padding:16px 8px 13px}
.detailblock{border-top-color:#edf0eb;padding:10px 0}
.status{background:#f5f7ef;color:#667753}
.leads-heading h2{color:#214332}
.leads-heading p{color:#758179}
.lead-row{border-radius:12px}
.lead-row.active,.lead-row:hover{background:#f0f6f0}
.lead-category-tag{background:#edf5ee;color:#477455}
.lead-workspace,.leads-list{border-radius:16px}
.leads-layout{gap:12px}
.lead-profile{border-color:#e8ede7}
.lead-empty .empty-icon{background:#e7f2e9;color:#28624c}
.primary-button{border-radius:10px}
.lead-extra>summary{color:#315f46}
.call-plan-card{border-color:#e4ece3;background:#fbfdfa}
.messages-view{background:#f5f6f1}
.messages-view iframe{background:#f5f6f1}
.mobile-list-back{display:none}
footer{color:#718077}
footer span{color:#918e7b}
.notice{border-color:#e1e9df;background:#f5faf3;color:#376045}
.notice.error{background:#fff6f4;border-color:#eedcd6;color:#964f44}
button,select,textarea,input{accent-color:#286c4e}
button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #8bb99b;outline-offset:2px}
.leadCallButton.disabled{pointer-events:none}
@media(max-width:1160px){.layout{grid-template-columns:minmax(270px,310px) minmax(0,1fr)}.details{display:none}}
@media(max-width:760px){
 body{display:block;min-height:100dvh}
 .rail{position:sticky;top:0;bottom:auto;left:auto;right:auto;flex:0 0 54px;width:54px;height:100dvh;min-height:100vh;padding:12px 4px;flex-direction:column;justify-content:flex-start;gap:10px;border:0;border-right:1px solid #e5ebe4;box-shadow:4px 0 18px #203b2b0c}
 .rail .brand{display:block;width:100%;margin:2px 0 12px;text-align:center;font-size:9px;line-height:1.2;letter-spacing:0}
 .rail>.avatar{display:grid;width:32px;height:32px;margin:auto 0 2px;font-size:10px}
 .nav{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;font-size:20px}
 .app{width:calc(100% - 54px);max-width:none;flex:1 1 calc(100% - 54px);min-width:0;padding:12px 10px 14px;margin:0}
 .demo-ribbon{min-height:32px;margin-bottom:10px;padding:6px 9px;align-items:flex-start;flex-direction:column;gap:3px}
 .demo-ribbon span,.demo-ribbon small{font-size:9px}
 .top{align-items:flex-start;margin-bottom:11px}
 .top h1{font-size:22px}
 .topright{gap:6px}
 .preview{font-size:9px;padding:6px 8px;white-space:nowrap}
 #logoutBtn{display:none}
 .layout{display:grid;grid-template-columns:1fr;gap:0;min-height:calc(100dvh - 187px)}
 .inbox,.conversation{min-height:calc(100dvh - 190px)}
 .inbox{padding:13px 12px}
 .focus-card{grid-template-columns:28px minmax(0,1fr) auto;gap:7px;margin-bottom:8px;padding:8px}
 .focus-icon{width:27px;height:27px;font-size:15px}
 .focus-kicker{font-size:7px}
 .focus-copy strong{font-size:10px}
 .focus-copy p{font-size:8px}
 .focus-action{padding:7px 8px;font-size:8px}
 .sla-clock{min-width:40px;padding:3px 5px;font-size:8px}
 .app-root .inbox .list{display:flex;flex-direction:column;overflow-x:hidden;overflow-y:auto}
 .app-root .inbox .thread{min-width:0}
 .list{max-height:calc(100dvh - 385px)}
 .convhead{flex-wrap:wrap;gap:7px;padding:10px 11px}
 .mobile-list-back{display:none;border:0;background:transparent;color:#28624c;font-size:11px;font-weight:750;padding:5px 3px}
 .layout.mobile-conversation .mobile-list-back{display:inline-flex}
 .layout.mobile-conversation .inbox{display:none}
 .layout.mobile-conversation .conversation{display:flex}
 .layout:not(.mobile-conversation) .conversation{display:none}
 .messages{padding:15px 11px}
 .bubble{max-width:90%}
 .replyarea{padding:10px}
 .assist{padding:8px 9px}
 .assist small{max-width:220px}
 .details{display:none}
 .leads-heading{align-items:flex-start}
 .leads-heading h2{font-size:20px}
 .lead-toolbar{gap:6px}
 .lead-profile-actions{margin-left:0}
 .messages-view{min-height:calc(100dvh - 200px);border-radius:13px}
 .messages-view iframe{height:calc(100dvh - 270px);min-height:550px}
 footer{display:none}
}

.layout{height:calc(100dvh - 180px);min-height:540px;max-height:calc(100dvh - 180px)}.inbox{display:flex;flex-direction:column;min-height:0}.list{flex:1;max-height:none}.messages{min-height:0}.mobile-list-back{display:none}
@media(max-width:760px){.layout{height:auto;max-height:none;min-height:calc(100dvh - 187px)}.inbox{height:calc(100dvh - 190px);min-height:440px}.list{max-height:none}.mobile-list-back{display:none}.layout.mobile-conversation .mobile-list-back{display:inline-flex}}

a[aria-disabled="true"]{cursor:not-allowed;opacity:.68}
.utility-view{min-height:calc(100dvh - 185px);padding:18px;border:1px solid #e4e9e3;border-radius:16px;background:#fbfcf9;box-shadow:var(--shadow)}
.utility-view[hidden]{display:none}
.utility-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:15px}
.utility-heading h2{margin:3px 0 5px;color:#214332;font-size:23px}
.utility-heading p:not(.eyebrow){margin:0;color:#758179;font-size:12px}
.utility-heading button{min-height:40px;white-space:nowrap}
.utility-context{margin:0 0 15px;padding:11px 13px;border:1px solid #e2ebdf;border-radius:10px;background:#f0f6ed;color:#4b7056;font-size:12px}
.health-grid,.links-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(235px,1fr));gap:12px}
.health-card,.link-card{min-width:0;padding:18px;border-radius:14px;background:#fff}
.health-card h3,.link-card h3{margin:0 0 12px;color:#274d36;font-size:16px}
.health-card p,.link-card p{margin:10px 0 0;color:#68796e;font-size:12px;line-height:1.5}
.health-badge{display:inline-flex;align-items:center;min-height:28px;padding:5px 10px;border-radius:8px;background:#f0f2ee;color:#627166;font-size:12px}
.health-badge.good{background:#e7f4e9;color:#26724a}.health-badge.warn{background:#fff1d9;color:#8b6419}
.utility-footnote{margin:16px 2px 0;color:#88948b;font-size:11px}
.link-card small{display:block;overflow:hidden;margin:9px 0 15px;color:#8b988f;font-size:11px;text-overflow:ellipsis;white-space:nowrap}
.link-actions{display:flex;flex-wrap:wrap;gap:8px}
.link-actions a,.link-actions button{display:inline-flex;align-items:center;justify-content:center;min-height:39px;padding:9px 12px;border-radius:9px;font-size:12px;font-weight:700;text-decoration:none}
.link-actions a{background:#286c4e;color:#fff}.link-actions a:hover{background:#205b41}
@media(max-width:760px){.utility-view{min-height:calc(100dvh - 170px);padding:13px}.utility-heading h2{font-size:20px}.health-grid,.links-grid{grid-template-columns:1fr;gap:9px}.health-card,.link-card{padding:14px}.link-actions a,.link-actions button{flex:1 1 auto}.rail{gap:5px}.rail .brand{margin-bottom:7px}.nav{flex-basis:42px;height:42px}}
@media(max-width:760px){.app-root .rail{width:66px;flex-basis:66px;gap:4px}.app-root .app{width:calc(100% - 66px);flex-basis:calc(100% - 66px)}.rail .brand{margin-bottom:5px}.nav{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;flex:0 0 52px;width:56px;height:52px;padding:3px 2px;font-size:17px}.nav svg{width:18px;height:18px}.nav::after{content:attr(title);display:block;color:inherit;font-size:7px;font-weight:750;line-height:1.05;text-align:center;white-space:normal}}
