.notebook .problem-page { position: relative; }
.notebook .problem-page::after { content: none; }
.browse-nav { position: relative; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 8px; margin: 0 0 18px; padding-left: 8px; }
.browse-nav::before { content: ''; position: absolute; left: 0; top: 9px; bottom: 9px; width: 3px; background: #1467b7; clip-path: polygon(12% 0,100% 4%,79% 100%,0 94%); pointer-events: none; }
.browse-nav .browse-link { display: inline-flex; align-items: flex-start; justify-content: flex-start; gap: 5px; min-height: 44px; padding: 10px 4px; background: #ffffffde; color: var(--ink); font: 500 14px/22px 'IBM Plex Sans',sans-serif; text-decoration: none; }
.browse-nav a.browse-link:hover:not(:focus-visible) > span { background: linear-gradient(transparent 35%,#f3dc6266 35%,#f3dc6266 78%,transparent 78%); }
.browse-nav a.browse-link:focus-visible { outline: 0; box-shadow: none; }
.browse-nav a.browse-link:focus-visible > span { box-shadow: 0 3px #1467b7; }
.browse-link .icon { width: 20px; height: 22px; flex-basis: 20px; color: #1467b7; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.browse-next,.browse-other { grid-column: 1/-1; }
@media (width >= 1100px) {
  .notebook .problem-page { max-width: 1020px; padding-right: 224px; }
  .browse-nav { position: absolute; top: 54px; right: 0; width: 192px; margin: 0; }
}
@media (width < 400px) { .browse-nav .browse-link { font-size: 13px; } }
