#dfm-page-navigation {
    position: fixed;
    top: 4px;
    left: 8px;
    z-index: 900;
    display: flex;
    gap: 8px;
    padding: 0;
    margin: 0;
}

#dfm-page-navigation button {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 28px;
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: #60666d;
    cursor: pointer;
    transition: color .15s ease, background-color .15s ease;
}

#dfm-page-navigation svg {
    width: 19.8px;
    height: 19.8px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.4;
    stroke-linecap: round;
    stroke-linejoin: round;
}

#dfm-page-navigation button:hover {
    background: rgba(64, 71, 81, .07);
    color: #30363d;
}

#dfm-page-navigation button:focus-visible {
    outline: 2px solid #008740;
    outline-offset: 1px;
}

/* Reserve space when the header has no left margin for the controls. */
@media (max-width: 1680px) {
    html.dfm-page-navigation-enabled body {
        padding-top: 36px;
    }
}

/* Only the thin top row stays visible; the rest of each page scrolls normally. */
html.dfm-page-navigation-enabled body.dfm-member-page {
    padding-top: 0;
    height: auto;
    min-height: 100vh;
}

html.dfm-page-navigation-enabled .dfm-member-page > .header {
    position: sticky;
    top: 0;
    z-index: 890;
    height: 35px;
    background: #fff;
}

html.dfm-page-navigation-enabled .dfm-member-page > .header > .m-warp {
    /* Leave room for the navigation icons even when the window is narrow. */
    margin-left: max(140px, calc((100% - 1280px) / 2));
    margin-right: 0;
}

html.dfm-page-navigation-enabled .dfm-member-page > .nav-box {
    position: relative;
    top: auto;
}

html.dfm-page-navigation-enabled body.dfm-website-page {
    padding-top: 0;
    height: auto;
    min-height: 100vh;
}

/* Override the homepage/registration templates that pin the entire menu. */
html.dfm-page-navigation-enabled .dfm-website-page > .the-header {
    position: static !important;
    box-sizing: border-box;
    height: auto;
    padding-top: 40px;
}

html.dfm-page-navigation-enabled .dfm-website-page > .the-header > .header-tips {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 890;
    height: 40px;
    background: #f8f8f8;
}

html.dfm-page-navigation-enabled .dfm-website-page > .the-header > .header-tips > .page-wrap {
    margin-left: max(140px, calc((100% - 1400px) / 2));
    margin-right: 0;
    color: #404751;
}

html.dfm-page-navigation-enabled .dfm-website-page > .the-header > .menu-box {
    position: relative !important;
    top: auto !important;
    z-index: 8;
}

/* The top row now has its own in-flow space, replacing landing-page offsets. */
html.dfm-page-navigation-enabled .dfm-website-page > :is(.member-reg-page, .member-main-reg, .member-hz-reg, .member-sh-reg, .member-hf-reg, .member-nj-reg, .member-sz-reg) {
    padding-top: 0;
}