/* Approved tree header V2. Scoped presentation authority after legacy/theme styles.
   !important is required by the existing inline and theme rules documented in the QA evidence.
   No F3 card, connector, zoom or data styling is changed here. */
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active{background:#0A1730!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-social-head#familyTreeHeader{position:relative!important;z-index:200!important;left:auto!important;transform:none!important;display:block!important;width:100%!important;max-width:100%!important;min-height:0!important;box-sizing:border-box!important;margin:0 0 8px!important;padding:4px 12px!important;border:1px solid rgba(217,179,106,.28)!important;border-radius:12px!important;background:#081226!important;box-shadow:0 3px 10px rgba(0,0,0,.08)!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-social-head>div:first-child{display:none!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-head-actions{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:center!important;width:100%!important;max-width:none!important;min-width:0!important;gap:0 8px!important;margin:0!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-selector-wrap.htc-tree-select{grid-area:1 / 1 / 2 / 2!important;display:block!important;position:relative!important;min-width:0!important;width:100%!important;min-height:44px!important;height:auto!important;padding:0!important;overflow:visible!important;background:transparent!important;border:0!important;box-shadow:none!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-selector-wrap>span{display:none!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-selector-wrap select#familyTreeSelector{position:absolute!important;width:1px!important;height:1px!important;min-height:0!important;opacity:0!important;clip-path:inset(50%)!important;pointer-events:none!important;padding:0!important;border:0!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-selector-wrap .htc-tree-label{position:relative!important;inset:auto!important;transform:none!important;transition:none!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;width:100%!important;max-width:none!important;min-width:0!important;height:auto!important;min-height:44px!important;padding:0 18px 0 0!important;flex-direction:row!important;border:0!important;border-radius:8px!important;background:transparent!important;box-shadow:none!important;text-align:left!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-selector-wrap .htc-tree-family{display:block!important;min-width:0!important;max-height:none!important;overflow:visible!important;text-overflow:clip!important;white-space:normal!important;overflow-wrap:anywhere!important;font:650 16px/1.25 system-ui,sans-serif!important;letter-spacing:-.015em!important;color:#F2EFE8!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-selector-wrap .htc-tree-label::after{content:""!important;display:block!important;position:absolute!important;right:3px!important;top:50%!important;width:6px!important;height:6px!important;border:0!important;border-right:2px solid #D9B36A!important;border-bottom:2px solid #D9B36A!important;transform:translateY(-70%) rotate(45deg)!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-selector-wrap .htc-tree-label.is-single::after{display:none!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-head-actions .account-action.tree-invite-action{grid-area:1 / 2 / 2 / 3!important;position:static!important;inset:auto!important;transform:none!important;transition:none!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;width:auto!important;min-width:96px!important;min-height:44px!important;height:44px!important;box-sizing:border-box!important;margin:0!important;padding:0 12px!important;border:1px solid #D9B36A!important;border-radius:10px!important;background:#D9B36A!important;background-image:none!important;color:#081226!important;box-shadow:none!important;font:700 13px/1.2 system-ui,sans-serif!important;white-space:nowrap!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-header-meta{grid-column:1 / -1!important;position:relative!important;display:flex!important;align-items:center!important;flex-wrap:wrap!important;gap:0 6px!important;min-width:0!important;max-width:100%!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-header-meta>.htc-tree-detail{display:block!important;min-width:0!important;max-width:100%!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;overflow-wrap:anywhere!important;font:500 12px/1.45 system-ui,sans-serif!important;color:#AEBED0!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-header-pending{display:contents!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-header-pending[hidden]{display:none!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-header-pending>details.htc-header-unlinked{position:static!important;inset:auto!important;order:0!important;display:block!important;flex:0 1 auto!important;min-width:0!important;max-width:100%!important;max-height:none!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;overflow:visible!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-header-pending>details.htc-header-unlinked>summary{display:flex!important;align-items:center!important;box-sizing:border-box!important;min-height:44px!important;min-width:44px!important;padding:0 4px!important;border-radius:6px!important;list-style:none!important;font-size:0!important;line-height:1!important;color:#D9B36A!important;cursor:pointer!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-header-pending>details.htc-header-unlinked>summary::before{content:"· " attr(data-htc-pending-label) " ›"!important;font:600 12px/1.3 system-ui,sans-serif!important;color:#D9B36A!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-header-pending>details.htc-header-unlinked[open]>summary::before{content:"· " attr(data-htc-pending-label) " ⌄"!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-header-pending>details.htc-header-unlinked>summary::-webkit-details-marker{display:none!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-header-pending>details.htc-header-unlinked[open]>.humanidad-f3-unlinked-list{position:absolute!important;left:0!important;right:0!important;top:100%!important;z-index:80!important;display:flex!important;flex-direction:column!important;max-height:min(42dvh,320px)!important;box-sizing:border-box!important;overflow:auto!important;overscroll-behavior:contain!important;padding:10px!important;gap:8px!important;border:1px solid rgba(217,179,106,.32)!important;border-radius:12px!important;background:#081226!important;box-shadow:0 12px 28px rgba(0,0,0,.25)!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-header-pending .humanidad-f3-unlinked-list button{min-height:44px!important;max-width:100%!important;white-space:normal!important;overflow-wrap:anywhere!important;color:#F2EFE8!important;background:#172B44!important;border-color:rgba(217,179,106,.24)!important;font-size:13px!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .family-section-nav{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:3px!important;box-sizing:border-box!important;margin:0 0 8px!important;padding:3px!important;border:1px solid rgba(217,179,106,.24)!important;border-radius:12px!important;background:#081226!important;box-shadow:none!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .family-section-nav button{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-width:0!important;min-height:44px!important;height:auto!important;width:100%!important;padding:6px 3px!important;font:600 13px/1.2 system-ui,sans-serif!important;white-space:normal!important;overflow-wrap:anywhere!important;border:1px solid transparent!important;border-radius:9px!important;background:transparent!important;color:#BCC7D8!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .family-section-nav button[aria-current="page"]{background:#172B44!important;color:#E5C77F!important;border-color:rgba(217,179,106,.5)!important;}
@media(max-width:680px){html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active #familyMemberList#familyMemberList .htc-canvas .humanidad-f3-toolbar{min-height:56px!important;height:auto!important;max-height:none!important;box-sizing:border-box!important;padding:0 12px 6px!important;border:0!important;border-bottom:1px solid rgba(180,194,214,.16)!important;border-radius:0!important;background:#0A1730!important;box-shadow:none!important;overflow:visible!important;}
}
@media(max-width:680px){html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active #familyMemberList#familyMemberList .htc-canvas .humanidad-f3-toolbar .f3-nav-buttons{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:center!important;gap:8px!important;min-width:0!important;width:100%!important;}
}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active #familyMemberList#familyMemberList .htc-canvas .humanidad-f3-toolbar .hpx-side-group:not([hidden]){display:flex!important;min-width:0!important;padding:2px!important;border:1px solid rgba(217,179,106,.24)!important;border-radius:10px!important;background:#081226!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active #familyMemberList#familyMemberList .htc-canvas .humanidad-f3-toolbar .hpx-side-group>.hpx-side-btn{flex:1 1 0!important;min-width:0!important;min-height:44px!important;height:44px!important;padding:0 6px!important;border:0!important;border-radius:8px!important;background:transparent!important;color:#BCC7D8!important;font:600 12px/1.2 system-ui,sans-serif!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active #familyMemberList#familyMemberList .htc-canvas .humanidad-f3-toolbar .hpx-side-group>.hpx-side-btn[aria-pressed="true"]{background:#D9B36A!important;color:#081226!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active #familyMemberList#familyMemberList .htc-canvas .humanidad-f3-toolbar .htc-nav-toggle{min-height:44px!important;height:44px!important;padding:0 8px!important;border:1px solid rgba(217,179,106,.28)!important;border-radius:10px!important;background:#081226!important;color:#E5C77F!important;font:600 12px/1.2 system-ui,sans-serif!important;}
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active :is(.htc-tree-label,.tree-invite-action,.family-section-nav button,.htc-nav-toggle,.hpx-side-btn,.tree-header-pending summary):focus-visible{outline:2px solid #F0D18C!important;outline-offset:-2px!important;}
@media(min-width:681px){html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-social-head#familyTreeHeader{padding:0 12px!important}html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-head-actions{grid-template-columns:minmax(0,1fr) auto auto!important;gap:0 12px!important}html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-header-meta{grid-area:1 / 2 / 2 / 3!important;max-width:480px!important}html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-head-actions .account-action.tree-invite-action{grid-area:1 / 3 / 2 / 4!important}}
@media(max-width:360px){html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .family-section-nav button{font-size:12px!important}}
@media(prefers-reduced-motion:reduce){html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active :is(button,summary){transition:none!important}}

/* Legacy header actions are still the original event targets. Their visible F3
   equivalents remain in the toolbar/menu; do not let old absolute positioning
   spill these duplicate buttons over the approved navigation row. */
html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-head-actions>:is(#familyTreeHistoryBtn,#rebuildCleanTree,#addRelative){display:none!important;}

/* Fullscreen hides the mobile bar: its delayed clearance updates must not move the exit target. */
@media(max-width:680px){html.hno-ui body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .humanidad-f3-shell.htc-immersive .htc-dock{bottom:calc(12px + env(safe-area-inset-bottom))!important;}}

/* The mobile bar is cloned outside the account sidebar; hide that fixed layer too. */
@media(max-width:680px){html.htc-immersive-open body #humanidadMobileFixedBar{visibility:hidden!important;pointer-events:none!important;}}


/* Compact tree controls and relative picker on narrow screens. */
@media(max-width:680px){
 html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-social-head#familyTreeHeader{margin-bottom:4px!important;padding:2px 8px!important;}
 html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-selector-wrap .htc-tree-family{font-size:15px!important;line-height:1.12!important;}
 html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .tree-header-meta>.htc-tree-detail{font-size:11px!important;line-height:1.2!important;}
 html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active .family-section-nav{margin-bottom:4px!important;}
 html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active #familyMemberList#familyMemberList .htc-canvas .humanidad-f3-toolbar{min-height:48px!important;padding:0 8px 4px!important;}
 html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active #familyMemberList#familyMemberList .htc-canvas .humanidad-f3-toolbar .f3-nav-buttons{gap:6px!important;}
 html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active #familyMemberList#familyMemberList .htc-canvas > .hpx-navigator{top:calc(var(--htc-toolbar-h,44px) + 2px)!important;left:8px!important;right:8px!important;max-height:min(96px,18dvh)!important;margin:0!important;padding:5px 8px!important;border:0!important;border-bottom:1px solid rgba(217,179,106,.20)!important;border-radius:0 0 10px 10px!important;background:#0A1730!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;overflow:hidden!important;}
 html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active #familyMemberList#familyMemberList .htc-canvas > .hpx-navigator .hpx-nav-focus{display:none!important;}
 html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active #familyMemberList#familyMemberList .htc-canvas > .hpx-navigator .hpx-nav-rail{gap:10px!important;padding:0 0 3px!important;}
 html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active #familyMemberList#familyMemberList .htc-canvas > .hpx-navigator .hpx-nav-group{gap:3px!important;}
 html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active #familyMemberList#familyMemberList .htc-canvas > .hpx-navigator .hpx-nav-label{font-size:8px!important;letter-spacing:.1em!important;}
 html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active #familyMemberList#familyMemberList .htc-canvas > .hpx-navigator .hpx-nav-chips{gap:4px!important;}
 html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active #familyMemberList#familyMemberList .htc-canvas > .hpx-navigator .hpx-chip{min-height:44px!important;padding:3px 8px 3px 4px!important;gap:5px!important;background:rgba(23,43,68,.72)!important;box-shadow:none!important;}
 html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active #familyMemberList#familyMemberList .htc-canvas > .hpx-navigator .hpx-chip-name{font-size:12px!important;}
 html body #accountModal #familyView#familyView .account-view.tree-header-v2.htc-tree-view[data-view="tree"].active #familyMemberList#familyMemberList .htc-canvas > .hpx-navigator .hpx-chip-sub{font-size:10px!important;}
}


