.tree-page{display:flex;flex-direction:column;height:calc(100vh - 64px);padding:var(--space-4) var(--space-6) var(--space-2);max-width:1440px;margin:0 auto;box-sizing:border-box}.tree-page-heading{font-family:var(--font-serif);font-size:var(--text-2xl);font-weight:var(--weight-bold);color:var(--color-navy-700);letter-spacing:var(--tracking-tight);margin:0 0 var(--space-1);flex-shrink:0}.tc-root{display:flex;flex-direction:column;flex:1;min-height:0;gap:var(--space-2)}.tc-limit-banner{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:var(--color-warning-surface);color:var(--color-warning);border:1px solid #fcd34d;border-radius:var(--radius-md);font-family:var(--font-sans);font-size:var(--text-sm);flex-shrink:0}.tc-limit-banner svg{flex-shrink:0;color:#d97706}.tc-controls{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-2);flex-shrink:0}.tc-mode-group{display:flex;gap:var(--space-1);background:var(--color-neutral-100);border-radius:var(--radius-lg);padding:var(--space-1)}.tc-mode-btn{font-family:var(--font-sans);font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--color-neutral-600);background:transparent;border:none;border-radius:var(--radius-md);padding:var(--space-1) var(--space-3);cursor:pointer;transition:background var(--duration-fast) var(--ease-default),color var(--duration-fast) var(--ease-default)}.tc-mode-btn:hover{background:var(--color-neutral-200);color:var(--color-navy-700)}.tc-mode-active{background:var(--color-white)!important;color:var(--color-navy-700)!important;box-shadow:var(--shadow-sm)}.tc-mode-active:focus-visible,.tc-mode-btn:focus-visible{outline:var(--focus-width) solid var(--focus-color);outline-offset:var(--focus-offset)}.tc-action-group{display:flex;align-items:center;gap:var(--space-2)}.tc-icon-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:var(--color-neutral-100);border:1px solid var(--color-neutral-200);border-radius:var(--radius-md);color:var(--color-neutral-600);cursor:pointer;transition:background var(--duration-fast),color var(--duration-fast)}.tc-icon-btn:hover{background:var(--color-neutral-200);color:var(--color-navy-700)}.tc-icon-btn:focus-visible{outline:var(--focus-width) solid var(--focus-color);outline-offset:var(--focus-offset)}.tc-profile-link{font-family:var(--font-sans);font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--color-paternal);text-decoration:none;padding:var(--space-1) var(--space-3);border:1px solid var(--color-paternal);border-radius:var(--radius-md);transition:background var(--duration-fast),color var(--duration-fast)}.tc-profile-link:hover{background:var(--color-paternal);color:var(--color-white)}.tc-profile-link:focus-visible{outline:var(--focus-width) solid var(--focus-color);outline-offset:var(--focus-offset)}.tc-root-label{display:flex;align-items:center;gap:var(--space-2);font-family:var(--font-sans);font-size:var(--text-sm);color:var(--color-neutral-500);flex-shrink:0}.tc-root-icon{font-size:var(--text-base);color:var(--color-navy-700)}.tc-canvas-wrap{flex:1;min-height:0;border:1px solid var(--color-neutral-200);border-radius:var(--radius-lg);overflow:hidden;background:var(--color-neutral-50);outline:none;position:relative}.tc-canvas-wrap:focus-visible{outline:var(--focus-width) solid var(--focus-color);outline-offset:var(--focus-offset)}.tc-canvas-wrap .react-flow__renderer{border-radius:var(--radius-lg)}.tc-canvas-wrap .react-flow__handle{opacity:0;pointer-events:none}.tc-limit-overlay{position:absolute;top:0;left:0;right:0;z-index:5;display:flex;align-items:center;gap:var(--space-3);padding:0 var(--space-4);height:48px;background:var(--color-warning-surface);border-bottom:1px solid rgba(146,64,14,.3);font-family:var(--font-sans);font-size:var(--text-sm);color:var(--color-warning)}.tc-limit-overlay svg{flex-shrink:0}.tc-limit-text{flex:1}.tc-limit-dismiss{background:none;border:1px solid rgba(146,64,14,.4);border-radius:var(--radius-sm);color:var(--color-warning);font-size:18px;line-height:1;padding:0 8px;cursor:pointer;opacity:.7;font-family:var(--font-sans)}.tc-limit-dismiss:hover{opacity:1}.tc-ctrl-pill{position:absolute;bottom:var(--space-6);right:var(--space-6);z-index:5;display:flex;align-items:center;gap:1px;background:var(--color-white);border:1px solid var(--color-neutral-200);border-radius:var(--radius-full);box-shadow:var(--shadow-md);padding:6px 10px}.tc-ctrl-pill-btn{font-family:var(--font-sans);font-size:12px;font-weight:var(--weight-medium);color:var(--color-neutral-700);background:none;border:none;border-radius:var(--radius-full);padding:4px 10px;cursor:pointer;transition:background var(--duration-fast),color var(--duration-fast);white-space:nowrap}.tc-ctrl-pill-btn:hover{background:var(--color-neutral-100)}.tc-ctrl-pill-active{background:var(--color-paternal)!important;color:var(--color-white)!important}.tc-ctrl-pill-btn:focus-visible,.tc-ctrl-pill-active:focus-visible{outline:var(--focus-width) solid var(--focus-color);outline-offset:var(--focus-offset)}.tc-ctrl-divider{width:1px;height:20px;background:var(--color-neutral-200);margin:0 6px;flex-shrink:0}.tc-zoom-btn{background:var(--color-neutral-100);border:none;cursor:pointer;width:28px;height:28px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--color-neutral-700);transition:background var(--duration-fast);flex-shrink:0}.tc-zoom-btn:hover{background:var(--color-neutral-200)}.tc-zoom-btn:focus-visible{outline:var(--focus-width) solid var(--focus-color);outline-offset:var(--focus-offset)}.tc-zoom-label{font-family:var(--font-mono);font-size:11px;color:var(--color-neutral-600);min-width:36px;text-align:center}.tc-reset-fab{position:absolute;bottom:var(--space-6);left:50%;transform:translate(-50%);z-index:5;height:40px;padding:0 var(--space-4);border-radius:var(--radius-full, 9999px);background:var(--color-navy-700);border:none;cursor:pointer;display:flex;align-items:center;gap:var(--space-2);box-shadow:var(--shadow-md);color:var(--color-white);transition:background var(--duration-fast),box-shadow var(--duration-fast)}.tc-reset-fab:hover{background:var(--color-navy-600, #1b2a4a);box-shadow:var(--shadow-lg)}.tc-reset-fab:focus-visible{outline:var(--focus-width) solid var(--focus-color);outline-offset:var(--focus-offset)}.tc-reset-fab svg{width:16px;height:16px;flex-shrink:0}.tc-reset-fab-label{font-family:var(--font-sans);font-size:var(--text-xs);font-weight:var(--weight-medium);letter-spacing:var(--tracking-wide);text-transform:uppercase;white-space:nowrap}.tc-mobile-mode-bar{display:none}.tc-kb-hint{font-family:var(--font-sans);font-size:var(--text-xs);color:var(--color-neutral-400);text-align:center;flex-shrink:0;margin:0}.tc-kb-hint kbd{font-family:var(--font-mono);font-size:var(--text-xs);background:var(--color-neutral-100);border:1px solid var(--color-neutral-300);border-radius:3px;padding:0 3px}.pn-root{display:flex;align-items:stretch;background:var(--color-white);border:1.5px solid var(--color-neutral-200);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);overflow:hidden;cursor:default;user-select:none;transition:box-shadow var(--duration-fast) var(--ease-default),border-color var(--duration-fast) var(--ease-default);box-sizing:border-box;position:relative}.pn-root:hover{box-shadow:var(--shadow-md);border-color:var(--color-neutral-300)}.pn-focused{border-color:var(--focus-color)!important;box-shadow:0 0 0 3px #2563eb33,var(--shadow-md)!important}.pn-home{border:2px solid var(--color-navy-700)!important;box-shadow:var(--shadow-md),0 0 0 3px #141f381a!important}.pn-terminal{opacity:.8}.pn-accent{width:4px;flex-shrink:0;background:var(--accent, var(--color-neutral-300))}.pn-portrait{width:48px;height:48px;flex-shrink:0;margin:var(--space-2) var(--space-2) var(--space-2) var(--space-2);background:var(--color-neutral-100);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;align-self:center}.pn-portrait-svg{width:28px;height:28px;color:var(--color-neutral-400)}.pn-text{flex:1;min-width:0;padding:var(--space-2) var(--space-2) var(--space-2) 0;display:flex;flex-direction:column;justify-content:center;gap:2px;overflow:hidden}.pn-name{font-family:var(--font-serif);font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--color-navy-700);line-height:var(--leading-snug);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pn-dates{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-neutral-500);white-space:nowrap}.pn-branch{font-family:var(--font-sans);font-size:10px;font-weight:var(--weight-bold);letter-spacing:.05em;text-transform:uppercase;margin-top:1px}.pn-terminal-badge{font-family:var(--font-sans);font-size:10px;color:var(--color-neutral-700);background:var(--color-warning-surface);border-radius:var(--radius-sm);padding:0 4px;align-self:flex-start}.pn-handle{opacity:0!important;pointer-events:none!important}.react-flow__attribution a{color:var(--color-neutral-700)!important;background:var(--color-white)!important}.fc-root{flex:1;min-height:0;border:1px solid var(--color-neutral-200);border-radius:var(--radius-lg);background:var(--color-neutral-50);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden}.fc-svg{width:100%;height:100%;max-height:100%}.fc-home-circle{cursor:pointer;transition:opacity var(--duration-fast)}.fc-home-circle:hover{opacity:.85}.fc-home-circle:focus-visible{outline:var(--focus-width) solid var(--focus-color);outline-offset:3px}.fc-home-name{pointer-events:none;user-select:none}.fc-tooltip{position:absolute;bottom:var(--space-4);left:50%;transform:translate(-50%);background:var(--color-navy-700);color:var(--color-white);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);display:flex;flex-direction:column;align-items:center;gap:2px;pointer-events:none;font-family:var(--font-sans);max-width:280px;box-shadow:var(--shadow-lg);z-index:var(--z-raised)}.fc-tooltip-name{font-size:var(--text-sm);font-weight:var(--weight-semibold)}.fc-tooltip-dates{font-size:var(--text-xs);opacity:.8}.fc-tooltip-hint{font-size:10px;opacity:.6;margin-top:2px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}@media(max-width:768px){.tree-page{padding:var(--space-3) var(--space-3) var(--space-1);height:calc(100vh - 56px)}.tree-page-heading{font-size:var(--text-xl)}.tc-ctrl-pill{inset:0 0 auto;border-radius:0;box-shadow:var(--shadow-sm);padding:0;gap:0;border-left:none;border-right:none;border-top:none;border-bottom:1px solid var(--color-neutral-200)}.tc-ctrl-pill-btn{flex:1;border-radius:0;padding:12px 4px;font-size:var(--text-xs);border-right:1px solid var(--color-neutral-200);text-align:center}.tc-ctrl-pill-btn:last-of-type{border-right:none}.tc-ctrl-divider,.tc-zoom-btn,.tc-zoom-label{display:none}.tc-reset-fab{bottom:var(--space-5);height:36px;padding:0 var(--space-3)}.pn-portrait{width:36px;height:36px}.pn-portrait-svg{width:22px;height:22px}.pn-name{font-size:var(--text-xs)}.pn-branch,.tc-kb-hint{display:none}.fc-tooltip{bottom:var(--space-2);font-size:var(--text-xs)}}.tc-workspace{flex:1;min-height:0;display:flex;gap:var(--space-3);align-items:stretch}.tcp-panel{width:256px;flex-shrink:0;display:flex;flex-direction:column;background:var(--color-white);border:1px solid var(--color-neutral-200);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow:hidden;transition:width var(--duration-normal) var(--ease-default)}.tcp-panel--collapsed{width:42px}.tcp-toggle{display:flex;align-items:center;gap:var(--space-2);padding:0 var(--space-3);height:40px;border:none;border-bottom:1px solid var(--color-neutral-200);background:var(--color-neutral-50);cursor:pointer;color:var(--color-neutral-600);font-family:var(--font-sans);font-size:var(--text-xs);font-weight:var(--weight-medium);white-space:nowrap;overflow:hidden;flex-shrink:0;width:100%;text-align:left}.tcp-toggle:hover{background:var(--color-neutral-100);color:var(--color-navy-700)}.tcp-toggle:focus-visible{outline:var(--focus-width) solid var(--focus-color);outline-offset:-2px}.tcp-toggle-icon{flex-shrink:0}.tcp-toggle-label{flex:1;letter-spacing:var(--tracking-wide);text-transform:uppercase}.tcp-body{flex:1;overflow-y:auto;padding:var(--space-3);display:flex;flex-direction:column;gap:var(--space-4)}.tcp-section{display:flex;flex-direction:column;gap:var(--space-2)}.tcp-section-label{font-family:var(--font-sans);font-size:.6875rem;font-weight:var(--weight-bold);letter-spacing:var(--tracking-widest);text-transform:uppercase;color:var(--color-neutral-600)}.tcp-divider{height:1px;background:var(--color-neutral-100);margin:0 calc(-1 * var(--space-3))}.tcp-search-wrap{position:relative}.tcp-search-icon{position:absolute;left:.5625rem;top:50%;transform:translateY(-50%);color:var(--color-neutral-400);pointer-events:none}.tcp-input{width:100%;height:34px;padding:0 var(--space-3) 0 2rem;border:1px solid var(--color-neutral-200);border-radius:var(--radius-md);font-family:var(--font-sans);font-size:var(--text-sm);color:var(--color-neutral-700);background:var(--color-neutral-50);outline:none}.tcp-input:focus{border-color:var(--color-paternal);background:var(--color-white);box-shadow:0 0 0 3px var(--color-paternal-light)}.tcp-input::placeholder{color:var(--color-neutral-400)}.tcp-results{list-style:none;border:1px solid var(--color-neutral-200);border-radius:var(--radius-md);background:var(--color-white);box-shadow:var(--shadow-md);overflow:hidden;padding:0;margin:0}.tcp-results li{border-bottom:1px solid var(--color-neutral-100)}.tcp-results li:last-child{border-bottom:none}.tcp-result-btn{width:100%;display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border:none;background:none;cursor:pointer;text-align:left}.tcp-result-btn:hover{background:var(--color-paternal-light)}.tcp-result-btn:hover .tcp-result-name{color:var(--color-paternal-dark)}.tcp-result-btn:focus-visible{outline:var(--focus-width) solid var(--focus-color);outline-offset:-2px}.tcp-result-avatar{width:26px;height:26px;border-radius:50%;background:var(--color-neutral-100);border:1px solid var(--color-neutral-200);display:flex;align-items:center;justify-content:center;font-family:var(--font-serif);font-size:9px;font-weight:var(--weight-semibold);color:var(--color-neutral-600);flex-shrink:0}.tcp-result-info{display:flex;flex-direction:column;gap:1px;min-width:0}.tcp-result-name{font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--color-neutral-700);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tcp-result-meta{font-family:var(--font-mono);font-size:.6875rem;color:var(--color-neutral-500)}.tcp-no-results{font-size:var(--text-xs);color:var(--color-neutral-500);font-family:var(--font-sans);padding:var(--space-1) 0}.tcp-filter-active{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1) var(--space-2);border-radius:var(--radius-md);font-size:var(--text-xs);font-weight:var(--weight-medium);font-family:var(--font-sans);background:var(--color-paternal-light);color:var(--color-paternal-dark);border:1px solid color-mix(in srgb,var(--color-paternal) 25%,transparent)}.tcp-filter-active--maternal{background:var(--color-maternal-light);color:var(--color-maternal-dark);border-color:color-mix(in srgb,var(--color-maternal) 25%,transparent)}.tcp-filter-active--unknown{background:var(--color-neutral-100);color:var(--color-neutral-700);border-color:var(--color-neutral-200)}.tcp-filter-clear{margin-left:auto;background:none;border:none;cursor:pointer;font-size:1rem;line-height:1;padding:0;color:inherit;opacity:.7;flex-shrink:0}.tcp-filter-clear:hover{opacity:1}.tcp-branches{display:flex;flex-direction:column;gap:2px}.tcp-branch{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);border:1px solid transparent;cursor:pointer;transition:background var(--duration-fast)}.tcp-branch:hover{background:var(--color-neutral-50)}.tcp-branch--active{background:var(--color-neutral-100);border-color:var(--color-neutral-200)}.tcp-branch--active-paternal{background:var(--color-paternal-light);border-color:color-mix(in srgb,var(--color-paternal) 20%,transparent)}.tcp-branch--active-maternal{background:var(--color-maternal-light);border-color:color-mix(in srgb,var(--color-maternal) 20%,transparent)}.tcp-radio{width:16px;height:16px;border-radius:50%;border:2px solid var(--color-neutral-300);background:var(--color-white);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:border-color var(--duration-fast)}.tcp-branch--active-paternal .tcp-radio{border-color:var(--color-paternal)}.tcp-branch--active-maternal .tcp-radio{border-color:var(--color-maternal)}.tcp-branch--active-unknown .tcp-radio,.tcp-branch--active-all .tcp-radio{border-color:var(--color-neutral-500)}.tcp-radio-dot{width:8px;height:8px;border-radius:50%}.tcp-radio-dot--paternal{background:var(--color-paternal)}.tcp-radio-dot--maternal{background:var(--color-maternal)}.tcp-radio-dot--unknown,.tcp-radio-dot--all{background:var(--color-neutral-500)}.tcp-swatch{width:10px;height:10px;border-radius:2px;flex-shrink:0}.tcp-swatch--all{background:transparent;border:1.5px dashed var(--color-neutral-300)}.tcp-swatch--paternal{background:var(--color-paternal)}.tcp-swatch--maternal{background:var(--color-maternal)}.tcp-swatch--unknown{background:var(--color-neutral-300)}.tcp-branch-label{font-family:var(--font-sans);font-size:var(--text-sm);color:var(--color-neutral-700);flex:1}.tcp-home-card{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2);background:var(--color-neutral-50);border:1px solid var(--color-neutral-200);border-radius:var(--radius-md)}.tcp-home-avatar{width:32px;height:32px;border-radius:50%;background:var(--color-navy-700);color:var(--color-white);display:flex;align-items:center;justify-content:center;font-family:var(--font-serif);font-size:10px;font-weight:var(--weight-semibold);flex-shrink:0}.tcp-home-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.tcp-home-name{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--color-neutral-700);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tcp-home-meta{font-family:var(--font-mono);font-size:.6875rem;color:var(--color-neutral-500)}.tcp-home-edit-btn{display:flex;align-items:center;gap:4px;background:none;border:1px solid var(--color-neutral-200);border-radius:var(--radius-sm);padding:var(--space-1) var(--space-2);font-family:var(--font-sans);font-size:.6875rem;color:var(--color-neutral-600);cursor:pointer;flex-shrink:0;white-space:nowrap}.tcp-home-edit-btn:hover{background:var(--color-neutral-100);color:var(--color-paternal);border-color:var(--color-paternal)}.tcp-home-edit-btn:focus-visible{outline:var(--focus-width) solid var(--focus-color);outline-offset:var(--focus-offset)}.tcp-home-editing{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-2);background:var(--color-neutral-50);border:1px solid var(--color-neutral-200);border-radius:var(--radius-md)}.tcp-home-editing-hint{font-size:var(--text-xs);color:var(--color-neutral-600);font-weight:var(--weight-medium);font-family:var(--font-sans)}.tcp-cancel-btn{align-self:flex-start;background:none;border:1px solid var(--color-neutral-200);border-radius:var(--radius-sm);padding:var(--space-1) var(--space-3);font-family:var(--font-sans);font-size:var(--text-xs);color:var(--color-neutral-600);cursor:pointer}.tcp-cancel-btn:hover{background:var(--color-neutral-100)}.tcp-cancel-btn:focus-visible{outline:var(--focus-width) solid var(--focus-color);outline-offset:var(--focus-offset)}@media(max-width:767px){.tc-workspace{flex-direction:column}.tcp-panel{width:100%;border-radius:var(--radius-md);max-height:44px;overflow:hidden;transition:max-height var(--duration-normal) var(--ease-default)}.tcp-panel:not(.tcp-panel--collapsed){max-height:380px}.tcp-panel--collapsed{width:100%;max-height:44px}.tcp-toggle-label{display:block}}@media(prefers-reduced-motion:reduce){.tc-ctrl-pill-btn,.tc-zoom-btn,.tc-reset-fab,.pn-root,.fc-home-circle{transition:none}}
