Animations

web/src/lib/theme.ts

@@ -22,6 +22,28 @@ export const SHOW_ROW_ICONS = true;
 /** Vertical gap between shelves on the root browse screen, in px. */
 export const ROW_SPACING = 25;
 
+/** Fade the album/category grid in (with a slight upward slide) when a group or
+ * category is entered, and the album modal in when it opens. One animation per
+ * container, not per card, so cost stays flat regardless of grid size. */
+export const ANIMATE_VIEW_TRANSITIONS = true;
+
+/** Frost the glass panels/cards/rows with a real backdrop blur. `backdrop-filter` is
+ * one of the most GPU-expensive CSS effects in the app - a live backdrop copy+blur
+ * per element, repeated for every album card in the unvirtualized grid - so turn
+ * this off on weak hardware (e.g. an old Raspberry Pi) to fall back to a plain
+ * translucent background with no blur. */
+export const SHOW_GLASS_BLUR = true;
+
+/** Render the play view's animated canvas background (gradient + bubbles, both
+ * redrawn every frame at 60fps). Off falls back to `.stage`'s own static CSS
+ * gradient, which is still underneath the canvas either way. */
+export const SHOW_AMBIENCE = true;
+
+/** Run the purely decorative CSS animation loops: the room page's bubble field and
+ * the dolphin mascot's bob/swim. Individually cheap (opacity/transform only) but
+ * free to cut on weak hardware. */
+export const SHOW_DECORATIVE_ANIMATIONS = true;
+
 // ------------------------------------------------------------------ colors --
 
 /** Per-group hue (oklch degrees). The play view's ambient water uses the same