/* STS v5.6.236 - Android app / WebView sync
   Forces the Android app and PWA to use the same compact mobile UI as the browser. */

html.sts-android-app,
html.sts-android-app body,
html.sts-pwa-mode,
html.sts-pwa-mode body{
  width:100% !important;
  max-width:100vw !important;
  min-width:0 !important;
  overflow-x:hidden !important;
  background:#050507 !important;
}

html.sts-android-app body,
html.sts-pwa-mode body{
  padding-bottom:calc(74px + env(safe-area-inset-bottom,0px)) !important;
  touch-action:manipulation;
}

html.sts-android-app *,
html.sts-pwa-mode *{
  box-sizing:border-box;
}

html.sts-android-app .tw-topbar,
html.sts-android-app .sts-glass-nav,
html.sts-pwa-mode .tw-topbar,
html.sts-pwa-mode .sts-glass-nav{
  min-height:56px !important;
  height:56px !important;
  padding:6px 8px !important;
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  overflow:hidden !important;
  background:rgba(5,5,7,.96) !important;
  border-bottom:1px solid rgba(123,64,255,.28) !important;
}

html.sts-android-app .sts-brand-card,
html.sts-android-app .tw-logo,
html.sts-pwa-mode .sts-brand-card,
html.sts-pwa-mode .tw-logo{
  width:118px !important;
  min-width:118px !important;
  max-width:118px !important;
  height:42px !important;
  padding:4px !important;
  overflow:hidden !important;
  border-radius:12px !important;
}

html.sts-android-app .sts-brand-card img,
html.sts-android-app .tw-logo img,
html.sts-pwa-mode .sts-brand-card img,
html.sts-pwa-mode .tw-logo img{
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
}

html.sts-android-app .sts-brand-card strong,
html.sts-android-app .tw-logo strong,
html.sts-android-app .sts-brand-card small,
html.sts-android-app .tw-logo small,
html.sts-pwa-mode .sts-brand-card strong,
html.sts-pwa-mode .tw-logo strong,
html.sts-pwa-mode .sts-brand-card small,
html.sts-pwa-mode .tw-logo small{
  display:none !important;
}

html.sts-android-app .sts-nav-search,
html.sts-android-app .tw-search,
html.sts-pwa-mode .sts-nav-search,
html.sts-pwa-mode .tw-search{
  display:none !important;
}

html.sts-android-app .sts-user-actions,
html.sts-android-app .tw-actions,
html.sts-pwa-mode .sts-user-actions,
html.sts-pwa-mode .tw-actions{
  margin-left:auto !important;
  flex:0 0 auto !important;
}

/* Bottom mobile app navigation */
html.sts-android-app .sts-icon-nav,
html.sts-android-app .tw-main-nav,
html.sts-pwa-mode .sts-icon-nav,
html.sts-pwa-mode .tw-main-nav{
  position:fixed !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  z-index:2147483000 !important;
  height:auto !important;
  display:grid !important;
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:4px !important;
  padding:7px 8px calc(7px + env(safe-area-inset-bottom,0px)) !important;
  background:#050507 !important;
  border-top:1px solid rgba(123,64,255,.42) !important;
  box-shadow:0 -16px 36px rgba(0,0,0,.72) !important;
  overflow:hidden !important;
}

html.sts-android-app .sts-icon-nav a,
html.sts-android-app .tw-main-nav a,
html.sts-pwa-mode .sts-icon-nav a,
html.sts-pwa-mode .tw-main-nav a{
  width:100% !important;
  min-width:0 !important;
  height:50px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  padding:4px 2px !important;
  border-radius:14px !important;
  font-size:10px !important;
  line-height:1.1 !important;
  white-space:nowrap !important;
  color:#f5f3ff !important;
  background:transparent !important;
}

html.sts-android-app .sts-icon-nav a:nth-child(n+6),
html.sts-android-app .tw-main-nav a:nth-child(n+6),
html.sts-pwa-mode .sts-icon-nav a:nth-child(n+6),
html.sts-pwa-mode .tw-main-nav a:nth-child(n+6){
  display:none !important;
}

html.sts-android-app main,
html.sts-android-app .page,
html.sts-android-app .v5-page,
html.sts-android-app .home-page,
html.sts-android-app .browse-page,
html.sts-android-app .watch-page,
html.sts-pwa-mode main,
html.sts-pwa-mode .page,
html.sts-pwa-mode .v5-page,
html.sts-pwa-mode .home-page,
html.sts-pwa-mode .browse-page,
html.sts-pwa-mode .watch-page{
  width:100% !important;
  max-width:100vw !important;
  min-width:0 !important;
  margin:0 !important;
  padding:10px !important;
  overflow-x:hidden !important;
}

html.sts-android-app .crypto-ticker,
html.sts-android-app .ticker-wrap,
html.sts-pwa-mode .crypto-ticker,
html.sts-pwa-mode .ticker-wrap{
  height:28px !important;
  font-size:12px !important;
  overflow:hidden !important;
}

/* Homepage / featured stream cards compact */
html.sts-android-app .featured-partner,
html.sts-android-app .featured-partner-card,
html.sts-android-app .home-featured,
html.sts-android-app .live-showcase,
html.sts-android-app .showcase-card,
html.sts-pwa-mode .featured-partner,
html.sts-pwa-mode .featured-partner-card,
html.sts-pwa-mode .home-featured,
html.sts-pwa-mode .live-showcase,
html.sts-pwa-mode .showcase-card{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  display:flex !important;
  flex-direction:column !important;
  gap:10px !important;
  margin:10px 0 !important;
  padding:10px !important;
  border-radius:18px !important;
  overflow:hidden !important;
}

