h3 { scroll-margin-top: 25px; }<br />.mein-toc { background-color: #ffffff !important; border: 1px solid #eee !important; padding: 15px !important; border-radius: 8px; max-width: 450px; margin: 25px 0; font-family: sans-serif; display: block; box-shadow: 0 4px 12px rgba(0,0,0,0.2) !important; }<br />.mein-toc summary { cursor: pointer; font-weight: bold; padding: 5px; list-style: none; display: flex; align-items: center; }<br />.mein-toc summary::-webkit-details-marker { display: none; }<br />.mein-toc summary::before { content: "▶ "; margin-right: 10px; font-size: 0.8em; transition: transform 0.2s; }<br />.mein-toc[open] summary::before { transform: rotate(90deg); }<br />.mein-toc ul { margin: 15px 0 0 0; padding-left: 0; list-style-type: none; counter-reset: toc-counter; }<br />.mein-toc li { margin-bottom: 8px; counter-increment: toc-counter; display: flex; }<br />.mein-toc li::before { content: counter(toc-counter) ". "; font-weight: bold; margin-right: 8px; color: #555; }<br />.mein-toc a { text-decoration: none; color: #0066cc; }<br />.mein-toc a:hover { text-decoration: underline; }<br />