/* The site's header (D-300): the same on the website and the signed-in screens. One row from 1024px wide; below that, a slim bar and a full-screen menu. */
.bn { background: #fff; position: relative; z-index: 50; font-family: 'IBM Plex Sans', system-ui, sans-serif; font-size: 15px; line-height: 1.3; }
.bn-bar { display: flex; align-items: center; gap: 16px 22px; max-width: 80rem; margin: 0 auto; padding: 9px 16px; box-sizing: border-box; }
.bn-brand { display: flex; align-items: center; gap: 9px; text-decoration: none; flex: 0 0 auto; }
.bn-brand img { width: 44px; height: 44px; border-radius: 50%; }
.bn-brand > span:not(.sr-only) { font: 900 23px/1 'Fraunces', Georgia, serif; color: #274472; letter-spacing: .02em; }
.bn .sr-only, .bn-sheet .sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.bn-main { display: flex; flex-wrap: nowrap; gap: 2px 16px; flex: 1 1 auto; min-width: 0; }
.bn-main a, .bn-link { color: #1F2430; text-decoration: none; padding: 10px 0; white-space: nowrap; }
.bn-main a:hover, .bn-link:hover, .bn-main a[aria-current="page"] { color: #274472; text-decoration: underline; text-underline-offset: 6px; }
.bn-main a[aria-current="page"] { font-weight: 600; }
.bn-actions { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; }
.bn-cta { display: inline-block; background: #274472; color: #fff !important; padding: 9px 16px; border-radius: 999px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.bn-cta:hover { background: #1B3154; }
.bn-toggle { display: none; margin: 0 0 0 auto; min-height: 44px; padding: 8px 18px; border: 2px solid #274472; border-radius: 999px; background: #fff; color: #274472; font: 600 15px 'IBM Plex Sans', system-ui, sans-serif; cursor: pointer; }
.bn-toggle:hover { background: #ECEEF3; color: #1B3154; }

/* The two desktop menus. */
.bn-drop { position: relative; margin: 0; padding: 0; border: 0; background: none; }
.bn-drop > summary { cursor: pointer; padding: 8px 12px; border: 1px solid #E3DFD6; border-radius: 999px; font-weight: 600; color: #1F2430; white-space: nowrap; list-style: none; }
.bn-drop > summary::-webkit-details-marker { display: none; }
.bn-drop > summary::after { content: ' ▾'; font-size: 12px; color: #59606E; }
.bn-drop > summary:hover, .bn-drop[open] > summary { background: #ECEEF3; border-color: #274472; }
.bn-drop.current > summary { border-color: #274472; color: #274472; }
.bn-menu, .bn-admin { position: absolute; right: 0; top: calc(100% + 8px); background: #fff; border: 1px solid #E3DFD6; border-top: 4px solid #274472; border-radius: 0 0 12px 12px; box-shadow: 0 10px 28px rgba(19, 28, 46, .16); box-sizing: border-box; }
.bn-menu { width: 15rem; padding: 8px 14px 12px; }
.bn-admin { width: min(72rem, calc(100vw - 32px)); max-height: calc(100vh - 110px); overflow: auto; padding: 14px 18px 18px; }
.bn ul, .bn-sheet ul { list-style: none; margin: 0; padding: 0; }
.bn-menu li, .bn-group li { padding: 4px 0; }
.bn-menu a, .bn-group a { color: #1F2430; text-decoration: none; }
.bn-menu a:hover, .bn-group a:hover, .bn-menu a[aria-current="page"], .bn-group a[aria-current="page"] { color: #274472; text-decoration: underline; text-underline-offset: 4px; }
.bn-menu a[aria-current="page"], .bn-group a[aria-current="page"], .bn-sheet a[aria-current="page"] { font-weight: 700; }
.bn-menu form { margin: 6px 0 0; padding-top: 8px; border-top: 1px solid #E3DFD6; }
.bn-groups { columns: 4 13rem; column-gap: 24px; }   /* four columns on a wide screen keep the whole menu in view (D-304) */
.bn-group { break-inside: avoid; margin-bottom: 12px; }
.bn-admin { font-size: 14px; line-height: 1.25; }
.bn-admin .bn-group li { padding: 2px 0; }
.bn-group h2, .bn-sheet h2 { font: 500 12px/1.4 'IBM Plex Mono', ui-monospace, monospace; letter-spacing: .08em; text-transform: uppercase; color: #59606E; margin: 0 0 4px; }
.bn-search { display: flex; gap: 8px; margin: 0 0 14px; }
.bn-search input { flex: 1 1 auto; min-width: 0; width: auto; margin: 0; padding: 8px 12px; border: 1px solid #8A92A0; border-radius: 8px; font: inherit; box-sizing: border-box; }
.bn-search button { margin: 0; padding: 8px 14px; border: 0; border-radius: 8px; background: #274472; color: #fff; font: 600 14px 'IBM Plex Sans', system-ui, sans-serif; cursor: pointer; }
.bn-nomatch { margin: -6px 0 12px; color: #59606E; font-size: 14px; }
.bn-plain { margin: 0; padding: 4px 0; border: 0; background: none; color: #A13543; font: 600 15px 'IBM Plex Sans', system-ui, sans-serif; cursor: pointer; text-decoration: underline; text-underline-offset: 4px; }

/* The phone's parts stay out of the way on a wide screen. */
.bn-sheet, .bn-tabs { display: none; }

@media (max-width: 1023.98px) {
    .bn { position: sticky; top: 0; border-bottom: 0; }
    .bn-bar { padding: 7px 14px; gap: 10px; }
    .bn-brand img { width: 38px; height: 38px; }
    .bn-brand > span:not(.sr-only) { font-size: 21px; }
    .bn-main, .bn-actions { display: none; }
    .bn-toggle { display: inline-block; }
    html { scroll-padding-top: 76px; }
    html.bn-open { overflow: hidden; }

    .bn-sheet:not([hidden]) { display: block; position: fixed; left: 0; right: 0; top: var(--bn-top, 62px); bottom: 0; z-index: 49; background: #fff; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 14px 18px 96px; box-sizing: border-box; font-family: 'IBM Plex Sans', system-ui, sans-serif; font-size: 17px; line-height: 1.3; }
    .bn-sheet h2 { margin: 18px 0 2px; }
    .bn-sheet h2:first-child { margin-top: 2px; }
    .bn-sheet li a, .bn-sheet li > span { display: flex; align-items: center; min-height: 46px; color: #1F2430; text-decoration: none; border-bottom: 1px solid #EEEBE4; }
    .bn-sheet li a[aria-current="page"] { color: #274472; }
    .bn-sheet > .bn-cta { display: block; text-align: center; margin: 2px 0 8px; padding: 12px 16px; }
    .bn-fold { margin: 0; padding: 0; border: 0; border-bottom: 1px solid #EEEBE4; background: none; border-radius: 0; }
    .bn-fold > summary { min-height: 46px; display: flex; align-items: center; justify-content: space-between; font-weight: 600; cursor: pointer; list-style: none; }
    .bn-fold > summary::-webkit-details-marker { display: none; }
    .bn-fold > summary::after { content: '▾'; color: #59606E; }
    .bn-fold[open] > summary::after { content: '▴'; }
    .bn-fold ul { padding: 0 0 8px 12px; }
    .bn-out { margin-top: 18px; min-height: 44px; font-size: 17px; }

    .bn-tabs { display: grid; grid-template-columns: repeat(5, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; background: #fff; border-top: 1px solid #E3DFD6; box-shadow: 0 -2px 10px rgba(19, 28, 46, .08); padding-bottom: env(safe-area-inset-bottom); font-family: 'IBM Plex Sans', system-ui, sans-serif; }
    .bn-tabs a, .bn-tabs button { display: flex; align-items: center; justify-content: center; min-height: 54px; margin: 0; padding: 4px 2px; border: 0; border-radius: 0; border-top: 3px solid transparent; background: none; color: #1F2430; font: 600 13px/1.15 'IBM Plex Sans', system-ui, sans-serif; text-align: center; text-decoration: none; cursor: pointer; }
    .bn-tabs a[aria-current="page"] { color: #274472; border-top-color: #274472; }
    .bn-tabs button[aria-expanded="true"] { color: #274472; border-top-color: #274472; }
    body:has(.bn-tabs) { padding-bottom: 72px; }
    body:has(.bn-tabs) .jump { bottom: calc(66px + env(safe-area-inset-bottom)); }
}

@media print { .bn, .bn-sheet, .bn-tabs { display: none !important; } body { padding-bottom: 0 !important; } }