fix(lotus): transparent-theme contrast guard; phone-only rail shrink; live URL params

- lotusTransparent without lotusTheme warns and applies the theme anyway;
  name tags/header/footer get a subtle text-shadow + backdrop blur under
  body.lotus-transparent (#21).
- Landscape filmstrip shrink requires (pointer: coarse) so a short
  desktop/PiP window isn't reflowed as a phone (#32).
- lotusParam re-reads window.location on every call (#33).

Fixes #21
Fixes #32
Fixes #33

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01PPmy3tPq869XDW4njjVaKA

src/useTheme.ts

@@ -8,6 +8,7 @@ Please see LICENSE in the repository root for full details.
 import { useEffect, useLayoutEffect, useRef, useState } from "react";
 import { WidgetApiToWidgetAction } from "matrix-widget-api";
 import { type IThemeChangeActionRequest } from "matrix-widget-api";
+import { logger } from "matrix-js-sdk/lib/logger";
 
 import { getUrlParams } from "./UrlParams";
 import { widget } from "./widget";
@@ -60,8 +61,22 @@ export const useTheme = (): void => {
     document.body.classList.remove("no-theme");
     // [lotus #5] Native theming hooks, opted in by the host via URL flags, so
     // it no longer has to inject CSS into the iframe after load.
-    if (lotusFlag("lotusTransparent"))
-      document.body.classList.add("lotus-transparent");
-    if (lotusFlag("lotusTheme")) document.body.classList.add("lotus-theme");
+    const lotusTransparent = lotusFlag("lotusTransparent");
+    const lotusTheme = lotusFlag("lotusTheme");
+    if (lotusTransparent) document.body.classList.add("lotus-transparent");
+    // [lotus #21] The two flags are only meaningful together: a transparent
+    // canvas with no matching theme leaves text/icon colours computed against
+    // the default dark canvas token while the real pixels behind them are
+    // whatever the host painted. If a host sets lotusTransparent without
+    // lotusTheme, warn and apply lotusTheme anyway rather than silently
+    // risking unreadable UI.
+    if (lotusTransparent && !lotusTheme) {
+      logger.warn(
+        "[lotus] lotusTransparent is set without lotusTheme; applying " +
+          "lotusTheme anyway since the two flags are only meaningful together.",
+      );
+    }
+    if (lotusTheme || lotusTransparent)
+      document.body.classList.add("lotus-theme");
   }, [previousTheme, requestedTheme]);
 };