feat(design): the three 375 rows (E28 S3f3)

- Download row: answers to its own width (container query); below 40rem
  it stacks: picture beside a two-line title, the meta line across the
  row (one line, never wraps: zoomed on the iPad its pieces broke apart),
  then the source link and the actions on one wrapping line. The paste
  field takes a line of its own when the buttons would squeeze it.
- YT playlist row: below 42rem the length rides on the picture and the
  title runs two lines over the channel.
- Channels tag row: the suggestions take a line of their own below
  40rem (the chip lane was 0 px and the row's menu off the screen).
- Pager: on a phone the arrows drop their words (names kept), and the
  size label stays one line.
- Lint: a class split where the interpolation is the variant itself
  (${NARROW}:w-24) is refused too; it had shipped with no CSS.

frontend/src/components/DownloadCenter.tsx

@@ -161,9 +161,10 @@ export default function DownloadCenter() {
       <div className="px-4 pb-4 pt-3 max-w-4xl w-full mx-auto">
         {tab === "queue" && (
           <>
-            <div className="flex gap-2 mb-4">
+            {/* The field takes the whole line when the buttons would squeeze it (at 375 it had 57px). */}
+            <div className="flex flex-wrap gap-2 mb-4">
               <Input
-                className="w-full"
+                className="min-w-0 flex-[1_1_16rem]"
                 value={addUrl}
                 onChange={(e) => setAddUrl(e.target.value)}
                 onFocus={() => pasteFromClipboard()}