/* STS v5.6.182 - final chat visibility + platform badge polish */
:root{
  --sts-chat-bg:#05070b;
  --sts-chat-row:rgba(255,255,255,.028);
  --sts-chat-row-hover:rgba(160,70,255,.07);
  --sts-chat-line:rgba(160,75,255,.28);
  --sts-purple:#a855f7;
  --sts-green:#39ff14;
  --sts-gold:#ffd166;
  --sts-pink:#ff5bd6;
  --sts-blue:#4db8ff;
}

/* -------- chat shell -------- */
html body.streamx-v5.twitch-v53 .chat-panel,
html body.streamx-v5.twitch-v53 .stream-chat-panel{
  background:linear-gradient(180deg,#0b101b 0%,#05070b 32%,#030407 100%)!important;
  border:1px solid rgba(168,85,247,.55)!important;
  box-shadow:0 0 0 1px rgba(57,255,20,.08),0 18px 60px rgba(0,0,0,.42),inset 0 0 40px rgba(168,85,247,.035)!important;
  overflow:hidden!important;
}
html body.streamx-v5.twitch-v53 .chat-header,
html body.streamx-v5.twitch-v53 .v53-chat-head{
  min-height:82px!important;
  padding:14px 18px!important;
  background:linear-gradient(180deg,rgba(15,21,34,.98),rgba(9,13,22,.98))!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
}
html body.streamx-v5.twitch-v53 .chat-title,
html body.streamx-v5.twitch-v53 .v53-chat-title,
html body.streamx-v5.twitch-v53 .chat-header h2{
  color:#fff!important;
  font-size:20px!important;
  font-weight:1000!important;
  letter-spacing:.01em!important;
  text-shadow:0 0 14px rgba(255,255,255,.25),0 0 22px rgba(168,85,247,.28)!important;
}

/* -------- messages: force proper Twitch/Kick style flow -------- */
html body.streamx-v5.twitch-v53 #chatMessages.chat-messages.pro-messages{
  background:#05070b!important;
  padding:10px 12px 14px!important;
  display:flex!important;
  flex-direction:column!important;
  gap:2px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  scrollbar-color:#a855f7 rgba(255,255,255,.05)!important;
}
html body.streamx-v5.twitch-v53 #chatMessages .chat-line.pro-message{
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr)!important;
  gap:9px!important;
  align-items:start!important;
  width:100%!important;
  min-height:0!important;
  padding:6px 7px!important;
  margin:0!important;
  border-radius:12px!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  position:relative!important;
}
html body.streamx-v5.twitch-v53 #chatMessages .chat-line.pro-message:hover{
  background:var(--sts-chat-row-hover)!important;
}
html body.streamx-v5.twitch-v53 #chatMessages .chat-avatar-mini{
  grid-column:1!important;
  grid-row:1 / span 2!important;
  width:32px!important;
  height:32px!important;
  min-width:32px!important;
  border-radius:999px!important;
  border:2px solid rgba(57,255,20,.95)!important;
  box-shadow:0 0 10px rgba(57,255,20,.35)!important;
  overflow:hidden!important;
  background:#101721!important;
  color:#fff!important;
  font-size:12px!important;
  font-weight:1000!important;
  display:grid!important;
  place-items:center!important;
}
html body.streamx-v5.twitch-v53 #chatMessages .chat-avatar-mini img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important;}
html body.streamx-v5.twitch-v53 #chatMessages .chat-bubble{
  grid-column:2!important;
  width:100%!important;
  min-width:0!important;
  display:block!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  padding:0!important;
  margin:0!important;
  overflow:visible!important;
}
html body.streamx-v5.twitch-v53 #chatMessages .chat-meta{
  display:flex!important;
  align-items:center!important;
  gap:5px!important;
  flex-wrap:wrap!important;
  min-width:0!important;
  margin:0 0 2px!important;
  line-height:1.15!important;
}
html body.streamx-v5.twitch-v53 #chatMessages .chat-name,
html body.streamx-v5.twitch-v53 #chatMessages .chat-name-link{
  flex:0 1 auto!important;
  min-width:0!important;
  max-width:155px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  color:var(--chat-name-color,#ff4d68)!important;
  font-size:13px!important;
  font-weight:1000!important;
  text-decoration:none!important;
  text-shadow:0 0 9px rgba(255,60,110,.22)!important;
}
html body.streamx-v5.twitch-v53 #chatMessages .chat-body,
html body.streamx-v5.twitch-v53 #chatMessages .chat-bubble > span:not(.badge-row):not(.creator-badge):not(.badge-icon):not(.badge-label){
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin:1px 0 0!important;
  color:#f4f6ff!important;
  font-size:13.5px!important;
  line-height:1.38!important;
  font-weight:650!important;
  word-break:break-word!important;
  overflow-wrap:anywhere!important;
}

