/* Keep horizontal pinning independent of vertical header pinning.
   Collapsed borders and nested sticky table cells are unreliable in WebKit. */
.table-shell > table {
  border-collapse: separate;
  border-spacing: 0;
}

/* Ordinary headers scroll with their row; body row labels must never stick
   to the top. Existing, more specific left-pinned cell rules stay in effect.
   Bounded game / connected tables pin their whole thead, not each child. */
.table-shell > table > thead > tr > th,
.table-shell > table > tbody > tr > th {
  position: static;
  top: auto;
}

.table-shell > table > thead .name-head {
  position: sticky;
  left: 0;
  top: auto;
}

/* Keep the material and its text in the same painting layer instead of
   relying on a separate row-group background in mobile scroll containers. */
.table-shell > table:not(.compare-table) thead th {
  background-color: #102d48;
  background-image: var(--table-material-atlas);
  background-size: 200% 200%;
  background-position: 0 0;
  background-repeat: no-repeat;
  color: #f5faff;
}