#tree-container{position:fixed; inset:0;}
#tree-svg, #tree-container svg{width:100%; height:100%; display:block;}

.link{
  fill:none;
  stroke-width:3.2;
  stroke-linecap:round;
  stroke-linejoin:round;
  opacity:.92;
  filter: drop-shadow(0 0 10px rgba(255,215,0,.20));
  transition: opacity .15s ease, stroke-width .15s ease, filter .15s ease;
}
.link:hover,
.link.active{
  opacity:1;
  stroke-width:4.4;
  filter: drop-shadow(0 0 18px rgba(255,215,0,.28)) drop-shadow(0 0 30px rgba(140,200,255,.18));
}

.node text{
  fill:rgba(255,255,255,.92);
  font-size:12px;
  paint-order: stroke;
  stroke: rgba(0,0,0,.55);
  stroke-width: 3px;
}

.node.deceased{opacity:.60;}

.node circle{
  stroke: rgba(255,255,255,.25);
  stroke-width: 1.2;
  filter: drop-shadow(0 0 12px rgba(255,215,0,.14));
  transition: transform .15s ease, opacity .15s ease, stroke .15s ease, filter .15s ease;
  transform-origin: center;
}
.node:hover circle{
  stroke: rgba(255,215,0,.65);
  stroke-width: 2;
  filter: drop-shadow(0 0 18px rgba(255,215,0,.22)) drop-shadow(0 0 32px rgba(140,200,255,.14));
}

.rip{fill: rgba(255,120,120,.95); font-weight:900; font-size:11px;}
.mini-btn{fill:rgba(255,255,255,.92); font-weight:900; font-size:16px; cursor:pointer; user-select:none;}
.mini-btn:hover{opacity:.85;}
