/* Final guard: all chat bubbles and appearance previews use rounded bodies only. */
#app .message-row .bubble::before,
#app .message-row .bubble::after,
#app .screen-chat .message-row .bubble::before,
#app .screen-chat .message-row .bubble::after,
#app .screen-chat[data-chat-bubble-style] .message-row .bubble::before,
#app .screen-chat[data-chat-bubble-style] .message-row .bubble::after,
.settings-page-v2 .settings-demo-bubble::before,
.settings-page-v2 .settings-demo-bubble::after,
.settings-demo-bubble::before,
.settings-demo-bubble::after {
  content: none !important;
  display: none !important;
  position: static !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  clip-path: none !important;
  transform: none !important;
}

#app .screen-chat .message-row .bubble:not(.typing-bubble) {
  overflow: hidden !important;
}

#app .screen-chat[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .message-row .bubble:not(.typing-bubble),
#app[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .screen-chat .message-row .bubble:not(.typing-bubble) {
  font-size: 18px !important;
  line-height: 1.42 !important;
}

#app .screen-chat[data-chat-bubble-style="handdrawn"] .message-row .bubble:not(.typing-bubble),
#app .screen-chat[data-chat-bubble-style="handdrawn"] .message-row .bubble:not(.typing-bubble) .message-content,
#app[data-chat-bubble-style="handdrawn"] .screen-chat .message-row .bubble:not(.typing-bubble),
#app[data-chat-bubble-style="handdrawn"] .screen-chat .message-row .bubble:not(.typing-bubble) .message-content {
  font-size: 21px !important;
}

#app .screen-chat[data-chat-bubble-style="handdrawn"] .message-row .bubble:not(.typing-bubble),
#app[data-chat-bubble-style="handdrawn"] .screen-chat .message-row .bubble:not(.typing-bubble) {
  padding-right: 20px !important;
}

@media (max-width: 580px) {
  #app .screen-chat[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .message-row .bubble:not(.typing-bubble),
  #app[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .screen-chat .message-row .bubble:not(.typing-bubble) {
    font-size: 18px !important;
    line-height: 1.42 !important;
  }

  #app .screen-chat[data-chat-bubble-style="handdrawn"] .message-row .bubble:not(.typing-bubble),
  #app .screen-chat[data-chat-bubble-style="handdrawn"] .message-row .bubble:not(.typing-bubble) .message-content,
  #app[data-chat-bubble-style="handdrawn"] .screen-chat .message-row .bubble:not(.typing-bubble),
  #app[data-chat-bubble-style="handdrawn"] .screen-chat .message-row .bubble:not(.typing-bubble) .message-content {
    font-size: 21px !important;
  }

  #app .screen-chat[data-chat-bubble-style="handdrawn"] .message-row .bubble:not(.typing-bubble),
  #app[data-chat-bubble-style="handdrawn"] .screen-chat .message-row .bubble:not(.typing-bubble) {
    padding-right: 20px !important;
  }

  #app .screen-chat[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .message-bundle,
  #app[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .screen-chat .message-bundle,
  #app .screen-chat[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .message-row.assistant .bubble:not(.typing-bubble),
  #app .screen-chat[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .message-row.user .bubble:not(.typing-bubble),
  #app[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .screen-chat .message-row.assistant .bubble:not(.typing-bubble),
  #app[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .screen-chat .message-row.user .bubble:not(.typing-bubble) {
    max-width: calc(100% - 164px) !important;
  }

  #app .screen-chat[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .message-row.user .bubble:not(.typing-bubble),
  #app[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .screen-chat .message-row.user .bubble:not(.typing-bubble) {
    min-width: 0 !important;
  }
}

#app .screen-chat[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .message-row .bubble:not(.typing-bubble),
#app .screen-chat[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .message-row .bubble:not(.typing-bubble) .message-content,
#app[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .screen-chat .message-row .bubble:not(.typing-bubble),
#app[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .screen-chat .message-row .bubble:not(.typing-bubble) .message-content {
  font-size: 21px !important;
  line-height: 1.46 !important;
}

#app .screen-chat[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .message-row .bubble:not(.typing-bubble),
#app[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .screen-chat .message-row .bubble:not(.typing-bubble) {
  padding: 10px 20px 10px 20px !important;
}

