From d2f687983efe38c63af313c7944a679d8018343e Mon Sep 17 00:00:00 2001
From: Test User <test@example.com>
Date: Mon, 27 Jul 2026 09:28:44 +0200
Subject: [PATCH] cbd-web: make the seek buttons monochrome type
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

`⏪`/`⏩` (U+23EA/U+23E9) carry emoji presentation, so a browser with a color
emoji font drew them as pictures — taller than the line and off its baseline —
in a row that is otherwise monochrome type.

They are `«`/`»` now: plain text glyphs at the weight of the `‹` in the library
toolbar, and lighter than the prev/next marks either side, which suits a nudge
next to a skip. `font-variant-emoji: text` on the row asks for the text form of
prev/next/pause, which have the same presentation; it is ignored where
unsupported, at no cost, since those glyphs are the fallback anyway.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
---
 cbd-web/src/app.rs      | 10 ++++++++--
 cbd-web/style.css       |  5 +++++
 docs/src/clients/web.md |  5 ++---
 plan/summary.md         | 15 +++++++++++++++
 4 files changed, 30 insertions(+), 5 deletions(-)

diff --git a/cbd-web/src/app.rs b/cbd-web/src/app.rs
index 958d9db..eb072c8 100644
--- a/cbd-web/src/app.rs
+++ b/cbd-web/src/app.rs
@@ -1216,12 +1216,18 @@ fn Transport(store: Store) -> impl IntoView {
             <div class="controls">
                 <button class="ghost" title="previous track (<)"
                     on:click=move |_| store.dispatch(Action::PrevTrack)>"⏮"</button>
+                // Guillemets, not U+23EA/U+23E9: those two carry emoji
+                // presentation, so a browser with a color emoji font drew them
+                // full-color and oversized next to a row of monochrome type.
+                // These are plain text glyphs at the weight of the `‹` in the
+                // library toolbar, and read as a nudge against the heavier
+                // prev/next marks either side of them.
                 <button class="ghost" title="back 15 seconds (,)"
-                    on:click=move |_| store.dispatch(Action::SeekBackward)>"⏪"</button>
+                    on:click=move |_| store.dispatch(Action::SeekBackward)>"«"</button>
                 <button class="ghost big" title="play/pause (Space)"
                     on:click=move |_| store.dispatch(Action::TogglePlay)>{state_symbol}</button>
                 <button class="ghost" title="forward 15 seconds (.)"
-                    on:click=move |_| store.dispatch(Action::SeekForward)>"⏩"</button>
+                    on:click=move |_| store.dispatch(Action::SeekForward)>"»"</button>
                 <button class="ghost" title="next track (>)"
                     on:click=move |_| store.dispatch(Action::NextTrack)>"⏭"</button>
                 <button class="ghost" title="restart track (r)"
diff --git a/cbd-web/style.css b/cbd-web/style.css
index b15a074..2802a70 100644
--- a/cbd-web/style.css
+++ b/cbd-web/style.css
@@ -297,6 +297,11 @@ input {
     display: flex;
     align-items: center;
     gap: 0.1rem;
+    /* The prev/next/pause marks carry emoji presentation too, so a browser
+       with a color emoji font renders them as pictures rather than type.
+       Ask for the text form; ignored where unsupported, which costs
+       nothing — the glyphs are the fallback either way. */
+    font-variant-emoji: text;
 
     & .big {
       font-size: 1.3rem;
diff --git a/docs/src/clients/web.md b/docs/src/clients/web.md
index 77a718e..4644a81 100644
--- a/docs/src/clients/web.md
+++ b/docs/src/clients/web.md
@@ -16,9 +16,8 @@ before the cursor (see [the TUI's register
 section](./tui.md#the-register-y-d-and-pp), which behaves identically here;
 the queue toolbar shows how many entries are waiting). Seek is there too —
 `,` and `.` move 15 seconds back and forward (`<` and `>` skip a whole
-track), as do the `⏪`/`⏩`
-buttons in
-the transport bar, and the progress bar is clickable — a click seeks to
+track), as do the `«`/`»` buttons in the transport bar, and the progress
+bar is clickable — a click seeks to
 that point in the track. The `/` live filter is TUI-only for now.
 
 A pair of `library` / `queue` tabs in the top bar switches panes and shows
diff --git a/plan/summary.md b/plan/summary.md
index b934d75..54a7bd8 100644
--- a/plan/summary.md
+++ b/plan/summary.md
@@ -1625,3 +1625,18 @@ collapse to a strip, which was its toolbar and the top of its list with the
 rest clipped — all still taking taps, so aiming at the strip hit the wrong
 pane's list, or the library's "play", which replaces the queue. With the tabs
 carrying the switch, the strip had nothing left to earn.
+
+## Web seek buttons (2026-07-27)
+
+The 15-second seek buttons were `⏪`/`⏩` (U+23EA/U+23E9), which carry emoji
+presentation: a browser with a color emoji font drew them as full-color
+pictures, taller than the line and off its baseline, in a row that is
+otherwise monochrome type.
+
+They are `«`/`»` now — plain text glyphs at the weight of the `‹` in the
+library toolbar, and lighter than the prev/next marks either side, which suits
+a nudge next to a skip.
+
+`font-variant-emoji: text` on the controls row asks for the text form of the
+prev/next/pause marks, which have the same emoji presentation. It is ignored
+where unsupported, at no cost: those glyphs are the fallback anyway.