recall: play-triangle replay glyph, text presentation, wider inline box

The speaker emoji rendered as a color-emoji glyph that overflows its em
box, so the 1.1em inline placeholder clipped it. Switch to a play
triangle with U+FE0E (text presentation): it respects font metrics,
inherits the content color, and matches the requested affordance. Widen
the placeholder to 1.3em for headroom. Fallback aggregate row updated to
match.

Author: ChopinDavid

tool/src/main/kotlin/com/dvdutch/recall/ui/NodeComposables.kt

@@ -86,6 +86,13 @@ private const val AUDIO_NODE_KIND = "audio"
 /** Wire value of [ClozeNode.state] for a cloze that is still hidden (question side). */
 private const val CLOZE_STATE_HIDDEN = "hidden"
 
+/**
+ * The inline replay glyph: a PLAY triangle with U+FE0E forcing text presentation, so it
+ * renders as a font glyph (inheriting the content color, respecting font metrics — no
+ * emoji-box overflow/clipping) rather than a color emoji.
+ */
+internal const val AUDIO_GLYPH = "▶︎"
+
 /** The inlineContent id for the audio-replay glyph at track [track] within a text node. */
 internal fun audioInlineId(track: Int): String = "audio:$track"
 
@@ -104,7 +111,7 @@ internal fun audioInlineId(track: Int): String = "audio:$track"
 fun textNodeToAnnotatedString(node: TextNode): AnnotatedString = buildAnnotatedString {
     for (run in node.runs) {
         if (run.audioTrack != null) {
-            appendInlineContent(audioInlineId(run.audioTrack), "🔊")
+            appendInlineContent(audioInlineId(run.audioTrack), AUDIO_GLYPH)
             continue
         }
         val style = run.toSpanStyle()
@@ -192,8 +199,9 @@ private fun audioInlineContent(
 ): Map<String, InlineTextContent> {
     val tracks = node.runs.mapNotNull { it.audioTrack }
     if (tracks.isEmpty()) return emptyMap()
-    // Glyph box ~ the line text size; tracks the node scale so it matches shrunken/grown text.
-    val glyphEm = 1.1f
+    // Glyph box slightly wider than the line text size (headroom against clipping);
+    // tracks the node scale so it matches shrunken/grown text.
+    val glyphEm = 1.3f
     return tracks.associate { track ->
         audioInlineId(track) to InlineTextContent(
             Placeholder(
@@ -213,7 +221,7 @@ private fun audioInlineContent(
                 contentAlignment = Alignment.Center,
             ) {
                 Text(
-                    text = "🔊",
+                    text = AUDIO_GLYPH,
                     color = LightThemeTokens.colors.content,
                     style = cardCopyStyle(LightThemeTokens.typography.copy).scaledBy(scale),
                 )

tool/src/main/kotlin/com/dvdutch/recall/ui/StudyScreen.kt

@@ -489,7 +489,7 @@ private fun androidx.compose.foundation.layout.ColumnScope.CardBody(
 }
 
 /**
- * A tappable "🔊 REPLAY AUDIO" row shown only when the current side has audio; a tap
+ * A tappable "▶︎ REPLAY AUDIO" row shown only when the current side has audio; a tap
  * replays that side's list from the start. Monochrome LightText in the design system,
  * sitting just above the bottom bar / grade buttons — discoverable but not intrusive.
  */
@@ -503,7 +503,7 @@ private fun ReplayAudioRow(onReplay: () -> Unit) {
         horizontalArrangement = Arrangement.Center,
     ) {
         LightText(
-            text = "🔊 REPLAY AUDIO",
+            text = "▶︎ REPLAY AUDIO",
             variant = LightTextVariant.Fine,
             lighten = true,
             align = TextAlign.Center,