@vielzeug/codex 26.10.14 → 26.10.16

package/data/refine.json

@@ -1728,6 +1728,193 @@
       }
     ]
   },
+  {
+    "kind": "variable",
+    "name": "CARD_TAG",
+    "type": {
+      "text": "'ore-card'"
+    },
+    "default": "'ore-card'",
+    "description": "A versatile card container with semantic slots for media, header, body, footer, and actions."
+  },
+  {
+    "kind": "class",
+    "name": "OreCardElement",
+    "tagName": "ore-card",
+    "customElement": true,
+    "description": "A versatile card container with semantic slots for media, header, body, footer, and actions.",
+    "summary": "",
+    "attributes": [
+      {
+        "name": "variant",
+        "type": {
+          "text": "'solid' | 'flat' | 'frost'"
+        },
+        "description": "Visual variant: 'solid' | 'flat' | 'frost'"
+      },
+      {
+        "name": "color",
+        "type": {
+          "text": "'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
+        },
+        "description": "Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
+      },
+      {
+        "name": "padding",
+        "type": {
+          "text": "'none' | 'sm' | 'md' | 'lg' | 'xl'"
+        },
+        "description": "Internal padding: 'none' | 'sm' | 'md' | 'lg' | 'xl'"
+      },
+      {
+        "name": "rounded",
+        "type": {
+          "text": "'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'"
+        },
+        "description": "Border radius: 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'"
+      },
+      {
+        "name": "elevation",
+        "type": {
+          "text": "'0' | '1' | '2' | '3' | '4' | '5'"
+        },
+        "description": "Shadow elevation: '0' | '1' | '2' | '3' | '4' | '5'"
+      },
+      {
+        "name": "orientation",
+        "type": {
+          "text": "string"
+        },
+        "description": "Card layout: 'horizontal'"
+      },
+      {
+        "name": "interactive",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Enable pointer/keyboard activation"
+      },
+      {
+        "name": "disabled",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Disable card interaction"
+      },
+      {
+        "name": "loading",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Show loading progress bar"
+      }
+    ],
+    "events": [
+      {
+        "name": "activate",
+        "description": "Emitted when an interactive card is activated. detail: { originalEvent: MouseEvent | KeyboardEvent; trigger: 'pointer' | 'keyboard' }",
+        "type": {
+          "text": "CustomEvent"
+        }
+      }
+    ],
+    "slots": [
+      {
+        "name": "media",
+        "description": "Media content displayed at top/left"
+      },
+      {
+        "name": "header",
+        "description": "Card header (title, subtitle)"
+      },
+      {
+        "name": "",
+        "description": "Main card content"
+      },
+      {
+        "name": "footer",
+        "description": "Card footer content"
+      },
+      {
+        "name": "actions",
+        "description": "Action buttons or links"
+      }
+    ],
+    "cssParts": [
+      {
+        "name": "card",
+        "description": "Card root container."
+      },
+      {
+        "name": "loading-bar",
+        "description": "Loading progress bar."
+      },
+      {
+        "name": "media",
+        "description": "Media slot container."
+      },
+      {
+        "name": "body",
+        "description": "Body content container."
+      },
+      {
+        "name": "header",
+        "description": "Header container."
+      },
+      {
+        "name": "content",
+        "description": "Content container."
+      },
+      {
+        "name": "footer",
+        "description": "Footer container."
+      },
+      {
+        "name": "actions",
+        "description": "Actions slot container."
+      }
+    ],
+    "cssProperties": [
+      {
+        "name": "--card-bg",
+        "description": "Background color"
+      },
+      {
+        "name": "--card-color",
+        "description": "Text color"
+      },
+      {
+        "name": "--card-border",
+        "description": "Border width"
+      },
+      {
+        "name": "--card-border-color",
+        "description": "Border color"
+      },
+      {
+        "name": "--card-radius",
+        "description": "Border radius"
+      },
+      {
+        "name": "--card-padding",
+        "description": "Internal padding"
+      },
+      {
+        "name": "--card-shadow",
+        "description": "Box shadow"
+      },
+      {
+        "name": "--card-hover-shadow",
+        "description": "Shadow on hover"
+      }
+    ],
+    "demos": [
+      {
+        "url": "",
+        "description": "```html\n<ore-card elevation=\"2\"><h3 slot=\"header\">Title</h3><p>Content</p></ore-card>\n<ore-card interactive color=\"primary\"><h3 slot=\"header\">Click me</h3></ore-card>\n<ore-card variant=\"frost\" color=\"secondary\">Frosted card</ore-card>\n```"
+      }
+    ]
+  },
   {
     "kind": "function",
     "name": "syncCoverflow",
@@ -1913,263 +2100,83 @@
     "cssParts": [
       {
         "name": "track",
-        "description": "The scrolling slide track element"
-      },
-      {
-        "name": "controls",
-        "description": "The prev/next button container"
-      },
-      {
-        "name": "indicators",
-        "description": "The indicator dots container"
-      },
-      {
-        "name": "prev-btn",
-        "description": "The previous-slide button"
-      },
-      {
-        "name": "next-btn",
-        "description": "The next-slide button"
-      }
-    ],
-    "cssProperties": [
-      {
-        "name": "--carousel-bg",
-        "description": "Slide area background"
-      },
-      {
-        "name": "--carousel-radius",
-        "description": "Border radius of the carousel"
-      },
-      {
-        "name": "--carousel-dot-bg",
-        "description": "Inactive indicator color (default: var(--color-contrast-300))"
-      },
-      {
-        "name": "--carousel-dot-active-bg",
-        "description": "Active indicator / fill color (default: var(--color-contrast-700))"
-      },
-      {
-        "name": "--carousel-transition-duration",
-        "description": "Slide transition duration (default 0.35s; 0s under prefers-reduced-motion)."
-      },
-      {
-        "name": "--carousel-min-height",
-        "description": "Minimum height when no explicit height is set (default 240px)"
-      },
-      {
-        "name": "--carousel-filmstrip-inactive",
-        "description": "Width (horizontal) or height (vertical) of inactive slides in filmstrip mode"
-      },
-      {
-        "name": "--carousel-filmstrip-gap",
-        "description": "Gap between slides in filmstrip mode"
-      },
-      {
-        "name": "--carousel-gallery-thumbnail",
-        "description": "Width (horizontal) or height (vertical) of thumbnail slides in gallery mode (default var(--size-24))"
-      },
-      {
-        "name": "--carousel-gallery-gap",
-        "description": "Gap between slides in gallery mode (default var(--size-2))"
-      },
-      {
-        "name": "--carousel-coverflow-size",
-        "description": "Card extent along the navigation axis (default var(--size-40))"
-      },
-      {
-        "name": "--carousel-coverflow-spacing",
-        "description": "Distance between cover centers (default var(--size-12))"
-      },
-      {
-        "name": "--carousel-coverflow-perspective",
-        "description": "Coverflow perspective (default calc(var(--size-64) * 4))"
-      }
-    ],
-    "demos": [
-      {
-        "url": "",
-        "description": "```html\n<ore-carousel label=\"Product highlights\" loop>\n  <ore-carousel-slide>Slide 1</ore-carousel-slide>\n  <ore-carousel-slide>Slide 2</ore-carousel-slide>\n  <ore-carousel-slide>Slide 3</ore-carousel-slide>\n</ore-carousel>\n```"
-      }
-    ]
-  },
-  {
-    "kind": "variable",
-    "name": "CARD_TAG",
-    "type": {
-      "text": "'ore-card'"
-    },
-    "default": "'ore-card'",
-    "description": "A versatile card container with semantic slots for media, header, body, footer, and actions."
-  },
-  {
-    "kind": "class",
-    "name": "OreCardElement",
-    "tagName": "ore-card",
-    "customElement": true,
-    "description": "A versatile card container with semantic slots for media, header, body, footer, and actions.",
-    "summary": "",
-    "attributes": [
-      {
-        "name": "variant",
-        "type": {
-          "text": "'solid' | 'flat' | 'frost'"
-        },
-        "description": "Visual variant: 'solid' | 'flat' | 'frost'"
-      },
-      {
-        "name": "color",
-        "type": {
-          "text": "'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
-        },
-        "description": "Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
-      },
-      {
-        "name": "padding",
-        "type": {
-          "text": "'none' | 'sm' | 'md' | 'lg' | 'xl'"
-        },
-        "description": "Internal padding: 'none' | 'sm' | 'md' | 'lg' | 'xl'"
-      },
-      {
-        "name": "elevation",
-        "type": {
-          "text": "'0' | '1' | '2' | '3' | '4' | '5'"
-        },
-        "description": "Shadow elevation: '0' | '1' | '2' | '3' | '4' | '5'"
-      },
-      {
-        "name": "orientation",
-        "type": {
-          "text": "string"
-        },
-        "description": "Card layout: 'horizontal'"
-      },
-      {
-        "name": "interactive",
-        "type": {
-          "text": "boolean"
-        },
-        "description": "Enable pointer/keyboard activation"
-      },
-      {
-        "name": "disabled",
-        "type": {
-          "text": "boolean"
-        },
-        "description": "Disable card interaction"
-      },
-      {
-        "name": "loading",
-        "type": {
-          "text": "boolean"
-        },
-        "description": "Show loading progress bar"
-      }
-    ],
-    "events": [
-      {
-        "name": "activate",
-        "description": "Emitted when an interactive card is activated. detail: { originalEvent: MouseEvent | KeyboardEvent; trigger: 'pointer' | 'keyboard' }",
-        "type": {
-          "text": "CustomEvent"
-        }
-      }
-    ],
-    "slots": [
-      {
-        "name": "media",
-        "description": "Media content displayed at top/left"
+        "description": "The scrolling slide track element"
       },
       {
-        "name": "header",
-        "description": "Card header (title, subtitle)"
+        "name": "controls",
+        "description": "The prev/next button container"
       },
       {
-        "name": "",
-        "description": "Main card content"
+        "name": "indicators",
+        "description": "The indicator dots container"
       },
       {
-        "name": "footer",
-        "description": "Card footer content"
+        "name": "prev-btn",
+        "description": "The previous-slide button"
       },
       {
-        "name": "actions",
-        "description": "Action buttons or links"
+        "name": "next-btn",
+        "description": "The next-slide button"
       }
     ],
-    "cssParts": [
-      {
-        "name": "card",
-        "description": "Card root container."
-      },
-      {
-        "name": "loading-bar",
-        "description": "Loading progress bar."
-      },
+    "cssProperties": [
       {
-        "name": "media",
-        "description": "Media slot container."
+        "name": "--carousel-bg",
+        "description": "Slide area background"
       },
       {
-        "name": "body",
-        "description": "Body content container."
+        "name": "--carousel-radius",
+        "description": "Border radius of the carousel"
       },
       {
-        "name": "header",
-        "description": "Header container."
+        "name": "--carousel-dot-bg",
+        "description": "Inactive indicator color (default: var(--color-contrast-300))"
       },
       {
-        "name": "content",
-        "description": "Content container."
+        "name": "--carousel-dot-active-bg",
+        "description": "Active indicator / fill color (default: var(--color-contrast-700))"
       },
       {
-        "name": "footer",
-        "description": "Footer container."
+        "name": "--carousel-transition-duration",
+        "description": "Slide transition duration (default 0.35s; 0s under prefers-reduced-motion)."
       },
       {
-        "name": "actions",
-        "description": "Actions slot container."
-      }
-    ],
-    "cssProperties": [
-      {
-        "name": "--card-bg",
-        "description": "Background color"
+        "name": "--carousel-min-height",
+        "description": "Minimum height when no explicit height is set (default 240px)"
       },
       {
-        "name": "--card-color",
-        "description": "Text color"
+        "name": "--carousel-filmstrip-inactive",
+        "description": "Width (horizontal) or height (vertical) of inactive slides in filmstrip mode"
       },
       {
-        "name": "--card-border",
-        "description": "Border width"
+        "name": "--carousel-filmstrip-gap",
+        "description": "Gap between slides in filmstrip mode"
       },
       {
-        "name": "--card-border-color",
-        "description": "Border color"
+        "name": "--carousel-gallery-thumbnail",
+        "description": "Width (horizontal) or height (vertical) of thumbnail slides in gallery mode (default var(--size-24))"
       },
       {
-        "name": "--card-radius",
-        "description": "Border radius"
+        "name": "--carousel-gallery-gap",
+        "description": "Gap between slides in gallery mode (default var(--size-2))"
       },
       {
-        "name": "--card-padding",
-        "description": "Internal padding"
+        "name": "--carousel-coverflow-size",
+        "description": "Card extent along the navigation axis (default var(--size-40))"
       },
       {
-        "name": "--card-shadow",
-        "description": "Box shadow"
+        "name": "--carousel-coverflow-spacing",
+        "description": "Distance between cover centers (default var(--size-12))"
       },
       {
-        "name": "--card-hover-shadow",
-        "description": "Shadow on hover"
+        "name": "--carousel-coverflow-perspective",
+        "description": "Coverflow perspective (default calc(var(--size-64) * 4))"
       }
     ],
     "demos": [
       {
         "url": "",
-        "description": "```html\n<ore-card elevation=\"2\"><h3 slot=\"header\">Title</h3><p>Content</p></ore-card>\n<ore-card interactive color=\"primary\"><h3 slot=\"header\">Click me</h3></ore-card>\n<ore-card variant=\"frost\" color=\"secondary\">Frosted card</ore-card>\n```"
+        "description": "```html\n<ore-carousel label=\"Product highlights\" loop>\n  <ore-carousel-slide>Slide 1</ore-carousel-slide>\n  <ore-carousel-slide>Slide 2</ore-carousel-slide>\n  <ore-carousel-slide>Slide 3</ore-carousel-slide>\n</ore-carousel>\n```"
       }
     ]
   },
@@ -3493,7 +3500,7 @@
     "cssProperties": [
       {
         "name": "--rank-number-color",
-        "description": "Rank numeral color (default --color-contrast-500)"
+        "description": "Rank numeral color (default --color-contrast-600)"
       },
       {
         "name": "--rank-number-width",
@@ -3505,7 +3512,7 @@
       },
       {
         "name": "--rank-track-color",
-        "description": "Bar track color (default --color-contrast-100)"
+        "description": "Bar track color (default --color-contrast-200)"
       },
       {
         "name": "--rank-bar-height",
@@ -3644,10 +3651,10 @@
     "kind": "variable",
     "name": "SPEECH_RATES",
     "type": {
-      "text": "[1, 0.85, 1.15, 1.5]"
+      "text": "[1, 1.15, 1.5, 0.85]"
     },
-    "default": "[1, 0.85, 1.15, 1.5]",
-    "description": "The playback multipliers the speed control cycles through."
+    "default": "[1, 1.15, 1.5, 0.85]",
+    "description": "The playback multipliers the speed control cycles through, in cycle order: the first\ntap from the default 1× speeds the reading up, and the slow step returns last."
   },
   {
     "kind": "function",
@@ -3667,6 +3674,37 @@
     ],
     "description": "The entry's sentences: prose ends . ! or ?, closing quotes belong to the sentence\nthey end, and an unterminated tail is still a sentence. Consumers that highlight what\nis being read build their display from this same list, so `progress` sentence indexes\nmap onto their own."
   },
+  {
+    "kind": "function",
+    "name": "pickVoice",
+    "return": {
+      "type": {
+        "text": "VoiceCandidate | null"
+      }
+    },
+    "parameters": [
+      {
+        "name": "voices",
+        "type": {
+          "text": "VoiceCandidate[]"
+        }
+      },
+      {
+        "name": "lang",
+        "type": {
+          "text": "string | null"
+        }
+      },
+      {
+        "name": "name",
+        "optional": true,
+        "type": {
+          "text": "string"
+        }
+      }
+    ],
+    "description": "The voice to read with: an exact (then substring, case-insensitive) name match wins;\notherwise the best-ranked voice for `lang`, or `null` to leave the choice to the\nengine's own `lang` hint."
+  },
   {
     "kind": "variable",
     "name": "SPEECH_PLAYER_TAG",
@@ -3674,14 +3712,14 @@
       "text": "'ore-speech-player'"
     },
     "default": "'ore-speech-player'",
-    "description": "A text-to-speech player control: reads its `text` aloud through the Web Speech API.\n\nRenders a labeled play/pause toggle (the label folds away once engaged), a stop\ncontrol beside it that appears while reading, and a speed control cycling\n1×/0.85×/1.15×/1.5×. The text is spoken sentence by sentence (long sentences split into pieces under the\nengine's truncation window), the `state` attribute reflects playback, a\n`role=\"status\"` live region announces transitions, and `progress` events name the\nsentence being read so a consumer can highlight it. Only one player speaks at a\ntime: starting one stops any other. `resume-at` names the sentence to begin from,\nso a persisted position makes resume mean it."
+    "description": "A text-to-speech player control: reads its `text` aloud through the Web Speech API.\n\nRenders an icon-only play/pause toggle, a speed control cycling\n1×/1.15×/1.5×/0.85×, a stop control that appears while reading, and a\nsentence-position readout. The text is spoken sentence by sentence (long sentences\nsplit into pieces under the\nengine's truncation window), the `state` attribute reflects playback, a\n`role=\"status\"` live region announces transitions, and `progress` events name the\nsentence being read so a consumer can highlight it. While reading, the Media Session\nAPI (where available) exposes play/pause/stop to the browser's own media controls.\nOnly one player speaks at a time: starting one stops any other. `resume-at` names the\nsentence to begin from, so a persisted position makes resume mean it."
   },
   {
     "kind": "class",
     "name": "OreSpeechPlayerElement",
     "tagName": "ore-speech-player",
     "customElement": true,
-    "description": "A text-to-speech player control: reads its `text` aloud through the Web Speech API.\nRenders a labeled play/pause toggle (the label folds away once engaged), a stop\ncontrol beside it that appears while reading, and a speed control cycling\n1×/0.85×/1.15×/1.5×. The text is spoken sentence by sentence (long sentences split into pieces under the\nengine's truncation window), the `state` attribute reflects playback, a\n`role=\"status\"` live region announces transitions, and `progress` events name the\nsentence being read so a consumer can highlight it. Only one player speaks at a\ntime: starting one stops any other. `resume-at` names the sentence to begin from,\nso a persisted position makes resume mean it.",
+    "description": "A text-to-speech player control: reads its `text` aloud through the Web Speech API.\nRenders an icon-only play/pause toggle, a speed control cycling\n1×/1.15×/1.5×/0.85×, a stop control that appears while reading, and a\nsentence-position readout. The text is spoken sentence by sentence (long sentences\nsplit into pieces under the\nengine's truncation window), the `state` attribute reflects playback, a\n`role=\"status\"` live region announces transitions, and `progress` events name the\nsentence being read so a consumer can highlight it. While reading, the Media Session\nAPI (where available) exposes play/pause/stop to the browser's own media controls.\nOnly one player speaks at a time: starting one stops any other. `resume-at` names the\nsentence to begin from, so a persisted position makes resume mean it.\n  voice for `lang` is picked automatically",
     "summary": "",
     "attributes": [
       {
@@ -3710,7 +3748,28 @@
         "type": {
           "text": "number"
         },
-        "description": "Playback rate; the speed control cycles 1 → 0.85 → 1.15 → 1.5"
+        "description": "Playback rate; the speed control cycles 1 → 1.15 → 1.5 → 0.85"
+      },
+      {
+        "name": "pitch",
+        "type": {
+          "text": "number"
+        },
+        "description": "Voice pitch passed to the engine, 0 to 2 (1 is natural)"
+      },
+      {
+        "name": "volume",
+        "type": {
+          "text": "number"
+        },
+        "description": "Voice loudness passed to the engine, 0 to 1"
+      },
+      {
+        "name": "voice",
+        "type": {
+          "text": "string"
+        },
+        "description": "Name of the voice to read with; unset, the most natural-sounding"
       },
       {
         "name": "resume-at",
@@ -3771,15 +3830,15 @@
       },
       {
         "name": "play",
-        "description": "The play/pause toggle button"
+        "description": "The play/pause toggle (an `ore-button`: style its `button` part through it)"
       },
       {
         "name": "rate",
-        "description": "The speed control"
+        "description": "The speed control (an `ore-button`)"
       },
       {
         "name": "stop",
-        "description": "The stop button (hidden while idle)"
+        "description": "The stop button (an `ore-button`, hidden while idle)"
       }
     ],
     "cssProperties": [
@@ -3789,16 +3848,12 @@
       },
       {
         "name": "--speech-player-control-size",
-        "description": "Each control's hit-area size (the toggle grows with its label)"
+        "description": "Each control's hit-area size"
       },
       {
         "name": "--speech-player-icon-color",
         "description": "Control icon color at rest"
       },
-      {
-        "name": "--speech-player-active-color",
-        "description": "Toggle color while reading (playing or paused)"
-      },
       {
         "name": "--speech-player-hover-bg",
         "description": "Control background on hover"
@@ -3878,6 +3933,13 @@
           "text": "string"
         },
         "description": "Read-only playback state: idle | playing | paused | ended"
+      },
+      {
+        "name": "fullscreen",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Read-only; present while the reader fills the screen"
       }
     ],
     "events": [
@@ -3946,7 +4008,11 @@
     "cssProperties": [
       {
         "name": "--speed-reading-font-size",
-        "description": "Display type size (default var(--text-2xl))"
+        "description": "Maximum display type size (default var(--text-3xl))"
+      },
+      {
+        "name": "--speed-reading-fullscreen-font-size",
+        "description": "Maximum fullscreen display type size (default min(10vw, var(--size-96)))"
       },
       {
         "name": "--speed-reading-min-font-size",
@@ -4887,216 +4953,84 @@
     "name": "ACCORDION_TAG",
     "type": {
       "text": "'ore-accordion'"
-    },
-    "default": "'ore-accordion'",
-    "description": "A container for accordion items with single or multiple selection modes."
-  },
-  {
-    "kind": "class",
-    "name": "OreAccordionElement",
-    "tagName": "ore-accordion",
-    "customElement": true,
-    "description": "A container for accordion items with single or multiple selection modes.",
-    "summary": "",
-    "attributes": [
-      {
-        "name": "selection-mode",
-        "type": {
-          "text": "'single' | 'multiple'"
-        },
-        "description": "Selection mode: 'single' | 'multiple'"
-      },
-      {
-        "name": "size",
-        "type": {
-          "text": "'sm' | 'md' | 'lg'"
-        },
-        "description": "Size for all items: 'sm' | 'md' | 'lg' (propagated to children)"
-      },
-      {
-        "name": "variant",
-        "type": {
-          "text": "'solid' | 'flat' | 'bordered' | 'text' | 'frost'"
-        },
-        "description": "Visual variant: 'solid' | 'flat' | 'bordered' | 'text' | 'frost' (propagated to children)"
-      }
-    ],
-    "events": [
-      {
-        "name": "expand",
-        "description": "Emitted when an item expands. detail: { expanded: boolean; item: HTMLElement }",
-        "type": {
-          "text": "CustomEvent"
-        }
-      },
-      {
-        "name": "change",
-        "description": "Emitted when selection changes (single mode). detail: { expandedItem: HTMLElement }",
-        "type": {
-          "text": "CustomEvent"
-        }
-      }
-    ],
-    "slots": [
-      {
-        "name": "",
-        "description": "`ore-accordion-item` elements"
-      }
-    ],
-    "cssProperties": [
-      {
-        "name": "--accordion-bg",
-        "description": "Container background color (solid/flat/frost variants)"
-      },
-      {
-        "name": "--accordion-border-color",
-        "description": "Container border color (solid/flat variants)"
-      },
-      {
-        "name": "--accordion-divider-color",
-        "description": "Divider color between items (text variant)"
-      },
-      {
-        "name": "--accordion-shadow",
-        "description": "Container box shadow"
-      }
-    ],
-    "demos": [
-      {
-        "url": "",
-        "description": "```html\n<ore-accordion selection-mode=\"single\">\n  <ore-accordion-item>\n    <span slot=\"title\">What is Refine?</span>\n    <p>Refine is a headless web component library.</p>\n  </ore-accordion-item>\n  <ore-accordion-item>\n    <span slot=\"title\">How do I install it?</span>\n    <p>Run <code>npm install @vielzeug/refine</code>.</p>\n  </ore-accordion-item>\n</ore-accordion>\n<ore-accordion variant=\"bordered\" selection-mode=\"multiple\">\n  <ore-accordion-item expanded><span slot=\"title\">Open by default</span><p>Content</p></ore-accordion-item>\n</ore-accordion>\n```"
-      }
-    ]
-  },
-  {
-    "kind": "variable",
-    "name": "TAB_ITEM_TAG",
-    "type": {
-      "text": "'ore-tab-item'"
-    },
-    "default": "'ore-tab-item'",
-    "description": "Individual tab trigger. Must be placed in the `tabs` slot of `ore-tabs`."
-  },
-  {
-    "kind": "class",
-    "name": "OreTabItemElement",
-    "tagName": "ore-tab-item",
-    "customElement": true,
-    "description": "Individual tab trigger. Must be placed in the `tabs` slot of `ore-tabs`.",
-    "summary": "",
-    "attributes": [
-      {
-        "name": "value",
-        "type": {
-          "text": "string"
-        },
-        "description": "Unique identifier, matches the corresponding ore-tab-panel value"
-      },
-      {
-        "name": "active",
-        "type": {
-          "text": "boolean"
-        },
-        "description": "Set by the parent ore-tabs when this tab is selected"
-      },
-      {
-        "name": "disabled",
-        "type": {
-          "text": "boolean"
-        },
-        "description": "Prevents selection"
-      },
+    },
+    "default": "'ore-accordion'",
+    "description": "A container for accordion items with single or multiple selection modes."
+  },
+  {
+    "kind": "class",
+    "name": "OreAccordionElement",
+    "tagName": "ore-accordion",
+    "customElement": true,
+    "description": "A container for accordion items with single or multiple selection modes.",
+    "summary": "",
+    "attributes": [
       {
-        "name": "density",
+        "name": "selection-mode",
         "type": {
-          "text": "'default' | 'compact'"
+          "text": "'single' | 'multiple'"
         },
-        "description": "Inherited spatial density: 'default' | 'compact'"
+        "description": "Selection mode: 'single' | 'multiple'"
       },
       {
         "name": "size",
         "type": {
           "text": "'sm' | 'md' | 'lg'"
         },
-        "description": "'sm' | 'md' | 'lg'"
+        "description": "Size for all items: 'sm' | 'md' | 'lg' (propagated to children)"
       },
       {
         "name": "variant",
         "type": {
-          "text": "'solid' | 'flat' | 'bordered' | 'ghost' | 'frost'"
-        },
-        "description": "Inherited from ore-tabs: 'solid' | 'flat' | 'bordered' | 'ghost' | 'frost'"
-      },
-      {
-        "name": "color",
-        "type": {
-          "text": "'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
+          "text": "'solid' | 'flat' | 'bordered' | 'text' | 'frost'"
         },
-        "description": "Inherited from ore-tabs: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
+        "description": "Visual variant: 'solid' | 'flat' | 'bordered' | 'text' | 'frost' (propagated to children)"
       }
     ],
-    "slots": [
-      {
-        "name": "prefix",
-        "description": "Icon or content before the label"
-      },
+    "events": [
       {
-        "name": "",
-        "description": "Tab label"
+        "name": "expand",
+        "description": "Emitted when an item expands. detail: { expanded: boolean; item: HTMLElement }",
+        "type": {
+          "text": "CustomEvent"
+        }
       },
       {
-        "name": "suffix",
-        "description": "Badge or count after the label"
+        "name": "change",
+        "description": "Emitted when selection changes (single mode). detail: { expandedItem: HTMLElement }",
+        "type": {
+          "text": "CustomEvent"
+        }
       }
     ],
-    "cssParts": [
+    "slots": [
       {
-        "name": "tab",
-        "description": "Tab trigger element."
+        "name": "",
+        "description": "`ore-accordion-item` elements"
       }
     ],
     "cssProperties": [
       {
-        "name": "--tab-item-radius",
-        "description": "Button border radius"
-      },
-      {
-        "name": "--tab-item-transition",
-        "description": "Transition duration/easing"
-      },
-      {
-        "name": "--tab-item-padding",
-        "description": "Button padding"
-      },
-      {
-        "name": "--tab-item-font-size",
-        "description": "Button font size"
-      },
-      {
-        "name": "--tab-item-color",
-        "description": "Default text color"
-      },
-      {
-        "name": "--tab-item-hover-bg",
-        "description": "Background on hover"
+        "name": "--accordion-bg",
+        "description": "Container background color (solid/flat/frost variants)"
       },
       {
-        "name": "--tab-item-active-bg",
-        "description": "Background when active/selected"
+        "name": "--accordion-border-color",
+        "description": "Container border color (solid/flat variants)"
       },
       {
-        "name": "--tab-item-active-color",
-        "description": "Text color when active/selected"
+        "name": "--accordion-divider-color",
+        "description": "Divider color between items (text variant)"
       },
       {
-        "name": "--tab-item-active-shadow",
-        "description": "Box shadow when active/selected"
+        "name": "--accordion-shadow",
+        "description": "Container box shadow"
       }
     ],
     "demos": [
       {
         "url": "",
-        "description": "```html\n<ore-tab-item slot=\"tabs\" value=\"overview\">Overview</ore-tab-item>\n<ore-tab-item slot=\"tabs\" value=\"settings\" disabled>Settings</ore-tab-item>\n```"
+        "description": "```html\n<ore-accordion selection-mode=\"single\">\n  <ore-accordion-item>\n    <span slot=\"title\">What is Refine?</span>\n    <p>Refine is a headless web component library.</p>\n  </ore-accordion-item>\n  <ore-accordion-item>\n    <span slot=\"title\">How do I install it?</span>\n    <p>Run <code>npm install @vielzeug/refine</code>.</p>\n  </ore-accordion-item>\n</ore-accordion>\n<ore-accordion variant=\"bordered\" selection-mode=\"multiple\">\n  <ore-accordion-item expanded><span slot=\"title\">Open by default</span><p>Content</p></ore-accordion-item>\n</ore-accordion>\n```"
       }
     ]
   },
@@ -5287,6 +5221,138 @@
       }
     ]
   },
+  {
+    "kind": "variable",
+    "name": "TAB_ITEM_TAG",
+    "type": {
+      "text": "'ore-tab-item'"
+    },
+    "default": "'ore-tab-item'",
+    "description": "Individual tab trigger. Must be placed in the `tabs` slot of `ore-tabs`."
+  },
+  {
+    "kind": "class",
+    "name": "OreTabItemElement",
+    "tagName": "ore-tab-item",
+    "customElement": true,
+    "description": "Individual tab trigger. Must be placed in the `tabs` slot of `ore-tabs`.",
+    "summary": "",
+    "attributes": [
+      {
+        "name": "value",
+        "type": {
+          "text": "string"
+        },
+        "description": "Unique identifier, matches the corresponding ore-tab-panel value"
+      },
+      {
+        "name": "active",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Set by the parent ore-tabs when this tab is selected"
+      },
+      {
+        "name": "disabled",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Prevents selection"
+      },
+      {
+        "name": "density",
+        "type": {
+          "text": "'default' | 'compact'"
+        },
+        "description": "Inherited spatial density: 'default' | 'compact'"
+      },
+      {
+        "name": "size",
+        "type": {
+          "text": "'sm' | 'md' | 'lg'"
+        },
+        "description": "'sm' | 'md' | 'lg'"
+      },
+      {
+        "name": "variant",
+        "type": {
+          "text": "'solid' | 'flat' | 'bordered' | 'ghost' | 'frost'"
+        },
+        "description": "Inherited from ore-tabs: 'solid' | 'flat' | 'bordered' | 'ghost' | 'frost'"
+      },
+      {
+        "name": "color",
+        "type": {
+          "text": "'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
+        },
+        "description": "Inherited from ore-tabs: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
+      }
+    ],
+    "slots": [
+      {
+        "name": "prefix",
+        "description": "Icon or content before the label"
+      },
+      {
+        "name": "",
+        "description": "Tab label"
+      },
+      {
+        "name": "suffix",
+        "description": "Badge or count after the label"
+      }
+    ],
+    "cssParts": [
+      {
+        "name": "tab",
+        "description": "Tab trigger element."
+      }
+    ],
+    "cssProperties": [
+      {
+        "name": "--tab-item-radius",
+        "description": "Button border radius"
+      },
+      {
+        "name": "--tab-item-transition",
+        "description": "Transition duration/easing"
+      },
+      {
+        "name": "--tab-item-padding",
+        "description": "Button padding"
+      },
+      {
+        "name": "--tab-item-font-size",
+        "description": "Button font size"
+      },
+      {
+        "name": "--tab-item-color",
+        "description": "Default text color"
+      },
+      {
+        "name": "--tab-item-hover-bg",
+        "description": "Background on hover"
+      },
+      {
+        "name": "--tab-item-active-bg",
+        "description": "Background when active/selected"
+      },
+      {
+        "name": "--tab-item-active-color",
+        "description": "Text color when active/selected"
+      },
+      {
+        "name": "--tab-item-active-shadow",
+        "description": "Box shadow when active/selected"
+      }
+    ],
+    "demos": [
+      {
+        "url": "",
+        "description": "```html\n<ore-tab-item slot=\"tabs\" value=\"overview\">Overview</ore-tab-item>\n<ore-tab-item slot=\"tabs\" value=\"settings\" disabled>Settings</ore-tab-item>\n```"
+      }
+    ]
+  },
   {
     "kind": "variable",
     "name": "TAB_PANEL_TAG",
@@ -6050,6 +6116,10 @@
       {
         "name": "chip",
         "description": "Shadow part for the `chip` element."
+      },
+      {
+        "name": "label",
+        "description": "Text label, available for wrapping overrides."
       }
     ],
     "cssProperties": [
@@ -9746,19 +9816,20 @@
         }
       },
       {
-        "name": "key",
+        "name": "{ key, value }",
         "type": {
-          "text": "string"
+          "text": "QueryToken"
         }
       },
       {
-        "name": "value",
+        "name": "selection",
+        "default": "'single'",
         "type": {
-          "text": "string"
+          "text": "'single' | 'multiple'"
         }
       }
     ],
