/* 공용 나무 보기 — 줄 모양은 공용 ui-sidebar-row(ui_template_overlay.css) · * 탐색기 모양(들여쓰기 안내선 · 접기 화살 · 폴더/항목 아이콘 · 폴더 굵게 · 고른 줄 배경) */ .ui-tree__kids { position: relative; display: flex; flex-direction: column; gap: 2px; } /* 들여쓰기 안내선 — 부모 줄 화살 한가운데에서 자식 끝까지(줄 들임 = spacing-8 + 깊이 × spacing-16) */ .ui-tree__kids::before { content: ""; position: absolute; top: 0; bottom: 0; left: calc(var(--spacing-8) + var(--tree-depth, 0) * var(--spacing-16) + var(--spacing-12) / 2); border-left: 1px solid var(--color-border); pointer-events: none; } .ui-tree__label { display: inline-flex; align-items: center; min-width: 0; } .ui-tree__icon { display: inline-flex; flex: none; margin-right: var(--spacing-4); color: var(--color-text-secondary); } .ui-tree__row.is-branch .ui-tree__label { font-weight: 600; } .ui-tree__row.is-active .ui-tree__icon { color: inherit; } .ui-tree__branch { display: flex; flex-direction: column; gap: 2px; } .ui-tree__caret { display: inline-block; width: var(--spacing-12); color: var(--color-text-secondary); } .ui-tree__count { color: var(--color-text-secondary); font-size: var(--text-caption); } /* 오른쪽 클릭 메뉴 — 모달(z-index 1000) 위 · 모양은 공용 `.ui-ctx-menu`(ui_template_context_menu.css) */ .ui-tree__menu { position: fixed; z-index: 1100; }