/* STS v5.6.134 - compact premium header redesign */
:root{--sts-lime:#8dff00;--sts-lime2:#42ff57;--sts-purple:#a020ff;--sts-purple2:#6d28d9;--sts-bg:#07070b;--sts-panel:#111119;}

html body.streamx-v5.twitch-v53 .tw-topbar.sts-glass-nav,
.tw-topbar.sts-glass-nav{
  height:86px!important;
  min-height:86px!important;
  padding:0 14px!important;
  display:grid!important;
  grid-template-columns:minmax(680px,1fr) minmax(290px,420px) auto!important;
  align-items:center!important;
  gap:14px!important;
  position:sticky!important;
  top:0!important;
  z-index:1000!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 18% 40%, rgba(135,255,0,.14), transparent 15%),
    radial-gradient(circle at 36% 35%, rgba(160,32,255,.26), transparent 22%),
    radial-gradient(circle at 58% 35%, rgba(135,255,0,.12), transparent 18%),
    linear-gradient(180deg, rgba(24,24,29,.98), rgba(10,10,13,.98))!important;
  border-bottom:1px solid rgba(135,255,0,.28)!important;
  box-shadow:0 8px 34px rgba(0,0,0,.55), inset 0 -1px 0 rgba(160,32,255,.34)!important;
}

.tw-topbar.sts-glass-nav:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg, rgba(160,32,255,.2), transparent 12%, transparent 72%, rgba(135,255,0,.12));opacity:.9;}
.tw-topbar.sts-glass-nav:after{content:"";position:absolute;left:14px;right:14px;bottom:8px;height:1px;background:linear-gradient(90deg, transparent, rgba(135,255,0,.55), rgba(160,32,255,.45), transparent);opacity:.7;}

.tw-topbar.sts-glass-nav .sts-nav-left{
  position:relative;
  z-index:2;
  display:grid!important;
  grid-template-columns:105px 280px 130px minmax(0,1fr)!important;
  grid-template-rows:48px 28px!important;
  align-items:center!important;
  gap:0 10px!important;
  min-width:0!important;
  height:86px!important;
}

