/* One shared header; every surface and text color follows its active page profile. */
.portal-navigation {
    position: fixed;
    z-index: 1100;
    inset: 0 0 auto;
    box-sizing: border-box;
    color: var(--portal-text);
    font-family: var(--portal-font-navigation);
    background: transparent;
    border-bottom: 1px solid var(--portal-border);
    box-shadow: 0 1px 0 color-mix(in srgb, var(--portal-accent) 5%, transparent);
    transition: background-color .18s ease, box-shadow .18s ease;
    isolation: isolate;
}

.portal-navigation[data-scrolled="true"],
.portal-navigation[data-navigation-open="true"] {
    background: var(--portal-header-surface);
    box-shadow: var(--portal-header-shadow);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.portal-navigation *, .portal-navigation *::before, .portal-navigation *::after { box-sizing: border-box; }
.portal-navigation [hidden] { display: none !important; }
.portal-navigation-row {
    --portal-brand-column-width: 19rem;
    --portal-resource-min-width: 8rem;
    display: flex;
    align-items: center;
    gap: .75rem;
    min-height: 78px;
    padding: .625rem 1.5rem;
}

/* A stable brand column anchors every global destination. Page branding and
   supplemental links cannot redistribute free space ahead of Applications. */
.portal-navigation-identity { flex: 0 0 var(--portal-brand-column-width); min-width: 0; }
.portal-brand-control { position: relative; width: 100%; min-width: 0; max-width: 100%; }
.portal-brand-home { display: block; min-width: 0; max-width: 100%; min-height: 44px; overflow: hidden; color: inherit; text-decoration: none; }
.portal-brand-home .sb-brand { width: 100%; max-width: 100%; }
.portal-developer-disclosure + .portal-brand-home { padding-inline-start: 3.125rem; }
.portal-developer-disclosure + .portal-brand-home .sb-brand { min-height: 44px; }
.portal-brand-control .portal-developer-disclosure {
    position: absolute;
    z-index: 2;
    inset: 0 auto auto 0;
    width: 44px;
    height: 44px;
}
.portal-developer-toggle {
    position: absolute;
    inset: 0;
    width: 44px;
    min-width: 44px;
    height: 44px;
    padding: 0 !important;
    border-radius: 14px !important;
}
.portal-developer-logo {
    display: block;
    width: 40px;
    height: 40px;
    object-fit: contain;
}
.portal-developer-toggle .portal-chevron {
    position: absolute;
    inset: auto -2px -2px auto;
    width: 16px !important;
    height: 16px !important;
    padding: 3px;
    border: 1px solid var(--portal-border-strong);
    border-radius: 50%;
    background: var(--portal-surface-raised);
    color: var(--portal-accent);
    box-shadow: 0 4px 12px color-mix(in srgb, var(--portal-accent) 18%, transparent);
}
.portal-developer-toggle:hover,
.portal-developer-toggle[aria-expanded="true"] {
    border-color: color-mix(in srgb, var(--portal-accent) 65%, var(--portal-border));
    background: color-mix(in srgb, var(--portal-accent) 10%, transparent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--portal-accent) 9%, transparent),
        0 8px 22px color-mix(in srgb, var(--portal-accent) 18%, transparent);
}
.portal-developer-panel { inset: calc(100% + .75rem) auto auto 0; min-width: 17rem; }
.portal-dropdown-heading {
    margin: .2rem .625rem .45rem;
    color: var(--portal-text-muted);
    font-family: var(--portal-font-descriptor);
    font-size: .6875rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}