-    "description": "One value per key: a second token replaces the first and keeps the pill's slot."
+    "description": "Adds a distinct value, or replaces a single-selection key in its existing slot."
   },
   {
     "kind": "function",
@@ -9768,6 +9839,30 @@
         "text": "QueryState"
       }
     },
+    "parameters": [
+      {
+        "name": "state",
+        "type": {
+          "text": "QueryState"
+        }
+      },
+      {
+        "name": "token",
+        "type": {
+          "text": "QueryToken"
+        }
+      }
+    ],
+    "description": "Removes only the exact key/value pair, preserving other values of the same key."
+  },
+  {
+    "kind": "function",
+    "name": "clearTokens",
+    "return": {
+      "type": {
+        "text": "QueryState"
+      }
+    },
     "parameters": [
       {
         "name": "state",
@@ -9781,14 +9876,15 @@
           "text": "string"
         }
       }
-    ]
+    ],
+    "description": "Clears all restrictions for one key."
   },
   {
     "kind": "function",
-    "name": "tokenValue",
+    "name": "tokenValues",
     "return": {
       "type": {
-        "text": "string | undefined"
+        "text": "string[]"
       }
     },
     "parameters": [
@@ -9878,7 +9974,7 @@
       "text": "'ore-query-bar'"
     },
     "default": "'ore-query-bar'",
-    "description": "A search field that accepts free text and `key:value` tokens together, in the\ngrammar GitHub's pull-request search made familiar. Committed tokens render as\nremovable pills inside the field; a suggestion dropdown lists the vocabulary's\nkeys and matching values while typing, so phones never need to type a colon.\n\nThe bar is state-driven: `vocabulary` defines the token keys and their accepted\nvalues, `state` carries `{ text, tokens }`, and every edit emits `input` +\n`change` with the new state readable from the element's `state` property. Omit\n`state` for uncontrolled use. External `state` writes whose `tokens` array is\nidentical to the current one are treated as echoes — only token changes are\nadopted — so text-only round-trips never wipe the field's live draft.\n\nThe dropdown opens while the field holds focus (and reopens on typing after\nEscape) and overlays the page from the top layer. Picking a key suggestion\nstarts composing `key:`; picking a value commits its pill. Typing a complete\n`key:value` commits immediately. Backspace on an empty field removes the last\npill. A draft whose value matches nothing shows a \"searching as text\" row\ninstead of closing; on blur, a bare `key:` fragment reverts and a dead draft\ndegrades into the searched text, so the field never carries silent residue."
+    "description": "A search field that accepts free text and `key:value` tokens together, in the\ngrammar GitHub's pull-request search made familiar. Applied filters stay inside\nthe field. A drawer edits filters without typing; curated quick filters toggle\nimmediately. Each vocabulary key chooses single or multiple selection; repeated\nkeys accumulate distinct values only in multiple mode. Typed suggestions and\nthe drawer share one vocabulary and state.\n\nThe bar is state-driven: `vocabulary` defines the token keys and their accepted\nvalues, `state` carries `{ text, tokens }`, and every edit emits `input` +\n`change` with the new state readable from the element's `state` property. Omit\n`state` for uncontrolled use. Equivalent external states preserve live drafts;\nactual external changes replace both text and tokens and dismiss pending edits.\n\nThe dropdown opens while the field holds focus (and reopens on typing after\nEscape) and overlays the page from the top layer. Picking a key suggestion\nstarts composing `key:`; picking a value commits its pill. Typing a complete\n`key:value` commits immediately. Backspace on an empty field removes the last\npill. A draft whose value matches nothing shows a \"searching as text\" row\ninstead of closing; on blur, a bare `key:` fragment reverts and a dead draft\ndegrades into the searched text, so the field never carries silent residue."
   },
   {
     "kind": "variable",
@@ -10103,6 +10199,10 @@
       {
         "name": "items",
         "description": "Items container."
+      },
+      {
+        "name": "legend",
+        "description": "Group label."
       }
     ],
     "cssProperties": [
@@ -14200,6 +14300,75 @@
     ],
     "description": "Shared logic for floating-panel triggers (tooltip, popover).\n\nHandles:\n- Slot-based trigger element detection and rebinding\n- Event binding per trigger type (hover / focus / click)\n- Floating-element positioning via `@vielzeug/orbit`\n- Controlled mode via `openProp` watcher\n- Keyboard escape dismissal\n\nARIA binding is intentionally delegated to the caller via `bindTriggerAria`\nso that tooltip (`describedby`) and popover (`expanded`/`controls`/…) can diverge."
   },
