/* v6: settings hierarchy, readable genealogy, touch targets and constrained surfaces. */
.top{padding:.65rem 1.05rem;gap:.6rem;flex-shrink:0;border-bottom:1px solid var(--line)}
.settings-gear{display:flex;align-items:center;justify-content:center;gap:.25rem;min-height:48px;min-width:68px;padding:.35rem .6rem;border-radius:14px;background:var(--soft);border:1px solid var(--line);font-weight:700;font-size:.82rem;color:var(--ink)}
.settings-gear .i{width:1.45rem;height:1.45rem}.brand{min-width:0}
#app{min-height:0}#scroll{min-height:0;padding-top:.7rem;padding-bottom:6.7rem}.tabs{flex-shrink:0}.tabs button{position:relative;min-height:66px}.tabs button.on:before{content:'';position:absolute;top:0;width:28px;height:3px;background:var(--sun);border-radius:0 0 3px 3px}
.tabs button .newdot{position:absolute;right:14%;top:3px;font-size:.58rem}
.connection-note{padding:.7rem .8rem;margin-bottom:.7rem;border:1px solid #ae6b19;background:#fff2d7;color:#684214;border-radius:12px;font-size:.85rem;line-height:1.6}
button:disabled{cursor:default;opacity:.55}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button{touch-action:manipulation}
.link,.acts button,.f-ctrl button{min-height:44px}.acts{flex-wrap:wrap}.who{flex-wrap:wrap}.who b{overflow-wrap:anywhere}.who-date{margin-left:0!important}
.panel.settings-panel{height:96%;max-height:96%;border-radius:22px 22px 0 0;display:flex;flex-direction:column}
.settings-panel>.bar{gap:.4rem;flex-shrink:0;padding:.75rem .9rem;border-bottom:1px solid var(--line);min-height:64px}
.settings-panel>.bar h2{flex:1;font-size:1.05rem;line-height:1.5}.settings-panel>.body{padding:.8rem 1rem 1.3rem;min-height:0;overflow:auto;overscroll-behavior:contain}
.settings-back{font-size:.83rem;min-width:50px;min-height:44px;flex-shrink:0}.panel .x{min-width:44px;min-height:44px}
.settings-content{font-size:.95rem;max-width:650px;margin:auto}.settings-profile{display:flex;gap:.7rem;align-items:center;padding:.5rem .2rem}.settings-profile h3{font-size:1.1rem;overflow-wrap:anywhere}.settings-profile p{font-size:.8rem;color:var(--ink-2);margin-top:.15rem}.settings-lead{color:var(--ink-2);font-size:.85rem;margin:.5rem 0 .9rem;line-height:1.7}
.settings-menu{border:1px solid var(--line);border-radius:18px;overflow:hidden}.setting-row{display:flex;width:100%;align-items:center;gap:.75rem;text-align:left;padding:1rem .8rem;background:var(--bg);border-bottom:1px solid var(--line);min-height:78px}.setting-row:last-child{border-bottom:0}.setting-row>span:nth-child(2){flex:1;min-width:0}.setting-row b,.setting-row small{display:block;overflow-wrap:anywhere}.setting-row b{font-size:.97rem}.setting-row small{font-size:.77rem;color:var(--ink-2);line-height:1.55;margin-top:.15rem}.setting-row>span:last-child{font-size:1.45rem;color:var(--ink-2)}.setting-icon{width:42px;height:42px;display:grid;place-items:center;background:var(--sun-soft);border-radius:12px;font-size:1.35rem;flex-shrink:0}
.setting-group{border:1px solid var(--line);background:var(--bg);border-radius:16px;padding:1rem .85rem;margin:.3rem 0 1rem;overflow-wrap:anywhere}.setting-group h3{font-size:1rem;margin-bottom:.65rem}.setting-group>p{font-size:.9rem}.setting-hint,.settings-storage{font-size:.79rem!important;line-height:1.75;color:var(--ink-2);margin:.65rem 0}.settings-storage{padding:.65rem .8rem;background:var(--soft);border-radius:12px}.settings-storage.warning{color:#8a4915;background:#fff3d3}
.setting-choices{display:flex;gap:.4rem;flex-wrap:wrap}.setting-choices button{flex:1;min-height:50px;min-width:65px;line-height:1.4;padding:.6rem .45rem;border:2px solid var(--line);border-radius:12px;font-size:.9rem;background:var(--soft)}.setting-choices .selected{border-color:#247057;background:#e8f5ee;color:#164832;font-weight:700;box-shadow:inset 0 -3px #247057}
.settings-sample{font-size:1rem;padding:1rem .6rem;background:var(--sun-soft);border-radius:10px;margin-top:.8rem;color:var(--ink)}
.setting-toggle{display:flex;align-items:center;width:100%;gap:.75rem;text-align:left;padding:.75rem 0;min-height:66px}.setting-toggle>span:first-child{flex:1}.setting-toggle b{font-size:.94rem;display:block}.setting-toggle small{font-size:.77rem;line-height:1.7;color:var(--ink-2);display:block;margin-top:.4rem}.switch-track{display:block;width:52px;height:30px;border-radius:18px;background:#73808a;border:2px solid #73808a;flex:none;position:relative}.switch-track i{position:absolute;left:2px;top:2px;width:22px;height:22px;border-radius:50%;background:white;box-shadow:0 1px 3px #0002}.setting-toggle[aria-checked="true"] .switch-track{background:#237457;border-color:#237457}.setting-toggle[aria-checked="true"] .switch-track i{left:24px}
.setting-actions{display:flex;flex-direction:column;gap:.6rem}.setting-group .btn{font-size:.88rem;min-height:48px;white-space:normal;line-height:1.5;padding:.65rem}.settings-help{border-bottom:1px solid var(--line);padding:.6rem 0}.settings-help:last-child{border:0}.settings-help summary{min-height:44px;cursor:pointer;font-weight:700;font-size:.9rem;display:list-item}.settings-help p{font-size:.85rem;line-height:1.8;color:var(--ink-2);margin:.5rem 0}.app-version{padding:1.1rem 0 .3rem;color:var(--ink-2)}
.growth-fields{display:grid;grid-template-columns:1fr 1fr;gap:.65rem}.setting-group input{min-width:0}.invite-member{padding:1rem .8rem;border:1px solid var(--line);border-radius:15px;margin:.7rem 0}.invite-member>div{display:flex;align-items:center;gap:.6rem;margin-bottom:.65rem}.invite-member b{font-size:.9rem;overflow-wrap:anywhere}.invite-member .btn{font-size:.87rem;min-height:48px}.invite-member details{margin-top:.5rem}.invite-member summary{min-height:44px;padding:.7rem 0;font-size:.79rem;color:var(--ink-2);cursor:pointer}.invite-member .danger{color:#9d3030;border:1px solid #ac4949;background:var(--bg)}
.family-page{padding:.25rem 0 1.5rem}.family-heading small{color:var(--ink-2)}.family-intro{font-size:.87rem}.family-page .family-heading h1{font-size:1.25rem}.family-tools .btn{flex:1}.family-admin{margin-top:1rem}.family-page .family-admin h2{margin-top:0}.family-admin .hint{margin-bottom:0}.family-list-title{font-size:1.05rem}
.tree-widget{margin:.65rem 0 1rem}.tree-controls{padding:.7rem;border:1px solid var(--line);border-radius:15px;background:var(--soft)}.tree-zoom-controls,.tree-tools{display:flex;align-items:center;gap:.35rem;flex-wrap:wrap}.tree-zoom-controls>button{min-width:44px;min-height:46px;border:1px solid var(--line);background:var(--bg);border-radius:10px;font-size:1.5rem;font-weight:700}.tree-zoom-controls .tree-reset{flex:1;min-width:94px;font-size:.83rem;padding:.3rem .6rem}.tree-zoom-label{min-width:3.1rem;text-align:center;font-size:.9rem;font-weight:700;font-variant-numeric:tabular-nums}.tree-tools{margin-top:.5rem}.tree-tools>button{min-height:48px;flex:1 1 44%;border:1px solid var(--line);border-radius:10px;background:var(--bg);padding:.5rem .4rem;font-size:.78rem;font-weight:700;white-space:normal}.tree-tools .tree-open{flex-basis:100%;background:#245c4b;color:#fff;border-color:#245c4b;font-size:.92rem}
.tree-instruction{font-size:.78rem;color:var(--ink-2);line-height:1.7;margin:.65rem .1rem}.tree-viewport{position:relative;width:100%;height:500px;height:clamp(380px,57dvh,640px);overflow:auto;border:2px solid #668779;border-radius:16px;background:#f4f9f6;overscroll-behavior:contain;touch-action:pan-x pan-y;-webkit-overflow-scrolling:touch;scrollbar-width:auto;cursor:grab}.tree-viewport:active{cursor:grabbing}.tree-space{position:relative;min-width:1px;min-height:1px}.tree-viewport .family-map{position:absolute;left:0;top:0;margin:0;transform-origin:0 0}.tree-viewport .family-map svg{max-width:none;max-height:none}.tree-viewport .family-map path{stroke-width:3.5;fill:none}.tree-viewport .family-node{padding:14px 9px;gap:6px;border-width:3px;box-shadow:0 4px 10px #1d533b17;cursor:pointer;touch-action:pan-x pan-y}.tree-viewport .family-node b{font-size:1.18rem;line-height:1.4;-webkit-line-clamp:2;max-width:100%}.tree-viewport .family-node .kin-name{font-size:1rem!important;line-height:1.5}.tree-viewport .family-node small{font-size:.85rem;line-height:1.55;-webkit-line-clamp:2}.tree-viewport .family-node .kin-icon{width:62px;height:62px;font-size:2.65rem!important;margin:0 auto 2px}.tree-viewport .generation-label{font-size:17px;color:#28513d;background:#e1efe6;padding:5px 10px}
.tree-footnote,.tree-unlinked{font-size:.76rem;line-height:1.7;color:var(--ink-2);margin:.6rem .2rem}.tree-unlinked{padding:.6rem;background:var(--sun-soft);color:var(--sun-ink);border-radius:10px}.tree-found{outline:4px solid #db9b00;outline-offset:4px}.tree-overview .tree-reset{border-color:#287556;box-shadow:inset 0 -2px #287556}
#treeViewer{position:fixed;inset:0;z-index:52;background:var(--bg);color:var(--ink);display:flex;flex-direction:column;padding:env(safe-area-inset-top,0) max(.75rem,env(safe-area-inset-right,0)) env(safe-area-inset-bottom,0) max(.75rem,env(safe-area-inset-left,0));overflow:auto;overscroll-behavior:contain}
.tree-full-head{display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:.65rem .15rem;flex-shrink:0}.tree-full-head small{font-size:.72rem;color:var(--ink-2)}.tree-full-head h2{font-size:1.15rem}.tree-full-head .btn{width:auto;font-size:.87rem;padding:.45rem .8rem;min-height:48px}.tree-full-legend{display:flex;gap:.5rem;font-size:.78rem;justify-content:center;padding-bottom:.5rem}.tree-full-legend>span{border-radius:20px;padding:.25rem .8rem;color:var(--kin-ink);background:var(--kin-bg);border:1px solid var(--kin-line)}
#treeViewer .tree-widget{flex:1;min-height:0;display:flex;flex-direction:column;margin:.1rem 0 0}#treeViewer .tree-controls{display:flex;align-items:center;justify-content:space-between;gap:.5rem;flex-wrap:wrap;padding:.5rem}#treeViewer .tree-tools{margin:0;flex:1;min-width:260px}#treeViewer .tree-zoom-controls{flex:1;min-width:260px}#treeViewer .tree-tools>button{min-height:44px}#treeViewer .tree-viewport{height:auto;min-height:220px;flex:1}#treeViewer .tree-footnote{margin:.35rem 0;font-size:.7rem}#treeViewer .tree-instruction{margin:.35rem .1rem}#treeViewer .tree-unlinked{margin:.3rem 0}
#sheet.above-tree{position:fixed;inset:0;z-index:58;align-items:center;padding:0 max(.75rem,env(safe-area-inset-right,0))}#sheet.above-tree .panel{width:min(100%,620px);max-height:88dvh}#sheet.above-tree .backdrop{position:fixed;inset:0}#exitDialog{position:fixed;z-index:70}
@media(min-width:900px){.phone{max-width:700px}#scroll{padding-left:1.5rem;padding-right:1.5rem}.panel.settings-panel{height:92%;max-height:92%}.kin-grandparents{flex-direction:row}.kin-grandparents .kin-card{flex:1}.tree-viewport{height:600px}#treeViewer{padding-left:1.5rem;padding-right:1.5rem}}
@media(max-width:360px){.top{padding:.5rem .75rem}.settings-gear{min-width:58px;font-size:.77rem;gap:.15rem;padding:.25rem .4rem}.brand{font-size:1rem}.settings-panel>.body{padding:.65rem .75rem}.settings-back{min-width:42px}.settings-panel>.bar h2{font-size:.94rem}.setting-row{gap:.5rem;padding:.8rem .6rem}.setting-icon{width:35px;height:35px}.setting-row small{font-size:.75rem}.setting-group{padding:.85rem .7rem}.tree-tools>button{font-size:.75rem}.tree-controls{padding:.5rem}.tree-zoom-controls .tree-reset{min-width:86px}.tree-full-head h2{font-size:1.04rem}.tree-full-legend>span{padding:.2rem .5rem}}
@media(max-height:550px){#treeViewer .tree-full-legend,#treeViewer .tree-instruction,#treeViewer .tree-footnote,#treeViewer .tree-unlinked{display:none}#treeViewer .tree-full-head{padding:.2rem}#treeViewer .tree-viewport{min-height:100px}#treeViewer .tree-controls{padding:.3rem}}
:root[data-reduce-motion="true"] *, :root[data-reduce-motion="true"] *:before,:root[data-reduce-motion="true"] *:after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}
@media print{#treeViewer{display:none!important}}

.panel.no-enter{animation:none!important}
.tree-tools>button{flex:1 1 28%}.tree-tools .tree-open{flex:1 1 32%;font-size:.82rem}
#treeViewer .tree-tools>button{flex:1 1 44%}
