fix(library): wrap select-mode action bar on small screens (#4329)

Long translations (e.g. German "Gruppieren", "Löschen") pushed the 6-button
action bar past the right edge on typical phones since the grid fallback
only triggered below 350px. Switch to a 3x2 grid below sm: and clamp the
container to the viewport width.

Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

apps/readest-app/src/app/library/components/SelectModeActions.tsx

@@ -51,9 +51,9 @@ const SelectModeActions: React.FC<SelectModeActionsProps> = ({
         className={clsx(
           'text-base-content text-xs shadow-lg',
           'not-eink:bg-base-300 eink:bg-base-100 eink:border eink:border-base-content',
-          'mx-auto w-fit rounded-lg p-4',
-          'flex items-center justify-center space-x-6',
-          'max-[350px]:grid max-[350px]:grid-cols-3 max-[350px]:gap-x-10 max-[350px]:gap-y-2 max-[350px]:space-x-0',
+          'mx-auto w-fit max-w-[calc(100vw-1rem)] rounded-lg p-4',
+          'flex items-center justify-center gap-x-6',
+          'max-sm:grid max-sm:grid-cols-3 max-sm:gap-x-6 max-sm:gap-y-3',
         )}
       >
         <button