# Visual shell and scene picker This is a small, portable replacement for a much larger scene-specific animation file. Save the HTML as your app's `public/index.html`, then add **your own licensed images** under `public/scenery/`. Bring your own images and, if you want scene occlusion, create masks for those images. The code does not fetch weather or depend on a backend. Replace the ``, content in `#root`, and `landmarks` coordinates. Set a landmark to `null` when the image has no matching feature. The coordinates are fractions of the uncropped source image. The `point()` function maps them through `object-fit: cover`, so the glow and steam stay attached on narrow screens. ```html <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Your app

Your app

Replace this with your own interface.

``` The source effect engine also included a pixelated boat, water ripples, birds, a foreground silhouette mask, and optional depth-aware precipitation. Those depend on exact scene geometry and an image-derived depth map. Don't copy coordinates between unrelated artwork. If you rebuild them, derive an `object-fit: cover` transform for every anchor, clip moving objects with your own foreground mask, cap the animation frame scale, and test the narrowest viewport.