.tutorial-intro {
  max-width: 100%;
}

.tutorial-intro h1 {
  margin-top: 12px;
  margin-bottom: 20px;
}

.tutorial-deck {
  max-width: 44em;
  font-size: var(--text-lead);
  font-weight: var(--weight-semibold);
  color: var(--c-text);
}

.tutorial-intro > .muted {
  max-width: var(--reading);
  line-height: var(--line-prose);
}

.tutorial-intro .toc {
  margin-top: 32px;
}

.tutorial-step {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, var(--shot-width));
  align-items: start;
  gap: 40px;
}

.tutorial-step > .prose {
  min-width: 0;
}

.tutorial-step > .official-shot {
  justify-self: center;
}

@media (max-width: 900px) {
  .tutorial-step {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
  }
}