/*
 * v119 responsive layer
 * Loaded after all historic theme CSS so the current layout has one
 * authoritative set of viewport rules.
 */

html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

html,
body{
  width:100%;
  max-width:100%;
  overflow-x:hidden!important;
}

body .mc-page{
  width:100%!important;
  max-width:none!important;
  overflow:clip!important;
}

body .mc-header,
body .mc-wrap{
  width:min(1800px,calc(100% - clamp(28px,4vw,64px)))!important;
  max-width:1800px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

body .section{
  width:min(1680px,calc(100% - clamp(28px,4vw,64px)))!important;
  max-width:1680px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

body #live.live-center-v8,
body section#live,
body .live-center-v8.live-layout-fixed-v38{
  width:min(1390px,calc(100% - clamp(28px,4vw,64px)))!important;
  max-width:1390px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  overflow:visible!important;
}

body #live .live-feature-v8{
  width:100%!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(360px,430px)!important;
  gap:clamp(18px,2vw,28px)!important;
  align-items:start!important;
}

body #live .player-card-v8,
body #live .side-v8{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
}

/*
 * The live player uses 16:9. The offline center contains copy, countdown,
 * buttons and the latest VOD, so it must grow with its content instead.
 */
body #live.is-offline-v120 .player-window-v8{
  aspect-ratio:auto!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:hidden!important;
  display:block!important;
}

body #live.is-offline-v120 .mc-offline-only-v118:not([hidden]){
  position:relative!important;
  display:block!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
}

body #live.is-offline-v120 .mc-offline-center-v118{
  height:auto!important;
  min-height:560px!important;
}

body #live.is-offline-v120 .mc-offline-actions-v118{
  position:relative;
  z-index:2;
  margin-bottom:2px;
}

/*
 * Keep every Twitch wrapper on the same 16:9 stage. Without an explicit
 * height on the intermediate wrappers, the iframe falls back to its small
 * intrinsic embed size even though the player window itself is large.
 */
body #live.is-live-v120 .player-window-v8{
  position:relative!important;
  display:block!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:16/9!important;
  overflow:hidden!important;
}

body #live.is-live-v120 .mc-live-player-stage-v121{
  position:relative!important;
  display:block!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:16/9!important;
}

body #live.is-offline-v120 .mc-live-player-stage-v121{
  position:relative!important;
  display:block!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:auto!important;
}

body #live.is-live-v120 .mc-live-only-v118:not([hidden]),
body #live.is-live-v120 .mc-live-only-v118:not([hidden]) .mc-external-embed-v118{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  min-height:0!important;
  max-height:none!important;
  aspect-ratio:auto!important;
}

body #live.is-live-v120 .mc-live-only-v118:not([hidden]){
  display:block!important;
}

body #live.is-live-v120 .mc-live-only-v118:not([hidden]) .mc-external-embed-v118{
  display:grid!important;
  place-items:center!important;
}

body #live.is-live-v120 .mc-live-only-v118:not([hidden]) .mc-external-embed-v118 iframe:not([hidden]){
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  min-height:0!important;
  max-height:none!important;
  aspect-ratio:auto!important;
  border:0!important;
}

body #live.has-floating-player-v121 .player-window-v8{
  position:fixed!important;
  right:18px!important;
  bottom:18px!important;
  left:auto!important;
  top:auto!important;
  z-index:2147483000!important;
  width:min(520px,calc(100vw - 36px))!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  aspect-ratio:16/9!important;
  border:1px solid rgba(85,183,255,.72)!important;
  border-radius:14px!important;
  box-shadow:0 22px 75px rgba(0,0,0,.72),0 0 34px rgba(13,116,255,.2)!important;
  background:#000!important;
  transform:translateZ(0);
}

body #live .status-under-player-v110 .row-v8 b,
body .live-center-v8 .status-under-player-v110 .row-v8 b,
body .live-layout-fixed-v38 .status-under-player-v110 .row-v8 b{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  line-height:1.35!important;
}

body .mc-hero .mc-left h1,
body .mc-hero .mc-left .mc-hero-title-v75,
body .mc-hero .mc-left .mc-hero-title-v84{
  max-width:100%!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  hyphens:none!important;
}

