.topic-directory { max-width: 960px; margin: 2rem auto; padding: 1.25rem; }
.topic-directory .breadcrumbs { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: .5rem; position: static; min-height: 0; width: auto; padding: 0; margin: 0 0 1.5rem; background: transparent; border: 0; box-shadow: none; }
.topic-directory h1 { font-size: clamp(1.7rem, 4vw, 2.5rem); line-height: 1.25; overflow-wrap: anywhere; }
.directory-topics { list-style: none; padding: 0; margin: 1.25rem 0; }
.directory-topics li { border-bottom: 1px solid var(--border-color, #d1d5db); }
.directory-topics a { display: block; padding: 1rem 0; color: var(--primary, #047857); line-height: 1.5; overflow-wrap: anywhere; }
.directory-topics a:hover { text-decoration: underline; }
.directory-topics a:focus-visible, .directory-skip:focus-visible { outline: 3px solid #047857; outline-offset: 4px; }
.directory-skip { position: absolute; left: 1rem; top: -5rem; padding: .75rem; background: white; color: #064e3b; z-index: 10000; }
.directory-skip:focus { top: 1rem; }
@media (min-width: 720px) { .directory-topics { columns: 2; column-gap: 2.5rem; } .directory-topics li { break-inside: avoid; } }