.help-launcher, .help-panel { font-family: Inter, system-ui, sans-serif; }
.help-launcher {
  position: fixed; right: 20px; bottom: 20px; z-index: 80;
  height: 52px; padding: 0 18px; border: 0; border-radius: 999px;
  background: #0E6B62; color: #F0FDFA; font-weight: 700; font-size: 15px; cursor: pointer;
  box-shadow: 0 12px 30px rgba(14,107,98,.35);
}
.help-panel {
  position: fixed; right: 20px; bottom: 84px; z-index: 80; width: min(380px, calc(100vw - 24px));
  height: min(520px, calc(100vh - 120px)); background: #fff; color: #0F172A;
  border-radius: 18px; box-shadow: 0 24px 60px rgba(15,23,42,.28); display: flex; flex-direction: column; overflow: hidden;
  border: 1px solid #E2E8F0;
}
.help-panel[hidden] { display: none !important; }
.help-panel header { background: #06141E; color: #F8FAFC; padding: 14px 16px; display: flex; justify-content: space-between; align-items: center; }
.help-panel header strong { display: block; }
.help-panel header span { font-size: 12px; color: #99f6e4; }
.help-panel header button { background: transparent; color: #fff; border: 0; font-size: 20px; cursor: pointer; }
.help-log { flex: 1; overflow: auto; padding: 14px; display: flex; flex-direction: column; gap: 8px; background: #F8FAFC; }
.help-log .bubble { max-width: 90%; padding: 10px 12px; border-radius: 12px; font-size: 14px; line-height: 1.45; white-space: pre-wrap; }
.help-log .me { align-self: flex-end; background: #0E6B62; color: #F0FDFA; }
.help-log .bot { align-self: flex-start; background: #fff; border: 1px solid #E2E8F0; }
.help-form { display: flex; gap: 8px; padding: 10px; border-top: 1px solid #E2E8F0; }
.help-form input { flex: 1; border: 1px solid #E2E8F0; border-radius: 999px; padding: 10px 12px; font: inherit; }
.help-form button, .help-foot a { background: #14C4B0; color: #042F2E; border: 0; border-radius: 999px; padding: 8px 12px; font-weight: 700; cursor: pointer; text-decoration: none; font-size: 13px; }
.help-foot { padding: 0 12px 10px; font-size: 12px; color: #64748B; display: flex; justify-content: space-between; align-items: center; }
@media (max-width: 640px) {
  .help-panel { right: 12px; left: 12px; width: auto; bottom: 76px; }
  .help-launcher { right: 12px; bottom: 12px; }
}
