/* Only the iframe/compact surface changes; the standalone app keeps its layout. */
html[data-belle-embed-mode='inline'] #close-btn { display: none; }
html[data-belle-layout='compact'],
html[data-belle-layout='compact'] body { height: 100%; min-height: 0; overflow: hidden; }
html[data-belle-layout='compact'] body { padding: 0; background: #fff; }
html[data-belle-layout='compact'] .chat-container {
  position: relative;
  inset: auto;
  transform: none;
  width: 100%;
  height: 100%;
  max-height: none;
  border-radius: 0;
  box-shadow: none;
  transition: none;
}
html[data-belle-layout='compact'] .chat-header,
html[data-belle-layout='compact'] #chatBubble,
html[data-belle-layout='compact'] #betaModal { display: none; }
html[data-belle-layout='compact'] .messages-container {
  min-height: 0;
  padding: 16px 12px;
  overscroll-behavior: contain;
  scroll-padding-bottom: 12px;
}
html[data-belle-layout='compact'] .message { gap: 8px; margin-bottom: 16px; }
html[data-belle-layout='compact'] .message-avatar { width: 28px; height: 28px; font-size: 14px; }
html[data-belle-layout='compact'] .message-content { min-width: 0; max-width: calc(100% - 36px); padding: 12px; font-size: 15px; overflow-wrap: anywhere; }
html[data-belle-layout='compact'] .welcome-message .message-avatar { display: none; }
html[data-belle-layout='compact'] .welcome-message .message-content { max-width: 100%; width: 100%; padding: 4px; box-shadow: none; }
html[data-belle-layout='compact'] .belle-compact-questions { display: grid; gap: 8px; margin: 16px 0; }
html[data-belle-layout='compact'] .belle-compact-questions button {
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid #b7cdd2;
  border-radius: 8px;
  color: #004e60;
  background: #f4f8f9;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
html[data-belle-layout='compact'] .belle-compact-note { color: #535e63; font-size: 13px; }
html[data-belle-layout='compact'] .chat-input-container { flex-shrink: 0; padding: 10px 12px; }
html[data-belle-layout='compact'] .chat-input-wrapper {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 44px;
  align-items: end;
  gap: 4px;
  padding: 8px;
  border-radius: 16px;
}
html[data-belle-layout='compact'] .chat-input {
  min-height: 44px;
  max-height: max(44px, min(120px, 30vh));
  font-size: 16px;
  padding: 10px 4px;
}
html[data-belle-layout='compact'] .input-buttons-container { position: static; }
html[data-belle-layout='compact'] #tools-menu-btn { position: static; }
html[data-belle-layout='compact'] .send-button,
html[data-belle-layout='compact'] #tools-menu-btn { width: 44px; height: 44px; }
html[data-belle-layout='compact'] .send-button:not(.visible) { visibility: hidden; }
html[data-belle-layout='compact'] .tools-menu-dropdown { max-height: min(400px, 55vh); min-width: 0; width: min(280px, calc(100vw - 48px)); }
html[data-belle-layout='compact'] :focus-visible { outline: 3px solid #004e60; outline-offset: 2px; }
html[data-belle-layout='compact'] .chat-input:focus-visible { outline: none; }
html[data-belle-layout='compact'] .feedback-icon-btn { min-width: 44px; min-height: 44px; }
html[data-belle-layout='compact'] .feedback-inline { flex-wrap: wrap; }
html[data-belle-layout='compact'] .message-content pre { max-width: 100%; overflow-x: auto; }
html[data-belle-layout='compact'] .modal-content { max-height: 90%; overflow: auto; }
@media (max-height: 420px) {
  html[data-belle-layout='compact'] .chat-input-container { padding: 6px 10px; }
}
/* Keep reading and composing comfortable when the host panel is expanded. */
@media (min-width: 760px) {
  html[data-belle-layout='compact'] .messages-container,
  html[data-belle-layout='compact'] .chat-input-container {
    padding-left: calc((100% - 720px) / 2);
    padding-right: calc((100% - 720px) / 2);
  }
}