@aglyn/aglyn 1.0.0-beta.235 → 1.0.0-beta.237

package/src/lib/app-utils/docs-index.generated.js

@@ -205,14 +205,14 @@ export const DOCS_SECTION_INDEX = [
         title: 'AI credits',
         heading: 'What things cost',
         anchor: '#what-things-cost',
-        text: 'What a request costs depends on how much the AI reads and writes, so the figures below are typical, not fixed. Every job shows its estimate before you confirm it.\n| Request | Typical cost |\n| An answer in the chat, a rewrite, a summary | A few credits |\n| An answer quoted straight from the docs | Free |\n| A vector illustration, icon or logo mark | About 18 credits a picture |\n| A photo, art or design picture | About 108 credits a picture (about 75 on Free) |\n| A new site\'s look | A few credits |\n| A page from a brief | About 50 credits for each section, plus planning |\n| A layout, form, component or email design | About 50 credits each |\n| A new site started with AI, paid plan | About 1,050 for 3 pages to 2,600 for 8 |\n| A new site started with AI, Free plan | Always within the 300 Free credits; the window shows the most it can cost |\n| Products, booking services, overlays, A/B tests, funnels, variables in a chat build | Almost nothing |\n| Stock photos in an AI site | Nothing |\nA model you choose with the Model switch can cost more or less than Auto; the switch shows each model\'s cost. See Choosing a model.'
+        text: 'What a request costs depends on how much the AI reads and writes, so the figures below are typical, not fixed: what jobs like it cost on real builds. Every job shows its estimate before you confirm it.\n| Request | Typical cost |\n| An answer in the chat, a rewrite, a summary | A few credits |\n| An answer quoted straight from the docs | Free |\n| A vector illustration, icon or logo mark | About 18 credits a picture |\n| A photo, art or design picture | About 108 credits a picture (about 75 on Free) |\n| A new site\'s look | A few credits |\n| A page from a brief | About 30 credits for a page of five sections (about 6 a section), plus planning |\n| A layout (header and footer) | About 25 credits |\n| A form | About 30 credits |\n| A component or email design | About 30 credits |\n| A new site started with AI, paid plan | About 170 for 3 pages to 320 for 8 |\n| A new site started with AI, Free plan | About 140 for two pages, within the 300 Free credits |\n| Products, booking services, overlays, A/B tests, funnels, variables in a chat build | Almost nothing |\n| Stock photos in an AI site | Nothing |\nA model you choose with the Model switch can cost more or less than Auto; the switch shows each model\'s cost. See Choosing a model.'
     },
     {
         path: '/ai/ai-credits',
         title: 'AI credits',
         heading: 'Before a job starts',
         anchor: '#before-a-job-starts',
-        text: 'Every job tells you what it will cost before it spends anything:\n- A plan shows Estimated cost: about N credits beside Confirm plan. What it really costs is what its steps spend, and you can watch that add up on the job.\n- On the Free plan, a job is checked against the most it could cost, not a typical figure, and against the credits you have left this month. The Start your site window, for example, says Up to about N AI credits and how many of your free credits are left until they reset. If what is left cannot cover it, the start button is turned off and the window says so, with Upgrade. If fewer pages would fit, it says that too.\n- A picture shows its credits per picture and in total before Create.'
+        text: 'Every job tells you what it will cost before it spends anything:\n- A plan shows Estimated cost: About N credits (up to M) beside Confirm plan: about what jobs like it cost on real builds, and the most it can cost. What it really costs is what its steps spend, and you can watch that add up on the job. Try again shows the same for the parts it will run again.\n- On the Free plan, a job is checked against the credits you have left this month, and the window or plan card shows how many that is. A job that will very likely fit starts with no question asked. One that will likely use more than you have left says so before it starts, for example This build is about 106 credits (up to 650). You have 90 left, so it will build as much as it can and pause when your credits run out. Nothing starts until you choose:\n- Build what fits builds as much as your credits cover, then pauses. Choose Resume after you upgrade or when your credits renew, and it carries on from where it stopped. Nothing it already built is built or charged again.\n- Build the home page first builds a smaller first version: the home page and what it needs, such as its layout and the form it shows. Ask for the rest later.\n- Upgrade opens Billing.\nWith no free credits left at all, nothing can start until they renew or you upgrade.\n- A picture shows its credits per picture and in total before Create.'
     },
     {
         path: '/ai/ai-credits',
@@ -394,7 +394,7 @@ export const DOCS_SECTION_INDEX = [
         title: 'Build from Assist chat',
         heading: 'The plan card',
         anchor: '#the-plan-card',
-        text: 'The card shows Planning what to build on this site… while the plan is made, then the Proposed plan, one line per part:\n- Reuses something the site already has, and what for;\n- Creates something new, and why nothing you have will do;\n- Builds the page with its title, address, layout and sections;\n- any video player a page will carry, and what loading it costs your visitors.\nUnder the lines is the Estimated cost in credits. It is an estimate: what the build costs is what its steps spend. If you asked for the new pages to go live, a Publish the new pages when they are built box is there too, unticked until you tick it.\nNothing is built while the card waits. The plan follows the building rules, and a plan that breaks them, or asks for more than your plan includes, is stopped before you are asked to confirm it.'
+        text: 'The card shows Planning what to build on this site… while the plan is made, then the Proposed plan, one line per part:\n- Reuses something the site already has, and what for;\n- Creates something new, and why nothing you have will do;\n- Builds the page with its title, address, layout and sections;\n- any video player a page will carry, and what loading it costs your visitors.\nUnder the lines is the Estimated cost, such as About 106 credits (up to 650): about what builds like it cost, and the most it can cost. What the build costs is what its steps spend. On the Free plan the card also says how many free credits you have left this month. If you asked for the new pages to go live, a Publish the new pages when they are built box is there too, unticked until you tick it.\nIf the build will likely use more than your credits left, the card says so instead of offering Confirm plan, and gives you three choices: Build what fits (it builds what your credits cover and pauses, then Resume carries on), Build the home page first (only the home page and what it needs), or Upgrade. See Before a job starts.\nNothing is built while the card waits. The plan follows the building rules, and a plan that breaks them, or asks for more than your plan includes, is stopped before you are asked to confirm it.'
     },
     {
         path: '/ai/assist-builds',
@@ -408,7 +408,7 @@ export const DOCS_SECTION_INDEX = [
         title: 'Build from Assist chat',
         heading: 'One job, many parts',
         anchor: '#one-job-many-parts',
-        text: 'Everything in the plan is built by one job, each part by the same builder that makes it on its own page, in the order the parts need each other: the layout and the form before the page that places them.\n- Each part stands on its own. A part that fails does not undo the others. What depends on it is built without it, or not built, and the card says which.\n- Everything is a draft. Pages are unpublished drafts unless you ticked the publish box. Products have no photo and the price you stated, if any. Booking services and funnels are drafts to activate. Overlays and automations are switched off, A/B tests are stopped, and campaigns are unsent and aimed at nobody.\n- Names are your own. A new variable or function never takes a name the site already uses.\nWhen it is done the card says how many parts were built, such as 5 of 6 built; 1 failed. Try again what failed builds only the parts that failed.\nTo change something it made, ask in the chat, such as make the about page shorter. Assist opens that draft and proposes the change there.'
+        text: 'Everything in the plan is built by one job, each part by the same builder that makes it on its own page, in the order the parts need each other: the layout and the form before the page that places them.\n- Each part stands on its own. A part that fails does not undo the others. What depends on it is built without it, or not built, and the card says which.\n- Everything is a draft. Pages are unpublished drafts unless you ticked the publish box. Products have no photo and the price you stated, if any. Booking services and funnels are drafts to activate. Overlays and automations are switched off, A/B tests are stopped, and campaigns are unsent and aimed at nobody.\n- Names are your own. A new variable or function never takes a name the site already uses.\nWhen it is done the card says how many parts were built, such as 5 of 6 built; 1 failed. Try again what failed builds only the parts that failed, and shows what that is likely to cost.\nIf your credits run out partway, the card says Paused. What is built so far is kept. Choose Resume after you upgrade or when your credits renew, and it carries on with the next part.\nTo change something it made, ask in the chat, such as make the about page shorter. Assist opens that draft and proposes the change there.'
     },
     {
         path: '/ai/assist-builds',
@@ -1157,7 +1157,7 @@ export const DOCS_SECTION_INDEX = [
         title: 'Product copy and catalogs with AI',
         heading: 'Propose a first catalog',
         anchor: '#propose-a-first-catalog',
-        text: 'On the products page, press Create with AI beside Add product (and beside Add your first product while the catalog is empty), or Propose products in Build your catalog with AI — both open the same brief. Propose products takes a brief, such as "a candle studio: hand-poured soy candles in 8 oz and 16 oz jars, and wax melts", and proposes up to twelve products, usually six or more unless your brief says how many: each with a name, type, description, tags, options, a search listing and a sentence saying what its photo should show.\nReview the table, untick any you do not want, and press Create drafts. Each product is created as a draft:\n- It starts at a default price of $25 on every variant, for you to change in the product editor. You may clear a price on purpose: the product still saves, the table marks it Set a price, and your storefront shows Price coming soon with no way to buy it until it has one again.\n- It has no photo, and the table marks it Needs a photo with the suggested shot. Nothing is uploaded or linked for you.\n- Nothing is on your storefront until you set it to Active.\nA proposed product with the same name as one already in your catalog is left out.'
+        text: 'On the products page, press Create with AI beside Add product (and beside Add your first product while the catalog is empty), or Propose products in Build your catalog with AI — both open the same brief. Propose products takes a brief, such as "a candle studio: hand-poured soy candles in 8 oz and 16 oz jars, and wax melts", and proposes up to twelve products, usually six or more unless your brief says how many: each with a name, type, description, tags, options, a search listing and a sentence saying what its photo should show.\nReview the table, untick any you do not want, and press Create drafts. Each product is created as a draft:\n- It starts at a placeholder price on every variant, for you to change in the product editor. You may clear a price on purpose: the product still saves, the table marks it Set a price, and your storefront shows Price coming soon with no way to buy it until it has one again.\n- It has no photo, and the table marks it Needs a photo with the suggested shot. Nothing is uploaded or linked for you.\n- Nothing is on your storefront until you set it to Active.\nA proposed product with the same name as one already in your catalog is left out.'
     },
     {
         path: '/ai/products-with-ai',
@@ -1276,7 +1276,7 @@ export const DOCS_SECTION_INDEX = [
         title: 'Start a new site with AI',
         heading: 'What it will cost',
         anchor: '#what-it-will-cost',
-        text: 'The bar at the bottom shows what the start can cost before you begin. On a paid plan it is an estimate. On the Free plan it is the most the start can cost, next to how many of your free credits are left this month and when they reset. If what is left cannot cover it, Plan my site is turned off and the window says so. It also tells you if one page would fit. See Before a job starts.'
+        text: 'The bar at the bottom shows what the start will cost before you begin, as About N credits (up to M): about what starts like it cost on real builds, and the most it can cost. On the Free plan it also shows how many of your free credits are left this month and when they renew. If the start will likely use more than you have left, the window says so and offers Build what fits (it builds what your credits cover, then pauses until you Resume), Build the home page first (a one-page start), and Upgrade. Plan my site waits until you choose. See Before a job starts.'
     },
     {
         path: '/ai/start-with-ai',
@@ -1325,7 +1325,7 @@ export const DOCS_SECTION_INDEX = [
         title: 'Start a new site with AI',
         heading: 'A store from the start',
         anchor: '#a-store-from-the-start',
-        text: 'On a paid plan, a site with the Online store style also gets three to six products, each with a description and a photo, and a Cart button in the header. Each product gets a starting price of $25 so it can be bought; set its real price, and your own photo, in Products. A product without a price shows Price coming soon on the store, with no Add to cart, until you give it one. See Product copy and catalogs with AI.'
+        text: 'On a paid plan, a site with the Online store style also gets three to six products, each with a description and a photo, and a Cart button in the header. Each product gets a placeholder starting price so it can be bought; set its real price, and your own photo, in Products. A product without a price shows Price coming soon on the store, with no Add to cart, until you give it one. See Product copy and catalogs with AI.'
     },
     {
         path: '/ai/start-with-ai',
@@ -1710,7 +1710,7 @@ export const DOCS_SECTION_INDEX = [
         title: 'Element catalog',
         heading: 'Surface',
         anchor: '#surface',
-        text: '| Element | What it\'s for |\n| Paper | A themed surface. Elevation 0–24 raises it with a shadow; the Outlined variant swaps the shadow for a border (and hides the elevation control, which does nothing there). |\n| Card | A surface for one subject, composed from Card Header (title + subheader), Card Content (the padded body) and Card Actions (the button row). Each piece is its own element, so you can select, style and reorder them. |\n| Accordion | A header that expands to reveal its details, built from Accordion Summary and Accordion Details. See Accordion below. |\nAccordion\nStart expanded controls whether visitors arrive with the panel open. On the canvas the panel is always shown open regardless — collapsed details can\'t be selected or styled. Preview and the published site both behave the way you configured it, so what ships is never in doubt.\nAccordion Summary takes an optional Header links to. Leave it empty and the whole header row toggles the panel, which is what every accordion does by default. Point it at a page and the row splits in two: the header text becomes a link to that page, and the chevron beside it becomes the toggle. That split is the only way a header can do both — a link placed inside the toggle button is invalid markup and unreachable by keyboard. It is what lets a mobile drawer offer Product both as a group to open and as a page to visit.\nThe FAQ preset drops three complete panels at once.'
+        text: '| Element | What it\'s for |\n| Paper | A themed surface. Elevation 0–24 raises it with a shadow; the Outlined variant swaps the shadow for a border (and hides the elevation control, which does nothing there). |\n| Card | A surface for one subject, composed from Card Header (title + subheader), Card Content (the padded body) and Card Actions (the button row). Each piece is its own element, so you can select, style and reorder them. |\n| Accordion | A header that expands to reveal its details, built from Accordion Summary and Accordion Details. See Accordion below. |\n| Lightbox | Any elements — text, a form, a video, pictures — hidden until a button, link or picture opens them in a lightbox with a Show an element interaction. Nothing inside loads until it opens. See Lightboxes. |\nAccordion\nStart expanded controls whether visitors arrive with the panel open. On the canvas the panel is always shown open regardless — collapsed details can\'t be selected or styled. Preview and the published site both behave the way you configured it, so what ships is never in doubt.\nAccordion Summary takes an optional Header links to. Leave it empty and the whole header row toggles the panel, which is what every accordion does by default. Point it at a page and the row splits in two: the header text becomes a link to that page, and the chevron beside it becomes the toggle. That split is the only way a header can do both — a link placed inside the toggle button is invalid markup and unreachable by keyboard. It is what lets a mobile drawer offer Product both as a group to open and as a page to visit.\nThe FAQ preset drops three complete panels at once.'
     },
     {
         path: '/building-sites/besigner/element-catalog',
@@ -1738,7 +1738,7 @@ export const DOCS_SECTION_INDEX = [
         title: 'Element catalog',
         heading: 'Media',
         anchor: '#media',
-        text: '| Element | What it\'s for |\n| Image | An image with fit, size and radius controls, an optional link, and an automatic responsive srcSet for media-library URLs. See Image below. |\n| Video | A video file from your media library, poster first. See Video. |\n| Icon | Any icon from the icon picker. |\n| Image List / Image List Item | A dense gallery. See Image List below. |\nImage\nA picture from your media library is delivered in several widths, and each visitor\'s browser downloads the one that fits the space the image takes on their screen — a phone gets a small file, a wide desktop a larger one. You do not set anything for this.\nHow Aglyn knows how big the image shows. Every published page works it out from where the image sits, with nothing for you to do and nothing to re-save:\n- a size you gave the image itself — a pixel Width, or a pixel Height with the width left on auto (a logo set 56px tall is as wide as its picture is at that height), including different sizes per screen size;\n- the layout around it — a Grid cell set to xs:12 md:4 is a third of the page from tablet width up, an image in a grid of three equal columns is a third, the gaps between them come off, and a Container stops the slot growing past its max width.\nOn top of that, the Besigner measures how wide each image renders at the screen size you are looking at, and saving or publishing the page stores it with the image — which covers layouts the rules above cannot read. Check the page on another device in the preview switcher (XS - Mobile, MD, LG…) before you save and that size is measured too. Only when nothing at all is known does the browser assume the image is as wide as the screen.\nThe first image of the page itself — not the logo in your header — is treated as the page\'s main picture: it starts loading w'
+        text: '| Element | What it\'s for |\n| Image | An image with fit, size and radius controls, an optional link, and an automatic responsive srcSet for media-library URLs. Open in a lightbox shows it full size when pressed. See Image below. |\n| Video | A video file from your media library, poster first. See Video. |\n| Music player | Your own tracks from your media library, one or a playlist of Track elements. See Music player. |\n| Icon | Any icon from the icon picker. |\n| Image List / Image List Item | A dense gallery. See Image List below. |\nImage\nA picture from your media library is delivered in several widths, and each visitor\'s browser downloads the one that fits the space the image takes on their screen — a phone gets a small file, a wide desktop a larger one. You do not set anything for this.\nHow Aglyn knows how big the image shows. Every published page works it out from where the image sits, with nothing for you to do and nothing to re-save:\n- a size you gave the image itself — a pixel Width, or a pixel Height with the width left on auto (a logo set 56px tall is as wide as its picture is at that height), including different sizes per screen size;\n- the layout around it — a Grid cell set to xs:12 md:4 is a third of the page from tablet width up, an image in a grid of three equal columns is a third, the gaps between them come off, and a Container stops the slot growing past its max width.\nOn top of that, the Besigner measures how wide each image renders at the screen size you are looking at, and saving or publishing the page stores it with the image — which covers layouts the rules above cannot read. Check the page on another device in the preview switcher (XS - Mobile, MD, LG…) before you save and that size is measured too. Only when nothing at all is known does the browser a'
     },
     {
         path: '/building-sites/besigner/element-catalog',
@@ -1773,7 +1773,7 @@ export const DOCS_SECTION_INDEX = [
         title: 'Element catalog',
         heading: 'Related',
         anchor: '#related',
-        text: '- The Besigner\n- Video — posters, preload, captions and the lightbox\n- Drag-and-drop hierarchy — which elements accept which children\n- Long documents in markdown — the Markdown and Table of contents elements\n- Responsive styling\n- Interactions & custom HTML'
+        text: '- The Besigner\n- Video — posters, preload, captions and the lightbox\n- Music player — tracks, playlists, rights confirmation and takedowns\n- Drag-and-drop hierarchy — which elements accept which children\n- Long documents in markdown — the Markdown and Table of contents elements\n- Responsive styling\n- Interactions & custom HTML'
     },
     {
         path: '/building-sites/besigner/interactions-and-custom-html',
@@ -1824,6 +1824,13 @@ export const DOCS_SECTION_INDEX = [
         anchor: '#play-video-step',
         text: 'When clicked → Play a video does exactly what pressing a Video element\'s poster does, from a button anywhere on the page. Pick the Video as the target.\n- With Open in a lightbox on, the lightbox opens and the film plays.\n- With it off, the film plays in place of the poster.\nNothing is loaded from the video\'s host until the action runs, and a Wistia video follows the same consent rules as a press on its poster. To be sure the film is in view as it starts, put Scroll to element, picking the same Video, before it.'
     },
+    {
+        path: '/building-sites/besigner/interactions-and-custom-html',
+        title: 'Interactions & custom HTML',
+        heading: 'Open a lightbox',
+        anchor: '#open-a-lightbox',
+        text: 'A Lightbox element answers the visibility steps you already use: When clicked → Show an element with the Lightbox as its target opens it, from a button, a link, a picture or anything else with an interaction. Show/hide an element toggles it, and Hide an element — on a button inside the Lightbox, say — closes it. They run on every plan, like the other visibility steps.\nThe visitor can also close it with its close button, Esc and a click on the backdrop, unless you turned those off in its settings; either way the keyboard goes back to whatever opened it.\nPictures need no interaction: an Image or an Image List with Open in a lightbox on opens its own. See Lightboxes.'
+    },
     {
         path: '/building-sites/besigner/interactions-and-custom-html',
         title: 'Interactions & custom HTML',
@@ -1845,6 +1852,69 @@ export const DOCS_SECTION_INDEX = [
         anchor: '#related',
         text: '- Walkthrough: build a mega menu with hover interactions\n- Menus & navigation\n- Besigner overview\n- Workflows & actions'
     },
+    {
+        path: '/building-sites/besigner/lightbox',
+        title: 'Lightboxes',
+        heading: '',
+        anchor: '',
+        text: 'Lightboxes\nA lightbox shows something large over the page, on a dimmed backdrop, until the visitor closes it. Aglyn has one lightbox, and four ways to open it:\n- an Image with Open in a lightbox on shows its picture full size;\n- an Image List with Open in a lightbox on opens a gallery of every picture in it;\n- Images that share a Gallery name open as one gallery, wherever they are on the page;\n- a Lightbox element holds any elements you like and opens from any button, link or picture.\nThe Video element opens the same lightbox for its film.'
+    },
+    {
+        path: '/building-sites/besigner/lightbox',
+        title: 'Lightboxes',
+        heading: 'A picture, full size',
+        anchor: '#image-lightbox',
+        text: 'Select an Image and turn on Open in a lightbox. Pressing the picture — or focusing it and pressing Enter — opens it full size. The lightbox asks the media library for the largest version that fits the visitor\'s screen, so a small thumbnail on the page still opens sharp.\n- Lightbox caption — a line under the picture in the lightbox.\n- Gallery name — give several Images the same name and they open as one gallery, with previous and next. Leave it empty to open the picture alone.\n- Gallery thumbnails — a strip of small pictures under a gallery\'s picture.\nThe Alt text is what a screen reader reads for the picture in the lightbox too. A Decorative image is announced as "Open picture".\nAn Image that links somewhere — Link to page or External URL — follows its link instead. One press cannot both go somewhere and open a lightbox.'
+    },
+    {
+        path: '/building-sites/besigner/lightbox',
+        title: 'Lightboxes',
+        heading: 'A gallery',
+        anchor: '#image-list-gallery',
+        text: 'Select an Image List and turn on Open in a lightbox. Pressing any picture opens a gallery of every picture in the list, starting at the one pressed:\n- Previous and Next buttons, which wrap around at the ends;\n- the arrow keys, and Home and End for the first and the last picture;\n- a sideways swipe on a phone;\n- a counter, such as 3 / 12;\n- each tile\'s Caption under its picture, or the picture\'s own Lightbox caption;\n- Gallery thumbnails, when you turn them on.'
+    },
+    {
+        path: '/building-sites/besigner/lightbox',
+        title: 'Lightboxes',
+        heading: 'A lightbox of your own',
+        anchor: '#lightbox-element',
+        text: 'The Lightbox element (Surface group) is a container: drop any elements in it — text, a form, a video, pictures, buttons. It is hidden on the published page until something opens it.\nTo open it, give a button, link or picture an interaction: When clicked → Show an element, and pick the Lightbox as the target. Show/hide an element toggles it, and Hide an element on a button inside it closes it — a Done button, say. See Interactions.\n- Accessible name — what a screen reader announces when it opens, such as Book a call. The close button is named after it.\nOn the canvas the Lightbox is a small chip. Select it, or anything inside it, and it opens over the design surface at its real size, so you design its contents as visitors will see them.'
+    },
+    {
+        path: '/building-sites/besigner/lightbox',
+        title: 'Lightboxes',
+        heading: 'How a lightbox looks and closes',
+        anchor: '#lightbox-settings',
+        text: 'Every element that opens a lightbox has the same settings, shown once its lightbox is on:\n| Setting | What it does |\n| Lightbox backdrop color | The color behind the lightbox. Empty keeps the dark backdrop. |\n| Lightbox backdrop opacity | 0 (clear) to 100 (solid). |\n| Lightbox backdrop blur | Blurs the page behind, in pixels. |\n| Lightbox max width / max height | The largest the lightbox frame grows, such as 1200px or 90vh. |\n| Lightbox padding | Space inside the frame. |\n| Lightbox corner radius | Rounds the frame\'s corners, in pixels. |\n| Lightbox close button | An icon, an icon on a circle, or the word Close. |\n| Lightbox close position | The frame\'s top right or top left, or the screen\'s top right. |\n| Lightbox caption | Below the picture, over the foot of it, or hidden. |\n| Lightbox transition | Fade, zoom or none. |\n| Close on backdrop click | On by default. |\n| Close on Escape | On by default. |\nInside a reusable component, every one of these can be bound to one of the component\'s properties, the way the Video\'s Open in a lightbox can — so each place the component goes can choose, for instance, whether its picture opens large.'
+    },
+    {
+        path: '/building-sites/besigner/lightbox',
+        title: 'Lightboxes',
+        heading: 'For every visitor',
+        anchor: '#lightbox-accessibility',
+        text: '- The lightbox is announced as a dialog, by name, and the rest of the page is set aside for screen readers while it is open.\n- The keyboard stays inside it until it closes, and returns to whatever opened it.\n- Esc closes it, unless you turned Close on Escape off.\n- A visitor who asks their device for reduced motion gets no transition, whatever you chose.'
+    },
+    {
+        path: '/building-sites/besigner/lightbox',
+        title: 'Lightboxes',
+        heading: 'What it costs a page',
+        anchor: '#lightbox-performance',
+        text: 'Nothing until it opens. The lightbox\'s own code is fetched the first time a visitor points at or presses something that opens one. A gallery\'s full-size pictures are fetched when they are shown, not before. The contents of a Lightbox element are not in the page at all until it opens — a video or a form inside one makes no request until then. That also means search engines do not read what is inside a Lightbox element; keep anything a page needs to rank for on the page itself.'
+    },
+    {
+        path: '/building-sites/besigner/lightbox',
+        title: 'Lightboxes',
+        heading: 'Sites Aglyn AI builds',
+        anchor: '#lightbox-ai',
+        text: 'A portfolio or photography site that Aglyn AI builds opens its galleries in a lightbox: the pictures of each gallery section are one gallery, named for the section, with each item\'s title as its caption. On any site, Aglyn AI can ask for a single picture to open large. You can turn either off on the Image afterwards.'
+    },
+    {
+        path: '/building-sites/besigner/lightbox',
+        title: 'Lightboxes',
+        heading: 'Related',
+        anchor: '#related',
+        text: '- Video — the film\'s lightbox and its controls.\n- Interactions & custom HTML — opening a Lightbox from anything.\n- Element catalog — the Image, the Image List and the Lightbox.'
+    },
     {
         path: '/building-sites/besigner/live-co-editing',
         title: 'Live co-editing & unsaved work',
@@ -1999,6 +2069,41 @@ export const DOCS_SECTION_INDEX = [
         anchor: '#related',
         text: '- Drag-and-drop hierarchy\n- The Besigner\n- The inspector'
     },
+    {
+        path: '/building-sites/besigner/music-player',
+        title: 'Music player',
+        heading: '',
+        anchor: '',
+        text: 'Music player\nThe Music player element plays your own music on your site: one track, or a playlist of Track elements. It plays audio from your media library, with its own controls — play and pause, previous and next for a playlist, a seek bar with the time, and volume — that work with a keyboard and a screen reader.'
+    },
+    {
+        path: '/building-sites/besigner/music-player',
+        title: 'Music player',
+        heading: 'Adding tracks',
+        anchor: '#adding-tracks',
+        text: '1. Upload your audio to the media library. MP3, M4A, AAC, OGG and WAV files are accepted.\n2. Add a Music player to the page. A new player shows add your tracks in the Besigner and nothing on the published page until it has one.\n3. Choose its Audio with Browse media, which lists only audio files, and fill in the Track title, the Artist and, if you like, the Cover art.\n4. For a playlist, use the Music playlist preset, or add Track elements inside the player. They play in the order the page shows them, and each one plays when a visitor presses it.\nA player can also play a track from an https: address somewhere else, but only once you switch on I own this audio or have a license to use it on my site for that track. Until then the published player says the track is unavailable.\nPlan availability Audio uploads are file uploads, so they follow the same plan as video and document uploads, and they count toward your media storage.'
+    },
+    {
+        path: '/building-sites/besigner/music-player',
+        title: 'Music player',
+        heading: 'Your rights to the music',
+        anchor: '#rights',
+        text: 'Only put music on your site that you made, or that you have a license to publish. A song by another artist cannot be played on your site without the rights holder\'s permission, however it reaches the page.\n- Every audio upload asks first. Before an audio file is uploaded — and before one replaces another — the media library asks you to confirm that you own it or have a license to use it on your site. The file is not sent until you do. Your answer is stored with the file, with who gave it and when. The REST API asks the same question: an audio upload to POST /v1/media needs "rightsConfirmed": true.\n- External addresses need the same answer, given on the track itself.\n- No download button. The player has no download control and does not offer the browser\'s save menu on its audio.\n- Aglyn AI never adds music. Assist and AI site jobs place an empty player for you to fill with your own uploads. They do not find, link or embed recordings, and Assist declines a request for a named artist\'s songs.'
+    },
+    {
+        path: '/building-sites/besigner/music-player',
+        title: 'Music player',
+        heading: 'Copyright takedowns',
+        anchor: '#takedowns',
+        text: 'When a rights holder reports a track, Aglyn takes the file down. It stays in your media library, but it stops being served everywhere it is used: a Music player shows This track is unavailable, and your media library shows the notice. A takedown is reversible, and a file that was taken down by mistake is restored.\nRights holders send notices, and site owners send counter-notices, through the copyright (DMCA) page. Repeated infringement can close an account under the Acceptable Use Policy.'
+    },
+    {
+        path: '/building-sites/besigner/music-player',
+        title: 'Music player',
+        heading: 'Related',
+        anchor: '#related',
+        text: '- Media Library & CDN — uploads, folders and delivery\n- Video — the Video element, for films'
+    },
     {
         path: '/building-sites/besigner/overview',
         title: 'The Besigner',
@@ -2473,7 +2578,7 @@ export const DOCS_SECTION_INDEX = [
         title: 'Video',
         heading: 'Opening in a lightbox',
         anchor: '#video-lightbox',
-        text: 'Turn on Open in a lightbox and the poster becomes a play button that opens the film full size over the page, with a close button and Esc to dismiss. It needs a poster; without one the player stays in the page as usual.\nThe lightbox has its own player controls: play, a seek bar with the time, mute and volume, captions when the video has a captions file, and full screen. Each one works from the keyboard. Space or K plays and pauses, the left and right arrows skip five seconds, M mutes, F goes full screen, and Esc closes the lightbox from any control, leaving full screen first if it is on.'
+        text: 'Turn on Open in a lightbox and the poster becomes a play button that opens the film full size over the page, with a close button and Esc to dismiss. It needs a poster; without one the player stays in the page as usual.\nThe lightbox has its own player controls: play, a seek bar with the time, mute and volume, captions when the video has a captions file, and full screen. Each one works from the keyboard. Space or K plays and pauses, the left and right arrows skip five seconds, M mutes, F goes full screen, and Esc closes the lightbox from any control, leaving full screen first if it is on.\nThe lightbox\'s backdrop, size, corners, close button and transition are set with the same Lightbox settings every element has — see How a lightbox looks and closes. Left alone, the film\'s lightbox is wide and black, as it always was.'
     },
     {
         path: '/building-sites/besigner/video',
@@ -6918,7 +7023,7 @@ export const DOCS_SECTION_INDEX = [
         title: 'Media Library & CDN',
         heading: 'Upload',
         anchor: '#upload',
-        text: '- Upload images, PDFs, ZIP archives and documents (Word, Excel, PowerPoint, CSV, RTF, plain text, Markdown and JSON). Click Upload media, or drag files straight from your desktop onto the library — dropped files land in the folder you have open.\n- Video uploads are paused. New MP4, WebM and QuickTime files are not accepted on any plan for now, from the console or the API, and a video\'s file cannot be replaced. Videos already in your library keep playing, and the Video element can still use them. While the pause lasts, the library shows a Video uploads paused chip beside Upload media.\n- Create images with AI. Create with AI, beside Upload media, draws an illustration, icon, pattern or logo mark as an SVG from a description, or, where photos are on, makes a photo, a piece of art such as a watercolor or a 3D render, or a design asset such as a banner or a social post graphic, and adds it to the folder you have open with alt text. Each picture is stored like an upload and costs AI credits — see Create images with AI.\n- Web fonts (WOFF2) are accepted too. The usual way to add one is Upload your own font in the theme editor, which checks the font\'s license, converts a TTF, OTF or WOFF to WOFF2 and stores it here.\n- Documents and archives are stored and served exactly as you uploaded them — nothing is opened, extracted or converted. Macro-enabled Office files (.docm, .xlsm, .pptm) are not accepted.\n- Rename, replace the file behind an asset, and edit images in place. Replace works for images, PDFs, archives and documents alike, and for video once video uploads resume — it is available from the asset\'s details drawer and straight from the card\'s overflow menu, and it keeps the asset\'s link, folder, tags, alt text, custom fields and sharing exactly as they were. Swapping one kin'
+        text: '- Upload images, PDFs, ZIP archives and documents (Word, Excel, PowerPoint, CSV, RTF, plain text, Markdown and JSON). Click Upload media, or drag files straight from your desktop onto the library — dropped files land in the folder you have open.\n- Video uploads are paused. New MP4, WebM and QuickTime files are not accepted on any plan for now, from the console or the API, and a video\'s file cannot be replaced. Videos already in your library keep playing, and the Video element can still use them. While the pause lasts, the library shows a Video uploads paused chip beside Upload media.\n- Upload audio — MP3, M4A, AAC, OGG and WAV — to play your own music with the Music player. Each audio upload first asks you to confirm you own the audio or have a license to use it on your site; see Your rights to the music.\n- Create images with AI. Create with AI, beside Upload media, draws an illustration, icon, pattern or logo mark as an SVG from a description, or, where photos are on, makes a photo, a piece of art such as a watercolor or a 3D render, or a design asset such as a banner or a social post graphic, and adds it to the folder you have open with alt text. Each picture is stored like an upload and costs AI credits — see Create images with AI.\n- Web fonts (WOFF2) are accepted too. The usual way to add one is Upload your own font in the theme editor, which checks the font\'s license, converts a TTF, OTF or WOFF to WOFF2 and stores it here.\n- Documents and archives are stored and served exactly as you uploaded them — nothing is opened, extracted or converted. Macro-enabled Office files (.docm, .xlsm, .pptm) are not accepted.\n- Rename, replace the file behind an asset, and edit images in place. Replace works for images, PDFs, archives and documents alike, and for video once video up'
     },
     {
         path: '/content-and-data/media/overview',
@@ -8493,7 +8598,7 @@ export const DOCS_SECTION_INDEX = [
         title: 'Environment variables',
         heading: 'Scheduled jobs',
         anchor: '#cron',
-        text: 'Three separate mechanisms, and missing any of them is quiet rather than loud.\n| Variable | Need | When | Value |\n| CRONSECRET | Feature | Runtime | Shared secret every scheduled route checks, accepted as Authorization: Bearer or x-cron-secret: . Unset, every one of those routes refuses. openssl rand -hex 32. |\n| AGLYNJOBRUNNERURL | Feature (cloud functions) | Runtime | The tenant origin the every-minute beat POSTs: https://sites.example.com/api/plugins/run-jobs. No default, deliberately. |\n| AGLYNCONSOLEURL | Feature (cloud functions) | Runtime | The origin that serves your console — never one that redirects to it, because a redirect drops the POST body and the x-cron-secret header. It drives the fifteen-minute console sweeps and the every-minute AI jobs beat. No default, deliberately. |\n| CRMDIGESTTIMEZONE | Optional | Runtime | The zone /api/crm/daily-digest reads "today" in when it counts overdue and due-today tasks. Default America/Chicago, which is why the schedule below fires at 13:00 UTC; an IANA name (Europe/London). A value the runtime does not know falls back to the default with a warning. Schedule the route for 08:00 in whatever zone you set. |\nWhat CRONSECRET being unset silently switches off:\n- Scheduled campaign sends. You can schedule a campaign in the console, watch it be accepted, and watch its send time pass with nothing delivered and no error anywhere.\n- Audit archival, so the audit collection grows past its retention window and the retention promise goes quietly unkept.\n- Erasure runs, so personal data a customer asked you to delete is still there while the clock on that request runs.\n- Metered usage roll-up, so nothing is metered into Stripe and the monthly usage document is never written — which in turn means every usage budget is structurally unab'
+        text: 'Three separate mechanisms, and missing any of them is quiet rather than loud.\n| Variable | Need | When | Value |\n| CRONSECRET | Feature | Runtime | Shared secret every scheduled route checks, accepted as Authorization: Bearer or x-cron-secret: . Unset, every one of those routes refuses. openssl rand -hex 32. |\n| AGLYNJOBRUNNERURL | Feature (cloud functions) | Runtime | The tenant origin the every-minute beat POSTs: https://sites.example.com/api/plugins/run-jobs. No default, deliberately. |\n| AGLYNCONSOLEURL | Feature (cloud functions) | Runtime | The origin that serves your console — never one that redirects to it, because a redirect drops the POST body and the x-cron-secret header. It drives the fifteen-minute console sweeps and the every-minute AI jobs beat. No default, deliberately. |\n| AGLYNALLOWUNCONFIGUREDFUNCTIONS | Optional | Deploy | Set to 1 to let firebase deploy --only functions proceed when no dotenv in cloud/functions sets AGLYNCONSOLEURL and AGLYNJOBRUNNERURL. Unset — the default — the predeploy check refuses, because a deploy without them replaces each function\'s env and its scheduled jobs then skip every run. Set it only for a deploy that intentionally carries no scheduled jobs. |\n| CRMDIGESTTIMEZONE | Optional | Runtime | The zone /api/crm/daily-digest reads "today" in when it counts overdue and due-today tasks. Default America/Chicago, which is why the schedule below fires at 13:00 UTC; an IANA name (Europe/London). A value the runtime does not know falls back to the default with a warning. Schedule the route for 08:00 in whatever zone you set. |\nWhat CRONSECRET being unset silently switches off:\n- Scheduled campaign sends. You can schedule a campaign in the console, watch it be accepted, and watch its send time pass with nothing delivered and no erro'
     },
     {
         path: '/developers/self-hosting-environment',
@@ -11293,7 +11398,7 @@ export const DOCS_SECTION_INDEX = [
         title: 'Invite teammates',
         heading: 'A member\'s page',
         anchor: '#member-page',
-        text: 'Open anyone from the Team page to see their own page: their role and site access, a Password card for helping them back in, what has been changed about them, everything they have done in the organization, and their AI usage and allotment.\nRole and site access {#member-access}\nThe Member card sets this person\'s organization role and job title and, for an editor or viewer, which sites they can reach. Roles are Admin, Editor and Viewer. Admins reach every site; for an editor or viewer, turn off Access to all sites and choose Editor, Viewer or No access on each site, so they see only those. Save applies the change; Remove from organization takes them off the team and frees their seat.\nEditing a member needs the admin role. The owner\'s role is not edited here — ownership moves under Settings → Transfer ownership.\nOne member\'s activity {#member-activity}\nActivity by this member lists everything this person has done in the organization — on its sites as well as at organization level — newest first. Above it, Changes to this member lists what others changed about them, such as role and access edits. Both need the Activity & audit log permission, the same as the organization\'s activity log.'
+        text: 'Open anyone from the Team page to see their own page: their role and site access, a Password card for helping them back in, what has been changed about them, everything they have done in the organization, and their AI usage and allotment.\nRole and site access {#member-access}\nThe Member card sets this person\'s organization role and job title and, for an editor or viewer, which sites they can reach. Roles are Admin, Editor and Viewer. Admins reach every site; for an editor or viewer, turn off Access to all sites and choose Editor, Viewer or No access on each site, so they see only those. Save applies the change; Remove from organization takes them off the team and frees their seat.\nEditing a member needs the admin role. The owner\'s role is not edited here — ownership moves under Settings → Transfer ownership.\nOne member\'s activity {#member-activity}\nActivity by this member lists everything this person has done in the organization — on its sites as well as at organization level — newest first. Above it, Changes to this member lists what others changed about them, such as role and access edits. Both need the Activity & audit log permission, the same as the organization\'s activity log.\nChanges to this member {#member-changes}\nChanges to this member lists what other people changed about this person, such as role and site-access edits, newest first, with who made each change and when. It reads the same entries as the organization\'s activity log, narrowed to the ones whose target is this member.'
     },
     {
         path: '/workspace-and-billing/teams-and-roles/invite-teammates',