.screen-wrapper:has(.mj-phone),
.screen-wrapper.screen-active:has(.mj-phone) {
  max-width: none !important;
  width: 100vw !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  position: fixed !important;
  inset: 0 !important;
  transform: none !important;
  align-items: stretch !important;
}
.mj-phone {
  width: 100% !important;
  max-width: none !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  background: #f5efdf var(--surface-jar-background) center / cover no-repeat !important;
}
.mj-phone .mj-top,
.mj-phone .mj-jar-section {
  width: min(420px, 100%) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
html:has(.mj-phone),
body:has(.mj-phone),
#app:has(.mj-phone) {
  min-height: 100dvh;
  background: #f5efdf var(--surface-jar-background) center / cover no-repeat !important;
}