/* Installed-app viewport lock. The website keeps its normal responsive behavior. */
html.pause-native,
html.pause-native body{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:100%!important;
  margin:0!important;
  overflow-x:hidden!important;
  overscroll-behavior-x:none!important;
  background:#f2f4f6;
}
html.pause-native{scroll-behavior:auto!important;contain:inline-size!important}
html.pause-native body{
  box-sizing:border-box!important;
  position:relative!important;
  touch-action:pan-y!important;
  padding-right:env(safe-area-inset-right,0px)!important;
  padding-left:env(safe-area-inset-left,0px)!important;
}
html.pause-native body.pause-mobile-app{
  padding-bottom:calc(92px + env(safe-area-inset-bottom,0px))!important;
}
html.pause-native #languageGate{display:none!important}
html.pause-native input,
html.pause-native textarea,
html.pause-native select{
  font-size:16px!important;
}
html.pause-native .app{
  box-sizing:border-box!important;
  contain:inline-size!important;
  width:100%!important;
  max-width:520px!important;
  min-width:0!important;
  min-height:100dvh!important;
  margin-inline:auto!important;
  overflow-x:clip!important;
}
html.pause-native .app>.bar{
  box-sizing:border-box!important;
  width:100%!important;
  max-width:100%!important;
  padding-left:18px!important;
  padding-right:18px!important;
}
html.pause-native .app>.bar h2{min-width:0!important;overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important}
html.pause-native .app>.bar .lang{flex:0 0 auto!important;max-width:116px!important}
html.pause-native .view{
  box-sizing:border-box!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin-inline:0!important;
  padding-left:18px!important;
  padding-right:18px!important;
  padding-bottom:96px!important;
  overflow-x:clip!important;
}
html.pause-native .view>*{box-sizing:border-box!important;min-width:0!important;max-width:100%!important}
html.pause-native button,
html.pause-native img{max-width:100%}
html.pause-native #feedbackFab{
  right:calc(12px + env(safe-area-inset-right,0px))!important;
  left:auto!important;
  width:max-content!important;
  max-width:calc(100% - 24px - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px))!important;
}
html.pause-native #pauseAppDock{
  box-sizing:border-box!important;
  left:calc(12px + env(safe-area-inset-left,0px))!important;
  right:calc(12px + env(safe-area-inset-right,0px))!important;
  bottom:max(10px,env(safe-area-inset-bottom,0px))!important;
  width:auto!important;
  max-width:none!important;
  transform:none!important;
}
html.pause-native body.pause-keyboard-open #pauseAppDock{display:none!important}

/* iPhone safe-area: WKWebView can report a zero CSS inset briefly during launch.
   Keep interactive controls below a conservative notch/Dynamic Island fallback. */
html.pause-native-ios body{padding-top:0!important;padding-bottom:env(safe-area-inset-bottom,0px)!important}
html.pause-native-ios body.pause-mobile-app{padding-bottom:calc(92px + env(safe-area-inset-bottom,0px))!important}
html.pause-native-ios .app>.bar{
  top:0!important;
  height:calc(62px + max(env(safe-area-inset-top,0px),54px))!important;
  min-height:calc(62px + max(env(safe-area-inset-top,0px),54px))!important;
  padding-top:max(env(safe-area-inset-top,0px),54px)!important;
}
html.pause-native-ios .sheet,
html.pause-native-ios .feedback-sheet,
html.pause-native-ios .pause-web-modal,
html.pause-native-ios #pauseAppSheet{
  top:max(env(safe-area-inset-top,0px),54px)!important;
  right:env(safe-area-inset-right,0px)!important;
  bottom:env(safe-area-inset-bottom,0px)!important;
  left:env(safe-area-inset-left,0px)!important;
}
html.pause-native-ios #pauseAppSheet{bottom:0!important}
html.pause-native-ios .sheet .inner,
html.pause-native-ios .feedback-card,
html.pause-native-ios .pause-web-modal-card,
html.pause-native-ios #pauseAppSheet .pause-app-panel{
  box-sizing:border-box!important;
  width:calc(100% - 32px)!important;
  max-width:480px!important;
  margin-inline:auto!important;
}
