/* ==========================================================================
   clarims-ux.css — Phase-2 UX layer (DRAFT, staging integration later)
   Its own small separate file: does not edit the existing CSS builds.
   Everything is on the `cx-` prefix so it cannot collide with antd /
   animate.css / hashed module names, and the Phase-1 purge cannot kill
   it by mistake.
   rem base: 750-design (1rem = 100px @750) — reference numbers 1:1.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. TOKENS
   -------------------------------------------------------------------------- */
:root{
  /* reference A1 (verbatim pattern) */
  --cx-animate-duration:.3s;
  --cx-animate-delay:.3s;
  --cx-animate-repeat:1;

  /* clarims derived */
  --cx-dur-fast:.15s;                       /* half-hide shifts, micro moves */
  --cx-dur-press:.2s;                       /* button press, indicators */
  --cx-ease-linear:linear;                  /* page/slide (reference: linear) */
  --cx-ease-dialog:cubic-bezier(.08,.82,.17,1); /* antd zoom curve — dialogs */
  --cx-ease-in-out:ease-in-out;             /* icon pulse .4s */

  /* z-index scale (antd modal ~1000, CS float 99 ke darmiyan/upar) */
  --cx-z-float:90;
  --cx-z-header-sticky:100;
  --cx-z-splash:4000;
  --cx-z-loading:4900;                      /* loading toast ka block overlay */
  --cx-z-toast:5000;                        /* reference verbatim */

  /* toast look (user spec 2026-10-23: white box on dark skins; light skins
     25/26 get the black box via .cx-toast--light below) */
  --cx-toast-bg:#fff;
  --cx-toast-fg:#333;
  --cx-toast-success:#04be02;
  --cx-toast-error:#ea4e3d;
  --cx-toast-warn:#ffaa09;
  --cx-toast-info:var(--theme-primary-color,#06D0DF);

  /* splash / skeleton */
  --cx-splash-bg:var(--theme-primary-background-color,#054146);
  --cx-skeleton-base:rgba(255,255,255,.06);
  --cx-skeleton-shine:rgba(255,255,255,.12);

  /* marquee (cx-dynamicScroll*): JS sets this */
  --cx-end-offset:0px;
}

/* --------------------------------------------------------------------------
   2. KEYFRAMES — reference ke 24, cx- prefix (bodies reference verbatim)
   -------------------------------------------------------------------------- */
@keyframes cx-fadeIn{from{opacity:0}to{opacity:1}}
@keyframes cx-fadeOut{from{opacity:1}to{opacity:0}}

@keyframes cx-zoomIn{
  0%{transform:scale3d(.3,.3,.3);opacity:0}
  50%{opacity:1}
}
@keyframes cx-zoomOut{
  0%{opacity:1}
  50%{transform:scale3d(.3,.3,.3);opacity:0}
  100%{opacity:0}
}

@keyframes cx-slideInRight{from{transform:translate3d(100%,0,0);visibility:visible}to{transform:translateZ(0)}}
@keyframes cx-slideOutLeft{from{transform:translateZ(0)}to{transform:translate3d(-100%,0,0)}}
@keyframes cx-slideInLeft{from{transform:translate3d(-100%,0,0);visibility:visible}to{transform:translateZ(0)}}
@keyframes cx-slideOutRight{from{transform:translateZ(0)}to{transform:translate3d(100%,0,0)}}
@keyframes cx-slideInUp{from{transform:translate3d(0,100%,0);visibility:visible}to{transform:translateZ(0)}}
@keyframes cx-slideOutDown{from{transform:translateZ(0)}to{transform:translate3d(0,100%,0)}}
@keyframes cx-slideInDown{from{transform:translate3d(0,-100%,0);visibility:visible}to{transform:translateZ(0)}}
@keyframes cx-slideOutUp{from{transform:translateZ(0)}to{transform:translate3d(0,-100%,0)}}

@keyframes cx-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

@keyframes cx-heartBeat{
  0%{transform:scale(1)}
  14%{transform:scale(1.3)}
  28%{transform:scale(1)}
  42%{transform:scale(1.3)}
  70%{transform:scale(1)}
}
@keyframes cx-beatUpAndDown{
  0%{transform:translateY(-.02rem)}
  50%{transform:translateY(.02rem)}
  100%{transform:translateY(-.02rem)}
}
@keyframes cx-beatLeftAndRight{
  0%{transform:translateX(-.05rem)}
  50%{transform:translateX(0)}
  100%{transform:translateX(.05rem)}
}
@keyframes cx-swingByCenter{
  0%{transform:rotate(0deg)}
  20%{transform:rotate(-10deg)}
  40%{transform:rotate(10deg)}
  60%{transform:rotate(-8deg)}
  80%{transform:rotate(8deg)}
  100%{transform:rotate(0deg)}
}

/* marquee: runs with the JS duration formula (speed 77, min 1s).
   Left/Up = content to -50%; Right/Down = from -50% to 0 (the loop's other direction). */
@keyframes cx-dynamicScrollLeft{from{transform:translateZ(0)}to{transform:translate3d(calc(-50% + var(--cx-end-offset)),0,0)}}
@keyframes cx-dynamicScrollRight{from{transform:translate3d(calc(-50% + var(--cx-end-offset)),0,0)}to{transform:translateZ(0)}}
@keyframes cx-dynamicScrollUp{from{transform:translateZ(0)}to{transform:translate3d(0,calc(-50% + var(--cx-end-offset)),0)}}
@keyframes cx-dynamicScrollDown{from{transform:translate3d(0,calc(-50% + var(--cx-end-offset)),0)}to{transform:translateZ(0)}}

@keyframes cx-shimmer{from{background-position-x:125%}to{background-position-x:-32%}}

@keyframes cx-iconPulse{from{transform:scale(1)}to{transform:scale(1.1)}}
@keyframes cx-coinFlipY{from{transform:rotateY(0deg)}to{transform:rotateY(-360deg)}}

/* float label shine ke liay extra (reference FloatBar label _shine pattern) */
@keyframes cx-labelShine{from{transform:translateX(-150%) skewX(-20deg)}to{transform:translateX(250%) skewX(-20deg)}}

/* --------------------------------------------------------------------------
   2b. TRANSITION / ANIMATION UTILITY CLASSES
   (router/integration inhe lagayega — spec §2; slides hamesha linear)
   -------------------------------------------------------------------------- */
.cx-page-push-enter-active{animation:cx-slideInRight var(--cx-animate-duration) var(--cx-ease-linear) both}
.cx-page-push-leave-active{animation:cx-slideOutLeft var(--cx-animate-duration) var(--cx-ease-linear) both}
.cx-page-pop-enter-active{animation:cx-slideInLeft var(--cx-animate-duration) var(--cx-ease-linear) both}
.cx-page-pop-leave-active{animation:cx-slideOutRight var(--cx-animate-duration) var(--cx-ease-linear) both}
.cx-page-fade-enter-active{animation:cx-fadeIn var(--cx-animate-duration) var(--cx-ease-linear) both}
.cx-page-fade-leave-active{animation:cx-fadeOut var(--cx-animate-duration) var(--cx-ease-linear) both}
.cx-zoom-enter-active{animation:cx-zoomIn var(--cx-animate-duration) var(--cx-ease-dialog) both}
.cx-zoom-leave-active{animation:cx-zoomOut var(--cx-animate-duration) var(--cx-ease-dialog) both}
.cx-fade-enter-active{animation:cx-fadeIn var(--cx-animate-duration) var(--cx-ease-linear) both}
.cx-fade-leave-active{animation:cx-fadeOut var(--cx-animate-duration) var(--cx-ease-linear) both}
.cx-sheet-enter-active{animation:cx-slideInUp var(--cx-animate-duration) var(--cx-ease-linear) both}
.cx-sheet-leave-active{animation:cx-slideOutDown var(--cx-animate-duration) var(--cx-ease-linear) both}

/* flip-list (reference: transition-based, animation nahi) */
.cx-flip-list-enter,.cx-flip-list-leave-to{opacity:0;transform:translateY(.3rem)}
.cx-flip-list-enter-active,.cx-flip-list-leave-active,.cx-flip-list-move{transition:opacity var(--cx-animate-duration) var(--cx-ease-linear),transform var(--cx-animate-duration) var(--cx-ease-linear)}

/* small helper classes */
.cx-anim-heartbeat{animation:cx-heartBeat calc(var(--cx-animate-duration)*1.8) var(--cx-ease-in-out) both}
.cx-anim-pulse{animation:cx-iconPulse .4s var(--cx-ease-in-out) infinite alternate}
.cx-anim-coin{animation:cx-coinFlipY 1s linear 1 both}
.cx-anim-spin{animation:cx-spin 1s linear infinite}
.cx-anim-swing{transform-origin:top center;animation:cx-swingByCenter var(--cx-animate-duration) var(--cx-ease-in-out) both}

/* button press (reference: opacity .2s) */
.cx-press{transition:opacity var(--cx-dur-press)}
.cx-press:active{opacity:.6}

/* --------------------------------------------------------------------------
   3. TOAST — CxToast (renders only in the /mobile document, not in the shell)
   -------------------------------------------------------------------------- */
#cx-toast-root{
  position:fixed;inset:0;z-index:var(--cx-z-toast);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:.2rem;pointer-events:none;
}
.cx-toast{
  display:flex;align-items:center;gap:.24rem;
  max-width:6.9rem;min-width:1.92rem;
  padding:.17rem .4rem;border-radius:.14rem;
  background:var(--cx-toast-bg);color:var(--cx-toast-fg);
  font-size:.28rem;line-height:.4rem;text-align:left;
  box-shadow:0 .06rem .3rem rgba(0,0,0,.35);
  animation:cx-zoomIn var(--cx-animate-duration) both;
  pointer-events:none; /* no tap dismiss — no handler either */
}
.cx-toast--leaving{animation:cx-zoomOut var(--cx-animate-duration) both}
.cx-toast--light{--cx-toast-bg:rgba(0,0,0,.8);--cx-toast-fg:#fff} /* light skins (25/26): black box, white text */

.cx-toast__icon{
  flex:0 0 auto;width:.5rem;height:.5rem;border-radius:50%;
  background:transparent;display:flex;align-items:center;justify-content:center;
}
.cx-toast__icon svg{width:.5rem;height:.5rem;display:block}
.cx-toast--success .cx-toast__icon{color:var(--cx-toast-success)}
.cx-toast--error   .cx-toast__icon{color:var(--cx-toast-error)}
.cx-toast--warn    .cx-toast__icon{color:var(--cx-toast-warn)}
.cx-toast--info    .cx-toast__icon{color:var(--cx-toast-info)}
.cx-toast--loading .cx-toast__icon{background:transparent}

.cx-toast__spinner{
  width:.34rem;height:.34rem;border-radius:50%;
  border:.045rem solid rgba(0,0,0,.15);border-top-color:#333;
  animation:cx-spin .8s linear infinite;
}
.cx-toast__text{max-width:5.48rem;word-break:break-word;white-space:pre-wrap}
.cx-toast--light .cx-toast__spinner{border-color:rgba(255,255,255,.3);border-top-color:#fff}

/* the loading toast's page-block overlay — the page is unclickable until it closes */
#cx-block-overlay{
  position:fixed;inset:0;z-index:var(--cx-z-loading);
  background:transparent;display:none;
}
#cx-block-overlay.cx-on{display:block}

/* --------------------------------------------------------------------------
   4. DIALOG HELPERS — a wrapper on antd modals (NOT a replacement)
   JS applies .cx-dialog-enter / -leaving to the modal ROOT (CxDialog).
   -------------------------------------------------------------------------- */
.cx-dialog-enter .ant-modal-mask{animation:cx-fadeIn var(--cx-animate-duration) both}
.cx-dialog-enter .ant-modal-content{animation:cx-zoomIn var(--cx-animate-duration) var(--cx-ease-dialog) both}
.cx-dialog-leaving .ant-modal-mask{animation:cx-fadeOut var(--cx-animate-duration) both}
.cx-dialog-leaving .ant-modal-content{animation:cx-zoomOut var(--cx-animate-duration) var(--cx-ease-dialog) both}

/* generic zoom target (jo modal antd markup na use kare) */
.cx-dialog-enter .cx-zoom-target{animation:cx-zoomIn var(--cx-animate-duration) var(--cx-ease-dialog) both}
.cx-dialog-leaving .cx-zoom-target{animation:cx-zoomOut var(--cx-animate-duration) var(--cx-ease-dialog) both}

/* bottom sheets */
.cx-sheet-enter .cx-sheet-panel{animation:cx-slideInUp var(--cx-animate-duration) var(--cx-ease-linear) both}
.cx-sheet-leave .cx-sheet-panel{animation:cx-slideOutDown var(--cx-animate-duration) var(--cx-ease-linear) both}
.cx-sheet-enter .ant-modal-mask{animation:cx-fadeIn var(--cx-animate-duration) both}
.cx-sheet-leave .ant-modal-mask{animation:cx-fadeOut var(--cx-animate-duration) both}

/* --------------------------------------------------------------------------
   5. SPLASH + SKELETON + BLUR-IN
   -------------------------------------------------------------------------- */
#cx-splash{
  position:fixed;inset:0;z-index:var(--cx-z-splash);
  background:var(--cx-splash-bg);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;
}
#cx-splash.cx-splash--leaving{animation:cx-fadeOut var(--cx-animate-duration) both}
.cx-splash__logo{animation:cx-fadeIn var(--cx-animate-duration) both;max-width:2.6rem}
.cx-splash__pct{font-size:.32rem;color:var(--cx-toast-info);font-variant-numeric:tabular-nums}
.cx-splash__bar{width:3.2rem;height:.06rem;border-radius:.03rem;background:rgba(255,255,255,.15);overflow:hidden}
.cx-splash__bar i{display:block;height:100%;width:0;background:var(--cx-toast-info);transition:width .2s}

.cx-skeleton{
  position:relative;overflow:hidden;border-radius:.08rem;
  background:var(--cx-skeleton-base);
}
.cx-skeleton::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,transparent 0%,var(--cx-skeleton-shine) 50%,transparent 100%);
  background-size:200% 100%;
  animation:cx-shimmer .9s linear infinite;
}
.cx-skel-tile{aspect-ratio:1/1}
.cx-skel-line{height:.24rem;margin:.12rem 0}
.cx-skel-banner{height:2.2rem}

