/* STS v5.6.260 - Watch page compact full-grid polish
   Uses CSS only. Keeps all watch-page features, but lets lower sections span under player + chat. */

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 430px!important;
  gap:14px!important;
  align-items:start!important;
}

/* Let the player and all lower watch sections become direct grid items, so they can span both columns. */
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-watch-main{
  display:contents!important;
}

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-player{
  grid-column:1/2!important;
  grid-row:1!important;
}

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .chat-panel{
  grid-column:2/3!important;
  grid-row:1!important;
}

/* Remove the floating viewer-count pill from the player overlay. Chat still keeps its viewer count. */
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-player-badges .v53-viewers{
  display:none!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-player-badges{
  right:auto!important;
  justify-content:flex-start!important;
}

/* Everything below the player/chat spans the full available width. */
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts-reaction-overlay,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-stream-info,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts258-action-rail,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts-paypal-support,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v586-channel-tabs,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts258-watch-hub,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts258-clips-strip,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v586-watch-goals,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-panels,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-server-section{
  grid-column:1/-1!important;
  width:100%!important;
  max-width:none!important;
  box-sizing:border-box!important;
}

/* Compact stream header. */
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-stream-info{
  min-height:0!important;
  padding:14px 16px!important;
  gap:14px!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-channel-line{
  gap:12px!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .avatar.big{
  width:58px!important;
  height:58px!important;
  min-width:58px!important;
  border-width:2px!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-stream-info h1{
  font-size:clamp(22px,1.7vw,32px)!important;
  margin:0 0 4px!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-stream-info p{
  font-size:14px!important;
  line-height:1.2!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .tag-row{
  margin-top:7px!important;
  gap:6px!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .tag-row span{
  padding:5px 9px!important;
  font-size:12px!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-stream-actions,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v586-channel-actions{
  align-items:center!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .watch-action-btn,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-btn{
  padding:10px 15px!important;
}

/* Compact action rail. */
html body.streamx-v5.twitch-v53 .sts258-action-rail{
  padding:10px!important;
  gap:9px!important;
}
html body.streamx-v5.twitch-v53 .sts258-action{
  padding:9px 13px!important;
}

/* Compact support panel, especially for guests. */
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts-paypal-support{
  padding:14px!important;
  min-height:0!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts-paypal-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
  margin:0 0 10px!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts-paypal-head span{
  font-weight:1000!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts-paypal-head small{
  color:#d7cdeb!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts-paypal-support > .watch-action-btn.follow{
  display:inline-flex!important;
  margin-top:0!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts-paypal-grid{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:12px!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts-paypal-card{
  min-height:0!important;
  padding:13px!important;
}

/* Make the channel hub feel filled out across the page. */
html body.streamx-v5.twitch-v53 .sts258-watch-hub{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:14px!important;
}
html body.streamx-v5.twitch-v53 .sts258-hub-card{
  min-height:132px!important;
  padding:15px!important;
}

@media (max-width:1200px){
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp{
    grid-template-columns:1fr!important;
  }
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-player,
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .chat-panel,
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-stream-info,
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts258-action-rail,
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts-paypal-support,
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v586-channel-tabs,
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts258-watch-hub,
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts258-clips-strip,
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v586-watch-goals,
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-panels,
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-server-section{
    grid-column:1/-1!important;
    grid-row:auto!important;
  }
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .chat-panel{
    position:relative!important;
    top:auto!important;
    height:640px!important;
  }
  html body.streamx-v5.twitch-v53 .sts258-watch-hub{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media (max-width:720px){
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-stream-info{
    flex-direction:column!important;
    align-items:flex-start!important;
  }
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts-paypal-head{
    flex-direction:column!important;
    align-items:flex-start!important;
  }
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts-paypal-grid,
  html body.streamx-v5.twitch-v53 .sts258-watch-hub{
    grid-template-columns:1fr!important;
  }
}

/* STS v5.6.261 - Move PayPal support into header buttons, remove old full-width panel */
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts-paypal-support{
  display:none!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v586-channel-actions{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:10px!important;
  flex-wrap:wrap!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts261-header-paypal-form{
  display:inline-flex!important;
  margin:0!important;
  padding:0!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .watch-action-btn.paypal-tip,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .watch-action-btn.paypal-sub{
  border:1px solid rgba(145,71,255,.75)!important;
  background:linear-gradient(135deg,rgba(145,71,255,.22),rgba(40,255,20,.13))!important;
  color:#fff!important;
  box-shadow:0 0 18px rgba(145,71,255,.25)!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .watch-action-btn.paypal-tip:hover,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .watch-action-btn.paypal-sub:hover{
  border-color:#28ff14!important;
  box-shadow:0 0 22px rgba(40,255,20,.35)!important;
  transform:translateY(-1px)!important;
}
