.zib-chat {
  position: relative;
  border: 1px solid #e5e5e5;
  padding: 16px;
  border-radius: 10px;
  background: #f5f5f5;
}

body.zib-chat-standalone {
  margin: 0;
  padding: 0;
  min-height: 0;
  background: #f5f5f5;
  display: flex;
  flex-direction: column;
  height: 100vh;
}

body.zib-chat-standalone .zib-chat {
  margin: 0;
  border-radius: 0;
  min-height: 0;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}

body.zib-chat-standalone .zib-chat-messages {
  flex: 1 1 auto;
  height: auto;
  min-height: 0;
}

.zib-chat [hidden] {
  display: none !important;
}

.zib-chat-header {
  position: relative;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 12px;
}

.zib-chat-title {
  margin: 0;
  font-size: 18px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.zib-chat-title-pill {
  position: relative;
  display: inline-flex;
  align-items: center;
  transform: translateY(-3px);
}

.zib-chat-online-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 14px;
  border-radius: 999px;
  font-size: 13px;
  border: 1px solid rgba(255, 255, 255, 0.35);
  background: linear-gradient(135deg, #7b5cff, #34d5ff);
  color: #fff;
  cursor: pointer;
  box-shadow: 0 10px 22px rgba(64, 114, 255, 0.35), inset 0 0 0 1px rgba(255, 255, 255, 0.25);
}

.zib-chat-online-btn:focus {
  outline: none;
}

.zib-chat-online-btn.is-open {
  box-shadow: 0 12px 24px rgba(64, 114, 255, 0.45), inset 0 0 0 1px rgba(255, 255, 255, 0.3);
}

.zib-chat-title-text {
  display: inline-flex;
  align-items: center;
  font-weight: 600;
}

.zib-chat-online-count {
  font-size: 13px;
  font-weight: 600;
  color: inherit;
}

.zib-chat-online-caret {
  font-size: 12px;
  opacity: 0.85;
  margin-left: 2px;
}

.zib-chat-online-dropdown {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  min-width: 180px;
  max-width: 260px;
  background: #fff;
  border-radius: 12px;
  padding: 10px;
  border: 1px solid #e6e6e6;
  box-shadow: 0 18px 36px rgba(30, 40, 60, 0.18);
  z-index: 80;
}

.zib-chat-online-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 12px;
  color: #666;
  margin-bottom: 8px;
}

.zib-chat-online-tools {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.zib-chat-online-search-btn {
  border: none;
  border-radius: 999px;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  cursor: pointer;
  background: rgba(255, 255, 255, 0.65);
  color: #2a2a2a;
}

.zib-chat-online-settings-btn {
  border: none;
  border-radius: 999px;
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  background: rgba(255, 255, 255, 0.65);
  padding: 0;
}

.zib-chat-online-settings-icon {
  width: 18px;
  height: 18px;
  display: block;
}

.zib-chat-online-settings {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(8, 12, 20, 0.55);
  z-index: 120;
}

.zib-chat-online-settings[hidden] {
  display: none;
}

.zib-chat-online-settings-panel {
  position: relative;
  width: min(320px, calc(100% - 40px));
  background: #fff;
  border-radius: 14px;
  padding: 18px 16px 16px;
  box-shadow: 0 24px 48px rgba(30, 40, 60, 0.28);
}

.zib-chat-online-settings-close {
  position: absolute;
  top: 8px;
  right: 10px;
  border: none;
  background: transparent;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  color: #666;
}

.zib-chat-online-settings-title {
  font-size: 14px;
  font-weight: 700;
  color: #2a2a2a;
  margin-bottom: 12px;
  padding-right: 24px;
}

.zib-chat-online-settings-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.zib-chat-online-settings-section {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed #e6e6e6;
}

.zib-chat-online-settings-label {
  font-size: 12px;
  font-weight: 600;
  color: #444;
  margin-bottom: 8px;
}

.zib-chat-online-settings-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.zib-chat-access-type,
.zib-chat-access-value {
  border: 1px solid #e3e3e3;
  border-radius: 8px;
  padding: 4px 8px;
  font-size: 12px;
  background: #fff;
}

.zib-chat-access-value {
  width: 100px;
}

.zib-chat-access-save {
  border: none;
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 12px;
  cursor: pointer;
  background: #f2f2f2;
  color: #444;
}

.zib-chat-access-tip {
  margin-top: 6px;
  font-size: 12px;
  color: #666;
  min-height: 18px;
}

.zib-chat-tool-permissions {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.zib-chat-tool-perm {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.zib-chat-tool-label {
  min-width: 42px;
  font-size: 12px;
  color: #444;
}

.zib-chat-tool-type,
.zib-chat-tool-value {
  border: 1px solid #e3e3e3;
  border-radius: 8px;
  padding: 4px 8px;
  font-size: 12px;
  background: #fff;
}

.zib-chat-tool-value {
  width: 120px;
}

.zib-chat-tool-perm-actions {
  margin-top: 6px;
}

.zib-chat-tool-perm-save {
  border: none;
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 12px;
  cursor: pointer;
  background: #f2f2f2;
  color: #444;
}

.zib-chat-tool-perm-tip {
  margin-top: 6px;
  font-size: 12px;
  color: #666;
  min-height: 18px;
}

.zib-chat-online-settings-actions .zib-chat-online-search-btn {
  width: auto;
  height: 30px;
  padding: 0 12px;
  font-size: 12px;
}

.zib-chat-online-settings-actions .zib-chat-mute-all-btn,
.zib-chat-online-settings-actions .zib-chat-stealth-btn {
  height: 30px;
}

.zib-chat-online-search {
  margin-bottom: 8px;
}

.zib-chat-online-search-input {
  width: 100%;
  border: 1px solid #e6e6e6;
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 12px;
  background: #fff;
}

.zib-chat-online-title {
  font-size: 12px;
  font-weight: 600;
}

.zib-chat-stealth-btn {
  border: none;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 12px;
  cursor: pointer;
  background: rgba(255, 255, 255, 0.65);
  color: #2a2a2a;
}

.zib-chat-mute-all-btn {
  border: none;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 12px;
  cursor: pointer;
  background: rgba(255, 255, 255, 0.65);
  color: #2a2a2a;
}

.zib-chat-stealth-btn.is-on {
  background: #ffe9cc;
  color: #d45722;
}

.zib-chat-mute-all-btn.is-on {
  background: #ffe3e6;
  color: #c9302c;
}

.zib-chat-online-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 240px;
  overflow-y: auto;
}

.zib-chat-online-section {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.zib-chat-online-label {
  font-size: 12px;
  color: #6b7280;
  padding: 4px 2px;
}

.zib-chat-online-divider {
  font-size: 12px;
  color: #8b93a1;
  padding: 2px 2px;
  border-top: 1px dashed rgba(148, 163, 184, 0.5);
}

.zib-chat-online-item {
  padding: 8px 10px;
  border-radius: 8px;
  background: #f3f6ff;
  color: #2a2a2a;
  font-size: 13px;
  font-weight: 600;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.zib-chat-online-item.is-offline {
  background: #f7f7f9;
  color: #333;
}

.zib-chat-online-name {
  font-size: 13px;
  font-weight: 700;
}

.zib-chat-online-time {
  font-size: 12px;
  color: #6b7280;
}

.zib-chat-online-ban-info {
  font-size: 12px;
  color: #d45722;
}

.zib-chat-online-actions {
  display: flex;
  gap: 6px;
}

.zib-chat-online-actions button {
  border: none;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 12px;
  cursor: pointer;
}

.zib-chat-online-ban {
  background: #ffe2d7;
  color: #d45722;
}

.zib-chat-online-unban {
  background: #e3f2ff;
  color: #2c63d9;
}

.zib-chat-online-manager-set {
  background: #e8f4ff;
  color: #2f6fda;
}

.zib-chat-online-manager-unset {
  background: #f5e9ff;
  color: #7a38c4;
}

.zib-chat-online-empty {
  padding: 10px 8px;
  text-align: center;
  font-size: 12px;
  color: #888;
}

.zib-chat-messages-empty {
  padding: 32px 8px 18px;
  text-align: center;
  font-size: 13px;
  color: #8a8a8a;
}

.zib-chat-header-status {
  display: flex;
  align-items: center;
  gap: 8px;
}

.zib-chat-mute-count {
  border: none;
  background: #fff3f0;
  color: #ff6b4a;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  cursor: pointer;
}

.zib-chat-announce-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: none;
  background: #e9f2ff;
  color: #2c63d9;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  cursor: pointer;
}

.zib-chat-notify-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: none;
  background: #f3f0ff;
  color: #6c4bd9;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  cursor: pointer;
}

.zib-chat-share-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: none;
  background: #e8f6ff;
  color: #2d7fd9;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  cursor: pointer;
}

.zib-chat-messages {
  position: relative;
  z-index: 1;
  border: 1px solid #e6e6e6;
  padding: 12px;
  height: 410px;
  overflow-y: auto;
  background: #f0f0f0;
  border-radius: 8px;
}

.zib-chat-messages.is-disabled {
  background: #f7f7f7;
  opacity: 0.7;
}

.zib-chat-message {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 10px 0;
}

.zib-chat-message.is-self {
  flex-direction: row-reverse;
}

.zib-chat-avatar {
  width: 36px;
  flex: 0 0 36px;
}

.zib-chat-avatar-img {
  border-radius: 6px;
  width: 36px;
  height: 36px;
}

.zib-chat-bubble {
  max-width: 70%;
  background: #ffffff;
  border-radius: 8px;
  padding: 6px 10px 8px;
  position: relative;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.zib-chat-message .zib-chat-bubble::before {
  content: '';
  position: absolute;
  left: -6px;
  top: 12px;
  width: 0;
  height: 0;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-right: 6px solid #ffffff;
}

.zib-chat-message.is-self .zib-chat-bubble {
  background: #95ec69;
}

.zib-chat-message.is-retracted .zib-chat-content {
  color: #888;
  font-style: italic;
}

.zib-chat-retracted-note {
  margin-top: 6px;
  font-size: 12px;
  color: #c0392b;
  font-weight: 600;
}

.zib-chat-retracted-content {
  margin-top: 4px;
  padding: 6px 8px;
  border-radius: 6px;
  background: #fff5f5;
  border: 1px solid #f5c6cb;
  color: #c0392b;
  font-size: 13px;
  line-height: 1.5;
}

.zib-chat-system {
  justify-content: center;
  text-align: center;
  margin: 8px 0;
}

.zib-chat-system .zib-chat-system-text {
  display: inline-block;
  background: #f4f4f4;
  border-radius: 999px;
  padding: 4px 10px;
  color: #888;
  font-size: 12px;
}

.zib-chat-message.is-self .zib-chat-bubble::before {
  left: auto;
  right: -6px;
  border-right-color: transparent;
  border-left: 6px solid #95ec69;
}

.zib-chat-meta {
  font-size: 12px;
  color: #8a8a8a;
  display: flex;
  gap: 1px;
  align-items: center;
  justify-content: flex-start;
}

.zib-chat-meta .zib-chat-role {
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 999px;
  margin-right: 1px;
  font-weight: 600;
  background: #eef2f7;
  color: #506175;
  border: 1px solid #dde5ef;
}

.zib-chat-meta .zib-chat-role.is-admin {
  background: #ffe8d1;
  color: #8a4b12;
  border-color: #ffd7b2;
}

.zib-chat-meta .zib-chat-role.is-owner {
  background: #e9f3ff;
  color: #1c5c9e;
  border-color: #cfe2ff;
}

.zib-chat-meta .zib-chat-role.is-manager {
  background: #f4f0ff;
  color: #5b33b8;
  border-color: #e1d7ff;
}

.zib-chat-meta .zib-chat-role.is-user {
  background: #eef2f7;
  color: #506175;
  border-color: #dde5ef;
}

.zib-chat-meta .zib-chat-name-pill {
  font-size: 12px;
  padding: 2px 8px;
  border-radius: 999px;
  background: #f6f7fb;
  color: #2e3a46;
  border: 1px solid #e3e7ef;
  margin-right: 0;
}

.zib-chat-user-pills {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-right: auto;
}

.zib-chat-location-pill {
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 999px;
  background: #f3f5f9;
  color: #60707f;
  border: 1px solid #e1e6ee;
}

.zib-chat-time {
  font-size: 11px;
  padding: 2px 6px;
  border-radius: 999px;
  background: #f2f4f8;
  color: #6c7a89;
  border: 1px solid #e2e7ef;
  margin-left: auto;
}

.zib-chat-message.is-self .zib-chat-meta {
  justify-content: flex-end;
}

.zib-chat-content {
  font-size: 14px;
  line-height: 1.6;
  color: #222;
  word-break: break-word;
}

.zib-chat-content .smilie-icon {
  display: inline-block;
  vertical-align: middle;
  max-width: 32px;
  max-height: 32px;
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
}

.zib-chat-content img.smilie-icon {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.zib-chat-smilie-img {
  width: 32px;
  height: 32px;
  object-fit: contain;
  display: block;
}

.zib-chat-quote {
  background: #f6f6f6;
  border-left: 3px solid #d0d0d0;
  padding: 6px 8px;
  border-radius: 6px;
  margin-bottom: 6px;
  font-size: 12px;
  color: #666;
}

.zib-chat-quote-name {
  font-weight: 600;
  margin-bottom: 4px;
  color: #555;
}

.zib-chat-quote-content {
  color: #666;
  line-height: 1.5;
}

.zib-chat-quote[data-quote-id] {
  cursor: pointer;
}

.zib-chat-quote[data-quote-id]:hover {
  background: #f0f0f0;
}

.zib-chat-footer {
  margin-top: 12px;
  text-align: center;
  font-size: 12px;
  color: #888;
}

.zib-chat-brand-text {
  margin-right: 6px;
}

.zib-chat-brand-link {
  margin-left: 6px;
  color: #ff5a5f;
  text-decoration: none;
}

.zib-chat-brand-link:hover {
  text-decoration: underline;
}

.zib-chat-mention-tag {
  color: #d9534f;
  font-weight: 600;
}

.zib-chat-form {
  margin-top: 12px;
  background: #fff;
  border-radius: 10px;
  padding: 6px 8px;
  border: 1px solid #e5e5e5;
}

.zib-chat-form.is-hidden {
  display: none;
}

.zib-chat-form.is-disabled {
  opacity: 0.6;
  pointer-events: none;
}

.zib-chat-muted {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 12px 0;
  padding: 12px 14px;
  border-radius: 10px;
  background: #fff5f5;
  border: 1px solid #f5c6cb;
  color: #c0392b;
}

.zib-chat-muted-icon {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #ff5a5f;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
}

.zib-chat-muted-title {
  font-weight: 700;
  margin-bottom: 4px;
}

.zib-chat-muted-desc {
  font-size: 13px;
  color: #8a2d2d;
}

.zib-chat-banned {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 12px 0;
  padding: 12px 14px;
  border-radius: 10px;
  background: #fff1e6;
  border: 1px solid #f2c5a3;
  color: #c15f2a;
}

.zib-chat-banned-desc {
  font-size: 13px;
  color: #9c5227;
}
.zib-chat-form textarea {
  width: 100%;
  resize: vertical;
  border: none;
  outline: none;
  background: transparent;
  padding: 4px 0;
  line-height: 1.4;
  height: 50px;
}

.zib-chat-uploads {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 8px;
}

.zib-chat-upload-item {
  position: relative;
  width: 88px;
  border-radius: 8px;
  background: #fff;
  border: 1px solid #e5e5e5;
  padding: 6px;
}

.zib-chat-upload-thumb {
  width: 100%;
  height: 70px;
  border-radius: 6px;
  overflow: hidden;
  background: #f5f5f5;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.zib-chat-upload-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.zib-chat-upload-thumb.is-video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.zib-chat-upload-video-icon {
  position: absolute;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
}

.zib-chat-upload-video-icon::before {
  content: '';
  border-left: 8px solid #fff;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  margin-left: 2px;
}

.zib-chat-upload-status {
  margin-top: 4px;
  font-size: 11px;
  color: #888;
  text-align: center;
}

.zib-chat-upload-item.is-error .zib-chat-upload-status {
  color: #d93025;
}

.zib-chat-upload-remove {
  position: absolute;
  top: -8px;
  right: -8px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: none;
  background: #ff5a5f;
  color: #fff;
  cursor: pointer;
  font-size: 12px;
  line-height: 20px;
}

.zib-chat-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 6px;
  justify-content: space-between;
}

.zib-chat-status-wrap {
  margin-top: 8px;
  display: flex;
  justify-content: center;
}

.zib-chat-actions-right {
  display: flex;
  align-items: center;
  gap: 12px;
}

.zib-chat-actions-right .zib-chat-tool-icon {
  width: 20px;
  height: 20px;
  object-fit: contain;
  display: inline-block;
}

.zib-chat-actions-right button {
  line-height: 1;
  justify-content: center;
}

.zib-chat-tools {
  display: flex;
  align-items: center;
  position: relative;
}

.zib-chat-form .dropup {
  position: relative;
}

.zib-chat-form .dropdown-menu {
  position: absolute;
  bottom: 100%;
  left: 0;
  margin-bottom: 8px;
  display: none;
  z-index: 30;
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  padding: 6px;
}

.dark-theme .zib-chat-form .dropdown-menu {
  background: #1c2128;
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.45);
}

.zib-chat-form .open > .dropdown-menu {
  display: block;
}

.zib-chat-form .dropdown-smilie {
  overflow-y: auto;
  max-height: 260px;
}

.dark-theme .zib-chat-form .dropdown-smilie {
  background: transparent;
}

.dark-theme .zib-chat-form .dropdown-smilie a,
.dark-theme .zib-chat-form .dropdown-smilie button {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

.dark-theme .zib-chat-form .dropdown-smilie img,
.dark-theme .zib-chat-form .dropdown-smilie .smilie-icon {
  background: transparent;
  border: none;
  box-shadow: none;
}

.dark-theme .zib-chat-form .dropdown-smilie .smilie-icon {
  background: #1c2128 !important;
  border: 1px solid transparent !important;
  border-radius: 6px;
  overflow: hidden;
  line-height: 0;
}

.dark-theme .zib-chat-form .dropdown-smilie .smilie-icon img {
  display: block;
  background: transparent !important;
  transform: scale(1.08);
  transform-origin: center;
  filter: brightness(0.98) contrast(1.12) saturate(1.05);
}

.zib-chat-actions button {
  background: #07c160;
  border: none;
  color: #fff;
  padding: 6px 16px;
  border-radius: 6px;
  cursor: pointer;
}

.zib-chat-send-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex-direction: row;
  min-height: 32px;
  justify-content: center;
}

.zib-chat-send-btn img,
.zib-chat-send-btn span {
  display: inline-block;
}

.zib-chat-actions .zib-chat-voice-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: #fff;
  color: #2e3a46;
  border: 1px solid #e3e7ef;
  padding: 6px 16px;
  min-height: 32px;
}

