.ft-tree-live{height:100%;position:relative;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) 78px}.ft-tree-viewport{position:relative;min-width:0;min-height:0;overflow:hidden;container-type:size;--tree-scene-width:min(100cqw,calc(100cqh * 37 / 29));--tree-scene-height:min(100cqh,calc(100cqw * 29 / 37));--tree-scene-offset-y:calc(100cqh - var(--tree-scene-height))}.ft-tree-viewport[data-fit=fixed]{--tree-scene-width:calc(var(--tree-fixed-height, 500px) * 37 / 29);--tree-scene-height:var(--tree-fixed-height,500px);--tree-scene-offset-y:calc((100cqh - var(--tree-scene-height)) / 2)}.ft-tree-drawing{position:absolute;left:50%;bottom:0;width:var(--tree-scene-width);height:var(--tree-scene-height);transform:translateX(-50%)}.ft-tree-viewport[data-fit=fixed] .ft-tree-drawing{top:50%;bottom:auto;transform:translate(-50%,-50%)}.ft-tree-drawing canvas{display:block;width:100%;height:100%;touch-action:pan-y}.ft-tree-drawing canvas[tabindex]:hover{cursor:crosshair}.ft-tree-tooltip{position:absolute;box-sizing:border-box;width:215px;max-width:calc(100% - 24px);max-height:calc(100% - 16px);overflow:hidden;left:clamp(12px,calc(50% - var(--tree-scene-width) / 2 + var(--tree-anchor-x) + 14px),calc(100% - 227px));top:clamp(8px,calc(var(--tree-scene-offset-y) + var(--tree-anchor-y) - 62px),calc(100% - 100px));pointer-events:none;padding:10px 13px;border:1px solid #3c5365;background:#101c29f5;border-radius:9px;box-shadow:0 8px 30px #0003;z-index:3}.ft-tree-tooltip strong{display:block;color:#f1f4f6;font-size:12px;font-weight:500;line-height:1.6}.ft-tree-tooltip>span{display:block;margin-top:2px;color:#a6b6c3;font-size:10px}.ft-tree-roots{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;align-items:start}.ft-tree-live .ft-tree-roots button{display:flex;flex-direction:column;align-items:center;gap:7px;padding:3px 0;border:0;background:transparent;color:#b8c5cf;font-size:10px;cursor:pointer;min-height:44px}.ft-tree-roots i{display:grid;place-items:center;width:29px;height:29px;border-radius:50%;color:#eaf8ff;font-size:16px;font-style:normal;box-shadow:0 0 24px color-mix(in srgb,var(--tree-subject) 30%,transparent),inset 0 0 0 1px #ffffff25}.ft-tree-roots small{font-size:8px;color:#899daa}.ft-tree-live .ft-tree-roots button[aria-pressed=true]{color:white}.ft-tree-live button:focus-visible,.ft-tree-live input:focus-visible{outline:2px solid #9ed4ff;outline-offset:3px}.ft-tree-preview{grid-template-rows:minmax(0,1fr) 94px}.ft-tree-static-preview{position:absolute;inset:0;width:100%;height:100%;-o-object-fit:contain;object-fit:contain}.ft-tree-drawing:has(canvas[data-ready=true]) .ft-tree-static-preview{display:none}.ft-tree-preview .ft-tree-roots button{font-size:12px;gap:8px}.ft-tree-preview .ft-tree-roots i{width:36px;height:36px}.ft-tree-preview .ft-tree-roots small{font-size:10px}@media(max-width:480px){.ft-tree-preview .ft-tree-roots button{font-size:10px}.ft-tree-preview .ft-tree-roots small{font-size:8px}}.ft-tree-viewport .ft-tree-motion{position:absolute;top:10px;right:10px;z-index:4;display:grid;place-items:center;width:30px;height:30px;padding:0;border:1px solid #2a3c4b;border-radius:50%;background:#070e1566;color:#a2adb7;cursor:pointer;opacity:.55;transition:opacity .16s ease}.ft-tree-viewport .ft-tree-motion:focus-visible,.ft-tree-viewport:hover .ft-tree-motion{opacity:1}.ft-tree-viewport .ft-tree-motion:focus-visible{outline:2px solid #9ed4ff;outline-offset:3px}.ft-tree-viewport:has(canvas:focus-visible){outline:2px solid #9ed4ff;outline-offset:-3px}.ft-tree-viewport .ft-tree-drawing canvas:focus-visible{outline:none}@keyframes ft-tree-root-in{0%{opacity:0;transform:translateY(8px)}}@media (prefers-reduced-motion:no-preference){.ft-tree-grow .ft-tree-roots button{animation:ft-tree-root-in .6s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(.9s + var(--tree-order, 0) * 80ms)}}.ft-tree-roots i{transition:box-shadow .18s ease}.ft-tree-roots i[data-linked]{box-shadow:0 0 28px color-mix(in srgb,var(--tree-subject) 70%,transparent),inset 0 0 0 1px #ffffff55}