/* STS v5.6.258 - Watch page full revamp
   Keeps existing watch page features and re-skins/reflows the page only. */

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp{
  --sts258-bg:#06020c;
  --sts258-panel:rgba(12,16,24,.86);
  --sts258-panel2:rgba(24,12,42,.82);
  --sts258-line:rgba(162,69,255,.52);
  --sts258-green:#39ff14;
  --sts258-pink:#ff1168;
  --sts258-purple:#a742ff;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 430px!important;
  gap:16px!important;
  max-width:1900px!important;
  width:calc(100vw - 18px)!important;
  margin:10px auto 0!important;
  padding:0 8px 28px!important;
  align-items:start!important;
  background:
    radial-gradient(circle at 10% 10%, rgba(57,255,20,.08), transparent 32%),
    radial-gradient(circle at 74% 20%, rgba(167,66,255,.16), transparent 36%),
    linear-gradient(180deg, rgba(32,0,58,.34), rgba(2,2,8,.92))!important;
}

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-watch-main{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  gap:14px!important;
}

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-player{
  position:relative!important;
  border:1px solid var(--sts258-line)!important;
  border-radius:18px!important;
  overflow:hidden!important;
  min-height:clamp(420px,52vw,760px)!important;
  background:#000!important;
  box-shadow:0 0 0 1px rgba(57,255,20,.18), 0 0 36px rgba(141,32,255,.42)!important;
}

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-player video,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .mobile-viewer-player,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .mobile-webrtc-player,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .mobile-viewer-player img{
  width:100%!important;
  height:100%!important;
  min-height:inherit!important;
  object-fit:cover!important;
  display:block!important;
}

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-player::after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:34%;
  pointer-events:none;
  background:linear-gradient(180deg, transparent, rgba(0,0,0,.28) 52%, rgba(0,0,0,.64));
  z-index:2;
}

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-player-badges{
  position:absolute!important;
  top:16px!important;
  left:16px!important;
  right:16px!important;
  z-index:7!important;
  display:flex!important;
  justify-content:space-between!important;
  pointer-events:none!important;
}

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-live,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-viewers{
  border-radius:999px!important;
  padding:8px 13px!important;
  font-weight:1000!important;
  letter-spacing:.04em!important;
  box-shadow:0 0 18px rgba(255,17,104,.45)!important;
}

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-live{background:linear-gradient(135deg,#ff0d60,#ff2b84)!important;color:#fff!important;}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-viewers{background:rgba(3,13,8,.82)!important;color:#dfffdd!important;border:1px solid rgba(57,255,20,.7)!important;box-shadow:0 0 18px rgba(57,255,20,.22)!important;}

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts-player-clean-controls,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .purple-native-player-note{
  z-index:9!important;
}

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-stream-info{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  padding:18px!important;
  border:1px solid rgba(162,69,255,.42)!important;
  border-radius:18px!important;
  background:linear-gradient(135deg, rgba(14,18,25,.94), rgba(28,12,45,.88))!important;
  box-shadow:0 18px 44px rgba(0,0,0,.36)!important;
}

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-channel-line{
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  min-width:0!important;
}

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .avatar.big{
  width:72px!important;height:72px!important;min-width:72px!important;
  border-radius:50%!important;
  border:3px solid var(--sts258-green)!important;
  box-shadow:0 0 24px rgba(57,255,20,.45)!important;
  overflow:hidden!important;
}

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-stream-info h1{
  margin:0 0 6px!important;
  font-size:clamp(24px,2vw,38px)!important;
  line-height:1!important;
  color:#fff!important;
  text-shadow:0 0 18px rgba(167,66,255,.38)!important;
}

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-stream-info p{
  margin:0!important;color:#d8cfec!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{
  display:flex!important;flex-wrap:wrap!important;gap:10px!important;justify-content:flex-end!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{
  border-radius:999px!important;
  padding:11px 16px!important;
  border:1px solid rgba(57,255,20,.35)!important;
  background:linear-gradient(135deg,#39ff14,#22d80f)!important;
  color:#051006!important;
  font-weight:1000!important;
  box-shadow:0 0 18px rgba(57,255,20,.26)!important;
}

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .watch-action-btn.report,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .watch-action-btn.sub,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .watch-action-btn.tip{
  background:linear-gradient(135deg,#2a1247,#6416a8)!important;
  color:#fff!important;
  border-color:rgba(167,66,255,.72)!important;
}

html body.streamx-v5.twitch-v53 .sts258-action-rail{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:10px!important;
  padding:12px!important;
  border:1px solid rgba(162,69,255,.34)!important;
  border-radius:16px!important;
  background:rgba(7,10,16,.72)!important;
}

html body.streamx-v5.twitch-v53 .sts258-action{
  appearance:none!important;
  border:1px solid rgba(162,69,255,.55)!important;
  border-radius:14px!important;
  padding:10px 14px!important;
  background:linear-gradient(180deg, rgba(25,30,45,.95), rgba(13,9,23,.95))!important;
  color:#fff!important;
  font-weight:900!important;
  cursor:pointer!important;
  transition:transform .16s ease, border-color .16s ease, box-shadow .16s ease!important;
}
html body.streamx-v5.twitch-v53 .sts258-action:hover{transform:translateY(-2px)!important;border-color:var(--sts258-green)!important;box-shadow:0 0 18px rgba(57,255,20,.18)!important;}
html body.streamx-v5.twitch-v53 .sts258-action.copied span{font-size:0!important;}
html body.streamx-v5.twitch-v53 .sts258-action.copied span::after{content:'Copied';font-size:13px!important;}

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts-paypal-support{
  border:1px solid rgba(162,69,255,.35)!important;
  border-radius:18px!important;
  background:linear-gradient(135deg, rgba(15,20,28,.88), rgba(22,9,38,.88))!important;
  padding:16px!important;
}

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v586-channel-tabs{
  display:flex!important;
  gap:10px!important;
  padding:8px!important;
  border:1px solid rgba(162,69,255,.28)!important;
  border-radius:16px!important;
  background:rgba(5,7,12,.72)!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v586-channel-tabs a{
  padding:10px 15px!important;
  border-radius:12px!important;
  color:#e9ddff!important;
  text-decoration:none!important;
  font-weight:900!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v586-channel-tabs a.active,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v586-channel-tabs a:hover{
  background:rgba(57,255,20,.12)!important;
  color:var(--sts258-green)!important;
}

html body.streamx-v5.twitch-v53 .sts258-watch-hub{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:14px!important;
}

html body.streamx-v5.twitch-v53 .sts258-hub-card,
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,
html body.streamx-v5.twitch-v53 .sts258-clips-strip{
  border:1px solid rgba(162,69,255,.36)!important;
  border-radius:18px!important;
  background:
    linear-gradient(135deg, rgba(14,18,25,.9), rgba(24,10,41,.78)),
    radial-gradient(circle at top left, rgba(57,255,20,.12), transparent 42%)!important;
  box-shadow:0 18px 46px rgba(0,0,0,.3)!important;
}

html body.streamx-v5.twitch-v53 .sts258-hub-card{
  padding:18px!important;
  min-height:170px!important;
}
html body.streamx-v5.twitch-v53 .sts258-kicker{
  display:block!important;
  color:var(--sts258-green)!important;
  font-size:12px!important;
  text-transform:uppercase!important;
  letter-spacing:.12em!important;
  font-weight:1000!important;
  margin-bottom:8px!important;
  text-shadow:0 0 12px rgba(57,255,20,.35)!important;
}
html body.streamx-v5.twitch-v53 .sts258-hub-card h3,
html body.streamx-v5.twitch-v53 .sts258-clips-strip h2{margin:0 0 8px!important;color:#fff!important;line-height:1.05!important;}
html body.streamx-v5.twitch-v53 .sts258-hub-card p{margin:0 0 12px!important;color:#cfc5e8!important;line-height:1.45!important;}
html body.streamx-v5.twitch-v53 .sts258-mini-meta{display:flex!important;flex-wrap:wrap!important;gap:8px!important;}
html body.streamx-v5.twitch-v53 .sts258-mini-meta span,
html body.streamx-v5.twitch-v53 .sts258-coin-rate{
  display:inline-flex!important;
  border-radius:999px!important;
  padding:7px 10px!important;
  background:rgba(57,255,20,.11)!important;
  color:#cfffcb!important;
  border:1px solid rgba(57,255,20,.28)!important;
  font-size:12px!important;
  font-weight:900!important;
}
html body.streamx-v5.twitch-v53 .sts258-progress{height:10px!important;border-radius:999px!important;background:rgba(255,255,255,.08)!important;overflow:hidden!important;border:1px solid rgba(255,255,255,.08)!important;margin:12px 0 8px!important;}
html body.streamx-v5.twitch-v53 .sts258-progress b{display:block!important;height:100%!important;border-radius:999px!important;background:linear-gradient(90deg,#39ff14,#a742ff)!important;box-shadow:0 0 18px rgba(57,255,20,.45)!important;}
html body.streamx-v5.twitch-v53 .sts258-schedule-card a,
html body.streamx-v5.twitch-v53 .sts258-clips-link{color:#39ff14!important;font-weight:1000!important;text-decoration:none!important;}

html body.streamx-v5.twitch-v53 .sts258-clips-strip{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  padding:18px!important;
  gap:14px!important;
}
html body.streamx-v5.twitch-v53 .sts258-clips-link{
  border:1px solid rgba(57,255,20,.45)!important;
  border-radius:999px!important;
  padding:10px 14px!important;
  background:rgba(57,255,20,.1)!important;
  white-space:nowrap!important;
}

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{padding:18px!important;}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts-goal-grid,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-panels{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important;}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-panels article,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts-goal-card{background:rgba(0,0,0,.28)!important;border:1px solid rgba(162,69,255,.24)!important;border-radius:16px!important;padding:14px!important;}

html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .chat-panel{
  position:sticky!important;
  top:92px!important;
  height:calc(100vh - 104px)!important;
  max-height:none!important;
  border:1px solid rgba(162,69,255,.46)!important;
  border-radius:18px!important;
  overflow:hidden!important;
  background:linear-gradient(180deg, rgba(12,17,26,.98), rgba(5,7,12,.98))!important;
  box-shadow:0 0 34px rgba(162,69,255,.18)!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .chat-head{
  background:linear-gradient(135deg, rgba(18,24,36,.98), rgba(29,12,48,.96))!important;
  border-bottom:1px solid rgba(162,69,255,.3)!important;
  padding:14px!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .chat-messages{
  padding:12px!important;
  background:radial-gradient(circle at top right, rgba(57,255,20,.05), transparent 32%)!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .chat-line.pro-message{
  margin-bottom:12px!important;
  padding:8px!important;
  border-radius:14px!important;
  transition:background .15s ease!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .chat-line.pro-message:hover{background:rgba(255,255,255,.035)!important;}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .chat-avatar-mini{box-shadow:0 0 14px rgba(167,66,255,.42)!important;}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .chat-body img.emote,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .chat-body img.chat-emote{max-height:34px!important;vertical-align:middle!important;}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .chat-form,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .chat-login-required,
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .chat-drop-widget{
  margin:10px!important;
  border-radius:16px!important;
  border:1px solid rgba(162,69,255,.28)!important;
  background:rgba(24,18,36,.92)!important;
}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-emote-strip{border-top:1px solid rgba(162,69,255,.24)!important;background:rgba(0,0,0,.38)!important;}
html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts-chat-announcements{display:none!important;}

body.sts258-theatre-mode .sts-v258-watch-revamp{
  grid-template-columns:minmax(0,1fr) 390px!important;
  max-width:100vw!important;
  width:100vw!important;
  margin-top:0!important;
}
body.sts258-theatre-mode .sts-v258-watch-revamp .v53-player{min-height:calc(100vh - 140px)!important;}
body.sts258-theatre-mode .tw-topbar,
body.sts258-theatre-mode .crypto-ticker,
body.sts258-theatre-mode .crypto-market-ticker{display:none!important;}
body.sts258-theatre-mode .sts-v258-watch-revamp .chat-panel{top:8px!important;height:calc(100vh - 16px)!important;}

@media (max-width:1200px){
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp{grid-template-columns:1fr!important;width:100%!important;padding:8px!important;}
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .chat-panel{position:relative!important;top:auto!important;height:680px!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-player{min-height:280px!important;border-radius:14px!important;}
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-stream-info{align-items:flex-start!important;flex-direction:column!important;}
  html body.streamx-v5.twitch-v53 .sts258-watch-hub,
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .sts-goal-grid,
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .v53-panels{grid-template-columns:1fr!important;}
  html body.streamx-v5.twitch-v53 .sts258-clips-strip{align-items:flex-start!important;flex-direction:column!important;}
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .chat-panel{height:620px!important;}
  html body.streamx-v5.twitch-v53 .sts-v258-watch-revamp .avatar.big{width:58px!important;height:58px!important;min-width:58px!important;}
}

/* STS v5.6.267 - custom share modal fix
   Stops Windows/Chrome native share popup errors and gives a reliable copy/social share box. */
html body.streamx-v5.twitch-v53.sts-share-open{
  overflow:hidden!important;
}
html body.streamx-v5.twitch-v53 .sts-share-modal[hidden]{
  display:none!important;
}
html body.streamx-v5.twitch-v53 .sts-share-modal{
  position:fixed!important;
  inset:0!important;
  z-index:99999!important;
  display:grid!important;
  place-items:center!important;
  padding:18px!important;
}
html body.streamx-v5.twitch-v53 .sts-share-backdrop{
  position:absolute!important;
  inset:0!important;
  background:rgba(2,3,10,.72)!important;
  backdrop-filter:blur(12px)!important;
}
html body.streamx-v5.twitch-v53 .sts-share-card{
  position:relative!important;
  width:min(520px, calc(100vw - 28px))!important;
  border:1px solid rgba(139,36,255,.55)!important;
  border-radius:24px!important;
  padding:26px!important;
  background:
    radial-gradient(circle at 15% 0%, rgba(118,255,0,.16), transparent 34%),
    radial-gradient(circle at 85% 5%, rgba(168,85,247,.24), transparent 38%),
    linear-gradient(145deg, rgba(14,16,25,.98), rgba(5,6,12,.98))!important;
  box-shadow:0 24px 90px rgba(0,0,0,.72), 0 0 32px rgba(145,60,255,.25)!important;
  color:#fff!important;
}
html body.streamx-v5.twitch-v53 .sts-share-x{
  position:absolute!important;
  top:14px!important;
  right:14px!important;
  width:36px!important;
  height:36px!important;
  border:1px solid rgba(255,255,255,.14)!important;
  border-radius:12px!important;
  background:rgba(255,255,255,.06)!important;
  color:#fff!important;
  font-size:22px!important;
  cursor:pointer!important;
}
html body.streamx-v5.twitch-v53 .sts-share-kicker{
  display:inline-flex!important;
  margin-bottom:10px!important;
  color:#39ff14!important;
  font-weight:1000!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
  font-size:12px!important;
}
html body.streamx-v5.twitch-v53 .sts-share-card h2{
  margin:0 42px 8px 0!important;
  color:#fff!important;
  font-size:26px!important;
  line-height:1.1!important;
}
html body.streamx-v5.twitch-v53 .sts-share-card p{
  margin:0 0 18px!important;
  color:#c8c4d8!important;
}
html body.streamx-v5.twitch-v53 .sts-share-link-row{
  display:grid!important;
  grid-template-columns:1fr auto!important;
  gap:10px!important;
  margin-bottom:14px!important;
}
html body.streamx-v5.twitch-v53 .sts-share-link-row input{
  min-width:0!important;
  height:46px!important;
  border:1px solid rgba(139,36,255,.45)!important;
  border-radius:14px!important;
  background:rgba(0,0,0,.34)!important;
  color:#fff!important;
  padding:0 14px!important;
  font-weight:800!important;
}
html body.streamx-v5.twitch-v53 .sts-share-link-row button,
html body.streamx-v5.twitch-v53 .sts-share-buttons a{
  min-height:46px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:14px!important;
  border:1px solid rgba(57,255,20,.55)!important;
  background:linear-gradient(135deg, rgba(57,255,20,.18), rgba(139,36,255,.2))!important;
  color:#fff!important;
  font-weight:1000!important;
  text-decoration:none!important;
  padding:0 16px!important;
  cursor:pointer!important;
}
html body.streamx-v5.twitch-v53 .sts-share-buttons{
  display:grid!important;
  grid-template-columns:repeat(3, minmax(0, 1fr))!important;
  gap:10px!important;
}
html body.streamx-v5.twitch-v53 #stsShareStatus{
  display:block!important;
  min-height:20px!important;
  margin-top:12px!important;
  color:#39ff14!important;
  font-weight:900!important;
}
@media (max-width:640px){
  html body.streamx-v5.twitch-v53 .sts-share-card{padding:22px 16px!important;}
  html body.streamx-v5.twitch-v53 .sts-share-link-row{grid-template-columns:1fr!important;}
  html body.streamx-v5.twitch-v53 .sts-share-buttons{grid-template-columns:1fr!important;}
}