.zib-chat-actions .zib-chat-send-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: #fff;
  color: #2e3a46;
  border: 1px solid #e3e7ef;
  padding: 6px 16px;
  min-height: 32px;
}

.zib-chat-actions .zib-chat-send-btn:hover {
  background: #f4f7fb;
}

.zib-chat-sound-tip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 12px;
  margin-bottom: 10px;
  border-radius: 10px;
  background: #eef6ff;
  border: 1px solid rgba(56, 126, 255, 0.2);
  color: #1f2a37;
  font-size: 13px;
}

.zib-chat-sound-tip-icon {
  margin-left: auto;
  font-size: 14px;
  display: none;
}

.zib-chat-sound-tip.is-collapsed {
  cursor: pointer;
}

.zib-chat-sound-tip.is-collapsed .zib-chat-sound-tip-actions {
  display: none;
}

.zib-chat-sound-tip.is-collapsed .zib-chat-sound-tip-icon {
  display: inline-flex;
}

.zib-chat-sound-tip-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.zib-chat-sound-tip-allow,
.zib-chat-sound-tip-ignore {
  border: none;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 12px;
  cursor: pointer;
}

.zib-chat-sound-tip-allow {
  background: #2c7be5;
  color: #fff;
}

.zib-chat-sound-tip-ignore {
  background: #e2e8f0;
  color: #2e3a46;
}

.zib-chat-actions-right button.is-disabled,
.zib-chat-actions-right button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.zib-chat-form textarea:disabled {
  background: #f4f6fa;
  color: #9aa3af;
}

.zib-chat-actions .zib-chat-voice-btn:hover {
  background: #f4f7fb;
}

.zib-chat-meeting-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}


.zib-chat-meeting-bar {
  border: 1px solid #e6e6e6;
  border-radius: 12px;
  padding: 10px 12px;
  margin-bottom: 10px;
  background: linear-gradient(135deg, #f7fbff 0%, #fff8f0 100%);
}

.zib-chat-meeting-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.zib-chat-meeting-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.zib-chat-meeting-title {
  font-size: 14px;
  font-weight: 600;
  color: #1f2a37;
}

.zib-chat-meeting-sub {
  font-size: 12px;
  color: #6b7280;
}

.zib-chat-meeting-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  row-gap: 6px;
}

.zib-chat-meeting-actions button {
  border: none;
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 12px;
  cursor: pointer;
  background: #eef2f7;
  color: #1f2a37;
}

.zib-chat-meeting-actions .zib-chat-meeting-end {
  background: #ffecec;
  color: #b91c1c;
}

.zib-chat-meeting-actions button.is-disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.zib-chat-meeting-volume {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: #4b5563;
  padding: 2px 6px;
  background: #f8fafc;
  border-radius: 8px;
  white-space: nowrap;
}