.portal-navigation-location {
    display: flex;
    align-items: center;
    gap: .4rem;
    min-width: 0;
    margin: .125rem 0 0 3.125rem;
    color: var(--portal-text-muted);
    font-size: .8125rem;
    line-height: 1.35;
}
.portal-current-location { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-navigation-breadcrumbs { display: flex; flex: 0 1 auto; min-width: 0; max-width: 55%; overflow: hidden; gap: .2rem; white-space: nowrap; }
.portal-navigation-breadcrumbs a { color: inherit; text-underline-offset: 3px; overflow: hidden; text-overflow: ellipsis; }
.portal-context-badge {
    display: inline-block;
    flex: 0 0 auto;
    padding: .05rem .35rem;
    border: 1px solid var(--portal-border);
    border-radius: .35rem;
    color: var(--portal-accent);
    font-size: .6875rem;
    font-weight: 700;
}
.portal-context-badge--attention { color: var(--portal-text); border-style: dashed; }

.portal-desktop-navigation, .portal-primary-direct, .portal-desktop-resources, .portal-desktop-account {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: .15rem;
}
.portal-desktop-resources {
    flex: 1 1 0%;
    min-width: var(--portal-resource-min-width);
    padding-inline-start: .7rem;
    border-inline-start: 1px solid var(--portal-border);
}
.portal-desktop-resources[aria-hidden="true"] { border-color: transparent; }
.portal-resources-direct { display: flex; min-width: 0; width: 100%; gap: .1rem; }
.portal-resources-direct > a { flex: 0 0 auto; }
.portal-resources-overflow { display: none; }
.portal-navigation[data-resource-layout="grouped"] .portal-resources-direct,
.portal-navigation:not([data-resource-layout]) .portal-resources-direct { display: none; }
.portal-navigation[data-resource-layout="grouped"] .portal-resources-overflow,
.portal-navigation:not([data-resource-layout]) .portal-resources-overflow { display: block; }
.portal-desktop-account { margin-inline-start: auto; }
.portal-primary-overflow, .portal-navigation .portal-mobile-toggle { display: none; }
.portal-navigation-link, .portal-navigation-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    min-height: 44px;
    padding: .625rem .625rem;
    border: 1px solid transparent;
    border-radius: .55rem;
    background: transparent;
    color: var(--portal-text);
    font: inherit;
    font-size: .9375rem;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: .015em;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
.portal-navigation-link:hover, .portal-navigation-button:hover,
.portal-navigation-button[aria-expanded="true"] {
    color: var(--portal-text);
    background: color-mix(in srgb, var(--portal-accent) 9%, transparent);
    border-color: var(--portal-border);
    text-decoration: none;
}
.portal-navigation-link[aria-current="page"],
.portal-navigation-button[data-contains-current="true"] {
    color: var(--portal-accent);
    background: color-mix(in srgb, var(--portal-accent) 9%, transparent);
    box-shadow: inset 0 -2px var(--portal-accent);
}
.portal-navigation a:focus-visible, .portal-navigation button:focus-visible {
    outline: 2px solid var(--portal-accent);
    outline-offset: 3px;
}
.portal-navigation-button:active, .portal-navigation-link:active { background: color-mix(in srgb, var(--portal-accent) 16%, transparent); }
.portal-supplemental-link { color: var(--portal-text-muted); font-size: .875rem; font-weight: 500; }
.portal-sign-in { border-color: var(--portal-border); background: color-mix(in srgb, var(--portal-accent) 9%, transparent); }
.portal-theme-toggle { min-width: 44px; padding-inline: .65rem; color: var(--portal-text-muted); }
.portal-navigation-button svg {
    width: 1.1rem;
    height: 1.1rem;
    flex-shrink: 0;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.portal-navigation .portal-navigation-icon {
    display: inline-block;
    width: 1.125rem;
    height: 1.125rem;
    flex: 0 0 1.125rem;
    fill: currentColor;
    stroke: none;
    opacity: .85;
}
.portal-navigation-button .portal-chevron { width: .8rem; height: .8rem; transition: transform .15s ease; }
.portal-navigation-button[aria-expanded="true"] .portal-chevron { transform: rotate(180deg); }
.portal-external-marker { display: inline-flex; font-size: .9em; }
.portal-disclosure { position: relative; }
.portal-dropdown {
    position: absolute;
    inset: calc(100% + .625rem) auto auto 0;
    width: max-content;
    min-width: 14rem;
    max-width: min(24rem, calc(100vw - 2rem));
    max-height: calc(100dvh - var(--portal-header-height) - 1rem);
    overflow: auto;
    overscroll-behavior: contain;
    padding: .5rem;
    border: 1px solid var(--portal-border);
    border-radius: .875rem;
    background: var(--portal-surface-raised);
    color: var(--portal-text);
    box-shadow: var(--portal-header-shadow);
}
.portal-dropdown .portal-navigation-link, .portal-dropdown .portal-navigation-button {
    display: flex;
    justify-content: flex-start;
    width: 100%;
    text-align: start;
    white-space: normal;
    overflow-wrap: anywhere;
}
.portal-dropdown[data-align="end"], .portal-account-panel { inset-inline: auto 0; }
.portal-account-identity { margin: .25rem .625rem .65rem; font-weight: 700; overflow-wrap: anywhere; }
.portal-workspace-detail { margin: .35rem .625rem .7rem; line-height: 1.4; overflow-wrap: anywhere; }
.portal-workspace-detail span { display: block; color: var(--portal-text-muted); font-size: .75rem; }
.portal-workspace-detail strong { font-size: .875rem; font-weight: 600; }
.portal-workspace-notice { color: var(--portal-text-muted); font-size: .8125rem; }
.portal-account-panel { min-width: min(22rem, calc(100vw - 2rem)); }
.portal-account-section { padding: .75rem 0; }
.portal-account-section + .portal-account-section { border-top: 1px solid var(--portal-border); }
.portal-account-section:last-child { padding-bottom: .25rem; }
.portal-account-section h3 {
    margin: 0 .625rem .45rem;
    color: var(--portal-text-muted);
    font-family: var(--portal-font-descriptor);
    font-size: .6875rem;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: .1em;
    text-transform: uppercase;
}
.portal-account-section--facts {
    margin-bottom: .25rem;
    border-radius: .55rem;
    background: color-mix(in srgb, var(--portal-accent) 5%, transparent);
}
.portal-account-section--facts .portal-account-identity { margin-bottom: .5rem; }
.portal-account-section--session .portal-navigation-button { border-color: var(--portal-border); }
.portal-appearance-state { display: inline-flex; align-items: center; gap: .4rem; margin-inline-start: auto; padding-inline-start: .6rem; font-size: .75rem; }
.portal-appearance-switch-track { display: inline-flex; align-items: center; width: 2rem; height: 1.125rem; padding: .125rem; border: 1px solid var(--portal-text-muted); border-radius: 1rem; }
.portal-appearance-switch-track > span { width: .7rem; height: .7rem; border-radius: 50%; background: var(--portal-text-muted); }
.portal-appearance-switch[aria-checked="true"] .portal-appearance-switch-track { border-color: var(--portal-accent); background: var(--portal-accent); }
.portal-appearance-switch[aria-checked="true"] .portal-appearance-switch-track > span { margin-inline-start: auto; background: var(--portal-surface-raised); }
.portal-mobile-account .portal-navigation-link,
.portal-mobile-account .portal-navigation-button { display: flex; width: 100%; justify-content: flex-start; white-space: normal; text-align: start; }
.portal-navigation[data-nav-layout="condensed"][data-portal-audience="authenticated"] .portal-primary-direct { display: none; }
.portal-navigation[data-nav-layout="condensed"] .portal-primary-overflow { display: block; }
.portal-navigation[data-nav-layout="condensed"] .portal-navigation-breadcrumbs { display: none; }

.portal-mobile-panel {
    position: fixed;
    inset: var(--portal-header-height) 0 auto;
    max-height: calc(100vh - var(--portal-header-height));
    max-height: calc(100dvh - var(--portal-header-height));
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 1rem max(1rem, env(safe-area-inset-right)) max(1.5rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));
    background: var(--portal-surface-raised);
    border-bottom: 1px solid var(--portal-border);
    box-shadow: var(--portal-header-shadow);
}
.portal-mobile-context { padding: 0 .625rem 1rem; }
.portal-mobile-context-kicker { display: block; color: var(--portal-text-muted); font-size: .75rem; }
.portal-mobile-context > strong { display: block; margin-top: .2rem; font-size: 1.125rem; overflow-wrap: anywhere; }
.portal-mobile-context .portal-account-identity, .portal-mobile-context .portal-workspace-detail { margin-inline: 0; margin-bottom: 0; }
.portal-mobile-panel h2 {
    margin: 0 .625rem .4rem;
    color: var(--portal-text-muted);
    font-family: var(--portal-font-descriptor);
    font-size: .6875rem;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: .1em;
    text-transform: uppercase;
}
.portal-mobile-group, .portal-mobile-resources, .portal-mobile-account { padding: .875rem 0; border-top: 1px solid var(--portal-border); }
.portal-mobile-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .25rem; }
.portal-mobile-links .portal-navigation-link, .portal-mobile-links .portal-navigation-button {
    justify-content: flex-start;
    width: 100%;
    min-width: 0;
    text-align: start;
    white-space: normal;
    overflow-wrap: anywhere;
}
.portal-mobile-resources .portal-navigation-link { color: var(--portal-accent); border-color: var(--portal-border); }
.portal-navigation[data-nav-layout="compact"] .portal-desktop-navigation,
.portal-navigation[data-nav-layout="compact"] .portal-desktop-resources,
.portal-navigation[data-nav-layout="compact"] .portal-desktop-account { display: none; }
.portal-navigation[data-nav-layout="compact"] .portal-mobile-toggle { display: inline-flex; flex: 0 0 auto; }
.portal-page-panel-toggle { flex: 0 0 auto; color: var(--portal-accent); border-color: var(--portal-border); }
/* Enlarged text can need a second control row while retaining full branding. */
.portal-navigation[data-nav-layout="compact"][data-compact-rows="2"] .portal-navigation-row { display: grid; grid-template-columns: 1fr auto auto; }
.portal-navigation[data-compact-rows="2"] .portal-navigation-identity { grid-column: 1 / -1; }
.portal-navigation[data-compact-rows="2"] .portal-page-panel-toggle { grid-column: 2; }
.portal-navigation[data-compact-rows="2"] .portal-mobile-toggle { grid-column: 3; }
.portal-navigation[data-nav-layout="compact"] .portal-navigation-identity { flex: 1 1 auto; min-width: 0; }
.portal-navigation[data-nav-layout="compact"] .portal-navigation-breadcrumbs,
.portal-navigation[data-nav-layout="compact"] .portal-brand-home .sb-brand-tagline,
.portal-navigation[data-nav-layout="compact"] .portal-brand-home .sb-brand-product { display: none; }
.portal-navigation[data-nav-layout="compact"] .portal-navigation-row { min-height: 72px; }
.portal-navigation[data-nav-layout="compact"] .portal-navigation-location { margin-top: -.6rem; }
.portal-navigation[data-nav-layout="compact"] .portal-brand-home .sb-brand-title { transform: translateY(-.45rem); }
.portal-navigation[data-nav-layout="compact"] .portal-context-badge { max-width: 5rem; overflow: hidden; text-overflow: ellipsis; }

