다국어 지원 기획서 — 로그인 페이지 텍스트 추출 및 번역

1. 개요

1.1 목적

로그인 페이지의 하드코딩된 영어 문구를 추출하여 사전 파일(dictionaries/en.json)로 분리하고, 동일 구조의 한국어 번역 파일(ko.json)을 생성한다. UI 디자인·Tailwind 클래스는 변경하지 않고, 텍스트만 다국어 체계로 이전한다.

1.2 참조 프롬프트

로그인 페이지 분석 후, 디자인 스타일 및 Tailwind 클래스를 그대로 유지한 채 모든 하드코딩된 영어 텍스트를 추출한다.
추출된 텍스트로 dictionaries/en.json을 생성한다.
동시에 한국어 번역 파일 dictionaries/ko.json을 생성한다.
텍스트 추출 시 프로젝트명 Prego는 번역하지 않으며, 대소문자를 엄격히 유지한다.

1.3 범위 (1차)

대상 페이지: 로그인 페이지
- 실제 사용 중인 페이지: apps/client-web/app/signin/page.tsx
- 참고: apps/client-web/components/signin-form.tsx (API 연동·로딩 상태 등 추가 문구 포함)
대상 언어: 영어(en), 한국어(ko), 일본어(ja), 아랍어(ar)
참조 페이지: 로그인 페이지 — 디자인 기준
산출물: 사전 파일(en/ko/ja/ar), 언어별 CSS, 로그인 페이지·미들웨어·KV/쿠키 영속, SRE 모니터링

2. 현황 분석

2.1 로그인 페이지 위치 및 구조

구분	경로	비고
App Router 페이지	`apps/client-web/app/signin/page.tsx`	Next.js 메인 로그인 화면
기능 컴포넌트	`apps/client-web/components/signin-form.tsx`	로딩/에러 메시지 등 포함

2.2 추출 대상 텍스트 (로그인 페이지 기준)

app/signin/page.tsx 기준

구분	현재 하드코딩 문구	용도
브랜드/로고	(현재 LEEKIM 등)	상단 로고 영역 — 프로젝트명은 Prego로 통일·고정
제목	Login	h1 제목
라벨	Email, Password	폼 라벨
언어 선택	Language (드롭다운 라벨), English / Korean / Japanese / Arabic (기본값 English)	§4.4 참조
플레이스홀더	johndoe@gmail.com, Use a secure password	input placeholder
링크	Forgot password?	비밀번호 찾기 링크
버튼	Login	제출 버튼
하단 문구	Don’t have an account yet? / Sign Up	회원가입 유도 문구

추가 고려 (signin-form 등)

버튼 로딩: Signing in...
에러 메시지: Sign in failed, An error occurred. Please try again.

2.3 프로젝트명 처리 원칙

Prego 는 상품/프로젝트명으로 간주한다.
번역 파일에서 해당 키의 값은 항상 “Prego” 로 고정한다.
한국어(ko.json)를 비롯한 모든 언어에서 번역하지 않고, 대소문자(P-r-e-g-o)를 유지한다.

2.4 디자인·스타일 유지 사항 (최우선 원칙)

디자인(CSS/HTML 구조)은 1px 오차 없이 보존하는 것이 가장 중요하다.
Tailwind 클래스: 기존 className 값은 수정하지 않는다. (RTL·논리 속성 변환 시에는 동일 시각 결과를 유지하며 물리 속성만 논리 속성으로 치환)
레이아웃·컴포넌트 구조: Card, Button, Input, Label, Link 등 구조와 nesting 유지.
시맨틱: htmlFor, id, type, required 등 접근성·폼 속성 유지.
변경하는 것은 텍스트 노드/placeholder/aria 등 문자열만 사전 키 참조로 교체하는 것이다.

3. 사전 파일 설계

3.1 디렉터리 구조 (제안)

apps/client-web/
  dictionaries/
    en.json
    ko.json
    ja.json
    ar.json
  styles/
    locales/           (또는 적합한 경로)
      en.css
      ko.css
      ja.css
      ar.css

필요 시 dictionaries/index.ts 등으로 로케일별 로딩 유틸 제공 가능 (구현 단계에서 결정).
ja.json: 일본어 번역. ar.json: 아랍어 번역. 프로젝트명 Prego는 모든 언어에서 고유 명사로 유지한다.

3.2 키 구조 (네임스페이스) 제안

