/* Portrait layouts are reading pages: their content may grow beyond one screen. */
@media screen and (orientation: portrait), screen and (max-width: 800px) {
  body.apple-edition .panel:not(#opening, #game-ai, #japan, #japan-jury, #robot-maid, #change, #imagine-first, .full-bleed-quote, .scroll-gallery-panel) {
    height: auto;
    min-height: 100svh;
    max-height: none;
  }
  body.apple-edition .panel:not(#opening, #game-ai, #japan, #japan-jury, #robot-maid, #change, #imagine-first, .full-bleed-quote, .scroll-gallery-panel) > * {
    flex-shrink: 0;
  }

}

/* Wide portrait monitors need vertical arrangements too, not only phones. */
@media screen and (orientation: portrait) and (min-width: 801px) {
  .apple-edition .metrics-grid,
  .apple-edition .lesson-groups,
  .apple-edition .self-feedback-grid,
  .apple-edition #naming.naming-combined { grid-template-columns: 1fr; }
  .apple-edition #platforms .real-platform-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .apple-edition #naming .label-model-marks { max-width: 450px; }
  .apple-edition #naming .watch-cloud { height: clamp(430px, 64vw, 820px); }
}