/* Base + legend */
.grt-wrap {
  --bg: #0a0b10;
  --panel: #0f1124;
  --text: #cbd5e1;
  --muted: #8691b0;
  --vip1: #00e1ff;
  --vip2: #ff2bd6;
  --vip3: #8a2eff;
  --vip4: #ffee00;
  background:
    radial-gradient(1200px 600px at 10% -10%, rgba(0,225,255,.14), transparent 60%),
    radial-gradient(1200px 600px at 90% 110%, rgba(255,43,214,.12), transparent 60%),
    linear-gradient(180deg, #090a12 0%, #0a0b10 100%);
  border-radius: 14px;
  padding: 18px 18px 24px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 24px 50px rgba(0,0,0,.45), inset 0 0 0 1px rgba(255,255,255,.03);
  color: var(--text);
}
.grt-legend { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:.75rem; }
.grt-badge {
  font-size:.72rem; font-weight:700; letter-spacing:.3px;
  padding:.2rem .45rem; border-radius:999px; border:1px solid rgba(255,255,255,.06);
  background: rgba(15,17,36,.6);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04);
  display:inline-block;
}
.badge-vip1 { color: var(--vip1); text-shadow: 0 0 6px rgba(0,225,255,.6); }
.badge-vip2 { color: var(--vip2); text-shadow: 0 0 6px rgba(255,43,214,.6); }
.badge-vip3 { color: var(--vip3); text-shadow: 0 0 6px rgba(138,46,255,.6); }
.badge-vip4 { color: var(--vip4); text-shadow: 0 0 6px rgba(255,238,0,.7); }
.badge-default { color: var(--muted); }

/* Controls */
.grt-controls { display:flex; gap:.5rem; margin: .25rem 0 1rem; }
.grt-btn {
  font-weight:700; font-size:.85rem; letter-spacing:.2px;
  border-radius:10px; padding:.45rem .7rem; cursor:pointer;
  border:1px solid rgba(255,255,255,.08);
  background: linear-gradient(180deg, rgba(15,17,36,.9), rgba(10,12,20,.9));
  color: var(--text);
  box-shadow: 0 0 0 1px rgba(255,255,255,.03) inset, 0 6px 16px rgba(0,0,0,.35);
}
.grt-btn:hover { box-shadow: 0 0 0 1px rgba(255,255,255,.06) inset, 0 10px 20px rgba(0,0,0,.4); }
.grt-expand-all { outline: 1px solid rgba(0,225,255,.25); }
.grt-collapse-all { outline: 1px solid rgba(255,43,214,.25); }

/* Tree & connectors */
.grt-tree { position: relative; }
.grt-tree ul { list-style:none; margin: .4rem 0 .4rem 1.25rem; padding:0; position:relative; }
.grt-tree li { position: relative; padding-left: 1rem; }
.grt-tree li::before {
  content:''; position:absolute; left:-.75rem; top:1.3rem; width:.75rem; height:0;
  border-top:1px dashed rgba(0,225,255,.28);
  box-shadow: 0 0 6px rgba(0,225,255,.18);
}
.grt-tree ul::before {
  content:''; position:absolute; left:.2rem; top:.2rem; bottom:0.6rem;
  border-left:1px dashed rgba(255,43,214,.22);
  box-shadow: 0 0 6px rgba(255,43,214,.16);
}

/* Node */
.grt-node {
  display:inline-flex; align-items:center; gap:.55rem;
  background: linear-gradient(180deg, rgba(15,17,36,.9), rgba(9,10,18,.9));
  border:1px solid rgba(255,255,255,.06);
  border-radius: 12px;
  padding: .42rem .6rem;
  cursor:pointer;
  box-shadow: 0 0 0 1px rgba(255,255,255,.04) inset;
  transition: transform .15s ease, box-shadow .2s ease;
}
.grt-node:hover { transform: translateY(-1px); }
.grt-node.role-vip1 { box-shadow: 0 0 20px rgba(0,225,255,.22), 0 0 0 1px rgba(0,225,255,.16) inset; }
.grt-node.role-vip2 { box-shadow: 0 0 20px rgba(255,43,214,.22), 0 0 0 1px rgba(255,43,214,.16) inset; }
.grt-node.role-vip3 { box-shadow: 0 0 20px rgba(138,46,255,.22), 0 0 0 1px rgba(138,46,255,.16) inset; }
.grt-node.role-vip4 { box-shadow: 0 0 20px rgba(255,238,0,.28), 0 0 0 1px rgba(255,238,0,.18) inset; }

.grt-avatar { width: 26px; height:26px; border-radius: 50%; object-fit:cover; box-shadow: 0 0 10px rgba(0,225,255,.25); }
.grt-name { font-weight:700; letter-spacing:.2px; color: var(--text); }

/* Counts badges */
.grt-counts { display:inline-flex; gap:.35rem; margin-left:.4rem; }
.cnt {
  min-width: 22px; height: 22px; display:inline-grid; place-items:center;
  font-size:.72rem; font-weight:800; color:#0b1020;
  border-radius:999px; padding:0 .35rem;
  background: #cbd5e1;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.15), 0 0 10px rgba(0,0,0,.15);
}
.cnt-direct { background: #7dd3fc; } /* sky */
.cnt-total  { background: #c4b5fd; } /* violet */

.grt-children { display:none; margin-left: 1rem; }