## 디자인 철학

- **네온 컬러와 다크 배경이 SF 분위기를 만든다.** 사이버펑크 무드
- **글로우 효과가 에너지와 미래적 느낌을 더한다.** 빛나는 요소들
- **기하학적 형태와 날카로운 각도가 첨단 기술 느낌.** 곡선보다 직선
- **높은 대비가 디지털, 테크 지향적 미학.** 선명하고 강렬하게

## UX 원칙

- 어두운 배경에서 네온 컬러가 시선을 이끌도록
- 글로우 효과는 인터랙티브 요소에 집중 사용
- 기술적이면서도 사용하기 어렵지 않게
- 애니메이션은 빠르고 샤프하게

## 컬러

### Brand
- Primary: `#00F5FF` (Cyan/Neon) - CTA, 강조 요소
- Primary Hover: `#00D4E5` (Slightly darker cyan)

### Background
- Primary: `#0A0A0F` (Very Dark)
- Secondary: `#1A1A2E` (Dark Blue)
- Tertiary: `#16162A` (Dark Purple)

### Content (Text)
- Highlight: `#FFFFFF` - 제목, 강조 텍스트
- Primary: `#E0E0E0` - 본문 텍스트
- Subtle: `#A0A0A0` - 보조 텍스트
- Muted: `#606060` - 비활성 텍스트

### Accent Colors
- Neon Pink: `#FF00FF`
- Neon Green: `#00FF88`
- Neon Yellow: `#FFFF00`
- Neon Orange: `#FF6600`

## 사이즈

### Spacing
- 요소 내부: `12px`
- 요소 간격: `16px`
- 섹션 간격: `40px`

### Border Radius
- 버튼/인풋: `4px` (날카롭게)
- 카드: `8px`
- 배지: `2px`

### Glow Effects
```css
/* Cyan Glow */
box-shadow: 0 0 20px #00F5FF, 0 0 40px rgba(0, 245, 255, 0.3);

/* Text Glow */
text-shadow: 0 0 10px #00F5FF, 0 0 20px rgba(0, 245, 255, 0.5);
```

## 적용 가이드

이 가이드는 기본 지침이며, 앱의 특성과 성격에 따라 유연하게 조정하세요:
- **웹 vs 모바일**: 모바일은 터치 타겟 48px 이상, 대중적인 디바이스의 기준을 따른다.
- **정보 밀도**: 대시보드는 적당히 촘촘하게, 랜딩/마케팅은 여유롭게
- **브랜드 톤**: 친근함은 컬러를 조금 더 사용하고, 신뢰감은 화이트 위주 + 포인트 컬러는 적게
→ 컬러와 디자인 철학은 유지하되, 사이즈/간격/컬러 사용량은 상황에 맞게 조정