/* FokatLoot UI V9 — compact premium refinement on top of V8 */
:root{
  --v9-blue:#1478f2;--v9-blue2:#2f91ff;--v9-ink:#0a1630;--v9-text:#243651;--v9-muted:#62748f;
  --v9-bg:#f2f5f9;--v9-card:#fcfdff;--v9-line:#dfe6ef;--v9-soft:#f5f8fc;
  --v9-green:#08a24c;--v9-greenbg:#e8f8ee;--v9-red:#ed3445;--v9-redbg:#feecee;
  --v9-purple:#6b35cf;--v9-shadow:0 5px 16px rgba(28,50,82,.07);--v9-shadow2:0 2px 9px rgba(28,50,82,.055);
}
html{background:var(--v9-bg)!important}
body[data-fl-page]{background:linear-gradient(180deg,#f8fafc 0,#f2f5f9 34%,#eef2f7 100%)!important;color:var(--v9-ink)!important;font-size:12.5px!important;line-height:1.42!important}
body[data-fl-page]>.container,body[data-fl-page]>.wrap,body[data-fl-page]>.shell,body[data-fl-page]>.chat-page,.container,.wrap,.shell{width:calc(100% - 16px)!important;max-width:860px!important}

/* Header: visibly shorter and denser */
.user-shared-header{height:82px!important;min-height:82px!important;padding:9px 14px 17px!important;margin-bottom:-9px!important;border-radius:0 0 17px 17px!important;background:linear-gradient(116deg,#3198ff 0%,#147df2 56%,#0862dc 100%)!important}
.user-shared-header:before{width:190px!important;height:190px!important;right:-54px!important;top:27px!important;opacity:.8!important}
.user-shared-header:after{width:132px!important;height:132px!important;right:0!important;top:35px!important}
.user-shared-header .ush-left{gap:9px!important}
.user-shared-header .ush-logo{width:42px!important;height:42px!important;min-width:42px!important;border-width:1.4px!important;box-shadow:0 3px 9px rgba(0,45,105,.13)!important}
.user-shared-header .ush-copy{padding-top:0!important}
.user-shared-header .ush-name{font-size:15.5px!important;line-height:1.05!important;letter-spacing:-.2px!important;max-width:205px!important}
.user-shared-header .ush-sub{font-size:9.8px!important;margin-top:4px!important;font-weight:500!important}
.user-shared-header .ush-notification{width:36px!important;height:36px!important;min-width:36px!important;margin-top:1px!important;box-shadow:0 3px 10px rgba(0,44,105,.12)!important}
.user-shared-header .ush-notification svg{width:18px!important;height:18px!important}.user-shared-header .ush-badge{top:5px!important;right:5px!important;width:8px!important;height:8px!important;min-width:8px!important}

/* Global surfaces and typography */
.card,.balance-card,.wallet-card,.withdraw-card,.activity-card,.hero-card,.referral-hero,.stat-box,.stat-card,.premium-limit-card,.support-box,.category-card,.overall-status-card,.notification-card,.transaction-card,.shell .hero,.shell .card,.list .card,.profile-card,.menu-card,.settings-card{background:var(--v9-card)!important;border-color:var(--v9-line)!important;border-radius:14px!important;box-shadow:var(--v9-shadow)!important}
h1,h2,h3,.title,.section-title,.hero-title,.profile-name,.card-title,.support-title,.offer-title,.list-title{color:var(--v9-ink)!important;letter-spacing:-.15px!important}
.section-title{font-size:15.5px!important;margin:11px 2px 8px!important}.section-sub{font-size:9.4px!important;line-height:1.5!important;color:var(--v9-muted)!important}
.balance-label,.wallet-label,.wallet-title,.label,.sub,.muted,.offer-desc,.profile-mobile,.member-since,.support-desc,.limit-sub,.copy,.referral-hero .hero-text,.message,.time,.list-sub,small{color:var(--v9-muted)!important;opacity:1!important}
input,select,textarea,.input,.search-input{background:#fff!important;color:var(--v9-ink)!important;border-color:#d7e0eb!important;box-shadow:none!important}
input::placeholder,textarea::placeholder{color:#8796aa!important;opacity:1!important}
button,.btn,.claim-btn,.submit-btn,.start-btn,.offer-btn,.save-btn{letter-spacing:0!important}

/* Dashboard */
body[data-fl-page="dashboard"] .balance-card{padding:12px!important;margin-bottom:9px!important;border-radius:14px!important}
body[data-fl-page="dashboard"] .balance-top>div{padding:2px 10px!important}.balance-amount,.lifetime-amount{font-size:21px!important}.balance-label{font-size:10px!important;margin-bottom:3px!important}
body[data-fl-page="dashboard"] .balance-top>div:first-child:before,body[data-fl-page="dashboard"] .balance-top>div:nth-child(2):before{width:34px!important;height:34px!important;margin-right:7px!important;font-size:15px!important;background:#eef5ff!important}
body[data-fl-page="dashboard"] .balance-buttons{margin-top:10px!important;gap:7px!important}.balance-btn{min-height:44px!important;border-radius:12px!important;font-size:11.5px!important}
body[data-fl-page="dashboard"] .offer-card{grid-template-columns:45px minmax(0,1fr) 76px!important;min-height:72px!important;padding:8px 9px!important;margin-bottom:7px!important;gap:2px 7px!important;border-radius:13px!important;box-shadow:var(--v9-shadow2)!important}
body[data-fl-page="dashboard"] .offer-logo{width:44px!important;height:44px!important}.offer-title{font-size:12.5px!important}.offer-desc{font-size:8.7px!important;line-height:1.35!important}.offer-reward{min-width:70px!important;padding:5px 7px!important;font-size:9.8px!important}.claim-btn{width:76px!important;height:29px!important;min-height:29px!important;border-radius:10px!important;font-size:8.7px!important}
body[data-fl-page="dashboard"] .activity-card{padding:10px!important}.activity-item{padding:7px 0!important}.why-grid{gap:6px!important}.why-box{padding:9px!important;border-radius:12px!important}

/* Offers */
body[data-fl-page="offers"] .container{padding-top:0!important}.search-box{padding:10px!important;margin-bottom:8px!important;border-radius:14px!important;background:var(--v9-card)!important;border:1px solid var(--v9-line)!important;box-shadow:var(--v9-shadow)!important}.search-input{height:40px!important;border-radius:12px!important;font-size:11px!important;padding:0 13px!important}.category-scroll{gap:5px!important;padding:1px 0 2px!important}.category-chip{min-height:30px!important;padding:6px 10px!important;font-size:9px!important;border-radius:999px!important;background:#fff!important;border:1px solid #d8e2ef!important;color:#37618f!important}.category-chip.active{background:linear-gradient(135deg,#2c8eff,#126fe8)!important;color:#fff!important;border-color:transparent!important}.offers-grid{gap:7px!important}.offers-grid .offer-card{display:grid!important;grid-template-columns:48px minmax(0,1fr) 78px!important;grid-template-rows:auto auto!important;align-items:center!important;column-gap:8px!important;row-gap:2px!important;min-height:72px!important;padding:8px 9px!important;border-radius:13px!important;background:var(--v9-card)!important;border:1px solid var(--v9-line)!important;box-shadow:var(--v9-shadow2)!important}.offers-grid .offer-logo-wrap{grid-column:1!important;grid-row:1/3!important;width:46px!important;height:46px!important}.offers-grid .offer-logo{width:46px!important;height:46px!important;border-radius:50%!important}.offers-grid .offer-title{grid-column:2!important;grid-row:1!important;font-size:12.5px!important}.offers-grid .offer-desc{grid-column:2!important;grid-row:2!important;font-size:8.8px!important;line-height:1.4!important;-webkit-line-clamp:2!important}.offers-grid .offer-reward{grid-column:3!important;grid-row:1!important;justify-self:end!important;position:static!important;min-width:70px!important;padding:5px 6px!important;font-size:9.5px!important}.offers-grid .claim-btn{grid-column:3!important;grid-row:2!important;justify-self:end!important;width:78px!important;height:29px!important;min-height:29px!important}.offers-grid .live-badge{display:none!important}

/* Profile */
.fl8-profile-main{grid-template-columns:78px minmax(0,1fr)!important;gap:9px!important;padding:10px!important;margin-bottom:7px!important;border-radius:14px!important}.fl8-avatar-inner{width:64px!important;height:64px!important}.fl8-edit-dot{width:23px!important;height:23px!important;right:3px!important;bottom:7px!important;font-size:10px!important}.fl8-info-row{grid-template-columns:24px minmax(0,1fr) auto!important;gap:6px!important;min-height:39px!important}.fl8-i{width:24px!important;height:24px!important;border-radius:7px!important;font-size:10px!important}.fl8-info-row small{font-size:8px!important}.fl8-info-row strong{font-size:10.3px!important}.fl8-verified{font-size:7px!important;padding:3px 5px!important}.fl8-copy{font-size:7.6px!important;padding:4px 6px!important;border-radius:7px!important}.fl8-profile-stats{gap:5px!important;margin-bottom:7px!important}.fl8-stat{padding:7px!important;border-radius:12px!important;gap:5px!important;box-shadow:var(--v9-shadow2)!important}.fl8-stat-icon{width:23px!important;height:23px!important;min-width:23px!important;font-size:10px!important}.fl8-stat small{font-size:7px!important}.fl8-stat strong{font-size:12.5px!important}.fl8-stat em{font-size:6.3px!important;line-height:1.2!important}.fl8-menu{padding:2px 8px!important;border-radius:14px!important}.fl8-menu a,.fl8-menu button{min-height:36px!important;grid-template-columns:25px 1fr 12px!important;gap:6px!important;font-size:10px!important}.fl8-menu a span,.fl8-menu button span{width:23px!important;height:23px!important;border-radius:7px!important;font-size:10px!important}.fl8-menu b{font-size:17px!important}

/* Referral — convert dark reward cards into clean reference-like light cards */
body[data-fl-page="refer"] .referral-hero{padding:11px!important;margin-bottom:7px!important;border-radius:14px!important;background:var(--v9-card)!important}.compact-hero-top{align-items:flex-start!important}.hero-title{font-size:16px!important}.hero-text{font-size:8.8px!important;line-height:1.45!important}.referral-code{font-size:12px!important;padding:6px 8px!important;border-radius:9px!important;background:#eef5ff!important;color:#116fe8!important;border:1px dashed #7bb2f7!important}.compact-link-row{gap:5px!important;margin-top:8px!important}.compact-link-input{min-height:34px!important;height:34px!important;font-size:8.8px!important}.compact-copy-btn{min-height:34px!important;height:34px!important;padding:0 10px!important;font-size:8.5px!important;border-radius:9px!important}.compact-share-row{gap:5px!important;margin-top:7px!important}.mini-share{min-height:31px!important;border-radius:9px!important;font-size:8.5px!important}.stats-grid{gap:5px!important;margin:7px 0!important}.stat-box{padding:8px!important;border-radius:12px!important;box-shadow:var(--v9-shadow2)!important}.stat-number{font-size:15px!important}.stat-label{font-size:7.7px!important;margin-top:1px!important}
body[data-fl-page="refer"] .container>.card{padding:10px!important}.refer-edit-payout-btn{min-height:24px!important;padding:4px 7px!important;font-size:7px!important;border-radius:8px!important}.offer-card[id^="offer-"]{background:var(--v9-card)!important;border:1px solid var(--v9-line)!important;border-radius:12px!important;padding:8px!important;margin-top:7px!important;box-shadow:var(--v9-shadow2)!important}.offer-card[id^="offer-"] .offer-header{margin-bottom:6px!important}.offer-card[id^="offer-"] .offer-left{gap:7px!important}.offer-card[id^="offer-"] .offer-image,.offer-card[id^="offer-"] .offer-placeholder{width:39px!important;height:39px!important;border-radius:50%!important}.offer-card[id^="offer-"] .offer-title{font-size:11px!important;color:var(--v9-ink)!important}.reward-grid{gap:5px!important}.reward-box{background:var(--v9-soft)!important;border:1px solid #e3e9f1!important;border-radius:10px!important;padding:7px!important}.reward-label{font-size:7.2px!important;color:#667892!important}.reward-value{font-size:12px!important}.reward-note{font-size:6.5px!important;color:#8190a4!important}.offer-actions{margin-top:6px!important}.share-offer-btn{min-height:30px!important;border-radius:9px!important;font-size:8.2px!important;background:linear-gradient(135deg,#2c8eff,#126fe8)!important;color:#fff!important}.custom-panel{background:#f6f9fd!important;border-color:#dbe5f0!important;border-radius:11px!important}

/* Support */
body[data-fl-page="support"] .container{padding-top:0!important}.support-box{padding:11px!important;margin-bottom:7px!important}.support-title{font-size:16px!important}.support-desc{font-size:8.8px!important}.category-grid{gap:5px!important}.category-card{padding:8px!important;min-height:54px!important;border-radius:12px!important}.category-card span,.category-card div{font-size:8.7px!important}.ticket-card{padding:8px!important;border-radius:11px!important}.ticket-title{font-size:10.5px!important}.ticket-meta{font-size:7.5px!important}.faq-item{min-height:34px!important;padding:7px 9px!important;font-size:9px!important}

/* Transactions */
body[data-fl-page="transactions"] .wrap{padding-top:0!important}.tabs{padding:7px!important;border-radius:13px!important;gap:4px!important}.tab{min-height:29px!important;padding:6px 8px!important;font-size:8.5px!important}.summary{padding:10px!important;border-radius:13px!important}.summary strong{font-size:13px!important}.summary small{font-size:7.4px!important}.tx-list{gap:6px!important}.tx-card{min-height:64px!important;padding:8px!important;border-radius:12px!important}.tx-amount{font-size:12px!important}.tx-title{font-size:9.2px!important}.tx-meta,.tx-balance{font-size:7.3px!important}

/* Notifications */
body[data-fl-page="notifications"] .shell .hero{padding:10px!important;margin-bottom:7px!important}.shell .hero .title{font-size:16px!important}.shell .hero .sub{font-size:8.6px!important}.metric{padding:7px!important}.metric strong{font-size:15px!important}.filters{margin:6px 0 7px!important}.filter{min-height:27px!important;padding:5px 8px!important;font-size:7.8px!important}.list{gap:6px!important}.list .card{padding:8px!important;min-height:62px!important;border-radius:12px!important}.card-title{font-size:10.5px!important}.message{font-size:8px!important}.time{font-size:7.2px!important}.state{font-size:6.8px!important}.icon-action{width:25px!important;height:25px!important}

/* Withdraw */
body[data-fl-page="withdraw"] .balance-card,body[data-fl-page="withdraw"] .withdraw-card{padding:11px!important;margin-bottom:7px!important;border-radius:14px!important}.premium-limit-grid{gap:5px!important}.premium-limit-card{padding:7px!important;border-radius:11px!important}.premium-limit-value{font-size:13px!important}.limit-sub,.info-title{font-size:7.2px!important}.form-group{margin-bottom:8px!important}.input{min-height:38px!important;height:38px!important;font-size:9.3px!important;border-radius:10px!important}.submit-btn{min-height:37px!important;height:37px!important;font-size:9.8px!important;border-radius:10px!important}.history-item{padding:7px!important}.history-amount{font-size:10.5px!important}.history-date{font-size:7px!important}

/* Offer detail */
body[data-fl-page="offer"] .wrap{padding-top:0!important}.wrap>.card{padding:10px!important;margin-bottom:7px!important;border-radius:13px!important}.wrap>.hero{display:grid!important;grid-template-columns:58px minmax(0,1fr)!important;column-gap:10px!important;align-items:center!important}.wrap>.hero img{width:56px!important;height:56px!important;border-radius:12px!important;grid-row:1/5!important}.wrap>.hero h1{font-size:17px!important;margin:0 0 2px!important}.reward{font-size:18px!important}.muted,.copy{font-size:8.8px!important;line-height:1.5!important}.overall-status-card{padding:10px!important;margin-bottom:7px!important}.overall-status-main b{font-size:11px!important}.overall-status-main small{font-size:7.6px!important}.overall-status-pill{font-size:7px!important}.progress-step{font-size:7.3px!important}.btn{min-height:36px!important;border-radius:10px!important;font-size:9.5px!important}

/* Auth pages */
body[data-fl-page="login"] .wrapper,body[data-fl-page="register"] .wrapper,body[data-fl-page="forgot_password"] .wrapper{padding:18px 0!important;max-width:360px!important}.auth-logo,.logo-wrap img{width:54px!important;height:54px!important}.site-name{font-size:17px!important}.site-sub{font-size:8.5px!important}.card{border-radius:14px!important}.auth-card,.login-card{padding:14px!important}.auth-card input,.login-card input{min-height:38px!important;height:38px!important;font-size:9.5px!important}.auth-card button,.login-card button{min-height:37px!important;font-size:9.5px!important}

/* Bottom nav: smaller and calmer */
.bottom-nav.shared-user-nav{left:7px!important;right:7px!important;bottom:6px!important;height:57px!important;min-height:57px!important;border-radius:16px!important;padding:4px 2px calc(3px + env(safe-area-inset-bottom))!important;background:rgba(252,253,255,.97)!important;box-shadow:0 5px 15px rgba(28,50,82,.07)!important}.bottom-nav.shared-user-nav .nav-item{font-size:7.8px!important;gap:1px!important}.bottom-nav.shared-user-nav .nav-item svg{width:17px!important;height:17px!important}body.has-shared-user-nav,body.has-user-shared-header{padding-bottom:68px!important}

@media(max-width:390px){
 .user-shared-header{height:76px!important;min-height:76px!important;padding:8px 10px 16px!important;margin-bottom:-8px!important}.user-shared-header .ush-logo{width:39px!important;height:39px!important;min-width:39px!important}.user-shared-header .ush-name{font-size:14.2px!important;max-width:165px!important}.user-shared-header .ush-sub{font-size:9px!important}.user-shared-header .ush-notification{width:33px!important;height:33px!important;min-width:33px!important}.user-shared-header .ush-notification svg{width:16px!important;height:16px!important}
 body[data-fl-page]>.container,body[data-fl-page]>.wrap,body[data-fl-page]>.shell,body[data-fl-page]>.chat-page,.container,.wrap,.shell{width:calc(100% - 12px)!important}
 .fl8-profile-main{grid-template-columns:70px minmax(0,1fr)!important;padding:8px!important}.fl8-avatar-inner{width:58px!important;height:58px!important}.fl8-profile-stats{grid-template-columns:repeat(3,minmax(0,1fr))!important}.fl8-stat{padding:6px!important}.fl8-stat-icon{width:20px!important;height:20px!important;min-width:20px!important}.fl8-stat strong{font-size:11.3px!important}
 .offers-grid .offer-card,body[data-fl-page="dashboard"] .offer-card{grid-template-columns:42px minmax(0,1fr) 70px!important;padding:7px!important;min-height:66px!important}.offers-grid .offer-logo-wrap,.offers-grid .offer-logo,body[data-fl-page="dashboard"] .offer-logo{width:40px!important;height:40px!important}.offer-title{font-size:11.5px!important}.offer-desc{font-size:8px!important}.offer-reward{min-width:64px!important;font-size:8.8px!important}.claim-btn{width:70px!important;height:27px!important;min-height:27px!important;font-size:8px!important}
}