로그인 페이지 전용 키는 signin.* 로 통일하면 이후 페이지 확장 시 충돌을 줄일 수 있다.
공통(앱명, 공통 버튼 등)은 common.* 로 두는 것을 권장.

예시 구조 (참고용, 최종 키는 구현 시 확정):

{
  "common": {
    "appName": "Prego"
  },
  "signin": {
    "title": "Login",
    "languageLabel": "Language",
    "languageOptions": { "en": "English", "ko": "Korean", "ja": "Japanese", "ar": "Arabic" },
    "emailLabel": "Email",
    "emailPlaceholder": "johndoe@gmail.com",
    "passwordLabel": "Password",
    "passwordPlaceholder": "Use a secure password",
    "forgotPassword": "Forgot password?",
    "submitButton": "Login",
    "signingIn": "Signing in...",
    "noAccount": "Don't have an account yet?",
    "signUp": "Sign Up",
    "errorSignInFailed": "Sign in failed",
    "errorGeneric": "An error occurred. Please try again."
  }
}

common.appName 은 모든 언어에서 "Prego" 로 동일하게 둔다.

3.3 en.json / ko.json 관계

en.json: 위와 같은 키 구조에 맞춰 현재 로그인 페이지에 들어 있는 영어 문구를 그대로 값으로 넣는다.
ko.json: 동일한 키 구조를 유지하고, 값만 한국어로 번역한다.
- 예: signin.title → "로그인", signin.forgotPassword → "비밀번호를 잊으셨나요?" 등.
ja.json: 동일한 키 구조로 일본어 번역. common.appName 은 “Prego” 유지.
ar.json: 동일한 키 구조를 유지하고, 값만 아랍어로 번역한다. common.appName 은 모든 언어와 동일하게 “Prego” 로 두고, 고유 명사로 번역하지 않는다.
키 이름은 en/ko/ja/ar 네 파일에서 완전히 동일하게 유지한다.

4. 로그인 페이지 리팩토링 및 로케일 로딩

4.1 원칙

로그인 페이지의 모든 노출 텍스트를 방금 생성한 JSON 사전 객체를 참조하도록 리팩토링한다.
디자인(CSS/HTML 구조)은 1px 오차 없이 보존하는 것이 최우선이다. 시각·레이아웃 결과는 기존과 동일해야 한다.

4.2 Next.js App Router 표준

params로 lang 수신: 라우트에서 언어 코드를 받는다 (예: [lang] 동적 세그먼트 또는 쿼리·쿠키 정책에 따라 결정).
서버 컴포넌트 레벨에서 사전 로드: lang에 해당하는 사전 데이터를 서버 컴포넌트에서 로드한 뒤, 필요한 컴포넌트에 props로 전달한다. 클라이언트에서 사전 파일을 fetch하지 않고, 서버에서 한 번만 로드하는 구조를 권장한다.
페이지 컴포넌트는 서버 컴포넌트를 기본으로 하고, 폼 인터랙션 등 필요한 부분만 클라이언트 컴포넌트로 분리한다. 사전 데이터는 서버에서 주입하여 클라이언트 번들에 JSON을 포함시키지 않는다.

4.3 유지 사항

기존 HTML 구조, Tailwind 클래스, 인라인 스타일을 그대로 유지한다. 텍스트만 사전 키 참조로 치환한다.

4.4.1 배치 및 디자인

위치: Login 버튼 위, Email·Password 인풋 필드와 동일한 폼 흐름에 추가한다.
디자인: Email, Password 인풋 필드와 동일한 스타일의 dropdown list selection 뷰를 사용한다 (레이블 + 선택 영역, 1px 디자인 유지).
레이블: “Language” 타이틀을 라벨로 표시한다.

4.4.2 옵션 및 순서

리스트 순서: English → Korean → Japanese → Arabic.
기본값: English.

4.4.3 언어 변경 시 동작

사용자가 다른 언어를 선택하면, 선택한 언어로 UI가 전환되고, 다음에 로그인 페이지에 접속할 때 자동으로 해당 언어가 적용되도록 한다 (미들웨어 + PREGO_LOCALE 쿠키로 구현, §5 미들웨어 참조).
“로그인 전에도 언어를 기억하는 기능은 사용자에게 신뢰성(Reliability)을 주는 디테일이다. 쿠키는 로컬 상태(State), KV는 글로벌 영속성(Persistence)을 나타낸다.” — Global Principal Architect.