.mc-latest-vod-v119{
  display:block;
  color:#fff;
  min-height:190px;
  background:
    radial-gradient(circle at 50% 20%,rgba(145,70,255,.22),transparent 42%),
    linear-gradient(135deg,#111827,#07111f);
}

.mc-latest-vod-v119 em{
  display:block;
  margin-top:9px;
  color:#9fb3cf;
  font-size:13px;
  font-style:normal;
}

.mc-mobile-actions-v118 button{
  border:0;
  border-radius:10px;
  background:rgba(255,255,255,.07);
  color:#fff;
  font:inherit;
  font-weight:900;
  cursor:pointer;
}

body .blog-magazine-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}

body .blog-magazine-grid > *,
body .single-blog-content{
  min-width:0!important;
  max-width:100%!important;
}

body .mc-vod-player-shell,
body .mc-video-player-shell-v86{
  width:100%!important;
  max-width:100%!important;
}

@media (max-width:1300px){
  body #live .live-feature-v8{
    grid-template-columns:1fr!important;
  }

  body #live .side-v8{
    margin:0!important;
  }

  body #live .chat-panel-v10{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
  }

  body #live .chat-panel-v10 .chat-embed-v8{
    height:clamp(480px,68vh,720px)!important;
    min-height:480px!important;
    max-height:none!important;
    flex:0 0 auto!important;
  }
}

