/* mobile UX: table horizontal scroll + no page-wide overflow from tables */
@media (max-width: 768px) {
  html, body { overflow-x: clip; }
  main { max-width: 100vw; }
  /* any table wrapper: enable horizontal scroll */
  main div:has(> table),
  main [class] > table {
    /* :has not always enough; also style tables themselves */
  }
  main table {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-x: contain;
  }
  main table thead,
  main table tbody,
  main table tr {
    /* keep table layout for scrollable block table */
  }
  /* comparison table outer wrappers (salted classes vary): target by structure */
  main > section table,
  main section table,
  main article table,
  main .x9ae7fe2 table,
  main [class] table {
    display: block !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
  /* force wide tables to scroll inside rather than expand body */
  main table {
    width: max-content !important;
    min-width: 100% !important;
    max-width: none !important;
    overflow-x: auto !important;
    display: block !important;
  }
  /* parent of table gets the scrollport */
  main table { max-width: 100% !important; }
}
/* Better approach: wrap-like scroll on parent via overflow on any element containing a wide table */
@media (max-width: 768px) {
  main * {
    max-width: 100%;
  }
  main table, main table * {
    max-width: none;
  }
  main table {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
  main img, main svg {
    max-width: 100%;
    height: auto;
  }
}
