.sp-toc {
  display: flex;
  flex-wrap: wrap;
  gap: var(--om-s2);
  margin-top: var(--om-s5);
}
.sp-toc .om-btn {
  border: 1px solid var(--om-line-soft);
}
.sp-toc .om-btn:hover {
  border-color: var(--om-primary);
}

.om-step pre {
  margin-top: var(--om-s3);
  padding: var(--om-s3) var(--om-s4);
  font-size: var(--om-fs-xs);
  line-height: 1.55;
}
.om-step pre code {
  white-space: pre;
}

.sp-code {
  margin-top: var(--om-s3);
  margin-bottom: var(--om-s4);
  font-size: var(--om-fs-xs);
  line-height: 1.55;
}

.sp-list {
  margin: 0;
  padding-left: 1.2em;
}
.sp-list li {
  padding: 0.2em 0;
}
.sp-list li::marker {
  color: var(--om-accent);
}

@media (max-width: 640px) {
  .om-step pre,
  .sp-code {
    max-width: 100%;
    overflow-x: auto;
  }
  .sp-toc {
    gap: var(--om-s1);
  }
}