/* MonRFS — targeted reflow repairs, 17 October 2026.
   Loaded only on the affected pages. Original fonts, colours and scripts stay intact. */

/* Long source URLs and unbroken identifiers remain readable and selectable. */
article.article-body,
article.eva-art {
  overflow-wrap: anywhere;
}

/* Keep semantic tables intact. The labelled wrapper is keyboard-scrollable. */
.mrfs-table-scroll {
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
}
.mrfs-table-scroll:focus-visible {
  outline: 2px solid var(--blue, #6b8df2);
  outline-offset: 3px;
}
.mrfs-table-scroll > table {
  display: table;
  overflow: visible;
  max-width: none;
}

@media (max-width: 640px) {
  /* Keep Claude's alternating card rhythm within the mobile page gutter. */
  html[data-u="nature"] .soin-group-items > .soin-family:nth-child(even),
  html[data-u="sport"] .soin-group-items > .soin-family:nth-child(even) { transform: translateX(8px); }
  html[data-u="nature"] .soin-group-items > .soin-family:nth-child(even):hover,
  html[data-u="sport"] .soin-group-items > .soin-family:nth-child(even):hover { transform: translateX(12px); }

  .mrfs-responsive-stack {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .mrfs-responsive-stack > * { min-width: 0; }

  /* Anchor the existing article tooltips to a readable-width containing block. */
  .sa-audience,
  .sa-cta > p { position: relative; }
  .sa-infowrap { position: static; }
  .sa-pop,
  .sa-pop.is-open {
    left: 0;
    width: min(20rem, 100%);
    max-width: 100%;
    transform: none;
    box-sizing: border-box;
  }
  .sa-pop::after { left: 16px; }

  /* The calculator help remains attached to its label, within the field width. */
  .field-top:has(.tip-wrap) { position: relative; }
  .field-top .tip-wrap { position: static; }
  .field-top .tip-box {
    left: auto;
    right: 0;
    width: min(240px, 100%);
    max-width: 100%;
    transform: none;
    box-sizing: border-box;
  }
  .field-top .tip-box::after { left: auto; right: 12px; transform: none; }
}

/* Restore the calculator's intended narrow-screen stack: its later 680px rule
   was overriding its original 580px rule. This does not alter its inputs. */
@media (max-width: 580px) {
  #panel-kine .g3 { grid-template-columns: minmax(0, 1fr); }
}