.api-access {
  max-width: 820px;
  margin-top: 18px;
  color: var(--muted);
  font-size: 11px;
}
.api-access summary {
  display: inline-block;
  color: #9f9da4;
  cursor: pointer;
  text-decoration: underline;
  text-decoration-color: #46464e;
  text-underline-offset: 4px;
}
.api-access > div { display: flex; gap: 7px; margin-top: 12px; }
.api-access input {
  min-width: 0;
  flex: 1;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 7px;
  outline: 0;
  background: #141419;
  color: var(--text);
  font: 12px ui-monospace, monospace;
}
.api-access input:focus { border-color: var(--yellow); }
.api-access button {
  padding: 0 14px;
  border: 1px solid #56513e;
  border-radius: 7px;
  background: #252319;
  color: var(--yellow);
  cursor: pointer;
  font-size: 11px;
  font-weight: 750;
}
.api-access small { display: block; max-width: 690px; margin-top: 9px; line-height: 1.5; }
.api-access.configured summary { color: var(--green); }
@media (max-width: 520px) {
  .api-access > div { flex-direction: column; }
  .api-access button { min-height: 40px; }
}