:root{--ft-bg:#0f1419;--ft-surface:#1a2332;--ft-surface-2:#243044;--ft-border:#2d3f56;--ft-text:#e8edf2;--ft-text-muted:#89a;--ft-male:#2a6cb6;--ft-male-light:#3a7fd4;--ft-male-bg:#1a2d47;--ft-female:#b6366a;--ft-female-light:#d44a82;--ft-female-bg:#3d1a2d;--ft-accent:#3b82f6;--ft-danger:#ef4444;--ft-spouse-line:#e45c8a;--ft-parent-line:#5b7fa6}.family-tree-app{background:var(--ft-bg);height:100vh;color:var(--ft-text);font-family:var(--font-sans,"Geist",system-ui,-apple-system,sans-serif);flex-direction:column;display:flex;overflow:hidden}.family-tree-header{background:var(--ft-surface);border-bottom:1px solid var(--ft-border);flex-shrink:0;justify-content:space-between;align-items:center;padding:12px 24px;display:flex}.header-left{color:var(--ft-text);align-items:center;gap:10px;display:flex}.header-left h1{letter-spacing:-.02em;margin:0;font-size:18px;font-weight:600}.header-actions{gap:8px;display:flex}.header-btn{border:1px solid var(--ft-border);background:var(--ft-surface-2);color:var(--ft-text);cursor:pointer;border-radius:6px;padding:6px 14px;font-size:13px;font-weight:500;transition:background .15s,border-color .15s}.header-btn:hover{background:var(--ft-border);border-color:var(--ft-text-muted)}.header-btn.danger{color:var(--ft-danger);border-color:#ef44444d}.header-btn.danger:hover{border-color:var(--ft-danger);background:#ef444426}.family-tree-main{flex:1;position:relative;overflow:auto}.family-tree-canvas{width:100%;height:100%;padding:40px;overflow:auto}.family-tree-canvas-inner{position:relative}.family-tree-footer{background:var(--ft-surface);border-top:1px solid var(--ft-border);color:var(--ft-text-muted);flex-shrink:0;justify-content:center;align-items:center;gap:8px;padding:8px 24px;font-size:12px;display:flex}.footer-separator{color:var(--ft-border)}.family-tree-empty{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:16px;height:100%;padding:40px;display:flex}.empty-icon{color:var(--ft-text-muted);opacity:.5}.family-tree-empty h2{color:var(--ft-text);margin:0;font-size:24px;font-weight:600}.family-tree-empty p{color:var(--ft-text-muted);max-width:320px;margin:0;font-size:14px}.btn-add-root{background:var(--ft-accent);color:#fff;cursor:pointer;border:none;border-radius:8px;margin-top:8px;padding:10px 24px;font-size:14px;font-weight:600;transition:background .15s,transform .1s}.btn-add-root:hover{background:#2563eb}.btn-add-root:active{transform:scale(.97)}.family-tree-loading{background:var(--ft-bg);justify-content:center;align-items:center;height:100vh;display:flex}.loading-spinner{border:3px solid var(--ft-border);border-top-color:var(--ft-accent);border-radius:50%;width:32px;height:32px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.family-tree-node{border:2px solid var(--ft-border);background:var(--ft-surface);cursor:grab;-webkit-user-select:none;user-select:none;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:4px;height:80px;transition:border-color .15s,box-shadow .15s,transform .1s;display:flex;overflow:hidden;box-shadow:0 2px 8px #0000004d}.family-tree-node:hover{border-color:var(--ft-text-muted);box-shadow:0 4px 16px #0006}.family-tree-node:focus-visible{outline:2px solid var(--ft-accent);outline-offset:2px}.family-tree-node.dragging{opacity:.5;cursor:grabbing;transform:scale(.95)}.family-tree-node.drag-target{border-color:var(--ft-accent);box-shadow:0 0 0 3px #3b82f64d}.family-tree-node.node-male{border-color:var(--ft-male);background:var(--ft-male-bg)}.family-tree-node.node-male:hover{border-color:var(--ft-male-light)}.family-tree-node.node-male .node-gender-indicator{background:var(--ft-male-light);height:3px;position:absolute;top:0;left:0;right:0}.family-tree-node.node-female{border-color:var(--ft-female);background:var(--ft-female-bg)}.family-tree-node.node-female:hover{border-color:var(--ft-female-light)}.family-tree-node.node-female .node-gender-indicator{background:var(--ft-female-light);height:3px;position:absolute;top:0;left:0;right:0}.node-name{color:var(--ft-text);text-overflow:ellipsis;white-space:nowrap;max-width:140px;font-size:14px;font-weight:600;line-height:1.2;overflow:hidden}.node-sub-label{color:var(--ft-text-muted);text-transform:capitalize;font-size:11px}.family-tree-node.node-deceased{opacity:.5}.family-tree-node.node-deceased .node-name{-webkit-text-decoration-color:var(--ft-text-muted);text-decoration-color:var(--ft-text-muted)}.node-deceased-badge{color:var(--ft-text-muted);text-transform:uppercase;letter-spacing:.04em;font-size:9px;font-weight:600;position:absolute;bottom:4px;right:6px}.family-tree-context-menu{background:var(--ft-surface);border:1px solid var(--ft-border);border-radius:8px;min-width:160px;padding:4px;animation:.12s ease-out fadeIn;box-shadow:0 8px 32px #00000080}@keyframes fadeIn{0%{opacity:0;transform:scale(.95)translateY(-4px)}to{opacity:1;transform:scale(1)translateY(0)}}.family-tree-context-menu-item{width:100%;color:var(--ft-text);text-align:left;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:8px 12px;font-size:13px;font-weight:400;transition:background .1s;display:block}.family-tree-context-menu-item:hover:not(:disabled){background:var(--ft-surface-2)}.family-tree-context-menu-item.danger{color:var(--ft-danger)}.family-tree-context-menu-item.danger:hover:not(:disabled){background:#ef44441f}.family-tree-context-menu-item:disabled,.family-tree-context-menu-item.disabled{color:var(--ft-text-muted);opacity:.5;cursor:not-allowed}.family-tree-dialog-overlay{z-index:10000;background:#0009;justify-content:center;align-items:center;animation:.15s ease-out fadeIn;display:flex;position:fixed;inset:0}.family-tree-dialog{background:var(--ft-surface);border:1px solid var(--ft-border);border-radius:12px;min-width:340px;max-width:400px;padding:24px;box-shadow:0 16px 48px #00000080}.family-tree-dialog-title{color:var(--ft-text);margin:0 0 20px;font-size:18px;font-weight:600}.family-tree-dialog-field{margin-bottom:16px}.family-tree-dialog-field label{color:var(--ft-text-muted);margin-bottom:6px;font-size:13px;font-weight:500;display:block}.family-tree-dialog-field input[type=text]{border:1px solid var(--ft-border);background:var(--ft-bg);width:100%;color:var(--ft-text);box-sizing:border-box;border-radius:6px;outline:none;padding:10px 12px;font-size:14px;transition:border-color .15s}.family-tree-dialog-field input[type=text]:focus{border-color:var(--ft-accent)}.family-tree-dialog-field input[type=text]::placeholder{color:var(--ft-text-muted)}.family-tree-dialog-gender{gap:8px;display:flex}.gender-btn{border:2px solid var(--ft-border);background:var(--ft-bg);color:var(--ft-text-muted);cursor:pointer;border-radius:6px;flex:1;padding:8px 12px;font-size:13px;font-weight:500;transition:all .15s}.gender-btn:hover{border-color:var(--ft-text-muted)}.gender-btn.male.active{border-color:var(--ft-male-light);background:var(--ft-male-bg);color:var(--ft-male-light)}.gender-btn.female.active{border-color:var(--ft-female-light);background:var(--ft-female-bg);color:var(--ft-female-light)}.family-tree-dialog-actions{justify-content:flex-end;gap:8px;margin-top:20px;display:flex}.btn-cancel{border:1px solid var(--ft-border);color:var(--ft-text-muted);cursor:pointer;background:0 0;border-radius:6px;padding:8px 16px;font-size:13px;font-weight:500;transition:background .15s}.btn-cancel:hover{background:var(--ft-surface-2)}.btn-confirm{background:var(--ft-accent);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:8px 16px;font-size:13px;font-weight:600;transition:background .15s}.btn-confirm:hover:not(:disabled){background:#2563eb}.btn-confirm:disabled{opacity:.4;cursor:not-allowed}.person-form-dialog{min-width:400px;max-width:460px}.person-form-row{gap:12px;display:flex}.person-form-row .family-tree-dialog-field{flex:1}.family-tree-dialog-field input[type=number]{border:1px solid var(--ft-border);background:var(--ft-bg);width:100%;color:var(--ft-text);box-sizing:border-box;-moz-appearance:textfield;border-radius:6px;outline:none;padding:10px 12px;font-size:14px;transition:border-color .15s}.family-tree-dialog-field input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.family-tree-dialog-field input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.family-tree-dialog-field input[type=number]:focus{border-color:var(--ft-accent)}.family-tree-dialog-field input[type=number]::placeholder{color:var(--ft-text-muted)}.field-required{color:var(--ft-danger);font-weight:600}.person-form-checkbox-field{margin-bottom:4px}.person-form-checkbox-label{cursor:pointer;color:var(--ft-text);align-items:center;gap:8px;font-size:14px;display:flex}.person-form-checkbox-label input[type=checkbox]{width:16px;height:16px;accent-color:var(--ft-accent);cursor:pointer;display:flex}.person-form-checkbox-label.flex{display:flex}
