.rail-close {
  display: none !important;
}

.intro-avatar,
.consent-chat-card .avatar,
.message:not(.user) .avatar {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background-color: var(--acid) !important;
  background-image:
    linear-gradient(rgba(5, 5, 5, .18) 1px, transparent 1px),
    linear-gradient(90deg, rgba(5, 5, 5, .18) 1px, transparent 1px) !important;
  background-size: 5px 5px !important;
  color: transparent !important;
  font-size: 0 !important;
  border-color: #050505 !important;
}

.intro-avatar::after,
.consent-chat-card .avatar::after,
.message:not(.user) .avatar::after {
  content: "AI";
  position: absolute;
  inset: 0;
  z-index: 1;
  display: grid;
  place-items: center;
  color: #050505;
  font: 1000 12px/1 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .02em;
}

.intro-avatar::after {
  font-size: 15px;
}

.message.user .avatar {
  position: relative;
  overflow: hidden;
  background: var(--pink) !important;
  color: transparent !important;
  font-size: 0 !important;
}

.message.user .avatar::after {
  content: "You";
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #000;
  font: 900 8px/1 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: -.04em;
  text-transform: none;
}

@media (max-width: 860px) {
  .rail-close {
    display: grid !important;
  }

  .intro-avatar::after {
    font-size: 13px;
  }

  .consent-chat-card .avatar::after,
  .message:not(.user) .avatar::after {
    font-size: 10px;
  }

  .message.user .avatar::after {
    font-size: 7px;
  }
}
