Weight punctuation breaks and add rendered code preview

[fliklab]

변경 사항

• 기본 우선 줄바꿈 기호에 !와 ? 추가
• 문장부호 경계를 강제 분할이 아닌 가중치 높은 후보로 변경
• 최소 줄 수를 유지하면서 균형이 크게 깨지면 다른 공백 선택
• priorityBreakBonus 옵션 추가 (기본값 0.55, 0이면 비활성화)
• 현재 결과의 HTML/CSS를 보여주는 코드 패널 추가
• 충분한 폭에서는 오른쪽 패널에서 HTML과 CSS를 동시에 표시
• 좁은 폭에서는 렌더 결과가 보이는 반투명 오버레이와 탭으로 표시
• 공통 컨테이너 정렬과 모바일 여백 규칙 적용
• 스크롤 진입 모션 및 prefers-reduced-motion 즉시 표시 적용
• 패키지 버전을 0.1.1로 준비

사용자 영향

폭을 넘어 줄바꿈이 필요할 때 !, ?, 쉼표, 마침표 뒤 공백을 우선합니다. 다만 해당 지점이 줄 수를 늘리거나 균형을 크게 해치면 더 자연스러운 다른 공백을 선택합니다. 코드 보기에서는 현재 제목, 글자 크기, 영역 폭, 균형 상태에 따른 실제 HTML/CSS 구조를 확인할 수 있습니다.

검증

• npm run test:package
• npm run lint
• npm test
• 데스크톱 1440px, 태블릿 768px, 모바일 375px 반응형 확인
• prefers-reduced-motion 확인