첫 화면 개선(폰 카드 잘림 · 책 한 줄 띠 · 책 코너 접기) + 첫걸음 워크북 v29 장부

docs/decisions.md

@@ -437,3 +437,4 @@
 - 2026-11-13 첫걸음 워크북 안티 1차 검수 반영(7곳): 하나 씨는요 · 수진 씨는요, 오빠는 어디에 있어요, 먼 나무 힌트, 으막 든는 거슬, 표 열 이름, 책상 ___에. 안 받은 것: 「다시 한번」(붙여 써도 허용) · 빈칸 앞뒤 띄어쓰기(검수 글을 뽑을 때 생긴 모양이고 책에서는 정상). 안티 지적 중 「이상 없음」이 많아 이 책은 내용보다 디자인 작업이 주.
 - 2026-11-13 첫걸음 워크북 새 속지(표지 초록 말풍선 스타일, 시안 v4 194쪽): 8주 계획표 · 간판/메뉴판 읽기 연습 추가 · 대화 1을 2부로 이동 · 쪽을 이어 채워 공백 줄임. 운영자 시안 확인 중(최종 확정 전).
 - 2026-11-14 인스타 · 스레드 자동 올리기 멈춤 원인: GitHub 기본 서버(ubuntu-latest)가 26.04 로 바뀌어 Playwright 1.55 가 브라우저를 못 깔음 → `insta-post.yml` 서버를 ubuntu-24.04 로 고정.
+- 2026-11-14 첫 화면 개선 3가지(운영자 「4 → 1 → 2 순서로」): ① 폰에서 단계 카드 「Intermediate」 잘림 고침 ② 첫 화면 바로 아래 책 한 줄 띠(표지 3권 · 정답 · 무료 샘플 · 책 보기) ③ 책 코너는 첫 시리즈만 펴고 나머지 시리즈는 접음(PC 높이 7,024→6,435px). 남은 개선 후보: About 표 접기 · 죽은 클릭 9% 원인 확인 · 진행 막대 뜻.

docs/i18n/strings.json

