@duetds/components 9.13.0 → 9.14.0

package/hydrate/index.js

@@ -3461,7 +3461,59 @@ var tokens$2 = /*#__PURE__*/Object.freeze({
     zIndexToast: zIndexToast
 });
 
+const turva2ColorTokens = {
+    "color-turva2-red-00": "#fff2f2",
+    "color-turva2-red-50": "#ffecec",
+    "color-turva2-red-100": "#ffe5e6",
+    "color-turva2-red-200": "#ffc9cc",
+    "color-turva2-red-300": "#f9a4ac",
+    "color-turva2-red-400": "#f37785",
+    "color-turva2-red-500": "#ec4560",
+    "color-turva2-red-600": "#e61740",
+    "color-turva2-red-700": "#b90329",
+    "color-turva2-red-800": "#8c001e",
+    "color-turva2-red-900": "#600014",
+    "color-turva2-red-1000": "#33000a",
+    "color-turva2-gray-00": "#f5f6f7",
+    "color-turva2-gray-50": "#e4e9ed",
+    "color-turva2-gray-100": "#d4dde2",
+    "color-turva2-gray-200": "#b2c2cd",
+    "color-turva2-gray-300": "#94a9b9",
+    "color-turva2-gray-400": "#7891a4",
+    "color-turva2-gray-500": "#5f7a8f",
+    "color-turva2-gray-600": "#48647a",
+    "color-turva2-gray-700": "#354f65",
+    "color-turva2-gray-800": "#253c50",
+    "color-turva2-gray-900": "#172a3b",
+    "color-turva2-gray-1000": "#061726",
+    "color-turva-nude-00": "#fdf7f2",
+    "color-turva-nude-50": "#fbebe1",
+    "color-turva-nude-100": "#fbe1d1",
+    "color-turva-nude-200": "#f1cab2",
+    "color-turva-nude-300": "#d8ae96",
+    "color-turva-nude-400": "#be937c",
+    "color-turva-nude-500": "#a57a65",
+    "color-turva-nude-600": "#8c624f",
+    "color-turva-nude-700": "#724c3c",
+    "color-turva-nude-800": "#59382b",
+    "color-turva-nude-900": "#40261c",
+    "color-turva-nude-1000": "#26150f",
+};
+
 const allowedThemes = ["turva"];
+const MATCH_CAPITAL_CASE = /[A-Z]/g;
+function isTurva2() {
+    var _a;
+    if (typeof document === "undefined") {
+        return false;
+    }
+    return !!((_a = document.documentElement.attributes.getNamedItem("class")) === null || _a === void 0 ? void 0 : _a.value.includes("duet-theme-turva2"));
+}
+function isCamelCase(str) {
+    const camel = MATCH_CAPITAL_CASE.test(str);
+    const barredString = !str.includes("_") && !str.includes("-") && !str.includes(" ");
+    return camel && barredString;
+}
 function isDashCase(str) {
     const dash = str.includes("-");
     const barredString = str.includes(" ") || str.includes("_");
@@ -3507,18 +3559,61 @@ function addTheme(str, theme) {
     }
     return str;
 }
