@media(max-width:699px){
  html.mobile-zalo-webview{--bottom-nav-safe-h:0px}
  html.mobile-embedded-webview,html.mobile-embedded-webview body{min-height:var(--embedded-viewport-height,100dvh);overflow-x:hidden;overflow-y:auto}
  html.mobile-embedded-webview body{overscroll-behavior-y:auto}
  html.mobile-embedded-webview .app{min-height:var(--embedded-viewport-height,100dvh)}
  html.mobile-embedded-webview body:not(:has(.hero))::before{height:var(--topbar-h)}
  html.mobile-embedded-webview .selection-screen{height:calc(var(--embedded-viewport-height,100dvh) - var(--topbar-h) - var(--bottom-nav-clearance))}
  html.mobile-embedded-webview .app:has(.game-screen) .topbar,html.mobile-embedded-webview .app:has(.assignment-game-screen) .topbar{height:var(--topbar-h);padding-top:0}
  html.mobile-embedded-webview .game-screen{min-height:calc(var(--embedded-viewport-height,100dvh) - var(--topbar-h) - max(8px,env(safe-area-inset-bottom)))}
  html.mobile-embedded-webview .assignment-game-screen{height:calc(var(--embedded-viewport-height,100dvh) - var(--topbar-h));min-height:0;overflow:hidden;padding-bottom:max(4px,var(--bottom-nav-safe-h))}
  html.mobile-embedded-webview .screen{scroll-margin-top:var(--topbar-h)}
}
@media(max-width:360px){html.mobile-embedded-webview{--topbar-h:52px}}
@media(max-width:699px){html.mobile-keyboard-open,html.mobile-keyboard-open body,html.mobile-keyboard-open .app{min-height:var(--visual-viewport-height,100dvh)}html.mobile-keyboard-open .app:has(.assignment-game-screen) .topbar{height:var(--topbar-h);padding-top:0}}
@media(max-width:430px){html.mobile-embedded-webview .assignment-game-screen.assignment-keypad-open{height:var(--embedded-viewport-height,100dvh)}html.mobile-embedded-webview body:has(.assignment-game-screen.assignment-keypad-open)::before{height:0}}