.tutorial-page {
  padding-top:56px;
  padding-bottom:80px;
}
.tutorial-intro {
  max-width:900px;
  margin-inline:auto;
}
.tutorial-intro__labels {
  justify-content:flex-start;
  margin-top:0;
  margin-bottom:22px;
}
.tutorial-intro h1 {
  margin-top:0;
  margin-bottom:20px;
}
.tutorial-intro__lead {
  max-width:42em;
  margin-bottom:28px;
  color:var(--muted);
  font-size:var(--fs-h3);
  line-height:1.75;
}
.tutorial-page > .toc {
  margin-top:40px;
}
.tutorial-step {
  display:grid;
  grid-template-columns:120px minmax(0,1fr);
  gap:36px;
  margin-top:var(--section-space);
  scroll-margin-top:32px;
}
.tutorial-step__rail {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:16px;
  padding-top:8px;
  border-top:1px solid var(--line-strong);
  font-family:var(--font-mono);
}
.tutorial-step__number {
  color:var(--accent);
  font-size:var(--fs-h2);
  line-height:1.3;
}
.tutorial-step__marker {
  color:var(--muted);
  font-size:var(--fs-tiny);
}
.tutorial-step > .prose {
  width:100%;
}
.tutorial-step .prose > h2:first-child {
  margin-top:0;
}
.tutorial-step .prose > p:last-child {
  margin-bottom:0;
}
.tutorial-acquire {
  max-width:900px;
  margin-top:var(--section-space);
  margin-bottom:0;
  margin-inline:auto;
}
.tutorial-acquire h2 {
  margin-top:0;
  font-size:var(--fs-h3);
}
@media (max-width:768px) {
  .tutorial-page {
    padding-top:32px;
    padding-bottom:56px;
  }
  .tutorial-intro__lead {
    font-size:var(--fs-body);
  }
  .tutorial-step {
    grid-template-columns:minmax(0,1fr);
    gap:24px;
  }
  .tutorial-step__rail {
    flex-direction:row;
    align-items:center;
    gap:14px;
    padding-top:14px;
  }
}