.tree-page{max-width:1100px;margin:0 auto;padding:18px 16px 40px;display:flex;flex-direction:column;gap:14px}.tree-toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:8px}.tree-url-input{flex:1;min-width:180px;color:var(--text);background:var(--surface-2);border:1px solid var(--border);border-radius:7px;padding:6px 8px;font:inherit}.tree-view-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:6px 0 10px}.tree-zoom-slider{width:140px}.tree-zoom-label{min-width:3em;color:var(--muted);font-variant-numeric:tabular-nums}.tree-view-hint{margin:0}.tree-viewport{position:relative;overflow:hidden;height:70vh;min-height:340px;border:1px solid var(--border);border-radius:8px;touch-action:none;cursor:grab}.tree-viewport.panning{cursor:grabbing}.tree-canvas-wrap{position:absolute;top:0;left:0;transform-origin:0 0;min-width:fit-content;padding:12px}.tree-lines{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none}.tree-lines line{stroke:var(--muted);stroke-width:2;opacity:.6}.tree-rows{position:relative;display:flex;flex-direction:column;gap:46px;padding:10px 0}.tree-row{display:flex;gap:14px;justify-content:center;align-items:flex-start}.tree-node{background:var(--surface-2);border:1px solid var(--border);border-radius:10px;padding:8px;width:130px;text-align:center}.tree-node canvas{width:100px;height:100px;image-rendering:pixelated;background:repeating-conic-gradient(var(--checker-a) 0% 25%,var(--checker-b) 0% 50%) 0 0 / 16px 16px;border-radius:6px}.tree-node-name{font-weight:600;margin:4px 0 2px;overflow-wrap:anywhere}.tree-node-parents{font-size:.75rem;color:var(--muted);margin-bottom:6px;overflow-wrap:anywhere}.tree-node-buttons{display:flex;justify-content:center;gap:4px;flex-wrap:wrap}.tree-node-buttons button,.tree-node-buttons a{font-size:.75rem;padding:3px 7px}.tree-node-panel{margin-top:8px;padding-top:8px;border-top:1px dashed var(--border);display:flex;flex-direction:column;gap:6px;text-align:left;font-size:.8rem}.tree-node-panel label{color:var(--muted)}.tree-node-panel select{width:100%}.tree-node:has(.tree-node-panel){width:260px}.tree-kits{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}.tree-kit{display:flex;flex-direction:column;align-items:center;gap:3px;width:116px;padding:4px;background:var(--surface);border:1px solid var(--border);border-radius:6px}.tree-kit canvas{width:60px;height:60px;image-rendering:pixelated;background:repeating-conic-gradient(var(--checker-a) 0% 25%,var(--checker-b) 0% 50%) 0 0 / 16px 16px;border-radius:4px}.tree-kit button{width:100%;font-size:.7rem;padding:2px 4px}.tree-rows.lineage-active .tree-node{opacity:.28;transition:opacity .1s}.tree-rows.lineage-active .tree-node.in-lineage{opacity:1}.tree-lines.lineage-active line{opacity:.12}.tree-lines.lineage-active line.in-lineage{opacity:1;stroke:var(--accent);stroke-width:3}