@walkeros/explorer 4.7.2 → 4.8.0-next-1791441510508

package/dist/design/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/design/index.ts"],"sourcesContent":["/* walkerOS design constants, generated from design/tokens.json by src/design/generate.ts. Edit the JSON and run the explorer build, never this file. */\n\nexport type Theme = 'dark' | 'light';\n\n/** Page background (hero, features, FAQ, closing CTA). Default ground for `fg`, `fg-2`, `link`. */\nexport const bg = { dark: \"#111827\", light: \"#ffffff\" } as const;\n\n/** Alternating section band (Why, More features, Plans) and footer. Switch between `bg` and `bg-2` to separate sections, always with a top `border` rule. */\nexport const bg2 = { dark: \"#151e2e\", light: \"#f6f7f9\" } as const;\n\n/** Cards, plan tiers, FAQ items, the install-command chip and secondary buttons. */\nexport const surface = { dark: \"#1a2232\", light: \"#ffffff\" } as const;\n\n/** Inline code background, icon-button hover. */\nexport const surface2 = { dark: \"#222b3c\", light: \"#f1f3f6\" } as const;\n\n/** Hairline for section rules, header underline, card and input outlines. Decorative only; it does not meet 3:1, so never rely on it alone to mark a control. */\nexport const border = { dark: \"#2f3a4d\", light: \"#e3e6eb\" } as const;\n\n/** Headings and body copy on `bg`, `bg-2`, `surface`, `surface-2` (14:1+ both themes). */\nexport const fg = { dark: \"#ffffff\", light: \"#111827\" } as const;\n\n/** Secondary copy: leads, card descriptions, list items, footer links. 5.5:1+ on every ground. */\nexport const fg2 = { dark: \"#9aa3b2\", light: \"#4b5563\" } as const;\n\n/** Tertiary text: tier labels, `$` prompt, FAQ `+`, copyright, input placeholders. 4.5:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes (dark 4.6:1+, light 4.7:1+). */\nexport const fg3 = { dark: \"#8c93a2\", light: \"#656d7a\" } as const;\n\n/** elbwalker blue. Primary button fill, check icons, highlight word in the H1, focus ring, announcement bar. Light theme: 2.4:1 on white — fine as a fill under `on-primary`, too faint for text or as the only marker (flagged, kept from source). */\nexport const primary = { dark: \"#01b5e2\", light: \"#01b5e2\" } as const;\n\n/** Text and icons on `primary` fills (6.9:1). Never put white on `primary` (2.4:1) — the current walkeros.io buttons do; the relaunch fixes it. */\nexport const onPrimary = { dark: \"#04222b\", light: \"#04222b\" } as const;\n\n/** Links, eyebrows, mono step numbers; `info` and the light `focus` ring use it. 4.5:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes (dark 6.0:1+, light 4.6:1+). Underline on hover only. */\nexport const link = { dark: \"#4fb3e0\", light: \"#0076a0\" } as const;\n\n/** Soft primary halo: hero radial glow and the 4px ring around the highlighted plan. */\nexport const glow = { dark: \"rgba(1, 181, 226, 0.16)\", light: \"rgba(1, 181, 226, 0.14)\" } as const;\n\n/** Code-block panel (Palenight family), both themes. */\nexport const codeBg = \"#292d3e\";\n\n/** Code-block title bar / tab strip. */\nexport const codeBar = \"#232636\";\n\n/** Code-block outline. */\nexport const codeBorder = \"#444a5e\";\n\n/** Default code text on `code-bg` (8:1). */\nexport const codeFg = \"#bfc7d5\";\n\n/** Product visualisation panel (tagging and mapping demos). Visualisations stay dark in both themes. */\nexport const vizBg = \"#1a2232\";\n\n/** Code pane inside a visualisation. */\nexport const vizCodeBg = \"#131c2b\";\n\n/** Outlines inside visualisations. */\nexport const vizBorder = \"#334055\";\n\n/** Primary text inside visualisations. */\nexport const vizFg = \"#e8eaf0\";\n\n/** Legend and meta text inside visualisations (5.4:1 on `viz-code-bg`). */\nexport const vizFg2 = \"#8e96aa\";\n\n/** Code comments and file kinds inside visualisations. */\nexport const vizComment = \"#6c7590\";\n\n/** Gutter line numbers. Decorative, below 3:1. */\nexport const vizLineNumber = \"#4a5165\";\n\n/** Raised surfaces inside visualisations: the rendered teaser card, table rules. */\nexport const vizSurface = \"#2b3649\";\n\n/** Syntax: HTML/JSX tag names in visualisation code (6:1+ on `viz-code-bg`). */\nexport const vizTag = \"#e38fd6\";\n\n/** Syntax: string values in visualisation code and JSON cells. */\nexport const vizString = \"#e5c07b\";\n\n/** Syntax: numbers and booleans in mapping code. */\nexport const vizNumber = \"#f78c6c\";\n\n/** Syntax: punctuation and plain code text; visualisation captions. */\nexport const vizPunct = \"#9aa3b8\";\n\n/** Event part: entity (e.g. `product`). Used for syntax highlight, legend chip and the highlighted DOM region in tagging demos. */\nexport const eventEntity = \"#c5e478\";\n\n/** Event part: action (e.g. `view`, `add`). */\nexport const eventAction = \"#c792ea\";\n\n/** Event part: entity property (`data-elb-product=\"name\"`). */\nexport const eventProperty = \"#f0717f\";\n\n/** Event part: context. */\nexport const eventContext = \"#f2a65a\";\n\n/** Event part: globals. */\nexport const eventGlobals = \"#7fc4ea\";\n\n/** Tag kind: user (who the visitor is). Like the five event parts it sits only on dark grounds (`viz-bg`, legends, chips, mark layers) and always pairs with its word. 5.2:1 on `viz-bg`; kept apart from `event-property`, `event-action` and `danger`. */\nexport const eventUser = \"#e65fc4\";\n\n/** Tag kind: consent (consent states and requirements). Dark grounds only, always with its word. 10.7:1 on `viz-bg`. */\nexport const eventConsent = \"#cbd5e1\";\n\n/** Brand scale (walkeros.io docs). Light-theme badge and admonition background. */\nexport const elbwalker100 = \"#edfeff\";\n\n/** Brand scale. Admonition highlight (light). */\nexport const elbwalker200 = \"#abf8ff\";\n\n/** Brand scale. Admonition text (dark). */\nexport const elbwalker300 = \"#69ecfe\";\n\n/** Brand scale. */\nexport const elbwalker400 = \"#27dbfe\";\n\n/** Brand scale anchor = `primary`. Admonition border. */\nexport const elbwalker500 = \"#01b5e2\";\n\n/** Brand scale. Badge text (light), badge fill (dark). */\nexport const elbwalker700 = \"#015372\";\n\n/** Brand scale. Admonition background (dark). */\nexport const elbwalker800 = \"#00283a\";\n\n/** Brand scale, darkest step. */\nexport const elbwalker900 = \"#000203\";\n\n/** Borders that mark a control: input, select, checkbox and switch outlines, the 1px edge of menus, popovers and dialogs, scrollbar thumbs, flow edges. 3:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes; `border` stays decorative. */\nexport const borderStrong = { dark: \"#6b778d\", light: \"#818a9a\" } as const;\n\n/** Focus ring, 2px solid with a 3px offset, on every interactive element: `primary` in dark, `link` in light, where `primary` is 2.2:1. 3:1 or more on every ground. */\nexport const focus = { dark: \"#01b5e2\", light: \"#0076a0\" } as const;\n\n/** Scrim behind modals and drawers. The layer above it is `surface` with a 1px `border-strong` edge, never a shadow. */\nexport const backdrop = { dark: \"rgba(3, 7, 18, 0.72)\", light: \"rgba(17, 24, 39, 0.4)\" } as const;\n\n/** Errors, destructive actions and invalid fields, always with an icon and a word. Text at 4.5:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes. Kept apart from every event and step colour, `event-property` included. */\nexport const danger = { dark: \"#ffa4ac\", light: \"#b91c1c\" } as const;\n\n/** Text and icons on a `danger` fill such as a destructive button (dark 8.6:1, light 6.5:1). */\nexport const onDanger = { dark: \"#450a0a\", light: \"#ffffff\" } as const;\n\n/** Success and healthy states, always with an icon and a word. Sits on the blue side of green, so it stays apart from `danger` with red-green colour blindness, and apart from every step and event colour. Text at 4.5:1 or more on every ground. */\nexport const success = { dark: \"#8cf9ff\", light: \"#07675d\" } as const;\n\n/** Warnings and states that need attention, always with an icon and a word. Kept apart from `step-transformer` and `event-context`. Text at 4.5:1 or more on every ground. */\nexport const warning = { dark: \"#cabb00\", light: \"#886000\" } as const;\n\n/** Neutral information, always with an icon and a word. The `link` colour in both themes. */\nexport const info = { dark: \"#4fb3e0\", light: \"#0076a0\" } as const;\n\n/** Tinted fill for danger banners and badges. Text on it is `fg`; the status colour marks the icon and the border (3:1 or more on the tint). */\nexport const dangerBg = { dark: \"rgba(255, 164, 172, 0.16)\", light: \"rgba(185, 28, 28, 0.1)\" } as const;\n\n/** Tinted fill for success banners and badges. Text on it is `fg`; the status colour marks the icon and the border (3:1 or more on the tint). */\nexport const successBg = { dark: \"rgba(140, 249, 255, 0.16)\", light: \"rgba(7, 103, 93, 0.1)\" } as const;\n\n/** Tinted fill for warning banners and badges. Text on it is `fg`; the status colour marks the icon and the border (3:1 or more on the tint). */\nexport const warningBg = { dark: \"rgba(202, 187, 0, 0.16)\", light: \"rgba(136, 96, 0, 0.1)\" } as const;\n\n/** Tinted fill for information banners and badges. Text on it is `fg`; the status colour marks the icon and the border (3:1 or more on the tint). */\nexport const infoBg = { dark: \"rgba(79, 179, 224, 0.16)\", light: \"rgba(0, 118, 160, 0.1)\" } as const;\n\n/** Flow step colour: sources. Badges, node accents and edges, always beside the step word; 3:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes. */\nexport const stepSource = { dark: \"#6ee7b7\", light: \"#428569\" } as const;\n\n/** Flow step colour: transformers. Badges, node accents and edges, always beside the step word; 3:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes. */\nexport const stepTransformer = { dark: \"#fcd34d\", light: \"#bb7000\" } as const;\n\n/** Flow step colour: the collector. Badges, node accents and edges, always beside the step word; 3:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes. */\nexport const stepCollector = { dark: \"#7dd3fc\", light: \"#0c529b\" } as const;\n\n/** Flow step colour: destinations. Badges, node accents and edges, always beside the step word; 3:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes. */\nexport const stepDestination = { dark: \"#c4b5fd\", light: \"#6d1fd8\" } as const;\n\n/** Flow step colour: stores. Badges, node accents and edges, always beside the step word; 3:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes. */\nexport const stepStore = { dark: \"#a5b4fc\", light: \"#4138c9\" } as const;\n\n/** Platform badge: web, always with the word; 3:1 or more on every ground. */\nexport const platformWeb = { dark: \"#0ea5e9\", light: \"#008ddd\" } as const;\n\n/** Platform badge: server, always with the word; 3:1 or more on every ground. */\nexport const platformServer = { dark: \"#8b5cf6\", light: \"#8043f6\" } as const;\n\n/** First chart series: `primary` in dark, `link` in light. Series take `chart-1` to `chart-6` in order; the six stay apart in normal vision and with red-green colour blindness, and reach 3:1 on every ground. Label every series. */\nexport const chart1 = { dark: \"#01b5e2\", light: \"#0076a0\" } as const;\n\n/** Second chart series (orange). */\nexport const chart2 = { dark: \"#e69f00\", light: \"#ce710c\" } as const;\n\n/** Third chart series (bluish green). */\nexport const chart3 = { dark: \"#009563\", light: \"#217b58\" } as const;\n\n/** Fourth chart series (vermilion). */\nexport const chart4 = { dark: \"#e0520a\", light: \"#d32f4d\" } as const;\n\n/** Fifth chart series (reddish purple). */\nexport const chart5 = { dark: \"#ff6fad\", light: \"#b87889\" } as const;\n\n/** Sixth chart series (yellow in dark, olive in light). */\nexport const chart6 = { dark: \"#f0e442\", light: \"#546800\" } as const;\n\n/** Human notes and comment pins over visualisations, tag plans and frames. Kept apart from every step and status colour; 3:1 or more on every ground. */\nexport const annotation = { dark: \"#22c55e\", light: \"#409116\" } as const;\n\n/** Editor syntax (Monaco, Shiki, Prism): comments, 4.6:1 on `code-bg`. */\nexport const syntaxComment = \"#8c94be\";\n\n/** Editor syntax (Monaco, Shiki, Prism): strings, attribute names and inserted text, 9.9:1 on `code-bg`. */\nexport const syntaxString = \"#c3e88d\";\n\n/** Editor syntax (Monaco, Shiki, Prism): numbers, 5.8:1 on `code-bg`. */\nexport const syntaxNumber = \"#f78c6c\";\n\n/** Editor syntax (Monaco, Shiki, Prism): booleans, null and constants, 4.6:1 on `code-bg`. */\nexport const syntaxConstant = \"#ff5d78\";\n\n/** Editor syntax (Monaco, Shiki, Prism): keywords and storage modifiers, 5.2:1 on `code-bg`. */\nexport const syntaxKeyword = \"#c084fc\";\n\n/** Editor syntax (Monaco, Shiki, Prism): functions and built-ins, 5.9:1 on `code-bg`. */\nexport const syntaxFunction = \"#82aaff\";\n\n/** Editor syntax (Monaco, Shiki, Prism): types and class names, 9.1:1 on `code-bg`. */\nexport const syntaxType = \"#ffcb6b\";\n\n/** Editor syntax (Monaco, Shiki, Prism): operators and regular expressions, 9.0:1 on `code-bg`. */\nexport const syntaxOperator = \"#89ddff\";\n\n/** Editor syntax (Monaco, Shiki, Prism): punctuation and delimiters, 5.7:1 on `code-bg`. */\nexport const syntaxPunct = \"#c792ea\";\n\n/** Editor syntax (Monaco, Shiki, Prism): tags, invalid and deleted tokens, 4.6:1 on `code-bg`. */\nexport const syntaxTag = \"#ff5d79\";\n\n/** Editor syntax (Monaco, Shiki, Prism): namespaces, 8.1:1 on `code-bg`. */\nexport const syntaxNamespace = \"#b2ccd6\";\n\n/** Editor gutter line numbers on `code-bg`. Decorative, below 3:1. */\nexport const codeLineNumber = \"#676e95\";\n\n/** Editor selection over `code-bg`; `code-fg` stays at 5.4:1 on it. */\nexport const codeSelection = \"#717cb450\";\n\n/** Inserted lines in diff views over `code-bg`; `code-fg` stays at 5.4:1. */\nexport const codeInsertedBg = \"#c3e88d26\";\n\n/** Deleted lines in diff views over `code-bg`; `code-fg` stays at 6.6:1. */\nexport const codeDeletedBg = \"#ff5d7926\";\n\n/** Font family `sans`. */\nexport const fontSans = \"system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Ubuntu, 'Helvetica Neue', Arial, sans-serif\";\n\n/** Font family `mono`. */\nexport const fontMono = \"SFMono-Regular, ui-monospace, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace\";\n\n/** Font family `viz`. */\nexport const fontViz = \"'Geist', system-ui, sans-serif\";\n\n/** Font family `viz-mono`. */\nexport const fontVizMono = \"'Geist Mono', monospace\";\n"],"mappings":"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","names":[]}

