.guide-toc {
  margin: 42px 0;
  padding: 22px 24px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #ffffff06;
}

.guide-toc > strong { font-size: 13px; }
.guide-toc ol { margin: 14px 0 0; padding-left: 20px; }
.guide-toc li { margin: 7px 0; color: #777; font-size: 12px; }
.guide-toc li.level-3 { margin-left: 18px; }
.guide-toc a { color: #bdbdc5; text-decoration: none; }
.guide-toc a:hover { color: #fff; text-decoration: underline; }
.guide-body ol { margin: 0 0 26px; padding-left: 25px; }
.guide-body a {
  color: #fff;
  text-decoration: underline;
  text-decoration-color: #ffffff55;
  text-underline-offset: 4px;
}

.guide-text-default { color: inherit; }
.guide-text-muted { color: #92929b; }
.guide-text-accent { color: #fff; }
.guide-text-success { color: #86d9aa; }
.guide-text-warning { color: #e7c77d; }
.guide-text-danger { color: #efa4ae; }

.guide-callout {
  margin: 26px 0;
  padding: 17px 18px;
  border: 1px solid #ffffff1f;
  border-left-width: 3px;
  border-radius: 10px;
  background: #ffffff07;
}

.guide-callout > strong {
  display: block;
  margin-bottom: 5px;
  color: #fff;
  font-size: 13px;
}

.guide-callout > p { margin: 0; font-size: 14px; }
.guide-callout.info { border-left-color: #b7c8e8; }
.guide-callout.success { border-left-color: #75cf9a; }
.guide-callout.warning { border-left-color: #d7b65f; }
.guide-callout.danger { border-left-color: #df7d8b; }
