:root{
  --as-btn-bottom: 22px;
  --as-win-bottom: 90px;
  /* сюда будет писать скрипт фактическое перекрытие снизу (клавиатура и т.п.) */
  --as-occluded-bottom: 0px;
}

/* Кнопка */
.as-btn{
  position:fixed; right:22px;
  bottom: calc(22px + env(safe-area-inset-bottom));
  border:none; padding:15px 18px; border-radius:999px;
  box-shadow:0 8px 22px rgba(0,0,0,.16);
  cursor:pointer; background:#111; color:#fff;
  font:600 17px ui-sans-serif,system-ui;
  line-height:1; letter-spacing:.2px; z-index:999999;
}

/* Окно */
.as-win {
  position: fixed;
  right: 20px;
    bottom: calc(90px + env(safe-area-inset-bottom));
  width: 340px;
  max-height: 60vh;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 12px 28px rgba(0,0,0,.2);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  font-family: ui-sans-serif,system-ui;
  z-index: 999998;
}
.as-h{padding:12px 14px;font-weight:600;border-bottom:1px solid #eee}
.as-m{flex:1;overflow:auto;padding:12px;display:flex;flex-direction:column;gap:8px;background:#fafafa}
.as-b,.as-u{max-width:80%;padding:8px 10px;border-radius:12px;line-height:1.38;white-space:normal;word-wrap:break-word;word-break:break-word}
.as-b{background:#f5f5f7;align-self:flex-start}
.as-u{background:#e7f0ff;align-self:flex-end;white-space:pre-wrap}
.as-bar{display:flex;gap:8px;border-top:1px solid #eee;padding:10px;background:#fff}
.as-in{flex:1;padding:10px;border:1px solid #ddd;border-radius:10px;font-size:16px;-webkit-text-size-adjust:100%}
.as-send{padding:10px 12px;border:0;border-radius:10px;background:#111;color:#fff;cursor:pointer}
.as-disabled{opacity:.6;pointer-events:none}
.as-note{font-size:12px;color:#666;padding:0 12px 8px}

/* Компактный Markdown в .as-b */
.as-b h1,.as-b h2,.as-b h3,.as-b h4,.as-b h5,.as-b h6{margin:6px 0 4px; line-height:1.25}
.as-b h1{font-size:16px} .as-b h2{font-size:15px} .as-b h3{font-size:14px}
.as-b p{margin:6px 0}
.as-b ul,.as-b ol{margin:6px 0 6px 16px; padding:0}
.as-b li{margin:2px 0}
.as-b blockquote{margin:6px 0; padding:6px 8px; border-left:3px solid #ddd; background:#fff; border-radius:8px}
.as-b code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;padding:0 3px;background:#fff;border:1px solid #eee;border-radius:4px}
.as-b pre{margin:6px 0; padding:8px; background:#111; color:#fff; border-radius:10px; overflow:auto;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12px}
.as-b pre code{border:0; background:transparent; color:inherit; padding:0}
.as-b a{color:#0a58ca; text-decoration:underline}
@media (max-width: 600px) {
  .as-win {
    left: 0;
    right: 0;
    width: 100%;
    border-radius: 0;
    max-height: 70vh; /* можно увеличить */
  }
}