:root[data-theme="dark-titanium"] {
  --studio-role-guardian: #35efa0;
  --studio-role-moderator: #ff4f7d;
  --studio-role-superfan: #ffcb35;
  --studio-role-bot: #42dcf4;
  --studio-role-gifter: #78a4ff;
  --studio-role-fan: #ff7080;
  --studio-role-inactive: #92949d;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed :is(
  .message-role-pill,
  .role-badges > .role[data-role],
  :is(.role-badges, .message-level-badges) > .gifter-level-badge,
  :is(.role-badges, .message-level-badges) > .tt-fan-badge
) {
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
  gap: 4px;
  height: 20px;
  min-height: 20px;
  padding: 0 6px;
  border: 1px solid color-mix(in srgb, currentColor 78%, transparent) !important;
  border-radius: 4px;
  background: color-mix(in srgb, currentColor 16%, #202024) !important;
  box-shadow: none !important;
  text-shadow: none !important;
  filter: none !important;
  font: 750 11px/1 Inter, system-ui, sans-serif;
  letter-spacing: 0;
  white-space: nowrap;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed :is(
  .message-role-pill,
  .role-badges > .role[data-role],
  :is(.role-badges, .message-level-badges) > .gifter-level-badge,
  :is(.role-badges, .message-level-badges) > .tt-fan-badge
) svg {
  flex: 0 0 13px;
  width: 13px;
  height: 13px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  filter: none !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed .role-badges > .role[data-role] {
  flex: 0 0 20px;
  width: 20px;
  padding: 0;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed .chat-message.guardian .message-author {
  color: var(--studio-role-guardian) !important;
  -webkit-text-fill-color: var(--studio-role-guardian) !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed .chat-message.moderator:not(.guardian) .message-author {
  color: var(--studio-role-moderator) !important;
  -webkit-text-fill-color: var(--studio-role-moderator) !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed .chat-message.superfan:not(.guardian, .moderator) .message-author {
  color: var(--studio-role-superfan) !important;
  -webkit-text-fill-color: var(--studio-role-superfan) !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed :is(.message-role-pill, .role-badges > .role)[data-role="guardian"] {
  color: var(--studio-role-guardian) !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed :is(.message-role-pill, .role-badges > .role)[data-role="moderator"] {
  color: var(--studio-role-moderator) !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed :is(.message-role-pill, .role-badges > .role)[data-role="superfan"] {
  color: var(--studio-role-superfan) !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed :is(.message-role-pill, .role-badges > .role)[data-role="bot"] {
  color: var(--studio-role-bot) !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed :is(.role-badges, .message-level-badges) > .gifter-level-badge {
  color: var(--studio-role-gifter) !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed :is(.role-badges, .message-level-badges) > .tt-fan-badge {
  color: var(--studio-role-fan) !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed :is(.role-badges, .message-level-badges) > .tt-fan-badge[data-state="active"] svg path {
  fill: currentColor !important;
  fill-opacity: 1 !important;
  stroke: #ffb2ad !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed :is(.role-badges, .message-level-badges) > .tt-fan-badge[data-state="active"] {
  color: var(--studio-role-fan) !important;
  border-color: #ff7080 !important;
  background: #41252e !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed :is(.role-badges, .message-level-badges) > .tt-fan-badge[data-state="active"] b {
  color: #ffe0dc !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed :is(.role-badges, .message-level-badges) > .tt-fan-badge[data-state="unknown"] {
  color: #ffb165 !important;
  border-color: #dc8e51 !important;
  background: #352820 !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed :is(.role-badges, .message-level-badges) > .tt-fan-badge[data-state="unknown"] svg path {
  fill: currentColor !important;
  fill-opacity: .68 !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed :is(.role-badges, .message-level-badges) > .tt-fan-badge[data-state="unknown"] b {
  color: #ffd5ab !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed :is(.role-badges, .message-level-badges) > .tt-fan-badge[data-state="inactive"] {
  color: var(--studio-role-inactive) !important;
  border-color: color-mix(in srgb, var(--studio-role-inactive) 38%, transparent) !important;
  background: #222327 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  filter: none !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed :is(.role-badges, .message-level-badges) > .tt-fan-badge[data-state="inactive"] svg {
  filter: none !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed :is(.role-badges, .message-level-badges) > .tt-fan-badge[data-state="inactive"] svg path {
  fill: none !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat #chatFeed :is(.role-badges, .message-level-badges) :is(.gifter-level-badge, .tt-fan-badge) b {
  color: inherit !important;
  font: inherit !important;
  font-variant-numeric: tabular-nums !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat .desktop-viewer-scroll [data-viewer-group="guardian"],
html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat .desktop-viewer-member[data-viewer-role="guardian"] {
  --studio-viewer-role: var(--studio-role-guardian);
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat .desktop-viewer-scroll [data-viewer-group="moderator"],
html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat .desktop-viewer-member[data-viewer-role="moderator"] {
  --studio-viewer-role: var(--studio-role-moderator);
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat .desktop-viewer-scroll [data-viewer-group="superfan"],
html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat .desktop-viewer-member[data-viewer-role="superfan"] {
  --studio-viewer-role: var(--studio-role-superfan);
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat .desktop-viewer-scroll [data-viewer-group="bot"],
html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat .desktop-viewer-member[data-viewer-role="bot"] {
  --studio-viewer-role: var(--studio-role-bot);
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat .desktop-viewer-scroll [data-viewer-group="viewer"] {
  --studio-viewer-role: var(--studio-content-muted, #96979e);
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat .desktop-viewer-scroll [data-viewer-group] h3 {
  color: var(--studio-viewer-role) !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat .desktop-viewer-scroll [data-viewer-group] h3 .viewer-category-icon {
  color: inherit !important;
  fill: none;
  stroke: currentColor;
  filter: none !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat .desktop-viewer-scroll [data-viewer-group] h3 b {
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border: 1px solid color-mix(in srgb, var(--studio-viewer-role) 35%, transparent);
  border-radius: 4px;
  background: transparent !important;
  color: var(--studio-viewer-role) !important;
  font-size: 10px;
  font-variant-numeric: tabular-nums;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat .desktop-viewer-member[data-viewer-role]:not([data-viewer-role="viewer"])::before {
  content: "";
  position: absolute;
  top: 11px;
  bottom: 11px;
  left: 0;
  width: 2px;
  border-radius: 1px;
  background: var(--studio-viewer-role);
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat .desktop-viewer-member[data-viewer-role]:not([data-viewer-role="viewer"]) b {
  color: var(--studio-viewer-role) !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat .desktop-viewer-member[data-active="true"]::after {
  border-color: #1a1a1e;
  background: #43bf89;
  box-shadow: none;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"][data-chat-style] body.nova-ready #chat #chatFeed .message-avatar-frame-shell {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 48px !important;
  width: 48px !important;
  height: 48px !important;
  margin: 0 !important;
  overflow: visible !important;
  isolation: isolate !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"][data-chat-style] body.nova-ready #chat #chatFeed .message-avatar-frame-shell .message-avatar-frame,
html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat .desktop-viewer-avatar-frame-shell .desktop-viewer-avatar-frame {
  display: block !important;
  pointer-events: none !important;
  user-select: none !important;
  object-fit: contain !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"][data-chat-style] body.nova-ready #chat #chatFeed .message-avatar-frame-shell .message-avatar {
  position: relative !important;
  z-index: 1 !important;
  flex: 0 0 39px !important;
  width: 39px !important;
  height: 39px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  object-fit: cover;
  box-shadow: none !important;
  filter: none !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"][data-chat-style] body.nova-ready #chat #chatFeed .message-avatar-frame-shell .message-avatar-frame {
  position: absolute !important;
  z-index: 2 !important;
  inset: -2px !important;
  width: 52px !important;
  height: 52px !important;
  max-width: none !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"] body.nova-ready #chat .desktop-viewer-avatar-frame-shell .desktop-viewer-avatar {
  border: 0 !important;
  border-radius: 50% !important;
  width: 27px !important;
  height: 27px !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"][data-chat-style="compact"] body.nova-ready #chat #chatFeed .message-avatar-frame-shell {
  flex: 0 0 30px !important;
  width: 30px !important;
  height: 30px !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"][data-chat-style="compact"] body.nova-ready #chat #chatFeed .message-avatar-frame-shell .message-avatar {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 26px !important;
  width: 26px !important;
  height: 26px !important;
}

html:root[data-platform="desktop"][data-theme="dark-titanium"][data-chat-style="compact"] body.nova-ready #chat #chatFeed .message-avatar-frame-shell .message-avatar-frame {
  inset: -3px !important;
  width: 36px !important;
  height: 36px !important;
}