/* One viewport-centred shell for every modal, including short phone screens. */
@layer studio {
 /* Chat composer is a fixed grid row; only the message history scrolls. */
 @media (min-width:0px) {
  body.studio-3d #onlineModal:not([hidden]) > .online-dialog:has(.social-chat) {
   display:grid!important;grid-template-rows:auto minmax(0,1fr)!important;
   height:min(680px,calc(var(--popup-viewport-height) - 2 * var(--popup-edge-y)))!important;
   overflow:hidden!important;
  }
  body.studio-3d #onlineModal .online-dialog:has(.social-chat) #onlineContent {
   min-height:0!important;height:100%!important;max-height:none!important;overflow:hidden!important;
  }
  body.studio-3d #onlineModal #onlineContent .social-chat {
   display:grid!important;grid-template-rows:auto minmax(0,1fr) auto!important;
   box-sizing:border-box!important;height:100%!important;min-height:0!important;overflow:hidden!important;
  }
  body.studio-3d #onlineModal #onlineContent .social-chat-messages {
   min-height:0!important;max-height:none!important;overflow-y:auto!important;align-content:start;
   overscroll-behavior:contain;
  }
  body.studio-3d #onlineModal #onlineContent .social-chat-form {
   position:relative!important;inset:auto!important;margin:0!important;min-height:46px!important;
  }
 }
 body.studio-3d {
  --popup-edge-y:max(12px,env(safe-area-inset-top,0px),env(safe-area-inset-bottom,0px));
  --popup-edge-x:max(12px,env(safe-area-inset-left,0px),env(safe-area-inset-right,0px));
  --popup-viewport-height:100dvh;
  --popup-viewport-top:0px;
 }
 html.mobile-keyboard-open body.studio-3d {
  --popup-viewport-height:var(--app-visible-height,100dvh);
  --popup-viewport-top:var(--app-visible-top,0px);
 }
 body.studio-3d :is(#onlineModal,#infoModal,#settingsModal,#lastTrickModal,#boomModal,#chatHistoryModal,#gameExitModal,.legal-dialog,.pwa-push-onboarding):not([hidden]) {
  position:fixed!important;
  inset:var(--popup-viewport-top) 0 auto!important;
  /* Cancel the game's old left:50% / translateX(-50%) overlay positioning. */
  transform:none!important;translate:none!important;
  box-sizing:border-box!important;
  width:100%!important;min-width:0!important;max-width:none!important;
  height:var(--popup-viewport-height)!important;
  min-height:0!important;max-height:var(--popup-viewport-height)!important;
  display:grid!important;grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:minmax(0,1fr)!important;
  place-items:center!important;place-content:center!important;
  padding:var(--popup-edge-y) var(--popup-edge-x)!important;
  margin:0!important;overflow:hidden!important;
 }
 body.studio-3d :is(#onlineModal,#infoModal,#settingsModal,#lastTrickModal,#boomModal,#chatHistoryModal,#gameExitModal,.legal-dialog,.pwa-push-onboarding):not([hidden]) > :is([role="dialog"],[role="alertdialog"],.pwa-push-card,div) {
  position:relative!important;inset:auto!important;
  box-sizing:border-box!important;place-self:center!important;
  margin:0!important;transform:none!important;translate:none!important;min-height:0!important;
  max-width:100%!important;
  max-height:calc(var(--popup-viewport-height) - 2 * var(--popup-edge-y))!important;
  overflow-y:auto!important;overscroll-behavior-y:contain;
  -webkit-overflow-scrolling:touch;
 }
 /* Cookie consent has no separate overlay element. */
 body.studio-3d .cookie-banner:not([hidden]) {
  position:fixed!important;
  top:calc(var(--popup-viewport-top) + var(--popup-viewport-height) / 2)!important;
  left:50%!important;right:auto!important;bottom:auto!important;
  transform:translate(-50%,-50%)!important;margin:0!important;
  height:auto!important;min-height:0!important;
  max-width:calc(100% - 2 * var(--popup-edge-x))!important;
  max-height:calc(var(--popup-viewport-height) - 2 * var(--popup-edge-y))!important;
  overflow-y:auto!important;overscroll-behavior-y:contain;
 }
}