/* Eyeroom Talent Room V1.4: scoped responsive UI repair. Does NOT style the app bottom dock. */
.tr-dialog {
  box-sizing: border-box !important;
  width: min(1080px, calc(100vw - 16px)) !important;
  max-width: calc(100vw - 16px) !important;
  max-height: calc(100dvh - 16px) !important;
  min-width: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
}
.tr-dialog .tr-shell, .tr-dialog .tr-main, .tr-dialog .tr-profile-hero,
.tr-dialog .tr-person, .tr-dialog .tr-person-details, .tr-dialog .tr-search {
  box-sizing: border-box !important;
  min-width: 0;
  max-width: 100%;
}
/* Critical fix: global Eyeroom `header` is absolute and 88px tall; reset it HERE only. */
.tr-dialog .tr-shell > header.tr-top {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  height: auto !important;
  min-height: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 22px 22px 18px !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 10px !important;
  z-index: 1 !important;
  flex: 0 0 auto;
}
.tr-dialog .tr-top > div { min-width: 0; flex: 1 1 auto; }
.tr-dialog .tr-top h1 { font-size: clamp(25px, 4vw, 40px) !important; line-height: 1.12 !important; margin: 6px 0 8px !important; overflow-wrap: anywhere; }
.tr-dialog .tr-top p { margin: 0 !important; font-size: 14px !important; line-height: 1.45 !important; overflow-wrap: anywhere; }
.tr-dialog .tr-top .tr-x { flex: 0 0 44px !important; width: 44px !important; height: 44px !important; }
.tr-dialog .tr-main { position: relative !important; display: block !important; padding: 18px 22px 32px !important; }
/* Main actions must remain below the header, never on top of the subtitle. */
.tr-dialog .tr-main > .tr-toolbar {
  position: static !important;
  inset: auto !important;
  float: none !important;
  transform: none !important;
  display: flex !important;
  align-items: stretch !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 20px !important;
  overflow: visible !important;
}
.tr-dialog .tr-main > .tr-toolbar > button { flex: 0 1 auto; max-width: 100%; white-space: normal !important; overflow-wrap: anywhere; }
.tr-dialog img { max-width: 100%; }
.tr-dialog .tr-directory-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 185px), 1fr)); gap: 13px; }
.tr-dialog .tr-profile-hero { grid-template-columns: minmax(150px, 32%) minmax(0, 1fr); }
.tr-dialog .tr-actions { display:flex; flex-wrap: wrap; }
.tr-dialog .tr-actions > * { max-width: 100%; overflow-wrap: anywhere; }
.tr-dialog .tr-credits article { min-width: 0; overflow-wrap: anywhere; }
/* Enlarge existing gallery tiles without replacing their video/post handlers. */
#film-club-profile { box-sizing: border-box !important; width: min(1050px, calc(100vw - 16px)) !important; max-width: calc(100vw - 16px) !important; }
#film-club-profile .community-profile-body { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
#film-club-profile .eyeroom-gallery-thumbnails, .cine-hub-page .eyeroom-gallery-thumbnails {
  width: 100%; max-width: 100%; min-width: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px;
}
#film-club-profile .eyeroom-gallery-tile, .cine-hub-page .eyeroom-gallery-tile { min-width: 0; width: 100%; overflow: hidden; }
#film-club-profile .tr-portfolio-mode .eyeroom-gallery-thumbnails, .cine-hub-page .tr-portfolio-mode .eyeroom-gallery-thumbnails { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
#film-club-profile .tr-portfolio-mode .eyeroom-gallery-tile, .cine-hub-page .tr-portfolio-mode .eyeroom-gallery-tile { aspect-ratio: 4 / 5; }
@media (max-width: 650px) {
  .tr-dialog { width: calc(100vw - 10px) !important; max-width: calc(100vw - 10px) !important; max-height: calc(100dvh - 10px) !important; border-radius: 13px !important; }
  .tr-dialog .tr-shell > header.tr-top { height: auto !important; padding: 17px 14px 15px !important; gap: 8px !important; }
  .tr-dialog .tr-top h1 { font-size: clamp(25px, 7vw, 34px) !important; }
  .tr-dialog .tr-top p { font-size: 13px !important; }
  .tr-dialog .tr-main { padding: 15px 12px 28px !important; }
  .tr-dialog .tr-main > .tr-toolbar { gap: 7px !important; margin: 0 0 18px !important; }
  .tr-dialog .tr-toolbar .tr-chip { font-size: 12px !important; padding: 8px 10px !important; }
  .tr-dialog .tr-search { display: grid !important; grid-template-columns: minmax(0,1fr) !important; }
  .tr-dialog .tr-profile-hero { display: grid !important; grid-template-columns: minmax(0,1fr) !important; padding: 13px !important; }
  .tr-dialog .tr-portrait img { width: min(100%, 280px) !important; max-width: 280px !important; height: auto !important; aspect-ratio: 4 / 5 !important; object-fit: cover !important; margin: 0 auto 18px !important; }
  .tr-dialog .tr-directory-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
  .tr-dialog .tr-actions > * { flex: 1 1 100% !important; }
  #film-club-profile { width: calc(100vw - 8px) !important; max-width: calc(100vw - 8px) !important; }
  #film-club-profile .community-profile-body { padding-inline: 14px !important; }
  #film-club-profile .eyeroom-gallery-thumbnails, .cine-hub-page .eyeroom-gallery-thumbnails { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 5px; }
  #film-club-profile .tr-portfolio-mode .eyeroom-gallery-thumbnails, .cine-hub-page .tr-portfolio-mode .eyeroom-gallery-thumbnails { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; }
}