.zib-chat-meeting-volume-range {
  width: 70px;
}

.zib-chat-meeting-volume-value {
  min-width: 36px;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.zib-chat-meeting-users {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
  max-height: 140px;
  overflow: auto;
}

.zib-chat-meeting-user {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  border-radius: 10px;
  border: 1px solid #e5e7eb;
  background: #fff;
  font-size: 12px;
  color: #1f2a37;
}

.zib-chat-meeting-user.is-self {
  border-color: #c5e1ff;
  background: #eef6ff;
}

.zib-chat-meeting-user.is-blocked {
  border-color: #f6c8c8;
  background: #fff5f5;
}

.zib-chat-meeting-user.is-muted {
  opacity: 0.75;
}

.zib-chat-meeting-user-name {
  font-weight: 600;
  color: #1f2a37;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.zib-chat-meeting-mic-meter {
  display: inline-flex;
  align-items: flex-end;
  gap: 2px;
  height: 12px;
}

.zib-chat-meeting-mic-meter span {
  display: block;
  width: 2px;
  height: 4px;
  background: #9ca3af;
  border-radius: 2px;
  transition: height 0.15s ease, background 0.15s ease;
}

.zib-chat-meeting-mic-meter.is-speaking span {
  background: #22c55e;
}

.zib-chat-meeting-mic-meter.is-muted span {
  background: #9ca3af;
  height: 4px;
}

.zib-chat-meeting-user-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #6b7280;
}

.zib-chat-meeting-user-host {
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 6px;
  background: #e0f2fe;
  color: #0369a1;
}

.zib-chat-meeting-user-block {
  border: none;
  background: #fef3c7;
  color: #92400e;
  border-radius: 8px;
  padding: 4px 8px;
  cursor: pointer;
  font-size: 11px;
}

.zib-chat-meeting-user-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

.zib-chat-meeting-user-kick {
  border: none;
  background: #fee2e2;
  color: #b91c1c;
  border-radius: 8px;
  padding: 4px 8px;
  cursor: pointer;
  font-size: 11px;
}

.zib-chat-meeting-user-block:disabled,
.zib-chat-meeting-user-kick:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.zib-chat-meeting-modal .zib-chat-meeting-dialog {
  width: 480px;
  max-width: 92%;
  margin: 60px auto;
  position: relative;
  z-index: 1;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15);
}

.zib-chat-meeting-modal .zib-chat-modal-head {
  position: relative;
  justify-content: center;
  padding: 10px 36px;
  margin-bottom: 0;
}

.zib-chat-meeting-modal .zib-chat-modal-title {
  text-align: center;
  flex: 1;
}

.zib-chat-meeting-modal .zib-chat-modal-close {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
}

.zib-chat-meeting-body {
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.zib-chat-meeting-create {
  display: flex;
  gap: 8px;
  align-items: center;
}

.zib-chat-meeting-allow {
  margin-top: 10px;
  border: 1px solid #eef2f7;
  border-radius: 10px;
  padding: 10px;
  background: #f8fafc;
}

.zib-chat-meeting-allow-title {
  font-size: 12px;
  font-weight: 600;
  color: #444;
  margin-bottom: 4px;
}

.zib-chat-meeting-allow-tip {
  font-size: 12px;
  color: #777;
  margin-bottom: 8px;
}

.zib-chat-meeting-allow-search {
  width: 100%;
  border: 1px solid #e3e3e3;
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 12px;
  margin-bottom: 8px;
}

.zib-chat-meeting-allow-list {
  max-height: 160px;
  overflow: auto;
  border: 1px dashed #e5e7eb;
  border-radius: 8px;
  background: #fff;
  padding: 6px;
}

.zib-chat-meeting-allow-section {
  margin-bottom: 8px;
}

.zib-chat-meeting-allow-section:last-child {
  margin-bottom: 0;
}

.zib-chat-meeting-allow-label {
  font-size: 12px;
  color: #666;
  margin-bottom: 4px;
}

.zib-chat-meeting-allow-item {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 4px;
  border-radius: 6px;
  font-size: 12px;
  color: #333;
}

.zib-chat-meeting-allow-item:hover {
  background: #f3f4f6;
}

.zib-chat-meeting-allow-empty {
  font-size: 12px;
  color: #999;
  padding: 4px;
}

.zib-chat-meeting-title-input {
  flex: 1;
  border: 1px solid #e3e3e3;
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 13px;
}

.zib-chat-meeting-create-btn {
  border: none;
  border-radius: 8px;
  padding: 6px 12px;
  font-size: 13px;
  cursor: pointer;
  background: #2c7be5;
  color: #fff;
}

.zib-chat-meeting-tip {
  margin-top: 6px;
  font-size: 12px;
  color: #666;
  min-height: 18px;
}

.zib-chat-meeting-active,
.zib-chat-meeting-history {
  margin-top: 10px;
}

.zib-chat-meeting-history {
  max-height: 220px;
  overflow: auto;
}

.zib-chat-meeting-history-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 6px;
}

.zib-chat-meeting-clear-history {
  border: 1px solid #f5c9c9;
  background: #fff5f5;
  color: #b91c1c;
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 12px;
  cursor: pointer;
}

.zib-chat-meeting-history-pagination {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  font-size: 12px;
  color: #6b7280;
}

.zib-chat-meeting-history-pagination button {
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #374151;
  border-radius: 6px;
  padding: 4px 8px;
  cursor: pointer;
  font-size: 12px;
}

.zib-chat-meeting-history-pagination button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.zib-chat-meeting-active-card,
.zib-chat-meeting-history-item {
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 10px;
  background: #fff;
  margin-bottom: 8px;
}

.zib-chat-meeting-active-title,
.zib-chat-meeting-history-title {
  font-size: 13px;
  font-weight: 600;
  color: #1f2a37;
}

.zib-chat-meeting-active-meta,
.zib-chat-meeting-history-meta {
  font-size: 12px;
  color: #6b7280;
  margin-top: 4px;
}

