.support-tool {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: start;
  gap: .65rem;
}

.support-tool-heading {
  margin: 0;
  color: #f2e697;
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.support-tool-load {
  width: auto;
  min-width: 160px;
  min-height: 40px;
  padding: .7rem 1rem;
  border: 1px solid rgba(242, 230, 151, .7);
  border-radius: 4px;
  background: #f2e697;
  color: #121212;
  font-size: .73rem;
  letter-spacing: .035em;
  text-transform: none;
}

.support-tool-options {
  display: flex;
  flex-wrap: wrap;
  gap: .8rem;
}

.support-tool-option {
  display: grid;
  gap: .35rem;
}

.support-tool-option > span {
  color: rgba(255, 255, 255, .86);
  font-size: .67rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.support-tool-load:hover {
  background: #dfcf68;
}

.support-tool-load:focus-visible {
  outline: 3px solid #f2e697;
  outline-offset: 3px;
}

.support-tool-frame {
  display: block;
  width: 160px;
  height: 40px;
  border: 0;
  border-radius: 4px;
  overflow: hidden;
  color-scheme: light;
}

@media (max-width: 420px) {
  .support-tool-options {
    display: grid;
  }
}