5. 언어별 CSS 파일 분리 및 Prego 글로벌 스타일

5.1 언어별 CSS 파일 분리

각 언어별로 별도 CSS 파일을 만들어 분리한다 (예: styles/locales/en.css, ko.css, ja.css, ar.css 또는 프로젝트 구조에 맞는 경로).
분리된 CSS 파일 안에서는 메뉴, 상세페이지 타이틀, 버튼 등에 대해 각각 서로 다른 폰트 패밀리, 크기, 색상, 스타일을 적용할 수 있게 설계한다.
로케일(lang 또는 params.lang)에 따라 해당 로케일 CSS를 로드한다 (예: <link rel="stylesheet" href=".../en.css"> 또는 빌드 시 로케일별 청크 분리).

5.2 Prego 글로벌 스타일 규칙 (폰트·행간)

<html> 태그의 lang 속성 및 로케일별 CSS에 따라 스타일이 적용된다.
전역 타이포그래피는 아래 표를 기준으로 하며, global.css 및 Tailwind 설정에도 동일 규칙을 반영할 수 있다.

로케일	폰트 패밀리	폰트 크기	line-height
영문 (en)	Inter	기준	1.5 (고정)
한국어 (ko)	Noto Sans KR	영문 대비 +1px	1.6
일본어 (ja)	(프로젝트 확정 시 명시)	(기준 또는 ko와 유사)	(확정 시 명시)
아랍어 (ar)	IBM Plex Sans Arabic	영문 대비 10~15% 확대 권장	1.7 이상

아랍어는 같은 폰트 사이즈라도 로마자보다 작게 느껴질 수 있으므로, 가독성을 위해 크기·행간을 위와 같이 설정한다.

5.3 반영 위치

언어별 CSS 파일: 메뉴·타이틀·버튼 등 세부 스타일을 로케일별 파일에서 정의.
global.css 또는 Tailwind 설정: 공통 :lang(en), :lang(ko), :lang(ar) (및 :lang(ja)) 베이스 타이포그래피·행간을 정의하여, html[lang] 만으로 적용되도록 한다.

5.4 아랍어(ar) 시 dir·논리 속성

로케일이 ar일 때 <html> 에 dir="rtl" 을 적용하고, 레이아웃에는 논리적 속성(예: ms- 대신 ml- 사용 지양, ms-/me- 등)을 사용하여 RTL 미러링이 자동으로 이루어지도록 한다.

6. 미들웨어 (PREGO_LOCALE, Fail Sanely, Edge) — Step 1

6.1 역할

Next.js 미들웨어에서 PREGO_LOCALE 쿠키를 관리한다.
로그인 전 언어 선택을 기억하여, 다음 접속 시 해당 언어로 자동 진입하도록 한다 (사용자 신뢰성·Reliability).

6.2 로직 (SRE: Fail Sanely)

PREGO_LOCALE 쿠키 우선: 쿠키가 존재하면 해당 로케일에 해당하는 경로로 리다이렉트한다 (예: /ko/signin, /en/signin, /ja/signin, /ar/signin).
쿠키 없을 때: Accept-Language 헤더를 사용해 best-guess 로컬라이제이션을 수행한 뒤, 해당 로케일 경로로 안내한다.
지원하지 않는 로케일: Fallback to /en 으로 처리하여 Fail Sanely 원칙을 만족한다 (미지원 로케일에서 오동작 방지).

6.3 실행 환경

미들웨어는 Cloudflare Edge에서 동작하도록 Edge Runtime을 사용한다.

7.1 쿠키

로그인 성공 핸들러에서 선택된(또는 사용자 프로필) 언어를 PREGO_LOCALE 쿠키에 설정한다.
쿠키 만료는 장기 유지 (예: 1년)로 설정하여 재방문 시에도 언어가 유지되도록 한다.

7.2 Defense in Depth (SRE)

Cloudflare KV에 사용자별 언어 선호도를 User ID를 키로 저장하여 동기화한다.
사용자가 브라우저 쿠키를 삭제한 경우에도, 로그인 시 KV에서 복원할 수 있도록 하여 **글로벌 영속성(Persistence)**을 확보한다.
“쿠키는 로컬 상태(State), KV는 글로벌 영속성이다. 두 레이어가 조화될 때 Prego는 완성도 높은 엔터프라이즈 플랫폼이 된다.” — Global Principal Architect.