html.sts-android-app .featured-partner img,
html.sts-android-app .home-featured img,
html.sts-android-app .live-showcase img,
html.sts-android-app .showcase-card img,
html.sts-pwa-mode .featured-partner img,
html.sts-pwa-mode .home-featured img,
html.sts-pwa-mode .live-showcase img,
html.sts-pwa-mode .showcase-card img{
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  max-height:240px !important;
  object-fit:cover !important;
  border-radius:16px !important;
}

html.sts-android-app .stream-info-panel,
html.sts-android-app .channel-side,
html.sts-android-app .creator-panel,
html.sts-pwa-mode .stream-info-panel,
html.sts-pwa-mode .channel-side,
html.sts-pwa-mode .creator-panel{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  padding:12px !important;
  border-radius:16px !important;
}

html.sts-android-app h1,
html.sts-pwa-mode h1{
  font-size:clamp(24px,8vw,36px) !important;
  line-height:1.05 !important;
}

html.sts-android-app h2,
html.sts-pwa-mode h2{
  font-size:clamp(20px,6vw,28px) !important;
}

/* Watch page: usable player + chat */
html.sts-android-app .watch-layout,
html.sts-android-app .stream-layout,
html.sts-android-app .player-chat-layout,
html.sts-pwa-mode .watch-layout,
html.sts-pwa-mode .stream-layout,
html.sts-pwa-mode .player-chat-layout{
  display:flex !important;
  flex-direction:column !important;
  gap:10px !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
}

html.sts-android-app .stream-player,
html.sts-android-app .player-card,
html.sts-android-app .video-shell,
html.sts-android-app .watch-player,
html.sts-pwa-mode .stream-player,
html.sts-pwa-mode .player-card,
html.sts-pwa-mode .video-shell,
html.sts-pwa-mode .watch-player{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  height:auto !important;
  aspect-ratio:16/9 !important;
  border-radius:16px !important;
  overflow:hidden !important;
}

html.sts-android-app video,
html.sts-pwa-mode video{
  width:100% !important;
  height:auto !important;
  max-height:38vh !important;
  object-fit:contain !important;
}

html.sts-android-app .chat-panel,
html.sts-android-app .stream-chat,
html.sts-android-app .chat-card,
html.sts-pwa-mode .chat-panel,
html.sts-pwa-mode .stream-chat,
html.sts-pwa-mode .chat-card{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  height:min(48vh,520px) !important;
  max-height:520px !important;
  border-radius:18px !important;
  overflow:hidden !important;
}

html.sts-android-app .chat-input-row,
html.sts-android-app .chat-form,
html.sts-pwa-mode .chat-input-row,
html.sts-pwa-mode .chat-form{
  display:grid !important;
  grid-template-columns:1fr auto !important;
  gap:8px !important;
  padding:8px !important;
}

html.sts-android-app #chatInput,
html.sts-android-app .chat-input-row input,
html.sts-android-app .chat-form input,
html.sts-pwa-mode #chatInput,
html.sts-pwa-mode .chat-input-row input,
html.sts-pwa-mode .chat-form input{
  min-width:0 !important;
  width:100% !important;
  height:44px !important;
  font-size:16px !important;
}

html.sts-android-app .chat-input-row button,
html.sts-android-app .chat-form button,
html.sts-pwa-mode .chat-input-row button,
html.sts-pwa-mode .chat-form button{
  height:44px !important;
  min-width:72px !important;
  padding:0 12px !important;
  font-size:14px !important;
}

/* Cards and grids */
html.sts-android-app .stream-grid,
html.sts-android-app .creator-grid,
html.sts-android-app .cards-grid,
html.sts-android-app .category-grid,
html.sts-android-app .home-grid,
html.sts-pwa-mode .stream-grid,
html.sts-pwa-mode .creator-grid,
html.sts-pwa-mode .cards-grid,
html.sts-pwa-mode .category-grid,
html.sts-pwa-mode .home-grid{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:12px !important;
  width:100% !important;
}

html.sts-android-app .stream-card,
html.sts-android-app .creator-card,
html.sts-android-app .category-card,
html.sts-android-app .panel-card,
html.sts-pwa-mode .stream-card,
html.sts-pwa-mode .creator-card,
html.sts-pwa-mode .category-card,
html.sts-pwa-mode .panel-card{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  border-radius:18px !important;
}

/* Mobile go-live page */
html.sts-android-app .mobile-live-page,
html.sts-pwa-mode .mobile-live-page{
  padding:10px !important;
}

html.sts-android-app .mobile-live-controls,
html.sts-pwa-mode .mobile-live-controls{
  position:sticky !important;
  bottom:calc(72px + env(safe-area-inset-bottom,0px)) !important;
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:8px !important;
  padding:8px !important;
  background:#050507 !important;
  border-radius:18px !important;
  z-index:9999 !important;
}

html.sts-android-app .mobile-live-controls button,
html.sts-pwa-mode .mobile-live-controls button{
  min-height:46px !important;
  border-radius:14px !important;
}

html.sts-android-app .mobile-live-preview video,
html.sts-pwa-mode .mobile-live-preview video{
  width:100% !important;
  max-height:52vh !important;
  border-radius:18px !important;
  object-fit:cover !important;
}

/* Kill desktop overflow from older theme files */
@media (max-width: 900px){
  body, html{ max-width:100vw !important; overflow-x:hidden !important; }
  .tw-shell,.sts-shell,.site-shell,.main-shell,.content-shell{ width:100% !important; max-width:100vw !important; min-width:0 !important; }
}
