/* Only the database-backed review collection. Existing article styles stay put. */
.msr-rendered.reviews-container {
  align-items: start;
  gap: 1rem;
  min-inline-size: 0;
  scroll-margin-block-start: 7rem;
}

.msr-rendered .review-block {
  min-inline-size: 0;
  align-items: start;
}

.msr-rendered .review-block.msr-review-no-avatar { grid-template-columns: minmax(0, 1fr); }
.msr-rendered .review-content { min-inline-size: 0; }
.msr-rendered .review-header { align-items: baseline; }
.msr-rendered .review-username { overflow-wrap: anywhere; }
.msr-rendered .review-time { max-inline-size: 100%; line-height: 1.5; }
.msr-rendered .msr-review-game { margin-block: .3rem .5rem; color: var(--ms-cyan-strong, #17646c); font-size: .8rem; font-weight: 750; }
.msr-rendered .msr-review-source { margin: 0 0 .65rem; color: var(--ms-copy, #405160); font-size: .78rem; line-height: 1.5; }
.msr-rendered .review-text { overflow-wrap: anywhere; color: var(--ms-copy, #405160); line-height: 1.65; }
.msr-rendered .review-stars { display: flex !important; gap: .12em; margin-block-start: .5rem; color: #b46a00; }

.msr-rendered .msr-pagination {
  grid-column: 1 / -1;
  min-inline-size: 0;
  margin-block: .75rem 0;
  padding-block: 1rem;
}

.msr-rendered .msr-pagination-status {
  max-inline-size: none;
  margin: 0 0 .75rem;
  color: var(--ms-copy, #405160);
  font-size: .9rem;
  line-height: 1.5;
  text-align: center;
}

.msr-rendered .msr-pagination-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: .65rem;
  max-inline-size: none;
  margin: 0;
  padding: 0;
  list-style: none;
}

.msr-rendered .msr-pagination-links > li { margin: 0; padding: 0; }
.msr-rendered .msr-pagination-links > li::before { content: none; }
.msr-rendered .msr-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-inline-size: 44px;
  min-block-size: 44px;
  box-sizing: border-box;
  padding: .65rem .9rem;
  border: 1px solid var(--ms-line, #cbd5dc);
  border-radius: .7rem;
  color: var(--ms-ink, #102b3e);
  background: var(--ms-paper, #fff);
  font-size: .9rem;
  font-weight: 750;
  line-height: 1.25;
  text-align: center;
  text-decoration: none;
  overflow-wrap: anywhere;
  touch-action: manipulation;
}

.msr-rendered .msr-pagination a.page-numbers:hover { background: var(--ms-cyan-soft, #e4f5f4); border-color: var(--ms-cyan-strong, #17646c); }
.msr-rendered .msr-pagination a.page-numbers:focus-visible { outline: 3px solid var(--ms-ink, #102b3e); outline-offset: 3px; }
.msr-rendered .msr-pagination .current { border-color: var(--ms-ink, #102b3e); color: #fff; background: var(--ms-ink, #102b3e); }
.msr-rendered .msr-pagination-gap { color: var(--ms-copy, #405160); }

.msr-rating-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: .8rem 1.5rem;
  text-align: center;
}

.msr-rating-summary .rating-info { min-inline-size: 0; }
.msr-rating-summary .rating-value { color: var(--ms-ink, #102b3e); font-size: 1.9rem; font-weight: 850; line-height: 1.3; font-variant-numeric: tabular-nums; }
.msr-rating-summary .msr-rating-denominator { padding-inline-start: .1em; color: var(--ms-copy, #405160); font-size: 1rem; font-weight: 600; }
.msr-rating-summary .rating-count { color: var(--ms-ink, #102b3e); font-weight: 650; }
.msr-rating-summary .msr-rating-scope { max-inline-size: 40ch; margin-block-start: .25rem; color: var(--ms-copy, #405160); font-size: .8rem; line-height: 1.5; }
.msr-rating-summary .msr-summary-stars { display: block !important; position: relative; color: #cbd5dc; font-size: 1.65rem; letter-spacing: .1em; line-height: 1.2; white-space: nowrap; }
.msr-rating-summary .msr-summary-stars > span { display: block; }
.msr-rating-summary .msr-summary-stars-fill { position: absolute; inset: 0 auto 0 0; inline-size: var(--msr-star-fill); overflow: hidden; color: #b46a00; }

@media (max-width: 767px) {
  .msr-rendered.reviews-container { grid-template-columns: minmax(0, 1fr); }
  .msr-rendered .review-block { grid-template-columns: 2.5rem minmax(0, 1fr); gap: .6rem; }
  .msr-rendered .review-avatar { inline-size: 2.5rem; block-size: 2.5rem; }
  .msr-rendered .msr-pagination { padding-block-end: calc(1rem + env(safe-area-inset-bottom, 0px)); }
  .msr-rating-summary { margin-block-end: calc(6rem + env(safe-area-inset-bottom, 0px)); }
  body.msr-reviews .ms26-review-guide-hero { margin-block-start: .75rem; }
}

@media (max-width: 359px) {
  .msr-rendered .msr-pagination-links { gap: .5rem; }
  .msr-rendered .msr-pagination .page-numbers { padding-inline: .7rem; }
  .msr-rendered .review-block { padding: .8rem; }
}

@media (forced-colors: active) {
  .msr-rendered .msr-pagination .current { border: 2px solid Highlight; color: HighlightText; background: Highlight; }
  .msr-rendered .msr-pagination a.page-numbers:focus-visible { outline-color: Highlight; }
}