/* RMP article-only narrow-screen refinements. Keep CNT's article theme independent. */
@media (max-width: 991.98px) {
  .rmp-article-shell .public-article-hero.has-cover,
  .rmp-article-shell .public-article-main-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .rmp-article-shell .public-article-hero.has-cover .public-article-hero-media,
  .rmp-article-shell .public-article-hero.has-cover .public-article-hero-content,
  .rmp-article-shell .public-article-cover-wrap,
  .rmp-article-shell .public-article-body,
  .rmp-article-shell .public-richtext {
    min-width: 0;
    max-width: 100%;
  }

  .rmp-article-shell .public-article-title,
  .rmp-article-shell .public-article-excerpt,
  .rmp-article-shell .public-richtext {
    overflow-wrap: anywhere;
  }

  .rmp-article-shell .public-richtext a {
    overflow-wrap: anywhere;
    word-break: break-word;
    white-space: normal;
  }

  .rmp-article-shell .public-richtext table {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .rmp-article-shell .public-richtext pre,
  .rmp-article-shell .public-richtext figure {
    max-width: 100%;
  }
}

@media (max-width: 767.98px) {
  .rmp-article-shell {
    --rmp-article-mobile-gutter: clamp(14px, 4vw, 20px);
  }

  .rmp-article-shell .public-article-body {
    box-sizing: border-box;
    max-width: none;
    padding-inline: var(--rmp-article-mobile-gutter);
  }

  .rmp-article-shell .public-article-actions-bar,
  .rmp-article-shell #publicArticleRelatedSection {
    margin-inline: var(--rmp-article-mobile-gutter);
  }

  .rmp-article-shell .public-article-profile-card .public-article-profile-head {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
  }

  .rmp-article-shell .public-article-profile-card .public-article-inline-share {
    display: flex !important;
    width: 100%;
  }

  .rmp-article-shell .public-article-profile-card .public-article-share-inner {
    display: flex;
    flex-wrap: wrap;
    width: max-content;
    max-width: 100%;
  }

  .rmp-article-shell .public-article-profile-card .share-btn {
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
  }
}

@media (max-width: 575.98px) {
  .rmp-article-shell .public-article-sequence {
    grid-template-columns: minmax(0, 1fr);
  }

  .rmp-article-shell .public-article-sequence a {
    min-width: 0;
    overflow-wrap: anywhere;
  }
}