/* Emote-only messages: clean, readable, no row smashing */
html body.streamx-v5.twitch-v53 #chatMessages .chat-line.emote-only .chat-body,
html body.streamx-v5.twitch-v53 #chatMessages .chat-line.emote-only .chat-bubble > span{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  gap:5px!important;
  margin-top:4px!important;
  line-height:1!important;
}
html body.streamx-v5.twitch-v53 #chatMessages .chat-line.emote-only img,
html body.streamx-v5.twitch-v53 #chatMessages .chat-line.emote-only .chat-emote,
html body.streamx-v5.twitch-v53 #chatMessages .chat-line.emote-only .emote-inline{
  width:32px!important;
  height:32px!important;
  max-width:32px!important;
  max-height:32px!important;
  object-fit:contain!important;
  vertical-align:middle!important;
  margin:0 2px 2px 0!important;
  filter:drop-shadow(0 0 6px rgba(255,255,255,.12))!important;
}
html body.streamx-v5.twitch-v53 #chatMessages .chat-line:not(.emote-only) .chat-emote{
  width:24px!important;height:24px!important;vertical-align:middle!important;margin:0 2px!important;
}

/* System events */
html body.streamx-v5.twitch-v53 #chatMessages .chat-line.system-line,
html body.streamx-v5.twitch-v53 #chatMessages .chat-line[data-chat-username="System"]{
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  grid-template-columns:none!important;
  padding:8px 10px!important;
  margin:3px 0!important;
  background:linear-gradient(90deg,transparent,rgba(57,255,20,.08),transparent)!important;
  border-radius:0!important;
}
html body.streamx-v5.twitch-v53 #chatMessages .system-line .chat-avatar-mini,
html body.streamx-v5.twitch-v53 #chatMessages [data-chat-username="System"] .chat-avatar-mini,
html body.streamx-v5.twitch-v53 #chatMessages .system-icon{display:none!important;}
html body.streamx-v5.twitch-v53 #chatMessages .system-line .chat-bubble,
html body.streamx-v5.twitch-v53 #chatMessages [data-chat-username="System"] .chat-bubble{
  width:auto!important;text-align:center!important;
}
html body.streamx-v5.twitch-v53 #chatMessages .system-message,
html body.streamx-v5.twitch-v53 #chatMessages [data-chat-username="System"] .chat-body,
html body.streamx-v5.twitch-v53 #chatMessages [data-chat-username="System"] .chat-bubble > span{
  color:#bdfcc7!important;
  font-size:12.5px!important;
  font-weight:1000!important;
  text-shadow:0 0 12px rgba(57,255,20,.22)!important;
}

