feat(WEB): QMS 필터 리팩토링 및 공통 컴포넌트 추가

- ScrollableButtonGroup 아톰 컴포넌트 신규 추가
- YearQuarterFilter 분자 컴포넌트 신규 추가
- QMS Filters 컴포넌트 공통 필터로 리팩토링
- QMS Header, AuditSettingsPanel 수정
- DateRangeSelector 개선
- PerformanceReportList 필터 간소화
- ItemMasterDataManagement 수정
- CLAUDE.md 프로젝트 설정 업데이트

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

src/components/molecules/DateRangeSelector.tsx

@@ -4,6 +4,7 @@ import { ReactNode, useCallback } from 'react';
 import { format, startOfYear, endOfYear, subMonths, startOfMonth, endOfMonth, subDays } from 'date-fns';
 import { Input } from '@/components/ui/input';
 import { Button } from '@/components/ui/button';
+import { ScrollableButtonGroup } from '@/components/atoms/ScrollableButtonGroup';
 
 /**
  * 날짜 범위 프리셋 타입
@@ -126,24 +127,19 @@ export function DateRangeSelector({
   const renderPresets = () => {
     if (hidePresets || presets.length === 0) return null;
     return (
-      <div
-        className="overflow-x-auto -mx-1 px-1 xl:overflow-visible xl:mx-0 xl:px-0"
-        style={{ scrollbarWidth: 'none', msOverflowStyle: 'none' }}
-      >
-        <div className="flex items-center gap-1 min-w-max [&::-webkit-scrollbar]:hidden">
-          {presets.map((preset) => (
-            <Button
-              key={preset}
-              variant="outline"
-              size="sm"
-              onClick={() => handlePresetClick(preset)}
-              className="shrink-0 text-xs sm:text-sm px-2 sm:px-3"
-            >
-              {PRESET_LABELS[preset]}
-            </Button>
-          ))}
-        </div>
-      </div>
+      <ScrollableButtonGroup>
+        {presets.map((preset) => (
+          <Button
+            key={preset}
+            variant="outline"
+            size="sm"
+            onClick={() => handlePresetClick(preset)}
+            className="shrink-0 text-xs sm:text-sm px-2 sm:px-3"
+          >
+            {PRESET_LABELS[preset]}
+          </Button>
+        ))}
+      </ScrollableButtonGroup>
     );
   };