svg {
  height: 80vh;
}

.segment {
  fill: #F9F9F9;
  stroke: black;
}

.segment.underlay {
  fill: none!important;
  stroke: none!important;
}

.segment.depth-0, .segment.base {
  fill: #FFF;
}

.segment.depth-1 {
  fill: #E0E0E0;
}

.segment.highlight:not(.leaf):not(.base) {
  fill: #FFFFF1;
}

.segment.leaf.cat.murder {
  fill: red;
}

.segment.leaf.cat.retribution {
  fill: limegreen;
}

.segment.leaf.cat.laziness {
  fill: lightblue;
}

.segment.leaf.play.stuff {
  fill: yellow;
}

.circletree g {
  opacity: .3;
}

.circletree g.primary,
.circletree g.primary g,
.circletree g.primary .leaf,
.circletree g.active,
.circletree g:not(.active) g {
  opacity: 1;
}