docs: Add documentation for category dropdown depth separation

- Introduced new documents detailing the implementation of visual separation for three-level category dropdowns.
- Updated the `flattenTree` function in both `V2Select.tsx` and `UnifiedSelect.tsx` to use Non-Breaking Space (`\u00A0`) for indentation, ensuring proper visual hierarchy.
- Included a checklist to track the implementation progress and verification of the changes.
- Documented the rationale behind the changes, including the issues with HTML whitespace collapsing and the decisions made to enhance user experience.

These updates aim to improve the clarity and usability of the category selection interface in the application.

frontend/components/v2/V2Select.tsx

@@ -901,7 +901,7 @@ export const V2Select = forwardRef<HTMLDivElement, V2SelectProps>((props, ref) =
               ): SelectOption[] => {
                 const result: SelectOption[] = [];
                 for (const item of items) {
-                  const prefix = depth > 0 ? "  ".repeat(depth) + "└ " : "";
+                  const prefix = depth > 0 ? "\u00A0\u00A0\u00A0".repeat(depth) + "└ " : "";
                   result.push({
                     value: item.valueCode, // 🔧 valueCode를 value로 사용
                     label: prefix + item.valueLabel,