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/BarcodeComponentPalette.tsx

@@ -61,7 +61,7 @@ function DraggableItem({
   return (
     <div
       ref={drag}
-      className={`flex cursor-move items-center gap-2 rounded border p-2 text-sm hover:border-blue-500 hover:bg-blue-50 ${
+      className={`flex cursor-move items-center gap-2 rounded border p-2 text-sm hover:border-primary hover:bg-primary/10 ${
         isDragging ? "opacity-50" : ""
       }`}
     >

frontend/components/barcode/designer/BarcodeDesignerCanvas.tsx

@@ -51,7 +51,7 @@ export function BarcodeDesignerCanvas() {
   }), [widthPx, heightPx, components.length, addComponent, snapValueToGrid]);
 
   return (
-    <div className="flex flex-1 items-center justify-center overflow-auto bg-gray-100 p-6">
+    <div className="flex flex-1 items-center justify-center overflow-auto bg-muted p-6">
       <div
         key={`canvas-${widthMm}-${heightMm}`}
         ref={(r) => {

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);

frontend/components/barcode/designer/BarcodePrintPreviewModal.tsx

@@ -151,7 +151,7 @@ export function BarcodePrintPreviewModal({
           </p>
 
           {/* 미리보기 캔버스 (축소) */}
-          <div className="flex justify-center rounded border bg-gray-100 p-4">
+          <div className="flex justify-center rounded border bg-muted p-4">
             <div
               className="relative bg-white shadow"
               style={{