/*
 * Native top-menu normalization only: common/withdraw header .9rem,
 * tab caption .24rem, back glyph .3rem and active line .03rem.
 * Palette: native skin tokens, with original #0053df/#bbd1f6 fallbacks.
 * Do not extend these selectors to page bodies, filters, forms or buttons.
 */
.c168-record-page > .c168-record-tabs,
.c168-pay-page.c168-recipients-new > .c168-pay-tabs,
.c168-pay-page.c168-pay-withdraw .c168-withdraw-tabs-wrap {
  height: .9rem !important;
  min-height: .9rem !important;
  max-height: .9rem !important;
  background: var(--skin__bg_2, #fff) !important;
  border-bottom: thin solid var(--skin__border, #bbd1f6) !important;
}
.c168-record-page > .c168-record-tabs,
.c168-pay-page.c168-recipients-new > .c168-pay-tabs,
.c168-pay-page.c168-pay-withdraw .c168-withdraw-tabs-rail {
  align-items: stretch;
  gap: .4rem !important;
  padding-inline: .2rem !important;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  touch-action: pan-x;
  -webkit-overflow-scrolling: touch;
}
.c168-record-page > .c168-record-tabs::-webkit-scrollbar,
.c168-pay-page.c168-recipients-new > .c168-pay-tabs::-webkit-scrollbar,
.c168-pay-page.c168-pay-withdraw .c168-withdraw-tabs-rail::-webkit-scrollbar { display: none; }
.c168-pay-page.c168-pay-withdraw .c168-withdraw-tabs-rail {
  height: .9rem !important;
  min-height: .9rem !important;
  max-height: .9rem !important;
}
.c168-record-page > .c168-record-tabs > button:not(:first-child),
.c168-pay-page.c168-recipients-new > .c168-pay-tabs > button:not(:first-child),
.c168-pay-page.c168-pay-withdraw .c168-withdraw-tabs-rail > button {
  height: 100% !important;
  min-height: 0;
  padding-block: 0 !important;
  padding-inline: 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-family: var(--c168-source-font-oct22, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif) !important;
  font-size: .24rem !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  white-space: nowrap;
  color: var(--skin__lead, #333) !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: .03rem solid transparent !important;
}
.c168-record-page > .c168-record-tabs > button.active,
.c168-record-page > .c168-record-tabs > button[aria-current="page"],
.c168-pay-page.c168-recipients-new > .c168-pay-tabs > button.active,
.c168-pay-page.c168-recipients-new > .c168-pay-tabs > button[aria-current="page"],
.c168-pay-page.c168-pay-withdraw .c168-withdraw-tabs-rail > button.active,
.c168-pay-page.c168-pay-withdraw .c168-withdraw-tabs-rail > button[aria-current="page"] {
  color: var(--skin__primary, #0053df) !important;
  border-bottom-color: var(--skin__primary, #0053df) !important;
}
/* Legacy rails contain their back control; pin only that control while swiping. */
.c168-record-page > .c168-record-tabs > button:first-child[aria-label="Trở về"],
.c168-pay-page.c168-recipients-new > .c168-pay-tabs > button:first-child[aria-label="Trở về"] {
  position: sticky;
  inset-inline-start: 0;
  z-index: 3;
  height: 100% !important;
  min-width: .3rem;
  padding: 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border: 0 !important;
  background: var(--skin__bg_2, #fff) !important;
  color: var(--skin__primary, #0053df) !important;
  font-size: .3rem !important;
  line-height: 1 !important;
}
.c168-record-page > .c168-record-tabs > button:first-child[aria-label="Trở về"] svg,
.c168-pay-page.c168-recipients-new > .c168-pay-tabs > button:first-child[aria-label="Trở về"] svg,
.c168-pay-page.c168-pay-withdraw .c168-withdraw-back svg {
  width: .3rem !important;
  height: .3rem !important;
}
.c168-pay-page.c168-pay-withdraw .c168-withdraw-back,
.c168-pay-page.c168-pay-withdraw .c168-withdraw-support {
  height: .9rem !important;
  color: var(--skin__primary, #0053df) !important;
  background: var(--skin__bg_2, #fff) !important;
}

/* Unified page-top navigation. These are navigation rails, not game categories,
   payment methods, help topics or filters. The user's consistency request uses
   the verified withdrawal header preset across these page-top rails. */
.c168-page.c168-promotions > .c168-horizontal-tabs.c168-promo-top,
.c168-page.c168-support > .c168-support-primary-tabs,
.c168-invite-source-page > .c168-invite-source-tabs {
  display: flex !important;
  align-items: stretch !important;
  gap: .4rem !important;
  padding-inline: .2rem !important;
  height: .9rem !important;
  min-height: .9rem !important;
  max-height: .9rem !important;
  background: var(--skin__bg_2, #fff) !important;
  border-bottom: thin solid var(--skin__border, #bbd1f6) !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.c168-page.c168-promotions > .c168-promo-top::-webkit-scrollbar,
.c168-page.c168-support > .c168-support-primary-tabs::-webkit-scrollbar,
.c168-invite-source-page > .c168-invite-source-tabs::-webkit-scrollbar { display: none; }
.c168-page.c168-promotions > .c168-promo-top > button:not(:first-child),
.c168-page.c168-support > .c168-support-primary-tabs > button,
.c168-invite-source-page > .c168-invite-source-tabs > button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 100% !important;
  min-height: 0 !important;
  padding-block: 0 !important;
  padding-inline: 0 !important;
  flex-shrink: 0;
  font-family: var(--c168-source-font-oct22, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif) !important;
  font-size: .24rem !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  color: var(--skin__lead, #333) !important;
  white-space: nowrap !important;
  border: 0 !important;
  border-bottom: .03rem solid transparent !important;
  background: transparent !important;
}
.c168-page.c168-promotions > .c168-promo-top > button.active,
.c168-page.c168-support > .c168-support-primary-tabs > button.active,
.c168-invite-source-page > .c168-invite-source-tabs > button.active {
  color: var(--skin__primary, #0053df) !important;
  border-bottom-color: var(--skin__primary, #0053df) !important;
}
/* Undo the former grid-only full-width cell rule when this rail becomes flex. */
.c168-page.c168-support > nav.c168-support-primary-tabs {
  gap: 0 !important;
  padding-inline: .08rem !important;
}
.c168-page.c168-support > nav.c168-support-primary-tabs > button {
  width: auto !important;
  flex: 1 0 auto !important;
  padding-inline: .16rem !important;
}
.c168-page.c168-promotions > .c168-promo-top > button:first-child[aria-label="Trở về"] {
  position: sticky;
  inset-inline-start: 0;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 100% !important;
  min-width: .3rem;
  padding-block: 0 !important;
  border: 0 !important;
  color: var(--skin__primary, #0053df) !important;
  background: var(--skin__bg_2, #fff) !important;
}
.c168-page.c168-support > .c168-page-header,
.c168-invite-source-page > .c168-invite-source-header {
  height: .9rem !important;
  min-height: .9rem !important;
  background: var(--skin__bg_2, #fff) !important;
  border-bottom-color: var(--skin__border, #bbd1f6) !important;
}
.c168-page.c168-support > .c168-page-header > span,
.c168-invite-source-page > .c168-invite-source-header > span {
  font-size: .34rem !important;
  color: var(--skin__lead, #333) !important;
}
.c168-page.c168-promotions > .c168-promo-top > button:first-child[aria-label="Trở về"] svg,
.c168-page.c168-support > .c168-page-header > button[aria-label="Trở về"] svg,
.c168-invite-source-page > .c168-invite-source-header > button[aria-label="Trở về"] svg {
  width: .3rem !important;
  height: .3rem !important;
  color: var(--skin__primary, #0053df) !important;
}

/* Raise the entire notice widget only; do not change its width, caption or x position. */
.c168-native-home-notice { top: -.04rem; }

/* Native scroll chaining at BOTH ends. Do not intercept wheel/touch events,
   change card geometry, unlock modal bodies or remove game-list pagination. */
#ui-tab-3 .c168-react-home-grid.c168-home-game-scroll {
  overscroll-behavior-y: auto !important;
}

.c168-invite-source-page .c168-invite-source-qr>.c168-invite-source-qr-placeholder{display:grid;place-items:center;box-sizing:border-box;width:100%;aspect-ratio:1/1;flex:none;padding:0!important;background:#fff;color:#88a7e3}.c168-invite-source-page .c168-invite-source-qr[aria-disabled=true],.c168-invite-source-page .c168-invite-source-socials button:disabled{cursor:default}