/* -------- premium role badges: no boxes, visible icons everywhere -------- */
html body .badge-row.sts-role-badges,
html body .badge-row.compact.sts-role-badges,
html body #chatMessages .badge-row,
html body .chat-meta .badge-row,
html body .top-user-badges,
html body .name-with-badges .badge-row{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:4px!important;
  margin:0 0 0 3px!important;
  padding:0!important;
  flex:0 0 auto!important;
  max-width:none!important;
  overflow:visible!important;
  vertical-align:middle!important;
}
html body .creator-badge,
html body .badge-row.compact .creator-badge,
html body #chatMessages .creator-badge,
html body .chat-meta .creator-badge{
  display:inline-grid!important;
  place-items:center!important;
  width:18px!important;
  height:18px!important;
  min-width:18px!important;
  min-height:18px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  line-height:1!important;
  overflow:visible!important;
  position:relative!important;
}
html body .creator-badge .badge-icon,
html body .badge-row.compact .creator-badge .badge-icon,
html body #chatMessages .creator-badge .badge-icon{
  display:inline-grid!important;
  place-items:center!important;
  width:18px!important;
  height:18px!important;
  font-size:15px!important;
  line-height:1!important;
  font-weight:1000!important;
  text-align:center!important;
  font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",system-ui,sans-serif!important;
}
html body .creator-badge .badge-label,
html body .badge-row.compact .creator-badge .badge-label{display:none!important;}
html body .creator-badge.badge-owner .badge-icon{font-size:16px!important;filter:drop-shadow(0 0 6px rgba(255,209,102,.9)) drop-shadow(0 0 12px rgba(255,138,0,.3))!important;}
html body .creator-badge.badge-partner .badge-icon{color:#b46cff!important;font-family:Arial,system-ui,sans-serif!important;font-size:16px!important;text-shadow:0 0 6px rgba(180,108,255,.95),0 0 13px rgba(180,108,255,.42)!important;filter:none!important;}
html body .creator-badge.badge-affiliate .badge-icon{font-size:16px!important;filter:drop-shadow(0 0 7px rgba(255,91,214,.72))!important;}
html body .creator-badge.badge-streamer .badge-icon{color:#4db8ff!important;font-family:Arial,system-ui,sans-serif!important;font-size:16px!important;text-shadow:0 0 6px rgba(77,184,255,.85),0 0 12px rgba(77,184,255,.35)!important;filter:none!important;}
html body .creator-badge.badge-moderator .badge-icon{font-size:15px!important;filter:drop-shadow(0 0 6px rgba(210,220,230,.55))!important;}

/* role coloured avatar frames */
html body.streamx-v5.twitch-v53 #chatMessages .chat-line:has(.badge-owner) .chat-avatar-mini{border-color:var(--sts-gold)!important;box-shadow:0 0 12px rgba(255,209,102,.5)!important;}
html body.streamx-v5.twitch-v53 #chatMessages .chat-line:has(.badge-partner) .chat-avatar-mini{border-color:#b46cff!important;box-shadow:0 0 12px rgba(180,108,255,.45)!important;}
html body.streamx-v5.twitch-v53 #chatMessages .chat-line:has(.badge-affiliate) .chat-avatar-mini{border-color:var(--sts-pink)!important;box-shadow:0 0 12px rgba(255,91,214,.4)!important;}
html body.streamx-v5.twitch-v53 #chatMessages .chat-line:has(.badge-streamer) .chat-avatar-mini{border-color:var(--sts-blue)!important;box-shadow:0 0 12px rgba(77,184,255,.45)!important;}

/* mod controls hidden until needed */
html body.streamx-v5.twitch-v53 #chatMessages .inline-mod-menu,
html body.streamx-v5.twitch-v53 #chatMessages .mod-menu{display:inline-flex!important;flex:0 0 auto!important;}
html body.streamx-v5.twitch-v53 #chatMessages .inline-mod-menu summary,
html body.streamx-v5.twitch-v53 #chatMessages .mod-menu summary{
  width:18px!important;height:18px!important;min-width:18px!important;border-radius:999px!important;
  display:grid!important;place-items:center!important;background:rgba(255,255,255,.06)!important;
  color:#cfd5e6!important;font-size:13px!important;line-height:1!important;opacity:0!important;pointer-events:none!important;
}
html body.streamx-v5.twitch-v53 #chatMessages .chat-line:hover .inline-mod-menu summary,
html body.streamx-v5.twitch-v53 #chatMessages .chat-line:hover .mod-menu summary,
html body.streamx-v5.twitch-v53 #chatMessages details[open] summary{opacity:1!important;pointer-events:auto!important;}

/* footer and emote strip - clean icons only */
html body.streamx-v5.twitch-v53 .v53-emote-strip,
html body.streamx-v5.twitch-v53 #emoteTray{
  display:flex!important;align-items:center!important;gap:13px!important;
  padding:8px 14px!important;background:#070a10!important;border-top:1px solid rgba(168,85,247,.35)!important;
  overflow-x:auto!important;overflow-y:hidden!important;
}
html body.streamx-v5.twitch-v53 #emoteTray .emote-pick,
html body.streamx-v5.twitch-v53 .v53-emote-strip .emote-pick{
  width:auto!important;height:auto!important;min-width:0!important;padding:0!important;margin:0!important;
  border:0!important;background:transparent!important;box-shadow:none!important;border-radius:0!important;
  display:grid!important;place-items:center!important;transition:transform .12s ease,filter .12s ease!important;
}
html body.streamx-v5.twitch-v53 #emoteTray .emote-pick:hover{transform:translateY(-1px) scale(1.13)!important;filter:drop-shadow(0 0 8px rgba(168,85,247,.45))!important;}
html body.streamx-v5.twitch-v53 #emoteTray .emote-pick img{width:27px!important;height:27px!important;object-fit:contain!important;display:block!important;}
html body.streamx-v5.twitch-v53 #emoteTray .emote-pick span{display:none!important;}
html body.streamx-v5.twitch-v53 #chatForm.pro-chat-form,
html body.streamx-v5.twitch-v53 .pro-chat-form{
  display:grid!important;grid-template-columns:minmax(0,1fr) 118px!important;gap:12px!important;
  padding:12px 14px!important;background:#080910!important;border-top:1px solid rgba(168,85,247,.28)!important;
}
html body.streamx-v5.twitch-v53 #chatWaveBtn{display:none!important;}
html body.streamx-v5.twitch-v53 #chatInput{
  display:block!important;width:100%!important;min-width:0!important;height:48px!important;
  padding:0 18px!important;border-radius:12px!important;border:1px solid rgba(255,255,255,.12)!important;
  background:#101621!important;color:#fff!important;box-shadow:inset 0 0 0 1px rgba(57,255,20,.03)!important;
}
html body.streamx-v5.twitch-v53 #chatInput:focus{border-color:rgba(57,255,20,.9)!important;box-shadow:0 0 0 1px rgba(57,255,20,.25),0 0 18px rgba(57,255,20,.13)!important;outline:none!important;}
html body.streamx-v5.twitch-v53 #chatForm button[type="submit"]{height:48px!important;border-radius:14px!important;background:linear-gradient(135deg,#9147ff,#d137ff)!important;color:#fff!important;font-weight:1000!important;border:0!important;box-shadow:0 10px 25px rgba(145,71,255,.25)!important;}