.sts-logo-png-link{
  grid-row:1 / 3!important;
  grid-column:1!important;
  width:100px!important;
  height:70px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
  margin:0!important;
  background:linear-gradient(90deg, rgba(0,0,0,.72), rgba(16,16,22,.2))!important;
  border:1px solid rgba(160,32,255,.18)!important;
  border-right:2px solid rgba(135,255,0,.6)!important;
  border-radius:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
.sts-logo-png{width:118px!important;height:70px!important;object-fit:contain!important;max-width:none!important;filter:drop-shadow(0 0 8px rgba(160,32,255,.72));}

.sts-header-wordmark{
  grid-row:1!important;
  grid-column:2!important;
  height:48px!important;
  display:flex!important;
  align-items:center!important;
  padding-left:0!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  position:relative!important;
  z-index:4!important;
}
.sts-header-wordmark:before{content:"";position:absolute;left:0;right:-40px;bottom:6px;height:2px;background:linear-gradient(90deg,rgba(135,255,0,.65),transparent);box-shadow:0 0 14px rgba(135,255,0,.45);}
.sts-header-wordmark>span{font:900 27px/1 Impact,Arial Black,sans-serif!important;letter-spacing:2px!important;font-style:italic!important;color:#f3f3f5!important;text-shadow:0 2px 0 #000,0 0 12px rgba(160,32,255,.9)!important;}
.sts-header-wordmark>span>span{color:var(--sts-lime)!important;text-shadow:0 0 13px rgba(135,255,0,.8)!important;}

.sts-header-mascot-bg{
  grid-row:1 / 3!important;
  grid-column:3!important;
  width:130px!important;
  height:86px!important;
  object-fit:cover!important;
  object-position:center 25%!important;
  opacity:.86!important;
  margin:0!important;
  align-self:stretch!important;
  filter:drop-shadow(0 0 14px rgba(160,32,255,.85));
  -webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 18%, #000 82%, transparent 100%);
  mask-image:linear-gradient(90deg, transparent 0%, #000 18%, #000 82%, transparent 100%);
}

.tw-topbar.sts-glass-nav .sts-icon-nav{
  grid-row:2!important;
  grid-column:2 / 5!important;
  height:28px!important;
  display:flex!important;
  align-items:center!important;
  gap:2px!important;
  min-width:0!important;
  overflow:hidden!important;
  margin:0!important;
  padding:0!important;
  align-self:center!important;
}
.tw-topbar.sts-glass-nav .sts-icon-nav a{
  height:28px!important;
  min-width:auto!important;
  padding:0 10px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
  border-radius:10px!important;
  border:1px solid transparent!important;
  background:transparent!important;
  color:#c4c4ce!important;
  font-size:11px!important;
  line-height:1!important;
  font-weight:900!important;
  letter-spacing:.6px!important;
  text-transform:uppercase!important;
  text-decoration:none!important;
  box-shadow:none!important;
  white-space:nowrap!important;
}
.tw-topbar.sts-glass-nav .sts-icon-nav .nav-ico{display:none!important;}
.tw-topbar.sts-glass-nav .sts-icon-nav a:hover{color:#fff!important;background:rgba(255,255,255,.05)!important;border-color:rgba(160,32,255,.25)!important;}
.tw-topbar.sts-glass-nav .sts-icon-nav a.is-active,
.tw-topbar.sts-glass-nav .sts-icon-nav a[href="/logo-pack"]:hover{
  color:#050506!important;
  background:linear-gradient(135deg,var(--sts-lime),#3bdd10)!important;
  border-color:rgba(135,255,0,.8)!important;
  box-shadow:0 0 16px rgba(135,255,0,.38)!important;
}
.tw-topbar.sts-glass-nav .sts-icon-nav a[href="/watch-parties"],
.tw-topbar.sts-glass-nav .sts-icon-nav a[href="/chat-app"]{display:none!important;}

.tw-topbar.sts-glass-nav .sts-nav-search{
  position:relative!important;
  z-index:4!important;
  height:40px!important;
  min-width:0!important;
  margin:0!important;
  display:flex!important;
  align-items:center!important;
  background:rgba(6,7,11,.78)!important;
  border:1px solid rgba(135,255,0,.34)!important;
  border-radius:4px!important;
  box-shadow:inset 0 -1px 0 rgba(135,255,0,.25),0 0 18px rgba(135,255,0,.08)!important;
  overflow:visible!important;
}
.tw-topbar.sts-glass-nav .sts-nav-search input{height:38px!important;background:transparent!important;border:0!important;color:#f5f5f7!important;font-size:13px!important;font-weight:700!important;padding:0 12px!important;}
.tw-topbar.sts-glass-nav .sts-nav-search input::placeholder{color:rgba(235,235,245,.55)!important;}
.tw-topbar.sts-glass-nav .sts-nav-search button{width:48px!important;height:38px!important;color:var(--sts-lime)!important;background:transparent!important;border-left:1px solid rgba(135,255,0,.22)!important;border-radius:0!important;}

.tw-topbar.sts-glass-nav .sts-user-actions{position:relative!important;z-index:4!important;display:flex!important;align-items:center!important;gap:8px!important;white-space:nowrap!important;}
.tw-topbar.sts-glass-nav .tw-btn{height:38px!important;border-radius:8px!important;padding:0 14px!important;border:1px solid rgba(255,255,255,.08)!important;background:rgba(17,20,31,.82)!important;color:#f2f2f6!important;font-size:13px!important;font-weight:900!important;box-shadow:0 6px 18px rgba(0,0,0,.28)!important;}
.tw-topbar.sts-glass-nav .tw-btn.primary{background:linear-gradient(135deg,#8f35ff,#b339ff)!important;border-color:rgba(185,90,255,.7)!important;color:#fff!important;box-shadow:0 0 18px rgba(160,32,255,.35)!important;}
.tw-topbar.sts-glass-nav .sts-nav-profile{width:44px!important;height:44px!important;min-width:44px!important;border-radius:50%!important;border:2px solid rgba(160,32,255,.82)!important;box-shadow:0 0 14px rgba(160,32,255,.62)!important;overflow:hidden!important;background:#050508!important;}
.tw-topbar.sts-glass-nav .sts-nav-profile img{width:100%!important;height:100%!important;object-fit:cover!important;}
.tw-topbar.sts-glass-nav .notification-bell-btn,.tw-topbar.sts-glass-nav .tw-icon{width:38px!important;height:38px!important;border-radius:10px!important;}
.sts-crypto-ticker{border-top:0!important;}

@media (max-width:1500px){
  .tw-topbar.sts-glass-nav{grid-template-columns:minmax(600px,1fr) minmax(250px,360px) auto!important;gap:10px!important;}
  .tw-topbar.sts-glass-nav .sts-nav-left{grid-template-columns:92px 245px 115px minmax(0,1fr)!important;}
  .sts-logo-png-link{width:90px!important}.sts-logo-png{width:105px!important}.sts-header-wordmark>span{font-size:23px!important}.sts-header-mascot-bg{width:115px!important}
  .tw-topbar.sts-glass-nav .sts-icon-nav a{padding:0 7px!important;font-size:10px!important;}
}
@media (max-width:1220px){
  html body.streamx-v5.twitch-v53 .tw-topbar.sts-glass-nav,.tw-topbar.sts-glass-nav{grid-template-columns:1fr auto!important;height:auto!important;min-height:76px!important;padding:6px 10px!important;}
  .tw-topbar.sts-glass-nav .sts-nav-left{grid-template-columns:82px 1fr!important;grid-template-rows:38px 28px!important;height:76px!important;}
  .sts-logo-png-link{height:62px!important;width:78px!important}.sts-logo-png{width:90px!important;height:62px!important}.sts-header-wordmark{height:38px!important}.sts-header-wordmark>span{font-size:21px!important}.sts-header-mascot-bg{display:none!important;}
  .tw-topbar.sts-glass-nav .sts-icon-nav{grid-column:2!important;overflow-x:auto!important;scrollbar-width:none!important;}
  .tw-topbar.sts-glass-nav .sts-icon-nav::-webkit-scrollbar{display:none!important;}
  .tw-topbar.sts-glass-nav .sts-nav-search{display:none!important;}
}
@media (max-width:760px){
  .tw-topbar.sts-glass-nav .sts-user-actions .tw-btn:not(.primary){display:none!important;}
  .sts-header-wordmark{display:none!important;}
  .tw-topbar.sts-glass-nav .sts-nav-left{grid-template-columns:80px 1fr!important;}
  .tw-topbar.sts-glass-nav .sts-icon-nav{grid-column:2!important;}
}

/* STS v5.6.135 - closer to DevMarvel mockup header */
html body.streamx-v5.twitch-v53,
body.streamx-v5.twitch-v53{padding-top:0!important;margin-top:0!important;}

html body.streamx-v5.twitch-v53 .tw-topbar.sts-glass-nav,
.tw-topbar.sts-glass-nav{
  height:84px!important;
  min-height:84px!important;
  padding:0 12px!important;
  grid-template-columns:minmax(720px,1fr) minmax(320px,420px) auto!important;
  gap:12px!important;
  background:
    radial-gradient(circle at 8% 50%, rgba(137,255,0,.10), transparent 10%),
    radial-gradient(circle at 23% 44%, rgba(164,37,255,.26), transparent 18%),
    radial-gradient(circle at 46% 50%, rgba(137,255,0,.10), transparent 22%),
    linear-gradient(180deg,#242428 0%,#15151a 54%,#101014 100%)!important;
  border-bottom:1px solid rgba(143,255,0,.45)!important;
  box-shadow:0 8px 32px rgba(0,0,0,.65), inset 0 -1px 0 rgba(159,40,255,.55)!important;
}
.tw-topbar.sts-glass-nav:before{
  background:linear-gradient(90deg, rgba(160,32,255,.22), transparent 22%, rgba(137,255,0,.10) 42%, transparent 62%, rgba(160,32,255,.16))!important;
}
.tw-topbar.sts-glass-nav:after{left:8px!important;right:8px!important;bottom:5px!important;background:linear-gradient(90deg,transparent,rgba(137,255,0,.65),rgba(160,32,255,.55),transparent)!important;}

.tw-topbar.sts-glass-nav .sts-nav-left{
  position:relative!important;
  display:block!important;
  height:84px!important;
  min-width:0!important;
  overflow:hidden!important;
  z-index:3!important;
}

.sts-header-brand-strip{
  position:absolute!important;
  left:0!important;
  top:0!important;
  width:560px!important;
  height:78px!important;
  display:block!important;
  text-decoration:none!important;
  border:0!important;
  background:transparent!important;
  overflow:visible!important;
  z-index:2!important;
}
.sts-header-brand-strip img{
  width:560px!important;
  height:78px!important;
  object-fit:contain!important;
  object-position:left center!important;
  display:block!important;
  filter:drop-shadow(0 0 16px rgba(160,32,255,.55));
}

.tw-topbar.sts-glass-nav .sts-icon-nav{
  position:absolute!important;
  left:118px!important;
  right:6px!important;
  bottom:8px!important;
  height:24px!important;
  display:flex!important;
  align-items:center!important;
  gap:18px!important;
  overflow:hidden!important;
  z-index:5!important;
  padding:0!important;
  margin:0!important;
}
.tw-topbar.sts-glass-nav .sts-icon-nav .nav-ico{display:none!important;}
.tw-topbar.sts-glass-nav .sts-icon-nav a,
.tw-topbar.sts-glass-nav .sts-icon-nav a.sts-nav-chip,
.tw-topbar.sts-glass-nav .sts-icon-nav a.sts-nav-chat{
  height:auto!important;
  min-width:0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  color:#cfcfd8!important;
  font-size:12px!important;
  line-height:1!important;
  letter-spacing:.85px!important;
  font-weight:900!important;
  text-transform:uppercase!important;
  text-shadow:0 1px 2px #000!important;
}
.tw-topbar.sts-glass-nav .sts-icon-nav a:hover,
.tw-topbar.sts-glass-nav .sts-icon-nav a.is-active{
  color:#93ff00!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  text-shadow:0 0 10px rgba(137,255,0,.7),0 1px 2px #000!important;
}
.tw-topbar.sts-glass-nav .sts-icon-nav a[href="/logo-pack"] span:last-child{font-size:0!important;}
.tw-topbar.sts-glass-nav .sts-icon-nav a[href="/logo-pack"] span:last-child:after{content:"Logo Pack";font-size:12px!important;}
.tw-topbar.sts-glass-nav .sts-icon-nav a[href="/sloth-coins"],
.tw-topbar.sts-glass-nav .sts-icon-nav a[href="/watch-parties"],
.tw-topbar.sts-glass-nav .sts-icon-nav a[href="/chat-app"]{display:none!important;}
.sts-following-nav{display:none!important;}

.tw-topbar.sts-glass-nav .sts-nav-search{
  height:38px!important;
  margin-top:0!important;
  border-radius:2px!important;
  background:rgba(12,14,21,.86)!important;
  border:1px solid rgba(132,255,0,.42)!important;
  box-shadow:0 0 0 1px rgba(0,0,0,.55), inset 0 0 0 1px rgba(160,32,255,.08)!important;
}
.tw-topbar.sts-glass-nav .sts-nav-search input{height:36px!important;font-size:13px!important;padding:0 13px!important;}
.tw-topbar.sts-glass-nav .sts-nav-search button{height:36px!important;width:46px!important;color:#fff!important;}

.tw-topbar.sts-glass-nav .sts-user-actions{gap:9px!important;}
.tw-topbar.sts-glass-nav .tw-btn{height:36px!important;border-radius:7px!important;padding:0 14px!important;font-size:12px!important;}
.tw-topbar.sts-glass-nav .tw-btn.primary{background:linear-gradient(135deg,#8b28ff,#a93dff)!important;box-shadow:0 0 20px rgba(168,85,247,.52)!important;}
.tw-topbar.sts-glass-nav .sts-nav-profile{width:42px!important;height:42px!important;min-width:42px!important;}

/* keep ticker from making the header feel too tall */
.sts-crypto-ticker{height:28px!important;min-height:28px!important;font-size:12px!important;background:#090a0d!important;border-bottom:1px solid rgba(160,32,255,.22)!important;}
.sts-crypto-track{height:28px!important;align-items:center!important;}

@media(max-width:1500px){
  html body.streamx-v5.twitch-v53 .tw-topbar.sts-glass-nav,.tw-topbar.sts-glass-nav{grid-template-columns:minmax(650px,1fr) minmax(290px,360px) auto!important;}
  .sts-header-brand-strip,.sts-header-brand-strip img{width:500px!important;}
  .tw-topbar.sts-glass-nav .sts-icon-nav{left:110px!important;gap:12px!important;}
  .tw-topbar.sts-glass-nav .sts-icon-nav a{font-size:11px!important;}
}
@media(max-width:1220px){
  html body.streamx-v5.twitch-v53 .tw-topbar.sts-glass-nav,.tw-topbar.sts-glass-nav{grid-template-columns:1fr auto!important;height:78px!important;min-height:78px!important;}
  .tw-topbar.sts-glass-nav .sts-nav-left{height:78px!important;}
  .sts-header-brand-strip,.sts-header-brand-strip img{width:430px!important;height:72px!important;}
  .tw-topbar.sts-glass-nav .sts-icon-nav{left:92px!important;right:0!important;gap:10px!important;overflow-x:auto!important;bottom:7px!important;scrollbar-width:none!important;}
  .tw-topbar.sts-glass-nav .sts-icon-nav::-webkit-scrollbar{display:none!important;}
  .tw-topbar.sts-glass-nav .sts-nav-search{display:none!important;}
}
@media(max-width:760px){
  .sts-header-brand-strip,.sts-header-brand-strip img{width:250px!important;height:64px!important;}
  .tw-topbar.sts-glass-nav .sts-icon-nav{left:74px!important;gap:12px!important;}
  .tw-topbar.sts-glass-nav .sts-user-actions .tw-btn:not(.primary){display:none!important;}
}

/* STS v5.6.136 - true mockup-style header proportions */
html body.streamx-v5.twitch-v53,
body.streamx-v5.twitch-v53{
  margin:0!important;
  padding-top:0!important;
  background:#06070a!important;
}

html body.streamx-v5.twitch-v53 .tw-topbar.sts-glass-nav.sts-mockup-header,
.tw-topbar.sts-glass-nav.sts-mockup-header{
  height:78px!important;
  min-height:78px!important;
  padding:0 16px!important;
  display:grid!important;
  grid-template-columns:minmax(900px,1fr) minmax(320px,420px) auto!important;
  align-items:center!important;
  gap:20px!important;
  overflow:visible!important;
  position:sticky!important;
  top:0!important;
  z-index:2000!important;
  background:
    radial-gradient(circle at 11% 48%, rgba(126,255,0,.15), transparent 14%),
    radial-gradient(circle at 26% 45%, rgba(161,42,255,.24), transparent 20%),
    linear-gradient(180deg,#252529 0%,#1a1a1f 52%,#101014 100%)!important;
  border-bottom:1px solid rgba(126,255,0,.42)!important;
  box-shadow:0 10px 36px rgba(0,0,0,.72), inset 0 -1px 0 rgba(166,45,255,.55)!important;
}
.tw-topbar.sts-glass-nav.sts-mockup-header::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  pointer-events:none!important;
  background:linear-gradient(90deg,rgba(0,0,0,.45),rgba(135,255,0,.06) 18%,rgba(160,32,255,.14) 35%,transparent 65%,rgba(160,32,255,.10))!important;
  z-index:0!important;
}
.tw-topbar.sts-glass-nav.sts-mockup-header::after{
  content:""!important;
  position:absolute!important;
  left:12px!important;
  right:12px!important;
  bottom:4px!important;
  height:1px!important;
  background:linear-gradient(90deg,transparent,rgba(128,255,0,.75),rgba(160,32,255,.55),transparent)!important;
  z-index:1!important;
}

.sts-mock-left{
  position:relative!important;
  z-index:3!important;
  height:78px!important;
  min-width:0!important;
  display:grid!important;
  grid-template-columns:620px minmax(0,1fr)!important;
  grid-template-rows:48px 30px!important;
  align-items:end!important;
  overflow:hidden!important;
}
.sts-mock-brand{
  grid-column:1!important;
  grid-row:1 / 3!important;
  width:620px!important;
  height:78px!important;
  display:flex!important;
  align-items:center!important;
  text-decoration:none!important;
  overflow:hidden!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.sts-mock-brand img{
  width:620px!important;
  height:70px!important;
  object-fit:contain!important;
  object-position:left center!important;
  display:block!important;
  filter:drop-shadow(0 0 14px rgba(161,42,255,.42));
}
.sts-mock-nav{
  grid-column:2!important;
  grid-row:2!important;
  height:28px!important;
  display:flex!important;
  align-items:center!important;
  gap:20px!important;
  overflow:hidden!important;
  white-space:nowrap!important;
  padding:0 0 5px 0!important;
  margin:0!important;
}
.sts-mock-nav a,
.sts-mock-more-btn{
  appearance:none!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  outline:0!important;
  color:#d2d2da!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:900!important;
  letter-spacing:.8px!important;
  text-transform:uppercase!important;
  text-decoration:none!important;
  padding:0!important;
  margin:0!important;
  height:auto!important;
  min-width:auto!important;
  text-shadow:0 1px 2px #000!important;
  cursor:pointer!important;
}
.sts-mock-nav a:hover,
.sts-mock-nav a.is-active,
.sts-mock-more-btn:hover{
  color:#91ff00!important;
  text-shadow:0 0 10px rgba(126,255,0,.75),0 1px 2px #000!important;
}
.sts-mock-more-wrap{position:relative!important;display:flex!important;align-items:center!important;z-index:30!important;}
.sts-mock-more-menu{
  display:none!important;
  position:absolute!important;
  top:22px!important;
  right:0!important;
  min-width:140px!important;
  padding:8px!important;
  border-radius:10px!important;
  background:rgba(10,10,15,.97)!important;
  border:1px solid rgba(145,255,0,.32)!important;
  box-shadow:0 16px 40px rgba(0,0,0,.65),0 0 18px rgba(160,32,255,.28)!important;
}
.sts-mock-more-menu.open{display:grid!important;gap:8px!important;}
.sts-mock-more-menu a{font-size:11px!important;color:#fff!important;padding:8px 10px!important;border-radius:7px!important;}
.sts-mock-more-menu a:hover{background:rgba(145,255,0,.12)!important;}

.tw-topbar.sts-glass-nav.sts-mockup-header .sts-mock-search{
  position:relative!important;
  z-index:4!important;
  height:38px!important;
  min-width:320px!important;
  max-width:420px!important;
  margin:0!important;
  display:flex!important;
  align-items:center!important;
  background:rgba(12,15,24,.88)!important;
  border:1px solid rgba(137,255,0,.55)!important;
  border-radius:2px!important;
  box-shadow:0 0 0 1px rgba(0,0,0,.7), inset 0 0 0 1px rgba(160,32,255,.10)!important;
  overflow:visible!important;
}
.tw-topbar.sts-glass-nav.sts-mockup-header .sts-mock-search input{
  height:36px!important;
  background:transparent!important;
  border:0!important;
  color:#f1f1f5!important;
  font-size:13px!important;
  font-weight:700!important;
  padding:0 14px!important;
  min-width:0!important;
}
.tw-topbar.sts-glass-nav.sts-mockup-header .sts-mock-search button{
  width:46px!important;
  height:36px!important;
  background:transparent!important;
  border:0!important;
  border-left:1px solid rgba(137,255,0,.22)!important;
  color:#fff!important;
  border-radius:0!important;
}

.tw-topbar.sts-glass-nav.sts-mockup-header .sts-mock-actions{
  position:relative!important;
  z-index:4!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  white-space:nowrap!important;
}
.tw-topbar.sts-glass-nav.sts-mockup-header .tw-btn{
  height:36px!important;
  min-height:36px!important;
  border-radius:7px!important;
  padding:0 14px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(255,255,255,.10)!important;
  background:rgba(18,22,34,.86)!important;
  color:#fff!important;
  font-size:12px!important;
  font-weight:900!important;
  letter-spacing:.2px!important;
  box-shadow:0 8px 20px rgba(0,0,0,.32)!important;
}
.tw-topbar.sts-glass-nav.sts-mockup-header .tw-btn.primary{
  background:linear-gradient(135deg,#8b2cff,#a43bff)!important;
  border-color:rgba(190,105,255,.7)!important;
  box-shadow:0 0 22px rgba(160,32,255,.48)!important;
}
.tw-topbar.sts-glass-nav.sts-mockup-header .sts-nav-profile{
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  border-radius:999px!important;
  overflow:hidden!important;
  border:2px solid rgba(160,32,255,.75)!important;
  background:#08080c!important;
  box-shadow:0 0 16px rgba(160,32,255,.6)!important;
}
.tw-topbar.sts-glass-nav.sts-mockup-header .sts-nav-profile img{width:100%!important;height:100%!important;object-fit:cover!important;}
.tw-topbar.sts-glass-nav.sts-mockup-header .notification-bell-btn,
.tw-topbar.sts-glass-nav.sts-mockup-header .tw-icon{width:36px!important;height:36px!important;border-radius:8px!important;}

/* reduce ticker height so it doesn't make the header look like two nav bars */
.sts-crypto-ticker{height:26px!important;min-height:26px!important;font-size:12px!important;background:#07080a!important;border-top:0!important;border-bottom:1px solid rgba(160,32,255,.25)!important;}
.sts-crypto-track{height:26px!important;align-items:center!important;}

@media(max-width:1550px){
  .tw-topbar.sts-glass-nav.sts-mockup-header{grid-template-columns:minmax(780px,1fr) minmax(270px,360px) auto!important;gap:14px!important;}
  .sts-mock-left{grid-template-columns:500px minmax(0,1fr)!important;}
  .sts-mock-brand,.sts-mock-brand img{width:500px!important;}
  .sts-mock-nav{gap:13px!important;}
  .sts-mock-nav a,.sts-mock-more-btn{font-size:11px!important;}
}
@media(max-width:1220px){
  .tw-topbar.sts-glass-nav.sts-mockup-header{grid-template-columns:1fr auto!important;height:74px!important;min-height:74px!important;padding:0 10px!important;}
  .sts-mock-left{height:74px!important;grid-template-columns:360px minmax(0,1fr)!important;grid-template-rows:44px 28px!important;}
  .sts-mock-brand,.sts-mock-brand img{width:360px!important;height:68px!important;}
  .sts-mock-nav{gap:12px!important;overflow-x:auto!important;scrollbar-width:none!important;}
  .sts-mock-nav::-webkit-scrollbar{display:none!important;}
  .sts-mock-search{display:none!important;}
}
@media(max-width:760px){
  .tw-topbar.sts-glass-nav.sts-mockup-header{height:68px!important;min-height:68px!important;grid-template-columns:1fr auto!important;}
  .sts-mock-left{height:68px!important;grid-template-columns:190px 1fr!important;grid-template-rows:38px 25px!important;}
  .sts-mock-brand,.sts-mock-brand img{width:190px!important;height:62px!important;}
  .sts-mock-nav{gap:11px!important;padding-bottom:4px!important;}
  .sts-mock-nav a,.sts-mock-more-btn{font-size:10px!important;}
  .sts-paypal-mini,.sts-dashboard-mini,.notification-bell-wrap{display:none!important;}
}

/* STS v5.6.137 - premium mockup header + fuller homepage */
html body.streamx-v5.twitch-v53 .tw-topbar.sts-glass-nav.sts-mockup-header,
.tw-topbar.sts-glass-nav.sts-mockup-header{
  height:72px!important;
  min-height:72px!important;
  padding:0 16px!important;
  grid-template-columns:minmax(980px,1fr) minmax(300px,410px) auto!important;
  gap:18px!important;
  background:
    radial-gradient(circle at 7% 52%, rgba(126,255,0,.17), transparent 12%),
    radial-gradient(circle at 21% 48%, rgba(160,32,255,.32), transparent 18%),
    linear-gradient(180deg,#222226 0%,#17171b 52%,#0d0d11 100%)!important;
}
.sts-mock-left{
  height:72px!important;
  grid-template-columns:650px minmax(0,1fr)!important;
  grid-template-rows:43px 29px!important;
}
.sts-mock-brand{
  width:650px!important;
  height:72px!important;
}
.sts-mock-brand img{
  width:650px!important;
  height:68px!important;
  object-fit:contain!important;
  object-position:left center!important;
}
.sts-mock-nav{
  height:24px!important;
  gap:22px!important;
  padding:0 0 6px 0!important;
  align-self:end!important;
}
.sts-mock-nav a,
.sts-mock-more-btn{
  font-size:12px!important;
  letter-spacing:1px!important;
  color:#e5e5ec!important;
}
.sts-mock-more-btn::before{content:none!important;}
.tw-topbar.sts-glass-nav.sts-mockup-header .sts-mock-search{
  height:36px!important;
  min-width:300px!important;
  max-width:410px!important;
}
.tw-topbar.sts-glass-nav.sts-mockup-header .sts-mock-search input,
.tw-topbar.sts-glass-nav.sts-mockup-header .sts-mock-search button{height:34px!important;}
.tw-topbar.sts-glass-nav.sts-mockup-header .tw-btn{height:34px!important;min-height:34px!important;}

/* make the crypto ticker a thin strip like the mockup */
.sts-crypto-ticker{
  height:24px!important;
  min-height:24px!important;
  font-size:11px!important;
  background:#06070a!important;
  border-top:0!important;
  border-bottom:1px solid rgba(126,255,0,.18)!important;
  overflow:hidden!important;
}
.sts-crypto-track{height:24px!important;line-height:24px!important;}
.sts-crypto-item{padding-inline:16px!important;}

/* homepage: remove old cramped side rail and make the stream platform feel full-width */
.sts-tv-home{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  background:
    radial-gradient(circle at 50% 8%, rgba(126,255,0,.08), transparent 26%),
    radial-gradient(circle at 70% 18%, rgba(160,32,255,.09), transparent 30%),
    #060807!important;
}
.sts-tv-sidebar{
  display:none!important;
}
.sts-tv-main{
  width:100%!important;
  max-width:1720px!important;
  margin:0 auto!important;
  padding:34px clamp(18px,2.4vw,46px) 80px!important;
}
.sts-coverflow{
  width:100%!important;
  min-height:390px!important;
  display:grid!important;
  place-items:center!important;
  position:relative!important;
  padding:18px 54px 28px!important;
  background:radial-gradient(circle at 50% 35%, rgba(126,255,0,.10), transparent 38%)!important;
}
.coverflow-stage{
  width:100%!important;
  max-width:1320px!important;
  min-height:360px!important;
  position:relative!important;
}
.coverflow-card.active{
  width:min(980px,74vw)!important;
  transform:translate(-50%,-50%) scale(1)!important;
  opacity:1!important;
  z-index:10!important;
}
.coverflow-card.left{
  transform:translate(-92%,-50%) scale(.76)!important;
  opacity:.48!important;
}
.coverflow-card.right{
  transform:translate(-8%,-50%) scale(.76)!important;
  opacity:.48!important;
}
.coverflow-card.far-left,
.coverflow-card.far-right{opacity:.18!important;}
.coverflow-thumb{
  min-height:320px!important;
  border-radius:18px!important;
  background-size:cover!important;
  background-position:center!important;
  border:1px solid rgba(160,32,255,.42)!important;
  box-shadow:0 28px 85px rgba(0,0,0,.55),0 0 34px rgba(160,32,255,.18)!important;
}
.coverflow-arrow{
  width:44px!important;
  height:44px!important;
  border-radius:10px!important;
  background:rgba(20,25,38,.9)!important;
  border:1px solid rgba(255,255,255,.14)!important;
  color:#fff!important;
  box-shadow:0 12px 30px rgba(0,0,0,.35)!important;
}
.tv-row-section,
.tv-bottom-grid{
  max-width:1560px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
.tv-section-title{
  margin-top:18px!important;
  align-items:center!important;
}
.tv-section-title h2{
  font-size:28px!important;
  letter-spacing:-.5px!important;
}
.tv-card-row{
  display:grid!important;
  grid-template-columns:repeat(auto-fill,minmax(270px,1fr))!important;
  gap:18px!important;
  overflow:visible!important;
}
.tv-live-card{
  min-width:0!important;
  width:100%!important;
  border-radius:16px!important;
  background:rgba(10,12,16,.72)!important;
  border:1px solid rgba(255,255,255,.06)!important;
  overflow:hidden!important;
}
.tv-thumb{
  height:155px!important;
  border-radius:14px 14px 0 0!important;
  background-size:cover!important;
  background-position:center!important;
}
.tv-category-row{
  display:grid!important;
  grid-template-columns:repeat(auto-fill,minmax(190px,1fr))!important;
  gap:18px!important;
  overflow:visible!important;
}
.tv-category-card{
  min-width:0!important;
  width:100%!important;
}
.tv-category-card>div{height:170px!important;background-size:cover!important;background-position:center!important;}
.tv-bottom-grid{
  display:grid!important;
  grid-template-columns:1.1fr .9fr!important;
  gap:22px!important;
}
@media(max-width:1550px){
  html body.streamx-v5.twitch-v53 .tw-topbar.sts-glass-nav.sts-mockup-header,
  .tw-topbar.sts-glass-nav.sts-mockup-header{grid-template-columns:minmax(780px,1fr) minmax(280px,360px) auto!important;gap:14px!important;}
  .sts-mock-left{grid-template-columns:530px minmax(0,1fr)!important;}
  .sts-mock-brand,.sts-mock-brand img{width:530px!important;}
  .sts-mock-nav{gap:14px!important;}
  .sts-mock-nav a,.sts-mock-more-btn{font-size:11px!important;}
}
@media(max-width:1220px){
  .sts-tv-main{padding:22px 14px 60px!important;}
  .sts-coverflow{padding-inline:12px!important;min-height:300px!important;}
  .coverflow-stage{min-height:290px!important;}
  .coverflow-card.active{width:94vw!important;}
  .coverflow-card.left,.coverflow-card.right,.coverflow-card.far-left,.coverflow-card.far-right{display:none!important;}
  .coverflow-thumb{min-height:235px!important;}
  .tv-bottom-grid{grid-template-columns:1fr!important;}
}

/* ======================================================================
   STS v5.6.138 - HOMEPAGE WIDTH FIX
   Fixes the broken tiny-left homepage layout from v5.6.137.
   Makes the home page full-width, removes the old sidebar column,
   and restores the featured stream / content rows to proper size.
====================================================================== */
html body.streamx-v5.twitch-v53,
body.streamx-v5.twitch-v53{
  overflow-x:hidden!important;
  background:#030506!important;
}

html body.streamx-v5.twitch-v53 .page.v5-page,
html body.streamx-v5.twitch-v53 main.page.v5-page,
html body.streamx-v5.twitch-v53 .v5-page{
  width:100vw!important;
  max-width:100vw!important;
  margin:0!important;
  padding:0!important;
  overflow-x:hidden!important;
  background:
    radial-gradient(circle at 50% 0%, rgba(105,255,25,.10), transparent 32%),
    radial-gradient(circle at 76% 12%, rgba(147,45,255,.10), transparent 30%),
    #030506!important;
}

html body.streamx-v5.twitch-v53 .sts-tv-home,
body.streamx-v5.twitch-v53 .sts-tv-home{
  display:block!important;
  width:100vw!important;
  max-width:100vw!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  min-height:calc(100vh - 96px)!important;
  background:transparent!important;
  border:0!important;
  overflow:visible!important;
}

html body.streamx-v5.twitch-v53 .sts-tv-sidebar,
body.streamx-v5.twitch-v53 .sts-tv-sidebar{
  display:none!important;
  width:0!important;
  min-width:0!important;
  max-width:0!important;
  padding:0!important;
  margin:0!important;
}

html body.streamx-v5.twitch-v53 .sts-tv-main,
body.streamx-v5.twitch-v53 .sts-tv-main{
  display:block!important;
  width:100%!important;
  max-width:1920px!important;
  min-width:0!important;
  margin:0 auto!important;
  padding:22px clamp(18px,2.2vw,42px) 70px!important;
  box-sizing:border-box!important;
  background:
    linear-gradient(90deg, rgba(8,28,10,.55), rgba(8,5,12,.65) 52%, rgba(16,8,24,.48)),
    radial-gradient(circle at 48% 4%, rgba(87,255,18,.12), transparent 26%)!important;
  overflow:visible!important;
}

html body.streamx-v5.twitch-v53 .sts-coverflow,
body.streamx-v5.twitch-v53 .sts-coverflow{
  position:relative!important;
  display:block!important;
  width:100%!important;
  max-width:1500px!important;
  height:440px!important;
  min-height:440px!important;
  margin:8px auto 46px!important;
  padding:0!important;
  overflow:hidden!important;
  border-radius:22px!important;
  background:
    radial-gradient(circle at 50% 45%, rgba(91,255,22,.10), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.01))!important;
  border:1px solid rgba(145,45,255,.23)!important;
  box-shadow:0 24px 70px rgba(0,0,0,.42), inset 0 0 0 1px rgba(105,255,25,.05)!important;
}

html body.streamx-v5.twitch-v53 .coverflow-stage,
body.streamx-v5.twitch-v53 .coverflow-stage{
  position:relative!important;
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  display:block!important;
  overflow:hidden!important;
}

html body.streamx-v5.twitch-v53 .coverflow-card,
body.streamx-v5.twitch-v53 .coverflow-card{
  position:absolute!important;
  top:50%!important;
  left:50%!important;
  display:block!important;
  width:min(920px,72vw)!important;
  height:360px!important;
  min-width:0!important;
  max-width:none!important;
  border-radius:18px!important;
  overflow:hidden!important;
  transform:translate(-50%,-50%) scale(.74)!important;
  opacity:.25!important;
  pointer-events:none!important;
  transition:transform .28s ease,opacity .28s ease,filter .28s ease!important;
}

html body.streamx-v5.twitch-v53 .coverflow-card.active,
body.streamx-v5.twitch-v53 .coverflow-card.active{
  transform:translate(-50%,-50%) scale(1)!important;
  opacity:1!important;
  z-index:5!important;
  pointer-events:auto!important;
  filter:none!important;
}
html body.streamx-v5.twitch-v53 .coverflow-card.left,
body.streamx-v5.twitch-v53 .coverflow-card.left{
  transform:translate(calc(-50% - 470px),-50%) scale(.70)!important;
  opacity:.46!important;
  z-index:3!important;
}
html body.streamx-v5.twitch-v53 .coverflow-card.right,
body.streamx-v5.twitch-v53 .coverflow-card.right{
  transform:translate(calc(-50% + 470px),-50%) scale(.70)!important;
  opacity:.46!important;
  z-index:3!important;
}
html body.streamx-v5.twitch-v53 .coverflow-card.far-left,
html body.streamx-v5.twitch-v53 .coverflow-card.far-right,
body.streamx-v5.twitch-v53 .coverflow-card.far-left,
body.streamx-v5.twitch-v53 .coverflow-card.far-right{
  opacity:0!important;
  pointer-events:none!important;
}

html body.streamx-v5.twitch-v53 .coverflow-thumb,
body.streamx-v5.twitch-v53 .coverflow-thumb{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  background-size:cover!important;
  background-position:center!important;
}

html body.streamx-v5.twitch-v53 .coverflow-info,
body.streamx-v5.twitch-v53 .coverflow-info{
  position:absolute!important;
  left:18px!important;
  right:18px!important;
  bottom:18px!important;
  z-index:9!important;
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  padding:12px 14px!important;
  border-radius:16px!important;
  background:linear-gradient(90deg, rgba(2,3,5,.82), rgba(2,3,5,.35))!important;
  border:1px solid rgba(135,255,0,.18)!important;
  backdrop-filter:blur(10px)!important;
}

html body.streamx-v5.twitch-v53 .coverflow-arrow,
body.streamx-v5.twitch-v53 .coverflow-arrow{
  z-index:20!important;
  width:48px!important;
  height:58px!important;
  border-radius:14px!important;
  border:1px solid rgba(255,255,255,.14)!important;
  background:rgba(12,15,22,.80)!important;
  color:#fff!important;
  font-size:44px!important;
  line-height:1!important;
  box-shadow:0 14px 30px rgba(0,0,0,.4)!important;
}
html body.streamx-v5.twitch-v53 .coverflow-prev{left:18px!important;}
html body.streamx-v5.twitch-v53 .coverflow-next{right:18px!important;}

html body.streamx-v5.twitch-v53 .tv-row-section,
body.streamx-v5.twitch-v53 .tv-row-section{
  width:100%!important;
  max-width:1500px!important;
  margin:0 auto 38px!important;
  padding:0!important;
  clear:both!important;
}

html body.streamx-v5.twitch-v53 .tv-section-title,
body.streamx-v5.twitch-v53 .tv-section-title{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  margin:0 0 16px!important;
}
html body.streamx-v5.twitch-v53 .tv-section-title h2,
body.streamx-v5.twitch-v53 .tv-section-title h2{
  margin:0!important;
  font-size:clamp(24px,2vw,34px)!important;
  line-height:1!important;
  letter-spacing:-.02em!important;
}

html body.streamx-v5.twitch-v53 .tv-card-row,
body.streamx-v5.twitch-v53 .tv-card-row{
  display:grid!important;
  grid-template-columns:repeat(auto-fill,minmax(270px,1fr))!important;
  gap:18px!important;
  width:100%!important;
  justify-content:stretch!important;
  align-items:start!important;
}
html body.streamx-v5.twitch-v53 .tv-live-card,
body.streamx-v5.twitch-v53 .tv-live-card{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
}
html body.streamx-v5.twitch-v53 .tv-thumb,
body.streamx-v5.twitch-v53 .tv-thumb{
  height:auto!important;
  aspect-ratio:16/9!important;
  min-height:150px!important;
}

html body.streamx-v5.twitch-v53 .tv-category-row,
body.streamx-v5.twitch-v53 .tv-category-row{
  display:grid!important;
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr))!important;
  gap:18px!important;
  width:100%!important;
}

/* Make ticker thinner so it stops eating the homepage. */
html body.streamx-v5.twitch-v53 .sts-crypto-ticker,
body.streamx-v5.twitch-v53 .sts-crypto-ticker{
  height:22px!important;
  min-height:22px!important;
  max-height:22px!important;
  overflow:hidden!important;
  font-size:12px!important;
  line-height:22px!important;
  border-bottom:1px solid rgba(135,255,0,.18)!important;
}
html body.streamx-v5.twitch-v53 .sts-crypto-track,
body.streamx-v5.twitch-v53 .sts-crypto-track{height:22px!important;align-items:center!important;}

@media(max-width:1500px){
  html body.streamx-v5.twitch-v53 .sts-coverflow{height:390px!important;min-height:390px!important;}
  html body.streamx-v5.twitch-v53 .coverflow-card{width:min(820px,76vw)!important;height:315px!important;}
  html body.streamx-v5.twitch-v53 .coverflow-card.left{transform:translate(calc(-50% - 395px),-50%) scale(.68)!important;}
  html body.streamx-v5.twitch-v53 .coverflow-card.right{transform:translate(calc(-50% + 395px),-50%) scale(.68)!important;}
}
@media(max-width:900px){
  html body.streamx-v5.twitch-v53 .sts-tv-main{padding:14px 12px 52px!important;}
  html body.streamx-v5.twitch-v53 .sts-coverflow{height:290px!important;min-height:290px!important;margin-bottom:30px!important;}
  html body.streamx-v5.twitch-v53 .coverflow-card{width:94vw!important;height:240px!important;}
  html body.streamx-v5.twitch-v53 .coverflow-card.left,
  html body.streamx-v5.twitch-v53 .coverflow-card.right{opacity:0!important;pointer-events:none!important;}
  html body.streamx-v5.twitch-v53 .tv-card-row{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))!important;gap:12px!important;}
}