fix(ui): an Escape while a dialog's own video is fullscreen does not close the dialog

The page gets the Escape keydown with the video still the fullscreen element. When that element is
the dialog's own content (the library player), closing the dialog took the player away with the
fullscreen. A dialog opened over something else that is fullscreen still closes.

frontend/src/components/ui/Modal.tsx

@@ -13,7 +13,7 @@ import { useTranslation } from "react-i18next";
 import { X } from "lucide-react";
 import { useBackToClose } from "../../lib/history";
 import { anyBlockingLayerAbove, pushLayer, removeLayer, takeEscape } from "../../lib/layerStack";
-import { useFullscreenPortalHost } from "../../lib/fullscreen";
+import { fullscreenElement, useFullscreenPortalHost } from "../../lib/fullscreen";
 import { firstFieldIn, focusablesIn, trapTab, useDialogChrome } from "./dialogFocus";
 import { IconButton } from "./IconButton";
 import Toaster from "./Toaster";
@@ -151,7 +151,11 @@ export default function Modal({
     const onKey = (e: KeyboardEvent) => {
       if (takeEscape(e, id)) {
         e.stopPropagation();
-        close();
+        // The browser spends an Escape on leaving fullscreen and still hands it to the page, the
+        // fullscreen element still set. When that element is the dialog's own content (the library
+        // player's <video>), the Escape was the browser's: closing too lost the viewer the player.
+        const fs = fullscreenElement();
+        if (!(fs && rootRef.current?.contains(fs))) close();
         return;
       }
       // Focus trap: keep Tab / Shift+Tab cycling inside the dialog instead of reaching the inert