.zib-chat-meeting-active-actions {
  margin-top: 8px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.zib-chat-meeting-active-actions button {
  border: none;
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 12px;
  cursor: pointer;
  background: #eef2f7;
  color: #1f2a37;
}

.zib-chat-meeting-active-actions .zib-chat-meeting-end-btn {
  background: #ffecec;
  color: #b91c1c;
}

.zib-chat-meeting-lock {
  font-size: 12px;
  color: #9aa3af;
}

.zib-chat-meeting-empty {
  font-size: 12px;
  color: #9aa3af;
  padding: 6px 0;
}

.zib-chat-meeting-card {
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 10px 12px;
  background: linear-gradient(135deg, #f5f7ff 0%, #fff8f0 100%);
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.zib-chat-meeting-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.08);
}

.zib-chat-meeting-card.is-ended {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

.zib-chat-meeting-top {
  display: flex;
  align-items: center;
  gap: 10px;
}

.zib-chat-meeting-icon img {
  width: 34px;
  height: 34px;
}

.zib-chat-meeting-time {
  font-size: 12px;
  color: #6b7280;
  margin-top: 4px;
}

.zib-chat-meeting-join-tip {
  margin-top: 4px;
}

.zib-chat-meeting-join-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  font-size: 11px;
  border-radius: 999px;
  border: 1px solid transparent;
}

.zib-chat-meeting-join-badge.is-open {
  background: #ecfdf3;
  color: #0f766e;
  border-color: #bbf7d0;
}

.zib-chat-meeting-join-badge.is-closed {
  background: #fef2f2;
  color: #b91c1c;
  border-color: #fecaca;
}

.zib-chat-meeting-state {
  margin-top: 8px;
  font-size: 12px;
  color: #1f2a37;
}

.zib-chat-meeting-audio {
  display: none;
}

.dark-theme .zib-chat-meeting-bar {
  border-color: #2f343d;
  background: linear-gradient(135deg, #1f2937 0%, #2b2f36 100%);
}

.dark-theme .zib-chat-meeting-title,
.dark-theme .zib-chat-meeting-sub,
.dark-theme .zib-chat-meeting-user,
.dark-theme .zib-chat-meeting-history-title,
.dark-theme .zib-chat-meeting-active-title {
  color: #e5e7eb;
}

.dark-theme .zib-chat-meeting-user {
  background: #1f2937;
  border-color: #374151;
}

.dark-theme .zib-chat-meeting-user-name {
  color: #e5e7eb;
}


.dark-theme .zib-chat-meeting-user-block {
  background: #374151;
  color: #e5e7eb;
}

.dark-theme .zib-chat-meeting-user-host {
  background: #0ea5e9;
  color: #e0f2fe;
}

.dark-theme .zib-chat-meeting-allow {
  background: #0f172a;
  border-color: #1f2937;
}

.dark-theme .zib-chat-meeting-allow-list {
  background: #0b1324;
  border-color: #1f2937;
}

.dark-theme .zib-chat-meeting-allow-title,
.dark-theme .zib-chat-meeting-allow-label,
.dark-theme .zib-chat-meeting-allow-tip {
  color: #a1a1aa;
}

.dark-theme .zib-chat-meeting-allow-search {
  background: #1f242b;
  border-color: #3a414b;
  color: #e6e8eb;
}

.dark-theme .zib-chat-meeting-allow-search::placeholder {
  color: #8b95a5;
}

.dark-theme .zib-chat-meeting-allow-item {
  color: #e5e7eb;
}

.dark-theme .zib-chat-meeting-allow-item:hover {
  background: #1f2937;
}

.dark-theme .zib-chat-meeting-modal .zib-chat-meeting-dialog {
  background: #2a2d33;
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: #e6e8eb;
}

.dark-theme .zib-chat-meeting-modal .zib-chat-modal-head {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.dark-theme .zib-chat-meeting-modal .zib-chat-modal-title,
.dark-theme .zib-chat-meeting-modal .zib-chat-modal-close {
  color: #e6e8eb;
}

.dark-theme .zib-chat-meeting-title-input {
  background: #1f242b;
  border-color: #3a414b;
  color: #e6e8eb;
}

.dark-theme .zib-chat-meeting-title-input::placeholder {
  color: #8b95a5;
}

.dark-theme .zib-chat-meeting-tip {
  color: #cbd3dd;
}

.dark-theme .zib-chat-meeting-clear-history {
  background: #3b1f1f;
  border-color: #5b2b2b;
  color: #fca5a5;
}

.dark-theme .zib-chat-meeting-history-pagination {
  color: #9ca3af;
}

.dark-theme .zib-chat-meeting-history-pagination button {
  background: #1f2937;
  border-color: #374151;
  color: #e5e7eb;
}

.dark-theme .zib-chat-meeting-active-card,
.dark-theme .zib-chat-meeting-history-item,
.dark-theme .zib-chat-meeting-card {
  background: #1f2937;
  border-color: #374151;
}

.dark-theme .zib-chat-meeting-meta,
.dark-theme .zib-chat-meeting-time,
.dark-theme .zib-chat-meeting-history-meta,
.dark-theme .zib-chat-meeting-user-meta {
  color: #9ca3af;
}

.dark-theme .zib-chat-meeting-join-badge.is-open {
  background: #0f2f25;
  border-color: #1f4334;
  color: #86efac;
}

.dark-theme .zib-chat-meeting-join-badge.is-closed {
  background: #3b1f1f;
  border-color: #5b2b2b;
  color: #fca5a5;
}

.zib-chat-tools .zib-chat-redpack-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.zib-chat-tools .zib-chat-more-btn {
  display: none;
  align-items: center;
  gap: 4px;
}

.zib-chat-tools .zib-chat-image-btn,
.zib-chat-tools .zib-chat-video-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.zib-chat-tool-icon {
  width: 16px;
  height: 16px;
  display: inline-block;
}

.zib-chat-redpack-icon-img {
  width: 16px;
  height: 16px;
  display: inline-block;
}

.zib-chat-audio {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(7, 193, 96, 0.12);
  color: #0a7a4a;
  cursor: pointer;
  user-select: none;
}

.zib-chat-audio * {
  pointer-events: none;
}

.zib-chat-read-info {
  margin-top: 6px;
  font-size: 12px;
  color: #6b7280;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}

.zib-chat-read-count {
  font-weight: 600;
  color: #2563eb;
}

.zib-chat-read-open {
  border: none;
  background: transparent;
  padding: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
}

.zib-chat-read-open img {
  width: 16px;
  height: 16px;
  display: block;
}

.zib-chat-read-status {
  font-size: 12px;
  color: #8a95a6;
  margin-bottom: 6px;
}

.zib-chat-read-list {
  max-height: 280px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.zib-chat-read-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 8px;
  border-radius: 8px;
  background: #f6f8fc;
  color: #2e3a46;
  font-size: 13px;
}

.zib-chat-read-time {
  font-size: 12px;
  color: #8a95a6;
}

.zib-chat-read-empty {
  text-align: center;
  color: #8a95a6;
  font-size: 13px;
  padding: 12px 0;
}

.zib-chat-ban-name {
  font-weight: 700;
  margin-bottom: 8px;
}

.zib-chat-ban-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 8px;
  font-size: 13px;
}

.zib-chat-ban-field input {
  width: 100%;
  padding: 6px 8px;
  border-radius: 8px;
  border: 1px solid #e5e5e5;
  background: #fff;
}

.zib-chat-ban-permanent {
  font-size: 13px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 8px;
}

.zib-chat-ban-tip {
  font-size: 12px;
  color: #d45722;
  margin-bottom: 8px;
}

.zib-chat-ban-submit {
  border: none;
  background: #ffefe5;
  color: #d45722;
  padding: 6px 14px;
  border-radius: 999px;
  font-size: 13px;
  cursor: pointer;
}

.zib-chat-message.is-self .zib-chat-audio {
  background: rgba(255, 255, 255, 0.35);
  color: #0a6b38;
}

.zib-chat-audio-icon {
  width: 0;
  height: 0;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 8px solid currentColor;
  position: relative;
}

.zib-chat-audio.is-playing .zib-chat-audio-icon {
  width: 14px;
  height: 14px;
  border: none;
}

.zib-chat-audio.is-playing .zib-chat-audio-icon::before,
.zib-chat-audio.is-playing .zib-chat-audio-icon::after {
  content: '';
  position: absolute;
  bottom: 0;
  width: 4px;
  height: 100%;
  background: currentColor;
  border-radius: 2px;
  animation: zib-chat-audio-bars 0.9s ease-in-out infinite;
}

.zib-chat-audio.is-playing .zib-chat-audio-icon::before {
  left: 0;
}

.zib-chat-audio.is-playing .zib-chat-audio-icon::after {
  right: 0;
  animation-delay: 0.2s;
}

.zib-chat-audio-text {
  font-size: 12px;
}

.zib-chat-audio-duration {
  font-size: 12px;
  opacity: 0.7;
}

@keyframes zib-chat-audio-bars {
  0% { transform: scaleY(0.5); opacity: 0.5; }
  50% { transform: scaleY(1); opacity: 1; }
  100% { transform: scaleY(0.5); opacity: 0.5; }
}

.zib-chat-message.is-redpack .zib-chat-bubble {
  background: transparent;
  box-shadow: none;
  padding: 0;
}

.zib-chat-message.is-redpack .zib-chat-bubble::before {
  display: none;
}

.zib-chat-redpack-card {
  background: linear-gradient(135deg, #ff7b45, #ff4d4f);
  color: #fff;
  border-radius: 12px;
  padding: 12px 14px;
  min-width: 220px;
  cursor: pointer;
  box-shadow: 0 6px 16px rgba(255, 94, 68, 0.24);
}

.zib-chat-redpack-card.is-invalid {
  background: #f3f3f3;
  color: #777;
  cursor: default;
  box-shadow: none;
  pointer-events: none;
}

.zib-chat-redpack-top {
  display: flex;
  gap: 10px;
  align-items: center;
}

.zib-chat-redpack-icon {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
}

.zib-chat-redpack-cover {
  width: 34px;
  height: 34px;
  object-fit: contain;
  display: block;
  pointer-events: none;
}

.zib-chat-redpack-info {
  flex: 1;
}

.zib-chat-redpack-note {
  font-weight: 600;
  margin-bottom: 4px;
}

.zib-chat-redpack-meta {
  font-size: 12px;
  opacity: 0.85;
}

.zib-chat-redpack-target {
  margin-top: 4px;
  font-size: 12px;
  opacity: 0.9;
}

.zib-chat-redpack-state {
  margin-top: 8px;
  font-size: 12px;
  opacity: 0.9;
}

.zib-chat-redpack-id {
  margin-top: 6px;
  font-size: 12px;
  opacity: 0.85;
}

.zib-chat-redpack-lucky {
  margin-top: 6px;
  font-size: 12px;
  opacity: 0.9;
}

.zib-chat-image img {
  width: 140px;
  height: 140px;
  object-fit: cover;
  border-radius: 8px;
  cursor: pointer;
  display: block;
}

.zib-chat-image-view .zib-chat-image-dialog {
  position: relative;
  z-index: 1;
  max-width: 92vw;
  max-height: 86vh;
}

.zib-chat-image-view-img {
  max-width: 92vw;
  max-height: 86vh;
  border-radius: 10px;
  display: block;
}

.zib-chat-message .zib-chat-video-inline {
  display: inline-flex;
  align-items: center;
  padding: 2px 6px;
  border-radius: 6px;
  background: #f1f5f9;
  color: #64748b;
  font-size: 12px;
}

.zib-chat-video {
  display: inline-flex;
  flex-direction: column;
  width: 180px;
  max-width: 70vw;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  border: 1px solid #e5e5e5;
  cursor: pointer;
}

.zib-chat-video-cover {
  width: 100%;
  height: 110px;
  background: #0f172a;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.zib-chat-video-cover img,
.zib-chat-video-cover video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.zib-chat-video-icon {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
}

.zib-chat-video-icon::before {
  content: '';
  border-left: 14px solid #fff;
  border-top: 9px solid transparent;
  border-bottom: 9px solid transparent;
  margin-left: 4px;
}

.zib-chat-video-label {
  width: 100%;
  text-align: center;
  font-size: 12px;
  padding: 6px 8px;
  color: #5b6471;
  background: #fff;
}

.zib-chat-video.is-inline .zib-chat-video-label {
  display: none;
}

.zib-chat-video-player {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  background: #000;
}

.zib-chat-video-choice-dialog {
  position: relative;
  z-index: 1;
  background: #fff;
  border-radius: 16px;
  padding: 16px;
  width: 86%;
  max-width: 320px;
  text-align: center;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.2);
}

.zib-chat-video-choice-title {
  font-weight: 600;
  color: #2e3a46;
  margin-bottom: 12px;
}

.zib-chat-video-choice-actions {
  display: flex;
  gap: 10px;
}

.zib-chat-video-choice .zib-chat-video-inline,
.zib-chat-video-choice .zib-chat-video-full {
  flex: 1;
  border: none;
  border-radius: 999px;
  padding: 8px 12px;
  font-size: 13px;
  cursor: pointer;
}

.zib-chat-video-choice .zib-chat-video-inline {
  background: #eaf2ff;
  color: #2563eb;
}

.zib-chat-video-choice .zib-chat-video-full {
  background: #e6f8ef;
  color: #0f8a4c;
}

.zib-chat-video-view .zib-chat-video-dialog {
  position: relative;
  z-index: 1;
  width: 92vw;
  max-width: 720px;
  background: #000;
  border-radius: 14px;
  padding: 12px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);
}

.zib-chat-video-view-player {
  width: 100%;
  max-height: 70vh;
  border-radius: 10px;
  display: block;
  background: #000;
}

/* Dark theme (Zibll uses .dark-theme on body) */
.dark-theme .zib-chat {
  background: var(--body-bg-color, #2b2d31);
  border-color: var(--main-border-color, rgba(255, 255, 255, 0.08));
}

.dark-theme .zib-chat-online-btn {
  background: linear-gradient(135deg, rgba(123, 92, 255, 0.45), rgba(52, 213, 255, 0.45));
  border-color: rgba(255, 255, 255, 0.2);
  color: #f8fbff;
  box-shadow: 0 10px 22px rgba(60, 120, 255, 0.28), inset 0 0 0 1px rgba(255, 255, 255, 0.18);
}

.dark-theme .zib-chat-online-btn.is-open {
  box-shadow: 0 12px 24px rgba(60, 120, 255, 0.35), inset 0 0 0 1px rgba(255, 255, 255, 0.22);
}

.dark-theme .zib-chat-online-dropdown {
  background: #22252b;
  border-color: rgba(255, 255, 255, 0.1);
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.45);
  color: #e6e8eb;
}

.dark-theme .zib-chat-online-head {
  color: #cbd3dd;
}

.dark-theme .zib-chat-online-search-btn {
  background: rgba(255, 255, 255, 0.08);
  color: #e6e8eb;
}

.dark-theme .zib-chat-online-settings-btn {
  background: rgba(255, 255, 255, 0.08);
}

.dark-theme .zib-chat-online-settings-panel {
  background: #22252b;
  color: #e6e8eb;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5);
}

.dark-theme .zib-chat-online-settings-close {
  color: #cbd3dd;
}

.dark-theme .zib-chat-online-settings-title {
  color: #e6e8eb;
}

.dark-theme .zib-chat-online-search-input {
  background: #1f2329;
  border-color: rgba(255, 255, 255, 0.12);
  color: #e6e8eb;
}

.dark-theme .zib-chat-stealth-btn {
  background: rgba(255, 255, 255, 0.08);
  color: #e6e8eb;
}

.dark-theme .zib-chat-mute-all-btn {
  background: rgba(255, 255, 255, 0.08);
  color: #e6e8eb;
}

.dark-theme .zib-chat-online-settings-section {
  border-top-color: rgba(255, 255, 255, 0.12);
}

.dark-theme .zib-chat-online-settings-label {
  color: #cbd3dd;
}

.dark-theme .zib-chat-access-type,
.dark-theme .zib-chat-access-value {
  background: #1f2329;
  border-color: rgba(255, 255, 255, 0.12);
  color: #e6e8eb;
}

.dark-theme .zib-chat-access-save {
  background: rgba(255, 255, 255, 0.08);
  color: #e6e8eb;
}

.dark-theme .zib-chat-access-tip {
  color: #cbd3dd;
}

.dark-theme .zib-chat-tool-label {
  color: #cbd3dd;
}

.dark-theme .zib-chat-tool-type,
.dark-theme .zib-chat-tool-value {
  background: #1f2329;
  border-color: rgba(255, 255, 255, 0.12);
  color: #e6e8eb;
}

.dark-theme .zib-chat-tool-perm-save {
  background: rgba(255, 255, 255, 0.08);
  color: #e6e8eb;
}

.dark-theme .zib-chat-tool-perm-tip {
  color: #cbd3dd;
}

.dark-theme .zib-chat-stealth-btn.is-on {
  background: rgba(255, 138, 64, 0.22);
  color: #ffd0a6;
}

.dark-theme .zib-chat-mute-all-btn.is-on {
  background: rgba(255, 90, 95, 0.22);
  color: #ffd6d8;
}

.dark-theme .zib-chat-online-item {
  background: rgba(255, 255, 255, 0.06);
  color: #f0f2f5;
}

.dark-theme .zib-chat-online-item.is-offline {
  background: rgba(255, 255, 255, 0.04);
  color: #d7dbe0;
}

.dark-theme .zib-chat-online-label,
.dark-theme .zib-chat-online-time {
  color: #9aa3af;
}

.dark-theme .zib-chat-online-divider {
  color: #7f8896;
  border-top-color: rgba(148, 163, 184, 0.2);
}

.dark-theme .zib-chat-online-ban-info {
  color: #ffc49c;
}

.dark-theme .zib-chat-online-ban {
  background: rgba(255, 138, 64, 0.2);
  color: #ffd0a6;
}

.dark-theme .zib-chat-online-unban {
  background: rgba(86, 140, 255, 0.2);
  color: #b9d0ff;
}

.dark-theme .zib-chat-online-manager-set {
  background: rgba(86, 140, 255, 0.18);
  color: #b9d0ff;
}

.dark-theme .zib-chat-online-manager-unset {
  background: rgba(167, 108, 255, 0.18);
  color: #d2b7ff;
}

.dark-theme .zib-chat-online-empty {
  color: #9aa3af;
}

.dark-theme .zib-chat-messages-empty {
  color: #b8b8b8;
}

.dark-theme .zib-chat-read-info {
  color: #9aa3af;
}

.dark-theme .zib-chat-read-count,
.dark-theme .zib-chat-read-more-text {
  color: #8db3ff;
}


.dark-theme .zib-chat-read-status,
.dark-theme .zib-chat-read-time {
  color: #9aa3af;
}

.dark-theme .zib-chat-ban-field input {
  background: #1f2329;
  border-color: rgba(255, 255, 255, 0.12);
  color: #e6e8eb;
}

.dark-theme .zib-chat-ban-tip {
  color: #ffc49c;
}

.dark-theme .zib-chat-ban-submit {
  background: rgba(255, 138, 64, 0.18);
  color: #ffd0a6;
}

.dark-theme .zib-chat-read-item {
  background: #242831;
  color: #e6e8eb;
}

.dark-theme .zib-chat-form textarea:disabled {
  background: rgba(255, 255, 255, 0.04);
  color: #8b94a5;
}

.dark-theme .zib-chat-sound-tip {
  background: rgba(44, 88, 150, 0.25);
  border-color: rgba(110, 160, 255, 0.2);
  color: #e6e8eb;
}

.dark-theme .zib-chat-sound-tip-ignore {
  background: rgba(255, 255, 255, 0.08);
  color: #e6e8eb;
}

.dark-theme .zib-chat-mute-count {
  background: rgba(255, 123, 69, 0.2);
  border: 1px solid rgba(255, 123, 69, 0.35);
  color: #ffd0a6;
}

.dark-theme .zib-chat-messages {
  background: #1f2125;
  border-color: var(--main-border-color, rgba(255, 255, 255, 0.08));
}

.dark-theme .zib-chat-message .zib-chat-bubble {
  background: #2c2f35;
  color: #e6e8eb;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

.dark-theme .zib-chat-content {
  color: #e6e8eb;
}

.dark-theme .zib-chat-meta .zib-chat-user {
  color: #d6d9de;
}

.dark-theme .zib-chat-message .zib-chat-bubble::before {
  border-right-color: #2c2f35;
}

.dark-theme .zib-chat-message.is-self .zib-chat-bubble {
  background: #245c43;
  color: #eafff4;
}

.dark-theme .zib-chat-message.is-self .zib-chat-bubble::before {
  border-left-color: #245c43;
}

.dark-theme .zib-chat-meta,
.dark-theme .zib-chat-time {
  color: #c7d0dc;
}

.dark-theme .zib-chat-meta .zib-chat-role {
  background: #2a2f38;
  color: #c5cfdd;
  border-color: #394150;
}

.dark-theme .zib-chat-meta .zib-chat-role.is-admin {
  background: #3a2a1a;
  color: #ffd7a1;
  border-color: #5a3b1f;
}

.dark-theme .zib-chat-meta .zib-chat-role.is-owner {
  background: #1f2b3a;
  color: #9fd0ff;
  border-color: #2f3f56;
}

.dark-theme .zib-chat-meta .zib-chat-role.is-manager {
  background: #2a2140;
  color: #d5c6ff;
  border-color: #3b2f5c;
}

.dark-theme .zib-chat-meta .zib-chat-name-pill {
  background: #232833;
  color: #e6edf7;
  border-color: #333a48;
}

.dark-theme .zib-chat-location-pill {
  background: #262c37;
  color: #c2ccd8;
  border-color: #353e4d;
}

.dark-theme .zib-chat-time {
  background: #2a303b;
  color: #b8c2cf;
  border-color: #3a4352;
}

.dark-theme .zib-chat-system .zib-chat-system-text {
  background: #2a2d33;
  border-color: rgba(255, 255, 255, 0.08);
  color: #c6c9cf;
}

.dark-theme .zib-chat-mention-tag {
  background: rgba(79, 124, 255, 0.2);
  color: #bcd0ff;
}

.dark-theme .zib-chat-form {
  background: #26282d;
  border-color: rgba(255, 255, 255, 0.08);
}

.dark-theme .zib-chat-form textarea {
  color: #e6e8eb;
}

.dark-theme .zib-chat-form textarea::placeholder {
  color: #8f949b;
}

.dark-theme .zib-chat-actions button {
  background: #1f7a4f;
}

.dark-theme .zib-chat-actions button:hover {
  background: #1a6a45;
}

.dark-theme .zib-chat-actions .zib-chat-voice-btn {
  background: #1f2125;
  color: #e6e8eb;
  border-color: rgba(255, 255, 255, 0.08);
}

.dark-theme .zib-chat-actions .zib-chat-voice-btn:hover {
  background: #2c2f35;
}

.dark-theme .zib-chat-actions .zib-chat-send-btn {
  background: #1f2125;
  color: #e6e8eb;
  border-color: rgba(255, 255, 255, 0.08);
}

.dark-theme .zib-chat-actions .zib-chat-send-btn:hover {
  background: #2c2f35;
}

.dark-theme .zib-chat-status,
.dark-theme .zib-chat-admin-status {
  color: #8fd4d6;
  background: rgba(90, 200, 210, 0.12);
  border-color: rgba(90, 200, 210, 0.26);
}

.dark-theme .zib-chat-status.is-error,
.dark-theme .zib-chat-admin-status.is-error {
  color: #ffb3b5;
  background: rgba(255, 90, 95, 0.12);
  border-color: rgba(255, 90, 95, 0.26);
}

.dark-theme .zib-chat-uploads .zib-chat-upload-item {
  background: #2c2f35;
  border-color: rgba(255, 255, 255, 0.08);
}

.dark-theme .zib-chat-upload-status {
  color: #a0a5ad;
}

.dark-theme .zib-chat-context-menu {
  background: #2a2d33;
  border-color: rgba(255, 255, 255, 0.08);
  color: #e6e8eb;
}

.dark-theme .zib-chat-context-menu button:hover,
.dark-theme .zib-chat-context-menu a:hover {
  background: rgba(79, 124, 255, 0.15);
}

.dark-theme .zib-chat-mention-box,
.dark-theme .zib-chat-redpack-modal .zib-chat-modal-dialog,
.dark-theme .zib-chat-redpack-open .zib-chat-modal-dialog,
.dark-theme .zib-chat-redpack-selected-modal .zib-chat-modal-dialog,
.dark-theme .zib-chat-mute-modal .zib-chat-modal-dialog,
.dark-theme .zib-chat-mute-all-modal .zib-chat-modal-dialog,
.dark-theme .zib-chat-ban-modal .zib-chat-modal-dialog,
.dark-theme .zib-chat-announce-modal .zib-chat-modal-dialog,
.dark-theme .zib-chat-notify-modal .zib-chat-modal-dialog,
.dark-theme .zib-chat-read-modal .zib-chat-modal-dialog,
.dark-theme .zib-chat-share-modal .zib-chat-modal-dialog {
  background: #2a2d33;
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: #e6e8eb;
}

.dark-theme .zib-chat-mute-all-status {
  color: #cbd3dd;
}

.dark-theme .zib-chat-mute-all-section {
  background: #1f2329;
  border-color: rgba(255, 255, 255, 0.08);
}

.dark-theme .zib-chat-mute-all-label {
  color: #e6e8eb;
}

.dark-theme .zib-chat-mute-all-row input[type="number"],
.dark-theme .zib-chat-mute-all-rule input[type="time"] {
  background: #1f2329;
  border-color: rgba(255, 255, 255, 0.12);
  color: #e6e8eb;
}

.dark-theme .zib-chat-mute-all-close,
.dark-theme .zib-chat-mute-all-rule-actions button {
  background: rgba(255, 255, 255, 0.08);
  color: #e6e8eb;
}

.dark-theme .zib-chat-mute-all-rule-remove {
  background: rgba(255, 107, 107, 0.18);
  color: #ffc2c2;
}

.dark-theme .zib-chat-mute-count {
  background: rgba(255, 106, 74, 0.15);
  color: #ffb3a1;
}

.dark-theme .zib-chat-announce-btn {
  background: rgba(79, 124, 255, 0.18);
  color: #bcd0ff;
}

.dark-theme .zib-chat-notify-btn {
  background: rgba(140, 120, 255, 0.18);
  color: #d5c8ff;
}

.dark-theme .zib-chat-share-btn {
  background: rgba(72, 160, 255, 0.18);
  color: #b8dcff;
}

.dark-theme .zib-chat-announce-content {
  background: #242831;
  border-color: rgba(255, 255, 255, 0.08);
  color: #e6e8eb;
}

.dark-theme .zib-chat-announce-empty {
  background: #242831;
  border-color: rgba(255, 255, 255, 0.1);
  color: #9aa3af;
}

.dark-theme .zib-chat-announce-meta,
.dark-theme .zib-chat-announce-check {
  color: #9aa3af;
}

.dark-theme .zib-chat-announce-input {
  background: #1f2125;
  border-color: rgba(255, 255, 255, 0.08);
  color: #e6e8eb;
}

.dark-theme .zib-chat-notify-desc,
.dark-theme .zib-chat-notify-status {
  color: #9aa3af;
}

.dark-theme .zib-chat-notify-modal .zib-chat-modal-head,
.dark-theme .zib-chat-notify-modal .zib-chat-modal-close,
.dark-theme .zib-chat-notify-modal .zib-chat-notify-check {
  color: #e6e8eb;
}

.dark-theme .zib-chat-ban-modal .zib-chat-modal-head,
.dark-theme .zib-chat-ban-modal .zib-chat-modal-close {
  color: #e6e8eb;
}

.dark-theme .zib-chat-ban-name,
.dark-theme .zib-chat-ban-permanent {
  color: #cbd5e1;
}

.dark-theme .zib-chat-read-modal .zib-chat-modal-head,
.dark-theme .zib-chat-read-modal .zib-chat-modal-close {
  color: #e6e8eb;
}

.dark-theme .zib-chat-login-modal .zib-chat-modal-dialog {
  background: #1f232a;
}

.dark-theme .zib-chat-share-modal .zib-chat-modal-head,
.dark-theme .zib-chat-share-modal .zib-chat-modal-close {
  color: #e6e8eb;
}

.dark-theme .zib-chat-share-field input,
.dark-theme .zib-chat-share-field textarea {
  background: #242831;
  border-color: rgba(255, 255, 255, 0.12);
  color: #e6e8eb;
}

.dark-theme .zib-chat-share-desc {
  color: #9aa3af;
}

.dark-theme .zib-chat-share-label {
  color: #e6e8eb;
}

.dark-theme .zib-chat-share-copy {
  background: #4b8be6;
}

.dark-theme .zib-chat-share-status {
  color: #9fc3ff;
}

.dark-theme .zib-chat-announce-save {
  background: #3a7bd5;
}

.dark-theme .zib-chat-announce-clear {
  background: #d95459;
}

.dark-theme .zib-chat-voice-dialog {
  background: #2a2d33;
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: #e6e8eb;
}

.dark-theme .zib-chat-voice-title {
  color: #e6e8eb;
}

.dark-theme .zib-chat-voice-timer {
  color: #6be6a4;
}

.dark-theme .zib-chat-voice-cancel {
  background: #1f2125;
  color: #e6e8eb;
}

.dark-theme .zib-chat-audio {
  background: rgba(107, 230, 164, 0.18);
  color: #b7f3d2;
}

.dark-theme .zib-chat-message.is-self .zib-chat-audio {
  background: rgba(255, 255, 255, 0.2);
  color: #d9fbe9;
}

.dark-theme .zib-chat-message .zib-chat-video-inline {
  background: #2a2d33;
  color: #cbd5e1;
}

.dark-theme .zib-chat-video {
  background: #1f2125;
  border-color: rgba(255, 255, 255, 0.08);
}

.dark-theme .zib-chat-video-label {
  background: #1f2125;
  color: #cbd5e1;
}

.dark-theme .zib-chat-video-choice-dialog {
  background: #2a2d33;
  color: #e6e8eb;
}

.dark-theme .zib-chat-video-choice-title {
  color: #e6e8eb;
}

.dark-theme .zib-chat-video-choice .zib-chat-video-inline {
  background: rgba(37, 99, 235, 0.2);
  color: #93c5fd;
}

.dark-theme .zib-chat-video-choice .zib-chat-video-full {
  background: rgba(15, 138, 76, 0.2);
  color: #86efac;
}

.dark-theme .zib-chat-video-view .zib-chat-video-dialog {
  background: #0b0d11;
}

.dark-theme .zib-chat-tool-dialog {
  background: #2a2d33;
  color: #e6e8eb;
}

.dark-theme .zib-chat-tool-title {
  color: #e6e8eb;
}

.dark-theme .zib-chat-tool-option {
  background: #1f2125;
  color: #e6e8eb;
}

.dark-theme .zib-chat-mention-head {
  color: #c8ccd2;
}

.dark-theme .zib-chat-mention-empty {
  color: #8f949b;
}

.dark-theme .zib-chat-redpack-field input,
.dark-theme .zib-chat-redpack-field select,
.dark-theme .zib-chat-mention-search,
.dark-theme .zib-chat-redpack-search {
  background: #1f2125;
  border-color: rgba(255, 255, 255, 0.08);
  color: #e6e8eb;
}

.dark-theme .zib-chat-mention-item {
  background: #2c2f35;
  color: #e6e8eb;
}

.dark-theme .zib-chat-mention-item:hover {
  background: #2a3d32;
}

.dark-theme .zib-chat-redpack-open-claims {
  background: #1f2125;
}

.dark-theme .zib-chat-redpack-targets {
  background: #1f2125;
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.dark-theme .zib-chat-redpack-user {
  background: #2c2f35;
  border-color: rgba(255, 255, 255, 0.1);
  color: #e6e8eb;
}

.dark-theme .zib-chat-redpack-user.is-selected {
  background: rgba(255, 123, 69, 0.2);
  border-color: rgba(255, 123, 69, 0.5);
  color: #ffd0a6;
}

.dark-theme .zib-chat-redpack-tag {
  background: rgba(255, 123, 69, 0.2);
  color: #ffd0a6;
}

.dark-theme .zib-chat-redpack-more {
  border-color: #ffd0a6;
  color: #ffd0a6;
}

.dark-theme .zib-chat-mute-row {
  background: #2c2f35;
}

.dark-theme .zib-chat-mute-time,
.dark-theme .zib-chat-mute-status {
  color: #a0a5ad;
}

.dark-theme .zib-chat-mute-actions-row button {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.12);
  color: #ffd0a6;
}

.dark-theme .zib-chat-scroll-btn {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.12);
  color: #e6e8eb;
}

.dark-theme .zib-chat-scroll-btn:hover {
  background: rgba(255, 255, 255, 0.16);
}

.dark-theme .zib-chat-context-menu {
  background: #2a2d33;
  border-color: rgba(255, 255, 255, 0.12);
  color: #e6e8eb;
}

.dark-theme .zib-chat-context-menu button,
.dark-theme .zib-chat-context-menu a {
  color: #e6e8eb;
}

.dark-theme .zib-chat-context-menu button.is-disabled,
.dark-theme .zib-chat-context-menu button:disabled,
.dark-theme .zib-chat-context-menu a.is-disabled {
  color: #8b9098;
  background: transparent;
}

.dark-theme .zib-chat-message.is-retracted .zib-chat-content {
  color: #9aa0a8;
}

.dark-theme .zib-chat-retracted-note {
  color: #ffb3b5;
}

.dark-theme .zib-chat-retracted-content {
  background: #1f2125;
  border-color: rgba(255, 255, 255, 0.08);
  color: #c9cdd3;
}

.dark-theme .zib-chat-redpack-claims-row {
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

.dark-theme .zib-chat-redpack-claims-name {
  color: #e6e8eb;
}

.dark-theme .zib-chat-redpack-claims-head {
  color: #e6e8eb;
}

.dark-theme .zib-chat-newbar {
  background: #243247;
  border-color: rgba(79, 124, 255, 0.3);
  color: #cfe0ff;
}

.dark-theme .zib-chat-redpack-hint {
  background: rgba(255, 138, 64, 0.15);
  border-color: rgba(255, 138, 64, 0.35);
  color: #ffd0a6;
}

.dark-theme .zib-chat-muted {
  background: rgba(255, 90, 95, 0.12);
  border-color: rgba(255, 90, 95, 0.25);
  color: #ffb3b5;
}

.dark-theme .zib-chat-banned {
  background: rgba(255, 142, 67, 0.12);
  border-color: rgba(255, 142, 67, 0.25);
  color: #ffd3a8;
}

.dark-theme .zib-chat-closed {
  background: rgba(255, 90, 95, 0.12);
  border-color: rgba(255, 90, 95, 0.25);
  color: #ffb3b5;
}

.zib-chat-modal {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: flex;
  align-items: center;
  justify-content: center;
}

.zib-chat-modal[hidden] {
  display: none;
}

.zib-chat-modal-mask {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
}

.zib-chat-modal-dialog {
  position: relative;
  z-index: 1;
  background: #fff;
  border-radius: 12px;
  padding: 16px;
  width: 90%;
  max-width: 380px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.2);
}

.zib-chat-mute-all-modal .zib-chat-modal-dialog {
  max-width: 420px;
}

.zib-chat-mute-all-status {
  font-size: 13px;
  color: #555;
  margin-bottom: 10px;
}

.zib-chat-mute-all-section {
  border: 1px solid #eee;
  border-radius: 10px;
  padding: 10px;
  margin-bottom: 10px;
  background: #fafafa;
}

.zib-chat-mute-all-label {
  font-size: 12px;
  font-weight: 600;
  color: #333;
  margin-bottom: 8px;
}

.zib-chat-mute-all-row {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.zib-chat-mute-all-row input[type="number"] {
  width: 120px;
  padding: 6px 8px;
  border-radius: 8px;
  border: 1px solid #e1e1e1;
}

.zib-chat-mute-all-row button {
  border: none;
  border-radius: 8px;
  padding: 6px 10px;
  cursor: pointer;
  font-size: 12px;
}

.zib-chat-mute-all-apply {
  background: #ff6b6b;
  color: #fff;
}

.zib-chat-mute-all-close {
  background: #f0f0f0;
  color: #444;
}

.zib-chat-mute-all-rules {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 8px;
}

.zib-chat-mute-all-rule {
  display: flex;
  align-items: center;
  gap: 8px;
}

.zib-chat-mute-all-rule input[type="time"] {
  padding: 4px 6px;
  border-radius: 8px;
  border: 1px solid #e1e1e1;
  font-size: 12px;
}

.zib-chat-mute-all-rule-remove {
  border: none;
  background: #ffecec;
  color: #c62828;
  border-radius: 8px;
  padding: 4px 8px;
  cursor: pointer;
  font-size: 12px;
}

.zib-chat-mute-all-rule-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.zib-chat-mute-all-rule-actions button {
  border: none;
  border-radius: 8px;
  padding: 6px 10px;
  cursor: pointer;
  font-size: 12px;
  background: #f2f2f2;
  color: #444;
}

.zib-chat-mute-all-tip {
  font-size: 12px;
  color: #c0392b;
  min-height: 18px;
}

.zib-chat-login-modal .zib-chat-modal-dialog {
  max-width: 520px;
  padding: 12px;
}

.zib-chat-login-modal .zib-chat-modal-body {
  padding: 4px 0 0;
}

.zib-chat-login-iframe {
  width: 100%;
  height: 65vh;
  border: 0;
  border-radius: 8px;
  background: #fff;
}

.zib-chat-tool-dialog {
  position: relative;
  z-index: 1;
  background: #fff;
  border-radius: 16px;
  padding: 16px;
  width: 86%;
  max-width: 320px;
  text-align: center;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.22);
}

.zib-chat-tool-title {
  font-weight: 600;
  color: #2e3a46;
  margin-bottom: 12px;
}

.zib-chat-tool-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.zib-chat-tool-option {
  border: none;
  border-radius: 12px;
  padding: 8px 8px;
  background: #f6f7fb;
  color: #2e3a46;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  font-size: 13px;
  cursor: pointer;
  min-height: 36px;
}

.zib-chat-tool-option.is-disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.zib-chat-tool-emoji {
  width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
}

.zib-chat-voice-dialog {
  position: relative;
  z-index: 1;
  background: #fff;
  border-radius: 16px;
  padding: 20px;
  width: 86%;
  max-width: 320px;
  text-align: center;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.22);
}

.zib-chat-voice-title {
  font-weight: 600;
  color: #2e3a46;
  margin-bottom: 8px;
}

.zib-chat-voice-timer {
  font-size: 28px;
  font-weight: 700;
  color: #07c160;
  letter-spacing: 1px;
  margin-bottom: 16px;
}

.zib-chat-voice-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.zib-chat-voice-actions button {
  border: none;
  border-radius: 999px;
  padding: 6px 14px;
  cursor: pointer;
  font-size: 13px;
}

.zib-chat-voice-stop {
  background: #07c160;
  color: #fff;
}

.zib-chat-voice-cancel {
  background: #f1f3f7;
  color: #2e3a46;
}

.zib-chat-modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: 700;
  margin-bottom: 12px;
}

.zib-chat-modal-close {
  background: transparent;
  border: none;
  font-size: 20px;
  cursor: pointer;
}

.zib-chat-mute-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.zib-chat-mute-clear {
  border: none;
  background: #ff5a5f;
  color: #fff;
  padding: 6px 12px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 12px;
}

.zib-chat-mute-status {
  font-size: 12px;
  color: #888;
}

.zib-chat-mute-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.zib-chat-announce-content {
  margin-top: 8px;
  padding: 10px 12px;
  border-radius: 10px;
  background: #f6f8fc;
  border: 1px solid #e3e7ef;
  color: #2e3a46;
  line-height: 1.6;
  font-size: 13px;
}

.zib-chat-share-field {
  margin-bottom: 12px;
}

.zib-chat-share-label {
  font-weight: 600;
  color: #2e3a46;
  margin-bottom: 6px;
  font-size: 13px;
}

.zib-chat-share-input {
  display: flex;
  align-items: stretch;
  gap: 8px;
}

.zib-chat-share-input textarea {
  flex: 1 1 auto;
  min-height: 88px;
}

.zib-chat-share-input input {
  flex: 1 1 auto;
}

.zib-chat-share-copy {
  border: none;
  background: #3a7bd5;
  color: #fff;
  padding: 0 12px;
  border-radius: 8px;
  font-size: 12px;
  cursor: pointer;
  height: 36px;
  align-self: flex-start;
  white-space: nowrap;
}

.zib-chat-share-copy:hover {
  opacity: 0.9;
}

.zib-chat-share-field input,
.zib-chat-share-field textarea {
  width: 100%;
  border-radius: 8px;
  border: 1px solid #e2e6ef;
  background: #f7f8fb;
  padding: 8px 10px;
  font-size: 12px;
  color: #2e3a46;
  outline: none;
  resize: none;
}

.zib-chat-share-desc {
  font-size: 12px;
  color: #8b93a6;
  margin-top: 6px;
}

.zib-chat-share-status {
  margin-top: 6px;
  font-size: 12px;
  color: #3a7bd5;
}

.zib-chat-announce-empty {
  margin-top: 8px;
  padding: 10px 12px;
  border-radius: 10px;
  background: #f6f8fc;
  border: 1px dashed #d7dde8;
  color: #8a95a6;
  font-size: 13px;
  text-align: center;
}

.zib-chat-announce-meta {
  margin-top: 6px;
  font-size: 12px;
  color: #8a95a6;
}

.zib-chat-announce-admin {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed #e5e5e5;
}

.zib-chat-announce-input {
  width: 100%;
  border-radius: 8px;
  border: 1px solid #e3e7ef;
  padding: 8px 10px;
  resize: vertical;
  min-height: 90px;
  font-size: 13px;
}

.zib-chat-announce-check {
  display: block;
  margin-top: 8px;
  font-size: 12px;
  color: #5f6b7a;
}

.zib-chat-announce-actions {
  margin-top: 10px;
  display: flex;
  gap: 8px;
}

.zib-chat-announce-save {
  border: none;
  background: #2c7be5;
  color: #fff;
  padding: 6px 12px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 12px;
}

.zib-chat-announce-clear {
  border: none;
  background: #ff5a5f;
  color: #fff;
  padding: 6px 12px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 12px;
}

.zib-chat-notify-check {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  margin-top: 6px;
}

.zib-chat-notify-desc {
  margin-top: 6px;
  font-size: 12px;
  color: #8a95a6;
}

.zib-chat-notify-status {
  margin-top: 8px;
  font-size: 12px;
  color: #2c7a7b;
}

.zib-chat-mute-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  background: #f7f7f7;
}

