.support-launcher {
  position: fixed;
  right: max(18px, env(safe-area-inset-right));
  bottom: max(18px, env(safe-area-inset-bottom));
  z-index: 8;
  border-radius: 999px;
  padding: 12px 18px;
  box-shadow: 0 8px 28px #18263a35;
}
.support-count {
  display: inline-grid;
  place-items: center;
  min-width: 21px;
  min-height: 21px;
  padding: 0 5px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  background: #fff;
  color: #ab1123;
}
.sidebar .support-count { margin-left: auto; }
.support-widget-panel {
  position: fixed;
  right: max(18px, env(safe-area-inset-right));
  bottom: calc(max(18px, env(safe-area-inset-bottom)) + 60px);
  z-index: 8;
  display: flex;
  flex-direction: column;
  width: min(395px, calc(100% - 36px));
  height: min(540px, calc(100dvh - 96px));
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: white;
  box-shadow: 0 16px 50px #18263a36;
}
.support-widget-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  background: #142a45;
  color: white;
  padding: 15px 16px;
}
.support-widget-top h2 { font-size: 19px; }
.support-widget-top p { margin: 4px 0 0; color: #d7e7f8; font-size: 12px; }
.support-widget-top .btn { color: white; padding: 6px; min-height: 30px; }
.support-widget-thread, .support-inbox-thread {
  display: flex;
  flex: 1;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
}
.support-thread-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid var(--line);
  padding: 13px 16px;
}
.support-thread-head h2 { font-size: 18px; overflow-wrap: anywhere; }
.support-thread-head p { margin: 3px 0 0; color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.support-thread-head .btn { flex: none; }
.support-history {
  flex: 1;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 14px;
  background: #f5f8fc;
}
.support-log { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.support-message {
  max-width: min(90%, 610px);
  padding: 9px 12px;
  border: 1px solid #e0e8f2;
  border-radius: 12px 12px 12px 3px;
  background: white;
  overflow-wrap: anywhere;
}
.support-message.is-own {
  align-self: flex-end;
  border-radius: 12px 12px 3px 12px;
  border-color: #dce8f7;
  background: #e8f1fc;
}
.support-message-meta { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; font-size: 11px; color: #40536e; }
.support-message p { margin: 4px 0 0; white-space: pre-wrap; }
.support-booking-label { display: inline-block; margin-top: 5px; padding: 2px 6px; border-radius: 5px; background: #f0f4f9; font-size: 11px; font-weight: 750; }
.support-empty { color: var(--muted); margin: 10px 0; font-size: 13px; }
.support-error { color: #a81726; background: #fff0f1; margin: 0; padding: 7px 13px; font-size: 13px; }
.support-compose { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 10px; align-items: end; padding: 12px; border-top: 1px solid var(--line); }
.support-compose label { display: grid; gap: 4px; min-width: 0; font-size: 12px; font-weight: 750; }
.support-compose .support-booking-picker { grid-column: 1 / -1; }
.support-compose textarea, .support-compose select {
  width: 100%;
  min-width: 0;
  font: inherit;
  font-size: 16px;
  padding: 7px 9px;
  border: 1px solid #cbd6e4;
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
}
.support-compose select { font-size: 13px; }
.support-compose textarea { resize: vertical; max-height: 130px; }
.support-compose .btn { min-height: 39px; }
.support-inbox.panel {
  padding: 0;
  display: grid;
  grid-template-columns: minmax(190px, 285px) minmax(0, 1fr);
  min-height: 460px;
  height: min(650px, 76dvh);
  overflow: hidden;
}
.support-inbox-list { overflow: auto; border-right: 1px solid var(--line); }
.support-inbox-title { padding: 14px 16px; border-bottom: 1px solid var(--line); }
.support-inbox-title h2 { margin-bottom: 3px; font-size: 18px; }
.support-inbox-list .support-empty { padding: 0 16px; }
.support-inbox-row {
  display: grid;
  width: 100%;
  gap: 4px;
  text-align: left;
  padding: 12px 16px;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: #fff;
  color: var(--ink);
}
.support-inbox-row:hover, .support-inbox-row[aria-pressed="true"] { background: #eef5fd; }
.support-inbox-row > span:first-child { display: flex; align-items: center; gap: 9px; min-width: 0; }
.support-inbox-row strong, .support-inbox-row small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.support-inbox-row small, .support-row-date { color: var(--muted); font-size: 12px; }
.support-unread-dot { width: 8px; height: 8px; flex: none; background: var(--red); border-radius: 50%; }
.support-older { margin: 8px 0 10px; }
.support-inbox-list .support-older { margin-left: 12px; }
.support-thread-back { display: none; }

@media (max-width: 690px) {
  .support-inbox.panel { grid-template-columns: minmax(0, 1fr); height: min(590px, 76dvh); }
  .support-inbox-list { border-right: 0; }
  .support-inbox:not(.has-selected-thread) .support-inbox-thread,
  .support-inbox.has-selected-thread .support-inbox-list { display: none; }
  .support-inbox .support-thread-head { flex-wrap: wrap; }
  .support-thread-back { display: inline-flex; flex-basis: max-content; }
}
@media (max-width: 460px) {
  .support-launcher { right: 12px; bottom: max(12px, env(safe-area-inset-bottom)); }
  .support-widget-panel { right: 12px; width: calc(100% - 24px); bottom: calc(max(12px, env(safe-area-inset-bottom)) + 54px); }
  .support-message { max-width: 95%; }
}