@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&display=swap";:root{font-family:DM Sans,Inter,system-ui,sans-serif;background:#f2f5fa;color:#17243a;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100dvh;display:grid;place-items:center;padding:24px}button,input,textarea,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #82a6ff;outline-offset:2px}button:disabled{opacity:.5;cursor:not-allowed}.widget-shell{position:relative;display:flex;flex-direction:column;width:min(100%,540px);height:min(760px,calc(100dvh - 48px));background:#fff;border:1px solid #e1e7f0;border-radius:22px;box-shadow:0 24px 75px #1f345c22;overflow:hidden}.widget-top{display:flex;align-items:center;gap:11px;background:#111d32;color:#fff;padding:19px 20px;min-height:83px}.brand-mark{width:42px;height:42px;background:#3468e8;border-radius:13px;display:grid;place-items:center}.widget-top strong{display:block;font-size:15px}.widget-top small{display:block;color:#a8b8d3;font-size:11px;margin-top:4px}.connection{margin-left:auto;display:flex;align-items:center;gap:5px;color:#c9a39e;font-size:10px;white-space:nowrap}.connection.connected{color:#98e3bf}.screen{flex:1;overflow-y:auto;padding:34px 32px}.welcome{display:flex;flex-direction:column;justify-content:center}.welcome-icon{width:54px;height:54px;background:#eaf0ff;display:grid;place-items:center;color:#3468e8;border-radius:17px}.screen h1{font-size:25px;letter-spacing:-.8px;margin:17px 0 9px}.screen p{margin:0 0 25px;color:#75849b;font-size:13px;line-height:1.65}.onboard,.new-ticket{display:flex;flex-direction:column;gap:18px}.onboard label,.new-ticket label{display:flex;flex-direction:column;gap:8px;font-size:12px;font-weight:700;color:#34445e}.onboard label span{font-weight:400;color:#8b96a7}.onboard input,.new-ticket textarea,.new-ticket select{width:100%;border:1px solid #dce3ee;background:#fff;border-radius:10px;padding:13px 14px;font-size:13px;color:#22354e;resize:vertical}.action{background:#3468e8;color:#fff;border:0;border-radius:11px;font-weight:700;padding:14px;margin-top:5px}.action:hover{background:#275bd1}.privacy{display:flex;align-items:center;gap:8px;justify-content:center;color:#9aa6b8;font-size:11px;margin-top:30px}.eyebrow{color:#5777b0;font-weight:800;letter-spacing:1.3px;font-size:10px}.section-heading h1{margin-bottom:5px}.new-ticket{margin-top:23px}.text-button{display:flex;align-items:center;gap:7px;border:0;background:transparent;color:#6a7d96;margin:22px auto}.conversation-bar{display:flex;align-items:center;gap:11px;padding:14px 18px;border-bottom:1px solid #ebeff5}.back-btn{border:0;background:#f3f6fb;border-radius:9px;width:36px;height:36px;display:grid;place-items:center;color:#57667d}.conversation-meta{flex:1;min-width:0}.conversation-meta strong{display:block;font-size:13px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.conversation-meta small{display:block;color:#8795a7;font-size:10px;margin-top:4px}.status{border-radius:30px;font-size:10px;font-weight:700;padding:6px 9px}.status.queued{background:#fff4dc;color:#a36d14}.status.active{background:#dcf7eb;color:#167b55}.status.done{background:#eef1f6;color:#687c96}.message-feed{padding:24px 18px;background:#f8fafc;overflow-y:auto;flex:1;display:flex;flex-direction:column;gap:13px}.starter{margin:auto;max-width:280px;text-align:center;color:#8291a9;display:flex;flex-direction:column;gap:10px;align-items:center}.starter strong{color:#263a55;font-size:15px}.starter p{font-size:12px;line-height:1.6}.message-row{display:flex;max-width:90%}.message-row.mine{align-self:flex-end}.message-row.theirs{align-self:flex-start}.message-bubble{border-radius:14px 14px 14px 3px;padding:12px 14px;background:#fff;border:1px solid #e7edf5;box-shadow:0 1px 3px #1a2c4910}.mine .message-bubble{border-radius:14px 14px 3px;background:#3468e8;border-color:#3468e8;color:#fff}.message-bubble p{margin:0;font-size:12px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}.message-bubble .author{display:block;color:#3468e8;font-size:10px;font-weight:800;margin-bottom:5px}.stamp{display:flex;align-items:center;justify-content:flex-end;gap:4px;color:#8594a9;font-size:9px;margin-top:7px}.mine .stamp{color:#cad8ff}.retry{border:0;background:transparent;color:#bc3535;font-size:11px;display:flex;gap:6px;align-items:center;margin-top:8px}.typing{font-size:11px;color:#8796a8}.compose-area{border-top:1px solid #ebeff5;padding:14px 17px}.input-wrap{display:flex;align-items:center;gap:8px;border:1px solid #dce5f1;border-radius:12px;padding:6px;background:#fff}.input-wrap textarea{border:0;outline:0;resize:none;padding:8px;flex:1;font-size:12px;line-height:1.5;min-height:42px}.input-wrap button{background:#3468e8;border:0;border-radius:10px;color:#fff;width:43px;height:43px;display:grid;place-items:center}.widget-footer{border-top:1px solid #edf1f5;padding:10px 15px;display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#99a5b7}.widget-footer button{display:flex;align-items:center;gap:5px;border:0;color:#667e9d;background:transparent;font-size:10px}.widget-footer span{display:flex;gap:4px;align-items:center}.closed-banner{display:flex;align-items:center;gap:6px;justify-content:center;font-size:11px;color:#697b91}.closed-banner button{border:0;background:transparent;color:#3468e8;font-weight:700}.widget-alert{position:absolute;bottom:64px;left:12px;right:12px;background:#fff1f0;color:#a43a38;border:1px solid #f5c8c4;border-radius:9px;padding:12px 16px;font-size:12px;box-shadow:0 10px 30px #1a2d4117}.widget-alert button{float:right;background:transparent;border:0;color:inherit;font-size:18px}@media(max-width:580px){body{padding:0}.widget-shell{border:0;border-radius:0;width:100%;height:100dvh}.screen{padding:25px 20px}.widget-top{padding:16px}.connection span{display:none}}.history-list{margin-top:25px;padding-top:14px;border-top:1px solid #ebeff5}.history-list h3{font-size:12px;margin:6px 0 10px;color:#63758d}.history-list button{border:1px solid #e9edf4;background:#fff;border-radius:9px;width:100%;display:flex;align-items:center;gap:10px;padding:10px 12px;text-align:left;margin:6px 0;color:#49627f;font-size:11px}.history-list span{display:flex;flex-direction:column;gap:4px}.history-list small{color:#8d9aad}
