/* V87: Keep Toy Chest character art visible throughout long biographies.
   The biography text scrolls independently on larger screens. The portrait
   occupies the complete left column, so the beige background never opens
   up beneath the image. Applies to Home and Playhouse profile dialogs. */
@media (min-width:731px) {
  .bio-dialog:has(.gb80-profile) .bio-stage {
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
    display:grid;
    grid-template-columns:minmax(0,38%) minmax(0,62%);
    align-items:stretch;
    scroll-behavior:auto;
    scrollbar-gutter:auto;
  }
  .bio-dialog:has(.gb80-profile) .bio-media {
    position:relative;
    top:auto;
    height:100%;
    min-height:0;
    align-self:stretch;
    overflow:hidden;
  }
  .bio-dialog:has(.gb80-profile) .bio-media img {
    position:absolute;
    inset:0;
    display:block;
    width:100%;
    height:100%;
    max-height:none;
    object-fit:cover;
    object-position:50% 23%;
  }
  .bio-dialog:has(.gb80-profile) .bio-content {
    min-height:0;
    height:100%;
    overflow-y:auto;
    overflow-x:hidden;
    align-self:stretch;
    overscroll-behavior-y:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-gutter:stable;
  }
}
/* Phone/small tablet: a normal stacked scroll, no independently trapped panel. */
@media (max-width:730px) {
  .bio-dialog:has(.gb80-profile) .bio-stage {
    display:block;
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
    scroll-behavior:auto;
    overscroll-behavior-y:contain;
    -webkit-overflow-scrolling:touch;
  }
  .bio-dialog:has(.gb80-profile) .bio-media {
    position:relative;
    top:auto;
    width:100%;
    height:clamp(175px,32dvh,275px);
    min-height:0;
  }
  .bio-dialog:has(.gb80-profile) .bio-media img {
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    max-height:none;
    object-fit:cover;
    object-position:50% 22%;
  }
  .bio-dialog:has(.gb80-profile) .bio-content {
    height:auto;
    min-height:0;
    overflow:visible;
  }
}
