fix(mobile): enlarge study words and reveal phonetics on first tap

projects/xiaoshu-mobile/src/app/features/learning/learning-page.component.html

@@ -239,13 +239,15 @@
     </div>
     <div class="repeat-list">
       @for (word of words(); track word.id; let index = $index) {
+        @let repeatCount = repetitions()[word.id] || 0;
         <button type="button" (click)="repeatWord(word, index)">
           <span>
-            <strong>{{ studyStep() === 3 ? word.meaning : word.word }}</strong>
-            @if ((repetitions()[word.id] || 0) >= 2) { <small>{{ studyStep() === 3 ? word.word : word.meaning }}</small> }
+            <strong [class.study-headword]="studyStep() !== 3">{{ studyStep() === 3 ? word.meaning : word.word }}</strong>
+            @if (studyStep() !== 3 && repeatCount >= 1 && word.phonetic) { <small class="study-phonetic">{{ word.phonetic }}</small> }
+            @if (repeatCount >= 2) { <small>{{ studyStep() === 3 ? word.word : word.meaning }}</small> }
           </span>
           <span class="repeat-dots" aria-label="跟读次数">
-            @for (dot of [1, 2, 3]; track dot) { <i [class.done]="(repetitions()[word.id] || 0) >= dot"></i> }
+            @for (dot of [1, 2, 3]; track dot) { <i [class.done]="repeatCount >= dot"></i> }
           </span>
         </button>
       }

projects/xiaoshu-mobile/src/app/features/learning/learning-page.component.ts

@@ -2374,7 +2374,7 @@ export class LearningPageComponent implements OnInit, OnDestroy {
       nodeId: String(item['NodeID'] ?? detail['NodeID'] ?? item['nodeId'] ?? ''),
       word: String(item['Title'] ?? detail['Title'] ?? item['word'] ?? detail['word'] ?? item['Word'] ?? ''),
       meaning: String(item['sy'] ?? detail['sy'] ?? item['jssy'] ?? detail['jssy'] ?? item['Translate'] ?? detail['Translate'] ?? item['Meaning'] ?? ''),
-      phonetic: String(item['yb'] ?? detail['yb'] ?? item['Phonetic'] ?? detail['Phonetic'] ?? ''),
+      phonetic: [item['yb'], detail['yb'], item['Phonetic'], detail['Phonetic'], item['phonetic'], detail['phonetic']].map(value => String(value ?? '').trim()).find(Boolean) || '',
       audio: [item['yp'], detail['yp'], item['dy'], detail['dy']].map(value => String(value ?? '').trim()).find(Boolean) || '',
     };
   }

projects/xiaoshu-mobile/src/styles.scss

@@ -474,6 +474,12 @@ app-learning-page .node-list .unit-progress-ring strong { z-index: 1; font-size:
 app-learning-page .unit-actions { grid-template-columns: minmax(0, 1fr) minmax(150px, 1.4fr); align-items: center; }
 app-learning-page .unit-actions > span { color: var(--ink-soft); font-size: 13px; text-align: center; }
 
+app-learning-page .repeat-list .study-headword { font-size: 1.5em; line-height: 1.25; }
+app-learning-page .repeat-list .study-headword,
+app-learning-page .repeat-list button small { overflow-wrap: anywhere; }
+app-learning-page .repeat-list .study-phonetic { font-size: 1em; }
+app-learning-page .repeat-list .repeat-dots { flex: 0 0 auto; }
+
 app-resource-page .resource-page > :is(.description, .order-context, .action-row, .tabs, .state-line, .error-state, .resource-list, .detail-list, .empty-state),
 app-appointment-page .appointment-page > :is(.course-section, .comment-panel, .report-panel),
 app-article-page .article-page > :is(header, .article-content),