.nff-structure {
  --nff-structure-line: color-mix(in srgb, currentColor 25%, transparent);
  --nff-structure-size: clamp(19px, 1.7vw, 24px);
  color: inherit;
  background: transparent;
  font-family: inherit;
  font-size: var(--nff-structure-size);
  font-weight: inherit;
  line-height: 1.35;
  display: block;
  width: 100%;
  min-width: 0;
}
.nff-structure *, .nff-structure *::before, .nff-structure *::after { box-sizing: border-box; }
.nff-structure ul { list-style: none; padding: 0; margin: 0; min-width: 0; }
.nff-structure li { list-style: none; padding: 0; margin: 0; }
.nff-structure .nff-structure__areas > li { border-top: 1px solid var(--nff-structure-line, #999); }
.nff-structure .nff-structure__areas > li:last-child { border-bottom: 1px solid var(--nff-structure-line, #999); }
.nff-structure details { padding: 0; margin: 0; border: 0; background: transparent; color: inherit; }
.nff-structure summary { list-style: none; margin: 0; cursor: pointer; }
.nff-structure summary::-webkit-details-marker { display: none; }
.nff-structure .nff-structure__summary, .nff-structure .nff-structure__leaf { display: flex; align-items: baseline; gap: 16px; padding: 11px 0; overflow-wrap: anywhere; }
.nff-structure .nff-structure__area > summary { padding: 22px 0; }
.nff-structure .nff-structure__summary:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; border-radius: 0; }
.nff-structure .nff-structure__number { flex: 0 0 28px; font-size: 13px; font-variant-numeric: tabular-nums; }
.nff-structure .nff-structure__label { flex: 1; min-width: 0; }
.nff-structure .nff-structure__summary:hover > .nff-structure__label { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.nff-structure .nff-structure__mark { position: relative; flex: 0 0 16px; width: 16px; height: 16px; align-self: center; }
.nff-structure .nff-structure__mark::before, .nff-structure .nff-structure__mark::after { content: ''; position: absolute; background: currentColor; }
.nff-structure .nff-structure__mark::before { width: 14px; height: 1px; top: 7px; left: 1px; }
.nff-structure .nff-structure__mark::after { width: 1px; height: 14px; top: 1px; left: 7px; transition: transform 200ms ease; }
.nff-structure details[open] > summary .nff-structure__mark::after { transform: rotate(90deg); }
.nff-structure .nff-structure__panel { min-width: 0; }
.nff-structure .nff-structure__children { margin: 2px 0 18px 9px; padding-left: 22px; border-left: 1px solid var(--nff-structure-line, #999); font-size: max(18px, .92em); }
.nff-structure .nff-structure__area > .nff-structure__panel > ul { margin-left: 44px; }
.nff-structure .nff-structure__children > li { position: relative; }
.nff-structure .nff-structure__children > li::before { content: ''; position: absolute; top: calc(.675em + 11px); left: -22px; width: 11px; height: 1px; background: var(--nff-structure-line, #999); }
@supports not (color: color-mix(in srgb, black, white)) { .nff-structure { --nff-structure-line: #999; } }
@media (max-width: 767px) {
  .nff-structure { --nff-structure-size: 20px; }
  .nff-structure .nff-structure__area > summary { padding: 18px 0; gap: 12px; }
  .nff-structure .nff-structure__area > .nff-structure__panel > ul { margin-left: 12px; }
  .nff-structure .nff-structure__children { font-size: 18px; padding-left: 16px; margin-left: 4px; }
  .nff-structure .nff-structure__children > li::before { left: -16px; width: 8px; }
  .nff-structure .nff-structure__summary, .nff-structure .nff-structure__leaf { gap: 10px; }
}
@media (prefers-reduced-motion: reduce) { .nff-structure .nff-structure__mark::after { transition: none; } }
@media print {
  .nff-structure { display: block; }
  .nff-structure .nff-structure__panel { display: block !important; height: auto !important; }
}