@@ -1,11 +1,11 @@
 [{"en":"Next","ko":"다음","n":21},
 {"en":"Loading…","ko":"불러오는 중…","n":16},
+{"en":"Listen","ko":"듣기","n":14},
 {"en":"Privacy policy","ko":"개인정보 처리방침","n":14},
 {"en":"Close","ko":"닫기","n":13},
 {"en":"Correct!","ko":"정답이에요!","n":13},
 {"en":"Delete","ko":"블록 지우기","n":13},
 {"en":"Korean age calculator","ko":"","n":13},
-{"en":"Listen","ko":"듣기","n":13},
 {"en":"Refunds","ko":"환불 규정","n":13},
 {"en":"Terms","ko":"이용약관","n":13},
 {"en":"Words","ko":"단어","n":13},
@@ -372,7 +372,6 @@
 {"en":"Sign up","ko":"가입하기","n":2},
 {"en":"Sign up free","ko":"무료 가입","n":2},
 {"en":"Sort by","ko":"정렬 기준","n":2},
-{"en":"Standard","ko":"보통 말","n":2},
 {"en":"Star","ko":"별표","n":2},
 {"en":"Starred","ko":"별표","n":2},
 {"en":"Start here","ko":"추천","n":2},
@@ -421,6 +420,7 @@
 {"en":"Word (e.g. bicycle)","ko":"표제어 (예: 자전거)","n":2},
 {"en":"Word of the day","ko":"","n":2},
 {"en":"Words per day","ko":"하루 목표 단어 수","n":2},
+{"en":"Workbooks you write in","ko":"","n":2},
 {"en":"Write","ko":"쓰기","n":2},
 {"en":"You've used today's AI questions: try again tomorrow.","ko":"오늘 AI 질문 횟수를 다 썼어요. 내일 다시 써 주세요.","n":2},
 {"en":"Your answer","ko":"바꾼 꼴","n":2},
@@ -651,7 +651,6 @@
 {"en":"About {0} words a day lately — at this pace the remaining {1} take {2} more days.","ko":"요즘 하루 {0}개씩 외우고 있어요. 이 속도면 남은 {1}개를 {2}일 뒤에 다 외워요.","n":1},
 {"en":"Account & more","ko":"","n":1},
 {"en":"Accuracy","ko":"정확도","n":1},
-{"en":"Accurate","ko":"정확한 말","n":1},
 {"en":"Accurate (Formal)","ko":"정확한 버전 (격식)","n":1},
 {"en":"Active","ko":"구독 중","n":1},
 {"en":"Add","ko":"올리기","n":1},
@@ -731,6 +730,7 @@
 {"en":"Answered today","ko":"오늘 푼 수","n":1},
 {"en":"Answers","ko":"정답","n":1},
 {"en":"Answers from our own material","ko":"치즈감자 자료로 찾고 답해요","n":1},
+{"en":"Answers in every book. Free sample PDFs, no email needed.","ko":"","n":1},
 {"en":"Any N sessions in Words","ko":"「단어」에서 아무 세션이나 N번","n":1},
 {"en":"Any word starting with “{0}” counts (e.g. {1}).","ko":"「{0}」로 시작하는 말이면 돼요(예: {1}).","n":1},
 {"en":"Anyone can learn Korean<br><em>in the right order.</em>","ko":"","n":1},
@@ -1188,10 +1188,9 @@
 {"en":"Follow the order","ko":"순서대로 따라가기","n":1},
 {"en":"Follow your device or pick one","ko":"기기 설정을 따르거나 직접 고르세요","n":1},
 {"en":"For teachers","ko":"","n":1},
-{"en":"For TOPIK I (levels 1–2)","ko":"","n":1},
-{"en":"For TOPIK II (levels 3–6)","ko":"","n":1},
 {"en":"For you","ko":"추천","n":1},
 {"en":"For your goal","ko":"내 목표에 맞춰","n":1},
+{"en":"Formal","ko":"정확","n":1},
 {"en":"Formal · written","ko":"격식 · 글","n":1},
 {"en":"Formal register","ko":"격식 표현","n":1},
 {"en":"Formal register: statements, questions, and public commands","ko":"격식체(-ㅂ/습니다, -ㅂ/습니까, -(으)십시오): 뉴스·발표·안내 방송 정복","n":1},
@@ -1416,15 +1415,14 @@
 {"en":"Keep practising TOPIK →","ko":"TOPIK 연습 이어 하기 →","n":1},
 {"en":"Keep sentences and grammar in folders of your own. Only you see it: it stays in this browser.","ko":"떠오른 문장·문법을 갈래로 나눠 적어 둡니다. 나만 보이고, 로그인 없이 이 브라우저에 남아요.","n":1},
 {"en":"Keep what you just did?","ko":"오늘 한 것을 남겨 둘까요?","n":1},
-{"en":"Key Vocabulary","ko":"필수 단어장","n":1},
+{"en":"Key vocabulary","ko":"꼭 알아 둘 낱말","n":1},
 {"en":"Keys: 1–4 choose · ← → move · R replay","ko":"키보드: 1~4 고르기 · ← → 옮기기 · R 다시 듣기","n":1},
 {"en":"KNOW","ko":"알아요","n":1},
 {"en":"Know it","ko":"알아요","n":1},
 {"en":"Know your level? Pick it","ko":"레벨을 알면 바로 골라도 돼요","n":1},
 {"en":"Konglish","ko":"콩글리시","n":1},
 {"en":"Korean → meaning","ko":"한국어 → 뜻","n":1},
 {"en":"Korean age","ko":"","n":1},
-{"en":"Korean basics","ko":"","n":1},
 {"en":"Korean birthday card","ko":"","n":1},
 {"en":"Korean dictionary","ko":"","n":1},
 {"en":"Korean fortune cookie","ko":"","n":1},
@@ -1436,6 +1434,7 @@
 {"en":"Korean winters are really cold.","ko":"한국의 겨울은 정말 추워요.","n":1},
 {"en":"Korean word of the day","ko":"","n":1},
 {"en":"Korean Wordle: one word a day, 6 tries, share your 🥔🧀 grid. No sign-in needed.","ko":"","n":1},
+{"en":"Korean Workbook Series","ko":"","n":1},
 {"en":"L{0} · {1}","ko":"L{0} · {1}","n":1},
 {"en":"Language for menus and explanations","ko":"설명 · 메뉴에 쓰는 말","n":1},
 {"en":"Language use","ko":"언어 사용","n":1},
@@ -1463,7 +1462,6 @@
 {"en":"Learn its session","ko":"이 낱말이 든 세션 외우기","n":1},
 {"en":"Learn Korean — potato","ko":"한국어 배우기 — 감자","n":1},
 {"en":"Learn Korean from the very start","ko":"한국어를 처음부터 차근차근","n":1},
-{"en":"Learn Phrases","ko":"상황별 구문 학습하기","n":1},
 {"en":"Learn survival phrases across Easy, Standard, and Accurate levels with essential vocab.","ko":"쉬운 말, 보통 말, 정확한 말 3단계로 바로 써먹는 실전 여행 한국어와 필수 단어를 익힙니다.","n":1},
 {"en":"Learn the words","ko":"단어 익히기","n":1},
 {"en":"Learn today’s words →","ko":"오늘의 낱말 외우러 가기 →","n":1},
@@ -1608,6 +1606,7 @@
 {"en":"More matches","ko":"이런 말도 있어요","n":1},
 {"en":"More practice questions","ko":"연습 문제가 더 많았으면","n":1},
 {"en":"More senses","ko":"여러 뜻","n":1},
+{"en":"More series · 7 more books","ko":"","n":1},
 {"en":"More TOPIK practice →","ko":"TOPIK 연습 더 하기 →","n":1},
 {"en":"More ways to learn","ko":"","n":1},
 {"en":"Most liked","ko":"좋아요순","n":1},
@@ -2220,6 +2219,7 @@
 {"en":"See results ({0} left)","ko":"결과 보기 ({0}문제 남았어요)","n":1},
 {"en":"See the {0} you got right","ko":"맞힌 {0}문제 보기","n":1},
 {"en":"See the book","ko":"책 자세히 보기","n":1},
+{"en":"See the books →","ko":"","n":1},
 {"en":"See the Exam Pass →","ko":"시험 패스 보기 →","n":1},
 {"en":"See the full list","ko":"전체 목록 보기","n":1},
 {"en":"See the full report: you can come back to it any time","ko":"","n":1},
@@ -2375,6 +2375,7 @@
 {"en":"Starting {0}{1}{2} below your guess.","ko":"예상보다 {0}{1} 아래에서 시작해요.","n":1},
 {"en":"Stats","ko":"기록","n":1},
 {"en":"Status","ko":"상태","n":1},
+{"en":"Std","ko":"보통","n":1},
 {"en":"Steady","ko":"차근차근","n":1},
 {"en":"step","ko":"단계","n":1},
 {"en":"Step {0} of {1}","ko":"{0}번째 걸음 / {1}","n":1},
@@ -2598,11 +2599,14 @@
 {"en":"TOPIK prep — cheese (level passed)","ko":"TOPIK 준비 — 치즈(넘은 급수)","n":1},
 {"en":"TOPIK prep: tap anything to start","ko":"TOPIK 준비, 하고 싶은 것을 바로 눌러요","n":1},
 {"en":"TOPIK prep. TOPIK comes first on the home screen","ko":"TOPIK 준비, 첫 화면 · 메뉴가 TOPIK 먼저","n":1},
+{"en":"TOPIK Reading Series","ko":"","n":1},
 {"en":"TOPIK reading type practice","ko":"TOPIK 읽기 유형 연습","n":1},
 {"en":"TOPIK study:","ko":"","n":1},
 {"en":"TOPIK takers with an exam date · ends by itself after 3 months","ko":"시험 날짜가 정해진 TOPIK 준비생 · 3개월 뒤 저절로 끝나요","n":1},
+{"en":"TOPIK Vocabulary Series","ko":"","n":1},
 {"en":"TOPIK writing · AI score","ko":"TOPIK 쓰기 · AI 점수","n":1},
 {"en":"TOPIK writing practice","ko":"TOPIK 쓰기 연습","n":1},
+{"en":"TOPIK Writing Series","ko":"","n":1},
 {"en":"TOPIK-style practice","ko":"TOPIK 유형 연습","n":1},
 {"en":"Total words","ko":"전체 단어","n":1},
 {"en":"Tracing worksheet","ko":"","n":1},
@@ -2813,7 +2817,6 @@
 {"en":"Work on nuance-heavy advanced expressions and make your sentences more precise.","ko":"뉘앙스가 갈리는 고급 표현으로 문장을 세밀하게 다듬습니다.","n":1},
 {"en":"Work the word “{0}” in.","ko":"낱말 「{0}」를 넣어 보세요.","n":1},
 {"en":"Workbooks · free to print","ko":"","n":1},
-{"en":"Workbooks you write in","ko":"","n":1},
 {"en":"Worksheet PDF","ko":"학습지 PDF","n":1},
 {"en":"Worksheets","ko":"","n":1},
 {"en":"Worth another look","ko":"다시 볼 레슨","n":1},

index.html

@@ -914,6 +914,18 @@
 }
 @media (max-width:899px) { .hs-stack { grid-template-columns:1fr 1fr; gap:10px; } .hs-card { grid-template-columns:40px minmax(0,1fr); gap:10px; padding:12px; }
   .hs-ic { width:40px; height:40px; } .hs-ic .lvl-ic { width:32px; height:32px; } .hs-t b { font-size:16px; margin-bottom:4px; } .hs-t small { font-size:11px; white-space:normal; line-height:1.25; } }
