:root{
  --glow: rgba(122,162,255,.22);
  --glow2: rgba(155,123,255,.18);
}

body{
  background:
    radial-gradient(900px 520px at 12% 8%, var(--glow) 0%, rgba(5,7,17,0) 58%),
    radial-gradient(880px 520px at 88% 12%, var(--glow2) 0%, rgba(5,7,17,0) 60%),
    radial-gradient(900px 560px at 50% 102%, rgba(43,212,189,.10) 0%, rgba(5,7,17,0) 62%),
    linear-gradient(180deg, #050711 0%, #070b16 55%, #050711 100%) !important;
}

.card, .panel, .topbar, .sidebar{
  border-color: rgba(255,255,255,.11) !important;
  box-shadow: 0 22px 90px rgba(0,0,0,.30) !important;
}

.card, .panel{
  backdrop-filter: blur(18px) saturate(120%) !important;
}

.btn, .btn2, .bigBtn, .linkBtn, .tab, .pill, .chip, .select, input, select{
  transition: transform .12s ease, filter .12s ease, border-color .12s ease, background .12s ease, box-shadow .12s ease;
}

.btn:hover, .btn2:hover, .bigBtn:hover, .linkBtn:hover{
  transform: translateY(-1px);
  border-color: rgba(122,162,255,.28) !important;
  box-shadow: 0 14px 40px rgba(0,0,0,.22);
  filter: brightness(1.05);
}

.btn:active, .btn2:active, .bigBtn:active, .linkBtn:active{
  transform: translateY(0px) scale(.99);
  filter: brightness(.98);
}

.tab.active{
  box-shadow: 0 10px 35px rgba(122,162,255,.10);
}

.tbl tr:hover, .table tr:hover{
  background: rgba(122,162,255,.06);
}

input:focus, select:focus{
  border-color: rgba(122,162,255,.42) !important;
  box-shadow: 0 0 0 6px rgba(122,162,255,.10);
}

::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background: rgba(255,255,255,.14); border-radius: 999px}
::-webkit-scrollbar-thumb:hover{background: rgba(122,162,255,.26)}
::-webkit-scrollbar-track{background: rgba(7,11,22,.22)}