8. RTL 호환을 위한 논리 속성 변환

8.1 목표

아랍어 등 RTL 환경에서 레이아웃이 자동으로 미러링되도록 한다.
물리적 방향 속성을 논리적 속성으로 치환하여, dir="rtl" 시 브라우저가 자동으로 방향을 반전하도록 한다.

8.2 변환 대상 (예시)

물리적 속성 → 논리적 속성
- margin-left / ml-* → margin-inline-start / ms-*
- margin-right / mr-* → margin-inline-end / me-*
- padding-left / pl-* → padding-inline-start / ps-*
- padding-right / pr-* → padding-inline-end / pe-*
- left / right (position) → inset-inline-start / inset-inline-end
- text-left / text-right → text-start / text-end
- border-left / border-right → border-inline-start / border-inline-end
Tailwind에서 논리 속성 유틸리티가 있는 경우 해당 유틸리티로 통일한다.

8.3 작업 범위

프로젝트 Prego 전체의 CSS와 Tailwind 클래스를 분석하여, 위와 같은 물리적 방향 속성을 모두 찾고 RTL 호환이 가능한 논리적 속성으로 변환한다.
변환 시 **시각적 결과(LTR 환경)**는 기존과 동일하게 유지한다. 논리 속성은 LTR에서도 기존과 같은 방향으로 렌더링된다.

9. 아랍어(ar) 지원 및 dir=“rtl”

9.1 아랍어 사전

dictionaries/ar.json 을 생성한다.
로그인 페이지와 동일한 키 구조를 유지하고, 값만 아랍어로 번역한다.
프로젝트명 Prego는 번역하지 않고 고유 명사로 유지한다 (common.appName: "Prego").

9.2 RTL 레이아웃

로그인 페이지(또는 앱 전역)의 언어 상태가 ar일 때 <html> 태그에 dir="rtl" 속성이 자동으로 부여되도록 리팩토링한다.
lang 과 마찬가지로, dir 도 서버 컴포넌트 레벨(예: 루트 레이아웃)에서 params.lang === 'ar' 여부에 따라 설정한다.
예: lang="ar" 이면 dir="rtl" 설정, 그 외에는 dir="ltr" (또는 생략).

10. 진행 방향 아이콘의 RTL 반전

10.1 대상

진행 방향을 나타내는 아이콘만 아랍어 모드에서 수평 반전한다.
- 예: 화살표(arrow), 진행 바(progress bar), 단계 표시 화살표, “다음/이전” 방향 아이콘 등.

10.2 반전 방식

아랍어(또는 dir="rtl")일 때만 해당 아이콘에 scale-x-[-1] (또는 동일 효과의 유틸리티)를 적용하여 수평 반전한다.
적용 범위: RTL일 때만 동작하도록 선택자로 제한 (예: [dir="rtl"] .directional-icon 또는 Tailwind rtl: 변형).

10.3 제외 대상 (반전 금지)

방향과 무관한 아이콘은 반전하면 안 된다.
- 예: 시계 아이콘, 체크 표시(✓), 별, 하트, 설정(톱니), 알림 등.
이들은 RTL에서도 동일한 형태로 유지한다.

10.4 작업 순서

프로젝트 전역에서 진행 방향 아이콘과 비방향 아이콘을 구분하여 목록화한다.
방향성 아이콘에만 RTL 전용 반전 클래스(또는 데이터 속성)를 부여한다.
dir="rtl" 일 때만 반전이 적용되도록 CSS/Tailwind를 작성한다.

11. 아랍어(RTL) 전환 디자인 지침 (Global Principal Architect)

*30년 이상 업력의 Global Principal Architect 관점: 아랍어 지원은 텍스트 번역을 넘어, 사용자 시선 흐름과 인터랙션 모델을 **미러링(Mirroring)*하는 작업이다. AllOK 글로벌 표준·Apple HIG 원칙을 준수한다.

11.1 레이아웃 미러링 (Layout Mirroring)

컴포넌트 배치: 로고가 LTR에서 왼쪽 상단이었다면 RTL에서는 오른쪽 상단으로 이동. ‘뒤로 가기’ 버튼은 왼쪽이 아닌 오른쪽 화살표로 표현.
텍스트 정렬: 아랍어 본문·제목은 **오른쪽 정렬(text-align: right)**이 기본.
여백: padding-left 대신 논리적 속성 padding-inline-start 사용으로, 언어 방향에 따라 여백 방향이 자동 전환되도록 설계.