@media (max-width:980px){
  body .mc-header{
    min-height:82px!important;
    height:auto!important;
    padding:14px 0!important;
    gap:12px!important;
    flex-wrap:nowrap!important;
  }

  body .mc-brand{
    max-width:calc(100% - 86px);
    min-width:0;
    gap:10px;
  }

  body .mc-logo-img{
    width:clamp(50px,12vw,64px)!important;
    height:clamp(50px,12vw,64px)!important;
    flex:0 0 auto;
  }

  body .mc-brand > span:last-child{
    min-width:0;
  }

  body .mc-brand strong{
    max-width:100%;
    font-size:clamp(16px,4.7vw,21px)!important;
    letter-spacing:.075em!important;
    white-space:nowrap!important;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  body .mc-menu-toggle-v118{
    flex:0 0 auto;
    margin-left:auto!important;
  }

  body .mc-wrap{
    display:block!important;
    min-height:auto!important;
  }

  body .mc-left{
    width:100%!important;
    max-width:100%!important;
    padding:clamp(34px,7vw,60px) 0 38px!important;
  }

  body .mc-right{
    display:none!important;
  }

  body .mc-hero{
    min-height:auto!important;
    background-position:62% center!important;
  }

  body .mc-hero .mc-left h1,
  body .mc-hero .mc-left .mc-hero-title-v75,
  body .mc-hero .mc-left .mc-hero-title-v84{
    font-size:clamp(46px,12vw,72px)!important;
    line-height:.88!important;
    letter-spacing:-.045em!important;
    white-space:normal!important;
  }

  body .mc-hero .mc-left h2,
  body .mc-hero .mc-left .mc-hero-slogan-v75,
  body .mc-hero .mc-left .mc-hero-slogan-v84{
    font-size:clamp(23px,6vw,34px)!important;
    line-height:1.08!important;
    margin-top:24px!important;
  }

  body .mc-hero .mc-left p,
  body .mc-hero .mc-left .mc-hero-description-v75{
    font-size:clamp(15px,4.1vw,18px)!important;
    line-height:1.5!important;
  }

  body .mc-actions{
    display:grid!important;
    grid-template-columns:1fr 1fr;
    gap:10px!important;
  }

  body .mc-actions .mc-btn{
    width:100%!important;
    min-width:0!important;
    padding:14px 12px!important;
  }

  body .mc-features{
    width:100%!important;
    max-width:100%!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  body .mc-latest-post{
    width:100%!important;
    max-width:100%!important;
    grid-template-columns:minmax(0,1fr) minmax(150px,32%)!important;
  }

  body .section{
    padding:clamp(42px,7vw,62px) 0!important;
  }

  body .section-head{
    display:block!important;
  }

  body .section-head p{
    max-width:760px!important;
    margin-top:14px!important;
    text-align:left!important;
  }

  body .section-head h2{
    font-size:clamp(34px,8vw,54px)!important;
  }

  body .mc-offline-center-v118{
    min-height:0!important;
    grid-template-columns:1fr!important;
    padding:clamp(22px,5vw,38px)!important;
  }

  body #live.is-offline-v120 .mc-offline-center-v118{
    min-height:0!important;
  }

  body .mc-offline-copy-v118 h3{
    font-size:clamp(34px,8vw,54px)!important;
  }

  body .mc-latest-highlight-v118{
    width:100%;
    max-width:620px!important;
  }

  body #live .stats-v8{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  body #live .status-under-player-v110 .rows-v8{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  body .vod-grid-v8,
  body .clip-grid-v8{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  body .mc-mobile-actions-v118{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    bottom:calc(8px + env(safe-area-inset-bottom))!important;
  }

  body .mc-mobile-actions-v118 a,
  body .mc-mobile-actions-v118 button{
    display:grid;
    place-items:center;
    min-width:0;
    padding:11px 7px!important;
    font-size:clamp(11px,3vw,14px)!important;
    line-height:1.15;
  }

  body.home .mc-consent-reopen-v118{
    display:none!important;
  }

  body.home{
    padding-bottom:calc(82px + env(safe-area-inset-bottom))!important;
  }

  body .blog-magazine-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  body .blog-magazine-hero h1,
  body .single-blog-hero h1{
    font-size:clamp(38px,9vw,62px)!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }

  body .mc-vod-player-top,
  body .mc-video-player-top-v86{
    height:auto!important;
    min-height:0!important;
    grid-template-columns:1fr!important;
    gap:12px!important;
    padding:15px!important;
    text-align:left!important;
  }

  body .mc-vod-player-top h1,
  body .mc-video-player-top-v86 h1{
    max-width:100%!important;
    font-size:clamp(30px,8vw,48px)!important;
    line-height:1!important;
    text-align:left!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }

  body .mc-vod-player-main,
  body .mc-vod-player-main-no-chat,
  body .mc-video-player-main-v86{
    height:auto!important;
    min-height:calc(100svh - 170px)!important;
    padding:10px!important;
    overflow:auto!important;
  }

  body .mc-vod-player-video-full,
  body .mc-video-frame-v86{
    width:100%!important;
    max-width:100%!important;
    min-height:0!important;
    aspect-ratio:16/9!important;
  }

  body .mc-fulltracker-top{
    height:auto!important;
    min-height:0!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    padding:12px!important;
  }

  body .mc-fulltracker-top h1{
    font-size:clamp(25px,7vw,38px)!important;
  }

  body .mc-fulltracker-main{
    height:calc(100svh - 148px)!important;
    min-height:520px;
  }

  body .mc-fulltracker-panel{
    left:8px!important;
    right:8px!important;
    bottom:8px!important;
    padding:8px!important;
  }
}

@media (max-width:600px){
  body .mc-header,
  body .mc-wrap,
  body .section,
  body #live.live-center-v8,
  body section#live,
  body .live-center-v8.live-layout-fixed-v38{
    width:calc(100% - 24px)!important;
    max-width:calc(100% - 24px)!important;
  }

  body .mc-brand em{
    display:none!important;
  }

  body .mc-hero .mc-left h1,
  body .mc-hero .mc-left .mc-hero-title-v75,
  body .mc-hero .mc-left .mc-hero-title-v84{
    font-size:clamp(42px,13vw,58px)!important;
    line-height:.9!important;
  }

  body .mc-live{
    align-items:flex-start!important;
    flex-direction:column!important;
    gap:10px!important;
  }

  body .mc-actions{
    grid-template-columns:1fr!important;
  }

  body .mc-features{
    grid-template-columns:1fr!important;
  }

  body .mc-feature{
    min-height:0!important;
    padding:18px!important;
  }

  body .mc-latest-post{
    grid-template-columns:1fr!important;
  }

  body .mc-latest-image{
    min-height:190px!important;
  }

  body #live .player-card-v8{
    padding:9px!important;
    border-radius:14px!important;
  }

  body #live.has-floating-player-v121 .player-window-v8{
    right:8px!important;
    bottom:calc(82px + env(safe-area-inset-bottom))!important;
    width:calc(100vw - 16px)!important;
    border-radius:11px!important;
  }

  body #live .player-window-v8{
    min-height:0!important;
    border-radius:11px!important;
  }

  body .mc-offline-center-v118{
    padding:22px 16px!important;
    gap:20px!important;
  }

  body .mc-offline-copy-v118 h3{
    font-size:clamp(32px,10vw,46px)!important;
  }

  body .mc-offline-actions-v118{
    display:grid!important;
    grid-template-columns:1fr!important;
  }

  body .mc-offline-actions-v118 a{
    width:100%;
    text-align:center;
  }

  body .mc-countdown-card-v118{
    width:100%;
  }

  body #live .stats-v8,
  body #live .status-under-player-v110 .rows-v8{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  body #live .stat{
    padding:13px 11px!important;
  }

  body #live .stat b{
    font-size:clamp(17px,6vw,24px)!important;
  }

  body #live .status-under-player-v110{
    padding:17px!important;
  }

  body #live .row-v8{
    display:block!important;
    padding:11px!important;
  }

  body #live .row-v8 b{
    display:block;
    max-width:100%!important;
    margin-top:5px;
    text-align:left!important;
    white-space:normal!important;
  }

  body #live .chat-panel-v10{
    padding:12px!important;
    border-radius:14px!important;
  }

  body #live .chat-panel-v10 .chat-embed-v8{
    height:min(68vh,540px)!important;
    min-height:400px!important;
  }

  body .mc-tracker-card{
    border-radius:14px!important;
  }

  body .mc-tracker-map-wrap{
    height:min(64vh,480px)!important;
    min-height:340px!important;
  }

  body .mc-tracker-info{
    padding:12px!important;
  }

  body .mc-tracker-grid,
  body .mc-tracker-grid.mc-fulltracker-grid,
  body .mc-fulltracker-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }

  body .mc-tracker-grid div{
    min-width:0!important;
    padding:11px!important;
  }

  body .mc-tracker-grid b{
    font-size:12px!important;
    overflow-wrap:anywhere;
  }

  body .vod-grid-v8,
  body .clip-grid-v8{
    grid-template-columns:1fr!important;
  }

  body .mc-info{
    padding:42px 14px!important;
  }

  body .mc-consent-banner-v118{
    left:8px!important;
    right:8px!important;
    bottom:calc(80px + env(safe-area-inset-bottom))!important;
  }

  body .mc-consent-banner-v118 > div{
    padding:16px!important;
  }

  body .mc-consent-actions-v118{
    grid-template-columns:1fr!important;
  }

  body .mc-consent-dialog-v118{
    width:100%!important;
    max-height:calc(100svh - 24px)!important;
    padding:24px 18px!important;
  }

  body .mc-legal-shell-v118{
    width:calc(100% - 24px)!important;
    padding:34px 0!important;
  }

  body .mc-legal-card-v118{
    padding:22px 17px!important;
  }

  body .mc-legal-card-v118 h1{
    font-size:clamp(34px,11vw,48px)!important;
  }

  body .blog-magazine-grid{
    grid-template-columns:1fr!important;
  }

  body .blog-magazine-hero,
  body .single-blog-hero{
    padding-top:42px!important;
    padding-bottom:22px!important;
  }

  body .blog-magazine-hero h1,
  body .single-blog-hero h1{
    font-size:clamp(34px,11vw,48px)!important;
  }

  body .blog-mag-body,
  body .single-blog-content{
    padding:20px 16px!important;
  }

  body .single-thumb{
    margin:-20px -16px 22px!important;
  }

  body .mc-fulltracker-back{
    width:max-content;
    padding:9px 12px!important;
  }

  body .mc-fulltracker-live{
    min-width:0!important;
    justify-content:flex-start!important;
  }

  body .mc-fulltracker-main{
    height:calc(100svh - 142px)!important;
    min-height:500px;
  }

  body .mc-fulltracker-panel{
    max-height:42svh;
    overflow:auto;
  }
}

@media (max-width:380px){
  body .mc-brand strong{
    font-size:15px!important;
    letter-spacing:.045em!important;
  }

  body .mc-menu-toggle-v118{
    min-width:62px!important;
    padding:0 10px!important;
  }

  body .mc-hero .mc-left h1,
  body .mc-hero .mc-left .mc-hero-title-v75,
  body .mc-hero .mc-left .mc-hero-title-v84{
    font-size:clamp(39px,12.5vw,48px)!important;
  }

  body #live .stats-v8,
  body #live .status-under-player-v110 .rows-v8{
    grid-template-columns:1fr!important;
  }
}