fix(landing): 수학 데모의 LaTeX 안내 문구 폰트를 사이트 폰트로 통일

[jessieyeon]

무엇을

수학 점역 데모 입력 박스 하단의 LaTeX가 자동으로 생성됩니다 줄이 fontFamily="monospace" 라서 브라우저 기본 monospace(13px / weight 400)로 그려졌습니다. 같은 박스 안의 Spoqa Han Sans Neo 500 텍스트와 폰트·크기·자간이 전부 어긋나 보입니다.

typography="body" 로 바꿔 나머지 UI 와 맞췄습니다. (안내 문구와 실제 LaTeX 코드 모두 사이트 폰트를 씁니다.)

함께 정리한 것

좌우 박스의 폭 분배를 MathTransPanel 의 selectors 대신 MathTransInput 이 스스로 flex="1" / minW="0" 을 갖는 방식으로 바꿨습니다.

- selectors={{ '&>*:first-child, &>*:last-child': { flex: 1, minWidth: 0 } }}

• 출력측 TransInput 이 이미 flex="1" 을 스스로 갖고 있어서, 입력측만 호출부에서 분배받는 비대칭이 사라집니다
• 위치 기반(:first-child / :last-child) CSS 규칙 4개가 없어집니다 — 가운데 DemoArrow 를 제외하려고 위치에 의존하던 부분입니다
• padding 없는 바깥 래퍼를 유지해야 하는 이유(Update landing #173 에서 다룬 flex-basis vs padding 문제)는 주석으로 그대로 남겼습니다

검증

bun -F landing build 로 프로덕션 빌드 후 정적 서빙하여 확인했습니다.

	before	after
LaTeX 줄 폰트	monospace 13px / 400	Spoqa Han Sans Neo 16px / 500
좌 / 우 박스 폭 (vw 1280)	505 / 505	505 / 505 (동일, 회귀 없음)

데스크톱(row) · 모바일(column) 양쪽 레이아웃 모두 확인했습니다.

참고 — 배포본 이슈

현재 https://braillify.kr 에서는 수학 탭의 박스 폭이 433 / 577 로 어긋나고 안내 문구가 회색이 아닌 검은색으로 보입니다. 이건 소스 문제가 아니라 배포된 CSS 청크가 잘려 있어서 입니다. 해당 파일에서 .c-c7 이후 클래스(height:500px, >*:first-child{flex:1}, opacity:.5, font-family:monospace 등)가 통째로 빠져 있는데, 그 클래스를 참조하는 JS 는 최신입니다. devup-ui 가 만드는 df/ 산출물이 빌드 캐시에서 stale 하게 재사용된 것으로 보입니다.

빌드 캐시를 비우고 재배포하면 위 두 증상은 해소됩니다. 이 PR 은 그와 별개로 실재하는 폰트 문제를 고치고, 폭 분배가 이 파일에서만 새로 생성되는 CSS 규칙에 의존하지 않도록 함께 정리한 것입니다.

🤖 Generated with Claude Code

[jessieyeon]

잘못 올렸습니다. 논의 후 다시 올리겠습니다.

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.