.zib-chat-mute-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.zib-chat-mute-name {
  font-weight: 600;
}

.zib-chat-mute-time {
  font-size: 12px;
  color: #888;
}

.zib-chat-mute-actions-row {
  display: flex;
  gap: 6px;
}

.zib-chat-mute-actions-row button {
  border: none;
  background: #fff;
  color: #ff6b4a;
  border: 1px solid #ffd2a8;
  padding: 4px 8px;
  border-radius: 6px;
  font-size: 12px;
  cursor: pointer;
}

.zib-chat-mute-empty {
  font-size: 12px;
  color: #999;
  padding: 8px 0;
  text-align: center;
}

.zib-chat-redpack-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
  margin-bottom: 12px;
}

.zib-chat-redpack-field input,
.zib-chat-redpack-field select {
  border: 1px solid #e5e5e5;
  border-radius: 6px;
  padding: 6px 8px;
  font-size: 13px;
}

.zib-chat-redpack-count-row {
  display: flex;
  gap: 8px;
  align-items: center;
}

.zib-chat-redpack-fill-count {
  background: #fff3f0;
  border: 1px solid #ff6b4a;
  color: #ff6b4a;
  border-radius: 6px;
  padding: 6px 8px;
  cursor: pointer;
  font-size: 12px;
}

