/* Learning-format labels only; shared navigation and page layouts are unchanged. */
.tutorial-format-label {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  padding: .2rem .65rem;
  border: 1px solid #cbd8e4;
  border-radius: 999px;
  background: #f5f8fb;
  color: #28455f;
  font-size: .78rem;
  font-weight: 600;
  line-height: 1.5;
  white-space: normal;
}
.tutorial-format-label[data-tutorial-format="hands-on-lab"] {
  border-color: #b9d6ca;
  background: #f0f8f4;
  color: #245a4d;
}
.tutorial-format-guide {
  margin: 0 auto 1.5rem;
  max-width: 75ch;
  padding: .9rem 1.1rem;
  border: 1px solid #d7e3ef;
  border-radius: .65rem;
  background: #f8fafc;
  color: #334b65;
  line-height: 1.65;
}
.tutorial-format-guide summary {
  cursor: pointer;
  font-weight: 600;
  color: #17324f;
}
.tutorial-format-guide summary:focus-visible {
  outline: 3px solid #2473bc;
  outline-offset: 4px;
}
.tutorial-format-guide p { margin: .7rem 0 0; }