/* ===== v73 : NEW SIDE MENU (floating panel, gradient SVG icons, no emoji) ===== */
@keyframes gksDrIn{from{opacity:0;transform:translateX(-14px)}to{opacity:1;transform:none}}
@keyframes gksDrSheen{from{background-position:-160% 0}to{background-position:260% 0}}

/* panel */
#gks-side-drawer#gks-side-drawer{
  left:10px!important;top:10px!important;bottom:10px!important;height:auto!important;
  width:min(84vw,330px)!important;max-width:330px!important;
  border:1px solid rgba(149,95,211,.30)!important;border-radius:30px!important;
  background:
    radial-gradient(120% 60% at 0% 0%,rgba(149,95,211,.14),transparent 55%),
    radial-gradient(100% 50% at 100% 100%,rgba(241,151,99,.16),transparent 60%),
    linear-gradient(180deg,#1f122e 0%,#170d22 55%,#100918 100%)!important;
  box-shadow:0 30px 70px rgba(0,0,0,.65),0 0 0 1px rgba(255,255,255,.04) inset,0 0 36px rgba(149,95,211,.08)!important;
  padding:12px 10px 14px!important;overflow-x:hidden!important;overflow-y:auto!important;
  transform:translate3d(calc(-100% - 24px),0,0)!important;
  transition:transform .34s cubic-bezier(.22,.9,.24,1)!important;
}
#gks-side-drawer#gks-side-drawer.active{transform:none!important}
#gks-side-drawer#gks-side-drawer::-webkit-scrollbar{width:0}

/* profile card */
#gks-side-drawer#gks-side-drawer .gks-drawer-head{
  position:relative!important;display:flex!important;align-items:center!important;gap:12px!important;
  margin:0 0 6px!important;padding:14px 12px!important;border:1px solid rgba(255,255,255,.07)!important;border-radius:22px!important;
  background:linear-gradient(135deg,rgba(149,95,211,.20),rgba(247,154,100,.14) 55%,rgba(238,109,34,.08))!important;
  overflow:hidden!important;
}
#gks-side-drawer#gks-side-drawer .gks-drawer-head::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.10) 50%,transparent 65%);background-size:220% 100%;
  animation:gksDrSheen 5.5s ease-in-out infinite;
}
#gks-side-drawer#gks-side-drawer .gks-drawer-avatar-wrap{
  width:54px!important;height:54px!important;flex:0 0 54px!important;padding:2.5px!important;border-radius:50%!important;
  background:conic-gradient(from 200deg,#bb8df0,#6d2fb4,#a85cff,#8122ee,#bb8df0)!important;box-shadow:0 6px 18px rgba(0,0,0,.4)!important;
}
#gks-side-drawer#gks-side-drawer .gks-drawer-avatar{border-radius:50%!important;border:2px solid #180e23!important;width:100%!important;height:100%!important;object-fit:cover!important}
#gks-side-drawer#gks-side-drawer .gks-drawer-user{flex:1!important;min-width:0!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:4px!important}
#gks-side-drawer#gks-side-drawer .gks-drawer-user strong{font:800 16px/1.1 Inter,system-ui,sans-serif!important;color:#fff!important;max-width:100%!important;letter-spacing:.01em!important}
#gks-side-drawer#gks-side-drawer .gks-drawer-user span{
  margin:0!important;padding:3px 9px!important;border-radius:999px!important;font:800 9px/1.2 Inter,system-ui,sans-serif!important;letter-spacing:.14em!important;
  color:#0e0519!important;background:linear-gradient(90deg,#bb8df0,#9e6dd5)!important;border:0!important;
}
#gks-side-drawer#gks-side-drawer .gks-drawer-user small{
  margin:2px 0 0!important;padding:4px 10px!important;border-radius:10px!important;font:800 12px/1 'JetBrains Mono',ui-monospace,monospace!important;
  color:#7ef0c4!important;background:rgba(0,0,0,.28)!important;border:1px solid rgba(126,240,196,.25)!important;
}
#gks-side-drawer#gks-side-drawer .gks-drawer-close{
  position:relative!important;z-index:2;width:36px!important;height:36px!important;flex:0 0 36px!important;border-radius:12px!important;
  background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.12)!important;color:#dfe6f7!important;font-size:22px!important;transition:transform .15s,background .15s!important;
}
#gks-side-drawer#gks-side-drawer .gks-drawer-close:active{transform:scale(.88)!important;background:rgba(255,255,255,.18)!important}

/* section labels */
#gks-side-drawer#gks-side-drawer .gks-drawer-section{
  display:flex!important;align-items:center!important;gap:10px!important;padding:16px 14px 6px!important;
  font:800 10px/1 'JetBrains Mono',ui-monospace,monospace!important;letter-spacing:.28em!important;color:#9e6dd5!important;
}
#gks-side-drawer#gks-side-drawer .gks-drawer-section::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(149,95,211,.45),transparent)}

