*,
*::before,
*::after {
  box-sizing: border-box;
}

html:root,
html body,
body[class] {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-x: hidden !important;
  touch-action: pan-y;
  -webkit-text-size-adjust: 100%;
  overscroll-behavior: none;
}

@supports (overflow: clip) {
  html:root,
  html body,
  body[class] {
    overflow-x: clip !important;
  }
}

body {
  position: relative;
  margin-inline: 0;
}

html[data-n9-android-app="true"] {
  --n9-app-safe-top: var(--safe-area-inset-top, 0px);
}

html[data-n9-android-app="true"] body > .app-shell,
html[data-n9-android-app="true"] body.category-page > .category-shell {
  padding-top: var(--n9-app-safe-top) !important;
}

/* Android APP secondary pages: the sticky header owns the top inset. */
html[data-n9-android-app="true"] [data-n9-app-safe-header] {
  box-sizing: border-box !important;
  height: auto !important;
  min-height: calc(var(--n9-app-header-height, 58px) + var(--n9-app-safe-top)) !important;
  padding-top: calc(var(--n9-app-header-pad-top, 0px) + var(--n9-app-safe-top)) !important;
  padding-bottom: var(--n9-app-header-pad-bottom, 0px) !important;
}

html[data-n9-android-app="true"] .recharge-topbar {
  --n9-app-header-height: 66px;
  --n9-app-header-pad-top: 12px;
  --n9-app-header-pad-bottom: 12px;
}

html[data-n9-android-app="true"] .withdraw-topbar {
  --n9-app-header-height: 64px;
}

html[data-n9-android-app="true"] .records-topbar {
  --n9-app-header-height: 58px;
  --n9-app-header-pad-top: 6px;
  --n9-app-header-pad-bottom: 6px;
}

html[data-n9-android-app="true"] .first-recharge-topbar,
html[data-n9-android-app="true"] .loss-rescue-topbar,
html[data-n9-android-app="true"] .vip-gift-topbar {
  --n9-app-header-height: 54px;
  --n9-app-header-pad-top: 7px;
  --n9-app-header-pad-bottom: 7px;
}

html[data-n9-android-app="true"] .invite-reward-topbar {
  --n9-app-header-height: 58px;
  --n9-app-header-pad-top: 8px;
  --n9-app-header-pad-bottom: 8px;
}

html[data-n9-android-app="true"] .agent-header {
  --n9-app-header-height: 70px;
}

html[data-n9-android-app="true"] .agent-growth-topbar {
  --n9-app-header-height: 48px;
}

html[data-n9-android-app="true"] .security-header,
html[data-n9-android-app="true"] .slot-jackpot-topbar {
  --n9-app-header-height: 58px;
}

html[data-n9-android-app="true"] .game-page-topbar {
  --n9-app-header-height: 62px;
}

html[data-n9-android-app="true"] body.records-page .records-tabs {
  top: calc(58px + var(--n9-app-safe-top)) !important;
}

html[data-n9-android-app="true"] .n9-support-root .client-support-shell {
  padding-top: calc(12px + var(--n9-app-safe-top)) !important;
}

html[data-n9-android-app="true"] .n9-support-root .n9-support-close {
  top: calc(12px + var(--n9-app-safe-top)) !important;
}

img,
video,
canvas,
svg,
iframe {
  height: auto;
  max-width: 100%;
}

body > *,
main,
header,
footer,
nav,
section {
  max-width: 100%;
  min-width: 0;
}

img {
  -webkit-user-drag: none;
  user-select: none;
  pointer-events: auto;
}

input,
textarea,
select {
  font-size: 16px;
}

@media (max-width: 760px) {
  html:root,
  html body,
  body[class] {
    inline-size: 100% !important;
    max-inline-size: 100% !important;
  }

  body > .app-shell,
  body .app-shell,
  body main,
  body .view {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-inline: 0 !important;
  }
}

@media (max-width: 900px), (hover: none) and (pointer: coarse) {
  html body input:not([data-allow-mobile-zoom]),
  html body textarea:not([data-allow-mobile-zoom]),
  html body select:not([data-allow-mobile-zoom]) {
    font-size: 16px !important;
    -webkit-text-size-adjust: 100%;
  }
}