.zib-chat-redpack-scope {
  display: flex;
  gap: 12px;
  font-size: 13px;
}

.zib-chat-redpack-targets {
  background: #f8f8f8;
  padding: 10px;
  border-radius: 8px;
  margin-bottom: 12px;
}

.zib-chat-redpack-search {
  width: 100%;
  border: 1px solid #e5e5e5;
  border-radius: 6px;
  padding: 6px 8px;
  margin-bottom: 8px;
}

.zib-chat-redpack-userlist {
  max-height: 160px;
  overflow-y: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 8px;
}

.zib-chat-redpack-user {
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 999px;
  padding: 4px 10px;
  cursor: pointer;
  font-size: 12px;
}

.zib-chat-redpack-user.is-selected {
  background: #ffefe8;
  border-color: #ff6b4a;
  color: #ff6b4a;
}

.zib-chat-redpack-selected {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.zib-chat-redpack-tag {
  background: #ffefe8;
  color: #ff6b4a;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 12px;
}

.zib-chat-redpack-more {
  border: 1px dashed #ff6b4a;
  background: transparent;
  color: #ff6b4a;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 12px;
  cursor: pointer;
}

.zib-chat-redpack-selected-modal .zib-chat-modal-dialog {
  max-width: 420px;
}

.zib-chat-redpack-userlist-all {
  max-height: 320px;
  overflow-y: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 16px;
}

.zib-chat-redpack-empty {
  color: #999;
  font-size: 12px;
}

.zib-chat-redpack-tip {
  font-size: 12px;
  color: #ff5a5f;
  min-height: 18px;
  margin-bottom: 10px;
}

.zib-chat-redpack-submit {
  width: 100%;
  border: none;
  background: #ff5a5f;
  color: #fff;
  padding: 8px 12px;
  border-radius: 8px;
  cursor: pointer;
}

.zib-chat-redpack-cover-wrap {
  display: flex;
  justify-content: center;
  margin-bottom: 12px;
}

.zib-chat-redpack-cover-img {
  width: 80px;
  height: 80px;
  object-fit: contain;
}

.zib-chat-redpack-open-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-size: 13px;
}

