Dark Tech / Terminal

# Dark Tech / Terminal — web 디자인 팩

## 이 스타일의 정체성
터미널 에뮬레이터를 웹사이트로 옮긴 것. 거의 검정에 가까운 배경(`#0a0a0a`), 전면 모노스페이스 텍스트, 형광 강조색 단 한 가지. 헤어라인 보더로 짠 격자, 깜빡이는 블록 커서, `$` 프롬프트와 ASCII 장식. 둥근 것도 그림자도 없이, 빛나는 1px 선과 등폭 정렬만으로 성립하는 개발자 도구 미감. "콘솔에 접속한" 인상이 정답.

## 색
- 배경: `#0a0a0a` (거의 순흑)
- 표면(패널·코드 블록): `#141414`
- 텍스트: `#e6e6e6` (본문), `#8a8a8a` (보조·주석)
- 강조: `#00e599` (형광 민트그린) — 단 1개. 프롬프트 기호·링크·커서·활성 상태·키워드 하이라이트에만. 면적 8% 이하.
- 보더: `#262626` (헤어라인 1px)
- 그라디언트 금지. 네온은 강조색 1개에 한정.

## 타이포그래피
- 전체 폰트: `"JetBrains Mono", "IBM Plex Mono", ui-monospace, monospace` (JetBrains Mono는 Google Fonts 공개 웹폰트). 제목·본문·라벨 모두 모노스페이스.
- H1: `clamp(2rem, 4.5vw, 3.5rem)`, weight 700, letter-spacing `-0.01em`, line-height 1.15
- H2: `1.375rem`, weight 600, 앞에 `## ` 또는 `$ ` 프롬프트 글리프(강조색)
- 본문: `0.9375rem` (15px), weight 400, line-height 1.6
- 라벨/주석: `0.8125rem`, weight 400, `#8a8a8a`, 앞에 `// ` 또는 `> `
- 숫자·코드는 강조색으로 토큰 하이라이트.

## 레이아웃 / 그리드
- 콘텐츠 최대 폭 `1024px`, 좌우 패딩 `20px`
- strict-grid — 모노스페이스 등폭을 활용해 모든 것을 문자 셀 격자에 정렬. 헤어라인 1px 보더로 영역을 칸으로 나눈다.
- 브레이크포인트: `<768px` 1열, `>768px` 다중 칼럼/패널
- 섹션 간격 `56px` (dense — 정보 밀도 높게), 패널 패딩 `20px`
- 좌측에 줄 번호 거터 또는 `$` 프롬프트 거터를 두면 정체성이 강해진다.

## 형태 / 질감
- radius `0px` — 모든 요소 직각.
- 보더: `1px solid #262626` 헤어라인. 패널·표·코드 블록을 이 선으로 구획.
- 그림자 전무. 깊이는 배경 명도 차(`#0a0a0a` vs `#141414`)로만.
- 커서: 강조색 블록(`▮` 또는 0.6em 폭 사각형)이 `1s step-end infinite`로 깜빡임.
- ASCII 장식: `+--+`, `|`, `>`, `[ ]` 같은 문자로 박스·구분선·불릿을 만든다 — 그래픽 아이콘 대신.
- 이미지: 직각, 1px 헤어라인 보더, 채도 낮추거나 강조색 듀오톤 처리.

## 모션
- subtle. 트랜지션 `150ms ease`.
- 커서 깜빡임이 유일한 상시 모션(`1s step-end infinite`).
- 호버: 링크·요소에 강조색 underline 또는 배경 `#141414`. 부드러운 이동 없음.
- 텍스트 등장 시 타이핑 효과(선택적, 1줄 정도만).
- 패럴럭스·바운스 금지.

## 하지 말 것
- 보라/인디고 그라디언트 금지 — 배경은 거의 순흑 단색.
- 둥근 모서리 금지(radius 0 고정). soft shadow·드롭섀도 금지 — 깊이는 명도 차로만.
- 산세리프·세리프 본문 금지 — 전면 모노스페이스.
- 형광 강조색을 2개 이상 쓰지 말 것. 무지개 네온 금지.
- 이모지 금지 — 장식은 ASCII 문자로.
- 둥근 카드 그리드 금지. glow를 모든 요소에 남발 금지(강조 텍스트 정도만).
- 본문 텍스트를 `#8a8a8a` 미만으로 어둡게 해 대비를 깨지 말 것.

## 적용 예
- **헤더/네비**: 상단 고정, `#0a0a0a` 배경, 하단 1px 헤어라인. 로고는 `[ name ]` 형태 텍스트, 메뉴는 `> menu` 모노스페이스 링크.
- **히어로**: 좌측 정렬, 앞에 `$ ` 강조색 프롬프트가 붙은 H1, 그 끝에 깜빡이는 블록 커서. 본문은 `// ` 주석 스타일. CTA는 `[ run ]` 형태 1px 보더 버튼.
- **카드/패널**: `#141414` 표면, 1px `#262626` 헤어라인 보더, radius 0. 상단에 `+-- title --+` ASCII 헤더. 호버 시 배경 약간 밝아짐.
- **푸터**: 색 반전 없음(이미 다크). 상단 1px 헤어라인, ASCII 구분선, `#8a8a8a` 모노 메타 텍스트.