.cx-blur-in{filter:blur(.15rem);transition:filter var(--cx-animate-duration)}
.cx-blur-in.cx-loaded{filter:blur(0)}

/* --------------------------------------------------------------------------
   6. FLOAT WIDGETS — base styles (logic/modes are the W8 stream's; here
      only the look + the half-hide transform rule)
   -------------------------------------------------------------------------- */
.cx-float{position:fixed;z-index:var(--cx-z-float);display:flex;flex-direction:column;gap:.14rem}
.cx-float--right{right:.12rem}
.cx-float--left{left:.12rem}
.cx-float__item{
  position:relative;width:1.2rem;
  transition:transform var(--cx-dur-fast) var(--cx-ease-in-out);
}
.cx-float__item img{width:1.2rem;height:1.2rem;display:block}
.cx-float--put-right .cx-float__item{transform:translateX(.7rem)}   /* half-hide ≈58% */
.cx-float--put-left  .cx-float__item{transform:translateX(-.7rem)}
.cx-float__close{
  position:absolute;top:-.08rem;right:-.08rem;width:.36rem;height:.36rem;
  display:none;
}
.cx-float--closable .cx-float__close{display:block}
.cx-float__label{
  position:relative;overflow:hidden;text-align:center;
  font-size:.2rem;line-height:1.25;
}
.cx-float__label--shine::after{
  content:"";position:absolute;top:0;bottom:0;width:40%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);
  animation:cx-labelShine 1.2s linear infinite;
}
.cx-float__label--scale{animation:cx-iconPulse .4s var(--cx-ease-in-out) infinite alternate}
.cx-float__dot{
  position:absolute;top:.02rem;right:.02rem;width:.18rem;height:.18rem;
  border-radius:50%;background:#ea4e3d;
}

/* --------------------------------------------------------------------------
   7. W7 INTEGRATION GLUE — fragment router (CxRouter) + dialog observer
   (added on top of the draft in the W7 integration; the rest of the file
   is the draft verbatim)
   -------------------------------------------------------------------------- */
/* frag stage: the router changes only this region; the shell
   (header/tabBar/modals) stays outside it */
#frag-stage{position:relative}
/* snapshot layer of the leaving page — the new content slides in above it */
.cx-leave-layer{
  position:absolute;left:0;right:0;top:0;z-index:6;
  background:var(--cx-splash-bg);
  pointer-events:none;overflow:hidden;
}
/* host for the skeleton on the stage while a fragment loads — cleared as soon as the real grid arrives */
.cx-stage-loading{position:relative;min-height:60vh}
.cx-stage-loading .cx-skel-wrap{
  display:grid;grid-template-columns:repeat(3,1fr);gap:.16rem;padding:.2rem;
}
/* to prevent a scroll jump during a router swap, JS sets/clears the
   stage's minimum height (inline style); here only the companion transition rule */
/* dialog observer (spec §4.2): when a root carries .cx-open, the enter rules
   are the same ones as .cx-dialog-enter's — the draft classes themselves are
   kept in use; the observer JS applies .cx-dialog-enter; .cx-open is the
   spec's example name. Exit goes through the draft's .cx-dialog-leaving
   (CxDialog.close). */


/* [TABULAR-NUMS] §2.22(d): tabular figures for balances, countdowns, winners amounts.
   Jackpot (.cx-jackpot-value) already carries it inline in index/index.html — not repeated here. */
.cx-bal-amount, #ck_expire, .w11-expire, .cx-winners-win { font-variant-numeric: tabular-nums; }

/* [DEPSLIDE v3] No fade, no vendor zoom (user: page sirf bottom se top jaye, smoothly + slowly .8s); vendor antZoomIn + mask fade disabled. Was v2: Deposit opens like a PAGE (user): the full-screen panel
   rises from the bottom in one relaxed, smooth motion — no popup pop, no
   gap. v1 used keyframes whose clock started while the vendor's open work
   blocked the main thread, so on a real phone it could jump instead of
   gliding. v2 is a TRANSITION driven from clarims-ux.js [DEPSLIDE]: the
   pre-state is applied for the first painted frame, then the go class
   transitions transform over .48s with a soft ease-out curve. */
.c4OAdQRIIRcVKzLNfX3p .ant-modal.cx-dep-pre{transform:translateY(100%);transition:none;will-change:transform;}
.c4OAdQRIIRcVKzLNfX3p .ant-modal.cx-dep-go{transform:translateY(0);transition:transform .5s cubic-bezier(.25,.8,.3,1);}
.c4OAdQRIIRcVKzLNfX3p .ant-modal,.c4OAdQRIIRcVKzLNfX3p .ant-modal-wrap{animation:none !important;}
.c4OAdQRIIRcVKzLNfX3p .ant-modal-mask{animation:none !important;}

/* [CXKBD] Custom numeric keypad for the PIN fields (user: reference-style,
   themed by the skin vars). Slides up from the bottom like a sheet. */
#cxKbd{position:fixed;left:0;right:0;bottom:0;max-width:7.5rem;margin:0 auto;z-index:1200;background:var(--theme-main-bg-color);border-top:1px solid var(--theme-color-line);box-shadow:0 -.04rem .24rem rgba(0,0,0,.28);padding:.12rem .12rem calc(.14rem + env(safe-area-inset-bottom));transform:translateY(105%);transition:transform .32s ease;}
#cxKbd.open{transform:translateY(0);}
.cxk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.1rem;}
.cxk-key{display:flex;align-items:center;justify-content:center;height:.78rem;border:none;border-radius:.12rem;background:var(--theme-bg-color);color:var(--theme-text-color-darken);font-size:.36rem;font-weight:500;font-family:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none;touch-action:manipulation;}
.cxk-key:active{background:var(--theme-primary-color);color:var(--theme-primary-font-color);}
.cxk-key svg{width:.54rem;height:.47rem;display:block;}

/* [DIGITFONT] Reference digit fonts hosted (user-approved 2026-10-23) but NOT bound since 2026-10-23 evening (user: digits looked bold / not reference-exact - the reference build itself never binds them either). @font-face kept for future use. The TTFs are
   digit-only subsets (0-9 . ,) - letters fall through to the system stack in the
   same declaration. EncodeBold (Encode Sans Narrow Bold) = jackpot digits via the
   vendor's own --jackpot-font-family hook + .cx-jackpot-value; Avenir (Avenir
   Black) = big balance amounts (.cx-bal-amount). Family names are CX-prefixed so
   they can never collide with a device-installed Avenir. */
@font-face { font-family: 'CXEncodeBold'; src: url('/static/fonts/EncodeBold.ttf') format('truetype'); font-display: swap; }
@font-face { font-family: 'CXAvenir'; src: url('/static/fonts/Avenir.ttf') format('truetype'); font-display: swap; }

/* [WIDGETHOME] Floating widgets home-only (user): hidden on every non-home
   route (html.cx-not-home set by clarims-ux.js [ROUTEFLAGS]). The back-to-top
   pill is not a .cfw-stack and stays available everywhere. */
html.cx-not-home .cfw-stack { display: none !important; }

/* [TOPGLOBAL] Back-to-top pill on every page (user: widgets home-only, pill
   everywhere). clarims-ux.js injects the pill (shell markup copied from
   index.html) on pages that do not carry it; these rules are the same pill
   styles index.html carries inline, so the injected pill looks identical. */
