# 🛡️ Global Requirement: Trial Guard System (Mandatory)
모든 프로젝트 구현 시, 다음의 ‘시간 제한 및 보안 잠금(Trial Guard)’ 모듈을 기본 아키텍처에 반드시 포함시켜라. 이는 앱의 비즈니스 로직과 무관하게 항상 적용되어야 하는 최상위 보안 레이어다.
## 1. Functional Specification
* Time Limit: 앱 실행(최초 접속) 후 5분이 지나면 애플리케이션 사용을 전면 차단한다.
* Lock Mechanism:
\* 시간 만료 시, 화면 전체를 덮는 \*\*Blur Overlay(블러 처리된 오버레이)\*\*를 띄운다.
\* 사용자의 클릭, 스크롤, 입력을 모두 막는다 (Scroll Lock).
* Unlock Mechanism:
\* 오버레이 중앙에 '관리자 비밀번호' 입력 폼을 제공한다.
\* 올바른 비밀번호 입력 시, 잠금을 영구적(혹은 세션 동안)으로 해제한다.
## 2. Technical Implementation Guidelines
* State Persistence (Anti-Cheat):
\* 새로고침을 해도 타이머가 리셋되지 않도록 \`localStorage\`에 \`trial\_start\_timestamp\`를 저장하고 비교해라.
\* 단순 \`setTimeout\`에 의존하지 말고, \`Date.now()\`와 저장된 타임스탬프의 차이를 계산하여 잔여 시간을 렌더링해라.
* Security (Server-Side Verification):
\* \*\*절대\*\* 비밀번호를 클라이언트(브라우저) 코드에 하드코딩하거나 노출하지 마라.
\* Next.js 사용 시: \`Server Actions\` 또는 API Route를 통해 서버단에서 비밀번호를 검증해라.
\* React/Vite 사용 시: 환경 변수가 빌드 타임에 노출되지 않도록 유의하고, 가능한 한 보안 로직을 분리해라.
* Environment Variables:
\* 비밀번호와 제한 시간은 코드가 아닌 \`.env\` 파일에서 관리하도록 설정해라.
\* Key 예시: \`NEXT\_PUBLIC\_TRIAL\_LIMIT\_MIN=5\`, \`ADMIN\_UNLOCK\_PASSWORD=...\`
## 3. UI/UX Standard
* Component Structure: `TrialGuardProvider`와 같은 Context API 기반의 래퍼(Wrapper) 컴포넌트를 만들고, 최상위 `layout` 또는 `App` 컴포넌트를 감싸도록 설계해라.
* Design:
\* 세련된 \`Glassmorphism\` (배경 블러) 스타일 적용.
\* 비밀번호 입력 실패 시 "비밀번호 오류" Toast 메시지 및 Input 필드 흔들림 애니메이션 적용.
## 4. Developer Experience
* 구현 완료 후, 로컬 환경에서 테스트할 수 있도록 `localStorage`를 강제로 클리어하거나 시간을 조작하는 디버그 버튼(Dev Only)을 잠시 보여주거나, 테스트 방법을 README에 명시해라.
No responses yet