.portal-skip-link {
    position: absolute;
    top: .5rem;
    left: 1rem;
    z-index: 2;
    transform: translateY(-180%);
    padding: .75rem 1rem;
    border: 2px solid var(--portal-accent);
    border-radius: .5rem;
    background: var(--portal-surface-raised);
    color: var(--portal-text);
}
.portal-skip-link:focus { transform: none; }
.portal-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

/* Fit measurement takes over after hydration. This avoids clipping before JS loads. */
@media (max-width: 1120px) {
    .portal-navigation:not([data-nav-layout]) .portal-desktop-navigation,
    .portal-navigation:not([data-nav-layout]) .portal-desktop-resources,
    .portal-navigation:not([data-nav-layout]) .portal-desktop-account { display: none; }
    .portal-navigation:not([data-nav-layout]) .portal-mobile-toggle { display: inline-flex; }
    .portal-navigation:not([data-nav-layout]) .portal-navigation-identity { flex: 1 1 auto; min-width: 0; }
}
@media (max-width: 400px) {
    .portal-mobile-links { grid-template-columns: minmax(0, 1fr); }
    .portal-navigation-row { padding-inline: .75rem; gap: .1rem; }
    .portal-mobile-toggle { padding-inline: .5rem; }
    .portal-navigation[data-nav-layout="compact"] .portal-brand-home .sb-brand { --sb-brand-logo-size: 2rem; --sb-brand-logo-gap: .5rem; font-size: 1rem; }
    .portal-navigation[data-nav-layout="compact"] .portal-navigation-location { margin-inline-start: 2.5rem; }
    .portal-navigation[data-nav-layout="compact"] .portal-brand-home .sb-brand-title { transform: none; }
    .portal-navigation[data-nav-layout="compact"] .portal-navigation-location { margin-top: -.25rem; }
}
@media (prefers-reduced-motion: reduce) {
    .portal-navigation, .portal-navigation-button .portal-chevron { transition: none; }
}