+/**
+ * Add "-turva" to color names (or "Turva" to camelCase color names)
+ */
+function postfixTheme(name, theme) {
+    if (!name) {
+        return undefined;
+    }
+    if (["", "default"].includes(theme)) {
+        return name;
+    }
+    if ((isDashCase(name) && name.endsWith(`-${theme}`)) || (isCamelCase(name) && name.endsWith(capitalize(theme)))) {
+        return name;
+    }
+    if (tokens$2[`color${camelize(name)}${capitalizeFirstLetter(theme)}`]) {
+        return !isCamelCase(name) ? `${name}-${theme}` : `${name}${capitalize(theme)}`;
+    }
+    return name;
+}
 function getColorByName(name, theme = "") {
     if (!name) {
         return undefined;
     }
-    const defaultColor = convertToColorName(name);
-    const themedColor = convertToColorName(name, theme);
-    // lets just try to get the color first to save some cycles
-    let resolvedToken = tokens$2[themedColor];
-    if (!resolvedToken) {
-        resolvedToken = tokens$2[defaultColor];
+    if ((theme === "turva" || name.endsWith("-turva")) && isTurva2()) {
+        switch (name.replace(/-turva$/, "")) {
+            case "primary-lightest":
+                return turva2ColorTokens["color-turva2-nude-00"];
+            case "primary-lighter":
+                return turva2ColorTokens["color-turva2-nude-50"];
+            case "primary-light":
+                return turva2ColorTokens["color-turva2-nude-200"];
+            case "primary":
+                return turva2ColorTokens["color-turva2-red-600"];
+            case "primary-darker":
+                return turva2ColorTokens["color-turva2-red-700"];
+            case "primary-dark":
+                return turva2ColorTokens["color-turva2-red-800"];
+            case "secondary":
+                return turva2ColorTokens["color-turva2-gray-900"];
+            case "gray-lighter":
+                return turva2ColorTokens["color-turva2-gray-00"];
+            case "gray-light":
+                return turva2ColorTokens["color-turva2-gray-100"];
+            case "gray":
+                return turva2ColorTokens["color-turva2-gray-200"];
+            case "gray-dark":
+                return turva2ColorTokens["color-turva2-gray-400"];
+            case "gray-darker":
+                return turva2ColorTokens["color-turva2-gray-500"];
+            // carry on to old turva colors
+        }
     }
-    return resolvedToken;
+    const defaultColor = convertToColorName(name);
+    const themedColor = theme && convertToColorName(name, theme);
+    // return themed color if it exists
+    return tokens$2[themedColor] || tokens$2[defaultColor];
 }
 function convertToColorName(name = "", theme = "") {
     let colorResolution = name;
@@ -4035,12 +4130,12 @@ class DuetBadge {
      */
     render() {
         const backgroundClass = `background-${this.background}`;
-        return (hAsync(Host, { key: 'fa6c996be60aa738c5324d36785910a2df451fda', class: { "duet-m-0": this.margin === "none" } }, hAsync("span", { key: 'fb20eeca5e56a6b530468e01b0c50fdfc62dab5b', class: {
+        return (hAsync(Host, { key: 'a6a6149fb649ab7a3f85dde88813af96ab0a97d7', class: { "duet-m-0": this.margin === "none" } }, hAsync("span", { key: '10305d8c36004b0dc3d30c52fc5fdf307059a3b8', class: {
                 "duet-badge": true,
                 [this.variation]: true,
                 [backgroundClass]: true,
                 "duet-theme-turva": this.theme === "turva",
-            } }, hAsync("slot", { key: 'e8a75efc4cfa0fffd6ec03c37550b967ceec0a9a' }))));
+            } }, hAsync("slot", { key: 'dbd1e4a65e339a023d71e0e863b2b99e478091b3' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetBadgeStyle0; }
@@ -4066,7 +4161,7 @@ const DuetPicture = ({ img, sources }) => {
         hAsync("img", Object.assign({}, img))));
 };
 
-const duetBannerCss = "*,\n*::after,\n*::before {\n  box-sizing: border-box;\n  padding: 0;\n  margin: 0;\n  background: transparent;\n  border: 0;\n  -moz-appearance: none;\n  -webkit-appearance: none;\n  appearance: none;\n}\n\n:host {\n  box-sizing: border-box;\n  padding: 0;\n  margin: 0;\n  background: transparent;\n  border: 0;\n  -moz-appearance: none;\n  -webkit-appearance: none;\n  appearance: none;\n  margin-right: 36px !important;\n  margin-bottom: 36px !important;\n  display: flex;\n  justify-content: center;\n  width: auto;\n  container: duet-banner-container;\n  container-type: inline-size;\n}\n:host:last-child, :host:last-of-type {\n  margin-right: 0 !important;\n}\n\n:host(.duet-m-0) {\n  margin: 0 !important;\n}\n\n.duet-banner {\n  display: grid;\n  grid-template-rows: min-content 1fr;\n  width: 100%;\n  height: 100%;\n  font-family: \"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n  font-style: normal;\n  text-align: left;\n  border-radius: 16px;\n}\n.duet-banner.duet-p-0 {\n  padding: 0 !important;\n}\n.duet-banner.duet-m-0 {\n  margin: 0 !important;\n}\n.duet-banner .visual {\n  position: relative;\n  display: none;\n  overflow: hidden;\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 0px) {\n  .duet-banner .visual {\n    /* stylelint-enable */\n    display: block;\n  }\n}\n.duet-banner .visual .image-container {\n  position: relative;\n  aspect-ratio: 2/1;\n  overflow: hidden;\n}\n.duet-banner .visual .image {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: center;\n}\n.duet-banner .visual .icon {\n  position: absolute;\n}\n.duet-banner .visual .brand-shape {\n  position: absolute;\n  top: 0;\n  left: 72%;\n  display: none;\n  width: 100%;\n  height: 100%;\n  mask-image: url(\"data:image/svg+xml,%3Csvg%20%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20344%22%20fill%3D%22none%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M2.72641e-07%2091.1902C0.000476976%2097.9034%200.626077%20104.726%201.92282%20111.592L42.7493%20327.771C43.8045%20333.358%2045.2667%20338.776%2047.0996%20344H160V0H51.1439C19.7799%2019.1253%200.00268143%2053.4178%202.72641e-07%2091.1749C-9.08807e-08%2091.18%20-9.08875e-08%2091.1851%202.72641e-07%2091.1902Z%22%20fill%3D%22%23E6F2F8%22%2F%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fsvg%3E\");\n}\n.duet-banner .content {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  padding: 16px 20px 28px;\n}\n.duet-banner .content .description {\n  hyphens: auto;\n}\n.duet-banner .action {\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n  align-items: flex-start;\n  justify-content: flex-end;\n  padding-top: 16px;\n}\n.duet-banner .visual {\n  border-top-left-radius: 16px;\n  border-top-right-radius: 16px;\n}\n.duet-banner .visual .image-container {\n  width: 100%;\n  height: auto;\n  border-radius: 0;\n}\n.duet-banner .visual .icon {\n  bottom: 30px;\n  left: 15px;\n}\n.duet-banner.duet-theme-turva {\n  font-family: \"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n}\n.duet-banner.duet-theme-turva .visual .brand-shape {\n  mask-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 160 344' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_7920_3801)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2.58983 142.533C0.751086 155.147 0.0746585 167.857 0.00796847 179.225C0.00263853 179.814 0 180.409 0 181.007C0 194.845 1.41172 210.806 3.58065 223.171C5.6528 234.934 8.58716 246.495 12.5981 257.779C21.2249 282.059 34.0151 304.109 50.8401 323.977C56.7824 330.993 63.0921 337.68 69.8162 344H160V0H65.0733C52.1771 10.7866 41.4339 23.4177 32.7528 37.7978C21.1154 57.0822 14.0367 77.9583 9.75424 99.7913C9.09214 103.157 8.55049 106.545 8.00901 109.933C7.75185 111.542 7.49474 113.15 7.22478 114.756C6.74308 117.618 6.24543 120.479 5.74776 123.34C4.6361 129.729 3.52432 136.12 2.58983 142.533Z' fill='%23F5F5F7'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_7920_3801'%3E%3Crect width='160' height='344' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A\");\n}\n.duet-banner.size-medium, .duet-banner.size-large {\n  /* stylelint-disable */\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 486px) {\n  .duet-banner.size-medium, .duet-banner.size-large {\n    /* stylelint-enable */\n    grid-template-rows: none;\n    grid-template-columns: 50% 50%;\n  }\n  .duet-banner.size-medium .visual, .duet-banner.size-large .visual {\n    border-top-left-radius: 16px;\n    border-top-right-radius: 0;\n    border-bottom-left-radius: 16px;\n  }\n  .duet-banner.size-medium .visual .image-container, .duet-banner.size-large .visual .image-container {\n    height: 100%;\n  }\n  .duet-banner.size-medium .visual .image, .duet-banner.size-large .visual .image {\n    width: 100%;\n    height: 100%;\n  }\n  .duet-banner.size-medium .visual .icon, .duet-banner.size-large .visual .icon {\n    top: 36px;\n    left: 168px;\n  }\n  .duet-banner.size-medium .visual .brand-shape, .duet-banner.size-large .visual .brand-shape {\n    display: block;\n  }\n  .duet-banner.size-medium .content, .duet-banner.size-large .content {\n    align-items: flex-start;\n    justify-content: center;\n    padding: 28px 28px 28px 0;\n  }\n  .duet-banner.size-medium .action, .duet-banner.size-large .action {\n    flex-grow: 0;\n  }\n}\n@container duet-banner-container (min-width: 586px) {\n  .duet-banner.size-medium, .duet-banner.size-large {\n    /* stylelint-enable */\n  }\n  .duet-banner.size-medium .visual .brand-shape, .duet-banner.size-large .visual .brand-shape {\n    left: 80%;\n  }\n}\n.duet-banner.size-large {\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 900px) {\n  .duet-banner.size-large {\n    /* stylelint-enable */\n    grid-template-rows: none;\n    grid-template-columns: 50% 50%;\n  }\n  .duet-banner.size-large .visual {\n    border-top-left-radius: 16px;\n    border-bottom-left-radius: 16px;\n  }\n  .duet-banner.size-large .visual .image-container {\n    height: 100%;\n  }\n  .duet-banner.size-large .visual .image {\n    width: 100%;\n    height: 100%;\n  }\n  .duet-banner.size-large .visual .icon {\n    top: 40px;\n    bottom: auto;\n    left: 335px;\n  }\n  .duet-banner.size-large .visual .brand-shape {\n    display: block;\n  }\n  .duet-banner.size-large .content {\n    align-items: flex-start;\n    justify-content: center;\n    padding: 48px 48px 48px 0;\n  }\n  .duet-banner.size-large .action {\n    flex-grow: 0;\n  }\n}\n.duet-banner.no-image {\n  display: flex;\n  justify-content: center;\n  padding: 36px 20px;\n}\n.duet-banner.no-image .visual {\n  display: none;\n}\n.duet-banner.no-image .content {\n  width: 100%;\n  max-width: 720px;\n  padding: 0;\n}\n.duet-banner.no-image.size-medium, .duet-banner.no-image.size-large {\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 486px) {\n  .duet-banner.no-image.size-medium, .duet-banner.no-image.size-large {\n    /* stylelint-enable */\n    padding: 48px;\n  }\n}";
+const duetBannerCss = "*,\n*::after,\n*::before {\n  box-sizing: border-box;\n  padding: 0;\n  margin: 0;\n  background: transparent;\n  border: 0;\n  -moz-appearance: none;\n  -webkit-appearance: none;\n  appearance: none;\n}\n\n:host {\n  box-sizing: border-box;\n  padding: 0;\n  margin: 0;\n  background: transparent;\n  border: 0;\n  -moz-appearance: none;\n  -webkit-appearance: none;\n  appearance: none;\n  margin-right: 36px !important;\n  margin-bottom: 36px !important;\n  display: flex;\n  justify-content: center;\n  width: auto;\n  container: duet-banner-container;\n  container-type: inline-size;\n}\n:host:last-child, :host:last-of-type {\n  margin-right: 0 !important;\n}\n\n:host(.duet-m-0) {\n  margin: 0 !important;\n}\n\n.duet-banner {\n  display: grid;\n  grid-template-rows: min-content 1fr;\n  width: 100%;\n  height: 100%;\n  font-family: \"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n  font-style: normal;\n  text-align: left;\n  border-radius: 16px;\n}\n.duet-banner.duet-p-0 {\n  padding: 0 !important;\n}\n.duet-banner.duet-m-0 {\n  margin: 0 !important;\n}\n.duet-banner .visual {\n  position: relative;\n  display: none;\n  overflow: hidden;\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 0px) {\n  .duet-banner .visual {\n    /* stylelint-enable */\n    display: block;\n  }\n}\n.duet-banner .visual .image-container {\n  position: relative;\n  aspect-ratio: 2/1;\n  overflow: hidden;\n}\n.duet-banner .visual .image {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: center;\n}\n.duet-banner .visual .icon {\n  position: absolute;\n}\n.duet-banner .visual .brand-shape {\n  position: absolute;\n  top: 0;\n  left: 72%;\n  display: none;\n  width: 100%;\n  height: 100%;\n  mask-image: url(\"data:image/svg+xml,%3Csvg%20%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20344%22%20fill%3D%22none%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M2.72641e-07%2091.1902C0.000476976%2097.9034%200.626077%20104.726%201.92282%20111.592L42.7493%20327.771C43.8045%20333.358%2045.2667%20338.776%2047.0996%20344H160V0H51.1439C19.7799%2019.1253%200.00268143%2053.4178%202.72641e-07%2091.1749C-9.08807e-08%2091.18%20-9.08875e-08%2091.1851%202.72641e-07%2091.1902Z%22%20fill%3D%22%23E6F2F8%22%2F%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fsvg%3E\");\n  transform: scale(101%);\n}\n.duet-banner .content {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  padding: 16px 20px 28px;\n}\n.duet-banner .content .description {\n  hyphens: auto;\n}\n.duet-banner .action {\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n  align-items: flex-start;\n  justify-content: flex-end;\n  padding-top: 16px;\n}\n.duet-banner .visual {\n  border-top-left-radius: 16px;\n  border-top-right-radius: 16px;\n}\n.duet-banner .visual .image-container {\n  width: 100%;\n  height: auto;\n  border-radius: 0;\n}\n.duet-banner .visual .icon {\n  bottom: 30px;\n  left: 15px;\n}\n.duet-banner.duet-theme-turva {\n  font-family: \"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n}\n.duet-banner.duet-theme-turva .visual .brand-shape {\n  mask-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 160 344' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_7920_3801)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2.58983 142.533C0.751086 155.147 0.0746585 167.857 0.00796847 179.225C0.00263853 179.814 0 180.409 0 181.007C0 194.845 1.41172 210.806 3.58065 223.171C5.6528 234.934 8.58716 246.495 12.5981 257.779C21.2249 282.059 34.0151 304.109 50.8401 323.977C56.7824 330.993 63.0921 337.68 69.8162 344H160V0H65.0733C52.1771 10.7866 41.4339 23.4177 32.7528 37.7978C21.1154 57.0822 14.0367 77.9583 9.75424 99.7913C9.09214 103.157 8.55049 106.545 8.00901 109.933C7.75185 111.542 7.49474 113.15 7.22478 114.756C6.74308 117.618 6.24543 120.479 5.74776 123.34C4.6361 129.729 3.52432 136.12 2.58983 142.533Z' fill='%23F5F5F7'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_7920_3801'%3E%3Crect width='160' height='344' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A\");\n}\n.duet-banner.size-medium, .duet-banner.size-large {\n  /* stylelint-disable */\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 486px) {\n  .duet-banner.size-medium, .duet-banner.size-large {\n    /* stylelint-enable */\n    grid-template-rows: none;\n    grid-template-columns: 50% 50%;\n  }\n  .duet-banner.size-medium .visual, .duet-banner.size-large .visual {\n    border-top-left-radius: 16px;\n    border-top-right-radius: 0;\n    border-bottom-left-radius: 16px;\n  }\n  .duet-banner.size-medium .visual .image-container, .duet-banner.size-large .visual .image-container {\n    height: 100%;\n  }\n  .duet-banner.size-medium .visual .image, .duet-banner.size-large .visual .image {\n    width: 100%;\n    height: 100%;\n  }\n  .duet-banner.size-medium .visual .icon, .duet-banner.size-large .visual .icon {\n    top: 36px;\n    left: 168px;\n  }\n  .duet-banner.size-medium .visual .brand-shape, .duet-banner.size-large .visual .brand-shape {\n    display: block;\n  }\n  .duet-banner.size-medium .content, .duet-banner.size-large .content {\n    align-items: flex-start;\n    justify-content: center;\n    padding: 28px 28px 28px 0;\n  }\n  .duet-banner.size-medium .action, .duet-banner.size-large .action {\n    flex-grow: 0;\n  }\n}\n@container duet-banner-container (min-width: 586px) {\n  .duet-banner.size-medium, .duet-banner.size-large {\n    /* stylelint-enable */\n  }\n  .duet-banner.size-medium .visual .brand-shape, .duet-banner.size-large .visual .brand-shape {\n    left: 80%;\n  }\n}\n.duet-banner.size-large {\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 900px) {\n  .duet-banner.size-large {\n    /* stylelint-enable */\n    grid-template-rows: none;\n    grid-template-columns: 50% 50%;\n  }\n  .duet-banner.size-large .visual {\n    border-top-left-radius: 16px;\n    border-bottom-left-radius: 16px;\n  }\n  .duet-banner.size-large .visual .image-container {\n    height: 100%;\n  }\n  .duet-banner.size-large .visual .image {\n    width: 100%;\n    height: 100%;\n  }\n  .duet-banner.size-large .visual .icon {\n    top: 40px;\n    bottom: auto;\n    left: 335px;\n  }\n  .duet-banner.size-large .visual .brand-shape {\n    display: block;\n  }\n  .duet-banner.size-large .content {\n    align-items: flex-start;\n    justify-content: center;\n    padding: 48px 48px 48px 0;\n  }\n  .duet-banner.size-large .action {\n    flex-grow: 0;\n  }\n}\n.duet-banner.no-image {\n  display: flex;\n  justify-content: center;\n  padding: 36px 20px;\n}\n.duet-banner.no-image .visual {\n  display: none;\n}\n.duet-banner.no-image .content {\n  width: 100%;\n  max-width: 720px;\n  padding: 0;\n}\n.duet-banner.no-image.size-medium, .duet-banner.no-image.size-large {\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 486px) {\n  .duet-banner.no-image.size-medium, .duet-banner.no-image.size-large {\n    /* stylelint-enable */\n    padding: 48px;\n  }\n}";
 var DuetBannerStyle0 = duetBannerCss;
 
 /**
@@ -4154,14 +4249,14 @@ class DuetBanner {
             img: { src: this.image, alt: "", loading: "lazy", class: "image", role: "presentation" },
             sources: parsePossibleJSON(this.sources),
         };
-        return (hAsync(Host, { key: 'd279b27f54fba40d358a850d94118a0caa571737', class: { "duet-m-0": this.margin === "none" } }, hAsync("aside", { key: 'fa270dd8231b5b22d2c0157105df3171fd56f450', class: {
+        return (hAsync(Host, { key: '12cea619c3a29693b7bbb7189962468eee715f68', class: { "duet-m-0": this.margin === "none" } }, hAsync("aside", { key: 'b4e70162ea52e299c8cc3481961e1354f7a348d0', class: {
                 "duet-banner": true,
                 "duet-theme-turva": this.theme === "turva",
                 [this.currentSize]: true,
                 "size-medium": this.size === "medium" || this.size === "large",
                 "size-large": this.size === "large",
                 "no-image": !this.image,
-            }, style: bannerStyles }, hAsync("div", { key: 'c3cbef43ed49f67f5c429692c0d673f65341cbf8', class: "visual" }, hAsync("div", { key: '6e1defb61acf399734e5843f100d17a467acc52c', class: "image-container" }, this.image && hAsync(DuetPicture, Object.assign({ key: '9b8cf3946c557db548bf9e4a63a9f77e1a528eca' }, pictureSource))), 1 > 2  , hAsync("div", { key: 'de431601a73be43d79f29e7e4cc4e943ae00e545', style: bannerStyles, class: "brand-shape" })), hAsync("div", { key: '50f7a5fc5f4ade0905bc272e29e7d0c4912c1020', class: "content" }, this.hasHeadingSlot && (hAsync("div", { key: '73cd6a4f3f4022f897df0ce57a2316043f403dba', class: "heading" }, hAsync("duet-heading", { key: '1d7d47b81255653206534bb228d11e8eee154c2c', theme: this.theme, level: this.headingLevel, "visual-level": this.currentSize === "large" ? "h2" : "h3", "fixed-size": true, margin: "none", color: this.textColor }, hAsync("span", { key: 'f340c4b1e80fdd5a64ed8d61512879b290662b37' }, hAsync("slot", { key: '2041e9d5b57a5adb5a325e4bf2052cece9d59d83', name: "heading" }))))), this.hasDescriptionSlot && (hAsync("div", { key: '77bee71dfd8d16749a238336fb0ca182dc6da387', class: "description", style: { color } }, hAsync("slot", { key: 'bc10b7a951bf3ca738bb2214d4f78a2258f373d3', name: "description" }))), this.hasActionSlot && (hAsync("div", { key: 'c842a4bd1a20ff10617c0df53b0491e897de4371', class: "action" }, hAsync("slot", { key: 'a17d57f164e2973eb0bdaa8902b93eaafdc3b96e', name: "action" })))))));
+            }, style: bannerStyles }, hAsync("div", { key: '77b6658e115f6c6ad322e4d81607a842de28ad7f', class: "visual" }, hAsync("div", { key: '1140037769c9615f7fc233d5ef7db5e93e5b1434', class: "image-container" }, this.image && hAsync(DuetPicture, Object.assign({ key: '63b777ee272d5fe8c7df6f6a8bff7b84a44c9dff' }, pictureSource))), 1 > 2  , hAsync("div", { key: '5af78573b362552f7bdc061be9bed68373255aae', style: bannerStyles, class: "brand-shape" })), hAsync("div", { key: '99f371a78ff9d7e85cff37c9c5eb2d49f51e7aaa', class: "content" }, this.hasHeadingSlot && (hAsync("div", { key: '8684e9cbd15cd42e8bce73271543ce7fc91b63fc', class: "heading" }, hAsync("duet-heading", { key: '2d3348662100fc98f088ac9dee4a5a38681ce9d7', theme: this.theme, level: this.headingLevel, "visual-level": this.currentSize === "large" ? "h2" : "h3", "fixed-size": true, margin: "none", color: postfixTheme(this.textColor, this.theme) }, hAsync("span", { key: '692332080a527df5d5ed15773ef34efbda983f15' }, hAsync("slot", { key: '8a0a0e72edfcf4c55f66b8565fe90b948e86c4bc', name: "heading" }))))), this.hasDescriptionSlot && (hAsync("div", { key: 'daba4eb6a51dc590ea3591132b8cddebb5cf9756', class: "description", style: { color } }, hAsync("slot", { key: '5d8e3bc1324a170bf266b89e8815896c470a512a', name: "description" }))), this.hasActionSlot && (hAsync("div", { key: 'c9d0e0f700ef91081cad82c8edb5db69ee38ef56', class: "action" }, hAsync("slot", { key: 'e72dfb579efb7ad822de3f59d3d828fffd3ef015', name: "action" })))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetBannerStyle0; }
@@ -4230,14 +4325,14 @@ class DuetBreadcrumb {
      */
     render() {
         var _a;
-        return (hAsync(Host, { key: '689d0258e18fdfbbd6f4d01c8ab355a1a8312c2f', role: "listitem" }, hAsync("div", { key: '909354599a3a41ee94fd902605d5299666bd599b', class: "container" }, this.icon === "arrow-right-small-icon" && (hAsync("duet-icon", { key: '9fc66ffab8615edd97b3bedefd33f7fa80491694', class: "duet-breadrumbs-arrow", size: "auto", icon: actionArrowRightSmall.svg, margin: "none", color: "currentColor" })), hAsync("a", { key: 'ed4010eedd8d1da13bde66c21a9885d8831c580b', class: {
+        return (hAsync(Host, { key: 'c2bbd3a09d833237865fbbea918ce71e6e945708', role: "listitem" }, hAsync("div", { key: '1ef1271eba23e853ecd07dca639a1dc249a9047a', class: "container" }, this.icon === "arrow-right-small-icon" && (hAsync("duet-icon", { key: '953679a489bc876ab43d44486de61cbb9f5237aa', class: "duet-breadrumbs-arrow", size: "auto", icon: actionArrowRightSmall.svg, margin: "none", color: "currentColor" })), hAsync("a", { key: '305807ceab521e988a065fc7f0dfeba105afd65f', class: {
                 "duet-breadcrumb": true,
                 "duet-theme-turva": this.theme === "turva",
             }, href: this.href ? this.href : undefined, "aria-label": `${!this.href ? `${getLocaleString(this.currentCrumb)} ` : ""}${(_a = this.accessibleLabel) !== null && _a !== void 0 ? _a : this.element.innerHTML}`, role: "link" }, this.icon !== "arrow-right-small-icon" &&
             this.icon && [
-            hAsync("duet-icon", { key: '9b0d1364911cb1737106f201a2c4db931133f38e', size: this.iconSize, name: this.icon, margin: "none", color: "currentColor" }),
-            this.hasSlottedContent && hAsync("duet-spacer", { key: '27f506daef53b848c270e8be99c0f2aaebb80004', size: "x-small", direction: "horizontal" }),
-        ], hAsync("slot", { key: '2bc8ee802dc29cc82123e91b9178e5f51e9709c9' })))));
+            hAsync("duet-icon", { key: '469e852366ff1d5dc79ef285eb53cff133a4b86a', size: this.iconSize, name: this.icon, margin: "none", color: "currentColor" }),
+            this.hasSlottedContent && hAsync("duet-spacer", { key: 'eff56162ec750f1b4b1053eefd39a3096e6535a1', size: "x-small", direction: "horizontal" }),
+        ], hAsync("slot", { key: '08865bb50c3bfc475427e56afb06baa5796b9e43' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetBreadcrumbStyle0; }
@@ -4298,11 +4393,11 @@ class DuetBreadcrumbs {
      */
     render() {
         const color = getColorByName(this.color);
-        return (hAsync(Host, { key: '996e5aefa1bd4292a2ef8e9defb42967032c8011' }, hAsync("nav", { key: '5971870c10d1faabc65248ee6113cd8a84e7a2ae', "aria-label": this.breadcrumbsAriaLabel, class: {
+        return (hAsync(Host, { key: 'de5bf9664c5f5ab572fce45bc993713510474cb0' }, hAsync("nav", { key: 'ffd74db147e85616f7e10428bfe537179b168e58', "aria-label": this.breadcrumbsAriaLabel, class: {
                 "duet-breadcrumbs": true,
                 "duet-theme-turva": this.theme === "turva",
                 [this.variation]: true,
-            } }, hAsync("div", { key: 'e13adcf97e2a6fefb2e73a302b09776418d81272', class: "container" }, hAsync("div", { key: 'a628bb7c78faaa9952d40bc5dab4171e1bfb9f00', role: "list", class: "list", style: { color } }, hAsync("slot", { key: 'bde592b8806f2e74c1031d2ac4ca58b2b0279c55' })), hAsync("div", { key: 'c6c7386a1148b7173eae0919a4c3ba7cee0322c1', class: "bottom-border bottom-border--container" })), hAsync("div", { key: '668a74528b4859e29e226f3c33311557191a9bc3', class: "bottom-border bottom-border--nav" }))));
+            } }, hAsync("div", { key: '06d6391d9154c82c9ba8e8c3c4c098f40ea862bc', class: "container" }, hAsync("div", { key: '6e14f970ac38086d9874b6a5fb68c43036891658', role: "list", class: "list", style: { color } }, hAsync("slot", { key: '8d97e7c891b2b78f0efff2e4993ef71a831e062d' })), hAsync("div", { key: '915ea715ad6bbdf67320744cd8e2df75af1a082f', class: "bottom-border bottom-border--container" })), hAsync("div", { key: '8d416d6fca5363df5bd6d1d82b1aad4274588cd8', class: "bottom-border bottom-border--nav" }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetBreadcrumbsStyle0; }
@@ -4347,7 +4442,7 @@ const DuetStringsListStepOfTotal = {
     sv: "Lista med {total} steg. Du är på steg {current}.",
 };
 
-const duetButtonCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:8px !important;margin-bottom:12px !important;position:relative;z-index:1;display:inline-flex;width:auto;max-width:100%;font-size:0;vertical-align:bottom;-webkit-tap-highlight-color:transparent}:host:last-child,:host:last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){:host{width:100%}}:host(.square){margin-right:12px !important}:host(.square):last-child,:host(.square):last-of-type{margin-right:0 !important}:host(.input-button){z-index:250}:host(.duet-small),:host(.duet-x-small){margin-right:4px !important;margin-bottom:8px !important}:host(.duet-small):last-child,:host(.duet-small):last-of-type,:host(.duet-x-small):last-child,:host(.duet-x-small):last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){:host(.duet-small),:host(.duet-x-small){width:auto}}:host(.duet-x-small){margin-right:2px !important}:host(.duet-x-small):last-child,:host(.duet-x-small):last-of-type{margin-right:0 !important}:host(.square.duet-small),:host(.square.duet-x-small){margin-right:8px !important}:host(.square.duet-small):last-child,:host(.square.duet-small):last-of-type,:host(.square.duet-x-small):last-child,:host(.square.duet-x-small):last-of-type{margin-right:0 !important}:host(.duet-expand){width:100% !important}:host(.duet-m-0){margin:0 !important}:host(.duet-fixed){width:auto !important}:host(:last-child){margin-right:0 !important}.duet-button-container{position:relative;display:block;width:100%}.duet-button{-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:flex;align-items:center;width:100%;min-width:8rem;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:600;line-height:1.1;color:rgb(0, 119, 179) !important;text-align:center;text-decoration:none;cursor:pointer;background:transparent;border-style:solid;border-width:1px;transition:background-color 300ms ease, color 300ms ease, border 300ms ease, outline 300ms ease, padding 300ms ease, box-shadow 300ms ease}.duet-button.duet-p-0{padding:0 !important}.duet-button.duet-m-0{margin:0 !important}.duet-button:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-button:focus,.duet-button:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-button.duet-button-size-medium{height:50px;padding-right:30px;padding-left:30px;font-size:1rem;border-radius:25px}.duet-theme-turva .duet-button.duet-button-size-medium{padding-right:24px;padding-left:24px;border-radius:12.5px}.duet-button.duet-button-size-medium.square{border-radius:12.5px}.duet-button.duet-button-size-medium.icon-left{padding-left:24px}.duet-theme-turva .duet-button.duet-button-size-medium.icon-left{padding-left:18px}.duet-button.duet-button-size-medium.icon-right{padding-right:24px}.duet-theme-turva .duet-button.duet-button-size-medium.icon-right{padding-right:18px}.duet-button.duet-button-size-small{height:40px;padding-right:20px;padding-left:20px;font-size:0.875rem;border-radius:20px}.duet-theme-turva .duet-button.duet-button-size-small{padding-right:18px;padding-left:18px;border-radius:10px}.duet-button.duet-button-size-small.square{border-radius:10px}.duet-button.duet-button-size-small.icon-left{padding-left:18px}.duet-theme-turva .duet-button.duet-button-size-small.icon-left{padding-left:14px}.duet-button.duet-button-size-small.icon-right{padding-right:18px}.duet-theme-turva .duet-button.duet-button-size-small.icon-right{padding-right:14px}.duet-button.duet-button-size-x-small{height:32px;padding-right:12px;padding-left:12px;font-size:0.75rem;border-radius:8px}.duet-button.duet-button-size-x-small.icon-left{padding-left:10px}.duet-button.duet-button-size-x-small.icon-right{padding-right:10px}.duet-button.plain.duet-p-0{height:auto}.duet-button:not(.input-button-primary,.input-button-secondary,.input-button-embedded){font-variant-numeric:tabular-nums}.duet-button.duet-button-text-center{text-align:center !important}.duet-button.duet-button-is-small:not(.duet-button-icon-only){min-width:48px}.duet-button.duet-button-is-small:not(.duet-button-icon-only).plain{padding-right:0 !important;padding-left:0 !important}.duet-button.duet-button-is-small:not(.duet-button-icon-only).duet-p-0{padding:0 !important}.duet-theme-turva .duet-button{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(198, 12, 48) !important}.duet-button .duet-button-contents{position:relative;display:flex;gap:10px;align-items:center;margin:0 auto;pointer-events:none}.duet-button .duet-button-contents.icon-right{flex-direction:row-reverse}.duet-button .duet-button-contents .duet-button-contents-slot{position:relative;top:0}.duet-button.duet-no-wrap{white-space:nowrap}.duet-button svg{width:100%;min-width:100%;fill:currentColor}.duet-button .duet-button-icon{display:flex;align-items:center}.duet-button .duet-button-icon duet-icon{width:16px;height:16px}.duet-button .duet-button-icon.large duet-icon{width:20px;height:20px}.duet-button .duet-button-icon.medium-small duet-icon{width:10px;height:10px}.duet-button .duet-button-icon.small duet-icon{width:7px;height:7px}.duet-button:active:not([disabled]){opacity:0.75;transition:none}.duet-button.default{background:rgb(255, 255, 255);border-color:rgb(181, 198, 208)}.duet-theme-turva .duet-button.default{color:rgb(198, 12, 48) !important;border-color:rgb(222, 224, 228)}.duet-button.default:hover{border-color:rgb(0, 119, 179);outline:2px solid rgb(0, 119, 179);outline-offset:-2px}.duet-theme-turva .duet-button.default:hover{border-color:rgb(198, 12, 48);outline-color:rgb(198, 12, 48)}.duet-button.default.duet-button-negative{background-color:rgb(255, 255, 255)}.duet-theme-turva .duet-button.default.duet-button-negative{background-color:rgb(222, 224, 228) !important}.duet-button.default.duet-button-negative:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.default.duet-button-negative:hover{color:rgb(198, 12, 48) !important;border-color:rgb(198, 12, 48)}.duet-button.primary,.duet-button.input-button-primary,.duet-button.input-button-left-primary{color:rgb(255, 255, 255) !important;background:rgb(0, 119, 179);border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.primary,.duet-theme-turva .duet-button.input-button-primary,.duet-theme-turva .duet-button.input-button-left-primary{color:rgb(255, 255, 255) !important;background:rgb(198, 12, 48);border-color:rgb(198, 12, 48)}.duet-button.primary:hover,.duet-button.input-button-primary:hover,.duet-button.input-button-left-primary:hover{background:#005f8f;border-color:#005f8f;box-shadow:0 4px 20px 0 rgba(34, 34, 34, 0.1)}.duet-theme-turva .duet-button.primary:hover,.duet-theme-turva .duet-button.input-button-primary:hover,.duet-theme-turva .duet-button.input-button-left-primary:hover{background:rgb(126, 2, 35);border-color:rgb(126, 2, 35)}.duet-button.primary:focus,.duet-button.input-button-primary:focus,.duet-button.input-button-left-primary:focus{outline:0;box-shadow:0 0 0 1px #fff, 0 0 0 4px rgba(0, 119, 179, 0.75)}.duet-theme-turva .duet-button.primary:focus,.duet-theme-turva .duet-button.input-button-primary:focus,.duet-theme-turva .duet-button.input-button-left-primary:focus{box-shadow:0 0 0 1px #fff, 0 0 0 4px rgba(23, 28, 58, 0.75)}.duet-button.secondary,.duet-button.input-button-secondary,.duet-button.input-button-left-secondary,.duet-button.input-button-embedded{color:rgb(8, 42, 77) !important;background:transparent;border-color:rgb(8, 42, 77)}.duet-theme-turva .duet-button.secondary,.duet-theme-turva .duet-button.input-button-secondary,.duet-theme-turva .duet-button.input-button-left-secondary,.duet-theme-turva .duet-button.input-button-embedded{color:rgb(23, 28, 58) !important;border-color:rgb(23, 28, 58)}.duet-button.secondary:hover,.duet-button.input-button-secondary:hover,.duet-button.input-button-left-secondary:hover,.duet-button.input-button-embedded:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.secondary:hover,.duet-theme-turva .duet-button.input-button-secondary:hover,.duet-theme-turva .duet-button.input-button-left-secondary:hover,.duet-theme-turva .duet-button.input-button-embedded:hover{color:rgb(198, 12, 48) !important;border-color:rgb(198, 12, 48)}.duet-button.secondary.duet-button-negative,.duet-button.input-button-secondary.duet-button-negative,.duet-button.input-button-left-secondary.duet-button-negative,.duet-button.input-button-embedded.duet-button-negative{color:rgb(212, 223, 229) !important;border-color:rgb(255, 255, 255)}.duet-theme-turva .duet-button.secondary.duet-button-negative,.duet-theme-turva .duet-button.input-button-secondary.duet-button-negative,.duet-theme-turva .duet-button.input-button-left-secondary.duet-button-negative,.duet-theme-turva .duet-button.input-button-embedded.duet-button-negative{color:rgb(222, 224, 228) !important}.duet-button.secondary.duet-button-negative:hover,.duet-button.input-button-secondary.duet-button-negative:hover,.duet-button.input-button-left-secondary.duet-button-negative:hover,.duet-button.input-button-embedded.duet-button-negative:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.secondary.duet-button-negative:hover,.duet-theme-turva .duet-button.input-button-secondary.duet-button-negative:hover,.duet-theme-turva .duet-button.input-button-left-secondary.duet-button-negative:hover,.duet-theme-turva .duet-button.input-button-embedded.duet-button-negative:hover{color:rgb(198, 12, 48) !important;border-color:rgb(198, 12, 48)}.duet-button.input-button-embedded{width:40px;min-width:40px !important;min-height:40px !important;margin:4px !important;border-width:0 !important;border-radius:4px !important}.duet-button.input-button{height:auto}.duet-button.negative{color:rgb(8, 42, 77) !important;background:rgb(255, 255, 255);border-color:rgb(255, 255, 255)}.duet-theme-turva .duet-button.negative{color:rgb(23, 28, 58) !important}.duet-button.negative:hover{color:rgb(255, 255, 255) !important;background:transparent;border-color:rgb(255, 255, 255)}.duet-button.negative:focus{outline:0;box-shadow:0 0 0 1px #00294d, 0 0 0 4px rgba(255, 255, 255, 0.7)}.duet-theme-turva .duet-button.negative:focus{box-shadow:0 0 0 1px #0077b3, 0 0 0 4px rgba(255, 255, 255, 0.7)}.duet-button.destructive-primary{color:rgb(255, 255, 255) !important;background:rgb(214, 28, 82);border-color:rgb(214, 28, 82)}.duet-theme-turva .duet-button.destructive-primary{color:rgb(255, 255, 255) !important;background:rgb(214, 28, 82);border-color:rgb(214, 28, 82)}.duet-button.destructive-primary:hover{background:#ab1642;border-color:#ab1642;box-shadow:0 4px 20px 0 rgba(34, 34, 34, 0.1)}.duet-theme-turva .duet-button.destructive-primary:hover{background:#ab1642}.duet-button.destructive,.duet-button.destructive-secondary{color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255);border-color:rgb(214, 28, 82)}.duet-theme-turva .duet-button.destructive,.duet-theme-turva .duet-button.destructive-secondary{color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255);border-color:rgb(214, 28, 82)}.duet-button.destructive:hover,.duet-button.destructive-secondary:hover{color:rgb(255, 255, 255) !important;background:#ab1642;border-color:#ab1642}.duet-theme-turva .duet-button.destructive:hover,.duet-theme-turva .duet-button.destructive-secondary:hover{color:rgb(255, 255, 255) !important;background:#ab1642;border-color:#ab1642}.duet-button.plain{min-width:48px;padding-right:0 !important;padding-left:0 !important;line-height:1.5;text-align:left;background:transparent;border:0;border-color:transparent;border-radius:4px}.duet-theme-turva .duet-button.plain{color:rgb(198, 12, 48) !important;background:transparent;border-color:transparent}.duet-button.plain.duet-p-0 .duet-button-contents{height:auto}.duet-button.plain[disabled]{color:rgb(98, 121, 138) !important;cursor:not-allowed;background:transparent !important;border-color:transparent !important}.duet-theme-turva .duet-button.plain[disabled]{color:transparent !important;cursor:not-allowed;background:transparent !important;border-color:rgb(222, 224, 228) !important}.duet-button.plain:hover{color:rgb(0, 75, 129) !important;background:transparent !important}.duet-theme-turva .duet-button.plain:hover{color:rgb(126, 2, 35) !important}.duet-button.plain.duet-button-negative{color:rgb(255, 255, 255) !important}.duet-theme-turva .duet-button.plain.duet-button-negative{color:rgb(255, 255, 255) !important}.duet-button.plain.duet-button-negative:hover{color:rgba(255, 255, 255, 0.8) !important}.duet-button.duet-button-icon-only{min-width:48px;min-height:48px;padding:0 !important}.duet-button.duet-button-icon-only .duet-button-contents{position:static}.duet-button.duet-button-icon-only .duet-button-icon.left.large,.duet-button.duet-button-icon-only .duet-button-icon.left.medium,.duet-button.duet-button-icon-only .duet-button-icon.left.small{position:absolute;top:50% !important;left:50% !important;padding:0;margin:0;transform:translateX(-50%) translateY(-50%)}.duet-button.duet-button.input-button-primary,.duet-button.duet-button.input-button-secondary,.duet-button.duet-button.input-button-embedded,.duet-button.duet-button.input-button-left-primary,.duet-button.duet-button.input-button-left-secondary{box-sizing:content-box;min-width:48px;min-height:48px;padding:0 !important;border-width:1px}.duet-button.duet-button.input-button-primary .duet-button-contents,.duet-button.duet-button.input-button-secondary .duet-button-contents,.duet-button.duet-button.input-button-embedded .duet-button-contents,.duet-button.duet-button.input-button-left-primary .duet-button-contents,.duet-button.duet-button.input-button-left-secondary .duet-button-contents{position:static}.duet-button.duet-button.input-button-primary .duet-button-contents.icon-right,.duet-button.duet-button.input-button-secondary .duet-button-contents.icon-right,.duet-button.duet-button.input-button-embedded .duet-button-contents.icon-right,.duet-button.duet-button.input-button-left-primary .duet-button-contents.icon-right,.duet-button.duet-button.input-button-left-secondary .duet-button-contents.icon-right{padding:0 16px}.duet-button.duet-button.input-button-primary,.duet-button.duet-button.input-button-secondary,.duet-button.duet-button.input-button-embedded{border-top-left-radius:0;border-top-right-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:0}.duet-button.duet-button.input-button-primary .duet-button-icon.left.large,.duet-button.duet-button.input-button-primary .duet-button-icon.left.medium,.duet-button.duet-button.input-button-primary .duet-button-icon.left.small,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.large,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.medium,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.small,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.large,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.medium,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.small{position:absolute;top:50% !important;left:50% !important;padding:0;margin:0;transform:translateX(-50%) translateY(-50%)}.duet-button.duet-button.input-button-embedded{border-left-width:0}.duet-button.duet-button.input-button-left-primary,.duet-button.duet-button.input-button-left-secondary{border-top-left-radius:4px;border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:4px}.duet-button.duet-button.input-button-left-primary .duet-button-contents,.duet-button.duet-button.input-button-left-secondary .duet-button-contents{position:static}.duet-button.square{width:52px;min-width:auto !important;padding:0 !important;font-size:1rem;border-color:rgb(181, 198, 208);border-width:1px}.duet-button.square.duet-button-size-small{width:42px;font-size:0.875rem}.duet-button.square.duet-button-size-x-small{width:34px;font-size:0.875rem}.duet-button.square.duet-button-negative{color:rgb(255, 255, 255) !important;background:rgb(0, 119, 179);border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.square.duet-button-negative{color:rgb(255, 255, 255) !important;background:rgb(198, 12, 48);border-color:rgb(198, 12, 48)}.duet-theme-turva .duet-button.square{border-color:rgb(222, 224, 228)}.duet-button.square:hover{border-color:rgb(0, 119, 179);outline:2px solid rgb(0, 119, 179);outline-offset:-2px}.duet-theme-turva .duet-button.square:hover{border-color:rgb(198, 12, 48);outline-color:rgb(198, 12, 48)}.duet-button.square .duet-button-contents{gap:0}.duet-button[disabled],.duet-button[disabled]:hover,.duet-button.duet-button-negative[disabled],.duet-button.duet-button-negative[disabled]:hover{color:rgb(98, 121, 138) !important;cursor:not-allowed;background:rgb(212, 223, 229) !important;border-color:rgb(212, 223, 229) !important;outline-color:rgb(212, 223, 229) !important;box-shadow:none !important}.duet-theme-turva .duet-button[disabled],.duet-theme-turva .duet-button[disabled]:hover,.duet-theme-turva .duet-button.duet-button-negative [disabled],.duet-theme-turva .duet-button.duet-button-negative [disabled]:hover{color:rgb(143, 147, 158) !important;cursor:not-allowed;background:rgb(222, 224, 228) !important;border-color:rgb(222, 224, 228) !important;outline-color:rgb(222, 224, 228) !important}.duet-button-is-loading.primary,.duet-button-is-loading.input-button-primary{color:rgb(255, 255, 255)}.duet-button-is-loading.default{color:rgb(0, 119, 179)}.duet-button-is-loading.default.duet-theme-turva{color:rgb(198, 12, 48)}.duet-button-is-loading .duet-button-contents{visibility:hidden;opacity:0}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.default{color:#e61740 !important;border-color:#fbe1d1}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.default:hover{border-color:#e61740;outline-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.default.duet-button-negative{background-color:#fbe1d1 !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.default.duet-button-negative:hover{color:#e61740 !important;border-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.primary,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-primary,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-left-primary{background:#e61740;border-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.secondary,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-secondary,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-left-secondary,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-embedded{color:#172a3b !important;border-color:#172a3b}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.secondary:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-secondary:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-left-secondary:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-embedded:hover{color:#e61740 !important;border-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.secondary.duet-button-negative,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-secondary.duet-button-negative,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-left-secondary.duet-button-negative,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-embedded.duet-button-negative{color:#fbe1d1 !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.secondary.duet-button-negative:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-secondary.duet-button-negative:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-left-secondary.duet-button-negative:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-embedded.duet-button-negative:hover{color:#e61740 !important;border-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.negative{color:#172a3b !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.negative:hover{color:rgb(255, 255, 255) !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.plain{color:#e61740 !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.plain.duet-button-negative{color:rgb(255, 255, 255) !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.plain:hover{color:rgba(255, 255, 255, 0.8) !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.plain[disabled]{border-color:#fbe1d1 !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.square{border-color:#fbe1d1}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.square.duet-button-negative{background:#e61740;border-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.square:hover{border-color:#e61740;outline-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button-is-loading.default{color:#e61740}";
+const duetButtonCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:8px !important;margin-bottom:12px !important;position:relative;z-index:1;display:inline-flex;width:auto;max-width:100%;font-size:0;vertical-align:bottom;-webkit-tap-highlight-color:transparent}:host:last-child,:host:last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){:host{width:100%}}:host(.square){margin-right:12px !important}:host(.square):last-child,:host(.square):last-of-type{margin-right:0 !important}:host(.input-button){z-index:250}:host(.duet-small),:host(.duet-x-small){margin-right:4px !important;margin-bottom:8px !important}:host(.duet-small):last-child,:host(.duet-small):last-of-type,:host(.duet-x-small):last-child,:host(.duet-x-small):last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){:host(.duet-small),:host(.duet-x-small){width:auto}}:host(.duet-x-small){margin-right:2px !important}:host(.duet-x-small):last-child,:host(.duet-x-small):last-of-type{margin-right:0 !important}:host(.square.duet-small),:host(.square.duet-x-small){margin-right:8px !important}:host(.square.duet-small):last-child,:host(.square.duet-small):last-of-type,:host(.square.duet-x-small):last-child,:host(.square.duet-x-small):last-of-type{margin-right:0 !important}:host(.duet-expand){width:100% !important}:host(.duet-m-0){margin:0 !important}:host(.duet-fixed){width:auto !important}:host(:last-child){margin-right:0 !important}.duet-button-container{position:relative;display:block;width:100%}.duet-button{-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:flex;align-items:center;width:100%;min-width:8rem;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:600;line-height:1.1;color:rgb(0, 119, 179) !important;text-align:center;text-decoration:none;cursor:pointer;background:transparent;border-style:solid;border-width:1px;transition:background-color 300ms ease, color 300ms ease, border 300ms ease, outline 300ms ease, padding 300ms ease, box-shadow 300ms ease}.duet-button.duet-p-0{padding:0 !important}.duet-button.duet-m-0{margin:0 !important}.duet-button:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-button:focus,.duet-button:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-button.duet-button-size-medium{height:50px;padding-right:30px;padding-left:30px;font-size:1rem;border-radius:25px}.duet-theme-turva .duet-button.duet-button-size-medium{padding-right:24px;padding-left:24px;border-radius:12.5px}.duet-button.duet-button-size-medium.square{border-radius:12.5px}.duet-button.duet-button-size-medium.icon-left{padding-left:24px}.duet-theme-turva .duet-button.duet-button-size-medium.icon-left{padding-left:18px}.duet-button.duet-button-size-medium.icon-right{padding-right:24px}.duet-theme-turva .duet-button.duet-button-size-medium.icon-right{padding-right:18px}.duet-button.duet-button-size-small{height:40px;padding-right:20px;padding-left:20px;font-size:0.875rem;border-radius:20px}.duet-theme-turva .duet-button.duet-button-size-small{padding-right:18px;padding-left:18px;border-radius:10px}.duet-button.duet-button-size-small.square{border-radius:10px}.duet-button.duet-button-size-small.icon-left{padding-left:18px}.duet-theme-turva .duet-button.duet-button-size-small.icon-left{padding-left:14px}.duet-button.duet-button-size-small.icon-right{padding-right:18px}.duet-theme-turva .duet-button.duet-button-size-small.icon-right{padding-right:14px}.duet-button.duet-button-size-x-small{height:32px;padding-right:12px;padding-left:12px;font-size:0.75rem;border-radius:8px}.duet-button.duet-button-size-x-small.icon-left{padding-left:10px}.duet-button.duet-button-size-x-small.icon-right{padding-right:10px}.duet-button.plain.duet-p-0{height:auto}.duet-button:not(.input-button-primary,.input-button-secondary,.input-button-embedded){font-variant-numeric:tabular-nums}.duet-button.duet-button-text-center{text-align:center !important}.duet-button.duet-button-is-small:not(.duet-button-icon-only){min-width:48px}.duet-button.duet-button-is-small:not(.duet-button-icon-only).plain{padding-right:0 !important;padding-left:0 !important}.duet-button.duet-button-is-small:not(.duet-button-icon-only).duet-p-0{padding:0 !important}.duet-theme-turva .duet-button{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(198, 12, 48) !important}.duet-button .duet-button-contents{position:relative;display:flex;gap:10px;align-items:center;margin:0 auto;pointer-events:none}.duet-button .duet-button-contents.icon-right{flex-direction:row-reverse}.duet-button .duet-button-contents .duet-button-contents-slot{position:relative;top:0}.duet-button.duet-no-wrap{white-space:nowrap}.duet-button svg{width:100%;min-width:100%;fill:currentColor}.duet-button .duet-button-icon{display:flex;align-items:center}.duet-button .duet-button-icon duet-icon{width:16px;height:16px}.duet-button .duet-button-icon.large duet-icon{width:20px;height:20px}.duet-button .duet-button-icon.medium-small duet-icon{width:10px;height:10px}.duet-button .duet-button-icon.small duet-icon{width:7px;height:7px}.duet-button:active:not([disabled]){opacity:0.75;transition:none}.duet-button.default{background:rgb(255, 255, 255);border-color:rgb(181, 198, 208)}.duet-theme-turva .duet-button.default{color:rgb(198, 12, 48) !important;border-color:rgb(222, 224, 228)}.duet-button.default:hover{border-color:rgb(0, 119, 179);outline:2px solid rgb(0, 119, 179);outline-offset:-2px}.duet-theme-turva .duet-button.default:hover{border-color:rgb(198, 12, 48);outline-color:rgb(198, 12, 48)}.duet-button.default.duet-button-negative{background-color:rgb(255, 255, 255)}.duet-theme-turva .duet-button.default.duet-button-negative{background-color:rgb(222, 224, 228) !important}.duet-button.default.duet-button-negative:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.default.duet-button-negative:hover{color:rgb(198, 12, 48) !important;border-color:rgb(198, 12, 48)}.duet-button.primary,.duet-button.input-button-primary,.duet-button.input-button-left-primary{color:rgb(255, 255, 255) !important;background:rgb(0, 119, 179);border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.primary,.duet-theme-turva .duet-button.input-button-primary,.duet-theme-turva .duet-button.input-button-left-primary{color:rgb(255, 255, 255) !important;background:rgb(198, 12, 48);border-color:rgb(198, 12, 48)}.duet-button.primary:hover,.duet-button.input-button-primary:hover,.duet-button.input-button-left-primary:hover{background:#005f8f;border-color:#005f8f;box-shadow:0 4px 20px 0 rgba(34, 34, 34, 0.1)}.duet-theme-turva .duet-button.primary:hover,.duet-theme-turva .duet-button.input-button-primary:hover,.duet-theme-turva .duet-button.input-button-left-primary:hover{background:rgb(126, 2, 35);border-color:rgb(126, 2, 35)}.duet-button.primary:focus,.duet-button.input-button-primary:focus,.duet-button.input-button-left-primary:focus{outline:0;box-shadow:0 0 0 1px #fff, 0 0 0 4px rgba(0, 119, 179, 0.75)}.duet-theme-turva .duet-button.primary:focus,.duet-theme-turva .duet-button.input-button-primary:focus,.duet-theme-turva .duet-button.input-button-left-primary:focus{box-shadow:0 0 0 1px #fff, 0 0 0 4px rgba(23, 28, 58, 0.75)}.duet-button.secondary,.duet-button.input-button-secondary,.duet-button.input-button-left-secondary,.duet-button.input-button-embedded{color:rgb(8, 42, 77) !important;background:transparent;border-color:rgb(8, 42, 77)}.duet-theme-turva .duet-button.secondary,.duet-theme-turva .duet-button.input-button-secondary,.duet-theme-turva .duet-button.input-button-left-secondary,.duet-theme-turva .duet-button.input-button-embedded{color:rgb(23, 28, 58) !important;border-color:rgb(23, 28, 58)}.duet-button.secondary:hover,.duet-button.input-button-secondary:hover,.duet-button.input-button-left-secondary:hover,.duet-button.input-button-embedded:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.secondary:hover,.duet-theme-turva .duet-button.input-button-secondary:hover,.duet-theme-turva .duet-button.input-button-left-secondary:hover,.duet-theme-turva .duet-button.input-button-embedded:hover{color:rgb(198, 12, 48) !important;border-color:rgb(198, 12, 48)}.duet-button.secondary.duet-button-negative,.duet-button.input-button-secondary.duet-button-negative,.duet-button.input-button-left-secondary.duet-button-negative,.duet-button.input-button-embedded.duet-button-negative{color:rgb(212, 223, 229) !important;border-color:rgb(255, 255, 255)}.duet-theme-turva .duet-button.secondary.duet-button-negative,.duet-theme-turva .duet-button.input-button-secondary.duet-button-negative,.duet-theme-turva .duet-button.input-button-left-secondary.duet-button-negative,.duet-theme-turva .duet-button.input-button-embedded.duet-button-negative{color:rgb(222, 224, 228) !important}.duet-button.secondary.duet-button-negative:hover,.duet-button.input-button-secondary.duet-button-negative:hover,.duet-button.input-button-left-secondary.duet-button-negative:hover,.duet-button.input-button-embedded.duet-button-negative:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.secondary.duet-button-negative:hover,.duet-theme-turva .duet-button.input-button-secondary.duet-button-negative:hover,.duet-theme-turva .duet-button.input-button-left-secondary.duet-button-negative:hover,.duet-theme-turva .duet-button.input-button-embedded.duet-button-negative:hover{color:rgb(198, 12, 48) !important;border-color:rgb(198, 12, 48)}.duet-button.input-button-embedded{width:40px;min-width:40px !important;min-height:40px !important;margin:4px !important;border-width:0 !important;border-radius:4px !important}.duet-button.input-button{height:auto}.duet-button.negative{color:rgb(8, 42, 77) !important;background:rgb(255, 255, 255);border-color:rgb(255, 255, 255)}.duet-theme-turva .duet-button.negative{color:rgb(23, 28, 58) !important}.duet-button.negative:hover{color:rgb(255, 255, 255) !important;background:transparent;border-color:rgb(255, 255, 255)}.duet-button.negative:focus{outline:0;box-shadow:0 0 0 1px #00294d, 0 0 0 4px rgba(255, 255, 255, 0.7)}.duet-theme-turva .duet-button.negative:focus{box-shadow:0 0 0 1px #0077b3, 0 0 0 4px rgba(255, 255, 255, 0.7)}.duet-button.destructive-primary{color:rgb(255, 255, 255) !important;background:rgb(214, 28, 82);border-color:rgb(214, 28, 82)}.duet-theme-turva .duet-button.destructive-primary{color:rgb(255, 255, 255) !important;background:rgb(214, 28, 82);border-color:rgb(214, 28, 82)}.duet-button.destructive-primary:hover{background:#ab1642;border-color:#ab1642;box-shadow:0 4px 20px 0 rgba(34, 34, 34, 0.1)}.duet-theme-turva .duet-button.destructive-primary:hover{background:#ab1642}.duet-button.destructive,.duet-button.destructive-secondary{color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255);border-color:rgb(214, 28, 82)}.duet-theme-turva .duet-button.destructive,.duet-theme-turva .duet-button.destructive-secondary{color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255);border-color:rgb(214, 28, 82)}.duet-button.destructive:hover,.duet-button.destructive-secondary:hover{color:rgb(255, 255, 255) !important;background:#ab1642;border-color:#ab1642}.duet-theme-turva .duet-button.destructive:hover,.duet-theme-turva .duet-button.destructive-secondary:hover{color:rgb(255, 255, 255) !important;background:#ab1642;border-color:#ab1642}.duet-button.plain{min-width:48px;padding-right:0 !important;padding-left:0 !important;line-height:1.5;text-align:left;background:transparent;border:0;border-color:transparent;border-radius:4px}.duet-theme-turva .duet-button.plain{color:rgb(198, 12, 48) !important;background:transparent;border-color:transparent}.duet-button.plain.duet-p-0 .duet-button-contents{height:auto}.duet-button.plain[disabled],.duet-button.plain[disabled]:hover{color:rgb(98, 121, 138) !important;cursor:not-allowed;background:transparent !important;border-color:transparent !important}.duet-theme-turva .duet-button.plain[disabled],.duet-theme-turva .duet-button.plain[disabled]:hover{color:rgb(113, 118, 132) !important;cursor:not-allowed;background:transparent !important;border-color:rgb(222, 224, 228) !important}.duet-button.plain:hover{color:rgb(0, 75, 129) !important;background:transparent !important}.duet-theme-turva .duet-button.plain:hover{color:rgb(126, 2, 35) !important}.duet-button.plain.duet-button-negative{color:rgb(255, 255, 255) !important}.duet-theme-turva .duet-button.plain.duet-button-negative{color:rgb(255, 255, 255) !important}.duet-button.plain.duet-button-negative:hover{color:rgba(255, 255, 255, 0.8) !important}.duet-button.duet-button-icon-only{min-width:48px;min-height:48px;padding:0 !important}.duet-button.duet-button-icon-only .duet-button-contents{position:static}.duet-button.duet-button-icon-only .duet-button-icon.left.large,.duet-button.duet-button-icon-only .duet-button-icon.left.medium,.duet-button.duet-button-icon-only .duet-button-icon.left.small{position:absolute;top:50% !important;left:50% !important;padding:0;margin:0;transform:translateX(-50%) translateY(-50%)}.duet-button.duet-button.input-button-primary,.duet-button.duet-button.input-button-secondary,.duet-button.duet-button.input-button-embedded,.duet-button.duet-button.input-button-left-primary,.duet-button.duet-button.input-button-left-secondary{box-sizing:content-box;min-width:48px;min-height:48px;padding:0 !important;border-width:1px}.duet-button.duet-button.input-button-primary .duet-button-contents,.duet-button.duet-button.input-button-secondary .duet-button-contents,.duet-button.duet-button.input-button-embedded .duet-button-contents,.duet-button.duet-button.input-button-left-primary .duet-button-contents,.duet-button.duet-button.input-button-left-secondary .duet-button-contents{position:static}.duet-button.duet-button.input-button-primary .duet-button-contents.icon-right,.duet-button.duet-button.input-button-secondary .duet-button-contents.icon-right,.duet-button.duet-button.input-button-embedded .duet-button-contents.icon-right,.duet-button.duet-button.input-button-left-primary .duet-button-contents.icon-right,.duet-button.duet-button.input-button-left-secondary .duet-button-contents.icon-right{padding:0 16px}.duet-button.duet-button.input-button-primary,.duet-button.duet-button.input-button-secondary,.duet-button.duet-button.input-button-embedded{border-top-left-radius:0;border-top-right-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:0}.duet-button.duet-button.input-button-primary .duet-button-icon.left.large,.duet-button.duet-button.input-button-primary .duet-button-icon.left.medium,.duet-button.duet-button.input-button-primary .duet-button-icon.left.small,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.large,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.medium,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.small,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.large,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.medium,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.small{position:absolute;top:50% !important;left:50% !important;padding:0;margin:0;transform:translateX(-50%) translateY(-50%)}.duet-button.duet-button.input-button-embedded{border-left-width:0}.duet-button.duet-button.input-button-left-primary,.duet-button.duet-button.input-button-left-secondary{border-top-left-radius:4px;border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:4px}.duet-button.duet-button.input-button-left-primary .duet-button-contents,.duet-button.duet-button.input-button-left-secondary .duet-button-contents{position:static}.duet-button.square{width:52px;min-width:auto !important;padding:0 !important;font-size:1rem;border-color:rgb(181, 198, 208);border-width:1px}.duet-button.square.duet-button-size-small{width:42px;font-size:0.875rem}.duet-button.square.duet-button-size-x-small{width:34px;font-size:0.875rem}.duet-button.square.duet-button-negative{color:rgb(255, 255, 255) !important;background:rgb(0, 119, 179);border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.square.duet-button-negative{color:rgb(255, 255, 255) !important;background:rgb(198, 12, 48);border-color:rgb(198, 12, 48)}.duet-theme-turva .duet-button.square{border-color:rgb(222, 224, 228)}.duet-button.square:hover{border-color:rgb(0, 119, 179);outline:2px solid rgb(0, 119, 179);outline-offset:-2px}.duet-theme-turva .duet-button.square:hover{border-color:rgb(198, 12, 48);outline-color:rgb(198, 12, 48)}.duet-button.square .duet-button-contents{gap:0}.duet-button[disabled],.duet-button[disabled]:hover,.duet-button.duet-button-negative[disabled],.duet-button.duet-button-negative[disabled]:hover{color:rgb(98, 121, 138) !important;cursor:not-allowed;background:rgb(212, 223, 229) !important;border-color:rgb(212, 223, 229) !important;outline-color:rgb(212, 223, 229) !important;box-shadow:none !important}.duet-theme-turva .duet-button[disabled],.duet-theme-turva .duet-button[disabled]:hover,.duet-theme-turva .duet-button.duet-button-negative [disabled],.duet-theme-turva .duet-button.duet-button-negative [disabled]:hover{color:rgb(143, 147, 158) !important;cursor:not-allowed;background:rgb(222, 224, 228) !important;border-color:rgb(222, 224, 228) !important;outline-color:rgb(222, 224, 228) !important}.duet-button-is-loading.primary,.duet-button-is-loading.input-button-primary{color:rgb(255, 255, 255)}.duet-button-is-loading.default{color:rgb(0, 119, 179)}.duet-button-is-loading.default.duet-theme-turva{color:rgb(198, 12, 48)}.duet-button-is-loading .duet-button-contents{visibility:hidden;opacity:0}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.default{color:#e61740 !important;border-color:#fbe1d1}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.default:hover{border-color:#e61740;outline-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.default.duet-button-negative{background-color:#fbe1d1 !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.default.duet-button-negative:hover{color:#e61740 !important;border-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.primary,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-primary,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-left-primary{background:#e61740;border-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.secondary,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-secondary,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-left-secondary,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-embedded{color:#172a3b !important;border-color:#172a3b}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.secondary:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-secondary:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-left-secondary:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-embedded:hover{color:#e61740 !important;border-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.secondary.duet-button-negative,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-secondary.duet-button-negative,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-left-secondary.duet-button-negative,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-embedded.duet-button-negative{color:#fbe1d1 !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.secondary.duet-button-negative:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-secondary.duet-button-negative:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-left-secondary.duet-button-negative:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-embedded.duet-button-negative:hover{color:#e61740 !important;border-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.negative{color:#172a3b !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.negative:hover{color:rgb(255, 255, 255) !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.plain{color:#e61740 !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.plain.duet-button-negative{color:rgb(255, 255, 255) !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.plain:hover{color:#8c001e !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.plain[disabled],:host(.duet-theme-turva2) .duet-theme-turva .duet-button.plain[disabled]:hover{color:#5f7a8f !important;background:transparent !important;border-color:#fbe1d1 !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.square{border-color:#fbe1d1}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.square.duet-button-negative{background:#e61740;border-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.square:hover{border-color:#e61740;outline-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button[disabled],:host(.duet-theme-turva2) .duet-theme-turva .duet-button[disabled]:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.duet-button-negative [disabled],:host(.duet-theme-turva2) .duet-theme-turva .duet-button.duet-button-negative [disabled]:hover{color:#7891a4 !important;cursor:not-allowed;background:#d4dde2 !important;border-color:#d4dde2 !important;outline-color:#d4dde2 !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button-is-loading.default{color:#e61740}";
 var DuetButtonStyle0 = duetButtonCss;
 
 class DuetButton {
@@ -4520,12 +4615,12 @@ class DuetButton {
         // enforce consistency for external links
         const icon = isExternalLink ? "action-new-window" : this.icon;
         const iconRight = isExternalLink ? true : this.iconRight;
-        const commonChildren = (hAsync("span", { key: 'dad881c4e315cee7e2fa16020ab44f3b8518ce8b', class: { "duet-button-contents": true, "icon-right": iconRight }, style: { color: getColorByName(this.color) } }, icon && (hAsync("span", { key: '08d196d1bc190ccb57d8f4961a78e1999f69a6f1', "aria-hidden": "true", class: {
+        const commonChildren = (hAsync("span", { key: '4b6618222c037ec329c118f7ad247b9fd514e878', class: { "duet-button-contents": true, "icon-right": iconRight }, style: { color: getColorByName(this.color, this.theme) } }, icon && (hAsync("span", { key: '67492c9b50231879ba232f7c6bcdadcb2d219875', "aria-hidden": "true", class: {
                 "duet-button-icon": true,
                 left: !iconRight,
                 right: iconRight,
                 [this.getButtonIconSize()]: true,
-            } }, hAsync("duet-icon", { key: '24ffeda883152bfe0123a828ed037aa7bdf365aa', size: "auto", margin: "none", name: icon, color: "currentColor" }))), hAsync("span", { key: '60cbc950fc893b105e13e98769341697d3065e87', class: "duet-button-contents-slot" }, hAsync("slot", { key: '236c0748e32a96046fe4bf1c79b6822ebf5c0b9d' }))));
+            } }, hAsync("duet-icon", { key: 'fce0630d78df187c2a7f3946ff3d262c43e5ce95', size: "auto", margin: "none", name: icon, color: "currentColor" }))), hAsync("span", { key: '34d608211bac6921c4aec51f71a9b33e2ac2b7b0', class: "duet-button-contents-slot" }, hAsync("slot", { key: 'b2478d851993c148be6a83a76f9f725469bc9944' }))));
         const size = this.size == "medium" || this.size == "small" || this.size == "x-small" ? this.size : "medium";
         const commonProps = {
             onFocus: this.onFocus,
@@ -4560,7 +4655,7 @@ class DuetButton {
             "aria-details": this.accessibleDetails,
             "aria-description": this.accessibleDescription,
         };
-        return (hAsync(Host, { key: '2f71565d21679c2161cbebaa8b3bfaa7aa4183a0', class: {
+        return (hAsync(Host, { key: 'c70e2d9cbe884c7b6cc3012721f01ce6d54b4555', class: {
                 "duet-m-0": this.margin === "none",
                 "duet-small": this.size === "small",
                 "duet-x-small": this.size === "x-small",
@@ -4568,13 +4663,13 @@ class DuetButton {
                 "duet-expand": this.expand,
                 [this.variation]: true,
                 "input-button": (_b = this.variation) === null || _b === void 0 ? void 0 : _b.startsWith("input-button"),
-            } }, hAsync("span", { key: '2a2d449975f67608f602eaca489e4ff865496ed8', onClick: this.handleClick, class: {
+            } }, hAsync("span", { key: 'c8be7792d2ae572befbfbe921a3ec453c073637d', onClick: this.handleClick, class: {
                 "duet-button-container": true,
                 "duet-button-is-loading": this.loading,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-button-negative": this.negative || this.variation === "negative",
                 [this.variation]: true,
-            } }, this.url ? (hAsync("a", Object.assign({}, commonProps, { href: this.url, target: this.external ? "_blank" : "_self", rel: this.external ? "noopener" : undefined }), commonChildren, this.external && hAsync("duet-visually-hidden", null, ", ", this.accessibleLabelExternal))) : (hAsync("button", Object.assign({}, commonProps, { type: this.getButtonType(), disabled: this.disabled, name: this.name, value: this.value, "aria-pressed": this.accessiblePressed != null ? this.accessiblePressed.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, "aria-disabled": this.disabled }), commonChildren, this.loading && hAsync("duet-visually-hidden", null, " ", this.accessibleLabelLoading, " "))), this.loading && hAsync("duet-spinner", { key: 'e27fdd855b9191cdd22c9b74746f3144890d3837', color: "currentColor" })), hAsync("slot", { key: '5f1fec755bfdf56ed261b893fa647308c1e21a7f', name: "proxybutton" })));
+            } }, this.url ? (hAsync("a", Object.assign({}, commonProps, { href: this.url, target: this.external ? "_blank" : "_self", rel: this.external ? "noopener" : undefined }), commonChildren, this.external && hAsync("duet-visually-hidden", null, ", ", this.accessibleLabelExternal))) : (hAsync("button", Object.assign({}, commonProps, { type: this.getButtonType(), disabled: this.disabled, name: this.name, value: this.value, "aria-pressed": this.accessiblePressed != null ? this.accessiblePressed.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, "aria-disabled": this.disabled }), commonChildren, this.loading && hAsync("duet-visually-hidden", null, " ", this.accessibleLabelLoading, " "))), this.loading && hAsync("duet-spinner", { key: 'da956cda627d2afc5084ee69629b54ffabcb672b', color: "currentColor" })), hAsync("slot", { key: '0ead01a475d6242c0049a259f9b9c725830d4b80', name: "proxybutton" })));
     }
     get element() { return getElement(this); }
     static get style() { return DuetButtonStyle0; }
@@ -4661,11 +4756,11 @@ class DuetCallout {
     <path d="M6.6591 0.557547L9.2031 2.33355C7.0911 5.21355 6.1311 7.18155 5.8431 8.90955C7.4751 9.34155 8.7231 10.5415 8.7231 12.6535C8.7231 15.2935 6.9471 16.9255 4.6431 16.9255C2.0511 16.9255 0.227096 15.1975 0.227096 12.2695C0.227096 8.28555 2.3871 4.34955 6.6591 0.557547ZM17.9871 8.95755C19.6191 9.34155 20.8671 10.5415 20.8671 12.6535C20.8671 15.2935 19.1391 16.9255 16.8351 16.9255C14.2431 16.9255 12.4191 15.1975 12.4191 12.2695C12.4191 8.28555 14.5791 4.34955 18.8511 0.557547L21.3951 2.33355C19.2351 5.21355 18.3231 7.18155 17.9871 8.95755Z"/>
     </svg>
     `;
-        return (hAsync(Host, { key: '2d1eadb42a67c31dd1d5e3498f00254e08b9b2cd' }, hAsync("div", { key: '6e5be94e6e61eaf272e52f9de9070f8de6a9484d', class: {
+        return (hAsync(Host, { key: '85f99d167ac281ddceb8a8a69da07d854be973f7' }, hAsync("div", { key: '14ccbc1c5d5f56368fefdcfa8ac2b48f46c3e0b7', class: {
                 "duet-callout": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-m-0": this.margin === "none",
-            } }, hAsync("figure", { key: '1652580bcf78ac7c5ddb8b0a254de66725b98e9b', class: "container" }, hAsync("duet-icon", { key: '541cfe32ac9e9155924e22e7bf00850b70b79602', class: "callout-icon", shape: "brand-rotated", background: "primary-lighter", "background-opacity": "0.75", "background-rotation": this.theme === "turva" ? "0" : "7", color: "secondary", icon: icon, size: "auto", margin: "none", theme: this.theme }), hAsync("blockquote", { key: '59af18b18c95e816e8dc446a3bcbe45f9c13f4fe' }, hAsync("slot", { key: 'f90f9674baa8d9e81c688920babcccc9e3e20468' })), this.hasAuthorSlot && (hAsync("figcaption", { key: 'ee4f1307e15ebfa58d6b7d29a7bdea93b3b5868f', class: "author" }, hAsync("span", { key: 'e6861f2ba21ba016d94cf482d93c614e5433e805' }, "\u2014 "), hAsync("slot", { key: 'c9cede4ee6f69cbf35c591d4c23787ccc7c7c8d1', name: "author" })))))));
+            } }, hAsync("figure", { key: 'fe2a9c932a02907cda19e0f258e36a1c5a83a1bc', class: "container" }, hAsync("duet-icon", { key: 'f9ddcf0c22344b4490cd3433e4d85e644a8b4e63', class: "callout-icon", shape: "brand-rotated", background: "primary-lighter", "background-opacity": "0.75", "background-rotation": this.theme === "turva" ? "0" : "7", color: "secondary", icon: icon, size: "auto", margin: "none", theme: this.theme }), hAsync("blockquote", { key: '11b22131f070c316b6cadd833f0fb5d12bf0ed4a' }, hAsync("slot", { key: '6448a4a8b760c12a583b4454c183f32c26a8e4cf' })), this.hasAuthorSlot && (hAsync("figcaption", { key: '3d98ce3b4e9a1d81ba99d1c8cbb38eacc91bb2d0', class: "author" }, hAsync("span", { key: '9a8f0ab6cbeba79793fbc1926924e4d4acc3cf5b' }, "\u2014 "), hAsync("slot", { key: '928a1113e8f44b3f6439a9ce1ec5f96771b95270', name: "author" })))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetCalloutStyle0; }
@@ -5028,11 +5123,11 @@ class DuetCheckmark {
         inheritGlobalTheme(this);
     }
     render() {
-        return (hAsync(Host, { key: '0c46b037eeb1d3a569233716e3931bb9e6d36a3b', class: { "duet-theme-turva": this.theme === "turva" } }, hAsync("div", { key: '77315f3c12b6d27a6e2736eac734c6830704d15a', role: this.presentationOnly ? "presentation" : null, class: { checked: this.checked } }, hAsync("div", { key: '1b895cb3066e53481dae93943c90c4fa57fa1f3d', class: {
+        return (hAsync(Host, { key: '8f8df4562a1d37c1e3ced47dace2f8ca487a9f73', class: { "duet-theme-turva": this.theme === "turva" } }, hAsync("div", { key: 'b803f9fe255ac6166546a8a0398b4958d46cd0df', role: this.presentationOnly ? "presentation" : null, class: { checked: this.checked } }, hAsync("div", { key: 'a284f559c645796efaa1fd9e74a7d1544154b26f', class: {
                 "duet-checkmark-container": true,
                 center: this.center,
                 "duet-checkmark-radio": this.type === "radio",
-            } }, this.checked && hAsync("div", { key: '2edba7cb3c44eed2b9af34c9a1afd893cadc3bfa', class: "duet-checkmark" })))));
+            } }, this.checked && hAsync("div", { key: 'e17c92da194bbedbd6f4159efabad9321c52fa49', class: "duet-checkmark" })))));
     }
     static get style() { return DuetCheckmarkStyle0; }
     static get cmpMeta() { return {
@@ -7370,10 +7465,10 @@ class DuetContactCard {
     render() {
         const isTurva = this.theme === "turva";
         const theme = isTurva ? "turva" : "default";
-        return (hAsync(Host, { key: '27e103c0c5049f7fab515607764a54b61951c1e0', class: { "duet-m-0": this.margin === "none" } }, hAsync("div", { key: 'c574b5e46c7fa008821587bb36154641b390b903', class: {
+        return (hAsync(Host, { key: 'cc92ac8c254dd4d8059e41dc84a0885936486939', class: { "duet-m-0": this.margin === "none" } }, hAsync("div", { key: '95dcbf611c7ffa2e00d4e3413b4e5d4ef76007d4', class: {
                 "duet-contact-card": true,
                 "duet-theme-turva": this.theme === "turva",
-            }, role: "group", "aria-label": this.name }, this.image ? hAsync("img", { class: "image", src: this.image, alt: this.name }) : hAsync("div", null), hAsync("div", { key: 'ad527316cf8b63feb34bd4dd79f77324b7f48c80' }, this.name && (hAsync("duet-heading", { key: '6774b39b0bbd63f84d262fcf3f2ecad255664ce0', class: "name", level: "h3", margin: "none", theme: theme }, this.name)), this.description && (hAsync("duet-paragraph", { key: 'f8dcb174650b2bc6f9ab36f8995c9e4629cd4cb7', class: "description", margin: "none", theme: theme }, this.description)), this.email && (hAsync("div", { key: '73e0f30a03c566d15e338a87506fcf537f8c5cfd', class: "email" }, hAsync("duet-icon", { key: '362a6a97716c3a14aee0aa4f922b46752a512fe0', name: "navigation-message", size: "x-small", color: "primary-dark", margin: "none", theme: theme }), hAsync("duet-link", { key: '86f261b33c3199a7e02d697417f835d70f3300fa', url: `mailto:${this.email}`, accessibleLabel: `Email: ${this.email}`, theme: theme }, this.email))), this.phone && (hAsync("div", { key: 'fefe6fcb46d1113762849f95e2dcb7c4625d2472', class: "phone" }, hAsync("duet-icon", { key: '55a47952ffee9a4d97c714aa749219bc6d7aa2b8', name: "form-tel", size: "x-small", color: "primary-dark", margin: "none", theme: theme }), hAsync("duet-link", { key: '618acf848c98219d2a05233a8f072401a33c5507', url: `tel:${this.phone}`, accessibleLabel: `${this.phoneLabel[this.language]}: ${this.phone}`, theme: theme }, this.phone)))), this.buttonUrl && this.buttonText && (hAsync("div", { key: 'bc881ffff92c8433241d886ebd054090356ffece', class: "call-to-action" }, hAsync("duet-button", { key: '8147b7ed59d0c12d235059e6a1d1ec7551f1e184', variation: "default", icon: this.buttonIcon, fixed: true, margin: "none", url: this.buttonUrl, theme: theme }, this.buttonText))), hAsync("div", { key: '1d06de992fe79882232166faca835f6468ce796f' }), hAsync("slot", { key: 'ade5d1b926723e45fc1ff45faeef9fa14bd5af56' }))));
+            }, role: "group", "aria-label": this.name }, this.image ? hAsync("img", { class: "image", src: this.image, alt: this.name }) : hAsync("div", null), hAsync("div", { key: 'cb2b61b56ea9cbfd80aec1c7c280cc35b7704306' }, this.name && (hAsync("duet-heading", { key: 'd7ce3e63272101a9f8a4cd7d3f259a4ffdbe746d', class: "name", level: "h3", margin: "none", theme: theme }, this.name)), this.description && (hAsync("duet-paragraph", { key: 'aea14ddd85a3568d5b77a49e56df6ac76540a3a9', class: "description", margin: "none", theme: theme }, this.description)), this.email && (hAsync("div", { key: '323330c4a1a8c188827cd7eeaf9e215706b23b62', class: "email" }, hAsync("duet-icon", { key: '33ae4ab4b3b810d5f48494adad568458f627b07a', name: "navigation-message", size: "x-small", color: "primary-dark", margin: "none", theme: theme }), hAsync("duet-link", { key: '84ce51f0721ede904044fee80b8cbf86e66b1ec8', url: `mailto:${this.email}`, accessibleLabel: `Email: ${this.email}`, theme: theme }, this.email))), this.phone && (hAsync("div", { key: '7c63f2689781c66d80d32415cf200bd968fe347c', class: "phone" }, hAsync("duet-icon", { key: '6a56352c7a808bedf087a8b60edd2579dbddef4b', name: "form-tel", size: "x-small", color: "primary-dark", margin: "none", theme: theme }), hAsync("duet-link", { key: 'b2b78cbff49648d799b020ee52ce54f412285b13', url: `tel:${this.phone}`, accessibleLabel: `${this.phoneLabel[this.language]}: ${this.phone}`, theme: theme }, this.phone)))), this.buttonUrl && this.buttonText && (hAsync("div", { key: '9a24e774e65e1f9cdd587f8ccfd8a3bf6ac57e10', class: "call-to-action" }, hAsync("duet-button", { key: '7c7e4b45dc28293a9f44a71d07ad4c6a6882364a', variation: "default", icon: this.buttonIcon, fixed: true, margin: "none", url: this.buttonUrl, theme: theme }, this.buttonText))), hAsync("div", { key: '85e9b10271e93b14e8e5a2821d72e7ee5ff4f194' }), hAsync("slot", { key: 'ba84e396a9e346ff2f9cbc7c9dd66d4eefdbe2d7' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetContactCardStyle0; }
@@ -8414,20 +8509,20 @@ class DuetFieldset {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '52a7af4072f1687d77b6554d57ec17a5d55aaff2', class: { "duet-m-0": this.margin === "none" } }, hAsync("fieldset", { key: '951a9bd1cd7a9c05946b8ddeef1d070643bc4c4e', "aria-labelledby": this.labelId, "aria-describedby": this.error ? this.errorId : null,
+        return (hAsync(Host, { key: 'faf60f2966a89f4867cf37db394585f73fff686e', class: { "duet-m-0": this.margin === "none" } }, hAsync("fieldset", { key: 'f020b6ec6801a8b83c9a5bc93a43d7a35d7506ce', "aria-labelledby": this.labelId, "aria-describedby": this.error ? this.errorId : null,
             // NVDA and VoiceOver do not yet support aria-errormessage
             // once they do, we can remove errors from the aria-describedby
             // aria-errormessage={this.error ? this.errorId : null}
             class: {
                 "duet-fieldset": true,
                 "duet-theme-turva": this.theme === "turva",
-            } }, hAsync("legend", { key: '83afcaa840a3cf7b369c9e42e880e73eabacb979', id: this.labelId }, hAsync(this.labelHeadingLevel, { key: 'f4d98ebe02e7fe0b96a69c9ed77c720b28286a65' }, this.label), this.caption && hAsync("span", { key: '36254f57334b8778f314d1e93769d26e141cf6f3' }, this.caption)), hAsync("div", { key: '311ebc92a4464e106b361afe19c9d000b33bd115', class: {
+            } }, hAsync("legend", { key: '66b5ccbde158c98f27fbc6a46a4e6a6df23ff898', id: this.labelId }, hAsync(this.labelHeadingLevel, { key: '45be33f32735066278ab2b9f3b809014d0f9676b' }, this.label), this.caption && hAsync("span", { key: 'e544fb508d9001319a7f3a4f3b4b5ec8166f8025' }, this.caption)), hAsync("div", { key: 'f0ad41b915201af1a2f9d95e9f9829d0bfdae2e6', class: {
                 "duet-legend-wrapper": true,
                 "duet-legend-has-caption": !!this.caption,
                 "duet-legend-has-tooltip": this.hasTooltip,
                 "duet-legend-hidden": this.labelHidden,
                 "duet-legend-compact": this.compactLabel,
-            } }, hAsync("div", { key: 'c4b624b7ea3358f3158d1460e771f0a024484290', class: "duet-fieldset-label" }, hAsync("span", { key: '8861094bcd63579364449bcc7b8773b8e7c1b3e0', "aria-hidden": "true" }, this.label), hAsync("slot", { key: '36eedc6038045711a0ad90f602029a48dc71f37b', onSlotchange: this.checkHasTooltip, name: "tooltip" })), this.caption && (hAsync("div", { key: '74d7fcb0d6f43b96de7dfd358c3f06223b4aa084', class: "duet-fieldset-caption", "aria-hidden": "true" }, hAsync("duet-caption", { key: 'd04e90dd750eb4c0ef1950901f47cbf4810a0983', theme: this.theme, margin: "none" }, this.caption)))), hAsync("slot", { key: 'e972c7e0393ebe8469916c5aaeb037cae5c52ff0' }), hAsync("span", { key: '874c61a83a132e10b2dbc694f057d9dff7dbb982', class: "duet-fieldset-help duet-fieldset-error", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && hAsync("span", { key: 'e52f94e350f68530fbcb9f6ce204a567a82fe376', class: { "duet-m-0": this.lastItemIsChip } }, this.error)))));
+            } }, hAsync("div", { key: '5a632f1718ae040c523fec5d67abe8b7150c62a6', class: "duet-fieldset-label" }, hAsync("span", { key: '96af5bd097ce6c732cabfeeed24ad70acbc0242f', "aria-hidden": "true" }, this.label), hAsync("slot", { key: 'a9d4abbfbc6586fc072f15d0ada1e0678581eea3', onSlotchange: this.checkHasTooltip, name: "tooltip" })), this.caption && (hAsync("div", { key: '09060f463be57b59b6a313dbf51961197a567f40', class: "duet-fieldset-caption", "aria-hidden": "true" }, hAsync("duet-caption", { key: 'd5f8281d4970d4e26290d3163188afea4b286694', theme: this.theme, margin: "none" }, this.caption)))), hAsync("slot", { key: '3e8180e636e2ec3000f4d21dd9ee50dc12f396f6' }), hAsync("span", { key: 'fc0dc472b4ef27d06a1272f621c936f14ffa1de4', class: "duet-fieldset-help duet-fieldset-error", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && hAsync("span", { key: '8586a6c9b1a32ed3e780a0d7233664bce741c3b6', class: { "duet-m-0": this.lastItemIsChip } }, this.error)))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetFieldsetStyle0; }
@@ -9517,7 +9612,7 @@ class DuetHeader {
                     "duet-theme-turva": this.theme === "turva",
                     "duet-header-back": true,
                     "duet-header-inactive": true,
-                }, part: "header" }, hAsync("div", { class: "duet-header-top" }, skipToLabel(), hAsync("duet-button", { url: this.processedBack.href, id: this.processedBack.id, theme: this.theme, variation: "plain", color: this.theme === "turva" ? "secondary-turva" : "secondary", icon: "navigation-arrow-left", iconSize: "large", onClick: this.handleBackClick }, this.processedBack.label), logo(), hAsync("slot", { name: "logo-utility" }))))));
+                }, part: "header" }, hAsync("div", { class: "duet-header-top" }, skipToLabel(), hAsync("duet-button", { url: this.processedBack.href, id: this.processedBack.id, theme: this.theme, variation: "plain", color: postfixTheme("secondary", this.theme), icon: "navigation-arrow-left", iconSize: "large", onClick: this.handleBackClick }, this.processedBack.label), logo(), hAsync("slot", { name: "logo-utility" }))))));
         }
         const itemsHaveSubItems = this.processedItems && this.processedItems.some(item => item.items && item.items.length > 0);
         const isSecondLevelActive = this.processedItems &&
@@ -10063,11 +10158,11 @@ class DuetIcon {
             : {};
         const iconStyles = Object.assign({}, iconRotationStyles);
         const shapeStyle = this.shape === "brand-rotated" ? "duet-icon-shape-brand" : `duet-icon-shape-${this.shape}`;
-        return (hAsync(Host, { key: '94bf4741af1d392b8fe4900a1e664e340f3fee89', class: {
+        return (hAsync(Host, { key: 'cbb8e9ecd29edef7aada30fcbfde72cf18a5a15c', class: {
                 "duet-m-0": this.margin === "none",
                 "duet-icon-has-outline": !!this.outline,
                 "duet-icon-has-background": !!this.background,
-            } }, hAsync("span", { key: 'f53d65724789fb4b1c2dc689a8b754870c082094', "aria-hidden": "true", style: styles, class: {
+            } }, hAsync("span", { key: '49a62f09762e014cabe70185e4dd3d351a278d4e', "aria-hidden": "true", style: styles, class: {
                 "duet-icon": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-theme-default": this.theme === "default",
@@ -10076,7 +10171,7 @@ class DuetIcon {
                 [shapeStyle]: true,
                 rotated: this.shape === "brand-rotated" && this.theme !== "turva",
                 "duet-icon-not-responsive": !this.responsive,
-            } }, hAsync("span", { key: 'ee9df8b00f92eab8dc364e15db86d954a936e15b', "aria-hidden": "true", class: { "duet-icon-svg": true, rotated: this.shape === "brand-rotated" && this.theme !== "turva" }, "data-name": this.name, innerHTML: this.svgContent, style: iconStyles }))));
+            } }, hAsync("span", { key: 'c4d3ca6e54186214e4e7f85537357fa8abc2e778', "aria-hidden": "true", class: { "duet-icon-svg": true, rotated: this.shape === "brand-rotated" && this.theme !== "turva" }, "data-name": this.name, innerHTML: this.svgContent, style: iconStyles }))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -10901,12 +10996,13 @@ class DuetLink {
      * Always the last one in the class.
      */
     render() {
-        const Tag = !this.url ? "button" : "a";
+        const Tag = !this.url && this.variation !== "default" ? "button" : "a";
+        const role = !this.url && this.variation === "default" ? "button" : null;
         const isButton = Tag === "button";
-        return (hAsync(Host, { key: 'cd7310c88a581cfb5afd755bc4cd1b03f68c67d2', class: {
+        return (hAsync(Host, { key: 'd248d82ba7bfbff36991e0556e609b323b6014c6', class: {
                 [`duet-link-${this.variation}`]: true,
                 "duet-m-0": this.margin === "none",
-            } }, hAsync(Tag, { key: 'fb5d0c7cdc5bfe931be67c3a685934d5f2f979b7', href: this.url, class: {
+            } }, hAsync(Tag, { key: '2ae7983d8583c570630c527645ff52c3ddeba010', href: this.url, class: {
                 "duet-link": true,
                 "duet-link-is-external": this.external,
                 "duet-link-is-download": !!this.download,
@@ -10917,7 +11013,7 @@ class DuetLink {
                 "duet-p-0": this.padding === "none",
                 [this.padding]: true,
                 [this.variation]: true,
-            }, target: this.download || !this.url ? null : this.external ? "_blank" : "_self", download: this.resolvedDownload, "aria-label": this.ariaLabel, "aria-expanded": this.accessibleExpanded != null && isButton ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null && isButton ? this.accessiblePopup.toString() : undefined, id: this.identifier, ref: el => (this.nativeLink = el), part: "duet-link", rel: this.external ? "noopener" : undefined }, this.renderContent())));
+            }, target: this.download || !this.url ? null : this.external ? "_blank" : "_self", download: this.resolvedDownload, "aria-label": this.ariaLabel, "aria-expanded": this.accessibleExpanded != null && isButton ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null && isButton ? this.accessiblePopup.toString() : undefined, id: this.identifier, ref: el => (this.nativeLink = el), part: "duet-link", rel: this.external ? "noopener" : undefined, role: role }, this.renderContent())));
     }
     static get delegatesFocus() { return true; }
     get element() { return getElement(this); }
@@ -11122,7 +11218,7 @@ class DuetListItem {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '99e9fde88b277b57fe0eb123a4a9393665fc5c3b', class: {
+        return (hAsync(Host, { key: '734a0dd51a59bbd182a84e31cec8c847bd9b370c', class: {
                 "duet-theme-turva": this.theme === "turva",
                 "duet-no-stacking": !this.responsive,
                 "duet-list-item-breakpoint-x-small": this.breakpoint === "x-small",
@@ -11130,7 +11226,7 @@ class DuetListItem {
                 "duet-list-item-breakpoint-medium": this.breakpoint === "medium",
                 "duet-list-item-breakpoint-large": this.breakpoint === "large",
                 "duet-list-item-breakpoint-x-large": this.breakpoint === "x-large",
-            } }, hAsync("dt", { key: 'd28e5c24d737ac46d7b11a0babf2b9842cbe60a5' }, hAsync("slot", { key: '197933a372139678a7e2e5cb5d78412e5d49835d', name: "label" })), hAsync("dd", { key: 'ba1679ecc75e002e8fe7038d4c0ca97ca19e64aa' }, hAsync("slot", { key: '9dbe5076b03b9791f55c9172609a42f050931c1a', name: "value" }))));
+            } }, hAsync("dt", { key: '59e34a2877b7e9c431591276bb3f374e7af6b466' }, hAsync("slot", { key: 'fd6b41b97d6e20e053e3f0f4bfec3f4263819aae', name: "label" })), hAsync("dd", { key: '97aed5f53aa1668d3bae6f2e979e6ed4d99c2026' }, hAsync("slot", { key: 'b89a250df02b8731d5f736da444873b8a257a39a', name: "value" }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetListItemStyle0; }
@@ -11478,10 +11574,10 @@ class DuetMenuBarButton {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '2df6c1b32a0a028fd5a562baa4733c2dfef93af6', role: "listitem", onfocus: () => this.setFocus() }, hAsync("button", { key: '364c82e9d7ef3b5aed9f7df9608e234f474834cd', ref: button => (this.nativeButton = button), class: {
+        return (hAsync(Host, { key: 'b43562922266653eeb9879dd3eda29b8a5a1b04c', role: "listitem", onfocus: () => this.setFocus() }, hAsync("button", { key: '29c67b30de26740dec3dac49d2c14a2ed6059270', ref: button => (this.nativeButton = button), class: {
                 "duet-menu-bar-button": true,
                 "duet-theme-turva": this.theme === "turva",
-            }, "aria-controls": this.accessibleControls, "aria-label": this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-pressed": this.accessiblePressed != null ? this.accessiblePressed.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined }, this.icon && (hAsync("duet-icon", { key: 'a143660e0d58efd3eea99181d39e183c2ad2cffe', class: "menu-bar-button-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), hAsync("slot", { key: '121e0ad7aeb96564c2bbdf6d07c05b4502532eac' }))));
+            }, "aria-controls": this.accessibleControls, "aria-label": this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-pressed": this.accessiblePressed != null ? this.accessiblePressed.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined }, this.icon && (hAsync("duet-icon", { key: '9e4a9f1891791aa2bce3c66e7a6b0fce95e247f4', class: "menu-bar-button-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), hAsync("slot", { key: '11d9a8886ba0e00caea9ac34e68454ada2e2582d' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetMenuBarButtonStyle0; }
@@ -11564,17 +11660,17 @@ class DuetMenuBarDropdown {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '50016c8e96de112a895ab6c1a619cd51db1a1144', role: "listitem" }, hAsync("div", { key: '84f1d55a04eb2ce6da85eaa3a2098709d72f904a', class: {
+        return (hAsync(Host, { key: '686fce2ec763461a60c924fc09846f5a54138106', role: "listitem" }, hAsync("div", { key: 'eefdc59f23daad325ab0dce1113fb862ad4ee5cf', class: {
                 "duet-menu-bar-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
                 [`duet-menu-bar-dropdown--slot-${this.getVariant()}`]: true,
-            } }, hAsync("button", { key: '635deadc4d4430289b7b0b9457d621caef017ee8', ref: element => (this.button = element), "aria-label": this.accessibleLabel, "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", id: "button", type: "button", class: {
+            } }, hAsync("button", { key: 'baee9aee708d71ee63326c30a8f871a73eb2297e', ref: element => (this.button = element), "aria-label": this.accessibleLabel, "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", id: "button", type: "button", class: {
                 active: this.open,
-            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: '199fc78e9de9a2411dbdcac2a7cf3cdd7741896c', class: "menu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: '47bf8dee8211ea4b73157c3ff6abb4d1765af81d', class: "label" }, hAsync("slot", { key: 'cf7592834315d69ab2606208943b57c814c364df', name: "label" }), hAsync("duet-icon", { key: '59f13d4cd703bb83c454fe4772beaceecff32186', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: 'ec6ee4c08d94947327d1414068ec363843d4abd7', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: 'cace1bca4eb588cdbd321b82059fefc9adbc8c47', class: "menu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: '58257618f35379178d9c22a95ed14501fba88154', class: "label" }, hAsync("slot", { key: '57eb7d37a9d7c02e1d29b97e9140f2bab43a767a', name: "label" }), hAsync("duet-icon", { key: 'f11313315fb6e2aad23163bcb58c5c06f0a1e2af', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: '9d6bc3e367dca79313d11178ee788a3407d03ec7', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, hAsync("slot", { key: 'e5381a251537978629b818d3771f648122b39968' })))));
+            } }, hAsync("slot", { key: '9ff49f8c44510abf631a06bcb4b690058a3840ed' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetMenuBarDropdownStyle0; }
@@ -11634,11 +11730,11 @@ class DuetMenuBarDropdownLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '586e3ed079d09bf899c1f02c3799e1d46f60bbef' }, hAsync("a", { key: '4480061d9f4de3372052169867f6694c272498ff', class: {
+        return (hAsync(Host, { key: 'f77b08c5717947e146d8d67fdc55fefc66fce761' }, hAsync("a", { key: 'b9a4069fc0b35e532944250e4d715984973ba085', class: {
                 "duet-menu-bar-dropdown-link": true,
                 [`duet-menu-bar-dropdown-link--slot-${this.getVariant()}`]: true,
                 "duet-theme-turva": this.theme === "turva",
-            }, href: this.href, role: "menuitem", onKeyUp: e => this.handleEscape(e), "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: '3dcfc8679e4a1454f6a50efb8aa277ad22faabff', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), hAsync("slot", { key: 'c0d05484db5c3de1e32454f3c2025797e240bfcc' }))));
+            }, href: this.href, role: "menuitem", onKeyUp: e => this.handleEscape(e), "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: 'fa9e331e3d9d8cc74c4fd5f7471e607e058fcf53', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), hAsync("slot", { key: '64c5c1d666ded1b933657386f8eec8fb4068fe84' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetMenuBarDropdownLinkStyle0; }
@@ -11702,11 +11798,11 @@ class DuetMenuBarItem {
      */
     render() {
         const TagName = this.url ? "a" : "button";
-        return (hAsync(Host, { key: 'f8206907f5f09a383f7a11536920b76490ac0eb4', role: "listitem" }, hAsync(TagName, { key: '11894268ceca0e4efac53ea2bb9eb1cf61c84989', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: {
+        return (hAsync(Host, { key: '135b92b36c52ad014567c93c0bfacff2001f16ef', role: "listitem" }, hAsync(TagName, { key: 'd8772442ee0a49f7c300c398ef4021acf0fb74f0', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: {
                 "duet-menu-bar-item": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
-            }, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("duet-icon", { key: 'e7988c04b52df45cd3976e8f1532cad225b0b6ca', class: "leading-icon", size: "auto", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: 'fbbf9404fa7b6d949c7d89bb478957eff14da090' }), (this.trailingIcon || this.external) && (hAsync("duet-icon", { key: 'c2c2f060f59df74561faba1bd596fa43caaa54a7', class: {
+            }, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("duet-icon", { key: '31ac80c4f12447cadcd0def7a2941a98d063a1cc', class: "leading-icon", size: "auto", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: '1f9e4b935f68d57288190e3572dabe90c2c49efb' }), (this.trailingIcon || this.external) && (hAsync("duet-icon", { key: '24c559a7d56a2adce2fc4aa7d00c2eb5682c2c8e', class: {
                 "trailing-icon": !!this.trailingIcon,
                 "trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
                 "external-icon": !!this.external,
@@ -11761,11 +11857,11 @@ class DuetMenuBarLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '5397f75d25382c49004777cc9673b92eb4ebb3c5', role: "listitem" }, hAsync("a", { key: 'd5adf4f588f0108f4bfa82329e5499597e2efbae', class: {
+        return (hAsync(Host, { key: '27e73349cd24930dd1d7ddee302de2260471c5a8', role: "listitem" }, hAsync("a", { key: '524e83c821e67703be8ec2cdb09e937d04202ff2', class: {
                 "duet-menu-bar-link": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
-            }, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: '49866f87807a448bec494ece51eac8ba7cb525cf', class: "menu-bar-link-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), hAsync("slot", { key: 'e566b40e827773a58939b25a6f85b69b16aeb59b' }))));
+            }, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: 'e85b83e58a78898ca57f6db72178915e4cad29f5', class: "menu-bar-link-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), hAsync("slot", { key: '11758cbe02d818cb5f5f7af2a8832d1712c99fa5' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetMenuBarLinkStyle0; }
@@ -11847,6 +11943,8 @@ class DuetModal {
         this.color = "";
         this.active = false;
         this.closeOnBlur = false;
+        this.focusElementOnClose = undefined;
+        this.accessibleAnnounceChanges = undefined;
     }
     openChanged() {
         if (this.open) {
@@ -11893,9 +11991,18 @@ class DuetModal {
             enableBodyScroll$1(this.variation === "slide-up" ? this.modalContentEl : this.modalEl);
             this.duetClose.emit();
             this.teleport.removeInertFromSiblings();
-            setTimeout(() => {
-                focusElement(this.focusedElBeforeOpen);
-            }, TRANSITION_MS);
+            if (this.focusElementOnClose !== "") {
+                setTimeout(() => {
+                    let focusEl = this.focusedElBeforeOpen;
+                    if (typeof this.focusElementOnClose === "string") {
+                        focusEl = document.getElementById(this.focusElementOnClose) || focusEl;
+                    }
+                    else {
+                        focusEl = this.focusElementOnClose || focusEl;
+                    }
+                    focusElement(focusEl);
+                }, TRANSITION_MS);
+            }
             if (this.isAndroidDevice) {
                 window.removeEventListener("resize", this.handleAndroidResizeEvents);
             }
@@ -11953,6 +12060,12 @@ class DuetModal {
     async hide() {
         this.open = false;
     }
+    /**
+     * Set focus on the close button of the modal.
+     */
+    async focusCloseButton() {
+        this.buttonEl.setFocus();
+    }
     /**
      * Scolls the top of the modal's content into view
      *
@@ -12014,20 +12127,16 @@ class DuetModal {
      */
     render() {
         var _a, _b;
-        let iconColor = "primary";
-        let closeColor = "secondary";
-        const closingButton = (hAsync("div", { key: 'ce9896186ba856d40dd3394fdf46442a8e8e5553', class: "duet-modal-close" }, hAsync("duet-button", { key: '5332e22f54058adb3f1e0be19e4d8b273520dcee', ref: button => (this.buttonEl = button), variation: "plain", accessibleLabel: this.accessibleCloseLabel, color: closeColor, iconSize: "large", icon: "navigation-close", iconOnly: true, margin: "none", theme: this.theme, onClick: ev => this.closeModal(ev), fixed: true })));
-        if (this.theme === "turva") {
-            iconColor = "primary-turva";
-            closeColor = "secondary-turva";
-        }
-        return (hAsync("div", { key: 'b56533d39c5b27cb1dc9ed8080755b3b51ce23e5', ref: modal => (this.modalEl = modal), "aria-label": (_a = this.accessibleLabel) !== null && _a !== void 0 ? _a : this.heading, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-describedby": this.accessibleDescribedBy, role: this.variation === "loader" ? "alert" : "dialog", "aria-modal": this.isSafariBrowser ? false : true, tabindex: "-1", class: {
+        const iconColor = postfixTheme("primary", this.theme);
+        const closeColor = postfixTheme("secondary", this.theme);
+        const closingButton = (hAsync("div", { key: '9de636719074c96f49913c1a19b33329ae39a3a0', class: "duet-modal-close" }, hAsync("duet-button", { key: '1852a8322aaeb49c937cfd4b4d80d61073f12f96', ref: button => (this.buttonEl = button), variation: "plain", accessibleLabel: this.accessibleCloseLabel, color: closeColor, iconSize: "large", icon: "navigation-close", iconOnly: true, margin: "none", theme: this.theme, onClick: ev => this.closeModal(ev), fixed: true })));
+        return (hAsync("div", { key: '4c602c318db94b02ca730640b8c0c6fc7eb96453', ref: modal => (this.modalEl = modal), "aria-label": (_a = this.accessibleLabel) !== null && _a !== void 0 ? _a : this.heading, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-describedby": this.accessibleDescribedBy, role: this.variation === "loader" ? "alert" : "dialog", "aria-modal": this.isSafariBrowser ? false : true, tabindex: "-1", class: {
                 "duet-modal-container": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-modal-active": this.open,
                 "duet-modal-slide-up": this.variation === "slide-up",
                 "duet-modal-has-sticky-header": this.hasStickyHeader,
-            } }, hAsync("duet-overlay", { key: '286c5c53a17a3e252b228321e9e59101906907ae', "z-index": "-1", visible: this.open, variation: this.variation === "loader" ? "white" : "default" }), hAsync("div", { key: '52169517df842ed7d492d8c16e924921ba42a920', ref: modalInner => (this.modalInnerEl = modalInner), class: {
+            } }, hAsync("duet-overlay", { key: 'c70e730388bdfa452ab51fb810304ba004022885', "z-index": "-1", visible: this.open, variation: this.variation === "loader" ? "white" : "default" }), hAsync("div", { key: 'ceae3fcf909fdfa380eaddc2f8c9ac2637fc8810', ref: modalInner => (this.modalInnerEl = modalInner), class: {
                 "duet-modal-inner": true,
                 [this.size]: true,
                 "duet-modal-slide-up": this.variation === "slide-up",
@@ -12038,18 +12147,22 @@ class DuetModal {
                         this.closeModal(e);
                     }
                 }
-            } }, hAsync("div", { key: 'e02af6a6579d010b7d51c34ed6943294d8dfe91c', ref: modalContentEl => (this.modalContentEl = modalContentEl), class: {
+            } }, hAsync("div", { key: 'c0559f2b2d236a3e0fd339cd65900d400547fb70', ref: modalContentEl => (this.modalContentEl = modalContentEl), "aria-live": this.accessibleAnnounceChanges === "all" ? "polite" : null, "aria-atomic": this.accessibleAnnounceChanges === "all" ? "true" : null, class: {
                 "duet-modal": true,
                 "duet-modal-has-sticky-header": this.hasStickyHeader,
                 [this.size]: true,
                 [this.variation]: true,
-            } }, this.gutterSize !== "none" && !this.hasStickyHeader && hAsync("duet-spacer", { key: '47f10ec419e39cfb0d830e3279e0fcd3e12b2797' }), this.hasStickyHeader ? (hAsync("div", { class: "duet-modal-sticky-header" }, closingButton, hAsync("slot", { name: "sticky-header" }))) : (closingButton), hAsync("div", { key: '22c96515336e07fc86522c732ea3d524d3f68912', class: {
+            } }, this.gutterSize !== "none" && !this.hasStickyHeader && hAsync("duet-spacer", { key: '81664165163cd30e192906cb50bb71a4906256ba' }), this.hasStickyHeader ? (hAsync("div", { class: "duet-modal-sticky-header" }, closingButton, hAsync("slot", { name: "sticky-header" }))) : (closingButton), hAsync("div", { key: '92c81c3e5545b4a08b93b3174a888cc42837f2ac', class: {
                 "duet-modal-body": true,
                 "duet-modal-gutter-none": this.gutterSize === "none",
                 "duet-modal-gutter-small": this.gutterSize === "small",
                 "duet-modal-gutter-medium": this.gutterSize === "medium",
                 "duet-modal-gutter-large": this.gutterSize === "large",
-            } }, hAsync("div", { key: '4e81ed660762a097622df196d6d6a483a2b77f37', class: "duet-modal-header" }, hAsync("span", { key: '8ed800e79454c753477e8ae1d534166e9be59458', class: "duet-modal-inner-slot-top" }, hAsync("slot", { key: 'a5601afb68902b31c191780f3b62c9552a93de59', name: "top" })), this.icon && hAsync("duet-icon", { key: 'c27ef856d2e6f99c48c67c95461b23bf7db6b5e7', name: this.icon, size: "xx-large", color: this.color || iconColor }), this.heading && (hAsync("duet-heading", { key: 'b098a4a25b613306cefa9e3a1a6492ba9325edf0', "visual-level": (_b = this.headingVisualLevel) !== null && _b !== void 0 ? _b : this.headingLevel, level: this.headingLevel, theme: this.theme }, this.heading))), this.variation === "loader" && (hAsync("div", { key: '255372c153a0c7eb5d5dfc0c6ad5584fdf8a2ec4', class: "duet-modal-spinner" }, hAsync("duet-spinner", { key: '4600cd8a7f2cb26a49ba884afc47f46ab9754297', size: "large", color: "primary" }))), hAsync("div", { key: '591d3064c5d4a8c174b3c61fe8eb71e23ffa3c21', class: "duet-modal-inner-slot-default", ref: el => (this.slotContainerEl = el), "aria-live": this.variation === "loader" ? "assertive" : "off" }, hAsync("slot", { key: '7df11db97dae7c07cceb5534caefacb98b4677e9' })))))));
+            }, "aria-live": this.accessibleAnnounceChanges === "heading" ? "polite" : null, "aria-atomic": this.accessibleAnnounceChanges === "heading" ? "true" : null }, hAsync("div", { key: '72936aa2c2d2551e34b2c2d7344f666d49c3d0f4', class: "duet-modal-header" }, hAsync("span", { key: '30ac91712c2d7065901679fcf1cd5cb0191cbb11', class: "duet-modal-inner-slot-top" }, hAsync("slot", { key: 'c7e4bd42dfac73ebdfcf98f9d16438c14945d30b', name: "top" })), this.icon && hAsync("duet-icon", { key: '3664c556ad580c917e80e796df4236f89134ab9d', name: this.icon, size: "xx-large", color: this.color || iconColor }), this.heading && (hAsync("duet-heading", { key: 'd77b16d2577ce36f4e135790a7f49d8a2b17096c', "visual-level": (_b = this.headingVisualLevel) !== null && _b !== void 0 ? _b : this.headingLevel, level: this.headingLevel, theme: this.theme }, this.heading))), this.variation === "loader" && (hAsync("div", { key: 'ed0fa900e15be0fef3166e61f2f7c860dab067f0', class: "duet-modal-spinner" }, hAsync("duet-spinner", { key: '1d15d8e837273755c1c6242098e198f51c1cda90', size: "large", color: postfixTheme("primary", this.theme) }))), hAsync("div", { key: '4d06b9164f277a7cc586a6b754429764cccb1f2e', "aria-live": this.variation === "loader"
+                ? "assertive"
+                : this.accessibleAnnounceChanges === "body"
+                    ? "polite"
+                    : null, "aria-atomic": this.accessibleAnnounceChanges === "body" ? "true" : null, class: "duet-modal-inner-slot-default", ref: el => (this.slotContainerEl = el) }, hAsync("slot", { key: '520b8542f921248916d3470204ce4ee2533da5ee' })))))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -12080,9 +12193,12 @@ class DuetModal {
             "color": [1],
             "active": [1540],
             "closeOnBlur": [1028, "close-on-blur"],
+            "focusElementOnClose": [1, "focus-element-on-close"],
+            "accessibleAnnounceChanges": [1, "accessible-announce-changes"],
             "open": [32],
             "show": [64],
             "hide": [64],
+            "focusCloseButton": [64],
             "scrollToTop": [64],
             "addMessage": [64]
         },
@@ -12399,7 +12515,7 @@ class DuetNav {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '8d7e53e58f968acb9be34f895909df3b4f5d5c34' }, hAsync("div", { key: '123fa743b84c16f63fc588574a9aca0cabf29c80', class: { container: true, sticky: this.sticky } }, hAsync("slot", { key: 'd58ed528272eb49e4391e06146cfecacd23f5066' }), hAsync("slot", { key: 'beeb3ee1a1eaa779fa6e25abdfae15b1d8d2a222', name: "mobile" }), hAsync("slot", { key: '69ac854fa98e6625c20dc274cc913845cb4ec40a', name: "desktop" }))));
+        return (hAsync(Host, { key: '1bd9e1c748e898763d70850e3e7995557aa70828' }, hAsync("div", { key: '256c0acc4e956aea59eb153bc7b3bad1126501f3', class: { container: true, sticky: this.sticky } }, hAsync("slot", { key: '64f9a6096d183ce0cbd496db4dcee65d565e15b9' }), hAsync("slot", { key: 'b0f455061d1e7d8affab734c72b8479239184b0b', name: "mobile" }), hAsync("slot", { key: 'dce4933ac2f67107843c4121100f7adae7a3b72f', name: "desktop" }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetNavStyle0; }
@@ -12458,11 +12574,11 @@ class DuetNotification {
         this.linkElement.focus(options);
     }
     render() {
-        return (hAsync("div", { key: '5673c370989123dc6c1dc1ec214c995064564f56', role: "listitem", class: {
+        return (hAsync("div", { key: '49b14512d29db67c3f5bcb27f101a51fc9036fd0', role: "listitem", class: {
                 "duet-notification": true,
                 "duet-notification-highlight": this.highlight,
                 "duet-theme-turva": this.theme === "turva",
-            } }, hAsync("a", { key: '1beae6445e3d4c1a3351a077ec57f0915fae8d2d', ref: element => (this.linkElement = element), href: this.url, target: this.external ? "_blank" : "_self" }, hAsync("div", { key: 'b12f670a6966b1aad67ad42f75e793d2ddd2e833', class: "duet-notification-container" }, hAsync("div", { key: '5ef4f93707358582ff4ff4b96579d5a3554a82cb', class: "duet-notification-badge-container" }, this.highlight && (hAsync("div", { key: '387c2d580ff608512510b8629f1e7821a8f7dd3a', class: "duet-notification-badge" }, hAsync("duet-visually-hidden", { key: '264d0f56b026c4e320d6c25607934506a531a622' }, this.accessibleLabelUnread, ":")))), hAsync("div", { key: '89cf2d458e2267d8325d1cf051e439f1384e7f2e', class: "duet-notification-content" }, hAsync("slot", { key: '471d37b00002cb9fe0333f103af855fb46a54c59' })), hAsync("div", { key: '1026a308355cd17fbc16f386a88e6f7def9df8f7', class: "duet-notification-date" }, this.date)))));
+            } }, hAsync("a", { key: '6f042207812b140e4527347593e928cc3493af31', ref: element => (this.linkElement = element), href: this.url, target: this.external ? "_blank" : "_self" }, hAsync("div", { key: '2d479ec70393a50322b0ed54f2807c222dc13a1a', class: "duet-notification-container" }, hAsync("div", { key: 'ee94c09c0cd7087c3a9012938ff8ca45d2c3a2ad', class: "duet-notification-badge-container" }, this.highlight && (hAsync("div", { key: '12c75cc56f374dbb3219009ed71e3133c2f1f490', class: "duet-notification-badge" }, hAsync("duet-visually-hidden", { key: '63608edd5d1768c8a2963273ecaa2cf51ddf3e20' }, this.accessibleLabelUnread, ":")))), hAsync("div", { key: '6ec5105d17c74d1cf8b29e08c5488cc14cd41377', class: "duet-notification-content" }, hAsync("slot", { key: '9aa83e4b79fa59c4336ec10f0b3c2ba69e26b5ec' })), hAsync("div", { key: 'cf580f03e32ff454941cf973497fe4a97066fa5d', class: "duet-notification-date" }, this.date)))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetNotificationStyle0; }
@@ -12800,7 +12916,7 @@ class DuetNumberInput {
             // Set the localized prop value.
             this.value = this.localizeValue(value);
             // Finally also set the visible input value and unit.
-            this.duetInputElement.value = `${this.value} ${this.unit}`;
+            this.duetInputElement.value = `${this.value}${this.getUnitString()}`;
         };
         this.add = (ev) => {
             // If this was called via a html button, prevent the default functionality
@@ -12947,6 +13063,10 @@ class DuetNumberInput {
             this.emitNull(ev);
         }
     }
+    // prefix existing unit with white space or return empty string if no unit
+    getUnitString() {
+        return this.unit ? ` ${this.unit}` : "";
+    }
     formatAnnouncement() {
         const current = !!this.value ? SafeParseFloat(this.value, this.locale) : null;
         if (current == null) {
@@ -13121,12 +13241,12 @@ class DuetPageHeading {
      */
     render() {
         const layout = this.layout === "narrow" ? "narrow" : this.layout === "fluid" ? "fluid" : "auto";
-        return (hAsync("div", { key: 'fba553b4413df6bb21199c6662bd4925565257ec', class: {
+        return (hAsync("div", { key: 'a7f8ed31eea2471a6f6daeab1a41ebbf3274974a', class: {
                 "duet-page-heading": true,
                 "duet-theme-turva": this.theme === "turva",
                 "has-icon": !!this.icon,
                 [layout]: true,
-            } }, hAsync("div", { key: 'e6e97a25087b75ccb7b398154838104935f12634', class: "background" }, this.theme === "turva" && hAsync("div", { key: '2ae0b70ceb016c085242e7957fb3120e001474cb', class: "background-mask" }), this.theme !== "turva" && hAsync("div", { key: 'c28c3ae1a2ec5d620f874249fc316a522f1bd66a', class: "brand-shape" }), this.theme !== "turva" && hAsync("div", { key: '088f96be8c434a1bb2a3649824238201f3cdd384', class: "brand-shape second-shape" }), this.icon && (hAsync("div", { key: '4356433ecfd4d75820e6ce9f9b23321a20db02db', class: "brand-shaped-icon" }, hAsync("duet-icon", { key: '2a0c22e18ebe8b50eec0e7c3ed255a77ff8db597', background: "none", name: this.icon, margin: "none", size: "auto", responsive: false })))), hAsync("div", { key: '4cf9fed40ec2968cf45348dac887df9a5bba7560', class: "heading" }, hAsync("slot", { key: '9840ced09f3ca4fd899a29b3aa2e9783af03ae2f', name: "heading" }), this.progressCurrentStep && this.progressTotalSteps && (hAsync("div", { key: 'cfd079f730fb38743729f8ffe23f61cee6a50a7b' }, hAsync("duet-spacer", { key: '1d08222bf22b908e8c7333e4b3263cd56a62fc88', size: "large" }), hAsync("div", { key: '0b28bb2c19b6f0061d0c5db1dcf54753a2ac5031', role: "presentation" }, this.progressIndicator()))))));
+            } }, hAsync("div", { key: '29929daebf61d58c95ecb45ea75fe53303cd90c6', class: "background" }, this.theme === "turva" && hAsync("div", { key: '8e16ccbc29987d20713eefb78f1272640023cd19', class: "background-mask" }), this.theme !== "turva" && hAsync("div", { key: 'c853c2efb26521b9421413e85e6f468d411fa016', class: "brand-shape" }), this.theme !== "turva" && hAsync("div", { key: 'd3a2d96868a56e251bace2d82ad6c9ad55294794', class: "brand-shape second-shape" }), this.icon && (hAsync("div", { key: '3b4627a7ed9f38878dc057717df1b3dcef713963', class: "brand-shaped-icon" }, hAsync("duet-icon", { key: 'b2489267d519d737b77fd292f21fb828553f7c3b', background: "none", name: this.icon, margin: "none", size: "auto", responsive: false })))), hAsync("div", { key: 'bfc316227a81b1ae3b600c0fa8a5ea7242523dcc', class: "heading" }, hAsync("slot", { key: '8e0397609bafb4de4ef85422f6397ded1ec15039', name: "heading" }), this.progressCurrentStep && this.progressTotalSteps && (hAsync("div", { key: '337621f9ecdc98a53fa649fdc7e001985577ac7a' }, hAsync("duet-spacer", { key: 'e548da55d72cce0c0fa88ce29bac93184673d1e2', size: "large" }), hAsync("div", { key: '1b6d8f3e486a69add538d4a5f786944521a8906f', role: "presentation" }, this.progressIndicator()))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetPageHeadingStyle0; }
@@ -13549,6 +13669,59 @@ class DuetPagination {
     }; }
 }
 
+const duetPanelCss = ":host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:relative;display:block;width:100%;margin:8px 0 20px 0}@media (min-width: 36em){:host{margin:12px 0 28px 0}}:host .duet-m-0{margin:0 !important}.duet-panel{font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(8, 42, 77);background-color:rgb(255, 255, 255);border:0 solid rgb(212, 223, 229);border-radius:16px}.duet-panel.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58);border-color:rgb(222, 224, 228)}.duet-panel.padding-small{padding:16px;border-radius:12px}@media (min-width: 36em){.duet-panel.padding-small{padding:20px}}.duet-panel.padding-medium{padding:20px}@media (min-width: 36em){.duet-panel.padding-medium{padding:28px}}.duet-panel.padding-large{padding:28px}@media (min-width: 36em){.duet-panel.padding-large{padding:36px}}.duet-panel.border{border-width:1px}.duet-panel.secondary{background-color:rgb(245, 248, 250)}.duet-panel.secondary.duet-theme-turva{background-color:rgb(245, 247, 250)}.duet-panel.accent{background-color:rgb(240, 247, 250);border-color:rgb(198, 225, 238)}.duet-panel.accent.duet-theme-turva{background-color:rgb(245, 247, 250);border-color:rgb(199, 202, 207)}.duet-panel.accent.secondary{background-color:rgb(217, 236, 245)}.duet-panel.accent.secondary.duet-theme-turva{background-color:rgb(222, 224, 228)}:host(.duet-theme-turva2) .duet-panel.duet-theme-turva{color:#172a3b;border-color:#d4dde2}:host(.duet-theme-turva2) .duet-panel.duet-theme-turva.secondary{background-color:#f5f6f7}:host(.duet-theme-turva2) .duet-panel.duet-theme-turva.accent{background-color:#fdf7f2;border-color:#f1cab2}:host(.duet-theme-turva2) .duet-panel.duet-theme-turva.accent.secondary{background-color:#fbe1d1}";
+var DuetPanelStyle0 = duetPanelCss;
+
+class DuetPanel {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.theme = "";
+        this.padding = "medium";
+        this.variation = "";
+        this.margin = "auto";
+        this.border = undefined;
+        this.accessibleLabel = undefined;
+        this.accessibleLabelledBy = undefined;
+        this.accessibleDescribedBy = undefined;
+    }
+    /**
+     * Component lifecycle events.
+     */
+    componentWillLoad() {
+        inheritGlobalTheme(this);
+    }
+    render() {
+        return (hAsync(Host, { key: '13228863e0bd8364a1624863047eecc22101529e' }, hAsync("section", { key: '0548dea2315bd39b2f55b3796ebb9f7c0d29240c', "aria-label": this.accessibleLabel, "aria-labelledby": this.accessibleLabelledBy, "aria-describedby": this.accessibleDescribedBy, class: {
+                "duet-panel": true,
+                "duet-theme-turva": this.theme === "turva",
+                [this.variation.split("-")[0]]: true,
+                [this.variation.split("-")[1]]: true,
+                [`padding-${this.padding}`]: true,
+                border: this.border,
+                "duet-m-0": this.margin === "none",
+            } }, hAsync("slot", { key: 'f83407ac8d792c512b5df894f066adefa37bf3a4' }))));
+    }
+    get element() { return getElement(this); }
+    static get style() { return DuetPanelStyle0; }
+    static get cmpMeta() { return {
+        "$flags$": 9,
+        "$tagName$": "duet-panel",
+        "$members$": {
+            "theme": [1025],
+            "padding": [1],
+            "variation": [1],
+            "margin": [1],
+            "border": [4],
+            "accessibleLabel": [1, "accessible-label"],
+            "accessibleLabelledBy": [1, "accessible-labelled-by"],
+            "accessibleDescribedBy": [1, "accessible-described-by"]
+        },
+        "$listeners$": undefined,
+        "$lazyBundleId$": "-",
+        "$attrsToReflect$": []
+    }; }
+}
+
 const duetParagraphCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:relative;display:block;width:100%}.duet-paragraph{margin-bottom:16px !important;display:block;width:100%;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-style:normal;font-weight:400;font-variant-numeric:tabular-nums;-webkit-hyphens:auto;hyphens:auto;line-height:1.5;color:rgb(8, 42, 77)}.duet-paragraph.duet-p-0{padding:0 !important}.duet-paragraph.duet-m-0{margin:0 !important}.duet-paragraph.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-paragraph.duet-paragraph-small{font-size:0.875rem}.duet-paragraph.duet-paragraph-semi-bold{font-weight:600}.duet-paragraph.duet-paragraph-bold{font-weight:700}.duet-paragraph.duet-m-0{margin:0 !important}.duet-paragraph.intro{font-size:2.7vw;margin-bottom:28px !important;-webkit-hyphens:inherit;hyphens:inherit}@media (max-width: 37.037037037rem){.duet-paragraph.intro{font-size:1rem}}@media (min-width: 46.2962962963rem){.duet-paragraph.intro{font-size:1.25rem}}.duet-paragraph.intro.duet-m-0{margin:0 !important}::slotted(a){font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-style:normal;font-weight:400;color:rgb(0, 119, 179);text-decoration:underline;transition:300ms ease}::slotted(a).duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(198, 12, 48)}::slotted(a):hover{color:rgb(0, 75, 129);text-decoration:none}::slotted(a):hover.duet-theme-turva{color:rgb(126, 2, 35)}::slotted(a):active{opacity:0.75;transition:none}:host(.duet-theme-turva2) .duet-paragraph.duet-theme-turva{color:#172a3b}:host(.duet-theme-turva2) ::slotted(a).duet-theme-turva{color:#e61740}:host(.duet-theme-turva2) ::slotted(a:hover).duet-theme-turva{color:#8c001e}";
 var DuetParagraphStyle0 = duetParagraphCss;
 
@@ -13580,7 +13753,7 @@ class DuetParagraph {
         const color = getColorByName(this.color);
         // aria-describedby is to fix accessibility issue in Chrome where duet-paragraphs
         // are not announced when placed inside duet-modal
-        return (hAsync(Host, { key: '440e68e865c345c8a54036e303a0a90ef1213ad0', "aria-describedby": this.id }, hAsync("p", { key: 'cc4abdee501c88469f34129a1238332e2e42dca9', id: this.id, class: {
+        return (hAsync(Host, { key: 'e0a1fc0374987c1390c1139195f8dc69bb497da2', "aria-describedby": this.id }, hAsync("p", { key: '89978d42d63df315736996c9bb4c264098d46fe3', id: this.id, class: {
                 "duet-paragraph": true,
                 "duet-paragraph-small": this.size === "small",
                 "duet-paragraph-semi-bold": this.weight === "semi-bold",
@@ -13588,7 +13761,7 @@ class DuetParagraph {
                 "duet-m-0": this.margin === "none",
                 [this.variation]: true,
                 "duet-theme-turva": this.theme === "turva",
-            }, style: { color }, part: "duet-paragraph" }, hAsync("slot", { key: '0766fae004e9085b078a41c58bae0a3ef7f8a96d' }))));
+            }, style: { color }, part: "duet-paragraph" }, hAsync("slot", { key: 'befa3faf8f7b1f565f1a17d2ae668c49b7694db2' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetParagraphStyle0; }
@@ -17445,11 +17618,11 @@ class DuetPopupMenuItem {
         };
         // Without the role ternary Safari/iPhone wouldn't announce the label for role menuitem.
         // This is a tradeoff and now Safari announces these items as buttons and links with the label.
-        return (hAsync(Host, { key: '76a5ddd0306fa03e605cef3d3e484dca33446d14', role: this.accessibleRole === "menuitem" && this.isSafariBrowser ? null : this.accessibleRole }, hAsync(TagName, { key: '55c06e263ba92718f8927cb910e239023a5de9f4', ref: element => (this.itemElement = element), tabIndex: this.accessibleRole === "listitem" ? 0 : -1, onFocus: this.onFocus, onBlur: this.onBlur, role: `${TagName === "a" ? "link" : "button"}`, "aria-label": this.accessibleLabel, class: classes, value: this.value, href: this.url, target: this.external ? "_blank" : undefined, rel: this.external ? "noopener" : undefined, lang: TagName === "button" ? undefined : this.targetLanguage, hreflang: TagName === "button" ? undefined : this.targetLanguage }, this.leadingIcon && (hAsync("duet-icon", { key: '8283f27db74c5905d7510f0aa46bccdfc229c3a7', name: this.leadingIcon, size: "x-small", color: this.leadingIconColor ? this.leadingIconColor : "currentColor", class: "duet-popup-menu-item-leading", margin: "none" })), hAsync("span", { key: 'd37328836527cbae445ebf804c9a9b6cfc841df3', class: "duet-popup-menu-item-label" }, hAsync("slot", { key: '48d6351f97fd1a41dd9168bbb15d3c18b5896f7c' })), (this.trailingIcon || this.active || (this.url && this.external)) && (hAsync("duet-icon", { key: '9796f803a10e25097178ff191c003ee6ceee5dba', name: this.url && this.external
+        return (hAsync(Host, { key: 'eade853d9656feba3f1c183a9d496b056b1efab1', role: this.accessibleRole === "menuitem" && this.isSafariBrowser ? null : this.accessibleRole }, hAsync(TagName, { key: '390261bc354ca208b61e9d653478dc2a9d6db956', ref: element => (this.itemElement = element), tabIndex: this.accessibleRole === "listitem" ? 0 : -1, onFocus: this.onFocus, onBlur: this.onBlur, role: `${TagName === "a" ? "link" : "button"}`, "aria-label": this.accessibleLabel, class: classes, value: this.value, href: this.url, target: this.external ? "_blank" : undefined, rel: this.external ? "noopener" : undefined, lang: TagName === "button" ? undefined : this.targetLanguage, hreflang: TagName === "button" ? undefined : this.targetLanguage }, this.leadingIcon && (hAsync("duet-icon", { key: '0e33f555ecced822df70e017274ef9b2a05806b3', name: this.leadingIcon, size: "x-small", color: this.leadingIconColor ? this.leadingIconColor : "currentColor", class: "duet-popup-menu-item-leading", margin: "none" })), hAsync("span", { key: '7223f5c991169e250db10d39513a14379e8a328c', class: "duet-popup-menu-item-label" }, hAsync("slot", { key: '0ef37ea3f2a8246a7fcc4d611cae5792fedc6588' })), (this.trailingIcon || this.active || (this.url && this.external)) && (hAsync("duet-icon", { key: 'c79c060559a1fe3698b321ba3f91a95949cf0320', name: this.url && this.external
                 ? actionNewWindowSmall.title
                 : this.active
                     ? "messaging-checked-small"
-                    : this.trailingIcon, size: (this.url && this.external) || this.active ? "xx-small" : "x-small", color: "currentColor", class: "duet-popup-menu-item-trailing", margin: "none" })), this.trailingText && hAsync("span", { key: '4380153a8426a1254a897efe10cad603dbf8a7d6', class: "duet-popup-menu-item-trailing" }, this.trailingText))));
+                    : this.trailingIcon, size: (this.url && this.external) || this.active ? "xx-small" : "x-small", color: "currentColor", class: "duet-popup-menu-item-trailing", margin: "none" })), this.trailingText && hAsync("span", { key: 'bef480bed8100c06a5f8acf0e059dab3896f94d5', class: "duet-popup-menu-item-trailing" }, this.trailingText))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetPopupMenuItemStyle0; }
@@ -17604,12 +17777,12 @@ class DuetPromoCard {
             backgroundColor: backgroundColor ? backgroundColor : "none",
         };
         const TagName = this.url ? "a" : "div";
-        return (hAsync(Host, { key: '3d281bb1f739ba86d5b36c6043be731799ad8fa5', class: { "duet-m-0": this.margin === "none" } }, hAsync("aside", { key: '0aa1940692ce1672ca4af76af2fa4126306f1235', class: {
+        return (hAsync(Host, { key: '1515fc190e761f1806452d49d62b61412a4c28f9', class: { "duet-m-0": this.margin === "none" } }, hAsync("aside", { key: 'a4939b94e4f746437fdf950d860c18cbdcb7bd55', class: {
                 "duet-promo-card": true,
                 "duet-theme-turva": this.theme === "turva",
                 "no-bg-color": !this.backgroundColor,
                 "duet-promo-card-link": !!this.url,
-            }, style: bannerStyles }, hAsync(TagName, { key: '5cf0d74f8a0212ed297d2619d49e39d8c28e246a', href: this.url, class: "content-wrapper", ref: element => (this.aOrDivElement = element) }, hAsync("img", { key: 'b7cc5de830483c0e7a964cfcb72d7f3151a41a24', class: "image", src: this.image, alt: "", role: "presentation" }), hAsync("div", { key: '7608b5880c5906171f05a3c1e87c0e17bd2935d0', class: "content" }, this.hasPreHeadingSlot && (hAsync("div", { key: 'ad6469a6f8edddc9f7752c1f834571787b89cc38', class: "pre-heading" }, hAsync("slot", { key: 'd4f0a18260609d18b0178f397a459997f5355def', name: "pre-heading" }))), this.hasHeadingSlot && (hAsync("div", { key: '8bc0b5df3919ec6a4a8cade9004a1f62813f5c77', class: "heading" }, hAsync("duet-heading", { key: 'c55032096a863f88788173207ee7c22f2538106e', theme: this.theme, level: this.headingLevel, "visual-level": "h3", margin: "none", color: this.textColor }, hAsync("span", { key: '365672773038187f60ad94999a42b214a865a233' }, hAsync("slot", { key: '8e1e4376fd09e6c2cc91e71c02874db4cce56786', name: "heading" }))))), this.hasDescriptionSlot && (hAsync("div", { key: '00a6f5bd073cb18c9fdc307615466c885c9be409', class: "description" }, hAsync("duet-paragraph", { key: '0c750a27469650603afb05b38762fb26c542ca51', theme: this.theme, margin: "none", color: this.textColor }, hAsync("span", { key: '7ae8e761077676b809d53e23b649d554e0f8d3fc' }, hAsync("slot", { key: '8dab7cd1b4e77586abc3f266179c621c4aed3921', name: "description" }))))), this.hasActionSlot && (hAsync("div", { key: '4eadb71d3c9f7f6598ab708251ad2ee1bcf94719', class: "action" }, hAsync("slot", { key: '43d40d4c3afacd136f1a05f44bc0964675bfa53d', name: "action" }))))))));
+            }, style: bannerStyles }, hAsync(TagName, { key: '807abfae3d508b57899c6db98e25f9d55ca2da14', href: this.url, class: "content-wrapper", ref: element => (this.aOrDivElement = element) }, hAsync("img", { key: 'c8aff5a3a991787ed36ae5413111eea8e72d180e', class: "image", src: this.image, alt: "", role: "presentation" }), hAsync("div", { key: '98ca8b87d56b052ec8b284060e9d40db91e76ae4', class: "content" }, this.hasPreHeadingSlot && (hAsync("div", { key: 'd523708f802adba25c3cbbb49a701d2ba9e1c4c4', class: "pre-heading" }, hAsync("slot", { key: '497b57d5a7f7dd3ad40f4b7d1fea749bbe24a0f8', name: "pre-heading" }))), this.hasHeadingSlot && (hAsync("div", { key: '8ffed905559c96f7216b589ad6c7cac539ed6da8', class: "heading" }, hAsync("duet-heading", { key: '28b56308bca5a9c51618b9fc5781cd9c72d11aff', theme: this.theme, level: this.headingLevel, "visual-level": "h3", margin: "none", color: postfixTheme(this.textColor, this.theme) }, hAsync("span", { key: '48dd4256899ce88967628e402039ee2b48823962' }, hAsync("slot", { key: 'ee8c4c059c2e763e12977ec375485f9302f89794', name: "heading" }))))), this.hasDescriptionSlot && (hAsync("div", { key: '84c464f1982f18704a6c58711f2833f812b576f5', class: "description" }, hAsync("duet-paragraph", { key: 'e7b5bfcb91f583d32445076db2a9dd802a7284a8', theme: this.theme, margin: "none", color: postfixTheme(this.textColor, this.theme) }, hAsync("span", { key: '1af43961242bc227beef31940ab6d4a6fb2baedf' }, hAsync("slot", { key: '2a0fd2143ed221fea16af81d8aed863c1e889014', name: "description" }))))), this.hasActionSlot && (hAsync("div", { key: '7edc91af1e9bce504fa3fef8d01c3a6edfed202c', class: "action" }, hAsync("slot", { key: '7e8cd91e532de002a468327a6870dfeae9b13011', name: "action" }))))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetPromoCardStyle0; }
@@ -18222,10 +18395,10 @@ class DuetRangeStepper {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync("div", { key: '3d8d9ed5879447251d48ae757daaf8ffef02ad3d', class: {
+        return (hAsync("div", { key: '0d213325a438908c6fbb5ef3be056baf2dd9a9cc', class: {
                 "duet-range-stepper": true,
                 "duet-theme-turva": this.theme === "turva",
-            }, onKeyDown: e => this.onKeyboardDown(e), "aria-controls": this.ariaControls }, hAsync("span", { key: 'c88c202c7002fb522a26377fb353ca2a24a94eb7', class: "duet-range-step-counter", part: "range-numbers" }, this.generateStepSize()), hAsync("duet-action-button", { key: 'bfab979e32c0b863937a1cab50cd8f6b48d0fb69', disabled: this.disabled || this.buttonLeftDisabled, class: "duet-range-step-button duet-range-step-minus", onClick: e => this.handleClick(e, -1), id: this.leftBn, "accessible-label": `${this.ariaLabels.previous_increment} ${this.generatePreviousIncrementLabel()}`, ref: el => (this.leftBnRef = el), part: "navigation-arrow", iconName: "action-arrow-left-small", title: "" }), hAsync("duet-action-button", { key: '59a4f61632394157513cd4f632bed9e46a19e44c', disabled: this.disabled || this.buttonRightDisabled, class: "duet-range-step-button duet-range-step-plus", onClick: e => this.handleClick(e, 1), "accessible-label": `${this.ariaLabels.next_increment} ${this.generateNextIncrementLabel()}`, id: this.rightBn, ref: el => (this.rightBnRef = el), part: "navigation-arrow", iconName: "action-arrow-right-small", title: "" })));
+            }, onKeyDown: e => this.onKeyboardDown(e), "aria-controls": this.ariaControls }, hAsync("span", { key: '2fcef9d93303d111aa7de17a44614ae8a7be97b9', class: "duet-range-step-counter", part: "range-numbers" }, this.generateStepSize()), hAsync("duet-action-button", { key: '8cb9d3c298a12c9b4e539676020702d346731b76', disabled: this.disabled || this.buttonLeftDisabled, class: "duet-range-step-button duet-range-step-minus", onClick: e => this.handleClick(e, -1), id: this.leftBn, "accessible-label": `${this.ariaLabels.previous_increment} ${this.generatePreviousIncrementLabel()}`, ref: el => (this.leftBnRef = el), part: "navigation-arrow", iconName: "action-arrow-left-small", title: "" }), hAsync("duet-action-button", { key: 'f53a8b31d7f5d5fa9df56765fefe8096d08eea44', disabled: this.disabled || this.buttonRightDisabled, class: "duet-range-step-button duet-range-step-plus", onClick: e => this.handleClick(e, 1), "accessible-label": `${this.ariaLabels.next_increment} ${this.generateNextIncrementLabel()}`, id: this.rightBn, ref: el => (this.rightBnRef = el), part: "navigation-arrow", iconName: "action-arrow-right-small", title: "" })));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -18481,18 +18654,18 @@ class DuetScrollable {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'd16fe365f308d4f01e90314b861a38a391766069', class: {
+        return (hAsync(Host, { key: '6901fea371dda6fd20b8c14a15f007356a4f0a38', class: {
                 "duet-theme-turva": this.theme === "turva",
                 "duet-theme-default": this.theme === "default",
-            } }, this.hasCollapseButtonLabelSlot && (hAsync("div", { key: '4ba3965faddef21a8b2a8158ca7b5a15826c41c2', class: {
+            } }, this.hasCollapseButtonLabelSlot && (hAsync("div", { key: '59b5b0b6b1a791fadf53a07f33466cb10ed3dedb', class: {
                 collapse: true,
                 hide: !this.needsScrolling && !this.collapsed,
-            } }, hAsync("duet-button", { key: 'c09fe36578bc21723d8956cfa1179eb193f8a8aa', variation: "plain", margin: "none", "center-text": true, onClick: () => this.collapsedOnClick() }, hAsync("slot", { key: '99ade10a731e97298c3414da467877a6f7b03db3', name: "collapse-button-label" })))), hAsync("div", { key: 'dae4d1c1c6a48c295b67a3897185ee32aab91d45', class: {
+            } }, hAsync("duet-button", { key: 'ef2ce19aa8cbf5829d7f54d3b79a53d84e79f4a3', variation: "plain", margin: "none", "center-text": true, onClick: () => this.collapsedOnClick() }, hAsync("slot", { key: '2c0f7231015097adadcd7143cef863b8c75da68c', name: "collapse-button-label" })))), hAsync("div", { key: 'efdef383e022816af6dfd91ae609ab81d5ef1fa1', class: {
                 "duet-scrollable-items": true,
                 buttons: this.buttons,
                 center: this.center,
                 "duet-theme-turva": this.theme === "turva",
-            } }, this.buttons && this.renderButton("left"), hAsync("div", { key: 'abfe476824df3e3ff6532458d19a4036d6c25c65', class: {
+            } }, this.buttons && this.renderButton("left"), hAsync("div", { key: 'a429707e2ff1d17f2865300ee65a42c1ff4217f1', class: {
                 "duet-scrollable-list": true,
                 [`duet-scrollable-list--${this.buttonPosition}`]: true,
                 [`gap-${this.gap}`]: true,
@@ -18500,7 +18673,7 @@ class DuetScrollable {
                 [`duet-overflow-padding--${this.padding}`]: this.padding !== "none",
                 [`duet-scrollable-list--${this.buttonPosition}`]: this.buttonPosition === "absolute",
                 "duet-scrollable-stretch": this.stretch,
-            }, onScroll: () => this.updateScrollButtons(), ref: element => (this.scrollPaneElement = element) }, hAsync("slot", { key: '91dfa3fca48d62c75a1df155ac59c10dc97ad395' })), this.buttons && this.renderButton("right"))));
+            }, onScroll: () => this.updateScrollButtons(), ref: element => (this.scrollPaneElement = element) }, hAsync("slot", { key: '792a604368bc6fe33577173b8986babb17e95050' })), this.buttons && this.renderButton("right"))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -18548,13 +18721,13 @@ class DuetSectionLayout {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'abc489bb9f01029b229a5021e8918bb04bfdd2e4', class: {
+        return (hAsync(Host, { key: '3760201c8af426d8ce0a3e736e1ea158aa52d98e', class: {
                 "duet-middle": this.middle,
                 "duet-ie": isInternetExplorer(),
-            } }, hAsync("div", { key: '31a1523883a51b86ad132ca814a54327f0c8d950', class: { "duet-layout-wrapper": true, "duet-m-0": this.margin === "none" } }, hAsync("div", { key: '50e8bf12a2c214d17322c63a53aab9b6b375eac0', class: {
+            } }, hAsync("div", { key: '94d48826fd6b116936f4850e1e21b1cf761c7260', class: { "duet-layout-wrapper": true, "duet-m-0": this.margin === "none" } }, hAsync("div", { key: 'b33936aa900e4503eed9d5b82dbcdf07f51e9b19', class: {
                 "duet-layout": true,
                 [`padding-${this.paddingBreakpoint}`]: !!this.paddingBreakpoint,
-            } }, hAsync("section", { key: '9d316453e681f174990e0832ab37ca81d5791900', class: "duet-main" }, hAsync("slot", { key: 'e4de9102f8914fb94d228c3db88b48aa96d17616' }))))));
+            } }, hAsync("section", { key: 'a2177f2b863ec3782382f8b5b512913af6bbe4b0', class: "duet-main" }, hAsync("slot", { key: '446c361279e487f659f839b9b21b19ff7f6b0739' }))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSectionLayoutStyle0; }
@@ -18797,9 +18970,9 @@ class DuetShapedImage {
         const style = {
             "--rotation": `${this.rotation}deg`,
         };
-        return (hAsync(Host, { key: '638dcfbd244960e00fd9d26cd3a78e1f28b85e84', class: { "duet-theme-turva": this.theme === "turva", "duet-m-0": this.margin === "none" } }, hAsync("span", { key: 'bfa3cd57dfa2f5e01314890b5827c37f3b9f1933', class: {
+        return (hAsync(Host, { key: 'b750a11c4dccb225ec7f6a62eb41137cd21a45b7', class: { "duet-theme-turva": this.theme === "turva", "duet-m-0": this.margin === "none" } }, hAsync("span", { key: '77296c3eed29b5b7fbd1f5296b194d2b4f74babc', class: {
                 "shaped-image": true,
-            }, role: "img", "aria-label": this.accessibleLabel, style: style }, hAsync("span", { key: 'bc68a2fa96268d470a352482d6023666fcc04d5e', class: "shaped-image-mask", role: "presentation" }, hAsync("span", { key: 'fe3d0cbb8686f710b2c267306669203de22aaa05', class: "shaped-image-img", role: "presentation", style: { backgroundImage: `url("${this.src}")` } })))));
+            }, role: "img", "aria-label": this.accessibleLabel, style: style }, hAsync("span", { key: '6ca14f632c8c963c66895b10759946a4dae0ee90', class: "shaped-image-mask", role: "presentation" }, hAsync("span", { key: 'ff5781d620721b0997aec9c03bf899a0a1e21ff6', class: "shaped-image-img", role: "presentation", style: { backgroundImage: `url("${this.src}")` } })))));
     }
     static get style() { return DuetShapedImageStyle0; }
     static get cmpMeta() { return {
@@ -18865,10 +19038,10 @@ class DuetShareChart {
         this.itemsTotalValue = this.items.reduce((total, { value }) => total + value, 0);
     }
     render() {
-        return (hAsync(Host, { key: '4fdb192aa20cd6f6437d85d5a3f747acdbff79ef' }, hAsync("div", { key: 'aa0fb6bec4450f520c6717af033535a1dba32e4e', class: "duet-share-chart-horizontal-bar", role: "presentation" }, this.items.map(item => (hAsync("span", { class: "duet-share-chart-share", style: {
+        return (hAsync(Host, { key: '3b18282d22572dd1fa224333f5cd1b50459873b9' }, hAsync("div", { key: 'fb1a5532570e59e9d1998eccbaffc5e72cd23337', class: "duet-share-chart-horizontal-bar", role: "presentation" }, this.items.map(item => (hAsync("span", { class: "duet-share-chart-share", style: {
                 width: `${(item.value / this.itemsTotalValue) * 100}%`,
                 backgroundColor: getColorByName(item.color, this.theme),
-            } })))), hAsync("ul", { key: 'e1fcc132bd62897160224822eb8b6260e3915cf3', class: "duet-share-chart-item-list" }, this.items.map(item => (hAsync("li", { class: { "duet-theme-turva": this.theme === "turva" } }, hAsync("span", { class: "duet-share-chart-item-color", style: { background: getColorByName(item.color, this.theme) } }), hAsync("span", { class: "duet-share-chart-item-text" }, item.text, ":"), hAsync("span", { class: "duet-share-chart-item-value" }, "\u00A0", formatNumber(item.value), "\u00A0", this.unit), this.unit !== "%" && (hAsync("duet-visually-hidden", null, `${formatNumber((item.value / this.itemsTotalValue) * 100, 0)} %`)))))), hAsync("slot", { key: '2eeb09621a94b00304aa0a8ebcc89d99c2b9485d' })));
+            } })))), hAsync("ul", { key: '4749f8f2d599d9e34b834aaa55a5919f1193aa9f', class: "duet-share-chart-item-list" }, this.items.map(item => (hAsync("li", { class: { "duet-theme-turva": this.theme === "turva" } }, hAsync("span", { class: "duet-share-chart-item-color", style: { background: getColorByName(item.color, this.theme) } }), hAsync("span", { class: "duet-share-chart-item-text" }, item.text, ":"), hAsync("span", { class: "duet-share-chart-item-value" }, "\u00A0", formatNumber(item.value), "\u00A0", this.unit), this.unit !== "%" && (hAsync("duet-visually-hidden", null, `${formatNumber((item.value / this.itemsTotalValue) * 100, 0)} %`)))))), hAsync("slot", { key: 'fa8b976fc09c00aebebe41cb580aee8664e93f3d' })));
     }
     get element() { return getElement(this); }
     static get style() { return DuetShareChartStyle0; }
@@ -18893,7 +19066,7 @@ class DuetShareChartItem {
         this.color = undefined;
     }
     render() {
-        return (hAsync(Host, { key: 'd445b3fcd17ec7e9a3b0a2a8cadb9396883c8059' }, hAsync("div", { key: '5cc83a7a215cbf2c11d2efea994394e31161ecc5', hidden: true }, hAsync("slot", { key: 'efe3dd0892bce32e1adfde3f8f818b4c3112291d' }))));
+        return (hAsync(Host, { key: '964678edc7482f441fb29da520bfa057f1b439eb' }, hAsync("div", { key: '82c6863c6cedf9dc2eaf19f1d148667126530eeb', hidden: true }, hAsync("slot", { key: '918f828c6da1ba28432b192dd895df495d32fc5f' }))));
     }
     get element() { return getElement(this); }
     static get cmpMeta() { return {
@@ -18999,12 +19172,12 @@ class DuetShowMore {
      * Always the last one of the class.
      */
     render() {
-        return (hAsync(Host, { key: '92c7a8a940fa6b4ade953646d8f2a0f9764d7cb8' }, hAsync("div", { key: '2c243c0e75ff7c85608ff9124dad4217fce9ca09', class: {
+        return (hAsync(Host, { key: '5e26089215401ad079494ecfc48a5463ecd0be23' }, hAsync("div", { key: 'ccc9db6a4f25f032076816c455c478bdd9a9689b', class: {
                 "duet-show-more": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-m-0": this.margin === "none",
                 open: this.open,
-            } }, hAsync("div", { key: '71705332d3aa1bfe177c6d965a9e5bcbae98be86', ref: ref => (this.contentElement = ref), class: { content: true }, id: this.contentId, tabindex: this.open ? "-1" : "" }, hAsync("div", { key: '07ab4d6a2a63a4c5828f77aff112aa0b6edc45cc', class: { "slotted-content": true } }, hAsync("slot", { key: '27fa6b74575cf303bddde356b7b96099a7500443' }))), hAsync("duet-button", { key: 'b52389d6f0d70da19c9a0e855516b65ef7dd1611', id: this.buttonId, variation: "plain", "accessible-label": this.buttonAriaOpen ? this.showLessAccessibleLabel : this.showMoreAccessibleLabel, "accessible-expanded": this.buttonAriaOpen ? "true" : "false", "accessible-controls": this.contentId, accessiblePressed: this.isSafariBrowser ? this.open : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown, "icon-right": true, icon: this.open ? "action-arrow-up-small" : "action-arrow-down-small", "icon-size": "medium-small", size: "small", margin: this.buttonMargin, padding: this.buttonPadding, theme: this.theme === "turva" ? "turva" : "default" }, hAsync("span", { key: '7a21e35febf93126d1bde48f59bfea260c547674' }, this.open ? this.showLessLabel : this.showMoreLabel)))));
+            } }, hAsync("div", { key: '9548a87e1fe2469470e5bc736e9be84ff49f1b29', ref: ref => (this.contentElement = ref), class: { content: true }, id: this.contentId, tabindex: this.open ? "-1" : "" }, hAsync("div", { key: '89ad3dcc67ee7b8025483cbdb94e77380249869a', class: { "slotted-content": true } }, hAsync("slot", { key: '3d8d799bfeceaa39c118f8b77ff1854e92111bf5' }))), hAsync("duet-button", { key: 'e7215cf992e31e23150c57d3d5677584a38bd45e', id: this.buttonId, variation: "plain", "accessible-label": this.buttonAriaOpen ? this.showLessAccessibleLabel : this.showMoreAccessibleLabel, "accessible-expanded": this.buttonAriaOpen ? "true" : "false", "accessible-controls": this.contentId, accessiblePressed: this.isSafariBrowser ? this.open : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown, "icon-right": true, icon: this.open ? "action-arrow-up-small" : "action-arrow-down-small", "icon-size": "medium-small", size: "small", margin: this.buttonMargin, padding: this.buttonPadding, theme: this.theme === "turva" ? "turva" : "default" }, hAsync("span", { key: 'dcf013a42f3580bae6247f0fc11925ca63967425' }, this.open ? this.showLessLabel : this.showMoreLabel)))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetShowMoreStyle0; }
@@ -19501,16 +19674,16 @@ class DuetSlideout {
         };
         const topLevelOpenMenuBarTranslation = getLocaleString(this.topLevelOpenMenuBarLangObject);
         const exitTranslation = getLocaleString(this.exitLangObject);
-        return (hAsync(Host, { key: '5b1e8dd6a1d23ddfd1fd4ec9953358648f83b2f4' }, hAsync("div", { key: '1b3d3922fa437e5a673eade5e37bdf4301f78c04', class: { "duet-slideout": true, "duet-theme-turva": this.theme === "turva" } }, this.modal && hAsync("duet-overlay", { key: '5320d50095216834367b1dadf87aac40844c1330', visible: this.open, "display-device": "large", zIndex: "600" }), hAsync("div", { key: 'a66f039db9a25bf386d1b432aa0a5e31431d425c', ref: element => (this.dialog = element), tabindex: "-1", role: "dialog", id: "dialog", "aria-labelledby": "button", "aria-modal": this.isSafariBrowser ? false : true, "aria-flowto": "slot-container", class: {
+        return (hAsync(Host, { key: '9333789c721a340099e10ded0a75fd40e9a11351' }, hAsync("div", { key: '401f5878c00c8844606f58cf65bd970fefc9aab7', class: { "duet-slideout": true, "duet-theme-turva": this.theme === "turva" } }, this.modal && hAsync("duet-overlay", { key: 'ee8e733825dc3a76a590f10c5575b9b696c5c920', visible: this.open, "display-device": "large", zIndex: "600" }), hAsync("div", { key: 'ceed0da1890638fbacd6ff8c98e1444545c4ce9f', ref: element => (this.dialog = element), tabindex: "-1", role: "dialog", id: "dialog", "aria-labelledby": "button", "aria-modal": this.isSafariBrowser ? false : true, "aria-flowto": "slot-container", class: {
                 dialog: true,
                 hidden: !this.open,
                 modal: this.modal,
-            }, style: styles }, hAsync(FocusGuard, { key: '40b2443754bf241922b967ff7a513c959761f1fe', moveFocusTo: this.closeButton }), hAsync("div", { key: '3b3fddbbcf56a58504c68e8c1e2b2900aedc5d64', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, hAsync("div", { key: '2a59af527b5aff6888cf32062ac395ea70c419d4', class: "top" }, hAsync("button", { key: '947f06b59448c995e2512e5bcc97cbd6d109b6f9', ref: element => (this.closeButton = element), "aria-haspopup": "dialog", "aria-controls": "dialog", "aria-expanded": this.open ? "true" : "false", "aria-label": `${exitTranslation}`, type: "button", class: {
+            }, style: styles }, hAsync(FocusGuard, { key: '5ba5f11f9e65dd3b4e7f41dc425cb504fdf41227', moveFocusTo: this.closeButton }), hAsync("div", { key: '644cb47533203d7a1a0411ad3d685f772f1727af', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, hAsync("div", { key: '27811bda6d392533473673dd1f9e3384fc010c9a', class: "top" }, hAsync("button", { key: 'afcf0a441eb2100eece645b01229005076a98b0b', ref: element => (this.closeButton = element), "aria-haspopup": "dialog", "aria-controls": "dialog", "aria-expanded": this.open ? "true" : "false", "aria-label": `${exitTranslation}`, type: "button", class: {
                 "slideout-close": true,
                 active: this.open,
-            }, onClick: this.onClick, inert: this.openPanel }, hAsync("duet-icon", { key: 'aebc4e8f5e9782c5dc7d6b3531aaa7652afd8cc3', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), hAsync("div", { key: '49d1788b366efacc2240cd1120861b6826e6c989', class: "sticky-header" }, hAsync("slot", { key: '337568b5b2fce699eefe02c958d18b23cfd56686', name: "sticky-header" }))), hAsync("div", { key: 'c1e094ea625aee5b60ff298d17d817366c6ccd9d', id: "slot-container", role: this.accessibleRole, "aria-label": this.openPanel ? topLevelOpenMenuBarTranslation : null, class: {
+            }, onClick: this.onClick, inert: this.openPanel }, hAsync("duet-icon", { key: 'a1f41fbc6db6c3e139c86c5243947230e6d3f3c0', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), hAsync("div", { key: '6333fb0cb464bd1bae7295a7ed3dba2f82aa4afe', class: "sticky-header" }, hAsync("slot", { key: '9295f086423cb44b73d2df211b7095facfa77c79', name: "sticky-header" }))), hAsync("div", { key: '1535ab887ae6f901cc97f3b7a7cd541d423e174c', id: "slot-container", role: this.accessibleRole, "aria-label": this.openPanel ? topLevelOpenMenuBarTranslation : null, class: {
                 items: true,
-            } }, hAsync("slot", { key: '396e59703e3eb7d0647fed3c96d20cd3f43c100a' })), hAsync(FocusGuard, { key: '5b400bf78b36b3e576fb30fc82a84fb1c754fd79', moveFocusTo: this.closeButton })))));
+            } }, hAsync("slot", { key: '5dff867d2868e62737eb06a1618c269187db5468' })), hAsync(FocusGuard, { key: 'fcfc5f9ea11a7edac6b76a1479dfb0374b8f16eb', moveFocusTo: this.closeButton })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -19577,7 +19750,7 @@ class DuetSlideoutLang {
      */
     render() {
         const langTranslation = getLocaleString(this.chooseLangObject);
-        return (hAsync(Host, { key: 'a7713847bd3e1a3c0f2f3ee2a3c4953b16ab9dab' }, hAsync("div", { key: 'dcc4f8c8be73f4e158021db290ebc41a928f26b5', class: "duet-slideout-lang", role: "group", "aria-label": langTranslation }, hAsync("duet-icon", { key: '66bf96bab08b50be6a5a70efe80cb1bdc0a2668c', name: "navigation-language", margin: "none", color: "secondary" }), hAsync("slot", { key: '11f293894f1a4845bd1e41871a0d64efeffec8b2' }))));
+        return (hAsync(Host, { key: 'c66db470420b0ad32461c176e50d91cb9c7fdce1' }, hAsync("div", { key: '75ef5e18c433d42a85004adbc38317a4168977c4', class: "duet-slideout-lang", role: "group", "aria-label": langTranslation }, hAsync("duet-icon", { key: 'a94403410e36a5c06eff6ef2613ae91ceecfa9fd', name: "navigation-language", margin: "none", color: "secondary" }), hAsync("slot", { key: 'ea26d4376d4ddb6cf4c4d44b9fd1f328588574e3' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSlideoutLangStyle0; }
@@ -19633,12 +19806,12 @@ class DuetSlideoutLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '37e7f55eccaef46f0fdb0cc722167b3d2be07250' }, hAsync("a", { key: '7888b5689d718e5618dbd8119513c9ad0bd88eaa', target: !this.href ? null : this.external ? "_blank" : "_self", class: {
+        return (hAsync(Host, { key: '0c6039665ab2561e576a6ddecdea16747ce4ede5' }, hAsync("a", { key: '920d7a0b2125b51dc657d24d7e82b9a06bdb8692', target: !this.href ? null : this.external ? "_blank" : "_self", class: {
                 "duet-slideout-link": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
                 [this.size]: true,
-            }, href: this.href, "aria-current": this.active ? "true" : "false", lang: this.targetLanguage, hreflang: this.targetLanguage, "aria-label": (this.href && getAccessibleLinkLabel(this)) || this.accessibleLabel, rel: this.external ? "noopener" : undefined }, this.icon && (hAsync("duet-icon", { key: '0fdcbb18f34d423c59650e55bccee40efedb9f49', name: this.icon, color: "secondary", size: this.menuItem ? "x-small" : "medium", margin: "none" })), hAsync("div", { key: '06d69d19e7780580efd75a285c6d58008dc7ef4e', class: "label" }, hAsync("span", { key: '6db329897b1ad576bce79b2da3c2586992786239' }, hAsync("span", { key: '01b2c540cb6096bf321cd52272c7bfc7284f9532', class: "label-container" }, hAsync("span", { key: 'fd2b7ff9885cd3a24f1b81e14b0e972daf606da9', class: "label-content" }, hAsync("slot", { key: 'c05ee9479a383f4a3a99d1060054e4b07a510337' })), this.external && (hAsync("duet-icon", { key: '669c2f06ba1388a117029c4bebb472a22a51d90e', class: "external-icon", theme: this.theme, name: actionNewWindowSmall.title, margin: "none", size: "auto", color: "currentColor" }))), hAsync("slot", { key: '81fe3d16cde666a547216e35ebfe7c4d9289713b', name: "description" })), this.caret && (hAsync("duet-icon", { key: '31f873adfe1e59fc420ea6cafcc9133a10e92f43', name: "action-arrow-right", color: "secondary", size: "x-small", margin: "none" }))))));
+            }, href: this.href, "aria-current": this.active ? "true" : "false", lang: this.targetLanguage, hreflang: this.targetLanguage, "aria-label": (this.href && getAccessibleLinkLabel(this)) || this.accessibleLabel, rel: this.external ? "noopener" : undefined }, this.icon && (hAsync("duet-icon", { key: 'caf4e1f4752341de847f8db58d8ee9fad36cd4cb', name: this.icon, color: "secondary", size: this.menuItem ? "x-small" : "medium", margin: "none" })), hAsync("div", { key: 'f296f631a1e6209e68af756fd75167c7599bb635', class: "label" }, hAsync("span", { key: '28ef0dcec3dc83a84bb217c3861747d4dda14e03' }, hAsync("span", { key: '5d29305621aadc14df4dddef30b0d4ba84469312', class: "label-container" }, hAsync("span", { key: '6d47e37bfab72b3aa4e4f0608feb373ba5b86d02', class: "label-content" }, hAsync("slot", { key: '012a8b929cf1d906b6591dc449599f08b33d12c7' })), this.external && (hAsync("duet-icon", { key: '93f4efa4d9b438e029aeb62418e941b85e360b5e', class: "external-icon", theme: this.theme, name: actionNewWindowSmall.title, margin: "none", size: "auto", color: "currentColor" }))), hAsync("slot", { key: 'ed01b9c3b4e9df44ff7b53d411e49f0b2a0bb3f7', name: "description" })), this.caret && (hAsync("duet-icon", { key: '1406615037b8d7e69eb0928998bda003c1331b01', name: "action-arrow-right", color: "secondary", size: "x-small", margin: "none" }))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSlideoutLinkStyle0; }
@@ -19801,23 +19974,23 @@ class DuetSlideoutPanel {
         };
         const exitTranslation = getLocaleString(this.exitLangObject);
         const backTranslation = getLocaleString(this.backLangObject);
-        return (hAsync(Host, { key: '56eb135660ee88050732a5d2fea1ad481f9eb292' }, hAsync("div", { key: 'ac82e6b523a166482f63f844fe4665bb9c51cf67', class: {
+        return (hAsync(Host, { key: '29142d3abf9500bbf41fb0334399d889b3c6cac8' }, hAsync("div", { key: 'e3c759be99f70768e528062d8c9403c843412e4e', class: {
                 "duet-slideout-panel": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
-            } }, hAsync("button", { key: '237fd45dcf65a5276ba815e0b1f96edf37f34792', ref: element => (this.openButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
+            } }, hAsync("button", { key: 'ef315f5d782cc8166691b9650fb2d288cd749bcb', ref: element => (this.openButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
                 link: true,
                 active: this.active,
-            }, onClick: this.onClick, inert: this.open }, this.icon && (hAsync("div", { key: 'eb4918cee89d1a28119e7c96a41dd30876b9882e', class: "duet-slideout-icon" }, hAsync("duet-icon", { key: '585083f0736aca5f20850536cf4ac576354d0adb', name: this.icon, size: "medium", margin: "none", color: "secondary" }), this.badge && hAsync("div", { key: 'e5b2e4bc6d70118c462ab6740e6c89a588babebe', class: "duet-slideout-badge" }))), hAsync("span", { key: '2c533f9ab954b21ad9ee1f489a896f8661d6b744', class: "label" }, hAsync("span", { key: 'd18761f73625fe1ed2061413dde2ef1649e0d8e6', class: { "label-text": true, [this.labelSize]: true } }, hAsync("slot", { key: 'b8877cefe56a922264fd7b8cfdb59699b321cca6', name: "label" })), hAsync("duet-icon", { key: '9223672f3ef2c5f4e24d93180266c12ebb81f873', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), hAsync("div", { key: '970e055462866b6c2e0d9f8f61fa0f44014e1f8c', ref: element => (this.dialog = element), class: {
+            }, onClick: this.onClick, inert: this.open }, this.icon && (hAsync("div", { key: 'c7ec5af321f7b990a7abd9e3998468c32eb5889d', class: "duet-slideout-icon" }, hAsync("duet-icon", { key: '5b0465920cd92be28acf509dcac07b1b15225ce3', name: this.icon, size: "medium", margin: "none", color: "secondary" }), this.badge && hAsync("div", { key: '985dcc380110ebb5358c77323f2349e3ec31475b', class: "duet-slideout-badge" }))), hAsync("span", { key: '3a82b4673433c943d0212e33c2ea85fc28e03fb9', class: "label" }, hAsync("span", { key: 'e9ff6848d940ba31e433e16af1241ea22dc70f34', class: { "label-text": true, [this.labelSize]: true } }, hAsync("slot", { key: '49829bd15762b30f0253d747768a9375bdd828a8', name: "label" })), hAsync("duet-icon", { key: 'dd11e70aa5e00aa808d5bb0cad6b371fc35838a3', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), hAsync("div", { key: '1340dc6879304f87fc1842250b66ec47ab38338f', ref: element => (this.dialog = element), class: {
                 dialog: true,
                 hidden: !this.open,
-            }, style: styles }, hAsync(FocusGuard, { key: '55077ddbf3f4b2b9f7418ac25e18925d0790f51d', moveFocusTo: this.closeButton }), hAsync("div", { key: '173896613871ccb4612a777f81cc7aa099f846dd', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, hAsync("div", { key: '5de8816912ec989b3c3a592f71d82769f81705cc', class: "top" }, hAsync("button", { key: '7daaf548d0726af440efe31d65dda28ab7b10590', ref: element => (this.closeButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-label": `${backTranslation}`, type: "button", class: {
+            }, style: styles }, hAsync(FocusGuard, { key: '1254f5551401ecdaadbca733bc0f74786aa14650', moveFocusTo: this.closeButton }), hAsync("div", { key: 'e84762225ac2b0d641b500e4d039c2443f98edcf', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, hAsync("div", { key: '49e12eb692d1f72c31b72b6dd8f70482a357a78a', class: "top" }, hAsync("button", { key: 'd2c1948b8800dc2ef27858ea8f261b75715c8e18', ref: element => (this.closeButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-label": `${backTranslation}`, type: "button", class: {
                 back: true,
-            }, onClick: this.onClick }, hAsync("duet-icon", { key: '51d4e6709d84ea7ae022637b49b0f3fe1848374b', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), hAsync("span", { key: '8fb630a47d81b8cd39c2b41eee44de476ee2d909' }, this.label.innerHTML), hAsync("button", { key: 'ebe66dcf5fb90368364bf99aa17e16a1c1f618a7', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, hAsync("duet-icon", { key: 'a625e7fe337d30f0663e785b574ea068fcafa161', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), hAsync("div", { key: '5c949cc572f5fece64b0fcb5054ba0feb7e3852a', class: "sticky-header" }, hAsync("slot", { key: '967df86d4dcad22d11b312e508de6114fa2e40cd', name: "sticky-header" }))), hAsync("div", { key: '2fad52921cca02a904eb498d690d27284e6a928e', tabindex: "-1", role: "menu",
+            }, onClick: this.onClick }, hAsync("duet-icon", { key: '59d40d2c0cede4aac9973bebf5703fae2a7b3cea', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), hAsync("span", { key: '1204528b4ec168bebdbc0b69f84066932e2af607' }, this.label.innerHTML), hAsync("button", { key: '45abbae93adaea97d81b4b93da0553a1264c8730', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, hAsync("duet-icon", { key: '2eb2414a9984983a1ee5c79a5e3d6f140f0e8d37', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), hAsync("div", { key: '5ddcb2fe67526dda050b26bb9c1f5b7bb81da169', class: "sticky-header" }, hAsync("slot", { key: '355f117577e2e2bcdc171209bb8efc6137f6d7d6', name: "sticky-header" }))), hAsync("div", { key: 'ccc3cfde0874f57edf185d4526087c5d0a0f9316', tabindex: "-1", role: "menu",
             //TODO: slideout menu fades out, needs to be instant
             id: "menu", "aria-labelledby": "button", class: {
                 items: true,
-            } }, hAsync("slot", { key: '8877447b3854175bbd232289e9e3309f6efea81f' })), hAsync(FocusGuard, { key: '9f96ad5a3cfb71dc1991b8f91e2fa4d7c0710a87', moveFocusTo: this.closeButton })))));
+            } }, hAsync("slot", { key: 'a86fa10fb2acdd64dda1d060fc373cbc7e25c97d' })), hAsync(FocusGuard, { key: '5fb6ce6a75597d05a4bd48ca02d8b0f861a129e3', moveFocusTo: this.closeButton })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -19887,16 +20060,16 @@ class DuetSlideoutPanelDropdown {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '56faee9144d28aa60667fdf09a6cb8505a2d5019' }, hAsync("div", { key: '13fac67091478d3f93b4dcdda87d78769cb684f7', class: {
+        return (hAsync(Host, { key: 'bb8b1ac89a6fc845377a16a9fda01cd1049bc720' }, hAsync("div", { key: '7123e413dfedc3371870bafdeb2be97939432d84', class: {
                 "duet-slideout-panel-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
-            } }, hAsync("button", { key: 'ca6bcd9c33c48f8ce6c6b6beecdc6f2abb3049d0', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
+            } }, hAsync("button", { key: '1496c53a1a82284ab5ec469e99bdd8430f9d903d', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
                 active: this.active,
-            }, onClick: this.onClick }, this.icon && hAsync("duet-icon", { key: 'b3635153f84663988ea84257c9cfaa5d3aea7a2f', name: this.icon, size: "medium", margin: "none", color: "secondary" }), hAsync("span", { key: 'ef13c8e149d1736216107e243d27ccbb6f303cb7', class: "label" }, hAsync("slot", { key: '58486ebae7658383e393bcbcde5db4af478a4bc8', name: "label" }), hAsync("duet-icon", { key: '3935b244f34872dc262934a8754596ce50bb255a', class: "caret", name: "action-arrow-down-small", margin: "none", size: "xx-small", color: "secondary" }))), hAsync("div", { key: '6368cfe15f050458ab5a859977b8d5144316bd52', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick }, this.icon && hAsync("duet-icon", { key: '3a64869e58fdd65da20d97be4c7aa791b46e39dc', name: this.icon, size: "medium", margin: "none", color: "secondary" }), hAsync("span", { key: 'bdb073b154537b81404d6011ca4a75a5a29b58c3', class: "label" }, hAsync("slot", { key: '26b71b80a8c61e78ad52b9af8f95a1cf8b58a02e', name: "label" }), hAsync("duet-icon", { key: 'aff4043c26c6768b5566ec4c9073faadc1405329', class: "caret", name: "action-arrow-down-small", margin: "none", size: "xx-small", color: "secondary" }))), hAsync("div", { key: 'c90ac76831b43a4a92c5539a2a91b16b6a4101e2', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, hAsync("slot", { key: '7e5c69e4d53d0832a3f833c6bc297c3069f12fa7' })))));
+            } }, hAsync("slot", { key: '1be245b790ae436066a8f2c36957c4aa21923aac' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSlideoutPanelDropdownStyle0; }
@@ -19931,7 +20104,7 @@ class DuetSpacer {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'd55d6a4ae72006fe3463b80b1485a2ef55dd215d', class: {
+        return (hAsync(Host, { key: 'cf4bc55628a80600bcc541119e56966f2a6b4a75', class: {
                 "duet-spacer": true,
                 "duet-spacer-xx-small": this.breakpoint === "xx-small",
                 "duet-spacer-x-small": this.breakpoint === "x-small",
@@ -19982,11 +20155,11 @@ class DuetSpinner {
      */
     render() {
         const color = this.color === "currentColor" ? "currentColor" : getColorByName(this.color);
-        return (hAsync(Host, { key: 'bb0f449eae50af0507131759837be15719c3d181', class: {
+        return (hAsync(Host, { key: '6d75d470c4189563cb0fc773734d02acac58c0ab', class: {
                 "duet-custom-color": this.color !== "currentColor" && this.theme !== "turva" && this.theme !== "default",
                 "duet-theme-turva": this.theme === "turva" && this.color !== "currentColor",
                 "duet-theme-default": this.theme === "default" && this.color !== "currentColor",
-            } }, hAsync("div", { key: '10b2a6011a04cac3a30fc48265a3c38c6efe96da', class: {
+            } }, hAsync("div", { key: '5314f7a471cde9aa11d4d8794058612683f41be8', class: {
                 "duet-spinner": true,
                 [this.size]: true,
             }, style: { color }, "aria-label": this.accessibleLabel })));
@@ -20079,10 +20252,10 @@ class DuetStatusIcon {
         }
     }
     render() {
-        return (hAsync(Host, { key: '0c7e9e81aa0df937ac47bcfaf99525e669866704', class: {
+        return (hAsync(Host, { key: 'f6c645d88a079edf789d66abab661498513602f0', class: {
                 [`duet-status-icon-${this.getVariation()}`]: true,
                 "duet-strong-bg": this.strong,
-            } }, hAsync("duet-icon", { key: '8b806b24e99faa5637683e31bdb29aea671c1097', icon: this.getIcon(), size: this.size, margin: this.margin })));
+            } }, hAsync("duet-icon", { key: '9659d286f003987775c67613356b88e4733915ac', icon: this.getIcon(), size: this.size, margin: this.margin })));
     }
     static get cmpMeta() { return {
         "$flags$": 9,
@@ -20317,7 +20490,7 @@ class DuetStepper {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '740a97432ec3cd68e37e0d1c15ef857fda784e03', class: { "duet-m-0": this.margin === "none" } }, hAsync("div", { key: 'cd7bb18ecc5f6912692e126352addfd6d261ed31', class: { "duet-stepper": true, "duet-theme-turva": this.theme === "turva" } }, hAsync("duet-visually-hidden", { key: 'e544dcae3ddc94efef5586ec9cf89101c4438be7', "aria-live": "polite", "aria-atomic": "true", "aria-relevant": "all" }, this.formatAnnouncement()), hAsync("slot", { key: 'a66d4563c4a9f66d31e8bb14502a10c70d663baa' }))));
+        return (hAsync(Host, { key: '09155a7a3327ac4e49f56eb5632872285f5d5bab', class: { "duet-m-0": this.margin === "none" } }, hAsync("div", { key: 'a57d5104e84e041986ea155939c05d52a7ec8a0a', class: { "duet-stepper": true, "duet-theme-turva": this.theme === "turva" } }, hAsync("duet-visually-hidden", { key: '7c6149035beb257691e8e6849a0608cd47ba18cb', "aria-live": "polite", "aria-atomic": "true", "aria-relevant": "all" }, this.formatAnnouncement()), hAsync("slot", { key: 'edb325e8ac2f2b2f91848c5a4688ab4ff0f31c03' }))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -20463,19 +20636,19 @@ class DuetSubmenuBar {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'b9ed84c0da82f7c093fa3cc5c9602ca1fe44a4ed' }, hAsync("nav", { key: '0f8fe04555854be9bc7c6a2d15a15653ffbd1016', class: {
+        return (hAsync(Host, { key: '6451c0e04650a56832e3b55dfb562db4ddd484b2' }, hAsync("nav", { key: '4322bfa5ae8eb0207c78e21d85bdb3c65e290ae1', class: {
                 "duet-submenu-bar": true,
                 "duet-theme-turva": this.theme === "turva",
                 hidden: this.hidden,
-            }, "aria-label": this.accessibleLabel }, this.hasItems && (hAsync("button", { key: 'b6399d5854b6f89f428c24fa3a43fdd67de000d2', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", id: "button", type: "button", class: {
+            }, "aria-label": this.accessibleLabel }, this.hasItems && (hAsync("button", { key: 'a4c9f8ecdab4fb8154b80b75bdf0764b70fd55cc', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", id: "button", type: "button", class: {
                 active: this.open,
-            }, onClick: this.onClick }, hAsync("span", { key: '1d5e8668c8b750f4972504df8bed57245ef5eabc', class: "label" }, hAsync("slot", { key: '20c27756f7a5aad70a898fff440360f28c28d91b', name: "label" }), hAsync("duet-icon", { key: '43057e0edf41bb7e391ca83b88945a2b9b25ef2e', theme: this.theme, class: "caret", name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" })))), hAsync("div", { key: 'c5e37557b3b340b72d9884217c94e2901278e597', class: {
+            }, onClick: this.onClick }, hAsync("span", { key: 'fa313aef921cebfb7826c447e97d92237064ac78', class: "label" }, hAsync("slot", { key: 'c346b15a97b5c5bf7aca4b6d1a659eb0aeae70f1', name: "label" }), hAsync("duet-icon", { key: 'fd7cfc9e987128b16f195fdc4602fd5bc44f3453', theme: this.theme, class: "caret", name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" })))), hAsync("div", { key: '0a7c79a9c68419f026435543666b9b28df6bcd41', class: {
                 "menu-container": true,
                 hidden: !this.open,
-            }, role: "presentation" }, hAsync("div", { key: 'dce4cefa83a6e80dc7c8360c282317a135c4c0ab', role: this.mobile ? "menu" : null, id: "menu", "aria-labelledby": this.mobile ? "button" : null, "aria-expanded": this.mobile ? (this.open ? "true" : "false") : null, class: {
+            }, role: "presentation" }, hAsync("div", { key: '30367df592ab0dada667a922dfe69f1a97dd63e3', role: this.mobile ? "menu" : null, id: "menu", "aria-labelledby": this.mobile ? "button" : null, "aria-expanded": this.mobile ? (this.open ? "true" : "false") : null, class: {
                 items: true,
                 hidden: !this.open,
-            }, ref: element => (this.itemsContainer = element) }, hAsync("div", { key: '75d2f4b701d7f2b44c305da5bb697d4cf73faf1d', class: "list", role: this.mobile ? "presentation" : "list" }, hAsync("slot", { key: 'e5b60df2f15ee80a4a6bd17960ef48be2bde1756' }), hAsync("div", { key: '5b8e5fd8fa81cf1fade618d0211471941dae339a', class: "list-padding" }))), hAsync("duet-overlay", { key: '2fdc9e8c03721caed4b5b2d05b436375cd57b39e', "keep-stacking-context": true, visible: this.open, "display-device": "not-large", transition: "immediate" })))));
+            }, ref: element => (this.itemsContainer = element) }, hAsync("div", { key: 'a42fa718e8fc1d41e2d87bad0dc276b8977c7dee', class: "list", role: this.mobile ? "presentation" : "list" }, hAsync("slot", { key: '478a0ac25a2aae7aa09dad0d455804fbd97b2163' }), hAsync("div", { key: '209d7083a63c7b3cb652d8d7cf40fa0276cd5927', class: "list-padding" }))), hAsync("duet-overlay", { key: '0fe995dd00566aace4e6e4398c23717a0e022e49', "keep-stacking-context": true, visible: this.open, "display-device": "not-large", transition: "immediate" })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -20596,18 +20769,18 @@ class DuetSubmenuBarDropdown {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '70868aabae55a1cf5a33ffa60fa5f4503538dea9', role: "listitem" }, hAsync("div", { key: '9809d5a4eab393c96dd7851edb141543e3133768', class: {
+        return (hAsync(Host, { key: 'cb5e677b605455d234582b23f7014776882640ca', role: "listitem" }, hAsync("div", { key: '038f74a0f7e4a5d2a692f710609cc35a0f0b8b9b', class: {
                 "duet-submenu-bar-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 open: this.open,
                 active: this.active,
-            } }, hAsync("button", { key: '28578844117f1a8125be55516cff56ac1e8a7f15', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
+            } }, hAsync("button", { key: '559b1fe4df7f7f2e2bba75966a78a26ca556e1a6', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
                 open: this.open,
                 active: this.active,
-            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: '9c8abf604b85505fcb162655ba88d8ee98d0c33f', class: "submenu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: 'e5ede13eceef98527bf96e09fa02bed5f3a56596', class: "label" }, hAsync("span", { key: 'f6c75d3c08f19179ee759a0d049eae30f2c9f464', class: "label-text" }, hAsync("slot", { key: '02f6d7e96cb114febddb08e4ff3d0acb074c9033', name: "label" })), hAsync("duet-icon", { key: 'd1e66d3f724512be2a0da418530fd733beefa784', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: '5dbf142f285d703e83580e73497a92bf79173a63', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: 'b1446d0146342e9fffcfe689eb23a19520b3226b', class: "submenu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: '27aad4809f2f613bfad1c9204f4cb0031951a411', class: "label" }, hAsync("span", { key: '4565a4a2825fd8c0ff7e5b1607e29079ee91580a', class: "label-text" }, hAsync("slot", { key: '374137f23f75556640572ce4e55ac8dea77b4eab', name: "label" })), hAsync("duet-icon", { key: 'eb2ff3b2bb13cb24456bd05ff6e190b6f1ca52b3', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: '49f18ebd3fc6765db9a5fd286649226ebe79ed42', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, hAsync("slot", { key: 'f20c64dc6799152a072355db08285ae3254a21a4' })))));
+            } }, hAsync("slot", { key: 'dbc7854708620fc971a0fbc755e75d918975678f' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSubmenuBarDropdownStyle0; }
@@ -20659,12 +20832,12 @@ class DuetSubmenuBarDropdownLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '70dc6010e5c86ad45da1c5181093ccdd36aedf8c' }, hAsync("a", { key: '88f6be423630593baa34df5aaa95658f4d62e144', class: {
+        return (hAsync(Host, { key: '8b009426558f928de713ea2bb30eac1d4fe5b9fd' }, hAsync("a", { key: '80067be3f308ddef002926e8e81a0e7e031f9e57', class: {
                 "duet-submenu-bar-dropdown-link": true,
                 "duet-theme-turva": this.theme === "turva",
                 highlight: this.highlight,
                 active: this.active,
-            }, "aria-current": this.active ? "true" : "false", href: this.href, onKeyUp: e => this.handleEscape(e) }, this.icon && hAsync("duet-icon", { key: '1b8442b9b12ea7e7d70a4cafb650f44e623ed079', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), hAsync("span", { key: '649f4c2ba3d389a010c5a2d931d88052ab32738a', class: "label-container" }, hAsync("span", { key: '0956e484078fe3c11a3dbc9c583c9a00f78beb22', class: "label" }, hAsync("slot", { key: 'd38dda8929e0d9fd12abe02ea3e43dc4514699be' })), this.caret && hAsync("duet-icon", { key: '0ae18e14eb823bcac1af33ae2bd4fbab222296e1', name: "action-arrow-right-small", size: "xxx-small", margin: "none" })), this.active && (hAsync("duet-icon", { key: '2e54718adef2328ea759432eea812e3e959931e7', class: "active-check", name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
+            }, "aria-current": this.active ? "true" : "false", href: this.href, onKeyUp: e => this.handleEscape(e) }, this.icon && hAsync("duet-icon", { key: '319594b6529b9a4c1c5cce67e79e33e062708171', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), hAsync("span", { key: '645e44313c0a1311e04587b484f73bda875987f5', class: "label-container" }, hAsync("span", { key: '2da2a5c2904e5507f1edb4d0bb7f414d976d10fd', class: "label" }, hAsync("slot", { key: '5f47fe83755d3caa4d520b547fee609cd93017da' })), this.caret && hAsync("duet-icon", { key: 'b89a6102c74ee5460b2ceffed40eb895d64f8d54', name: "action-arrow-right-small", size: "xxx-small", margin: "none" })), this.active && (hAsync("duet-icon", { key: 'ff7a33663227d6dd8489f66b2b5929057da8c659', class: "active-check", name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSubmenuBarDropdownLinkStyle0; }
@@ -20738,7 +20911,7 @@ class DuetSubmenuBarItem {
     render() {
         const TagName = this.url ? "a" : "button";
         const role = this.url ? "link" : "button";
-        return (hAsync(Host, { key: '15d1f01cbd76c4ced8aa252ed81917561aeeef90', role: "listitem" }, hAsync(TagName, { key: '9f15d11e5868c3a481013409fb19379340a330f9', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: { "duet-submenu-bar-item": true, "duet-theme-turva": this.theme === "turva", active: this.active }, href: this.url, onKeyUp: e => this.handleEscape(e), "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, role: role, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("duet-icon", { key: 'bdd450ab99c8780a4cbde43bfafda57632e452a2', class: "leading-icon", theme: this.theme, name: this.leadingIcon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: '3fa29d16137ca86381aade1733233f69c9aa2ac4', class: "label" }, hAsync("span", { key: 'a3156e9e1fe7b81cc1f0c651e17c8e05482901fb', class: "label-text" }, hAsync("slot", { key: '50b0c3530a7acd735a6d0d563bd4a59fee5512db' })), (this.trailingIcon || this.external) && (hAsync("duet-icon", { key: 'c9d8546f6eea591cf4932bf78364aae8eac66f4d', class: {
+        return (hAsync(Host, { key: 'eddc232862537069e646d18e8de3e6b7e5570f9d', role: "listitem" }, hAsync(TagName, { key: '3203c493afd7c1fee94ab963d73d444ac214edc6', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: { "duet-submenu-bar-item": true, "duet-theme-turva": this.theme === "turva", active: this.active }, href: this.url, onKeyUp: e => this.handleEscape(e), "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, role: role, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("duet-icon", { key: 'c237f48ffb0a803f346e627f3378db0447095f04', class: "leading-icon", theme: this.theme, name: this.leadingIcon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: '5bc1441b2296f4e359097aa111e2943d7964f3d9', class: "label" }, hAsync("span", { key: '7c2f284efc6f683f0fa8dd0999279b1e5815e5e3', class: "label-text" }, hAsync("slot", { key: '688632c54762efe35b397ef550a184d49c3409a4' })), (this.trailingIcon || this.external) && (hAsync("duet-icon", { key: '75a8d9157f7dc2a8408281b48727e0bcf5199165', class: {
                 "trailing-icon": !!this.trailingIcon,
                 "trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
                 "external-icon": !!this.external,
@@ -20799,7 +20972,7 @@ class DuetSubmenuBarLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'cf46769797af8d0cfbfc34a5d9f754e064b23da3', role: "listitem" }, hAsync("a", { key: 'ba77c3487605554e93c2628b6ca4a13558dd63cc', class: { "duet-submenu-bar-link": true, "duet-theme-turva": this.theme === "turva", active: this.active }, href: this.href, onKeyUp: e => this.handleEscape(e), "aria-current": this.active ? "true" : "false" }, this.icon && (hAsync("duet-icon", { key: '80b4386830ee4f24c1898e7fc81b06cb5542aad3', class: "submenu-bar-link-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("span", { key: '5232690bfa4c2ead759d2dd89a08efa0cb0ddb39', class: "label" }, hAsync("slot", { key: 'b27e4d3d3cdb1ff0005ac3ffca339852c0ae0b2b' })))));
+        return (hAsync(Host, { key: '1851290835bc0e6215a468b46de5d4b4507a1459', role: "listitem" }, hAsync("a", { key: 'f69c3eb64a32fe2fb4751eefddd68e84fed53b97', class: { "duet-submenu-bar-link": true, "duet-theme-turva": this.theme === "turva", active: this.active }, href: this.href, onKeyUp: e => this.handleEscape(e), "aria-current": this.active ? "true" : "false" }, this.icon && (hAsync("duet-icon", { key: '682c9d777be7cc59c30b734aeb2c31843e45671c', class: "submenu-bar-link-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("span", { key: '24f70e921680f881498908e2b5269b8e3ac6b842', class: "label" }, hAsync("slot", { key: '4f66a4338778fa2891eaa88c8ddffe65af1f7a30' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSubmenuBarLinkStyle0; }
@@ -21151,13 +21324,13 @@ class DuetTabGroup {
                 [`duet-notification-mark-${element.notificationMark}`]: !!element.notificationMark,
                 [largeBreakpoint]: ["default", "plain", "plain-scrolling"].includes(this.variation) ? true : false,
             }, onClick: () => this.onTabSelect(index), onKeyDown: ev => this.handleKeyDown(ev) }, this.variation === "checked" ? (hAsync("div", { class: { "checked-tab-content": true, "stackable-checked-tab-content": this.tabs.length <= 3 } }, hAsync("div", { class: { "checked-tab-description": true, "stackable-description": this.tabs.length <= 3 } }, hAsync("p", null, element.label), hAsync("p", { class: { "tab-caption": true, selected: element.selected } }, element.caption)), hAsync("div", { class: { "stackable-checkmark": this.tabs.length <= 3 } }, hAsync("duet-checkmark", { theme: this.theme, checked: element.selected, type: "radio", "presentation-only": true, center: true })))) : (element.label))));
-        return (hAsync("div", { key: 'ba7736ac0b95d5470fb0ed873d4b38a154dcbb64', class: {
+        return (hAsync("div", { key: '8d00d531e80a9c26cf00ef7d0315105c478c02fb', class: {
                 "duet-tab-group": true,
                 "duet-theme-turva": this.theme === "turva",
                 [variationClass]: true,
                 "duet-tab-plain-scrolling": this.variation === "plain-scrolling",
                 "duet-tab-group-scrolls": true,
-            }, "aria-label": this.accessibleLabel }, hAsync("div", { key: '4a074d5dbd67da42ed48f8d3dfe9ec4310236d80', role: "tablist", class: {
+            }, "aria-label": this.accessibleLabel }, hAsync("div", { key: '8c9abd65ee9f805d69745ee46af2e3626fad5e8b', role: "tablist", class: {
                 "duet-m-0": this.margin === "none" || this.variation === "checked",
                 "duet-tab-group-tabs": true,
                 "duet-tab-group-hidden": this.tabs.length > 3 && !isSwipeScrollable,
@@ -21168,11 +21341,11 @@ class DuetTabGroup {
             } }, this.variation === "checked" ? (buttons) : (hAsync("div", { class: {
                 "duet-tab-group-scrollable-wrapper": true,
                 "duet-tab-group-fill-space-wrapper": this.fillSpace && this.variation === "default",
-            } }, this.fillSpace && !this.stretch && this.variation === "default" && (hAsync("div", { class: "duet-scrollable-stretch-overlay" }, hAsync("div", { class: "background" }), hAsync("div", { class: "border" }))), hAsync("duet-scrollable", { selected: this.selected, identifier: this.identifier, gap: ["default", "plain", "plain-scrolling"].includes(this.variation) ? "none" : "large", buttonPosition: this.variation === "default" ? "absolute" : "relative", center: this.isCentered() ? this.isCentered() : this.element.style.textAlign == "center", theme: this.theme, stretch: this.stretch }, buttons)))), hAsync("div", { key: 'f5f7596722133e827c24c7db62ddba338bbfb1bf', class: {
+            } }, this.fillSpace && !this.stretch && this.variation === "default" && (hAsync("div", { class: "duet-scrollable-stretch-overlay" }, hAsync("div", { class: "background" }), hAsync("div", { class: "border" }))), hAsync("duet-scrollable", { selected: this.selected, identifier: this.identifier, gap: ["default", "plain", "plain-scrolling"].includes(this.variation) ? "none" : "large", buttonPosition: this.variation === "default" ? "absolute" : "relative", center: this.isCentered() ? this.isCentered() : this.element.style.textAlign == "center", theme: this.theme, stretch: this.stretch }, buttons)))), hAsync("div", { key: '93070e930820e5f493f118e8d60c95b47d4fe47e', class: {
                 "duet-tab-group-content": true,
                 "duet-m-0": this.margin === "none",
                 "checked-group-content": this.variation === "checked",
-            } }, hAsync("slot", { key: 'cfbca5d14ae3d8ea6b76d6c7d48a1d3f8f6dfcce' }))));
+            } }, hAsync("slot", { key: '4b95faccd490ae74645f2eccf68636703ff1fae8' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetTabGroupStyle0; }
@@ -21279,7 +21452,7 @@ class DuetTable {
         }
     }
     render() {
-        return (hAsync(Host, { key: '13f47629478b7705622fc91ddc04badedba77dfe', class: {
+        return (hAsync(Host, { key: 'fc3dbefb9caed333ce27098bac9cad5154d0527d', class: {
                 [`duet-table-${this.variation}`]: true,
                 "duet-table-flattened": !this.matchesBreakpoint,
                 // sticky only valid when in regular table layout
@@ -21288,7 +21461,7 @@ class DuetTable {
                 "duet-m-0": this.margin === "none",
                 "duet-theme-turva": this.theme === "turva",
                 "duet-table-hide-head-visually": this.hideHeadVisually,
-            } }, hAsync("slot", { key: '0d23468c6d252e529c9297dc635590f372c025c8' })));
+            } }, hAsync("slot", { key: '34742ef188f22769be8c47a122f782193529f933' })));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -21677,11 +21850,11 @@ class DuetToolbar {
             : this.variation === "secondary"
                 ? "secondary"
                 : "default";
-        return (hAsync(Host, { key: '1b26e3981203dbae3216d276dd83f7f60ddb5184' }, hAsync("nav", { key: 'f8b9f1f97884e9fb74afcdb598962684871f942d', class: {
+        return (hAsync(Host, { key: '64b4d516cebc6fa24510aca130d70fc9bb513fb4' }, hAsync("nav", { key: '9b6ce4135f83abc26ed0abd1220dec0c983784f5', class: {
                 "duet-toolbar": true,
                 "duet-theme-turva": this.theme === "turva",
                 [variation]: true,
-            }, "aria-label": this.accessibleLabel }, hAsync("div", { key: 'f17013b753eff5838cf4415d2bb388d4025a92d9', class: "container" }, hAsync("div", { key: '597857dd4c29a1172996e68893b65631714761cc', class: "list", role: "list" }, hAsync("slot", { key: '6fbaec704bb93b8568ac6cf039f45af1202423a0', name: "left" })), hAsync("div", { key: '3eb765f8f290491f0641e9ca188545e8fbb4f344', class: "list", role: "list" }, hAsync("slot", { key: '6cc0db90a4eaa2da03be6ac05abe32d5e120cd8e', name: "right" }))))));
+            }, "aria-label": this.accessibleLabel }, hAsync("div", { key: '4480fce81d73c41904c4f6045da68f4b938692e8', class: "container" }, hAsync("div", { key: '077ee51ac07a8369f4ab3e33503080f63d2e3098', class: "list", role: "list" }, hAsync("slot", { key: '7359e182598454aca46588af570ecc83e888d34f', name: "left" })), hAsync("div", { key: '189d1363763a63c10040d2ae9843695027c52657', class: "list", role: "list" }, hAsync("slot", { key: 'f10760c354e2a1d080107eff5dbde9c1bc3b1cf5', name: "right" }))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetToolbarStyle0; }
@@ -21749,18 +21922,18 @@ class DuetToolbarDropdown {
             itemsAlign = this.element.parentElement.getAttribute("slot") === "left" ? "right" : "left";
         }
         const variation = this.variation === "negative" ? "negative" : "white";
-        return (hAsync(Host, { key: 'e3e0b0413cd3bb1ac40c4e7e2b62e5b283d4f01b', role: "listitem" }, hAsync("div", { key: '1ed23dc163be5fccf92e84b22748b65f5b382450', class: {
+        return (hAsync(Host, { key: 'a845cc23755fc7a4852b9a6034c7a3da2464af09', role: "listitem" }, hAsync("div", { key: 'd9d3bc229d8ab3369a031fc1acc1e2b88452f797', class: {
                 "duet-toolbar-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 [itemsAlign]: true,
                 [variation]: true,
-            } }, hAsync("button", { key: '2ff445e277b068bb749a9289450765c267e3650a', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel, id: "button", type: "button", class: {
+            } }, hAsync("button", { key: '4e2458e7f3458884e6ccc16d15e07e57611a4cb6', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel, id: "button", type: "button", class: {
                 active: this.active,
                 open: this.open,
-            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: 'f432f08d46fc050de9869d812b98669093a33e49', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), hAsync("span", { key: '89ac028982a6343570fdebf2c92be6ea447fc038', class: "label" }, hAsync("slot", { key: '48e08bb48a393700258882aec5dd454fe9e634ed', name: "label" }), hAsync("duet-icon", { key: 'c184176e214992303b1f5432048696b45f585849', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: '8a612f1e69417f1a1dae5a2992271d364dd8a8f1', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: '73cccaa547adab87c3480e6b1462a978568faf3f', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), hAsync("span", { key: '81926dc68885ca6ca2290a298727b9d71fc2fc07', class: "label" }, hAsync("slot", { key: '7d99a9ce05e38925b5782fe6f12716446afc2c8d', name: "label" }), hAsync("duet-icon", { key: 'c83b298d4b3e2dadc25702efb503a4c6d2087356', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: '5129184bb7ae73dd61761748c0d4bc91d963e320', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, hAsync("slot", { key: 'a81f13bd3fb026cf6d2a3d6e3f479eb651fc69d6' })))));
+            } }, hAsync("slot", { key: 'edc919fd8370473ebf8ce396986c0ca90bb8a143' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetToolbarDropdownStyle0; }
@@ -21813,11 +21986,11 @@ class DuetToolbarDropdownLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '645f93450f0caf5a8c1df824e05e63efde366c4b' }, hAsync("a", { key: '0bae9657b6fce539b28fffb2b3f6b8a131609dc2', class: {
+        return (hAsync(Host, { key: '3a8f1796da5e4eed80e084833b77f496163c9a84' }, hAsync("a", { key: 'fd20d08ddf5814318cd34453e5c9d5c258bd613a', class: {
                 "duet-toolbar-dropdown-link": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
-            }, href: this.href, lang: this.targetLanguage, hreflang: this.targetLanguage, role: "link menuitem", "aria-label": this.accessibleLabel, "aria-current": this.active ? "true" : "false", onKeyUp: e => this.handleEscape(e) }, this.icon && hAsync("duet-icon", { key: '96c0041583fdbf915f5aeedc503ac3300a30821e', name: this.icon, size: "x-small", margin: "none" }), hAsync("span", { key: '3ae8836e9a88f633afab3d9232c1fad48b8dd493', class: "label" }, hAsync("slot", { key: 'f1f35cebdf4d521a8614244e868ec9cb07977e7b' })), this.active && (hAsync("duet-icon", { key: '8e68e9e11d5ef1f41229a22148b2004b884b4b7e', name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
+            }, href: this.href, lang: this.targetLanguage, hreflang: this.targetLanguage, role: "link menuitem", "aria-label": this.accessibleLabel, "aria-current": this.active ? "true" : "false", onKeyUp: e => this.handleEscape(e) }, this.icon && hAsync("duet-icon", { key: '271f53fb65a420b00f3318a8ac0adeea352d0237', name: this.icon, size: "x-small", margin: "none" }), hAsync("span", { key: '7f381a95d1a2838540bba5c109b07a73ebc2c91d', class: "label" }, hAsync("slot", { key: 'a91086b05e18c4b125704df49f5302b291b3fc8b' })), this.active && (hAsync("duet-icon", { key: 'e8039a105270b943bddb019a3f107badfeba322c', name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetToolbarDropdownLinkStyle0; }
@@ -21892,17 +22065,17 @@ class DuetToolbarItem {
             : this.variation === "secondary"
                 ? "secondary"
                 : "default";
-        return (hAsync(Host, { key: '2d0b83d83b3a9ffe81c3548b5063031c3ec3b4ed', role: "listitem" }, hAsync(TagName, { key: 'd37ea9c4e7b0e64d48bd131f83c6e96cef0abe77', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: {
+        return (hAsync(Host, { key: 'd69676de72b58792b6fd41da3e6eb09a53cd48d3', role: "listitem" }, hAsync(TagName, { key: 'd2ff00e84af5a473dac3b4caf3b2a491593dfcbd', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: {
                 "duet-toolbar-item": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
                 [variation]: true,
-            }, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("div", { key: '482d4ad7407f7d7ca7117f121e2e14de1e56b9cf', class: "duet-toolbar-icon" }, hAsync("duet-icon", { key: '4f192028d160dace9ef06866270904fd8678e892', size: "x-small", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" }), this.badge && hAsync("div", { key: '9eb9caf3dafec0fffe8064a3257f149e8a5d21cf', class: "duet-toolbar-badge" }))), hAsync("slot", { key: '4b6b9cb23199194276c367c962a45b509b3f87fa' }), (this.trailingIcon || (this.url && this.external)) && (hAsync("div", { key: '164365e260e98746e1da3030667d3ca0f50b84a0', class: "duet-toolbar-icon" }, hAsync("duet-icon", { key: '4ff06acf193e967429202e08ba6016ec3a55d258', class: {
+            }, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("div", { key: '99f91d28951629539f577ba0aefda88a1a0116f9', class: "duet-toolbar-icon" }, hAsync("duet-icon", { key: 'dc80d784768df86809d20c377e3c7179ca124998', size: "x-small", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" }), this.badge && hAsync("div", { key: '345f9099e4c859093b70fca3388867aab136345b', class: "duet-toolbar-badge" }))), hAsync("slot", { key: 'c63b02d192ca68bcd5ec87c9419ae5f18f5b26e1' }), (this.trailingIcon || (this.url && this.external)) && (hAsync("div", { key: '037443df79d823efb2919538d02cac0b047532f0', class: "duet-toolbar-icon" }, hAsync("duet-icon", { key: '1e9c5d4addcaba3688edb9ce169bc20b407b2bbf', class: {
                 "trailing-icon": !!this.trailingIcon,
                 "trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
                 "external-icon": !!(this.url && this.external),
                 rotate: this.trailingIcon === "action-arrow-down-small" && this.accessibleExpanded,
-            }, theme: this.theme, name: this.trailingIcon ? this.trailingIcon : this.url && this.external ? actionNewWindowSmall.title : "", margin: "none", size: "auto", color: "currentColor" }), this.badge && this.trailingIcon !== "action-arrow-down-small" && hAsync("div", { key: '670c38e01c6a1571d0300152fcfa6a744c7f1045', class: "duet-toolbar-badge" }))))));
+            }, theme: this.theme, name: this.trailingIcon ? this.trailingIcon : this.url && this.external ? actionNewWindowSmall.title : "", margin: "none", size: "auto", color: "currentColor" }), this.badge && this.trailingIcon !== "action-arrow-down-small" && hAsync("div", { key: 'e4a1519e0557bb0d77b6ab89d17e72cefd121540', class: "duet-toolbar-badge" }))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetToolbarItemStyle0; }
@@ -21956,12 +22129,12 @@ class DuetToolbarLink {
      */
     render() {
         const variation = this.variation === "negative" ? "negative" : "white";
-        return (hAsync(Host, { key: '18a7b211c2e20259e170b01bda4dd1cda7bdcc46', role: "listitem" }, hAsync("a", { key: 'b151faf80ab544b2bf82223f1aa925d0911957ca', class: {
+        return (hAsync(Host, { key: '9bf5e5c3c16886df82ba85532811902289208a09', role: "listitem" }, hAsync("a", { key: '549e03a44fd766dabcf4b9a90deced22126d9170', class: {
                 "duet-toolbar-link": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
                 [variation]: true,
-            }, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: '1ed9551d4d8c83820b356395628c3cb267fb46cc', size: "x-small", name: this.icon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: 'cba520b591daf1ad9fbe70581a2b97a249b21861' }))));
+            }, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: '8946a984d10dd47804f79ed821ca8d3e5c94c12e', size: "x-small", name: this.icon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: 'cfa598fbbb9d48527c3eb23aaeb9acea33ebc5f8' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetToolbarLinkStyle0; }
@@ -22224,13 +22397,13 @@ class DuetTooltipButton {
      * Always the last one in the class.
      */
     render() {
-        const visuallyHidden = hAsync("duet-visually-hidden", { key: '7106b1bb9e87cd78196542ca565a2ed1dd2f439a' }, this.accessibleLabel);
-        return (hAsync(Host, { key: 'a8c7ee7f61c14fff400cb660e2f9d858e99e3f71' }, hAsync("button", { key: 'c8ece0bb13184553a6c208d2e42e4c774cf1a7c4', ref: el => (this.buttonElement = el), "aria-controls": this.tooltipId, "aria-expanded": this.active ? "true" : "false", type: "button", class: {
+        const visuallyHidden = hAsync("duet-visually-hidden", { key: 'e33d5ff7c54de9ccfc5e8fb1412e269a84b35991' }, this.accessibleLabel);
+        return (hAsync(Host, { key: 'ab547cfbb38f6b76df6709a7990d5747ddc6bf7b' }, hAsync("button", { key: '940756da9995337019b88c3d73a88903e6d01e48', ref: el => (this.buttonElement = el), "aria-controls": this.tooltipId, "aria-expanded": this.active ? "true" : "false", type: "button", class: {
                 "duet-tooltip-button": true,
                 "duet-tooltip-button-has-label": !!this.label,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-tooltip-button-negative": this.negative,
-            } }, hAsync("svg", { key: 'accbafb234802a0515078d8b7b6b6ef8ba282de4', "aria-hidden": "true", role: "img", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: 'fba958ef3715f6c723a7992e27b2b6f9c032e314', d: "m13.5 17.25c-1.241 0-2.25-1.009-2.25-2.25v-3.75h-.75c-.414 0-.75-.336-.75-.75s.336-.75.75-.75h.75c.827 0 1.5.673 1.5 1.5v3.75c0 .414.336.75.75.75h.75c.414 0 .75.336.75.75s-.336.75-.75.75z" }), hAsync("circle", { key: '9bcb4036acd865594c8f9ad37b04d429e85f650a', cx: "11.625", cy: "7.125", r: "1.125" }), hAsync("path", { key: 'bff2dba440a3f3a100225bb06f2af68fc813e06b', d: "m12 24c-6.617 0-12-5.383-12-12s5.383-12 12-12 12 5.383 12 12-5.383 12-12 12zm0-22.5c-5.79 0-10.5 4.71-10.5 10.5s4.71 10.5 10.5 10.5 10.5-4.71 10.5-10.5-4.71-10.5-10.5-10.5z" })), this.label ? (hAsync("span", { class: "duet-tooltip-label" }, this.label, visuallyHidden)) : (visuallyHidden))));
+            } }, hAsync("svg", { key: '878411718bd0af7f2570c2c5fbc798255b7fd167', "aria-hidden": "true", role: "img", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: 'cb0fa3b6b5b095d85e2b04bd7a3b2771d1be7dcb', d: "m13.5 17.25c-1.241 0-2.25-1.009-2.25-2.25v-3.75h-.75c-.414 0-.75-.336-.75-.75s.336-.75.75-.75h.75c.827 0 1.5.673 1.5 1.5v3.75c0 .414.336.75.75.75h.75c.414 0 .75.336.75.75s-.336.75-.75.75z" }), hAsync("circle", { key: '56af372800cd47d4649fdbde93f4c5a58d648b3b', cx: "11.625", cy: "7.125", r: "1.125" }), hAsync("path", { key: '1e7d617fa97e77282ed8c5eb0cc4c6950843e146', d: "m12 24c-6.617 0-12-5.383-12-12s5.383-12 12-12 12 5.383 12 12-5.383 12-12 12zm0-22.5c-5.79 0-10.5 4.71-10.5 10.5s4.71 10.5 10.5 10.5 10.5-4.71 10.5-10.5-4.71-10.5-10.5-10.5z" })), this.label ? (hAsync("span", { class: "duet-tooltip-label" }, this.label, visuallyHidden)) : (visuallyHidden))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetTooltipButtonStyle0; }
@@ -22298,11 +22471,11 @@ class DuetTooltipPopup {
         this.contentEl.focus();
     }
     render() {
-        return (hAsync(Host, { key: '9a5bab8a640a8e21f3394ce5e23493ebc22d0aad' }, hAsync("div", { key: '047fb1564878ea17fd9f2bf8133755b37fa2ace4', class: {
+        return (hAsync(Host, { key: '52785c8e588e72a87dcf1add6c8ccca0cbd26448' }, hAsync("div", { key: '085b0aa28ec28f0615daedf985fb23f7db8d35c7', class: {
                 "duet-tooltip": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-tooltip-active": this.active === true,
-            } }, hAsync(FocusGuard, { key: 'fb8136dc7dce4c5830fb860e79e64ea04d07c657', moveFocusTo: this.buttonEl }), hAsync("div", { key: 'beaffa1e94ab151c8eea0f81cedb7293ea7d0389', ref: element => (this.contentEl = element), class: "duet-tooltip-content-area", tabindex: -1, id: this.tooltipId }, hAsync("slot", { key: 'd4a552a72620c431c91961aa6d8f7ed221f85f08' })), hAsync("div", { key: '020780a90ed0a9cd5081e281fbed8e9d8abd1181', ref: element => (this.arrowEl = element), class: { arrow: true, [this.placement]: true }, style: this.arrowStyles }, hAsync("div", { key: 'ee14dc7fb877dd3bb59b8ad7150163801aed006e', class: { "arrow-container": true, [this.placement]: true } })), hAsync("button", { key: '1647e888863c3fc509ddd94b3425cfda80786ac3', type: "button", class: "duet-tooltip-close", onClick: this.handleCloseClick, ref: el => (this.buttonEl = el) }, hAsync("duet-icon", { key: '423141f0683fda8e7a1d4034c7b4f315a7bb3fc2', name: "navigation-close-small", margin: "none", color: "currentColor", size: "xxx-small" }), hAsync("duet-visually-hidden", { key: 'c9021c4343e71a413b841fd7d41dc222d0852b13' }, this.accessibleCloseLabel)), hAsync(FocusGuard, { key: 'ecc8993e7816a4dda3de97fea5bd5581f5c20748', moveFocusTo: this.contentEl }))));
+            } }, hAsync(FocusGuard, { key: 'ae3793ed10fa5b4c6d85350f9bae48a32a93bf8b', moveFocusTo: this.buttonEl }), hAsync("div", { key: 'f4654d51693c02e8c7c95dcfd11b07dd498d31ee', ref: element => (this.contentEl = element), class: "duet-tooltip-content-area", tabindex: -1, id: this.tooltipId }, hAsync("slot", { key: '3cb80ff2bd3e5f22e91de7d5cb8c719f9650cf48' })), hAsync("div", { key: 'a6e3ac901d41380301f593aba7542ba445a34a64', ref: element => (this.arrowEl = element), class: { arrow: true, [this.placement]: true }, style: this.arrowStyles }, hAsync("div", { key: '4abf64ccc297dde45c638b2669a44901a3249b1b', class: { "arrow-container": true, [this.placement]: true } })), hAsync("button", { key: '8a5f07200d7128784b691dc089a9dcc70ea3ba25', type: "button", class: "duet-tooltip-close", onClick: this.handleCloseClick, ref: el => (this.buttonEl = el) }, hAsync("duet-icon", { key: 'aa4359871dd0fbea3ca4853cad8eeedc8f54d7ef', name: "navigation-close-small", margin: "none", color: "currentColor", size: "xxx-small" }), hAsync("duet-visually-hidden", { key: 'ae77b164703d563392d427039d075c7e123fe825' }, this.accessibleCloseLabel)), hAsync(FocusGuard, { key: '1ac506b5ff7da2efefaeb004032ccae12c73982f', moveFocusTo: this.contentEl }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetTooltipPopupStyle0; }
@@ -22410,14 +22583,14 @@ class DuetTray {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync("div", { key: '8ef830e96bfe8d9128c59456fc070df78f630164', class: {
+        return (hAsync("div", { key: '96084606679ac986f5d860ffc195f26aab281295', class: {
                 "duet-tray": true,
                 "duet-tray-is-active": this.active,
                 "duet-tray-is-hidden": this.hiddenState,
                 "duet-tray-is-responsive": this.responsive,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-tray-is-expandable": this.hasAdditionalContent,
-            } }, hAsync("div", { key: '5ca07e6221362e98885e3f64d1891d034994dd61', class: "duet-tray-default-content", role: "status" }, hAsync("slot", { key: '0693a066c13436b2d3ffd1ba0260c4181b3b84c8' })), this.hasAdditionalContent && (hAsync(Fragment, { key: 'ce5f7de71969dff3df7191129bbbbdd2b2233db4' }, hAsync("button", { key: 'c0388f7a10346736c79b4d4f149e862fc7d7270a', "aria-expanded": this.expanded ? "true" : "false", "aria-controls": this.expandableId, onClick: ev => this.toggleExpandable(ev), class: { "duet-tray-button": true, "duet-tray-is-expanded": this.expanded } }, hAsync("duet-icon", { key: '8525ba4f5430d9bcd88e9488c98e076cdd837160', name: "action-arrow-down", size: "small", color: "currentColor", margin: "none" }), hAsync("duet-visually-hidden", { key: 'e4a5d67ff8f05ec5721ca45c8dd87e446c3d204d' }, this.expanded ? this.accessibleCloseLabel : this.accessibleOpenLabel)), hAsync("div", { key: '74e06a06b27e68e1668ff24c516665548e9c0e0a', id: this.expandableId, class: { "duet-tray-expandable": true, active: this.expanded } }, hAsync("div", { key: 'e14c02a1f2c668ab8fb2642033fca0d1c4785361', class: "duet-tray-expandable-content" }, hAsync("slot", { key: '63e0d9a8c19b98b1b80cadde886b64d942fd48d1', name: "additional" })))))));
+            } }, hAsync("div", { key: 'c216ef5fe147332444de7041a7cf055ef7647d11', class: "duet-tray-default-content", role: "status" }, hAsync("slot", { key: '1142c70df87b38b5db3a2406f353ec9406cebfb3' })), this.hasAdditionalContent && (hAsync(Fragment, { key: '86874d91c2e4c75d3b8d7e874950e9c0b450ddf1' }, hAsync("button", { key: '5cd57f0eb06084abf2a12285efd180312dc877f0', "aria-expanded": this.expanded ? "true" : "false", "aria-controls": this.expandableId, onClick: ev => this.toggleExpandable(ev), class: { "duet-tray-button": true, "duet-tray-is-expanded": this.expanded } }, hAsync("duet-icon", { key: '7c210e3b602778375c1ffc82b0af164704ec61ea', name: "action-arrow-down", size: "small", color: "currentColor", margin: "none" }), hAsync("duet-visually-hidden", { key: '5a5538e6925ceef086a3e065854445f142215310' }, this.expanded ? this.accessibleCloseLabel : this.accessibleOpenLabel)), hAsync("div", { key: 'a8f2db600b259ebc99a7ae2c406f1f88d8cad5f0', id: this.expandableId, class: { "duet-tray-expandable": true, active: this.expanded } }, hAsync("div", { key: '04eb7a74c403f4e837ea55f95039c24eeac235aa', class: "duet-tray-expandable-content" }, hAsync("slot", { key: '512d3db4d7f11126a4b56870afb70f4d74189c8e', name: "additional" })))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetTrayStyle0; }
@@ -23533,10 +23706,10 @@ class DuetUpload {
             this.externalUploadButton.accessibleLabel = `${this.externalUploadButton.innerText}. ${caption}`;
         }
         // @ts-ignore
-        return (hAsync(Host, { key: '1cf963112372b0839905ebd303f16cfae5aa5917', class: { "duet-m-0": this.margin === "none" } }, hAsync("duet-fieldset", { key: '35564b78c8b82f58b93f9a7460399f57967e19bf', "label-heading-level": this.headerHeadingLevel, "label-hidden": this.hideHeader, label: this.label }, hAsync("slot", { key: 'faf369cde5952486b48923f2c913e4c049d156f6', name: "header" }), !this.files.size && (hAsync("duet-empty-state", { key: 'e472abcf75d492b1c4cb7a9b59cbe67b23d318f6', id: this.labelId, part: this.identifier ? `${this.identifier}-empty-state` : "duet-upload-empty-state", icon: "messaging-attachment" }, hAsync("duet-paragraph", { key: '421fac3a1916616bb493ba375f9b3d23e2a61fd0', margin: "none" }, this.fileListEmpty))), !!this.files.size && hAsync("slot", { key: '18b91ef0ca261cb796b9a03f2409c7172da19a82', name: "fileheader" }), !!this.files.size && (hAsync("duet-upload-aria-status", { key: '080c19a8966ab4943ef3ed1698b475ecc44c346e', invalid: this.getFilesAsArray().invalid.length, valid: this.getFilesAsArray().valid.length, inprogress: this.filesInProgress.size, total: this.files.size, statusMessageLabel: this.internalStatusMessageLabel })), !!this.files.size && this.renderUploadedItems(), !!this.files.size && hAsync("slot", { key: '7c1f27c8b8536a6112d6a1746812b80b672fbd96', name: "filefooter" }), hAsync("slot", { key: 'd5889f6e90bc40cc6031cbfb99c3f28e80fced37', name: "uploadfooter" }), this.captionOnBottom && (hAsync("duet-caption", { key: 'b4c43409de0dbfe70dd43939dea8c733493348cf', margin: "none", size: "small" }, hAsync("div", { key: 'f5c70becb6e99a87a9059885ca2bfc3748e0df10', class: "upload-bottom-caption" }, caption))), hAsync("slot", { key: '01adfecfb33b057497a73c43c2c7caaab1c4a9e2', name: "afterfooter" }), !this.hideButton && (hAsync(Fragment, { key: '601403192ed82f9b3508e62ab701daab90c313d2' }, hAsync("duet-spacer", { key: 'b387500c9d551a371d1c2e01a5ccfdeb130826e8', size: "large" }), hAsync("duet-button", { key: '681d70016955aeaaf21fbea4edf92fd7c28ccec0', id: this.buttonId, onClick: this.startUpload, "accessible-controls": identifier, disabled: this.fileMaxReached, "accessible-label": this.accessibleButtonLabel || `${this.buttonLabel}. ${caption}`, "accessible-owns": identifier, size: "small", variation: "secondary", fixed: true, icon: "action-add-circle", part: this.identifier ? `${this.identifier}-button-upload` : "duet-upload-button-upload" }, this.buttonLabel))), (this.fileMaxReached ||
+        return (hAsync(Host, { key: '2cb6006c495f141141399d81c7e6f8e7967d2abf', class: { "duet-m-0": this.margin === "none" } }, hAsync("duet-fieldset", { key: 'e3febb3aaed53ba1f63d0deaed3984233d081ff9', "label-heading-level": this.headerHeadingLevel, "label-hidden": this.hideHeader, label: this.label }, hAsync("slot", { key: '0cb5e96677cee13c2cb2748ec95182ba44542e9c', name: "header" }), !this.files.size && (hAsync("duet-empty-state", { key: '0b6ff2849bb502f136c3b4837ccdf19b5b2c1c18', id: this.labelId, part: this.identifier ? `${this.identifier}-empty-state` : "duet-upload-empty-state", icon: "messaging-attachment" }, hAsync("duet-paragraph", { key: '69ddeab39e14da3d436467aa935f3695587547fb', margin: "none" }, this.fileListEmpty))), !!this.files.size && hAsync("slot", { key: 'df6739a9d4d7c5c02e72e3f430f29d854edf1a99', name: "fileheader" }), !!this.files.size && (hAsync("duet-upload-aria-status", { key: 'cbd6241618dbf7ca04c61e1d0725f4dc157e87af', invalid: this.getFilesAsArray().invalid.length, valid: this.getFilesAsArray().valid.length, inprogress: this.filesInProgress.size, total: this.files.size, statusMessageLabel: this.internalStatusMessageLabel })), !!this.files.size && this.renderUploadedItems(), !!this.files.size && hAsync("slot", { key: 'aacaa46c313c829d4e880bf7c7e1848f0ea189cf', name: "filefooter" }), hAsync("slot", { key: '36551b5a589e7feee6077af241b9a25d297feb28', name: "uploadfooter" }), this.captionOnBottom && (hAsync("duet-caption", { key: 'd04226d485cc26a193935fa8e4fb98a462a0a505', margin: "none", size: "small" }, hAsync("div", { key: '6b45b8d84658fd393dc9522c5bc33288e39f7159', class: "upload-bottom-caption" }, caption))), hAsync("slot", { key: '2f2b87ae68a5df22a1fd03e11616249a26be0791', name: "afterfooter" }), !this.hideButton && (hAsync(Fragment, { key: '113e78c43b0be73519c29617ab452a494f567683' }, hAsync("duet-spacer", { key: '292f0dbbd87d637d7abf982b8e296b282ae89375', size: "large" }), hAsync("duet-button", { key: '774bc75ffb2f90878794215e7890d592abb7acd5', id: this.buttonId, onClick: this.startUpload, "accessible-controls": identifier, disabled: this.fileMaxReached, "accessible-label": this.accessibleButtonLabel || `${this.buttonLabel}. ${caption}`, "accessible-owns": identifier, size: "small", variation: "secondary", fixed: true, icon: "action-add-circle", part: this.identifier ? `${this.identifier}-button-upload` : "duet-upload-button-upload" }, this.buttonLabel))), (this.fileMaxReached ||
             this.bytesMaxReached ||
             this.filesToUploadExceedsLimit ||
-            this.filesToUploadTotalSizeIsAboveMax) && (hAsync(Fragment, { key: '0d1fa3fccf78c8af90c14195219c988a5d53b161' }, hAsync("duet-spacer", { key: '7602cb47424ab7b5ed19654956b4235691e97f91', size: "medium" }), hAsync("duet-alert", { key: '54a5be1c79fc490445d3f9fb36efa0c113d619d0', part: this.identifier ? `${this.identifier}-error-notification` : "duet-upload-error-notification" }, this.fileMaxReached && getI18nError("duet-upload-301", this.errorCodes), this.bytesMaxReached && getI18nError("duet-upload-202", this.errorCodes), this.filesToUploadExceedsLimit && getI18nError("duet-upload-302", this.errorCodes), this.filesToUploadTotalSizeIsAboveMax && getI18nError("duet-upload-203", this.errorCodes)))), hAsync("duet-visually-hidden", { key: '78a670de5fef020407da2b18bd07d6b056c818ed', "aria-hidden": "true" }, hAsync("input", { key: '04ce3da566f26a64f42a30eba51914031ad1dcc9', ref: input => {
+            this.filesToUploadTotalSizeIsAboveMax) && (hAsync(Fragment, { key: '7de2ffb0e3562b05cd46d1eb1d3360fc853cf601' }, hAsync("duet-spacer", { key: 'fa336882d4bd468f1e9593946f48d73929d26f87', size: "medium" }), hAsync("duet-alert", { key: 'd9a8cac2323b3b10d4cb5c22d0ec19c9b2082694', part: this.identifier ? `${this.identifier}-error-notification` : "duet-upload-error-notification" }, this.fileMaxReached && getI18nError("duet-upload-301", this.errorCodes), this.bytesMaxReached && getI18nError("duet-upload-202", this.errorCodes), this.filesToUploadExceedsLimit && getI18nError("duet-upload-302", this.errorCodes), this.filesToUploadTotalSizeIsAboveMax && getI18nError("duet-upload-203", this.errorCodes)))), hAsync("duet-visually-hidden", { key: '71318f80dd7ad1ef345bc1123be62719becdc52d', "aria-hidden": "true" }, hAsync("input", { key: 'a68a3d1d4490e75a2968e47a681f11cea7bc4d9b', ref: input => {
                 this.nativeInput = input;
             }, accept: !this.limitSelection ? undefined : `${this.allowedMimetypes},${this.allowedExtensions}`, onBlur: this.onBlur, onFocus: this.onFocus, onChange: e => this.onChange(e), type: "file", class: {
                 "duet-upload": true,
@@ -23857,7 +24030,7 @@ class DuetUploadAriaStatus {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '29a5f69ac1efab8c5faba9b62b86ae0201b67f92', role: "status", "aria-live": "assertive", "aria-atomic": "true", "aria-relevant": "all" }, hAsync("duet-visually-hidden", { key: 'def6c734ea787016244670da4652bbca170ee664' }, this.statusMessage)));
+        return (hAsync(Host, { key: '986a0f1f93835a89c37556bd7151fd95b2319185', role: "status", "aria-live": "assertive", "aria-atomic": "true", "aria-relevant": "all" }, hAsync("duet-visually-hidden", { key: '81e6ea00b9362ccd1accc3b01b9bfefaca5006c1' }, this.statusMessage)));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -24036,9 +24209,9 @@ class DuetUploadItem {
         const { uid, meta, item } = this.data;
         const Badges = meta && meta.badges ? (hAsync("span", null, meta.badges.map(badgeText => (hAsync("duet-badge", { color: "primary" }, badgeText))))) : undefined;
         const actionDescription = `${meta && meta.badges ? meta.badges.join(",") : ""} ${item.name}`;
-        return (hAsync("div", { key: '1f218828b275a4e375e1abc5bdfc07efd523cc65', class: {
+        return (hAsync("div", { key: 'a0d382c608507d07d924abb73bcbbeffa09e0aee', class: {
                 "upload-item-row": true,
-            } }, this.showCategory && (hAsync("div", { key: '658d56994cf4d0ba61795e1acb9fe240af8ff721', class: "item-categories" }, hAsync("duet-heading", { key: '43c031580760f22c5e947204718a95d7dd04d344', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.categoryLabel)), Badges)), hAsync("div", { key: '1c1a0d54400f909928885b373f98b250bd06cec0', class: { "item-name": true, "no-category": !this.showCategory } }, !!this.label && (hAsync("duet-heading", { key: '4255fa3f11831fc197e8f757bb4fbb6261592ead', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.label))), this.getFileNameLine()), hAsync("div", { key: '5195ccc35498ad7538d7aba059262d4704d600a8', class: "item-actions" }, this.actions.map(actionItem => {
+            } }, this.showCategory && (hAsync("div", { key: '4f7b9bb8c9494e062171d29e5cfc12a9a3e1027b', class: "item-categories" }, hAsync("duet-heading", { key: '477b02e94e76c857191fa6cd51f51bfd240bbbe7', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.categoryLabel)), Badges)), hAsync("div", { key: 'a12f1ea980d26df9122daf3dec6a4441716c88ff', class: { "item-name": true, "no-category": !this.showCategory } }, !!this.label && (hAsync("duet-heading", { key: '8cdca136f7a623a5b58fc863e02f15552ff73f0e', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.label))), this.getFileNameLine()), hAsync("div", { key: '33a97bcbb4daaf167e89fed5aacae4409b982177', class: "item-actions" }, this.actions.map(actionItem => {
             return (hAsync("duet-action-button", { actionMeta: Object.assign({}, meta || {}), actionId: uid || null, actionName: actionItem.name, theme: this.theme, iconName: actionItem.icon, iconColor: actionItem.color, iconSize: actionItem.size, background: actionItem.background, "accessible-label": `${actionDescription} ${getLocaleString(actionItem.label)} `, accessibleTitle: this.getActionButtonTitle(actionItem), ref: button => (this.actionButton = button) }));
         }))));
     }
@@ -24079,7 +24252,7 @@ class DuetVisuallyHidden {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'e229d70e362b7d02aba28a752b8c394ac6d596e4', class: "duet-visually-hidden" }, hAsync("slot", { key: '207e150e69b29418863501b85afdcc555d449355' })));
+        return (hAsync(Host, { key: 'ad4e235568c6ea33e55df1fd22e7ec078af3ca20', class: "duet-visually-hidden" }, hAsync("slot", { key: 'f5bb563082e973ea4bf7b9f710298858b5bc0fa3' })));
     }
     get element() { return getElement(this); }
     static get style() { return DuetVisuallyHiddenStyle0; }
@@ -24147,6 +24320,7 @@ registerComponents([
   DuetOverlay,
   DuetPageHeading,
   DuetPagination,
+  DuetPanel,
   DuetParagraph,
   DuetPhoneInput,
   DuetPopupMenu,