/* Tables grow with their contents. Scrolling belongs to the page, not to
   a second, fixed-height viewport inside the parchment. */
/* The central parchment is a separate, stretchable background layer on
   the two sheets with stacked tables. Side panels keep their original size. */
html.hero-sheet body:is([data-page="advantages"], [data-page="magic"]) {
  background-size: 100vw auto;
  background-color: #716452;
}
.table-parchment {
  position: absolute;
  left: 24.3209vw;
  top: 7.32785vw;
  width: 52.6216vw;
  height: max(47.2521vw, var(--table-parchment-height, 0px));
  pointer-events: none;
  z-index: 0;
}
html.hero-sheet body:is([data-page="advantages"], [data-page="magic"]) :is(
  #vorteile-columns-container, #nachteile-columns-container,
  #sprachen-columns-container, #schriften-columns-container,
  #magischesonder-columns-container, #karmalesonder-columns-container,
  #zaubertricks-columns-container, #segnungen-columns-container
) { z-index: 1; }
html.hero-sheet body :is(
  #talent-columns-container, #allgemeinesonder-columns-container,
  #kampfsonder-columns-container, #magischesonder-columns-container,
  #karmalesonder-columns-container, #zaubertricks-columns-container,
  #segnungen-columns-container, #vorteile-columns-container,
  #nachteile-columns-container, #sprachen-columns-container,
  #schriften-columns-container, #meleeweaponsContainer,
  #rangedweaponsContainer, #armorContainer, #shieldContainer
) {
  height: auto;
  max-height: none;
  overflow: visible;
}

/* Use the same parchment coordinates on larger displays, too. */
@media screen and (min-width: 2201px) {
  body:is([data-page="talents"], [data-page="spells"]) #talent-columns-container {
    position: absolute; top: 8.4375vw; left: 25.6vw; width: 50vw;
    margin: 0; display: block; box-sizing: border-box;
  }
  body:is([data-page="talents"], [data-page="spells"]) #talent-columns-container > div {
    width: 100%; min-width: 0; margin: 0;
  }
  body:is([data-page="talents"], [data-page="spells"]) #talent-columns-container table {
    width: 100%; margin: 0; padding: 0;
  }
  body[data-page="talents"] #talent-columns-container {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2%;
  }
  body[data-page="combat"] #talent-columns-container {
    position: absolute; left: 25.6vw; top: 8.45vw; width: 30vw;
    display: block; margin: 0;
  }
  body[data-page="combat"] #talent-columns-container > div { width: 100%; margin: 0; }
  body[data-page="combat"] #talent-columns-container table { width: 100%; margin: 0; padding: 0; }
  body[data-page="combat"] :is(#meleeweaponsContainer, #rangedweaponsContainer, #armorContainer, #shieldContainer) {
    position: absolute; box-sizing: border-box;
  }
  body[data-page="combat"] #meleeweaponsContainer { left: 26.3vw; top: 33vw; width: 49.5vw; }
  body[data-page="combat"] #rangedweaponsContainer { left: 26.3vw; top: 44vw; width: 49.5vw; }
  body[data-page="combat"] #armorContainer { left: 58vw; top: 10.1vw; width: 17.8vw; }
  body[data-page="combat"] #shieldContainer { left: 58vw; top: 21vw; width: 17.8vw; }
  body[data-page="combat"] :is(#meleeweaponsTable, #rangedweaponsTable, #armorTable, #shieldTable) {
    position: relative; top: 0; left: 0; margin: 0; padding: 0;
  }
}

/* Reserve space below growing tables, including wrapped AP headings. */
html.hero-sheet body :is(#zaubertricks-columns-container, #segnungen-columns-container,
  #sprachen-columns-container, #schriften-columns-container) {
  top: max(40.7vw, var(--preceding-table-bottom, 0px));
}
html.hero-sheet body[data-page="combat"] #meleeweaponsContainer {
  top: max(33vw, var(--preceding-table-bottom, 0px));
}
html.hero-sheet body[data-page="combat"] #rangedweaponsContainer {
  top: max(44vw, var(--preceding-table-bottom, 0px));
}
html.hero-sheet body[data-page="combat"] #shieldContainer {
  top: max(21vw, var(--preceding-table-bottom, 0px));
}