/* Shared top navigation. Uses each page's own colour tokens, with fallbacks. */ .site-nav { background: var(--panel, #ffffff); border-bottom: 1px solid var(--line, #8a887f); } .site-nav.flush { margin: -28px -16px 24px; } /* the diagram pages pad their ; this makes the bar full-width */ .site-nav .in { max-width: var(--nav-max, 1380px); margin: 0 auto; padding: 10px 16px; display: flex; flex-wrap: wrap; align-items: center; gap: 2px 20px; } .site-nav a { font: 14px/1.4 system-ui, -apple-system, "Segoe UI", sans-serif; text-decoration: none; color: var(--muted, #64635c); padding: 4px 0; border-bottom: 2px solid transparent; } .site-nav a:hover, .site-nav a:focus-visible { color: var(--fg, #1c1b19); outline: none; } .site-nav a.brand { font-weight: 700; color: var(--fg, #1c1b19); margin-right: 8px; } .site-nav a[aria-current="page"] { color: var(--fg, #1c1b19); border-bottom-color: var(--fg, #1c1b19); } .site-nav a.done { font-size: 12.5px; opacity: .75; order: 99; }