[FE-10] 모바일 경량 테마 모듈 (light/dark 토큰 + useTheme)

작업 내용 (설계 의도)

근거: design-fe-app.md — 모바일 테마 전무(색 하드코딩) → 신규 컴포넌트가 소비할 경량 테마 도입. no-single-mode 준수(라이트/다크 둘 다).

변경 사항

  • 신규 mobile/theme/tokens.tslight·dark 두 토큰 객체. 시맨틱 키(background, surface, textPrimary, textSecondary, border, accent, danger) + 대기질 등급 배지 키(airGoodBg/airGoodFgairUnknownBg/airUnknownFg). 값은 설계 문서 “테마 토큰” 표 그대로.
  • 신규 mobile/theme/useTheme.tsuseColorScheme() 기준으로 light/dark 토큰 객체 반환. 기존 화면은 이번 범위에서 리팩터하지 않음(신규 컴포넌트만 소비).

의존

  • 없음 (wave 1)

다이어그램

클래스 의존

flowchart LR
    Scheme[useColorScheme] --> Hook[useTheme]
    Tokens[tokens light/dark] --> Hook
    Hook --> Badge[AirQuality 컴포넌트 후행]

테스트 케이스

  • useTheme가 라이트 스킴에서 light 토큰 객체를 반환한다
  • useTheme가 다크 스킴에서 dark 토큰 객체를 반환한다
  • 반환 토큰에 대기질 등급 배지 키(airBadBg 등)가 모두 존재한다
  • 시맨틱 키(background/surface/textPrimary/danger)가 두 모드에 모두 정의된다