+/* 폭 360~420px 폰에서 「Intermediate」가 카드 밖으로 나가던 것(2026-11-14) — 그림 · 간격 · 글자를 한 칸씩 줄이고 긴 낱말은 줄을 바꾼다 */
+.hs-t b { overflow-wrap:anywhere; }
+/* 첫 화면 아래 책 한 줄 띠 — 종이 바탕 · 얇은 줄 · 작은 모서리 */
+.hm-bstrip { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:16px; align-items:center; width:calc(100% - 2 * var(--gut)); max-width:calc(var(--max) - 2 * var(--gut)); margin:18px auto 0; padding:12px 16px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--ink); text-decoration:none; }
+.hm-more { margin:10px 0 0; } .hm-more>summary { cursor:pointer; list-style:none; padding:10px 0; font-size:14px; font-weight:800; color:var(--ink); border-top:1px solid var(--line); border-bottom:1px solid var(--line); } .hm-more>summary::-webkit-details-marker { display:none; } .hm-more>summary:after { content:' +'; color:var(--orange-deep); } .hm-more[open]>summary:after { content:' −'; }
+.hm-bstrip:hover { border-color:var(--ink); }
+.hm-bstrip-c { display:flex; } .hm-bstrip-c img { width:38px; height:54px; object-fit:cover; border-radius:3px; border:1px solid var(--line); margin-left:-10px; background:var(--surface); } .hm-bstrip-c img:first-child { margin-left:0; }
+.hm-bstrip-t { display:block; min-width:0; } .hm-bstrip-t b { display:block; font-size:15px; font-weight:800; } .hm-bstrip-t span { display:block; margin-top:2px; font-size:13px; color:var(--ink-3); line-height:1.4; }
+.hm-bstrip-go { font-size:14px; font-weight:800; white-space:nowrap; color:var(--orange-deep); }
+@media (max-width:560px) { .hm-bstrip { grid-template-columns:auto minmax(0,1fr); gap:12px; padding:12px; } .hm-bstrip-go { grid-column:2; } }
+
+@media (max-width:420px) { .hs-card { grid-template-columns:32px minmax(0,1fr); gap:8px; padding:12px 10px; } .hs-ic { width:32px; height:32px; } .hs-ic .lvl-ic { width:26px; height:26px; } .hs-t b { font-size:14px; } }
 .hm-paths .hm-door { background:var(--surface) !important; border:1px solid var(--line); box-shadow:0 1px 0 rgba(var(--ink-rgb),.08); position:relative; }
 .hm-paths .hm-door::after { content:'›'; position:absolute; right:18px; top:50%; transform:translateY(-50%); width:32px; height:32px; border-radius:50%; border:1px solid var(--line); display:grid; place-items:center; font-size:20px; color:var(--ink-2); }
 .hm-paths .hm-door-ic { background:var(--tint); border-radius:18px; padding:6px; box-sizing:border-box; }