.zib-chat-redpack-open-id {
  font-size: 12px;
  color: #666;
}

.zib-chat-redpack-open-claims {
  background: #f8f8f8;
  border-radius: 8px;
  padding: 8px;
  max-height: 180px;
  overflow-y: auto;
  font-size: 12px;
}

.zib-chat-redpack-claims-head {
  font-weight: 600;
  margin-bottom: 6px;
  color: #333;
}

.zib-chat-redpack-lucky-badge {
  background: linear-gradient(135deg, #fff1cc, #ffe07a);
  color: #9c6a00;
  border: 1px solid #f2c94c;
  border-radius: 8px;
  padding: 6px 8px;
  margin-bottom: 8px;
  font-weight: 600;
}

.zib-chat-redpack-claims-empty {
  color: #999;
  padding: 6px 0;
}

.zib-chat-redpack-claims-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 8px;
  padding: 4px 0;
  border-bottom: 1px dashed #e5e5e5;
}

.zib-chat-redpack-claims-row:last-child {
  border-bottom: none;
}

.zib-chat-redpack-claims-name {
  color: #333;
}

.zib-chat-redpack-claims-amount {
  color: #ff5a5f;
}

.zib-chat-redpack-claims-time {
  color: #999;
}

.zib-chat-redpack-open-btn {
  border: none;
  background: #ff5a5f;
  color: #fff;
  padding: 8px 12px;
  border-radius: 8px;
  cursor: pointer;
}

.zib-chat-redpack-open-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.zib-chat-history {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 6px 0 10px;
  justify-content: center;
  position: sticky;
  top: 6px;
  z-index: 5;
}

.zib-chat-load-history {
  border: 1px solid #ff5a5f;
  background: #ff5a5f;
  color: #fff;
  border-radius: 999px;
  padding: 4px 12px;
  font-size: 12px;
  cursor: pointer;
}

.zib-chat-load-history:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.zib-chat-history-status {
  font-size: 12px;
  color: #888;
}

