.step {
  padding-block:0 40px;
  margin-bottom:38px;
  border-bottom:1px solid var(--line);
  scroll-margin-top:32px
}
.step-heading {
  display:flex;
  align-items:center;
  gap:16px;
  margin-bottom:22px
}
.step-number {
  font-size:13px;
  width:31px;
  height:31px;
  display:grid;
  place-items:center;
  border:1px solid #684155;
  color:var(--pink);
  border-radius:50%;
  flex-shrink:0;
  font-variant-numeric:tabular-nums
}
.step>p,.reading-section>p {
  max-width:72ch;
  font-size:14px
}
.step>p+p {
  margin-top:14px
}
.check-list {
  list-style:none;
  padding:0;
  margin:20px 0;
  color:var(--muted);
  font-size:13px
}
.check-list li {
  position:relative;
  padding-left:19px
}
.check-list li::before {
  content:'';
  position:absolute;
  width:5px;
  height:5px;
  left:1px;
  top:10px;
  border:1px solid var(--pink);
  border-radius:50%
}
.step .note,.reading-section>.note {
  font-size:12px;
  margin-top:20px
}
.file-tree {
  display:grid;
  gap:4px;
  background:var(--surface);
  padding:22px 25px;
  font-family:var(--mono);
  font-size:12px;
  color:#e8cadc;
  line-height:1.7;
  margin-block:20px;
  border-radius:var(--radius)
}
.file-tree em {
  color:var(--muted);
  font:normal 11px var(--font);
  margin-left:12px
}
.file-tree>span:first-child {
  color:var(--text);
  margin-bottom:5px
}
.path-setting {
  padding:25px;
  background:var(--surface);
  border-radius:var(--radius);
  margin-block:0 40px
}
.path-setting>p {
  font-size:12px;
  margin-top:10px
}
.menu-preview {
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:24px;
  margin-top:24px
}
.menu-preview>span {
  color:var(--pink);
  font-size:14px;
  font-weight:600
}
.menu-preview>div {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-block:18px
}
.menu-preview>div>span {
  border:1px solid var(--line);
  border-radius:5px;
  padding:5px 12px;
  font-size:11px
}
.menu-preview>p {
  font-size:11px;
  line-height:1.8
}
.reading-section {
  padding-top:18px;
  margin-bottom:55px
}
.reading-section>h2 {
  margin-bottom:20px
}
.reading-section>details {
  margin-top:16px
}
.reading-section input[type=search] {
  margin-bottom:12px
}
.remove-section {
  padding-bottom:35px;
  border-bottom:1px solid var(--line)
}
#search-empty {
  font-size:12px;
  padding-block:15px
}
.step:target .step-number {
  background:var(--pink);
  color:#200a14
}
.step.is-complete .step-heading h2 {
  color:#d6c3cf
}
