body.family-v5 {background:#f5f7fb;color:#24344a}
#shared-family-header {position:relative;z-index:1600;flex:0 0 auto;width:100%}
#shared-family-header .v5-shell {display:flex;flex-direction:column;align-items:stretch!important;gap:0;padding:12px 18px;margin:6px 0 8px;border:1px solid #e2e8f0;border-radius:14px;background:#fff;box-shadow:0 3px 12px #182b4510}
.v5-top,.v5-toolbar,.v5-actions {display:flex;align-items:center;gap:10px;min-width:0}
.v5-top {justify-content:space-between}
.v5-toolbar {border-top:1px solid #edf0f5;padding-top:10px;margin-top:10px}
.v5-brand {display:flex;align-items:center;gap:10px;color:#182b45!important;text-decoration:none!important;min-width:0}
.v5-brand img {width:42px;height:42px;object-fit:contain;border-radius:10px;background:#f1f5fb}
.v5-brand strong,.v5-brand small {display:block;white-space:nowrap}
.v5-brand strong {font-size:16px;font-weight:750}.v5-brand small {font-size:11px;color:#718096}
.v5-desktop-nav,.v5-bottom-nav {display:flex;align-items:center;gap:4px}
.v5-desktop-nav a,.v5-bottom-nav a,#shared-family-header .family-mobile-pages a {display:flex;align-items:center;gap:7px;padding:9px 12px;border-radius:9px;text-decoration:none;color:#53647b;font-size:13px;font-weight:600;white-space:nowrap}
.v5-desktop-nav a[aria-current],.v5-bottom-nav a[aria-current],#shared-family-header .family-mobile-pages a[aria-current] {color:#175cd3;background:#eaf2ff}
#shared-family-header .v5-tool {display:inline-flex!important;align-items:center;justify-content:center;gap:6px;min-height:40px;border:1px solid #dbe4ef;border-radius:9px;padding:8px 11px;background:#fff;color:#28598e;font-size:13px;font-weight:600;cursor:pointer;width:auto;flex:0 0 auto}
#shared-family-header .v5-tool[aria-expanded=true] {background:#eaf2ff;border-color:#9abcf0}
#shared-family-header .branch-tabs {display:none!important}
.v5-branch-select,.v5-current-branch,#shared-family-header #groupFilter {min-height:40px;border:1px solid #dbe4ef;background:#f7f9fc;border-radius:9px;padding:8px 12px;color:#24466d;font-size:14px;font-weight:600}
.v5-current-branch {display:flex;align-items:center;text-decoration:none!important}
.v5-search-slot {flex:1;min-width:0;max-width:540px}.v5-search-container {position:relative;z-index:1001;width:100%}
#chartSearchRow input {height:40px;border:1px solid #dbe4ef;border-radius:9px;padding:8px 12px;background:#fff;font-size:14px}
.v5-search-container>div:nth-child(2) {position:absolute;top:100%;left:0;right:0;box-shadow:0 8px 20px #182b4520;border-radius:8px}
#chartSearchRow .mobile-sections-toggle {display:none!important}.v5-group-control {display:flex;align-items:center;gap:8px}
#shared-family-header .family-header-menu {display:none!important}
#shared-family-header.family-menu-open .family-header-menu {display:flex!important;position:fixed;inset:0 0 0 auto;width:min(360px,90vw);max-width:100%;height:100dvh;z-index:2002;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:18px;padding:22px 18px;margin:0!important;background:#fff;border:0;box-shadow:-12px 0 40px #182b452b;overflow-y:auto;visibility:visible;transform:none}
#shared-family-header.family-menu-open .family-mobile-menu-backdrop {display:block;position:fixed;inset:0;background:#172b4d55;z-index:2000}
#shared-family-header .family-mobile-menu-heading {display:flex;justify-content:space-between;align-items:center;font-size:17px;color:#182b45}
#shared-family-header .family-mobile-menu-close {border:0;background:#f1f5f9;border-radius:9px;width:40px;height:40px;font-size:26px}
#shared-family-header .family-mobile-pages {display:flex;flex-direction:column;gap:6px;margin:0}
#shared-family-header.family-menu-open .branch-search {display:flex!important;flex-direction:column;align-items:stretch;gap:12px;width:100%;margin:0!important}
#shared-family-header.family-header-phuhuy .branch-search {display:none!important}
#shared-family-header .family-header-legend {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;overflow:visible}
#shared-family-header #legend a {font-size:12px;padding:8px 3px;margin:0}.v5-legend-title {font-size:12px;font-weight:600;color:#64748b}
body.family-v5 #branch-info {display:none!important}
body.family-v5.v5-stats-open #branch-info {display:flex!important;max-height:min(38dvh,300px)!important;overflow:auto!important;background:#fff;padding:10px!important;border-radius:10px}
body.family-v5 #ky-tracks {display:none!important}
body.family-v5-home.v5-calendar-open #ky-tracks {display:flex!important;max-height:80px!important;overflow:hidden!important;background:#fff;border-radius:9px;padding:6px}
body.family-v5-home #FamilyChart {flex:1 1 auto!important;height:auto!important;min-height:0!important;margin:0!important;border:1px solid #e2e8f0;border-radius:12px}
.v5-bottom-nav {display:none}
@media(max-width:767.98px){
#shared-family-header .v5-shell {padding:10px;margin:0 0 6px!important;border-radius:12px}
.v5-top {gap:6px}.v5-brand {gap:7px;flex:1}.v5-brand img {width:32px;height:32px}.v5-brand strong {font-size:14px}.v5-brand small {font-size:10px}.v5-desktop-nav {display:none}.v5-actions {gap:4px}
#shared-family-header .v5-tool {width:34px;height:36px;min-height:36px;padding:0;flex:0 0 34px}#shared-family-header .v5-tool span {display:none}
.v5-toolbar {flex-wrap:wrap;gap:7px;margin-top:8px;padding-top:8px}.v5-branch-select,.v5-current-branch {flex:1 1 100%;width:100%;min-height:37px;font-size:13px;padding:7px 10px}.v5-search-slot {flex:1 1 100%;max-width:none}.v5-group-control {flex:1}#shared-family-header #groupFilter {flex:1;max-width:none}
.v5-bottom-nav {display:flex;position:fixed;bottom:0;left:0;right:0;z-index:1500;background:#fff;border-top:1px solid #e2e8f0;justify-content:space-around;padding:4px 8px calc(4px + env(safe-area-inset-bottom));box-shadow:0 -3px 16px #182b450b}.v5-bottom-nav a {flex:1;flex-direction:column;gap:3px;padding:6px 4px;font-size:11px}.v5-bottom-nav a span {font-size:21px;line-height:1}
body.family-v5-home > .flex.flex-column {padding-bottom:calc(64px + env(safe-area-inset-bottom))!important}body.family-v5-list #FamilyChart {margin-bottom:calc(70px + env(safe-area-inset-bottom))!important}body.family-v5-home #buildInfo {display:none}body.family-v5.v5-stats-open #branch-info {max-height:28dvh!important}
}
@media print {#shared-family-header,.v5-bottom-nav {display:none!important}}

#shared-family-header .branch-tabs.v5-debug-tabs {display:flex!important;flex-wrap:wrap;justify-content:flex-start;margin-top:8px;gap:6px}
#shared-family-header .branch-tabs.v5-debug-tabs .branch-btn {white-space:normal}
@media(min-width:768px) and (max-width:980px){.v5-top{flex-wrap:wrap}.v5-desktop-nav{order:3;flex:1 1 100%}}
body.family-v5-home > .flex.flex-column {display:flex!important;flex-direction:column!important;min-height:0}
#shared-family-header .v5-tool:focus-visible,#shared-family-header a:focus-visible,#shared-family-header select:focus-visible {outline:2px solid #1677ff;outline-offset:2px}
#shared-family-header #legend .legend-item.is-hidden {display:none!important}
@media(max-width:360px){.v5-brand small{display:none}.v5-brand strong{font-size:12px}.v5-brand img{width:27px;height:27px}#shared-family-header .v5-shell{padding:8px}.v5-actions{gap:3px}#shared-family-header .v5-tool{width:31px;flex-basis:31px}}

/* v6: two intrinsic-height summary rows, independent horizontal scrolling. */
body.family-v5.v5-stats-open #branch-info {
  flex:0 0 auto!important; height:auto!important; max-height:none!important;
  overflow:visible!important; min-width:0; gap:4px!important;
}
body.family-v5 #branch-info > #family-total,
body.family-v5 #branch-info > #stats-detail {
  flex:0 0 auto!important; width:100%; min-width:0; max-width:100%;
  box-sizing:border-box;
}
/* v7: independent seamless generation ticker; no visible scrollbar. */
body.family-v5 #branch-info > #stats-detail {
  overflow:hidden!important; white-space:nowrap; padding-bottom:2px!important;
  scrollbar-width:none;
}
body.family-v5 #stats-detail::-webkit-scrollbar {display:none;}
body.family-v5 #stats-detail .levels-viewport {flex:1 1 0;min-width:0;overflow:hidden;}
body.family-v5 #stats-detail .levels-marquee {display:flex;width:max-content;align-items:center;gap:36px;will-change:transform;}
body.family-v5 #stats-detail .levels-track {display:flex;align-items:center;gap:8px;flex:0 0 auto;width:max-content;white-space:nowrap;}
body.family-v5 #stats-detail .track2 {display:none;}
body.family-v5 #stats-detail .level-card, body.family-v5 #stats-detail .ky-sep {flex-shrink:0;}
body.family-v5 #stats-detail.levels-moving .track2 {display:flex;}
body.family-v5 #stats-detail.levels-moving .levels-marquee {animation:familyLevelsMarquee var(--levels-duration,40s) linear infinite;}
body.family-v5 #stats-detail .levels-viewport:hover .levels-marquee,
body.family-v5 #stats-detail .levels-viewport:focus-within .levels-marquee,
body.family-v5 #stats-detail.levels-paused .levels-marquee {animation-play-state:paused!important;}
@keyframes familyLevelsMarquee {from {transform:translate3d(0,0,0);} to {transform:translate3d(calc(-1 * var(--levels-distance, 0px)),0,0);}}
body.family-v5 #stats-detail .levels-pause {flex:0 0 24px;width:24px;height:24px;padding:0;border:1px solid #dbe4ef;border-radius:5px;background:#fff;color:#64748b;font:12px system-ui;cursor:pointer;}
body.family-v5 #stats-detail .levels-pause[hidden] {display:none!important;}
/* This ticker is explicitly enabled by design; it can be paused by its own control. */
body.family-v5-home #ky-tracks {flex:0 0 auto;min-width:0;}
.v5-list-actions {display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-left:auto;flex-wrap:wrap;}
.v5-list-actions #print-button,.v5-list-actions #export-button {margin:0;white-space:nowrap;}
/* List viewport uses remaining height, not a fixed 100vh minus an old header. */
body.family-v5-list {display:flex;flex-direction:column;height:100vh;height:100dvh;overflow:hidden;}
body.family-v5-list #page-controls {flex:0 0 auto;min-width:0;}
body.family-v5-list #FamilyChart {flex:1 1 auto!important;min-height:0;height:auto!important;margin:0!important;overflow:auto;}
body.family-v5-list #FamilyChart .table-container {overflow:visible;}
#FamilyChart .family-age-content {display:flex;align-items:center;justify-content:space-between;gap:7px;min-width:42px;font-size:16px;font-weight:600;}
@media(min-width:768px) {#FamilyChart .family-age-content {justify-content:flex-start;}}
@media(max-width:767.98px) {
  body.family-v5.v5-stats-open #branch-info {max-height:28dvh!important;overflow-y:auto!important;overflow-x:hidden!important;}
  .v5-list-actions {width:100%;gap:6px;margin-left:0;}
  .v5-list-actions #print-button,.v5-list-actions #export-button {font-size:11px;min-height:32px;padding:5px 9px;box-shadow:none;}
  #FamilyChart .family-open-tree {width:28px;height:28px;min-width:28px;border-radius:6px;vertical-align:middle;}
  #FamilyChart .family-age-content {font-size:12px;gap:5px;}
  body.family-v5-list #FamilyChart {margin-bottom:calc(64px + env(safe-area-inset-bottom))!important;}
}
@media print {
  body.family-v5-list {display:block;height:auto;overflow:visible;}
  body.family-v5-list #FamilyChart {height:auto!important;overflow:visible!important;margin:0!important;}
  .v5-list-actions,.family-open-tree {display:none!important;}
}

body.family-v5 #branch-info > #stats-detail[hidden] {display:none!important;}
body.family-v5 #stats-detail:focus-visible {outline:2px solid #1677ff;outline-offset:-2px;border-radius:4px;}

#FamilyChart .family-cemetery-content {display:flex;align-items:center;justify-content:space-between;gap:7px;font-size:14px;font-weight:600;}
@media(max-width:767.98px){#FamilyChart .family-cemetery-content{font-size:12px;}}

/* v9: single-row home header, branch in brand subtitle, search on demand. */
#shared-family-header .v5-shell {position:relative;}
#shared-family-header .v9-brand {flex:0 1 auto;min-width:0;}
#shared-family-header .v9-logo {display:flex;flex:none;}
#shared-family-header .v9-brand-text {min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:1px;}
#shared-family-header .v9-brand-name {color:#182b45;text-decoration:none;}
#shared-family-header .v9-branch {display:block;min-height:0;height:23px;max-width:100%;width:auto;flex:none;padding:1px 3px;border:0;border-radius:4px;background:transparent;color:#536b88;font-size:12px;font-weight:500;line-height:20px;white-space:nowrap;}
#shared-family-header select.v9-branch {cursor:pointer;padding-right:3px;}
#shared-family-header select.v9-branch:hover {background:#eef4ff;}
#shared-family-header .v9-branch-label {text-decoration:none;overflow:hidden;text-overflow:ellipsis;}
#shared-family-header .v5-toolbar[hidden],#shared-family-header .v9-search-popover[hidden] {display:none!important;}
#shared-family-header .v9-search-popover {position:absolute;top:calc(100% + 5px);right:18px;z-index:1700;width:min(380px,calc(100% - 36px));max-width:none;padding:8px;background:white;border:1px solid #dbe4ef;border-radius:10px;box-shadow:0 6px 24px #182b4526;box-sizing:border-box;}
#shared-family-header .v9-search-toggle {width:40px;padding:0;}
@media(min-width:981px){#shared-family-header .v5-top {gap:14px;} }
@media(max-width:767.98px){
 #shared-family-header .v9-brand {flex:1 1 0;}
 #shared-family-header .v9-brand-text {flex:1;overflow:hidden;}
 #shared-family-header .v9-brand-name {max-width:100%;}
 #shared-family-header .v9-brand strong {font-size:clamp(11px,3.5vw,14px);overflow:hidden;text-overflow:ellipsis;}
 #shared-family-header .v9-branch {font-size:11px;height:21px;line-height:18px;min-height:0;max-width:100%;width:100%;padding:0;}
 #shared-family-header .v9-search-toggle {width:34px;flex-basis:34px;}
 #shared-family-header .v9-search-popover {left:8px;right:8px;width:auto;}
}
@media(max-width:360px){#shared-family-header .v9-search-toggle {width:31px;flex-basis:31px;}#shared-family-header .v9-brand {gap:5px;} }