.ab-topnav{position:relative;display:flex;align-items:center;gap:var(--space-6);height:var(--header-height);padding:0 var(--space-12);background:var(--surface-card);border-bottom:1px solid var(--border-default)}
.ab-topnav__brand{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--text-primary);flex:none}
.ab-topnav__wordmark{font-size:19px;font-weight:var(--weight-semibold);letter-spacing:-.025em}
.ab-topnav__links{display:flex;align-items:center;gap:2px;margin-left:var(--space-4);flex:none}
.ab-topnav__link{position:relative;display:flex;align-items:center;gap:5px;height:32px;white-space:nowrap;padding:0 10px;border-radius:var(--radius-control);font-size:var(--fs-body-sm);font-weight:var(--weight-medium);color:var(--text-secondary);text-decoration:none;transition:var(--transition-control)}
.ab-topnav__link:hover{background:var(--interactive-ghost-hover);color:var(--text-primary)}
.ab-topnav__link--active{color:var(--text-primary)}
.ab-topnav__link--active::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--interactive-primary)}
.ab-topnav__spacer{flex:1}
.ab-topnav__actions{display:flex;align-items:center;gap:var(--space-2);flex:none}
.ab-topnav__search{flex:0 1 280px;min-width:0}
.ab-topnav--app{padding:0 var(--space-6);height:56px}

.ab-crumbs{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:var(--fs-caption);color:var(--text-tertiary)}
.ab-crumbs a{color:var(--text-tertiary);text-decoration:none}
.ab-crumbs a:hover{color:var(--text-primary);text-decoration:underline}
.ab-crumbs__sep{color:var(--border-strong)}
.ab-crumbs__current{color:var(--text-secondary)}

.ab-pagination{display:flex;align-items:center;gap:var(--space-1)}
.ab-pagination__btn{min-width:32px;height:32px;padding:0 8px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--border-default);background:var(--surface-card);border-radius:var(--radius-control);font-size:var(--fs-body-sm);font-family:var(--font-mono);color:var(--text-secondary);cursor:pointer;transition:var(--transition-control)}
.ab-pagination__btn:hover{border-color:var(--border-strong);color:var(--text-primary)}
.ab-pagination__btn--active{background:var(--interactive-primary);border-color:var(--interactive-primary);color:#fff}
.ab-pagination__btn[disabled]{color:var(--text-disabled);cursor:not-allowed;background:var(--surface-sunken)}
.ab-pagination__gap{padding:0 4px;color:var(--text-tertiary)}

.ab-toc{display:flex;flex-direction:column;gap:1px}
.ab-toc__head{font-family:var(--font-mono);font-size:var(--fs-metadata);letter-spacing:var(--ls-metadata);text-transform:uppercase;color:var(--text-tertiary);padding:0 0 var(--space-3)}
.ab-toc__item{display:grid;grid-template-columns:26px 1fr auto;gap:var(--space-2);align-items:baseline;padding:7px 8px;border-radius:var(--radius-control);text-decoration:none;color:var(--text-secondary);font-size:var(--fs-body-sm);border-left:2px solid transparent;transition:var(--transition-control)}
.ab-toc__item:hover{background:var(--surface-hover);color:var(--text-primary)}
.ab-toc__item--active{background:var(--surface-selected);color:var(--text-accent);border-left-color:var(--interactive-primary);font-weight:var(--weight-medium)}
.ab-toc__item--sub{padding-left:32px;font-size:var(--fs-caption);color:var(--text-tertiary);grid-template-columns:1fr auto}
.ab-toc__num{font-family:var(--font-mono);font-size:var(--fs-metadata);color:var(--text-tertiary)}
.ab-toc__meta{font-family:var(--font-mono);font-size:11px;color:var(--text-tertiary)}

.ab-tabs{display:flex;gap:var(--space-5);border-bottom:1px solid var(--border-default)}
.ab-tab{position:relative;display:inline-flex;align-items:center;gap:6px;padding:0 1px 11px;background:none;border:0;font-family:var(--font-sans);font-size:var(--fs-body-sm);font-weight:var(--weight-medium);color:var(--text-tertiary);cursor:pointer;transition:color var(--duration-fast) var(--ease-standard)}
.ab-tab:hover{color:var(--text-primary)}
.ab-tab--active{color:var(--text-primary)}
.ab-tab--active::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--interactive-primary)}
.ab-tab__count{font-family:var(--font-mono);font-size:11px;color:var(--text-tertiary)}

.ab-chapternav{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}
.ab-chapternav__item{display:flex;flex-direction:column;gap:3px;padding:var(--space-4);border:1px solid var(--border-default);border-radius:var(--radius-card);text-decoration:none;background:var(--surface-card);transition:var(--transition-control)}
.ab-chapternav__item:hover{border-color:var(--border-strong)}
.ab-chapternav__item--next{text-align:right;align-items:flex-end}
.ab-chapternav__dir{font-family:var(--font-mono);font-size:var(--fs-metadata);letter-spacing:var(--ls-metadata);text-transform:uppercase;color:var(--text-tertiary)}
.ab-chapternav__title{font-size:var(--fs-body-sm);font-weight:var(--weight-medium);color:var(--text-primary)}
/* The marketing header carries brand + nav + search + actions. Below 1100px the search field
   is dropped rather than squeezed (search lives on the Library page); below 900px the gutters
   tighten. Nav labels are never clipped. */
@media (max-width:1100px){.ab-topnav__search{display:none}}
@media (max-width:900px){.ab-topnav{padding:0 var(--space-8);gap:var(--space-4)}}