11.2 아랍어 특화 타이포그래피

폰트: 명확성(Clarity)을 위해 IBM Plex Sans Arabic 또는 적절한 시스템 폰트 권장.
크기·행간: 아랍어는 동일 폰트 사이즈라도 로마자보다 작게 느껴질 수 있으므로, 10~15% 크기 확대, line-height 최소 1.7 이상으로 가독성 확보.

11.3 Security by Design

“RTL 지원은 스타일 변경이 아니라 Security by Design의 확장이다. 텍스트가 컨테이너를 뚫고 나가면 데이터 손실(Data Integrity) 오해를 부를 수 있다. 반응형 컨테이너 설계로 데이터 가시성을 100% 확보하라.” — Global Principal Architect.

12. SRE 관점 운영 및 모니터링 (Observability)

12.1 국가별 접속 vs 선택 언어 불일치 분석 (Logpush & R2)

Cloudflare Logpush 및 R2를 활용해, 사용자 국가별 접속 위치와 실제 선택한 언어의 불일치(Mismatch) 비율을 분석한다.
예: 아랍 에미레이트에서 접속했는데 영어를 고수하는 비율이 높다면, 기본 UI는 영어로 유지하되 아랍어 전환 버튼 강조 등 데이터 기반 의사결정에 활용한다.

12.2 미들웨어 레이턴시 측정

미들웨어가 쿠키 파싱·리다이렉트하는 시간이 **사용자 가시성(Visibility)**에 영향을 주지 않는지 Cloudflare Workers 로그를 통해 실시간 모니터링한다.
레이턴시 임계치 초과 시 알림·대응 절차를 수립한다.

12.3 아랍어 권역 에러 모니터링

Cloudflare Logpush를 통해 아랍어 권역 사용자의 에러 발생률을 분석하여, RTL 미러링으로 인한 UI 충돌 여부를 실시간 모니터링한다.

13. SRE 및 접근성 점검

13.1 가독성 검증 (WCAG 2.2)

아랍어는 모음 기호가 복잡하므로, WCAG 2.2 대비 **가시성(Contrast, Size)**을 재측정한다.

13.2 데이터 무결성

아랍어 숫자가 포함된 데이터가 데이터베이스에 올바르게 저장·조회되는지 확인한다.

13.3 Observability

§12와 연계해, 아랍어 권역 에러율·미러링 관련 이슈를 로그·대시보드로 가시화한다.

14. 작업 단계 (구현 시 참고)

디렉터리 및 en.json 생성
- apps/client-web/dictionaries/ 생성.
- 로그인 페이지를 한 번 더 분석하여 빠짐없이 문구 목록 확정.
- en.json 에 키-값 정의 (프로젝트명은 Prego 고정).
ko.json 생성
- en.json 과 동일 키 구조로 ko.json 생성.
- 각 값에 맞는 한국어 번역 기입, common.appName 은 "Prego" 유지.
ja.json 생성
- 동일 키 구조로 ja.json 생성, 일본어 번역 기입. common.appName 은 "Prego" 유지.
ar.json 생성
- 동일 키 구조로 ar.json 생성, 아랍어 번역 기입. common.appName 은 "Prego" 고유 명사 유지.
언어별 CSS 파일 생성
- en.css, ko.css, ja.css, ar.css 등 로케일별 CSS에서 메뉴·타이틀·버튼용 폰트 패밀리·크기·색상·스타일 정의.
로그인 페이지 연동
- params.lang 을 받아 서버 컴포넌트에서 해당 로케일 사전 로드.
- 하드코딩 문자열을 사전 키 참조로 교체. 디자인(CSS/HTML 구조) 1px 오차 없이 유지.
Language 드롭다운 추가
- Login 버튼 위에 Email/Password와 동일 스타일의 “Language” 드롭다운 추가. 옵션: English, Korean, Japanese, Arabic (기본값 English). 선택 시 PREGO_LOCALE 반영·다음 접속 시 자동 적용.
미들웨어 구현
- PREGO_LOCALE 쿠키 우선 → 해당 경로 리다이렉트; 없으면 Accept-Language; 미지원 로케일은 /en Fallback (Fail Sanely). Edge Runtime.
루트 레이아웃에서 lang·dir 설정
- params.lang 에 따라 <html lang="…"> 설정.
- lang === 'ar' 일 때 <html dir="rtl"> 부여, 그 외에는 dir="ltr" 또는 생략.
언어별 스타일 적용
- 로케일별 CSS 로드 + global/Tailwind: en=Inter 1.5, ko=Noto Sans KR +1px 1.6, ar=IBM Plex Sans Arabic 1.7 등.
RTL 논리 속성 변환
- 프로젝트 전체 CSS·Tailwind에서 물리적 방향 속성을 논리적 속성으로 변환.
진행 방향 아이콘 RTL 반전
- 방향성 아이콘만 아랍어(rtl) 모드에서 scale-x-[-1] 적용. 비방향 아이콘 제외.
로그인 성공 시 KV·쿠키 영속
- PREGO_LOCALE 쿠키 장기 만료 설정; User ID 키로 Cloudflare KV 동기화 (Defense in Depth).
검증

