:root{color:#1c2630;background:#f5f7f2;font-family:PingFang SC,Microsoft YaHei,Noto Sans CJK SC,system-ui,sans-serif;font-size:18px;line-height:1.55}*{box-sizing:border-box}body{background:linear-gradient(#f5f7f2eb,#f5f7f2),url(https://images.unsplash.com/photo-1529156069898-49953e39b3ac?auto=format&fit=crop&w=1600&q=80) 50%/cover fixed;min-width:320px;min-height:100vh;margin:0}button,input,select,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:0}.app-shell{width:min(1180px,100%);margin:0 auto;padding:18px}.topbar,.current-person,.kinship-group,.search-panel,.tree-view,.data-panel,.drawer-panel{background:#fffffcf5;border:1px solid #d9dfd2;box-shadow:0 18px 48px #3043341f}.topbar{border-radius:8px;justify-content:space-between;align-items:center;gap:16px;padding:18px;display:flex}.topbar h1,.current-person h1,.section-head h2,.kinship-group h2,.drawer h2{color:#17221c;letter-spacing:0;margin:0}.topbar h1{font-size:2rem}.eyebrow{color:#5b6f55;margin:0 0 4px;font-size:.95rem;font-weight:800}.tabbar{z-index:10;background:#e8eddf;border-radius:8px;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0;padding:8px;display:grid;position:sticky;top:0}.tabbar button,.primary-actions button,.drawer-actions button,.data-actions button,.data-panel>button,.icon-text,.relative-actions button,.relative-actions a,.relationship-options button,.search-results button{color:#1d2b23;background:#f8faf3;border-radius:8px;justify-content:center;align-items:center;gap:8px;min-height:48px;font-weight:800;text-decoration:none;display:inline-flex}.tabbar button.active,.primary-actions button:first-child,.drawer-actions button:last-child,.data-actions button,.data-panel>button,.relationship-options button.selected{color:#fff;background:#266b54}.icon-text{border:1px solid #ccd6c5;padding:0 14px}.notice,.loading{color:#174536;background:#e3f4e9;border-radius:8px;margin:12px 0;padding:12px 14px;font-weight:800}.current-person{border-radius:8px;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;padding:22px;display:grid}.avatar{color:#fff;background:#8a5a44;border-radius:50%;flex:none;place-items:center;width:56px;height:56px;font-size:1.25rem;font-weight:900;display:inline-grid;overflow:hidden}.avatar img{object-fit:cover;width:100%;height:100%}.large-avatar{width:110px;height:110px;font-size:2.5rem}.current-person-body{min-width:0}.current-person h1{font-size:2.5rem}.info-grid{flex-wrap:wrap;gap:8px;margin:10px 0;display:flex}.info-grid span,.manual-badge{color:#304334;background:#edf1e7;border-radius:999px;padding:5px 10px;font-weight:700}.phone-link{color:#17513f;align-items:center;gap:8px;min-height:44px;font-weight:900;display:inline-flex}.muted{color:#657464}.primary-actions{gap:10px;min-width:150px;display:grid}.primary-actions button{padding:0 14px}.search-panel{border-radius:8px;margin:14px 0;padding:14px}.search-panel label{background:#fff;border:2px solid #ccd6c5;border-radius:8px;align-items:center;gap:10px;padding:0 12px;display:flex}.search-panel input{background:0 0;border:0;outline:0;width:100%;min-height:50px}.search-results{flex-wrap:wrap;gap:8px;margin-top:10px;display:flex}.search-results button{padding:0 16px}.group-stack{gap:14px;display:grid}.kinship-group{border-radius:8px;padding:18px}.kinship-group h2{margin-bottom:12px;font-size:1.35rem}.relative-list{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;display:grid}.relative-card{background:#fff;border:1px solid #dce2d5;border-radius:8px;min-height:148px;padding:12px;position:relative}.relative-main{text-align:left;background:0 0;justify-content:flex-start;gap:12px;width:100%;min-height:76px;padding:0}.relative-text{min-width:0;display:grid}.relative-text strong{color:#8a3d2b;font-size:1.45rem}.relative-text small{color:#607065;font-size:.92rem}.relative-actions{flex-wrap:wrap;gap:8px;margin-top:8px;display:flex}.relative-actions button,.relative-actions a{border:1px solid #d3dbcc;flex:1;min-width:120px}.manual-badge{color:#62311f;background:#f8eadf;margin-top:8px;font-size:.9rem;display:inline-block}.drawer{z-index:30;background:#131e1873;place-items:end center;padding:18px;display:grid;position:fixed;inset:0}.drawer-panel{border-radius:8px;width:min(900px,100%);max-height:calc(100vh - 36px);padding:18px;overflow:auto}.drawer-head,.section-head{justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;display:flex}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}label{color:#2a382f;gap:6px;font-weight:800;display:grid}.full{grid-column:1/-1}input,select,textarea{color:#1c2630;background:#fff;border:2px solid #ccd6c5;border-radius:8px;width:100%;min-height:50px;padding:10px 12px}textarea{resize:vertical;min-height:130px}.drawer-actions{justify-content:flex-end;gap:10px;margin-top:16px;display:flex}.drawer-actions button{padding:0 18px}.drawer-actions button:disabled{cursor:not-allowed;opacity:.55}.drawer-actions .danger{color:#fff;background:#a33a2f}.stepper{grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:16px;display:grid}.stepper span{background:#edf1e7;border-radius:8px;place-items:center;min-height:40px;font-weight:900;display:grid}.stepper span.active{color:#fff;background:#266b54}.wizard-section{gap:14px;display:grid}.wizard-section h3{margin:0;font-size:1.35rem}.large-select{min-height:58px}.relationship-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.relationship-options button{border:1px solid #cbd5c3;min-height:64px;padding:10px}.role-select{max-width:320px}.confirm-box{background:#fbfcf8;border:1px solid #dce2d5;border-radius:8px;padding:14px}.tree-view,.data-panel{border-radius:8px;padding:18px}.tree-toolbar{z-index:5;color:#344c5d;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#fffffceb;border:1px solid #d3dcd4e6;border-radius:8px;flex-wrap:wrap;align-items:center;gap:8px;padding:8px;font-weight:800;display:flex;position:sticky;top:8px;left:0}.tree-toolbar span{background:#eaf3f7;border-radius:999px;padding:5px 10px}.tree-toolbar button:not(.tree-add-root-button){color:#24495c;background:#f4f9fb;border:1px solid #c9d9e2;border-radius:8px;min-height:34px;padding:0 10px;font-weight:900}.tree-toolbar button:disabled{opacity:.45}.tree-add-root-button{color:#fff;background:#266b54;border-radius:8px;justify-content:center;align-items:center;gap:8px;min-height:48px;padding:0 14px;font-weight:900;display:inline-flex}.tree-scroll{-webkit-overflow-scrolling:touch;touch-action:pan-x pan-y pinch-zoom;padding:16px 0 12px;overflow:auto}.tree-canvas{--tree-zoom:1;--tree-gap:calc(34px * var(--tree-zoom));--tree-unit-width:calc(208px * var(--tree-zoom));--tree-card-width:calc(194px * var(--tree-zoom));--tree-card-height:calc(172px * var(--tree-zoom));--tree-card-padding:calc(13px * var(--tree-zoom));--tree-avatar-size:calc(48px * var(--tree-zoom));--tree-font-scale:max(.78, var(--tree-zoom));justify-items:center;gap:calc(58px * var(--tree-zoom));min-width:max-content;padding:calc(18px * var(--tree-zoom)) calc(46px * var(--tree-zoom)) calc(36px * var(--tree-zoom));display:grid;position:relative}.tree-connector-svg{z-index:0;pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.tree-connector-svg line{stroke:#5f8fad;stroke-width:2.5px;stroke-linecap:round;vector-effect:non-scaling-stroke}.tree-root-title{z-index:1;min-height:calc(46px * var(--tree-zoom));min-width:calc(110px * var(--tree-zoom));color:#fff;font-size:calc(1.2rem * var(--tree-font-scale));background:#4f86a7;border:3px solid #395060;border-radius:8px;place-items:center;font-weight:900;display:grid;position:relative;box-shadow:0 10px 22px #456f8b33}.tree-roots,.children-row{z-index:1;justify-content:center;align-items:flex-start;gap:var(--tree-gap);display:flex;position:relative}.family-unit{min-width:var(--tree-unit-width);align-content:start;justify-items:center;display:grid;position:relative}.couple-row{padding:calc(8px * var(--tree-zoom));background:#fffffce0;border:1px solid #dbe5dc;border-radius:8px;justify-content:center;align-items:stretch;gap:0;display:flex;position:relative;box-shadow:0 14px 28px #27443f1a}.couple-row.has-spouse .person-flip-card:first-child .flip-face{border-top-right-radius:0;border-bottom-right-radius:0}.spouse-card-wrap .person-flip-card .flip-face{border-left:0;border-top-left-radius:0;border-bottom-left-radius:0}.spouse-card-wrap{display:contents}.children-branch{margin-top:calc(30px * var(--tree-zoom));justify-items:center;display:grid;position:relative}.children-row{padding-top:calc(44px * var(--tree-zoom))}.collapse-branch-button{z-index:2;min-height:calc(34px * var(--tree-zoom));margin-top:calc(9px * var(--tree-zoom));padding:0 calc(11px * var(--tree-zoom));color:#245541;font-size:calc(.82rem * var(--tree-font-scale));background:#f2f8ef;border:1px solid #b8d0bf;border-radius:8px;justify-content:center;align-items:center;gap:4px;font-weight:900;display:inline-flex;position:relative;box-shadow:0 6px 14px #3155401a}.person-flip-card{z-index:2;width:var(--tree-card-width);gap:calc(8px * var(--tree-zoom));display:grid;position:relative}.flip-surface{width:var(--tree-card-width);height:var(--tree-card-height);perspective:900px;background:0 0;border-radius:8px;padding:0}.flip-inner{width:100%;height:100%;transform-style:preserve-3d;transition:transform .26s;display:block;position:relative}.flip-inner.flipped{transform:rotateY(180deg)}.flip-face{align-content:center;place-items:center;gap:calc(8px * var(--tree-zoom));padding:var(--tree-card-padding);color:#182b38;backface-visibility:hidden;text-align:center;background:linear-gradient(#fff 0%,#f7fbfa 100%);border:1px solid #c9d9d6;border-radius:8px;display:grid;position:absolute;inset:0;box-shadow:0 10px 22px #2a4a601f}.connector-tag{color:#fff;font-size:calc(.68rem * var(--tree-font-scale));background:#c17b2e;border-radius:8px;padding:2px 7px;font-weight:900;position:absolute;top:8px;right:8px}.tree-card-top{align-items:center;gap:calc(9px * var(--tree-zoom));text-align:left;grid-template-columns:auto 1fr;width:100%;display:grid}.tree-name-block{gap:2px;min-width:0;display:grid}.front-face strong,.back-face strong{color:#17221c;max-width:100%;font-size:calc(1.08rem * var(--tree-font-scale));overflow-wrap:anywhere;line-height:1.2}.tree-name-block small{color:#61756e;font-size:calc(.78rem * var(--tree-font-scale));font-weight:800}.kinship-badge{width:100%;min-height:calc(34px * var(--tree-zoom));color:#8a3d2b;background:#fff2ea;border:1px solid #f0d4c7;border-radius:8px;place-items:center;font-style:normal;font-weight:900;display:grid}.path-label,.back-face span{color:#536b7a;font-size:calc(.82rem * var(--tree-font-scale));overflow-wrap:anywhere;line-height:1.25}.back-face{text-align:left;background:#f6fbf5;justify-items:start;transform:rotateY(180deg)}.tree-avatar{width:var(--tree-avatar-size);height:var(--tree-avatar-size);color:#fff;background:#4f86a7;border-radius:50%;place-items:center;font-weight:900;display:grid;overflow:hidden}.tree-avatar img{object-fit:cover;width:100%;height:100%}.person-flip-card.selected .flip-face{border:3px solid #a33a2f;box-shadow:0 0 0 5px #a33a2f29,0 16px 28px #2a4a6029}.person-flip-card.selected .tree-avatar{background:#a33a2f}.tree-card-name .flip-surface,.tree-card-surname .flip-surface{height:calc(72px * var(--tree-zoom))}.tree-card-name .front-face,.tree-card-surname .front-face{padding:calc(8px * var(--tree-zoom))}.tree-card-name .tree-card-top,.tree-card-surname .tree-card-top{text-align:center;grid-template-columns:1fr;justify-items:center}.tree-card-name .tree-avatar,.tree-card-surname .tree-avatar,.tree-card-name .connector-tag,.tree-card-surname .connector-tag,.tree-card-name .tree-card-actions,.tree-card-surname .tree-card-actions{display:none}.tree-card-name .tree-name-block strong,.tree-card-surname .tree-name-block strong{font-size:calc(1.15rem * var(--tree-font-scale));white-space:nowrap}.tree-card-surname .flip-surface{width:calc(52px * var(--tree-zoom));height:calc(52px * var(--tree-zoom))}.tree-card-surname.person-flip-card,.tree-card-surname.bridge-person-card{width:calc(52px * var(--tree-zoom))}.tree-card-surname .flip-face,.tree-card-surname.bridge-person-card button{border-radius:50%}.tree-card-surname .tree-name-block strong,.tree-card-surname .bridge-copy strong{font-size:calc(1.25rem * var(--tree-font-scale))}.person-flip-card.bridge-focused .flip-face{border-color:#c17b2e;box-shadow:0 0 0 6px #c17b2e33,0 18px 32px #2a4a602e}.bridge-unit{min-width:var(--tree-card-width)}.bridge-person-card{z-index:2;width:var(--tree-card-width);position:relative}.bridge-person-card button{width:100%;min-height:calc(126px * var(--tree-zoom));padding:calc(12px * var(--tree-zoom));align-items:center;gap:calc(10px * var(--tree-zoom));color:#24352e;text-align:left;background:#fffaf0;border:2px dashed #c17b2e;border-radius:8px;grid-template-columns:auto 1fr;display:grid;box-shadow:0 10px 22px #7653231f}.bridge-person-card.tree-card-name button,.bridge-person-card.tree-card-surname button{min-height:calc(72px * var(--tree-zoom));padding:calc(8px * var(--tree-zoom));text-align:center;grid-template-columns:1fr;justify-items:center}.bridge-person-card.tree-card-name .bridge-avatar,.bridge-person-card.tree-card-surname .bridge-avatar{display:none}.bridge-person-card.tree-card-surname button{width:calc(52px * var(--tree-zoom));min-height:calc(52px * var(--tree-zoom))}.bridge-person-card.bridge-focused button{border-style:solid;box-shadow:0 0 0 6px #c17b2e38,0 18px 32px #7653232e}.bridge-avatar{width:calc(46px * var(--tree-zoom));height:calc(46px * var(--tree-zoom));color:#fff;background:#c17b2e;border-radius:50%;place-items:center;font-weight:900;display:grid}.bridge-copy{gap:calc(4px * var(--tree-zoom));min-width:0;display:grid}.bridge-copy strong{color:#17221c;font-size:calc(1rem * var(--tree-font-scale));overflow-wrap:anywhere;line-height:1.2}.bridge-copy em{color:#8a3d2b;font-size:calc(.88rem * var(--tree-font-scale));font-style:normal;font-weight:900}.bridge-copy small{color:#5f6e67;font-size:calc(.78rem * var(--tree-font-scale));font-weight:800}.bridge-jump{min-height:calc(30px * var(--tree-zoom));color:#fff;font-size:calc(.82rem * var(--tree-font-scale));background:#7a5a2b;border-radius:8px;grid-column:1/-1;place-items:center;font-weight:900;display:grid}.tree-card-actions{gap:calc(6px * var(--tree-zoom));grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.tree-card-actions button{justify-content:center;align-items:center;gap:calc(4px * var(--tree-zoom));min-height:calc(40px * var(--tree-zoom));color:#24495c;font-size:calc(.78rem * var(--tree-font-scale));background:#f4f9fb;border:1px solid #c9d9e2;border-radius:8px;font-weight:900;display:inline-flex}.tree-card-actions .active-select{color:#fff;background:#a33a2f;border-color:#a33a2f}.tree-card-actions .danger-lite{color:#8a2f25;background:#fff4f2;border-color:#ecc4bd}.tree-card-actions .bridge-action{color:#7a4e18;background:#fff7e8;border-color:#ebc48c;grid-column:1/-1}.root-stepper{grid-template-columns:repeat(2,1fr)}.data-panel{gap:14px;display:grid}.data-actions{flex-wrap:wrap;gap:10px;display:flex}.data-actions button,.data-panel>button{padding:0 18px}.json-input textarea{min-height:260px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9rem}@media (width<=760px){.app-shell{padding:10px}.topbar{align-items:flex-start}.current-person{text-align:center;grid-template-columns:1fr}.large-avatar{margin:0 auto}.primary-actions{grid-template-columns:1fr}.tabbar{grid-template-columns:1fr;position:static}.tree-view{padding:8px}.tree-toolbar{gap:6px;padding:6px;font-size:.82rem;top:4px}.tree-toolbar span{padding:4px 8px}.tree-toolbar button:not(.tree-add-root-button),.tree-add-root-button{min-height:32px;padding:0 8px;font-size:.82rem}.tree-scroll{margin:0 -8px;padding:10px 8px 16px}.tree-canvas{--tree-gap:calc(24px * var(--tree-zoom));--tree-unit-width:calc(188px * var(--tree-zoom));--tree-card-width:calc(176px * var(--tree-zoom));--tree-card-height:calc(158px * var(--tree-zoom));gap:calc(42px * var(--tree-zoom));padding:calc(12px * var(--tree-zoom)) calc(26px * var(--tree-zoom)) calc(24px * var(--tree-zoom))}.form-grid,.relationship-options{grid-template-columns:1fr}.drawer{padding:8px}.drawer-panel{max-height:calc(100vh - 16px)}.drawer-actions{grid-template-columns:1fr;display:grid}}