input[type="radio"] {
  display: none;
}
input[type="radio"] + label svg {
  height: 30px;
}
input[type="radio"] + label svg .outer {
  transition: fill 0.3s ease-in-out 0.3s;
  fill: #bdbdbd;
}
input[type="radio"] + label svg .inner {
  fill: #ffffff;
  transition: r 0.3s ease-in-out 0.3s;
  r: 28px;
}
input[type="radio"] + label:hover svg .outer {
  fill: #9e9e9e;
}
input[type="radio"] + label:hover svg .inner {
  r: 17px;
}
input[type="radio"]:checked + label svg .outer {
  transition: fill 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  fill: #00d9d9;
}
input[type="radio"]:checked + label svg .inner {
  transition: r 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  r: 14px;
}