:root{--primary-color: #0f866c;--primary-dark: #0a6b56;--secondary-color: #2563eb;--accent-color: #e74c3c;--success-color: #27ae60;--warning-color: #f39c12;--text-primary: #2c3e50;--text-secondary: #7f8c8d;--text-light: #bdc3c7;--background: #ffffff;--background-alt: #f8f9fa;--background-card: #ffffff;--border-color: #e9ecef;--shadow: 0 10px 30px rgba(0, 0, 0, .1);--shadow-hover: 0 20px 40px rgba(0, 0, 0, .15);--shadow-card: 0 4px 6px rgba(0, 0, 0, .05);--border-radius: 50px;--border-radius-card: 12px;--transition: all .3s cubic-bezier(.4, 0, .2, 1);--font-primary: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;--font-display: "Playfair Display", Georgia, serif;--max-width: 1200px;--header-height: 80px;--gradient-primary: linear-gradient(135deg, var(--primary-color), var(--secondary-color));--gradient-success: linear-gradient(135deg, var(--success-color), var(--primary-color))}*{margin:0;padding:0;box-sizing:border-box}.template-selection{display:flex;flex-direction:column;gap:8px;margin-top:8px;width:100%}.template-selection select{width:100%;padding:8px 12px;border:2px solid var(--border-color);border-radius:8px;background-color:var(--background);color:var(--text-primary);font-family:var(--font-primary);font-size:13px;transition:var(--transition);box-sizing:border-box;min-height:36px}.template-selection select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px #0f866c1a}.template-selection select:hover{border-color:var(--primary-color)}.template-selection button{width:100%;margin-top:4px;box-sizing:border-box}#settingsPanel .template-selection{max-width:100%}#settingsPanel .template-selection select{font-size:12px;padding:6px 10px;min-height:32px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#settingsPanel .template-selection button{padding:6px 12px;font-size:12px;min-height:32px;max-width:100%}#settingsPanel .collapsible-content{padding:0 16px 16px;box-sizing:border-box}#settingsPanel .setting-group{max-width:100%;box-sizing:border-box}.setting-group:has(.template-selection){flex-direction:column;align-items:stretch;gap:8px}.setting-group:has(.template-selection) label{flex:none;margin-bottom:0}.setting-group.template-setting-group{flex-direction:column;align-items:stretch;gap:8px}.setting-group.template-setting-group label{flex:none;margin-bottom:0}.template-description{font-style:italic;color:#6b7280;margin:12px 0;padding:10px 12px;background-color:#f9fafb;border-radius:8px;border-left:3px solid #3b82f6;font-size:14px;line-height:1.5}*{scrollbar-width:none!important;-ms-overflow-style:none!important}*::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}*::-webkit-scrollbar-track,*::-webkit-scrollbar-thumb,*::-webkit-scrollbar-corner{display:none!important}html,body{font-family:var(--font-primary, "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif);background-color:var(--background-alt, #f4f4f4);color:var(--text-primary, #2c3e50)}#mainContainer{display:flex;height:100vh;height:100dvh;overflow:hidden;touch-action:none;position:relative}#graphicView,#tableView{flex:1;position:relative;height:100%;touch-action:auto;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}#graphicView::-webkit-scrollbar,#tableView::-webkit-scrollbar{display:none}#svgArea{width:100%;height:100%;background-color:#fff;cursor:grab}.hidden{display:none!important}.search-container{position:fixed;left:52px;top:50%;transform:translateY(-50%);z-index:1000;display:flex;align-items:center;transition:all .3s cubic-bezier(.4,0,.2,1)}.search-field{width:0;height:40px;background:#fffffff2;border:1px solid rgba(0,0,0,.1);border-radius:20px;padding:0;font-size:14px;outline:none;backdrop-filter:blur(10px);box-shadow:0 4px 20px #00000026;transition:all .3s cubic-bezier(.4,0,.2,1);opacity:0;pointer-events:none}.search-field.expanded{width:300px;padding:0 50px 0 20px;opacity:1;pointer-events:auto}.search-field:focus{border-color:#3498db;box-shadow:0 4px 20px #3498db4d}.search-suggestions{position:absolute;top:45px;left:0;right:0;background:#fff;border-radius:12px;box-shadow:0 8px 32px #00000026;max-height:300px;overflow-y:auto;z-index:1001;display:none;scrollbar-width:none;-ms-overflow-style:none}.search-suggestions::-webkit-scrollbar{display:none}.search-suggestions.visible{display:block}.search-suggestion{padding:12px 16px;cursor:pointer;border-bottom:1px solid #f0f0f0;transition:background-color .2s ease;display:flex;flex-direction:column;gap:4px}.search-suggestion:last-child{border-bottom:none}.search-suggestion:hover{background-color:#f8f9fa}.search-suggestion.selected{background-color:#3498db1a}.suggestion-name{font-weight:600;color:#2c3e50;font-size:14px}.suggestion-details{font-size:12px;color:#7f8c8d}.search-close{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;color:#666;font-size:18px;width:24px;height:24px;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease}.search-field.expanded+.search-close{opacity:1}.search-close:hover{color:#e74c3c}.cache-indicator{position:fixed;bottom:16px;left:8px;background:#fffffff2;backdrop-filter:blur(10px);border-radius:8px;padding:8px 12px;font-size:12px;color:#666;box-shadow:0 2px 8px #0000001a;z-index:900;border:1px solid rgba(0,0,0,.1);cursor:pointer;transition:all .4s cubic-bezier(.25,.8,.25,1);transform-origin:bottom left;overflow:visible;width:auto;min-width:160px;max-width:220px;height:32px;line-height:16px;display:flex;align-items:center}.cache-indicator:hover{background:#fff;box-shadow:0 4px 16px #00000026}.cache-indicator.saving{background:#2ecc711a;border-color:#2ecc714d;color:#27ae60}.cache-indicator.error{background:#e74c3c1a;border-color:#e74c3c4d;color:#e74c3c}.cache-indicator.expanded{width:280px;height:auto;min-height:140px;padding:16px;line-height:normal;display:block;overflow:visible;transform-origin:bottom left}.cache-save-indicator{white-space:nowrap;overflow:visible;text-overflow:clip;flex:1;min-width:0}.cache-expanded-content{opacity:0;visibility:hidden;max-height:0;overflow:hidden;margin-top:0;transition:all .3s ease .1s;pointer-events:none}.cache-indicator.expanded .cache-expanded-content{opacity:1;visibility:visible;max-height:200px;margin-top:12px;padding-top:12px;border-top:1px solid rgba(0,0,0,.1);pointer-events:auto}.cache-expanded-content,.cache-expanded-content *,.tree-name-input,.tree-stats,.tree-stats *{pointer-events:auto}.tree-name-input{width:100%;padding:6px 8px;border:1px solid #ddd;border-radius:4px;font-size:12px;margin-bottom:8px;background:#ffffffe6;transition:border-color .2s ease;box-sizing:border-box;pointer-events:auto}.tree-name-input:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 2px #3498db33}.tree-stats{font-size:11px;color:#666;line-height:1.4;display:flex;flex-direction:column;gap:4px;pointer-events:auto}.tree-stats>div{display:flex;align-items:center;gap:4px;pointer-events:auto}.notifications-container{position:fixed;top:20px;right:20px;z-index:10000;display:flex;flex-direction:column;gap:10px;pointer-events:none}.notification{background:#fff;border-radius:12px;padding:16px 20px;box-shadow:0 8px 32px #00000026;border-left:4px solid #3498db;min-width:300px;max-width:400px;display:flex;align-items:center;gap:12px;opacity:0;transform:translate(100%);transition:all .3s cubic-bezier(.25,.8,.25,1);pointer-events:auto}.notification.show{opacity:1;transform:translate(0)}.notification.success{border-left-color:#27ae60}.notification.error{border-left-color:#e74c3c}.notification.info{border-left-color:#3498db}.notification.warning{border-left-color:#f39c12}.notification.cache{border-left-color:#9b59b6}.notification-icon{width:24px;height:24px;flex-shrink:0}.notification-content{flex:1}.notification-title{font-weight:600;font-size:14px;margin-bottom:4px;color:#2c3e50}.notification-message{font-size:13px;color:#7f8c8d;line-height:1.4}.notification-close{width:20px;height:20px;cursor:pointer;opacity:.5;transition:opacity .2s ease;background:none;border:none;padding:0;display:flex;align-items:center;justify-content:center}.notification-close:hover{opacity:1}.notification-spinner{width:18px;height:18px;border:2px solid #e9ecef;border-left:2px solid #3498db;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.sidebar{position:fixed;left:8px;top:50%;transform:translateY(-50%);z-index:1001;background:#fffffffa;border-radius:12px;padding:4px;box-shadow:0 6px 24px #0000001f;backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.3);display:flex;flex-direction:column;gap:4px;min-width:40px}.sidebar-btn{width:32px;height:32px;border:none;background:transparent;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s cubic-bezier(.4,0,.2,1);color:#6b7280;position:relative}.sidebar-btn:hover{background:#3498db1f;color:#3498db;transform:scale(1.1);box-shadow:0 2px 8px #3498db33}.sidebar-btn.active{background:linear-gradient(135deg,#3498db,#2980b9);color:#fff;box-shadow:0 2px 12px #3498db4d}.sidebar-btn svg{width:18px;height:18px;stroke-width:2.5}.sidebar-divider{height:1px;background:#0000001a;margin:4px 0}#undoSidebarBtn,#redoSidebarBtn{opacity:.7;transition:all .2s ease}#undoSidebarBtn:hover,#redoSidebarBtn:hover{opacity:1;background:#3498db1a;color:#3498db;transform:scale(1.05)}#undoSidebarBtn:disabled,#redoSidebarBtn:disabled{opacity:.3;cursor:not-allowed;pointer-events:none}#undoSidebarBtn.available,#redoSidebarBtn.available{opacity:1;color:#3498db}.settings-icon{position:fixed;top:16px;right:16px;width:36px;height:36px;background:#fffffffa;border-radius:10px;border:1px solid rgba(255,255,255,.3);box-shadow:0 6px 24px #0000001f;backdrop-filter:blur(12px);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s cubic-bezier(.4,0,.2,1);color:#6b7280;z-index:997}.settings-icon:hover{background:#f39c121f;color:#f39c12;transform:scale(1.1) rotate(45deg);box-shadow:0 4px 16px #f39c1240}.settings-icon svg{width:20px;height:20px;stroke-width:2.5;transition:transform .2s ease}.view-toggle-icon,.back-to-home{display:none!important}.gender-radio-group{display:flex;flex-direction:row;gap:8px;padding:0;flex-wrap:wrap}.gender-radio-option{display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;padding:12px 16px;border-radius:10px;border:2px solid #e2e8f0;transition:all .2s cubic-bezier(.4,0,.2,1);background:#fff;flex:1;min-width:0;font-size:15px;height:50px;box-sizing:border-box;font-weight:500}.gender-radio-option:hover{border-color:#cbd5e0;background:#f7fafc;transform:translateY(-1px);box-shadow:0 2px 4px #0000000d}.gender-radio-option input[type=radio]:checked+.gender-radio-option,.gender-radio-option:has(input[type=radio]:checked){border-color:#3498db;background:#3498db14;color:#3498db;font-weight:600;box-shadow:0 2px 8px #3498db26}.gender-radio-option input[type=radio]{width:18px;height:18px;cursor:pointer;accent-color:#3498db;margin:0}.gender-radio-option label{cursor:pointer;font-weight:500;margin:0;font-size:14px;white-space:nowrap;user-select:none}.form-group{margin-bottom:24px;position:relative}.form-group:last-of-type{margin-bottom:32px}.form-group label{display:block;margin-bottom:8px;font-weight:600;color:#2d3748;font-size:14px;line-height:1.4;letter-spacing:.025em}.form-group label .required{color:#e53e3e;margin-left:2px}.form-group input,.form-group select{width:100%;padding:14px 16px;font-size:15px;border:2px solid #e2e8f0;border-radius:10px;transition:all .2s cubic-bezier(.4,0,.2,1);box-sizing:border-box;background:#fff;font-family:inherit;line-height:1.5;color:#2d3748;font-weight:400}.form-group input:hover,.form-group select:hover{border-color:#cbd5e0;box-shadow:0 2px 4px #0000000d}.form-group input:focus,.form-group select:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 3px #3498db1a,0 4px 12px #0000001a;background:#fff;transform:translateY(-1px)}.form-group input::placeholder{color:#a0aec0;font-weight:400}.form-group input:invalid{border-color:#e53e3e}.form-group input:invalid:focus{border-color:#e53e3e;box-shadow:0 0 0 3px #e53e3e1a,0 4px 12px #0000001a}.help-text{font-size:12px;color:#718096;margin-top:6px;line-height:1.5;font-style:italic;display:flex;align-items:center;gap:4px}.help-text:before{content:"ℹ";color:#a0aec0;font-style:normal;font-size:11px}.required{color:#e53e3e}.searchable-select{position:relative}.searchable-select .select-input{width:100%;padding:14px 16px;font-size:15px;border:2px solid #e2e8f0;border-radius:10px;cursor:pointer;background-color:#fff;display:flex;align-items:center;justify-content:space-between;transition:all .2s cubic-bezier(.4,0,.2,1);min-height:50px;box-sizing:border-box;font-family:inherit;color:#2d3748;font-weight:400;position:relative}.searchable-select .select-input:hover{border-color:#cbd5e0;box-shadow:0 2px 4px #0000000d;transform:translateY(-1px)}.searchable-select .select-input.open{border-color:#3498db;box-shadow:0 0 0 3px #3498db1a,0 4px 12px #0000001a;transform:translateY(-1px)}.searchable-select .select-input:after{content:"▼";font-size:12px;color:#718096;transition:all .2s cubic-bezier(.4,0,.2,1);margin-left:8px}.searchable-select .select-input.open:after{transform:rotate(180deg);color:#3498db}.searchable-select .options{position:absolute;top:calc(100% + 6px);left:0;right:0;max-height:240px;overflow-y:auto;background:#fff;border:2px solid #e2e8f0;border-radius:10px;z-index:1002;box-shadow:0 10px 25px #0000001a,0 4px 10px #0000000d;scrollbar-width:thin;backdrop-filter:blur(8px)}.searchable-select .options.hidden{display:none}.searchable-select .select-option{padding:14px 16px;cursor:pointer;border-bottom:1px solid #f7fafc;transition:all .15s cubic-bezier(.4,0,.2,1);font-size:15px;color:#2d3748;font-weight:400}.searchable-select .select-option:last-child{border-bottom:none}.searchable-select .select-option:hover{background-color:#f7fafc;color:#2d3748;transform:translate(2px)}.searchable-select .select-option.selected{background-color:#3498db14;color:#3498db;font-weight:500;border-left:3px solid #3498db;padding-left:13px}.btn-danger{background-color:#e74c3c;color:#fff;border:none;padding:10px 20px;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.btn-danger:hover{background-color:#c0392b}.btn-danger-outline{background-color:transparent;color:#e74c3c;border:2px solid #e74c3c;padding:8px 16px;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;width:100%}.btn-danger-outline:hover{background-color:#e74c3c;color:#fff}.btn-success{background:#27ae60;color:#fff;border:none;padding:10px 20px;border-radius:6px;cursor:pointer}.btn-success:hover{background-color:#229954}.btn-success-outline{background-color:transparent;color:#27ae60;border:2px solid #27ae60;padding:8px 16px;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;width:100%}.btn-success-outline:hover{background-color:#27ae60;color:#fff}.form-group.error input,.form-group.error select,.form-group.error .select-input{border-color:#dc3545!important;box-shadow:0 0 0 3px #dc35451a!important;background:#dc354505!important}.form-group.error .gender-radio-option{border-color:#dc3545!important;background:#dc354505!important}.error-message{color:#dc3545;font-size:12px;margin-top:6px;animation:slideDown .2s ease-out;font-weight:500;line-height:1.3}.icon-button{position:fixed;width:40px;height:40px;cursor:pointer;z-index:1000;background-color:#ffffffe6;border-radius:8px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #0000001a;transition:all .2s ease;touch-action:auto}.icon-button:hover{background-color:#fff;box-shadow:0 4px 12px #00000026}.view-toggle-icon{top:16px;left:16px}.settings-icon{top:16px;right:16px}.icon{width:24px;height:24px;stroke:#333;transition:stroke .2s ease}.icon-button:hover .icon{stroke:#000}#settingsPanel{position:fixed;top:70px;right:16px;width:340px;max-height:calc(100vh - 100px);max-height:calc(100dvh - 100px);overflow-y:auto;background:#fff;border:1px solid #e0e0e0;border-radius:12px;box-shadow:0 8px 28px #00000047;padding:0;z-index:999;touch-action:auto;scrollbar-width:none;-ms-overflow-style:none;font-family:Roboto,-apple-system,BlinkMacSystemFont,sans-serif}#settingsPanel::-webkit-scrollbar{display:none}#settingsPanel h3{margin:0;padding:20px 24px 16px;font-size:18px;font-weight:500;color:#0f0f0f;border-bottom:1px solid #e0e0e0;background:#fff;position:sticky;top:0;z-index:1}.setting-group{margin-bottom:16px;display:flex;align-items:center;gap:12px}.setting-group label{flex:1;font-size:13px;font-weight:400;color:#606060;line-height:18px}.setting-group input,.setting-group select,.setting-group button{flex:1.2;font-size:13px;padding:8px 12px;border:1px solid #d0d7de;border-radius:8px;background:#fff;transition:border-color .15s ease,box-shadow .15s ease;font-family:inherit}.setting-group input:focus,.setting-group select:focus{outline:none;border-color:#1976d2;box-shadow:0 0 0 2px #1976d233}.setting-group input:hover,.setting-group select:hover{border-color:#a8a8a8}.export-group{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}.export-group button{padding:8px 12px;font-size:12px;font-weight:500}#settingsPanel button{background-color:#1976d2;color:#fff;border:none;border-radius:18px;cursor:pointer;transition:background-color .15s ease,box-shadow .15s ease;font-weight:500;font-size:13px;min-height:36px;padding:8px 16px}#settingsPanel button:hover{background-color:#1565c0;box-shadow:0 2px 8px #1976d24d}#settingsPanel button:active{background-color:#0d47a1;transform:translateY(1px)}.file-label{display:inline-block;flex:1.5;padding:6px 12px;background-color:#6c757d;color:#fff;border-radius:6px;cursor:pointer;text-align:center;font-size:14px;transition:background-color .2s ease}.file-label:hover{background-color:#5a6268}.file-label span{pointer-events:none}.file-label input[type=file]{display:none}.collapsible-section{border-bottom:1px solid #e0e0e0;margin:0}.collapsible-section:last-child{border-bottom:none}.collapsible-header{padding:16px 24px;background:#fff;cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:background-color .15s ease;user-select:none}.collapsible-header:hover{background:#f9f9f9}.collapsible-header h4{margin:0;font-size:14px;font-weight:500;color:#0f0f0f;line-height:20px}.collapsible-toggle{font-size:16px;color:#606060;transition:transform .2s ease;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.collapsible-content{padding:0 24px 16px;display:none;background:#fff}.collapsible-content.expanded{display:block;animation:slideDown .2s ease-out}.collapsible-header.expanded .collapsible-toggle{transform:rotate(180deg)}@keyframes slideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.checkbox-group{display:flex;flex-direction:column;gap:12px}.checkbox-item{display:flex;align-items:center;gap:12px;padding:8px 0}.checkbox-item input[type=checkbox]{width:20px;height:20px;cursor:pointer;accent-color:#1976d2;border-radius:4px}.checkbox-item label{cursor:pointer;font-size:13px;font-weight:400;color:#0f0f0f;margin:0;line-height:18px;user-select:none}.node-style-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px}.node-style-option{display:flex;flex-direction:column;align-items:center;padding:12px;border:2px solid #e9ecef;border-radius:8px;cursor:pointer;transition:all .2s ease}.node-style-option:hover{border-color:#3498db;background-color:#f8f9fa}.node-style-option.selected{border-color:#3498db;background-color:#e3f2fd}.node-style-preview{width:60px;height:60px;display:flex;align-items:center;justify-content:center;background-color:#3498db;color:#fff;font-weight:600;font-size:12px;margin-bottom:8px;border-radius:50%}.node-style-preview.circle{border-radius:50%}.node-style-preview.rectangle{border-radius:8px;width:80px}.node-style-label{font-size:12px;font-weight:500;text-align:center}.setting-subsection{margin-bottom:16px;padding:12px;background-color:#fff;border:1px solid #e9ecef;border-radius:6px}.setting-subsection h5{margin-bottom:8px;font-size:13px;font-weight:600;color:#495057;text-transform:uppercase;letter-spacing:.3px}.checkbox-item input[type=checkbox]{width:18px;height:18px;cursor:pointer;accent-color:#3498db}.checkbox-item label{cursor:pointer;font-size:14px;margin:0;user-select:none}.setting-group input[type=color]{width:40px;height:32px;padding:2px;border:1px solid #ddd;border-radius:4px;cursor:pointer}.setting-group input[type=number]{min-width:60px;text-align:center}.setting-group select{min-width:100px}#applyOutlineStyle,#applyLineStyles{background-color:#28a745;color:#fff;border:none;border-radius:6px;padding:8px 16px;cursor:pointer;font-size:14px;font-weight:500;transition:background-color .2s ease;margin-top:8px}#applyOutlineStyle:hover,#applyLineStyles:hover{background-color:#218838}.panel{position:fixed;background:#fff;border-radius:12px;box-shadow:0 8px 32px #0000001a;z-index:999}.zoom-controls{position:fixed;bottom:16px;right:16px;display:flex;align-items:center;gap:2px;z-index:997;background:#fffffffa;border-radius:12px;padding:4px;box-shadow:0 6px 24px #0000001f;backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.3)}.zoom-display{font-size:11px;font-weight:700;color:#6b7280;min-width:35px;text-align:center;padding:0 6px;letter-spacing:.025em}.zoom-btn{width:30px;height:30px;border:none;background:transparent;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s cubic-bezier(.4,0,.2,1);color:#6b7280;position:relative}.zoom-btn:hover{background:#3498db1f;color:#3498db;transform:scale(1.1);box-shadow:0 2px 8px #3498db33}.zoom-btn:active{transform:scale(.95)}.zoom-btn svg{width:18px;height:18px;stroke-width:2.5}.zoom-btn.zoom-reset{margin:0 2px}.top-toolbar{position:fixed;top:16px;left:16px;display:flex;align-items:center;gap:2px;z-index:997;background:#fffffffa;border-radius:12px;padding:4px;box-shadow:0 6px 24px #0000001f;backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.3)}.toolbar-btn{width:36px;height:36px;border:none;background:transparent;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s cubic-bezier(.4,0,.2,1);color:#6b7280;position:relative}.toolbar-btn:hover{background:#0f866c1f;color:#0f866c;transform:scale(1.1);box-shadow:0 2px 8px #0f866c33}.toolbar-btn:active{transform:scale(.95)}.toolbar-btn svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}.export-menu{position:fixed;top:70px;left:70px;background:#fffffff2;border-radius:12px;padding:8px;box-shadow:0 8px 32px #0003;backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.2);z-index:999;min-width:220px;opacity:1;transform:translateY(0);transition:all .2s cubic-bezier(.25,.8,.25,1)}.export-menu.hidden{opacity:0;transform:translateY(-10px);pointer-events:none}.export-option{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:8px;cursor:pointer;transition:all .2s ease;color:#333;font-size:14px;font-weight:500}.export-option:hover{background:#0f866c1a;color:#0f866c}.export-option svg{width:16px;height:16px;flex-shrink:0;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.export-option span{flex:1}.floating-buttons{position:fixed;bottom:80px;right:24px;display:flex;flex-direction:column;align-items:flex-end;z-index:998;transition:all .3s cubic-bezier(.25,.8,.25,1);touch-action:auto}.floating-buttons .main-buttons{display:flex;flex-direction:row;align-items:center;gap:16px}.floating-buttons:before{content:"";position:fixed;top:0;left:0;width:100vw;height:100vh;height:100dvh;background:#0000;opacity:0;transition:all .3s ease;pointer-events:none;z-index:997}.floating-buttons.expanded:before{background:#0000001a;opacity:1}.floating-btn{width:56px;height:56px;border-radius:50%;border:none;cursor:pointer;box-shadow:0 4px 8px #0003;transition:all .3s cubic-bezier(.25,.8,.25,1);display:flex;align-items:center;justify-content:center;font-weight:600;position:relative;margin-bottom:0;outline:none;user-select:none;touch-action:auto}.floating-btn:active{transform:scale(.95)}.floating-btn.undo{background-color:#95a5a6;color:#fff;z-index:1003;box-shadow:0 4px 12px #95a5a64d}.floating-btn.undo:hover{background-color:#7f8c8d;transform:scale(1.1);box-shadow:0 6px 16px #95a5a666}.floating-btn.undo svg{width:24px;height:24px}.floating-btn.primary{background-color:#2ecc71;color:#fff;font-size:28px;z-index:1003;transform:rotate(0);transition:all .3s cubic-bezier(.25,.8,.25,1);box-shadow:0 6px 16px #2ecc714d}.floating-buttons.expanded .floating-btn.primary{transform:rotate(45deg);background-color:#e74c3c;box-shadow:0 6px 16px #e74c3c4d}.floating-btn.primary:hover{background-color:#27ae60;transform:scale(1.1) rotate(0);box-shadow:0 8px 20px #2ecc7166}.floating-buttons.expanded .floating-btn.primary:hover{background-color:#c0392b;transform:scale(1.1) rotate(45deg);box-shadow:0 8px 20px #e74c3c66}.floating-btn.secondary{background-color:#3498db;color:#fff;font-size:11px;font-weight:600;z-index:1002;opacity:0;transform:translateY(0) scale(0);transition:all .3s cubic-bezier(.25,.8,.25,1);position:absolute;right:0;box-shadow:0 4px 12px #3498db4d}.floating-buttons.expanded .floating-btn.secondary{opacity:1;transform:scale(1)}.floating-btn.bring-front{background-color:#f39c12;color:#fff;font-size:11px;font-weight:600;z-index:1002;opacity:0;transform:translateY(0) scale(0);transition:all .3s cubic-bezier(.25,.8,.25,1);position:absolute;right:0;box-shadow:0 4px 12px #f39c124d}.floating-buttons.expanded .floating-btn.bring-front{opacity:1;transform:scale(1)}.floating-buttons.expanded #bringFrontBtn{transform:translateY(-280px) scale(1);transition-delay:.05s}.floating-buttons.expanded #editBtn{transform:translateY(-210px) scale(1);transition-delay:.1s}.floating-buttons.expanded #styleBtn{transform:translateY(-140px) scale(1);transition-delay:.15s}.floating-buttons.expanded #connectBtn{transform:translateY(-70px) scale(1);transition-delay:.2s}.floating-btn.secondary:hover{background-color:#2980b9;transform:scale(1.1);box-shadow:0 6px 16px #3498db66}.floating-btn.bring-front:hover{background-color:#e67e22;transform:scale(1.1);box-shadow:0 6px 16px #f39c1266}.floating-buttons.expanded #bringFrontBtn:hover{transform:translateY(-280px) scale(1.1);box-shadow:0 6px 16px #f39c1266}.floating-buttons.expanded #editBtn:hover{transform:translateY(-210px) scale(1.1);box-shadow:0 6px 16px #3498db66}.floating-buttons.expanded #styleBtn:hover{transform:translateY(-140px) scale(1.1);box-shadow:0 6px 16px #3498db66}.floating-buttons.expanded #connectBtn:hover{transform:translateY(-70px) scale(1.1);box-shadow:0 6px 16px #3498db66}.floating-buttons.expanded #bringFrontBtn:active{transform:translateY(-280px) scale(.95)}.floating-buttons.expanded #editBtn:active{transform:translateY(-210px) scale(.95)}.floating-buttons.expanded #styleBtn:active{transform:translateY(-140px) scale(.95)}.floating-buttons.expanded #connectBtn:active{transform:translateY(-70px) scale(.95)}.floating-btn.secondary.hidden,.floating-btn.bring-front.hidden{display:none!important}.floating-btn.secondary,.floating-btn.bring-front{font-family:Inter,sans-serif;letter-spacing:.5px;text-transform:uppercase}#tableControls{padding:12px;background-color:#fff;display:flex;gap:12px;border-bottom:1px solid #ddd}#tableControls input,#tableControls select{padding:8px 12px;font-size:14px;border:1px solid #ddd;border-radius:6px}#familyTable{width:100%;border-collapse:collapse;background-color:#fff}#familyTable th,#familyTable td{padding:12px 8px;text-align:left;border-bottom:1px solid #eee}#familyTable th{background-color:#f8f9fa;font-weight:600;position:sticky;top:0}#familyTable tbody tr:hover{background-color:#f8f9fa}.table-btn{padding:4px 8px;margin:2px;border:none;border-radius:4px;cursor:pointer;font-size:12px;font-weight:500;transition:opacity .2s ease}.table-btn:first-child{background-color:#3498db;color:#fff}.table-btn:last-child{background-color:#e74c3c;color:#fff}.table-btn:hover{opacity:.8}@keyframes slideDown{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-10px)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}.form-group.error{animation:shake .5s ease-in-out}.person-group circle{stroke:#2c3e50;stroke-width:2px;cursor:grab;transition:all .2s ease;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1))}.person-group circle:hover{stroke-width:3px;filter:drop-shadow(0 4px 8px rgba(0,0,0,.15))}.person-group text.name{font-weight:600;font-family:Inter,sans-serif;pointer-events:none;text-shadow:0 1px 2px rgba(0,0,0,.3);dominant-baseline:middle}.person-group text.birth-name{font-family:Inter,sans-serif;pointer-events:none;text-shadow:0 1px 2px rgba(0,0,0,.2);font-style:italic;opacity:.9;dominant-baseline:middle}.person-group text.dob{font-family:Inter,sans-serif;pointer-events:none;text-shadow:0 1px 2px rgba(0,0,0,.3);dominant-baseline:middle}.person-group text{text-rendering:optimizeLegibility;shape-rendering:geometricPrecision}.person-group circle{min-width:100px;min-height:100px}.person-group circle{will-change:transform;touch-action:auto;pointer-events:all;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1))}.person-group circle:active{filter:drop-shadow(0 1px 2px rgba(0,0,0,.2));transform:scale(.98)}.person-group.selected{transform:scale(1.05);transition:transform .2s ease}.person-group.selected circle{stroke:#e74c3c;stroke-width:4px;filter:drop-shadow(0 0 12px rgba(231,76,60,.6))}.relation{stroke:#7f8c8d;stroke-width:2px;pointer-events:none;opacity:.8}.relation.spouse{stroke-dasharray:4 2;stroke:#e74c3c;opacity:.9}.grid-line{stroke:#f0f0f0;stroke-width:1px;pointer-events:none}.grid-line.major{stroke:#e0e0e0;stroke-width:1px}#svgArea{width:100%;height:100%;background-color:#fff;cursor:grab;user-select:none;touch-action:pan-x pan-y;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;will-change:transform;transform-origin:0 0}#svgArea.panning{cursor:grabbing;touch-action:none}.person-group{will-change:transform;touch-action:auto}.person-group circle{will-change:transform;touch-action:auto;pointer-events:all}@media(max-width:768px){.cache-indicator{bottom:8px;left:8px;font-size:11px;min-width:140px;max-width:200px}.cache-indicator.expanded{width:260px;min-height:120px;max-width:calc(100vw - 32px)}#settingsPanel{width:calc(100vw - 32px);right:16px;left:16px;max-height:calc(100vh - 80px);max-height:calc(100dvh - 80px)}.collapsible-header{padding:14px 20px}.collapsible-content{padding:0 20px 14px}.setting-group{gap:10px;margin-bottom:14px;flex-direction:column;align-items:stretch}.setting-group label{margin-bottom:6px;font-size:14px}.gender-radio-group{flex-direction:column;gap:8px}.gender-radio-option{height:44px;justify-content:flex-start;padding:12px 16px}.floating-buttons{flex-direction:column;align-items:center}.floating-buttons .main-buttons{flex-direction:column;gap:16px}.form-group input,.form-group select,.searchable-select .select-input{padding:14px 16px;font-size:16px;min-height:48px;box-sizing:border-box}#familyTable{font-size:14px}#familyTable th,#familyTable td{padding:8px 4px}.table-btn{padding:8px 12px;min-height:40px}.setting-group input,.setting-group select,.setting-group button{padding:12px 16px;font-size:16px;min-height:48px}.search-container{left:48px}.search-field.expanded{width:250px}.node-style-grid{grid-template-columns:1fr}.notifications-container{top:10px;right:10px;left:10px}.notification{min-width:unset;max-width:unset}.floating-buttons.expanded #bringFrontBtn{transform:translateY(-350px) scale(1);transition-delay:.05s}.floating-buttons.expanded #editBtn{transform:translateY(-280px) scale(1);transition-delay:.1s}.floating-buttons.expanded #styleBtn{transform:translateY(-210px) scale(1);transition-delay:.15s}.floating-buttons.expanded #connectBtn{transform:translateY(-140px) scale(1);transition-delay:.2s}.floating-buttons.expanded #bringFrontBtn:hover{transform:translateY(-350px) scale(1.1)}.floating-buttons.expanded #editBtn:hover{transform:translateY(-280px) scale(1.1)}.floating-buttons.expanded #styleBtn:hover{transform:translateY(-210px) scale(1.1)}.floating-buttons.expanded #connectBtn:hover{transform:translateY(-140px) scale(1.1)}.floating-buttons.expanded #bringFrontBtn:active{transform:translateY(-350px) scale(.95)}.floating-buttons.expanded #editBtn:active{transform:translateY(-280px) scale(.95)}.floating-buttons.expanded #styleBtn:active{transform:translateY(-210px) scale(.95)}.floating-buttons.expanded #connectBtn:active{transform:translateY(-140px) scale(.95)}.person-group text.name{font-size:10px!important}.person-group text.birth-name{font-size:9px!important}.person-group text.dob{font-size:9px!important}.person-group circle{r:55}}@media(max-width:480px){.zoom-controls{bottom:12px;right:12px}.gender-radio-option{padding:10px 14px;font-size:13px}}.export-group-enhanced{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:8px;margin-bottom:12px}.export-btn{padding:8px 12px;font-size:12px;font-weight:500;background-color:#3498db;color:#fff;border:none;border-radius:6px;cursor:pointer;transition:background-color .2s ease}.export-btn:hover{background-color:#2980b9}.export-btn.advanced{background-color:#9b59b6}.export-btn.advanced:hover{background-color:#8e44ad}.clear-all-section{border-top:2px solid #e9ecef;margin-top:16px;padding-top:16px}.clear-all-section h4{color:#e74c3c;margin-bottom:12px}.import-export-enhanced{border:2px dashed #e9ecef;border-radius:8px;padding:16px;text-align:center;margin-bottom:16px;transition:border-color .2s ease}.import-export-enhanced:hover{border-color:#3498db}.import-export-enhanced.dragover{border-color:#3498db;background:#3498db0d}.format-support{font-size:12px;color:#666;margin-top:8px}.setting-group-enhanced{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}.setting-group-enhanced label{font-weight:500;color:#495057;font-size:14px}.setting-group-enhanced .help-text{font-size:12px;color:#6c757d;margin-top:4px}@media screen and (max-width:768px){.modal{height:100dvh!important;height:100vh!important}.modal-content{max-height:calc(100dvh - 96px)!important;max-height:calc(100vh - 96px)!important}}@media screen and (max-width:480px){.modal{height:100dvh!important;height:100vh!important;height:100svh!important}.modal-content{max-height:calc(100dvh - 120px)!important;max-height:calc(100vh - 120px)!important;max-height:calc(100svh - 120px)!important}}@media print{.header,.site-footer,.sidebar,.top-toolbar,.floating-buttons,.zoom-controls,.header-controls,.cache-indicator,.install-banner,.offline-badge,#settingsPanel,.modal,.notifications-container,.search-container,.skip-link{display:none!important}body{background:#fff!important;color:#000!important;font-size:10pt}main,#main,#mainContainer,#graphicView{margin:0!important;padding:0!important;width:100%!important;height:auto!important;position:static!important;overflow:visible!important;background:#fff!important}#graphicView canvas,#graphicView svg{max-width:100%!important;height:auto!important;page-break-inside:avoid}h1,h2,h3{page-break-after:avoid}@page{size:A4 landscape;margin:1cm}a[href^=http]:after{content:" (" attr(href) ")";font-size:80%;color:#555}a[href^="#"]:after,a[href^="mailto:"]:after{content:""}}.language-switcher{position:relative}.language-button{display:flex;align-items:center;gap:6px;padding:6px 10px;background:#fff;border:1px solid #ddd;border-radius:8px;cursor:pointer;font-size:14px;font-weight:500;color:var(--text-primary, #2c3e50);white-space:nowrap}.language-button:hover{background:#f5f5f5}.language-dropdown{display:none;position:absolute;top:calc(100% + 6px);right:0;background:#fff;border:1px solid #ddd;border-radius:8px;box-shadow:0 4px 16px #0000001f;z-index:300;min-width:140px;overflow:hidden}.language-dropdown.open{display:block}.language-option{display:flex;align-items:center;gap:8px;width:100%;padding:8px 12px;background:none;border:none;cursor:pointer;font-size:14px;text-align:left;color:var(--text-primary, #2c3e50);white-space:nowrap}.language-option:hover,.language-option.active{background:#f0f9f6;color:var(--primary-color, #0f866c)}