/* One responsive streamer template for phone and desktop user agents. */
.single-streamer .tn-edit-label-mobile { display: none; }
@media (max-width: 768px) {
  .single-streamer .streamer-page:not(.streamer-page--mobile-only) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .single-streamer .streamer-header.tn-streamer-hero {
    display: grid !important;
    grid-template-columns: 88px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 14px !important;
    min-height: 0 !important;
    padding: 18px 15px !important;
    border: 1px solid rgba(145,70,255,.25) !important;
    border-radius: 16px !important;
    background: linear-gradient(120deg,#0d1627,#17112b) !important;
    box-shadow: 0 12px 28px rgba(0,0,0,.19) !important;
  }

  .single-streamer .streamer-header .avatar-wrap {
    grid-column: 1;
    width: 88px !important;
    height: 88px !important;
    padding: 4px !important;
    margin: 0 !important;
    align-self: start;
  }

  .single-streamer .streamer-header .streamer-avatar {
    width: 80px !important;
    height: 80px !important;
    min-width: 0 !important;
    max-width: 80px !important;
  }

  .single-streamer .streamer-header .avatar-link {
    width: 80px !important;
    height: 80px !important;
    min-width: 0 !important;
    max-width: 80px !important;
  }

  .single-streamer .streamer-header .streamer-avatar-play {
    width: 27px !important;
    height: 27px !important;
    font-size: .65rem !important;
  }

  .single-streamer .streamer-header .live-badge {
    transform: scale(.8);
    transform-origin: left center;
  }

  .single-streamer .streamer-header .avatar-wrap .live-badge.is-offline {
    left: 50% !important;
    bottom: 4px !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: 82px !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 2px 6px !important;
    transform: translateX(-50%) !important;
    white-space: nowrap !important;
    font-size: 10px !important;
    line-height: 1.1 !important;
  }

  .single-streamer .streamer-header .streamer-info {
    grid-column: 2;
    width: 100% !important;
    min-width: 0;
    margin: 0 !important;
    text-align: left !important;
  }

  .single-streamer .streamer-header .streamer-name {
    display: block !important;
    margin: 0 !important;
    overflow-wrap: anywhere;
    color: #f8f7ff;
    font-size: clamp(1.55rem,7vw,2.05rem) !important;
    line-height: 1.12 !important;
    text-align: left !important;
  }

  .single-streamer .streamer-header .streamer-live--category {
    display: block !important;
    width: 100% !important;
    margin: 5px 0 0 !important;
    color: #b9bfd1;
    font-size: .82rem !important;
    text-align: left !important;
  }

  .single-streamer .streamer-header .tn-hero-actions-v2 {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    gap: 7px !important;
    width: 100%;
    margin: 12px 0 0 !important;
  }

  .single-streamer .streamer-header .tn-hero-actions-v2 .tn-btn-v2 {
    min-height: 36px !important;
    height: 36px !important;
    padding: 7px 9px !important;
    border-radius: 9px !important;
    font-size: .72rem !important;
  }

  .single-streamer .streamer-header .tn-hero-actions-v2 .tn-btn-v2--edit {
    flex: 0 1 auto !important;
    width: auto !important;
    min-width: 0;
    max-width: 180px !important;
    padding: 7px 11px !important;
  }
  .single-streamer .streamer-header .tn-btn-v2--edit .tn-edit-label-desktop { display: none !important; }
  .single-streamer .streamer-header .tn-btn-v2--edit .tn-edit-label-mobile {
    display: inline !important;
    width: auto !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  .single-streamer .streamer-header .tn-hero-actions-v2 .tn-btn-v2--square {
    flex: 0 0 36px;
    width: 36px !important;
    padding: 7px !important;
  }

  .single-streamer .streamer-kpi-grid.streamer-kpi-grid--top {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 7px !important;
    width: calc(100% - 24px) !important;
    margin: 12px 12px 16px !important;
  }

  .single-streamer .streamer-kpi-grid--top .streamer-kpi-card {
    min-height: 66px !important;
    grid-template-columns: 29px minmax(0,1fr) !important;
    grid-template-areas: 'icon value' 'icon label' !important;
    justify-items: start !important;
    column-gap: 8px !important;
    row-gap: 2px !important;
    padding: 10px 8px !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 11px !important;
    background: #101a2b !important;
    box-shadow: none !important;
  }

  .single-streamer .streamer-kpi-grid--top .streamer-kpi-card__icon,
  .single-streamer .streamer-kpi-grid--top .streamer-kpi-card__icon img {
    width: 29px !important;
    height: 29px !important;
  }

  .single-streamer .streamer-kpi-grid--top .streamer-kpi-card strong {
    font-size: clamp(.97rem,4vw,1.16rem) !important;
    line-height: 1.05 !important;
    text-align: left !important;
  }

  .single-streamer .streamer-kpi-grid--top .streamer-kpi-card span:not(.streamer-kpi-card__icon) {
    color: #9ea9bc !important;
    font-size: .67rem !important;
    line-height: 1.18 !important;
    text-align: left !important;
  }

  .single-streamer .streamer-tabs {
    gap: 16px !important;
    margin: 0 0 10px !important;
    padding: 0 12px !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.1) !important;
    border-radius: 0 !important;
    background: transparent !important;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .single-streamer .streamer-tabs::-webkit-scrollbar { display: none; }
  .single-streamer .streamer-page .streamer-tabs .tn-tab {
    flex: 0 0 auto;
    min-height: 45px !important;
    padding: 9px 2px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    color: #aab4c8 !important;
    font-size: .87rem !important;
    font-weight: 650 !important;
    white-space: nowrap;
  }

  .single-streamer .streamer-page .streamer-tabs .tn-tab.active,
  .single-streamer .streamer-page .streamer-tabs .tn-tab[aria-selected="true"] {
    color: #c58aff !important;
    border-bottom: 2px solid #a855f7 !important;
    background: transparent !important;
    background-image: none !important;
  }

  .single-streamer .streamer-tabs .streamer-tab-icon { display: none !important; }

  .single-streamer .streamer-about.tn-bio-card {
    padding: 18px 16px !important;
    border: 1px solid rgba(255,255,255,.09) !important;
    border-radius: 14px !important;
    background: #101827 !important;
    box-shadow: none !important;
  }

  .single-streamer .streamer-about.tn-bio-card::before { display: none !important; }
  .single-streamer .tn-bio-card__heading { margin: 0 0 8px !important; }
  .single-streamer .tn-bio-card__name {
    font-size: 1.38rem !important;
    line-height: 1.2 !important;
    letter-spacing: -.02em !important;
  }
  .single-streamer .tn-bio-card__nickname { color: #ba83ff !important; }
  .single-streamer .tn-bio-card__intro {
    margin: 0 0 16px !important;
    padding: 0 0 15px !important;
    border-bottom: 1px solid rgba(255,255,255,.08);
    color: #c9d0dd !important;
    font-size: .88rem !important;
    line-height: 1.55 !important;
  }

  .single-streamer .tn-bio-card__facts {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    margin: 0 !important;
  }

  .single-streamer .tn-bio-card__fact {
    min-height: 57px !important;
    grid-template-columns: 31px minmax(0,1fr) !important;
    gap: 9px !important;
    padding: 9px 0 !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.07) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .single-streamer .tn-bio-card__fact:last-child { border-bottom: 0 !important; }
  .single-streamer .tn-bio-card__fact-text { gap: 2px !important; }
  .single-streamer .tn-bio-card__fact-icon {
    width: 27px !important;
    height: 27px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  .single-streamer .tn-bio-card__fact-icon img {
    width: 25px !important;
    height: 25px !important;
  }
  .single-streamer .tn-bio-card__fact-label {
    color: #9ba7ba !important;
    font-size: .73rem !important;
    line-height: 1.2 !important;
  }
  .single-streamer .tn-bio-card__fact-value {
    margin-top: 2px !important;
    color: #f1f3f8 !important;
    font-size: .91rem !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
  }

  .single-streamer .streamer-header .tn-hero-actions-v2 .streamer-watch-cta {
    display: inline-flex !important;
    order: -1;
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: none !important;
    background: #9146ff !important;
    border-color: #a96bff !important;
    font-size: .8rem !important;
  }

  .single-streamer .streamer-content .tab {
    box-sizing: border-box;
    min-width: 0;
  }
  .single-streamer #tab-history,
  .single-streamer #tab-stats,
  .single-streamer #tab-news {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0 14px 16px !important;
    overflow-wrap: anywhere;
  }

  .single-streamer .tn-mobile-condensed:not(.tn-mobile-expanded):not(.streamer-videos-section) .clips-grid > .clip-entity:nth-child(n+5),
  .single-streamer .tn-mobile-condensed.streamer-videos-section:not(.tn-mobile-expanded) .clips-grid > .clip-entity:nth-child(n+3),
  .single-streamer .tn-mobile-condensed.tn-community-facts:not(.tn-mobile-expanded) .tn-community-facts__list > .tn-community-fact:nth-child(n+4),
  .single-streamer .tn-mobile-condensed:not(.tn-mobile-expanded) .clips-load-more-wrap {
    display: none !important;
  }

  .single-streamer .tn-mobile-reveal-wrap {
    display: flex;
    justify-content: center;
    margin-top: 13px;
  }
  .single-streamer .tn-mobile-reveal {
    min-height: 40px;
    padding: 8px 16px;
    color: #d4a9ff;
    background: #1b1730;
    border: 1px solid rgba(171,110,255,.32);
    border-radius: 9px;
    font-size: .84rem;
    font-weight: 650;
    cursor: pointer;
  }

  .single-streamer .tn-community-facts__list.is-grid {
    grid-template-columns: 1fr !important;
    gap: 9px !important;
  }
  .single-streamer .tn-community-facts .tn-fact-modern {
    min-height: 0 !important;
    gap: 8px !important;
    padding: 14px 15px !important;
    background: #111b2c !important;
    border-color: rgba(255,255,255,.08) !important;
    box-shadow: none !important;
  }
  .single-streamer .tn-community-facts .tn-community-fact__icon-modern {
    margin-bottom: 0 !important;
    font-size: 22px !important;
  }
  .single-streamer .tn-community-facts .tn-community-fact__content-modern p {
    font-size: .88rem !important;
    font-weight: 500 !important;
    line-height: 1.5 !important;
  }

  .single-streamer .tn-streamer-wide-section--photos .photos-track {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 8px !important;
    overflow: visible !important;
  }
  .single-streamer .tn-streamer-wide-section--photos .photo-card {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
  }
  .single-streamer .tn-streamer-wide-section--photos .photo-card img {
    width: 100% !important;
    aspect-ratio: 1 / 1;
    object-fit: cover;
  }

  .single-streamer .tn-news-item--no-image .tn-news-item__image {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 116px;
    background: linear-gradient(135deg,#1b1532,#101d33);
  }
  .single-streamer .tn-news-item--no-image .tn-news-item__image img { display: none !important; }
  .single-streamer .tn-news-item--no-image .tn-news-item__image::before {
    content: 'TWITCH NEWS';
    color: #bd8bff;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .13em;
  }
}

@media (min-width: 430px) and (max-width: 768px) {
  .single-streamer .tn-bio-card__facts {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    column-gap: 18px !important;
  }
}

@media (min-width: 769px) {
  .single-streamer .tn-mobile-reveal-wrap { display: none; }
}

@media (min-width: 769px) and (max-width: 900px) {
  body.single-streamer .streamer-page:not(.streamer-page--mobile-only) .streamer-kpi-grid.streamer-kpi-grid--top {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
}

@media (min-width: 901px) and (max-width: 1100px) {
  body.single-streamer .streamer-page:not(.streamer-page--mobile-only) .streamer-kpi-grid.streamer-kpi-grid--top {
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
  }
}

