#bottomChatWindowHost {
  position: absolute;
  inset: 0;
  z-index: 800;
  pointer-events: none;
}

body.chat-layer-raised #bottomChatWindowHost { z-index: 1102; }
body.worldmap-overlay-open #bottomChatWindowHost { z-index: 800; }
body:has(.local-travel-view) #bottomChatWindowHost,
body:has(#worldMapOverlay.is-travel-mode:not(.hidden)) #bottomChatWindowHost { z-index: 900; }
body.chat-layer-raised:has(.local-travel-view) #bottomChatWindowHost,
body.chat-layer-raised:has(#worldMapOverlay.is-travel-mode:not(.hidden)) #bottomChatWindowHost { z-index: 1102; }
body:has(#bankOverlay:not(.hidden), .processing-workbench-window):not(:has(#settingsOverlay:not(.hidden), #worldMapOverlay:not(.hidden), #travelConfirmOverlay:not(.hidden))) #bottomChatWindowHost { z-index: 1250; }

#bottomChatWindowHost > .bottom-chat-panel {
  position: absolute;
  box-sizing: border-box;
  zoom: var(--ui-user-scale, 1);
  z-index: 1;
  pointer-events: auto;
}

/* The mobile portal fills the viewport; its child is anchored above the bar,
   rather than above the full-height portal's top edge. Mobile uses physical pixels. */
.bottom-bar-mobile-portal .bottom-chat-panel[data-chat-window-mode="mobile"],
body #worldMapOverlay.is-travel-mode > .bottom-bar-mobile-portal .bottom-chat-panel[data-chat-window-mode="mobile"] {
  position: absolute;
  left: 12px;
  right: 12px;
  top: auto;
  bottom: calc(var(--bottom-bar-clearance, 60px) + 12px);
  width: auto;
  height: min(400px, calc(100% - var(--bottom-bar-clearance, 60px) - var(--ui-topbar-height, 48px) - 24px));
  min-height: 0;
  max-height: min(440px, calc(100% - var(--bottom-bar-clearance, 60px) - var(--ui-topbar-height, 48px) - 24px));
  box-sizing: border-box;
  zoom: 1;
}

.bottom-chat-panel[data-chat-window-bound] {
  resize: none;
  min-height: 0;
  overflow: hidden;
}

.bottom-chat-panel[data-chat-window-bound] .bottom-chat-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 8px 12px;
  flex: 0 0 auto;
}

.bottom-chat-panel[data-chat-window-mode="floating"] .bottom-chat-header { cursor: move; touch-action: none; }
.bottom-chat-panel[data-chat-window-bound] .bottom-chat-header > :first-child { min-width: 0; }
.bottom-chat-panel[data-chat-window-bound] .bottom-chat-subtitle { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bottom-chat-panel[data-chat-window-bound] .bottom-chat-scope-switch { grid-column: 1 / -1; grid-row: 2; min-width: 0; }
.chat-window-controls { display: flex; grid-column: 2; grid-row: 1; align-items: center; gap: 4px; }

.bottom-chat-panel .chat-window-control {
  display: inline-grid;
  place-items: center;
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  padding: 4px;
  border: 1px solid transparent;
  border-radius: 4px;
  background: transparent;
  background-image: none;
  color: var(--mg-text-main, #ded1b4);
  box-shadow: none;
  cursor: pointer;
  transition: background-color .16s, border-color .16s, color .16s;
}

.bottom-chat-panel .chat-window-control:hover,
.bottom-chat-panel .chat-window-control:focus-visible {
  border-color: rgba(192, 148, 74, .35);
  background: rgba(192, 148, 74, .1);
  background-image: none;
  color: #f1d58e;
}
.chat-window-control svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }

.bottom-chat-panel[data-chat-window-bound] .bottom-chat-body,
.bottom-chat-panel[data-chat-window-bound].is-presence-view .bottom-chat-body { flex: 1 1 0; min-height: 0; }
.bottom-chat-panel[data-chat-window-bound] .bottom-chat-footer { flex: 0 0 auto; }
.bottom-chat-panel[data-chat-window-bound] .bottom-social-dm { flex: 1 1 0; height: 100%; min-height: 0; grid-template-rows: auto minmax(0, 1fr) auto; }
.bottom-chat-panel[data-chat-window-bound] .bottom-social-dm-messages { min-height: 0; overscroll-behavior: contain; }
.bottom-chat-panel[data-chat-window-bound].is-social-view:has(.bottom-social-dm) .bottom-chat-body { overflow: hidden; }
.bottom-chat-panel.is-chat-window-dragging { user-select: none; }

.chat-window-resize { position: absolute; z-index: 6; touch-action: none; }
.chat-window-resize-n, .chat-window-resize-s { left: 10px; right: 10px; height: 7px; cursor: ns-resize; }
.chat-window-resize-n { top: 0; }
.chat-window-resize-s { bottom: 0; }
.chat-window-resize-e, .chat-window-resize-w { top: 10px; bottom: 10px; width: 7px; cursor: ew-resize; }
.chat-window-resize-e { right: 0; }
.chat-window-resize-w { left: 0; }
.chat-window-resize-ne, .chat-window-resize-nw, .chat-window-resize-se, .chat-window-resize-sw { width: 12px; height: 12px; }
.chat-window-resize-ne { top: 0; right: 0; cursor: nesw-resize; }
.chat-window-resize-nw { top: 0; left: 0; cursor: nwse-resize; }
.chat-window-resize-se { bottom: 0; right: 0; cursor: nwse-resize; }
.chat-window-resize-sw { bottom: 0; left: 0; cursor: nesw-resize; }
.bottom-chat-panel[data-chat-window-mode="docked"] .chat-window-resize:not(.chat-window-resize-n),
.bottom-chat-panel[data-chat-window-mode="mobile"] .chat-window-resize,
.bottom-chat-panel[data-chat-window-mode="mobile"] [data-chat-window-action="toggle"],
.bottom-chat-panel[data-chat-window-mode="mobile"] [data-chat-window-action="reset"] { display: none; }