/* items */
#gks-side-drawer#gks-side-drawer .gks-drawer-item{
  position:relative!important;display:flex!important;align-items:center!important;gap:13px!important;
  margin:3px 0!important;min-height:58px!important;padding:8px 12px 8px 10px!important;border-radius:18px!important;
  background:rgba(255,255,255,.03)!important;border:1px solid rgba(255,255,255,.05)!important;color:#f4f7ff!important;cursor:pointer!important;
  transition:transform .16s ease,background .2s,border-color .2s,box-shadow .2s!important;
}
#gks-side-drawer#gks-side-drawer.active .gks-drawer-item{animation:gksDrIn .38s cubic-bezier(.2,.9,.3,1) both;animation-delay:calc(var(--i,0)*28ms + 60ms)}
#gks-side-drawer#gks-side-drawer .gks-drawer-item:active{transform:scale(.97)!important;background:rgba(255,255,255,.07)!important}
#gks-side-drawer#gks-side-drawer .gks-drawer-item::after{
  content:"";flex:0 0 auto;width:8px;height:8px;margin-left:auto;border-right:2px solid rgba(255,255,255,.35);border-top:2px solid rgba(255,255,255,.35);
  transform:rotate(45deg);border-radius:1px;background:none!important;font-size:0!important;
}
#gks-side-drawer#gks-side-drawer .gks-drawer-item.gks-active{
  background:linear-gradient(90deg,rgba(149,95,211,.22),rgba(149,95,211,.05) 70%)!important;border-color:rgba(149,95,211,.55)!important;
  box-shadow:0 8px 22px rgba(0,0,0,.35),0 0 20px rgba(149,95,211,.12)!important;
}
#gks-side-drawer#gks-side-drawer .gks-drawer-item.gks-active::before{
  content:"";position:absolute;left:-1px;top:14px;bottom:14px;width:4px;border-radius:0 4px 4px 0;background:linear-gradient(180deg,#bb8df0,#9e6dd5);box-shadow:0 0 12px rgba(187,141,240,.7);
}
#gks-side-drawer#gks-side-drawer .gks-drawer-item.gks-active::after{border-color:#bb8df0}

/* text block */
#gks-side-drawer .gks-txw{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
#gks-side-drawer#gks-side-drawer .gks-txw>span{font:800 15px/1.15 Inter,system-ui,sans-serif!important;color:#fff!important;letter-spacing:.005em!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#gks-side-drawer .gks-txw>small{font:500 11px/1.2 Inter,system-ui,sans-serif;color:#b8a88f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* icon tile */
#gks-side-drawer .gks-ic{
  position:relative;flex:0 0 42px;width:42px;height:42px;border-radius:14px;display:grid;place-items:center;
  background:linear-gradient(145deg,var(--c1,#a563f1),var(--c2,#7c38ca));
  box-shadow:0 8px 16px -6px var(--c1,#a563f1),inset 0 1px 0 rgba(255,255,255,.35);
}
#gks-side-drawer .gks-ic::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(160deg,rgba(255,255,255,.28),transparent 45%);pointer-events:none}
#gks-side-drawer .gks-ic svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 1px 2px rgba(0,0,0,.35))}
#gks-side-drawer .gks-ic[data-k="dashboard"]{--c1:#a458fb;--c2:#f2622f}
#gks-side-drawer .gks-ic[data-k="home"]{--c1:#a78bfa;--c2:#ec4899}
#gks-side-drawer .gks-ic[data-k="add-money"]{--c1:#8122ee;--c2:#2563eb}
#gks-side-drawer .gks-ic[data-k="history"]{--c1:#9f51f8;--c2:#690bd4}
#gks-side-drawer .gks-ic[data-k="api"]{--c1:#34d399;--c2:#047857}
#gks-side-drawer .gks-ic[data-k="referral"]{--c1:#fb7185;--c2:#be123c}
#gks-side-drawer .gks-ic[data-k="support"]{--c1:#60a5fa;--c2:#9046e5}
#gks-side-drawer .gks-ic[data-k="notifications"]{--c1:#fb923c;--c2:#e11d48}
#gks-side-drawer .gks-ic[data-k="profile"]{--c1:#d7b5fd;--c2:#6d28d9}
#gks-side-drawer .gks-ic[data-k="logout"]{--c1:#f87171;--c2:#991b1b}

/* divider + logout */
#gks-side-drawer#gks-side-drawer .gks-drawer-divider{height:1px!important;margin:14px 8px 10px!important;background:linear-gradient(90deg,transparent,rgba(255,255,255,.14),transparent)!important;border:0!important}
#gks-side-drawer#gks-side-drawer .gks-drawer-item.logout{background:rgba(248,113,113,.07)!important;border-color:rgba(248,113,113,.28)!important}
#gks-side-drawer#gks-side-drawer .gks-drawer-item.logout .gks-txw>span{color:#ff9a9a!important}
#gks-side-drawer#gks-side-drawer .gks-drawer-item.logout::after{border-color:rgba(255,154,154,.6)}

/* hide leftovers of the old emoji / font icons */
#gks-side-drawer#gks-side-drawer .gks-drawer-item>i,#gks-side-drawer#gks-side-drawer .gks-drawer-item>.gks-emo,#gks-side-drawer#gks-side-drawer .gks-drawer-item .gks-emo{display:none!important;visibility:hidden!important;width:0!important;height:0!important;flex:0 0 0!important;margin:0!important;padding:0!important;border:0!important}

/* nicer dim behind the panel */
#gks-menu-backdrop.gks-open,#gks-menu-backdrop.active{background:radial-gradient(80% 60% at 20% 30%,rgba(44,26,65,.55),rgba(8,4,12,.78))!important}