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/barcode/designer/BarcodeLabelCanvasComponent.tsx

@@ -202,7 +202,7 @@ export function BarcodeLabelCanvasComponent({ component }: Props) {
             }}
           />
         ) : (
-          <div className="flex h-full w-full items-center justify-center bg-gray-100 text-xs text-gray-400">
+          <div className="flex h-full w-full items-center justify-center bg-muted text-xs text-muted-foreground/70">
             이미지
           </div>
         );
@@ -244,7 +244,7 @@ export function BarcodeLabelCanvasComponent({ component }: Props) {
       {selected && component.type !== "line" && (
         <div
           data-resize-handle
-          className="absolute bottom-0 right-0 h-2 w-2 cursor-se-resize bg-blue-500"
+          className="absolute bottom-0 right-0 h-2 w-2 cursor-se-resize bg-primary"
           onMouseDown={(e) => {
             e.stopPropagation();
             setIsResizing(true);