@@ -2359,6 +2371,13 @@ <h1 data-ko="맞는 순서로 배우면<br><em>누구나 한국어를 해요.</e
    </div>
   </div>
 
+  <!-- 책 한 줄 띠(운영자 2026-11-14 「책으로 가는 길 짧게」 — 첫 화면 바로 아래에서 책 코너로. 표지는 책 코너와 같은 cover-sm) -->
+  <a class="hm-bstrip" href="#hmBooks" data-ev="책클릭" data-ev-from="첫화면-띠">
+    <span class="hm-bstrip-c" aria-hidden="true"><img src="assets/books/first-steps-workbook/cover-sm.jpg" alt="" width="300" height="426" loading="lazy" decoding="async"><img src="assets/books/particles-workbook/cover-sm.jpg" alt="" width="300" height="426" loading="lazy" decoding="async"><img src="assets/books/korean-idioms/cover-sm.jpg" alt="" width="300" height="426" loading="lazy" decoding="async"></span>
+    <span class="hm-bstrip-t"><b data-en="Workbooks you write in">써 가며 배우는 한국어 워크북</b><span data-en="Answers in every book. Free sample PDFs, no email needed.">책마다 정답이 들어 있어요. 무료 샘플 PDF는 이메일 없이 받아요.</span></span>
+    <span class="hm-bstrip-go" data-en="See the books →">책 보기 →</span>
+  </a>
+
   <!-- 두 문 — 시안 C 의 「목표별 입구」 가운데 둘(운영자: EPS 는 빼도 된다 — 아래 여섯 갈래에는 그대로 있다). data-go 는 여섯 갈래와 같은 길 -->
   <!-- 길 넷(운영자 결정 2026-10-06: 「첫 화면을 길 4개로, 다른 메뉴는 더 보기로 접기 — 내 얘기는 학습 흐름」).
        누르면 그 길(#learn/path/<길>) — 한 걸음 = 문법 → 코스 레슨 → 단어. 처음 온 사람 · 학생 모두에게 보인다. -->
@@ -2443,6 +2462,7 @@ <h2 class="section-title" id="hmBooksH" data-en="Workbooks you write in">써 가
         <a class="hm-bk hm-bk-s" href="shop/korean-idioms/" data-bk="korean-idioms" data-en-t="Essential Korean Idioms" data-ko-t="필수 관용 표현" data-sub-en="449 idioms, proverbs and four-character idioms with examples, checkups and writing practice." data-sub-ko="관용구 · 속담 · 사자성어 449개" data-px="9.90" data-pg="274쪽" data-pg-en="274 pages" data-src="assets/books/korean-idioms/cover-sm.jpg" data-tip="필수 관용 표현" aria-label="Essential Korean Idioms — 필수 관용 표현" data-ev="책클릭" data-ev-from="첫화면-서가">
           <img src="assets/books/korean-idioms/cover-sm.jpg" alt="" width="300" height="426" loading="lazy" decoding="async"></a>
       </div></div>
+    <details class="hm-more"><summary><span data-en="More series · 7 more books">다른 시리즈 7권 더 보기</span></summary>
     <div class="hm-shelf"><h3 class="hm-shelf-h"><span data-en="TOPIK Vocabulary Series">TOPIK 단어장 시리즈</span><small data-en="4">4권</small></h3>
       <div class="hm-bk-row hm-shelf-row" aria-label="TOPIK 단어장 시리즈">
         <a class="hm-bk hm-bk-s" href="shop/topik1-vocab/" data-bk="topik1-vocab" data-en-t="Beginner Essential Vocabulary (for TOPIK I)" data-ko-t="초급 필수 단어장 (TOPIK I 대비)" data-sub-en="All 1,931 TOPIK I words in 97 units, with example sentences, checkups and writing practice." data-sub-ko="TOPIK I 필수 단어 1,931개 · 예문과 쓰기 연습" data-px="9.90" data-pg="528쪽" data-pg-en="528 pages" data-src="assets/books/topik1-vocab/cover-sm.jpg" data-tip="초급 필수 단어장 (TOPIK I 대비)" aria-label="Beginner Essential Vocabulary (for TOPIK I) — 초급 필수 단어장 (TOPIK I 대비)" data-ev="책클릭" data-ev-from="첫화면-서가">
@@ -2466,6 +2486,7 @@ <h2 class="section-title" id="hmBooksH" data-en="Workbooks you write in">써 가
         <a class="hm-bk hm-bk-s" href="shop/topik2-writing-53-54/" data-bk="topik2-writing-53-54" data-en-t="Writing Practice 53–54 (for TOPIK II)" data-ko-t="쓰기 영역 연습문항 53~54 100제 (TOPIK II 대비)" data-sub-en="Describe data in 300 characters, argue in 700, with scored samples." data-sub-ko="자료 설명 · 논술 쓰기와 채점 기준" data-px="9.90" data-pg="234쪽" data-pg-en="234 pages" data-src="assets/books/topik2-writing-53-54/cover-sm.jpg" data-tip="쓰기 영역 연습문항 53~54 100제 (TOPIK II 대비)" aria-label="Writing Practice 53–54 (for TOPIK II) — 쓰기 영역 연습문항 53~54 100제 (TOPIK II 대비)" data-ev="책클릭" data-ev-from="첫화면-서가">
           <img src="assets/books/topik2-writing-53-54/cover-sm.jpg" alt="" width="300" height="426" loading="lazy" decoding="async"></a>
       </div></div>
+    </details>
     <div class="hm-pan" id="hmPan" aria-live="polite"><a class="hm-pan-c" href="shop/first-steps-workbook/" tabindex="-1" aria-hidden="true"><img src="assets/books/first-steps-workbook/cover-sm.jpg" alt="" width="300" height="426"></a>
       <div class="hm-pan-b"><span class="hm-pan-g">159쪽</span><h3 class="hm-pan-t">Korean First Steps Workbook</h3><p class="hm-pan-ko">한국어 첫걸음 워크북</p><p class="hm-pan-sub">한글 · 인사 · 생활 낱말: 쓰고, 맞춰 보고, 다시</p>
       <p class="hm-pan-r"><span class="hm-bk-px">$9.90</span><a class="hm-pan-go" href="shop/first-steps-workbook/" data-ev="책클릭" data-ev-from="첫화면-서가상세" data-en="PDF · Buy →">PDF · 사기 →</a></p></div></div>