:root{--bg:#030711;--bg2:#071323;--panel:rgba(8,24,43,.88);--line:rgba(50,177,255,.22);--cyan:#26d7ff;--blue:#1677ff;--gold:#f7c85e;--text:#eaf5ff;--muted:#93a9bd;--green:#38e6a1;--red:#ff647c;--shadow:0 18px 60px rgba(0,0,0,.28)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 78% 8%,rgba(0,111,255,.17),transparent 30%),radial-gradient(circle at 12% 45%,rgba(0,222,255,.08),transparent 35%),linear-gradient(180deg,#030711,#06101f 45%,#030711);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif}a{color:var(--cyan);text-decoration:none}a:hover{color:#fff}button,input,select,textarea{font:inherit}button,.btn{cursor:pointer;border:1px solid transparent;border-radius:12px;padding:11px 15px;font-weight:750;transition:.18s ease;display:inline-flex;align-items:center;justify-content:center;gap:8px}button:disabled{opacity:.45;cursor:not-allowed}.primary,.btn{background:linear-gradient(110deg,var(--blue),#00a9f5);color:white;box-shadow:0 8px 28px rgba(0,119,255,.17)}.primary:hover,.btn:hover{filter:brightness(1.12);transform:translateY(-1px)}.ghost,.secondary{border-color:var(--line);background:rgba(11,31,52,.7);color:var(--text)}.danger{background:rgba(255,62,94,.12);border:1px solid rgba(255,100,124,.3);color:#ff9bab}.gold{background:linear-gradient(120deg,#ffd978,#e5a928);color:#141923}.wrap{width:min(1180px,calc(100% - 32px));margin:auto}.app-shell{min-height:100vh}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px max(18px,calc((100vw - 1180px)/2));background:rgba(3,8,18,.88);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.brandmark{display:flex;align-items:center;gap:10px;color:#fff;font-weight:900;letter-spacing:.04em}.logo-orb{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;color:var(--cyan);font-weight:950;background:linear-gradient(145deg,#0c3860,#07101f);border:1px solid rgba(38,215,255,.55);box-shadow:0 0 26px rgba(38,215,255,.13)}.brandmark small{display:block;color:var(--gold);font-size:10px;letter-spacing:.18em;margin-top:2px}.top-actions{display:flex;align-items:center;gap:10px}.top-actions #sessionName{color:var(--muted);font-size:13px}.app-nav{display:flex;gap:7px;overflow:auto;padding:10px max(16px,calc((100vw - 1180px)/2));border-bottom:1px solid rgba(255,255,255,.05);background:rgba(4,12,24,.72);scrollbar-width:none}.app-nav::-webkit-scrollbar{display:none}.app-nav a{flex:0 0 auto;padding:9px 12px;border-radius:10px;color:#a8bed1;font-size:13px;font-weight:750}.app-nav a.active,.app-nav a:hover{color:#fff;background:linear-gradient(110deg,rgba(0,116,255,.22),rgba(0,210,255,.09));border:1px solid rgba(38,215,255,.22)}.main{width:min(1180px,calc(100% - 32px));margin:26px auto 64px}.page-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin:10px 0 22px}.eyebrow{color:var(--cyan);font-size:11px;font-weight:850;letter-spacing:.19em;text-transform:uppercase}.page-heading h1,.hero h1{margin:6px 0 8px;font-size:clamp(28px,4vw,43px);line-height:1.08;letter-spacing:-.04em}.page-heading p,.muted{color:var(--muted);line-height:1.65}.panel,.stat,.card{position:relative;min-width:0;padding:20px;border:1px solid var(--line);border-radius:19px;background:linear-gradient(145deg,rgba(9,29,52,.95),rgba(4,13,27,.94));box-shadow:var(--shadow);overflow:hidden}.panel:before,.stat:before{content:'';position:absolute;pointer-events:none;inset:0;background:linear-gradient(120deg,rgba(38,215,255,.035),transparent 44%)}.panel>*{position:relative}.panel h2,.panel h3{margin-top:0}.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.stat{padding:18px}.stat span{display:block;color:var(--muted);font-size:12px;margin-bottom:9px}.stat strong{font-size:clamp(20px,2.7vw,29px);display:block;letter-spacing:-.035em;overflow-wrap:anywhere}.stat small{display:block;color:var(--muted);font-size:11px;margin-top:8px}.stat.primary-stat{background:radial-gradient(circle at 95% 10%,rgba(0,181,255,.24),transparent 38%),linear-gradient(135deg,#082d5e,#071529)}.accent{color:var(--cyan)}.gold-text{color:var(--gold)}.green-text{color:var(--green)}.grid-2{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,1fr);gap:16px;margin-top:16px}.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.section{margin-top:20px}.section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}.section-head h2{margin:0;font-size:19px}.section-head p{margin:4px 0 0}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.form-stack,label{display:flex;flex-direction:column;gap:7px}.form-stack{gap:14px}label{font-size:13px;color:#cfe5f7;font-weight:700}input,select,textarea{width:100%;min-width:0;padding:12px 13px;border:1px solid rgba(112,157,194,.3);border-radius:11px;color:#f0f7ff;background:rgba(3,10,20,.8);outline:none}input:focus,select:focus,textarea:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(38,215,255,.1)}input::placeholder,textarea::placeholder{color:#647d94}select option{background:#071323;color:#fff}.inline-form{display:flex;gap:8px}.inline-form>*{flex:1}.message,.notice{padding:12px 14px;border:1px solid var(--line);background:rgba(0,145,255,.09);border-radius:12px;color:#cde9ff;font-size:13px;line-height:1.55}.message:empty{display:none}.message.error{border-color:rgba(255,100,124,.35);background:rgba(255,100,124,.08);color:#ffb0bd}.message.success{border-color:rgba(56,230,161,.3);background:rgba(56,230,161,.08);color:#91f5cc}.list{display:flex;flex-direction:column;gap:9px}.list-item{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:13px;border:1px solid rgba(112,157,194,.16);border-radius:12px;background:rgba(3,12,23,.46);overflow-wrap:anywhere}.list-item b,.list-item strong{color:#f5fbff}.list-item small{display:block;color:var(--muted);font-size:12px;line-height:1.55;margin-top:4px}.list-item.stacked{align-items:flex-start;flex-direction:column}.actions{display:flex;gap:8px;flex-wrap:wrap}.actions button{font-size:12px;padding:9px 11px}.package-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.package{padding:18px;border-radius:17px;border:1px solid rgba(38,215,255,.25);background:radial-gradient(circle at 100% 0,rgba(12,114,255,.19),transparent 45%),linear-gradient(140deg,#0a2038,#050d1a);display:flex;flex-direction:column;gap:9px}.package .price{font-size:23px;font-weight:900}.package .metadata{display:flex;justify-content:space-between;gap:8px;color:var(--muted);font-size:12px}.package .primary{margin-top:auto}.chart-wrap{position:relative;width:100%;height:285px;margin-top:12px}.chart-wrap canvas{width:100%;height:100%;display:block}.chart-foot{display:flex;justify-content:space-between;gap:10px;color:var(--muted);font-size:11px}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;min-width:620px;font-size:13px}th,td{text-align:left;padding:12px 11px;border-bottom:1px solid rgba(125,165,195,.13)}th{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}td{color:#dceeff}.pill{padding:5px 8px;border:1px solid var(--line);border-radius:99px;font-size:11px;color:var(--cyan);white-space:nowrap}.pill.good{color:var(--green);border-color:rgba(56,230,161,.28)}.pill.pending{color:var(--gold);border-color:rgba(247,200,94,.28)}.pill.bad{color:#ff9bab;border-color:rgba(255,100,124,.28)}.hero{position:relative;overflow:hidden;margin:26px 0 18px;padding:clamp(26px,6vw,68px);border:1px solid rgba(38,215,255,.28);border-radius:27px;background:radial-gradient(circle at 80% 25%,rgba(0,159,255,.28),transparent 34%),radial-gradient(circle at 80% 65%,rgba(247,200,94,.12),transparent 30%),linear-gradient(115deg,#071a30,#030812 65%);box-shadow:0 20px 80px rgba(0,0,0,.35)}.hero:after{content:'◎';position:absolute;right:6%;top:3%;font-size:clamp(170px,29vw,370px);font-weight:100;color:rgba(38,215,255,.08);text-shadow:0 0 65px rgba(38,215,255,.14);pointer-events:none}.hero-content{position:relative;z-index:1;max-width:670px}.hero h1{font-size:clamp(34px,5.6vw,60px);margin:12px 0}.hero h1 span{color:var(--cyan)}.hero p{max-width:590px;color:#aec3d7;line-height:1.75}.hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}.ticker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.ticker>div{padding:15px;border:1px solid var(--line);border-radius:13px;background:rgba(5,19,34,.73)}.ticker span{display:block;color:var(--muted);font-size:12px}.ticker strong{display:block;margin-top:5px}.auth-wrap{width:min(1000px,calc(100% - 28px));min-height:100vh;margin:auto;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:38px;padding:36px 0}.auth-brand h1{font-size:clamp(32px,5vw,52px);line-height:1.05;letter-spacing:-.04em}.auth-brand h1 span{color:var(--cyan)}.auth-panel{padding:26px}.auth-panel h2{margin:0 0 8px}.small{font-size:12px;line-height:1.55}.footer{width:min(1180px,calc(100% - 32px));margin:0 auto;padding:22px 0 36px;border-top:1px solid rgba(255,255,255,.07);font-size:12px;line-height:1.7;color:#718aa0}.toast{position:fixed;right:18px;bottom:18px;z-index:99;max-width:min(420px,calc(100vw - 36px));padding:13px 16px;background:#0b2540;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);display:none}.toast.show{display:block}.copy-row{display:flex;gap:8px}.copy-row input{flex:1}.referral-code{font-size:22px;font-weight:900;letter-spacing:.12em;color:var(--gold)}.admin-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:18px}.admin-section{padding:18px;border:1px solid var(--line);background:rgba(7,21,38,.75);border-radius:17px}.admin-section h2{margin-top:0}.section-gap{margin-top:18px}.empty-state{padding:20px;text-align:center;color:var(--muted);border:1px dashed rgba(112,157,194,.25);border-radius:12px}.qris-image{display:block;width:min(280px,100%);background:#fff;border-radius:12px;padding:10px;margin:12px auto}.checklist{padding-left:18px;color:var(--muted);line-height:1.8}.hidden{display:none!important}
@media(max-width:900px){.stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-2{grid-template-columns:1fr}.package-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}.auth-wrap{grid-template-columns:1fr;max-width:540px;gap:16px;padding:24px 0}.auth-brand{text-align:center}.auth-brand p{max-width:440px;margin:10px auto}.auth-brand h1{margin:12px auto}.hero:after{right:-3%;top:9%}}
@media(max-width:560px){.topbar{padding:11px 14px}.brandmark .brandwords{font-size:13px}.top-actions #sessionName{display:none}.top-actions button{padding:8px 10px;font-size:12px}.app-nav{padding:9px 9px}.app-nav a{font-size:12px;padding:9px 10px}.main{width:calc(100% - 22px);margin-top:20px}.page-heading{align-items:flex-start;flex-direction:column}.stat-grid{gap:9px}.stat{padding:14px}.stat span{font-size:11px}.stat strong{font-size:20px}.panel{padding:15px;border-radius:15px}.grid-3,.package-grid,.form-grid{grid-template-columns:1fr}.hero{padding:24px 20px;border-radius:19px}.hero:after{font-size:190px;top:22%;right:-14%}.hero-actions .btn{width:100%}.ticker{grid-template-columns:1fr}.chart-wrap{height:230px}.list-item{align-items:flex-start}.list-item:not(.stacked){flex-direction:column}.inline-form,.copy-row{flex-direction:column}.auth-panel{padding:18px}.footer{width:calc(100% - 22px)}button,.btn{min-height:42px}.table-wrap{margin:0 -2px}}

/* Fixed bottom navigation for member pages (mobile-first). */
.bottom-nav{display:none}
.bottom-nav svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:560px){
  body[data-area="member"][data-protected="true"] .app-nav{display:none}
  body[data-area="member"][data-protected="true"] .main{padding-bottom:calc(92px + env(safe-area-inset-bottom));}
  body[data-area="member"][data-protected="true"] .footer{padding-bottom:calc(100px + env(safe-area-inset-bottom));}
  .bottom-nav{position:fixed;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;left:0;right:0;bottom:0;z-index:50;padding:8px 6px calc(8px + env(safe-area-inset-bottom));background:rgba(3,8,18,.96);border-top:1px solid rgba(38,215,255,.28);box-shadow:0 -10px 30px rgba(0,0,0,.35);backdrop-filter:blur(18px)}
  .bottom-nav a{display:flex;min-width:0;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:5px 1px;border-radius:10px;color:#8fa9c0;font-size:10px;font-weight:750;white-space:nowrap}
  .bottom-nav a.active{color:var(--cyan);background:linear-gradient(180deg,rgba(0,119,255,.2),rgba(0,210,255,.05));text-shadow:0 0 14px rgba(38,215,255,.25)}
  .bottom-nav a.active svg{filter:drop-shadow(0 0 5px rgba(38,215,255,.35))}
}

@media(max-width:760px){
  body[data-area="member"][data-protected="true"] .app-nav{display:none}
  body[data-area="member"][data-protected="true"] .main{padding-bottom:calc(92px + env(safe-area-inset-bottom));}
  body[data-area="member"][data-protected="true"] .footer{padding-bottom:calc(100px + env(safe-area-inset-bottom));}
  .bottom-nav{position:fixed;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;left:0;right:0;bottom:0;z-index:50;padding:8px 6px calc(8px + env(safe-area-inset-bottom));background:rgba(3,8,18,.96);border-top:1px solid rgba(38,215,255,.28);box-shadow:0 -10px 30px rgba(0,0,0,.35);backdrop-filter:blur(18px)}
  .bottom-nav a{display:flex;min-width:0;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:5px 1px;border-radius:10px;color:#8fa9c0;font-size:10px;font-weight:750;white-space:nowrap}
  .bottom-nav a.active{color:var(--cyan);background:linear-gradient(180deg,rgba(0,119,255,.2),rgba(0,210,255,.05));text-shadow:0 0 14px rgba(38,215,255,.25)}
  .bottom-nav svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
}

/* LANDING PAGE — GLOBAL ARBITRASE */
.landing-section{margin-top:26px}
.landing-section .section-title{font-size:clamp(24px,3.5vw,34px);line-height:1.2;letter-spacing:-.03em;margin:8px 0 12px}
.landing-intro{max-width:800px;color:var(--muted);line-height:1.8}
.arbitrage-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}
.arbitrage-card{min-width:0;padding:20px;border:1px solid var(--line);border-radius:17px;background:linear-gradient(145deg,rgba(9,29,52,.95),rgba(4,13,27,.94))}
.arbitrage-card h3{margin:0 0 10px;font-size:17px}
.arbitrage-card p{margin:0;color:var(--muted);font-size:14px;line-height:1.75}
.arbitrage-number{display:grid;place-items:center;width:38px;height:38px;margin-bottom:15px;border:1px solid rgba(38,215,255,.3);border-radius:12px;color:var(--cyan);font-weight:900;background:rgba(38,215,255,.07)}
.arbitrage-example{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:18px}
.arbitrage-price{padding:18px;border:1px solid var(--line);border-radius:15px;background:rgba(4,15,29,.7)}
.arbitrage-price span{display:block;color:var(--muted);font-size:12px}
.arbitrage-price strong{display:block;margin-top:8px;font-size:clamp(20px,3vw,28px);overflow-wrap:anywhere}
.arbitrage-result{margin-top:14px;padding:18px;border:1px solid rgba(56,230,161,.28);border-radius:15px;background:rgba(56,230,161,.06)}
.arbitrage-result strong{display:block;font-size:clamp(22px,3vw,30px);color:var(--green);margin-top:5px}
.arbitrage-note{margin-top:12px;color:var(--muted);font-size:12px;line-height:1.7}
.arbitrage-formula{padding:14px;border-radius:12px;background:rgba(38,215,255,.06);border:1px solid rgba(38,215,255,.15);overflow-wrap:anywhere;line-height:1.7}
.landing-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
@media(max-width:760px){.arbitrage-grid{grid-template-columns:1fr 1fr}.arbitrage-card{padding:16px}}
@media(max-width:560px){.landing-section{margin-top:20px}.arbitrage-grid,.arbitrage-example{grid-template-columns:1fr}.arbitrage-card{padding:16px}.landing-cta{flex-direction:column}.landing-cta .btn{width:100%}}

/* MEMBER DASHBOARD QUICK MENU */
.member-quick-menu{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin:18px 0 22px;
}
.member-quick-link{
  min-width:0;
  min-height:76px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 5px;
  text-align:center;
  text-decoration:none;
  color:var(--muted);
  border:1px solid var(--line);
  border-radius:13px;
  background:linear-gradient(145deg,rgba(9,29,52,.95),rgba(4,13,27,.94));
  transition:border-color .2s,transform .2s;
}
.member-quick-link:hover{
  border-color:var(--cyan);
  transform:translateY(-2px);
}
.member-quick-icon{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:10px;
  border:1px solid rgba(38,215,255,.22);
  background:rgba(38,215,255,.07);
  color:var(--cyan);
}
.member-quick-icon svg{
  width:17px;
  height:17px;
}
.member-quick-label{
  font-size:11px;
  font-weight:650;
  line-height:1.35;
}
.member-floating-contact{
  position:fixed;
  z-index:999;
  right:14px;
  bottom:90px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:11px 14px;
  border:1px solid rgba(38,215,255,.4);
  border-radius:999px;
  background:#0b2035;
  color:#eaf8ff;
  box-shadow:0 8px 28px rgba(0,0,0,.35);
  text-decoration:none;
  font-size:13px;
  font-weight:700;
  touch-action:none;
  user-select:none;
  -webkit-user-select:none;
  cursor:grab;
}
.member-floating-contact:active{cursor:grabbing}
.member-floating-contact svg{width:19px;height:19px;color:var(--cyan);pointer-events:none}
.member-floating-contact span{pointer-events:none}
@media(max-width:420px){
  .member-quick-menu{gap:7px}
  .member-quick-link{min-height:70px;padding:8px 3px}
  .member-quick-label{font-size:10px}
  .member-floating-contact{right:10px;bottom:76px;padding:10px 12px}
}

/* Kartu paket investasi: gambar persegi kiri, detail ringkas kanan */
:is(#packageList, #limitedPackageList).package-grid {
  display:flex;
  flex-direction:column;
  gap:12px;
  width:100%;
}

:is(#packageList, #limitedPackageList) .package-card {
  display:flex;
  flex-direction:row;
  align-items:stretch;
  width:100%;
  min-width:0;
  padding:0;
  gap:0;
  overflow:hidden;
  border:1px solid rgba(38,215,255,.28);
  border-radius:14px;
  background:linear-gradient(145deg,#0a2038,#050d1a);
}

:is(#packageList, #limitedPackageList) .package-image {
  display:block;
  flex:0 0 120px;
  width:120px;
  height:120px;
  min-height:120px;
  max-width:120px;
  align-self:flex-start;
  object-fit:cover;
  aspect-ratio:1/1;
  background:#071323;
  border:0;
  border-right:1px solid rgba(38,215,255,.2);
}

:is(#packageList, #limitedPackageList) .package-details {
  display:flex;
  flex:1;
  flex-direction:column;
  align-items:stretch;
  gap:6px;
  min-width:0;
  padding:10px;
}

:is(#packageList, #limitedPackageList) .package-details .eyebrow {
  font-size:9px;
  letter-spacing:.7px;
}

:is(#packageList, #limitedPackageList) .package-details h2 {
  margin:0;
  font-size:15px;
  line-height:1.25;
  overflow-wrap:anywhere;
}

:is(#packageList, #limitedPackageList) .package-details p {
  margin:0;
  font-size:11px;
  line-height:1.4;
  overflow-wrap:anywhere;
}

:is(#packageList, #limitedPackageList) .package-details .price {
  font-size:18px;
  line-height:1.25;
  font-weight:900;
  color:var(--gold);
  overflow-wrap:anywhere;
}

:is(#packageList, #limitedPackageList) .package-details .metadata {
  display:flex;
  flex-wrap:wrap;
  gap:4px 6px;
  font-size:10px;
  line-height:1.35;
}

:is(#packageList, #limitedPackageList) .package-info {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:4px 8px;
  margin-top:0;
}

:is(#packageList, #limitedPackageList) .package-info > div {
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
  padding:2px 0;
  border:0;
  border-radius:0;
  background:transparent;
}

:is(#packageList, #limitedPackageList) .package-info span {
  color:var(--muted);
  font-size:10px;
  line-height:1.3;
}

:is(#packageList, #limitedPackageList) .package-info strong {
  color:var(--text);
  font-size:11px;
  line-height:1.35;
  overflow-wrap:anywhere;
}

:is(#packageList, #limitedPackageList) .package-details .primary {
  width:100%;
  min-height:36px;
  margin-top:2px;
  padding:8px 10px;
  font-size:12px;
}

@media(max-width:560px) {
  :is(#packageList, #limitedPackageList) .package-image {
    flex:0 0 100px;
    width:100px;
    height:100px;
    min-height:100px;
    max-width:100px;
  }

  :is(#packageList, #limitedPackageList) .package-details {
    padding:8px;
    gap:5px;
  }

  :is(#packageList, #limitedPackageList) .package-details h2 {
    font-size:13px;
  }

  :is(#packageList, #limitedPackageList) .package-details .price {
    font-size:16px;
  }

  :is(#packageList, #limitedPackageList) .package-info {
    gap:3px 6px;
  }

  :is(#packageList, #limitedPackageList) .package-info span {
    font-size:9px;
  }

  :is(#packageList, #limitedPackageList) .package-info strong {
    font-size:10px;
  }
}

/* Global Arbitrase - referral network dashboard */
.referral-dashboard{display:grid;gap:18px;margin-top:18px}
.referral-turnover{position:relative;isolation:isolate;background:radial-gradient(ellipse at 90% 0%,rgba(38,215,255,.17),transparent 42%),linear-gradient(135deg,#08264a,#061426 70%);border:1px solid rgba(38,215,255,.35)}
.referral-turnover:after{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(110deg,transparent 20%,rgba(38,215,255,.055) 50%,transparent 80%);background-size:220% 100%;animation:referralShimmer 6s linear infinite;pointer-events:none}
.referral-turnover-label{color:var(--muted);font-size:13px;font-weight:750;letter-spacing:.06em}
.referral-turnover-value{display:block;margin:9px 0;color:var(--cyan);font-size:clamp(28px,5vw,44px);font-weight:950;letter-spacing:-.04em;overflow-wrap:anywhere}
.referral-turnover-note{color:var(--muted);font-size:12px;line-height:1.6}
.referral-chart{width:100%;height:auto;display:block;overflow:visible}
.referral-chart .chart-area{fill:url(#referralAreaGradient)}
.referral-chart .chart-line{fill:none;stroke:var(--cyan);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1000;stroke-dashoffset:1000;animation:referralDraw 2s ease forwards}
.referral-chart .chart-dot{fill:var(--gold);stroke:#071323;stroke-width:3}
.referral-chart .chart-grid{stroke:rgba(147,169,189,.15);stroke-width:1;stroke-dasharray:4 5}
.referral-level-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.referral-level-card{min-width:0;padding:18px;border:1px solid var(--line);border-radius:17px;background:linear-gradient(145deg,rgba(9,29,52,.96),rgba(4,13,27,.96));box-shadow:var(--shadow)}
.referral-level-card h3{margin:0 0 6px;font-size:17px}
.referral-level-subtitle{color:var(--muted);font-size:12px}
.referral-level-metric{margin:17px 0 5px;color:var(--muted);font-size:12px}
.referral-level-count{font-size:25px;font-weight:900;color:var(--text)}
.referral-level-turnover{font-size:18px;font-weight:850;color:var(--gold);overflow-wrap:anywhere}
.referral-level-card .primary,.referral-level-card .ghost{width:100%;margin-top:14px}
.referral-member-list{display:grid;gap:9px;margin-top:12px}
.referral-member-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px;border:1px solid rgba(112,157,194,.18);border-radius:12px;background:rgba(3,10,20,.48);min-width:0}
.referral-member-row>span:first-child{min-width:0;overflow-wrap:anywhere}
.referral-member-row small{display:block;margin-top:4px;color:var(--muted);font-size:11px}
.referral-member-row strong{font-size:12px}
.referral-level-accent{display:inline-block;width:8px;height:8px;margin-right:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 12px rgba(38,215,255,.6)}
.referral-breakdown{display:grid;gap:13px;margin-top:16px}
.referral-breakdown-row{display:grid;grid-template-columns:78px minmax(0,1fr) auto;gap:10px;align-items:center;font-size:12px}
.referral-breakdown-track{height:8px;overflow:hidden;border-radius:99px;background:rgba(147,169,189,.14)}
.referral-breakdown-fill{height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,var(--blue),var(--cyan));transition:width 1s ease}
.referral-history-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@keyframes referralDraw{to{stroke-dashoffset:0}}
@keyframes referralShimmer{to{background-position:-220% 0}}
@media(max-width:760px){.referral-level-grid{grid-template-columns:1fr}.referral-history-grid{grid-template-columns:1fr}.referral-level-card{padding:16px}.referral-turnover{padding:17px}.referral-breakdown-row{grid-template-columns:65px minmax(0,1fr);}.referral-breakdown-row strong{grid-column:2}}
@media(prefers-reduced-motion:reduce){.referral-turnover:after,.referral-chart .chart-line{animation:none}.referral-breakdown-fill{transition:none}}
/* Leader Salary Page */
.salary-program {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid rgba(147, 169, 189, .18);
}

.salary-program:first-child {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.salary-program-head,
.salary-target-head,
.salary-target-foot,
.salary-progress-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.salary-program-head {
  margin-bottom: 14px;
}

.salary-program-head h3 {
  margin: 0 0 5px;
}

.salary-target {
  gap: 16px;
  margin-bottom: 12px;
}

.salary-target-head {
  align-items: flex-start;
}

.salary-target-head > div {
  min-width: 0;
}

.salary-target-head strong {
  color: #f4c76a;
  white-space: nowrap;
}

.salary-progress-block {
  display: grid;
  gap: 8px;
}

.salary-progress-label {
  font-size: .86rem;
  flex-wrap: wrap;
}

.salary-progress-label span {
  color: var(--muted, #93a9bd);
}

.salary-progress-label b {
  text-align: right;
  overflow-wrap: anywhere;
}

.salary-progress-track {
  width: 100%;
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(147, 169, 189, .15);
}

.salary-progress-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #26d7ff, #f4c76a);
  transition: width .25s ease;
}

.salary-target-foot {
  flex-wrap: wrap;
  padding-top: 4px;
}

.salary-status {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 6px 10px;
  border: 1px solid rgba(147, 169, 189, .25);
  border-radius: 999px;
  color: var(--muted, #93a9bd);
  font-size: .8rem;
}

.salary-status.is-ready {
  color: #26d7ff;
  border-color: rgba(38, 215, 255, .4);
}

.salary-status.is-paid {
  color: #6ee7a8;
  border-color: rgba(110, 231, 168, .4);
}

.salary-target-foot button {
  flex-shrink: 0;
}

@media (max-width: 560px) {
  .salary-target-head {
    flex-direction: column;
    gap: 6px;
  }

  .salary-target-head strong {
    white-space: normal;
  }

  .salary-target-foot {
    align-items: stretch;
  }

  .salary-target-foot button {
    width: 100%;
  }
}

/* Referral Bonus Summary Cards */
.referral-bonus-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:22px}
.referral-bonus-card{position:relative;display:flex;align-items:flex-start;gap:13px;min-width:0;overflow:hidden;padding:18px;border:1px solid rgba(73,177,255,.35);border-radius:17px;background:radial-gradient(ellipse at 100% 0%,rgba(38,153,255,.17),transparent 58%),linear-gradient(145deg,#102e50,#08182d 75%);box-shadow:0 8px 24px rgba(0,0,0,.18);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.referral-bonus-card:hover{transform:translateY(-3px);border-color:rgba(85,217,245,.7);box-shadow:0 12px 30px rgba(38,153,255,.12)}
.referral-bonus-icon{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;border:1px solid rgba(85,217,245,.3);border-radius:13px;background:rgba(38,153,255,.13);color:#55d9f5}
.referral-bonus-icon svg{width:24px;height:24px;display:block}
.referral-bonus-content{min-width:0;flex:1}
.referral-bonus-label{margin:2px 0 9px;color:#c2d8ec;font-size:12px;font-weight:750;line-height:1.5}
.referral-bonus-value{display:block;color:#fff;font-size:clamp(18px,3vw,25px);font-weight:950;letter-spacing:-.035em;overflow-wrap:anywhere}
.referral-bonus-card--rambat{border-color:rgba(255,196,76,.36);background:radial-gradient(ellipse at 100% 0%,rgba(255,190,55,.15),transparent 58%),linear-gradient(145deg,#392b16,#17182a 78%)}
.referral-bonus-card--rambat .referral-bonus-icon{border-color:rgba(255,209,102,.35);background:rgba(255,190,55,.12);color:#ffd166}
.referral-bonus-card--rambat:hover{border-color:rgba(255,209,102,.72);box-shadow:0 12px 30px rgba(255,190,55,.1)}
@media(max-width:420px){.referral-bonus-cards{gap:9px}.referral-bonus-card{gap:9px;padding:12px;border-radius:14px}.referral-bonus-icon{flex-basis:35px;width:35px;height:35px;border-radius:10px}.referral-bonus-icon svg{width:20px;height:20px}.referral-bonus-label{font-size:11px}.referral-bonus-value{font-size:17px}}
@media(prefers-reduced-motion:reduce){.referral-bonus-card{transition:none}.referral-bonus-card:hover{transform:none}}

/* Leader Salary Neon Cards */
.salary-turnover-wrap {
  margin: 18px 0 24px;
}

.salary-turnover-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgba(38, 215, 255, .75);
  background:
    radial-gradient(ellipse at 15% 0%, rgba(38, 215, 255, .23), transparent 55%),
    linear-gradient(145deg, rgba(8, 24, 43, .98), rgba(3, 7, 17, .98));
  box-shadow: 0 0 22px rgba(38, 215, 255, .24), inset 0 0 18px rgba(38, 215, 255, .06);
}

.salary-turnover-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(115deg, transparent 20%, rgba(38, 215, 255, .2) 42%, rgba(247, 200, 94, .3) 50%, transparent 72%);
  background-size: 240% 100%;
  animation: none;
}

.salary-turnover-card > * {
  position: relative;
  z-index: 1;
}

.salary-turnover-card .referral-turnover-value {
  color: #e9fcff;
  text-shadow: 0 0 8px rgba(38, 215, 255, .8), 0 0 22px rgba(38, 215, 255, .45);
}

.salary-program {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 18px;
  border: 1px solid rgba(38, 215, 255, .65);
  border-radius: 18px;
  background:
    radial-gradient(ellipse at top right, rgba(22, 119, 255, .2), transparent 65%),
    linear-gradient(145deg, rgba(8, 24, 43, .97), rgba(3, 7, 17, .94));
  box-shadow: 0 0 16px rgba(38, 215, 255, .18), inset 0 0 18px rgba(38, 215, 255, .04);
  animation: none;
  transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}

.salary-program::before,
.salary-target::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(115deg, transparent 18%, rgba(38, 215, 255, .18) 42%, rgba(247, 200, 94, .22) 50%, transparent 74%);
  background-size: 240% 100%;
  animation: none;
}

.salary-program > *,
.salary-target > * {
  position: relative;
  z-index: 1;
}

.salary-program:first-child {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid rgba(38, 215, 255, .65);
}

.salary-program:hover {
  border-color: rgba(38, 215, 255, .95);
  box-shadow: 0 0 30px rgba(38, 215, 255, .3), 0 0 10px rgba(247, 200, 94, .15);
  transform: translateY(-2px);
}

.salary-target {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgba(38, 215, 255, .32);
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(7, 19, 35, .98), rgba(8, 24, 43, .94));
  transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}

.salary-target:hover {
  border-color: rgba(38, 215, 255, .75);
  box-shadow: 0 0 20px rgba(38, 215, 255, .2);
  transform: translateY(-1px);
}

.salary-target-head strong {
  text-shadow: 0 0 10px rgba(247, 200, 94, .35);
}

.salary-progress-track span {
  box-shadow: 0 0 8px rgba(38, 215, 255, .75), 0 0 16px rgba(38, 215, 255, .3);
}

@keyframes salaryNeonShimmer {
  from { background-position: 120% 0; }
  to { background-position: -120% 0; }
}

@keyframes salaryNeonPulse {
  0%, 100% {
    box-shadow: 0 0 14px rgba(38, 215, 255, .15), inset 0 0 12px rgba(38, 215, 255, .03);
  }
  50% {
    box-shadow: 0 0 28px rgba(38, 215, 255, .3), 0 0 8px rgba(247, 200, 94, .12), inset 0 0 18px rgba(38, 215, 255, .07);
  }
}

@media (max-width: 560px) {
  .salary-program {
    padding: 14px;
    border-radius: 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .salary-turnover-card::after,
  .salary-program,
  .salary-program::before,
  .salary-target::before {
    animation: none;
  }

  .salary-program,
  .salary-target,
  .salary-progress-track span {
    transition: none;
  }
}

/* LIMITED PRODUCT WALLET BALANCE CARD */
.special-wallet-balance-card {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  min-height: 142px;
  margin: 16px 0 22px;
  padding: 24px;
  border: 1px solid rgba(38, 215, 255, .42);
  border-radius: 18px;
  background:
    radial-gradient(circle at 90% 10%, rgba(0, 169, 255, .28), transparent 42%),
    linear-gradient(125deg, #0b3155, #07182d 65%, #06101f);
  box-shadow: 0 12px 35px rgba(0, 119, 255, .13);
}

.special-wallet-balance-card::after {
  content: "GA";
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  color: rgba(38, 215, 255, .07);
  font-size: 105px;
  font-weight: 950;
  letter-spacing: -.1em;
  pointer-events: none;
}

.special-wallet-balance-card > div {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}

.special-wallet-balance-card span {
  color: #a9cce4;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .04em;
}

.special-wallet-balance-card strong {
  color: #ffffff;
  font-size: clamp(27px, 5vw, 36px);
  font-weight: 900;
  letter-spacing: -.04em;
  overflow-wrap: anywhere;
  text-shadow: 0 0 22px rgba(38, 215, 255, .22);
}

@media (max-width: 560px) {
  .special-wallet-balance-card {
    min-height: 125px;
    padding: 20px;
    border-radius: 15px;
  }

  .special-wallet-balance-card::after {
    right: 12px;
    font-size: 82px;
  }
}

/* INVESTMENT HORIZONTAL CATEGORY SLIDER */
.investment-category-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 18px 0;
  padding: 6px;
  border: 1px solid rgba(38, 215, 255, .18);
  border-radius: 15px;
  background: #071323;
}

.investment-category-btn {
  min-height: 48px;
  border: 1px solid transparent;
  border-radius: 11px;
  background: transparent;
  color: #a9bfd2;
  font-weight: 800;
  letter-spacing: .04em;
  cursor: pointer;
  transition: background .25s ease, color .25s ease, border-color .25s ease;
}

.investment-category-btn.active {
  color: #ffffff;
  border-color: rgba(38, 215, 255, .55);
  background: linear-gradient(120deg, #123b60, #0b223b);
  box-shadow: 0 0 18px rgba(38, 215, 255, .12);
}

.investment-category-btn[data-slide="1"].active {
  border-color: rgba(247, 200, 94, .6);
  background: linear-gradient(120deg, #493719, #241b10);
  box-shadow: 0 0 18px rgba(247, 200, 94, .12);
}

.investment-slider-viewport {
  width: 100%;
  overflow: hidden;
  min-width: 0;
  touch-action: pan-y;
  border-radius: 16px;
}

.investment-slider-track {
  display: flex;
  width: 200%;
  align-items: flex-start;
  transform: translateX(0);
  transition: transform .38s cubic-bezier(.22, .75, .25, 1);
  will-change: transform;
}

.investment-slide {
  flex: 0 0 50%;
  width: 50%;
  min-width: 0;
  box-sizing: border-box;
  padding: 0 2px;
  overflow-wrap: anywhere;
}

.investment-slide > .section {
  margin-bottom: 16px;
}

.investment-slide .package-grid {
  width: 100%;
  min-width: 0;
}

@media (max-width: 560px) {
  .investment-category-tabs {
    gap: 7px;
    padding: 5px;
  }

  .investment-category-btn {
    min-height: 45px;
    font-size: 12px;
  }

  .investment-slider-track {
    transition-duration: .32s;
  }

  .investment-slide {
    padding: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .investment-slider-track,
  .investment-category-btn {
    transition: none;
  }
}

/* DASHBOARD QUICK MENU — FIVE ITEMS */
@media(max-width:560px){
  .member-quick-menu{
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:5px;
  }
  .member-quick-link{
    min-height:66px;
    gap:5px;
    padding:7px 2px;
    border-radius:10px;
  }
  .member-quick-icon{
    width:27px;
    height:27px;
    border-radius:8px;
  }
  .member-quick-icon svg{
    width:15px;
    height:15px;
  }
  .member-quick-label{
    font-size:9px;
    line-height:1.2;
    overflow-wrap:anywhere;
  }
}

/* LIMITED LAUNCH COUNTDOWN */
.limited-countdown-panel {
  position: relative;
  overflow: hidden;
  padding: 22px;
  margin: 18px 0;
  border: 1px solid rgba(38, 215, 255, .28);
  border-radius: 18px;
  background: linear-gradient(135deg, #030711, #071b32 65%, #092b43);
  color: #fff;
  text-align: center;
}

.limited-countdown-panel .eyebrow {
  color: #26D7FF;
  letter-spacing: 2px;
  font-weight: 800;
}

.limited-countdown-panel h3 {
  margin: 10px 0;
  color: #fff;
  font-size: 21px;
}

.limited-countdown-panel > p {
  color: #b8c9d9;
}

.limited-countdown-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 20px auto;
  max-width: 440px;
}

.limited-countdown-grid > div {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 13px 5px;
  border: 1px solid rgba(38, 215, 255, .35);
  border-radius: 12px;
  background: rgba(3, 7, 17, .75);
}

.limited-countdown-grid strong {
  color: #26D7FF;
  font-size: clamp(22px, 5vw, 32px);
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

.limited-countdown-grid span {
  color: #c5d6e5;
  font-size: 12px;
}

#limitedCountdownStatus {
  margin: 12px 0 0;
  color: #F7C85E;
  font-weight: 700;
}

#limitedPackageList [data-buy]:disabled {
  opacity: .55;
  cursor: not-allowed;
}

@media (max-width: 420px) {
  .limited-countdown-panel {
    padding: 16px 10px;
  }

  .limited-countdown-grid {
    gap: 6px;
  }

  .limited-countdown-grid > div {
    padding: 11px 3px;
  }
}

/* CLOTHINGFACTORY — PREMIUM BLACK & GOLD THEME */
:root{
  --bg:#101116;--bg2:#17181e;--panel:rgba(31,32,39,.94);
  --line:rgba(198,164,91,.22);--cyan:#c6a45b;--blue:#a98543;
  --gold:#e9d7ad;--text:#f5f0e6;--muted:#b9b7b1;
  --green:#55c99a;--red:#ed7884;--shadow:0 18px 55px rgba(0,0,0,.32)
}
body{background:radial-gradient(circle at 82% 0%,rgba(198,164,91,.09),transparent 31%),linear-gradient(180deg,#101116,#15161b 48%,#101116);color:var(--text)}
a{color:var(--gold)}a:hover{color:#fff3d5}
.primary,.btn{background:linear-gradient(120deg,#e9d7ad,#b58b45);color:#17150f;box-shadow:0 8px 25px rgba(198,164,91,.16)}
.primary:hover,.btn:hover{filter:brightness(1.08);transform:translateY(-1px)}
.ghost,.secondary{border-color:var(--line);background:rgba(39,39,43,.82);color:var(--text)}
.gold{background:linear-gradient(120deg,#f0dfb7,#c6a45b);color:#17150f}
.topbar{background:rgba(16,17,22,.92);border-bottom-color:var(--line)}
.brandmark{color:#f5f0e6}
.logo-orb{color:#17150f;background:linear-gradient(145deg,#f0dfb7,#a98543);border:1px solid rgba(233,215,173,.75);box-shadow:0 5px 20px rgba(198,164,91,.16)}
.brandmark small{color:var(--gold)}
.app-nav{background:rgba(20,21,26,.88);border-bottom-color:rgba(198,164,91,.12)}
.app-nav a{color:#c3beb2}
.app-nav a.active,.app-nav a:hover{color:#f5e7c5;background:linear-gradient(110deg,rgba(198,164,91,.17),rgba(198,164,91,.06));border:1px solid rgba(198,164,91,.25)}
.eyebrow,.accent,.gold-text{color:var(--gold)}
.panel,.stat,.card{border-color:var(--line);background:linear-gradient(145deg,rgba(37,38,44,.97),rgba(25,26,31,.97));box-shadow:var(--shadow)}
.panel:before,.stat:before{background:linear-gradient(120deg,rgba(233,215,173,.035),transparent 48%)}
.stat.primary-stat{background:radial-gradient(circle at 95% 10%,rgba(198,164,91,.17),transparent 40%),linear-gradient(135deg,#343027,#1b1b1e)}
input,select,textarea{border-color:rgba(198,164,91,.24);color:#f5f0e6;background:rgba(17,18,22,.88)}
input:focus,select:focus,textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(198,164,91,.12)}
input::placeholder,textarea::placeholder{color:#88857e}
select option{background:#202127;color:#f5f0e6}
label{color:#e5dcc8}
.message,.notice{border-color:rgba(198,164,91,.22);background:rgba(198,164,91,.07);color:#eadfc8}
.list-item{border-color:rgba(198,164,91,.14);background:rgba(17,18,22,.48)}
.list-item b,.list-item strong{color:#f5f0e6}
.package{border-color:rgba(198,164,91,.3);background:radial-gradient(circle at 100% 0,rgba(198,164,91,.13),transparent 46%),linear-gradient(140deg,#292820,#191a1e)}
th{color:#c8b995}td{color:#e8e2d6}
.pill{border-color:rgba(198,164,91,.3);color:var(--gold)}
.pill.pending{color:#e9c978;border-color:rgba(233,201,120,.3)}
.hero{border-color:rgba(198,164,91,.3);background:radial-gradient(circle at 82% 20%,rgba(198,164,91,.17),transparent 35%),linear-gradient(115deg,#29271f,#15161a 68%);box-shadow:0 20px 70px rgba(0,0,0,.38)}
.hero:after{content:'C';color:rgba(233,215,173,.055);text-shadow:0 0 65px rgba(198,164,91,.08)}
.hero h1 span,.auth-brand h1 span{color:var(--gold)}
.hero p{color:#c8c2b6}
.ticker>div{border-color:var(--line);background:rgba(30,30,33,.78)}
.arbitrage-card{border-color:var(--line);background:linear-gradient(145deg,rgba(37,38,44,.97),rgba(25,26,31,.97))}
.arbitrage-number{border-color:rgba(198,164,91,.3);color:var(--gold);background:rgba(198,164,91,.08)}
.arbitrage-price{border-color:var(--line);background:rgba(23,23,27,.75)}
.arbitrage-result{border-color:rgba(198,164,91,.28);background:rgba(198,164,91,.06)}
.arbitrage-result strong{color:var(--gold)}
.arbitrage-formula{background:rgba(198,164,91,.06);border-color:rgba(198,164,91,.18)}
.admin-section{border-color:var(--line);background:rgba(30,30,34,.82)}
.empty-state{border-color:rgba(198,164,91,.22)}
.footer{border-top-color:rgba(198,164,91,.16);color:#918d83}
.toast{background:#292820;border-color:var(--line)}
.referral-code{color:var(--gold)}

/* CLOTHINGFACTORY — GLOBAL PREMIUM WHITE THEME */
:root{
  --bg:#ffffff;
  --bg2:#f7f7f5;
  --panel:#ffffff;
  --line:#e7e5df;
  --cyan:#ad8c50;
  --blue:#b99a61;
  --gold:#b99a61;
  --text:#292b30;
  --muted:#777b83;
  --green:#16845d;
  --red:#c94c5b;
  --shadow:0 8px 28px rgba(30,30,30,.055);
}
html,body{
  background:#fff!important;
  color:#292b30!important;
}
body{
  background:linear-gradient(180deg,#fff 0%,#fafaf8 100%)!important;
}
a{color:#a48650}
a:hover{color:#806333}
.topbar{
  background:rgba(255,255,255,.97)!important;
  border-bottom:1px solid #e9e7e1!important;
  box-shadow:0 3px 18px rgba(25,25,25,.035);
}
.brandmark{color:#292b30!important}
.brandwords{color:#292b30!important}
.brandmark small{color:#a48650!important}
.logo-orb{
  color:#a48650!important;
  background:#f7f3eb!important;
  border:1px solid #e6dcc8!important;
  box-shadow:none!important;
}
.app-nav{
  background:#fff!important;
  border-bottom:1px solid #e9e7e1!important;
}
.app-nav a{color:#666b73!important}
.app-nav a.active,.app-nav a:hover{
  color:#8c6d39!important;
  background:#f7f3eb!important;
  border:1px solid #e8dcc5!important;
}
.page-heading h1,.page-heading h2,
.hero h1,.panel h2,.panel h3,
.section-head h2{color:#292b30!important}
.page-heading p,.muted{color:#777b83!important}
.eyebrow,.accent,.gold-text{color:#a48650!important}
.panel,.stat,.card,.admin-section{
  color:#292b30!important;
  background:#fff!important;
  border:1px solid #e7e5df!important;
  box-shadow:0 8px 28px rgba(30,30,30,.045)!important;
}
.panel:before,.stat:before{display:none!important}
.stat span,.stat small{color:#777b83!important}
.stat strong{color:#292b30!important}
.stat.primary-stat{
  background:linear-gradient(135deg,#f8f5ee,#fff)!important;
}
.primary,.btn{
  background:linear-gradient(120deg,#c6aa76,#a98950)!important;
  color:#fff!important;
  border-color:#b99a61!important;
  box-shadow:0 5px 15px rgba(185,154,97,.15)!important;
}
.primary:hover,.btn:hover{filter:brightness(1.04)}
.gold{
  background:linear-gradient(120deg,#c6aa76,#a98950)!important;
  color:#fff!important;
}
.ghost,.secondary{
  background:#fff!important;
  color:#555960!important;
  border:1px solid #dedbd3!important;
}
.danger{
  color:#b83d4c!important;
  background:#fff4f4!important;
  border-color:#f0d4d7!important;
}
input,select,textarea{
  color:#292b30!important;
  background:#fff!important;
  border:1px solid #deded9!important;
}
input:focus,select:focus,textarea:focus{
  border-color:#b99a61!important;
  box-shadow:0 0 0 3px rgba(185,154,97,.12)!important;
}
input::placeholder,textarea::placeholder{color:#a0a1a4!important}
select option{background:#fff;color:#292b30}
label{color:#555960!important}
.message,.notice{
  color:#555960!important;
  background:#f8f7f3!important;
  border-color:#e7e2d7!important;
}
.message.error{
  color:#b83d4c!important;
  background:#fff4f4!important;
}
.message.success{
  color:#16734f!important;
  background:#f0faf5!important;
}
.list-item{
  background:#fafaf8!important;
  border-color:#e9e7e1!important;
}
.list-item b,.list-item strong{color:#292b30!important}
.list-item small{color:#777b83!important}
.package{
  background:linear-gradient(145deg,#fff,#f8f6f1)!important;
  border:1px solid #e6dfd1!important;
  box-shadow:0 8px 24px rgba(30,30,30,.045);
}
.package h2,.package h3,.package .price{color:#292b30!important}
.package .metadata{color:#777b83!important}
table{color:#44474d}
th{
  color:#777b83!important;
  background:#f8f7f4!important;
}
td{
  color:#44474d!important;
  border-bottom:1px solid #eceae5!important;
}
th,td{border-color:#eceae5!important}
.pill{
  color:#947541!important;
  background:#faf7f0!important;
  border-color:#e8dcc5!important;
}
.pill.good{
  color:#16845d!important;
  border-color:#cce9db!important;
  background:#f0faf5!important;
}
.pill.pending{
  color:#99752f!important;
  border-color:#eadfbe!important;
}
.pill.bad{
  color:#b83d4c!important;
  border-color:#f0d4d7!important;
}
.hero{
  background:linear-gradient(115deg,#faf9f6,#f2eee5)!important;
  border:1px solid #e9e2d5!important;
  box-shadow:0 12px 35px rgba(30,30,30,.045)!important;
}
.hero h1 span{color:#a48650!important}
.hero p{color:#666b73!important}
.hero:after{
  color:rgba(185,154,97,.08)!important;
  text-shadow:none!important;
}
.ticker>div{
  background:#fff!important;
  border:1px solid #e7e5df!important;
}
.ticker span{color:#777b83!important}
.ticker strong{color:#292b30!important}
.auth-panel{
  background:#fff!important;
  border:1px solid #e7e5df!important;
  box-shadow:0 12px 35px rgba(30,30,30,.06)!important;
}
.auth-brand h1,.auth-panel h2{color:#292b30!important}
.auth-brand h1 span{color:#a48650!important}
.admin-section{background:#fff!important}
.empty-state{
  color:#777b83!important;
  border-color:#deded9!important;
}
.footer{
  color:#777b83!important;
  border-color:#e9e7e1!important;
}
.footer a{color:#8c7042!important}
.toast{
  color:#292b30!important;
  background:#fff!important;
  border:1px solid #e7e5df!important;
  box-shadow:0 8px 28px rgba(30,30,30,.12)!important;
}
.referral-code{color:#a48650!important}
.checklist{color:#777b83!important}
.chart-foot{color:#777b83!important}
@media(max-width:760px){
  .panel,.stat,.card{border-radius:15px}
}

/* CLOTHINGFACTORY — DASHBOARD CLEAN LAYOUT */
body[data-current="dashboard"] .page-heading .eyebrow,
body[data-current="dashboard"] .page-heading p,
body[data-current="dashboard"] #refreshDashboard,
body[data-current="dashboard"] .member-quick-menu,
body[data-current="dashboard"] .stat-grid + .grid-2 > section:first-child {
  display: none !important;
}

body[data-current="dashboard"] .page-heading {
  margin: 12px 0 22px;
  align-items: flex-start;
}

body[data-current="dashboard"] .page-heading h1 {
  font-size: clamp(23px, 4vw, 32px);
  margin: 0;
}

body[data-current="dashboard"] .page-heading h1 .accent {
  color: #a48650 !important;
}

body[data-current="dashboard"] .stat-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

body[data-current="dashboard"] .stat-grid .primary-stat {
  grid-column: 1 / -1;
  order: -1;
  padding: 23px;
  border-color: #e2d4b9 !important;
  background: linear-gradient(135deg, #faf6ed, #ffffff) !important;
}

body[data-current="dashboard"] .stat-grid .primary-stat strong {
  font-size: clamp(27px, 5vw, 36px);
  color: #947440 !important;
}

body[data-current="dashboard"] .stat-grid .stat {
  min-width: 0;
}

@media(max-width:560px) {
  body[data-current="dashboard"] .stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body[data-current="dashboard"] .stat-grid .primary-stat {
    grid-column: 1 / -1;
  }
}


/* CLOTHINGFACTORY — DASHBOARD QUICK ICONS */
body[data-current="dashboard"] .dashboard-quick-panel .dashboard-quick-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
}
body[data-current="dashboard"] .dashboard-quick-action {
  min-width: 0;
  min-height: 100px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 14px 6px;
  border: 1px solid #e7e1d5;
  border-radius: 15px;
  background: #faf8f3;
  color: #947440;
  font-size: 13px;
  font-weight: 750;
  text-align: center;
  text-decoration: none;
}
body[data-current="dashboard"] .dashboard-quick-action svg {
  width: 29px;
  height: 29px;
  color: #b3945d;
}
body[data-current="dashboard"] .dashboard-quick-action:active {
  transform: scale(.97);
}

/* CLOTHINGFACTORY — TRANSACTION HISTORY SWIPE */
body[data-current="transactions"] .transactions-page {
  margin-top: 22px;
}

body[data-current="transactions"] .history-heading {
  margin: 0 0 18px;
}

body[data-current="transactions"] .history-heading h1 {
  margin: 0;
  font-size: clamp(25px, 4vw, 32px);
  color: #292b30;
}

body[data-current="transactions"] .history-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding: 5px;
  margin-bottom: 16px;
  border: 1px solid #e7e2d8;
  border-radius: 14px;
  background: #f7f5f0;
}

body[data-current="transactions"] .history-tab {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 43px;
  padding: 9px 5px;
  border-radius: 10px;
  color: #77736b;
  font-size: 13px;
  font-weight: 750;
  text-align: center;
  text-decoration: none;
}

body[data-current="transactions"] .history-tab.active {
  color: #fff;
  background: linear-gradient(120deg, #c6aa76, #a98950);
  box-shadow: 0 4px 12px rgba(169,137,80,.18);
}

body[data-current="transactions"] .history-slider {
  display: flex;
  gap: 14px;
  width: 100%;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

body[data-current="transactions"] .history-slider::-webkit-scrollbar {
  display: none;
}

body[data-current="transactions"] .history-slide {
  flex: 0 0 100%;
  min-width: 0;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  padding: 17px;
}

body[data-current="transactions"] .history-slide h2 {
  margin: 0 0 15px;
  color: #292b30;
  font-size: 17px;
}

body[data-current="transactions"] .history-slide .table-wrap {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

body[data-current="transactions"] .history-slide table {
  min-width: 600px;
}

@media(max-width:560px) {
  body[data-current="transactions"] .history-tabs {
    gap: 5px;
  }

  body[data-current="transactions"] .history-tab {
    font-size: 12px;
  }

  body[data-current="transactions"] .history-slide {
    padding: 13px;
  }
}

/* CLOTHINGFACTORY — COMPACT HISTORY TABLE */
@media(max-width:560px) {
  body[data-current="transactions"] .history-slide {
    padding: 10px;
  }

  body[data-current="transactions"] .history-slide .table-wrap {
    overflow-x: hidden;
  }

  body[data-current="transactions"] .history-slide table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
    font-size: 10px;
  }

  body[data-current="transactions"] .history-slide th,
  body[data-current="transactions"] .history-slide td {
    padding: 8px 3px;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 1.3;
  }

  body[data-current="transactions"] .history-slide th {
    font-size: 9px;
  }

  body[data-current="transactions"] .history-slide .pill {
    padding: 3px 5px;
    font-size: 9px;
    white-space: normal;
  }
}

/* CLOTHINGFACTORY — HISTORY HEADING CLEANUP */
body[data-current="transactions"] #reloadTransactions {
  display: none !important;
}

body[data-current="transactions"] .history-heading h1 {
  font-size: 21px !important;
  line-height: 1.3;
  margin: 0;
}

body[data-current="transactions"] .history-heading {
  margin-bottom: 13px;
}

/* CLOTHINGFACTORY — INVESTMENT CATEGORY REDESIGN */
body[data-current="investment"] .page-heading,
body[data-current="investment"] .main > .notice:empty,
body[data-current="investment"] #refreshInvestment {
  display: none !important;
}

body[data-current="investment"] .investment-category-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  padding: 5px;
  margin: 12px 0 20px;
  border: 1px solid #e9e1d2;
  border-radius: 14px;
  background: #f7f5f0;
}

body[data-current="investment"] .investment-category-btn {
  min-width: 0;
  min-height: 43px;
  padding: 9px 7px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: #827967;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .3px;
  box-shadow: none;
}

body[data-current="investment"] .investment-category-btn.active {
  border-color: #dfcfad;
  background: linear-gradient(135deg, #f2e8d4, #fffdf8);
  color: #947440;
  box-shadow: 0 3px 9px rgba(148,116,64,.10);
}

@media(max-width:560px) {
  body[data-current="investment"] .investment-category-tabs {
    margin-top: 10px;
    margin-bottom: 16px;
  }

  body[data-current="investment"] .investment-category-btn {
    min-height: 40px;
    font-size: 11px;
  }
}

/* CLOTHINGFACTORY — REFERRAL COMMAND CENTER */
body[data-current="referral"] .page-heading {
  align-items: flex-start;
  margin: 12px 0 20px;
}
body[data-current="referral"] .page-heading .eyebrow {
  display: none;
}
body[data-current="referral"] .page-heading h1 {
  margin: 0;
  color: #292b30;
  font-size: clamp(25px, 5vw, 34px);
  letter-spacing: -.045em;
}
body[data-current="referral"] .page-heading h1 .accent {
  color: #a48650 !important;
}
body[data-current="referral"] #reloadReferral {
  display: none !important;
}
body[data-current="referral"] .referral-dashboard {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 0;
}

/* Referral code card */
body[data-current="referral"] .main > .panel {
  border: 0;
  border-radius: 22px;
  padding: 21px;
  background: linear-gradient(125deg, #f2e8d5, #fffdf8 65%, #e9dfcc);
  box-shadow: 0 12px 30px rgba(91,72,42,.09);
  color: #403727;
}
body[data-current="referral"] .main > .panel h2 {
  color: #6f5935;
  font-size: 14px;
  margin: 0 0 13px;
}
body[data-current="referral"] .copy-row {
  gap: 9px;
}
body[data-current="referral"] .copy-row input {
  min-width: 0;
  border: 1px solid #dfd1b7;
  border-radius: 12px;
  background: rgba(255,255,255,.82);
  color: #665438;
  font-size: 12px;
}
body[data-current="referral"] .copy-row button {
  flex: 0 0 auto;
  border: 0;
  border-radius: 12px;
  background: #947440;
  color: white;
  box-shadow: none;
}
body[data-current="referral"] #referralCodeText {
  color: #8a7147;
  font-weight: 800;
  letter-spacing: .04em;
}
body[data-current="referral"] .main > .panel > p:last-child {
  color: #82745d;
}

/* Turnover hero */
body[data-current="referral"] .referral-turnover {
  overflow: hidden;
  padding: 25px;
  border: 0;
  border-radius: 26px 26px 8px 26px;
  background: linear-gradient(135deg, #292b30, #41403b 58%, #65543a);
  box-shadow: 0 16px 34px rgba(44,39,30,.16);
}
body[data-current="referral"] .referral-turnover:after {
  display: none;
}
body[data-current="referral"] .referral-turnover .eyebrow {
  color: #dfc58f;
  letter-spacing: .16em;
}
body[data-current="referral"] .referral-turnover-value {
  margin: 13px 0 5px;
  color: #fff2d4;
  font-size: clamp(30px, 7vw, 43px);
}
body[data-current="referral"] .referral-turnover-label {
  color: #e6d7b9;
  font-size: 11px;
}
body[data-current="referral"] .referral-turnover-note {
  color: #d0c6b3;
}
body[data-current="referral"] #referralChart {
  display: none !important;
}

/* Level turnover breakdown */
body[data-current="referral"] .referral-breakdown {
  gap: 12px;
  margin-top: 20px;
  padding-top: 17px;
  border-top: 1px solid rgba(255,255,255,.16);
}
body[data-current="referral"] .referral-breakdown-row {
  grid-template-columns: 58px minmax(0,1fr) auto;
  gap: 9px;
  color: #f0e7d6;
}
body[data-current="referral"] .referral-breakdown-track {
  height: 6px;
  background: rgba(255,255,255,.15);
}
body[data-current="referral"] .referral-breakdown-fill {
  background: linear-gradient(90deg, #b3945d, #f3dfb4);
}
body[data-current="referral"] .referral-breakdown-row strong {
  color: #fff1d2;
  font-size: 11px;
}

/* Bonus cards */
body[data-current="referral"] .referral-bonus-cards {
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
  margin-top: 20px;
}
body[data-current="referral"] .referral-bonus-card,
body[data-current="referral"] .referral-bonus-card--rambat {
  min-width: 0;
  padding: 14px;
  gap: 10px;
  border: 1px solid #e6dcc9;
  border-radius: 16px 16px 6px 16px;
  background: #fffdf8;
  box-shadow: none;
}
body[data-current="referral"] .referral-bonus-icon,
body[data-current="referral"] .referral-bonus-card--rambat .referral-bonus-icon {
  flex-basis: 34px;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 11px;
  background: #f1e8d8;
  color: #967747;
}
body[data-current="referral"] .referral-bonus-label {
  color: #81745e;
}
body[data-current="referral"] .referral-bonus-value {
  color: #725a34;
  font-size: clamp(15px, 3.4vw, 21px);
}

/* Level cards */
body[data-current="referral"] .referral-level-grid {
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 10px;
}
body[data-current="referral"] .referral-level-card {
  padding: 15px 12px;
  border: 1px solid #e8dfd0;
  border-radius: 18px 18px 6px 18px;
  background: #fffdf9;
  box-shadow: 0 7px 18px rgba(70,55,30,.05);
}
body[data-current="referral"] .referral-level-card h3 {
  color: #80663c;
  font-size: 15px;
}
body[data-current="referral"] .referral-level-accent {
  background: #b3945d;
  box-shadow: none;
}
body[data-current="referral"] .referral-level-subtitle,
body[data-current="referral"] .referral-level-metric {
  color: #918675;
}
body[data-current="referral"] .referral-level-count {
  color: #35332e;
  font-size: 19px;
}
body[data-current="referral"] .referral-level-turnover {
  color: #987744;
  font-size: 15px;
}
body[data-current="referral"] .referral-level-card button {
  width: 100%;
  min-height: 36px;
  padding: 8px 5px;
  margin-top: 13px;
  border: 0;
  border-radius: 10px;
  background: #eee5d5;
  color: #795f37;
  font-size: 11px;
  box-shadow: none;
}

/* Network and reward sections */
body[data-current="referral"] .referral-history-grid {
  grid-template-columns: 1fr;
  gap: 14px;
}
body[data-current="referral"] .referral-history-grid > .panel,
body[data-current="referral"] #referralMembersPanel {
  padding: 19px;
  border: 1px solid #e9e1d5;
  border-radius: 20px 20px 7px 20px;
  background: #fffefa;
  box-shadow: 0 8px 22px rgba(70,55,30,.05);
  color: #35332e;
}
body[data-current="referral"] .referral-history-grid h2,
body[data-current="referral"] #referralMembersPanel h2 {
  color: #6e5938;
}
body[data-current="referral"] .referral-history-grid .muted,
body[data-current="referral"] #referralMembersPanel .muted {
  color: #918675;
}
body[data-current="referral"] .referral-member-row,
body[data-current="referral"] .referral-history-grid .list-item {
  border: 1px solid #eee7db;
  border-radius: 13px;
  background: #faf8f3;
  color: #403b32;
}
body[data-current="referral"] .referral-member-row b,
body[data-current="referral"] .referral-history-grid .list-item b,
body[data-current="referral"] .referral-history-grid .list-item strong {
  color: #55452d;
}
body[data-current="referral"] .referral-member-row small,
body[data-current="referral"] .referral-history-grid .list-item small {
  color: #928675;
}
body[data-current="referral"] .referral-history-grid button.primary {
  border: 0;
  border-radius: 11px;
  background: #947440;
  box-shadow: none;
}
body[data-current="referral"] .referral-history-grid .green-text {
  color: #8b7041 !important;
}

@media(max-width:560px) {
  body[data-current="referral"] .referral-level-grid {
    gap: 7px;
  }
  body[data-current="referral"] .referral-level-card {
    padding: 12px 9px;
  }
  body[data-current="referral"] .referral-level-card h3 {
    font-size: 13px;
  }
  body[data-current="referral"] .referral-level-subtitle,
  body[data-current="referral"] .referral-level-metric {
    font-size: 10px;
  }
  body[data-current="referral"] .referral-level-count {
    font-size: 16px;
  }
  body[data-current="referral"] .referral-level-turnover {
    font-size: 12px;
  }
}

/* REFERRAL — HIDE TURNOVER TEMPORARILY */
body[data-current="referral"] .referral-turnover > .eyebrow,
body[data-current="referral"] #referralTotalTurnover,
body[data-current="referral"] .referral-turnover-label,
body[data-current="referral"] .referral-turnover-note,
body[data-current="referral"] #referralBreakdown {
  display: none !important;
}


/* CLOTHINGFACTORY - WALLET ALAT TERBATAS */
#limitedProductPanel {
  padding: 0;
  margin: 14px 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.special-wallet-balance-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 14px;
  min-height: 0;
  margin: 0;
  padding: 20px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  background: #090a0d;
  box-shadow: 0 8px 24px rgba(0,0,0,.16);
}

.special-wallet-balance-card::after {
  display: none;
}

.special-wallet-balance-card .special-wallet-main {
  display: flex;
  flex: 1 1 150px;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}

.special-wallet-balance-card span {
  color: #b9b7b1;
  font-size: 12px;
  letter-spacing: .02em;
}

.special-wallet-balance-card strong {
  color: #fff;
  font-size: clamp(23px, 5vw, 30px);
  text-shadow: none;
}

.special-wallet-topup {
  position: relative;
  z-index: 2;
  flex: 0 0 auto;
}

.special-wallet-topup summary {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 11px 13px;
  border: 1px solid rgba(233,215,173,.35);
  border-radius: 11px;
  color: #e9d7ad;
  font-size: 13px;
  font-weight: 750;
  list-style: none;
  cursor: pointer;
}

.special-wallet-topup summary::-webkit-details-marker {
  display: none;
}

.special-wallet-topup .topup-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #e9d7ad;
  color: #090a0d;
  font-size: 17px;
  font-weight: 900;
}

.special-wallet-topup form {
  display: grid;
  gap: 10px;
  width: min(270px, calc(100vw - 80px));
  margin-top: 12px;
  padding: 14px;
  border: 1px solid rgba(233,215,173,.2);
  border-radius: 12px;
  background: #17181e;
}

.special-wallet-topup form label {
  color: #e9d7ad;
  font-size: 12px;
}

.special-wallet-topup form input {
  width: 100%;
  min-width: 0;
}

.special-wallet-topup form button {
  width: 100%;
}

.special-wallet-refresh {
  order: 3;
  padding: 7px 10px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 9px;
  background: transparent;
  color: #c6a45b;
}

.limited-countdown-panel {
  padding: 13px 15px;
  margin: 12px 0;
  border: 1px solid rgba(198,164,91,.2);
  border-radius: 14px;
  background: #17181e;
  color: #f5f0e6;
}

.limited-countdown-panel .eyebrow {
  color: #c6a45b;
  font-size: 10px;
  letter-spacing: 1.2px;
}

.limited-countdown-panel h3 {
  margin: 5px 0;
  font-size: 15px;
}

.limited-countdown-panel > p {
  margin: 5px 0;
  color: #b9b7b1;
  font-size: 11px;
}

.limited-countdown-grid {
  gap: 7px;
  max-width: 310px;
  margin: 10px auto;
}

.limited-countdown-grid > div {
  gap: 2px;
  padding: 6px 3px;
  border: 1px solid rgba(198,164,91,.18);
  border-radius: 8px;
  background: #101116;
}

.limited-countdown-grid strong {
  color: #e9d7ad;
  font-size: 17px;
  font-weight: 800;
}

.limited-countdown-grid span {
  color: #b9b7b1;
  font-size: 9px;
}

#limitedCountdownStatus {
  margin: 6px 0 0;
  font-size: 10px;
}



/* CLOTHINGFACTORY — DASHBOARD TREASURE CHEST */
body[data-current="dashboard"] .dashboard-reward-section{
  display:grid;gap:16px
}
body[data-current="dashboard"] .dashboard-reward-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px
}
body[data-current="dashboard"] .dashboard-reward-grid .reward-hub-card{
  min-width:0;padding:17px;border:1px solid rgba(183,151,91,.25);
  border-radius:16px;background:linear-gradient(145deg,#fffefa,#f5f0e6);
  color:#263142
}
body[data-current="dashboard"] .dashboard-reward-grid .reward-hub-card h2,
body[data-current="dashboard"] .dashboard-reward-grid .reward-hub-card label{
  color:#4b3b25
}
body[data-current="dashboard"] .dashboard-reward-grid .reward-hub-card p,
body[data-current="dashboard"] .dashboard-reward-grid .reward-hub-card .message{
  color:#687386
}
body[data-current="dashboard"] .dashboard-reward-grid .reward-hub-card .panel{
  padding:12px;background:#fff;border:1px solid #e8e0d1
}
body[data-current="dashboard"] .dashboard-reward-grid .reward-hub-card details{
  border-top:1px solid #e7dfd1
}
body[data-current="dashboard"] .treasure-panel{
  padding:20px;border:1px solid rgba(190,151,75,.45);border-radius:19px;
  background:radial-gradient(ellipse at 50% 0%,rgba(247,200,94,.13),transparent 65%),linear-gradient(145deg,#101b2b,#07111e);
  color:#f5f2e9;overflow:hidden;text-align:center
}
.treasure-heading{text-align:left}
.treasure-heading h2{margin:4px 0;color:#f4d58a}
.treasure-heading p{margin:5px 0;color:#aebdca;font-size:13px}
.treasure-key-info{
  display:flex;flex-direction:column;align-items:center;gap:4px;margin:18px auto 4px;
  color:#cbd5df;font-size:13px
}
.treasure-key-info strong{font-size:25px;color:#f5d477}
.treasure-key-info small{color:#9eacba;font-size:11px}
.treasure-key-info small b{color:#f5d477}
.treasure-chest-button{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;
  width:min(100%,280px);min-height:205px;margin:12px auto;padding:18px;
  border:1px solid rgba(255,255,255,.1);border-radius:17px;
  background:rgba(255,255,255,.025);color:#87909b;cursor:not-allowed;
  transition:background .3s,border-color .3s,box-shadow .3s,transform .3s
}
.treasure-chest-button:disabled{opacity:1}
.treasure-chest-button strong{font-size:12px;letter-spacing:2px}
.treasure-chest-art{position:relative;display:block;width:142px;height:112px;filter:none;opacity:1;transition:filter .35s,opacity .35s}
.treasure-chest-body{
  position:absolute;left:8px;right:8px;bottom:4px;height:65px;border:5px solid #d5a84e;
  border-radius:9px 9px 15px 15px;background:linear-gradient(145deg,#ffe18a,#b77a27);
  box-shadow:inset 0 8px 12px rgba(255,255,255,.12),0 9px 15px rgba(0,0,0,.35)
}
.treasure-chest-lid{
  position:absolute;z-index:2;left:8px;right:8px;top:7px;height:42px;
  border:5px solid #f4d477;border-radius:48px 48px 8px 8px;
  background:linear-gradient(145deg,#fff0ad,#d49a35);transform-origin:12% 90%;
  transition:transform .8s cubic-bezier(.2,.8,.2,1)
}
.treasure-chest-lock{
  position:absolute;z-index:3;left:61px;top:48px;width:20px;height:27px;
  border:3px solid #fff0b2;border-radius:5px;background:linear-gradient(145deg,#f7d77f,#9a641d)
}
.treasure-chest-lock:before{
  content:"";position:absolute;left:2px;top:-13px;width:10px;height:12px;
  border:3px solid #fff0b2;border-bottom:0;border-radius:9px 9px 0 0
}
.treasure-chest-glow{
  position:absolute;inset:-15px;border-radius:50%;opacity:0;
  background:radial-gradient(ellipse,rgba(255,213,112,.48),transparent 68%);
  opacity:.65;transition:opacity .5s;pointer-events:none
}
.treasure-chest-button.has-key{
  border-color:rgba(247,200,94,.55);background:linear-gradient(145deg,rgba(247,200,94,.11),rgba(255,255,255,.025));
  color:#f7d77f;cursor:pointer;box-shadow:0 0 25px rgba(247,200,94,.12)
}
.treasure-chest-button.has-key .treasure-chest-art{
  filter:none;opacity:1;animation:treasurePulse 2.2s ease-in-out infinite
}
.treasure-chest-button.has-key .treasure-chest-body{
  border-color:#d5a84e;background:linear-gradient(145deg,#f2ca68,#99621e)
}
.treasure-chest-button.has-key .treasure-chest-lid{
  border-color:#e7bd5c;background:linear-gradient(145deg,#ffe18a,#b77a27)
}
.treasure-chest-button.has-key .treasure-chest-lock{
  border-color:#fff0b2;background:#9a641d
}
.treasure-chest-button.has-key .treasure-chest-lock:before{border-color:#fff0b2}
.treasure-chest-button.has-key .treasure-chest-glow{opacity:1}
.treasure-chest-button.has-key:active{transform:scale(.97)}
.treasure-chest-button.opening .treasure-chest-lid{
  transform:translate(-7px,-34px) rotate(-27deg)
}
.treasure-chest-button.opening .treasure-chest-lock{opacity:0}
.treasure-chest-button.opening .treasure-chest-glow{
  opacity:1;animation:treasureBurst 1s ease-out infinite
}
.treasure-chest-button:focus-visible{outline:3px solid #f7c85e;outline-offset:4px}
.treasure-panel .lucky-spin-message{min-height:20px;color:#c5d3df}
.treasure-panel .lucky-spin-result{min-height:34px;color:#f7d77f;font-size:20px;font-weight:900}
.treasure-panel details{text-align:left;margin-top:12px;border-top:1px solid rgba(255,255,255,.12);padding-top:12px}
.treasure-panel summary{cursor:pointer;color:#f2d58f;font-weight:700;font-size:13px}
.treasure-floating-button{
  position:fixed;z-index:998;right:14px;bottom:150px;width:58px;height:58px;
  display:grid;place-items:center;border:1px solid rgba(247,200,94,.65);
  border-radius:50%;background:linear-gradient(145deg,#f6d47e,#98621d);
  color:#fff5d4;box-shadow:0 5px 22px rgba(0,0,0,.38),0 0 17px rgba(247,200,94,.2);
  text-decoration:none;font-size:27px
}
.treasure-floating-button:active{transform:scale(.94)}
@keyframes treasurePulse{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes treasureBurst{0%{transform:scale(.8);opacity:.35}100%{transform:scale(1.25);opacity:1}}
.treasure-chest-button.shaking .treasure-chest-art{
  animation:treasureShake .85s ease-in-out;
}
.treasure-chest-button.shaking .treasure-chest-lid{
  animation:treasureLidShake .18s ease-in-out infinite alternate;
}
.treasure-chest-button.opening .treasure-chest-art{
  animation:none;
}
@keyframes treasureShake{
  0%,100%{transform:translateX(0) rotate(0)}
  15%,45%,75%{transform:translateX(-7px) rotate(-5deg)}
  30%,60%,90%{transform:translateX(7px) rotate(5deg)}
}
@keyframes treasureLidShake{
  from{transform:rotate(-3deg)}
  to{transform:rotate(3deg)}
}

@media(max-width:600px){
  body[data-current="dashboard"] .dashboard-reward-grid{grid-template-columns:1fr}
  body[data-current="dashboard"] .dashboard-reward-grid .reward-hub-card{padding:15px}
  body[data-current="dashboard"] .treasure-panel{padding:16px}
  .treasure-floating-button{right:10px;bottom:142px;width:52px;height:52px;font-size:24px}
}
@media(prefers-reduced-motion:reduce){
  .treasure-chest-button,.treasure-chest-art,.treasure-chest-lid,.treasure-chest-glow{animation:none!important;transition:none!important}
}

/* FIX: REWARD RINGKAS DAN PETI MELAYANG */
body[data-current="dashboard"] .compact-reward-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
body[data-current="dashboard"] .compact-reward-item{
  min-width:0;
  padding:12px;
  border:1px solid var(--line,#e8e5df);
  border-radius:14px;
  background:var(--surface,#fff);
}
body[data-current="dashboard"] .compact-reward-title{
  font-size:14px;
  font-weight:700;
  margin-bottom:8px;
}
body[data-current="dashboard"] .compact-reward-item .message{
  margin:6px 0;
  font-size:12px;
}
body[data-current="dashboard"] .compact-reward-item #attendanceBtn{
  width:100%;
  min-height:38px;
  padding:8px 10px;
  font-size:13px;
}
body[data-current="dashboard"] .compact-code-form{
  display:flex;
  align-items:stretch;
  flex-direction:row;
  gap:7px;
}
body[data-current="dashboard"] .compact-code-form input{
  flex:1;
  min-width:0;
  width:0;
  padding:9px 10px;
  font-size:13px;
}
body[data-current="dashboard"] .compact-code-form button{
  flex:0 0 auto;
  width:auto;
  min-width:66px;
  padding:8px 12px;
  font-size:13px;
  white-space:nowrap;
}
body[data-current="dashboard"] .treasure-floating-wrap{
  position:fixed;
  z-index:997;
  right:14px;
  bottom:235px;
  width:94px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:4px;
  padding:0;
  margin:0;
  border:0;
  background:transparent;
  box-shadow:none;
  pointer-events:none;
}
body[data-current="dashboard"] .treasure-floating-wrap .treasure-chest-button,
body[data-current="dashboard"] .treasure-floating-wrap .treasure-floating-count,
body[data-current="dashboard"] .treasure-floating-wrap .treasure-floating-label{
  pointer-events:auto;
}
body[data-current="dashboard"] .treasure-floating-wrap .treasure-chest-button{
  width:88px;
  height:82px;
  min-height:0;
  padding:0;
  margin:0;
  border:0;
  background:transparent;
  box-shadow:none;
}
body[data-current="dashboard"] .treasure-floating-wrap .treasure-chest-art{
  transform:scale(.58);
  transform-origin:center;
}
body[data-current="dashboard"] .treasure-floating-count{
  font-size:11px;
  font-weight:700;
  padding:4px 9px;
  border-radius:20px;
  background:#fff;
  color:#765a25;
  box-shadow:0 2px 10px #0002;
}
body[data-current="dashboard"] .treasure-floating-label{
  font-size:10px;
  font-weight:700;
  color:var(--text,#333);
  text-shadow:0 1px 4px #fff;
}
body[data-current="dashboard"] .treasure-floating-wrap .lucky-spin-message,
body[data-current="dashboard"] .treasure-floating-wrap .lucky-spin-result{
  position:absolute;
  right:0;
  bottom:100%;
  width:min(260px,75vw);
  font-size:12px;
  pointer-events:none;
}
@media(max-width:600px){
  body[data-current="dashboard"] .compact-reward-grid{
    grid-template-columns:1fr 1fr;
    gap:8px;
  }
  body[data-current="dashboard"] .compact-reward-item{
    padding:9px;
  }
  body[data-current="dashboard"] .compact-code-form{
    gap:5px;
  }
  body[data-current="dashboard"] .compact-code-form button{
    min-width:56px;
    padding:7px 8px;
  }
  body[data-current="dashboard"] .treasure-floating-wrap{
    right:8px;
    bottom:225px;
  }
}

/* FINAL DASHBOARD REWARD LAYOUT */
body[data-current="dashboard"] .dashboard-reward-grid{
  display:flex !important;
  flex-direction:column !important;
  gap:10px;
}
body[data-current="dashboard"] .compact-reward-item{
  width:100%;
}
body[data-current="dashboard"] .compact-code-form{
  display:flex !important;
  flex-direction:row !important;
  align-items:center;
  gap:8px;
}
body[data-current="dashboard"] .compact-code-form input{
  flex:1 1 auto;
  width:1%;
  min-width:0;
}
body[data-current="dashboard"] .compact-code-form button{
  flex:0 0 auto;
  width:auto !important;
  min-width:68px;
}
body[data-current="dashboard"] .treasure-floating-wrap{
  touch-action:none;
  cursor:grab;
  user-select:none;
  -webkit-user-select:none;
}
body[data-current="dashboard"] .treasure-floating-wrap.dragging{
  cursor:grabbing;
}

/* REDESIGN HALAMAN GAJI LEADER */
body[data-current="salary"] .salary-turnover-wrap{
  margin:8px 0 20px;
}
body[data-current="salary"] .salary-turnover-card{
  padding:22px;
  border:1px solid rgba(247,200,94,.55);
  border-radius:18px;
  background:linear-gradient(135deg,#071323,#102b48);
  box-shadow:0 8px 25px rgba(0,0,0,.16);
}
body[data-current="salary"] .salary-turnover-card .eyebrow{
  color:#f7c85e;
  font-size:12px;
  font-weight:800;
  letter-spacing:1.2px;
}
body[data-current="salary"] .salary-turnover-card .referral-turnover-value{
  color:#fff;
  font-size:clamp(28px,6vw,42px);
  text-shadow:none;
  margin:10px 0 0;
}
body[data-current="salary"] #salaryPrograms{
  display:grid;
  gap:16px;
}
body[data-current="salary"] .salary-program{
  margin:0;
  padding:18px;
  border:1px solid rgba(247,200,94,.5);
  border-radius:18px;
  background:linear-gradient(145deg,#071323,#10243b);
  box-shadow:0 8px 24px rgba(3,7,17,.15);
}
body[data-current="salary"] .salary-program:first-child{
  margin:0;
  padding:18px;
  border:1px solid rgba(247,200,94,.5);
}
body[data-current="salary"] .salary-program-head h3{
  color:#f7c85e;
  font-size:18px;
}
body[data-current="salary"] .salary-program-head p{
  color:#c5d2df;
}
body[data-current="salary"] .salary-program .list{
  display:grid;
  gap:12px;
}
body[data-current="salary"] .salary-target{
  margin:0;
  padding:16px;
  border:1px solid #e2e8f0;
  border-radius:14px;
  background:#fff;
  color:#142238;
  box-shadow:0 4px 14px rgba(0,0,0,.08);
}
body[data-current="salary"] .salary-target-head b{
  color:#10243b;
  font-size:15px;
}
body[data-current="salary"] .salary-target-head small{
  display:block;
  margin-top:5px;
  color:#64748b;
  line-height:1.5;
}
body[data-current="salary"] .salary-target-head strong{
  color:#9a6b12;
  font-size:19px;
  text-shadow:none;
}
body[data-current="salary"] .salary-progress-block{
  gap:7px;
}
body[data-current="salary"] .salary-progress-label{
  color:#26364a;
  font-size:12px;
}
body[data-current="salary"] .salary-progress-label span{
  color:#64748b;
}
body[data-current="salary"] .salary-progress-label b{
  color:#142238;
}
body[data-current="salary"] .salary-progress-track{
  height:9px;
  background:#e8edf3;
}
body[data-current="salary"] .salary-progress-track span{
  background:linear-gradient(90deg,#1677ff,#d6a83e);
  box-shadow:none;
}
body[data-current="salary"] .salary-status{
  color:#64748b;
  border-color:#cbd5e1;
  background:#f8fafc;
}
body[data-current="salary"] .salary-status.is-ready{
  color:#087443;
  border-color:#86d7ad;
  background:#e9f9f0;
}
body[data-current="salary"] .salary-status.is-paid{
  color:#087443;
  border-color:#86d7ad;
  background:#e9f9f0;
}
body[data-current="salary"] .salary-target-foot button{
  border:0;
  border-radius:9px;
  background:linear-gradient(135deg,#d6a83e,#f7d982);
  color:#172338;
  font-weight:800;
}
body[data-current="salary"] .salary-target-foot button:disabled{
  opacity:.6;
}
body[data-current="salary"] .salary-target::before,
body[data-current="salary"] .salary-program::before{
  display:none;
}
body[data-current="salary"] .salary-program:hover,
body[data-current="salary"] .salary-target:hover{
  transform:none;
}
@media(max-width:560px){
  body[data-current="salary"] .salary-program{
    padding:13px;
  }
  body[data-current="salary"] .salary-target{
    padding:13px;
  }
  body[data-current="salary"] .salary-target-head{
    flex-direction:row;
    align-items:flex-start;
  }
  body[data-current="salary"] .salary-target-head strong{
    font-size:16px;
    white-space:normal;
    text-align:right;
  }
  body[data-current="salary"] .salary-target-foot{
    align-items:center;
  }
  body[data-current="salary"] .salary-target-foot button{
    width:auto;
    min-width:112px;
  }
}

/* SALARY PAGE — HIGH CONTRAST COLOR FIX */
body[data-current="salary"] .salary-turnover-card{
  background:linear-gradient(135deg,#030711,#102b48) !important;
  border:1px solid rgba(247,200,94,.65) !important;
  color:#ffffff !important;
}
body[data-current="salary"] .salary-turnover-card::before,
body[data-current="salary"] .salary-turnover-card::after{
  display:none !important;
  content:none !important;
}
body[data-current="salary"] .salary-turnover-card .eyebrow{
  color:#f7c85e !important;
}
body[data-current="salary"] .salary-turnover-card .referral-turnover-value{
  color:#ffffff !important;
  font-weight:950 !important;
  text-shadow:0 2px 12px rgba(38,215,255,.2) !important;
}
body[data-current="salary"] .salary-program-head h3{
  color:#ffffff !important;
  font-weight:850 !important;
}
body[data-current="salary"] .salary-program-head p{
  color:#cbd9e8 !important;
}
body[data-current="salary"] .salary-target-head b{
  color:#10243b !important;
}
body[data-current="salary"] .salary-target-head small{
  color:#40536a !important;
}
body[data-current="salary"] .salary-target-head strong{
  color:#946500 !important;
  font-weight:950 !important;
}
body[data-current="salary"] .salary-progress-label,
body[data-current="salary"] .salary-progress-label span{
  color:#40536a !important;
}
body[data-current="salary"] .salary-progress-label b{
  color:#10243b !important;
  font-weight:850 !important;
}
body[data-current="salary"] .salary-status{
  color:#40536a !important;
}

/* CLOTHINGFACTORY — DEPOSIT PAYMENT METHOD CARDS */
body[data-current="deposit"] .payment-method-native{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  pointer-events:none !important;
}
body[data-current="deposit"] .payment-method-field{
  display:grid;
  gap:10px;
}
body[data-current="deposit"] .payment-method-label{
  font-size:13px;
  font-weight:800;
  color:var(--text,#fff);
}
body[data-current="deposit"] .payment-method-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
body[data-current="deposit"] .payment-method-card{
  display:flex;
  min-width:0;
  min-height:155px;
  padding:13px 9px;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:9px;
  border:1px solid rgba(148,163,184,.28);
  border-radius:16px;
  background:linear-gradient(145deg,#10243b,#030711);
  color:#fff;
  text-align:center;
  cursor:pointer;
  transition:border-color .2s,box-shadow .2s,transform .2s;
}
body[data-current="deposit"] .payment-method-card:active{
  transform:scale(.98);
}
body[data-current="deposit"] .payment-method-card.is-selected{
  border:2px solid #f7c85e;
  box-shadow:0 0 0 2px rgba(247,200,94,.12),0 8px 22px rgba(0,0,0,.25);
  background:linear-gradient(145deg,#183653,#071323);
}
body[data-current="deposit"] .payment-method-logo{
  display:grid;
  place-items:center;
  width:58px;
  height:42px;
  border-radius:10px;
  font-size:22px;
  font-weight:950;
}
body[data-current="deposit"] .qris-logo{
  background:#fff;
  color:#1677ff;
  letter-spacing:-1px;
  font-style:italic;
}
body[data-current="deposit"] .bank-logo{
  background:rgba(247,200,94,.13);
  color:#f7c85e;
  font-size:27px;
}
body[data-current="deposit"] .payment-method-card strong{
  color:#fff;
  font-size:14px;
}
body[data-current="deposit"] .payment-method-card small{
  color:#cbd5e1;
  font-size:10px;
  line-height:1.4;
}
body[data-current="deposit"] .payment-method-state{
  color:#f7c85e;
  font-size:10px;
  font-weight:800;
}
body[data-current="deposit"] .payment-method-card.is-disabled{
  opacity:.45;
  cursor:not-allowed;
  filter:grayscale(1);
}
@media(max-width:380px){
  body[data-current="deposit"] .payment-method-grid{gap:7px}
  body[data-current="deposit"] .payment-method-card{padding:10px 5px;min-height:145px}
}

/* =====================================================
   CLOTHINGFACTORY — PREMIUM THEME REFINEMENT
   Global visual layer | November 2026
   ===================================================== */

:root{
  --bg:#080f1c;
  --bg2:#0c1929;
  --panel:#111f30;
  --line:rgba(145,174,205,.16);
  --cyan:#45c9e8;
  --blue:#2878d0;
  --gold:#e9bd62;
  --text:#edf3fa;
  --muted:#a4b3c4;
  --green:#55c99a;
  --red:#e87988;
  --shadow:0 12px 32px rgba(0,0,0,.20);
}

body{
  background:
    radial-gradient(circle at 85% 0%,rgba(40,120,208,.09),transparent 32%),
    linear-gradient(180deg,#080f1c 0%,#0b1421 55%,#080f1c 100%);
  color:var(--text);
}

.topbar{
  background:rgba(8,15,28,.94);
  border-bottom-color:rgba(145,174,205,.13);
}

.app-nav{
  background:rgba(12,25,41,.88);
  border-bottom-color:rgba(145,174,205,.10);
}

.app-nav a{
  color:#b0bdcc;
}

.app-nav a.active,
.app-nav a:hover{
  background:rgba(69,201,232,.09);
  border-color:rgba(69,201,232,.25);
  color:#eafaff;
}

.panel,.stat,.card,.admin-section{
  background:linear-gradient(145deg,#142438,#101d2d);
  border-color:rgba(145,174,205,.16);
  box-shadow:var(--shadow);
}

.panel:before,.stat:before{
  background:linear-gradient(120deg,rgba(255,255,255,.018),transparent 55%);
}

.stat.primary-stat{
  background:linear-gradient(135deg,#15395b,#10243a);
  border-color:rgba(69,201,232,.24);
}

.package,.arbitrage-card{
  background:linear-gradient(145deg,#172b40,#101d2d);
  border-color:rgba(145,174,205,.19);
}

button,.btn{
  border-radius:11px;
  transition:background .2s,border-color .2s,transform .2s,filter .2s;
}

.primary,.btn{
  background:linear-gradient(110deg,#2878d0,#269dbd);
  box-shadow:0 5px 16px rgba(40,120,208,.16);
}

.primary:hover,.btn:hover{
  filter:brightness(1.08);
}

.ghost,.secondary{
  background:#1a2b3e;
  border-color:rgba(145,174,205,.2);
  color:#e7eff8;
}

.gold{
  background:linear-gradient(120deg,#f0cf83,#dcae4f);
  color:#252b33;
}

input,select,textarea{
  background:#0c1928;
  border-color:rgba(145,174,205,.23);
  color:#edf3fa;
}

input:focus,select:focus,textarea:focus{
  border-color:var(--cyan);
  box-shadow:0 0 0 3px rgba(69,201,232,.09);
}

input::placeholder,textarea::placeholder{
  color:#8294a8;
}

.list-item,.ticker>div{
  background:rgba(10,23,37,.62);
  border-color:rgba(145,174,205,.14);
}

th,td{
  border-bottom-color:rgba(145,174,205,.13);
}

th{
  color:#a9bacb;
}

td{
  color:#e0e9f2;
}

.pill{
  border-color:rgba(69,201,232,.22);
  color:#79d8ed;
}

.pill.good{
  color:#70d7ad;
  border-color:rgba(85,201,154,.25);
}

.pill.pending{
  color:#e9c778;
  border-color:rgba(233,189,98,.25);
}

.pill.bad{
  color:#ed929e;
  border-color:rgba(232,121,136,.25);
}

.message,.notice{
  background:rgba(69,201,232,.055);
  border-color:rgba(69,201,232,.17);
  color:#d5eaf2;
}

.message.success{
  background:rgba(85,201,154,.07);
}

.message.error{
  background:rgba(232,121,136,.07);
}

.hero{
  background:
    radial-gradient(circle at 85% 20%,rgba(40,120,208,.20),transparent 36%),
    linear-gradient(115deg,#142b43,#0a1422 72%);
  border-color:rgba(69,201,232,.19);
  box-shadow:0 16px 48px rgba(0,0,0,.24);
}

.hero:after{
  color:rgba(69,201,232,.045);
  text-shadow:none;
}

.logo-orb{
  background:linear-gradient(145deg,#183c59,#102033);
  box-shadow:none;
}

.member-quick-link{
  background:linear-gradient(145deg,#172b40,#101d2d);
  border-color:rgba(145,174,205,.17);
}

.member-quick-icon{
  background:rgba(69,201,232,.07);
  border-color:rgba(69,201,232,.18);
}

.member-quick-link:hover{
  border-color:var(--cyan);
}

.bottom-nav{
  background:rgba(8,16,29,.97);
  border-top-color:rgba(145,174,205,.18);
  box-shadow:0 -8px 24px rgba(0,0,0,.22);
}

.bottom-nav a.active{
  background:rgba(69,201,232,.08);
  text-shadow:none;
}

.member-floating-contact{
  background:#172b40;
  border-color:rgba(69,201,232,.28);
  box-shadow:0 6px 20px rgba(0,0,0,.25);
}

.toast{
  background:#172b40;
  border-color:rgba(145,174,205,.2);
}

.footer{
  border-top-color:rgba(145,174,205,.12);
  color:#91a3b6;
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    scroll-behavior:auto!important;
    transition:none!important;
    animation:none!important;
  }
}


/* PREMIUM THEME — DASHBOARD COLOR OVERRIDE */
body[data-current="dashboard"] .stat-grid .primary-stat{
  background:linear-gradient(135deg,#183b5b,#10243a)!important;
  border:1px solid rgba(69,201,232,.28)!important;
  box-shadow:0 12px 30px rgba(0,0,0,.22)!important;
}

body[data-current="dashboard"] .stat-grid .primary-stat strong{
  color:#f0cb78!important;
}

body[data-current="dashboard"] .stat-grid .primary-stat span,
body[data-current="dashboard"] .stat-grid .primary-stat small{
  color:#c4d5e5!important;
}

body[data-current="dashboard"] .stat-grid .stat:not(.primary-stat){
  background:linear-gradient(145deg,#172b40,#101d2d)!important;
  border:1px solid rgba(145,174,205,.17)!important;
}

body[data-current="dashboard"] .stat-grid .stat:not(.primary-stat) strong{
  color:#edf3fa!important;
}

body[data-current="dashboard"] .stat-grid .stat:not(.primary-stat) span,
body[data-current="dashboard"] .stat-grid .stat:not(.primary-stat) small{
  color:#a9bacb!important;
}

body[data-current="dashboard"] .page-heading h1 .accent{
  color:#45c9e8!important;
}


/* =====================================================
   CLOTHINGFACTORY — PREMIUM CLEAN LIGHT THEME
   Global member + admin
   ===================================================== */

:root{
  --bg:#ffffff;
  --bg2:#ffffff;
  --panel:#ffffff;
  --line:#e5e7eb;
  --cyan:#1677ff;
  --blue:#1677ff;
  --gold:#d6a63b;
  --text:#000000;
  --muted:#555555;
  --green:#16a36a;
  --red:#dc3545;
  --shadow:0 5px 20px rgba(15,23,42,.055);
}

html,body{
  background:#ffffff!important;
  color:#000000!important;
}

body{
  background:#ffffff!important;
}

.topbar,.app-nav,.bottom-nav{
  background:#ffffff!important;
  border-color:#e5e7eb!important;
  box-shadow:0 2px 10px rgba(0,0,0,.035);
}

.brandmark,.brandmark:visited{
  color:#000000!important;
}

.brandmark small{
  color:#b18425!important;
}

.logo-orb{
  background:#f4f7fb!important;
  color:#1677ff!important;
  border-color:#dce5f0!important;
  box-shadow:none!important;
}

.app-nav a,.bottom-nav a{
  color:#555555!important;
}

.app-nav a.active,.app-nav a:hover,
.bottom-nav a.active{
  background:#edf5ff!important;
  border-color:#c9ddf8!important;
  color:#1677ff!important;
  text-shadow:none!important;
}

.main,.footer{
  color:#000000;
}

.page-heading h1,.section-head h2,
.panel h2,.panel h3,
.stat strong,.list-item b,
.list-item strong{
  color:#000000;
}

.page-heading p,.muted,
.stat span,.stat small,
.list-item small,.footer{
  color:#555555!important;
}

.panel,.stat,.card,.admin-section,
.package,.arbitrage-card{
  background:#ffffff!important;
  color:#000000!important;
  border:1px solid #e5e7eb!important;
  box-shadow:0 5px 20px rgba(15,23,42,.055)!important;
}

.panel:before,.stat:before{
  display:none!important;
}

.stat.primary-stat,
body[data-current="dashboard"] .stat-grid .primary-stat{
  background:#ffffff!important;
  border:1px solid #e5e7eb!important;
}

.stat.primary-stat strong,
body[data-current="dashboard"] .stat-grid .primary-stat strong{
  color:#d6a63b!important;
}

.stat.primary-stat span,
.stat.primary-stat small{
  color:#555555!important;
}

.stat:not(.primary-stat) strong{
  color:#000000!important;
}

input,select,textarea{
  background:#ffffff!important;
  color:#000000!important;
  border:1px solid #d1d5db!important;
}

input::placeholder,textarea::placeholder{
  color:#777777!important;
}

select option{
  background:#ffffff!important;
  color:#000000!important;
}

label{
  color:#222222!important;
}

.ghost,.secondary{
  background:#f3f6fa!important;
  color:#222222!important;
  border:1px solid #dce2e9!important;
}

.primary,.btn{
  background:#1677ff!important;
  color:#ffffff!important;
  border-color:#1677ff!important;
  box-shadow:0 4px 12px rgba(22,119,255,.13)!important;
}

.gold{
  background:#f4d98f!important;
  color:#332500!important;
}

a{
  color:#1677ff;
}

.list-item,.ticker>div,
.arbitrage-price{
  background:#ffffff!important;
  border-color:#e5e7eb!important;
  color:#000000!important;
}

table{
  color:#000000;
}

th{
  color:#555555!important;
  background:#f8fafc;
}

td{
  color:#222222!important;
}

th,td{
  border-bottom-color:#e5e7eb!important;
}

.message,.notice{
  background:#eff6ff!important;
  color:#183b62!important;
  border-color:#d5e7ff!important;
}

.message.success{
  background:#ecfdf5!important;
  color:#166534!important;
  border-color:#bbf7d0!important;
}

.message.error{
  background:#fef2f2!important;
  color:#991b1b!important;
  border-color:#fecaca!important;
}

.pill{
  background:#eff6ff;
  color:#1677ff!important;
  border-color:#d5e7ff!important;
}

.pill.good{
  background:#ecfdf5;
  color:#16804f!important;
}

.pill.pending{
  background:#fffbeb;
  color:#946500!important;
}

.pill.bad{
  background:#fef2f2;
  color:#dc3545!important;
}

.hero{
  background:linear-gradient(120deg,#f4f8ff,#ffffff)!important;
  border:1px solid #dce7f5!important;
  box-shadow:0 8px 28px rgba(15,23,42,.05)!important;
}

.hero h1,.hero h1 span{
  color:#000000!important;
}

.hero p{
  color:#555555!important;
}

.hero:after{
  color:rgba(22,119,255,.035)!important;
  text-shadow:none!important;
}

.member-quick-link{
  background:#ffffff!important;
  color:#222222!important;
  border:1px solid #e5e7eb!important;
  box-shadow:0 3px 12px rgba(15,23,42,.035);
}

.member-quick-icon{
  background:#eff6ff!important;
  color:#1677ff!important;
  border-color:#d5e7ff!important;
}

.member-floating-contact{
  background:#ffffff!important;
  color:#111111!important;
  border:1px solid #dce2e9!important;
  box-shadow:0 5px 18px rgba(0,0,0,.12)!important;
}

.member-floating-contact svg{
  color:#1677ff!important;
}

.toast{
  background:#ffffff!important;
  color:#000000!important;
  border:1px solid #e5e7eb!important;
  box-shadow:0 8px 28px rgba(0,0,0,.12)!important;
}

.empty-state{
  color:#555555!important;
  border-color:#d1d5db!important;
}

.footer{
  border-top-color:#e5e7eb!important;
}

@media(max-width:760px){
  .bottom-nav{
    background:#ffffff!important;
    border-top:1px solid #e5e7eb!important;
  }
}


/* PREMIUM GOLDEN TREASURE CHEST */
body[data-current="dashboard"] .treasure-floating-wrap .treasure-chest-button{
  overflow:visible;
  perspective:700px;
}

body[data-current="dashboard"] .treasure-floating-wrap .treasure-chest-art{
  width:142px;
  height:112px;
  filter:drop-shadow(0 9px 9px rgba(0,0,0,.5));
}

.treasure-chest-art:before{
  content:"";
  position:absolute;
  z-index:0;
  inset:-25px -30px;
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(255,197,67,.32),rgba(255,180,30,.09) 42%,transparent 72%);
  opacity:.8;
  pointer-events:none;
}

.treasure-chest-body{
  z-index:1;
  border:5px solid #e6b84e;
  border-radius:7px 7px 14px 14px;
  background:
    linear-gradient(90deg,transparent 44%,rgba(255,218,119,.28) 49%,rgba(75,35,9,.3) 53%,transparent 58%),
    repeating-linear-gradient(0deg,rgba(255,220,145,.08) 0 3px,rgba(49,23,9,.16) 4px 7px),
    linear-gradient(110deg,#7a3d16,#3b1b0d 35%,#98501b 68%,#321709);
  box-shadow:
    inset 0 5px 10px rgba(255,220,140,.25),
    inset 0 -8px 12px rgba(0,0,0,.5),
    0 5px 0 #754416,
    0 10px 16px rgba(0,0,0,.5);
}

.treasure-chest-body:before{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  top:0;
  bottom:0;
  border-left:4px solid #e9bd5c;
  border-right:4px solid #e9bd5c;
  box-shadow:inset 2px 0 rgba(255,255,255,.2),2px 0 rgba(0,0,0,.25);
}

.treasure-chest-body:after{
  content:"";
  position:absolute;
  left:5px;
  right:5px;
  top:7px;
  height:5px;
  background:linear-gradient(90deg,#a66b22,#fff0a3,#b77a27);
  box-shadow:0 42px 0 rgba(239,190,83,.75);
}

.treasure-chest-lid{
  z-index:2;
  border:5px solid #f4d477;
  border-radius:45px 45px 7px 7px;
  background:
    linear-gradient(90deg,transparent 43%,rgba(255,242,181,.35) 49%,rgba(96,54,12,.3) 53%,transparent 58%),
    repeating-linear-gradient(0deg,rgba(255,255,255,.08) 0 3px,rgba(87,47,12,.13) 4px 7px),
    linear-gradient(145deg,#b77b2b,#51280f 48%,#e4ad48);
  box-shadow:
    inset 0 7px 10px rgba(255,244,190,.4),
    inset 0 -5px 8px rgba(0,0,0,.4),
    0 4px 0 #704414,
    0 6px 12px rgba(0,0,0,.35);
}

.treasure-chest-lid:before{
  content:"";
  position:absolute;
  left:8px;
  right:8px;
  top:5px;
  height:5px;
  border-radius:5px;
  background:linear-gradient(90deg,#9b641f,#fff1a8,#c58a32);
  box-shadow:0 24px 0 rgba(255,219,120,.75);
}

.treasure-chest-lid:after{
  content:"";
  position:absolute;
  left:50%;
  top:5px;
  width:17px;
  height:17px;
  transform:translateX(-50%);
  border:2px solid #fff0a5;
  border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#fff8cf,#c18a30 65%,#704314);
  box-shadow:0 0 8px rgba(255,215,100,.65);
}

.treasure-chest-lock{
  z-index:4;
  left:61px;
  top:48px;
  width:20px;
  height:27px;
  border:3px solid #fff0a5;
  border-radius:5px;
  background:linear-gradient(135deg,#fff1a5,#d69b32 45%,#754315);
  box-shadow:0 2px 7px #1b0e05,inset 0 1px 3px #fff8d2;
}

.treasure-chest-lock:after{
  content:"";
  position:absolute;
  left:5px;
  top:8px;
  width:4px;
  height:8px;
  border-radius:4px;
  background:#60370f;
  box-shadow:0 0 4px #fff0a5;
}

.treasure-chest-glow{
  z-index:0;
  inset:-25px;
  background:radial-gradient(ellipse,rgba(255,226,130,.65),rgba(255,174,37,.2) 42%,transparent 72%);
  filter:blur(3px);
  opacity:.8;
}

.treasure-chest-button.has-key{
  box-shadow:0 0 20px rgba(255,190,57,.25);
}

.treasure-chest-button.has-key .treasure-chest-art{
  filter:drop-shadow(0 0 8px rgba(255,196,64,.45));
}

.treasure-chest-button.opening .treasure-chest-glow{
  background:radial-gradient(ellipse,rgba(255,246,190,.95),rgba(255,190,55,.5) 40%,transparent 72%);
}

.treasure-chest-button.opening .treasure-chest-lid{
  box-shadow:0 0 20px rgba(255,218,120,.8);
}

.treasure-chest-button.shaking .treasure-chest-art{
  animation:treasureShakePremium .85s ease-in-out;
}

.treasure-chest-button.shaking .treasure-chest-lid{
  animation:treasureLidShake .18s ease-in-out infinite alternate;
}

@keyframes treasurePulse{
  0%,100%{transform:translateY(0) scale(.58)}
  50%{transform:translateY(-5px) scale(.58)}
}

@keyframes treasureShakePremium{
  0%,100%{transform:translateX(0) rotate(0) scale(.58)}
  15%,45%,75%{transform:translateX(-7px) rotate(-5deg) scale(.58)}
  30%,60%,90%{transform:translateX(7px) rotate(5deg) scale(.58)}
}

@media(prefers-reduced-motion:reduce){
  .treasure-chest-button.shaking .treasure-chest-art,
  .treasure-chest-button.shaking .treasure-chest-lid{
    animation:none!important;
  }
}

/* PREMIUM CONGRATULATIONS AND PRIZE REVEAL */
#luckySpinNotice .lucky-notice-card{
  border:1px solid rgba(247,200,94,.75);
  background:
    radial-gradient(ellipse at 50% 0%,rgba(247,200,94,.18),transparent 55%),
    linear-gradient(145deg,#081526,#102033 60%,#171d28);
  box-shadow:0 0 45px rgba(247,200,94,.2),inset 0 0 25px rgba(247,200,94,.04);
}

#luckySpinNotice .lucky-notice-title{
  font-size:30px;
  font-weight:1000;
  letter-spacing:3px;
  color:#f7d77f;
  background:linear-gradient(180deg,#fff8d6 5%,#f9d978 38%,#c18a2b 75%,#fff0ae);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  filter:drop-shadow(0 2px 8px rgba(247,200,94,.35));
  animation:goldTitleReveal .8s ease-out both,goldTitleShine 3s ease-in-out 1s infinite;
}

#luckySpinNotice .lucky-notice-icon{
  filter:drop-shadow(0 0 12px rgba(255,210,90,.65));
  animation:keyIconFloat 2s ease-in-out infinite;
}

#luckySpinNotice .lucky-notice-count{
  color:#fff0ae;
  border-color:rgba(247,200,94,.55);
  background:linear-gradient(135deg,rgba(247,200,94,.2),rgba(247,200,94,.06));
  box-shadow:0 0 18px rgba(247,200,94,.12);
}

#luckySpinNotice .lucky-notice-close{
  border:1px solid #e9bd5c;
  background:linear-gradient(110deg,#a66b20,#f2d27b,#a66b20);
  color:#291908;
  font-weight:900;
  box-shadow:0 4px 16px rgba(247,200,94,.2);
}

body[data-current="dashboard"] .treasure-floating-wrap .lucky-spin-result{
  z-index:10;
  width:min(280px,82vw);
  padding:12px 15px;
  border:1px solid rgba(255,220,130,.8);
  border-radius:15px;
  background:
    radial-gradient(ellipse at 50% 0%,rgba(255,224,145,.2),transparent 70%),
    linear-gradient(145deg,#101d2e,#07111f);
  color:#ffe69a;
  font-size:19px;
  font-weight:1000;
  line-height:1.5;
  letter-spacing:.5px;
  text-align:center;
  text-shadow:0 0 12px rgba(255,207,91,.5);
  box-shadow:0 0 25px rgba(255,190,55,.3);
  animation:prizeReveal .7s cubic-bezier(.16,1,.3,1) both;
}

@keyframes goldTitleReveal{
  from{opacity:0;transform:translateY(12px) scale(.85)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

@keyframes goldTitleShine{
  0%,100%{filter:drop-shadow(0 2px 7px rgba(247,200,94,.25))}
  50%{filter:drop-shadow(0 2px 15px rgba(255,226,139,.8))}
}

@keyframes keyIconFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-5px)}
}

@keyframes prizeReveal{
  0%{opacity:0;transform:translateY(18px) scale(.75)}
  70%{opacity:1;transform:translateY(-3px) scale(1.04)}
  100%{opacity:1;transform:translateY(0) scale(1)}
}

@media(prefers-reduced-motion:reduce){
  #luckySpinNotice .lucky-notice-title,
  #luckySpinNotice .lucky-notice-icon,
  body[data-current="dashboard"] .treasure-floating-wrap .lucky-spin-result{
    animation:none!important;
  }
}

/* FIX TREASURE FLOATING LABEL AND EMPTY MESSAGE */
body[data-current="dashboard"] .treasure-floating-wrap .lucky-spin-message:empty,
body[data-current="dashboard"] .treasure-floating-wrap .lucky-spin-result:empty{
  display:none!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

body[data-current="dashboard"] .treasure-floating-wrap .treasure-floating-label{
  display:inline-block;
  min-width:78px;
  padding:5px 10px;
  border:1px solid rgba(247,200,94,.65);
  border-radius:20px;
  background:linear-gradient(135deg,#17283b,#091421);
  color:#ffe39a!important;
  font-size:10px;
  font-weight:900;
  letter-spacing:1px;
  text-align:center;
  text-shadow:0 1px 5px rgba(247,200,94,.45);
  box-shadow:0 3px 12px rgba(0,0,0,.3),0 0 10px rgba(247,200,94,.12);
}

body[data-current="dashboard"] .treasure-floating-count{
  border:1px solid rgba(247,200,94,.55);
  background:linear-gradient(135deg,#fff8df,#f3d98f);
  color:#654514;
  font-weight:900;
}
