/* Navigation only. Existing reading, image, question and storage code is unchanged. */
.flow-navigation { margin-block: 1.5rem; }
.lesson-layout > .flow-navigation { grid-column: 1 / -1; grid-row: 2; }
.lesson-layout > .main-content, .lesson-layout > .toc { grid-row: 3; }
.flow-navigation .flow-links { display: flex; flex-wrap: wrap; gap: 1rem; margin: 1rem 0; }
.flow-navigation a { display: inline-flex; align-items: center; min-height: 44px; max-width: 100%; padding: .65rem 1rem; border: 1px solid #b9d0c5; border-radius: 7px; background: #fff; color: #155447; text-decoration: underline; text-underline-offset: .2em; overflow-wrap: anywhere; }
.flow-navigation a.primary { color: #fff; background: #195d46; border-color: #195d46; font-weight: 700; }
.flow-navigation a:focus-visible { outline: 3px solid #b66009; outline-offset: 4px; }
.flow-navigation p { margin: .7rem 0; }
.flow-status { font-size: 1rem; line-height: 1.8; }
.flow-status strong { color: #155447; }
.flow-chapter-intro { margin-block: 2rem; }
.flow-chapter-intro h1 { font-size: clamp(1.7rem, 3vw, 2.8rem); line-height: 1.45; }
.flow-pending { scroll-margin-top: var(--anchor-offset, 120px); }
.flow-pending h3 { margin-top: 0; }
.sidebar .flow-menu-status { display: block; padding: .35rem .6rem; font-size: .85rem; line-height: 1.6; color: #53605b; }
.sidebar .flow-menu-chapter { min-height: 44px; }
@media (max-width: 600px) { .flow-navigation .flow-links { display: grid; grid-template-columns: minmax(0, 1fr); } .flow-navigation a { width: 100%; } }
.text-200 .flow-navigation .flow-links { display: grid; grid-template-columns: minmax(0, 1fr); }
