For help, skip to update

Perhaps the :has() CSS selector is what you're looking for?

.page__main {
  border-radius:20px;
  border:0px solid #ccc;
}

.page__main:has(.portable-infobox) {
  border-radius: 0;
}

:has() - CSS: Cascading Style Sheets | MDNMDN Web Docs

If it isn't working, try this version instead

.page__main {
  border:0px solid #ccc;
}

html:not(.ve-active) .page.has-right-rail .page__main {
  border-radius:20px;
}

.html:not(.ve-active) .page.has-right-rail .page__main:has(.portable-infobox) {
  border-radius: 3px; /* 3px is the Fandom default */
}

Which is a bit of an ugly solution, but the only options are to match Fandom's default specificity or to use !important.

UPDATE:

The first solution will basically never work, since Fandom's specificity is so high when it comes to rounded corners. My second solution forgot about the right rail.

This solution avoids both issues, without using !important (which is generally considered bad practice, unless there is no other option).

.page__main {
  border:0px solid #ccc;
}

/* rounds page */
html:not(.ve-active) .page.has-right-rail .page__main {
  border-radius: 20px 0 0 20px;
}

/* rounds rail */
html:not(.ve-active) .page.has-right-rail .page__right-rail {
  border-radius: 0 20px 20px 0;
}

/* doesn't round pages with infoboxes */
html:not(.ve-active) .page.has-right-rail:has(.portable-infobox) .page__main {
  border-radius: 3px 0 0 3px;
}

/* doesn't round rails with infoboxes */
html:not(.ve-active) .page.has-right-rail:has(.portable-infobox) .page__right-rail {
  border-radius: 0 3px 3px 0;
}