body > ul.cx-pillwrap { position: fixed; right: .1rem; bottom: 1.44rem; z-index: 98; margin: 0; padding: 0; list-style: none; }
.eXrL20vF3iraEnlWFolB{display:flex;flex-direction:column;align-items:flex-end;}
.eXrL20vF3iraEnlWFolB>.W5wOltFPsBN9TAwUaCKu{flex:none;width:100%;}
.eXrL20vF3iraEnlWFolB .GNQcsQFKCZ6OZnz0koI7.ctop{flex-direction:row !important;align-items:center;justify-content:center;width:max-content !important;min-height:0 !important;height:auto !important;padding:.08rem .16rem .08rem .12rem !important;gap:.06rem;background:rgba(12,12,16,.05) !important;border:1px solid rgba(255,255,255,.30) !important;border-radius:6px !important;box-shadow:none !important;transition:transform .15s ease-in-out,opacity .25s ease;}
.eXrL20vF3iraEnlWFolB .GNQcsQFKCZ6OZnz0koI7.ctop>div.O3CNG11LnQ4Zi24a5foN{background:var(--theme-primary-color) !important;width:.37rem !important;height:.37rem !important;margin:0 !important;color:#ffffff !important;flex:none;border-radius:50%;box-shadow:none !important;display:flex;align-items:center;justify-content:center;}
.eXrL20vF3iraEnlWFolB .GNQcsQFKCZ6OZnz0koI7.ctop i.O3CNG11LnQ4Zi24a5foN{background:none !important;box-shadow:none !important;border-radius:0 !important;margin:0 !important;}
.eXrL20vF3iraEnlWFolB .GNQcsQFKCZ6OZnz0koI7.ctop .st7heNSX8DboXn7n2IZO{color:#ffffff !important;font-size:.2rem !important;font-weight:700;text-transform:uppercase;line-height:1;}
.GNQcsQFKCZ6OZnz0koI7.ctop-put{transform:translateX(.7rem);opacity:.45 !important;}
@keyframes cxTopIn{0%{opacity:0;transform:scale3d(.3,.3,.3)}70%{opacity:1;transform:scale3d(1.1,1.1,1)}100%{opacity:1;transform:scale3d(1,1,1)}}
.GNQcsQFKCZ6OZnz0koI7.ctop-in{animation:cxTopIn .3s cubic-bezier(.08,.82,.17,1);}
.GNQcsQFKCZ6OZnz0koI7.ctop-out{opacity:0 !important;transform:scale3d(.3,.3,.3) !important;pointer-events:none !important;transition:transform .25s ease,opacity .25s ease !important;}
.eXrL20vF3iraEnlWFolB .GNQcsQFKCZ6OZnz0koI7.ctop:active{transform:scale(.88);}

/* [BALGAP] header balance: amount ki underline se thoda sa gap */
.currencyInfoBox .notranslate{text-underline-offset:.05rem}
/* [SCROLLFIX] vendor scrollbar thumb par koi transition nahi (hamari updates foran lagein) */
.my-scrollbar-bar .my-scrollbar-thumb{transition:none!important}

/* [CXAUTH] full-height login/register screens (reference layout, clarims
   theme). Vendor ka auth bundle ke andar band modal tha; ye screens ux
   layer ki hain aur purani APIs (/api/login/login, /api/register/register)
   ko hi call karti hain. Rang skin vars se: --theme-primary-color button/
   accents ke liye, usi ka soft mix dark card par link text ke liye. */
.cxauth{position:fixed;inset:0;z-index:1300;background:linear-gradient(180deg,#0d0e11 0%,#15161a 52%,#0f1013 100%);color:#f2f2f3;font-family:inherit}
.cxauth[hidden]{display:none}
.cxauth-scroll{position:absolute;inset:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:.28rem .3rem .5rem}
.cxauth-back{position:absolute;top:.3rem;left:.26rem;width:.6rem;height:.6rem;display:flex;align-items:center;justify-content:center;background:none;border:0;color:#e8e8ea;cursor:pointer;z-index:2}
.cxauth-back svg{width:.44rem;height:.44rem}
.cxauth-logo{display:block;margin:.18rem auto .3rem;max-height:.92rem;max-width:62%;object-fit:contain}
.cxauth-card{background:#1d1e23;border:1px solid rgba(255,255,255,.08);border-radius:.26rem;padding:.4rem .38rem .44rem;box-shadow:0 .18rem .5rem rgba(0,0,0,.45)}
.cxauth-banner{display:flex;align-items:center;gap:.18rem;background:linear-gradient(90deg,rgba(217,164,28,.13),rgba(217,164,28,.03) 55%,rgba(230,0,126,.05));border:1px solid rgba(255,255,255,.05);border-radius:.16rem;padding:.18rem .2rem;margin-bottom:.34rem}
.cxauth-banner-art{flex:0 0 auto;width:.78rem;height:.78rem;border-radius:50%;background:rgba(217,164,28,.14);display:flex;align-items:center;justify-content:center;color:#e7c65a}
.cxauth-banner-art svg{width:.48rem;height:.48rem}
.cxauth-banner-lines{flex:1;min-width:0}
.cxauth-banner-lines p{margin:0;font-size:.235rem;line-height:1.5;color:#d8d8db}
.cxauth-banner-lines b{color:var(--theme-primary-color);font-weight:700;white-space:nowrap}
.cxauth-banner-plane{flex:0 0 auto;color:rgba(255,255,255,.35)}
.cxauth-banner-plane svg{width:.52rem;height:.52rem;display:block}
.cxauth-tabs{display:flex;border-bottom:1px solid rgba(255,255,255,.09);margin-bottom:.3rem}
.cxauth-tab{flex:1;background:none;border:0;color:#9a9ba2;font-size:.32rem;font-weight:600;padding:.14rem 0 .18rem;cursor:pointer;position:relative;font-family:inherit}
.cxauth-tab.on{color:#fff}
.cxauth-tab.on:after{content:"";position:absolute;left:22%;right:22%;bottom:-1px;height:.045rem;border-radius:.03rem;background:var(--theme-primary-color)}
.cxauth-badge{position:absolute;top:-.1rem;right:calc(50% - .78rem);background:#21b573;color:#fff;font-size:.17rem;font-weight:700;line-height:1;padding:.05rem .1rem;border-radius:.16rem;white-space:nowrap}
.cxauth-head{font-size:.27rem;color:#e6e6e8;margin:0 0 .18rem;font-weight:600}
.cxauth-field{display:flex;align-items:center;background:#26272d;border:1px solid rgba(255,255,255,.1);border-radius:.14rem;height:.94rem;padding:0 .22rem;margin-bottom:.22rem;gap:.14rem}
.cxauth-field:focus-within{border-color:var(--theme-primary-color)}
.cxauth-field .ic{flex:0 0 auto;color:#8b8c94;display:flex}
.cxauth-field .ic svg{width:.34rem;height:.34rem}
.cxauth-field input{flex:1;min-width:0;background:none;border:0;outline:0;color:#f4f4f5;font-size:.29rem;height:100%;font-family:inherit}
.cxauth-field input::placeholder{color:#76777f}
.cxauth-cc{flex:0 0 auto;display:flex;align-items:center;gap:.12rem;color:#e8e8ea;font-size:.29rem;padding-right:.14rem;border-right:1px solid rgba(255,255,255,.14)}
.cxauth-cc svg{width:.36rem;height:.36rem;border-radius:50%}
.cxauth-eye{flex:0 0 auto;background:none;border:0;color:#8b8c94;cursor:pointer;padding:.06rem;display:flex}
.cxauth-eye svg{width:.38rem;height:.38rem}
.cxauth-modes{display:flex;gap:.5rem;margin:.02rem 0 .24rem}
.cxauth-mode{display:flex;align-items:center;gap:.12rem;background:none;border:0;color:#8f9096;font-size:.26rem;cursor:pointer;padding:0;font-family:inherit}
.cxauth-mode .dot{width:.3rem;height:.3rem;border-radius:50%;border:2px solid #5a5b63;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.cxauth-mode.on{color:#fff}
.cxauth-mode.on .dot{border-color:var(--theme-primary-color)}
.cxauth-mode.on .dot:after{content:"";width:.15rem;height:.15rem;border-radius:50%;background:var(--theme-primary-color)}
.cxauth-mode .mic{color:#8b8c94;display:flex}
.cxauth-mode .mic svg{width:.28rem;height:.28rem}
.cxauth-mode.on .mic{color:var(--theme-primary-color)}
.cxauth-strength{display:flex;align-items:center;gap:.12rem;margin:-.06rem 0 .2rem}
.cxauth-strength span{font-size:.25rem;color:#c9c9ce;margin-right:.06rem}
.cxauth-strength i{flex:0 0 .62rem;height:.09rem;border-radius:.05rem;background:#3a3b42}
.cxauth-strength i.on{background:var(--theme-primary-color)}
.cxauth-check{display:flex;gap:.14rem;align-items:flex-start;margin:.04rem 0 .3rem;cursor:pointer}
.cxauth-check .box{flex:0 0 auto;width:.36rem;height:.36rem;border-radius:.08rem;border:1.5px solid #5a5b63;display:flex;align-items:center;justify-content:center;color:#fff;margin-top:.01rem}
.cxauth-check .box svg{width:.26rem;height:.26rem;opacity:0}
.cxauth-check.on .box{background:#2fbf71;border-color:#2fbf71}
.cxauth-check.on .box svg{opacity:1}
.cxauth-check p{margin:0;font-size:.245rem;line-height:1.55;color:#c9c9ce}
.cxauth-check p b{color:var(--theme-primary-color);color:color-mix(in srgb,var(--theme-primary-color) 72%,#fff);font-weight:600}
.cxauth-submit{position:relative;width:100%;height:1.02rem;border:0;border-radius:.14rem;background:var(--theme-primary-color);color:var(--theme-primary-font-color);font-size:.33rem;font-weight:700;cursor:pointer;font-family:inherit}
.cxauth-submit[disabled]{opacity:.65}
.cxauth-links{display:flex;justify-content:space-between;margin-top:.26rem}
.cxauth-links button{background:none;border:0;color:var(--theme-primary-color);color:color-mix(in srgb,var(--theme-primary-color) 72%,#fff);font-size:.26rem;cursor:pointer;padding:0;font-family:inherit}
.cxauth-divider{display:flex;align-items:center;gap:.2rem;margin:.42rem 0 .3rem;color:#8f9096;font-size:.24rem}
.cxauth-divider:before,.cxauth-divider:after{content:"";flex:1;height:1px;background:rgba(255,255,255,.1)}
.cxauth-social{display:flex;justify-content:center;gap:.34rem}
.cxauth-soc{position:relative;width:.84rem;height:.84rem;border-radius:50%;border:0;cursor:pointer;display:flex;align-items:center;justify-content:center;font-family:inherit}
.cxauth-soc svg{width:.44rem;height:.44rem}
.cxauth-codenote{display:none;background:rgba(255,255,255,.05);border:1px dashed rgba(255,255,255,.16);border-radius:.14rem;padding:.24rem;font-size:.25rem;line-height:1.6;color:#c9c9ce;margin-bottom:.22rem}
.cxauth[data-method="code"] .cxauth-codenote{display:block}
.cxauth[data-method="code"] .cxauth-pwfields{display:none}

/* [CXAUTH2] reference metrics + blink animation + supplied assets (user
   2026-10-24): submit button aur fields ki font-size/weight/height bilkul
   reference platform jaisi (.ui-button/.ui-input: height .7rem, font .24rem,
   radius .14/.1rem); button ki blinking = reference keyframes (_scale-btn
   scale 1<->1.02 + _pulse-green shadow ring, dono 1.5s infinite) theme
   primary rang mein; header par supplied geometric background; icons user
   ke diye hue asal SVG (back/lock/123/eye-off/!) aur assets (PK flag, N,
   Google) */
.cxauth{isolation:isolate}
.cxauth::before{content:'';position:absolute;top:0;left:0;right:0;height:2.3rem;background:url(/static/mobile/images/auth/auth-header-bg.jpg) center top/cover no-repeat;opacity:.8;-webkit-mask-image:linear-gradient(#000 52%,transparent);mask-image:linear-gradient(#000 52%,transparent);z-index:0;pointer-events:none}
.cxauth-scroll{position:relative;z-index:1}
.cxauth-back svg{width:.15rem;height:.24rem}
.cxauth-field{height:.7rem;border-radius:.1rem;padding:0 .2rem}
.cxauth-field input{font-size:.24rem}
.cxauth-cc{font-size:.24rem}
.cxauth-cc .cxauth-flagimg{width:.4rem;height:.3rem;border-radius:.05rem;object-fit:cover;flex:0 0 auto}
.cxauth-field .ic svg{width:.3rem;height:.3rem}
.cxauth-eye svg{width:.36rem;height:.3rem}
.cxauth-mode .mic svg path{fill:#8b8c94}
.cxauth-mode.on .mic svg path{fill:#fff}
.cxauth-submit{height:.7rem;font-size:.24rem;font-weight:600;animation:cxauthScale 1.5s infinite}
.cxauth-submit::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;animation:cxauthPulse 1.5s infinite}
.cxauth-submit[disabled]{animation:none}
.cxauth-submit[disabled]::after{display:none}
@keyframes cxauthScale{0%{transform:scale(1)}50%{transform:scale(1.02)}100%{transform:scale(1)}}
@keyframes cxauthPulse{0%{box-shadow:0 0 0 0 var(--theme-primary-color)}70%{box-shadow:0 0 0 10px rgba(0,255,102,0)}100%{box-shadow:0 0 0 0 rgba(0,255,102,0)}}
.cxauth[data-method="code"] .cxauth-codenote{display:flex;gap:.14rem;align-items:flex-start}
.cxauth-noteico{flex:0 0 auto;width:.36rem;height:.36rem;border-radius:50%;background:rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center;margin-top:.02rem}
.cxauth-noteico svg{width:.2rem;height:.2rem}
.cxauth-soc img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}

/* [CXAUTH2 fix] modes single-line + banner gift asset */
.cxauth-modes{gap:.16rem}
.cxauth-mode{flex:1 1 0;min-width:0;white-space:nowrap;font-size:.24rem;gap:.09rem}
.cxauth-mode .mic svg{width:.26rem;height:.26rem}
.cxauth-banner-art{background:none;border-radius:0;width:.86rem;height:.86rem}
.cxauth-giftimg{width:100%;height:100%;object-fit:contain;display:block}

/* [AUTHSETUP] admin ki di hui banner image (gift+lines ki jagah) */
.cxauth-banner--img{padding:0;background:none;border:0}
.cxauth-bannerimg{width:100%;height:1.14rem;object-fit:cover;border-radius:.16rem;display:block}

/* [CXAUTH3] reference typography (tenant EntryLoginRegister chunk se asal
   sizes): tabs .26rem, form labels .26rem, modes .26rem, strength .22rem,
   checkbox/links .24rem, divider .22rem, banner lines .24rem */
.cxauth-tab{font-size:.26rem}
.cxauth-head{font-size:.26rem}
.cxauth-mode{font-size:.26rem}
.cxauth-strength span{font-size:.22rem}
.cxauth-check p{font-size:.24rem}
.cxauth-links button{font-size:.24rem}
.cxauth-divider{font-size:.22rem}
.cxauth-banner-lines p{font-size:.24rem}

/* [CXAUTH4] mode selector: radio dot khatam - reference ki tarah icon hi
   badge hai. Selected mode ka icon theme-primary gol ghare mein, label
   bhi primary rang mein; unselected saada gray icon + halka text. */
.cxauth-mode .dot{display:none}
.cxauth-mode{color:#d7d8dd}
.cxauth-mode .mic{width:.46rem;height:.46rem;border-radius:50%;background:rgba(255,255,255,.07);align-items:center;justify-content:center;color:#9a9ba3;flex:0 0 auto}
.cxauth-mode.on{color:var(--theme-primary-color)}
.cxauth-mode.on .mic{background:var(--theme-primary-color);color:var(--theme-primary-font-color)}
.cxauth-mode.on .mic svg path{fill:var(--theme-primary-font-color)}

/* [CXAUTH5] reference wali font family poori auth screens par (user ke
   font-inspector ke mutabiq: Helvetica stack), tabs ka weight 400,
   back icon chota */
#cxAuth{font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Helvetica,"Segoe UI",Arial,sans-serif}
#cxAuth input,#cxAuth button{font-family:inherit}
.cxauth-tab{font-weight:400}
.cxauth-tab--on{font-weight:400}
.cxauth-back svg{width:.21rem;height:.34rem}
.cxauth-soc img{transform:scale(1.12)}

/* [CXAUTH6] fields heading (Support Phone number/Email ...) reference ke
   inspector size par: 15px @ root 69px = .22rem, weight 400, lh 1.27 */
.cxauth-head{font-size:.22rem;font-weight:400;line-height:1.27}

/* [CXAUTH7] mode labels (Password Login / Code login) bhi fields heading
   walay size par: .22rem, weight 400 */
.cxauth-mode{font-size:.22rem;font-weight:400}

/* [CXAUTH8] strength bars ki height thodi zyada (user order): .09rem -> .13rem */
.cxauth-strength i{height:.13rem;border-radius:.07rem}

/* [CXAUTH9] back icon aur chota (user order): .34rem -> .26rem height */
.cxauth-back svg{width:.16rem;height:.26rem}

/* [CXAUTH10] header background (user ki bheji geometric image) logo ke
   peechay WAZEH: opacity 1, lamba strip, fade sirf neeche ke kinare par */
.cxauth::before{height:2.6rem;opacity:1;-webkit-mask-image:linear-gradient(#000 68%,transparent);mask-image:linear-gradient(#000 68%,transparent)}

/* [CXAUTH11/15] bara bold font SIRF masked (type=password) haalat mein -
   dots motay/baray; eye se show karne par text identity field jitna
   (.24rem normal) ho jata hai (user order) */
#cxAuth input[type="password"][data-pw],#cxAuth input[type="password"][data-pw2]{font-size:.3rem;font-weight:700;letter-spacing:.04rem}
#cxAuth input[type="password"][data-pw]::placeholder,#cxAuth input[type="password"][data-pw2]::placeholder{font-size:.24rem;font-weight:400;letter-spacing:normal}

/* [CXAUTH12] tab underline ki width kam (user order): full-width ki jagah
   center mein 1rem ki choti bar */
.cxauth-tab.on:after{left:50%;right:auto;width:1rem;transform:translateX(-50%)}

/* [CXAUTH14] underline har tab ke apne text ke hisaab se (user order):
   Login ki kam, Register ki zyada */
.cxauth-tab[data-tab="login"].on:after{width:.82rem}
.cxauth-tab[data-tab="register"].on:after{width:1.2rem}

/* [CXAUTH16] submit button ka font weight kam (user order): 600 -> 400 */
.cxauth-submit{font-weight:400}

/* [CXAUTH18] submit button line-height reference ke hisaab se 1.2
   (17px font par 20px) */
.cxauth-submit{line-height:1.2}

/* [CXAUTH19] tab switch slide effect (reference jaisa): purana form slide
   out, naya slide in - card ke andar hi clip hota hai */
.cxauth-animating{position:relative;overflow:hidden}
.cxauth-ghost{position:absolute;z-index:5;pointer-events:none;margin:0}
@keyframes cxOutL{to{transform:translateX(-104%)}}
@keyframes cxOutR{to{transform:translateX(104%)}}
@keyframes cxInL{from{transform:translateX(104%)}to{transform:translateX(0)}}
@keyframes cxInR{from{transform:translateX(-104%)}to{transform:translateX(0)}}
.cxauth-out-l{animation:cxOutL .32s ease-in-out both}
.cxauth-out-r{animation:cxOutR .32s ease-in-out both}
.cxauth-in-l{animation:cxInL .32s ease-in-out both}
.cxauth-in-r{animation:cxInR .32s ease-in-out both}

/* [CXAUTH20] form card ka shadow khatam (user order) */
.cxauth-card{box-shadow:none}

/* [CXAUTH22] mode badge: icon thora bara (.26->.32rem), circle ki
   padding kam (circle .46->.42rem) */
.cxauth-mode .mic{width:.42rem;height:.42rem}
.cxauth-mode .mic svg{width:.32rem;height:.32rem}

/* [CXAUTH23] checkbox ka green user ke diye hue color par: #1FE11F */
.cxauth-check.on .box{background:#1FE11F;border-color:#1FE11F}

/* [CXAUTH24] tab underline ki height thori kam (.07 -> .05rem) */
.cxauth-tab::after{height:.05rem}

/* [CXAUTH25] mode badge icon size thora kam (reference ke hisaab se)
   .32 -> .28rem */
.cxauth-mode .mic svg{width:.28rem;height:.28rem}

/* [CXAUTH26] Google/Facebook buttons ka size thora kam (.88 -> .78rem) */
.cxauth-soc{width:.78rem;height:.78rem}

/* [CXAUTH27] auth page khulne par right-to-left slide-in */
@keyframes cxPageIn{from{transform:translateX(100%)}to{transform:translateX(0)}}
.cxauth-enter{animation:cxPageIn .32s ease-out both}

/* [CXAUTH28] tab underline height minor aur kam (.05 -> .04rem) */
.cxauth-tab::after{height:.04rem}

/* [CXAUTH29] social buttons reference ke size par (tasveer se naapa:
   G circle = screen width ka 8.2%) .78 -> .62rem */
.cxauth-soc{width:.62rem;height:.62rem}

/* [CXAUTH30] error toast icon reference ke exact style par: bhara hua
   disc NAHI - sirf #ea4e3d rang ka glyph, .38rem box, safed circle bg */
.cx-toast--error .cx-toast__icon{width:.38rem;height:.38rem;background:transparent}
.cx-toast--error .cx-toast__icon svg{width:.38rem;height:.38rem}

/* [CXAUTH31] tab underline height reference se naap kar exact:
   reference bar = width ka 0.61%, hamara 0.79% tha -> .04 -> .03rem */
.cxauth-tab::after{height:.03rem}

/* ================= [DEPREF] deposit sheet - reference layout =================
   Dark sheet (auth screens jaisa), skin primary accents, saara data asal:
   channels API se, ladder admin ke system_recharge_gift se. */
.c4OAdQRIIRcVKzLNfX3p .ant-modal-content{background:#1d1e23;color:#ececf1}
.c4OAdQRIIRcVKzLNfX3p .ant-modal-header{background:transparent;border-bottom:1px solid #2e2e36!important}
.c4OAdQRIIRcVKzLNfX3p .RrZqs7JzsZkdc0Zi38V8{position:relative;text-align:center;color:#fff;font-size:.34rem;font-weight:600}
.c4OAdQRIIRcVKzLNfX3p .cx-dep-acts{position:absolute;right:.3rem;top:50%;transform:translateY(-50%);display:flex;gap:.26rem;align-items:center}
.c4OAdQRIIRcVKzLNfX3p .cx-dep-ic{color:#fff;display:flex}
.c4OAdQRIIRcVKzLNfX3p .cx-dep-ic svg{width:.35rem;height:.35rem} /* [ICONSIZE] ref icon/bar ratio .30 vs ours .38 -> .44rem x 0.79 */
.c4OAdQRIIRcVKzLNfX3p .globalTabsWrapper{display:none}
.c4OAdQRIIRcVKzLNfX3p .globalLine{display:none}
.c4OAdQRIIRcVKzLNfX3p .uKyP975BYTzKm22WhHCb{display:none}
.c4OAdQRIIRcVKzLNfX3p .bIfFIphSiWAweeD39Bmu{color:#fff;font-size:.28rem;font-weight:600}
#cx_dep_balance{display:flex;align-items:center;gap:.12rem;padding:.06rem .05rem .2rem;font-size:.27rem;color:#fff}
#cx_dep_balance .cx-db-flag{width:.42rem;height:.42rem;border-radius:50%;object-fit:cover}
#cx_dep_balance .cx-db-amt{font-weight:700;color:var(--theme-primary-color)}
#cx_dep_balance .cx-db-ref{margin-left:auto;color:#fff;display:flex}
#cx_dep_balance .cx-db-ref svg{width:.32rem;height:.34rem}
#deposit_tabs .ck-tab{font-size:.28rem}
#manual_channel_list{display:grid;grid-template-columns:1fr 1fr;gap:.18rem;padding:0;list-style:none;margin:0}
.cx-mcard{position:relative;display:flex;align-items:center;gap:.14rem;background:#26262c;border:1.5px solid #34343c;border-radius:.16rem;padding:.22rem .2rem;cursor:pointer;min-height:.98rem;box-sizing:border-box}
.cx-mcard img{width:.54rem;height:.54rem;border-radius:.1rem;object-fit:contain;background:#fff;flex:0 0 auto}
.cx-mcard-name{font-size:.27rem;color:#fff;margin:0;line-height:1.15}
.cx-mcard-sub{font-size:.2rem;color:#9a9aa5;margin:0}
.cx-mcard-check{display:none;position:absolute;right:.12rem;bottom:.1rem;color:var(--theme-primary-color)}
.cx-mcard-check svg{width:.3rem;height:auto;display:block}
.cx-mcard.tivA24cSEjfykc3h2PmN{border-color:var(--theme-primary-color)}
.cx-mcard.tivA24cSEjfykc3h2PmN .cx-mcard-check{display:block}
#select_pix{display:grid;grid-template-columns:repeat(4,1fr);gap:.16rem;padding:0;list-style:none;margin:0}
#select_pix li{position:relative;background:#26262c;border:1.5px solid #34343c;border-radius:.12rem;padding:.18rem 0 .14rem;text-align:center;cursor:pointer;box-sizing:border-box}
#select_pix li .money{font-size:.3rem;font-weight:600;color:#fff;text-align:center;width:100%}
#select_pix li.tivA24cSEjfykc3h2PmN{border-color:var(--theme-primary-color)}
#select_pix .tool-tips{display:none}
#select_pix ._ojhUxKWGyFdJIV2Lodx{display:none}
.cx-gift-sub{color:#f7b500;font-size:.22rem;margin-top:.05rem;text-align:center}
.c4OAdQRIIRcVKzLNfX3p .eB3l_JiD0MaOl9Fyxzk7 .ant-input-affix-wrapper{background:#26262c;border:1.5px solid #34343c;border-radius:.12rem;padding:.1rem .18rem}
.c4OAdQRIIRcVKzLNfX3p .eB3l_JiD0MaOl9Fyxzk7 .ant-input{background:transparent;color:#fff;font-size:.27rem}
.c4OAdQRIIRcVKzLNfX3p .uYhwAcPorC0IbdXe9xay{color:#fff;font-size:.26rem;font-weight:600}
#cx_dep_promo{display:flex;align-items:center;justify-content:space-between;gap:.2rem;background:#26262c;border-radius:.12rem;padding:.2rem .22rem;margin-top:.28rem}
#cx_dep_promo .cx-promo-l{display:flex;align-items:center;gap:.12rem;color:#f7b500;font-size:.26rem;font-weight:600}
#cx_dep_promo .cx-promo-l svg{width:.36rem;height:.36rem}
#cx_dep_promo .cx-promo-r{color:#9a9aa5;font-size:.22rem;text-align:right}
#cx_dep_event{display:flex;align-items:center;gap:.14rem;background:#26262c;border-radius:.12rem;padding:.2rem .22rem;margin-top:.18rem;color:#ff9a86;font-size:.24rem;line-height:1.35}
#cx_dep_event .cx-ev-ico{flex:0 0 auto;width:.34rem;height:.34rem;border-radius:50%;background:#f7b500;color:#1d1e23;font-weight:700;display:flex;align-items:center;justify-content:center;font-size:.24rem}
#manual_action .pgyoV_NNm7L6S53HAOWC{display:block}
#manual_proceed{width:100%;height:.68rem;border-radius:.14rem;font-family:-apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, "Segoe UI", Arial, Roboto, "PingFang SC", miui, "Hiragino Sans GB", "Microsoft Yahei", sans-serif;font-size:.225rem;font-weight:400;line-height:.28rem;background:var(--theme-primary-color);color:var(--theme-primary-font-color);border:0;cursor:pointer}
#manual_proceed.cx-off{background:#3a3a41;color:#fff}
.c4OAdQRIIRcVKzLNfX3p #crypto_action .ant-btn{width:100%;height:.68rem;border-radius:.14rem;font-family:-apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, "Segoe UI", Arial, Roboto, "PingFang SC", miui, "Hiragino Sans GB", "Microsoft Yahei", sans-serif;font-size:.225rem;font-weight:400;line-height:.28rem;background:var(--theme-primary-color);color:var(--theme-primary-font-color);border:0;cursor:pointer}
/* [BTNUNIFY] crypto Deposit Now = manual Deposit Now: same metrics + same off state */
.c4OAdQRIIRcVKzLNfX3p #crypto_action .ant-btn.cx-off{background:#3a3a41;color:#fff;pointer-events:none}
.c4OAdQRIIRcVKzLNfX3p #crypto_methods li{background:#26262c;border:1.5px solid #34343c;border-radius:.16rem}
#cx_dep_gate span{color:#e8e8ea}
#manual_expire_hint{color:#c9a24d}

/* [DEPREF2] vendor li widths + modal theme bg override */
.c4OAdQRIIRcVKzLNfX3p .ant-modal-content{background:#1d1e23!important}
#select_pix li{width:auto!important;min-width:0;display:block}
#manual_channel_list li{width:auto!important;min-width:0}
.cx-mcard{flex-direction:row;flex-wrap:wrap}
.cx-mcard-name{flex:1;text-align:center}
.cx-mcard-sub{width:100%;text-align:center;padding-left:.68rem;box-sizing:border-box}
.c4OAdQRIIRcVKzLNfX3p #crypto_methods li{width:auto!important}
.c4OAdQRIIRcVKzLNfX3p #crypto_methods ul{padding:0;list-style:none}

/* [DEPREF3] header band + card fills + input border + crypto rows */
.c4OAdQRIIRcVKzLNfX3p .ant-modal-header{background:#1d1e23!important}
.c4OAdQRIIRcVKzLNfX3p .ant-modal-title{background:transparent!important}
#manual_channel_list .cx-mcard{background:#26262c}
.c4OAdQRIIRcVKzLNfX3p .eB3l_JiD0MaOl9Fyxzk7 .ant-input{border:0!important;box-shadow:none!important}
.c4OAdQRIIRcVKzLNfX3p #crypto_methods ul{display:block;width:100%;box-sizing:border-box}
.c4OAdQRIIRcVKzLNfX3p #crypto_methods li{display:flex;align-items:center;width:100%;box-sizing:border-box;margin-bottom:.16rem;padding:.2rem .22rem}

/* [DEPREF4] method card target layout (logo left, name center) +
   header wali duplicate details link hide (promo bar mein mojood hai) */
#manual_channel_list .cx-mcard{flex-direction:row}
.c4OAdQRIIRcVKzLNfX3p .t2ii7DT7lea1duaxoXZd{display:none}

/* [DEPREF5] method cards reference-compact: chhoti row cards,
   sirf logo + name, select par primary border + name bhi primary */
#manual_channel_list .cx-mcard{min-height:.8rem;padding:.14rem .18rem;gap:.14rem;flex-wrap:nowrap}
.cx-mcard img{width:.46rem;height:.46rem}
.cx-mcard-name{flex:1;text-align:left;font-size:.26rem;font-weight:500}
.cx-mcard.tivA24cSEjfykc3h2PmN .cx-mcard-name{color:var(--theme-primary-color)}
#select_pix li{height:auto;min-height:1.04rem;margin:0}
#cx_dep_promo .cx-promo-l{white-space:nowrap;flex:0 0 auto}
#cx_dep_balance .cx-db-pill{display:inline-flex;align-items:center;gap:.12rem;border:1px solid #3d3d46;border-radius:999px;padding:.07rem .18rem;background:rgba(255,255,255,.04)}
#cx_dep_balance .cx-db-amt{color:#f7b500}
#cx_dep_balance .cx-db-ref{margin-left:0}
#rcDialogTitle2{font-family:-apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, "Segoe UI", Arial, Roboto, "PingFang SC", miui, "Hiragino Sans GB", "Microsoft Yahei", sans-serif;font-size:.323rem;font-weight:400;line-height:.955rem!important;color:#fff}
.cx-mcard-check{display:none!important}


/* [DEPREF6] header type/padding + packages band + crypto cards */
.c4OAdQRIIRcVKzLNfX3p .RrZqs7JzsZkdc0Zi38V8{font-size:.4rem;font-weight:700}
.c4OAdQRIIRcVKzLNfX3p .ant-modal-body{padding-left:.34rem;padding-right:.34rem}
#select_pix li{display:flex;flex-direction:column;align-items:stretch;padding:.16rem 0 0}
#select_pix li .money{font-weight:700;padding-bottom:.14rem}
#select_pix .cx-gift-sub{margin-top:auto;background:linear-gradient(180deg,rgba(247,181,0,.13),rgba(247,181,0,.30));color:#f7b500;font-weight:700;font-size:.24rem;padding:.07rem 0 .1rem;border-radius:0 0 .12rem .12rem}
.c4OAdQRIIRcVKzLNfX3p #crypto_methods li{padding:.24rem .22rem}
.c4OAdQRIIRcVKzLNfX3p #crypto_methods li.tivA24cSEjfykc3h2PmN{border-color:var(--theme-primary-color)}
.c4OAdQRIIRcVKzLNfX3p #crypto_methods li img{width:.56rem;height:.56rem;border-radius:.12rem;background:#fff;object-fit:contain}


/* [CKSTYLE] manual checkout page: auth-size back arrow, sprite copy
   icon buttons, bold expire countdown, full-width submit (Deposit Now
   match), method rows as dark cards like the deposit sheet */
.cx-ck-back{display:inline-flex;align-items:center;flex:0 0 auto}
.cx-ck-back svg{width:.15rem;height:.24rem;display:block}
#ck_methods li.ck-method{display:flex;align-items:center;box-sizing:border-box;background:#26262c;border:1.5px solid #34343c;border-radius:.16rem;padding:.2rem .22rem;margin-bottom:.16rem}
#ck_methods li.ck-method p{color:#fff;font-size:.26rem;margin:0}
#ck_methods li.ck-method.tivA24cSEjfykc3h2PmN{border-color:var(--theme-primary-color)}
#ck_methods li.ck-method.tivA24cSEjfykc3h2PmN p{color:var(--theme-primary-color)}
.ck-copy{background:transparent!important;border:0!important;box-shadow:none!important;color:var(--theme-primary-color)!important;padding:0 .06rem!important;height:auto!important;line-height:1!important;vertical-align:middle;cursor:pointer}
.ck-copy svg{width:.34rem;height:.34rem;display:block}
#ck_expire{font-size:.3rem!important;font-weight:800}
#ck_submit{width:100%!important;height:.68rem!important;border-radius:.14rem!important;font-family:-apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, "Segoe UI", Arial, Roboto, "PingFang SC", miui, "Hiragino Sans GB", "Microsoft Yahei", sans-serif;font-size:.225rem;font-weight:400;line-height:.28rem;background:var(--theme-primary-color);color:var(--theme-primary-font-color);border:0}

/* [CKUPLOAD] Manual checkout: themed payment-proof upload picker */
.cx-up{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.08rem;padding:.34rem .2rem;background:#26262c;border:1.5px dashed rgba(255,255,255,.35);border-radius:.16rem;cursor:pointer;text-align:center}
.cx-up svg{width:.52rem;height:.52rem;color:var(--theme-primary-color)}
.cx-up .cx-up-t{color:#fff;font-size:.26rem;font-weight:400}
.cx-up .cx-up-s{color:#9a9aa3;font-size:.22rem}
.cx-up.has-file{border-style:solid;border-color:var(--theme-primary-color)}
.cx-up-input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.cx-up #ck_proof_preview{max-width:100%;max-height:2.2rem;border-radius:.1rem;margin-top:.1rem;object-fit:contain}
/* [CKUPLOAD2] once a proof image is in, icon + texts leave the box: image only */
.cx-up.has-img svg,.cx-up.has-img .cx-up-t,.cx-up.has-img .cx-up-s{display:none}
.cx-up.has-img #ck_proof_preview{margin-top:0}
/* [DEPBACK] deposit sheet back chevron, auth-size glyph (.24rem tall) */
html[data-device="mobile"] body .c4OAdQRIIRcVKzLNfX3p .jfx5RvtUc1fSLoLZt8JG{width:.15rem;height:.24rem;transform:none;border:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 21.999 35.998'%3E%3Cpath d='M2209.279,137.564l-17.743-15.773a2.024,2.024,0,0,1-.271-.228,2.009,2.009,0,0,1,0-2.83,2.02,2.02,0,0,1,.274-.23l17.74-15.77a1.992,1.992,0,0,1,2.817,2.816l-16.422,14.6,16.422,14.6a1.992,1.992,0,0,1-2.817,2.817Z' transform='translate(-2190.681 -102.15)' fill='%23FFFFFF'/%3E%3C/svg%3E") center/contain no-repeat}
/* [HDRWHITE] header icons white, not theme color (user order 2026-10-24):
   deposit balance refresh + lobby shell-header refresh icon */
#headerWrap .anticon:not(.ant-dropdown-trigger){color:#fff}
/* [AUTHWHITE] auth back chevron pure white (was grey #ABAFBB) */
.cxauth-back svg path{fill:#fff}

/* [BACKUNIFY] back icon har page par aik hi: same chevron, .15rem x .24rem */
.cxauth-back svg{width:.15rem;height:.24rem}

/* [DEPPERFECT] Deposit page reference alignment (2026-10-24): input above chips, chips as two-zone cards, centered card names */
.c4OAdQRIIRcVKzLNfX3p .ok4RCdndQu2JV3GMn4VD{display:flex;flex-direction:column}
.c4OAdQRIIRcVKzLNfX3p .eB3l_JiD0MaOl9Fyxzk7{order:1;margin-bottom:.22rem}
.c4OAdQRIIRcVKzLNfX3p #select_pix{order:2}
.cx-mcard-name{flex:1;text-align:center}
.cx-mcard.tivA24cSEjfykc3h2PmN .cx-mcard-name{color:var(--theme-primary-color)}
#select_pix li{display:flex;flex-direction:column;padding:0;overflow:hidden}
#select_pix li>div:first-child{flex:1;display:flex;align-items:center;justify-content:center;width:100%;padding:.16rem 0 .12rem;box-sizing:border-box}
#select_pix .cx-gift-sub{margin-top:0;width:100%;box-sizing:border-box}

/* [DEPPAD2] Deposit sheet spacing matched to reference (PIL-measured) + slim balance pill */
.c4OAdQRIIRcVKzLNfX3p .ant-modal-body{padding-left:.35rem;padding-right:.35rem}
#manual_wrap{padding-left:0;padding-right:0}
.c4OAdQRIIRcVKzLNfX3p .SmkqAW7NJS55ddEjrHvA{padding-left:0;padding-right:0}
.c4OAdQRIIRcVKzLNfX3p .ApwjISqJuDYEGaCYaotN{padding-left:0;padding-right:0}
#manual_channel_list{gap:.2rem .28rem}
#manual_channel_list .cx-mcard{min-height:.9rem;padding:.16rem .18rem}
#select_pix{gap:.19rem;margin-top:.2rem}
#select_pix li>div:first-child{padding:.07rem .1rem}
#select_pix li{min-height:.76rem}
#select_pix .cx-gift-sub{padding:.03rem 0 .05rem;font-size:.21rem}
#cx_dep_promo{padding:.12rem .16rem}
#cx_dep_promo .cx-promo-r{white-space:nowrap;font-size:.2rem}
#cx_dep_event{padding:.14rem .16rem}
#cx_dep_balance .cx-db-pill{padding:.04rem .14rem}
#cx_dep_balance .cx-db-flag{width:.34rem;height:.34rem}
#cx_dep_balance .cx-db-amt{font-size:.25rem}
.c4OAdQRIIRcVKzLNfX3p .bIfFIphSiWAweeD39Bmu{font-size:.23rem;font-weight:700}

/* [DEPPAD3] vendor scroll-wrapper inset + tile margins + uniform chip height */
.c4OAdQRIIRcVKzLNfX3p .e8siic_ICXmLcAr12pgU{padding-left:0!important;padding-right:0!important}
#manual_channel_list li{margin:0}
#select_pix li{height:.79rem;min-height:.79rem}
#select_pix li>div:first-child{padding:.05rem .1rem}
#select_pix .cx-gift-sub{padding:.02rem 0 .04rem}

/* [DEPPAD4] vendor action-area wrapper inset */
.c4OAdQRIIRcVKzLNfX3p .pgyoV_NNm7L6S53HAOWC{padding-left:0!important;padding-right:0!important}

/* [DEPPAD5] micro-tweaks: slimmer cards, chip amount nudge, input amount border, heading spec, header symmetry, placeholder centering */
#manual_channel_list .cx-mcard{min-height:.8rem;padding:.09rem .18rem}
#select_pix li>div:first-child{overflow:hidden}
#select_pix .money{margin-top:.06rem}
#select_pix .cx-gift-sub{padding:.01rem 0 .03rem}
.c4OAdQRIIRcVKzLNfX3p .eB3l_JiD0MaOl9Fyxzk7{border:2px solid #34343c}
.c4OAdQRIIRcVKzLNfX3p .eB3l_JiD0MaOl9Fyxzk7.cx-amt-on{border-color:#0D6A0C}
#pix_money{line-height:1.2}
.c4OAdQRIIRcVKzLNfX3p .bIfFIphSiWAweeD39Bmu{font-family:-apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, "Segoe UI", Arial, Roboto, "PingFang SC", miui, "Hiragino Sans GB", "Microsoft Yahei", sans-serif;font-size:.253rem;color:#fff}
.c4OAdQRIIRcVKzLNfX3p .cx-dep-acts{right:0}

/* [DEPPAD5b] input text optical centering: Chrome input text renders ~5px low vs the Rs prefix; shift the input box up (visual only, no reflow) */
#pix_money{transform:translateY(-4px)}

/* [TITLEFIX] contain the 68px title line: the child box grows with it, header padding zeroed (line-height itself is the bar height) */
.c4OAdQRIIRcVKzLNfX3p .RrZqs7JzsZkdc0Zi38V8{line-height:.955rem}
.c4OAdQRIIRcVKzLNfX3p .ant-modal-header{padding-top:0!important;padding-bottom:0!important}

/* [TITLEFIX2] the visible title text lives in .RrZqs (28.5px/700 + fixed .5rem height) - apply the user spec THERE and contain the 68px line */
.c4OAdQRIIRcVKzLNfX3p .RrZqs7JzsZkdc0Zi38V8{font-family:-apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, "Segoe UI", Arial, Roboto, "PingFang SC", miui, "Hiragino Sans GB", "Microsoft Yahei", sans-serif;font-size:.323rem;font-weight:400;height:.955rem!important;align-items:center}

/* [BALWIDGET] deposit balance pill = home header widget (measured live): transparent, #18747E border, .2rem radius, gold underlined amount, 21px flag/refresh */
#cx_dep_balance .cx-db-pill{height:.39rem;padding:0 .084rem 0 .02rem;border:1px solid #18747E;border-radius:.2rem;background:transparent;gap:.06rem}
#cx_dep_balance .cx-db-flag{width:.3rem;height:.3rem}
#cx_dep_balance .cx-db-amt{font-size:.26rem;font-weight:400;color:#FFC320;text-decoration:underline}
#cx_dep_balance .cx-db-ref svg{width:.3rem;height:.3rem}

/* [BALSPIN] deposit refresh mirrors home header: Loading text (small), flag shifts left, icon spins fast until fetch ends (min 1s) */
#cx_dep_balance .cx-db-amt.cx-bal-loading{font-size:.8em!important;opacity:.75}
#cx_dep_balance .cx-db-flag{transition:transform .25s ease}
#cx_dep_balance .cx-db-flag.cx-flag-shift{transform:translateX(-.12rem)}

/* [BALWIDGET2] drawer + profile balance = home pill widget (same values as BALWIDGET) */
.cxd-balrow.cx-balbox{display:inline-flex;align-items:center;height:.39rem;padding:0 .084rem 0 .02rem;border:none;border-radius:.2rem;background:transparent;gap:.06rem}
.cxd-balrow.cx-balbox .cx-bal-amount{font-size:.26rem;font-weight:400;color:#FFC320;text-decoration:underline}
.cxd-balrow .cxd-refresh{font-size:.3rem;color:#fff;opacity:1}
.zNBPSCzdajG_MmdnE3M4.cx-balbox{display:inline-flex;align-items:center;height:.39rem;padding:0 .084rem 0 .02rem;border:none;border-radius:.2rem;background:transparent;gap:.06rem}
.zNBPSCzdajG_MmdnE3M4 .DVtYvd3TqiiaMxlpOdPG{display:none}
.zNBPSCzdajG_MmdnE3M4 section{display:flex;align-items:center;gap:.06rem}
.zNBPSCzdajG_MmdnE3M4 .cx-bal-amount{font-size:.26rem!important;font-weight:400;color:#FFC320;text-decoration:underline}
.zNBPSCzdajG_MmdnE3M4 .syncBalance svg{color:#fff!important}
.zNBPSCzdajG_MmdnE3M4.cx-balbox .cx-bal-amount.cx-bal-loading{font-size:.216rem!important}

/* [DEPPAD6] heading gap tighter; card icons slightly bigger + less vertical padding; unselected card border #2C2C2C */
#deposit_tabs{margin-bottom:.13rem}
.c4OAdQRIIRcVKzLNfX3p .SmkqAW7NJS55ddEjrHvA{margin-top:.11rem}
#manual_channel_list li.cx-mcard{min-height:.76rem;padding:.05rem .18rem}
#manual_channel_list li.cx-mcard img{width:.505rem;height:.505rem}
#manual_channel_list li.cx-mcard:not(.tivA24cSEjfykc3h2PmN){border-color:#2C2C2C}

/* [DEPPAD7] heading gap (forced), amount heading = payment heading size, input radius = card radius (.1rem), chip amount nudge down, hint-to-button gap, placeholder exact center */
#deposit_tabs{margin-bottom:.13rem!important}
.c4OAdQRIIRcVKzLNfX3p .SmkqAW7NJS55ddEjrHvA{margin-top:.11rem!important}
.c4OAdQRIIRcVKzLNfX3p .ApwjISqJuDYEGaCYaotN .bIfFIphSiWAweeD39Bmu{font-size:.253rem!important}
.c4OAdQRIIRcVKzLNfX3p .eB3l_JiD0MaOl9Fyxzk7{border-radius:.1rem;overflow:hidden}
#select_pix .money{margin-top:.1rem}
#manual_expire_hint{margin-bottom:.12rem}
#pix_money{transform:translateY(-6px)}

/* [DEPPAD8] channel cards hug the icon: near-zero vertical padding */
#manual_channel_list li.cx-mcard{min-height:.64rem;padding:.02rem .18rem}

/* [DEPPAD9] payment heading up a bit; small gap heading->cards; small gap cards->colored line (list bottom border) */
.c4OAdQRIIRcVKzLNfX3p .SmkqAW7NJS55ddEjrHvA{margin-top:.03rem!important}
#manual_channel_list{margin-top:.1rem;padding-bottom:.1rem}

/* [DEPPAD10] typed amount was centered with NO shift (measured 6.3px high at -6px): the -6px lift applies ONLY while the placeholder shows */
#pix_money{transform:none}
#pix_money:placeholder-shown{transform:translateY(-6px)}

/* [DEPPAD11] cards-to-line gap a bit more: list bottom padding .1rem -> .18rem */
#manual_channel_list{padding-bottom:.18rem}

/* [DEPPAD12] filled amount field: border a bit heavier than normal (2px -> 3px, green state) */
.c4OAdQRIIRcVKzLNfX3p .eB3l_JiD0MaOl9Fyxzk7.cx-amt-on{border-width:3px}

/* [DEPPAD13] expire hint: single line (second clause removed in window.html JS); smaller type to fit one line */
#manual_expire_hint{font-size:.17rem!important}

/* [PROMOREF] deposit promotion = reference build: gift ribbon tag + LT countdown badge + participated-events bar */
#cx_dep_promo{background:transparent;border-radius:0;padding:0;overflow:visible}
.cx-promo-tag{display:inline-flex;align-items:center;gap:.12rem;padding:.09rem .3rem .09rem .36rem;background:linear-gradient(90deg,#5d4718,#453414);border:1px solid rgba(209,167,96,.5);color:#fff;font-size:.26rem;font-weight:700;clip-path:polygon(.07rem 0,100% 0,100% 100%,.07rem 100%,0 87.5%,.07rem 75%,0 62.5%,.07rem 50%,0 37.5%,.07rem 25%,0 12.5%)}
.cx-promo-gift{width:.5rem;height:.5rem;object-fit:contain}
.cx-lt-badge{display:inline-flex;align-items:center;gap:.08rem;padding:.07rem .16rem;background:linear-gradient(180deg,#ef5340,#d63a28);border:1px solid rgba(255,255,255,.28);border-radius:.09rem;color:#fff}
.cx-lt-bolt{height:.3rem;width:auto}
.cx-lt-badge b{font-size:.23rem;font-style:italic}
#cx_lt_timer{font-size:.23rem;font-variant-numeric:tabular-nums;letter-spacing:.01rem}
#cx_dep_event{background:linear-gradient(90deg,#4a3a16,#3e3013);border:1px solid rgba(209,167,96,.4);color:#fff;cursor:pointer;justify-content:space-between}
.cx-ev-caret{color:#ce2d9e;font-size:.22rem;transition:transform .15s}
#cx_dep_event.cx-ev-open .cx-ev-caret{transform:rotate(180deg)}
#cx_dep_event_list{background:#26231a;border:1px solid rgba(209,167,96,.25);border-top:none;border-radius:0 0 .12rem .12rem;padding:.06rem .16rem}
.cx-ev-row{display:flex;justify-content:space-between;padding:.09rem 0;color:#e8e2d2;font-size:.23rem;border-bottom:1px solid rgba(255,255,255,.06)}
.cx-ev-row:last-child{border-bottom:none}
.cx-ev-row .cx-ev-gift{color:#f7b500;font-weight:600}
.cx-ev-row.cx-ev-on{color:#fff}
.cx-ev-row.cx-ev-on .cx-ev-gift{color:#ffd75e}
/* [DEPPAD14] hint text to Deposit button gap a bit more (9px -> ~14px) */
#manual_expire_hint{margin-bottom:.19rem}

/* [PROMOREF2] promo block matched to the reference ribbon spec: text 16px/600/lh 22px/#fff, compact icon + paddings (was oversized) */
.cx-promo-tag{font-size:.237rem;font-weight:600;line-height:.326rem;padding:.045rem .22rem .045rem .28rem;gap:.09rem}
.cx-promo-gift{width:.31rem;height:.31rem}
.cx-lt-badge{padding:.045rem .11rem;gap:.06rem;border-radius:.07rem}
.cx-lt-bolt{height:.24rem}
.cx-lt-badge b{font-size:.2rem}
#cx_lt_timer{font-size:.2rem}
#cx_dep_event{font-size:.222rem;padding:.11rem .16rem}
.cx-ev-caret{font-size:.19rem}
.cx-ev-row{font-size:.21rem}

/* [RSSTYLE] Rs prefix smaller + regular (was 21.4px/600 - heavier than the digits) */
.c4OAdQRIIRcVKzLNfX3p .eB3l_JiD0MaOl9Fyxzk7 .uYhwAcPorC0IbdXe9xay{font-size:.21rem;font-weight:400}
/* [NPAYNET] USDT network selector in the crypto tab */
#cx_net_row{margin-top:.16rem}
#cx_net_row .cx-net-label{display:block;font-size:.185rem;font-weight:700;color:#fff;margin-bottom:.1rem}
#cx_net_row .cx-net-list{display:flex;gap:.12rem}
#cx_net_row .cx-net{flex:1;height:.56rem;border-radius:.1rem;border:1px solid #45454E;background:#22242a;color:#cfcfd6;font-size:.19rem;cursor:pointer;padding:0}
#cx_net_row .cx-net.on{border-color:var(--theme-primary-color);color:var(--theme-primary-color)}
/* [NPAY] 'USDT' prefix is wider than 'Rs' and the vendor prefix sits ~5px left of the field edge, clipping the U; shift the prefix right inside the field. */
.c4OAdQRIIRcVKzLNfX3p .eB3l_JiD0MaOl9Fyxzk7 .uYhwAcPorC0IbdXe9xay{position:relative;left:.22rem;margin-right:.1rem}
/* [AMTCLEAR] vendor close-circle icon appears only when the field has an amount (.cx-amt-on), grey like the reference asset */
.c4OAdQRIIRcVKzLNfX3p .eB3l_JiD0MaOl9Fyxzk7 .ant-input-clear-icon{color:#757575;font-size:.3rem;cursor:pointer}
.c4OAdQRIIRcVKzLNfX3p .eB3l_JiD0MaOl9Fyxzk7.cx-amt-on .ant-input-clear-icon{visibility:visible!important}

/* [AMTCLEAR2] vendor suffix (clear/eye variants) permanently hidden in the amount field; our own clear button replaces it */
.c4OAdQRIIRcVKzLNfX3p .eB3l_JiD0MaOl9Fyxzk7{position:relative}
.c4OAdQRIIRcVKzLNfX3p .eB3l_JiD0MaOl9Fyxzk7 .ant-input-suffix{display:none!important}
.c4OAdQRIIRcVKzLNfX3p .eB3l_JiD0MaOl9Fyxzk7 .ant-input-affix-wrapper{padding-right:.55rem}
.cx-clear-x{display:none;position:absolute;right:.16rem;top:50%;transform:translateY(-50%);width:.34rem;height:.34rem;cursor:pointer;z-index:3}
.c4OAdQRIIRcVKzLNfX3p .eB3l_JiD0MaOl9Fyxzk7.cx-amt-on .cx-clear-x{display:block}
.cx-clear-x svg{width:100%;height:100%;display:block}

/* [LTREF] LT badge matched to the reference proportions (height ~0.79x of the ribbon, smaller bolt + timer type) */
.cx-lt-badge{padding:.03rem .09rem;gap:.05rem;border-radius:.06rem}
.cx-lt-bolt{height:.19rem}
.cx-lt-badge b{font-size:.175rem}
#cx_lt_timer{font-size:.175rem}

/* [ACTMODAL] activities modal (reference build) */
#cx_act_mask{position:fixed;inset:0;background:rgba(0,0,0,.65);z-index:2900}
#cx_act_modal{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:92%;max-width:6.4rem;background:#17181c;border:1px solid rgba(209,167,96,.45);border-radius:.16rem;z-index:3000;padding:.22rem .22rem .1rem;box-shadow:0 .1rem .4rem rgba(0,0,0,.5)}
.cx-act-head{display:flex;align-items:center;gap:.12rem;margin-bottom:.14rem;padding-right:.3rem}
.cx-act-dash{flex:1;border-top:1px dashed #55565e}
.cx-act-title{color:#9a9aa5;font-size:.2rem;text-align:center;white-space:nowrap}
.cx-act-close{position:absolute;top:.14rem;right:.18rem;color:#fff;font-size:.26rem;cursor:pointer;line-height:1}
#cx_act_list{max-height:52vh;overflow-y:auto}
.cx-act-row{display:flex;align-items:center;gap:.14rem;padding:.13rem 0;border-bottom:1px solid rgba(255,255,255,.05)}
.cx-act-row:last-child{border-bottom:none}
.cx-act-gift{width:.5rem;height:.5rem;object-fit:contain;filter:grayscale(1);opacity:.45}
.cx-act-row.done .cx-act-gift,.cx-act-row.soon .cx-act-gift{filter:none;opacity:1}
.cx-act-bonus{font-size:.23rem;font-weight:700;color:#7c7d85}
.cx-act-row.done .cx-act-bonus,.cx-act-row.soon .cx-act-bonus{color:#fff}
.cx-act-right{margin-left:auto;display:flex;flex-direction:column;align-items:flex-end;gap:.05rem}
.cx-act-cond{font-size:.21rem;color:#7c7d85;white-space:nowrap}
.cx-act-row.done .cx-act-cond,.cx-act-row.soon .cx-act-cond{color:#fff}
.cx-act-check{color:#2ecc71;font-weight:700}
.cx-act-tag{background:linear-gradient(180deg,#ef5340,#d63a28);color:#fff;font-size:.17rem;padding:.03rem .1rem;border-radius:.2rem;white-space:nowrap}
.cx-act-empty{color:#9a9aa5;font-size:.22rem;text-align:center;padding:.3rem 0}

/* [ACTDROP] activities panel is an in-flow DROPDOWN under the bar (user order - not a popup) */
#cx_act_modal{position:relative;left:auto;top:auto;transform:none;width:auto;max-width:none;margin-top:0;border-top:none;border-radius:0 0 .12rem .12rem;box-shadow:none;z-index:auto}
#cx_dep_event.cx-ev-open{border-radius:.12rem .12rem 0 0}

/* [ACTDROP2] no close icon in the dropdown (bar toggles it); bigger green tick */
.cx-act-head{padding-right:0}
.cx-act-check{font-size:.34rem;line-height:1}

/* [CARET] dropdown caret = user-supplied arrow glyph, colour follows the active theme */
.cx-ev-caret{color:var(--theme-primary-color);font-size:0;line-height:0}
.cx-ev-caret svg{width:.21rem;height:auto;display:block}

/* [ACTDROP3] dropdown yellowish tone toned down: just a bit lighter than the sheet #1D1E23, warm hint only */
#cx_dep_event{background:linear-gradient(90deg,#2c2a1e,#25231b)}
#cx_act_modal{background:#22211a}

/* [LINECOLOR] deposit sheet horizontal divider lines = #2C2C2C (were theme teal #18747E / near-greys) */
.c4OAdQRIIRcVKzLNfX3p .globalTabsWrapper{border-bottom-color:#2C2C2C}
.c4OAdQRIIRcVKzLNfX3p #deposit_tabs{border-bottom-color:#2C2C2C}
.c4OAdQRIIRcVKzLNfX3p #manual_channel_list{border-bottom-color:#2C2C2C}
.c4OAdQRIIRcVKzLNfX3p .ant-modal-header{border-bottom-color:#2C2C2C!important}
.c4OAdQRIIRcVKzLNfX3p .cx-act-row{border-bottom-color:#2C2C2C}
.c4OAdQRIIRcVKzLNfX3p .e8siic_ICXmLcAr12pgU > div:not([class]):not([id]){border-bottom-color:#2C2C2C}

/* [LINECOLOR2] remaining teal dividers: empty-class section divider div + vendor list twins */
.c4OAdQRIIRcVKzLNfX3p .e8siic_ICXmLcAr12pgU > div[class=""]{border-bottom-color:#2C2C2C}
.c4OAdQRIIRcVKzLNfX3p ul.CJ8dBGR3Ac2Lugo_wuSA{border-bottom-color:#2C2C2C}
.c4OAdQRIIRcVKzLNfX3p ul.qlHv4PpCNi4nGFQLaRq0{border-bottom-color:#2C2C2C}

/* [LINECOLOR3] section divider div: force the line colour (vendor rule/inline wins otherwise) */
.c4OAdQRIIRcVKzLNfX3p .e8siic_ICXmLcAr12pgU > div{border-bottom-color:#2C2C2C!important}

/* [DEPPAD6b] unselected channel border a bit more visible than #2C2C2C (blended into the card bg) */
#manual_channel_list li.cx-mcard:not(.tivA24cSEjfykc3h2PmN){border-color:#3A3A3A}

/* [VISIBLE2] lines + neutral borders one step more visible (user order) */
.c4OAdQRIIRcVKzLNfX3p .globalTabsWrapper{border-bottom-color:#3A3A3A}
.c4OAdQRIIRcVKzLNfX3p #deposit_tabs{border-bottom-color:#3A3A3A}
.c4OAdQRIIRcVKzLNfX3p #manual_channel_list{border-bottom-color:#3A3A3A}
.c4OAdQRIIRcVKzLNfX3p .ant-modal-header{border-bottom-color:#3A3A3A!important}
.c4OAdQRIIRcVKzLNfX3p .cx-act-row{border-bottom-color:#3A3A3A}
.c4OAdQRIIRcVKzLNfX3p .e8siic_ICXmLcAr12pgU > div{border-bottom-color:#3A3A3A!important}
#manual_channel_list li.cx-mcard:not(.tivA24cSEjfykc3h2PmN){border-color:#484848}
#select_pix li{border-color:#45454E}
.c4OAdQRIIRcVKzLNfX3p .eB3l_JiD0MaOl9Fyxzk7{border-color:#45454E}

/* [LTSTYLE] LT badge = reference two-segment build: red block (bolt + LT, white) + near-black block (timer in red) */
.cx-lt-badge{display:inline-flex;align-items:stretch;padding:0;background:transparent;border:none;border-radius:.05rem;overflow:hidden;gap:0;line-height:1}
.cx-lt-l{display:inline-flex;align-items:center;gap:.045rem;background:#EA4C3D;padding:.03rem .075rem}
.cx-lt-l b{font-style:italic;font-weight:700;color:#fff;font-size:.175rem;line-height:1}
.cx-lt-bolt{height:.185rem;width:auto}
.cx-lt-t{display:inline-flex;align-items:center;background:#161616;border:1px solid rgba(234,76,61,.6);border-left:none;color:#EA4C3D;font-size:.165rem;padding:.03rem .08rem;line-height:1;font-variant-numeric:tabular-nums}

/* [BALGAP2] a little air between the header divider line and the Balance row (was 0 / pill 4.8px under the line) */
#cx_dep_balance{padding-top:.16rem}
/* [GWTILE2] gateway tiles: same grid + row layout as the manual method tiles (the old crypto li rules stacked icon over title) */
.c4OAdQRIIRcVKzLNfX3p #crypto_methods ul#cx_gw_list{display:grid!important;grid-template-columns:1fr 1fr;gap:.2rem .28rem;padding:0;list-style:none;margin:0}
.c4OAdQRIIRcVKzLNfX3p #cx_gw_list li{width:auto!important;min-width:0;margin:0}
.c4OAdQRIIRcVKzLNfX3p #cx_gw_list li.cx-mcard{flex-direction:row!important;justify-content:flex-start!important;text-align:left;min-height:.76rem;padding:.05rem .18rem;gap:.14rem;flex-wrap:nowrap}
.c4OAdQRIIRcVKzLNfX3p #cx_gw_list li.cx-mcard img{width:.505rem;height:.505rem}
.c4OAdQRIIRcVKzLNfX3p #cx_gw_list li.cx-mcard:not(.tivA24cSEjfykc3h2PmN){border-color:#2C2C2C}

/* [PREFIXPAD2] USDT mode: gap between the wide prefix and the typed value/placeholder */
.c4OAdQRIIRcVKzLNfX3p:has(.ck-tab[data-tab="crypto"].ck-on) .eB3l_JiD0MaOl9Fyxzk7 .ant-input{padding-left:.88rem!important}
/* [CFMBTN] withdraw Confirm = Deposit Now design (user order) */
#submit-withdraw{width:100%;height:.68rem;border-radius:.14rem;font-family:-apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, "Segoe UI", Arial, Roboto, "PingFang SC", miui, "Hiragino Sans GB", "Microsoft Yahei", sans-serif;font-size:.225rem;font-weight:400;line-height:.28rem;background:var(--theme-primary-color);color:var(--theme-primary-font-color);border:0;cursor:pointer}
/* [WDHDR] withdraw header: support icon at the right of the tab bar, theme-coloured */
.globalTabsWrapper{position:relative}
.globalTabsWrapper .my-scrollbar{padding-right:.72rem}
.cx-wd-support{position:absolute;right:0;top:0;height:.71rem;display:inline-flex;align-items:center;color:var(--theme-primary-color);z-index:5;background:#054146;padding:0 .28rem 0 .1rem}
.cx-wd-support svg{width:.44rem;height:.44rem;display:block}
/* [WDACC] receiving accounts: header, add rows, PIN gate, add-form warning */
.cx-rcv-head{display:flex;align-items:center;justify-content:space-between;padding:.06rem .04rem .14rem}
.cx-rcv-title{color:#fff;font-size:.27rem;font-weight:600;margin:0}
.cx-rcv-count{color:var(--theme-primary-color);font-weight:400}
.cx-rcv-refresh{color:var(--theme-primary-color);font-size:.36rem;display:inline-flex;align-items:center}
.cx-rcv-add .bt8Qm2mbpyp1pxsxoxK2 a{color:var(--theme-primary-color)}
.cx-rcv-add .bt8Qm2mbpyp1pxsxoxK2 i{transform:rotate(180deg);color:var(--theme-primary-color)}
#cxWdPinGate{position:fixed;left:0;top:0;right:0;bottom:0;z-index:6500}
#cxWdPinGate .cx-wdp-mask{position:absolute;left:0;top:0;right:0;bottom:0;background:rgba(0,0,0,.55)}
#cxWdPinGate .cx-wdp-card{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);width:5.9rem;max-width:92vw;background:var(--theme-main-bg-color);border:1px solid rgba(255,255,255,.14);border-radius:.24rem;padding:.42rem .38rem .4rem;box-sizing:border-box}
.cx-wdp-title{text-align:center;color:#fff;font-size:.31rem;font-weight:600;margin-bottom:.34rem}
.cx-wdp-labelrow{display:flex;align-items:center;justify-content:space-between;color:#fff;font-size:.24rem;margin-bottom:.16rem}
.cx-wdp-eye{color:rgba(255,255,255,.65);font-size:.34rem;display:inline-flex;cursor:pointer}
.cx-wdp-boxes{position:relative;display:flex;gap:.1rem}
.cx-wdp-box{flex:1;height:.8rem;border:1.5px solid rgba(255,255,255,.35);border-radius:.12rem;display:flex;align-items:center;justify-content:center;font-size:.36rem;color:#fff;background:rgba(255,255,255,.05)}
.cx-wdp-box.cx-on{border-color:var(--theme-primary-color)}
#cx_wd_pin{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;border:0;background:transparent;color:transparent;caret-color:transparent;font-size:.3rem}
.cx-wdp-hintrow{display:flex;justify-content:space-between;gap:.2rem;margin:.22rem 0 .3rem}
.cx-wdp-hint{color:rgba(255,255,255,.75);font-size:.2rem;line-height:1.5;max-width:3.6rem}
.cx-wdp-forgot{color:var(--theme-primary-color);font-size:.21rem;text-align:right;white-space:nowrap}
.cx-wdp-next{width:100%;height:.68rem;border-radius:.14rem;border:0;background:var(--theme-primary-color);color:var(--theme-primary-font-color);font-size:.225rem;cursor:pointer}
.cx-wdp-next.cx-off{background:#3a3a41;color:#fff}
.cx-wdp-close{position:absolute;right:.22rem;top:.2rem;color:rgba(255,255,255,.75);font-size:.26rem;cursor:pointer;display:inline-flex}
.cx-wd-warn{color:#FF9F43;font-size:.2rem;line-height:1.5;margin:0 0 .18rem}
/* [WDACC2] receiving pane: blocks stack at the top (vendor used space-between, pushing Add rows to the bottom) */
#addAccount .gAqFfPzhhn8cpRlTbQTg{justify-content:flex-start}
/* [WDACC3] PIN gate professional: segmented strip like the withdraw form + polished card */
@keyframes cxWdpIn{from{opacity:0;transform:translate(-50%,-48%) scale(.96)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
#cxWdPinGate .cx-wdp-mask{background:rgba(0,0,0,.6);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
#cxWdPinGate .cx-wdp-card{top:42%;border-radius:.28rem;border:1px solid rgba(255,255,255,.15);box-shadow:0 .16rem .6rem rgba(0,0,0,.6);padding:.44rem .4rem .42rem;animation:cxWdpIn .22s ease both}
.cx-wdp-title{font-size:.32rem;margin-bottom:.36rem}
.cx-wdp-boxes{display:flex;gap:0;border:1.5px solid var(--theme-color-line, rgba(255,255,255,.28));border-radius:.14rem;overflow:hidden;background:rgba(255,255,255,.04)}
.cx-wdp-box{flex:1;height:.82rem;border:0;border-radius:0;background:transparent;display:flex;align-items:center;justify-content:center;font-size:.34rem;color:#fff;position:relative}
.cx-wdp-box + .cx-wdp-box{border-left:1px solid var(--theme-color-line, rgba(255,255,255,.22))}
.cx-wdp-box.cx-on{box-shadow:inset 0 0 0 1.5px var(--theme-primary-color)}
.cx-wdp-box.cx-on:empty::after{content:"";width:2px;height:.38rem;background:var(--theme-primary-color);animation:cxWdpBlink 1s steps(1) infinite}
@keyframes cxWdpBlink{50%{opacity:0}}
.cx-wdp-dot{width:.13rem;height:.13rem;border-radius:50%;background:#fff;display:block}
.cx-wdp-next{height:.7rem}
/* [WDACC4] shared PIN keypad rides above the gate popup when the gate summons it */
#cxKbd.cx-above{z-index:6800}
/* [WDACC5] gate popup matched to the users reference video: top-anchored wide card (same width as the keypad), Next always active, circled X below the card, active-cell ring only while entering */
@keyframes cxWdpIn{from{opacity:0;transform:translate(-50%,-.12rem)}to{opacity:1;transform:translate(-50%,0)}}
#cxWdPinGate .cx-wdp-card{top:.3rem;transform:translate(-50%,0);width:7.24rem;max-width:calc(100vw - .26rem);animation:cxWdpIn .22s ease both}
.cx-wdp-next.cx-off{background:var(--theme-primary-color);color:var(--theme-primary-font-color)}
.cx-wdp-close{right:auto;top:calc(100% + .24rem);left:50%;transform:translateX(-50%);width:.56rem;height:.56rem;border:1.5px solid rgba(255,255,255,.85);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.24rem}
.cx-wdp-close svg{width:.22rem;height:.22rem;display:block}
.cx-wdp-box.cx-on{box-shadow:none}
.cx-wdp-box.cx-on:empty::after{content:none}
#cxWdPinGate.cx-kbd-open .cx-wdp-box.cx-on{box-shadow:inset 0 0 0 1.5px var(--theme-primary-color)}
#cxWdPinGate.cx-kbd-open .cx-wdp-box.cx-on:empty::after{content:"";width:2px;height:.38rem;background:var(--theme-primary-color);animation:cxWdpBlink 1s steps(1) infinite}
#cxWdPinGate .cx-wdp-boxes:focus-within .cx-wdp-box.cx-on{box-shadow:inset 0 0 0 1.5px var(--theme-primary-color)}
/* [WDACC6] pixel pass from the reference popup measurements (ratios of card width): radius, rhythm, sizes */
#cxWdPinGate .cx-wdp-card{border-radius:.24rem;padding:.34rem .31rem .36rem}
.cx-wdp-title{font-size:.34rem;font-weight:600;margin-bottom:.5rem}
.cx-wdp-labelrow{font-size:.25rem;font-weight:500;margin-bottom:.28rem}
.cx-wdp-boxes{border-radius:.15rem}
.cx-wdp-box{height:1rem;font-size:.36rem}
.cx-wdp-hintrow{margin:.24rem 0 .34rem}
.cx-wdp-hint{font-size:.21rem;line-height:1.5;max-width:none}
.cx-wdp-forgot{font-size:.22rem;font-weight:500}
.cx-wdp-next{height:.8rem;border-radius:.15rem;font-size:.24rem}
/* [WDACC7] user order: the gate popup is vertically centered again (X below the card follows it) */
@keyframes cxWdpIn{from{opacity:0;transform:translate(-50%,-50%) scale(.97)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
#cxWdPinGate .cx-wdp-card{top:50%;transform:translate(-50%,-50%)}
/* [WDACC9] close = the users supplied ui-close glyph (full ring+X in one SVG); the button no longer draws its own border */
.cx-wdp-close{border:0}
.cx-wdp-close svg{width:.56rem;height:.56rem}
/* [WDACC10] active-cell ring: weight 1px, and the first/last cells take the strip corner radius so the ring follows the rounded corners */
#cxWdPinGate.cx-kbd-open .cx-wdp-box.cx-on{box-shadow:inset 0 0 0 1px var(--theme-primary-color)}
#cxWdPinGate .cx-wdp-boxes:focus-within .cx-wdp-box.cx-on{box-shadow:inset 0 0 0 1px var(--theme-primary-color)}
.cx-wdp-boxes>.cx-wdp-box:first-of-type{border-radius:.13rem 0 0 .13rem}
.cx-wdp-boxes>.cx-wdp-box:last-of-type{border-radius:0 .13rem .13rem 0}
/* [WDACC11] gate title font = the users pasted reference computed style: Helvetica system stack, 21px -> .31rem, weight 400, line-height 32/21 */
.cx-wdp-title{font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Helvetica,"Segoe UI",Arial,Roboto,"PingFang SC",miui,"Hiragino Sans GB","Microsoft Yahei",sans-serif;font-size:.31rem;font-weight:400;line-height:1.52}
/* [WDACC12] add-account modal: vendor top-right X hidden; the users ui-close glyph hangs below the card like the PIN gate */
#addWithdrawAccount .ant-modal-close{display:none}
.cx-modal-close-b{position:absolute;top:calc(100% + .24rem);left:50%;transform:translateX(-50%);width:.56rem;height:.56rem;cursor:pointer;z-index:10;display:block}
.cx-modal-close-b svg{width:.56rem;height:.56rem;display:block}
/* [WDACC13] add-account modal title font = the users pasted reference style (same spec as the gate title) */
#addWithdrawAccount .ant-modal-title{font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Helvetica,"Segoe UI",Arial,Roboto,"PingFang SC",miui,"Hiragino Sans GB","Microsoft Yahei",sans-serif;font-size:.31rem;font-weight:400;line-height:1.52;color:#fff}
/* [WDACC17] breathing room between the brand logo and the number fields placeholder/typed text */
#addWithdrawAccount .base-form-item-account .ant-input-prefix{margin-right:.14rem}
/* [WDACC18] the affix prefix is absolutely positioned, so the logo/text gap lives in the inputs padding-left (the WDACC17 prefix margin could not move the text) */
#addWithdrawAccount .base-form-item-account input#pix_account{padding-left:.78rem!important}
/* [WDACC19] gate PIN error line + shake on a wrong PIN */
.cx-wdp-err{display:none;color:#EA4E3D;font-size:.2rem;margin:-.16rem 0 .18rem}
.cx-wdp-boxes.cx-shake{animation:cxShake .4s ease}
@keyframes cxShake{0%,100%{transform:translateX(0)}20%{transform:translateX(-.09rem)}40%{transform:translateX(.09rem)}60%{transform:translateX(-.06rem)}80%{transform:translateX(.06rem)}}
/* [WDACC20] withdraw amount: clear gap between the Rs prefix and the amount text/placeholder */
#withdraw_Cashapp_money{padding-left:.68rem!important}
/* [WDACC22] withdraw sub-nav (Regular Cashout / USDT) removed per user order - the Regular form is the only view */
#withdraw #listUlId{display:none!important}
/* [WDACC24] receiving page like the reference: title+refresh left, eye toggle right; numbers masked until the eye opens them; copy icon only when open */
.cx-rcv-head{justify-content:flex-start!important;gap:.14rem}
.cx-rcv-refresh{font-size:.3rem}
.cx-rcv-eye{margin-left:auto;color:#fff;font-size:.36rem;display:inline-flex;align-items:center}
#addAccount .PmwtECGo9wfGBMP0uy71{display:none!important}
#addAccount.cx-eye-open .PmwtECGo9wfGBMP0uy71{display:inline-flex!important}
/* [WDACC25] withdraw-page balance = the drawer widget: loading size + flag shift + amount centering (the lobby keeps these in page-local styles) */
#withdraw .cx-bal-amount{display:inline-flex;align-items:center;height:.3rem;transform:translateY(.021rem)}
#withdraw .cx-bal-amount.cx-bal-loading{font-size:.216rem!important;opacity:.75;transform:none}
#withdraw .cx-flagwrap{transition:transform .25s ease}
#withdraw .cx-flagwrap.cx-flag-shift{transform:translateX(-.12rem)}
/* [WDACC27] Withdrawal Records table: responsive + professional (deposit-records family). The vendor colgroup was fixed rem widths totalling 7.8rem - wider than the phone - so the Status column clipped off-screen; columns are percentages now and cells wrap instead of clipping. */
#withdrawList .ant-table-wrapper{margin:.18rem .12rem 0}
#withdrawList table{width:100%!important}
#withdrawList .ant-table-thead th{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;text-align:left!important;font-size:.23rem;font-weight:600;color:#fff;padding:.12rem .06rem!important;border-bottom:thin solid var(--theme-color-line)}
#withdrawList .ant-table-tbody td{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;word-break:break-word;text-align:left!important;font-size:.22rem;color:#fff;padding:.16rem .06rem!important;border-bottom:1px solid #3A3A3A;vertical-align:top}
#withdrawList .ant-table-tbody tr.cx-wrec-row{transition:background .15s}
#withdrawList .ant-table-tbody tr.cx-wrec-row:active{background:rgba(255,255,255,.05)}
/* [WDACC29] saque back chevron = the house standard size, same as Deposit Records (.15rem x .24rem) - the vendor sprite icon was sized by inherited 1em */
.Xoao1azDlzGxhjfesuwG svg{width:.15rem!important;height:.24rem!important}
/* [WDACC30] saque header tab labels: the user-supplied reference styling - Helvetica stack, 17px (.252rem), weight 400, tight 14px (.208rem) leading, white */
.globalTabsWrapper .common-tab-item{font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Helvetica,"Segoe UI",Arial,Roboto,"PingFang SC",miui,"Hiragino Sans GB","Microsoft Yahei",sans-serif!important;font-size:.252rem!important;font-weight:400!important;line-height:.208rem!important;color:#fff!important}
.globalTabsWrapper .common-tab-item span{font-family:inherit!important;font-size:inherit!important;font-weight:inherit!important;line-height:inherit!important;color:inherit!important}
/* [WDACC32] saque header tabs: all three must fit beside the support icon - the vendor item padding (.2rem) + margin (.3rem) overflowed the strip and clipped Withdrawal Records */
.globalTabsWrapper .common-tab-item{padding:0 .05rem!important;margin-right:.16rem!important}
.globalTabsWrapper .common-tab-item:last-child{margin-right:0!important}
/* [WDACC37] saque header height = the deposit sheet header (.955rem): the tab row, tabs, back button and support icon all take the full height, content centred - a little breathing room top and bottom */
.globalTabsWrapper .oI1REZeHrjT3mJsfCKtR{height:.955rem!important;align-items:center!important}
.globalTabsWrapper .common-tab-item{height:.955rem!important}
.globalTabsWrapper .Xoao1azDlzGxhjfesuwG{height:.955rem;display:flex;align-items:center}
.cx-wd-support{height:.955rem}
/* [WDACC38] deposit sheet back icon: properly centred vertically in the header (the vendor top:.24rem left it sitting high with dead space below) */
html[data-device="mobile"] body .c4OAdQRIIRcVKzLNfX3p .jfx5RvtUc1fSLoLZt8JG{top:.36rem;transform:none}