.index-info .index-tool-list li .index-tool-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  margin: 0 9px 0 0;
  border: 1px solid transparent;
  border-radius: 7px;
  font-size: 18px;
  font-style: normal;
  line-height: 40px;
}

.index-info .index-tool-icon-help {
  border-color: #f4d0c7 !important;
  background: #fff0ec !important;
  color: #d95737 !important;
}

.index-info .index-tool-icon-runtime {
  border-color: #bfe5d3 !important;
  background: #eaf8f1 !important;
  color: #23845d !important;
}

.index-info .index-tool-icon-random {
  border-color: #d9cdf3 !important;
  background: #f3effc !important;
  color: #7459bd !important;
}

.index-info .index-tool-icon-group {
  border-color: #c4def6 !important;
  background: #edf6ff !important;
  color: #1978c8 !important;
}

.index-info .index-tool-icon-default {
  border-color: #d8e0ea !important;
  background: #f1f4f8 !important;
  color: #627187 !important;
}

body.night .index-info .index-tool-icon-help {
  border-color: #784b40 !important;
  background: #4b3430 !important;
  color: #ff9a80 !important;
}

body.night .index-info .index-tool-icon-runtime {
  border-color: #396b58 !important;
  background: #2d4a3e !important;
  color: #78d5ad !important;
}

body.night .index-info .index-tool-icon-random {
  border-color: #5d527d !important;
  background: #403951 !important;
  color: #b9a5ec !important;
}

body.night .index-info .index-tool-icon-group {
  border-color: #46698f !important;
  background: #2c4562 !important;
  color: #8fc0ff !important;
}

body.night .index-info .index-tool-icon-default {
  border-color: #505b68 !important;
  background: #373f48 !important;
  color: #b8c3d0 !important;
}

@media screen and (max-width: 1320px) and (min-width: 801px) {
  .index-info .index-tool-list li .index-tool-icon {
    flex-basis: 36px;
    width: 36px;
    height: 36px;
    margin-right: 7px;
    font-size: 16px;
    line-height: 36px;
  }
}