html.is-tablet-runtime,
html.is-tablet-runtime body,
html.is-tablet-runtime #app {
  width: var(--tablet-viewport-width, 100vw) !important;
  min-width: var(--tablet-viewport-width, 100vw) !important;
  max-width: var(--tablet-viewport-width, 100vw) !important;
  overflow-x: hidden !important;
}

html.compat-browser-ui-sensitive.is-tablet-runtime,
html.compat-browser-ui-sensitive.is-tablet-runtime body,
html.compat-browser-ui-sensitive.is-tablet-runtime #app,
html.compat-browser-ui-sensitive.is-tablet-runtime .mockup-shell,
html.compat-browser-ui-sensitive.is-tablet-runtime .phone-stage-shell {
  width: var(--tablet-viewport-width, 100vw) !important;
  min-width: var(--tablet-viewport-width, 100vw) !important;
  max-width: var(--tablet-viewport-width, 100vw) !important;
}

html.is-tablet-runtime body {
  background: #fff !important;
}

html.is-tablet-runtime .mockup-shell,
html.is-tablet-runtime .phone-stage-shell {
  width: var(--tablet-viewport-width, 100vw) !important;
  min-width: var(--tablet-viewport-width, 100vw) !important;
  max-width: var(--tablet-viewport-width, 100vw) !important;
  display: flex !important;
  justify-content: center !important;
}

html.is-tablet-runtime .phone-stage-frame,
html.is-tablet-runtime .phone-stage {
  width: var(--tablet-page-width, 375px) !important;
  min-width: var(--tablet-page-width, 375px) !important;
  max-width: var(--tablet-page-width, 375px) !important;
}

html.compat-browser-ui-sensitive.is-tablet-runtime .phone-stage-frame,
html.compat-browser-ui-sensitive.is-tablet-runtime .phone-stage,
html.compat-browser-ui-sensitive.is-tablet-runtime .phone-stage > .screen,
html.compat-browser-ui-sensitive.is-tablet-runtime .phone-stage-frame > .phone-stage > .screen,
html.compat-browser-ui-sensitive.is-tablet-runtime .phone-stage-overlay {
  width: var(--tablet-page-width, 375px) !important;
  min-width: var(--tablet-page-width, 375px) !important;
  max-width: var(--tablet-page-width, 375px) !important;
}

html.is-tablet-runtime .mockup-shell,
html.is-tablet-runtime .phone-stage-shell,
html.is-tablet-runtime .phone-stage-frame {
  height: var(--tablet-viewport-height, var(--mobile-viewport-height, 100dvh)) !important;
  min-height: var(--tablet-viewport-height, var(--mobile-viewport-height, 100dvh)) !important;
}

html.is-tablet-runtime .phone-stage-frame {
  margin-inline: auto !important;
  overflow: hidden !important;
}

html.is-tablet-runtime .phone-stage > .screen,
html.is-tablet-runtime .phone-stage-frame > .phone-stage > .screen {
  width: 100% !important;
  max-width: 100% !important;
}

html.is-tablet-runtime .desktop-sitemap,
html.is-tablet-runtime .desktop-sitemap-placeholder,
html.is-tablet-runtime .home-desktop-aside {
  display: none !important;
}

html.is-tablet-runtime.has-browser-bottom-ui {
  --tablet-viewport-height: var(--browser-ui-content-height) !important;
}