+  {
+    "kind": "variable",
+    "name": "SPOTLIGHT_TAG",
+    "type": {
+      "text": "'ore-spotlight'"
+    },
+    "default": "'ore-spotlight'",
+    "description": "A dim layer with a hole punched in it, so one region of the page stays at full\nbrightness while everything else recedes.\n\nThe dim is a single oversized box-shadow on the cutout element, so the hole\nanimates with the element's own geometry: when a tour moves to the next step,\nthe highlight slides to the new target instead of blinking out and back.\n\nThe layer never captures pointer events: a beacon shows the way, it does not\nblock the road. The element inside the cutout stays clickable, and whatever\ndialog or popover owns the moment handles interaction and announcement: this\nlayer is decorative by definition and carries `aria-hidden`."
+  },
+  {
+    "kind": "class",
+    "name": "OreSpotlightElement",
+    "tagName": "ore-spotlight",
+    "customElement": true,
+    "description": "A dim layer with a hole punched in it, so one region of the page stays at full\nbrightness while everything else recedes.\nThe dim is a single oversized box-shadow on the cutout element, so the hole\nanimates with the element's own geometry: when a tour moves to the next step,\nthe highlight slides to the new target instead of blinking out and back.\nThe layer never captures pointer events: a beacon shows the way, it does not\nblock the road. The element inside the cutout stays clickable, and whatever\ndialog or popover owns the moment handles interaction and announcement: this\nlayer is decorative by definition and carries `aria-hidden`.",
+    "summary": "",
+    "attributes": [
+      {
+        "name": "radius",
+        "type": {
+          "text": "number"
+        },
+        "description": "Cutout corner radius in px (default: 8)",
+        "default": "8"
+      },
+      {
+        "name": "visible",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Show the dim layer (default: true)",
+        "default": "true"
+      }
+    ],
+    "cssParts": [
+      {
+        "name": "overlay",
+        "description": "The fixed dim layer."
+      },
+      {
+        "name": "cutout",
+        "description": "The highlighted rectangle."
+      }
+    ],
+    "cssProperties": [
+      {
+        "name": "--spotlight-dim",
+        "description": "Dim color (default: var(--color-scrim))"
+      },
+      {
+        "name": "--spotlight-ring",
+        "description": "Ring drawn around the cutout (default: none)"
+      },
+      {
+        "name": "--spotlight-radius",
+        "description": "Cutout corner radius"
+      },
+      {
+        "name": "--spotlight-transition",
+        "description": "Geometry transition (default: 240ms ease)"
+      }
+    ],
+    "demos": [
+      {
+        "url": "",
+        "description": "```html\n<ore-spotlight></ore-spotlight>\n<script type=\"module\">\n  import '@vielzeug/refine/spotlight';\n  const spotlight = document.querySelector('ore-spotlight');\n  spotlight.rect = document.querySelector('#cta').getBoundingClientRect();\n</script>\n```"
+      }
+    ]
+  },
   {
     "kind": "variable",
     "name": "TOOLTIP_TAG",
@@ -14320,5 +14489,274 @@
         "description": "```html\n<!-- Simple text tooltip -->\n<ore-tooltip content=\"Copy to clipboard\">\n  <button>Copy</button>\n</ore-tooltip>\n<!-- Placement and delay -->\n<ore-tooltip content=\"Save your work\" placement=\"right\" delay=\"300\">\n  <ore-icon name=\"save\"></ore-icon>\n</ore-tooltip>\n<!-- Hover + focus trigger -->\n<ore-tooltip content=\"Required field\" trigger=\"hover,focus\" placement=\"top\">\n  <ore-input label=\"Email\" type=\"email\"></ore-input>\n</ore-tooltip>\n<!-- Rich content slot -->\n<ore-tooltip>\n  <ore-button>Help</ore-button>\n  <div slot=\"content\">\n    <strong>Keyboard shortcuts</strong>\n    <p>Press Ctrl+S to save.</p>\n  </div>\n</ore-tooltip>\n```"
       }
     ]