#app .screen-chat[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .message-row.assistant .bubble:not(.typing-bubble),
#app .screen-chat[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .message-row.user .bubble:not(.typing-bubble),
#app[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .screen-chat .message-row.assistant .bubble:not(.typing-bubble),
#app[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .screen-chat .message-row.user .bubble:not(.typing-bubble) {
  min-width: 0 !important;
  width: fit-content !important;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="default"] .bubble:not(.typing-bubble) {
  box-sizing: border-box !important;
  max-width: 100% !important;
  min-height: 42px !important;
  padding: 8px 12px 9px !important;
  border: 1.5px solid #d7ccee !important;
  border-radius: 24px 8px 24px 8px !important;
  background-color: var(--bubble-white) !important;
  background-image: none !important;
  color: #111 !important;
  font-size: 18px !important;
  line-height: 1.48 !important;
  box-shadow: 0 1px 0 rgb(0 0 0 / 2%) !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="default"] .bubble:not(.typing-bubble) .message-content {
  font-size: 18px !important;
  line-height: 1.48 !important;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .bubble:not(.typing-bubble) {
  box-sizing: border-box !important;
  max-width: 100% !important;
  min-height: var(--group-bubble-min-height, 45px) !important;
  padding: 10px 20px 10px 20px !important;
  border: var(--group-bubble-border-width, 1.5px) var(--group-bubble-border-style, solid) var(--group-bubble-border, #d7ccee) !important;
  border-radius: var(--group-bubble-radius, 24px) !important;
  background-color: var(--group-bubble-bg-color, #ffffff) !important;
  background-image: var(--group-bubble-bg-image, none) !important;
  background-size: var(--group-bubble-background-size, auto) !important;
  background-position: var(--group-bubble-background-position, 0 0) !important;
  background-repeat: no-repeat !important;
  color: var(--group-bubble-color, #24303a) !important;
  font-size: 21px !important;
  line-height: 1.46 !important;
  box-shadow: var(--group-bubble-shadow, 0 8px 18px rgb(95 133 168 / 12%), inset 0 1px 0 rgb(255 255 255 / 78%)) !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style]:not([data-chat-bubble-style="default"]) .bubble:not(.typing-bubble) .message-content {
  font-size: 21px !important;
  line-height: 1.46 !important;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="round"] {
  --group-bubble-bg-color: #ffffff;
  --group-bubble-bg-image: linear-gradient(180deg, #ffffff 0%, #eff8ff 100%);
  --group-bubble-border: #abcdea;
  --group-bubble-radius: 25px;
  --group-bubble-shadow: 0 8px 18px rgb(93 148 199 / 13%), inset 0 1px 0 rgb(255 255 255 / 78%);
  --group-bubble-color: #25303a;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="simple"] {
  --group-bubble-bg-color: #ffffff;
  --group-bubble-border: #d8e6f2;
  --group-bubble-radius: 18px;
  --group-bubble-shadow: 0 8px 18px rgb(44 78 110 / 8%), inset 0 1px 0 rgb(255 255 255 / 78%);
  --group-bubble-color: #25303a;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="classic"] {
  --group-bubble-bg-color: #ffffff;
  --group-bubble-border-width: 1px;
  --group-bubble-border: #e8e8e8;
  --group-bubble-radius: 6px;
  --group-bubble-min-height: 42px;
  --group-bubble-shadow: 0 1px 0 rgb(0 0 0 / 4%);
  --group-bubble-color: #111;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="wave"] {
  --group-bubble-bg-color: #ffffff;
  --group-bubble-bg-image:
    radial-gradient(ellipse at 16% 78%, rgb(184 218 248 / 48%) 0 12px, transparent 13px),
    linear-gradient(180deg, #ffffff 0%, #edf7ff 100%);
  --group-bubble-border: #9fc9ed;
  --group-bubble-radius: 45% 55% 50% 50% / 55% 45% 55% 45%;
  --group-bubble-shadow: 0 8px 18px rgb(80 145 205 / 14%), inset 0 1px 0 rgb(255 255 255 / 78%);
  --group-bubble-color: #25303a;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="dashed"] {
  --group-bubble-bg-color: #ffffff;
  --group-bubble-bg-image: linear-gradient(180deg, #ffffff 0%, #f5fbff 100%);
  --group-bubble-border-style: dashed;
  --group-bubble-border: #93bddf;
  --group-bubble-radius: 22px;
  --group-bubble-shadow: 0 8px 18px rgb(80 145 205 / 10%), inset 0 1px 0 rgb(255 255 255 / 78%);
  --group-bubble-color: #25303a;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="kitty"] {
  --group-bubble-bg-color: #ffffff;
  --group-bubble-bg-image:
    radial-gradient(circle at 82% 70%, #62686c 0 4px, transparent 4.5px),
    radial-gradient(circle at 77% 64%, #8d9397 0 8px, transparent 8.5px),
    radial-gradient(circle at 19% 27%, #8bb5df 0 2px, transparent 2.6px),
    linear-gradient(180deg, #ffffff 0%, #eff7ff 100%);
  --group-bubble-border: #a9c9e9;
  --group-bubble-radius: 22px 22px 19px 19px;
  --group-bubble-shadow: 0 8px 18px rgb(95 133 168 / 13%), inset 0 1px 0 rgb(255 255 255 / 78%);
  --group-bubble-color: #25303a;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="heart"] {
  --group-bubble-bg-color: #fffdfd;
  --group-bubble-bg-image:
    radial-gradient(circle at 84% 20%, #ff9bb4 0 4px, transparent 4.5px),
    radial-gradient(circle at 78% 20%, #ff9bb4 0 4px, transparent 4.5px),
    linear-gradient(45deg, transparent 77%, #ff9bb4 78% 84%, transparent 85%),
    linear-gradient(180deg, #fffdfd 0%, #fff1f6 100%);
  --group-bubble-border: #f1adc0;
  --group-bubble-radius: 23px;
  --group-bubble-shadow: 0 8px 18px rgb(236 128 160 / 15%), inset 0 1px 0 rgb(255 255 255 / 78%);
  --group-bubble-color: #25303a;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="stars"] {
  --group-bubble-bg-color: #ffffff;
  --group-bubble-bg-image:
    radial-gradient(circle at 18% 27%, #ffd95d 0 2.5px, transparent 3px),
    radial-gradient(circle at 84% 19%, #ffe88b 0 3px, transparent 3.5px),
    radial-gradient(circle at 78% 76%, #8bb5df 0 2px, transparent 2.5px),
    linear-gradient(180deg, #ffffff 0%, #eef7ff 100%);
  --group-bubble-border: #9fc8ea;
  --group-bubble-radius: 22px 12px 22px 12px;
  --group-bubble-shadow: 0 8px 18px rgb(80 145 205 / 13%), inset 0 1px 0 rgb(255 255 255 / 78%);
  --group-bubble-color: #25303a;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="blossom"] {
  --group-bubble-bg-color: #fffefe;
  --group-bubble-bg-image:
    radial-gradient(circle at 80% 18%, #ff91a9 0 3px, transparent 3.5px),
    radial-gradient(circle at 86% 24%, #ff91a9 0 3px, transparent 3.5px),
    radial-gradient(circle at 76% 27%, #ffb6c7 0 2.5px, transparent 3px),
    radial-gradient(circle at 17% 76%, #ffd4df 0 2.5px, transparent 3px),
    linear-gradient(180deg, #fffefe 0%, #fff1f5 100%);
  --group-bubble-border: #f1b0c2;
  --group-bubble-radius: 24px;
  --group-bubble-shadow: 0 8px 18px rgb(236 128 160 / 14%), inset 0 1px 0 rgb(255 255 255 / 78%);
  --group-bubble-color: #25303a;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="leaf"] {
  --group-bubble-bg-color: #ffffff;
  --group-bubble-bg-image:
    radial-gradient(ellipse at 15% 28%, #62b77d 0 4px, transparent 4.5px),
    radial-gradient(ellipse at 88% 24%, #89d19b 0 4px, transparent 4.5px),
    linear-gradient(180deg, #ffffff 0%, #f0fbf3 100%);
  --group-bubble-border: #8ec99f;
  --group-bubble-radius: 22px 12px 22px 12px;
  --group-bubble-shadow: 0 8px 18px rgb(104 177 128 / 14%), inset 0 1px 0 rgb(255 255 255 / 78%);
  --group-bubble-color: #25303a;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="pearl"] {
  --group-bubble-bg-color: #ffffff;
  --group-bubble-bg-image:
    radial-gradient(circle at 86% 22%, #ffffff 0 5px, #bfd7f2 5.5px 6.5px, transparent 7px),
    radial-gradient(circle at 16% 76%, #ffffff 0 4px, #d7e8f8 4.5px 5.5px, transparent 6px),
    linear-gradient(180deg, #ffffff 0%, #eff8ff 100%);
  --group-bubble-border: #b9d3ee;
  --group-bubble-radius: 26px;
  --group-bubble-shadow: 0 8px 18px rgb(118 162 204 / 13%), inset 0 1px 0 rgb(255 255 255 / 78%);
  --group-bubble-color: #25303a;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="gradient"] {
  --group-bubble-bg-color: #fff3f8;
  --group-bubble-bg-image: linear-gradient(135deg, #f8f4ff 0%, #edf7ff 48%, #fff3f8 100%);
  --group-bubble-border: #c9b6ef;
  --group-bubble-radius: 24px;
  --group-bubble-shadow: 0 8px 18px rgb(158 130 220 / 14%), inset 0 1px 0 rgb(255 255 255 / 78%);
  --group-bubble-color: #25303a;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="rainbow"] {
  --group-bubble-bg-color: #fff3dc;
  --group-bubble-bg-image:
    radial-gradient(circle at 20% 76%, #ffffff 0 8px, transparent 8.5px),
    conic-gradient(from 180deg at 26% 74%, #ff7777, #ffd75a, #73d687, #74b7ff, #ff7777 42%, transparent 43%),
    linear-gradient(135deg, #fff8fb 0%, #eaf5ff 42%, #fff3dc 100%);
  --group-bubble-border: #f2acc0;
  --group-bubble-radius: 24px;
  --group-bubble-shadow: 0 8px 18px rgb(126 170 220 / 14%), inset 0 1px 0 rgb(255 255 255 / 78%);
  --group-bubble-color: #25303a;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="moon"] {
  --group-bubble-bg-color: #ffffff;
  --group-bubble-bg-image:
    radial-gradient(circle at 84% 24%, #ffd665 0 5px, transparent 5.5px),
    radial-gradient(circle at 87% 20%, #f8fbff 0 5px, transparent 5.5px),
    radial-gradient(circle at 17% 76%, #9fc8ea 0 2px, transparent 2.5px),
    linear-gradient(180deg, #ffffff 0%, #eef6ff 100%);
  --group-bubble-border: #a9c6e8;
  --group-bubble-radius: 24px 10px 24px 10px;
  --group-bubble-shadow: 0 8px 18px rgb(80 145 205 / 13%), inset 0 1px 0 rgb(255 255 255 / 78%);
  --group-bubble-color: #25303a;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="icecream"] {
  --group-bubble-bg-color: #ffffff;
  --group-bubble-bg-image:
    linear-gradient(180deg, #fff0d8 0 24%, transparent 25%),
    radial-gradient(circle at 80% 16%, #ff6574 0 4px, transparent 4.5px),
    radial-gradient(circle at 22% 28%, #ffe0a9 0 3px, transparent 3.5px),
    linear-gradient(180deg, #ffffff 0%, #eff8ff 100%);
  --group-bubble-border: #b9d3ee;
  --group-bubble-radius: 24px 24px 18px 18px;
  --group-bubble-shadow: 0 8px 18px rgb(118 162 204 / 13%), inset 0 1px 0 rgb(255 255 255 / 78%);
  --group-bubble-color: #25303a;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="candy"] {
  --group-bubble-bg-color: #f6f0ff;
  --group-bubble-bg-image:
    radial-gradient(circle at 84% 20%, #ff85a8 0 5px, transparent 5.5px),
    repeating-linear-gradient(45deg, transparent 0 12px, rgb(255 255 255 / 52%) 12px 16px, transparent 16px 28px),
    linear-gradient(135deg, #f6f0ff 0%, #fff1f7 100%);
  --group-bubble-border: #c9b6ef;
  --group-bubble-radius: 24px 13px 24px 13px;
  --group-bubble-shadow: 0 8px 18px rgb(158 130 220 / 14%), inset 0 1px 0 rgb(255 255 255 / 78%);
  --group-bubble-color: #25303a;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="orange"] {
  --group-bubble-bg-color: #fff4d3;
  --group-bubble-bg-image: linear-gradient(180deg, #fff4d3 0%, #ffd266 100%);
  --group-bubble-border: #f0a13d;
  --group-bubble-radius: 26px;
  --group-bubble-shadow: 0 8px 18px rgb(223 143 49 / 14%), inset 0 1px 0 rgb(255 255 255 / 78%);
  --group-bubble-color: #4c2b12;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="pink-cat"] {
  --group-bubble-bg-color: #fff8fb;
  --group-bubble-bg-image: linear-gradient(135deg, #fff8fb 0%, #ffd5e4 100%);
  --group-bubble-border: #f3a0ba;
  --group-bubble-radius: 26px;
  --group-bubble-shadow: 0 8px 18px rgb(222 109 147 / 13%), inset 0 1px 0 rgb(255 255 255 / 78%);
  --group-bubble-color: #44313a;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="garlic-bird"] {
  --group-bubble-bg-color: #fbffe9;
  --group-bubble-bg-image: linear-gradient(135deg, #fbffe9 0%, #b9e64a 100%);
  --group-bubble-border: #acd650;
  --group-bubble-radius: 24px;
  --group-bubble-shadow: 0 8px 18px rgb(130 177 43 / 13%), inset 0 1px 0 rgb(255 255 255 / 78%);
  --group-bubble-color: #253317;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="cotton-cloud"] {
  --group-bubble-min-height: 42px;
  --group-bubble-bg-color: #fbfeff;
  --group-bubble-bg-image: linear-gradient(180deg, #fbfeff 0%, #eefaff 100%);
  --group-bubble-background-size: auto;
  --group-bubble-background-position: center;
  --group-bubble-border-width: 2px;
  --group-bubble-border: #a9ddf5;
  --group-bubble-radius: 999px;
  --group-bubble-shadow: 0 8px 18px rgb(75 166 218 / 12%), inset 0 1px 0 rgb(255 255 255 / 82%);
  --group-bubble-color: #26323a;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="strawberry-milkshake"] {
  --group-bubble-min-height: 44px;
  --group-bubble-bg-color: #fffdfd;
  --group-bubble-bg-image: linear-gradient(180deg, #fffdfd 0%, #fff2f6 100%);
  --group-bubble-background-size: auto;
  --group-bubble-background-position: center;
  --group-bubble-border-width: 1.5px;
  --group-bubble-border: #f5b6c8;
  --group-bubble-radius: 16px;
  --group-bubble-shadow: 0 8px 18px rgb(230 112 145 / 12%), inset 0 1px 0 rgb(255 255 255 / 86%);
  --group-bubble-color: #303241;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="star"] {
  --group-bubble-min-height: 46px;
  --group-bubble-bg-color: #f8fbff;
  --group-bubble-bg-image:
    url("./assets/chat-bubbles/star-cat/ribbon.png"),
    url("./assets/chat-bubbles/star-cat/cat.png"),
    url("./assets/chat-bubbles/star-cat/star-blue.png"),
    url("./assets/chat-bubbles/star-cat/star-soft.png"),
    radial-gradient(circle at 19% 73%, rgb(142 183 223 / 70%) 0 2px, transparent 2.6px),
    radial-gradient(circle at 27% 30%, rgb(185 211 239 / 80%) 0 1.8px, transparent 2.4px),
    radial-gradient(circle at 74% 28%, rgb(141 183 224 / 62%) 0 1.7px, transparent 2.3px),
    linear-gradient(180deg, rgb(255 255 255 / 96%) 0%, rgb(242 248 255 / 98%) 100%);
  --group-bubble-background-size: 33px 33px, 39px 39px, 11px 11px, 18px 18px, auto, auto, auto, auto;
  --group-bubble-background-position: 15px 6px, calc(100% - 42px) calc(100% - 31px), 47px calc(100% - 14px), calc(100% - 16px) 9px, 0 0, 0 0, 0 0, 0 0;
  --group-bubble-border: #a9c9e9;
  --group-bubble-radius: 23px;
  --group-bubble-shadow: 0 9px 20px rgb(95 133 168 / 12%), inset 0 1px 0 rgb(255 255 255 / 86%);
  --group-bubble-color: #25303a;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="sticker"] {
  --group-bubble-min-height: 46px;
  --group-bubble-bg-color: #fffefe;
  --group-bubble-bg-image:
    url("./assets/chat-bubbles/romantic-flower/1.png"),
    url("./assets/chat-bubbles/romantic-flower/2.png"),
    radial-gradient(circle at 16% 28%, rgb(255 173 190 / 60%) 0 2px, transparent 2.6px),
    linear-gradient(180deg, rgb(255 255 255 / 98%) 0%, rgb(255 247 250 / 0) 100%);
  --group-bubble-background-size: 40px 40px, 30px 30px, auto, auto;
  --group-bubble-background-position: calc(100% - 44px) calc(100% - 30px), 14px 7px, 0 0, 0 0;
  --group-bubble-border: #f2b8c6;
  --group-bubble-radius: 23px;
  --group-bubble-shadow: 0 9px 20px rgb(221 125 150 / 12%), inset 0 1px 0 rgb(255 255 255 / 88%);
  --group-bubble-color: #30313a;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="cloud"] {
  --group-bubble-min-height: 48px;
  --group-bubble-bg-color: #f9fcff;
  --group-bubble-bg-image:
    url("./assets/chat-bubbles/cloud-candy/3.png"),
    url("./assets/chat-bubbles/cloud-candy/4.png"),
    linear-gradient(180deg, rgb(255 255 255 / 98%) 0%, rgb(242 248 255 / 96%) 100%);
  --group-bubble-background-size: 38px 38px, 34px 34px, auto;
  --group-bubble-background-position: 9px 5px, calc(100% - 42px) calc(100% - 30px), 0 0;
  --group-bubble-border: #b8d4ee;
  --group-bubble-radius: 26px 23px 25px 22px;
  --group-bubble-shadow: 0 9px 20px rgb(92 145 199 / 14%), inset 0 1px 0 rgb(255 255 255 / 90%);
  --group-bubble-color: #263544;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="handdrawn"] {
  --group-bubble-min-height: 45px;
  --group-bubble-bg-color: rgb(255 255 255 / 96%);
  --group-bubble-bg-image: url("./assets/chat-bubbles/handdrawn-simple/3.png");
  --group-bubble-background-size: 16px 16px;
  --group-bubble-background-position: right 4px top 8px;
  --group-bubble-border: #5a5a5a;
  --group-bubble-radius: 22px 9px 22px 9px;
  --group-bubble-shadow: 0 8px 18px rgb(60 60 60 / 8%);
  --group-bubble-color: #20232a;
}

/* Group chat members inherit each sender's private bubble skin; the user's own group
   bubble still follows the current page-wide style. */

/* Final orange-cat override after the no-tail overflow clamp. */
#app .screen-chat[data-chat-bubble-style="orange"] .message-row .bubble.bubble-orange-cat:not(.typing-bubble),
#app[data-chat-bubble-style="orange"] .screen-chat .message-row .bubble.bubble-orange-cat:not(.typing-bubble),
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="orange"] .bubble.bubble-orange-cat:not(.typing-bubble),
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="orange"] .message-row .bubble:not(.typing-bubble) {
  position: relative !important;
  overflow: visible !important;
  padding: 10px 22px 10px 76px !important;
}

#app .screen-chat[data-chat-bubble-style="orange"] .message-row .bubble .orange-cat-deco,
#app[data-chat-bubble-style="orange"] .screen-chat .message-row .bubble .orange-cat-deco,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="orange"] .bubble .orange-cat-deco,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="orange"] .message-row .bubble .orange-cat-deco {
  position: absolute !important;
  left: -24px !important;
  top: -34px !important;
  width: 118px !important;
  height: 69px !important;
  display: block !important;
  background: url("./assets/chat-bubbles/orange-cat/cat-sticker.png") center / contain no-repeat !important;
  pointer-events: none !important;
  z-index: 3 !important;
}

#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="orange"] .message-content {
  position: relative !important;
  z-index: 4 !important;
}

#app .settings-page-v2 .settings-bubble-card-preview.is-real-bubble-preview {
  overflow: visible !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="orange"].is-mini.is-card {
  height: 86px !important;
  grid-template-rows: 42px 32px !important;
  overflow: visible !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="orange"].is-mini.is-card .message-row .bubble:not(.typing-bubble) {
  width: min(88px, 100%) !important;
  max-width: 88px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 13px 8px 3px 34px !important;
  overflow: visible !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="orange"].is-mini.is-card .message-row.user .bubble:not(.typing-bubble) {
  width: min(72px, 100%) !important;
  max-width: 72px !important;
  height: 32px !important;
  min-height: 32px !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="orange"].is-mini.is-card .message-row .bubble .orange-cat-deco {
  left: -10px !important;
  top: -16px !important;
  width: 56px !important;
  height: 33px !important;
}

/* Final sketch-outline override: corner decorations only, multiline bubbles only. */
.screen-chat[data-chat-bubble-style="sketch-outline"] .message-row .bubble.bubble-sketch-outline:not(.typing-bubble),
#app[data-chat-bubble-style="sketch-outline"] .screen-chat:not(.settings-bubble-real-preview) .message-row .bubble.bubble-sketch-outline:not(.typing-bubble),
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="sketch-outline"] .bubble.bubble-sketch-outline:not(.typing-bubble),
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"] .message-row .bubble:not(.typing-bubble) {
  position: relative !important;
  overflow: visible !important;
  isolation: isolate !important;
}

.screen-chat[data-chat-bubble-style="sketch-outline"] .message-row .bubble .cute-leopard-deco,
#app[data-chat-bubble-style="sketch-outline"] .screen-chat:not(.settings-bubble-real-preview) .message-row .bubble .cute-leopard-deco,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="sketch-outline"] .bubble .cute-leopard-deco,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"] .message-row .bubble .cute-leopard-deco {
  position: absolute !important;
  display: none !important;
  pointer-events: none !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
  z-index: 5 !important;
}

.screen-chat[data-chat-bubble-style="sketch-outline"] .message-row .bubble.is-sketch-multiline .cute-leopard-deco,
#app[data-chat-bubble-style="sketch-outline"] .screen-chat:not(.settings-bubble-real-preview) .message-row .bubble.is-sketch-multiline .cute-leopard-deco,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="sketch-outline"] .bubble.is-sketch-multiline .cute-leopard-deco,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"] .message-row .bubble.is-sketch-multiline .cute-leopard-deco {
  display: block !important;
}

.screen-chat[data-chat-bubble-style="sketch-outline"] .message-row .bubble .cute-leopard-tail,
#app[data-chat-bubble-style="sketch-outline"] .screen-chat:not(.settings-bubble-real-preview) .message-row .bubble .cute-leopard-tail,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="sketch-outline"] .bubble .cute-leopard-tail,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"] .message-row .bubble .cute-leopard-tail {
  left: -12px !important;
  top: -24px !important;
  width: 42px !important;
  height: 42px !important;
  background-image: url("./assets/chat-bubbles/cute-leopard/tail.png") !important;
}

.screen-chat[data-chat-bubble-style="sketch-outline"] .message-row .bubble .cute-leopard-ice-big,
#app[data-chat-bubble-style="sketch-outline"] .screen-chat:not(.settings-bubble-real-preview) .message-row .bubble .cute-leopard-ice-big,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="sketch-outline"] .bubble .cute-leopard-ice-big,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"] .message-row .bubble .cute-leopard-ice-big {
  left: -3px !important;
  bottom: -12px !important;
  width: 30px !important;
  height: 30px !important;
  background-image: url("./assets/chat-bubbles/cute-leopard/ice-big.png") !important;
}

.screen-chat[data-chat-bubble-style="sketch-outline"] .message-row .bubble .cute-leopard-ice-small,
#app[data-chat-bubble-style="sketch-outline"] .screen-chat:not(.settings-bubble-real-preview) .message-row .bubble .cute-leopard-ice-small,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="sketch-outline"] .bubble .cute-leopard-ice-small,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"] .message-row .bubble .cute-leopard-ice-small {
  left: -15px !important;
  bottom: 10px !important;
  width: 18px !important;
  height: 18px !important;
  background-image: url("./assets/chat-bubbles/cute-leopard/ice-small.png") !important;
}

.screen-chat[data-chat-bubble-style="sketch-outline"] .message-row .bubble .cute-leopard-head,
#app[data-chat-bubble-style="sketch-outline"] .screen-chat:not(.settings-bubble-real-preview) .message-row .bubble .cute-leopard-head,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="sketch-outline"] .bubble .cute-leopard-head,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"] .message-row .bubble .cute-leopard-head {
  right: -15px !important;
  top: -16px !important;
  width: 78px !important;
  height: 78px !important;
  background-image: url("./assets/chat-bubbles/cute-leopard/head.png?v=20260731-cuteleopard13") !important;
}

.screen-chat[data-chat-bubble-style="sketch-outline"] .message-row .bubble .cute-leopard-drink,
#app[data-chat-bubble-style="sketch-outline"] .screen-chat:not(.settings-bubble-real-preview) .message-row .bubble .cute-leopard-drink,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="sketch-outline"] .bubble .cute-leopard-drink,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"] .message-row .bubble .cute-leopard-drink {
  right: -6px !important;
  bottom: -14px !important;
  width: 48px !important;
  height: 48px !important;
  transform: rotate(6deg) !important;
  transform-origin: 50% 50% !important;
  background-image: url("./assets/chat-bubbles/cute-leopard/drink.png") !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"].is-mini.is-card .message-row .bubble .cute-leopard-tail {
  left: -8px !important;
  top: -8px !important;
  width: 24px !important;
  height: 24px !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"].is-mini.is-card .message-row .bubble .cute-leopard-ice-big {
  left: -7px !important;
  bottom: -8px !important;
  width: 16px !important;
  height: 16px !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"].is-mini.is-card .message-row .bubble .cute-leopard-ice-small {
  left: -16px !important;
  bottom: -5px !important;
  width: 10px !important;
  height: 10px !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"].is-mini.is-card .message-row .bubble .cute-leopard-head {
  right: -6px !important;
  top: -8px !important;
  width: 40px !important;
  height: 40px !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"].is-mini.is-card .message-row .bubble .cute-leopard-drink {
  right: -10px !important;
  bottom: -8px !important;
  width: 24px !important;
  height: 24px !important;
}

/* Final hard override: sketch-outline is a plain rounded bubble now. */
.screen-chat[data-chat-bubble-style="sketch-outline"],
#app[data-chat-bubble-style="sketch-outline"] .screen-chat:not(.settings-bubble-real-preview),
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="sketch-outline"] {
  --sketch-outline-bg: none !important;
  --skin-min-height: 46px !important;
  --skin-radius: 24px !important;
  --skin-border-width: 1.5px !important;
  --skin-border-style: solid !important;
  --skin-left-border: #2f2f2f !important;
  --skin-right-border: #2f2f2f !important;
  --skin-left-bg: var(--bubble-white) !important;
  --skin-right-bg: var(--bubble-white) !important;
  --skin-left-tail-bg: var(--bubble-white) !important;
  --skin-right-tail-bg: var(--bubble-white) !important;
  --skin-left-shadow: none !important;
  --skin-right-shadow: none !important;
  --skin-text: #111 !important;
}

.screen-chat[data-chat-bubble-style="sketch-outline"] .message-row .bubble:not(.typing-bubble),
#app[data-chat-bubble-style="sketch-outline"] .screen-chat:not(.settings-bubble-real-preview) .message-row .bubble:not(.typing-bubble),
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="sketch-outline"] .bubble:not(.typing-bubble),
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"] .message-row .bubble:not(.typing-bubble) {
  box-sizing: border-box !important;
  min-height: 46px !important;
  padding: 8px 14px 9px !important;
  border: 1.5px solid #2f2f2f !important;
  border-radius: 24px !important;
  background: var(--bubble-white) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #111 !important;
  font-size: 21px !important;
  line-height: 1.46 !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

.screen-chat[data-chat-bubble-style="sketch-outline"] .message-row.assistant .bubble:not(.typing-bubble),
#app[data-chat-bubble-style="sketch-outline"] .screen-chat:not(.settings-bubble-real-preview) .message-row.assistant .bubble:not(.typing-bubble),
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"] .message-row.assistant .bubble:not(.typing-bubble) {
  padding-right: 28px !important;
}

.screen-chat[data-chat-bubble-style="sketch-outline"] .message-row .bubble .sketch-outline-frame,
#app[data-chat-bubble-style="sketch-outline"] .screen-chat:not(.settings-bubble-real-preview) .message-row .bubble .sketch-outline-frame,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="sketch-outline"] .bubble .sketch-outline-frame,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"] .message-row .bubble .sketch-outline-frame {
  display: none !important;
}

/* Final pink-cat override after the no-tail overflow clamp. */
#app .screen-chat[data-chat-bubble-style="pink-cat"] .message-row .bubble.bubble-pink-cat:not(.typing-bubble),
#app[data-chat-bubble-style="pink-cat"] .screen-chat .message-row .bubble.bubble-pink-cat:not(.typing-bubble),
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="pink-cat"] .bubble.bubble-pink-cat:not(.typing-bubble),
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="pink-cat"] .message-row .bubble:not(.typing-bubble) {
  position: relative !important;
  overflow: visible !important;
  padding: 10px 44px 10px 20px !important;
}

#app .screen-chat[data-chat-bubble-style="pink-cat"] .message-row .bubble .pink-cat-deco,
#app[data-chat-bubble-style="pink-cat"] .screen-chat .message-row .bubble .pink-cat-deco,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="pink-cat"] .bubble .pink-cat-deco,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="pink-cat"] .message-row .bubble .pink-cat-deco {
  position: absolute !important;
  right: -24px !important;
  top: -48px !important;
  width: 96px !important;
  height: 96px !important;
  display: block !important;
  background: url("./assets/chat-bubbles/pink-cat/cat.png") center / contain no-repeat !important;
  pointer-events: none !important;
  z-index: 3 !important;
}

#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="pink-cat"] .message-content {
  position: relative !important;
  z-index: 4 !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="pink-cat"].is-mini.is-card .message-row .bubble:not(.typing-bubble) {
  width: min(88px, 100%) !important;
  max-width: 88px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 3px 24px 3px 8px !important;
  overflow: visible !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="pink-cat"].is-mini.is-card .message-row.user .bubble:not(.typing-bubble) {
  width: min(72px, 100%) !important;
  max-width: 72px !important;
  height: 32px !important;
  min-height: 32px !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="pink-cat"].is-mini.is-card .message-row .bubble .pink-cat-deco {
  right: -11px !important;
  top: -24px !important;
  width: 48px !important;
  height: 48px !important;
}

/* Final garlic-bird override after the no-tail overflow clamp. */
#app .screen-chat[data-chat-bubble-style="garlic-bird"] .message-row .bubble.bubble-garlic-bird:not(.typing-bubble),
#app[data-chat-bubble-style="garlic-bird"] .screen-chat .message-row .bubble.bubble-garlic-bird:not(.typing-bubble),
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="garlic-bird"] .bubble.bubble-garlic-bird:not(.typing-bubble),
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="garlic-bird"] .message-row .bubble:not(.typing-bubble) {
  position: relative !important;
  overflow: visible !important;
  padding: 10px 20px 10px 64px !important;
}

#app .screen-chat[data-chat-bubble-style="garlic-bird"] .message-row .bubble .garlic-bird-deco,
#app[data-chat-bubble-style="garlic-bird"] .screen-chat .message-row .bubble .garlic-bird-deco,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="garlic-bird"] .bubble .garlic-bird-deco,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="garlic-bird"] .message-row .bubble .garlic-bird-deco {
  position: absolute !important;
  left: -44px !important;
  bottom: -13px !important;
  width: 70px !important;
  height: 70px !important;
  display: block !important;
  background: url("./assets/chat-bubbles/garlic-bird/bird.png") center / contain no-repeat !important;
  pointer-events: none !important;
  z-index: 3 !important;
}

#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="garlic-bird"] .message-content {
  position: relative !important;
  z-index: 4 !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="garlic-bird"].is-mini.is-card .message-row .bubble:not(.typing-bubble) {
  width: min(88px, 100%) !important;
  max-width: 88px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 3px 8px 3px 28px !important;
  overflow: visible !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="garlic-bird"].is-mini.is-card .message-row.user .bubble:not(.typing-bubble) {
  width: min(72px, 100%) !important;
  max-width: 72px !important;
  height: 32px !important;
  min-height: 32px !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="garlic-bird"].is-mini.is-card .message-row .bubble .garlic-bird-deco {
  left: -18px !important;
  bottom: -7px !important;
  width: 34px !important;
  height: 34px !important;
}

/* Final cotton-cloud override after the no-tail overflow clamp. */
#app .screen-chat[data-chat-bubble-style="cotton-cloud"] .message-row .bubble.bubble-cotton-cloud:not(.typing-bubble),
#app[data-chat-bubble-style="cotton-cloud"] .screen-chat .message-row .bubble.bubble-cotton-cloud:not(.typing-bubble),
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="cotton-cloud"] .bubble.bubble-cotton-cloud:not(.typing-bubble),
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="cotton-cloud"] .message-row .bubble:not(.typing-bubble) {
  position: relative !important;
  overflow: visible !important;
  min-height: 42px !important;
  padding: 10px 24px !important;
  border: 2px solid #a9ddf5 !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #fbfeff 0%, #eefaff 100%) !important;
  box-shadow: 0 8px 18px rgb(75 166 218 / 12%), inset 0 1px 0 rgb(255 255 255 / 82%) !important;
  isolation: isolate !important;
  z-index: 0 !important;
}

#app .screen-chat[data-chat-bubble-style="cotton-cloud"] .message-row .bubble .cotton-cloud-deco,
#app[data-chat-bubble-style="cotton-cloud"] .screen-chat .message-row .bubble .cotton-cloud-deco,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="cotton-cloud"] .bubble .cotton-cloud-deco,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="cotton-cloud"] .message-row .bubble .cotton-cloud-deco {
  position: absolute !important;
  width: 30px !important;
  height: 30px !important;
  display: block !important;
  background: url("./assets/chat-bubbles/cotton-cloud/cloud.png") center / contain no-repeat !important;
  pointer-events: none !important;
  z-index: 5 !important;
}

#app .screen-chat[data-chat-bubble-style="cotton-cloud"] .message-row .bubble .cotton-cloud-tl,
#app[data-chat-bubble-style="cotton-cloud"] .screen-chat .message-row .bubble .cotton-cloud-tl,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="cotton-cloud"] .bubble .cotton-cloud-tl,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="cotton-cloud"] .message-row .bubble .cotton-cloud-tl {
  left: -11px !important;
  top: -13px !important;
}

#app .screen-chat[data-chat-bubble-style="cotton-cloud"] .message-row .bubble .cotton-cloud-tr,
#app[data-chat-bubble-style="cotton-cloud"] .screen-chat .message-row .bubble .cotton-cloud-tr,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="cotton-cloud"] .bubble .cotton-cloud-tr,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="cotton-cloud"] .message-row .bubble .cotton-cloud-tr {
  right: -11px !important;
  top: -13px !important;
}

#app .screen-chat[data-chat-bubble-style="cotton-cloud"] .message-row .bubble .cotton-cloud-bl,
#app[data-chat-bubble-style="cotton-cloud"] .screen-chat .message-row .bubble .cotton-cloud-bl,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="cotton-cloud"] .bubble .cotton-cloud-bl,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="cotton-cloud"] .message-row .bubble .cotton-cloud-bl {
  left: -11px !important;
  bottom: -13px !important;
}

#app .screen-chat[data-chat-bubble-style="cotton-cloud"] .message-row .bubble .cotton-cloud-br,
#app[data-chat-bubble-style="cotton-cloud"] .screen-chat .message-row .bubble .cotton-cloud-br,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="cotton-cloud"] .bubble .cotton-cloud-br,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="cotton-cloud"] .message-row .bubble .cotton-cloud-br {
  right: -11px !important;
  bottom: -13px !important;
}

#app .screen-chat[data-chat-bubble-style="cotton-cloud"] .message-row .bubble.bubble-cotton-cloud:not(.typing-bubble) .message-content,
#app[data-chat-bubble-style="cotton-cloud"] .screen-chat .message-row .bubble.bubble-cotton-cloud:not(.typing-bubble) .message-content,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="cotton-cloud"] .bubble.bubble-cotton-cloud:not(.typing-bubble) .message-content,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="cotton-cloud"] .message-row .bubble:not(.typing-bubble) .message-content,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="cotton-cloud"] .message-content {
  position: relative !important;
  z-index: 4 !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="cotton-cloud"].is-mini.is-card .message-row .bubble:not(.typing-bubble) {
  width: min(88px, 100%) !important;
  max-width: 88px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 5px 14px !important;
  overflow: visible !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="cotton-cloud"].is-mini.is-card .message-row.user .bubble:not(.typing-bubble) {
  width: min(72px, 100%) !important;
  max-width: 72px !important;
  height: 34px !important;
  min-height: 34px !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="cotton-cloud"].is-mini.is-card .message-row .bubble .cotton-cloud-deco {
  width: 18px !important;
  height: 18px !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="cotton-cloud"].is-mini.is-card .message-row .bubble .cotton-cloud-tl {
  left: -6px !important;
  top: -7px !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="cotton-cloud"].is-mini.is-card .message-row .bubble .cotton-cloud-tr {
  right: -6px !important;
  top: -7px !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="cotton-cloud"].is-mini.is-card .message-row .bubble .cotton-cloud-bl {
  left: -6px !important;
  bottom: -7px !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="cotton-cloud"].is-mini.is-card .message-row .bubble .cotton-cloud-br {
  right: -6px !important;
  bottom: -7px !important;
}

/* Final strawberry-milkshake override after the no-tail overflow clamp. */
#app .screen-chat[data-chat-bubble-style="strawberry-milkshake"] .message-row .bubble.bubble-strawberry-milkshake:not(.typing-bubble),
#app[data-chat-bubble-style="strawberry-milkshake"] .screen-chat .message-row .bubble.bubble-strawberry-milkshake:not(.typing-bubble),
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="strawberry-milkshake"] .bubble.bubble-strawberry-milkshake:not(.typing-bubble),
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="strawberry-milkshake"] .message-row .bubble:not(.typing-bubble) {
  position: relative !important;
  overflow: visible !important;
  min-height: 44px !important;
  padding: 11px 58px 11px 36px !important;
  border: 1.5px solid #f5b6c8 !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, #fffdfd 0%, #fff2f6 100%) !important;
  box-shadow: 0 8px 18px rgb(230 112 145 / 12%), inset 0 1px 0 rgb(255 255 255 / 86%) !important;
  isolation: isolate !important;
  z-index: 0 !important;
}

#app .screen-chat[data-chat-bubble-style="strawberry-milkshake"] .message-row .bubble .strawberry-milkshake-deco,
#app[data-chat-bubble-style="strawberry-milkshake"] .screen-chat .message-row .bubble .strawberry-milkshake-deco,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="strawberry-milkshake"] .bubble .strawberry-milkshake-deco,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="strawberry-milkshake"] .message-row .bubble .strawberry-milkshake-deco {
  position: absolute !important;
  display: block !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
  pointer-events: none !important;
  z-index: 5 !important;
}

#app .screen-chat[data-chat-bubble-style="strawberry-milkshake"] .message-row .bubble .strawberry-milkshake-rabbit,
#app[data-chat-bubble-style="strawberry-milkshake"] .screen-chat .message-row .bubble .strawberry-milkshake-rabbit,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="strawberry-milkshake"] .bubble .strawberry-milkshake-rabbit,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="strawberry-milkshake"] .message-row .bubble .strawberry-milkshake-rabbit {
  left: -11px !important;
  top: -24px !important;
  width: 58px !important;
  height: 58px !important;
  background-image: url("./assets/chat-bubbles/strawberry-milkshake/corner-rabbit.png") !important;
}

#app .screen-chat[data-chat-bubble-style="strawberry-milkshake"] .message-row .bubble .strawberry-milkshake-flower,
#app[data-chat-bubble-style="strawberry-milkshake"] .screen-chat .message-row .bubble .strawberry-milkshake-flower,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="strawberry-milkshake"] .bubble .strawberry-milkshake-flower,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="strawberry-milkshake"] .message-row .bubble .strawberry-milkshake-flower {
  display: none !important;
  left: -17px !important;
  bottom: -19px !important;
  width: 54px !important;
  height: 54px !important;
  background-image: url("./assets/chat-bubbles/strawberry-milkshake/flower.png") !important;
}

#app .screen-chat[data-chat-bubble-style="strawberry-milkshake"] .message-row .bubble.is-multiline-bubble .strawberry-milkshake-flower,
#app[data-chat-bubble-style="strawberry-milkshake"] .screen-chat .message-row .bubble.is-multiline-bubble .strawberry-milkshake-flower,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="strawberry-milkshake"] .bubble.is-multiline-bubble .strawberry-milkshake-flower,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="strawberry-milkshake"] .message-row .bubble.is-multiline-bubble .strawberry-milkshake-flower {
  display: block !important;
}

#app .screen-chat[data-chat-bubble-style="strawberry-milkshake"] .message-row .bubble .strawberry-milkshake-cup,
#app[data-chat-bubble-style="strawberry-milkshake"] .screen-chat .message-row .bubble .strawberry-milkshake-cup,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="strawberry-milkshake"] .bubble .strawberry-milkshake-cup,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="strawberry-milkshake"] .message-row .bubble .strawberry-milkshake-cup {
  right: -42px !important;
  top: -26px !important;
  width: 82px !important;
  height: 82px !important;
  background-image: url("./assets/chat-bubbles/strawberry-milkshake/milkshake.png") !important;
  transform: rotate(-12deg) !important;
  transform-origin: 50% 42% !important;
}

#app .screen-chat[data-chat-bubble-style="strawberry-milkshake"] .message-row .bubble.bubble-strawberry-milkshake:not(.typing-bubble) .message-content,
#app[data-chat-bubble-style="strawberry-milkshake"] .screen-chat .message-row .bubble.bubble-strawberry-milkshake:not(.typing-bubble) .message-content,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="strawberry-milkshake"] .bubble.bubble-strawberry-milkshake:not(.typing-bubble) .message-content,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="strawberry-milkshake"] .message-row .bubble:not(.typing-bubble) .message-content,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="strawberry-milkshake"] .message-content {
  position: relative !important;
  z-index: 4 !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="strawberry-milkshake"].is-mini.is-card .message-row .bubble:not(.typing-bubble) {
  width: min(88px, 100%) !important;
  max-width: 88px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 5px 28px 5px 16px !important;
  overflow: visible !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="strawberry-milkshake"].is-mini.is-card .message-row.user .bubble:not(.typing-bubble) {
  width: min(72px, 100%) !important;
  max-width: 72px !important;
  height: 34px !important;
  min-height: 34px !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="strawberry-milkshake"].is-mini.is-card .message-row .bubble .strawberry-milkshake-rabbit {
  left: -5px !important;
  top: -10px !important;
  width: 20px !important;
  height: 20px !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="strawberry-milkshake"].is-mini.is-card .message-row .bubble .strawberry-milkshake-flower {
  display: none !important;
  left: -7px !important;
  bottom: -9px !important;
  width: 20px !important;
  height: 20px !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="strawberry-milkshake"].is-mini.is-card .message-row .bubble.is-multiline-bubble .strawberry-milkshake-flower {
  display: block !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="strawberry-milkshake"].is-mini.is-card .message-row .bubble .strawberry-milkshake-cup {
  right: -14px !important;
  top: -13px !important;
  width: 36px !important;
  height: 36px !important;
}

.screen-chat[data-chat-bubble-style="sketch-outline"],
#app[data-chat-bubble-style="sketch-outline"] .screen-chat:not(.settings-bubble-real-preview) {
  --sketch-outline-bg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 92' preserveAspectRatio='none'%3E%3Cpath d='M31 8 L284 8 Q315 8 313 32 L304 68 Q300 85 278 85 L50 85 Q14 85 14 57 L14 23 Q14 8 31 8 Z' fill='white' fill-opacity='.96' stroke='%23323232' stroke-width='4' stroke-linejoin='round' stroke-linecap='round'/%3E%3Cpath d='M32 9 L282 9 Q312 9 311 31 L302 67 Q298 83 277 83 L51 83 Q17 83 17 57 L17 24 Q17 10 32 9 Z' fill='none' stroke='%23000000' stroke-opacity='.13' stroke-width='1.2' stroke-linejoin='round' stroke-linecap='round'/%3E%3C/svg%3E");
  --skin-min-height: 44px;
  --skin-radius: 0;
  --skin-border-width: 0;
  --skin-left-border: #333333;
  --skin-right-border: #333333;
  --skin-left-bg: var(--sketch-outline-bg);
  --skin-right-bg: var(--sketch-outline-bg);
  --skin-left-tail-bg: rgb(255 255 255 / 94%);
  --skin-right-tail-bg: rgb(255 255 255 / 94%);
  --skin-left-shadow: transparent;
  --skin-right-shadow: transparent;
  --skin-text: #202124;
}

#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="sketch-outline"] {
  --sketch-outline-bg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 92' preserveAspectRatio='none'%3E%3Cpath d='M31 8 L284 8 Q315 8 313 32 L304 68 Q300 85 278 85 L50 85 Q14 85 14 57 L14 23 Q14 8 31 8 Z' fill='white' fill-opacity='.96' stroke='%23323232' stroke-width='4' stroke-linejoin='round' stroke-linecap='round'/%3E%3Cpath d='M32 9 L282 9 Q312 9 311 31 L302 67 Q298 83 277 83 L51 83 Q17 83 17 57 L17 24 Q17 10 32 9 Z' fill='none' stroke='%23000000' stroke-opacity='.13' stroke-width='1.2' stroke-linejoin='round' stroke-linecap='round'/%3E%3C/svg%3E");
  --group-bubble-min-height: 44px;
  --group-bubble-bg-color: transparent;
  --group-bubble-bg-image: var(--sketch-outline-bg);
  --group-bubble-background-size: 100% 100%;
  --group-bubble-background-position: center;
  --group-bubble-border-width: 0;
  --group-bubble-border: #333333;
  --group-bubble-radius: 0;
  --group-bubble-shadow: none;
  --group-bubble-color: #202124;
}

.screen-chat[data-chat-bubble-style="sketch-outline"] .message-row .bubble:not(.typing-bubble),
#app[data-chat-bubble-style="sketch-outline"] .screen-chat:not(.settings-bubble-real-preview) .message-row .bubble:not(.typing-bubble),
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="sketch-outline"] .bubble:not(.typing-bubble),
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"] .message-row .bubble:not(.typing-bubble) {
  min-height: 44px !important;
  padding: 14px 36px 16px 30px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--sketch-outline-bg) center / 100% 100% no-repeat !important;
  box-shadow: none !important;
  color: #202124 !important;
  overflow: hidden !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"].is-mini.is-card .message-row .bubble:not(.typing-bubble) {
  width: min(88px, 100%) !important;
  max-width: 88px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 6px 17px 6px 14px !important;
}

#app .settings-page-v2 .settings-bubble-card-preview .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"].is-mini.is-card .message-row.user .bubble:not(.typing-bubble) {
  width: min(72px, 100%) !important;
  max-width: 72px !important;
}

.screen-chat[data-chat-bubble-style="sketch-outline"],
#app[data-chat-bubble-style="sketch-outline"] .screen-chat:not(.settings-bubble-real-preview),
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="sketch-outline"] {
  --sketch-outline-bg: none !important;
  --skin-min-height: 46px !important;
  --skin-radius: 24px !important;
  --skin-border-width: 1.5px !important;
  --skin-border-style: solid !important;
  --skin-left-border: #2f2f2f !important;
  --skin-right-border: #2f2f2f !important;
  --skin-left-bg: var(--bubble-white) !important;
  --skin-right-bg: var(--bubble-white) !important;
  --skin-left-tail-bg: var(--bubble-white) !important;
  --skin-right-tail-bg: var(--bubble-white) !important;
  --skin-left-shadow: none !important;
  --skin-right-shadow: none !important;
  --skin-text: #111 !important;
}

