/* Selected mobile channel only. The feed and desktop layouts keep their rules. */
.mobile-channel-back,.mobile-channel-details-toggle,.mobile-channel-narrow{display:none}
@media(max-width:760px){
  body.mobile-channel-active{overflow:hidden;overscroll-behavior:none;background:var(--provider-surface,#0e0e10)}
  body.mobile-channel-active :is(.topbar,.mobile-nav,.watch-join-strip,#creator-sidebar){display:none!important}
  body.mobile-channel-active #main{margin:0!important;padding:0!important;max-width:none;height:100dvh}
  body.mobile-channel-active #main>:not(#provider-spotlight){display:none!important}
  body.mobile-channel-active #provider-spotlight{
    position:fixed;inset:env(safe-area-inset-top,0px) 0 env(safe-area-inset-bottom,0px);
    z-index:120;width:100%;height:auto;min-height:0;margin:0;padding:0;border:0;border-radius:0;
    overflow:hidden;background:var(--provider-surface);container:none;
  }
  body.mobile-channel-active .provider-spotlight .provider-feature-layout{
    display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);
    width:100%;height:100%;max-width:none;min-height:0;margin:0;gap:0;
  }
  body.mobile-channel-active .provider-spotlight .provider-feature-stage.feature-slide{
    display:block;position:relative;width:100%;height:auto;min-height:0;max-height:none;
    margin:0;border:0;border-radius:0;overflow:visible;aspect-ratio:auto;background:var(--provider-surface);
  }
  body.mobile-channel-active .provider-spotlight .provider-feature-video{
    display:block;width:100%;height:max(200px,56.25vw);min-height:200px;max-height:none;
    margin:0;border:0;border-radius:0;aspect-ratio:auto;background:#000;
  }
  body.mobile-channel-active .provider-spotlight[data-provider=twitch] .provider-feature-video{
    height:max(300px,56.25vw);min-height:300px;
  }
  body.mobile-channel-active .provider-spotlight.is-mobile-twitch-narrow .provider-feature-video{
    height:max(200px,56.25vw);min-height:200px;
  }
  body.mobile-channel-active .provider-spotlight .provider-feature-footer{
    display:grid;position:relative;inset:auto;grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;gap:8px;min-height:52px;margin:0;padding:6px 10px;
    border:0;border-bottom:1px solid var(--provider-border);background:var(--provider-surface);color:var(--provider-text);pointer-events:auto;
  }
  body.mobile-channel-active .provider-feature-footer::before{display:none}
  body.mobile-channel-active .provider-spotlight .provider-feature-details{display:flex;align-items:center;gap:8px;min-width:0;flex-wrap:nowrap}
  body.mobile-channel-active .provider-spotlight .provider-feature-avatar-link{flex:0 0 28px}
  body.mobile-channel-active .provider-spotlight .provider-feature-avatar{width:28px;height:28px}
  body.mobile-channel-active .provider-spotlight .provider-feature-copy{flex:1 1 auto;min-width:0}
  body.mobile-channel-active .provider-spotlight .provider-feature-name{overflow:hidden;margin:0;font-size:14px;white-space:nowrap;text-overflow:ellipsis}
  body.mobile-channel-active .provider-spotlight :is(.provider-feature-controls,.provider-channel-toggle,.provider-entry-art,.provider-entry-watch,.provider-channel-banner){display:none!important}
  body.mobile-channel-active .provider-spotlight:not(.mobile-channel-details-open) :is(.provider-feature-title,.provider-feature-meta,.provider-channel-profile){display:none}
  body.mobile-channel-active .provider-spotlight.mobile-channel-details-open .provider-feature-title{display:-webkit-box;margin:4px 0;font-size:12px;line-height:1.4;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  body.mobile-channel-active .provider-spotlight.mobile-channel-details-open .provider-feature-meta{display:block;font-size:11px;line-height:1.4}
  body.mobile-channel-active .provider-spotlight.mobile-channel-details-open .provider-channel-profile{max-height:20dvh;overflow:auto;overscroll-behavior:contain}
  body.mobile-channel-active .provider-spotlight .provider-channel-profile:empty{display:none}
  body.mobile-channel-active .provider-spotlight .mobile-channel-back,
  body.mobile-channel-active .provider-spotlight .mobile-channel-details-toggle{
    display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:6px 5px;
    border:0;border-radius:4px;background:transparent;color:var(--provider-text);font:600 12px/1.3 Arial,sans-serif;text-decoration:none;pointer-events:auto;
  }
  body.mobile-channel-active .provider-spotlight .mobile-channel-details-toggle{color:var(--yellow,#ffd000)}
  body.mobile-channel-active .provider-spotlight .provider-feature-chat{
    position:relative;inset:auto;display:flex;align-self:stretch;width:100%;height:auto;min-height:0;max-height:none;
    border:0;border-radius:0;overflow:hidden;background:var(--provider-surface);
  }
  body.mobile-channel-active .provider-spotlight .provider-chat-toggle{display:none}
  body.mobile-channel-active .provider-spotlight.is-chat-embedded .provider-chat-heading{display:none}
  body.mobile-channel-active .provider-spotlight .provider-chat-content{display:block;flex:1 1 auto;min-height:0;max-height:none}
  body.mobile-channel-active .provider-spotlight .provider-chat-content.has-chat-signin{display:flex}
  body.mobile-channel-active .provider-spotlight .provider-chat-signin{padding:8px 12px;font-size:11px}
  body.mobile-channel-active .provider-spotlight .mobile-channel-narrow:not([hidden]){
    position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:12px;padding:20px;background:#080809bc;color:#fff;text-align:center;
  }
  body.mobile-channel-active .mobile-channel-narrow p{margin:0;font:14px/1.45 Arial,sans-serif}
  body.mobile-channel-active .mobile-channel-open{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 18px;border-radius:5px;background:var(--yellow,#ffd000);color:#101012;font:700 13px/1.3 Arial,sans-serif;text-decoration:none}
  body.mobile-channel-active .provider-spotlight.is-provider-empty .provider-feature-empty{min-height:100%;padding:24px}
  body.mobile-channel-active .provider-spotlight.is-provider-empty>.mobile-channel-back{position:absolute;top:8px;left:10px;z-index:2}
}