로그인 화면에서 en/ko/ja/ar 전환 시 레이아웃·스타일 동일 여부 및 1px 보존 확인.
“Prego” 가 모든 언어에서 동일 대소문자로 노출되는지, ar에서 dir=“rtl”·레이아웃 미러링·아이콘 반전이 올바른지 확인.
미들웨어·쿠키·KV로 로그인 전/후 언어 기억 동작 확인.

15. 제약 및 유의사항

디자인·Tailwind: 디자인(CSS/HTML 구조)은 1px 오차 없이 보존한다. 논리 속성 변환 시에도 LTR에서의 시각 결과는 동일하게 유지한다.
Prego: 어떤 로케일(en/ko/ar)에서도 번역하지 않고, Prego 고유 명사로만 표기한다.
접근성: 라벨, placeholder, 에러 메시지 등이 번역 후에도 의미가 유지되도록 번역 문구를 선정한다.
확장성: 키 네이밍(signin.*, common.*)을 정해 두어 추후 다른 페이지(signup, forgot-password 등) 추가 시 동일 패턴으로 확장 가능하게 한다.
RTL: dir="rtl" 은 lang === 'ar' 일 때만 <html> 에 부여하며, 논리 속성으로 아랍어 환경에서 자동 미러링되도록 한다.
아이콘 반전: 진행 방향 아이콘만 RTL에서 반전하고, 시계·체크 등 방향 무관 아이콘은 반전하지 않는다.
일본어(ja): 사전·CSS·드롭다운 옵션에 포함하며, 폰트·행간은 프로젝트 확정 시 명시한다.

16. 산출물 요약

산출물	설명
`dictionaries/en.json`, `ko.json`, `ja.json`, `ar.json`	로케일별 사전, Prego 고유 명사 유지
`styles/locales/en.css`, `ko.css`, `ja.css`, `ar.css`	언어별 메뉴·타이틀·버튼 등 폰트·크기·색상·스타일
로그인 페이지	params.lang 사전 로드, Language 드롭다운(English/Korean/Japanese/Arabic, 기본 English), 디자인 1px 유지
Next.js 미들웨어	PREGO_LOCALE 쿠키·Accept-Language·/en Fallback, Edge Runtime
루트 레이아웃	html lang/dir, 로케일별 CSS 로드
global.css / Tailwind	Inter, Noto Sans KR, IBM Plex Sans Arabic 등 행간·폰트; 논리 속성
전역 CSS/Tailwind	물리적 → 논리적 속성 변환 (RTL 미러링)
방향성 아이콘	RTL 시에만 scale-x-[-1], 비방향 제외
로그인 성공 핸들러	PREGO_LOCALE 쿠키(장기 만료) + Cloudflare KV(User ID 키) 동기화
SRE·모니터링	Logpush/R2 국가·언어 불일치 분석, Workers 레이턴시·아랍어 권역 에러 모니터링
접근성·데이터	WCAG 2.2 아랍어 가시성, 아랍어 숫자 DB 무결성

본 기획서는 참조 프롬프트, 로그인 리팩토링, 언어별 CSS 분리, Language 드롭다운, PREGO_LOCALE 미들웨어·KV/쿠키 영속, Prego 글로벌 타이포그래피(Inter·Noto Sans KR·IBM Plex Sans Arabic), RTL·아랍어 디자인 지침, SRE Observability·접근성 요구사항을 반영한 다국어 지원 계획이다. 실제 구현 시 키 이름·경로·라우트 구조(lang params)·일본어 폰트 등은 프로젝트 규칙에 맞춰 조정할 수 있다.