fix(a11y): mark the playing row with a shape, not only a colour

a11y.22, WCAG 1.4.1: `.track-row.active` was a background tint and a
text colour, and the row markup carried no aria-current either — so a
colour-blind user could not find the playing row and AT had no signal
at all. The queue panel had aria-current from Phase 1 and the same
colour-only visual.

A triangle drawn in each row's own left padding by `::before`. It is a
shape that is present or absent, and it costs no layout: track-list's
grid columns are computed from the host width, so a marker in the flow
would move every cell on the playing row and nothing else.

Both directions are asserted in both tiers. A marker that renders on
every row satisfies "the playing row has one" for free, which is this
plan's oldest rule.

And one thing the reproduction found: a track started from the *list*
leaves the queue's currentIndex at -1, so the panel has no current row
in that flow at all. Pre-existing, and the reason this looked broken
the first time it was checked in the running app.

frontend/test/components/queue-reorder.test.ts

@@ -194,6 +194,21 @@ describe('a queue row says which track its controls act on', () => {
     ]);
   });
 
+  it('marks the playing row with a shape, not only a colour', async () => {
+    const el = await panelWithQueue();
+
+    const rows = shadowAll(el, '.track-item');
+    const width = (r: Element) =>
+      parseFloat(getComputedStyle(r, '::before').borderLeftWidth) || 0;
+
+    // `a11y.22`, the same rule as track-list one panel over. Both
+    // directions: absent on the rows that are not playing is what
+    // makes the present one mean anything.
+    expect(rows[0]!.getAttribute('aria-current')).toBe('true');
+    expect(width(rows[0]!)).toBeGreaterThan(0);
+    expect(width(rows[1]!)).toBe(0);
+  });
+
   it('gives the title and artist a tooltip, since the panel is resizable', async () => {
     const el = await panelWithQueue();