.screen-chat[data-chat-bubble-style="sketch-outline"] .message-row .bubble:not(.typing-bubble),
#app[data-chat-bubble-style="sketch-outline"] .screen-chat:not(.settings-bubble-real-preview) .message-row .bubble:not(.typing-bubble),
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="sketch-outline"] .bubble:not(.typing-bubble),
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"] .message-row .bubble:not(.typing-bubble) {
  box-sizing: border-box !important;
  min-height: 46px !important;
  padding: 8px 14px 9px !important;
  border: 1.5px solid #2f2f2f !important;
  border-radius: 24px !important;
  background: var(--bubble-white) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #111 !important;
  font-size: 21px !important;
  line-height: 1.46 !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

.screen-chat[data-chat-bubble-style="sketch-outline"] .message-row .bubble .message-content,
#app[data-chat-bubble-style="sketch-outline"] .screen-chat:not(.settings-bubble-real-preview) .message-row .bubble .message-content,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="sketch-outline"] .bubble .message-content,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"] .message-row .bubble .message-content {
  display: inline !important;
  padding: 0 !important;
  position: relative !important;
  z-index: 1 !important;
}

.screen-chat[data-chat-bubble-style="sketch-outline"] .message-row .bubble .sketch-outline-frame,
#app[data-chat-bubble-style="sketch-outline"] .screen-chat:not(.settings-bubble-real-preview) .message-row .bubble .sketch-outline-frame,
#app .screen-chat .message-row.group-member-message[data-chat-bubble-style="sketch-outline"] .bubble .sketch-outline-frame,
#app .settings-page-v2 .settings-bubble-real-preview[data-chat-bubble-style="sketch-outline"] .message-row .bubble .sketch-outline-frame {
  display: none !important;
}
