refactor: 전체 프론트엔드 하드코딩 색상 → CSS 변수 일괄 치환

447+ 파일, 4500+ 줄 변경:
- gray-* → border/bg-muted/text-foreground/text-muted-foreground
- blue-* → primary/ring
- red-* → destructive
- green-* → emerald (일관성)
- indigo-* → primary
- yellow/orange → amber (통일)
- dark mode 변형도 시맨틱 토큰으로 변환

Made-with: Cursor

frontend/components/dataflow/node-editor/nodes/CommentNode.tsx

@@ -12,16 +12,16 @@ import type { CommentNodeData } from "@/types/node-editor";
 export const CommentNode = memo(({ data, selected }: NodeProps<CommentNodeData>) => {
   return (
     <div
-      className={`max-w-[350px] min-w-[200px] rounded-lg border-2 border-dashed bg-yellow-50 shadow-sm transition-all ${
-        selected ? "border-yellow-500 shadow-md" : "border-yellow-300"
+      className={`max-w-[350px] min-w-[200px] rounded-lg border-2 border-dashed bg-amber-50 shadow-sm transition-all ${
+        selected ? "border-yellow-500 shadow-md" : "border-amber-300"
       }`}
     >
       <div className="p-3">
         <div className="mb-2 flex items-center gap-2">
-          <MessageSquare className="h-4 w-4 text-yellow-600" />
+          <MessageSquare className="h-4 w-4 text-amber-600" />
           <span className="text-xs font-semibold text-yellow-800">메모</span>
         </div>
-        <div className="text-sm whitespace-pre-wrap text-gray-700">{data.content || "메모를 입력하세요..."}</div>
+        <div className="text-sm whitespace-pre-wrap text-foreground">{data.content || "메모를 입력하세요..."}</div>
       </div>
     </div>
   );