/* One navigation component, isolated from each page's form and table styles. */
.portal-navigation { position: relative; width: min(300px, 100%); min-width: 0; z-index: 30; font: 14px/1.25 system-ui, sans-serif; --nav-surface: #fff; --nav-text: #223247; --nav-muted: #56667a; --nav-border: #dce2e8; --nav-accent: #236458; --nav-active: #e5f2ee; }
html[data-theme="dark"] .portal-navigation { --nav-surface: #20262d; --nav-text: #e7edf3; --nav-muted: #b1bfcd; --nav-border: #46515d; --nav-accent: #88ccbc; --nav-active: #253e38; }
.portal-navigation, .portal-navigation * { box-sizing: border-box; }
.portal-navigation .portal-navigation-button { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 48px; margin: 0; padding: 7px 12px; border: 1px solid var(--nav-border); border-radius: 6px; background: var(--nav-surface); color: var(--nav-text); font: inherit; text-align: left; cursor: pointer; box-shadow: none; }
.portal-navigation-button > span { min-width: 0; }
.portal-navigation-button small, .portal-navigation-button strong { display: block; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-navigation .portal-navigation-button small { color: var(--nav-muted); font: 11px/1.25 system-ui, sans-serif; }
.portal-navigation .portal-navigation-button strong { font: 600 14px/1.25 system-ui, sans-serif; }
.portal-navigation .portal-navigation-chevron { width: 18px; height: 18px; flex: 0 0 18px; color: #526f8f; }
html[data-theme="dark"] .portal-navigation .portal-navigation-chevron { color: #a8bdd0; }
.portal-navigation-button[aria-expanded="true"] .portal-navigation-chevron { transform: rotate(180deg); }
.portal-navigation nav { display: block; position: absolute; top: calc(100% + 8px); left: 0; width: min(360px, calc(100vw - 48px)); max-height: 65vh; overflow: auto; margin: 0; padding: 6px; border: 1px solid var(--nav-border); border-radius: 6px; background: var(--nav-surface); box-shadow: 0 8px 24px #0002; }
.portal-navigation nav[hidden] { display: none !important; }
.portal-navigation nav a { display: block; min-height: 44px; margin: 0; padding: 12px; color: var(--nav-text); background: transparent; text-decoration: none; border-radius: 4px; overflow-wrap: anywhere; font: 14px/1.25 system-ui, sans-serif; }
.portal-navigation nav a:hover, .portal-navigation nav a[aria-current="page"] { background: var(--nav-active); color: var(--nav-accent); }
.portal-navigation nav .portal-navigation-group { margin: 6px 12px; color: var(--nav-muted); font: 11px/1.4 system-ui, sans-serif; }
.portal-navigation :focus-visible { outline: 2px solid var(--nav-accent); outline-offset: 3px; }
/* The tasks stylesheet otherwise constrains all header elements. */
header.portal-header { max-width: none; width: 100%; margin: 0; }
.portal-navigation { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.portal-navigation > .portal-navigation-button { flex: 1 0 180px; min-width: 0; max-width: 100%; }
.portal-navigation .portal-navigation-chat { display: inline-flex; align-items: center; min-height: 44px; padding: 8px; color: var(--nav-accent); font: inherit; text-decoration: none; }

/* Shared dropdown controls use the existing navigation tokens. */
.portal-navigation-common-pages { border-top:1px solid var(--nav-border); margin-top:6px; padding-top:6px; }
.portal-navigation .portal-navigation-status { margin-left:8px; color:var(--nav-muted); font-size:11px; }
.portal-workspace-switcher { flex:0 1 220px; width:220px; }
.portal-workspace-switcher[hidden] { display:none!important; }
.portal-navigation .workspace-menu-sections { display:block; }
.portal-navigation nav [hidden] { display:none!important; }
.portal-navigation .portal-navigation-search { display:block; width:100%; min-width:0; min-height:44px; margin:0 0 6px; padding:10px 12px; border:1px solid var(--nav-border); border-radius:4px; background:var(--nav-surface); color:var(--nav-text); font:inherit; }
.portal-navigation .portal-navigation-search::placeholder { color:var(--nav-muted); }
.portal-navigation .portal-navigation-empty { margin:12px; color:var(--nav-muted); font:inherit; }

/* An open dropdown must cover adjacent controls, including the account avatar. */
.portal-navigation:has(> .portal-navigation-button[aria-expanded="true"]) { z-index:70; }
html body [data-portal-global-slot="messages"] { flex: 0 0 40px; }
html body [data-portal-global-slot="messages"][hidden] { display: none !important; }
html body .portal-messenger-button { box-sizing: border-box; display: flex; align-items: center; justify-content: center; width: 40px; height: 48px; padding: 8px; border: 1px solid var(--portal-line, var(--border)); border-radius: 6px; background: var(--portal-surface, var(--surface)); color: var(--portal-text, var(--text)); text-decoration: none; }
html body .portal-messenger-button svg { width: 24px; height: 24px; flex: none; }
html body .portal-messenger-button:hover { background: var(--portal-surface-2, var(--surface-2)); }
html body .portal-messenger-button:focus-visible { outline: 2px solid var(--portal-accent, var(--accent)); outline-offset: 3px; }
html body .portal-messenger-button { position:relative; }
html body .portal-messenger-badge { position:absolute; top:-4px; right:-5px; box-sizing:border-box; min-width:18px; height:18px; padding:0 4px; display:flex; align-items:center; justify-content:center; border:2px solid var(--portal-surface, var(--surface)); border-radius:999px; background:var(--portal-accent, var(--accent)); color:var(--portal-surface, var(--surface)); font:700 10px/1 ui-sans-serif,system-ui,sans-serif; pointer-events:none; }
html body .portal-messenger-badge[hidden] { display:none; }
/* PORTAL-MENU-UNIFIED-001. Only the common menu and its personal dialogs. */
.portal-navigation { --nav-surface-2:#f5f7f9; --nav-surface-3:#eaf0f3; --nav-shadow:0 4px 16px #22324712; }
html[data-theme="dark"] .portal-navigation { --nav-surface-2:#272f38; --nav-surface-3:#333e49; --nav-shadow:0 4px 16px #0003; }
html body .portal-tools-layer { position:fixed; inset:0; width:0; height:0; display:block; z-index:1000; pointer-events:none; }
html body .portal-tools-layer[hidden] { display:none!important; }
html body .portal-tools-panel { position:fixed; margin:0; padding:0; border:1px solid var(--nav-border); border-radius:6px; background:var(--nav-surface); color:var(--nav-text); box-shadow:var(--nav-shadow); display:flex; flex-direction:column; overflow:hidden; isolation:isolate; pointer-events:auto; font:14px/1.4 system-ui,sans-serif; max-height:none; }
html body .portal-tools-panel[hidden] { display:none!important; }
html body .portal-tools-panel *,html body .portal-workplace-settings * { box-sizing:border-box; }
.portal-menu-icon { display:block; width:18px; height:18px; flex:none; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
html body .portal-tools-panel .portal-tools-heading,html body .portal-workplace-settings .portal-tools-heading { min-height:52px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:4px 8px 4px 16px; flex:none; margin:0; width:auto; max-width:none; background:var(--nav-surface); }
.portal-menu-title { display:flex; align-items:center; gap:10px; min-width:0; }
html body .portal-tools-panel h2,html body .portal-workplace-settings h2 { font:650 16px/1.3 system-ui,sans-serif; color:var(--nav-text); margin:0; }
.portal-menu-count { font-size:12px; line-height:20px; min-width:22px; padding:0 5px; text-align:center; border-radius:4px; background:var(--nav-surface-3); color:var(--nav-muted); font-variant-numeric:tabular-nums; flex:none; }
html body .portal-tools-panel button,html body .portal-workplace-settings button { font:inherit; cursor:pointer; color:var(--nav-text); min-height:44px; border:1px solid var(--nav-border); border-radius:6px; background:var(--nav-surface); padding:8px 12px; box-shadow:none; display:inline-flex; align-items:center; justify-content:center; gap:8px; }
html body .portal-tools-panel button:disabled,html body .portal-workplace-settings button:disabled { cursor:default; opacity:.45; }
html body .portal-tools-panel .portal-menu-icon-button,html body .portal-workplace-settings .portal-menu-icon-button { flex:0 0 44px; width:44px; min-width:44px; min-height:44px; padding:10px; border:0; border-radius:6px; background:transparent; color:var(--nav-muted); }
html body .portal-tools-panel button:hover:not(:disabled),html body .portal-workplace-settings button:hover:not(:disabled) { background:var(--nav-surface-2); }
html body .portal-tools-panel .portal-menu-icon-button:hover:not(:disabled),html body .portal-workplace-settings .portal-menu-icon-button:hover:not(:disabled) { background:var(--nav-surface-3); color:var(--nav-text); }
html body .portal-tools-panel .portal-menu-search,html body .portal-workplace-settings .portal-menu-search { display:flex; align-items:center; margin:0 12px 8px; min-height:44px; border:1px solid var(--nav-border); border-radius:6px; background:var(--nav-surface); flex:none; gap:8px; padding-left:12px; }
.portal-menu-search:focus-within { outline:2px solid var(--nav-accent); outline-offset:1px; }
.portal-menu-search > .portal-menu-icon { color:var(--nav-muted); }
html body .portal-tools-panel .portal-menu-search input,html body .portal-workplace-settings .portal-menu-search input { background:none; border:0; outline:none; min-width:0; flex:1; width:auto; height:42px; min-height:42px; padding:8px 0; margin:0; box-shadow:none; color:var(--nav-text); font:inherit; }
.portal-menu-search input::placeholder { color:var(--nav-muted); opacity:1; }
.portal-menu-search input::-webkit-search-cancel-button { -webkit-appearance:none; }
.portal-menu-search .portal-menu-icon-button { border-radius:0 5px 5px 0; }
.portal-menu-body { display:flex; flex-direction:column; min-height:0; flex:1; border-top:1px solid var(--nav-border); }
.portal-menu-results { flex:none; margin:0; padding:14px 18px 10px; color:var(--nav-muted); font-size:12px; }
.portal-tools-list { overflow:auto; min-height:0; flex:1; padding:4px 10px 12px; overscroll-behavior:contain; scrollbar-width:thin; }
.portal-tool-row { display:flex; align-items:stretch; min-width:0; position:relative; border-radius:5px; min-height:44px; margin:1px 0; gap:2px; border:1px solid transparent; }
.portal-tool-row:hover { background:var(--nav-surface-2); }
.portal-tool-row.is-active { background:var(--nav-active); color:var(--nav-accent); }
.portal-tool-row.is-active::before { content:''; position:absolute; left:0; top:10px; bottom:10px; width:2px; background:var(--nav-accent); border-radius:2px; }
html body .portal-tools-panel .portal-tool-row > a { display:flex; align-items:center; gap:10px; min-width:0; flex:1; padding:10px 8px 10px 12px; text-decoration:none; min-height:44px; border-radius:5px; font:inherit; line-height:1.3; color:inherit; background:transparent; }
.portal-menu-copy { flex:1; min-width:0; }
.portal-menu-name { display:block; overflow-wrap:anywhere; }
html body .portal-tools-panel small,html body .portal-workplace-settings .portal-menu-copy small { display:block; color:var(--nav-muted); font-size:12px; margin-top:3px; line-height:1.3; }
.portal-tool-row a[aria-current="page"] .portal-menu-name { font-weight:600; }
.portal-tool-row a > .portal-menu-icon { width:16px; height:16px; color:var(--nav-accent); }
html body .portal-tools-panel .portal-menu-star { align-self:center; margin-right:3px; }
.portal-menu-star .portal-menu-icon { width:17px; height:17px; }
html body .portal-tools-panel .portal-menu-star[aria-pressed="true"] { color:var(--nav-accent); }
.portal-menu-star[aria-pressed="true"] svg { fill:var(--nav-accent); }
.portal-tool-divider { height:1px; margin:8px 12px; background:var(--nav-border); flex:none; }
html body .portal-tools-panel .portal-tools-footer { display:flex; align-items:center; justify-content:space-between; min-height:56px; padding:5px 12px; border-top:1px solid var(--nav-border); flex:none; gap:8px; background:var(--nav-surface); }
html body .portal-tools-panel .portal-menu-settings-open { min-height:44px; padding:8px; border:0; border-radius:5px; color:var(--nav-accent); text-align:left; }
.portal-menu-keys { font-size:11px; color:var(--nav-muted); white-space:nowrap; }
.portal-menu-empty { padding:36px 20px; text-align:center; margin:0; color:var(--nav-muted); }
.portal-menu-status { padding:10px 16px; margin:0; color:var(--nav-accent); font-size:12px; flex:none; border-top:1px solid var(--nav-border); background:var(--nav-active); }
html body .portal-tools-panel .portal-menu-retry { margin:0 16px 8px; }
html body dialog.portal-workplace-settings { --nav-surface:#fff; --nav-text:#223247; --nav-muted:#56667a; --nav-border:#dce2e8; --nav-accent:#236458; --nav-active:#e5f2ee; --nav-surface-2:#f5f7f9; --nav-surface-3:#eaf0f3; --nav-shadow:0 4px 16px #22324712; width:min(704px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); padding:0; border:1px solid var(--nav-border); border-radius:6px; background:var(--nav-surface); color:var(--nav-text); box-shadow:var(--nav-shadow); font:14px/1.4 system-ui,sans-serif; }
html[data-theme="dark"] body dialog.portal-workplace-settings { --nav-surface:#20262d; --nav-text:#e7edf3; --nav-muted:#b1bfcd; --nav-border:#46515d; --nav-accent:#88ccbc; --nav-active:#253e38; --nav-surface-2:#272f38; --nav-surface-3:#333e49; --nav-shadow:0 4px 16px #0003; }
html body dialog.portal-workplace-settings[open] { display:flex; flex-direction:column; }
html body dialog.portal-workplace-settings::backdrop { background:transparent; }
html body .portal-workplace-settings .portal-tools-heading { border-bottom:1px solid var(--nav-border); min-height:58px; position:static; }
.portal-settings-body { padding:18px; overflow:auto; overscroll-behavior:contain; min-height:0; flex:1; }
.portal-personal-fields { border:0; margin:0; padding:0; min-width:0; }
.portal-menu-field-label { display:block; font-size:13px; font-weight:600; margin:0 0 8px; }
html body .portal-workplace-settings select { width:100%; min-height:44px; border:1px solid var(--nav-border); border-radius:6px; background:var(--nav-surface); color:var(--nav-text); padding:8px 12px; font:400 14px/1.4 system-ui,sans-serif; text-overflow:ellipsis; margin-top:8px; }
.portal-menu-field-help { font-size:12px; color:var(--nav-muted); margin:7px 0 22px; line-height:1.5; }
.portal-menu-settings-section { display:flex; gap:10px; align-items:center; margin:0 0 6px; }
html body .portal-workplace-settings h3 { font-size:14px; margin:0; font-weight:650; color:var(--nav-text); }
.portal-menu-pin-edit { display:flex; align-items:center; gap:6px; padding:4px 0; border-bottom:1px solid var(--nav-border); min-height:58px; }
.portal-menu-pin-number { width:22px; flex:none; color:var(--nav-muted); font-size:12px; }
.portal-menu-pin-edit .portal-menu-copy { margin-right:6px; }
.portal-menu-pin-controls { display:flex; flex:none; }
html body .portal-workplace-settings .portal-menu-drag { touch-action:none; cursor:grab; }
html body .portal-workplace-settings .portal-menu-drag:active { cursor:grabbing; }
.portal-menu-pin-edit.is-dragging { background:var(--nav-active); outline:1px solid var(--nav-accent); opacity:.8; }
html body .portal-workplace-settings .portal-menu-add-pins { margin-top:12px; width:100%; justify-content:flex-start; color:var(--nav-accent); }
.portal-menu-picker { margin-top:12px; }
html body .portal-workplace-settings .portal-menu-picker .portal-menu-search { margin:0 0 6px; }
.portal-menu-picker-list { max-height:260px; overflow:auto; border:1px solid var(--nav-border); border-radius:6px; padding:4px 8px; scrollbar-width:thin; }
.portal-tool-choice { display:flex; min-height:48px; align-items:center; gap:10px; padding:6px; cursor:pointer; }
.portal-tool-choice:hover { background:var(--nav-surface-2); }
html body .portal-workplace-settings .portal-tool-choice input { width:18px; height:18px; min-width:18px; min-height:18px; flex:none; accent-color:var(--nav-accent); }
.portal-tool-choice .portal-menu-name { font-size:13px; }
.portal-menu-dashboards { border-top:1px solid var(--nav-border); margin-top:22px; padding-top:8px; }
.portal-menu-dashboards summary { min-height:44px; padding:12px 0; cursor:pointer; }
.portal-menu-dashboards p { font-size:12px; color:var(--nav-muted); margin:0 0 8px; }
html body .portal-workplace-settings .portal-menu-dashboards a { display:block; min-height:44px; padding:12px 8px; text-decoration:none; border-radius:4px; color:var(--nav-text); }
.portal-menu-dashboards a:hover { background:var(--nav-surface-2); }
html body .portal-workplace-settings .portal-tools-footer { display:flex; align-items:center; justify-content:flex-end; gap:8px; min-height:68px; padding:10px 16px; border-top:1px solid var(--nav-border); flex:none; }
.portal-menu-dirty-note { font-size:12px; color:var(--nav-muted); margin-right:auto; }
.portal-menu-settings-status { font-size:13px; line-height:1.5; padding:12px; margin-top:14px; background:var(--nav-active); border-radius:6px; }
html body .portal-workplace-settings .portal-menu-primary { background:var(--nav-accent); color:var(--nav-surface); border-color:var(--nav-accent); }
html[data-theme="dark"] body .portal-workplace-settings .portal-menu-primary { color:#181c21; }
html body .portal-workplace-settings .portal-menu-primary:hover:not(:disabled) { background:var(--nav-accent); }
/* Shield the common dialog from older page-wide dark-dialog selectors. */
html[data-theme] body dialog.portal-workplace-settings :is(p,span,label,summary) { color:var(--nav-text); }
html[data-theme] body dialog.portal-workplace-settings :is(.portal-menu-field-help,.portal-menu-pin-number,.portal-menu-dirty-note,.portal-menu-dashboards p,.portal-menu-confirm p) { color:var(--nav-muted); }
html[data-theme] body dialog.portal-workplace-settings .portal-menu-count { color:var(--nav-muted); }
html[data-theme] body dialog.portal-workplace-settings button[type="button"] { color:var(--nav-text); background:var(--nav-surface); }
html[data-theme] body dialog.portal-workplace-settings button.portal-menu-icon-button { color:var(--nav-muted); background:transparent; }
html[data-theme] body dialog.portal-workplace-settings button:hover:not(:disabled) { background:var(--nav-surface-2); }
html[data-theme] body dialog.portal-workplace-settings .portal-menu-icon-button:hover:not(:disabled) { color:var(--nav-text); background:var(--nav-surface-3); }
html[data-theme] body dialog.portal-workplace-settings button.portal-menu-add-pins { color:var(--nav-accent); }
html[data-theme] body dialog.portal-workplace-settings button.portal-menu-primary,html[data-theme] body dialog.portal-workplace-settings .portal-menu-primary:hover:not(:disabled) { background:var(--nav-accent); color:var(--nav-surface); }
html[data-theme="dark"] body dialog.portal-workplace-settings button.portal-menu-primary { color:#181c21; }
html[data-theme] body dialog.portal-workplace-settings :is(.portal-settings-body,.portal-tools-footer) { background:var(--nav-surface); color:var(--nav-text); }
html body dialog.portal-menu-confirm { max-width:430px; padding:20px; }
html body .portal-menu-confirm h2 { font-size:17px; margin:0 0 10px; }
.portal-menu-confirm p { color:var(--nav-muted); margin:0 0 18px; }
.portal-menu-confirm-buttons { display:flex; gap:8px; justify-content:flex-end; flex-wrap:wrap; }
html body .portal-tools-panel :focus-visible,html body .portal-workplace-settings :focus-visible { outline:2px solid var(--nav-accent); outline-offset:2px; }
html body .portal-menu-search input:focus-visible { outline:none; }
html body .portal-tools-panel [hidden],html body .portal-workplace-settings [hidden] { display:none!important; }
@media(max-width:700px) {
 /* The page's stable scrollbar gutter otherwise clips 15px of a full-screen overlay. */
 html[data-theme]:has(body .portal-tools-panel[aria-modal="true"]),html[data-theme]:has(body dialog.portal-workplace-settings[open]) { scrollbar-gutter:auto; overflow:hidden; }
 html body .portal-tools-panel { border:0; border-radius:0; box-shadow:none; padding-top:env(safe-area-inset-top); }
 html body .portal-tools-panel .portal-tools-heading { min-height:56px; }
 html body .portal-tools-panel .portal-menu-search { margin:0 12px 10px; }
 .portal-tools-list { padding:0 10px 10px; }
 .portal-tool-row { min-height:50px; }
 html body .portal-tools-panel .portal-tool-row > a { padding:12px 8px 12px 12px; }
 html body .portal-tools-panel .portal-tools-footer { min-height:62px; padding:6px 12px; padding-bottom:max(6px,env(safe-area-inset-bottom)); }
 html body .portal-tools-panel .portal-menu-settings-open { width:100%; justify-content:flex-start; }
 .portal-menu-keys { display:none; }
 html body dialog.portal-workplace-settings { width:100vw; max-width:100vw; max-height:100dvh; height:100dvh; inset:0; margin:0; border:0; border-radius:0; padding-top:env(safe-area-inset-top); }
 html body .portal-workplace-settings .portal-tools-heading { min-height:56px; }
 .portal-settings-body { padding:16px; }
 html body .portal-workplace-settings .portal-tools-footer { padding:10px 12px; padding-bottom:max(10px,env(safe-area-inset-bottom)); flex-wrap:wrap; min-height:68px; }
 .portal-menu-dirty-note { max-width:110px; }
 html body dialog.portal-menu-confirm { width:calc(100vw - 24px); max-width:430px; inset:0; height:auto; max-height:calc(100dvh - 32px); margin:auto; border:1px solid var(--nav-border); border-radius:6px; padding:20px; }
}
@media(max-width:360px) {
 .portal-menu-pin-edit { flex-wrap:nowrap; }
 .portal-menu-pin-edit .portal-menu-copy { flex-basis:auto; }
 .portal-menu-dirty-note { display:none; }
 .portal-settings-body { padding:12px; }
}
/* Settings keep the menu's exact anchor and viewport geometry. */
html body dialog.portal-workplace-panel { position:fixed; inset:auto; margin:0; max-width:none; max-height:none; box-sizing:border-box; }
