.sa{display:grid;grid-template-columns:minmax(0,1fr);height:calc(100dvh - 130px);min-height:520px;position:relative}
.sa__scrim{position:fixed;inset:0;z-index:58;background:rgba(35,31,32,.45)}
.sa__scrim[hidden]{display:none}
.sa__side{position:fixed;z-index:59;top:0;bottom:0;left:0;width:min(86vw,320px);background:var(--stone);padding:16px;display:flex;flex-direction:column;gap:12px;transform:translateX(-102%);visibility:hidden;transition:transform .25s var(--ease),visibility .25s}
.sa__side.is-open{transform:none;visibility:visible}
.sa__side-head{display:flex;gap:8px;align-items:center}
.sa__history{flex:1;overflow:auto;display:flex;flex-direction:column;gap:2px}
.sa__hbtn{display:block;width:100%;min-height:44px;text-align:left;border:0;background:none;border-radius:14px;padding:0 14px;font:300 14px var(--font);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sa__hbtn:hover,.sa__hbtn[aria-current=true]{background:var(--cream)}
.sa__reset{min-height:44px;border:0;background:none;color:var(--muted);text-align:left;font:300 13px var(--font);text-decoration:underline}
.sa__main{display:flex;flex-direction:column;min-width:0;min-height:0}
.sa__bar{display:flex;align-items:center;gap:8px;padding:8px var(--gutter);border-bottom:1px solid var(--stone)}
.sa__bar-title{flex:1;display:flex;flex-direction:column;line-height:1.3;font-size:14px;min-width:0}
.sa__bar-title span{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sa__scroll{flex:1;overflow:auto;padding:24px var(--gutter)}
.sa__welcome{position:relative;display:flex;flex-direction:column;gap:14px;max-width:720px;margin:0 auto;padding:24px 0}
.sa__welcome[hidden]{display:none}
.sa__arc{right:-120px;top:-80px;width:220px;height:220px;border-width:30px;border-color:var(--stone)}
.sa__welcome>*:not(.arc){position:relative}
.sa__chips{display:flex;flex-wrap:wrap;gap:8px}
.sa__chips .pill{text-transform:none;letter-spacing:0;font-size:14px;white-space:normal;text-align:left;padding:8px 18px}
.sa__thread{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:24px}
.sa__msg{display:flex;flex-direction:column;gap:10px;animation:sa-in .22s var(--ease)}
@keyframes sa-in{from{opacity:0;transform:translateY(6px)}}
.sa__msg--user{align-items:flex-end}
.sa__bubble{max-width:88%;padding:12px 18px;border-radius:20px;background:var(--olive);color:var(--cream);font-size:15px}
.sa__msg--bot .sa__bubble{background:var(--white);color:var(--ink);box-shadow:var(--sh-1);max-width:100%}
.sa__who{font:500 12px var(--font);text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.sa__dots{display:inline-flex;gap:4px}
.sa__dots i{width:6px;height:6px;border-radius:50%;background:var(--olive);animation:sa-dot 1s infinite}
.sa__dots i:nth-child(2){animation-delay:.15s}.sa__dots i:nth-child(3){animation-delay:.3s}
@keyframes sa-dot{50%{opacity:.25}}
.sa__cards{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px}
.sa__cards::-webkit-scrollbar{display:none}
.sa__card{flex:0 0 170px;scroll-snap-align:start;display:flex;flex-direction:column;gap:6px;background:var(--white);border-radius:20px;padding:10px;box-shadow:var(--sh-1);font-size:13px}
.sa__card img{aspect-ratio:1/1;width:100%;object-fit:cover;border-radius:12px;background:var(--stone)}
.sa__card a.t{color:var(--ink);font-size:13px;line-height:18px;height:36px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.sa__card .btn{min-height:40px;padding:0 12px;font-size:13px}
.sa__form{display:flex;align-items:flex-end;gap:8px;margin:0 var(--gutter);padding:8px 8px 8px 20px;background:var(--stone);border-radius:28px;max-width:760px;width:calc(100% - var(--gutter)*2);align-self:center}
.sa__input{flex:1;border:0;background:none;resize:none;font:300 16px/1.5 var(--font);color:var(--ink);padding:10px 0;max-height:140px;outline:0}
.sa__form:focus-within{box-shadow:var(--glow)}
.sa__note{font-size:12px;text-align:center;padding:8px var(--gutter) 12px}
@media(min-width:990px){
  .sa{grid-template-columns:280px minmax(0,1fr);height:calc(100dvh - 170px)}
  .sa__side{position:static;transform:none;visibility:visible;width:auto;border-radius:0 var(--r-card) var(--r-card) 0}
  .sa__side-close,.sa__scrim,.sa__bar [data-open-history]{display:none!important}
  .sa__bar{display:none}
}
.sa__avatar{border-radius:50%;object-fit:cover;object-position:50% 20%;background:var(--stone)}
.sa__avatar--sm{width:40px;height:40px;flex:none}
.sa__avatar--xs{width:24px;height:24px;margin-right:8px;vertical-align:middle}
.sa__hero-img{width:140px;height:auto;margin-bottom:-6px}
.sa__who{display:flex;align-items:center}
