summary .expand-icon, summary .additional-link {
  transition: 0.2s;
}

details[open] > summary .expand-icon {
  transform: rotate(45deg);
}

details[open] > summary .additional-link {
  opacity: 1;
  visibility: visible;
}

details[open] {
  background-color: #EDFAFF;
  border: solid 1px #D5EDFF;
}

html[data-theme="dark"] details[open] {
  background-color: #FFFFFF1A;
  border: solid 1px #152947;
}

html[data-theme="dark"] details[open] .material-title {
  color: #2ABDFF;
}

details[open] .material-title {
  color: #007AFF;
}

details[open] summary ~ * {
  animation: sweep .5s ease-in-out;
}

@keyframes sweep {
  0%    {opacity: 0; margin-left: -10px}
  100%  {opacity: 1; margin-left: 0px}
}

.svg-black path {
  stroke: black;
}