T09b overlays: lightbox, spotlight and tour, floating toolbar, peek; images fill their box; overlays take focus back when its element leaves the tree

src/theme/palette.rs

@@ -96,6 +96,7 @@ mixable!(
         danger_subtle: Hsla,
         info_subtle: Hsla,
         backdrop: Hsla,
+        media_backdrop: Hsla,
         shadow: Hsla,
         tooltip_bg: Hsla,
         tooltip_fg: Hsla,
@@ -144,6 +145,7 @@ impl Palette {
             danger_subtle: c(0xffefec),
             info_subtle: c(0xebf4ff),
             backdrop: rgba(0x18161352).into(),
+            media_backdrop: rgba(0x0e0d0bf8).into(),
             shadow: c(0x181613),
             tooltip_bg: c(0x181613),
             tooltip_fg: c(0xfcfaf7),
@@ -209,6 +211,7 @@ impl Palette {
             danger_subtle: c(0x3a1d1b),
             info_subtle: c(0x19273a),
             backdrop: rgba(0x00000080).into(),
+            media_backdrop: rgba(0x000000f8).into(),
             shadow: c(0x000000),
             tooltip_bg: c(0x373533),
             tooltip_fg: c(0xf3f1f0),

src/theme/tokens.rs

@@ -233,6 +233,11 @@ impl Theme {
         (px_to_rems(84.0), px_to_rems(40.0))
     }
 
+    /// Room between a box and what floats by it: a spotlight's ring, a selection's toolbar.
+    pub fn float_gap(&self) -> Rems {
+        px_to_rems(6.0)
+    }
+
     /// Width of a dialog's card.
     pub fn dialog_width(&self) -> Rems {
         px_to_rems(440.0)