+  },
+  {
+    "kind": "variable",
+    "name": "TOUR_PRESENTATIONS",
+    "type": {
+      "text": "['auto', 'bottom-sheet', 'modal', 'popover']"
+    },
+    "default": "['auto', 'bottom-sheet', 'modal', 'popover']"
+  },
+  {
+    "kind": "variable",
+    "name": "TOUR_TAG",
+    "type": {
+      "text": "'ore-tour'"
+    },
+    "default": "'ore-tour'",
+    "description": "The step card of a product tour: a compact dialog with title, body, progress,\nand Skip / Back / Next actions (Skip leads the row, away from Next).\n\nThe card is deliberately dumb: it owns no step logic and no persistence. It\nrenders the step the app hands it and emits `next` / `back` / `skip` /\n`finish` / `dismiss`; a `@vielzeug/beacon` tour handle (or any state the app\nalready keeps) decides what happens. `bind(handle)` wires both directions in\none call, or the app drives the `open`, `title`, `description`,\n`step-index`, and `anchor` props and listens to the events itself.\n\nPresentations: `popover` anchors the card to `anchor` with an Orbit\npositioner in the Popover API top layer; `modal` and `bottom-sheet` render a\nnative `<dialog>` (centered panel or bottom-anchored sheet) with the\nstandard focus trap and background lock; `auto` picks bottom-sheet on narrow\nviewports and popover otherwise.\n\nKeyboard: Escape requests dismissal (native in dialog presentations, keydown\nin popover mode); ArrowLeft / ArrowRight emit `back` / `next` while open."
+  },
+  {
+    "kind": "class",
+    "name": "OreTourElement",
+    "tagName": "ore-tour",
+    "customElement": true,
+    "description": "The step card of a product tour: a compact dialog with title, body, progress,\nand Skip / Back / Next actions (Skip leads the row, away from Next).\nThe card is deliberately dumb: it owns no step logic and no persistence. It\nrenders the step the app hands it and emits `next` / `back` / `skip` /\n`finish` / `dismiss`; a `@vielzeug/beacon` tour handle (or any state the app\nalready keeps) decides what happens. `bind(handle)` wires both directions in\none call, or the app drives the `open`, `title`, `description`,\n`step-index`, and `anchor` props and listens to the events itself.\nPresentations: `popover` anchors the card to `anchor` with an Orbit\npositioner in the Popover API top layer; `modal` and `bottom-sheet` render a\nnative `<dialog>` (centered panel or bottom-anchored sheet) with the\nstandard focus trap and background lock; `auto` picks bottom-sheet on narrow\nviewports and popover otherwise.\nKeyboard: Escape requests dismissal (native in dialog presentations, keydown\nin popover mode); ArrowLeft / ArrowRight emit `back` / `next` while open.\n  card and route the card's actions back into it. Returns an unsubscribe.",
+    "summary": "",
+    "attributes": [
+      {
+        "name": "anchor",
+        "type": {
+          "text": "object"
+        },
+        "description": "Anchor element, virtual reference, or viewport-space rect (popover mode)"
+      },
+      {
+        "name": "description",
+        "type": {
+          "text": "string"
+        },
+        "description": "Body text (replaced by the default slot)"
+      },
+      {
+        "name": "dismissible",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Show a close (×) button (default true)"
+      },
+      {
+        "name": "initial-focus",
+        "type": {
+          "text": "string"
+        },
+        "description": "Selector for the element to focus on open (dialog presentations)"
+      },
+      {
+        "name": "offset",
+        "type": {
+          "text": "number"
+        },
+        "description": "Anchor gap in px (popover mode, default 8)"
+      },
+      {
+        "name": "open",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Controlled open state"
+      },
+      {
+        "name": "persistent",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Escape/backdrop do not request dismissal"
+      },
+      {
+        "name": "placement",
+        "type": {
+          "text": "string"
+        },
+        "description": "Popover placement (default 'bottom')"
+      },
+      {
+        "name": "presentation",
+        "type": {
+          "text": "'bottom-sheet' | 'modal' | 'popover'"
+        },
+        "description": "'auto' (default) | 'bottom-sheet' | 'modal' | 'popover'"
+      },
+      {
+        "name": "return-focus",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Restore focus after the card closes (default true)"
+      },
+      {
+        "name": "spotlight",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Dim the page around the anchor with an ore-spotlight cutout"
+      },
+      {
+        "name": "step-index",
+        "type": {
+          "text": "number"
+        },
+        "description": "Zero-based current step (default 0)"
+      },
+      {
+        "name": "title",
+        "type": {
+          "text": "string"
+        },
+        "description": "Card title"
+      },
+      {
+        "name": "total-steps",
+        "type": {
+          "text": "number"
+        },
+        "description": "Total steps; >0 shows the progress bar and step counter"
+      }
+    ],
+    "events": [
+      {
+        "name": "back",
+        "description": "Back was requested.",
+        "type": {
+          "text": "CustomEvent"
+        }
+      },
+      {
+        "name": "dismiss",
+        "description": "Close was requested. detail: { reason }",
+        "type": {
+          "text": "CustomEvent"
+        }
+      },
+      {
+        "name": "finish",
+        "description": "Advance was pressed on the final step.",
+        "type": {
+          "text": "CustomEvent"
+        }
+      },
+      {
+        "name": "next",
+        "description": "Next was requested.",
+        "type": {
+          "text": "CustomEvent"
+        }
+      },
+      {
+        "name": "open-change",
+        "description": "Open state changed. detail: { open, reason }",
+        "type": {
+          "text": "CustomEvent"
+        }
+      },
+      {
+        "name": "skip",
+        "description": "Skip was requested.",
+        "type": {
+          "text": "CustomEvent"
+        }
+      }
+    ],
+    "slots": [
+      {
+        "name": "media",
+        "description": "Full-bleed media above the copy: an img, picture, video, or svg"
+      },
+      {
+        "name": "",
+        "description": "Body content (replaces `description`)"
+      },
+      {
+        "name": "footer",
+        "description": "Custom footer actions (replaces Skip/Back/Next)"
+      }
+    ],
+    "cssParts": [
+      {
+        "name": "dialog",
+        "description": "Native dialog root (dialog presentations)."
+      },
+      {
+        "name": "overlay",
+        "description": "Dialog backdrop element."
+      },
+      {
+        "name": "float",
+        "description": "Popover-mode panel."
+      },
+      {
+        "name": "panel",
+        "description": "Dialog-mode panel."
+      },
+      {
+        "name": "card",
+        "description": "Card container inside either panel."
+      },
+      {
+        "name": "media",
+        "description": "Full-bleed media region above the copy (hidden while the slot is empty)."
+      },
+      {
+        "name": "header",
+        "description": "Header container."
+      },
+      {
+        "name": "title",
+        "description": "Title text element."
+      },
+      {
+        "name": "step-count",
+        "description": "Visible \"Step N of M\" label beside the progress bar."
+      },
+      {
+        "name": "close",
+        "description": "Close action control."
+      },
+      {
+        "name": "body",
+        "description": "Body content container."
+      },
+      {
+        "name": "footer",
+        "description": "Footer container."
+      }
+    ],
+    "cssProperties": [
+      {
+        "name": "--tour-bg",
+        "description": "Card background color"
+      },
+      {
+        "name": "--tour-border-color",
+        "description": "Card border color"
+      },
+      {
+        "name": "--tour-max-width",
+        "description": "Card max width (default 22rem)"
+      },
+      {
+        "name": "--tour-media-max-height",
+        "description": "Media ceiling (default min(38dvh, 16rem); bottom-sheet min(26dvh, 12rem))"
+      },
+      {
+        "name": "--tour-panel-blur",
+        "description": "Backdrop blur behind the translucent card (default var(--blur-md))"
+      },
+      {
+        "name": "--tour-radius",
+        "description": "Card border radius"
+      },
+      {
+        "name": "--tour-shadow",
+        "description": "Card drop shadow"
+      }
+    ],
+    "demos": [
+      {
+        "url": "",
+        "description": "```html\n<ore-tour open title=\"Welcome\" description=\"Start here.\" step-index=\"0\" total-steps=\"3\"></ore-tour>\n<script type=\"module\">\n  import '@vielzeug/refine/tour';\n  const card = document.querySelector('ore-tour');\n  card.anchor = document.querySelector('#save-button');\n  card.addEventListener('next', () => console.log('advance'));\n</script>\n```"
+      }
+    ]
   }
 ]