:root{--st-primary: #1d1d1d;--st-primary-contrast: #ffffff;--st-bg: #ffffff;--st-surface: #f5f5f6;--st-surface-2: #ebebee;--st-border: #e4e4e7;--st-text: #18181b;--st-text-muted: #71717a;--st-danger: #b42318;--st-danger-bg: #fef3f2;--st-radius: 16px;--st-radius-sm: 12px;--st-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;color-scheme:light}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--st-font);font-size:15px;line-height:1.5;color:var(--st-text);background:var(--st-bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow:hidden}button{font:inherit}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.messenger{display:grid;grid-template-rows:auto 1fr auto;height:100%;background:var(--st-bg)}.header{display:flex;align-items:center;gap:8px;padding:max(8px,env(safe-area-inset-top)) 8px 8px;min-height:56px;background:var(--st-bg);border-bottom:1px solid var(--st-border)}.header__avatar{width:32px;height:32px;border-radius:50%;background:var(--st-primary);color:var(--st-primary-contrast);display:grid;place-items:center;font-weight:600;font-size:13px;flex:none}.header__title{flex:1;min-width:0;padding-left:2px}.header__name{font-weight:600;font-size:14px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.header__sub{font-size:12px;line-height:1.3;color:var(--st-text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.header__btn{appearance:none;border:0;background:transparent;color:var(--st-text-muted);width:36px;height:36px;flex:none;border-radius:10px;cursor:pointer;display:grid;place-items:center;transition:background .12s,color .12s}.header__btn svg{width:18px;height:18px}.header__btn:hover{background:var(--st-surface);color:var(--st-text)}.header__btn:focus-visible{outline:2px solid var(--st-primary);outline-offset:-2px}.list{display:grid;grid-template-rows:1fr auto;min-height:0;background:var(--st-bg)}.list__scroll{overflow-y:auto;overscroll-behavior:contain;padding:8px}.list__items{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}.list__item{appearance:none;width:100%;display:flex;align-items:center;gap:10px;padding:10px 8px 10px 12px;border:0;border-radius:10px;background:transparent;color:inherit;text-align:left;cursor:pointer;transition:background .12s}.list__item:hover:not(:disabled),.list__item:focus-visible{background:var(--st-surface)}.list__item:focus-visible{outline:2px solid var(--st-primary);outline-offset:-2px}.list__item:disabled{cursor:default}.list__item--current{background:var(--st-surface)}.list__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.list__title{font-size:14px;font-weight:500;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.list__meta{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--st-text-muted)}.list__pill{padding:1px 7px;border-radius:999px;background:#ecfdf3;color:#067647;font-size:11px;font-weight:500}.list__chevron{flex:none;width:16px;height:16px;color:var(--st-text-muted);opacity:.7}.list__chevron svg{width:16px;height:16px}.list__empty{padding:48px 16px;text-align:center;color:var(--st-text-muted);font-size:14px}.list__foot{padding:10px 12px max(12px,env(safe-area-inset-bottom));border-top:1px solid var(--st-border)}.skel{display:block;border-radius:8px;background:var(--st-surface-2);animation:shimmer 1.4s ease-in-out infinite}.skel--avatar{width:32px;height:32px;border-radius:50%;margin-left:44px}.skel--name{width:110px;height:12px;margin-bottom:6px}.skel--sub{width:80px;height:10px}.skel--bubble{height:40px;border-radius:var(--st-radius)}.skel--input{height:44px;border-radius:var(--st-radius-sm)}.list__item--skeleton{flex-direction:column;align-items:stretch;gap:8px;cursor:default}.skel--title{height:12px;width:70%}.skel--meta{height:10px;width:30%}@keyframes shimmer{0%,to{opacity:1}50%{opacity:.45}}@media(prefers-reduced-motion:reduce){.skel{animation:none}}.timeline{overflow-y:auto;overscroll-behavior:contain;padding:16px 16px 8px;display:flex;flex-direction:column;gap:12px;scroll-behavior:smooth}@media(prefers-reduced-motion:reduce){.timeline{scroll-behavior:auto}}.msg{display:flex;flex-direction:column;gap:8px;max-width:85%}.msg--visitor{align-self:flex-end;align-items:flex-end}.msg--assistant,.msg--system,.msg--agent{align-self:stretch;max-width:100%}.bubble{padding:9px 14px;border-radius:var(--st-radius);white-space:pre-wrap;overflow-wrap:anywhere}.msg--assistant .bubble,.msg--agent .bubble{max-width:85%;align-self:flex-start;background:var(--st-surface);border-bottom-left-radius:6px}.msg--visitor .bubble{background:var(--st-primary);color:var(--st-primary-contrast);border-bottom-right-radius:6px}.msg__meta{font-size:11.5px;color:var(--st-text-muted);padding:0 4px}.msg__error{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12.5px;color:var(--st-danger)}.linkbtn{appearance:none;border:0;background:none;padding:0;color:inherit;text-decoration:underline;cursor:pointer;font-size:inherit}.quote{margin:0;border:1px solid var(--st-border);background:var(--st-bg);border-radius:var(--st-radius-sm);overflow:hidden;box-shadow:0 1px 2px #0000000a}.quote__text{position:relative;margin:0;padding:12px 14px 12px 26px;font-size:14.5px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere}.quote__source{display:flex;align-items:flex-start;gap:8px;padding:8px 12px;border-top:1px solid var(--st-border);background:var(--st-surface);font-size:12px;line-height:16px;color:var(--st-text-muted)}.quote__source svg{flex:none;width:16px;height:16px}.quote__ref{min-width:0;display:flex;flex-direction:column}.quote__doc{color:var(--st-text);font-weight:500;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.actions{display:flex;flex-wrap:wrap;gap:6px}.actions__btn{appearance:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;border:1px solid var(--st-border);color:var(--st-text);background:var(--st-bg);border-radius:999px;padding:6px 12px;font-size:13px;font-weight:500;line-height:1.3;transition:background .12s,border-color .12s,color .12s}.actions__btn:hover:not(:disabled){background:var(--st-surface);border-color:var(--st-surface-2)}.actions__btn:focus-visible{outline:2px solid var(--st-primary);outline-offset:2px}.actions__btn:disabled{opacity:.5;cursor:default}.actions__btn--primary{background:var(--st-primary);border-color:var(--st-primary);color:var(--st-primary-contrast)}.actions__btn--primary:hover:not(:disabled){background:var(--st-primary);border-color:var(--st-primary);opacity:.9}.actions__btn--done,.actions__btn--done:disabled{opacity:1;background:var(--st-surface);border-color:var(--st-surface);color:var(--st-text)}.actions__btn svg{width:14px;height:14px;color:#067647}.status{display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:var(--st-radius-sm);border:1px solid var(--st-border);font-size:14px;line-height:1.45;background:var(--st-surface);color:var(--st-text)}.status svg{flex:none;width:16px;height:16px;margin-top:2px}.status--error{background:var(--st-danger-bg);border-color:#fecdca;color:var(--st-danger)}.status--escalated{background:#ecfdf3;border-color:#abefc6;color:#067647}.status--no_answer{background:#fffaeb;border-color:#fedf89;color:#93370d}.unsupported{font-size:12.5px;color:var(--st-text-muted);font-style:italic}.progress{display:flex;align-items:center;gap:10px;color:var(--st-text-muted);font-size:13.5px}.dots{display:inline-flex;gap:4px}.dots i{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.4;animation:pulse 1.2s infinite ease-in-out}.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}@keyframes pulse{0%,80%,to{opacity:.3;transform:scale(.85)}40%{opacity:1;transform:scale(1)}}@media(prefers-reduced-motion:reduce){.dots i{animation:none;opacity:.7}}.banner{margin:8px 16px 0;padding:8px 12px;border-radius:10px;border:1px solid #fedf89;font-size:13px;background:#fffaeb;color:#93370d;display:flex;gap:8px;align-items:center}.banner--error{background:var(--st-danger-bg);border-color:#fecdca;color:var(--st-danger)}.composer{padding:8px 12px max(10px,env(safe-area-inset-bottom));background:var(--st-bg)}.composer__row{display:flex;align-items:flex-end;gap:8px;border:1px solid var(--st-border);border-radius:var(--st-radius);padding:6px 6px 6px 14px;background:var(--st-bg);box-shadow:0 1px 2px #0000000a;transition:border-color .12s,box-shadow .12s}.composer__row:focus-within{border-color:var(--st-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--st-primary) 15%,transparent)}.composer__input{flex:1;resize:none;border:0;outline:0;background:transparent;font:inherit;color:inherit;line-height:1.4;padding:6px 0;max-height:120px;min-height:24px}.composer__input::placeholder{color:var(--st-text-muted)}.composer__send{appearance:none;border:0;cursor:pointer;width:32px;height:32px;border-radius:50%;background:var(--st-primary);color:var(--st-primary-contrast);display:grid;place-items:center;flex:none;transition:opacity .12s}.composer__send:disabled{opacity:.35;cursor:default}.composer__send:focus-visible{outline:2px solid var(--st-primary);outline-offset:2px}.composer__send svg{width:16px;height:16px;stroke-width:2.25}.composer__foot{display:flex;justify-content:space-between;align-items:center;margin-top:6px;padding:0 4px;font-size:11px;color:var(--st-text-muted)}.composer__count--over{color:var(--st-danger)}.screen{display:grid;place-items:center;height:100%;padding:24px;text-align:center;color:var(--st-text-muted);font-size:14px}.screen__inner{display:grid;gap:12px;justify-items:center}.btn{appearance:none;cursor:pointer;border:0;background:var(--st-primary);color:var(--st-primary-contrast);border-radius:10px;padding:9px 16px;font-weight:500;font-size:14px;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:opacity .12s}.btn:hover:not(:disabled){opacity:.9}.btn svg{width:16px;height:16px}.btn:disabled{opacity:.5;cursor:default}.btn:focus-visible{outline:2px solid var(--st-primary);outline-offset:2px}.btn--block{width:100%}