package/dist/design/index.d.cts

@@ -0,0 +1,293 @@
+type Theme = 'dark' | 'light';
+/** Page background (hero, features, FAQ, closing CTA). Default ground for `fg`, `fg-2`, `link`. */
+declare const bg: {
+    readonly dark: "#111827";
+    readonly light: "#ffffff";
+};
+/** Alternating section band (Why, More features, Plans) and footer. Switch between `bg` and `bg-2` to separate sections, always with a top `border` rule. */
+declare const bg2: {
+    readonly dark: "#151e2e";
+    readonly light: "#f6f7f9";
+};
+/** Cards, plan tiers, FAQ items, the install-command chip and secondary buttons. */
+declare const surface: {
+    readonly dark: "#1a2232";
+    readonly light: "#ffffff";
+};
+/** Inline code background, icon-button hover. */
+declare const surface2: {
+    readonly dark: "#222b3c";
+    readonly light: "#f1f3f6";
+};
+/** Hairline for section rules, header underline, card and input outlines. Decorative only; it does not meet 3:1, so never rely on it alone to mark a control. */
+declare const border: {
+    readonly dark: "#2f3a4d";
+    readonly light: "#e3e6eb";
+};
+/** Headings and body copy on `bg`, `bg-2`, `surface`, `surface-2` (14:1+ both themes). */
+declare const fg: {
+    readonly dark: "#ffffff";
+    readonly light: "#111827";
+};
+/** Secondary copy: leads, card descriptions, list items, footer links. 5.5:1+ on every ground. */
+declare const fg2: {
+    readonly dark: "#9aa3b2";
+    readonly light: "#4b5563";
+};
+/** Tertiary text: tier labels, `$` prompt, FAQ `+`, copyright, input placeholders. 4.5:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes (dark 4.6:1+, light 4.7:1+). */
+declare const fg3: {
+    readonly dark: "#8c93a2";
+    readonly light: "#656d7a";
+};
+/** elbwalker blue. Primary button fill, check icons, highlight word in the H1, focus ring, announcement bar. Light theme: 2.4:1 on white — fine as a fill under `on-primary`, too faint for text or as the only marker (flagged, kept from source). */
+declare const primary: {
+    readonly dark: "#01b5e2";
+    readonly light: "#01b5e2";
+};
+/** Text and icons on `primary` fills (6.9:1). Never put white on `primary` (2.4:1) — the current walkeros.io buttons do; the relaunch fixes it. */
+declare const onPrimary: {
+    readonly dark: "#04222b";
+    readonly light: "#04222b";
+};
+/** Links, eyebrows, mono step numbers; `info` and the light `focus` ring use it. 4.5:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes (dark 6.0:1+, light 4.6:1+). Underline on hover only. */
+declare const link: {
+    readonly dark: "#4fb3e0";
+    readonly light: "#0076a0";
+};
+/** Soft primary halo: hero radial glow and the 4px ring around the highlighted plan. */
+declare const glow: {
+    readonly dark: "rgba(1, 181, 226, 0.16)";
+    readonly light: "rgba(1, 181, 226, 0.14)";
+};
+/** Code-block panel (Palenight family), both themes. */
+declare const codeBg = "#292d3e";
+/** Code-block title bar / tab strip. */
+declare const codeBar = "#232636";
+/** Code-block outline. */
+declare const codeBorder = "#444a5e";
+/** Default code text on `code-bg` (8:1). */
+declare const codeFg = "#bfc7d5";
+/** Product visualisation panel (tagging and mapping demos). Visualisations stay dark in both themes. */
+declare const vizBg = "#1a2232";
+/** Code pane inside a visualisation. */
+declare const vizCodeBg = "#131c2b";
+/** Outlines inside visualisations. */
+declare const vizBorder = "#334055";
+/** Primary text inside visualisations. */
+declare const vizFg = "#e8eaf0";
+/** Legend and meta text inside visualisations (5.4:1 on `viz-code-bg`). */
+declare const vizFg2 = "#8e96aa";
+/** Code comments and file kinds inside visualisations. */
+declare const vizComment = "#6c7590";
+/** Gutter line numbers. Decorative, below 3:1. */
+declare const vizLineNumber = "#4a5165";
+/** Raised surfaces inside visualisations: the rendered teaser card, table rules. */
+declare const vizSurface = "#2b3649";
+/** Syntax: HTML/JSX tag names in visualisation code (6:1+ on `viz-code-bg`). */
+declare const vizTag = "#e38fd6";
+/** Syntax: string values in visualisation code and JSON cells. */
+declare const vizString = "#e5c07b";
+/** Syntax: numbers and booleans in mapping code. */
+declare const vizNumber = "#f78c6c";
+/** Syntax: punctuation and plain code text; visualisation captions. */
+declare const vizPunct = "#9aa3b8";
+/** Event part: entity (e.g. `product`). Used for syntax highlight, legend chip and the highlighted DOM region in tagging demos. */
+declare const eventEntity = "#c5e478";
+/** Event part: action (e.g. `view`, `add`). */
+declare const eventAction = "#c792ea";
+/** Event part: entity property (`data-elb-product="name"`). */
+declare const eventProperty = "#f0717f";
+/** Event part: context. */
+declare const eventContext = "#f2a65a";
+/** Event part: globals. */
+declare const eventGlobals = "#7fc4ea";
+/** Tag kind: user (who the visitor is). Like the five event parts it sits only on dark grounds (`viz-bg`, legends, chips, mark layers) and always pairs with its word. 5.2:1 on `viz-bg`; kept apart from `event-property`, `event-action` and `danger`. */
+declare const eventUser = "#e65fc4";
+/** Tag kind: consent (consent states and requirements). Dark grounds only, always with its word. 10.7:1 on `viz-bg`. */
+declare const eventConsent = "#cbd5e1";
+/** Brand scale (walkeros.io docs). Light-theme badge and admonition background. */
+declare const elbwalker100 = "#edfeff";
+/** Brand scale. Admonition highlight (light). */
+declare const elbwalker200 = "#abf8ff";
+/** Brand scale. Admonition text (dark). */
+declare const elbwalker300 = "#69ecfe";
+/** Brand scale. */
+declare const elbwalker400 = "#27dbfe";
+/** Brand scale anchor = `primary`. Admonition border. */
+declare const elbwalker500 = "#01b5e2";
+/** Brand scale. Badge text (light), badge fill (dark). */
+declare const elbwalker700 = "#015372";
+/** Brand scale. Admonition background (dark). */
+declare const elbwalker800 = "#00283a";
+/** Brand scale, darkest step. */
+declare const elbwalker900 = "#000203";
+/** Borders that mark a control: input, select, checkbox and switch outlines, the 1px edge of menus, popovers and dialogs, scrollbar thumbs, flow edges. 3:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes; `border` stays decorative. */
+declare const borderStrong: {
+    readonly dark: "#6b778d";
+    readonly light: "#818a9a";
+};
+/** Focus ring, 2px solid with a 3px offset, on every interactive element: `primary` in dark, `link` in light, where `primary` is 2.2:1. 3:1 or more on every ground. */
+declare const focus: {
+    readonly dark: "#01b5e2";
+    readonly light: "#0076a0";
+};
+/** Scrim behind modals and drawers. The layer above it is `surface` with a 1px `border-strong` edge, never a shadow. */
+declare const backdrop: {
+    readonly dark: "rgba(3, 7, 18, 0.72)";
+    readonly light: "rgba(17, 24, 39, 0.4)";
+};
+/** Errors, destructive actions and invalid fields, always with an icon and a word. Text at 4.5:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes. Kept apart from every event and step colour, `event-property` included. */
+declare const danger: {
+    readonly dark: "#ffa4ac";
+    readonly light: "#b91c1c";
+};
+/** Text and icons on a `danger` fill such as a destructive button (dark 8.6:1, light 6.5:1). */
+declare const onDanger: {
+    readonly dark: "#450a0a";
+    readonly light: "#ffffff";
+};
+/** Success and healthy states, always with an icon and a word. Sits on the blue side of green, so it stays apart from `danger` with red-green colour blindness, and apart from every step and event colour. Text at 4.5:1 or more on every ground. */
+declare const success: {
+    readonly dark: "#8cf9ff";
+    readonly light: "#07675d";
+};
+/** Warnings and states that need attention, always with an icon and a word. Kept apart from `step-transformer` and `event-context`. Text at 4.5:1 or more on every ground. */
+declare const warning: {
+    readonly dark: "#cabb00";
+    readonly light: "#886000";
+};
+/** Neutral information, always with an icon and a word. The `link` colour in both themes. */
+declare const info: {
+    readonly dark: "#4fb3e0";
+    readonly light: "#0076a0";
+};
+/** Tinted fill for danger banners and badges. Text on it is `fg`; the status colour marks the icon and the border (3:1 or more on the tint). */
+declare const dangerBg: {
+    readonly dark: "rgba(255, 164, 172, 0.16)";
+    readonly light: "rgba(185, 28, 28, 0.1)";
+};
+/** Tinted fill for success banners and badges. Text on it is `fg`; the status colour marks the icon and the border (3:1 or more on the tint). */
+declare const successBg: {
+    readonly dark: "rgba(140, 249, 255, 0.16)";
+    readonly light: "rgba(7, 103, 93, 0.1)";
+};
+/** Tinted fill for warning banners and badges. Text on it is `fg`; the status colour marks the icon and the border (3:1 or more on the tint). */
+declare const warningBg: {
+    readonly dark: "rgba(202, 187, 0, 0.16)";
+    readonly light: "rgba(136, 96, 0, 0.1)";
+};
+/** Tinted fill for information banners and badges. Text on it is `fg`; the status colour marks the icon and the border (3:1 or more on the tint). */
+declare const infoBg: {
+    readonly dark: "rgba(79, 179, 224, 0.16)";
+    readonly light: "rgba(0, 118, 160, 0.1)";
+};
+/** Flow step colour: sources. Badges, node accents and edges, always beside the step word; 3:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes. */
+declare const stepSource: {
+    readonly dark: "#6ee7b7";
+    readonly light: "#428569";
+};
+/** Flow step colour: transformers. Badges, node accents and edges, always beside the step word; 3:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes. */
+declare const stepTransformer: {
+    readonly dark: "#fcd34d";
+    readonly light: "#bb7000";
+};
+/** Flow step colour: the collector. Badges, node accents and edges, always beside the step word; 3:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes. */
+declare const stepCollector: {
+    readonly dark: "#7dd3fc";
+    readonly light: "#0c529b";
+};
+/** Flow step colour: destinations. Badges, node accents and edges, always beside the step word; 3:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes. */
+declare const stepDestination: {
+    readonly dark: "#c4b5fd";
+    readonly light: "#6d1fd8";
+};
+/** Flow step colour: stores. Badges, node accents and edges, always beside the step word; 3:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes. */
+declare const stepStore: {
+    readonly dark: "#a5b4fc";
+    readonly light: "#4138c9";
+};
+/** Platform badge: web, always with the word; 3:1 or more on every ground. */
+declare const platformWeb: {
+    readonly dark: "#0ea5e9";
+    readonly light: "#008ddd";
+};
+/** Platform badge: server, always with the word; 3:1 or more on every ground. */
+declare const platformServer: {
+    readonly dark: "#8b5cf6";
+    readonly light: "#8043f6";
+};
+/** First chart series: `primary` in dark, `link` in light. Series take `chart-1` to `chart-6` in order; the six stay apart in normal vision and with red-green colour blindness, and reach 3:1 on every ground. Label every series. */
+declare const chart1: {
+    readonly dark: "#01b5e2";
+    readonly light: "#0076a0";
+};
+/** Second chart series (orange). */
+declare const chart2: {
+    readonly dark: "#e69f00";
+    readonly light: "#ce710c";
+};
+/** Third chart series (bluish green). */
+declare const chart3: {
+    readonly dark: "#009563";
+    readonly light: "#217b58";
+};
+/** Fourth chart series (vermilion). */
+declare const chart4: {
+    readonly dark: "#e0520a";
+    readonly light: "#d32f4d";
+};
+/** Fifth chart series (reddish purple). */
+declare const chart5: {
+    readonly dark: "#ff6fad";
+    readonly light: "#b87889";
+};
+/** Sixth chart series (yellow in dark, olive in light). */
+declare const chart6: {
+    readonly dark: "#f0e442";
+    readonly light: "#546800";
+};
+/** Human notes and comment pins over visualisations, tag plans and frames. Kept apart from every step and status colour; 3:1 or more on every ground. */
+declare const annotation: {
+    readonly dark: "#22c55e";
+    readonly light: "#409116";
+};
+/** Editor syntax (Monaco, Shiki, Prism): comments, 4.6:1 on `code-bg`. */
+declare const syntaxComment = "#8c94be";
+/** Editor syntax (Monaco, Shiki, Prism): strings, attribute names and inserted text, 9.9:1 on `code-bg`. */
+declare const syntaxString = "#c3e88d";
+/** Editor syntax (Monaco, Shiki, Prism): numbers, 5.8:1 on `code-bg`. */
+declare const syntaxNumber = "#f78c6c";
+/** Editor syntax (Monaco, Shiki, Prism): booleans, null and constants, 4.6:1 on `code-bg`. */
+declare const syntaxConstant = "#ff5d78";
+/** Editor syntax (Monaco, Shiki, Prism): keywords and storage modifiers, 5.2:1 on `code-bg`. */
+declare const syntaxKeyword = "#c084fc";
+/** Editor syntax (Monaco, Shiki, Prism): functions and built-ins, 5.9:1 on `code-bg`. */
+declare const syntaxFunction = "#82aaff";
+/** Editor syntax (Monaco, Shiki, Prism): types and class names, 9.1:1 on `code-bg`. */
+declare const syntaxType = "#ffcb6b";
+/** Editor syntax (Monaco, Shiki, Prism): operators and regular expressions, 9.0:1 on `code-bg`. */
+declare const syntaxOperator = "#89ddff";
+/** Editor syntax (Monaco, Shiki, Prism): punctuation and delimiters, 5.7:1 on `code-bg`. */
+declare const syntaxPunct = "#c792ea";
+/** Editor syntax (Monaco, Shiki, Prism): tags, invalid and deleted tokens, 4.6:1 on `code-bg`. */
+declare const syntaxTag = "#ff5d79";
+/** Editor syntax (Monaco, Shiki, Prism): namespaces, 8.1:1 on `code-bg`. */
+declare const syntaxNamespace = "#b2ccd6";
+/** Editor gutter line numbers on `code-bg`. Decorative, below 3:1. */
+declare const codeLineNumber = "#676e95";
+/** Editor selection over `code-bg`; `code-fg` stays at 5.4:1 on it. */
+declare const codeSelection = "#717cb450";
+/** Inserted lines in diff views over `code-bg`; `code-fg` stays at 5.4:1. */
+declare const codeInsertedBg = "#c3e88d26";
+/** Deleted lines in diff views over `code-bg`; `code-fg` stays at 6.6:1. */
+declare const codeDeletedBg = "#ff5d7926";
+/** Font family `sans`. */
+declare const fontSans = "system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Ubuntu, 'Helvetica Neue', Arial, sans-serif";
+/** Font family `mono`. */
+declare const fontMono = "SFMono-Regular, ui-monospace, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace";
+/** Font family `viz`. */
+declare const fontViz = "'Geist', system-ui, sans-serif";
+/** Font family `viz-mono`. */
+declare const fontVizMono = "'Geist Mono', monospace";
+
+export { type Theme, annotation, backdrop, bg, bg2, border, borderStrong, chart1, chart2, chart3, chart4, chart5, chart6, codeBar, codeBg, codeBorder, codeDeletedBg, codeFg, codeInsertedBg, codeLineNumber, codeSelection, danger, dangerBg, elbwalker100, elbwalker200, elbwalker300, elbwalker400, elbwalker500, elbwalker700, elbwalker800, elbwalker900, eventAction, eventConsent, eventContext, eventEntity, eventGlobals, eventProperty, eventUser, fg, fg2, fg3, focus, fontMono, fontSans, fontViz, fontVizMono, glow, info, infoBg, link, onDanger, onPrimary, platformServer, platformWeb, primary, stepCollector, stepDestination, stepSource, stepStore, stepTransformer, success, successBg, surface, surface2, syntaxComment, syntaxConstant, syntaxFunction, syntaxKeyword, syntaxNamespace, syntaxNumber, syntaxOperator, syntaxPunct, syntaxString, syntaxTag, syntaxType, vizBg, vizBorder, vizCodeBg, vizComment, vizFg, vizFg2, vizLineNumber, vizNumber, vizPunct, vizString, vizSurface, vizTag, warning, warningBg };

