/* MWB News v561: stable mobile identity, search/menu controls and complete category drawer. */

@media (max-width: 430px) {
  .fire-desk-page .news-brand-row {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
  }

  .fire-desk-page .news-wordmark {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    gap: 7px;
  }

  .fire-desk-page .news-wordmark > span:last-child {
    min-width: 0;
  }

  .fire-desk-page .news-wordmark strong {
    max-width: 100%;
    overflow: visible;
    font-size: clamp(19px, 5.8vw, 23px) !important;
    line-height: .94;
    overflow-wrap: normal;
    text-overflow: clip;
    white-space: normal;
    word-break: normal;
  }

  .fire-desk-page .news-mark {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
  }
}

@media (max-width: 350px) {
  .fire-desk-page .news-wordmark strong {
    font-size: 19px !important;
  }
}

@media (max-width: 1480px) {
  html body .news-brand-row {
    min-width: 0;
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    gap: 7px !important;
  }

  html body .news-brand-row .news-wordmark {
    order: 1;
    min-width: 0;
    flex: 1 1 auto;
  }

  html body .news-brand-row .news-mobile-menu-toggle {
    position: relative;
    z-index: 2;
    order: 2;
    flex: 0 0 auto;
    margin-left: auto !important;
  }

  html body .news-brand-row .news-edition-label.has-search {
    order: 3;
    flex: 0 0 auto;
    margin-left: 0 !important;
  }

  html body .news-category-nav {
    width: min(94vw, 390px) !important;
    max-width: calc(100vw - 12px) !important;
    height: 100vh !important;
    height: 100dvh !important;
    min-height: 0 !important;
    padding-bottom: calc(26px + env(safe-area-inset-bottom)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    touch-action: pan-y;
    -webkit-overflow-scrolling: touch;
  }

  html body .news-category-nav .news-mobile-nav-head {
    flex: 0 0 auto;
  }

  html body .news-category-nav .news-category-group {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    flex: 0 0 auto !important;
    overflow: visible !important;
  }

  html body .news-category-nav a {
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: break-word;
    word-break: normal;
  }
}

@media (max-width: 980px) {
  html body .news-category-nav .news-category-group {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: stretch !important;
  }

  html body .news-category-nav .news-category-group-label {
    position: static;
    grid-column: 1 / -1;
    min-width: 0;
  }

  html body .news-category-nav .news-category-group a {
    width: 100% !important;
    min-height: 47px;
  }
}

@media (max-width: 760px) {
  html,
  body {
    max-width: 100%;
    overflow-x: clip;
  }

  :where(
    .reader-shell,
    .audience-main,
    .special-desk-main,
    .weekly-shell,
    .news-front,
    .news-stream,
    .desk-story-list-v560,
    .live-story-grid,
    .reviews-grid,
    .community-board-layout
  ),
  :where(
    .reader-shell,
    .audience-main,
    .special-desk-main,
    .weekly-shell,
    .news-front,
    .news-stream,
    .desk-story-list-v560,
    .live-story-grid,
    .reviews-grid,
    .community-board-layout
  ) > * {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
  }

  :where(.news-public img, .news-public video, .news-public iframe) {
    max-width: 100%;
  }

  :where(
    .archive-category-rail,
    .weather-extended-forecast,
    .weather-chart-tabs,
    .games-category-filter,
    .webtv-filter-bar,
    .reviews-filter,
    .reviews-lane-filter
  ) {
    max-width: 100%;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 380px) {
  html body .news-category-nav .news-category-group a {
    min-height: 45px;
    padding-inline: 10px;
    font-size: 11px;
  }
}