/* chrome.css — 모든 페이지의 «틀» 중 좁은 화면 보정 (2026-11-01, UI-DESIGN-SYSTEM §5).

   base.css 는 30KB 예산이 차 있어 새 규칙을 받지 않는다(절대 지시 11). 그래서 틀의 보정은 여기 산다.
   색은 tokens.css 변수만, 중단점은 640 / 900 / 1200 셋뿐(`tests/test_breakpoints_doc.py`).

   ■ 상단 내비 — 폰에서 **세 줄**이던 것을 두 줄로.
     실기기(갤럭시 S22 Ultra 412px · LG V50S 415px)에서 «로고 / 언어·테마 / 메뉴» 가 세 줄로 쌓여 본문이 화면 아래 3분의 1에서야
     시작했다. 원인은 로고(약 165px) + 언어·테마(약 150px) + 여백(gap 20×2 · padding 22×2)이 390px 를 4px 넘겨 우측 묶음이
     둘째 줄로 떨어진 것이다. 좁은 폭에서 간격과 글자를 줄여 **한 줄에 넣는다**: 로고·컨트롤이 첫 줄, 메뉴가 둘째 줄. */
@media (max-width: 640px) {
  .nav { gap: 8px; padding: 4px 14px; }
  .nav .brand { font-size: 15px; }
  .nav .nav-right { gap: 4px; margin-left: auto; }
  .nav .nav-links { margin-left: 0; }
  .nav .theme-seg { gap: 0; }
}