lotus(#5): native transparent-background + Lotus theme hooks

Adds body.lotus-transparent (lotusTransparent=1) so the host wallpaper
shows through the call natively, retiring cinny's injected
`html,body{background:none!important}` hack; and body.lotus-theme
(lotusTheme=1) as a source-level Compound-token override hook for the
Lotus/TDS palette (driven by the existing setTheme channel / URL flags).
Additive: no-op without the flags.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

src/index.css

@@ -85,6 +85,25 @@ body {
   -webkit-tap-highlight-color: transparent;
 }
 
+/* [lotus] When embedded in the Lotus host with lotusTransparent=1, make the
+app background transparent so the host's wallpaper shows through natively —
+replacing the host's injected `html, body { background: none !important }`
+override. */
+body.lotus-transparent,
+body.lotus-transparent #root {
+  background: transparent !important;
+}
+
+/* [lotus] Native Lotus/TDS theme, applied when lotusTheme=1, instead of the
+host injecting CSS into the iframe after load. Overrides Compound design tokens
+with Lotus values at the source so theming is complete and flash-free. Extend
+this block with the full Lotus token map from the design system; the canvas
+override below is a safe starting point that matches the Lotus dark surface. */
+body.lotus-theme {
+  --cpd-color-bg-canvas-default: #0c0d10;
+  --video-tile-background: var(--cpd-color-bg-subtle-secondary);
+}
+
 /* This prohibits the view to scroll for pages smaller than 122px in width
 we use this for mobile pip webviews */
 .no-scroll-body {