.zib-chat-divider {
  text-align: center;
  color: #999;
  font-size: 12px;
  margin: 8px 0;
}

.zib-chat-mention-toast {
  position: absolute;
  right: 16px;
  top: 52px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 999px;
  background: #fff7e6;
  border: 1px solid #ffd08a;
  color: #9c5a00;
  font-size: 13px;
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.08);
  cursor: pointer;
  z-index: 25;
}

.zib-chat-mention-toast button {
  border: none;
  background: #ff9f1a;
  color: #fff;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  cursor: pointer;
}

.zib-chat-mention-toast button:hover {
  background: #e58b0b;
}

.zib-chat-quote-toast {
  position: absolute;
  right: 16px;
  top: 90px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 999px;
  background: #f0f5ff;
  border: 1px solid #c7dbff;
  color: #274b9f;
  font-size: 13px;
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.08);
  cursor: pointer;
  z-index: 25;
}

.zib-chat-quote-toast button {
  border: none;
  background: #4f7cff;
  color: #fff;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  cursor: pointer;
}

.zib-chat-quote-toast button:hover {
  background: #3a66f0;
}

.zib-chat-newbar {
  position: absolute;
  right: 16px;
  bottom: 130px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 999px;
  background: #e8f4ff;
  border: 1px solid #b7dcff;
  color: #1b5eaa;
  font-size: 13px;
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.08);
  cursor: pointer;
  z-index: 25;
}

.zib-chat-newbar button {
  border: none;
  background: #2f7dd1;
  color: #fff;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  cursor: pointer;
}

.zib-chat-newbar button:hover {
  background: #2569b0;
}

.zib-chat-redpack-hint {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 10px 0;
  padding: 8px 12px;
  border-radius: 10px;
  background: #fff4e6;
  border: 1px solid #ffd2a8;
  color: #a55a00;
  font-size: 13px;
}

.zib-chat-redpack-hint-btn {
  border: none;
  background: #ff7b45;
  color: #fff;
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 12px;
  cursor: pointer;
}

.zib-chat-redpack-hint-btn:hover {
  background: #ff6325;
}

.zib-chat-scroll-tools {
  position: absolute;
  right: 12px;
  bottom: calc(var(--zib-chat-form-offset, 120px) + 50px);
  width: 47px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  z-index: 25;
  opacity: 0.35;
  transition: opacity 0.2s ease;
}

.zib-chat-scroll-tools:hover {
  opacity: 1;
}

.zib-chat:hover .zib-chat-scroll-tools {
  opacity: 0.6;
}

.zib-chat-scroll-btn {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid #e5e5e5;
  background: #fff;
  cursor: pointer;
  font-size: 14px;
  line-height: 1;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.08);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.zib-chat-scroll-btn:hover {
  background: #f2f7ff;
}

.zib-chat-scroll-btn:active {
  transform: scale(0.95);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
}

.zib-chat-message.is-mention-highlight .zib-chat-bubble {
  box-shadow: 0 0 0 2px rgba(255, 159, 26, 0.4);
}

@keyframes zib-chat-gradient {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

@keyframes zib-chat-glow {
  0%, 100% { box-shadow: 0 0 0 rgba(255, 255, 255, 0.1); }
  50% { box-shadow: 0 0 18px rgba(255, 255, 255, 0.35); }
}

.zib-chat-actions button:hover {
  background: #06ad57;
}

.zib-chat-status,
.zib-chat-admin-status {
  font-size: 12px;
  color: #2c7a7b;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 8px;
  background: rgba(44, 122, 123, 0.08);
  border: 1px solid rgba(44, 122, 123, 0.2);
  transition: opacity 0.4s ease, transform 0.4s ease;
  opacity: 1;
}

.zib-chat-status.is-error,
.zib-chat-admin-status.is-error {
  color: #d9534f;
  background: rgba(217, 83, 79, 0.12);
  border-color: rgba(217, 83, 79, 0.28);
}

.zib-chat-status:empty,
.zib-chat-admin-status:empty {
  display: none;
}

.zib-chat-status.is-hidden,
.zib-chat-admin-status.is-hidden {
  opacity: 0;
  transform: translateY(4px);
}

.zib-chat-admin {
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px dashed #e5e5e5;
}

.zib-chat-closed {
  background: #fff6f6;
  border: 1px solid #f0d8d8;
  color: #c0392b;
  padding: 12px;
  border-radius: 8px;
  text-align: center;
}

.zib-chat-admin-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.zib-chat-admin-row input {
  min-width: 160px;
}

.zib-chat-mention-box {
  position: absolute;
  left: 16px;
  bottom: 130px;
  width: 280px;
  max-width: calc(100% - 32px);
  background: #ffffff;
  border: 1px solid #e5e5e5;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  padding: 10px;
  z-index: 20;
}

.zib-chat-context-menu {
  position: fixed;
  min-width: 120px;
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  padding: 6px;
  z-index: 50;
}

.zib-chat-context-menu button,
.zib-chat-context-menu a {
  width: 100%;
  text-align: left;
  background: transparent;
  border: none;
  padding: 6px 8px;
  border-radius: 6px;
  cursor: pointer;
  display: block;
  text-decoration: none;
  color: inherit;
}

.zib-chat-context-menu button:hover,
.zib-chat-context-menu a:hover {
  background: #f2f7ff;
}

.zib-chat-context-menu button.is-disabled,
.zib-chat-context-menu button:disabled,
.zib-chat-context-menu a.is-disabled {
  color: #999;
  cursor: not-allowed;
  background: transparent;
  pointer-events: none;
}

.zib-chat-mention-head {
  font-size: 13px;
  color: #555;
  margin-bottom: 6px;
}

.zib-chat-mention-search {
  width: 100%;
  border: 1px solid #e5e5e5;
  border-radius: 6px;
  padding: 6px 8px;
  margin-bottom: 8px;
}

.zib-chat-mention-list {
  max-height: 180px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.zib-chat-mention-item {
  text-align: left;
  background: #f7f7f7;
  border: none;
  padding: 6px 8px;
  border-radius: 6px;
  cursor: pointer;
}

.zib-chat-mention-item:hover {
  background: #e9f8ef;
}

.zib-chat-mention-empty {
  font-size: 12px;
  color: #999;
  padding: 6px 0;
}

@media (max-width: 640px) {
  .zib-chat-announce-btn span,
  .zib-chat-notify-btn span,
  .zib-chat-share-btn span {
    display: none;
  }

  .zib-chat-messages {
    height: 350px;
  }

  .zib-chat-bubble {
    max-width: 80%;
  }

  .zib-chat-mention-box {
    left: 8px;
    bottom: 140px;
    max-width: calc(100% - 16px);
  }

  .zib-chat-modal {
    align-items: center;
    padding-top: calc(12px + env(safe-area-inset-top));
    padding-bottom: calc(12px + env(safe-area-inset-bottom));
  }

  .zib-chat-meeting-volume-range {
    width: 70px;
  }

  .zib-chat-meeting-actions {
    align-items: stretch;
  }

  .zib-chat-meeting-volume {
    width: 100%;
    justify-content: space-between;
    padding: 4px 8px;
  }

  .zib-chat-meeting-volume span:first-child {
    font-size: 11px;
  }

  .zib-chat-meeting-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }

  .zib-chat-meeting-info {
    width: 100%;
    min-width: 0;
  }

  .zib-chat-meeting-title,
  .zib-chat-meeting-sub {
    max-width: 100%;
    word-break: break-word;
  }

  .zib-chat-meeting-sub {
    white-space: normal;
  }

  .zib-chat-meeting-actions {
    width: 100%;
  }

  .zib-chat-modal-dialog {
    width: calc(100% - 24px);
    max-width: none;
    padding: 12px;
    max-height: calc(100vh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    overflow: hidden;
  }

  .zib-chat-meeting-modal {
    align-items: flex-start;
    padding-top: calc(6px + env(safe-area-inset-top));
    padding-bottom: calc(10px + env(safe-area-inset-bottom));
  }

  .zib-chat-meeting-modal .zib-chat-meeting-dialog {
    width: calc(100% - 28px);
    max-width: 420px;
    margin: clamp(8px, 6vh, 56px) auto clamp(10px, 8vh, 72px);
    max-height: calc(100dvh - 120px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    display: flex;
    flex-direction: column;
  }

  .zib-chat-meeting-body {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .zib-chat-meeting-create {
    flex-direction: column;
    align-items: stretch;
  }

  .zib-chat-meeting-create-btn {
    width: 100%;
  }

  .zib-chat-redpack-modal .zib-chat-redpack-form {
    overflow-y: auto;
    max-height: calc(100vh - 260px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    padding-bottom: 16px;
  }

  .zib-chat-redpack-count-row {
    flex-direction: column;
    align-items: stretch;
  }

  .zib-chat-redpack-fill-count {
    width: 100%;
  }

  .zib-chat-redpack-userlist {
    max-height: 140px;
  }

  .zib-chat-redpack-cover-img {
    width: 64px;
    height: 64px;
  }

  .zib-chat-redpack-open-claims {
    max-height: 150px;
  }

  .zib-chat-redpack-hint {
    margin: 8px 0;
  }

  .zib-chat-image img {
    width: 110px;
    height: 110px;
  }

  .zib-chat-video {
    width: 150px;
  }

  .zib-chat-video-cover {
    height: 90px;
  }

  .zib-chat-meta {
    gap: 1px;
    flex-wrap: wrap;
    font-size: 11px;
  }

  .zib-chat-meta .zib-chat-role,
  .zib-chat-meta .zib-chat-name-pill {
    font-size: 11px;
    padding: 1px 6px;
  }

  .zib-chat-time {
    font-size: 10px;
    padding: 1px 5px;
  }

  .zib-chat-tools .btn-input-expand,
  .zib-chat-tools .zib-chat-more-btn,
  .zib-chat-tools .zib-chat-image-btn,
  .zib-chat-tools .zib-chat-video-btn,
  .zib-chat-tools .zib-chat-redpack-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    height: 32px;
    min-width: 32px;
    padding: 4px 8px;
  }

  .zib-chat-tools .zib-chat-image-btn,
  .zib-chat-tools .zib-chat-video-btn,
  .zib-chat-tools .zib-chat-redpack-btn,
  .zib-chat-tools .zib-chat-meeting-btn {
    display: none;
  }

  .zib-chat-tools .zib-chat-more-btn {
    display: inline-flex;
  }

  .zib-chat-send-btn span {
    display: none;
  }

  .zib-chat-send-btn {
    justify-content: center;
    padding: 6px 10px;
    min-width: 36px;
  }

  .zib-chat-actions-right .zib-chat-tool-icon {
    width: 22px;
    height: 22px;
  }

  .zib-chat-standalone .zib-chat-form textarea {
    font-size: 16px;
  }
}

.zib-chat-scroll-tools {
  bottom: calc(var(--zib-chat-form-offset, 120px) + 80px) !important;
}
