:root{
  --theme-primary:#df0a17;--theme-primary-dark:#9f020b;--theme-primary-light:rgba(223,10,23,.12);
  --theme-secondary:#111;--theme-bg-body:#000;--theme-bg-card:#141414;--theme-bg-surface:#1b1b1b;
  --theme-bg-input:#101010;--theme-text-primary:#f7f7f8;--theme-text-secondary:#929299;
  --theme-border:rgba(255,255,255,.08);--theme-nav-bg:#101010;
  --mf-ink:#f7f7f8;--mf-muted:#929299;--mf-paper:#070707;--mf-card:#141414;
  --mf-line:rgba(255,255,255,.08);--mf-coral:#df0a17;--mf-coral-dark:#9f020b;
  --mf-mint:#22c55e;--mf-navy:#101010
}
html,body{background:#000!important;color:#f7f7f8!important;font-family:Montserrat,Inter,system-ui,sans-serif!important}
body:before{display:none!important}
.mf-shell,body>.max-w-md,body>.mobile-app-container,body>.Mobile-App-Container{
  width:100%!important;max-width:480px!important;min-height:100dvh!important;margin:0 auto!important;
  background:radial-gradient(circle at 86% 3%,rgba(190,5,15,.11),transparent 27%),#070707!important;
  color:#f7f7f8!important;position:relative
}
.mf-pagebar,.sticky.top-0{
  background:rgba(8,8,8,.9)!important;border-color:rgba(255,255,255,.06)!important;
  color:#fff!important;backdrop-filter:blur(18px)
}
.mf-pagebar{min-height:66px!important;padding-top:max(12px,env(safe-area-inset-top))!important}
.mf-icon-button{background:#131313!important;border:1px solid #292929!important;color:#aaa!important;border-radius:50%!important}
.mf-pagebar-copy span{color:#777!important}.mf-pagebar-copy strong,.mf-row-title,.mf-stat strong,
.mf-panel h1,.mf-panel h2,.mf-panel h3,.mf-panel h4{color:#f7f7f8!important}
.mf-content{padding-bottom:calc(95px + env(safe-area-inset-bottom))!important}
.mf-panel,.mf-row,.mf-stat,.glass-card,.card,
[class*="bg-[#121828]"],[class*="bg-[#f8fafc]"],[class*="bg-white"],
[class*="bg-[#0f172a]"],[class*="bg-[#1e293b]"]{
  background:#141414!important;border-color:rgba(255,255,255,.08)!important;color:#f7f7f8!important;
  box-shadow:0 10px 28px rgba(0,0,0,.2)!important
}
.mf-panel,.mf-row,.mf-stat{border-radius:16px!important}
.mf-row-icon,[class*="bg-[#ebe5da]"],[class*="bg-gray-100"]{
  background:#202020!important;border-color:rgba(255,255,255,.07)!important;color:#ef2834!important
}
.mf-row-copy,.mf-stat span,.mf-field label,.text-gray-400,.text-gray-500,.text-gray-600,
.text-slate-300,.text-slate-400,.text-slate-500,[class*="text-[#687386]"]{color:#929299!important}
[class*="text-[#172235]"],[class*="text-[#f3f4f6]"],.text-white{color:#f7f7f8!important}
.text-blue-300,.text-blue-400,.text-blue-500,.text-app-primary{color:#ef2834!important}
.border-blue-500,.border-blue-400{border-color:#df0a17!important}
.bg-blue-500,.bg-app-primary{background:#df0a17!important}
.from-blue-500,.from-app-primary{--tw-gradient-from:#df0a17!important}
.to-blue-700,.to-app-primary_dark{--tw-gradient-to:#9f020b!important}
.mf-field input,.mf-field select,.mf-field textarea,
input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea{
  background:#101010!important;border-color:rgba(255,255,255,.1)!important;color:#f7f7f8!important;
  border-radius:12px!important
}
.mf-field input:focus,.mf-field select:focus,.mf-field textarea:focus,
input:focus,select:focus,textarea:focus{border-color:#df0a17!important;box-shadow:0 0 0 3px rgba(223,10,23,.08)!important;outline:0}
.mf-primary-button,.claim-task,.buy-button{
  background:linear-gradient(135deg,#df0a17,#9f020b)!important;color:#fff!important;
  border:0!important;border-radius:12px!important;box-shadow:0 6px 18px rgba(223,10,23,.22)!important
}
.mf-notice{background:rgba(223,10,23,.08)!important;border-color:rgba(223,10,23,.22)!important;color:#ffb1b6!important}
.mf-nav{background:rgba(14,14,14,.95)!important;border-color:rgba(255,255,255,.06)!important}
.mf-nav a{color:#68686f!important}.mf-nav a.active{color:#ef2632!important}
.navigation{background:rgba(14,14,14,.96)!important;border-color:rgba(255,255,255,.06)!important}
.navigation .icon{color:#6e6e75!important}.navigation .text{color:#ef2632!important}
.navigation li.active .icon,.navigation .indicator{color:#fff!important;background:#df0a17!important}
.auto-magic-host{position:relative!important;padding-bottom:calc(92px + env(safe-area-inset-bottom))!important}
.auto-magic-nav{position:fixed!important;left:50%!important;bottom:0!important;width:min(100%,480px)!important;transform:translateX(-50%)!important}
.auto-magic-nav .indicator{left:calc((25% * var(--nav-index)) + 12.5% - 28px)!important}
.auto-magic-nav .indicator,.auto-magic-nav .indicator:before,.auto-magic-nav .indicator:after{border-color:#070707!important}
.auto-magic-nav .indicator:before{box-shadow:1px -10px 0 0 #070707!important}
.auto-magic-nav .indicator:after{box-shadow:-1px -10px 0 0 #070707!important}
.mf-brand-badge{
  border-color:rgba(223,10,23,.25)!important;background:rgba(8,8,8,.82)!important;
  color:#f1b4b8!important
}
/* Kompatibilitas view khusus lama: pertahankan struktur dan ubah visualnya
   menjadi satu bahasa desain ReelBoxTV. */
.settings-app,.team-app,.vr-shell,.profile-shell,.fh-shell,.product-app,.detail-app{
  background:radial-gradient(circle at 85% 4%,rgba(190,5,15,.11),transparent 27%),#070707!important;
  max-width:480px!important
}
.settings-header,.team-header,.vr-head,.profile-header,.fh-header,.product-header,.detail-header{
  background:rgba(8,8,8,.9)!important;border-color:rgba(255,255,255,.06)!important;
  backdrop-filter:blur(18px)!important
}
.settings-header>a,.settings-header>span,.icon-button,.vr-back,.fh-header>a,.fh-header>button{
  background:#141414!important;border-color:#2a2a2a!important;color:#aaa!important
}
.security-hero,.team-app .hero{
  background:linear-gradient(145deg,#23080a,#111)!important;border-color:rgba(223,10,23,.25)!important;
  box-shadow:0 12px 30px rgba(0,0,0,.3)!important
}
.security-hero:after,.team-app .hero:after{background:rgba(223,10,23,.14)!important}
.hero-icon,.team-app .hero-badge{background:rgba(223,10,23,.13)!important;border-color:rgba(223,10,23,.25)!important;color:#ff6d76!important}
.account-card,.settings-list,.setting-row,.team-app .filter,.team-app .tabs,.team-app .level,
.team-app .member,.team-app .commission,.team-app .summary,.team-app .pagination,
.vr-card,.vr-plan,.profile-menu,.profile-stats article,.tx-item{
  background:#141414!important;border-color:rgba(255,255,255,.08)!important;color:#f7f7f8!important
}
.row-icon,.member-extra i,.page-button,.search button{background:#202020!important}
.row-icon.blue,.row-icon.purple,.row-icon.cyan,.row-icon.green,.row-icon.orange{color:#ef3540!important}
.team-app .tab.active,.team-app .level.active,.custom-dates button,.vr-watch,.fh-tabs button.active,.fh-modal button{
  background:linear-gradient(135deg,#df0a17,#9f020b)!important;border-color:#df0a17!important;color:#fff!important
}
.team-app .avatar{background:rgba(223,10,23,.12)!important;border-color:rgba(223,10,23,.24)!important;color:#ff5d67!important}
.team-app .navigation,.settings-app .navigation,.profile-shell .navigation,.fh-shell .navigation{
  background:rgba(14,14,14,.96)!important
}
.team-app .navigation li.active .text,.settings-app .navigation li.active .text,
.profile-shell .navigation li.active .text,.fh-shell .navigation li.active .text{color:#ef2632!important}
.team-app .indicator,.settings-app .indicator,.profile-shell .indicator,.fh-shell .indicator{background:#df0a17!important;border-color:#070707!important}
.product-card,.detail-app .hero,.detail-app .metric,.detail-app .panel{
  background:#141414!important;border-color:rgba(255,255,255,.08)!important;color:#f7f7f8!important
}
.product-card.featured,.detail-app .hero{border-color:rgba(223,10,23,.26)!important}
.product-card:after,.detail-app .hero:after{background:rgba(223,10,23,.11)!important}
.product-thumb,.hero-thumb{background:rgba(223,10,23,.12)!important;color:#ef3540!important}
.category.active,.featured .detail-button,.detail-app .duration{
  background:linear-gradient(135deg,#df0a17,#9f020b)!important;color:#fff!important
}
.product-app .search input,.product-app .category,.product-app .metrics,.detail-button,.detail-app .quota{
  background:#141414!important;border-color:rgba(255,255,255,.08)!important
}
.product-app .bar{background:#282828!important}.product-app .bar i{background:linear-gradient(90deg,#df0a17,#ff5963)!important}
.action-area{background:linear-gradient(0deg,#070707 72%,rgba(7,7,7,0))!important}
.balance-note{background:rgba(223,10,23,.08)!important;border-color:rgba(223,10,23,.2)!important}
.product-app .indicator,.detail-app .indicator{background:#df0a17!important;border-color:#070707!important}
.product-app .navigation,.detail-app .navigation{background:rgba(14,14,14,.96)!important}
.product-app .navigation li.active .text,.detail-app .navigation li.active .text{color:#ef2632!important}
.vr-thumb{background-color:#1b0809!important}.vr-thumb>span{background:#df0a17!important;color:#fff!important}
.vr-watch.disabled{background:#242424!important;color:#777!important}.vr-plan a{color:#ff4b55!important}
.profile-card{background:linear-gradient(145deg,#26090b,#121212)!important;border-color:rgba(223,10,23,.22)!important}
.profile-avatar,.menu-icon{background:#202020!important;color:#ef3540!important;border-color:#303030!important}
.profile-stats strong.blue,.profile-stats strong.cyan{color:#ef3540!important}
.fh-tabs{background:#101010!important;border-color:#242424!important}.fh-tabs button{color:#888!important}
.tx-icon.credit{background:rgba(34,197,94,.12)!important;color:#31cb67!important}.tx-icon.debit{background:rgba(223,10,23,.12)!important;color:#ef3540!important}
.fh-modal{background:rgba(0,0,0,.78)!important}.fh-modal>div{background:#141414!important;border-color:#2a2a2a!important}
.buy-button,.claim-task,.vr-watch:not(.disabled){background:linear-gradient(135deg,#df0a17,#9f020b)!important}
@media(max-width:479px){.mf-content{padding-left:16px!important;padding-right:16px!important}.mf-panel-pad{padding:15px!important}}
@media(min-width:600px){
  .auto-magic-nav{bottom:4vh!important;border-radius:0 0 27px 27px}
  .mf-shell,body>.max-w-md,body>.mobile-app-container,body>.Mobile-App-Container{
    height:92vh!important;min-height:0!important;margin:4vh auto!important;border:7px solid #181818!important;
    border-radius:34px!important;overflow:hidden!important
  }
}