package/dist/design/index.d.ts

@@ -0,0 +1,293 @@
+type Theme = 'dark' | 'light';
+/** Page background (hero, features, FAQ, closing CTA). Default ground for `fg`, `fg-2`, `link`. */
+declare const bg: {
+    readonly dark: "#111827";
+    readonly light: "#ffffff";
+};
+/** Alternating section band (Why, More features, Plans) and footer. Switch between `bg` and `bg-2` to separate sections, always with a top `border` rule. */
+declare const bg2: {
+    readonly dark: "#151e2e";
+    readonly light: "#f6f7f9";
+};
+/** Cards, plan tiers, FAQ items, the install-command chip and secondary buttons. */
+declare const surface: {
+    readonly dark: "#1a2232";
+    readonly light: "#ffffff";
+};
+/** Inline code background, icon-button hover. */
+declare const surface2: {
+    readonly dark: "#222b3c";
+    readonly light: "#f1f3f6";
+};
+/** Hairline for section rules, header underline, card and input outlines. Decorative only; it does not meet 3:1, so never rely on it alone to mark a control. */
+declare const border: {
+    readonly dark: "#2f3a4d";
+    readonly light: "#e3e6eb";
+};
+/** Headings and body copy on `bg`, `bg-2`, `surface`, `surface-2` (14:1+ both themes). */
+declare const fg: {
+    readonly dark: "#ffffff";
+    readonly light: "#111827";
+};
+/** Secondary copy: leads, card descriptions, list items, footer links. 5.5:1+ on every ground. */
+declare const fg2: {
+    readonly dark: "#9aa3b2";
+    readonly light: "#4b5563";
+};
+/** Tertiary text: tier labels, `$` prompt, FAQ `+`, copyright, input placeholders. 4.5:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes (dark 4.6:1+, light 4.7:1+). */
+declare const fg3: {
+    readonly dark: "#8c93a2";
+    readonly light: "#656d7a";
+};
+/** elbwalker blue. Primary button fill, check icons, highlight word in the H1, focus ring, announcement bar. Light theme: 2.4:1 on white — fine as a fill under `on-primary`, too faint for text or as the only marker (flagged, kept from source). */
+declare const primary: {
+    readonly dark: "#01b5e2";
+    readonly light: "#01b5e2";
+};
+/** Text and icons on `primary` fills (6.9:1). Never put white on `primary` (2.4:1) — the current walkeros.io buttons do; the relaunch fixes it. */
+declare const onPrimary: {
+    readonly dark: "#04222b";
+    readonly light: "#04222b";
+};
+/** Links, eyebrows, mono step numbers; `info` and the light `focus` ring use it. 4.5:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes (dark 6.0:1+, light 4.6:1+). Underline on hover only. */
+declare const link: {
+    readonly dark: "#4fb3e0";
+    readonly light: "#0076a0";
+};
+/** Soft primary halo: hero radial glow and the 4px ring around the highlighted plan. */
+declare const glow: {
+    readonly dark: "rgba(1, 181, 226, 0.16)";
+    readonly light: "rgba(1, 181, 226, 0.14)";
+};
+/** Code-block panel (Palenight family), both themes. */
+declare const codeBg = "#292d3e";
+/** Code-block title bar / tab strip. */
+declare const codeBar = "#232636";
+/** Code-block outline. */
+declare const codeBorder = "#444a5e";
+/** Default code text on `code-bg` (8:1). */
+declare const codeFg = "#bfc7d5";
+/** Product visualisation panel (tagging and mapping demos). Visualisations stay dark in both themes. */
+declare const vizBg = "#1a2232";
+/** Code pane inside a visualisation. */
+declare const vizCodeBg = "#131c2b";
+/** Outlines inside visualisations. */
+declare const vizBorder = "#334055";
+/** Primary text inside visualisations. */
+declare const vizFg = "#e8eaf0";
+/** Legend and meta text inside visualisations (5.4:1 on `viz-code-bg`). */
+declare const vizFg2 = "#8e96aa";
+/** Code comments and file kinds inside visualisations. */
+declare const vizComment = "#6c7590";
+/** Gutter line numbers. Decorative, below 3:1. */
+declare const vizLineNumber = "#4a5165";
+/** Raised surfaces inside visualisations: the rendered teaser card, table rules. */
+declare const vizSurface = "#2b3649";
+/** Syntax: HTML/JSX tag names in visualisation code (6:1+ on `viz-code-bg`). */
+declare const vizTag = "#e38fd6";
+/** Syntax: string values in visualisation code and JSON cells. */
+declare const vizString = "#e5c07b";
+/** Syntax: numbers and booleans in mapping code. */
+declare const vizNumber = "#f78c6c";
+/** Syntax: punctuation and plain code text; visualisation captions. */
+declare const vizPunct = "#9aa3b8";
+/** Event part: entity (e.g. `product`). Used for syntax highlight, legend chip and the highlighted DOM region in tagging demos. */
+declare const eventEntity = "#c5e478";
+/** Event part: action (e.g. `view`, `add`). */
+declare const eventAction = "#c792ea";
+/** Event part: entity property (`data-elb-product="name"`). */
+declare const eventProperty = "#f0717f";
+/** Event part: context. */
+declare const eventContext = "#f2a65a";
+/** Event part: globals. */
+declare const eventGlobals = "#7fc4ea";
+/** Tag kind: user (who the visitor is). Like the five event parts it sits only on dark grounds (`viz-bg`, legends, chips, mark layers) and always pairs with its word. 5.2:1 on `viz-bg`; kept apart from `event-property`, `event-action` and `danger`. */
+declare const eventUser = "#e65fc4";
+/** Tag kind: consent (consent states and requirements). Dark grounds only, always with its word. 10.7:1 on `viz-bg`. */
+declare const eventConsent = "#cbd5e1";
+/** Brand scale (walkeros.io docs). Light-theme badge and admonition background. */
+declare const elbwalker100 = "#edfeff";
+/** Brand scale. Admonition highlight (light). */
+declare const elbwalker200 = "#abf8ff";
+/** Brand scale. Admonition text (dark). */
+declare const elbwalker300 = "#69ecfe";
+/** Brand scale. */
+declare const elbwalker400 = "#27dbfe";
+/** Brand scale anchor = `primary`. Admonition border. */
+declare const elbwalker500 = "#01b5e2";
+/** Brand scale. Badge text (light), badge fill (dark). */
+declare const elbwalker700 = "#015372";
+/** Brand scale. Admonition background (dark). */
+declare const elbwalker800 = "#00283a";
+/** Brand scale, darkest step. */
+declare const elbwalker900 = "#000203";
+/** Borders that mark a control: input, select, checkbox and switch outlines, the 1px edge of menus, popovers and dialogs, scrollbar thumbs, flow edges. 3:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes; `border` stays decorative. */
+declare const borderStrong: {
+    readonly dark: "#6b778d";
+    readonly light: "#818a9a";
+};
+/** Focus ring, 2px solid with a 3px offset, on every interactive element: `primary` in dark, `link` in light, where `primary` is 2.2:1. 3:1 or more on every ground. */
+declare const focus: {
+    readonly dark: "#01b5e2";
+    readonly light: "#0076a0";
+};
+/** Scrim behind modals and drawers. The layer above it is `surface` with a 1px `border-strong` edge, never a shadow. */
+declare const backdrop: {
+    readonly dark: "rgba(3, 7, 18, 0.72)";
+    readonly light: "rgba(17, 24, 39, 0.4)";
+};
+/** Errors, destructive actions and invalid fields, always with an icon and a word. Text at 4.5:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes. Kept apart from every event and step colour, `event-property` included. */
+declare const danger: {
+    readonly dark: "#ffa4ac";
+    readonly light: "#b91c1c";
+};
+/** Text and icons on a `danger` fill such as a destructive button (dark 8.6:1, light 6.5:1). */
+declare const onDanger: {
+    readonly dark: "#450a0a";
+    readonly light: "#ffffff";
+};
+/** Success and healthy states, always with an icon and a word. Sits on the blue side of green, so it stays apart from `danger` with red-green colour blindness, and apart from every step and event colour. Text at 4.5:1 or more on every ground. */
+declare const success: {
+    readonly dark: "#8cf9ff";
+    readonly light: "#07675d";
+};
+/** Warnings and states that need attention, always with an icon and a word. Kept apart from `step-transformer` and `event-context`. Text at 4.5:1 or more on every ground. */
+declare const warning: {
+    readonly dark: "#cabb00";
+    readonly light: "#886000";
+};
+/** Neutral information, always with an icon and a word. The `link` colour in both themes. */
+declare const info: {
+    readonly dark: "#4fb3e0";
+    readonly light: "#0076a0";
+};
+/** Tinted fill for danger banners and badges. Text on it is `fg`; the status colour marks the icon and the border (3:1 or more on the tint). */
+declare const dangerBg: {
+    readonly dark: "rgba(255, 164, 172, 0.16)";
+    readonly light: "rgba(185, 28, 28, 0.1)";
+};
+/** Tinted fill for success banners and badges. Text on it is `fg`; the status colour marks the icon and the border (3:1 or more on the tint). */
+declare const successBg: {
+    readonly dark: "rgba(140, 249, 255, 0.16)";
+    readonly light: "rgba(7, 103, 93, 0.1)";
+};
+/** Tinted fill for warning banners and badges. Text on it is `fg`; the status colour marks the icon and the border (3:1 or more on the tint). */
+declare const warningBg: {
+    readonly dark: "rgba(202, 187, 0, 0.16)";
+    readonly light: "rgba(136, 96, 0, 0.1)";
+};
+/** Tinted fill for information banners and badges. Text on it is `fg`; the status colour marks the icon and the border (3:1 or more on the tint). */
+declare const infoBg: {
+    readonly dark: "rgba(79, 179, 224, 0.16)";
+    readonly light: "rgba(0, 118, 160, 0.1)";
+};
+/** Flow step colour: sources. Badges, node accents and edges, always beside the step word; 3:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes. */
+declare const stepSource: {
+    readonly dark: "#6ee7b7";
+    readonly light: "#428569";
+};
+/** Flow step colour: transformers. Badges, node accents and edges, always beside the step word; 3:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes. */
+declare const stepTransformer: {
+    readonly dark: "#fcd34d";
+    readonly light: "#bb7000";
+};
+/** Flow step colour: the collector. Badges, node accents and edges, always beside the step word; 3:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes. */
+declare const stepCollector: {
+    readonly dark: "#7dd3fc";
+    readonly light: "#0c529b";
+};
+/** Flow step colour: destinations. Badges, node accents and edges, always beside the step word; 3:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes. */
+declare const stepDestination: {
+    readonly dark: "#c4b5fd";
+    readonly light: "#6d1fd8";
+};
+/** Flow step colour: stores. Badges, node accents and edges, always beside the step word; 3:1 or more on `bg`, `bg-2`, `surface` and `surface-2` in both themes. */
+declare const stepStore: {
+    readonly dark: "#a5b4fc";
+    readonly light: "#4138c9";
+};
+/** Platform badge: web, always with the word; 3:1 or more on every ground. */
+declare const platformWeb: {
+    readonly dark: "#0ea5e9";
+    readonly light: "#008ddd";
+};
+/** Platform badge: server, always with the word; 3:1 or more on every ground. */
+declare const platformServer: {
+    readonly dark: "#8b5cf6";
+    readonly light: "#8043f6";
+};
+/** First chart series: `primary` in dark, `link` in light. Series take `chart-1` to `chart-6` in order; the six stay apart in normal vision and with red-green colour blindness, and reach 3:1 on every ground. Label every series. */
+declare const chart1: {
+    readonly dark: "#01b5e2";
+    readonly light: "#0076a0";
+};
+/** Second chart series (orange). */
+declare const chart2: {
+    readonly dark: "#e69f00";
+    readonly light: "#ce710c";
+};
+/** Third chart series (bluish green). */
+declare const chart3: {
+    readonly dark: "#009563";
+    readonly light: "#217b58";
+};
+/** Fourth chart series (vermilion). */
+declare const chart4: {
+    readonly dark: "#e0520a";
+    readonly light: "#d32f4d";
+};
+/** Fifth chart series (reddish purple). */
+declare const chart5: {
+    readonly dark: "#ff6fad";
+    readonly light: "#b87889";
+};
+/** Sixth chart series (yellow in dark, olive in light). */
+declare const chart6: {
+    readonly dark: "#f0e442";
+    readonly light: "#546800";
+};
+/** Human notes and comment pins over visualisations, tag plans and frames. Kept apart from every step and status colour; 3:1 or more on every ground. */
+declare const annotation: {
+    readonly dark: "#22c55e";
+    readonly light: "#409116";
+};
+/** Editor syntax (Monaco, Shiki, Prism): comments, 4.6:1 on `code-bg`. */
+declare const syntaxComment = "#8c94be";
+/** Editor syntax (Monaco, Shiki, Prism): strings, attribute names and inserted text, 9.9:1 on `code-bg`. */
+declare const syntaxString = "#c3e88d";
+/** Editor syntax (Monaco, Shiki, Prism): numbers, 5.8:1 on `code-bg`. */
+declare const syntaxNumber = "#f78c6c";
+/** Editor syntax (Monaco, Shiki, Prism): booleans, null and constants, 4.6:1 on `code-bg`. */
+declare const syntaxConstant = "#ff5d78";
+/** Editor syntax (Monaco, Shiki, Prism): keywords and storage modifiers, 5.2:1 on `code-bg`. */
+declare const syntaxKeyword = "#c084fc";
+/** Editor syntax (Monaco, Shiki, Prism): functions and built-ins, 5.9:1 on `code-bg`. */
+declare const syntaxFunction = "#82aaff";
+/** Editor syntax (Monaco, Shiki, Prism): types and class names, 9.1:1 on `code-bg`. */
+declare const syntaxType = "#ffcb6b";
+/** Editor syntax (Monaco, Shiki, Prism): operators and regular expressions, 9.0:1 on `code-bg`. */
+declare const syntaxOperator = "#89ddff";
+/** Editor syntax (Monaco, Shiki, Prism): punctuation and delimiters, 5.7:1 on `code-bg`. */
+declare const syntaxPunct = "#c792ea";
+/** Editor syntax (Monaco, Shiki, Prism): tags, invalid and deleted tokens, 4.6:1 on `code-bg`. */
+declare const syntaxTag = "#ff5d79";
+/** Editor syntax (Monaco, Shiki, Prism): namespaces, 8.1:1 on `code-bg`. */
+declare const syntaxNamespace = "#b2ccd6";
+/** Editor gutter line numbers on `code-bg`. Decorative, below 3:1. */
+declare const codeLineNumber = "#676e95";
+/** Editor selection over `code-bg`; `code-fg` stays at 5.4:1 on it. */
+declare const codeSelection = "#717cb450";
+/** Inserted lines in diff views over `code-bg`; `code-fg` stays at 5.4:1. */
+declare const codeInsertedBg = "#c3e88d26";
+/** Deleted lines in diff views over `code-bg`; `code-fg` stays at 6.6:1. */
+declare const codeDeletedBg = "#ff5d7926";
+/** Font family `sans`. */
+declare const fontSans = "system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Ubuntu, 'Helvetica Neue', Arial, sans-serif";
+/** Font family `mono`. */
+declare const fontMono = "SFMono-Regular, ui-monospace, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace";
+/** Font family `viz`. */
+declare const fontViz = "'Geist', system-ui, sans-serif";
+/** Font family `viz-mono`. */
+declare const fontVizMono = "'Geist Mono', monospace";
+
+export { type Theme, annotation, backdrop, bg, bg2, border, borderStrong, chart1, chart2, chart3, chart4, chart5, chart6, codeBar, codeBg, codeBorder, codeDeletedBg, codeFg, codeInsertedBg, codeLineNumber, codeSelection, danger, dangerBg, elbwalker100, elbwalker200, elbwalker300, elbwalker400, elbwalker500, elbwalker700, elbwalker800, elbwalker900, eventAction, eventConsent, eventContext, eventEntity, eventGlobals, eventProperty, eventUser, fg, fg2, fg3, focus, fontMono, fontSans, fontViz, fontVizMono, glow, info, infoBg, link, onDanger, onPrimary, platformServer, platformWeb, primary, stepCollector, stepDestination, stepSource, stepStore, stepTransformer, success, successBg, surface, surface2, syntaxComment, syntaxConstant, syntaxFunction, syntaxKeyword, syntaxNamespace, syntaxNumber, syntaxOperator, syntaxPunct, syntaxString, syntaxTag, syntaxType, vizBg, vizBorder, vizCodeBg, vizComment, vizFg, vizFg2, vizLineNumber, vizNumber, vizPunct, vizString, vizSurface, vizTag, warning, warningBg };