/* =========================================================
   NEXA WEALTH V4 — GLOBAL PREMIUM SYSTEM
   Final override layer for every rendered user/admin page.
   ========================================================= */
:root{
  --v4-bg:#03070a;
  --v4-bg-2:#071017;
  --v4-surface:rgba(12,22,30,.92);
  --v4-surface-soft:rgba(255,255,255,.045);
  --v4-line:rgba(255,255,255,.085);
  --v4-line-strong:rgba(104,242,165,.22);
  --v4-text:#f7fafb;
  --v4-muted:#8d9aa4;
  --v4-green:#68f2a5;
  --v4-green-2:#2ecc71;
  --v4-gold:#f2cb68;
  --v4-blue:#76bfff;
  --v4-red:#ff747d;
  --v4-radius:22px;
  --v4-radius-sm:15px;
  --v4-shadow:0 24px 74px rgba(0,0,0,.34);
  --v4-dock-h:72px;
  --v4-ease:cubic-bezier(.16,1,.3,1);
}
html{background:var(--v4-bg)!important;scroll-behavior:smooth;-webkit-text-size-adjust:100%;color-scheme:dark}
html,body{width:100%;max-width:100%!important;min-height:100%;overflow-x:hidden!important}
body{
  max-width:none!important;margin:0!important;padding-left:0!important;padding-right:0!important;
  padding-bottom:calc(var(--v4-dock-h) + 34px + env(safe-area-inset-bottom))!important;
  background:
    radial-gradient(900px 560px at -8% -12%,rgba(46,204,113,.14),transparent 58%),
    radial-gradient(760px 520px at 108% 4%,rgba(242,203,104,.075),transparent 60%),
    linear-gradient(180deg,#071019 0%,#04090d 48%,#020507 100%)!important;
  color:var(--v4-text)!important;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif!important;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.2;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:46px 46px;mask-image:linear-gradient(to bottom,#000,transparent 78%)}
*{box-sizing:border-box}
img,video,canvas,svg{max-width:100%;height:auto}
a,button,input,select,textarea{-webkit-tap-highlight-color:transparent}

/* Universal page width: neutralizes old 480/600px body locks. */
body:not(.nx-auth-page) > .container,
body:not(.nx-auth-page) > main,
body:not(.nx-auth-page) > .content,
body:not(.nx-auth-page) > .main-content,
body:not(.nx-auth-page) > .wrapper,
body:not(.nx-auth-page) > section,
body:not(.nx-auth-page) .nx-shell{
  width:min(1180px,calc(100% - 28px))!important;max-width:1180px!important;margin-left:auto!important;margin-right:auto!important;
}
.container,.content,.main-content,.wrapper{box-sizing:border-box}

/* Top bars */
.header-flex,.topbar,.navbar,.nexa-header,body>header:not(.modal-header){
  width:min(1180px,calc(100% - 28px))!important;max-width:1180px!important;margin:10px auto 18px!important;
  border:1px solid var(--v4-line)!important;border-radius:20px!important;
  background:rgba(7,14,20,.82)!important;backdrop-filter:blur(22px) saturate(145%);-webkit-backdrop-filter:blur(22px) saturate(145%);
  box-shadow:0 14px 42px rgba(0,0,0,.2)!important;
}
body>header:not(.modal-header){padding:13px 16px!important}
.header-flex{position:relative!important;top:auto!important;min-height:60px!important;padding:9px 11px!important}
.header-flex h1,.header-flex h2,.header-flex h3{font-size:clamp(17px,2.4vw,21px)!important;letter-spacing:-.025em!important;text-shadow:none!important;color:#fff!important}

/* Surface system */
.card,.box,.panel,.menu-item,.produk-card,.user-card,.gaji-card,.balance-card,.summary-card,.profile-section,.profile-card,.stats-box,.stat-box,.highlight-box,.referral-banner,.gaji-info,.notification-card,.history-card,.bank-card,.wallet-card,.quick-actions,.info-box,.setting-item,.list-item{
  background:linear-gradient(145deg,rgba(16,29,39,.93),rgba(7,14,20,.95))!important;
  border:1px solid var(--v4-line)!important;border-radius:var(--v4-radius)!important;
  box-shadow:0 14px 44px rgba(0,0,0,.22)!important;
}
.card,.box,.panel,.menu-item,.produk-card,.user-card,.gaji-card,.stats-box,.stat-box,.setting-item,.list-item{transition:transform .2s var(--v4-ease),border-color .2s ease,background .2s ease,box-shadow .2s ease!important}
@media (hover:hover){.card:hover,.menu-item:hover,.produk-card:hover,.user-card:hover,.gaji-card:hover,.stats-box:hover,.stat-box:hover,.setting-item:hover,.list-item:hover{transform:translateY(-2px);border-color:var(--v4-line-strong)!important;box-shadow:0 19px 52px rgba(0,0,0,.27)!important}}

/* Typography */
h1,h2,h3,h4,h5,h6{color:var(--v4-text)!important;letter-spacing:-.025em!important;text-shadow:none!important}
p,small,.small,.subtitle,.sub-title,.desc,.description,.text-muted,.muted,.menu-subtitle{color:var(--v4-muted)!important}
hr{border:0!important;border-top:1px solid var(--v4-line)!important;opacity:1!important}

/* Forms */
input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea,.form-control,.form-select{
  width:100%;min-height:47px!important;border-radius:14px!important;border:1px solid rgba(255,255,255,.095)!important;
  background:rgba(255,255,255,.047)!important;color:#f6f9fa!important;box-shadow:none!important;outline:none!important;
  padding:10px 13px!important;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease!important;
}
textarea{min-height:112px!important;resize:vertical}
input:focus,select:focus,textarea:focus,.form-control:focus,.form-select:focus{border-color:rgba(104,242,165,.52)!important;background:rgba(104,242,165,.055)!important;box-shadow:0 0 0 4px rgba(104,242,165,.075)!important}
input::placeholder,textarea::placeholder{color:#6f7e89!important;opacity:1}
select option{background:#091119;color:#fff}
label,.form-label{font-size:12px!important;color:#a8b3bb!important;font-weight:650!important}

/* Buttons */
button,.btn,.button,input[type=submit],input[type=button],.action-btn,.btn-invest,.cta a{
  min-height:42px;border-radius:13px!important;font-weight:780!important;letter-spacing:-.01em!important;
  transition:transform .17s var(--v4-ease),filter .17s ease,border-color .17s ease,box-shadow .17s ease!important;
}
button:not(.btn-close):not(.nx-icon-btn):not(.nx-nav-item),.btn-primary,input[type=submit],.button-primary{
  background:linear-gradient(135deg,#7af2ae 0%,#34d47a 58%,#27b966 100%)!important;color:#03150a!important;border:0!important;box-shadow:0 10px 28px rgba(46,204,113,.16)!important;
}
.btn-secondary,.secondary-btn{background:rgba(255,255,255,.055)!important;color:#e9f0f3!important;border:1px solid var(--v4-line)!important;box-shadow:none!important}
.btn-danger,.danger-btn,.logout-btn,.logout-button{background:rgba(255,116,125,.09)!important;color:#ff9ba1!important;border:1px solid rgba(255,116,125,.2)!important;box-shadow:none!important}
button:active,.btn:active,.button:active,.action-btn:active{transform:scale(.985)!important}

/* Tables become scroll-safe on all devices. */
.table-responsive,.table-container{width:100%!important;max-width:100%!important;overflow:auto!important;border-radius:18px!important;border:1px solid var(--v4-line)!important;background:rgba(6,12,17,.6)!important;-webkit-overflow-scrolling:touch}
table,.table,.nexa-table{width:100%!important;min-width:620px;border-collapse:separate!important;border-spacing:0!important;color:#eaf0f3!important;background:transparent!important}
th,thead th{position:relative;color:#9eabb4!important;background:rgba(255,255,255,.045)!important;border-color:rgba(255,255,255,.06)!important;text-transform:uppercase;font-size:10px!important;letter-spacing:.075em!important;white-space:nowrap}
td{border-color:rgba(255,255,255,.055)!important;vertical-align:middle!important}

/* Modals */
.modal,.popup-overlay,.logout-popup,.faq-popup,.modal-tahunan{backdrop-filter:blur(12px)!important;-webkit-backdrop-filter:blur(12px)!important}
.modal-content,.popup-content,.logout-content,.faq-content{width:min(480px,calc(100% - 26px))!important;max-width:480px!important;border-radius:24px!important;background:linear-gradient(145deg,#101c25,#070d12)!important;border:1px solid rgba(255,255,255,.1)!important;box-shadow:0 36px 110px rgba(0,0,0,.58)!important;color:#fff!important}

/* ===== Sticky global bottom dock ===== */
body.nx-has-app-nav{padding-left:0!important;padding-bottom:calc(var(--v4-dock-h) + 34px + env(safe-area-inset-bottom))!important}
.nx-app-nav{
  position:fixed!important;z-index:5000!important;left:50%!important;right:auto!important;top:auto!important;
  bottom:max(10px,env(safe-area-inset-bottom))!important;transform:translateX(-50%)!important;
  width:min(720px,calc(100% - 20px))!important;height:var(--v4-dock-h)!important;padding:7px!important;
  display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:center!important;
  border-radius:24px!important;border:1px solid rgba(255,255,255,.1)!important;
  background:linear-gradient(180deg,rgba(11,19,26,.94),rgba(5,10,14,.95))!important;
  box-shadow:0 22px 66px rgba(0,0,0,.52),inset 0 1px 0 rgba(255,255,255,.035)!important;
  backdrop-filter:blur(26px) saturate(160%)!important;-webkit-backdrop-filter:blur(26px) saturate(160%)!important;
}
.nx-nav-brand,.nx-nav-foot{display:none!important}
.nx-nav-items{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;grid-template-rows:1fr!important;gap:5px!important;width:100%!important;height:100%!important}
.nx-nav-item{position:relative!important;width:auto!important;height:100%!important;min-width:0!important;padding:0 8px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:3px!important;border-radius:17px!important;color:#7e8c96!important;background:transparent!important;font-size:9px!important;font-weight:800!important;text-decoration:none!important;white-space:nowrap!important}
.nx-nav-icon{width:31px!important;height:25px!important;display:grid!important;place-items:center!important;border-radius:10px!important;background:transparent!important}
.nx-nav-icon i{font-size:15px!important}
.nx-nav-label{display:block!important;font-size:9px!important;line-height:1!important}
.nx-nav-item.active{color:#a2f7c4!important;background:linear-gradient(180deg,rgba(104,242,165,.105),rgba(104,242,165,.035))!important}
.nx-nav-item.active .nx-nav-icon{color:var(--v4-green)!important;background:rgba(104,242,165,.08)!important}
.nx-nav-item.active::before{content:""!important;position:absolute!important;left:50%!important;top:3px!important;bottom:auto!important;transform:translateX(-50%)!important;width:23px!important;height:2px!important;border-radius:999px!important;background:var(--v4-green)!important;box-shadow:0 0 15px rgba(104,242,165,.72)!important}

/* Internal-page navigation + safe spacing */
.nx-v4-internal{padding-bottom:calc(var(--v4-dock-h) + 35px + env(safe-area-inset-bottom))!important}
.nx-v4-internal .footer-nav{display:none!important}

/* Public informational pages */
body.nx-page-info section,body.nx-page-tentangkami section{padding:24px!important}
body.nx-page-info .card,body.nx-page-tentangkami .card,body.nx-page-syarat .card,body.nx-page-faq .card{padding:clamp(18px,3vw,28px)!important;border-radius:22px!important}
body.nx-page-syarat> .card{width:min(900px,calc(100% - 24px))!important;max-width:900px!important;margin:18px auto!important}
body.nx-page-syarat ol{padding-left:22px!important}body.nx-page-syarat li{margin:0 0 15px;color:#c9d2d7;line-height:1.65}

/* Auth polish */
body.nx-auth-page{padding:24px 14px!important;min-height:100dvh!important;display:grid!important;place-items:center!important;padding-bottom:24px!important}
body.nx-auth-page .nx-auth-card{width:100%;border-radius:28px!important;border-color:rgba(255,255,255,.095)!important;background:linear-gradient(145deg,rgba(16,28,37,.93),rgba(6,12,17,.96))!important;box-shadow:0 32px 100px rgba(0,0,0,.46)!important}

/* Admin: desktop-first but mobile-safe. */
body.nx-admin-page{padding-bottom:36px!important}
body.nx-admin-page > .container,body.nx-admin-page > main,body.nx-admin-page > .content,body.nx-admin-page > .main-content,body.nx-admin-page > .wrapper{width:min(1380px,calc(100% - 32px))!important;max-width:1380px!important;margin-left:auto!important;margin-right:auto!important}
body.nx-admin-page .stats-container,body.nx-admin-page .stats,body.nx-admin-page .dashboard-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))!important;gap:12px!important}
body.nx-admin-page .stat-box,body.nx-admin-page .stat-card{min-width:0!important;margin:0!important;border-radius:18px!important}

/* Responsive */
@media (min-width:760px){
  :root{--v4-dock-h:76px}
  .nx-app-nav{width:min(660px,calc(100% - 36px))!important}
  .nx-nav-item{flex-direction:row!important;gap:8px!important;font-size:11px!important}.nx-nav-label{font-size:11px!important}.nx-nav-icon{width:30px!important}
  body:not(.nx-auth-page) > .container,body:not(.nx-auth-page) > main,body:not(.nx-auth-page) > .content,body:not(.nx-auth-page) > .main-content,body:not(.nx-auth-page) > .wrapper,body:not(.nx-auth-page) > section,body:not(.nx-auth-page) .nx-shell{width:min(1180px,calc(100% - 42px))!important}
}
@media (min-width:1200px){
  .nx-app-nav{width:700px!important}
  .nx-nav-item{font-size:12px!important}.nx-nav-label{font-size:11px!important}
}
@media (max-width:699px){
  :root{--v4-dock-h:66px}
  body{padding-bottom:calc(var(--v4-dock-h) + 25px + env(safe-area-inset-bottom))!important;background-attachment:scroll!important}
  body:not(.nx-auth-page) > .container,body:not(.nx-auth-page) > main,body:not(.nx-auth-page) > .content,body:not(.nx-auth-page) > .main-content,body:not(.nx-auth-page) > .wrapper,body:not(.nx-auth-page) > section,body:not(.nx-auth-page) .nx-shell{width:calc(100% - 20px)!important;max-width:none!important}
  .header-flex,.topbar,.navbar,.nexa-header,body>header:not(.modal-header){width:calc(100% - 20px)!important;margin:8px auto 12px!important;border-radius:17px!important}
  .nx-app-nav{width:calc(100% - 12px)!important;height:66px!important;bottom:max(6px,env(safe-area-inset-bottom))!important;padding:5px!important;border-radius:20px!important}
  .nx-nav-item{padding:0 2px!important;border-radius:14px!important}.nx-nav-label{font-size:8.5px!important}.nx-nav-icon i{font-size:14px!important}
  .card,.box,.panel,.menu-item,.produk-card,.user-card,.gaji-card,.balance-card,.summary-card,.profile-section,.profile-card,.stats-box,.stat-box,.highlight-box,.gaji-info,.notification-card,.history-card,.bank-card,.wallet-card,.quick-actions,.setting-item,.list-item{border-radius:18px!important}
  table,.table,.nexa-table{min-width:560px!important}
  body.nx-admin-page > .container,body.nx-admin-page > main,body.nx-admin-page > .content,body.nx-admin-page > .main-content,body.nx-admin-page > .wrapper{width:calc(100% - 18px)!important;max-width:none!important}
}
@media (max-width:380px){.nx-nav-label{font-size:7.7px!important}.nx-nav-icon{width:27px!important}.nx-nav-icon i{font-size:13px!important}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}

/* V4 footer */
.nx-site-footer{width:min(1180px,calc(100% - 28px));margin:28px auto 0!important;padding:20px 12px calc(var(--v4-dock-h) + 28px)!important;text-align:center!important;border-top:1px solid rgba(255,255,255,.055)!important;color:#63717b!important;font-size:10px!important;line-height:1.7!important}
.nx-site-footer-brand{font-weight:850;color:#94a1aa;letter-spacing:.12em;text-transform:uppercase;margin-bottom:2px}
body.nx-auth-page .nx-site-footer{padding-bottom:20px!important}

/* Admin V4 persistent bottom dock */
body.nx-admin-page.nx-admin-has-dock{padding-bottom:112px!important}
.nx-admin-dock{position:fixed;z-index:5200;left:50%;bottom:max(10px,env(safe-area-inset-bottom));transform:translateX(-50%);width:min(720px,calc(100% - 20px));height:72px;padding:7px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;background:linear-gradient(180deg,rgba(11,19,26,.95),rgba(5,10,14,.97));border:1px solid rgba(255,255,255,.1);border-radius:24px;box-shadow:0 22px 66px rgba(0,0,0,.52);backdrop-filter:blur(26px) saturate(160%);-webkit-backdrop-filter:blur(26px) saturate(160%)}
.nx-admin-dock-item{position:relative;display:flex;align-items:center;justify-content:center;gap:7px;min-width:0;border-radius:17px;color:#81909a!important;font-size:10px;font-weight:800;text-decoration:none!important}
.nx-admin-dock-item i{font-size:14px}.nx-admin-dock-item span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nx-admin-dock-item.active{color:#a5f8c6!important;background:rgba(104,242,165,.07)}
.nx-admin-dock-item.active::before{content:"";position:absolute;top:3px;left:50%;transform:translateX(-50%);width:23px;height:2px;border-radius:99px;background:var(--v4-green);box-shadow:0 0 14px rgba(104,242,165,.7)}
@media(max-width:699px){body.nx-admin-page.nx-admin-has-dock{padding-bottom:96px!important}.nx-admin-dock{width:calc(100% - 12px);height:66px;padding:5px;bottom:max(6px,env(safe-area-inset-bottom));border-radius:20px}.nx-admin-dock-item{flex-direction:column;gap:3px;font-size:8px;border-radius:14px}.nx-admin-dock-item i{font-size:14px}}

/* Legacy component normalization — covers remaining internal/admin screens */
.transaction-card,.referral-card,.step-box,.faq-item,.detail-item,.sum-box,.progress-container,.info-grid>div,.member-empty{
  background:linear-gradient(145deg,rgba(15,27,36,.9),rgba(7,14,20,.94))!important;
  border:1px solid var(--v4-line)!important;border-radius:18px!important;box-shadow:0 12px 38px rgba(0,0,0,.2)!important;
}
.transaction-card,.referral-card,.step-box,.faq-item,.detail-item,.sum-box{padding:14px!important}
.menu-grid,.stat-row,.action-row,.info-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))!important;gap:10px!important;width:100%!important}
.menu-grid .menu-item,.stat-row .stat-box,.action-row .action-btn,.info-grid>div{margin:0!important;min-width:0!important;height:auto!important}
.transaction-list,.user-cards{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))!important;gap:10px!important;width:100%!important}
.history-header{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;flex-wrap:wrap!important}
.faq-question{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;cursor:pointer}
.faq-answer{color:var(--v4-muted)!important;line-height:1.65!important}
.progress-bar{height:9px!important;border-radius:999px!important;overflow:hidden!important;background:rgba(255,255,255,.07)!important}
.progress-bar>div,.progress-bar>span,.progress-fill{height:100%!important;border-radius:inherit!important;background:linear-gradient(90deg,var(--v4-green-2),#8cf4b9)!important}
.badge,.status,.chip,.pending,.success,.rejected{border-radius:999px!important;font-weight:760!important}
.pending{color:#f5d57d!important}.success{color:#8cf4b9!important}.rejected{color:#ff9aa1!important}
.btn-outline,.custom-btn{background:rgba(255,255,255,.045)!important;color:#e8f0f3!important;border:1px solid var(--v4-line)!important;box-shadow:none!important}
.nominal-item{border-radius:14px!important;border:1px solid var(--v4-line)!important;background:rgba(255,255,255,.04)!important;transition:.18s var(--v4-ease)!important}
.nominal-item:hover{border-color:var(--v4-line-strong)!important;background:rgba(104,242,165,.05)!important}
.product-table{width:100%!important;max-width:100%!important;overflow:auto!important}
@media(max-width:699px){
  .menu-grid,.stat-row,.action-row,.info-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .transaction-list,.user-cards{grid-template-columns:1fr!important}
  .transaction-card,.referral-card,.step-box,.faq-item,.detail-item,.sum-box{padding:12px!important;border-radius:16px!important}
}
@media(max-width:360px){.menu-grid,.stat-row,.action-row,.info-grid{grid-template-columns:1fr!important}}

/* Long pages render more efficiently while preserving layout. */
.transaction-card,.user-card,.produk-card,.faq-item,.notification-card{content-visibility:auto;contain-intrinsic-size:1px 150px}


/* =========================================================
   NEXA WEALTH V4.1 — MOBILE HEADER + FIRST-PAINT DOCK FIX
   ========================================================= */
/* The dock is emitted immediately after <body>; keep it on its own compositor layer. */
body.nx-has-app-nav > .nx-app-nav,
.nx-app-nav{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  position:fixed!important;
  inset:auto auto max(10px,env(safe-area-inset-bottom)) 50%!important;
  transform:translate3d(-50%,0,0)!important;
  margin:0!important;
  float:none!important;
  clear:none!important;
  overflow:visible!important;
  contain:none!important;
  will-change:transform!important;
  isolation:isolate!important;
  pointer-events:auto!important;
}

/* Account header tools: notification + settings never collide. */
.nx-page-intro-actions{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  padding:4px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:17px;
  background:rgba(8,15,21,.72);
  box-shadow:0 12px 34px rgba(0,0,0,.18);
  backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
}
.nx-page-tool{
  position:relative;
  min-width:44px;
  height:42px;
  padding:0 12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border-radius:13px;
  border:1px solid transparent;
  color:#dce6ea!important;
  background:rgba(255,255,255,.035)!important;
  text-decoration:none!important;
  font-size:11px;
  font-weight:780;
  line-height:1;
}
.nx-page-tool:hover{background:rgba(104,242,165,.06)!important;border-color:rgba(104,242,165,.15)}
.nx-page-tool i{font-size:14px;color:#b9c6cd}
.nx-page-tool-badge{
  position:absolute;
  top:-5px;
  right:-5px;
  min-width:18px;
  height:18px;
  padding:0 5px;
  align-items:center;
  justify-content:center;
  border:2px solid #071017;
  border-radius:999px;
  background:#ff646f;
  color:#fff;
  font-size:9px;
  font-weight:850;
  line-height:1;
  box-shadow:0 4px 12px rgba(255,100,111,.3);
}
@media(max-width:699px){
  .nx-app-nav{
    inset:auto auto max(6px,env(safe-area-inset-bottom)) 50%!important;
    transform:translate3d(-50%,0,0)!important;
  }
  .nx-page-saya>.nx-page-intro{align-items:flex-start!important;gap:10px!important}
  .nx-page-intro-actions{gap:4px;padding:3px;border-radius:15px}
  .nx-page-tool{width:40px;min-width:40px;height:38px;padding:0;border-radius:11px}
  .nx-page-tool-label{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
  .nx-page-tool i{font-size:14px}
  .nx-page-tool-badge{top:-5px;right:-5px;min-width:17px;height:17px;font-size:8.5px}
}
@media(max-width:360px){
  .nx-page-saya>.nx-page-intro{gap:7px!important}
  .nx-page-intro-copy p{max-width:220px}
  .nx-page-tool{width:37px;min-width:37px;height:37px}
}


/* =========================================================
   NEXA WEALTH V4.3 — AUTH SEPARATION + VIEWPORT FIX
   ========================================================= */
body.nx-premium-ready{animation:none!important;transform:none!important}
body.nx-premium-ready > .nx-shell,
body.nx-premium-ready > .container:not(.nav-container),
body.nx-premium-ready > main{animation:nxV43PageIn .24s ease both}
@keyframes nxV43PageIn{from{opacity:.88;translate:0 3px}to{opacity:1;translate:0 0}}

body.nx-auth-page{overflow-x:hidden!important}
body.nx-auth-page .nx-auth-wrap{width:min(460px,100%)!important}
body.nx-auth-page .nx-auth-card{padding:clamp(20px,5vw,28px)!important}
.nx-auth-form{display:flex;flex-direction:column;gap:13px}
.nx-auth-control{display:block;min-width:0}
.nx-auth-label{display:flex;align-items:center;gap:6px;margin:0 0 7px 3px;color:#a7b4bc;font-size:11px;font-weight:760;line-height:1.2;letter-spacing:.015em}
.nx-auth-label em{color:#65737d;font-size:9px;font-style:normal;font-weight:650}
.nx-auth-input{min-height:54px;display:grid;grid-template-columns:46px minmax(0,1fr);align-items:center;overflow:hidden;border:1px solid rgba(255,255,255,.09);border-radius:16px;background:rgba(2,8,12,.58);box-shadow:inset 0 1px 0 rgba(255,255,255,.025);transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}
.nx-auth-input:focus-within{border-color:rgba(99,238,161,.4);background:rgba(4,12,17,.86);box-shadow:0 0 0 3px rgba(99,238,161,.075),inset 0 1px 0 rgba(255,255,255,.035)}
.nx-auth-icon{grid-column:1;width:46px;height:100%;display:grid;place-items:center;border-right:1px solid rgba(255,255,255,.055);color:#76dba1;font-size:15px;line-height:1}
.nx-auth-input > input{grid-column:2;min-width:0!important;width:100%!important;height:52px!important;margin:0!important;padding:0 14px!important;border:0!important;outline:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:#f2f7f4!important;font-family:inherit!important;font-size:14px!important;font-weight:600!important;line-height:1.2!important;letter-spacing:0!important}
.nx-auth-input > input::placeholder{color:#60707b!important;opacity:1!important;font-weight:520!important}
.nx-auth-input-action{grid-template-columns:46px minmax(0,1fr) 46px}
.nx-auth-input-action > input{grid-column:2}
.nx-auth-trailing{grid-column:3;position:static!important;inset:auto!important;transform:none!important;width:46px!important;min-width:46px!important;height:52px!important;margin:0!important;padding:0!important;display:grid!important;place-items:center!important;border:0!important;border-left:1px solid rgba(255,255,255,.055)!important;border-radius:0!important;background:transparent!important;color:#9aa9b3!important;box-shadow:none!important}
.nx-auth-trailing i{font-size:14px!important;line-height:1!important}
.nx-auth-input-otp{grid-template-columns:46px minmax(0,1fr) auto}
.nx-auth-input-otp > input{grid-column:2}
.nx-auth-otp{grid-column:3;position:static!important;min-width:92px!important;height:38px!important;margin:0 8px 0 4px!important;padding:0 12px!important;border:1px solid rgba(99,238,161,.2)!important;border-radius:11px!important;background:rgba(99,238,161,.075)!important;color:#8ff0b7!important;box-shadow:none!important;white-space:nowrap!important;font-family:inherit!important;font-size:10px!important;font-weight:800!important}
.nx-auth-primary{min-height:52px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:9px!important;margin-top:2px!important;border-radius:15px!important}
.nx-auth-primary i{flex:0 0 auto;width:17px;margin:0!important;font-size:14px!important;line-height:1!important}
.nx-auth-primary span{min-width:0;line-height:1.2}
.nx-auth-consent{margin:0 2px 2px!important;gap:9px!important;font-size:10.5px!important}
.nx-auth-consent input{flex:0 0 auto;width:16px!important;height:16px!important;margin:1px 0 0!important}
body.nx-auth-page .nx-auth-note{line-height:1.55!important}
body.nx-auth-page .nx-auth-note > i{flex:0 0 18px;width:18px;text-align:center}
body.nx-auth-page .nx-alert{line-height:1.5}
body.nx-auth-page .nx-alert > i{margin-right:6px}

html,body{transform-style:flat!important}
.nx-app-nav,body.nx-has-app-nav > .nx-app-nav{position:fixed!important;left:50%!important;right:auto!important;top:auto!important;bottom:max(8px,env(safe-area-inset-bottom))!important;transform:translate3d(-50%,0,0)!important;z-index:2147483000!important}

@media(max-width:430px){
  body.nx-auth-page{padding:18px 12px!important;place-items:start center!important}
  body.nx-auth-page .nx-auth-wrap{width:100%!important;margin:auto 0!important}
  body.nx-auth-page .nx-auth-logo{margin-bottom:10px!important}
  body.nx-auth-page .nx-auth-logo img{width:126px!important;max-height:62px!important}
  body.nx-auth-page .nx-auth-card{border-radius:22px!important}
  body.nx-auth-page .nx-auth-card h1{font-size:22px!important}
  .nx-auth-form{gap:11px}
  .nx-auth-label{font-size:10.5px}
  .nx-auth-input{grid-template-columns:43px minmax(0,1fr);min-height:52px}
  .nx-auth-icon{width:43px;font-size:14px}
  .nx-auth-input > input{height:50px!important;padding:0 11px!important;font-size:13px!important}
  .nx-auth-input-action{grid-template-columns:43px minmax(0,1fr) 43px}
  .nx-auth-trailing{width:43px!important;min-width:43px!important;height:50px!important}
  .nx-auth-input-otp{grid-template-columns:43px minmax(0,1fr) auto}
  .nx-auth-otp{min-width:78px!important;height:36px!important;margin-right:7px!important;padding:0 9px!important;font-size:9.5px!important}
}
@media(max-width:340px){
  .nx-auth-input-otp{grid-template-columns:40px minmax(0,1fr)}
  .nx-auth-input-otp .nx-auth-icon{width:40px}
  .nx-auth-input-otp > input{grid-column:2}
  .nx-auth-otp{grid-column:1/-1;width:calc(100% - 14px)!important;margin:0 7px 7px!important}
}