/* Cards/profile/search/live: badges visible and not boxed */
html body .stream-card .badge-row,
html body .live-card .badge-row,
html body .creator-card .badge-row,
html body .profile-hero .badge-row,
html body .channel-card .badge-row,
html body .showcase-card .badge-row,
html body .rail-card .badge-row,
html body h1 .badge-row,
html body h2 .badge-row,
html body h3 .badge-row,
html body p .badge-row{
  display:inline-flex!important;gap:4px!important;margin-left:5px!important;vertical-align:middle!important;
}
html body h1 .creator-badge,
html body h2 .creator-badge,
html body h3 .creator-badge,
html body .profile-hero .creator-badge{width:21px!important;height:21px!important;min-width:21px!important;}
html body h1 .creator-badge .badge-icon,
html body h2 .creator-badge .badge-icon,
html body h3 .creator-badge .badge-icon,
html body .profile-hero .creator-badge .badge-icon{font-size:18px!important;width:21px!important;height:21px!important;}

@media (max-width:700px){
  html body.streamx-v5.twitch-v53 #chatMessages .chat-line.pro-message{grid-template-columns:34px minmax(0,1fr)!important;gap:8px!important;padding:6px 5px!important;}
  html body.streamx-v5.twitch-v53 #chatMessages .chat-avatar-mini{width:30px!important;height:30px!important;min-width:30px!important;}
  html body.streamx-v5.twitch-v53 #chatMessages .chat-name{max-width:112px!important;font-size:12.5px!important;}
  html body.streamx-v5.twitch-v53 #chatMessages .chat-line.emote-only img,
  html body.streamx-v5.twitch-v53 #chatMessages .chat-line.emote-only .chat-emote{width:29px!important;height:29px!important;}
  html body.streamx-v5.twitch-v53 #chatForm.pro-chat-form{grid-template-columns:minmax(0,1fr) 88px!important;gap:8px!important;padding:10px!important;}
  html body.streamx-v5.twitch-v53 #chatInput{height:44px!important;padding:0 13px!important;}
  html body.streamx-v5.twitch-v53 #chatForm button[type="submit"]{height:44px!important;}
}