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/lib/registry/components/pivot-grid/PivotGridComponent.tsx

@@ -1712,8 +1712,8 @@ export const PivotGridComponent: React.FC<PivotGridProps> = ({
 
       {/* 필터 바 - 필터 영역에 필드가 있을 때만 표시 */}
       {filterFields.length > 0 && (
-        <div className="flex items-center gap-2 px-3 py-1.5 border-b border-border bg-orange-50/50 dark:bg-orange-950/10">
-          <Filter className="h-3.5 w-3.5 text-orange-600 dark:text-orange-400" />
+        <div className="flex items-center gap-2 px-3 py-1.5 border-b border-border bg-amber-50/50 dark:bg-orange-950/10">
+          <Filter className="h-3.5 w-3.5 text-amber-600 dark:text-orange-400" />
           <span className="text-xs font-medium text-orange-700 dark:text-orange-300">필터:</span>
           <div className="flex items-center gap-2 flex-wrap">
             {filterFields.map((filterField) => {
@@ -1739,7 +1739,7 @@ export const PivotGridComponent: React.FC<PivotGridProps> = ({
                         "flex items-center gap-1.5 px-2 py-1 rounded text-xs",
                         "border transition-colors max-w-xs",
                         isFiltered
-                          ? "bg-orange-100 border-orange-300 text-orange-800 dark:bg-orange-900/30 dark:border-orange-700 dark:text-orange-200"
+                          ? "bg-amber-100 border-orange-300 text-orange-800 dark:bg-orange-900/30 dark:border-orange-700 dark:text-orange-200"
                           : "bg-background border-border hover:bg-accent"
                       )}
                       title={isFiltered ? `${filterField.caption}: ${selectedValues.join(", ")}` : filterField.caption}