.Tabs,
.Tabs-tab {
  display: block;
}

.Tabs-tab:not([selected]) {
  display: none;
}

.Tabs-header {
  border-bottom: solid 1px rgba(0, 32, 88, 0.1);
  white-space: nowrap;
}

.Tabs-button {
  --bg-alpha: 0;
  appearance: none;
  background-color: rgba(0, 0, 0, var(--bg-alpha));
  border: none;
  color: var(--text-color--light);
  cursor: pointer;
  font-family: inherit;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 1rem;
  text-transform: uppercase;
  transform: translateY(1px);
}

.Tabs-button:first-child {
  border-top-left-radius: 6px;
}

.Tabs-button:last-child {
  border-top-right-radius: 6px;
}

.Tabs-button:focus {
  outline: none;
}

.Tabs-button:focus {
  --bg-alpha: 0.015;
}

@media (hover: hover) {
  .Tabs-button:hover {
    --bg-alpha: 0.015;
  }
}

.Tabs-button:active {
  --bg-alpha: 0.03;
}

.Tabs-button.is-selected {
  border-bottom: solid 1px currentColor;
  color: var(--accent-color);
}

.Tabs-tab sparkle-code pre {
  margin-top: 0;
}
