.homepage-conversations-preview{width:100%;margin:0;min-width:0;justify-self:center;container-type:inline-size;container-name:hero-conversations;font-family:var(--font);font-style:normal;text-align:left}
.homepage-conversations-preview .dashboard-shell{display:grid;grid-template-columns:112px minmax(0,1fr);min-height:0;border:1px solid #d3dccb;border-radius:15px;overflow:hidden;background:#fff;box-shadow:0 18px 42px -25px #2d47233d}
.homepage-conversations-preview .demo-sidebar{display:flex;padding:18px 9px;background:#f7f9f2;border-right:1px solid #e0e6d8;min-width:0}
.homepage-conversations-preview .demo-sidebar .wordmark{font-size:13px;letter-spacing:-.7px;gap:5px;margin:0 1px 26px}
.homepage-conversations-preview .brand-symbol{width:23px;height:23px;min-width:23px;font-size:19px;border-radius:6px;letter-spacing:-4px;padding-right:4px}
.homepage-conversations-preview .brand-symbol span{transform:translateY(-2px)}
.homepage-conversations-preview .workspace-label{font-size:7px;letter-spacing:.12em;font-weight:800;margin:0 7px 12px;color:#7c8871}
.homepage-conversations-preview .sidebar-item{display:flex;align-items:center;gap:6px;margin:3px 0;padding:10px 7px;min-height:34px;border:0;border-radius:6px;font-size:8px;line-height:1.4;font-weight:700;background:transparent;color:#61705a;white-space:nowrap;cursor:default}
.homepage-conversations-preview .sidebar-item>span:first-child{font-size:13px;width:13px;flex-shrink:0;text-align:center}
.homepage-conversations-preview .sidebar-item.active{background:#eaf0d9;box-shadow:inset 3px 0 #244c3a;color:#244c3a}
.homepage-conversations-preview .sidebar-user{margin-top:auto;padding-top:32px;gap:6px;display:flex;align-items:center;border:0}
.homepage-conversations-preview .sidebar-user strong{font-size:8px;line-height:1.4;display:block}
.homepage-conversations-preview .sidebar-user div>span{font-size:7px;display:block;color:#718067}
.homepage-conversations-preview .avatar{width:25px;height:25px;min-width:25px;display:inline-flex;align-items:center;justify-content:center;background:#eaf0d9;color:#315336;border-radius:50%;font-size:8px;line-height:1;font-weight:800}
.homepage-conversations-preview .demo-main{min-width:0;background:#fff}
.homepage-conversations-preview .demo-topbar{height:47px;padding:0 16px;gap:7px;border-bottom:1px solid #e4e9dd;display:flex;align-items:center;justify-content:space-between;font-size:9px;color:#4e6244;font-weight:600}
.homepage-conversations-preview .demo-tag{font-size:6px;padding:3px 4px;border:1px solid #d9e2cf;border-radius:4px;letter-spacing:.05em;white-space:nowrap;color:#7d8a70;margin:0}
.homepage-conversations-preview .hero-conversation-content{padding:19px 17px 16px}
.homepage-conversations-preview .demo-title{padding:0;margin:0 0 15px;display:flex;justify-content:space-between;align-items:center;gap:8px}
.homepage-conversations-preview .demo-title h3{font-size:23px;line-height:1.15;letter-spacing:-.8px;margin:0;color:#1c2b20}
.homepage-conversations-preview .inbox-count{font-size:8px;line-height:1.4;padding:4px 6px;border-radius:4px;background:#f2f5e9;color:#6d7c61;white-space:nowrap}
.homepage-conversations-preview .hero-conversation-selected{padding:12px;display:flex;align-items:center;gap:8px;border:1px solid #d8e1cc;border-radius:8px;background:#f4f7ec;min-width:0;margin-bottom:17px}
.homepage-conversations-preview .hero-conversation-selected>div{min-width:0}
.homepage-conversations-preview .hero-conversation-selected>.avatar{display:inline-flex}
.homepage-conversations-preview .hero-conversation-selected>.status-tag{display:inline-flex}
.homepage-conversations-preview .hero-conversation-selected strong{font-size:11px;font-weight:700;line-height:1.3;display:block}
.homepage-conversations-preview .hero-conversation-selected div>span{font-size:8px;line-height:1.5;display:block;margin-top:2px;color:#758068}
.homepage-conversations-preview .status-tag{margin:0 0 0 auto;padding:3px 5px;border-radius:4px;font-size:7px;background:#e2f677;color:#354e2f;font-weight:700}
.homepage-conversations-preview .conversation-detail{padding:0;background:transparent;border:0;min-width:0}
.homepage-conversations-preview .thread-person{display:flex;gap:8px;align-items:center;margin:0 0 9px}
.homepage-conversations-preview .thread-person strong{font-size:10px;line-height:1.4;display:block;font-weight:700}
.homepage-conversations-preview .thread-person div>span{font-size:8px;line-height:1.5;display:block;color:#7b866f}
.homepage-conversations-preview .thread-message{padding:0;font-size:13px;line-height:1.7;margin:0 0 17px;color:#46563e;font-weight:400;letter-spacing:-.1px}
.homepage-conversations-preview .hero-agent-message{padding:13px;background:#f1f5e7;border:1px solid #e0e8d1;border-radius:8px;margin-bottom:17px}
.homepage-conversations-preview .hero-agent-message .avatar{background:#244c3a;color:#e2f677}
.homepage-conversations-preview .hero-agent-message>p{font-size:12px;line-height:1.7;color:#3e5534;margin:0;font-weight:400;letter-spacing:-.1px}
.homepage-conversations-preview .hero-quick-responses{padding-top:15px;border-top:1px solid #e3e9d9}
.homepage-conversations-preview .hf-quick-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.homepage-conversations-preview .hf-quick-heading strong{font-size:10px;color:#36502c;line-height:1.5;display:flex;align-items:center;gap:5px}
.homepage-conversations-preview .hf-quick-heading strong>span{background:#eaf0d9;width:18px;height:18px;border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:13px}
.homepage-conversations-preview .hf-quick-heading>span{font-size:6px;font-weight:700;letter-spacing:.04em;color:#7a8b6d}
.homepage-conversations-preview .hf-quick-options{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 8px}
.homepage-conversations-preview .hf-quick-options>span{font-size:9px;font-weight:600;line-height:1.4;border:1px solid #d1dcbe;border-radius:5px;padding:7px 8px;background:#f7f9f1;color:#526940}
.homepage-conversations-preview .hf-quick-options>.hero-quick-active{background:#e2edbd;border-color:#aabc84;color:#2e4727}
.homepage-conversations-preview .hero-quick-responses>p{font-size:8px;line-height:1.6;margin:0;color:#7a886b;letter-spacing:0}
.homepage-conversations-preview .agent-copied{display:flex;align-items:center;gap:7px;background:transparent;border:0;border-top:1px solid #e8ecdf;border-radius:0;padding:11px 0 0;margin:14px 0 0;color:#728263;font-size:8px;line-height:1.5}
.homepage-conversations-preview .agent-copied>span:first-child{font-size:13px;color:#4c6d39}
.homepage-conversations-preview .agent-copied>span:last-child{font-size:8px;line-height:1.5;color:#728263}
.homepage-conversations-preview>figcaption{font-size:9px;line-height:1.65;margin:11px 3px 0;color:#77846c;letter-spacing:0}
@media(max-width:960px){.homepage-conversations-preview{max-width:550px}}
@container hero-conversations (max-width:480px){.homepage-conversations-preview .dashboard-shell{grid-template-columns:48px minmax(0,1fr)}.homepage-conversations-preview .demo-sidebar{padding:17px 5px}.homepage-conversations-preview .demo-sidebar .wordmark{justify-content:center;margin-bottom:26px}.homepage-conversations-preview .hero-app-wordmark,.homepage-conversations-preview .hero-nav-label,.homepage-conversations-preview .workspace-label{display:none}.homepage-conversations-preview .sidebar-item{justify-content:center;padding:10px 7px;margin:4px 0}.homepage-conversations-preview .sidebar-item>span:first-child{font-size:16px}.homepage-conversations-preview .sidebar-user{justify-content:center}.homepage-conversations-preview .demo-topbar{padding:0 12px;font-size:8px}.homepage-conversations-preview .hero-conversation-content{padding:17px 13px 14px}.homepage-conversations-preview .demo-title h3{font-size:22px}.homepage-conversations-preview .thread-message{font-size:13px}.homepage-conversations-preview .hero-agent-message>p{font-size:12px}.homepage-conversations-preview .hf-quick-heading>span{font-size:6px}.homepage-conversations-preview .hero-conversation-selected{padding:10px 9px}.homepage-conversations-preview .hero-conversation-selected div>span{font-size:8px}.homepage-conversations-preview .hero-quick-responses>p{font-size:8px}}