.public-toc { margin-block: 32px; padding: 24px; border: 1px solid var(--public-line); border-radius: 8px; background: var(--theme-soft, var(--krds-color-light-gray-5)); }
.public-toc h2 { margin: 0 0 12px; font-size: 1.8rem; }
.public-toc ol { list-style: none; margin: 0; padding: 0; }
.public-toc li + li { margin-top: 4px; }
.public-toc .public-toc-subheading { padding-inline-start: 20px; }
.public-toc a { display: inline-block; padding-block: 6px; line-height: 1.5; text-underline-offset: 4px; overflow-wrap: anywhere; }
.public-prose :is(h2, h3)[id] { scroll-margin-top: 24px; }
.public-prose pre { max-width: 100%; overflow-x: auto; padding: 20px; border: 1px solid var(--public-line); border-radius: 6px; background: var(--theme-soft, var(--krds-color-light-gray-5)); white-space: pre; tab-size: 4; }
.public-prose code { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .9em; }
.public-prose pre code { white-space: pre; }
.public-code-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-top: 24px; }
.public-code-controls + pre { margin-top: 8px; }
.public-code-copy { min-height: 44px; padding: 8px 14px; border: 1px solid var(--public-line); border-radius: 6px; color: var(--public-text); background: var(--krds-color-light-gray-0); font: inherit; font-size: 1.4rem; cursor: pointer; }
.public-code-copy:hover { border-color: var(--public-accent); color: var(--public-accent); }
.public-code-copy:disabled { cursor: wait; opacity: .7; }
.public-copy-status { color: var(--public-muted); font-size: 1.4rem; line-height: 1.5; }
.public-copy-buffer { position: fixed; top: 0; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.public-related { max-width: 820px; margin: 40px auto 0; padding-top: 32px; border-top: 1px solid var(--public-line); }
.theme-width-wide .public-related { max-width: 980px; }
.public-related h2 { margin: 0 0 16px; font-size: 2.2rem; }
.public-related ul { list-style: none; margin: 0; padding: 0; }
.public-related li + li { border-top: 1px solid var(--public-line); }
.public-related a { display: block; padding-block: 18px; text-decoration: none; }
.public-related h3 { margin: 0; font-size: 1.8rem; line-height: 1.5; overflow-wrap: anywhere; }
.public-related a:hover h3 { text-decoration: underline; text-underline-offset: 4px; }
.public-related p { margin: 8px 0 0; color: var(--public-muted); font-size: 1.5rem; line-height: 1.6; overflow-wrap: anywhere; }
@media (max-width: 600px) {
  .public-toc { padding: 18px; }
  .public-toc .public-toc-subheading { padding-inline-start: 14px; }
  .public-prose pre { padding: 14px; }
}