diff --git a/extensions-builtin/anapnoe-sd-theme-editor/javascript/ui_theme.js b/extensions-builtin/anapnoe-sd-theme-editor/javascript/ui_theme.js
new file mode 100644
index 00000000..2b8f1cd2
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-theme-editor/javascript/ui_theme.js
@@ -0,0 +1,455 @@
+function hexToRgb(color) {
+  let hex = color[0] === "#" ? color.slice(1) : color;
+  let c;
+
+  // expand the short hex by doubling each character, fc0 -> ffcc00
+  if (hex.length !== 6) {
+    hex = (() => {
+      const result = [];
+      for (c of Array.from(hex)) {
+        result.push(`${c}${c}`);
+      }
+      return result;
+    })().join("");
+  }
+  const colorStr = hex.match(/#?(.{2})(.{2})(.{2})/).slice(1);
+  const rgb = colorStr.map((col) => parseInt(col, 16));
+  rgb.push(1);
+  return rgb;
+}
+
+function rgbToHsl(rgb) {
+  const r = rgb[0] / 255;
+  const g = rgb[1] / 255;
+  const b = rgb[2] / 255;
+
+  const max = Math.max(r, g, b);
+  const min = Math.min(r, g, b);
+  const diff = max - min;
+  const add = max + min;
+
+  const hue =
+    min === max
+      ? 0
+      : r === max
+      ? ((60 * (g - b)) / diff + 360) % 360
+      : g === max
+      ? (60 * (b - r)) / diff + 120
+      : (60 * (r - g)) / diff + 240;
+
+  const lum = 0.5 * add;
+
+  const sat =
+    lum === 0 ? 0 : lum === 1 ? 1 : lum <= 0.5 ? diff / add : diff / (2 - add);
+
+  const h = Math.round(hue);
+  const s = Math.round(sat * 100);
+  const l = Math.round(lum * 100);
+  const a = rgb[3] || 1;
+
+  return [h, s, l, a];
+}
+
+function hexToHsl(color) {
+  const rgb = hexToRgb(color);
+  const hsl = rgbToHsl(rgb);
+  return "hsl(" + hsl[0] + "deg " + hsl[1] + "% " + hsl[2] + "%)";
+}
+
+function hslToHex(h, s, l) {
+  l /= 100;
+  const a = (s * Math.min(l, 1 - l)) / 100;
+  const f = (n) => {
+    const k = (n + h / 30) % 12;
+    const color = l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);
+    return Math.round(255 * Math.max(0, Math.min(color, 1)))
+      .toString(16)
+      .padStart(2, "0"); // convert to Hex and prefix "0" if needed
+  };
+  return `#${f(0)}${f(8)}${f(4)}`;
+}
+
+function hsl2rgb(h, s, l) {
+  let a = s * Math.min(l, 1 - l);
+  let f = (n, k = (n + h / 30) % 12) =>
+    l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);
+  return [f(0), f(8), f(4)];
+}
+
+function invertColor(hex) {
+  if (hex.indexOf("#") === 0) {
+    hex = hex.slice(1);
+  }
+  // convert 3-digit hex to 6-digits.
+  if (hex.length === 3) {
+    hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2];
+  }
+  if (hex.length !== 6) {
+    throw new Error("Invalid HEX color.");
+  }
+  // invert color components
+  var r = (255 - parseInt(hex.slice(0, 2), 16)).toString(16),
+    g = (255 - parseInt(hex.slice(2, 4), 16)).toString(16),
+    b = (255 - parseInt(hex.slice(4, 6), 16)).toString(16);
+  // pad each with zeros and return
+  return "#" + padZero(r) + padZero(g) + padZero(b);
+}
+
+function padZero(str, len) {
+  len = len || 2;
+  var zeros = new Array(len).join("0");
+  return (zeros + str).slice(-len);
+}
+
+function getValsWrappedIn(str, c1, c2) {
+  var rg = new RegExp("(?<=\\" + c1 + ")(.*?)(?=\\" + c2 + ")", "g");
+  return str.match(rg);
+}
+
+let styleobj = {};
+let hslobj = {};
+let isColorsInv;
+
+const toHSLArray = (hslStr) => hslStr.match(/\d+/g).map(Number);
+
+function offsetColorsHSV(ohsl) {
+  let inner_styles = "";
+
+  for (const key in styleobj) {
+    let keyVal = styleobj[key];
+
+    if (keyVal.indexOf("#") != -1 || keyVal.indexOf("hsl") != -1) {
+      let colcomp = document.body.querySelector("#" + key + " input");
+      if (colcomp) {
+        let hsl;
+
+        if (keyVal.indexOf("#") != -1) {
+          keyVal = keyVal.replace(/\s+/g, "");
+          //inv ? keyVal = invertColor(keyVal) : 0;
+          if (isColorsInv) {
+            keyVal = invertColor(keyVal);
+            styleobj[key] = keyVal;
+          }
+          hsl = rgbToHsl(hexToRgb(keyVal));
+        } else {
+          if (isColorsInv) {
+            let c = toHSLArray(keyVal);
+            let hex = hslToHex(c[0], c[1], c[2]);
+            keyVal = invertColor(hex);
+            styleobj[key] = keyVal;
+            hsl = rgbToHsl(hexToRgb(keyVal));
+          } else {
+            hsl = toHSLArray(keyVal);
+          }
+        }
+
+        let h = (parseInt(hsl[0]) + parseInt(ohsl[0])) % 360;
+        let s = parseInt(hsl[1]) + parseInt(ohsl[1]);
+        let l = parseInt(hsl[2]) + parseInt(ohsl[2]);
+
+        let hex = hslToHex(
+          h,
+          Math.min(Math.max(s, 0), 100),
+          Math.min(Math.max(l, 0), 100)
+        );
+
+        colcomp.value = hex;
+
+        hslobj[key] = "hsl(" + h + "deg " + s + "% " + l + "%)";
+        inner_styles += key + ":" + hslobj[key] + ";";
+      }
+    } else {
+      inner_styles += key + ":" + styleobj[key] + ";";
+    }
+  }
+
+  isColorsInv = false;
+
+  const preview_styles = document.body.querySelector("#preview-styles");
+  preview_styles.innerHTML = ":root {" + inner_styles + "}";
+  preview_styles.innerHTML +=
+    "@media only screen and (max-width: 860px) {:root{--ae-outside-gap-size: var(--ae-mobile-outside-gap-size);--ae-inside-padding-size: var(--ae-mobile-inside-padding-size);}}";
+
+  const vars_textarea = document.body.querySelector("#theme_vars textarea");
+  vars_textarea.value = inner_styles;
+  window.updateInput(vars_textarea);
+  /*   
+  const inputEvent = new Event("input");
+  Object.defineProperty(inputEvent, "target", { value: vars_textarea });
+  vars_textarea.dispatchEvent(inputEvent); 
+  */
+  
+}
+
+function updateTheme(vars) {
+  let inner_styles = "";
+
+  for (let i = 0; i < vars.length - 1; i++) {
+    let key = vars[i].split(":");
+    let id = key[0].replace(/\s+/g, "");
+    let val = key[1].trim();
+
+    styleobj[id] = val;
+    inner_styles += id + ":" + val + ";";
+
+    document.body
+      .querySelectorAll("#" + id + " input")
+      .forEach((elem) => {
+        if (val.indexOf("hsl") != -1) {
+          let hsl = toHSLArray(val);
+          let hex = hslToHex(hsl[0], hsl[1], hsl[2]);
+          elem.value = hex;
+        } else {
+          elem.value = val.split("px")[0];
+        }
+      });
+  }
+
+  const preview_styles = document.body.querySelector("#preview-styles");
+
+  if (preview_styles) {
+    preview_styles.innerHTML = ":root {" + inner_styles + "}";
+    preview_styles.innerHTML +=
+      "@media only screen and (max-width: 860px) {:root{--ae-outside-gap-size: var(--ae-mobile-outside-gap-size);--ae-inside-padding-size: var(--ae-mobile-inside-padding-size);}}";
+  } else {
+    const r = document.body;
+    const style = document.createElement("style");
+    style.id = "preview-styles";
+    style.innerHTML = ":root {" + inner_styles + "}";
+    style.innerHTML +=
+      "@media only screen and (max-width: 860px) {:root{--ae-outside-gap-size: var(--ae-mobile-outside-gap-size);--ae-inside-padding-size: var(--ae-mobile-inside-padding-size);}}";
+    r.appendChild(style);
+  }
+
+  const vars_textarea = document.body.querySelector("#theme_vars textarea");
+  const css_textarea = document.body.querySelector("#theme_css textarea");
+
+  vars_textarea.value = inner_styles;
+  css_textarea.value = css_textarea.value;
+
+  //console.log(Object);
+
+ /*  
+  const vEvent = new Event("input");
+  const cEvent = new Event("input");
+  Object.defineProperty(vEvent, "target", { value: vars_textarea });
+  Object.defineProperty(cEvent, "target", { value: css_textarea });
+  vars_textarea.dispatchEvent(vEvent);
+  css_textarea.dispatchEvent(cEvent); 
+  */
+
+  window.updateInput(vars_textarea);
+  window.updateInput(css_textarea);
+}
+
+function applyTheme() {
+  console.log("apply");
+}
+
+function initTheme(styles) {
+	
+  const css_styles = styles.split(
+    "/*BREAKPOINT_CSS_CONTENT*/"
+  );
+
+  let init_css_vars = css_styles[0].split("}")[0].split("{")[1];
+  init_css_vars = init_css_vars.replace(/\n|\r/g, "");
+
+  let init_vars = init_css_vars.split(";");
+  let vars = init_vars;
+
+  //console.log(vars);
+
+  const vars_textarea = document.body.querySelector("#theme_vars textarea");
+  const css_textarea = document.body.querySelector("#theme_css textarea");
+
+  vars_textarea.value = init_css_vars;
+  const additional_styles = css_styles[1] !== undefined ? css_styles[1] : "";
+
+  css_textarea.value =
+    "/*BREAKPOINT_CSS_CONTENT*/" + additional_styles + "/*BREAKPOINT_CSS_CONTENT*/";
+
+  updateTheme(vars);
+
+  const preview_styles = document.body.querySelector("#preview-styles");
+  if(!preview_styles){
+    const style = document.createElement('style'); 
+    style.id = 'preview-styles';
+    style.innerHTML = styles;
+    document.body.appendChild(style); 
+  }
+
+  
+  let intervalChange;
+
+  document.body
+    .querySelectorAll("#ui_theme_settings input")
+    .forEach((elem) => {
+      elem.addEventListener("input", function (e) {
+        let celem = e.currentTarget;
+        let val = e.currentTarget.value;
+        let curr_val;
+
+        switch (e.currentTarget.type) {
+          case "range":
+            celem = celem.parentElement;
+            val = e.currentTarget.value + "px";
+            break;
+          case "color":
+            celem = celem.parentElement.parentElement;
+            val = e.currentTarget.value;
+            break;
+          case "number":
+            celem = celem.parentElement.parentElement.parentElement;
+            val = e.currentTarget.value + "px";
+            break;
+        }
+
+       
+        if(celem.id === "--ae-input-slider-height"){
+          val = e.currentTarget.value;
+        }
+
+        styleobj[celem.id] = val;
+
+        //console.log(styleobj);
+
+        if (intervalChange != null) clearInterval(intervalChange);
+        intervalChange = setTimeout(() => {
+          let inner_styles = "";
+
+          for (const key in styleobj) {
+            inner_styles += key + ":" + styleobj[key] + ";";
+          }
+
+          vars = inner_styles.split(";");
+          preview_styles.innerHTML = ":root {" + inner_styles + "}";
+          preview_styles.innerHTML +=
+            "@media only screen and (max-width: 860px) {:root{--ae-outside-gap-size: var(--ae-mobile-outside-gap-size);--ae-inside-padding-size: var(--ae-mobile-inside-padding-size);}}";
+
+          vars_textarea.value = inner_styles;
+          window.updateInput(vars_textarea);
+          /* 
+          const vEvent = new Event("input");
+          Object.defineProperty(vEvent, "target", { value: vars_textarea });
+          vars_textarea.dispatchEvent(vEvent); 
+          */
+
+          offsetColorsHSV(hsloffset);
+        }, 1000);
+      });
+    });
+
+  const reset_btn = document.getElementById("theme_reset_btn");
+  reset_btn.addEventListener("click", function (e) {
+    e.preventDefault();
+    e.stopPropagation();
+    document.body
+      .querySelectorAll("#ui_theme_hsv input")
+      .forEach((elem) => {
+        elem.value = 0;
+      });
+    hsloffset = [0, 0, 0];
+    updateTheme(init_vars);
+  });
+
+
+  let intervalCheck;
+ 
+  function dropDownOnChange() {
+    if (init_css_vars !== vars_textarea.value) {
+      clearInterval(intervalCheck);
+      init_css_vars = vars_textarea.value.replace(/\n|\r/g, "");
+      vars_textarea.value = init_css_vars;
+      init_vars = init_css_vars.split(";");
+      vars = init_vars;
+      updateTheme(vars);
+    }
+  }
+
+  const drop_down = document.body.querySelector("#themes_drop_down input");
+  drop_down.addEventListener("click", function (e) {
+    if (intervalCheck !== null) clearInterval(intervalCheck);
+    vars_textarea.value = init_css_vars;
+    intervalCheck = setInterval(dropDownOnChange, 500);
+  });
+
+  let hsloffset = [0, 0, 0];
+
+  const hue = document.body
+    .querySelectorAll("#theme_hue input")
+    .forEach((elem) => {
+      elem.addEventListener("change", function (e) {
+        e.preventDefault();
+        e.stopPropagation();
+        hsloffset[0] = e.currentTarget.value;
+        offsetColorsHSV(hsloffset);
+      });
+    });
+
+  const sat = document.body
+    .querySelectorAll("#theme_sat input")
+    .forEach((elem) => {
+      elem.addEventListener("change", function (e) {
+        e.preventDefault();
+        e.stopPropagation();
+        hsloffset[1] = e.currentTarget.value;
+        offsetColorsHSV(hsloffset);
+      });
+    });
+
+  const brt = document.body
+    .querySelectorAll("#theme_brt input")
+    .forEach((elem) => {
+      elem.addEventListener("change", function (e) {
+        e.preventDefault();
+        e.stopPropagation();
+        hsloffset[2] = e.currentTarget.value;
+        offsetColorsHSV(hsloffset);
+      });
+    });
+
+  const inv_btn = document.getElementById("theme_invert_btn");
+  inv_btn.addEventListener("click", function (e) {
+    e.preventDefault();
+    e.stopPropagation();
+    isColorsInv = !isColorsInv;
+    offsetColorsHSV(hsloffset);
+  });
+}
+
+/* 
+function getRootVarsFromStylesheet(){
+	
+	const rootCssVariables = Array.from(document.styleSheets)
+	.flatMap((styleSheet) => Array.from(styleSheet.cssRules))
+	.filter((cssRule) => cssRule instanceof CSSStyleRule && cssRule.selectorText === ':root',)
+	.flatMap((cssRule) => Array.from(cssRule.style))
+	.filter((style) => style.startsWith('--'));
+	
+	console.log(rootCssVariables)
+	
+} 
+*/
+
+function observeGradioApp() {
+  const observer = new MutationObserver(() => {
+	  
+  const css = document.querySelector(`[rel="stylesheet"][href*="user"]`); 
+	const block = gradioApp().getElementById("tab_ui_theme");
+    if (css && block) {
+      observer.disconnect();
+      setTimeout(() => {
+		    const rootRules = Array.from(css.sheet.cssRules).filter((cssRule) => cssRule instanceof CSSStyleRule && cssRule.selectorText === ':root',);
+		    const rootCssText = rootRules[0].cssText;
+        //console.log("Loading theme vars", rootCssText);
+        initTheme(rootCssText);
+      }, "500");
+    }
+  });
+  observer.observe(gradioApp(), { childList: true, subtree: true });
+}
+
+document.addEventListener("DOMContentLoaded", () => {
+  observeGradioApp();
+});
diff --git a/extensions-builtin/anapnoe-sd-theme-editor/scripts/ui_theme.py b/extensions-builtin/anapnoe-sd-theme-editor/scripts/ui_theme.py
new file mode 100644
index 00000000..399798e1
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-theme-editor/scripts/ui_theme.py
@@ -0,0 +1,163 @@
+import os
+import shutil
+from pathlib import Path
+import gradio as gr
+import modules.scripts as scripts
+from modules import script_callbacks, shared
+
+basedir = scripts.basedir() 
+webui_dir = Path(basedir).parents[1]
+
+themes_folder = os.path.join(basedir, "themes") 
+javascript_folder = os.path.join(basedir, "javascript")
+webui_style_path = os.path.join(webui_dir, "user.css")
+
+def get_files(folder, file_filter=[], file_list=[], split=False):
+    file_list = [file_name if not split else os.path.splitext(file_name)[0] for file_name in os.listdir(folder) if os.path.isfile(os.path.join(folder, file_name)) and file_name not in file_filter] 
+    return file_list
+
+
+def on_ui_tabs():
+
+    with gr.Blocks(analytics_enabled=False) as ui_theme:    
+        with gr.Row():
+            with gr.Column(): 
+                with gr.Row():            
+                    themes_dropdown = gr.Dropdown(label="Themes", elem_id="themes_drop_down", interactive=True, choices=get_files(themes_folder,[".css, .txt"]), type="value")
+                    save_as_filename = gr.Text(label="Save / Save as")
+                with gr.Row(): 
+                    reset_button = gr.Button(elem_id="theme_reset_btn", value="Reset", variant="primary")
+                    #apply_button = gr.Button(elem_id="theme_apply_btn", value="Apply", variant="primary")                   
+                    save_button = gr.Button(value="Save", variant="primary")           
+                    #delete_button = gr.Button(value="Delete", variant="primary")
+                       
+        #with gr.Accordion(label="Debug View", open=True):
+        with gr.Row(elem_id="theme_hidden"):
+            vars_text = gr.Textbox(label="Vars", elem_id="theme_vars", show_label=True, lines=7, interactive=False, visible=True)            
+            css_text = gr.Textbox(label="Css", elem_id="theme_css", show_label=True, lines=7, interactive=False, visible=True)               
+            #result_text = gr.Text(elem_id="theme_result", interactive=False, visible=False)
+       
+        with gr.Accordion(label="Theme Color adjustments", open=True):   
+            with gr.Row():
+                with gr.Column(elem_id="ui_theme_hsv"): 
+                    gr.Slider(elem_id="theme_hue", label='Hue', minimum=0, maximum=360, step=1)
+                    gr.Slider(elem_id="theme_sat", label='Saturation', minimum=-100, maximum=100, step=1, value=0, interactive=True)
+                    gr.Slider(elem_id="theme_brt", label='Lightness', minimum=-50, maximum=50, step=1, value=0, interactive=True)
+                
+                gr.Button(elem_id="theme_invert_btn", value="Invert", variant="primary")
+
+        with gr.Column(elem_id="ui_theme_settings"):  
+            with gr.Accordion(label="Main", open=False):                   
+                gr.ColorPicker(elem_id="--ae-main-bg-color", interactive=True, label="Background color")
+                gr.ColorPicker(elem_id="--ae-primary-color", label="Primary color")
+                gr.ColorPicker(elem_id="--ae-secondary-color", label="Secondary color")                                                          
+
+            with gr.Accordion(label="Spacing", open=False):
+                gr.Slider(elem_id="--ae-gap-size-val", label='Gap size', minimum=0, maximum=8, step=1) 
+            
+            """ with gr.Accordion(elem_classes="hidden", label="Spacing (Mobile)", open=False):
+                gr.Slider(elem_id="--ae-mobile-gap-size-val", label='Gap size', minimum=0, maximum=8, step=1) """
+                              
+            with gr.Accordion(label="Panel", open=False):
+                gr.ColorPicker(elem_id="--ae-panel-bg-color", label="Panel background color")
+                gr.ColorPicker(elem_id="--ae-panel-border-color", label="Panel border color")
+                gr.Slider(elem_id="--ae-panel-padding", label='Panel padding', minimum=0, maximum=10, step=1)
+                gr.Slider(elem_id="--ae-border-radius", label='Panel border radius', minimum=0, maximum=8, step=1)
+                gr.Slider(elem_id="--ae-border-size", label='Panel border size', minimum=0, maximum=4, step=1)
+
+            with gr.Accordion(label="Component", open=False):                   
+               
+                gr.Slider(elem_id="--ae-input-height", label='Component size', minimum=28, maximum=45, step=1)
+                gr.Slider(elem_id="--ae-input-slider-height", label='Slider height', minimum=0.1, maximum=1, step=0.1)
+                gr.Slider(elem_id="--ae-input-padding", label='Padding', minimum=0, maximum=10, step=1)
+                gr.Slider(elem_id="--ae-input-font-size", label='Font size', minimum=10, maximum=16, step=1)
+                gr.Slider(elem_id="--ae-input-line-height", label='Line height', minimum=10, maximum=40, step=1)
+                gr.Slider(elem_id="--ae-input-border-size", label='Border size', minimum=0, maximum=4, step=1)
+                gr.Slider(elem_id="--ae-input-border-radius", label='Border radius', minimum=0, maximum=8, step=1)
+
+                gr.ColorPicker(elem_id="--ae-input-bg-color", label="Input background color")
+                gr.ColorPicker(elem_id="--ae-input-border-color", label="Input border color")
+                gr.ColorPicker(elem_id="--ae-input-text-color", label="Input text color")
+                gr.ColorPicker(elem_id="--ae-input-placeholder-color", label="Input placeholder color")
+
+                gr.ColorPicker(elem_id="--ae-label-color", label="Label color")
+                gr.ColorPicker(elem_id="--ae-secondary-label-color", label="Secondary label color")
+                
+                gr.ColorPicker(elem_id="--ae-input-hover-text-color", label="Input hover text color")
+                
+                
+
+            with gr.Accordion(label="Group", open=False):
+                gr.ColorPicker(elem_id="--ae-group-bg-color", label="Group background color")
+                gr.ColorPicker(elem_id="--ae-group-border-color", label="Group border color")
+                gr.Slider(elem_id="--ae-group-padding", label='Group padding', minimum=0, maximum=10, step=1)
+                gr.Slider(elem_id="--ae-group-radius", label='Group border radius', minimum=0, maximum=8, step=1)
+                gr.Slider(elem_id="--ae-group-border-size", label='Group border size', minimum=0, maximum=4, step=1)
+                gr.Slider(elem_id="--ae-group-gap", label='Group gap size', minimum=0, maximum=8, step=1)
+
+                          
+
+
+        def save_theme( vars_text, css_text, filename):           
+            style_data= ":root{" + vars_text + "}" + css_text          
+            with open(os.path.join(themes_folder, f"{filename}.css"), 'w', encoding="utf-8") as file:                
+                file.write(vars_text)
+                file.close()
+            with open(webui_style_path, 'w', encoding="utf-8") as file:                
+                file.write(style_data)
+                file.close()            
+            themes_dropdown.choices=get_files(themes_folder,[".css, .txt"])
+            return gr.update(choices=themes_dropdown.choices, value=f"{filename}.css")
+ 
+        def open_theme(filename, css_text):                           
+            with open(os.path.join(themes_folder, f"{filename}"), 'r') as file:
+                vars_text=file.read()
+            no_ext=filename.rsplit('.', 1)[0]
+            #save_theme( vars_text, css_text, no_ext)
+            # shared.state.interrupt()
+            # shared.state.need_restart = True
+            return [vars_text, no_ext]
+            
+        # def delete_theme(filename):
+            # try:
+                # os.remove(os.path.join(themes_folder, filename))
+            # except FileNotFoundError:
+                # pass
+
+        # delete_button.click(
+            # fn = lambda: delete_theme()
+        # )        
+        
+        save_button.click(
+            fn=save_theme,
+            inputs=[vars_text, css_text, save_as_filename],
+            outputs=themes_dropdown
+        )
+        
+        themes_dropdown.change(
+            fn=open_theme,
+            #_js = "applyTheme",
+            inputs=[themes_dropdown, css_text],
+            outputs=[vars_text, save_as_filename]
+        )
+        
+        # apply_button.click(
+            # fn=None,
+            # _js = "applyTheme"
+        # )
+        
+        # vars_text.change(
+            # fn=None,
+            # _js = "applyTheme",
+            # inputs=[],
+            # outputs=[vars_text, css_text]
+        # )
+        
+
+        
+
+    return (ui_theme, 'Theme', 'ui_theme'),
+
+
+
+script_callbacks.on_ui_tabs(on_ui_tabs)
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-theme-editor/style.css b/extensions-builtin/anapnoe-sd-theme-editor/style.css
new file mode 100644
index 00000000..3e19ab0d
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-theme-editor/style.css
@@ -0,0 +1,36 @@
+#theme_hidden,
+#setting_ui_header_tabs .theme,
+#setting_ui_hidden_tabs .theme {
+  display: none !important;
+}
+
+#tab_ui_theme [id*="color"] label {
+  display: flex;
+  align-items: center;
+  pointer-events: none;
+}
+#tab_ui_theme [id*="color"] label span {
+  min-width: 50% !important;
+}
+#tab_ui_theme [id*="color"] label input {
+  flex-grow: 1;
+  pointer-events: all;
+  cursor: pointer;
+}
+
+#settings_ui_theme > div > div {
+  flex-direction: row;
+  flex-wrap: wrap;
+}
+#settings_ui_theme > div > div > div {
+  max-width: 30%;
+}
+
+#tab_ui_theme > div {
+  padding: 16px !important;
+  padding-top: 0 !important;
+}
+
+#ui_theme_hsv + button {
+  min-width: unset;
+}
diff --git a/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_alpha.css b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_alpha.css
new file mode 100644
index 00000000..ebaf8380
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_alpha.css
@@ -0,0 +1 @@
+--ae-primary-color:hsl(205deg 83% 46%);--ae-secondary-color:hsl(325deg 83% 46%);--ae-main-bg-color:rgb(32 32 32);--ae-input-height:35px;--ae-input-slider-height:0.6;--ae-input-icon-height:calc(var(--ae-input-height) - var(--ae-input-border-size) * 2);--ae-input-padding:5px;--ae-input-font-size:14px;--ae-input-line-height:23px;--ae-label-color:rgba(255, 255, 255, 0.75);--ae-secondary-label-color:rgba(255, 255, 255, 0.5);--ae-input-border-size:2px;--ae-input-border-radius:0px;--ae-input-text-color:rgba(255, 255, 255, 0.75);--ae-input-placeholder-color:rgba(255, 255, 255, 0.35);--ae-input-bg-color:rgba(0, 0, 0, 0.25);--ae-input-border-color:rgba(0, 0, 0, 0.1);--ae-input-hover-text-color:rgba(255, 255, 255, 0.75);--ae-panel-bg-color:rgba(64, 64, 64, 0.5);--ae-panel-border-color:rgba(64, 64, 64, 0.75);--ae-panel-padding:5px;--ae-border-radius:5px;--ae-border-size:2px;--ae-gap-size-val:5px;--ae-gap-size:max(var(--ae-gap-size-val), var(--ae-border-size));--ae-border-size-neg:calc(var(--ae-border-size) * -1);--ae-border-size-x2:calc((var(--ae-border-size) * 2) + 0px);--ae-group-bg-color:hsl(0deg 0% 16%);--ae-group-padding:2px;--ae-group-radius:7px;--ae-group-border-size:2px;--ae-group-border-color:hsl(0deg 0% 16%);--ae-group-gap:6px;--ae-panel-border-radius:0px;--ae-subpanel-border-radius:8px;--ae-outside-gap-size:8px;--ae-inside-padding-size:8px;--ae-tool-button-size:34px;--ae-tool-button-radius:16px;--ae-generate-button-height:70px;--ae-max-padding:max(    var(--ae-outside-gap-size),    var(--ae-inside-padding-size)  );--ae-icon-size:22px;--ae-mobile-outside-gap-size:2px;--ae-mobile-inside-padding-size:2px;--panel-border-radius:4px;--subpanel-border-radius:8px;--outside-gap-size:8px;--inside-padding-size:8px;--tool-button-size:34px;--tool-button-radius:16px;--generate-button-height:70px;--max-padding:max(var(--outside-gap-size),var(--inside-padding-size));--icon-size:22px;--mobile-outside-gap-size:3px;--mobile-inside-padding-size:3px;
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_default.css b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_default.css
new file mode 100644
index 00000000..5ad1606b
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_default.css
@@ -0,0 +1 @@
+--ae-primary-color:hsl(168deg 97% 41%);--ae-secondary-color:hsl(225deg 6% 13%);--ae-main-bg-color:hsl(0deg 0% 10%);--ae-input-height:35px;--ae-input-slider-height:0.5;--ae-input-icon-height:calc(var(--ae-input-height) - var(--ae-input-border-size) * 2);--ae-input-padding:5px;--ae-input-font-size:12px;--ae-input-line-height:24px;--ae-label-color:hsl(216deg 5% 60%);--ae-secondary-label-color:hsl(216deg 5% 60%);--ae-input-border-size:0px;--ae-input-border-radius:0px;--ae-input-text-color:hsl(216deg 5% 60%);--ae-input-placeholder-color:hsl(168deg 97% 41%);--ae-input-bg-color:hsl(225deg 6% 13%);--ae-input-border-color:hsl(228deg 6% 17%);--ae-input-hover-text-color:hsl(225deg 6% 13%);--ae-panel-bg-color:hsl(225deg 5% 17%);--ae-panel-border-color:hsl(214deg 5% 30%);--ae-panel-padding:5px;--ae-border-radius:0px;--ae-border-size:1px;--ae-gap-size-val:5px;--ae-gap-size:max(var(--ae-gap-size-val), var(--ae-border-size));--ae-border-size-neg:calc(var(--ae-border-size) * -1);--ae-border-size-x2:calc((var(--ae-border-size) * 2) + 0px);--ae-group-bg-color:hsl(225deg 6% 13%);--ae-group-padding:2px;--ae-group-radius:0px;--ae-group-border-size:1px;--ae-group-border-color:hsl(225deg 6% 13%);--ae-group-gap:5px;--ae-panel-border-radius:0px;--ae-subpanel-border-radius:8px;--ae-outside-gap-size:8px;--ae-inside-padding-size:8px;--ae-tool-button-size:34px;--ae-tool-button-radius:16px;--ae-generate-button-height:70px;--ae-max-padding:max(    var(--ae-outside-gap-size),    var(--ae-inside-padding-size)  );--ae-icon-size:22px;--ae-mobile-outside-gap-size:2px;--ae-mobile-inside-padding-size:2px;--panel-border-radius:4px;--subpanel-border-radius:8px;--outside-gap-size:8px;--inside-padding-size:8px;--tool-button-size:34px;--tool-button-radius:16px;--generate-button-height:70px;--max-padding:max(var(--outside-gap-size),var(--inside-padding-size));--icon-size:22px;--mobile-outside-gap-size:3px;--mobile-inside-padding-size:3px;
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_light.css b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_light.css
new file mode 100644
index 00000000..d046467b
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_light.css
@@ -0,0 +1 @@
+--ae-primary-color:hsl(0deg 0% 0%);--ae-secondary-color:hsl(225deg 6% 13%);--ae-main-bg-color:hsl(0deg 0% 95%);--ae-input-height:28px;--ae-input-slider-height:0.5;--ae-input-icon-height:calc(var(--ae-input-height) - var(--ae-input-border-size) * 2);--ae-input-padding:5px;--ae-input-font-size:12px;--ae-input-line-height:16px;--ae-label-color:hsl(0deg 0% 15%);--ae-secondary-label-color:hsl(0deg 100% 50%);--ae-input-border-size:1px;--ae-input-border-radius:0px;--ae-input-text-color:hsl(0deg 0% 0%);--ae-input-placeholder-color:hsl(0deg 0% 89%);--ae-input-bg-color:hsl(0deg 100% 100%);--ae-input-border-color:hsl(0deg 0% 95%);--ae-input-hover-text-color:hsl(0deg 100% 100%);--ae-panel-bg-color:hsl(0deg 0% 98%);--ae-panel-border-color:hsl(0deg 0% 87%);--ae-panel-padding:5px;--ae-border-radius:5px;--ae-border-size:0px;--ae-gap-size-val:3px;--ae-gap-size:max(var(--ae-gap-size-val), var(--ae-border-size));--ae-border-size-neg:calc(var(--ae-border-size) * -1);--ae-border-size-x2:calc((var(--ae-border-size) * 2) + 0px);--ae-group-bg-color:hsl(0deg 0% 94%);--ae-group-padding:2px;--ae-group-radius:6px;--ae-group-border-size:0px;--ae-group-border-color:hsl(0deg 0% 94%);--ae-group-gap:2px;--ae-panel-border-radius:0px;--ae-subpanel-border-radius:8px;--ae-outside-gap-size:8px;--ae-inside-padding-size:8px;--ae-tool-button-size:34px;--ae-tool-button-radius:16px;--ae-generate-button-height:70px;--ae-max-padding:max(    var(--ae-outside-gap-size),    var(--ae-inside-padding-size)  );--ae-icon-size:22px;--ae-mobile-outside-gap-size:2px;--ae-mobile-inside-padding-size:2px;
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_minimal.css b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_minimal.css
new file mode 100644
index 00000000..04696bb0
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_minimal.css
@@ -0,0 +1 @@
+--ae-primary-color:hsl(168deg 96% 42%);--ae-secondary-color:hsl(225deg 6% 13%);--ae-main-bg-color:hsl(0deg 0% 8%);--ae-input-height:35px;--ae-input-slider-height:0.5;--ae-input-icon-height:calc(var(--ae-input-height) - var(--ae-input-border-size) * 2);--ae-input-padding:5px;--ae-input-font-size:14px;--ae-input-line-height:20px;--ae-label-color:hsl(0deg 0% 65%);--ae-secondary-label-color:hsl(0deg 100% 50%);--ae-input-border-size:2px;--ae-input-border-radius:5px;--ae-input-text-color:hsl(168deg 96% 42%);--ae-input-placeholder-color:hsl(168deg 96% 42%);--ae-input-bg-color:hsl(0deg 0% 10%);--ae-input-border-color:hsl(0deg 0% 10%);--ae-input-hover-text-color:hsl(240deg 18% 12%);--ae-panel-bg-color:hsl(0deg 0% 17%);--ae-panel-border-color:hsl(0deg 0% 17%);--ae-panel-padding:5px;--ae-border-radius:0px;--ae-border-size:2px;--ae-gap-size-val:6px;--ae-gap-size:max(var(--ae-gap-size-val), var(--ae-border-size));--ae-border-size-neg:calc(var(--ae-border-size) * -1);--ae-border-size-x2:calc((var(--ae-border-size) * 2) + 0px);--ae-group-bg-color:hsl(225deg 7% 11%);--ae-group-padding:0px;--ae-group-radius:0px;--ae-group-border-size:0px;--ae-group-border-color:hsl(240deg 16% 16%);--ae-group-gap:2px;--ae-panel-border-radius:4px;--ae-subpanel-border-radius:4px;--ae-outside-gap-size:1px;--ae-inside-padding-size:5px;--ae-tool-button-size:34px;--ae-tool-button-radius:16px;--ae-generate-button-height:70px;--ae-max-padding:max(var(--ae-outside-gap-size),var(--ae-inside-padding-size));--ae-icon-size:22px;--ae-mobile-outside-gap-size:3px;--ae-mobile-inside-padding-size:3px;--panel-border-radius:4px;--subpanel-border-radius:8px;--outside-gap-size:8px;--inside-padding-size:8px;--tool-button-size:34px;--tool-button-radius:16px;--generate-button-height:70px;--max-padding:max(var(--outside-gap-size),var(--inside-padding-size));--icon-size:22px;--mobile-outside-gap-size:3px;--mobile-inside-padding-size:3px;
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_minimal_orange.css b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_minimal_orange.css
new file mode 100644
index 00000000..7d84204c
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_minimal_orange.css
@@ -0,0 +1 @@
+--ae-primary-color:hsl(18deg 124% 42%);--ae-secondary-color:hsl(225deg 6% 13%);--ae-main-bg-color:hsl(210deg 28% 8%);--ae-input-height:35px;--ae-input-slider-height:0.5;--ae-input-icon-height:calc(var(--ae-input-height) - var(--ae-input-border-size) * 2);--ae-input-padding:5px;--ae-input-font-size:14px;--ae-input-line-height:20px;--ae-label-color:hsl(210deg 28% 65%);--ae-secondary-label-color:hsl(0deg 100% 50%);--ae-input-border-size:2px;--ae-input-border-radius:5px;--ae-input-text-color:hsl(18deg 100% 42%);--ae-input-placeholder-color:hsl(18deg 100% 42%);--ae-input-bg-color:hsl(210deg 28% 10%);--ae-input-border-color:hsl(210deg 28% 10%);--ae-input-hover-text-color:hsl(240deg 18% 12%);--ae-panel-bg-color:hsl(210deg 28% 17%);--ae-panel-border-color:hsl(210deg 28% 17%);--ae-panel-padding:5px;--ae-border-radius:0px;--ae-border-size:2px;--ae-gap-size-val:6px;--ae-gap-size:max(var(--ae-gap-size-val), var(--ae-border-size));--ae-border-size-neg:calc(var(--ae-border-size) * -1);--ae-border-size-x2:calc((var(--ae-border-size) * 2) + 0px);--ae-group-bg-color:hsl(225deg 7% 11%);--ae-group-padding:0px;--ae-group-radius:0px;--ae-group-border-size:0px;--ae-group-border-color:hsl(240deg 16% 16%);--ae-group-gap:2px;--ae-panel-border-radius:4px;--ae-subpanel-border-radius:4px;--ae-outside-gap-size:4px;--ae-inside-padding-size:4px;--ae-tool-button-size:34px;--ae-tool-button-radius:16px;--ae-generate-button-height:70px;--ae-max-padding:max(var(--ae-outside-gap-size),var(--ae-inside-padding-size));--ae-icon-size:22px;--ae-mobile-outside-gap-size:3px;--ae-mobile-inside-padding-size:3px;--panel-border-radius:4px;--subpanel-border-radius:8px;--outside-gap-size:8px;--inside-padding-size:8px;--tool-button-size:34px;--tool-button-radius:16px;--generate-button-height:70px;--max-padding:max(var(--outside-gap-size),var(--inside-padding-size));--icon-size:22px;--mobile-outside-gap-size:3px;--mobile-inside-padding-size:3px;
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_moonlight.css b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_moonlight.css
new file mode 100644
index 00000000..5bde3e5e
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_moonlight.css
@@ -0,0 +1 @@
+--ae-primary-color:hsl(222deg 75% 62%);--ae-secondary-color:hsl(225deg 6% 13%);--ae-main-bg-color:hsl(240deg 16% 6%);--ae-input-height:35px;--ae-input-slider-height:0.5;--ae-input-icon-height:calc(var(--ae-input-height) - var(--ae-input-border-size) * 2);--ae-input-padding:5px;--ae-input-font-size:14px;--ae-input-line-height:20px;--ae-label-color:hsl(185deg 66% 85%);--ae-secondary-label-color:hsl(0deg 100% 50%);--ae-input-border-size:2px;--ae-input-border-radius:5px;--ae-input-text-color:hsl(222deg 75% 62%);--ae-input-placeholder-color:hsl(222deg 75% 62%);--ae-input-bg-color:hsl(240deg 17% 8%);--ae-input-border-color:hsl(240deg 20% 16%);--ae-input-hover-text-color:hsl(240deg 18% 12%);--ae-panel-bg-color:hsl(240deg 18% 12%);--ae-panel-border-color:hsl(240deg 16% 16%);--ae-panel-padding:5px;--ae-border-radius:0px;--ae-border-size:2px;--ae-gap-size-val:6px;--ae-gap-size:max(var(--ae-gap-size-val), var(--ae-border-size));--ae-border-size-neg:calc(var(--ae-border-size) * -1);--ae-border-size-x2:calc((var(--ae-border-size) * 2) + 0px);--ae-group-bg-color:hsl(225deg 7% 11%);--ae-group-padding:0px;--ae-group-radius:0px;--ae-group-border-size:0px;--ae-group-border-color:hsl(240deg 16% 16%);--ae-group-gap:2px;--ae-panel-border-radius:0px;--ae-subpanel-border-radius:8px;--ae-outside-gap-size:8px;--ae-inside-padding-size:8px;--ae-tool-button-size:34px;--ae-tool-button-radius:16px;--ae-generate-button-height:70px;--ae-max-padding:max(var(--ae-outside-gap-size),var(--ae-inside-padding-size));--ae-icon-size:22px;--ae-mobile-outside-gap-size:2px;--ae-mobile-inside-padding-size:2px;
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_orange.css b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_orange.css
new file mode 100644
index 00000000..715c5624
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_orange.css
@@ -0,0 +1 @@
+--ae-primary-color:hsl(15deg 77% 58%);--ae-secondary-color:hsl(225deg 6% 13%);--ae-main-bg-color:hsl(0deg 0% 10%);--ae-input-height:28px;--ae-input-slider-height:0.5;--ae-input-icon-height:calc(var(--ae-input-height) - var(--ae-input-border-size) * 2);--ae-input-padding:5px;--ae-input-font-size:12px;--ae-input-line-height:16px;--ae-label-color:hsl(216deg 5% 60%);--ae-secondary-label-color:hsl(0deg 100% 50%);--ae-input-border-size:1px;--ae-input-border-radius:0px;--ae-input-text-color:hsl(15deg 77% 58%);--ae-input-placeholder-color:hsl(216deg 5% 60%);--ae-input-bg-color:hsl(225deg 6% 13%);--ae-input-border-color:hsl(228deg 6% 17%);--ae-input-hover-text-color:hsl(16deg 94% 93%);--ae-panel-bg-color:hsl(225deg 5% 17%);--ae-panel-border-color:hsl(214deg 5% 30%);--ae-panel-padding:5px;--ae-border-radius:5px;--ae-border-size:0px;--ae-gap-size-val:3px;--ae-gap-size:max(var(--ae-gap-size-val), var(--ae-border-size));--ae-border-size-neg:calc(var(--ae-border-size) * -1);--ae-border-size-x2:calc((var(--ae-border-size) * 2) + 0px);--ae-group-bg-color:hsl(225deg 6% 13%);--ae-group-padding:2px;--ae-group-radius:6px;--ae-group-border-size:0px;--ae-group-border-color:hsl(225deg 6% 13%);--ae-group-gap:2px;--ae-panel-border-radius:0px;--ae-subpanel-border-radius:8px;--ae-outside-gap-size:8px;--ae-inside-padding-size:8px;--ae-tool-button-size:34px;--ae-tool-button-radius:16px;--ae-generate-button-height:70px;--ae-max-padding:max(    var(--ae-outside-gap-size),    var(--ae-inside-padding-size)  );--ae-icon-size:22px;--ae-mobile-outside-gap-size:2px;--ae-mobile-inside-padding-size:2px;
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_quad.css b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_quad.css
new file mode 100644
index 00000000..97442448
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_quad.css
@@ -0,0 +1 @@
+--ae-primary-color:hsl(168deg 97% 41%);--ae-secondary-color:hsl(225deg 6% 13%);--ae-main-bg-color:hsl(0deg 0% 10%);--ae-input-height:35px;--ae-input-slider-height:0.5;--ae-input-icon-height:calc(var(--ae-input-height) - var(--ae-input-border-size) * 2);--ae-input-padding:5px;--ae-input-font-size:14px;--ae-input-line-height:23px;--ae-label-color:hsl(210deg 4% 80%);--ae-secondary-label-color:hsl(0deg 100% 50%);--ae-input-border-size:1px;--ae-input-border-radius:5px;--ae-input-text-color:hsl(168deg 97% 41%);--ae-input-placeholder-color:hsl(168deg 97% 41%);--ae-input-bg-color:hsl(225deg 6% 13%);--ae-input-border-color:hsl(210deg 6% 20%);--ae-input-hover-text-color:hsl(240deg 18% 12%);--ae-panel-bg-color:hsl(225deg 5% 17%);--ae-panel-border-color:hsl(220deg 5% 25%);--ae-panel-padding:5px;--ae-border-radius:0px;--ae-border-size:1px;--ae-gap-size-val:6px;--ae-gap-size:max(var(--ae-gap-size-val), var(--ae-border-size));--ae-border-size-neg:calc(var(--ae-border-size) * -1);--ae-border-size-x2:calc((var(--ae-border-size) * 2) + 0px);--ae-group-bg-color:hsl(225deg 7% 11%);--ae-group-padding:0px;--ae-group-radius:0px;--ae-group-border-size:0px;--ae-group-border-color:hsl(240deg 16% 16%);--ae-group-gap:1px;--ae-panel-border-radius:0px;--ae-subpanel-border-radius:8px;--ae-outside-gap-size:8px;--ae-inside-padding-size:8px;--ae-tool-button-size:34px;--ae-tool-button-radius:16px;--ae-generate-button-height:70px;--ae-max-padding:max(var(--ae-outside-gap-size),var(--ae-inside-padding-size));--ae-icon-size:22px;--ae-mobile-outside-gap-size:2px;--ae-mobile-inside-padding-size:2px;--panel-border-radius:4px;--subpanel-border-radius:8px;--outside-gap-size:8px;--inside-padding-size:8px;--tool-button-size:34px;--tool-button-radius:16px;--generate-button-height:70px;--max-padding:max(var(--outside-gap-size),var(--inside-padding-size));--icon-size:22px;--mobile-outside-gap-size:3px;--mobile-inside-padding-size:3px;
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_thick_group_green.css b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_thick_group_green.css
new file mode 100644
index 00000000..3deb6d32
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_thick_group_green.css
@@ -0,0 +1 @@
+--ae-primary-color:hsl(168deg 97% 41%);--ae-secondary-color:hsl(225deg 6% 13%);--ae-main-bg-color:hsl(0deg 0% 10%);--ae-input-height:35px;--ae-input-slider-height:0.5;--ae-input-icon-height:calc(var(--ae-input-height) - var(--ae-input-border-size) * 2);--ae-input-padding:5px;--ae-input-font-size:14px;--ae-input-line-height:20px;--ae-label-color:hsl(216deg 5% 60%);--ae-secondary-label-color:hsl(0deg 100% 50%);--ae-input-border-size:0px;--ae-input-border-radius:5px;--ae-input-text-color:hsl(168deg 97% 41%);--ae-input-placeholder-color:hsl(168deg 97% 41%);--ae-input-bg-color:hsl(225deg 6% 13%);--ae-input-border-color:hsl(228deg 6% 17%);--ae-input-hover-text-color:hsl(168deg 96% 80%);--ae-panel-bg-color:hsl(225deg 5% 17%);--ae-panel-border-color:hsl(210deg 6% 20%);--ae-panel-padding:5px;--ae-border-radius:5px;--ae-border-size:2px;--ae-gap-size-val:5px;--ae-gap-size:max(var(--ae-gap-size-val), var(--ae-border-size));--ae-border-size-neg:calc(var(--ae-border-size) * -1);--ae-border-size-x2:calc((var(--ae-border-size) * 2) + 0px);--ae-group-bg-color:hsl(225deg 6% 13%);--ae-group-padding:3px;--ae-group-radius:8px;--ae-group-border-size:1px;--ae-group-border-color:hsl(225deg 6% 13%);--ae-group-gap:5px;--ae-panel-border-radius:0px;--ae-subpanel-border-radius:8px;--ae-outside-gap-size:8px;--ae-inside-padding-size:8px;--ae-tool-button-size:34px;--ae-tool-button-radius:16px;--ae-generate-button-height:70px;--ae-max-padding:max(    var(--ae-outside-gap-size),    var(--ae-inside-padding-size)  );--ae-icon-size:22px;--ae-mobile-outside-gap-size:2px;--ae-mobile-inside-padding-size:2px;--panel-border-radius:4px;--subpanel-border-radius:8px;--outside-gap-size:8px;--inside-padding-size:8px;--tool-button-size:34px;--tool-button-radius:16px;--generate-button-height:70px;--max-padding:max(var(--outside-gap-size),var(--inside-padding-size));--icon-size:22px;--mobile-outside-gap-size:3px;--mobile-inside-padding-size:3px;
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_thin_cyan.css b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_thin_cyan.css
new file mode 100644
index 00000000..7de81f79
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_thin_cyan.css
@@ -0,0 +1 @@
+--ae-primary-color:hsl(190deg 75% 60%);--ae-secondary-color:hsl(225deg 6% 13%);--ae-main-bg-color:hsl(0deg 0% 10%);--ae-input-height:35px;--ae-input-slider-height:0.5;--ae-input-icon-height:calc(var(--ae-input-height) - var(--ae-input-border-size) * 2);--ae-input-padding:5px;--ae-input-font-size:12px;--ae-input-line-height:23px;--ae-label-color:hsl(216deg 5% 60%);--ae-secondary-label-color:hsl(0deg 100% 50%);--ae-input-border-size:1px;--ae-input-border-radius:0px;--ae-input-text-color:hsl(216deg 5% 60%);--ae-input-placeholder-color:hsl(190deg 75% 60%);--ae-input-bg-color:hsl(225deg 6% 13%);--ae-input-border-color:hsl(228deg 6% 17%);--ae-input-hover-text-color:hsl(225deg 6% 13%);--ae-panel-bg-color:hsl(225deg 5% 17%);--ae-panel-border-color:hsl(214deg 5% 30%);--ae-panel-padding:5px;--ae-border-radius:0px;--ae-border-size:1px;--ae-gap-size-val:5px;--ae-gap-size:max(var(--ae-gap-size-val), var(--ae-border-size));--ae-border-size-neg:calc(var(--ae-border-size) * -1);--ae-border-size-x2:calc((var(--ae-border-size) * 2) + 0px);--ae-group-bg-color:hsl(225deg 6% 13%);--ae-group-padding:2px;--ae-group-radius:0px;--ae-group-border-size:1px;--ae-group-border-color:hsl(225deg 6% 13%);--ae-group-gap:5px;--ae-panel-border-radius:0px;--ae-subpanel-border-radius:8px;--ae-outside-gap-size:8px;--ae-inside-padding-size:8px;--ae-tool-button-size:34px;--ae-tool-button-radius:16px;--ae-generate-button-height:70px;--ae-max-padding:max(    var(--ae-outside-gap-size),    var(--ae-inside-padding-size)  );--ae-icon-size:22px;--ae-mobile-outside-gap-size:2px;--ae-mobile-inside-padding-size:2px;--panel-border-radius:4px;--subpanel-border-radius:8px;--outside-gap-size:8px;--inside-padding-size:8px;--tool-button-size:34px;--tool-button-radius:16px;--generate-button-height:70px;--max-padding:max(var(--outside-gap-size),var(--inside-padding-size));--icon-size:22px;--mobile-outside-gap-size:3px;--mobile-inside-padding-size:3px;
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_tron2.css b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_tron2.css
new file mode 100644
index 00000000..b48ad837
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-theme-editor/themes/sdxl_tron2.css
@@ -0,0 +1 @@
+--ae-main-bg-color:hsl(185deg 75% 3%);--ae-primary-color:hsl(182deg 95% 51%);--ae-input-bg-color:hsl(184deg 89% 7%);--ae-input-border-color:hsl(185deg 72% 25%);--ae-panel-bg-color:hsl(185deg 73% 3%);--ae-panel-border-color:hsl(185deg 72% 25%);--ae-panel-border-radius:0px;--ae-subpanel-border-radius:0px;--ae-outside-gap-size:2px;--ae-inside-padding-size:8px;--ae-tool-button-size:34px;--ae-tool-button-radius:16px;--ae-generate-button-height:70px;--ae-max-padding:max(var(--ae-outside-gap-size),var(--ae-inside-padding-size));--ae-icon-size:22px;--ae-label-color:hsl(182deg 95% 75%);--ae-mobile-outside-gap-size:2px;--ae-mobile-inside-padding-size:8px;--ae-input-height:35px;--ae-input-slider-height:0.5;--ae-gap-size-val:1px;--ae-input-font-size:11px;--ae-input-line-height:23px;--ae-input-border-size:1px;--ae-input-border-radius:0px;--ae-input-padding:5px;--ae-panel-padding:5px;--ae-border-radius:0px;--ae-border-size:1px;--ae-group-padding:0px;--ae-group-radius:0px;--ae-group-border-size:0px;--ae-group-gap:1px;--ae-group-bg-color:hsl(185deg 73% 3%);--ae-group-border-color:hsl(185deg 73% 3%);--ae-secondary-color:hsl(225deg 6% 13%);--ae-input-text-color:hsl(168deg 75% 70%);--ae-input-placeholder-color:hsl(185deg 72% 25%);--ae-secondary-label-color:hsl(0deg 100% 50%);--ae-input-hover-text-color:hsl(182deg 94% 80%);
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/favicon.svg b/extensions-builtin/anapnoe-sd-uiux/html/favicon.svg
new file mode 100644
index 00000000..0cd7e9a2
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/favicon.svg
@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" >
+	<polygon fill="#ffffff"
+		points="19.5,13.7 21.6,9.9 11.8,9.9 16.7,18.5 17.7,16.7 17.1,15.7 16.7,16.5 13.5,10.9 19.9,10.9 18.9,12.7 	" />
+	<polygon fill="#ffffff"
+		points="17.3,11.7 15.8,11.7 20.2,19.3 3.8,19.3 12,5.2 14.2,9 15.8,9 12,2.5 1.5,20.7 22.5,20.7 	" />
+</svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/images/Guru_meditation.gif b/extensions-builtin/anapnoe-sd-uiux/html/images/Guru_meditation.gif
new file mode 100644
index 00000000..66e9dcd4
Binary files /dev/null and b/extensions-builtin/anapnoe-sd-uiux/html/images/Guru_meditation.gif differ
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/images/anapnoe-gradio-app-visual-builder.png b/extensions-builtin/anapnoe-sd-uiux/html/images/anapnoe-gradio-app-visual-builder.png
new file mode 100644
index 00000000..9b8ecb38
Binary files /dev/null and b/extensions-builtin/anapnoe-sd-uiux/html/images/anapnoe-gradio-app-visual-builder.png differ
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/images/anapnoe-ui-ux-orange.png b/extensions-builtin/anapnoe-sd-uiux/html/images/anapnoe-ui-ux-orange.png
new file mode 100644
index 00000000..7e447cdc
Binary files /dev/null and b/extensions-builtin/anapnoe-sd-uiux/html/images/anapnoe-ui-ux-orange.png differ
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/images/anapnoe-ui-ux.png b/extensions-builtin/anapnoe-sd-uiux/html/images/anapnoe-ui-ux.png
new file mode 100644
index 00000000..2875b064
Binary files /dev/null and b/extensions-builtin/anapnoe-sd-uiux/html/images/anapnoe-ui-ux.png differ
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/images/workspaces.png b/extensions-builtin/anapnoe-sd-uiux/html/images/workspaces.png
new file mode 100644
index 00000000..d60477c1
Binary files /dev/null and b/extensions-builtin/anapnoe-sd-uiux/html/images/workspaces.png differ
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/add-box-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/add-box-line.svg
new file mode 100644
index 00000000..dc56100a
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/add-box-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M4 3h16a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1zm1 2v14h14V5H5zm6 6V7h2v4h4v2h-4v4h-2v-4H7v-2h4z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/ai-generate.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/ai-generate.svg
new file mode 100644
index 00000000..0d5aa6f8
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/ai-generate.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M15 5.25C16.7949 5.25 18.25 3.79493 18.25 2H19.75C19.75 3.79493 21.2051 5.25 23 5.25V6.75C21.2051 6.75 19.75 8.20507 19.75 10H18.25C18.25 8.20507 16.7949 6.75 15 6.75V5.25ZM4 7C4 5.89543 4.89543 5 6 5H13V3H6C3.79086 3 2 4.79086 2 7V17C2 19.2091 3.79086 21 6 21H18C20.2091 21 22 19.2091 22 17V12H20V17C20 18.1046 19.1046 19 18 19H6C4.89543 19 4 18.1046 4 17V7Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-down-s-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-down-s-line.svg
new file mode 100644
index 00000000..6c073430
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-down-s-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M11.9997 13.1714L16.9495 8.22168L18.3637 9.63589L11.9997 15.9999L5.63574 9.63589L7.04996 8.22168L11.9997 13.1714Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-go-back-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-go-back-line.svg
new file mode 100644
index 00000000..f01c233d
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-go-back-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M5.828 7l2.536 2.536L6.95 10.95 2 6l4.95-4.95 1.414 1.414L5.828 5H13a8 8 0 1 1 0 16H4v-2h9a6 6 0 1 0 0-12H5.828z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-right-s-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-right-s-line.svg
new file mode 100644
index 00000000..48dcbb05
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-right-s-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13.1714 12.0007L8.22168 7.05093L9.63589 5.63672L15.9999 12.0007L9.63589 18.3646L8.22168 16.9504L13.1714 12.0007Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-right-up-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-right-up-line.svg
new file mode 100644
index 00000000..8dfe241a
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-right-up-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="var(--ae-primary-color)" stroke="var(--ae-primary-color)" d="M16.0037 9.41421L7.39712 18.0208L5.98291 16.6066L14.5895 8H7.00373V6H18.0037V17H16.0037V9.41421Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-up-circle-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-up-circle-fill.svg
new file mode 100644
index 00000000..53a9828e
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-up-circle-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2C17.52 2 22 6.48 22 12C22 17.52 17.52 22 12 22C6.48 22 2 17.52 2 12C2 6.48 6.48 2 12 2ZM13 12H16L12 8L8 12H11V16H13V12Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-up-circle-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-up-circle-line.svg
new file mode 100644
index 00000000..6e2876a7
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-up-circle-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2C17.52 2 22 6.48 22 12C22 17.52 17.52 22 12 22C6.48 22 2 17.52 2 12C2 6.48 6.48 2 12 2ZM12 20C16.42 20 20 16.42 20 12C20 7.58 16.42 4 12 4C7.58 4 4 7.58 4 12C4 16.42 7.58 20 12 20ZM13 12V16H11V12H8L12 8L16 12H13Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-up-down-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-up-down-line.svg
new file mode 100644
index 00000000..e4fee21b
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-up-down-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M11.9498 7.94975L10.5356 9.36396L8.00079 6.828L8.00004 20H6.00004L6.00079 6.828L3.46451 9.36396L2.05029 7.94975L7.00004 3L11.9498 7.94975ZM21.9498 16.0503L17 21L12.0503 16.0503L13.4645 14.636L16.0008 17.172L16 4H18L18.0008 17.172L20.5356 14.636L21.9498 16.0503Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-up-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-up-line.svg
new file mode 100644
index 00000000..da830a68
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-up-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12.9999 7.82843V20H10.9999V7.82843L5.63589 13.1924L4.22168 11.7782L11.9999 4L19.778 11.7782L18.3638 13.1924L12.9999 7.82843Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-up-s-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-up-s-line.svg
new file mode 100644
index 00000000..f5111cd3
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/arrow-up-s-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M11.9997 10.8284L7.04996 15.7782L5.63574 14.364L11.9997 8L18.3637 14.364L16.9495 15.7782L11.9997 10.8284Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/artboard-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/artboard-line.svg
new file mode 100644
index 00000000..6998c0c1
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/artboard-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M8.586 17H3v-2h18v2h-5.586l3.243 3.243-1.414 1.414L13 17.414V20h-2v-2.586l-4.243 4.243-1.414-1.414L8.586 17zM5 3h14a1 1 0 0 1 1 1v10H4V4a1 1 0 0 1 1-1zm1 2v7h12V5H6z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/aspect-ratio-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/aspect-ratio-line.svg
new file mode 100644
index 00000000..855f9938
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/aspect-ratio-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M21 3a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h18zm-1 2H4v14h16V5zm-7 12v-2h3v-3h2v5h-5zM11 7v2H8v3H6V7h5z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/ball-pen-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/ball-pen-line.svg
new file mode 100644
index 00000000..e464a517
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/ball-pen-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M17.849 11.808l-.707-.707-9.9 9.9H3v-4.243L14.313 5.444l5.657 5.657a1 1 0 0 1 0 1.414l-7.07 7.071-1.415-1.414 6.364-6.364zm-2.121-2.121l-1.415-1.414L5 17.586v1.415h1.414l9.314-9.314zm2.828-7.071l2.829 2.828a1 1 0 0 1 0 1.414L19.97 8.273 15.728 4.03l1.414-1.414a1 1 0 0 1 1.414 0z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/bard-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/bard-line.svg
new file mode 100644
index 00000000..7cd55f73
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/bard-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10.6144 17.7956C10.277 18.5682 9.20776 18.5682 8.8704 17.7956L7.99275 15.7854C7.21171 13.9966 5.80589 12.5726 4.0523 11.7942L1.63658 10.7219C.868536 10.381.868537 9.26368 1.63658 8.92276L3.97685 7.88394C5.77553 7.08552 7.20657 5.60881 7.97427 3.75892L8.8633 1.61673C9.19319.821767 10.2916.821765 10.6215 1.61673L11.5105 3.75894C12.2782 5.60881 13.7092 7.08552 15.5079 7.88394L17.8482 8.92276C18.6162 9.26368 18.6162 10.381 17.8482 10.7219L15.4325 11.7942C13.6789 12.5726 12.2731 13.9966 11.492 15.7854L10.6144 17.7956ZM4.53956 9.82234C6.8254 10.837 8.68402 12.5048 9.74238 14.7996 10.8008 12.5048 12.6594 10.837 14.9452 9.82234 12.6321 8.79557 10.7676 7.04647 9.74239 4.71088 8.71719 7.04648 6.85267 8.79557 4.53956 9.82234ZM19.4014 22.6899 19.6482 22.1242C20.0882 21.1156 20.8807 20.3125 21.8695 19.8732L22.6299 19.5353C23.0412 19.3526 23.0412 18.7549 22.6299 18.5722L21.9121 18.2532C20.8978 17.8026 20.0911 16.9698 19.6586 15.9269L19.4052 15.3156C19.2285 14.8896 18.6395 14.8896 18.4628 15.3156L18.2094 15.9269C17.777 16.9698 16.9703 17.8026 15.956 18.2532L15.2381 18.5722C14.8269 18.7549 14.8269 19.3526 15.2381 19.5353L15.9985 19.8732C16.9874 20.3125 17.7798 21.1156 18.2198 22.1242L18.4667 22.6899C18.6473 23.104 19.2207 23.104 19.4014 22.6899ZM18.3745 19.0469 18.937 18.4883 19.4878 19.0469 18.937 19.5898 18.3745 19.0469Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/bill-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/bill-line.svg
new file mode 100644
index 00000000..e9a7ba3a
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/bill-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20 22H4C3.44772 22 3 21.5523 3 21V3C3 2.44772 3.44772 2 4 2H20C20.5523 2 21 2.44772 21 3V21C21 21.5523 20.5523 22 20 22ZM19 20V4H5V20H19ZM8 9H16V11H8V9ZM8 13H16V15H8V13Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/bmc-logo2.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/bmc-logo2.svg
new file mode 100644
index 00000000..6766ec42
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/bmc-logo2.svg
@@ -0,0 +1,17 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/>
+  <path d="M0,0H24V24H0V0Z" style="fill: none;"/>
+  <path d="M22.15,3.78h-.02s-.04-.02-.04-.02c.02,.01,.03,.02,.05,.02h0Z" />
+  <path d="M22.39,5.5h-.02s.02,0,.02,0Z" />
+  <path d="M22.16,3.78s0,0,0,0c0,0,0,0,0,0,0,0,0,0,0,0h0Z" />
+  <path d="M22.15,3.78h0s0,0,0,0Z" />
+  <path d="M22.38,5.49l.03-.02h.01s0-.02,0-.02c-.02,0-.03,.02-.05,.03h0Z" />
+  <path d="M22.2,3.82l-.03-.03h-.02s.03,.02,.05,.03h0Z" />
+  <path d="M15.37,20.46s-.04,.02-.06,.04h.02s.03-.03,.04-.04Z" />
+  <path d="M19.34,19.68s-.01-.02,0,.07c0,0,0-.01,0-.02,0-.02,0-.03,0-.05Z" />
+  <path d="M18.93,20.46s-.04,.02-.06,.04h.02s.03-.03,.04-.04Z" />
+  <path d="M12.58,20.64s-.04-.02-.06-.03c.02,0,.03,.02,.05,.02h.01Z" />
+  <path d="M11.96,20.04s-.01-.05-.02-.07c0,.02,.02,.05,.02,.07h0Z" />
+  <path d="M8.78,5.44h.01s0,.02,0,.02c0,0-.02-.01-.02-.02h0Z" />
+  <path d="M12.53,11.16c-.79,.34-1.69,.72-2.85,.72-.49,0-.97-.07-1.44-.2l.8,8.25c.03,.34,.19,.67,.44,.9,.25,.23,.59,.36,.93,.36,0,0,1.14,.06,1.52,.06,.41,0,1.64-.06,1.64-.06,.35,0,.68-.13,.93-.36,.25-.23,.41-.56,.44-.9l.86-9.12c-.38-.13-.77-.22-1.21-.22-.76,0-1.37,.26-2.07,.56Z"/>
+  <path d="M19.53,6.88l-.12-.61c-.11-.55-.36-1.07-.92-1.26-.18-.06-.38-.09-.52-.22-.14-.13-.18-.33-.21-.52-.06-.35-.11-.69-.18-1.04-.05-.3-.09-.63-.23-.9-.18-.37-.55-.58-.91-.72-.19-.07-.38-.13-.57-.18-.92-.24-1.88-.33-2.82-.38-1.13-.06-2.26-.04-3.39,.06-.84,.08-1.72,.17-2.52,.46-.29,.11-.59,.23-.81,.46-.27,.28-.36,.7-.16,1.05,.14,.25,.38,.42,.63,.53,.33,.15,.68,.26,1.03,.34,.99,.22,2.01,.3,3.01,.34,1.12,.05,2.23,0,3.34-.11,.27-.03,.55-.07,.82-.11,.32-.05,.53-.47,.43-.76-.11-.35-.42-.49-.76-.43-.05,0-.1,.02-.15,.02h-.04c-.12,.02-.23,.03-.35,.05-.24,.03-.48,.05-.73,.06-.54,.04-1.09,.06-1.63,.06-.54,0-1.07-.02-1.61-.05-.24-.02-.49-.04-.73-.06-.11-.01-.22-.02-.33-.04h-.1s-.02-.02-.02-.02l-.11-.02c-.22-.03-.44-.07-.66-.12-.02,0-.04-.02-.06-.03-.01-.02-.02-.04-.02-.06s0-.04,.02-.06c.01-.02,.03-.03,.06-.03h0c.19-.04,.38-.08,.57-.11,.06-.01,.13-.02,.19-.03h0c.12,0,.24-.03,.36-.04,1.04-.11,2.09-.15,3.14-.11,.51,.01,1.02,.04,1.52,.1,.11,.01,.22,.02,.33,.04,.04,0,.08,.01,.12,.02h.08c.25,.05,.49,.09,.73,.15,.36,.08,.82,.1,.98,.5,.05,.12,.07,.26,.1,.39l.04,.17s0,0,0,0c.08,.39,.17,.79,.25,1.18,0,.03,0,.06,0,.09,0,.03-.02,.06-.03,.08-.02,.02-.04,.05-.06,.06-.03,.02-.05,.03-.08,.03h-.05s-.05,.01-.05,.01c-.16,.02-.32,.04-.49,.06-.32,.04-.64,.07-.96,.09-.64,.05-1.28,.09-1.92,.1-.33,0-.65,.01-.98,.01-1.3,0-2.6-.08-3.89-.23-.14-.02-.28-.03-.42-.05,.11,.01-.08-.01-.12-.02-.09-.01-.18-.03-.27-.04-.3-.04-.59-.1-.89-.15-.36-.06-.7-.03-1.03,.15-.27,.15-.48,.37-.62,.64-.14,.29-.18,.61-.24,.92-.06,.31-.16,.65-.12,.97,.08,.69,.56,1.25,1.26,1.38,.65,.12,1.31,.21,1.97,.3,2.59,.32,5.2,.35,7.8,.11,.21-.02,.42-.04,.63-.06,.07,0,.13,0,.19,.02,.06,.02,.12,.06,.17,.1,.05,.05,.08,.1,.11,.17,.02,.06,.03,.13,.02,.19l-.07,.64c-.13,1.29-.26,2.58-.4,3.87-.14,1.36-.28,2.71-.42,4.07-.04,.38-.08,.76-.12,1.14-.04,.38-.04,.76-.11,1.13-.11,.58-.51,.94-1.08,1.07-.53,.12-1.07,.18-1.61,.19-.6,0-1.2-.02-1.8-.02-.64,0-1.43-.06-1.92-.53-.43-.42-.49-1.08-.55-1.64-.08-.75-.16-1.5-.23-2.25l-.44-4.18-.28-2.7s0-.09-.01-.13c-.03-.32-.26-.64-.62-.62-.31,.01-.66,.28-.62,.62l.21,2,.43,4.14c.12,1.18,.25,2.35,.37,3.53,.02,.23,.05,.45,.07,.68,.14,1.23,1.08,1.9,2.24,2.08,.68,.11,1.38,.13,2.07,.14,.89,.01,1.78,.05,2.65-.11,1.29-.24,2.26-1.1,2.4-2.44,.04-.39,.08-.77,.12-1.16,.13-1.28,.26-2.55,.39-3.83l.43-4.17,.2-1.91c0-.09,.05-.18,.11-.25,.06-.07,.15-.12,.24-.14,.37-.07,.72-.19,.98-.48,.42-.45,.5-1.03,.35-1.62Zm-13.88,.41s0,.05,0,.07c0-.03,0-.06,0-.07Zm.04,.28s.01,0,.02,.02c-.01-.01-.02-.02-.02-.02h0Zm.04,.05s.02,.04,0,0h0Zm.07,.06h0s0,0,0,0c0,0,0,0,0,0h0Zm12.39-.09c-.13,.13-.33,.18-.53,.21-2.21,.33-4.46,.49-6.7,.42-1.6-.05-3.19-.23-4.77-.46-.16-.02-.32-.05-.43-.16-.2-.22-.1-.65-.05-.91,.05-.24,.14-.56,.42-.59,.44-.05,.96,.14,1.4,.2,.53,.08,1.06,.15,1.59,.19,2.27,.21,4.59,.17,6.85-.13,.41-.06,.82-.12,1.23-.19,.36-.07,.77-.19,.99,.19,.15,.26,.17,.6,.15,.89,0,.13-.06,.25-.15,.33h0Z"/>
+</svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/box-1-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/box-1-fill.svg
new file mode 100644
index 00000000..c1ce271a
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/box-1-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 1 21.5 6.5V17.5L13 22.4211V11.4234L3.49793 5.92225 12 1ZM2.5 7.6555V17.5L11 22.4211V12.5765L2.5 7.6555Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/box-1-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/box-1-line.svg
new file mode 100644
index 00000000..10ca0b68
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/box-1-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 1L21.5 6.5V17.5L12 23L2.5 17.5V6.5L12 1ZM5.49388 7.0777L13.0001 11.4234V20.11L19.5 16.3469V7.65311L12 3.311L5.49388 7.0777ZM4.5 8.81329V16.3469L11.0001 20.1101V12.5765L4.5 8.81329Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/box-2-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/box-2-fill.svg
new file mode 100644
index 00000000..017444ff
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/box-2-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 1L21.5 6.5V17.5L12 23L2.5 17.5V6.5L12 1ZM4.5 7.65788V16.3469L12 20.689V12L4.5 7.65788Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/box-2-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/box-2-line.svg
new file mode 100644
index 00000000..3e558a68
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/box-2-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 1L21.5 6.5V17.5L12 23L2.5 17.5V6.5L12 1ZM4.5 7.65311V7.65788L12 12V20.689L19.5 16.3469V7.65311L12 3.311L4.5 7.65311Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/box-3-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/box-3-fill.svg
new file mode 100644
index 00000000..2812f7f7
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/box-3-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.5021 5.92225 12 1 3.49793 5.92225 12 10.8445 20.5021 5.92225ZM2.5 7.6555V17.5L11 22.4211V12.5765L2.5 7.6555ZM13 22.4211 21.5 17.5V7.6555L13 12.5765V22.4211Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/box-3-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/box-3-line.svg
new file mode 100644
index 00000000..34fef19d
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/box-3-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 1L21.5 6.5V17.5L12 23L2.5 17.5V6.5L12 1ZM5.49388 7.0777L12.0001 10.8444L18.5062 7.07774L12 3.311L5.49388 7.0777ZM4.5 8.81329V16.3469L11.0001 20.1101V12.5765L4.5 8.81329ZM13.0001 20.11L19.5 16.3469V8.81337L13.0001 12.5765V20.11Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/boxing-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/boxing-line.svg
new file mode 100644
index 00000000..d60a815b
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/boxing-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M16.5 2C19.5376 2 22 4.46243 22 7.5V10C22 10.8881 21.6141 11.686 21.0009 12.2353L21 17C21 18.3059 20.1656 19.4169 19.0009 19.829L19 21C19 21.5523 18.5523 22 18 22H6C5.44772 22 5 21.5523 5 21L5.00009 19.8293C3.83485 19.4175 3 18.3063 3 17V6C3 3.79086 4.79086 2 7 2H16.5ZM9.5 11H5V17C5 17.5128 5.38604 17.9355 5.88338 17.9933L6 18H18C18.5128 18 18.9355 17.614 18.9933 17.1166L19 17V13L12.9644 13.0009C12.7214 14.6966 11.2629 16 9.5 16H6V14H9.5C10.2797 14 10.9204 13.4051 10.9931 12.6445L11 12.5C11 11.7203 10.4051 11.0796 9.64446 11.0069L9.5 11ZM16.5 4H7C5.94564 4 5.08183 4.81588 5.00549 5.85074L5 6V9H9.5C10.8962 9 12.1014 9.81751 12.6632 11H19C19.5128 11 19.9355 10.614 19.9933 10.1166L20 10V7.5C20 5.63144 18.5357 4.10487 16.692 4.00518L16.5 4Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/brush-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/brush-line.svg
new file mode 100644
index 00000000..6f8a957d
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/brush-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M15.456 9.678l-.142-.142a5.475 5.475 0 0 0-2.39-1.349c-2.907-.778-5.699.869-6.492 3.83-.043.16-.066.34-.104.791-.154 1.87-.594 3.265-1.8 4.68 2.26.888 4.938 1.514 6.974 1.514a5.505 5.505 0 0 0 5.31-4.078 5.497 5.497 0 0 0-1.356-5.246zM13.29 6.216l4.939-3.841a1 1 0 0 1 1.32.082l2.995 2.994a1 1 0 0 1 .082 1.321l-3.84 4.938a7.505 7.505 0 0 1-7.283 9.292C8 21.002 3.5 19.5 1 18c3.98-3 3.047-4.81 3.5-6.5 1.058-3.95 4.842-6.257 8.789-5.284zm3.413 1.879c.065.063.13.128.193.194l1.135 1.134 2.475-3.182-1.746-1.746-3.182 2.475 1.125 1.125z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/bug-2-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/bug-2-line.svg
new file mode 100644
index 00000000..350993d6
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/bug-2-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10.5621 4.14773C11.0262 4.05083 11.5071 3.99989 12 3.99989C12.4929 3.99989 12.9738 4.05083 13.4379 4.14773L15.1213 2.46436L16.5355 3.87857L15.4859 4.92822C16.7177 5.63698 17.7135 6.70984 18.3264 7.99989H21V9.99989H18.9291C18.9758 10.3265 19 10.6604 19 10.9999V11.9999H21V13.9999H19V14.9999C19 15.3394 18.9758 15.6733 18.9291 15.9999H21V17.9999H18.3264C17.2029 20.3648 14.7924 21.9999 12 21.9999C9.2076 21.9999 6.7971 20.3648 5.67363 17.9999H3V15.9999H5.07089C5.02417 15.6733 5 15.3394 5 14.9999V13.9999H3V11.9999H5V10.9999C5 10.6604 5.02417 10.3265 5.07089 9.99989H3V7.99989H5.67363C6.28647 6.70984 7.28227 5.63698 8.51412 4.92822L7.46447 3.87857L8.87868 2.46436L10.5621 4.14773ZM12 5.99989C9.23858 5.99989 7 8.23847 7 10.9999V14.9999C7 17.7613 9.23858 19.9999 12 19.9999C14.7614 19.9999 17 17.7613 17 14.9999V10.9999C17 8.23847 14.7614 5.99989 12 5.99989ZM9 13.9999H15V15.9999H9V13.9999ZM9 9.99989H15V11.9999H9V9.99989Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/camera-lens-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/camera-lens-line.svg
new file mode 100644
index 00000000..5adb9298
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/camera-lens-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9.85802 19.71L12 16H5.07026C6.10692 17.7921 7.8188 19.1447 9.85802 19.71ZM4.25204 14H8.5359L5.07103 7.99867C4.38987 9.17566 4 10.5423 4 12C4 12.6906 4.08751 13.3608 4.25204 14ZM6.39496 6.29179L8.5359 10L12 4C9.8171 4 7.8384 4.87429 6.39496 6.29179ZM14.142 4.28998L12 8H18.9297C17.8931 6.20791 16.1812 4.85529 14.142 4.28998ZM19.748 10H15.4641L18.929 16.0013C19.6101 14.8243 20 13.4577 20 12C20 11.3094 19.9125 10.6392 19.748 10ZM17.605 17.7082L15.4641 14L12 20C14.1829 20 16.1616 19.1257 17.605 17.7082ZM12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM13.1547 10H10.8453L9.6906 12L10.8453 14H13.1547L14.3094 12L13.1547 10Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/checkbox-blank-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/checkbox-blank-line.svg
new file mode 100644
index 00000000..d6c2aa6d
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/checkbox-blank-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M4 3h16a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1zm1 2v14h14V5H5z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/checkbox-indeterminate-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/checkbox-indeterminate-line.svg
new file mode 100644
index 00000000..b4c69c05
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/checkbox-indeterminate-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M4 3h16a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1zm1 2v14h14V5H5zm2 6h10v2H7v-2z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/checkbox-multiple-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/checkbox-multiple-line.svg
new file mode 100644
index 00000000..2c23848c
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/checkbox-multiple-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M6.99979 7V3C6.99979 2.44772 7.4475 2 7.99979 2H20.9998C21.5521 2 21.9998 2.44772 21.9998 3V16C21.9998 16.5523 21.5521 17 20.9998 17H17V20.9925C17 21.5489 16.551 22 15.9925 22H3.00728C2.45086 22 2 21.5511 2 20.9925L2.00276 8.00748C2.00288 7.45107 2.4518 7 3.01025 7H6.99979ZM8.99979 7H15.9927C16.549 7 17 7.44892 17 8.00748V15H19.9998V4H8.99979V7ZM15 9H4.00255L4.00021 20H15V9ZM8.50242 18L4.96689 14.4645L6.3811 13.0503L8.50242 15.1716L12.7451 10.9289L14.1593 12.3431L8.50242 18Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/clipboard-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/clipboard-line.svg
new file mode 100644
index 00000000..9ee97314
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/clipboard-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M7 4V2h10v2h3.007c.548 0 .993.445.993.993v16.014a.994.994 0 0 1-.993.993H3.993A.994.994 0 0 1 3 21.007V4.993C3 4.445 3.445 4 3.993 4H7zm0 2H5v14h14V6h-2v2H7V6zm2-2v2h6V4H9z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/close-circle-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/close-circle-line.svg
new file mode 100644
index 00000000..90477e5f
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/close-circle-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16zm0-9.414l2.828-2.829 1.415 1.415L13.414 12l2.829 2.828-1.415 1.415L12 13.414l-2.828 2.829-1.415-1.415L10.586 12 7.757 9.172l1.415-1.415L12 10.586z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/close-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/close-line.svg
new file mode 100644
index 00000000..e39564d9
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/close-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 10.586l4.95-4.95 1.414 1.414-4.95 4.95 4.95 4.95-1.414 1.414-4.95-4.95-4.95 4.95-1.414-1.414 4.95-4.95-4.95-4.95L7.05 5.636z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/compass-4-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/compass-4-line.svg
new file mode 100644
index 00000000..7d894275
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/compass-4-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16zm3.446-10.032l-5.478 5.478a4.02 4.02 0 0 1-1.414-1.414l5.478-5.478a4.02 4.02 0 0 1 1.414 1.414z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/computer-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/computer-fill.svg
new file mode 100644
index 00000000..ea728890
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/computer-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M13 18v2h4v2H7v-2h4v-2H2.992A.998.998 0 0 1 2 16.993V4.007C2 3.451 2.455 3 2.992 3h18.016c.548 0 .992.449.992 1.007v12.986c0 .556-.455 1.007-.992 1.007H13z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/contract-left-right-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/contract-left-right-line.svg
new file mode 100644
index 00000000..dfeb9607
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/contract-left-right-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M18.7933 5.79297 12.5862 12.0001 18.7933 18.2072 20.2075 16.793 15.4146 12.0001 20.2075 7.20718 18.7933 5.79297ZM5.20718 18.2073 11.4143 12.0002 5.20718 5.79312 3.79297 7.20733 8.58586 12.0002 3.79297 16.7931 5.20718 18.2073Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/contract-up-down-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/contract-up-down-line.svg
new file mode 100644
index 00000000..c52aaf32
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/contract-up-down-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M5.79297 5.20718 12.0001 11.4143 18.2072 5.20718 16.793 3.79297 12.0001 8.58586 7.20718 3.79297 5.79297 5.20718ZM18.2073 18.7928 12.0002 12.5857 5.79312 18.7928 7.20733 20.207 12.0002 15.4141 16.7931 20.207 18.2073 18.7928Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/contrast-drop-2-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/contrast-drop-2-line.svg
new file mode 100644
index 00000000..abd8f3ea
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/contrast-drop-2-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 3.1L7.05 8.05a7 7 0 1 0 9.9 0L12 3.1zm0-2.828l6.364 6.364a9 9 0 1 1-12.728 0L12 .272zM7 13h10a5 5 0 0 1-10 0z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/corner-up-right-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/corner-up-right-fill.svg
new file mode 100644
index 00000000..55510a95
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/corner-up-right-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M5.00014 10.0003L5 19.0001L7 19.0002L7.00011 12.0003L14.5862 12.0002V17.4144L21.0004 11.0001L14.5862 4.58594L14.5862 10.0002L5.00014 10.0003Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/corner-up-right-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/corner-up-right-line.svg
new file mode 100644
index 00000000..e561b5b7
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/corner-up-right-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M5.00014 10.0003L5 19.0002L7 19.0002L7.00011 12.0003L17.1719 12.0002L13.2222 15.9499L14.6364 17.3642L21.0004 11.0002L14.6364 4.63623L13.2222 6.05044L17.172 10.0002L5.00014 10.0003Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/cpu-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/cpu-fill.svg
new file mode 100644
index 00000000..fe016773
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/cpu-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M14 20h-4v2H8v-2H5a1 1 0 0 1-1-1v-3H2v-2h2v-4H2V8h2V5a1 1 0 0 1 1-1h3V2h2v2h4V2h2v2h3a1 1 0 0 1 1 1v3h2v2h-2v4h2v2h-2v3a1 1 0 0 1-1 1h-3v2h-2v-2zM7 7v4h4V7H7z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/cpu-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/cpu-line.svg
new file mode 100644
index 00000000..7d4922a1
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/cpu-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M6 18h12V6H6v12zm8 2h-4v2H8v-2H5a1 1 0 0 1-1-1v-3H2v-2h2v-4H2V8h2V5a1 1 0 0 1 1-1h3V2h2v2h4V2h2v2h3a1 1 0 0 1 1 1v3h2v2h-2v4h2v2h-2v3a1 1 0 0 1-1 1h-3v2h-2v-2zM8 8h8v8H8V8z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/crop-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/crop-line.svg
new file mode 100644
index 00000000..d0fef9b6
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/crop-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M15 17V19H6C5.44772 19 5 18.5523 5 18V7H2V5H5V2H7V17H15ZM17 22V7H9V5H18C18.5523 5 19 5.44772 19 6V17H22V19H19V22H17Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/delete-bin-2-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/delete-bin-2-line.svg
new file mode 100644
index 00000000..a6781f5a
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/delete-bin-2-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M17 6h5v2h-2v13a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V8H2V6h5V3a1 1 0 0 1 1-1h8a1 1 0 0 1 1 1v3zm1 2H6v12h12V8zm-4.586 6l1.768 1.768-1.414 1.414L12 15.414l-1.768 1.768-1.414-1.414L10.586 14l-1.768-1.768 1.414-1.414L12 12.586l1.768-1.768 1.414 1.414L13.414 14zM9 4v2h6V4H9z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/delete-bin-5-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/delete-bin-5-line.svg
new file mode 100644
index 00000000..f0da62ec
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/delete-bin-5-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M4 8h16v13a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V8zm2 2v10h12V10H6zm3 2h2v6H9v-6zm4 0h2v6h-2v-6zM7 5V3a1 1 0 0 1 1-1h8a1 1 0 0 1 1 1v2h5v2H2V5h5zm2-1v1h6V4H9z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/dice-1.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/dice-1.svg
new file mode 100644
index 00000000..ece3905d
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/dice-1.svg
@@ -0,0 +1,15 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100% 100%" width="24" height="24">
+	<path d="M20.2,5.4l-6.6-4c-0.9-0.6-2.2-0.6-3.1,0l-6.6,4C2.9,6,2.3,7,2.3,8V16c0,1.1,0.6,2.1,1.5,2.6l6.6,4c0.5,0.3,1,0.4,1.6,0.4
+		c0.6,0,1.1-0.1,1.6-0.4l6.6-4c0.9-0.5,1.5-1.5,1.5-2.6V8C21.7,7,21.1,6,20.2,5.4z M11.3,21.1l-6.6-4C4.2,16.9,4,16.5,4,16V8
+		c0,0,0,0,0,0l7.4,4.4L11.3,21.1C11.3,21.2,11.3,21.2,11.3,21.1z M12.7,2.9l6.6,4c0,0,0,0,0,0L12,11.3L4.6,6.9c0,0,0,0,0,0l6.6-4
+		C11.7,2.6,12.3,2.6,12.7,2.9z M12.7,21.2v-8.7L20,8c0,0,0,0,0,0V16c0,0.5-0.3,0.9-0.7,1.2L12.7,21.2C12.7,21.2,12.7,21.2,12.7,21.2
+		z"/>
+	<path d="M9.8,12.6c-0.5-0.3-0.8-0.1-0.8,0.4c0,0.5,0.4,1,0.8,1.3c0.5,0.3,0.8,0.1,0.8-0.4C10.6,13.4,10.2,12.8,9.8,12.6z"/>
+	<path d="M5.1,14.7c-0.5-0.3-0.8-0.1-0.8,0.4c0,0.5,0.4,1,0.8,1.3C5.6,16.6,6,16.4,6,16C6,15.5,5.6,14.9,5.1,14.7z"/>
+	<path d="M7.4,13.6C7,13.4,6.6,13.5,6.6,14c0,0.5,0.4,1,0.8,1.3c0.5,0.3,0.8,0.1,0.8-0.4C8.3,14.4,7.9,13.9,7.4,13.6z"/>
+	<path d="M18.7,11.7c0.5-0.3,0.8-0.8,0.8-1.3c0-0.5-0.4-0.6-0.8-0.4c-0.5,0.3-0.8,0.8-0.8,1.3C17.9,11.8,18.2,11.9,18.7,11.7z"/>
+	<path d="M14,12.6c-0.5,0.3-0.8,0.8-0.8,1.3c0,0.5,0.4,0.6,0.8,0.4c0.5-0.3,0.8-0.8,0.8-1.3C14.9,12.5,14.5,12.3,14,12.6z"/>
+	<path d="M18.7,14.7c-0.5,0.3-0.8,0.8-0.8,1.3c0,0.5,0.4,0.6,0.8,0.4c0.5-0.3,0.8-0.8,0.8-1.3C19.5,14.6,19.2,14.4,18.7,14.7z"/>
+	<path d="M14,17.2c-0.5,0.3-0.8,0.8-0.8,1.3c0,0.5,0.4,0.6,0.8,0.4c0.5-0.3,0.8-0.8,0.8-1.3C14.9,17.1,14.5,17,14,17.2z"/>
+	<path d="M10.8,7.5c0.6,0.5,1.7,0.5,2.4,0c0.7-0.5,0.7-1.2,0-1.7c-0.6-0.5-1.7-0.5-2.4,0C10.1,6.3,10.1,7.1,10.8,7.5z"/>
+</svg>
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/download-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/download-line.svg
new file mode 100644
index 00000000..1d40a4fd
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/download-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M3 19h18v2H3v-2zm10-5.828L19.071 7.1l1.414 1.414L12 17 3.515 8.515 4.929 7.1 11 13.17V2h2v11.172z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/draft-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/draft-line.svg
new file mode 100644
index 00000000..f12c2b29
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/draft-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20 2C20.5523 2 21 2.44772 21 3V6.757L19 8.757V4H5V20H19V17.242L21 15.242V21C21 21.5523 20.5523 22 20 22H4C3.44772 22 3 21.5523 3 21V3C3 2.44772 3.44772 2 4 2H20ZM21.7782 8.80761L23.1924 10.2218L15.4142 18L13.9979 17.9979L14 16.5858L21.7782 8.80761ZM13 12V14H8V12H13ZM16 8V10H8V8H16Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/drag-drop-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/drag-drop-line.svg
new file mode 100644
index 00000000..d6d78a5b
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/drag-drop-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M16 13l6.964 4.062-2.973.85 2.125 3.681-1.732 1-2.125-3.68-2.223 2.15L16 13zm-2-7h2v2h5a1 1 0 0 1 1 1v4h-2v-3H10v10h4v2H9a1 1 0 0 1-1-1v-5H6v-2h2V9a1 1 0 0 1 1-1h5V6zM4 14v2H2v-2h2zm0-4v2H2v-2h2zm0-4v2H2V6h2zm0-4v2H2V2h2zm4 0v2H6V2h2zm4 0v2h-2V2h2zm4 0v2h-2V2h2z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/drag-move-2-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/drag-move-2-fill.svg
new file mode 100644
index 00000000..80637b0e
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/drag-move-2-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M18 11V8l4 4-4 4v-3h-5v5h3l-4 4-4-4h3v-5H6v3l-4-4 4-4v3h5V6H8l4-4 4 4h-3v5z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/drop-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/drop-line.svg
new file mode 100644
index 00000000..b39581ae
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/drop-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 3.09698L7.05025 8.04673C4.31658 10.7804 4.31658 15.2126 7.05025 17.9462C9.78392 20.6799 14.2161 20.6799 16.9497 17.9462C19.6834 15.2126 19.6834 10.7804 16.9497 8.04673L12 3.09698ZM12 0.268555L18.364 6.63252C21.8787 10.1472 21.8787 15.8457 18.364 19.3604C14.8492 22.8752 9.15076 22.8752 5.63604 19.3604C2.12132 15.8457 2.12132 10.1472 5.63604 6.63252L12 0.268555Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/dvd-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/dvd-line.svg
new file mode 100644
index 00000000..8fbf4cd5
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/dvd-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM13 11H16L11 18V13H8L13 6V11Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/edit-box-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/edit-box-line.svg
new file mode 100644
index 00000000..c2cf8237
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/edit-box-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M16.7574 2.99666L14.7574 4.99666H5V18.9967H19V9.2393L21 7.2393V19.9967C21 20.5489 20.5523 20.9967 20 20.9967H4C3.44772 20.9967 3 20.5489 3 19.9967V3.99666C3 3.44438 3.44772 2.99666 4 2.99666H16.7574ZM20.4853 2.09717L21.8995 3.51138L12.7071 12.7038L11.2954 12.7062L11.2929 11.2896L20.4853 2.09717Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/edit-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/edit-line.svg
new file mode 100644
index 00000000..a92e54f3
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/edit-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M6.41421 15.89L16.5563 5.74786L15.1421 4.33365L5 14.4758V15.89H6.41421ZM7.24264 17.89H3V13.6474L14.435 2.21233C14.8256 1.8218 15.4587 1.8218 15.8492 2.21233L18.6777 5.04075C19.0682 5.43128 19.0682 6.06444 18.6777 6.45497L7.24264 17.89ZM3 19.89H21V21.89H3V19.89Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/emotion-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/emotion-line.svg
new file mode 100644
index 00000000..9c90cdc6
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/emotion-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM8 13H16C16 15.2091 14.2091 17 12 17C9.79086 17 8 15.2091 8 13ZM8 11C7.17157 11 6.5 10.3284 6.5 9.5C6.5 8.67157 7.17157 8 8 8C8.82843 8 9.5 8.67157 9.5 9.5C9.5 10.3284 8.82843 11 8 11ZM16 11C15.1716 11 14.5 10.3284 14.5 9.5C14.5 8.67157 15.1716 8 16 8C16.8284 8 17.5 8.67157 17.5 9.5C17.5 10.3284 16.8284 11 16 11Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/equalizer-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/equalizer-fill.svg
new file mode 100644
index 00000000..c7e0da6a
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/equalizer-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M6.17071 18C6.58254 16.8348 7.69378 16 9 16C10.3062 16 11.4175 16.8348 11.8293 18H22V20H11.8293C11.4175 21.1652 10.3062 22 9 22C7.69378 22 6.58254 21.1652 6.17071 20H2V18H6.17071ZM12.1707 11C12.5825 9.83481 13.6938 9 15 9C16.3062 9 17.4175 9.83481 17.8293 11H22V13H17.8293C17.4175 14.1652 16.3062 15 15 15C13.6938 15 12.5825 14.1652 12.1707 13H2V11H12.1707ZM6.17071 4C6.58254 2.83481 7.69378 2 9 2C10.3062 2 11.4175 2.83481 11.8293 4H22V6H11.8293C11.4175 7.16519 10.3062 8 9 8C7.69378 8 6.58254 7.16519 6.17071 6H2V4H6.17071Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/equalizer-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/equalizer-line.svg
new file mode 100644
index 00000000..be81d936
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/equalizer-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M6.17071 18C6.58254 16.8348 7.69378 16 9 16C10.3062 16 11.4175 16.8348 11.8293 18H22V20H11.8293C11.4175 21.1652 10.3062 22 9 22C7.69378 22 6.58254 21.1652 6.17071 20H2V18H6.17071ZM12.1707 11C12.5825 9.83481 13.6938 9 15 9C16.3062 9 17.4175 9.83481 17.8293 11H22V13H17.8293C17.4175 14.1652 16.3062 15 15 15C13.6938 15 12.5825 14.1652 12.1707 13H2V11H12.1707ZM6.17071 4C6.58254 2.83481 7.69378 2 9 2C10.3062 2 11.4175 2.83481 11.8293 4H22V6H11.8293C11.4175 7.16519 10.3062 8 9 8C7.69378 8 6.58254 7.16519 6.17071 6H2V4H6.17071ZM9 6C9.55228 6 10 5.55228 10 5C10 4.44772 9.55228 4 9 4C8.44772 4 8 4.44772 8 5C8 5.55228 8.44772 6 9 6ZM15 13C15.5523 13 16 12.5523 16 12C16 11.4477 15.5523 11 15 11C14.4477 11 14 11.4477 14 12C14 12.5523 14.4477 13 15 13ZM9 20C9.55228 20 10 19.5523 10 19C10 18.4477 9.55228 18 9 18C8.44772 18 8 18.4477 8 19C8 19.5523 8.44772 20 9 20Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/file-download-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/file-download-line.svg
new file mode 100644
index 00000000..935f2ebe
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/file-download-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M13 12h3l-4 4-4-4h3V8h2v4zm2-8H5v16h14V8h-4V4zM3 2.992C3 2.444 3.447 2 3.999 2H16l5 5v13.993A1 1 0 0 1 20.007 22H3.993A1 1 0 0 1 3 21.008V2.992z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/file-edit-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/file-edit-fill.svg
new file mode 100644
index 00000000..dc3ef11a
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/file-edit-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21 15.2426V21.0082C21 21.556 20.5551 22 20.0066 22H3.9934C3.44476 22 3 21.5511 3 20.9925V9H9C9.55228 9 10 8.55228 10 8V2H20.0017C20.5531 2 21 2.45531 21 2.9918V6.75736L12.0012 15.7562L11.995 19.995L16.2414 20.0012L21 15.2426ZM21.7782 8.80761L23.1924 10.2218L15.4142 18L13.9979 17.9979L14 16.5858L21.7782 8.80761ZM3 7L8 2.00318V7H3Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/file-info-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/file-info-fill.svg
new file mode 100644
index 00000000..c0ea9a09
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/file-info-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M16 2L21 7V21.0082C21 21.556 20.5551 22 20.0066 22H3.9934C3.44476 22 3 21.5447 3 21.0082V2.9918C3 2.44405 3.44495 2 3.9934 2H16ZM11 7V9H13V7H11ZM11 11V17H13V11H11Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/file-info-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/file-info-line.svg
new file mode 100644
index 00000000..d64ca293
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/file-info-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M15 4H5V20H19V8H15V4ZM3 2.9918C3 2.44405 3.44749 2 3.9985 2H16L20.9997 7L21 20.9925C21 21.5489 20.5551 22 20.0066 22H3.9934C3.44476 22 3 21.5447 3 21.0082V2.9918ZM11 11H13V17H11V11ZM11 7H13V9H11V7Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/file-zip-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/file-zip-line.svg
new file mode 100644
index 00000000..e5f83060
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/file-zip-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M20 22H4a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h16a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1zm-1-2V4H5v16h14zm-5-8v5h-4v-3h2v-2h2zm-2-8h2v2h-2V4zm-2 2h2v2h-2V6zm2 2h2v2h-2V8zm-2 2h2v2h-2v-2z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/flashlight-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/flashlight-line.svg
new file mode 100644
index 00000000..fe131573
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/flashlight-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13 9H21L11 24V15H4L13 0V9ZM11 11V7.22063L7.53238 13H13V17.3944L17.263 11H11Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/focus-2-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/focus-2-fill.svg
new file mode 100644
index 00000000..f873ad32
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/focus-2-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2C17.52 2 22 6.48 22 12C22 17.52 17.52 22 12 22C6.48 22 2 17.52 2 12C2 6.48 6.48 2 12 2ZM12 20C16.4267 20 20 16.4267 20 12C20 7.57333 16.4267 4 12 4C7.57333 4 4 7.57333 4 12C4 16.4267 7.57333 20 12 20ZM12 18C8.68 18 6 15.32 6 12C6 8.68 8.68 6 12 6C15.32 6 18 8.68 18 12C18 15.32 15.32 18 12 18ZM12 10C10.9 10 10 10.9 10 12C10 13.1 10.9 14 12 14C13.1 14 14 13.1 14 12C14 10.9 13.1 10 12 10Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/focus-2-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/focus-2-line.svg
new file mode 100644
index 00000000..84c537b4
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/focus-2-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 16C14.2091 16 16 14.2091 16 12C16 9.79086 14.2091 8 12 8C9.79086 8 8 9.79086 8 12C8 14.2091 9.79086 16 12 16ZM12 18C8.68629 18 6 15.3137 6 12C6 8.68629 8.68629 6 12 6C15.3137 6 18 8.68629 18 12C18 15.3137 15.3137 18 12 18ZM12 14C10.8954 14 10 13.1046 10 12C10 10.8954 10.8954 10 12 10C13.1046 10 14 10.8954 14 12C14 13.1046 13.1046 14 12 14Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/focus-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/focus-line.svg
new file mode 100644
index 00000000..b5819e89
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/focus-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 14C10.8954 14 10 13.1046 10 12C10 10.8954 10.8954 10 12 10C13.1046 10 14 10.8954 14 12C14 13.1046 13.1046 14 12 14Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/folder-open-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/folder-open-line.svg
new file mode 100644
index 00000000..94ef19f1
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/folder-open-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M3 21a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h7.414l2 2H20a1 1 0 0 1 1 1v3h-2V7h-7.414l-2-2H4v11.998L5.5 11h17l-2.31 9.243a1 1 0 0 1-.97.757H3zm16.938-8H7.062l-1.5 6h12.876l1.5-6z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/fullscreen-exit-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/fullscreen-exit-line.svg
new file mode 100644
index 00000000..d3482777
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/fullscreen-exit-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/fullscreen-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/fullscreen-line.svg
new file mode 100644
index 00000000..573526cb
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/fullscreen-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M20 3h2v6h-2V5h-4V3h4zM4 3h4v2H4v4H2V3h2zm16 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/github-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/github-fill.svg
new file mode 100644
index 00000000..206c5517
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/github-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 2C6.475 2 2 6.475 2 12a9.994 9.994 0 0 0 6.838 9.488c.5.087.687-.213.687-.476 0-.237-.013-1.024-.013-1.862-2.512.463-3.162-.612-3.362-1.175-.113-.288-.6-1.175-1.025-1.413-.35-.187-.85-.65-.013-.662.788-.013 1.35.725 1.538 1.025.9 1.512 2.338 1.087 2.912.825.088-.65.35-1.087.638-1.337-2.225-.25-4.55-1.113-4.55-4.938 0-1.088.387-1.987 1.025-2.688-.1-.25-.45-1.275.1-2.65 0 0 .837-.262 2.75 1.026a9.28 9.28 0 0 1 2.5-.338c.85 0 1.7.112 2.5.337 1.912-1.3 2.75-1.024 2.75-1.024.55 1.375.2 2.4.1 2.65.637.7 1.025 1.587 1.025 2.687 0 3.838-2.337 4.688-4.562 4.938.362.312.675.912.675 1.85 0 1.337-.013 2.412-.013 2.75 0 .262.188.574.688.474A10.016 10.016 0 0 0 22 12c0-5.525-4.475-10-10-10z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/github-fill.xml b/extensions-builtin/anapnoe-sd-uiux/html/svg/github-fill.xml
new file mode 100644
index 00000000..8fe0e919
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/github-fill.xml
@@ -0,0 +1,2 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 2C6.475 2 2 6.475 2 12a9.994 9.994 0 0 0 6.838 9.488c.5.087.687-.213.687-.476 0-.237-.013-1.024-.013-1.862-2.512.463-3.162-.612-3.362-1.175-.113-.288-.6-1.175-1.025-1.413-.35-.187-.85-.65-.013-.662.788-.013 1.35.725 1.538 1.025.9 1.512 2.338 1.087 2.912.825.088-.65.35-1.087.638-1.337-2.225-.25-4.55-1.113-4.55-4.938 0-1.088.387-1.987 1.025-2.688-.1-.25-.45-1.275.1-2.65 0 0 .837-.262 2.75 1.026a9.28 9.28 0 0 1 2.5-.338c.85 0 1.7.112 2.5.337 1.912-1.3 2.75-1.024 2.75-1.024.55 1.375.2 2.4.1 2.65.637.7 1.025 1.587 1.025 2.687 0 3.838-2.337 4.688-4.562 4.938.362.312.675.912.675 1.85 0 1.337-.013 2.412-.013 2.75 0 .262.188.574.688.474A10.016 10.016 0 0 0 22 12c0-5.525-4.475-10-10-10z"/></svg>
+		
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/gradio-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/gradio-fill.svg
new file mode 100644
index 00000000..c03c6b86
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/gradio-fill.svg
@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
+  <path d="M0,0H24V24H0V0Z" style="fill: none;"/>
+  <path d="M21.14,10.92h0s0-2.91,0-2.91L12.04,3.02v2.91l6.45,3.54-1.95,1.07-4.5-2.47v2.91l1.85,1.01-1.88,1.03-1.85-1.02,1.89-1.03v-2.93l-4.56,2.49-1.94-1.06,6.5-3.55V3L2.86,8.01h0s0,0,0,0v2.93l1.94,1.06-1.94,1.06h0s0,0,0,0v2.93l9.14,5.01,9.14-5.01v-.02h0s0-2.91,0-2.91l-1.94-1.06,1.93-1.06v-.02Zm-2.65,3.6l-6.49,3.56-6.46-3.54,1.94-1.06,4.53,2.48h0s4.55-2.5,4.55-2.5l1.93,1.06Z"/>
+</svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/gradio-fill.xml b/extensions-builtin/anapnoe-sd-uiux/html/svg/gradio-fill.xml
new file mode 100644
index 00000000..6ea1d1d8
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/gradio-fill.xml
@@ -0,0 +1,2 @@
+		<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path d="M0,0H24V24H0V0Z" style="fill: none;"/><path d="M21.14,10.92h0s0-2.91,0-2.91L12.04,3.02v2.91l6.45,3.54-1.95,1.07-4.5-2.47v2.91l1.85,1.01-1.88,1.03-1.85-1.02,1.89-1.03v-2.93l-4.56,2.49-1.94-1.06,6.5-3.55V3L2.86,8.01h0s0,0,0,0v2.93l1.94,1.06-1.94,1.06h0s0,0,0,0v2.93l9.14,5.01,9.14-5.01v-.02h0s0-2.91,0-2.91l-1.94-1.06,1.93-1.06v-.02Zm-2.65,3.6l-6.49,3.56-6.46-3.54,1.94-1.06,4.53,2.48h0s4.55-2.5,4.55-2.5l1.93,1.06Z"/></svg>
+		
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/grid-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/grid-fill.svg
new file mode 100644
index 00000000..fef4a086
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/grid-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M14 10v4h-4v-4h4zm2 0h5v4h-5v-4zm-2 11h-4v-5h4v5zm2 0v-5h5v4a1 1 0 0 1-1 1h-4zM14 3v5h-4V3h4zm2 0h4a1 1 0 0 1 1 1v4h-5V3zm-8 7v4H3v-4h5zm0 11H4a1 1 0 0 1-1-1v-4h5v5zM8 3v5H3V4a1 1 0 0 1 1-1h4z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/grid-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/grid-line.svg
new file mode 100644
index 00000000..0050582b
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/grid-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M14 10h-4v4h4v-4zm2 0v4h3v-4h-3zm-2 9v-3h-4v3h4zm2 0h3v-3h-3v3zM14 5h-4v3h4V5zm2 0v3h3V5h-3zm-8 5H5v4h3v-4zm0 9v-3H5v3h3zM8 5H5v3h3V5zM4 3h16a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/group-2-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/group-2-line.svg
new file mode 100644
index 00000000..de5a2c3e
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/group-2-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9.55 11.5C8.30736 11.5 7.3 10.4926 7.3 9.25C7.3 8.00736 8.30736 7 9.55 7C10.7926 7 11.8 8.00736 11.8 9.25C11.8 10.4926 10.7926 11.5 9.55 11.5ZM10 19.748V16.4C10 15.9116 10.1442 15.4627 10.4041 15.0624C10.1087 15.0213 9.80681 15 9.5 15C7.93201 15 6.49369 15.5552 5.37091 16.4797C6.44909 18.0721 8.08593 19.2553 10 19.748ZM4.45286 14.66C5.86432 13.6168 7.61013 13 9.5 13C10.5435 13 11.5431 13.188 12.4667 13.5321C13.3447 13.1888 14.3924 13 15.5 13C17.1597 13 18.6849 13.4239 19.706 14.1563C19.8976 13.4703 20 12.7471 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 12.9325 4.15956 13.8278 4.45286 14.66ZM18.8794 16.0859C18.4862 15.5526 17.1708 15 15.5 15C13.4939 15 12 15.7967 12 16.4V20C14.9255 20 17.4843 18.4296 18.8794 16.0859ZM12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM15.5 12.5C14.3954 12.5 13.5 11.6046 13.5 10.5C13.5 9.39543 14.3954 8.5 15.5 8.5C16.6046 8.5 17.5 9.39543 17.5 10.5C17.5 11.6046 16.6046 12.5 15.5 12.5Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/heart-add-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/heart-add-fill.svg
new file mode 100644
index 00000000..8d7234bf
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/heart-add-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0H24V24H0z"/><path d="M19 14v3h3v2h-3v3h-2v-3h-3v-2h3v-3h2zm1.243-9.243c2.16 2.166 2.329 5.557.507 7.91C19.926 12.24 18.99 12 18 12c-3.314 0-6 2.686-6 6 0 1.009.249 1.96.689 2.794l-.69.691-8.478-8.492c-2.104-2.356-2.025-5.974.236-8.236 2.265-2.264 5.888-2.34 8.244-.228 2.349-2.109 5.979-2.039 8.242.228z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/heart-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/heart-fill.svg
new file mode 100644
index 00000000..91e44eea
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/heart-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0H24V24H0z"/><path d="M12.001 4.529c2.349-2.109 5.979-2.039 8.242.228 2.262 2.268 2.34 5.88.236 8.236l-8.48 8.492-8.478-8.492c-2.104-2.356-2.025-5.974.236-8.236 2.265-2.264 5.888-2.34 8.244-.228z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/heart-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/heart-line.svg
new file mode 100644
index 00000000..8591aeaf
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/heart-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0H24V24H0z"/><path d="M12.001 4.529c2.349-2.109 5.979-2.039 8.242.228 2.262 2.268 2.34 5.88.236 8.236l-8.48 8.492-8.478-8.492c-2.104-2.356-2.025-5.974.236-8.236 2.265-2.264 5.888-2.34 8.244-.228zm6.826 1.641c-1.5-1.502-3.92-1.563-5.49-.153l-1.335 1.198-1.336-1.197c-1.575-1.412-3.99-1.35-5.494.154-1.49 1.49-1.565 3.875-.192 5.451L12 18.654l7.02-7.03c1.374-1.577 1.299-3.959-.193-5.454z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/image-2-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/image-2-line.svg
new file mode 100644
index 00000000..2f665340
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/image-2-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M5 11.1005L7 9.1005L12.5 14.6005L16 11.1005L19 14.1005V5H5V11.1005ZM5 13.9289V19H8.1005L11.0858 16.0147L7 11.9289L5 13.9289ZM10.9289 19H19V16.9289L16 13.9289L10.9289 19ZM4 3H20C20.5523 3 21 3.44772 21 4V20C21 20.5523 20.5523 21 20 21H4C3.44772 21 3 20.5523 3 20V4C3 3.44772 3.44772 3 4 3ZM15.5 10C14.6716 10 14 9.32843 14 8.5C14 7.67157 14.6716 7 15.5 7C16.3284 7 17 7.67157 17 8.5C17 9.32843 16.3284 10 15.5 10Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/image-add-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/image-add-line.svg
new file mode 100644
index 00000000..12c227bb
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/image-add-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21 15V18H24V20H21V23H19V20H16V18H19V15H21ZM21.0082 3C21.556 3 22 3.44495 22 3.9934V13H20V5H4V18.999L14 9L17 12V14.829L14 11.8284L6.827 19H14V21H2.9918C2.44405 21 2 20.5551 2 20.0066V3.9934C2 3.44476 2.45531 3 2.9918 3H21.0082ZM8 7C9.10457 7 10 7.89543 10 9C10 10.1046 9.10457 11 8 11C6.89543 11 6 10.1046 6 9C6 7.89543 6.89543 7 8 7Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/image-edit-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/image-edit-line.svg
new file mode 100644
index 00000000..b5601596
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/image-edit-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20 3C20.5523 3 21 3.44772 21 4V5.757L19 7.757V5H5V13.1L9 9.1005L13.328 13.429L11.9132 14.8422L9 11.9289L5 15.928V19H15.533L16.2414 19.0012L17.57 17.671L18.8995 19H19V16.242L21 14.242V20C21 20.5523 20.5523 21 20 21H4C3.45 21 3 20.55 3 20V4C3 3.44772 3.44772 3 4 3H20ZM21.7782 7.80761L23.1924 9.22183L15.4142 17L13.9979 16.9979L14 15.5858L21.7782 7.80761ZM15.5 7C16.3284 7 17 7.67157 17 8.5C17 9.32843 16.3284 10 15.5 10C14.6716 10 14 9.32843 14 8.5C14 7.67157 14.6716 7 15.5 7Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/image-icon.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/image-icon.svg
new file mode 100644
index 00000000..42b648af
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/image-icon.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="feather feather-image"><rect x="3" y="3" width="18" height="18" rx="2" ry="2"></rect><circle cx="8.5" cy="8.5" r="1.5"></circle><polyline points="21 15 16 10 5 21"></polyline></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/image-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/image-line.svg
new file mode 100644
index 00000000..7b1d5e24
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/image-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M2.9918 21C2.44405 21 2 20.5551 2 20.0066V3.9934C2 3.44476 2.45531 3 2.9918 3H21.0082C21.556 3 22 3.44495 22 3.9934V20.0066C22 20.5552 21.5447 21 21.0082 21H2.9918ZM20 15V5H4V19L14 9L20 15ZM20 17.8284L14 11.8284L6.82843 19H20V17.8284ZM8 11C6.89543 11 6 10.1046 6 9C6 7.89543 6.89543 7 8 7C9.10457 7 10 7.89543 10 9C10 10.1046 9.10457 11 8 11Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/image-update.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/image-update.svg
new file mode 100644
index 00000000..3abf12df
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/image-update.svg
@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+  <filter id='shadow' color-interpolation-filters="sRGB">
+    <feDropShadow flood-color="black" dx="0" dy="0" flood-opacity="0.9" stdDeviation="0.5"/>
+    <feDropShadow flood-color="black" dx="0" dy="0" flood-opacity="0.9" stdDeviation="0.5"/>
+  </filter>
+  <path style="filter:url(#shadow);" fill="#FFFFFF" d="M13.18 19C13.35 19.72 13.64 20.39 14.03 21H5C3.9 21 3 20.11 3 19V5C3 3.9 3.9 3 5 3H19C20.11 3 21 3.9 21 5V11.18C20.5 11.07 20 11 19.5 11C19.33 11 19.17 11 19 11.03V5H5V19H13.18M11.21 15.83L9.25 13.47L6.5 17H13.03C13.14 15.54 13.73 14.22 14.64 13.19L13.96 12.29L11.21 15.83M19 13.5V12L16.75 14.25L19 16.5V15C20.38 15 21.5 16.12 21.5 17.5C21.5 17.9 21.41 18.28 21.24 18.62L22.33 19.71C22.75 19.08 23 18.32 23 17.5C23 15.29 21.21 13.5 19 13.5M19 20C17.62 20 16.5 18.88 16.5 17.5C16.5 17.1 16.59 16.72 16.76 16.38L15.67 15.29C15.25 15.92 15 16.68 15 17.5C15 19.71 16.79 21.5 19 21.5V23L21.25 20.75L19 18.5V20Z" />
+</svg>
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/infinity-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/infinity-fill.svg
new file mode 100644
index 00000000..7204f234
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/infinity-fill.svg
@@ -0,0 +1,14 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/>
+<g>
+	<path d="M21.8,7.2c0-0.2,0-0.5,0-0.7c-0.2-1.7-1.8-3.1-3.5-3c-0.4,0-0.7,0.2-0.9,0.4c-0.2,0.2-0.3,0.6-0.2,0.9
+		c0.1,0.5,0.5,0.8,1.1,0.9c0.9,0.1,1.4,0.6,1.4,1.5c0,3.2,0,6.4,0,9.6c0,1-0.6,1.5-1.5,1.5c-2,0-3.9,0-5.9,0l0,0
+		c0.2-0.2,0.4-0.4,0.6-0.6c0.4-0.5,0.4-1.1,0-1.6c-0.4-0.4-1.1-0.4-1.5,0c-0.8,0.8-1.7,1.7-2.5,2.5c-0.4,0.4-0.4,1.1,0,1.5
+		c0.8,0.8,1.7,1.7,2.5,2.5c0.2,0.2,0.5,0.3,0.8,0.3c0.3,0,0.5-0.1,0.7-0.3c0.4-0.4,0.5-1.1,0-1.6c-0.2-0.2-0.4-0.4-0.6-0.6l5.8,0
+		c0.3,0,0.5,0,0.8,0c1.8-0.3,3-1.8,3-3.7C21.8,13.6,21.8,10.4,21.8,7.2z"/>
+	<path d="M5.8,18.3c-0.9-0.1-1.4-0.6-1.4-1.5c0-3.2,0-6.5,0-9.7c0-0.9,0.6-1.5,1.5-1.5c1.8,0,3.6,0,5.5,0h0.4l-0.5,0.5
+		c-0.3,0.3-0.4,0.6-0.4,0.9c0,0.3,0.1,0.5,0.3,0.8c0.5,0.5,1.1,0.4,1.6-0.1c0.8-0.8,1.5-1.5,2.3-2.3c0.5-0.5,0.5-1.2,0-1.7l-1.9-1.9
+		c-0.2-0.2-0.3-0.3-0.5-0.5c-0.5-0.4-1.1-0.4-1.5,0c-0.4,0.4-0.5,1.1,0,1.5c0.1,0.1,0.1,0.1,0.3,0.3l0.4,0.4l-1.3,0
+		c-1.6,0-3.2,0-4.8,0C3.8,3.5,2.3,5,2.3,6.9c0,0.5,0,0.9,0,1.4l0,0.5l0,2.4c0,2,0,4,0,6c0,1.8,1.6,3.4,3.5,3.4c0,0,0,0,0,0
+		c0.6,0,1.1-0.4,1.2-1C6.9,18.9,6.5,18.4,5.8,18.3z"/>
+</g>
+</svg>
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/information-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/information-fill.svg
new file mode 100644
index 00000000..39111d4d
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/information-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm-1-11v6h2v-6h-2zm0-4v2h2V7h-2z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/information-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/information-line.svg
new file mode 100644
index 00000000..0983ccf9
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/information-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16zM11 7h2v2h-2V7zm0 4h2v6h-2v-6z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/install-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/install-line.svg
new file mode 100644
index 00000000..ef9c67a7
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/install-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9 2V4H5L4.999 14H18.999L19 4H15V2H20C20.5523 2 21 2.44772 21 3V21C21 21.5523 20.5523 22 20 22H4C3.44772 22 3 21.5523 3 21V3C3 2.44772 3.44772 2 4 2H9ZM18.999 16H4.999L5 20H19L18.999 16ZM17 17V19H15V17H17ZM13 2V7H16L12 11L8 7H11V2H13Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/landscape-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/landscape-line.svg
new file mode 100644
index 00000000..69231da2
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/landscape-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M11.27 12.216L15 6l8 15H2L9 8l2.27 4.216zm1.12 2.022L14.987 19h4.68l-4.77-8.942-2.507 4.18zM5.348 19h7.304L9 12.219 5.348 19zM5.5 8a2.5 2.5 0 1 1 0-5 2.5 2.5 0 0 1 0 5z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/layout-2-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/layout-2-line.svg
new file mode 100644
index 00000000..7afdae1f
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/layout-2-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21 20C21 20.5523 20.5523 21 20 21H4C3.44772 21 3 20.5523 3 20V4C3 3.44772 3.44772 3 4 3H20C20.5523 3 21 3.44772 21 4V20ZM11 5H5V19H11V5ZM19 13H13V19H19V13ZM19 5H13V11H19V5Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/layout-grid-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/layout-grid-line.svg
new file mode 100644
index 00000000..8cb42b03
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/layout-grid-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21 3C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H21ZM11 13H4V19H11V13ZM20 13H13V19H20V13ZM11 5H4V11H11V5ZM20 5H13V11H20V5Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/list-settings-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/list-settings-line.svg
new file mode 100644
index 00000000..b4cad125
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/list-settings-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M2 18H9V20H2V18ZM2 11H11V13H2V11ZM2 4H22V6H2V4ZM20.674 13.0251L21.8301 12.634L22.8301 14.366L21.914 15.1711C21.9704 15.4386 22 15.7158 22 16C22 16.2842 21.9704 16.5614 21.914 16.8289L22.8301 17.634L21.8301 19.366L20.674 18.9749C20.2635 19.3441 19.7763 19.6295 19.2391 19.8044L19 21H17L16.7609 19.8044C16.2237 19.6295 15.7365 19.3441 15.326 18.9749L14.1699 19.366L13.1699 17.634L14.086 16.8289C14.0296 16.5614 14 16.2842 14 16C14 15.7158 14.0296 15.4386 14.086 15.1711L13.1699 14.366L14.1699 12.634L15.326 13.0251C15.7365 12.6559 16.2237 12.3705 16.7609 12.1956L17 11H19L19.2391 12.1956C19.7763 12.3705 20.2635 12.6559 20.674 13.0251ZM18 18C19.1046 18 20 17.1046 20 16C20 14.8954 19.1046 14 18 14C16.8954 14 16 14.8954 16 16C16 17.1046 16.8954 18 18 18Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/loop-right-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/loop-right-line.svg
new file mode 100644
index 00000000..1267be06
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/loop-right-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 4C14.7486 4 17.1749 5.38626 18.6156 7.5H16V9.5H22V3.5H20V5.99936C18.1762 3.57166 15.2724 2 12 2C6.47715 2 2 6.47715 2 12H4C4 7.58172 7.58172 4 12 4ZM20 12C20 16.4183 16.4183 20 12 20C9.25144 20 6.82508 18.6137 5.38443 16.5H8V14.5H2V20.5H4V18.0006C5.82381 20.4283 8.72764 22 12 22C17.5228 22 22 17.5228 22 12H20Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/magic-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/magic-line.svg
new file mode 100644
index 00000000..70442fa7
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/magic-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M15.199 9.945a2.6 2.6 0 0 1-.79-1.551l-.403-3.083-2.73 1.486a2.6 2.6 0 0 1-1.72.273L6.5 6.5l.57 3.056a2.6 2.6 0 0 1-.273 1.72l-1.486 2.73 3.083.403a2.6 2.6 0 0 1 1.55.79l2.138 2.257 1.336-2.807a2.6 2.6 0 0 1 1.23-1.231l2.808-1.336-2.257-2.137zm.025 5.563l-2.213 4.65a.6.6 0 0 1-.977.155l-3.542-3.739a.6.6 0 0 0-.357-.182l-5.107-.668a.6.6 0 0 1-.449-.881l2.462-4.524a.6.6 0 0 0 .062-.396L4.16 4.86a.6.6 0 0 1 .7-.7l5.063.943a.6.6 0 0 0 .396-.062l4.524-2.462a.6.6 0 0 1 .881.45l.668 5.106a.6.6 0 0 0 .182.357l3.739 3.542a.6.6 0 0 1-.155.977l-4.65 2.213a.6.6 0 0 0-.284.284zm.797 1.927l1.414-1.414 4.243 4.242-1.415 1.415-4.242-4.243z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/markup-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/markup-line.svg
new file mode 100644
index 00000000..49b7ab78
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/markup-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10 10.4966L11.0385 6.86192C11.1902 6.33088 11.7437 6.02339 12.2747 6.17511C12.6069 6.27003 12.8666 6.52971 12.9615 6.86192L14 10.4966V11.9966H14.7192C15.1781 11.9966 15.5781 12.3089 15.6894 12.754L17.051 18.2007C18.8507 16.7338 20 14.4994 20 11.9966C20 7.5783 16.4183 3.99658 12 3.99658C7.58172 3.99658 4 7.5783 4 11.9966C4 14.4994 5.14932 16.7338 6.94897 18.2007L8.31063 12.754C8.42193 12.3089 8.82191 11.9966 9.28078 11.9966H10V10.4966ZM12 19.9966C12.2415 19.9966 12.4813 19.9859 12.7189 19.9648C13.6187 19.8846 14.4756 19.6555 15.2649 19.3022L13.9384 13.9966H10.0616L8.73514 19.3022C9.52438 19.6555 10.3813 19.8846 11.2811 19.9647C11.5187 19.9859 11.7585 19.9966 12 19.9966ZM12 21.9966C6.47715 21.9966 2 17.5194 2 11.9966C2 6.47373 6.47715 1.99658 12 1.99658C17.5228 1.99658 22 6.47373 22 11.9966C22 17.5194 17.5228 21.9966 12 21.9966Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/menu-4-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/menu-4-fill.svg
new file mode 100644
index 00000000..5d06e79b
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/menu-4-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M16 18v2H5v-2h11zm5-7v2H3v-2h18zm-2-7v2H8V4h11z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/menu-add-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/menu-add-fill.svg
new file mode 100644
index 00000000..21ee2c54
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/menu-add-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M18 15l-.001 3H21v2h-3.001L18 23h-2l-.001-3H13v-2h2.999L16 15h2zm-7 3v2H3v-2h8zm10-7v2H3v-2h18zm0-7v2H3V4h18z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/menu-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/menu-line.svg
new file mode 100644
index 00000000..dfdfea1f
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/menu-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M3 4h18v2H3V4zm0 7h18v2H3v-2zm0 7h18v2H3v-2z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/menu-search-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/menu-search-line.svg
new file mode 100644
index 00000000..59d56f45
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/menu-search-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M15.5 5C13.567 5 12 6.567 12 8.5C12 10.433 13.567 12 15.5 12C17.433 12 19 10.433 19 8.5C19 6.567 17.433 5 15.5 5ZM10 8.5C10 5.46243 12.4624 3 15.5 3C18.5376 3 21 5.46243 21 8.5C21 9.6575 20.6424 10.7315 20.0317 11.6175L22.7071 14.2929L21.2929 15.7071L18.6175 13.0317C17.7315 13.6424 16.6575 14 15.5 14C12.4624 14 10 11.5376 10 8.5ZM3 4H8V6H3V4ZM3 11H8V13H3V11ZM21 18V20H3V18H21Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/meteor-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/meteor-line.svg
new file mode 100644
index 00000000..fac2b8c5
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/meteor-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21 1V13C21 17.9706 16.9706 22 12 22C7.02944 22 3 17.9706 3 13C3 9.72064 4.75393 6.85093 7.37488 5.27777L14 1.453V4.223L21 1ZM19 4.122L12 7.34567V4.916L8.59717 6.88088C6.47212 8.06588 5.10056 10.2673 5.00531 12.7258L5 13C5 16.866 8.13401 20 12 20C15.7855 20 18.8691 16.9952 18.9959 13.2407L19 13V4.122ZM12 8C14.7614 8 17 10.2386 17 13C17 15.7614 14.7614 18 12 18C9.23858 18 7 15.7614 7 13C7 10.2386 9.23858 8 12 8ZM12 10C10.3431 10 9 11.3431 9 13C9 14.6569 10.3431 16 12 16C13.6569 16 15 14.6569 15 13C15 11.3431 13.6569 10 12 10Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/more-2-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/more-2-fill.svg
new file mode 100644
index 00000000..e67d22af
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/more-2-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 3c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 14c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-7c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/node-tree.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/node-tree.svg
new file mode 100644
index 00000000..7693acca
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/node-tree.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10 2C10.5523 2 11 2.44772 11 3V7C11 7.55228 10.5523 8 10 8H8V10H13V9C13 8.44772 13.4477 8 14 8H20C20.5523 8 21 8.44772 21 9V13C21 13.5523 20.5523 14 20 14H14C13.4477 14 13 13.5523 13 13V12H8V18H13V17C13 16.4477 13.4477 16 14 16H20C20.5523 16 21 16.4477 21 17V21C21 21.5523 20.5523 22 20 22H14C13.4477 22 13 21.5523 13 21V20H7C6.44772 20 6 19.5523 6 19V8H4C3.44772 8 3 7.55228 3 7V3C3 2.44772 3.44772 2 4 2H10ZM19 18H15V20H19V18ZM19 10H15V12H19V10ZM9 4H5V6H9V4Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/organization-chart.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/organization-chart.svg
new file mode 100644
index 00000000..f16aae8d
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/organization-chart.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M15 3C15.5523 3 16 3.44772 16 4V8C16 8.55228 15.5523 9 15 9H13V11H17C17.5523 11 18 11.4477 18 12V15H20C20.5523 15 21 15.4477 21 16V20C21 20.5523 20.5523 21 20 21H14C13.4477 21 13 20.5523 13 20V16C13 15.4477 13.4477 15 14 15H16V13H8V15H10C10.5523 15 11 15.4477 11 16V20C11 20.5523 10.5523 21 10 21H4C3.44772 21 3 20.5523 3 20V16C3 15.4477 3.44772 15 4 15H6V12C6 11.4477 6.44772 11 7 11H11V9H9C8.44772 9 8 8.55228 8 8V4C8 3.44772 8.44772 3 9 3H15ZM9 17H5V19H9V17ZM19 17H15V19H19V17ZM14 5H10V7H14V5Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/paint-brush-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/paint-brush-line.svg
new file mode 100644
index 00000000..e8b93deb
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/paint-brush-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M5 5v3h14V5H5zM4 3h16a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1zm2 9h6a1 1 0 0 1 1 1v3h1v6h-4v-6h1v-2H5a1 1 0 0 1-1-1v-2h2v1zm11.732 1.732l1.768-1.768 1.768 1.768a2.5 2.5 0 1 1-3.536 0z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/paint-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/paint-line.svg
new file mode 100644
index 00000000..5839c207
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/paint-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19.2277 18.7321L20.9955 16.9644L22.7632 18.7321C23.7395 19.7084 23.7395 21.2914 22.7632 22.2677C21.7869 23.244 20.204 23.244 19.2277 22.2677C18.2514 21.2914 18.2514 19.7084 19.2277 18.7321ZM8.87861 1.07959L20.1923 12.3933C20.5828 12.7838 20.5828 13.417 20.1923 13.8075L11.707 22.2928C11.3165 22.6833 10.6833 22.6833 10.2928 22.2928L1.80754 13.8075C1.41702 13.417 1.41702 12.7838 1.80754 12.3933L9.58572 4.61512L7.4644 2.4938L8.87861 1.07959ZM10.9999 6.02934L3.92886 13.1004L10.9999 20.1715L18.071 13.1004L10.9999 6.02934Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/pantone-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/pantone-line.svg
new file mode 100644
index 00000000..d93296fe
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/pantone-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M5.764 8l-.295-.73a1 1 0 0 1 .553-1.302l9.272-3.746a1 1 0 0 1 1.301.552l5.62 13.908a1 1 0 0 1-.553 1.302L12.39 21.73a1 1 0 0 1-1.302-.553L11 20.96V21H7a1 1 0 0 1-1-1v-.27l-3.35-1.353a1 1 0 0 1-.552-1.302L5.764 8zM8 19h2.209L8 13.533V19zm-2-6.244l-1.673 4.141L6 17.608v-4.852zm1.698-5.309l4.87 12.054 7.418-2.997-4.87-12.053-7.418 2.996zm2.978 2.033a1 1 0 1 1-.749-1.855 1 1 0 0 1 .75 1.855z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/picture-in-picture-exit-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/picture-in-picture-exit-line.svg
new file mode 100644
index 00000000..ad5e2f04
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/picture-in-picture-exit-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M21 3a1 1 0 0 1 1 1v7h-2V5H4v14h6v2H3a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h18zm0 10a1 1 0 0 1 1 1v6a1 1 0 0 1-1 1h-8a1 1 0 0 1-1-1v-6a1 1 0 0 1 1-1h8zm-1 2h-6v4h6v-4zm-8.5-8L9.457 9.043l2.25 2.25-1.414 1.414-2.25-2.25L6 12.5V7h5.5z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/planet-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/planet-line.svg
new file mode 100644
index 00000000..3bb04682
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/planet-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3.91762 8.0366C3.32984 9.23328 3 10.5792 3 11.9999C3 16.9704 7.02944 20.9999 12 20.9999C13.4216 20.9999 14.7684 20.6696 15.9657 20.081C16.8385 20.4544 17.6848 20.6991 18.4564 20.762C19.3582 20.8356 20.3 20.6665 20.9818 19.9847C21.7339 19.2325 21.8625 18.1689 21.7279 17.1727C21.6052 16.2638 21.2481 15.2537 20.726 14.2114C20.9051 13.503 21 12.7619 21 11.9999C21 7.02929 16.9706 2.99986 12 2.99986C11.2389 2.99986 10.4987 3.09454 9.79103 3.27318C8.7474 2.7498 7.73605 2.39172 6.8261 2.26834C5.82897 2.13315 4.76406 2.26128 4.01121 3.01413C3.3287 3.69664 3.16001 4.63956 3.2341 5.54233C3.29752 6.315 3.54313 7.16247 3.91762 8.0366ZM5.3224 5.96574C5.2734 5.75321 5.24204 5.55715 5.2274 5.37873C5.17928 4.79243 5.31727 4.53649 5.42543 4.42834C5.54452 4.30925 5.84797 4.15403 6.55739 4.25021C6.75482 4.27698 6.96951 4.32189 7.2 4.38547C6.50364 4.82527 5.87203 5.35784 5.3224 5.96574ZM19.6124 16.803C19.6751 17.0316 19.7195 17.2445 19.7459 17.4404C19.8416 18.1485 19.6865 18.4515 19.5676 18.5705C19.4595 18.6785 19.204 18.8163 18.6189 18.7686C18.4419 18.7542 18.2475 18.7233 18.0368 18.675C18.6427 18.1268 19.1736 17.4971 19.6124 16.803ZM15.8812 17.8264C14.2046 16.9482 12.2571 15.5026 10.3752 13.6207C8.4954 11.741 7.05092 9.79561 6.17241 8.12028C7.06357 6.78465 8.40124 5.77312 9.96933 5.29866C10.6108 5.10457 11.2923 4.99986 12 4.99986C15.866 4.99986 19 8.13386 19 11.9999C19 12.7083 18.8951 13.3904 18.7006 14.0325C18.2261 15.5991 17.2155 16.9356 15.8812 17.8264ZM13.6052 18.8152C13.0901 18.9359 12.5528 18.9999 12 18.9999C8.13401 18.9999 5 15.8658 5 11.9999C5 11.4476 5.06377 10.9109 5.18429 10.3963C6.14883 11.913 7.43475 13.5087 8.96096 15.0349C10.489 16.563 12.0868 17.8502 13.6052 18.8152Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/play-circle-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/play-circle-line.svg
new file mode 100644
index 00000000..af5e178e
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/play-circle-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM10.6219 8.41459L15.5008 11.6672C15.6846 11.7897 15.7343 12.0381 15.6117 12.2219C15.5824 12.2658 15.5447 12.3035 15.5008 12.3328L10.6219 15.5854C10.4381 15.708 10.1897 15.6583 10.0672 15.4745C10.0234 15.4088 10 15.3316 10 15.2526V8.74741C10 8.52649 10.1791 8.34741 10.4 8.34741C10.479 8.34741 10.5562 8.37078 10.6219 8.41459Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/play-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/play-line.svg
new file mode 100644
index 00000000..c9c6b6eb
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/play-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M16.3944 11.9998L10 7.73686V16.2628L16.3944 11.9998ZM19.376 12.4158L8.77735 19.4816C8.54759 19.6348 8.23715 19.5727 8.08397 19.3429C8.02922 19.2608 8 19.1643 8 19.0656V4.93408C8 4.65794 8.22386 4.43408 8.5 4.43408C8.59871 4.43408 8.69522 4.4633 8.77735 4.51806L19.376 11.5838C19.6057 11.737 19.6678 12.0474 19.5146 12.2772C19.478 12.3321 19.4309 12.3792 19.376 12.4158Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/plug-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/plug-line.svg
new file mode 100644
index 00000000..5e20db98
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/plug-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13 18V20H19V22H13C11.8954 22 11 21.1046 11 20V18H8C5.79086 18 4 16.2091 4 14V7C4 6.44772 4.44772 6 5 6H8V2H10V6H14V2H16V6H19C19.5523 6 20 6.44772 20 7V14C20 16.2091 18.2091 18 16 18H13ZM8 16H16C17.1046 16 18 15.1046 18 14V11H6V14C6 15.1046 6.89543 16 8 16ZM18 8H6V9H18V8ZM12 14.5C11.4477 14.5 11 14.0523 11 13.5C11 12.9477 11.4477 12.5 12 12.5C12.5523 12.5 13 12.9477 13 13.5C13 14.0523 12.5523 14.5 12 14.5Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/pulse-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/pulse-line.svg
new file mode 100644
index 00000000..4f8aa2bd
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/pulse-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0H24V24H0z"/><path d="M9 7.539L15 21.539 18.659 13 23 13 23 11 17.341 11 15 16.461 9 2.461 5.341 11 1 11 1 13 6.659 13z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/pushpin-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/pushpin-line.svg
new file mode 100644
index 00000000..b86e5654
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/pushpin-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13.8273 1.68994L22.3126 10.1752L20.8984 11.5894L20.1913 10.8823L15.9486 15.125L15.2415 18.6605L13.8273 20.0747L9.58466 15.8321L4.63492 20.7818L3.2207 19.3676L8.17045 14.4179L3.92781 10.1752L5.34202 8.76101L8.87756 8.0539L13.1202 3.81126L12.4131 3.10416L13.8273 1.68994ZM14.5344 5.22548L9.86358 9.89631L7.0417 10.4607L13.5418 16.9608L14.1062 14.1389L18.7771 9.46812L14.5344 5.22548Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/question-answer-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/question-answer-fill.svg
new file mode 100644
index 00000000..fb6b6fdf
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/question-answer-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M8 18h10.237L20 19.385V9h1a1 1 0 0 1 1 1v13.5L17.545 20H9a1 1 0 0 1-1-1v-1zm-2.545-2L1 19.5V4a1 1 0 0 1 1-1h15a1 1 0 0 1 1 1v12H5.455z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/question-answer-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/question-answer-line.svg
new file mode 100644
index 00000000..29bc6899
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/question-answer-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M5.455 15L1 18.5V3a1 1 0 0 1 1-1h15a1 1 0 0 1 1 1v12H5.455zm-.692-2H16V4H3v10.385L4.763 13zM8 17h10.237L20 18.385V8h1a1 1 0 0 1 1 1v13.5L17.545 19H9a1 1 0 0 1-1-1v-1z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/recycle-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/recycle-line.svg
new file mode 100644
index 00000000..53988a91
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/recycle-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0H24V24H0z"/><path d="M19.562 12.097l1.531 2.653c.967 1.674.393 3.815-1.28 4.781-.533.307-1.136.469-1.75.469H16v2.5L11 19l5-3.5V18h2.062c.263 0 .522-.07.75-.201.718-.414.963-1.332.55-2.049l-1.532-2.653 1.732-1zM7.304 9.134l.53 6.08-2.164-1.25-1.031 1.786c-.132.228-.201.487-.201.75 0 .828.671 1.5 1.5 1.5H9v2H5.938c-1.933 0-3.5-1.567-3.5-3.5 0-.614.162-1.218.469-1.75l1.03-1.787-2.164-1.249 5.53-2.58zm6.446-6.165c.532.307.974.749 1.281 1.281l1.03 1.785 2.166-1.25-.53 6.081-5.532-2.58 2.165-1.25-1.031-1.786c-.132-.228-.321-.417-.549-.549-.717-.414-1.635-.168-2.049.549L9.169 7.903l-1.732-1L8.97 4.25c.966-1.674 3.107-2.248 4.781-1.281z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/refresh-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/refresh-line.svg
new file mode 100644
index 00000000..ff547244
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/refresh-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M5.463 4.433A9.961 9.961 0 0 1 12 2c5.523 0 10 4.477 10 10 0 2.136-.67 4.116-1.81 5.74L17 12h3A8 8 0 0 0 6.46 6.228l-.997-1.795zm13.074 15.134A9.961 9.961 0 0 1 12 22C6.477 22 2 17.523 2 12c0-2.136.67-4.116 1.81-5.74L7 12H4a8 8 0 0 0 13.54 5.772l.997 1.795z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/reply-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/reply-fill.svg
new file mode 100644
index 00000000..54aade62
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/reply-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0H24V24H0z"/><path d="M11 20L1 12l10-8v5c5.523 0 10 4.477 10 10 0 .273-.01.543-.032.81C19.46 16.95 16.458 15 13 15h-2v5z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/reply-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/reply-line.svg
new file mode 100644
index 00000000..e1b88438
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/reply-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="12" height="12"><path fill="none" d="M0 0H24V24H0z"/><path d="M11 20L1 12l10-8v5c5.523 0 10 4.477 10 10 0 .273-.01.543-.032.81-1.463-2.774-4.33-4.691-7.655-4.805L13 15h-2v5zm-2-7h4.034l.347.007c1.285.043 2.524.31 3.676.766C15.59 12.075 13.42 11 11 11H9V8.161L4.202 12 9 15.839V13z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/restart-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/restart-fill.svg
new file mode 100644
index 00000000..e57e15eb
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/restart-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm4.82-4.924a7 7 0 1 0-1.852 1.266l-.975-1.755A5 5 0 1 1 17 12h-3l2.82 5.076z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/robot-2-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/robot-2-line.svg
new file mode 100644
index 00000000..434f3da6
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/robot-2-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13.5 2C13.5 2.44425 13.3069 2.84339 13 3.11805V5H18C19.6569 5 21 6.34315 21 8V18C21 19.6569 19.6569 21 18 21H6C4.34315 21 3 19.6569 3 18V8C3 6.34315 4.34315 5 6 5H11V3.11805C10.6931 2.84339 10.5 2.44425 10.5 2C10.5 1.17157 11.1716 0.5 12 0.5C12.8284 0.5 13.5 1.17157 13.5 2ZM6 7C5.44772 7 5 7.44772 5 8V18C5 18.5523 5.44772 19 6 19H18C18.5523 19 19 18.5523 19 18V8C19 7.44772 18.5523 7 18 7H13H11H6ZM2 10H0V16H2V10ZM22 10H24V16H22V10ZM9 14.5C9.82843 14.5 10.5 13.8284 10.5 13C10.5 12.1716 9.82843 11.5 9 11.5C8.17157 11.5 7.5 12.1716 7.5 13C7.5 13.8284 8.17157 14.5 9 14.5ZM15 14.5C15.8284 14.5 16.5 13.8284 16.5 13C16.5 12.1716 15.8284 11.5 15 11.5C14.1716 11.5 13.5 12.1716 13.5 13C13.5 13.8284 14.1716 14.5 15 14.5Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/rocket-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/rocket-fill.svg
new file mode 100644
index 00000000..ad9a5941
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/rocket-fill.svg
@@ -0,0 +1,2 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M6.2,9.6c0.5-0.7,1-1.4,1.6-2c3.1-3.1,7.5-4,11.1-2.5c1.4,3.6,0.6,8-2.5,11.1c-0.6,0.6-1.3,1.1-2,1.6l0.1,2.3c0,0.2-0.1,0.4-0.3,0.4l-4,1c-0.2,0.1-0.5-0.1-0.5-0.3c0,0,0-0.1,0-0.1v-2.7c0-0.2-0.1-0.4-0.3-0.6l-3.2-3.2c-0.2-0.2-0.4-0.3-0.6-0.3H2.9c-0.2,0-0.4-0.2-0.4-0.4c0,0,0-0.1,0-0.1l1-4c0.1-0.2,0.2-0.3,0.4-0.3C3.9,9.5,6.2,9.6,6.2,9.6zM12.1,11.9c0.7,0.7,1.8,0.7,2.4,0c0.7-0.7,0.7-1.8,0-2.4c-0.7-0.7-1.8-0.7-2.4,0C11.4,10.2,11.4,11.3,12.1,11.9z"/></svg>				
+			
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/ruler-2-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/ruler-2-line.svg
new file mode 100644
index 00000000..cd589354
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/ruler-2-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M17 19H19V14H10V5H5V7H7V9H5V11H8V13H5V15H7V17H5V19H7V17H9V19H11V16H13V19H15V17H17V19ZM12 12H20C20.5523 12 21 12.4477 21 13V20C21 20.5523 20.5523 21 20 21H4C3.44772 21 3 20.5523 3 20V4C3 3.44772 3.44772 3 4 3H11C11.5523 3 12 3.44772 12 4V12Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/run-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/run-line.svg
new file mode 100644
index 00000000..7254f460
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/run-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9.82986 8.78986L7.99998 9.45588V13H5.99998V8.05H6.015L11.2834 6.13247C11.5274 6.03855 11.7922 5.99162 12.0648 6.0008C13.1762 6.02813 14.1522 6.75668 14.4917 7.82036C14.678 8.40431 14.848 8.79836 15.0015 9.0025C15.9138 10.2155 17.3653 11 19 11V13C16.8253 13 14.8823 12.0083 13.5984 10.4526L12.9008 14.4085L15 16.17V23H13V17.1025L10.7307 15.1984L10.003 19.3253L3.10938 18.1098L3.45667 16.1401L8.38071 17.0084L9.82986 8.78986ZM13.5 5.5C12.3954 5.5 11.5 4.60457 11.5 3.5C11.5 2.39543 12.3954 1.5 13.5 1.5C14.6046 1.5 15.5 2.39543 15.5 3.5C15.5 4.60457 14.6046 5.5 13.5 5.5Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/save-2-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/save-2-line.svg
new file mode 100644
index 00000000..1536631d
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/save-2-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M5 5v14h14V7.828L16.172 5H5zM4 3h13l3.707 3.707a1 1 0 0 1 .293.707V20a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1zm8 15a3 3 0 1 1 0-6 3 3 0 0 1 0 6zM6 6h9v4H6V6z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/save-3-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/save-3-line.svg
new file mode 100644
index 00000000..ee5c0d65
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/save-3-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M18 19h1V6.828L17.172 5H16v4H7V5H5v14h1v-7h12v7zM4 3h14l2.707 2.707a1 1 0 0 1 .293.707V20a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1zm4 11v5h8v-5H8z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/seo-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/seo-line.svg
new file mode 100644
index 00000000..670c46a8
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/seo-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M8 3C4.13401 3 1 6.13401 1 10C1 13.866 4.13401 17 8 17H9.07089C9.02417 16.6734 9 16.3395 9 16C9 15.6605 9.02417 15.3266 9.07089 15H8C5.23858 15 3 12.7614 3 10C3 7.23858 5.23858 5 8 5H16C18.7614 5 21 7.23858 21 10C21 10.3428 20.9655 10.6775 20.8998 11.0008C21.4853 11.5748 21.9704 12.2508 22.3264 13C22.7583 12.0907 23 11.0736 23 10C23 6.13401 19.866 3 16 3H8ZM16 13C14.3431 13 13 14.3431 13 16C13 17.6569 14.3431 19 16 19C17.6569 19 19 17.6569 19 16C19 14.3431 17.6569 13 16 13ZM11 16C11 13.2386 13.2386 11 16 11C18.7614 11 21 13.2386 21 16C21 17.0191 20.6951 17.967 20.1716 18.7574L22.7071 21.2929L21.2929 22.7071L18.7574 20.1716C17.967 20.6951 17.0191 21 16 21C13.2386 21 11 18.7614 11 16Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/settings-3-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/settings-3-line.svg
new file mode 100644
index 00000000..dbc30971
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/settings-3-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3.33946 17.0002C2.90721 16.2515 2.58277 15.4702 2.36133 14.6741C3.3338 14.1779 3.99972 13.1668 3.99972 12.0002C3.99972 10.8345 3.3348 9.824 2.36353 9.32741C2.81025 7.71651 3.65857 6.21627 4.86474 4.99001C5.7807 5.58416 6.98935 5.65534 7.99972 5.072C9.01009 4.48866 9.55277 3.40635 9.4962 2.31604C11.1613 1.8846 12.8847 1.90004 14.5031 2.31862C14.4475 3.40806 14.9901 4.48912 15.9997 5.072C17.0101 5.65532 18.2187 5.58416 19.1346 4.99007C19.7133 5.57986 20.2277 6.25151 20.66 7.00021C21.0922 7.7489 21.4167 8.53025 21.6381 9.32628C20.6656 9.82247 19.9997 10.8336 19.9997 12.0002C19.9997 13.166 20.6646 14.1764 21.6359 14.673C21.1892 16.2839 20.3409 17.7841 19.1347 19.0104C18.2187 18.4163 17.0101 18.3451 15.9997 18.9284C14.9893 19.5117 14.4467 20.5941 14.5032 21.6844C12.8382 22.1158 11.1148 22.1004 9.49633 21.6818C9.55191 20.5923 9.00929 19.5113 7.99972 18.9284C6.98938 18.3451 5.78079 18.4162 4.86484 19.0103C4.28617 18.4205 3.77172 17.7489 3.33946 17.0002ZM8.99972 17.1964C10.0911 17.8265 10.8749 18.8227 11.2503 19.9659C11.7486 20.0133 12.2502 20.014 12.7486 19.9675C13.1238 18.8237 13.9078 17.8268 14.9997 17.1964C16.0916 16.5659 17.347 16.3855 18.5252 16.6324C18.8146 16.224 19.0648 15.7892 19.2729 15.334C18.4706 14.4373 17.9997 13.2604 17.9997 12.0002C17.9997 10.74 18.4706 9.5632 19.2729 8.6665C19.1688 8.4405 19.0538 8.21822 18.9279 8.00021C18.802 7.78219 18.667 7.57148 18.5233 7.36842C17.3457 7.61476 16.0911 7.43414 14.9997 6.80405C13.9083 6.17395 13.1246 5.17768 12.7491 4.03455C12.2509 3.98714 11.7492 3.98646 11.2509 4.03292C10.8756 5.17671 10.0916 6.17364 8.99972 6.80405C7.9078 7.43447 6.65245 7.61494 5.47428 7.36803C5.18485 7.77641 4.93463 8.21117 4.72656 8.66637C5.52881 9.56311 5.99972 10.74 5.99972 12.0002C5.99972 13.2604 5.52883 14.4372 4.72656 15.3339C4.83067 15.5599 4.94564 15.7822 5.07152 16.0002C5.19739 16.2182 5.3324 16.4289 5.47612 16.632C6.65377 16.3857 7.90838 16.5663 8.99972 17.1964ZM11.9997 15.0002C10.3429 15.0002 8.99972 13.6571 8.99972 12.0002C8.99972 10.3434 10.3429 9.00021 11.9997 9.00021C13.6566 9.00021 14.9997 10.3434 14.9997 12.0002C14.9997 13.6571 13.6566 15.0002 11.9997 15.0002ZM11.9997 13.0002C12.552 13.0002 12.9997 12.5525 12.9997 12.0002C12.9997 11.4479 12.552 11.0002 11.9997 11.0002C11.4474 11.0002 10.9997 11.4479 10.9997 12.0002C10.9997 12.5525 11.4474 13.0002 11.9997 13.0002Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/shape-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/shape-fill.svg
new file mode 100644
index 00000000..6200ce7a
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/shape-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M5 8C3.34315 8 2 6.65685 2 5C2 3.34315 3.34315 2 5 2C6.65685 2 8 3.34315 8 5C8 6.65685 6.65685 8 5 8ZM19 8C17.3431 8 16 6.65685 16 5C16 3.34315 17.3431 2 19 2C20.6569 2 22 3.34315 22 5C22 6.65685 20.6569 8 19 8ZM19 22C17.3431 22 16 20.6569 16 19C16 17.3431 17.3431 16 19 16C20.6569 16 22 17.3431 22 19C22 20.6569 20.6569 22 19 22ZM5 22C3.34315 22 2 20.6569 2 19C2 17.3431 3.34315 16 5 16C6.65685 16 8 17.3431 8 19C8 20.6569 6.65685 22 5 22ZM9 4H15V6H9V4ZM9 18H15V20H9V18ZM4 9H6V15H4V9ZM18 9H20V15H18V9Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/shapes-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/shapes-line.svg
new file mode 100644
index 00000000..b7d77105
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/shapes-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M11.9998 1L6 11H18L11.9998 1ZM11.9998 4.8873L14.4676 9H9.53232L11.9998 4.8873ZM6.75 20C5.23122 20 4 18.7688 4 17.25C4 15.7312 5.23122 14.5 6.75 14.5C8.26878 14.5 9.5 15.7312 9.5 17.25C9.5 18.7688 8.26878 20 6.75 20ZM6.75 22C9.37335 22 11.5 19.8734 11.5 17.25C11.5 14.6266 9.37335 12.5 6.75 12.5C4.12665 12.5 2 14.6266 2 17.25C2 19.8734 4.12665 22 6.75 22ZM15 15.5V19.5H19V15.5H15ZM13 21.5V13.5H21V21.5H13Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/shut-down-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/shut-down-line.svg
new file mode 100644
index 00000000..a8ab6b14
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/shut-down-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M6.26489 3.80698L7.41191 5.44558C5.34875 6.89247 4 9.28873 4 12C4 16.4183 7.58172 20 12 20C16.4183 20 20 16.4183 20 12C20 9.28873 18.6512 6.89247 16.5881 5.44558L17.7351 3.80698C20.3141 5.61559 22 8.61091 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 8.61091 3.68594 5.61559 6.26489 3.80698ZM11 12V2H13V12H11Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/skip-forward-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/skip-forward-line.svg
new file mode 100644
index 00000000..6da48dab
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/skip-forward-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M16 12.6667L5.77735 19.4818C5.54759 19.6349 5.23715 19.5729 5.08397 19.3431C5.02922 19.261 5 19.1645 5 19.0657V4.93426C5 4.65812 5.22386 4.43426 5.5 4.43426C5.59871 4.43426 5.69522 4.46348 5.77735 4.51823L16 11.3333V5C16 4.44772 16.4477 4 17 4C17.5523 4 18 4.44772 18 5V19C18 19.5523 17.5523 20 17 20C16.4477 20 16 19.5523 16 19V12.6667ZM7 7.73703V16.263L13.3944 12L7 7.73703Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/skip-forward-mini-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/skip-forward-mini-line.svg
new file mode 100644
index 00000000..03d788ad
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/skip-forward-mini-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12.0319 12L9 9.85984V14.1402L12.0319 12ZM7.5 17.535C7.22386 17.535 7 17.3112 7 17.035V6.96496C7 6.8617 7.03197 6.76098 7.09152 6.67662C7.25076 6.45102 7.56274 6.39723 7.78834 6.55648L14.9213 11.5915C14.9679 11.6244 15.0086 11.665 15.0415 11.7117C15.2007 11.9373 15.1469 12.2492 14.9213 12.4085L7.78834 17.4435C7.70398 17.5031 7.60326 17.535 7.5 17.535ZM16 7C16 6.44772 16.4477 6 17 6C17.5523 6 18 6.44772 18 7V17C18 17.5523 17.5523 18 17 18C16.4477 18 16 17.5523 16 17V7Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/sort-asc.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/sort-asc.svg
new file mode 100644
index 00000000..411e658e
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/sort-asc.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19 3L23 8H20V20H18V8H15L19 3ZM14 18V20H3V18H14ZM14 11V13H3V11H14ZM12 4V6H3V4H12Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/sort-desc.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/sort-desc.svg
new file mode 100644
index 00000000..85a5a1aa
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/sort-desc.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20 4V16H23L19 21L15 16H18V4H20ZM12 18V20H3V18H12ZM14 11V13H3V11H14ZM14 4V6H3V4H14Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/sound-module-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/sound-module-line.svg
new file mode 100644
index 00000000..02b9ddb0
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/sound-module-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21 18V21H19V18H17V16H23V18H21ZM5 18V21H3V18H1V16H7V18H5ZM11 6V3H13V6H15V8H9V6H11ZM11 10H13V21H11V10ZM3 14V3H5V14H3ZM19 14V3H21V14H19Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/sparkling-2-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/sparkling-2-line.svg
new file mode 100644
index 00000000..f9802f57
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/sparkling-2-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M17.0007 1.20801 18.3195 3.68083 20.7923 4.99968 18.3195 6.31852 17.0007 8.79134 15.6818 6.31852 13.209 4.99968 15.6818 3.68083 17.0007 1.20801ZM10.6673 9.33301 15.6673 11.9997 10.6673 14.6663 8.00065 19.6663 5.33398 14.6663.333984 11.9997 5.33398 9.33301 8.00065 4.33301 10.6673 9.33301ZM11.4173 11.9997 9.18905 10.8113 8.00065 8.58301 6.81224 10.8113 4.58398 11.9997 6.81224 13.1881 8.00065 15.4163 9.18905 13.1881 11.4173 11.9997ZM19.6673 16.333 18.0007 13.208 16.334 16.333 13.209 17.9997 16.334 19.6663 18.0007 22.7913 19.6673 19.6663 22.7923 17.9997 19.6673 16.333Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/sparkling-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/sparkling-line.svg
new file mode 100644
index 00000000..6a70ce23
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/sparkling-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M14 4.4375C15.3462 4.4375 16.4375 3.34619 16.4375 2H17.5625C17.5625 3.34619 18.6538 4.4375 20 4.4375V5.5625C18.6538 5.5625 17.5625 6.65381 17.5625 8H16.4375C16.4375 6.65381 15.3462 5.5625 14 5.5625V4.4375ZM1 11C4.31371 11 7 8.31371 7 5H9C9 8.31371 11.6863 11 15 11V13C11.6863 13 9 15.6863 9 19H7C7 15.6863 4.31371 13 1 13V11ZM4.87601 12C6.18717 12.7276 7.27243 13.8128 8 15.124 8.72757 13.8128 9.81283 12.7276 11.124 12 9.81283 11.2724 8.72757 10.1872 8 8.87601 7.27243 10.1872 6.18717 11.2724 4.87601 12ZM17.25 14C17.25 15.7949 15.7949 17.25 14 17.25V18.75C15.7949 18.75 17.25 20.2051 17.25 22H18.75C18.75 20.2051 20.2051 18.75 22 18.75V17.25C20.2051 17.25 18.75 15.7949 18.75 14H17.25Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/arrow.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/arrow.svg
new file mode 100644
index 00000000..ba58879a
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/arrow.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24"><path d="M15 18 9 12 15 6"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/error.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/error.svg
new file mode 100644
index 00000000..fc950613
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/error.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="#fff" d="M16 1a15 15 0 1 0 15 15A15 15 0 0 0 16 1zm0 2a13 13 0 0 1 8.45 3.14L6.14 24.45A13 13 0 0 1 16 3zm0 26a13 13 0 0 1-8.45-3.14L25.86 7.55A13 13 0 0 1 16 29z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/pause.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/pause.svg
new file mode 100644
index 00000000..621b4fd6
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/pause.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="-0.5 -0.5 25 25"><circle cx="12" cy="12" r="10"/><path d="M10 15 10 9"/><path d="M14 15 14 9"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/pixel.gif b/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/pixel.gif
new file mode 100644
index 00000000..5bfd67a2
Binary files /dev/null and b/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/pixel.gif differ
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/play.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/play.svg
new file mode 100644
index 00000000..73191945
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/play.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="-0.5 -0.5 25 25"><circle cx="12" cy="12" r="10"/><path fill="#fff" d="M10 8 16 12 10 16 10 8z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/preloader.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/preloader.svg
new file mode 100644
index 00000000..91a2fe3b
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/preloader.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" stroke="#fff" viewBox="0 0 38 38"><g fill="none" fill-rule="evenodd" stroke-opacity=".65" stroke-width="2" transform="translate(1 1)"><circle cx="18" cy="18" r="18" stroke-opacity=".15"/><path d="M36 18c0-9.94-8.06-18-18-18"><animateTransform attributeName="transform" dur="1s" from="0 18 18" repeatCount="indefinite" to="360 18 18" type="rotate"/></path></g></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/theme.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/theme.svg
new file mode 100644
index 00000000..6287d462
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/spotlight/theme.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" version="1.2" viewBox="2 2 20 20"><g fill="#fff"><path d="M12 4a8 8 0 1 0 0 16 8 8 0 0 0 0-16zm0 14a6 6 0 1 1 0-12 6 6 0 0 1 0 12z"/><path d="M12 7v10c2.757 0 5-2.243 5-5s-2.243-5-5-5z"/></g></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/stack-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/stack-line.svg
new file mode 100644
index 00000000..1bd316f6
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/stack-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M20.083 15.2l1.202.721a.5.5 0 0 1 0 .858l-8.77 5.262a1 1 0 0 1-1.03 0l-8.77-5.262a.5.5 0 0 1 0-.858l1.202-.721L12 20.05l8.083-4.85zm0-4.7l1.202.721a.5.5 0 0 1 0 .858L12 17.65l-9.285-5.571a.5.5 0 0 1 0-.858l1.202-.721L12 15.35l8.083-4.85zm-7.569-9.191l8.771 5.262a.5.5 0 0 1 0 .858L12 13 2.715 7.429a.5.5 0 0 1 0-.858l8.77-5.262a1 1 0 0 1 1.03 0zM12 3.332L5.887 7 12 10.668 18.113 7 12 3.332z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/star-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/star-line.svg
new file mode 100644
index 00000000..2455a969
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/star-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12.0006 18.26L4.94715 22.2082L6.52248 14.2799L0.587891 8.7918L8.61493 7.84006L12.0006 0.5L15.3862 7.84006L23.4132 8.7918L17.4787 14.2799L19.054 22.2082L12.0006 18.26ZM12.0006 15.968L16.2473 18.3451L15.2988 13.5717L18.8719 10.2674L14.039 9.69434L12.0006 5.27502L9.96214 9.69434L5.12921 10.2674L8.70231 13.5717L7.75383 18.3451L12.0006 15.968Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/stop-circle-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/stop-circle-line.svg
new file mode 100644
index 00000000..25ac41f3
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/stop-circle-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM9 9H15V15H9V9Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/stop-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/stop-line.svg
new file mode 100644
index 00000000..2b44ad70
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/stop-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7 7V17H17V7H7ZM6 5H18C18.5523 5 19 5.44772 19 6V18C19 18.5523 18.5523 19 18 19H6C5.44772 19 5 18.5523 5 18V6C5 5.44772 5.44772 5 6 5Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/t-box-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/t-box-fill.svg
new file mode 100644
index 00000000..6b9e7293
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/t-box-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M17 8H7v2h4v7h2v-7h4V8zM4 3h16a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/t-box-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/t-box-line.svg
new file mode 100644
index 00000000..cd9a38fe
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/t-box-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M5 5V19H19V5H5ZM4 3H20C20.5523 3 21 3.44772 21 4V20C21 20.5523 20.5523 21 20 21H4C3.44772 21 3 20.5523 3 20V4C3 3.44772 3.44772 3 4 3ZM13 10V17H11V10H7V8H17V10H13Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/team-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/team-line.svg
new file mode 100644
index 00000000..699419d7
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/team-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 11C14.7614 11 17 13.2386 17 16V22H15V16C15 14.4023 13.7511 13.0963 12.1763 13.0051L12 13C10.4023 13 9.09634 14.2489 9.00509 15.8237L9 16V22H7V16C7 13.2386 9.23858 11 12 11ZM5.5 14C5.77885 14 6.05009 14.0326 6.3101 14.0942C6.14202 14.594 6.03873 15.122 6.00896 15.6693L6 16L6.0007 16.0856C5.88757 16.0456 5.76821 16.0187 5.64446 16.0069L5.5 16C4.7203 16 4.07955 16.5949 4.00687 17.3555L4 17.5V22H2V17.5C2 15.567 3.567 14 5.5 14ZM18.5 14C20.433 14 22 15.567 22 17.5V22H20V17.5C20 16.7203 19.4051 16.0796 18.6445 16.0069L18.5 16C18.3248 16 18.1566 16.03 18.0003 16.0852L18 16C18 15.3343 17.8916 14.694 17.6915 14.0956C17.9499 14.0326 18.2211 14 18.5 14ZM5.5 8C6.88071 8 8 9.11929 8 10.5C8 11.8807 6.88071 13 5.5 13C4.11929 13 3 11.8807 3 10.5C3 9.11929 4.11929 8 5.5 8ZM18.5 8C19.8807 8 21 9.11929 21 10.5C21 11.8807 19.8807 13 18.5 13C17.1193 13 16 11.8807 16 10.5C16 9.11929 17.1193 8 18.5 8ZM5.5 10C5.22386 10 5 10.2239 5 10.5C5 10.7761 5.22386 11 5.5 11C5.77614 11 6 10.7761 6 10.5C6 10.2239 5.77614 10 5.5 10ZM18.5 10C18.2239 10 18 10.2239 18 10.5C18 10.7761 18.2239 11 18.5 11C18.7761 11 19 10.7761 19 10.5C19 10.2239 18.7761 10 18.5 10ZM12 2C14.2091 2 16 3.79086 16 6C16 8.20914 14.2091 10 12 10C9.79086 10 8 8.20914 8 6C8 3.79086 9.79086 2 12 2ZM12 4C10.8954 4 10 4.89543 10 6C10 7.10457 10.8954 8 12 8C13.1046 8 14 7.10457 14 6C14 4.89543 13.1046 4 12 4Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/terminal-box-fill.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/terminal-box-fill.svg
new file mode 100644
index 00000000..776f80ae
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/terminal-box-fill.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M3 3h18a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1zm9 12v2h6v-2h-6zm-3.586-3l-2.828 2.828L7 16.243 11.243 12 7 7.757 5.586 9.172 8.414 12z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/terminal-box-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/terminal-box-line.svg
new file mode 100644
index 00000000..e03c93f6
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/terminal-box-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3 3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3ZM4 5V19H20V5H4ZM12 15H18V17H12V15ZM8.66685 12L5.83842 9.17157L7.25264 7.75736L11.4953 12L7.25264 16.2426L5.83842 14.8284L8.66685 12Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/text.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/text.svg
new file mode 100644
index 00000000..00ba6b6d
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/text.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13 6V21H11V6H5V4H19V6H13Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/trophy-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/trophy-line.svg
new file mode 100644
index 00000000..9cb05f0b
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/trophy-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13.0049 16.941V19.0029H18.0049V21.0029H6.00488V19.0029H11.0049V16.941C7.05857 16.4489 4.00488 13.0825 4.00488 9.00293V3.00293H20.0049V9.00293C20.0049 13.0825 16.9512 16.4489 13.0049 16.941ZM6.00488 5.00293V9.00293C6.00488 12.3166 8.69117 15.0029 12.0049 15.0029C15.3186 15.0029 18.0049 12.3166 18.0049 9.00293V5.00293H6.00488ZM1.00488 5.00293H3.00488V9.00293H1.00488V5.00293ZM21.0049 5.00293H23.0049V9.00293H21.0049V5.00293Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/unpin-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/unpin-line.svg
new file mode 100644
index 00000000..61f7d33d
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/unpin-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.9701 17.1715 19.5559 18.5858 16.0214 15.0513 15.9476 15.125 15.2405 18.6605 13.8263 20.0747 9.58369 15.8321 4.63394 20.7818 3.21973 19.3676 8.16947 14.4179 3.92683 10.1752 5.34105 8.76101 8.87658 8.0539 8.95029 7.98019 5.41373 4.44362 6.82794 3.02941 20.9701 17.1715ZM10.3645 9.3944 9.86261 9.89631 7.04072 10.4607 13.5409 16.9608 14.1052 14.1389 14.6071 13.637 10.3645 9.3944ZM18.7761 9.46812 17.4356 10.8086 18.8498 12.2228 20.1903 10.8823 20.8974 11.5894 22.3116 10.1752 13.8263 1.68994 12.4121 3.10416 13.1192 3.81126 11.7787 5.15176 13.1929 6.56597 14.5334 5.22548 18.7761 9.46812Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/user-smile-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/user-smile-line.svg
new file mode 100644
index 00000000..d9608530
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/user-smile-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM7 12H9C9 13.6569 10.3431 15 12 15C13.6569 15 15 13.6569 15 12H17C17 14.7614 14.7614 17 12 17C9.23858 17 7 14.7614 7 12Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/variation-settings.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/variation-settings.svg
new file mode 100644
index 00000000..baec2dee
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/variation-settings.svg
@@ -0,0 +1 @@
+<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="m22.5 23h-21c-.971 0-1.5-1.373-1.5-2.079v-19.375c0-.853.673-1.546 1.5-1.546h21c.827 0 1.5.693 1.5 1.546v19.375c0 .706-.529 2.079-1.5 2.079zm-21-22c-.276 0-.5.245-.5.546v19.375c0 .433.339 1.079.506 1.079h20.994c.161 0 .5-.646.5-1.079v-19.375c0-.301-.224-.546-.5-.546z"/><path d="m20 8h-2c-.276 0-.5-.224-.5-.5s.224-.5.5-.5h2c.276 0 .5.224.5.5s-.224.5-.5.5z"/><path d="m12 8h-8c-.276 0-.5-.224-.5-.5s.224-.5.5-.5h8c.276 0 .5.224.5.5s-.224.5-.5.5z"/><path d="m20 16h-8c-.276 0-.5-.224-.5-.5s.224-.5.5-.5h8c.276 0 .5.224.5.5s-.224.5-.5.5z"/><path d="m7 16h-3c-.276 0-.5-.224-.5-.5s.224-.5.5-.5h3c.276 0 .5.224.5.5s-.224.5-.5.5z"/><path d="m15.5 10.5c-1.654 0-3-1.346-3-3s1.346-3 3-3 3 1.346 3 3-1.346 3-3 3zm0-5c-1.103 0-2 .897-2 2s.897 2 2 2 2-.897 2-2-.897-2-2-2z"/><path d="m9.5 18.5c-1.654 0-3-1.346-3-3s1.346-3 3-3 3 1.346 3 3-1.346 3-3 3zm0-5c-1.103 0-2 .897-2 2s.897 2 2 2 2-.897 2-2-.897-2-2-2z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/video-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/video-line.svg
new file mode 100644
index 00000000..e2e1c928
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/video-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3 3.9934C3 3.44476 3.44495 3 3.9934 3H20.0066C20.5552 3 21 3.44495 21 3.9934V20.0066C21 20.5552 20.5551 21 20.0066 21H3.9934C3.44476 21 3 20.5551 3 20.0066V3.9934ZM5 5V19H19V5H5ZM10.6219 8.41459L15.5008 11.6672C15.6846 11.7897 15.7343 12.0381 15.6117 12.2219C15.5824 12.2658 15.5447 12.3035 15.5008 12.3328L10.6219 15.5854C10.4381 15.708 10.1897 15.6583 10.0672 15.4745C10.0234 15.4088 10 15.3316 10 15.2526V8.74741C10 8.52649 10.1791 8.34741 10.4 8.34741C10.479 8.34741 10.5562 8.37078 10.6219 8.41459Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/vip-diamond-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/vip-diamond-line.svg
new file mode 100644
index 00000000..408dd262
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/vip-diamond-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4.87759 3.00293H19.1319C19.4518 3.00293 19.7524 3.15601 19.9406 3.41476L23.7634 8.67115C23.9037 8.86403 23.8882 9.12913 23.7265 9.30438L12.3721 21.6049C12.1848 21.8078 11.8685 21.8205 11.6656 21.6332C11.6591 21.6271 7.86486 17.5175 0.282992 9.30438C0.121226 9.12913 0.10575 8.86403 0.246026 8.67115L4.06886 3.41476C4.25704 3.15601 4.55766 3.00293 4.87759 3.00293ZM5.38682 5.00293L2.58738 8.85216L12.0047 19.0543L21.4221 8.85216L18.6226 5.00293H5.38682Z"></path></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/zoom-in-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/zoom-in-line.svg
new file mode 100644
index 00000000..48a29cd8
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/zoom-in-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M18.031 16.617l4.283 4.282-1.415 1.415-4.282-4.283A8.96 8.96 0 0 1 11 20c-4.968 0-9-4.032-9-9s4.032-9 9-9 9 4.032 9 9a8.96 8.96 0 0 1-1.969 5.617zm-2.006-.742A6.977 6.977 0 0 0 18 11c0-3.868-3.133-7-7-7-3.868 0-7 3.132-7 7 0 3.867 3.132 7 7 7a6.977 6.977 0 0 0 4.875-1.975l.15-.15zM10 10V7h2v3h3v2h-3v3h-2v-3H7v-2h3z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/svg/zoom-out-line.svg b/extensions-builtin/anapnoe-sd-uiux/html/svg/zoom-out-line.svg
new file mode 100644
index 00000000..d85c8f20
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/svg/zoom-out-line.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M18.031 16.617l4.283 4.282-1.415 1.415-4.282-4.283A8.96 8.96 0 0 1 11 20c-4.968 0-9-4.032-9-9s4.032-9 9-9 9 4.032 9 9a8.96 8.96 0 0 1-1.969 5.617zm-2.006-.742A6.977 6.977 0 0 0 18 11c0-3.868-3.133-7-7-7-3.868 0-7 3.132-7 7 0 3.867 3.132 7 7 7a6.977 6.977 0 0 0 4.875-1.975l.15-.15zM7 10h8v2H7v-2z"/></svg>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-about.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-about.html
new file mode 100644
index 00000000..7c3f0991
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-about.html
@@ -0,0 +1,127 @@
+<div class="flexbox col padding lrp-32">
+    <div class="flexbox row lcol">
+        <div class="flexbox col">
+            <h2>Anapnoe UI-UX Core</h2>
+            <div class="column-1">
+                <p>Anapnoe UI-UX Core extension leverages a custom-made visual editor and a cutting-edge component library 
+					to facilitate the rapid development of sophisticated Gradio applications. 
+					In addition to its visually appealing design and well-planned layout, this extension
+                    offers several performance enhancements to both the <a href="https://github.com/AUTOMATIC1111/stable-diffusion-webui" target="_blank">Stable Diffusion web UI</a> and the 
+					<a target="_blank" href="https://gradio.app">Gradio</a>
+                    framework. These optimizations include:
+                </p>
+                <ul>
+                    <li>Replacing all default Gradio stylesheets in the DOM with an optimized version that promote
+                        better visual coherence across components.</li>
+                    <li>Eliminating inline styles and Svelte classes from the DOM to minimize clutter and improve
+                        efficiency.</li>
+                    <li>Removing unnecessary "img2img Extra Networks" from the DOM to reduce duplicated images and event
+                        listeners.</li>
+                    <li>Eradicating inline event listeners from "txt2img Extra Networks" cards and action buttons.</li>
+                    <li>Applying an event delegation pattern to further streamline the code by consolidating event
+                        handling for "txt2img Extra Networks" cards and action buttons.</li>
+                </ul>
+                <p>
+                    Although the current optimizations provide significant benefits, they are still applied after the
+                    DOM has been loaded. A more effective approach would be to eliminate these unnecessary elements
+                    entirely from the backend. This is an area for improvement and will be address in the future
+                    releases of
+                    <a href="https://github.com/anapnoe/stable-diffusion-webui-ux" target="_blank">Stable Diffusion web
+                        UI-UX</a>.										
+                </p>
+				<!-- <br>
+				<img alt="Anapnoe UI-UX default theme" src="./file=extensions/anapnoe-sd-uiux/html/images/anapnoe-ui-ux.png" lazy="true"/>
+                -->
+				<p>				
+				Any extensions that replicate "Extra Network Cards" will not be officially supported. 
+				However, if certain extensions hold significant value for your workflow, you can initiate a discussion. 
+				If the community expresses interest and support for these optimizations, 
+				I will be willing to submit pull requests to the extension's author to implement them.
+				</p> 					
+            </div>
+        </div>
+        <div class="flexbox col">
+            <h2>
+                Open Source
+            </h2>
+            <div class="column-1">
+                <p>
+                    Open source projects play a crucial role in protecting user privacy and security,
+                    advocating for unhindered access to source code, and nurturing a more transparent technology
+                    ecosystem.
+                    By supporting this project through your donation, you'll contribute to its ongoing development
+                    without any compromise
+                    from advertisements or corporate agendas, and ensure that it stays freely accessible, current, and
+                    open to all.
+                <blockquote>There is only so much time in a day that a person can otherwise give (Dave Glick).
+                </blockquote>
+                </p>
+            </div>
+		</div>
+		<div class="flexbox col">
+            <h2>
+                Sponsors & Supporters
+            </h2>
+            <div class="column-2">
+                <p>
+					Our sponsors and supporters will be prominently featured on a dedicated tab and on the GitHub page, 
+					highlighting their commitment to advancing innovation in development.
+                    As a heartfelt thank you, they'll get early access to all new features and premium add-ons.
+                
+                <blockquote>            
+                <a style="font-weight:600;" href="https://buymeacoffee.com/dayanbayah" target="_blank">Donate now, and join forces to
+                    create a sustainable realm of open source software that benefits everyone.
+                </a>
+                </blockquote>
+                </p>  
+            </div>
+			
+        </div>
+	</div>
+	<div class="flexbox col">
+	<h3>Upcoming add-ons for UI-UX</h3>
+	<div class="flexbox row lcol">
+		<div class="flexbox col">
+			 <h2>
+                Workspaces UI-UX
+            </h2>
+			<div class="column-1">
+                <p>
+                 With workspaces extension, you can craft personalized views and arrange them in any way that suits your preferences, 
+				 allowing you to tailor-make workflows that cater to your specific needs. 				 				
+				</p>				
+				<img alt="Anapnoe UI-UX default theme" src="./file=extensions/anapnoe-sd-uiux/html/images/workspaces.png" lazy="true"/>
+                <p>
+                    <a href="https://buymeacoffee.com/dayanbayah" target="_blank">Become a supporter</a> and get early access to Workspaces for UI-UX.
+                </p>             
+            </div>
+			
+            
+		</div>
+		<div class="flexbox col">
+            <h2>
+                Advanced Theme Style configurator [planned]
+            </h2>
+            <div class="column-1">
+                <p>
+					A sophisticated theme editor allowing you to personalize icons, fonts, and range sliders. 
+					Tailor the visual experience of the user interface with the Advanced Theme Style configurator.
+                </p>
+            </div>
+        </div>
+        <div class="flexbox col">
+            <h2>
+                Visual Builder for Gradio Apps [work in progress] 
+            </h2>
+            <div class="column-1">
+                <p>
+					Introducing a low-code visual editor builder for Gradio Apps. 
+                    Create templates and customize Gradio apps without extensive programming knowledge. Drag, drop, design, and deploy - all within a user-friendly interface. 
+                    Build anything from simple AI applications to complex enterprise solutions.                    
+                </p>
+                <img alt="Anapnoe Gradio Visual editor" src="./file=extensions/anapnoe-sd-uiux/html/images/anapnoe-gradio-app-visual-builder.png" lazy="true"/>
+            </div>
+        </div>
+    </div>
+	<div>
+</div>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-app-root.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-app-root.html
new file mode 100644
index 00000000..d3e2643a
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-app-root.html
@@ -0,0 +1,323 @@
+<div id="anapnoe_app" class="flexbox col app">
+    <div id="main_wrapper" class="flexbox row no-wrap">
+        <div id="main-nav" class="layout shrink initial panel ">
+            <div class="layout-header">
+                <button title="Anapnoe" tabItemId="#no-split-app, #about_tabitem" tabGroup="main_group" class="xtabs-tab no-drag">
+                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
+                        <polygon
+                            points="19.5,13.7 21.6,9.9 11.8,9.9 16.7,18.5 17.7,16.7 17.1,15.7 16.7,16.5 13.5,10.9 19.9,10.9 18.9,12.7 	" />
+                        <polygon
+                            points="17.3,11.7 15.8,11.7 20.2,19.3 3.8,19.3 12,5.2 14.2,9 15.8,9 12,2.5 1.5,20.7 22.5,20.7 	" />
+                    </svg>
+                </button>
+            </div>
+            <div id="main_nav_content" class="layout-content">
+				<!-- 
+				<button title="Workspace" id="workspace_nav" tabItemId="#no-split-app, #workspaces_tabitem" tabGroup="main_group"
+					data-click="#tabs" onclick="mainTabs(this, '#tab_anapnoe_dock')" class="xtabs-tab">
+					<div class="mask-icon icon-dock">
+					</div>
+					<span>Workspace</span>
+				</button> 
+				-->
+                <div id="main-nav-bar" class="flexbox col shrink">
+
+                    <button title="Txt2img" id="txt2img_nav" tabItemId="#split-app, #txt2img_tabitem" tabGroup="main_group"
+                        active="true" data-click="#tabs" onclick="mainTabs(this, '#tab_txt2img')" class="xtabs-tab">
+                        <div class="mask-icon icon-txt2img">
+                        </div>
+                        <span>Txt2img</span>
+                    </button>
+                    <button title="Img2img" id="img2img_nav" tabItemId="#split-app, #img2img_tabitem" tabGroup="main_group"
+                        data-click="#tabs" onclick="mainTabs(this, '#tab_img2img')" class="xtabs-tab">
+                        <div class="mask-icon icon-img2img">
+                        </div>
+                        <span>Img2img</span>
+                    </button>
+                    <button title="Extras" id="extras_nav" tabItemId="#split-app, #extras_tabitem" tabGroup="main_group"
+                        data-click="#tabs" onclick="mainTabs(this, '#tab_extras')" class="xtabs-tab">
+                        <div class="mask-icon icon-extras">
+                        </div>
+                        <span>Extras</span>
+                    </button>
+                    <!--  
+                    <button tabItemId="#model_merger_tabitem" tabGroup="main_group" onclick="mainTabs(this, '#tab_model_merger')" class="xtabs-tab">
+                        <div class="mask-icon icon-model-merger">
+                        </div>
+                        <span>Checkpoint Merger</span>
+                    </button> 
+                    -->
+                    <button title="Train" tabItemId="#split-app, #train_tabitem" tabGroup="main_group" data-click="#tabs"
+                        onclick="mainTabs(this, '#tab_train')" class="xtabs-tab">
+                        <div class="mask-icon icon-train">
+                        </div>
+                        <span>Train</span>
+                    </button>
+					
+					<!-- <button id="right_sidebar_button" tabItemId="#template-aside" tabGroup="main_group" class="xtabs-tab">
+					<div class="mask-icon icon-train"></div>
+					<span>Sidebar</span>
+					</button> -->
+					
+                    <div id="other_extensions" class="flexbox col">
+                    </div>
+					
+<!-- 					<button title="Sidebar" tabItemId="#template-right-sidebar" tabGroup="main_group" class="xtabs-tab">
+                        <div class="mask-icon icon-train">
+                        </div>
+                        <span>Sidebar</span>
+                    </button> -->
+                    <!-- 	
+                    <button tabItemId="#extensions_tabitem" tabGroup="main_group" data-click="#tabs" onclick="mainTabs(this, '#tab_extensions')" class="xtabs-tab">
+                        <div class="mask-icon icon-extensions">
+                        </div>
+                        <span >Extensions</span>
+                    </button> 
+                    -->
+                </div>
+            </div>
+            <div class="layout-footer">
+				<!-- 
+				<button title="Extensions" tabItemId="#no-split-app, #layout-extensions" tabGroup="main_group" id="btn_extensions" data-click="#tabs"
+                        onclick="mainTabs(this, '#tab_extensions')"class="xtabs-tab">
+				  <div class="mask-icon icon-extensions">
+				  </div>
+				  <span>Extensions</span>
+				</button>
+				<button title="Settings" tabItemId="#no-split-app, #layout-settings" tabGroup="main_group" id="btn_settings" data-click="#tabs"
+                        onclick="mainTabs(this, '#tab_settings')"class="xtabs-tab">
+					<div class="mask-icon icon-settings">
+					</div>
+					<span>Settings</span>
+				</button>
+                <div class="flexbox col spacer-v">
+				</div> 
+				-->				
+                <button title="Sponsors & Supporters" id="sponsors" tabItemId="#no-split-app, #sponsors_tabitem" tabGroup="main_group" class="xtabs-tab no-drag">
+                    <div class="mask-icon icon-vip">
+                    </div>
+                    <span>Sponsors & Supporters</span>
+                </button>
+                <button title="Contributors" id="contributors" tabItemId="#no-split-app, #contributors_tabitem" tabGroup="main_group" class="xtabs-tab no-drag">
+                    <div class="mask-icon icon-contributors">
+                    </div>
+                    <span>Contributors</span>
+                </button>
+				 <button id="popup_trigger" tabItemId="#popup_tabitem" tabGroup="popup_group" class="xtabs-tab">
+                    <div class="mask-icon icon-train">
+                    </div>
+                    <span>Popup</span>
+                </button>
+              <!--   <div class="ae-button">
+                    <div class="mask-icon accordion-icon icon-arrow-up">
+                    </div>
+                </div> -->
+            </div>
+        </div>
+
+
+		
+        <div id="layout_main_wrapper" class="layout grow initial">
+            <!--  
+            <div class="layout-header">
+                <div>Top Header
+                </div>
+            </div> 
+            -->
+			
+          
+				<!-- <div id="anapnoe_app_dock">
+                </div> -->
+				
+			<div class="layout-content">
+				<div class="flexbox row relative">
+			
+					<div id="no-split-app" class="xtabs-item">
+						<div id="about_tabitem_parent">
+							<div title="About" id="about_tabitem" class="xtabs-item no-padding">
+								<div id="template-about" class="template"></div>
+							</div>
+						</div>
+						<div id="sponsors_tabitem_parent">
+							<div title="Sponsors & Supporters" id="sponsors_tabitem" class="xtabs-item no-padding">
+								<div id="template-sponsors" class="template"></div>
+							</div>
+						</div>
+                        <div id="contributors_tabitem_parent">
+							<div title="Contributors" id="contributors_tabitem" class="xtabs-item no-padding">
+								
+							</div>
+						</div>
+						
+					<!-- 	<div id="template-extensions" class="template"></div>
+						<div id="template-settings" class="template"></div> -->
+						<!-- 	
+						<div title="Workspaces" id="workspaces_tabitem" class="xtabs-item  no-padding">
+							<div class="flexbox col">
+								<div id="workspaces_toolbar" class="flexbox row">								
+									
+								</div>
+								<div class="flexbox col">
+									<div data-parent-selector="gradio-app" data-selector="#tab_anapnoe_dock" class="portal no-bg">
+									</div>
+								</div>							
+							</div>
+							 
+						</div> 
+						-->
+					</div>
+			
+                    <div id="split-app" gutterSize="8" direction="horizontal" class="split">
+                        <div data-minSize="0" data-initSize="100" id="split-left" class="split-container">
+						<div id="txt2img_tabitem_parent">
+                            <div id="txt2img_tabitem" class="xtabs-item  no-padding">
+                                <div id="split" direction="horizontal" gutterSize="8" class="split">
+                                    <div title="txt2img params" data-minSize="0" data-initSize="50" id="iwse" class="split-container params">
+                                        <div id="template-txt2img-params" class="template"></div>
+                                    </div>
+                                    <div title="txt2img results" data-minSize="0" data-initSize="50" id="icly88" class="split-container">
+                                        <div id="template-txt2img-results" class="template"></div>
+                                    </div>
+                                </div>
+                            </div>
+							</div>
+							<div id="img2img_tabitem_parent">
+                            <div id="img2img_tabitem" class="xtabs-item  no-padding">
+                                <div id="split-img2img" direction="horizontal" gutterSize="8" class="split">
+                                    <div title="img2img params" title="txt2img" data-minSize="0" data-initSize="50" id="iwsei" class="split-container params">
+                                        <div id="template-img2img-params" class="template"></div>
+                                    </div>
+                                    <div title="img2img results" title="txt2img results" data-minSize="0" data-initSize="50" id="icly88i" class="split-container">
+                                        <div id="template-img2img-results" class="template"></div>
+                                    </div>
+                                </div>
+                            </div>
+							</div>
+							<div id="extras_tabitem_parent">
+                            <div id="extras_tabitem" class="xtabs-item  no-padding">
+                                <div id="splite" direction="horizontal" gutterSize="8" class="split">
+                                    <div title="Extras params" id="esp-c1" data-minSize="0" data-initSize="50" id="iwsee"
+                                        class="split-container params">
+                                        <div id="template-extras-params" class="template"></div>
+
+                                    </div>
+                                    <div title="Extras results" id="esp-c2" data-minSize="0" data-initSize="50" id="icly88e"
+                                        class="split-container">
+                                        <div id="template-extras-results" class="template"></div>
+                                    </div>
+                                </div>
+                            </div>
+							</div>
+                            <!--  
+                            <div id="model_merger_tabitem" class="xtabs-item">
+                                <div id="template-model-merger" class="template"></div>
+                                </div> 
+                            -->
+							<div id="train_tabitem_parent">
+                            <div id="train_tabitem" class="xtabs-item  no-padding">
+                                <div id="splitt" direction="horizontal" gutterSize="8" class="split">
+                                    <div title="Train params" id="esp-c1t" data-minSize="0" data-initSize="50" id="iwsee"
+                                        class="split-container params">
+                                        <div id="portal-39" data-parent-selector="gradio-app"
+                                            data-selector="#tab_train > div" class="portal no-bg">
+                                        </div>
+                                    </div>
+                                    <div title="Train results" id="esp-c2t" data-minSize="0" data-initSize="50" id="icly88e"
+                                        class="split-container">
+                                        <div id="template-train-results" class="template"></div>
+                                    </div>
+                                </div>
+                            </div>
+							</div>
+                            <div title="Popup" id="popup_tabitem" class="xtabs-item ae-popup">
+                                <div class="ae-popup-inner">
+                                    <div id="layout-popup-group" class="flexbox col">
+                                        <div id="layout-popup" class="layout">
+                                        <!-- 
+                                            <div class="layout-header">
+                                                <div class="flexbox col">
+                                                    <div id="md_title" data-parent-selector="#layout-popup-group" data-selector=".global-popup-inner .block.extra-network-name .extra-network-name" class="portal">
+                                                    </div>
+                                                </div>
+                                            </div> 
+                                        -->
+                                            <div class="layout-content">
+                                                <div class="flexbox col relative-height">
+                                                    <div id="portal-mn00" data-parent-selector=".global-popup"
+                                                        data-selector=".global-popup-inner" class="portal">
+                                                    </div>
+                                                    <button id="popup_close" tabGroup="popup_group" class="xtabs-tab no-drag">
+                                                        <div class="mask-icon icon-cancel">
+                                                        </div>
+                                                        <span>Close</span>
+                                                    </button>
+                                                </div>
+                                                <!-- 
+                                                <div id="portal-mn3" data-parent-selector="#layout-popup-group" data-selector=".global-popup-inner .block.extra-network-name + .form > .gradio-textbox" class="portal">
+                                                </div>                       
+                                                <div id="portal-mn5" data-parent-selector="#layout-popup-group" data-selector=".global-popup-inner .block.extra-network-name + .form + div + .form" class="portal">
+                                                </div>                                               
+                                                <div id="portal-mn6" data-parent-selector="#layout-popup-group" data-selector=".global-popup-inner [data-testid='highlighted-text'] .container" class="portal">
+                                                </div>                                                
+                                                <div id="portal-mn7" data-parent-selector="#layout-popup-group" data-selector=".global-popup-inner [data-testid='highlighted-text'] + .form > .gradio-textbox" class="portal">
+                                                </div>                                               
+                                                <div id="portal-mn8" data-parent-selector="#layout-popup-group" data-selector=".global-popup-inner [data-testid='highlighted-text'] + .form > .gradio-slider" class="portal">
+                                                </div>
+                                                <div class="flexbox col">
+                                                    <div id="md_rand" data-parent-selector="#layout-popup-group" data-selector=".global-popup-inner [data-testid='highlighted-text'] + .form + div .form" class="portal no-bg no-padding">
+                                                    </div>                                                   
+                                                    <div id="md_rand_generate" data-parent-selector="#layout-popup-group" data-selector=".global-popup-inner [data-testid='highlighted-text'] + .form + div button" class="portal">
+                                                    </div>
+                                                </div>
+                            
+                                                <div class="flexbox row">                       
+                                                    <div id="md_image" data-parent-selector="#layout-popup-group" data-selector=".global-popup-inner .gradio-html:has( .standalone-card-preview)" class="portal">
+                                                    </div>
+                                                    <div id="md_table" data-parent-selector="#layout-popup-group" data-selector=".global-popup-inner .block.extra-network-name + .form + div .gradio-html" class="portal">
+                                                    </div>
+                                                </div> 
+                                                -->
+                                            </div>
+                                            <!-- 	
+                                            <div class="layout-footer">	                      
+                                                <div id="portal-mn1" data-parent-selector="#layout-popup-group" data-selector=".global-popup-inner .edit-user-metadata-buttons" class="portal">
+                                                </div>                  
+                                            </div> 
+                                            -->
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- 			
+                            <div id="extensions_tabitem" class="xtabs-item">
+                            <div id="template-extensions" class="template"></div>
+                            </div> 
+                            -->
+                          <!--   <div title="About" id="about_tabitem" class="xtabs-item">
+                                <div id="template-about" class="template"></div>
+                            </div> -->
+
+                        </div>
+                        <div data-minSize="0" data-initSize="50" id="split-right" class="split-container no-drag">                           
+							<div id="template-aside-extra-networks" class="template"></div>
+                        </div>
+                    </div>
+                </div>				
+            </div>
+			
+			
+            <!--  
+            <div class="layout-footer">
+                <div>Footer
+                </div>
+            </div> 
+            -->
+        </div>
+    </div>
+    <!--   
+    <div class="flexbox col app_footer ">
+        <div id="portal-39f" data-parent-selector="#footer" data-selector=".prose.gradio-html" class="portal no-bg">
+        </div>
+    </div> 
+    -->
+</div>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-aside-extra-networks.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-aside-extra-networks.html
new file mode 100644
index 00000000..2a70aef9
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-aside-extra-networks.html
@@ -0,0 +1,123 @@
+<div id="accordion-aside" iconTrigger="#mask-icon-acc-arrow" class="accordion accordion-vertical no-drag">
+    <div class="accordion-bar">
+		<button id="ae-button" class="ae-button">
+			<div id="mask-icon-acc-arrow" class="mask-icon accordion-icon icon-arrow-down">
+			</div>
+		</button>
+		
+		<div id="sidebar_secondary_tabs" class="flexbox col">
+			<button class="ae-button">
+				<a title="Use via API" target="_blank" href="/docs" >
+					<div title ="Use via API" class="mask-icon icon-rocket">			
+					</div>
+				</a>
+			</button>
+			<button class="ae-button">
+				<a title="Github" target="_blank" href="https://github.com/anapnoe/stable-diffusion-webui-ux">
+					<div class="mask-icon icon-github">			
+					</div>
+				</a>
+			</button>
+			<button class="ae-button">
+				<a title="Gradio" target="_blank" href="https://gradio.app" >
+					<div class="mask-icon icon-gradio">			
+					</div>
+				</a>
+			</button>
+			<button class="ae-button">
+				<a title="Reload UI" href="/" onclick="javascript:gradioApp().getElementById('settings_restart_gradio').click(); return false">
+					<div class="mask-icon icon-reload">			
+					</div>
+				</a>
+			</button>
+			<div class="flexbox col spacer-v">
+            </div>
+		</div>
+        <div class="flexbox col">
+        </div>
+		
+        <div id="sidebar_tabs" class="flexbox col shrink">         
+			<button title="Quick Settings" tabItemId="#layout-quicksettings" tabGroup="extra_networks" id="btn_quick_settings" class="xtabs-tab">
+                <div  class="mask-icon icon-quicksettings">
+                </div>
+                <span>Quick Settings</span>
+            </button>
+            <button title="PNG Info" tabItemId="#layout-pnginfo" tabGroup="extra_networks" id="ptn_pnginfo" class="xtabs-tab">
+                <div class="mask-icon icon-pnginfo">
+                </div>
+                <span>PNG Info</span>
+            </button>
+            <button title="Checkpoint Merger" tabItemId="#layout-model-merger" tabGroup="extra_networks" onclick="mainTabs(this, '#tab_model_merger')" class="xtabs-tab">
+                <div class="mask-icon icon-model-merger">
+                </div>
+                <span>Checkpoint Merger</span>
+            </button>
+			<button title="Theme Editor" id="btn_theme_editor" tabItemId="#layout-theme" tabGroup="extra_networks" class="xtabs-tab hidden">
+                <div id="mask-icon-theme" class="mask-icon icon-theme">
+                </div>
+                <span>Theme</span>
+            </button>
+
+            <div class="flexbox col spacer-v">
+            </div>
+			<button title="Extensions" tabItemId="#layout-extensions" tabGroup="extra_networks" id="btn_extensions" class="xtabs-tab">
+			  <div class="mask-icon icon-extensions">
+			  </div>
+			  <span>Extensions</span>
+			</button>
+            <button title="Settings" tabItemId="#layout-settings" tabGroup="extra_networks" id="btn_settings" class="xtabs-tab">
+                <div class="mask-icon icon-settings">
+                </div>
+                <span>Settings</span>
+            </button>
+			<button title="Console Log" tabItemId="#layout-console-log" tabGroup="extra_networks" id="btn_console" class="xtabs-tab">
+                <div class="mask-icon icon-terminal">
+                </div>
+                <span>Console Log</span>
+            </button>
+        </div>
+		
+		<div id="sidebar_extra_networks" class="flexbox col shrink">
+            <button title="Checkpoints" tabItemId="#layout_txt2img_checkpoints" id="btn_checkpoints" tabGroup="extra_networks" data-click="#tab_txt2img" active="true" class="xtabs-tab">
+                <div class="mask-icon icon-checkpoints">
+                </div>
+                <span>Checkpoints</span>
+            </button>
+            <button title="Textual Inversion" tabItemId="#layout_txt2img_textual_inversion" id="btn_textual_inversion" tabGroup="extra_networks" data-click="#tab_txt2img" class="xtabs-tab">
+                <div class="mask-icon icon-textual-inversion">
+                </div>
+                <span>Textual Inversion</span>
+            </button>
+            <button title="Hypernetworks" tabItemId="#layout_txt2img_hypernetworks" id="btn_hypernetworks" tabGroup="extra_networks" data-click="#tab_txt2img" class="xtabs-tab">
+                <div class="mask-icon icon-hypernetworks">
+                </div>
+                <span>Hypernetworks</span>
+            </button>
+            <button title="Lora" tabItemId="#layout_txt2img_lora" id="btn_lora" tabGroup="extra_networks" data-click="#tab_txt2img" class="xtabs-tab">
+                <div class="mask-icon icon-lora">
+                </div>
+                <span>Lora</span>
+            </button>
+            <div class="flexbox col spacer-v">
+            </div>
+		</div>
+    </div>
+    <div class="accordion-container">
+        <div template="template-extra-networks" key="txt2img_checkpoints" id="en_txt2img_checkpoints" class="template"></div>
+        <div template="template-extra-networks" key="txt2img_textual_inversion" id="en_txt2img_textual_inversion" class="template"></div>
+        <div template="template-extra-networks" key="txt2img_hypernetworks" id="en_txt2img_hypernetworks" class="template"></div>
+        <div template="template-extra-networks" key="txt2img_lora" id="en_txt2img_lora" class="template"></div>
+        <div id="template-pnginfo" class="template"></div>
+        <div id="template-quicksettings" class="template"></div>
+		<div id="template-extensions" class="template"></div>
+        <div id="template-settings" class="template"></div>
+        <div id="template-model-merger" class="template"></div>
+		<div id="layout-console-log"></div>
+		<div id="layout-theme" class="flexbox col padding">		
+			<div show-button="#btn_theme_editor" data-selector="#tab_ui_theme > div" data-parent-selector="gradio-app" class="portal no-bg">
+			</div>
+        </div>
+
+		
+    </div>
+</div>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-extensions.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-extensions.html
new file mode 100644
index 00000000..450e894b
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-extensions.html
@@ -0,0 +1,15 @@
+<div id="layout-extensions" class="flexbox col">
+	<div id="layout-extensions-group" class="layout panel">
+		<div class="layout-header">       
+			<div class="flexbox row">
+				<div data-selector="#tabs_extensions .tab-nav" data-parent-selector="gradio-app" class="portal no-padding no-bg">
+				</div>
+			</div>
+		</div>
+		
+		<div class="layout-content tabs_extensions" >
+			<div data-selector="#tabs_extensions" data-parent-selector="gradio-app" class="portal no-padding">
+			</div>
+		</div>
+	</div>
+</div>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-extra-networks.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-extra-networks.html
new file mode 100644
index 00000000..7c40249c
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-extra-networks.html
@@ -0,0 +1,55 @@
+<div id="layout_{{template_key}}" class="layout no-padding-one layout-extra-networks">
+    <div class="flexbox row padding">
+        <button toggle="true" class="ae-button shrink show-dirs">
+            <div class="mask-icon icon-node-tree">
+            </div>
+        </button>
+        <button class="ae-button shrink refresh-extra-networks" data-click="#txt2img_extra_refresh">
+            <div class="mask-icon refresh">
+            </div>
+        </button>
+        <input id="{{template_key}}_search" data-target="#{{template_key}}_cards .card" class="search_extra_networks" type="text" placeholder="Search..">
+		
+		<select name="order_by" data-target="#{{template_key}}_cards .card" id="{{template_key}}_order_by" class="extra_networks_order_by">
+		  <option selected value="data-sort-default">Default Sort</option>
+		  <option value="data-sort-date_created">Date Created</option>
+		  <option value="data-sort-date_modified">Date Modified</option>
+		  <option value="data-sort-name">Name</option>
+		</select>
+		
+		<button toggle="true" class="ae-button shrink reverse-order">
+            <div class="mask-icon icon-sort">
+            </div>
+        </button>
+    </div>
+    <div id="{{template_key}}_aside_split" direction="horizontal" gutterSize="8" class="split">
+        <div id="{{template_key}}_aside" data-minSize="0" data-initSize="0" class="split-container no-drag">
+            <div class="layout">
+                <div class="layout-content">
+                    <div search-field="#{{template_key}}_search" data-selector="#{{template_key}}_subdirs" data-parent-selector="#tab_txt2img" class="portal">
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div id="{{template_key}}_main" data-minSize="0" data-initSize="100" class="split-container no-drag">
+            <div class="layout">
+                <div class="layout-content">
+                    <div class="xtabs auto-scroll">
+                        <div class="xtabs-items no-padding">
+                            <div id="{{template_key}}_cards_tabitem" class="xtabs-item">
+                                <div data-selector="#{{template_key}}_cards" data-parent-selector="#tab_txt2img" class="portal">
+                                </div>								
+                            </div>
+                        </div>
+                    </div>
+                </div>
+				<div id="{{template_key}}_main_footer" class="layout-footer ">
+				<div class="flexbox col model-preloader">
+				</div>
+				<div class="flexbox col model-selected">
+				</div>
+				</div>
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-extras-params.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-extras-params.html
new file mode 100644
index 00000000..f264df9b
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-extras-params.html
@@ -0,0 +1,97 @@
+<div class="layout">
+    <div class="layout-header">
+        <div class="flexbox row shrink panel padding no-br">
+			<div class="flexbox row flex-end">
+                <button class="ae-button">
+                    <div data-selector="#extras_generate" data-parent-selector="#tab_extras" droppable="true" class="portal no-bg shrink invisible">
+                        <div class="mask-icon icon-generate">
+                        </div>
+                        <span>Upscale</span>
+                    </div>
+                </button>
+            </div>
+        </div>
+    </div>
+    <div class="layout-content">
+        <div class="xtabs panel auto no-tr">
+            <div class="flexbox col shrink">
+                <div id="portal-53e" data-parent-selector="#tab_extras" data-selector="#mode_extras" class="portal min-width no-padding">
+                </div>
+                <div class="flexbox col">
+                    <div id="flexbox-18ihe" class="flexbox row wrap">
+                        <div id="flexbox-18iehe" class="flexbox row grow-all group no-wrap">
+                            <div class="flexbox panel col shrink">
+                                <button tabItemId="#extras_scale_by_tabitem" tabGroup="extras-scale-group" data-click="#tab_extras" active="true" class="xtabs-tab no-drag "><span
+                                        id="ir9t74">Scale by</span></button>
+                                <button tabItemId="#extras_scale_to_tabitem" tabGroup="extras-scale-group" data-click="#tab_extras" class="xtabs-tab no-drag"><span id="izj18e">Scale to</span></button>
+                            </div>
+                            <div class="flexbox col">
+                                <div class="xtabs sub-group no-padding">
+                                    <div class="xtabs-items">
+                                        <div class="flexbox col no-padding full-height">
+                                            <div id="extras_scale_to_tabitem" class="xtabs-item notransition inset initial">
+                                                <div class="flexbox row wrap">
+                                                    <div class="flexbox no-wrap row">
+                                                        <div class="flexbox col">
+                                                            <div id="portal-54e" data-parent-selector="#tab_extras" data-selector="#extras_upscaling_resize_w" class="portal">
+                                                            </div>
+                                                            <div id="portal-85e" data-parent-selector="#tab_extras" data-selector="#extras_upscaling_resize_h" class="portal">
+                                                            </div>
+                                                        </div>
+                                                        <div class="flexbox unset-min-width shrink col panel padding center">
+                                                            <div id="portal-86e" data-selector="#upscaling_res_switch_btn" data-parent-selector="#tab_extras" droppable="true"
+                                                                class="portal no-padding shrink invisible tool">
+                                                                <div class="mask-icon icon-res-switch">
+                                                                </div>
+                                                            </div>
+                                                            <button id="ae-button-crop" toggle="true" class="ae-button shrink tool">
+                                                                <div id="portal-106e" data-parent-selector="#tab_extras" data-selector="#extras_upscaling_crop" droppable="true"
+                                                                    class="portal shrink invisible tool">
+                                                                    <div class="mask-icon icon-crop">
+                                                                    </div>
+                                                                </div>
+                                                            </button>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                            <div id="extras_scale_by_tabitem" class="xtabs-item initial inset notransition">
+                                                <div class="flexbox col">
+                                                    <div id="portal-88e" data-parent-selector="#tab_extras" data-selector="#extras_upscaling_resize" class="portal min-width"></div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div id="portal-92e" data-parent-selector="#tab_extras" data-selector="#extras_upscaler_1" class="portal min-width">
+                </div>
+                <div class="flexbox group row">
+                    <div id="portal-94e" data-parent-selector="#tab_extras" data-selector="#extras_upscaler_2" class="portal min-width">
+                    </div>
+                    <div id="portal-98e" data-parent-selector="#tab_extras" data-selector="#extras_upscaler_2_visibility" class="portal min-width">
+                    </div>
+                </div>
+                <div id="portal-38e" data-parent-selector="#tab_extras" data-selector="#extras_gfpgan_visibility" class="portal min-width">
+                </div>
+                <div class="flexbox group row">
+                    <div id="portal-39e" data-parent-selector="#tab_extras" data-selector="#extras_codeformer_visibility" class="portal min-width">
+                    </div>
+                    <div id="portal-40e" data-parent-selector="#tab_extras" data-selector="#extras_codeformer_weight" class="portal min-width">
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="layout-footer hidden">
+        <div class="xtabs-tabs row panel">
+            <div id="portal-40ee" data-parent-selector="gradio-app" data-selector="#tab_extras" class="portal">
+            </div>
+			<div id="portal-7irt2ee" data-selector="#extras_resize_mode" data-parent-selector="#tab_extras" class="portal">
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-extras-results.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-extras-results.html
new file mode 100644
index 00000000..36a855ab
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-extras-results.html
@@ -0,0 +1,51 @@
+
+          <div id="flexbox-e6" class="flexbox col full-height border-padding">
+			<div id="portal-e21" data-selector="#extras_gallery" data-parent-selector="#tab_extras" class="portal full-height no-br" droppable="true">
+				<div class="flexbox col progress-flex">
+					<div data-selector="#extras_gallery_container" data-parent-selector="gradio-app" class="portal"></div>
+				</div>
+            </div>
+            <div id="accordion-e3" iconTrigger="#info_extras_icon_btn" class="accordion no-tr">
+              <div class="accordion-bar no-tr">
+                <div id="flexbox-e29" class="flexbox row center">
+                  <button id="info_extras_icon_btn" toggle="true" class="ae-button">
+                    <div class="mask-icon icon-info">
+                    </div>
+                  </button>
+                  <button id="ae-button-e2" class="ae-button">
+                    <div id="portal-e5" data-selector="#extras_open_folder" data-parent-selector="#tab_extras" droppable="true" class="portal invisible">
+                      <div id="mask-icon-e39" class="mask-icon icon-folder">
+                      </div>
+                    </div>
+                  </button>
+                  <button id="ae-button-e6" class="ae-button" data-click="#img2img_nav, #img2img_params">
+                    <div id="portal-e12" data-selector="#extras_send_to_inpaint" data-parent-selector="#tab_extras" droppable="true" class="portal invisible">
+                      <div id="mask-icon-e42" class="mask-icon icon-2inpaint">
+                      </div>
+                    </div>
+                  </button>
+                  <button id="ae-button-e5" class="ae-button" data-click="#extras_nav">
+                    <div id="portal-e13" data-selector="#extras_send_to_extras" data-parent-selector="#tab_extras" droppable="true" class="portal invisible">
+                      <div id="mask-icon-e43" class="mask-icon icon-2extras">
+                      </div>
+                    </div>
+                  </button>
+                  <button id="ae-button-e7" class="ae-button" data-click="#img2img_nav, #img2img_params">
+                    <div id="portal-e14" data-selector="#extras_send_to_img2img" data-parent-selector="#tab_extras" droppable="true" class="portal invisible">
+                      <div id="mask-icon-e44" class="mask-icon icon-2img2img">
+                      </div>
+                    </div>
+                  </button>
+                </div>
+              </div>
+              <div id="acc-ec-3" class="accordion-container">
+                <div id="flexbox-e4" class="flexbox col">
+                  <div id="portal-e30" data-parent-selector="#tab_extras" data-selector="#html_info_x_extras" class="portal hide-empty">
+                  </div>
+                  <div id="portal-e31" data-parent-selector="#tab_extras" data-selector="#html_info_extras" class="portal hide-empty">
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+      
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-params.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-params.html
new file mode 100644
index 00000000..7b56bc4b
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-params.html
@@ -0,0 +1,384 @@
+<div id="layout-img2img" class="layout">
+    <div class="layout-header">
+        <div class="flexbox row shrink panel padding no-br">
+            <div id="img2img_header" class="flexbox row no-wrap shrink no-labels flex-start group-row">
+                <button title="Prompts" tabItemId="#img2img_prompts_tabitem" tabGroup="img2img" id="img2img_prompts" active="true" class="xtabs-tab shrink">
+                    <div class="mask-icon icon-prompt">
+                    </div>
+                    <span>Prompts</span>
+                </button>
+                <button title="Prompts" tabItemId="#img2img_phystonPrompt_tabitem" tabGroup="img2img" id="btn_img2img_physton" class="xtabs-tab shrink hidden">
+                    <div class="mask-icon icon-physton">
+                    </div>
+                    <span>Physton</span>
+                </button>
+                <!--   <button tabItemId="#img2img_image_tabitem" tabGroup="img2img" id="ilnvy-2ii" class="xtabs-tab shrink">
+                    <div id="mask-icon-6-2i" class="mask-icon icon-image-edit">
+                    </div>
+                    <span>Image</span>
+                </button> -->
+                <button title="Parameters" tabItemId="#img2img_params_tabitem" tabGroup="img2img" id="img2img_params" class="xtabs-tab shrink">
+                    <div class="mask-icon icon-equalize">
+                    </div>
+                    <span>Params</span>
+                </button>
+                <button title="Scripts / Extensions" tabItemId="#img2img_scripts_tabitem" tabGroup="img2img" id="img2img_scripts" class="xtabs-tab">
+                    <div class="mask-icon icon-scripts">
+                    </div>
+                    <span>Scripts</span>
+                </button>
+             <!--    <button tabItemId="#img2img_temp_tabitem" tabGroup="img2img" class="xtabs-tab">
+                    <div id="mask-icon-28i" class="mask-icon icon-bug">
+                    </div>
+                </button> -->
+            </div>
+            <div class="flexbox row flex-end group-row">
+                <div title="Skip" data-selector="#img2img_skip" data-parent-selector="#tab_img2img" droppable="true" class="portal invisible shrink no-bg no-padding-one disable">
+                    <div class="mask-icon icon-skip">
+                    </div>
+                </div>
+                <div title="Interrupt" data-selector="#img2img_interrupt" data-parent-selector="#tab_img2img" droppable="true"
+                    class="portal invisible shrink no-bg no-padding-one disable">
+                    <div class="mask-icon icon-stop">
+                    </div>
+                </div>
+                
+				<button title="Generate" class="ae-button generate no-rr">
+					<div data-selector="#img2img_generate" data-parent-selector="#tab_img2img" droppable="true" class="portal no-bg shrink invisible">
+						<div class="mask-icon icon-generate">
+						</div>
+						<span>Generate</span>
+					</div>
+				</button>
+				<button title="Generate forever" id="img2img_loop" toggle="true" class="ae-button no-lr shrink">
+					<div  class="mask-icon icon-loop">
+					</div>
+				</button>
+               
+            </div>
+        </div>
+    </div>
+    <div class="layout-content">
+        <div class="xtabs panel no-padding no-tr">
+            <div class="xtabs-items">
+                <div id="img2img_image_tabitem_group" class="flexbox col">
+                    <div id="img2img_image_tabitem" class="xtabs-item">
+                        <div class="flexbox col">
+                            <!-- 
+                          <div id="portal-6im" data-selector="#mode_img2img" data-parent-selector="#tab_img2img" class="portal">
+                            </div> -->
+                            <!-- 	
+							  <div id="portal-6imn" data-selector="#resize_mode" data-parent-selector="#tab_img2img" class="portal">
+                            </div>
+							
+							
+							 <div id="portal-6imsw" data-selector="#inpaint_controls" data-parent-selector="#tab_img2img" class="portal">
+                            </div> -->
+                        </div>
+                    </div>
+                </div>
+                <div id="img2img_prompts_tabitem_group" class="flexbox col">
+                    <div id="img2img_prompts_tabitem" class="xtabs-item">
+                        <div class="layout">
+                            <div class="layout-header">
+                                <div class="flexbox row no-padding">
+                                    <div class="flexbox no-border no-bg shrink row">
+                                        <div data-parent-selector="#tab_img2img" data-selector="#img2img_tools #paste" droppable="true"
+                                            class="portal shrink invisible">
+                                            <div class="mask-icon icon-magic">
+                                            </div>
+                                        </div>
+                                        <div data-parent-selector="#img2img_tools" data-selector="#img2img_clear_prompt" droppable="true"
+                                            class="portal shrink invisible">
+                                            <div class="mask-icon icon-delete">
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="flexbox no-border no-bg row">
+                                        <div data-parent-selector="#img2img_styles_row" data-selector="#img2img_styles" class="portal no-min-width">
+                                        </div>
+                                        <div data-parent-selector="#tab_img2img" data-selector="#img2img_styles_edit_button" droppable="true"
+                                            class="portal shrink invisible">
+                                            <div class="mask-icon icon-styles-edit">
+                                            </div>
+                                        </div>
+										<div data-parent-selector="#tab_img2img" data-selector="#img2img_style_apply" droppable="true"
+                                            class="portal shrink invisible">
+                                            <div class="mask-icon icon-styles-apply">
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="layout-content">
+                                <div class="flexbox col">
+                                    <div id="split-2i" direction="vertical" gutterSize="8" class="split">
+                                        <div data-minSize="0" data-initSize="50" id="iubsli" class="split-container">
+                                            <div class="layout">
+                                               <!--  <div class="layout-header">
+                                                </div> -->
+                                                <div class="layout-content">
+                                                    <div data-selector="#img2img_prompt" data-parent-selector="#tab_img2img" class="portal no-bg">
+                                                    </div>
+                                                </div>
+                                                <div class="layout-footer">
+                                                    <div data-parent-selector="#img2img_prompt" data-selector="#img2img_token_counter.block" class="portal relative" data-timeout="1000">
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                        <div data-minSize="0" data-initSize="50" id="idyyfi" class="split-container">
+                                            <div class="layout">
+                                               <!--  <div class="layout-header">
+                                                </div> -->
+                                                <div class="layout-content">
+                                                    <div data-selector="#img2img_neg_prompt" data-parent-selector="#tab_img2img" class="portal no-bg">
+                                                    </div>
+                                                </div>
+                                                <div class="layout-footer">
+                                                    <div data-parent-selector="#img2img_neg_prompt" data-selector="#img2img_negative_token_counter.block" data-timeout="1000"
+                                                        class="portal relative">
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="layout-footer shrink">
+                                <div class="flexbox row">
+                                    <div data-parent-selector="#tab_img2img" data-selector="#interrogate" droppable="true"
+                                        class="portal shrink no-padding-one no-bg icon-left">
+                                        <div class="mask-icon question-answer">
+                                        </div>
+                                    </div>
+                                    <div data-parent-selector="#tab_img2img" data-selector="#deepbooru" droppable="true"
+                                        class="portal shrink no-padding-one no-bg icon-left">
+                                        <div class="mask-icon question-answer">
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div id="img2img_params_tabitem_group" class="flexbox col">
+                    <div id="img2img_params_tabitem" class="xtabs-item">
+                        <div class="flexbox col">
+                            <div data-selector="#mode_img2img" data-parent-selector="#tab_img2img" class="portal">
+                            </div>
+                        </div>						
+                        <div id="accordion_mask" class="accordion">
+                            <div class="accordion-bar">
+                                <span class="accordion-title">Inpaint options</span>
+                                <span class="accordion-icon">▼</span>
+                            </div>
+                            <div id="acc-ci" class="accordion-container">
+                                <div data-selector="#inpaint_controls" data-parent-selector="#tab_img2img" class="portal no-bg no-padding">
+                                </div>
+                            </div>
+                        </div>
+                        <div id="accordion_resize_mode" class="accordion">
+                            <div class="accordion-bar">
+                                <span class="accordion-title">Resize mode</span>
+                                <span class="accordion-icon">▼</span>
+                            </div>
+                            <div id="acc-cir" class="accordion-container">
+                                <div data-selector="#resize_mode" data-parent-selector="#tab_img2img" class="portal no-bg no-padding">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="flexbox col">
+                            <div class="flexbox row wrap">
+                                <div class="flexbox row grow-all group no-wrap fb-60">
+                                    <div class="flexbox panel col shrink">
+                                        <button tabItemId="#img2img_scale_to_tabitem" tabGroup="img2img-resize-group" data-click="#tab_img2img" active="true" class="xtabs-tab no-drag"><span
+                                                id="izj18eih">Resize to</span></button>
+                                        <button tabItemId="#img2img_scale_by_tabitem" tabGroup="img2img-resize-group" data-click="#tab_img2img" class="xtabs-tab no-drag"><span>Resize by</span></button>
+                                    </div>
+                                    <div class="flexbox col">
+                                        <div class="xtabs sub-group no-padding">
+                                            <div class="xtabs-items">
+                                                <div class="flexbox col no-padding full-height">
+                                                    <div id="img2img_scale_to_tabitem" class="xtabs-item initial inset notransition">
+                                                        <div class="flexbox row wrap">
+                                                            <div class="flexbox no-wrap row">
+                                                                <div class="flexbox col">
+                                                                    <div data-parent-selector="#tab_img2img" data-selector="#img2img_width" class="portal">
+                                                                    </div>
+                                                                    <div data-parent-selector="#tab_img2img" data-selector="#img2img_height" class="portal">
+                                                                    </div>
+                                                                </div>
+                                                                <div class="flexbox unset-min-width shrink col panel center">
+                                                                    <div data-selector="#img2img_detect_image_size_btn" data-parent-selector="#tab_img2img"
+                                                                        droppable="true" class="portal invisible tool">
+                                                                        <div class="mask-icon icon-ruler">
+                                                                        </div>
+                                                                    </div>
+                                                                    <div data-selector="#img2img_res_switch_btn" data-parent-selector="#tab_img2img"
+                                                                        droppable="true" class="portal invisible tool">
+                                                                        <div class="mask-icon icon-res-switch">
+                                                                        </div>
+                                                                    </div>
+                                                                    <div data-selector="#img2img_dimensions_row" data-parent-selector="#tab_img2img"
+                                                                        class="portal invisible tool">
+                                                                    </div>
+                                                                </div>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                    <div id="img2img_scale_by_tabitem" class="xtabs-item initial inset notransition">
+                                                        <div class="flexbox col group inset subgroup">
+                                                            <div data-parent-selector="#tab_img2img" data-selector="#img2img_scale" class="portal"></div>
+                                                            <div data-parent-selector="#tab_img2img" data-selector="#img2img_scale_resolution_preview"
+                                                                class="portal"></div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                                <div class="flexbox group col fb-40">
+									<!-- <div id="flexbox-14wi" class="flexbox row"> -->
+										<div data-parent-selector="#tab_img2img" data-selector="#img2img_batch_size" class="portal">
+										</div>
+										<div data-parent-selector="#tab_img2img" data-selector="#img2img_batch_count" class="portal">
+										<!-- </div> -->
+									</div>
+								</div>
+                            </div>
+                        </div>
+                        <div class="flexbox group row">
+                            <div data-parent-selector="#tab_img2img" data-selector="#img2img_sampling" class="portal min-width">
+                            </div>
+                            <div data-parent-selector="#tab_img2img" data-selector="#img2img_cfg_scale" class="portal min-width">
+                            </div>
+                            <div data-parent-selector="#tab_img2img" data-selector="#img2img_steps" class="portal min-width">
+                            </div>
+                            <div data-parent-selector="#tab_img2img" data-selector="#img2img_denoising_strength" class="portal min-width">
+                            </div>
+                        </div>
+                        <div class="flexbox group col">
+                            <div class="flexbox row">
+                                <div class="flexbox no-border row">
+                                    <div data-parent-selector="#tab_img2img" data-selector="#img2img_seed" class="portal no-min-width">
+                                    </div>
+                                    <div data-parent-selector="#tab_img2img" data-selector="#img2img_random_seed" droppable="true" class="portal invisible shrink">
+                                        <div class="mask-icon icon-dice">
+                                        </div>
+                                    </div>
+                                    <div data-parent-selector="#tab_img2img" data-selector="#img2img_reuse_seed" droppable="true" class="portal shrink invisible">
+                                        <div class="mask-icon icon-recycle">
+                                        </div>
+                                    </div>
+                                    <button toggle="true" class="ae-button shrink toggle-seed">
+                                        <div data-parent-selector="#tab_img2img" data-selector="#img2img_subseed_show" droppable="true"
+                                            class="portal shrink invisible tool">
+                                            <div class="mask-icon icon-equalize">
+                                            </div>
+                                        </div>
+                                    </button>
+                                </div>
+                            </div>
+                            <div data-parent-selector="#tab_img2img" data-selector="#img2img_seed_extras" droppable="true" class="portal sub-group">
+                                <div class="flexbox col">
+                                    <div class="flexbox row">
+                                        <div class="flexbox no-border min-width fb-50 row">
+                                            <div data-parent-selector="#tab_img2img" data-selector="#img2img_subseed" class="portal no-min-width">
+                                            </div>
+                                            <div data-parent-selector="#tab_img2img" data-selector="#img2img_random_subseed" droppable="true"
+                                                class="portal shrink invisible">
+                                                <div class="mask-icon icon-dice">
+                                                </div>
+                                            </div>
+                                            <div data-parent-selector="#tab_img2img" data-selector="#img2img_reuse_subseed" droppable="true"
+                                                class="portal shrink invisible">
+                                                <div class="mask-icon icon-recycle">
+                                                </div>
+                                            </div>
+                                        </div>
+                                        <div class="flexbox row fb-50">
+                                            <div data-parent-selector="#tab_img2img" data-selector="#img2img_subseed_strength" class="portal min-width fb-50">
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="flexbox row wrap">
+                                        <div data-parent-selector="#tab_img2img" data-selector="#img2img_seed_resize_from_w" class="portal min-width">
+                                        </div>
+                                        <div data-parent-selector="#tab_img2img" data-selector="#img2img_seed_resize_from_h" class="portal min-width">
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div data-selector="#img2img_enable" data-parent-selector="#tab_img2img" class="portal">
+                        </div>
+                        <div data-selector="#img2img_override_settings_row" data-parent-selector="#tab_img2img" class="portal no-padding no-bg hide-empty">
+                        </div>
+						<div data-selector="#layout-img2img .gradio-accordion:has( div[id^='setting_'])" data-parent-selector="gradio-app" class="portal hide-empty">
+                        </div>
+                        <div data-selector="#img2img_container_aspect_ratio" data-parent-selector="#tab_img2img" class="portal hide-empty">
+                        </div>
+                    </div>
+                </div>
+                <div id="img2img_scripts_tabitem_group" class="flexbox col">
+                    <div id="img2img_scripts_tabitem" class="xtabs-item">
+                        <div data-selector="#img2img_script_container" data-parent-selector="#tab_img2img" class="portal no-bg">
+                        </div>
+                    </div>
+                </div>
+                <div id="img2img_phystonPrompt_tabitem_group" class="flexbox col">
+                    <div id="img2img_phystonPrompt_tabitem" class="xtabs-item">						
+                        <div id="split-physton-img2img" direction="vertical" gutterSize="8" class="split">
+
+                            <div data-minSize="0" data-initSize="50" id="iubslphi" class="split-container">
+                                    <div  show-button="#btn_img2img_physton" data-selector="#phystonPrompt_img2img_prompt" data-parent-selector="#tab_img2img" class="portal no-bg no-padding">
+                                </div>
+                            </div>
+
+                            <div data-minSize="0" data-initSize="50" id="idyyfphi" class="split-container">
+                                    <div data-selector="#phystonPrompt_img2img_neg_prompt" data-parent-selector="#tab_img2img" class="portal no-bg no-padding">
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div id="img2img_temp_tabitem_group" class="flexbox col hidden">
+                    <div id="img2img_temp_tabitem" class="xtabs-item">
+                        <div id="accordioni" class="accordion">
+                            <div class="accordion-bar">
+                                <span class="accordion-title">Prompts &amp; Styles</span>
+                                <span class="accordion-icon">▼</span>
+                            </div>
+                            <div id="acc-ci" class="accordion-container">
+                            </div>
+                        </div>
+                        <div data-selector="#tab_img2img" data-parent-selector="gradio-app" class="portal">
+                        </div>
+						<div data-selector="#img2img_column_size .tab-nav" data-parent-selector="#tab_img2img" class="portal">
+                        </div>
+						<div data-selector="#img2img_gallery_container" data-parent-selector="gradio-app" class="portal">
+                        </div>
+						<div data-selector="#img2img_generation_info_button" data-parent-selector="gradio-app" class="portal">
+						</div>
+						<!--   
+						<div data-selector="#img2img_extra_tabs" data-parent-selector="#tab_img2img" droppable="true" class="portal">
+                        </div>
+                        <div data-selector="#img2img_settings" data-parent-selector="#tab_img2img" class="portal">
+                        </div> 
+						-->
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <!--  <div class="layout-footer">
+        <div class="xtabs-tabs row panel">
+            <button tabItemId="#img2img_temp_tabitem" tabGroup="img2img" class="xtabs-tab">
+                <div class="mask-icon icon-bug">
+                </div>
+            </button>
+        </div>
+    </div> -->
+</div>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-results.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-results.html
new file mode 100644
index 00000000..ff6041c3
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-results.html
@@ -0,0 +1,65 @@
+
+          <div id="flexbox-61" class="flexbox col full-height border-padding">
+			<div id="portal-212" data-selector="#img2img_gallery" data-parent-selector="#tab_img2img" class="portal full-height no-br" droppable="true">
+				<div class="flexbox col progress-flex">
+					<div data-selector="#img2img_gallery_container" data-parent-selector="gradio-app" class="portal"></div>
+				</div>
+            </div>
+            <div id="accordion-33" iconTrigger="#info_icon_btn_img2img" class="accordion no-tr">
+              <div class="accordion-bar no-tr">
+                <div id="flexbox-294" class="flexbox row center">
+                  <button id="info_icon_btn_img2img" toggle="true" class="ae-button">
+                    <div id="info_icon" class="mask-icon icon-info">
+                    </div>
+                  </button>
+                  <button id="ae-button-27" class="ae-button">
+                    <div id="portal-5" data-selector="#img2img_open_folder" data-parent-selector="#tab_img2img" droppable="true" class="portal invisible">
+                      <div id="mask-icon-39" class="mask-icon icon-folder">
+                      </div>
+                    </div>
+                  </button>
+                  <button id="ae-button-38" class="ae-button">
+                    <div id="portal-10" data-selector="#save_img2img" data-parent-selector="#tab_img2img" droppable="true" class="portal invisible">
+                      <div id="mask-icon-40" class="mask-icon icon-save">
+                      </div>
+                    </div>
+                  </button>
+                  <button id="ae-button-49" class="ae-button">
+                    <div id="portal-11" data-selector="#save_zip_img2img" data-parent-selector="#tab_img2img" droppable="true" class="portal invisible">
+                      <div id="mask-icon-41" class="mask-icon icon-zip">
+                      </div>
+                    </div>
+                  </button>
+                  <button id="ae-button-60" class="ae-button" data-click="#img2img_nav, #img2img_params">
+                    <div id="portal-12" data-selector="#img2img_send_to_inpaint" data-parent-selector="#tab_img2img" droppable="true" class="portal invisible">
+                      <div id="mask-icon-42" class="mask-icon icon-2inpaint">
+                      </div>
+                    </div>
+                  </button>
+                  <button id="ae-button-51" class="ae-button" data-click="#extras_nav">
+                    <div id="portal-13" data-selector="#img2img_send_to_extras" data-parent-selector="#tab_img2img" droppable="true" class="portal invisible">
+                      <div id="mask-icon-43" class="mask-icon icon-2extras">
+                      </div>
+                    </div>
+                  </button>
+                  <button id="ae-button-72" class="ae-button" data-click="#img2img_nav, #img2img_params">
+                    <div id="portal-14" data-selector="#img2img_send_to_img2img" data-parent-selector="#tab_img2img" droppable="true" class="portal invisible">
+                      <div id="mask-icon-44" class="mask-icon icon-2img2img">
+                      </div>
+                    </div>
+                  </button>
+                </div>
+              </div>
+              <div id="acc-c-33" class="accordion-container">
+                <div id="flexbox-43" class="flexbox col">
+                  <div id="portal-293" data-parent-selector="#tab_img2img" data-selector="#download_files_img2img" data-vis="true" class="portal shrink hide-empty">
+                  </div>
+                  <div id="portal-303" data-parent-selector="#tab_img2img" data-selector="#html_info_img2img" data-vis="true" class="portal hide-empty">
+                  </div>
+                  <div id="portal-313" data-parent-selector="#tab_img2img" data-selector="#html_log_img2img" data-vis="true" class="portal hide-empty">
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+      
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-model-merger.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-model-merger.html
new file mode 100644
index 00000000..d70d6058
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-model-merger.html
@@ -0,0 +1,129 @@
+
+          <div id="layout-model-merger" class="layout">
+            <div class="layout-header panel no-br">
+			
+			   <button id="ae-button-8" class="ae-button">
+                    <div id="portal" data-selector="#modelmerger_merge" data-parent-selector="#tab_modelmerger" droppable="true" class="portal no-bg shrink invisible">
+                      <div id="mask-icon-8" class="mask-icon icon-generate">
+                      </div>
+                      <span>Merge models</span>
+                    </div>
+                  </button>
+            
+            </div>
+            <div id="i0sfvmm" class="layout-content">
+              <div id="xtabmm" class="xtabs panel no-tr no-br no-padding">
+                <div id="xtabs-itemsmm" class="xtabs-items">
+                
+                  
+                  <div id="modelmerger_params_tabitem_group" class="flexbox col">
+                    <div id="modelmerger_params_tabitem" class="xtabs-item">
+                      <div id="flexbox-27m" class="flexbox col">
+                       
+                       
+						
+						<div id="portal-781ad" data-selector="#modelmerger_interp_description" data-parent-selector="#tab_modelmerger" class="portal">
+                        </div>
+						
+						
+						<div id="flexbox-227mvn" class="flexbox row">
+						
+						
+						
+						  <div id="flexbox-227a" class="flexbox no-border min-width fb-50 row">
+							<div id="portal-678a" data-parent-selector="#tab_modelmerger" data-selector="#modelmerger_primary_model_name" class="portal no-min-width">
+							</div>
+							<div id="portal-689a" data-parent-selector="#tab_modelmerger" data-selector="#refresh_checkpoint_A" droppable="true" class="portal shrink invisible">
+							  <div id="mask-icon-166a" class="mask-icon refresh">
+							  </div>
+							</div> 
+						  </div>
+						  
+						  <div id="flexbox-227b" class="flexbox no-border min-width fb-50 row">
+							<div id="portal-678b" data-parent-selector="#tab_modelmerger" data-selector="#modelmerger_secondary_model_name" class="portal no-min-width">
+							</div>
+							<div id="portal-689b" data-parent-selector="#tab_modelmerger" data-selector="#refresh_checkpoint_B" droppable="true" class="portal shrink invisible">
+							  <div id="mask-icon-166b" class="mask-icon refresh">
+							  </div>
+							</div> 
+						  </div>
+						  
+						  <div id="flexbox-227c" class="flexbox no-border min-width fb-50 row">
+							<div id="portal-678c" data-parent-selector="#tab_modelmerger" data-selector="#modelmerger_tertiary_model_name" class="portal no-min-width">
+							</div>
+							<div id="portal-689c" data-parent-selector="#tab_modelmerger" data-selector="#refresh_checkpoint_C" droppable="true" class="portal shrink invisible">
+							  <div id="mask-icon-166c" class="mask-icon refresh">
+							  </div>
+							</div> 
+						  </div>
+						  
+						  </div>
+						
+						
+						
+						<div id="portal-781am" data-selector="#modelmerger_custom_name" data-parent-selector="#tab_modelmerger" class="portal">
+                        </div>
+						
+						<div id="portal-782am" data-selector="#modelmerger_interp_amount" data-parent-selector="#tab_modelmerger" class="portal">
+                        </div>
+						
+						<div id="portal-783am" data-selector="#modelmerger_interp_method" data-parent-selector="#tab_modelmerger" class="portal">
+                        </div>
+						<div id="flexbox-227m" class="flexbox row">
+						<div id="portal-784am" data-selector="#modelmerger_checkpoint_format" data-parent-selector="#tab_modelmerger" class="portal min-width">
+                        </div>
+						
+						<div id="portal-785am" data-selector="#modelmerger_save_as_half" data-parent-selector="#tab_modelmerger" class="portal">
+                        </div>
+						</div>
+						
+						<div id="flexbox-227mv" class="flexbox row">
+						<div id="portal-786am" data-selector="#modelmerger_config_method" data-parent-selector="#tab_modelmerger" class="portal min-width fb-50">
+                        </div>
+						
+						
+						  <div id="flexbox-227" class="flexbox no-border min-width fb-50 row">
+							<div id="portal-678" data-parent-selector="#tab_modelmerger" data-selector="#modelmerger_bake_in_vae" class="portal no-min-width">
+							</div>
+							<div id="portal-689" data-parent-selector="#tab_modelmerger" data-selector="#modelmerger_refresh_bake_in_vae" droppable="true" class="portal shrink invisible">
+							  <div id="mask-icon-166u" class="mask-icon refresh">
+							  </div>
+							</div> 
+						  </div>
+						  </div>
+						
+						<div id="portal-78amu1" data-selector="#modelmerger_discard_weights" data-parent-selector="#tab_modelmerger" class="portal">
+                        </div>
+						
+						<div id="portal-78amu3" data-selector="#tab_modelmerger .gradio-accordion" data-parent-selector="gradio-app" class="portal">
+                        </div>
+						
+						
+                       
+
+						
+						
+                      </div>
+                    </div>
+                  </div>
+               
+			   
+                
+                </div>
+              </div>
+            </div>
+            <div class="layout-footer">
+              <div class="xtabs-tabs row panel no-tr">
+               
+
+
+   <div id="portal-78amu2" data-selector="#modelmerger_results_container" data-parent-selector="#tab_modelmerger" class="portal">
+                        </div>
+               
+
+            
+			   
+			   
+              </div>
+            </div>
+          </div>
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-pnginfo.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-pnginfo.html
new file mode 100644
index 00000000..f77ab7cb
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-pnginfo.html
@@ -0,0 +1,47 @@
+<div id="layout-pnginfo-group" class="flexbox col">
+	<div id="layout-pnginfo" class="layout">
+	  <div class="layout-header">
+		<div id="flexbox-10" class="flexbox row panel icons-bar center no-padding">
+		<button id="ae-button-e77" class="ae-button" data-click="#txt2img_nav, #txt2img_params">
+		  <div id="portal-26" data-selector="#txt2img_tab" data-parent-selector="#tab_pnginfo" droppable="true" class="portal invisible">
+			<div id="icon-2" class="mask-icon icon-2txt2img">
+			</div>
+		  </div>
+		  </button>
+		  <button id="ae-button-e78" class="ae-button" data-click="#img2img_nav, #img2img_params">
+		  <div id="portal-15" data-selector="#img2img_tab" data-parent-selector="#tab_pnginfo" droppable="true" class="portal invisible">
+			<div id="mask-icon-45" class="mask-icon icon-2img2img">
+			</div>
+		  </div>
+		  </button>
+		  <button id="ae-button-e79" class="ae-button" data-click="#img2img_nav, #img2img_params">
+		  <div id="portal-27" data-selector="#inpaint_tab" data-parent-selector="#tab_pnginfo" droppable="true" class="portal invisible">
+			<div id="icon-9" class="mask-icon icon-2inpaint">
+			</div>
+		  </div>
+		  </button>
+		  <button id="ae-button-e76" class="ae-button" data-click="#extras_nav">
+		  <div id="portal-28" data-selector="#extras_tab" data-parent-selector="#tab_pnginfo" droppable="true" class="portal invisible">
+			<div id="icon-8" class="mask-icon icon-2extras">
+			</div>
+		  </div>
+		  </button>
+		</div>
+	  </div>
+	  <div class="layout-content">
+		<div id="png_info_tabitem" class="xtabs-item full-height no-padding">
+		  <div id="split-4" direction="vertical" gutterSize="8" class="split">
+			<div data-minSize="0" data-initSize="50" id="ipp8cu" class="split-container">
+			  <div id="portal-8" data-selector="#pnginfo_image" data-parent-selector="#tab_pnginfo" class="portal full-height object-fit no-padding-one no-bg">
+			  </div>
+			</div>
+			<div data-minSize="0" data-initSize="50" id="iskes7" class="split-container">
+			  <div id="portal-9" data-selector="#tab_pnginfo textarea" data-parent-selector="gradio-app" class="portal full-height no-padding-one no-bg">
+			  </div>
+			</div>
+		  </div>
+		</div>
+	  </div>
+	</div>
+</div>
+             
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-quicksettings.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-quicksettings.html
new file mode 100644
index 00000000..00b1d172
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-quicksettings.html
@@ -0,0 +1,21 @@
+
+			  
+			  
+			  
+
+			  
+              <div id="layout-quicksettings-group" class="flexbox col">
+                <div id="layout-quicksettings" class="layout">
+                  <div class="layout-header">
+                  </div>
+                  <div class="layout-content">
+                    <div id="quicksettings_tabitem" class="xtabs-item">
+                      <div id="portal-4" data-selector="#quicksettings" data-parent-selector="gradio-app" class="portal">
+                      </div>
+                    </div>
+                  </div>
+                  <div class="layout-footer">
+                  </div>
+                </div>
+              </div>
+	
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-settings.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-settings.html
new file mode 100644
index 00000000..96e4b351
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-settings.html
@@ -0,0 +1,35 @@
+<div id="layout-settings-group" class="flexbox col">
+    <div id="layout-settings" class="layout">
+        <div class="layout-header">
+            <div class="flexbox row no-border no-br">              
+                <div data-selector="#settings_show_all_pages" data-parent-selector="#tab_settings" class="portal no-padding">
+                </div>
+				 <div data-selector="#settings_restart_gradio" data-parent-selector="#tab_settings" class="portal">
+                </div>
+                <div data-selector="#settings_submit" data-parent-selector="#tab_settings" class="portal">
+                </div>
+            </div>
+			<div data-selector="#settings_result" data-parent-selector="#tab_settings" data-vis="true" class="portal no-br no-tr hide-empty">
+			</div> 
+        </div>
+        <div class="layout-content">
+            <div id="split-settings" direction="horizontal" gutterSize="8" class="split panel no-tr">
+                <div data-minSize="0" data-initSize="10" id="split-settings-left" class="split-container">
+                    <div data-selector="#tab_settings .tab-nav" data-parent-selector="gradio-app" class="portal settings-tabs no-padding no-bg">
+                    </div>
+					
+                </div>
+                <div data-minSize="0" data-initSize="90" id="split-settings-right" class="split-container">
+                    <div class="xtabs-item">
+                        <div data-selector="#tab_settings > div" data-parent-selector="gradio-app" class="portal no-padding">
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+      <!--   
+		<div class="layout-footer">
+                    
+        </div> -->
+    </div>
+</div>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-sponsors.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-sponsors.html
new file mode 100644
index 00000000..fe35403c
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-sponsors.html
@@ -0,0 +1,13 @@
+<div class="flexbox col padding lrp-32">
+    <div class="flexbox row lcol">
+        <div class="flexbox col">
+            <h2>
+                💎 Sponsors
+            </h2>
+            
+            <h2>
+                🥇 Supporters
+            </h2>          
+        </div>
+	</div>
+</div>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-theme.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-theme.html
new file mode 100644
index 00000000..73acf38a
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-theme.html
@@ -0,0 +1,22 @@
+
+			  
+			  
+			  <div id="layout-theme-group" class="flexbox col">
+                <div id="layout-theme" class="layout">
+                  <div class="layout-header">
+                    <div id="flexbox-1011" class="flexbox row panel no-padding">
+                      <div id="portal-8811" data-selector="#tab_ui_theme .svelte-vt1mxs" data-parent-selector="gradio-app" class="portal full-height object-fit no-padding-one no-bg">
+                      </div>
+                    </div>
+                  </div>
+                  <div class="layout-content">
+                    <div id="theme_tabitem" class="xtabs-item full-height no-padding">
+                      <div id="portal-theme" data-selector="#theme_overflow_container" data-parent-selector="#tab_ui_theme" class="portal full-height object-fit no-padding-one no-bg">
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+
+			  
+    
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-train-results.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-train-results.html
new file mode 100644
index 00000000..aeeb6005
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-train-results.html
@@ -0,0 +1,17 @@
+
+          <div id="flexbox-61t" class="flexbox col full-height border-padding">
+            <div id="portal-212t" data-selector="#ti_gallery" data-parent-selector="#tab_train" class="portal full-height no-br">
+            </div>
+            
+			<div class="flexbox col panel shrink no-tr">
+             <div id="portal-212t1" data-selector="#ti_output" data-parent-selector="#tab_train" class="portal">
+            </div>
+			 <div id="portal-212t2" data-selector="#ti_progress" data-parent-selector="#tab_train" class="portal">
+            </div>
+			 <div id="portal-212t3" data-selector="#ti_error" data-parent-selector="#tab_train" class="portal">
+            </div>
+			</div>
+           
+		   
+          </div>
+      
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-params.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-params.html
new file mode 100644
index 00000000..68d40ffa
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-params.html
@@ -0,0 +1,302 @@
+<div id="layout-txt2img" class="layout">
+    <div class="layout-header">
+        <div class="flexbox row shrink panel padding no-br">
+            <div id="txt2img_header" class="flexbox row no-wrap shrink flex-start group-row">
+                <button title="Prompts" tabItemId="#txt2img_prompts_tabitem" tabGroup="txt2img" id="txt2img_prompts" active="true" class="xtabs-tab shrink">
+                    <div class="mask-icon icon-prompt">
+                    </div>
+                    <span>Prompts</span>
+                </button>
+                <button title="Prompts" tabItemId="#txt2img_phystonPrompt_tabitem" tabGroup="txt2img" id="btn_txt2img_physton" class="xtabs-tab shrink hidden">
+                    <div class="mask-icon icon-physton">
+                    </div>
+                    <span>Physton</span>
+                </button>
+                
+                <button title="Parameters" tabItemId="#txt2img_params_tabitem" tabGroup="txt2img" id="txt2img_params" class="xtabs-tab shrink">
+                    <div class="mask-icon icon-equalize">
+                    </div>
+                    <span>Params</span>
+                </button>
+                <button title="Scripts / Extensions" tabItemId="#txt2img_scripts_tabitem" tabGroup="txt2img" id="txt2img_scripts" class="xtabs-tab">
+                    <div class="mask-icon icon-scripts">
+                    </div>
+                    <span>Scripts</span>
+                </button>
+               <!--  <button tabItemId="#txt2img_temp_tabitem" tabGroup="txt2img" class="xtabs-tab">
+                    <div class="mask-icon icon-bug">
+                    </div>
+                </button> -->
+            </div>
+            <div class="flexbox row flex-end group-row">
+                <div title="Skip" data-selector="#txt2img_skip" data-parent-selector="#tab_txt2img" droppable="true" class="portal invisible shrink no-bg no-padding-one disable">
+                    <div class="mask-icon icon-skip">
+                    </div>
+                </div>
+                <div title="Interrupt" data-selector="#txt2img_interrupt" data-parent-selector="#tab_txt2img" droppable="true"
+                    class="portal invisible shrink no-bg no-padding-one disable">
+                    <div class="mask-icon icon-stop">
+                    </div>
+                </div>
+                <button title="Generate" class="ae-button generate">
+                    <div data-selector="#txt2img_generate" data-parent-selector="#tab_txt2img" droppable="true" class="portal no-bg shrink invisible">
+                        <div class="mask-icon icon-generate">
+                        </div>
+                        <span>Generate</span>
+                    </div>
+                </button>
+                <button title="Generate forever" id="txt2img_loop" toggle="true" class="ae-button shrink">
+                    <div id="mask-icon-loop" class="mask-icon icon-loop">
+                    </div>
+                </button>
+            </div>
+        </div>
+    </div>
+    <div class="layout-content">
+        <div class="xtabs panel no-tr no-padding">
+            <div class="xtabs-items">
+                <div id="txt2img_prompts_tabitem_group" class="flexbox col">
+                    <div id="txt2img_prompts_tabitem" class="xtabs-item">
+                        <div class="layout">
+                            <div class="layout-header">
+                                <div class="flexbox no-padding row">
+                                    <div class="flexbox no-border no-bg shrink row">
+                                        <div data-parent-selector="#tab_txt2img" data-selector="#txt2img_tools #paste" droppable="true"
+                                            class="portal shrink invisible">
+                                            <div class="mask-icon icon-magic">
+                                            </div>
+                                        </div>
+                                        <div data-parent-selector="#txt2img_tools" data-selector="#txt2img_clear_prompt" droppable="true"
+                                            class="portal shrink invisible">
+                                            <div class="mask-icon icon-delete">
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="flexbox no-border no-bg row">
+                                        <div data-parent-selector="#txt2img_styles_row" data-selector="#txt2img_styles" class="portal no-min-width">
+                                        </div>
+                                        <div data-parent-selector="#tab_txt2img" data-selector="#txt2img_styles_edit_button" droppable="true"
+                                            class="portal shrink invisible">
+                                            <div class="mask-icon icon-styles-edit">
+                                            </div>
+                                        </div>
+										<div data-parent-selector="#tab_txt2img" data-selector="#txt2img_style_apply" droppable="true"
+                                            class="portal shrink invisible">
+                                            <div class="mask-icon icon-styles-apply">
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="layout-content">
+                                <div class="flexbox col">
+                                    <div id="split-2" direction="vertical" gutterSize="8" class="split">
+                                        <div data-minSize="0" data-initSize="50" id="iubsl" class="split-container">
+                                            <div class="layout">
+                                              <!--   <div class="layout-header">
+                                                </div> -->
+                                                <div class="layout-content">
+                                                    <div data-selector="#txt2img_prompt" data-parent-selector="#tab_txt2img" class="portal no-bg" >
+                                                    </div>
+                                                </div>
+                                                <div class="layout-footer">
+                                                    <div data-parent-selector="#txt2img_prompt" data-selector="#txt2img_token_counter.block" class="portal relative" data-timeout="1000">
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                        <div data-minSize="0" data-initSize="50" id="idyyf" class="split-container">
+                                            <div class="layout">
+                                               <!--  <div class="layout-header">
+                                                </div> -->
+                                                <div class="layout-content">
+                                                    <div data-selector="#txt2img_neg_prompt" data-parent-selector="#tab_txt2img" class="portal no-bg" >
+                                                    </div>
+                                                </div>
+                                                <div class="layout-footer">
+                                                    <div data-parent-selector="#txt2img_neg_prompt" data-selector="#txt2img_negative_token_counter.block" data-timeout="1000"
+                                                        class="portal relative">
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <!--   
+							<div class="layout-footer panel shrink">
+							  <div class="flexbox row">							
+							  </div>
+							</div>
+						  </div> 
+						  -->
+                        </div>
+                    </div>
+                    <div id="txt2img_params_tabitem_group" class="flexbox col">
+                        <div id="txt2img_params_tabitem" class="xtabs-item">
+                            <div class="flexbox col auto-scroll">
+                                <div class="flexbox row wrap">
+                                    <div class="flexbox row no-wrap group fb-60">
+                                        <div class="flexbox col">
+                                            <div data-parent-selector="#tab_txt2img" data-selector="#txt2img_width" class="portal">
+                                            </div>
+                                            <div data-parent-selector="#tab_txt2img" data-selector="#txt2img_height" class="portal">
+                                            </div>
+                                        </div>
+                                        <div class="flexbox unset-min-width shrink col center panel">
+                                            <div data-selector="#txt2img_res_switch_btn" data-parent-selector="#tab_txt2img" droppable="true"
+                                                class="portal invisible tool">
+                                                <div class="mask-icon icon-res-switch">
+                                                </div>
+                                            </div>
+                                            <div data-selector="#txt2img_dimensions_row" data-parent-selector="#tab_img2img" class="portal invisible tool">
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="flexbox group col fb-40">
+										<!-- <div id="flexbox-14w" class="flexbox row"> -->
+											<div data-parent-selector="#tab_txt2img" data-selector="#txt2img_batch_size" class="portal">
+											</div>
+											<div data-parent-selector="#tab_txt2img" data-selector="#txt2img_batch_count" class="portal">
+											<!-- </div> -->
+										</div>
+                                    </div>
+                                </div>
+                                <div class="flexbox group row">
+                                    <div data-parent-selector="#tab_txt2img" data-selector="#txt2img_sampling" class="portal min-width">
+                                    </div>
+                                    <div data-parent-selector="#tab_txt2img" data-selector="#txt2img_cfg_scale" class="portal min-width">
+                                    </div>
+                                    <div data-parent-selector="#tab_txt2img" data-selector="#txt2img_steps" class="portal min-width">
+                                    </div>
+                                </div>
+                                <div class="flexbox group col">
+                                    <div class="flexbox row">
+                                        <div class="flexbox no-border row">
+                                            <div data-parent-selector="#tab_txt2img" data-selector="#txt2img_seed" class="portal no-min-width">
+                                            </div>
+                                            <div data-parent-selector="#tab_txt2img" data-selector="#txt2img_random_seed" droppable="true"
+                                                class="portal invisible shrink">
+                                                <div class="mask-icon icon-dice">
+                                                </div>
+                                            </div>
+                                            <div data-parent-selector="#tab_txt2img" data-selector="#txt2img_reuse_seed" droppable="true"
+                                                class="portal shrink invisible">
+                                                <div class="mask-icon icon-recycle">
+                                                </div>
+                                            </div>
+                                            <button toggle="true" class="ae-button shrink toggle-seed">
+                                                <div data-parent-selector="#tab_txt2img" data-selector="#txt2img_subseed_show" droppable="true"
+                                                    class="portal shrink invisible tool">
+                                                    <div class="mask-icon icon-equalize">
+                                                    </div>
+                                                </div>
+                                            </button>
+                                        </div>
+                                    </div>
+                                    <div data-parent-selector="#tab_txt2img" data-selector="#txt2img_seed_extras" droppable="true" class="portal sub-group">
+                                        <div class="flexbox col">
+                                            <div class="flexbox row">
+                                                <div class="flexbox no-border min-width fb-50 row">
+                                                    <div data-parent-selector="#tab_txt2img" data-selector="#txt2img_subseed" class="portal no-min-width">
+                                                    </div>
+                                                    <div data-parent-selector="#tab_txt2img" data-selector="#txt2img_random_subseed" droppable="true"
+                                                        class="portal shrink invisible">
+                                                        <div class="mask-icon icon-dice">
+                                                        </div>
+                                                    </div>
+                                                    <div data-parent-selector="#tab_txt2img" data-selector="#txt2img_reuse_subseed" droppable="true"
+                                                        class="portal shrink invisible">
+                                                        <div class="mask-icon icon-recycle">
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                                <div class="flexbox row fb-50">
+                                                    <div data-parent-selector="#tab_txt2img" data-selector="#txt2img_subseed_strength"
+                                                        class="portal min-width fb-50">
+                                                    </div>
+                                                </div>
+                                            </div>
+                                            <div class="flexbox row wrap">
+                                                <div data-parent-selector="#tab_txt2img" data-selector="#txt2img_seed_resize_from_w" class="portal min-width">
+                                                </div>
+                                                <div data-parent-selector="#tab_txt2img" data-selector="#txt2img_seed_resize_from_h" class="portal min-width">
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                                <div data-selector="#txt2img_enable" data-parent-selector="#tab_txt2img" class="portal">
+                                </div>
+                                <div data-selector="#txt2img_hr" data-parent-selector="#tab_txt2img" class="portal">
+                                </div>
+                                <div data-selector="#txt2img_override_settings_row" data-parent-selector="#tab_txt2img" class="portal no-padding no-bg hide-empty">
+                                </div>
+								<div data-selector="#layout-txt2img  .gradio-accordion:has( div[id^='setting_'])" data-parent-selector="gradio-app"
+                                    class="portal hide-empty">
+                                </div>
+                                <div data-selector="#txt2img_container_aspect_ratio" data-parent-selector="#tab_txt2img" class="portal hide-empty">
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <div id="txt2img_scripts_tabitem_group" class="flexbox col">
+                        <div id="txt2img_scripts_tabitem" class="xtabs-item">						
+                            <div data-selector="#txt2img_script_container" data-parent-selector="#tab_txt2img" class="portal no-bg">
+                            </div>
+						</div>
+                    </div>
+                    <div id="txt2img_phystonPrompt_tabitem_group" class="flexbox col">
+                        <div id="txt2img_phystonPrompt_tabitem" class="xtabs-item">						
+                            <div id="split-physton" direction="vertical" gutterSize="8" class="split">
+
+                                <div data-minSize="0" data-initSize="50" id="iubslph" class="split-container">
+                                        <div show-button="#btn_txt2img_physton" data-selector="#phystonPrompt_txt2img_prompt" data-parent-selector="#tab_txt2img" class="portal no-bg no-padding">
+                                    </div>
+                                </div>
+
+                                <div data-minSize="0" data-initSize="50" id="idyyfph" class="split-container">
+                                        <div data-selector="#phystonPrompt_txt2img_neg_prompt" data-parent-selector="#tab_txt2img" class="portal no-bg no-padding">
+                                    </div>
+                                </div>
+                            </div>
+						</div>
+                    </div>
+
+
+                    <div id="txt2img_temp_tabitem_group" class="flexbox col hidden">
+                        <div id="txt2img_temp_tabitem" class="xtabs-item">
+
+							<div data-selector="#tab_txt2img" data-parent-selector="gradio-app" class="portal">
+                            </div>
+							<div data-selector="#txt2img_generation_info_button" data-parent-selector="gradio-app" class="portal">
+							</div>
+
+<!-- 						<svg id="animated" viewbox="0 0 100 100">
+							  <circle cx="50" cy="50" r="45" fill="#FDB900"/>
+							  <path id="progress" stroke-linecap="round" stroke-width="5" stroke="#fff" fill="none"
+									d="M50 10
+									   a 40 40 0 0 1 0 80
+									   a 40 40 0 0 1 0 -80">
+							  </path>
+							  <text id="count" x="50" y="50" text-anchor="middle" dy="7" font-size="20">100%</text>
+							</svg> -->
+							
+<!-- 							<div id="portal-7456" data-selector="#tab_txt2img" data-parent-selector="gradio-app" class="portal">
+                            </div> -->
+	
+                          <!--   <div id="portal-48" data-selector="#txt2img_extra_tabs" data-parent-selector="#tab_txt2img" droppable="true" class="portal">
+                            </div> -->
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <!--      
+		<div class="layout-footer">
+			<div class="xtabs-tabs row panel no-tr">
+			</div>
+		</div>
+		-->
+    </div>
+</div>
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-results.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-results.html
new file mode 100644
index 00000000..0a7ae429
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-results.html
@@ -0,0 +1,66 @@
+
+          <div id="flexbox-6" class="flexbox col full-height border-padding">
+		
+            <div id="portal-21" data-selector="#txt2img_gallery" data-parent-selector="#tab_txt2img" class="portal full-height no-br" droppable="true">
+				<div class="flexbox col progress-flex">
+					<div data-selector="#txt2img_gallery_container" data-parent-selector="gradio-app" class="portal"></div>
+				</div>
+            </div>
+            <div id="accordion-3" iconTrigger="#info_icon_btn" class="accordion no-tr">
+              <div class="accordion-bar no-tr">
+                <div id="flexbox-29" class="flexbox row center">
+                  <button id="info_icon_btn" toggle="true" class="ae-button">
+                    <div id="info_icon" class="mask-icon icon-info">
+                    </div>
+                  </button>
+                  <button id="ae-button-2" class="ae-button">
+                    <div id="portal-5" data-selector="#txt2img_open_folder" data-parent-selector="#tab_txt2img" droppable="true" class="portal invisible">
+                      <div id="mask-icon-39" class="mask-icon icon-folder">
+                      </div>
+                    </div>
+                  </button>
+                  <button id="ae-button-3" class="ae-button">
+                    <div id="portal-10" data-selector="#save_txt2img" data-parent-selector="#tab_txt2img" droppable="true" class="portal invisible">
+                      <div id="mask-icon-40" class="mask-icon icon-save">
+                      </div>
+                    </div>
+                  </button>
+                  <button id="ae-button-4" class="ae-button">
+                    <div id="portal-11" data-selector="#save_zip_txt2img" data-parent-selector="#tab_txt2img" droppable="true" class="portal invisible">
+                      <div id="mask-icon-41" class="mask-icon icon-zip">
+                      </div>
+                    </div>
+                  </button>
+                  <button id="ae-button-6" class="ae-button" data-click="#img2img_nav, #img2img_params">
+                    <div id="portal-12" data-selector="#txt2img_send_to_inpaint" data-parent-selector="#tab_txt2img" droppable="true" class="portal invisible">
+                      <div id="mask-icon-42" class="mask-icon icon-2inpaint">
+                      </div>
+                    </div>
+                  </button>
+                  <button id="ae-button-5" class="ae-button" data-click="#extras_nav">
+                    <div id="portal-13" data-selector="#txt2img_send_to_extras" data-parent-selector="#tab_txt2img" droppable="true" class="portal invisible">
+                      <div id="mask-icon-43" class="mask-icon icon-2extras">
+                      </div>
+                    </div>
+                  </button>
+                  <button id="ae-button-7" class="ae-button" data-click="#img2img_nav, #img2img_params">
+                    <div id="portal-14" data-selector="#txt2img_send_to_img2img" data-parent-selector="#tab_txt2img" droppable="true" class="portal invisible">
+                      <div id="mask-icon-44" class="mask-icon icon-2img2img">
+                      </div>
+                    </div>
+                  </button>
+                </div>
+              </div>
+              <div id="acc-c-3" class="accordion-container">
+                <div id="flexbox-4" class="flexbox col">
+                  <div id="portal-29" data-parent-selector="#tab_txt2img" data-selector="#download_files_txt2img" data-vis="true" class="portal shrink hide-empty">
+                  </div>
+                  <div id="portal-30" data-parent-selector="#tab_txt2img" data-selector="#html_info_txt2img" data-vis="true" class="portal hide-empty">
+                  </div>
+                  <div id="portal-31" data-parent-selector="#tab_txt2img" data-selector="#html_log_txt2img" data-vis="true" class="portal hide-empty">
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+      
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js b/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
new file mode 100644
index 00000000..d6c37ed2
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
@@ -0,0 +1,1213 @@
+//var orig_all_gallery_buttons = window.all_gallery_buttons;
+window.all_gallery_buttons = function(){
+    //orig_all_gallery_buttons();
+	var tabitem = gradioApp().querySelector('#main-nav-bar button.active')?.getAttribute('tabitemid');
+	var visibleGalleryButtons = [];
+	if(tabitem){
+		//console.log(tabitem, allGalleryButtons);
+		var allGalleryButtons = gradioApp().querySelectorAll(tabitem+' .gradio-gallery .thumbnails > .thumbnail-small');
+		allGalleryButtons?.forEach(function(elem) {
+			if (elem.parentElement.offsetParent) {
+				visibleGalleryButtons.push(elem);
+			}
+		});
+	}
+	return visibleGalleryButtons;
+}
+
+window.extraNetworksSearchButton = function(tabs_id, e) {
+	var  button = e.target;
+	const attr = e.target.parentElement.parentElement.getAttribute("search-field"); 
+    var searchTextarea = gradioApp().querySelector(attr);
+	//console.log(button, searchTextarea)
+	var text = button.classList.contains("search-all") ? "" : button.textContent.trim();
+	searchTextarea.value = text;
+	window.updateInput(searchTextarea);
+}
+
+window.imageMaskResize = function(){
+	// override function empty we dont need any fix here
+}
+
+window.extraNetworksEditUserMetadata = function(event, tabname, extraPage, cardName) {
+    //var id = tabname + '_' + extraPage + '_edit_user_metadata';
+	var tid = 'txt2img_' + extraPage + '_edit_user_metadata';
+    var editor = extraPageUserMetadataEditors[tid];
+    if (!editor) {
+        editor = {};
+        editor.page = gradioApp().getElementById(tid);
+        editor.nameTextarea = gradioApp().querySelector("#" + tid + "_name" + ' textarea');
+        editor.button = gradioApp().querySelector("#" + tid + "_button");
+        extraPageUserMetadataEditors[tid] = editor;
+    }
+
+    editor.nameTextarea.value = cardName;
+    updateInput(editor.nameTextarea);
+
+    editor.button.click();
+
+    popup(editor.page);
+
+    //event.stopPropagation();
+}
+
+async function getContributors(repoName, page = 1) {  
+    let request = await fetch(`https://api.github.com/repos/${repoName}/contributors?per_page=100&page=${page}`, {
+        method: 'GET',
+        headers: {
+            'Content-Type': 'application/json',
+        }
+    });
+
+    // print data from the fetch on screen
+    let contributorsList = await request.json();
+    return contributorsList;
+}
+
+async function getAllContributorsRecursive(repoName, page = 1, allContributors = []) {
+    const list = await getContributors(repoName, page);
+    allContributors = allContributors.concat(list);
+
+    if (list.length === 100) {
+        return getAllContributorsRecursive(repoName, page + 1, allContributors);
+    }
+
+    // The base case: when the list is empty, return allContributors
+    return allContributors;
+}
+
+
+localStorage.setItem('UiUxReady', "false");
+localStorage.setItem('UiUxComplete', "false");
+const default_ext_path = './file=extensions/anapnoe-sd-uiux/html/templates/';
+const default_libs_path = './file=extensions/anapnoe-sd-uiux/html/libs/';
+let total = 0;
+let active_main_tab;// = document.querySelector("#tab_txt2img");//null
+let loggerUiUx;
+const split_instances = [];
+const anapnoe_app_id = "#anapnoe_app";
+
+
+function getRootContainer() {
+	return document.getElementById('tab_anapnoe_sd_uiux_core');
+}
+
+function mainTabs(element, tab) {
+	if(active_main_tab){
+		active_main_tab.style.display = 'none';
+	}
+	const ntab = document.querySelector(tab);
+	if(ntab){
+		ntab.style.display = 'block';
+		//console.log(tab, ntab);
+		active_main_tab = ntab;
+
+	}
+	
+}
+
+function setAttrSelector(parent_elem, content_div, count, index, length) {
+
+	//const t = parent_elem.getAttribute("data-timeout");
+	//const delay = t ? parseInt(t) : 0;
+	
+	//setTimeout(() => {
+
+	const mcount = count % 2;
+	//const parent_elem = this.el;
+
+	const s = parent_elem.getAttribute("data-selector");
+	const sp = parent_elem.getAttribute("data-parent-selector");
+	
+
+	let target_elem;
+	
+	switch (mcount) {
+		case 0:
+			target_elem = document.querySelector(`${sp} ${s}`);
+			break;
+		case 1:
+			target_elem = content_div.querySelector(`${s}`);
+			break;
+	}
+
+	if (target_elem && parent_elem) {
+		parent_elem.append(target_elem);  
+		total += 1;
+		console.log("register | Ref", index, sp, s);
+		const d = parent_elem.getAttribute('droppable');
+
+		if (d) {
+			const childs = Array.from(parent_elem.children);
+			//console.log("droppable", target_elem, parent_elem, childs);
+			childs.forEach((c) => {
+				if (c !== target_elem) {
+					if (target_elem.className.indexOf('gradio-accordion') !== -1) {
+						target_elem.children[2].append(c);
+					} else {
+						target_elem.append(c);
+					}
+				}
+			});
+		}
+
+		const hb = parent_elem.getAttribute("show-button");
+		if(hb){document.querySelector(hb)?.classList.remove("hidden");}
+
+	} else if (count < 4) {
+
+		const t = parent_elem.getAttribute("data-timeout");
+		const delay = t ? parseInt(t) : 500;
+		
+		setTimeout(() => {
+			console.log( count + 1, "retry | ", delay, " | Ref", index, sp, s);
+			setAttrSelector(parent_elem, content_div, count + 1, index, length);
+		}, delay);
+
+	} else {
+		console.log("error | Ref", index, sp, s);
+		total += 1;	
+
+	}
+
+	if(total === length){				
+		console.log("Runtime components initilized");
+		localStorage.setItem('UiUxReady', true);
+	}
+
+	//}, delay );
+
+}
+
+function testpopup(){
+	const content_div = document.querySelector('#popup_tabitem');
+	//const meta_id = document.querySelector('.global-popup-inner > div')?.id;
+	content_div.querySelectorAll(`.portal`).forEach((el, index, array) => {				
+		/*
+		const childs = Array.from(el.children);
+		childs.forEach((c) => {
+			const ac = c.getAttribute("meta-Id");	
+			if(ac){
+				if(ac === meta_id){
+					c.style.display = "";
+					el.style.display = "";										
+					
+				}else{
+					c.style.display = "none";
+					if(childs.length === 1){
+						el.style.display = "none";						
+					}
+				}
+			}else{
+				c.setAttribute("meta-id", meta_id);
+			}
+		}); 
+		*/
+		setAttrSelector(el, content_div, 0, index, array.length);
+	});
+
+	/* 	
+	content_div.querySelectorAll(`.ae-popup .edit-user-metadata-buttons button`).forEach((el) => {
+	} 
+	*/
+}
+
+function createButtons4Extensions() {
+
+	const other_extensions = document.querySelector(`#other_extensions`);
+	const other_views = document.querySelector(`#split-left`);
+	//const other_views = document.querySelector(`#no-split-app`);
+	document.querySelectorAll(`#tabs > .tabitem`).forEach((c) => {
+		const cid = c.id;
+		const nid = cid.split('tab_')[1];
+		if( cid !== "tab_txt2img" &&
+			cid !== "tab_img2img" &&
+			cid !== "tab_extras" &&
+			cid !== "tab_pnginfo" &&
+			cid !== "tab_train" &&
+			cid !== "tab_modelmerger" &&
+			cid !== "tab_settings" &&
+			cid !== "tab_extensions" &&
+			cid !== "tab_ui_theme" &&
+			cid !== "tab_anapnoe_dock" &&
+			cid !== "tab_anapnoe_sd_uiux_core")
+			
+		{
+			//tab_openpose_editor
+			const temp = document.createElement('div');			
+			temp.innerHTML= `
+			<button tabItemId="#split-app, #${cid}_tabitem" 
+			tabGroup="main_group" 
+			data-click="#tabs" 
+			onclick="mainTabs(this, '#${cid}')" 
+			class="xtabs-tab">
+			<!-- <div class="mask-icon icon-train"></div> -->
+			<div class="icon-letters">${nid.slice(0, 2)}</div>
+			<span>${nid}</span>
+			</button>`;
+			const btn = temp.firstElementChild;
+			other_extensions.append(btn);
+			//console.log(other_extensions, btn);
+
+			temp.innerHTML= `
+			<div id="${cid}_tabitem" class="xtabs-item other">
+				<div data-parent-selector="gradio-app" data-selector="#${cid} > div" class="portal">
+				</div>
+		  	</div>`;
+
+			const view = temp.firstElementChild;
+			//console.log(other_views, view);
+			other_views.append(view);
+		}
+
+	});
+
+}
+
+function setupExtraNetworksSearchSort(){
+
+	const applyFilter = function(e) {
+        const search_term = e.target.value.toLowerCase();
+		const cards = e.target.getAttribute("data-target"); 
+		//console.log(search_term, cards )
+        gradioApp().querySelectorAll(cards).forEach(function(elem) {
+            //const text = elem.querySelector(".search_term").textContent;//elem.getAttribute("data-path").toLowerCase().split("\\").join("/");
+			const text = elem.querySelector('.name').textContent.toLowerCase() + " " + elem.querySelector('.search_term').textContent.toLowerCase();
+			let visible = text.indexOf(search_term) != -1;
+			if (search_term.length < 3) {			
+                visible = true;
+            }
+            elem.style.display = visible ? "" : "none";
+        });
+    };
+
+	document.querySelectorAll('.search_extra_networks').forEach((el) => {
+		el.addEventListener("input", applyFilter);
+	})
+	  
+	function applySort(el, sortKey) { 
+
+		function comparator(cardA, cardB) { 
+			var a = cardA.getAttribute(sortKey);
+			var b = cardB.getAttribute(sortKey);
+			if (!isNaN(a) && !isNaN(b)) {
+				return parseInt(a) - parseInt(b);
+			}	
+			return (a < b ? -1 : (a > b ? 1 : 0));
+		} 
+
+		const cards_selector = el.getAttribute("data-target"); 
+		const cards = gradioApp().querySelectorAll(cards_selector); 
+		const cards_parent = cards[0].parentElement;	
+		const cardsArray = Array.from(cards); 
+		let sorted = cardsArray.sort(comparator);
+
+		const reverse_button = el.nextElementSibling;//closest(".reverse-order");
+		const reverse = reverse_button.className.indexOf("active") !== -1;
+		if (reverse) {
+            sorted.reverse();
+        }
+		sorted.forEach(e => cards_parent.appendChild(e)); 
+
+	} 
+	
+	document.querySelectorAll('.extra_networks_order_by').forEach((el) => {	
+		el.addEventListener('change', function(e) {
+			applySort(e.target, this.value);
+			//console.log('You selected: ', this.value);
+		});
+		el.nextElementSibling.addEventListener('click', function(e) {
+			applySort(el, el.value);	
+			console.log('You selected: ', el.value);
+		});
+	})
+
+}
+
+function updateExtraNetworksCards(el){
+
+	console.log("Starting optimizations for", el.id);
+	el.querySelectorAll(".card, .card-button").forEach((card) => {
+		const onclick_data = card.getAttribute("onClick");
+		card.setAttribute("data-apply", onclick_data);			
+		card.removeAttribute("onClick");
+		if(card.getAttribute("data-name")){
+			console.log("Remove EventListener", card.getAttribute("data-name"))
+		}else{
+			const card_closest = card.closest(".card");			
+			console.log("Remove EventListener", `${card_closest.getAttribute("data-name")} - ${card.getAttribute("title")}`)
+		}
+					
+	})
+	
+	console.log("Attach EventListener", el.id);
+	el.addEventListener("click", function(e) {
+		const ctarget = e.target;				
+		if(ctarget && ctarget.className.indexOf("card") !== -1) {
+			let data_apply = ctarget.getAttribute("data-apply");
+			if(!data_apply){
+				const onclick_data = ctarget.getAttribute("onClick");
+				if(onclick_data){
+					ctarget.setAttribute("data-apply", onclick_data);			
+					ctarget.removeAttribute("onClick");
+				}
+			}
+
+			const tabkey = active_main_tab.id.split("tab_")[1];
+			if(tabkey === "img2img"){
+				data_apply = data_apply?.replace("txt2img", "img2img");
+			}else{
+				data_apply = data_apply?.replace("img2img", "txt2img");
+			}
+			
+			ctarget.setAttribute("onClick", data_apply );
+			ctarget.click();					
+			ctarget.removeAttribute("onClick");
+
+			if(ctarget.className.indexOf("card-button") !== -1){						
+				data_apply = data_apply?.replace("img2img", "txt2img");
+				popup_trigger.click();					
+				testpopup();
+			}
+
+		}
+	})
+
+	document.querySelectorAll("#txt2img_styles_edit_button, #img2img_styles_edit_button").forEach((elm) => {
+		elm.addEventListener("click", function(e) {
+			popup_trigger.click();					
+			testpopup();	
+		})
+	})
+	
+	
+
+}
+
+function setupAnimationEventListeners(){
+	document.addEventListener('animationend', function (e) {
+		if (e.animationName === 'fade-out') {				
+			e.target.classList.add('hidden');
+		}
+	}); 
+
+	document.addEventListener('animationstart', function (e) {
+		if (e.animationName === 'fade-out') {
+			if (e.target.className.indexOf('notransition') !== -1) {				
+				e.target.classList.add('hidden');
+			}
+		}
+		if (e.animationName === 'fade-in') {				
+			e.target.classList.remove('hidden');
+		}
+	});
+}
+
+function showContributors(){
+	const contributors_btn = document.querySelector('#contributors');
+	const contributors_view = document.querySelector('#contributors_tabitem');
+	const temp = document.createElement('div');
+	temp.id = 'contributors_grid';
+	temp.innerHTML = `Kindly allow us a moment to retrieve the contributors. 
+	We're grateful for the many individuals who have generously put their time and effort to make this possible.`;
+	contributors_view.append(temp);	
+
+	contributors_btn.addEventListener('click', function(e) {
+		//console.log(getAllContributors("anapnoe/stable-diffusion-webui-ux"));
+		if(!contributors_btn.getAttribute("data-visited")){
+			contributors_btn.setAttribute("data-visited", "true");
+			const promise = getAllContributorsRecursive("anapnoe/stable-diffusion-webui-ux");
+			promise.then(function (result) {
+				//console.log(result)
+				temp.innerHTML = "";
+				for (let i = 0; i < result.length; i++) {
+					const login = result[i].login;
+					const html_url = result[i].html_url;
+					const avatar_url = result[i].avatar_url;					
+					temp.innerHTML += `
+					<a href="${html_url}" target="_blank" rel="noopener noreferrer nofollow" class="contributor-button flexbox col">
+						<figure><img src="${avatar_url}" lazy="true"></figure>
+						<div class="contributor-name">
+							${login}
+						</div>
+					</a>`;
+				}										
+			})
+		}
+	});
+}
+
+function onUiUxReady(content_div){
+
+	const interval = setInterval(() => {
+		const isUiUxReady = localStorage.getItem('UiUxReady');
+		if( isUiUxReady === "true"){
+			clearInterval(interval);
+
+			const logger_screen = document.querySelector("#logger_screen");
+			if(logger_screen){
+				const asideconsole = document.querySelector("#layout-console-log");
+				asideconsole.append(loggerUiUx);
+				logger_screen.remove();
+			}
+
+
+			console.log("Starting optimizations for Extra Networks");
+			/* content_div.querySelector("#img2img_textual_inversion_cards_html")?.remove();
+			content_div.querySelector("#img2img_checkpoints_cards_html")?.remove();
+			content_div.querySelector("#img2img_hypernetworks_cards_html")?.remove();
+			content_div.querySelector("#img2img_lora_cards_html")?.remove();
+
+			console.log("Remove element #img2img_textual_inversion_cards_html");
+			console.log("Remove element #img2img_checkpoints_cards_html");
+			console.log("Remove element #img2img_hypernetworks_cards_html");
+			console.log("Remove element #img2img_lora_cards_html"); */
+
+			content_div.querySelectorAll(".extra-network-cards").forEach((el) => {
+				updateExtraNetworksCards(el);
+			}); 
+
+			console.log("Finishing optimizations for Extra Networks");
+			
+			const versions = gradioApp().querySelector(".versions");
+			console.log(versions.innerHTML);
+
+			setupExtraNetworksSearchSort();
+
+			const ch_input = document.querySelector ("#setting_sd_model_checkpoint .secondary-wrap input");
+			//const hash_target = document.querySelector('#sd_checkpoint_hash');
+			//const hash_old_value = hash_target.textContent;
+			const hash_old_value = ch_input.value;
+			let oldcard = document.querySelector(`#txt2img_checkpoints_cards .card[data-apply*="${hash_old_value}"]`);
+			if(oldcard){
+				oldcard?.classList.add("selected");
+				console.log("Checkpoint name:", oldcard.getAttribute("data-name"), "<br>");
+			}
+
+			const ch_footer_preload = document.querySelector("#txt2img_checkpoints_main_footer .model-preloader");
+			const ch_footer_selected = document.querySelector("#txt2img_checkpoints_main_footer .model-selected");
+			
+			const ch_preload = document.querySelector ("#setting_sd_model_checkpoint .wrap");
+			ch_footer_preload.append(ch_preload);	
+
+			const preload_model_observer = new MutationObserver(function (mutations) {
+				mutations.forEach(function (m) {
+					if(oldcard){
+						const hash_target = document.querySelector('#sd_checkpoint_hash');
+						const hash_value = hash_target.textContent;
+						const card = document.querySelector(`#txt2img_checkpoints_cards .card[data-apply*="${hash_value}"]`);	
+						if(card){
+							if(oldcard !== card){
+								oldcard.classList.remove("selected");
+								card.classList.add("selected");
+								oldcard = card;	
+								ch_footer_selected.textContent = ch_input.value;
+								console.log("Checkpoint:", ch_input.value)
+							}	
+						}					
+					}						
+				});
+			});
+
+			preload_model_observer.observe(ch_preload, { childList: true, subtree: false });
+
+
+			setupGenerateObservers();
+
+			localStorage.setItem('UiUxComplete', true);
+
+			//const main_nav_content = document.querySelector('#main_nav_content');
+			//const sidebar_tabs = document.querySelector('#sidebar_tabs');
+			//main_nav_content.append(sidebar_tabs);
+			showContributors()
+			
+
+
+			
+
+		}
+	}, 500); 
+
+
+}
+
+function setupGenerateObservers(){
+
+	const keys = ["#txt2img", "#img2img"];
+	keys.forEach((key) => {
+	 
+		const tib = document.querySelector(key+'_interrupt');
+		const tgb = document.querySelector(key+'_generate');
+		const ti = tib.closest('.portal');
+		const tg = tgb.closest('.ae-button');
+		const ts = document.querySelector(key+'_skip').closest('.portal');
+		const loop = document.querySelector(key+'_loop');
+
+		tib.addEventListener("click", function () {
+			loop.classList.add('stop');
+		});
+
+		const gen_observer = new MutationObserver(function (mutations) {
+			mutations.forEach(function (m) {
+
+				if (tib.style.display === 'none') {
+
+					if (loop.className.indexOf('stop') !== -1 || loop.className.indexOf('active') === -1) {
+						loop.classList.remove('stop');
+						ti.classList.add('disable');
+						ts.classList.add('disable');
+						tg.classList.remove('active');
+					} else if (loop.className.indexOf('active') !== -1) {
+						tgb.click();
+					}
+				} else {
+					ti.classList.remove('disable');
+					ts.classList.remove('disable');
+					tg.classList.add('active');
+				}
+			});
+		});
+		
+		gen_observer.observe(tib, { attributes: true, attributeFilter: ['style'] });
+	});
+
+}
+
+function initDefaultComponents(content_div) {
+	const anapnoe_app = document.querySelector(anapnoe_app_id);
+	content_div.querySelectorAll(`div.split`).forEach((el) => {
+
+		let id = el.id;
+		let nid = content_div.querySelector(`#${id}`);
+
+		const dir = nid?.getAttribute('direction') === 'vertical' ? 'vertical' : 'horizontal';
+		const gutter = nid?.getAttribute('gutterSize') || '8';
+
+		const containers = content_div.querySelectorAll(`#${id} > div.split-container`);
+		const len = containers.length;
+		const r = 100 / len;
+		const ids = [], isize = [], msize = [];
+
+		for (let j = 0; j < len; j++) {
+			const c = containers[j];
+			ids.push(`#${c.id}`);
+			const ji = c.getAttribute('data-initSize');
+			const jm = c.getAttribute('data-minSize');
+			isize.push(ji ? parseInt(ji) : r);
+			msize.push(jm ? parseInt(jm) : Infinity);
+		}
+
+		console.log("Split component", ids, isize, msize, dir, gutter);
+
+		split_instances[id] = Split(ids, {
+			sizes: isize,
+			minSize: msize,
+			direction: dir,
+			gutterSize: parseInt(gutter),
+			snapOffset: 0,
+			dragInterval: 1,
+			//expandToMin: true,         
+			elementStyle: function (dimension, size, gutterSize) {
+				//console.log(dimension, size, gutterSize);
+				return {
+					'flex-basis': 'calc(' + size + '% - ' + gutterSize + 'px)',
+				}
+			},
+			gutterStyle: function (dimension, gutterSize) {
+				return {
+					'flex-basis': gutterSize + 'px',
+					'min-width': gutterSize + 'px',
+					'min-height': gutterSize + 'px',
+				}
+			},
+		});
+
+	});
+
+	//console.log(split_instances)
+	
+	content_div.querySelectorAll(`.portal`).forEach((el, index, array) => {
+		setAttrSelector(el, content_div, 0, index, array.length);
+	});
+
+	content_div.querySelectorAll(`.accordion-bar`).forEach((c) => {
+		const acc = c.parentElement;
+		const acc_split = acc.closest('.split-container');
+
+		let ctrg = c;
+		const atg = acc.getAttribute('iconTrigger');
+		if (atg) {
+			const icn = content_div.querySelector(atg);
+			if (icn) {
+				ctrg = icn;
+				c.classList.add('pointer-events-none');
+			}
+		}
+
+		if (acc.className.indexOf('accordion-vertical') !== -1 && acc_split.className.indexOf('split') !== -1) {
+
+			acc.classList.add('expand');
+			//const acc_gutter = acc_split.previousElementSibling;
+			const acc_split_id = acc_split.parentElement.id;
+			const split_instance = split_instances[acc_split_id];
+			acc_split.setAttribute('data-sizes', JSON.stringify(split_instance.getSizes()));
+
+			ctrg?.addEventListener("click", () => {
+				acc.classList.toggle('expand');
+				//acc_gutter.classList.toggle('pointer-events-none');
+				if (acc_split.className.indexOf('v-expand') !== -1) {
+					acc_split.classList.remove('v-expand');
+					split_instance.setSizes(JSON.parse(acc_split.getAttribute('data-sizes')))
+				} else {
+					acc_split.classList.add('v-expand');
+					let sizes = split_instance.getSizes();
+					acc_split.setAttribute('data-sizes', JSON.stringify(sizes));
+
+					//console.log(sizes)
+					sizes[sizes.length-1] = 0;
+					sizes[sizes.length-2] = 100;
+
+					const padding = parseFloat(window.getComputedStyle(c, null).getPropertyValue('padding-left')) * 2;
+					acc_split.style.minWidth = c.offsetWidth+padding+"px";
+
+					split_instance.setSizes(sizes)
+				}
+			});
+
+		} else {
+			ctrg?.addEventListener("click", () => { acc.classList.toggle('expand') });
+		}
+	});
+
+
+	function callToAction(el, tids, pid) {
+
+		const acc_bar = el.closest(".accordion-bar");
+		if (acc_bar) {
+			const acc = acc_bar.parentElement;
+			if (acc.className.indexOf('expand') === -1) {
+				let ctrg = acc_bar;
+				const atg = acc.getAttribute('iconTrigger');
+				if (atg) {
+					const icn = content_div.querySelector(atg);
+					if (icn) {
+						ctrg = icn;
+					}
+				}
+				ctrg.click();
+			}
+		}
+
+		const txt = el.querySelector('span')?.innerHTML.toLowerCase();
+		//console.log(txt, pid)
+		if (txt && pid) {				
+			document.querySelectorAll(`${pid} .tab-nav button, [data-parent-selector="${pid}"] .tab-nav button`).forEach(function (elm) {
+				/* console.log(elm.innerHTML, txt) */
+				if (elm.innerHTML.toLowerCase().indexOf(txt) !== -1) {
+					elm.click();
+				}
+			});
+		}
+	}
+
+	content_div.querySelectorAll(`.xtabs-tab`).forEach((el) => {
+
+		el.addEventListener('click', () => {
+			const tabParent = el.parentElement;
+			const tgroup = el.getAttribute("tabGroup");
+			const pid = el.getAttribute("data-click");
+
+			function hideActive(tab) {
+				tab.classList.remove('active');
+				const tids = tab.getAttribute("tabItemId");
+				anapnoe_app.querySelectorAll(tids).forEach((tabItem) => {
+					//tabItem.classList.add('hidden');
+					tabItem.classList.remove('fade-in');
+					tabItem.classList.add('fade-out');
+				});
+			}
+
+			if (tgroup) {
+				anapnoe_app.querySelectorAll(`[tabGroup="${tgroup}"]`)
+					.forEach((tab) => {
+						if (tab.className.indexOf('active') !== -1) {
+							hideActive(tab);
+						}
+					});
+
+			} else if (tabParent) {
+				const tabs = [].slice.call(tabParent.children);
+				tabs.forEach((tab) => {
+					if (tab.className.indexOf('active') !== -1) {
+						hideActive(tab);
+					}
+				});
+			}
+
+			const tids = el.getAttribute("tabItemId");
+			anapnoe_app.querySelectorAll(tids).forEach((tabItem) => {
+				//tabItem.classList.remove('hidden');
+				tabItem.classList.remove('fade-out');
+				tabItem.classList.add('fade-in');
+				//console.log('tab', tids, tabItem);
+			});
+
+			el.classList.add('active');
+			callToAction(el, tids, pid);
+
+
+		});
+
+		const active = el.getAttribute("active");
+		if (!active) {
+			const tids = el.getAttribute("tabItemId");
+			anapnoe_app.querySelectorAll(tids).forEach((tabItem) => {
+				//tabItem.classList.add('hidden');
+				tabItem.classList.remove('fade-in');
+				tabItem.classList.add('fade-out');
+			});
+		}
+
+	});
+
+	content_div.querySelectorAll(`.xtabs-tab[active]`).forEach((el) => {
+		el.classList.add('active');
+		const tids = el.getAttribute("tabItemId");
+		const pid = el.getAttribute("data-click");
+		anapnoe_app.querySelectorAll(tids).forEach((tabItem) => {
+			//tabItem.classList.remove('hidden');
+			tabItem.classList.remove('fade-out');
+			tabItem.classList.add('fade-in');
+		});
+		callToAction(el, tids, pid);
+		//console.log('tab', tids, el);
+	});
+
+	content_div.querySelectorAll(`.ae-button`).forEach((el) => {
+		const toggle = el.getAttribute("toggle");
+		const active = el.getAttribute("active");
+		const input = el.querySelector('input');
+
+		if (input) {
+			if (input.checked === true && !active) {
+				input.click();
+			} else if (input.checked === false && active) {
+				input.click();
+			}
+		}
+
+		if (active) {
+			el.classList.add('active');
+		} else {
+			el.classList.remove('active');
+		}
+
+
+		if (toggle) {
+			el.addEventListener('click', (e) => {					
+				const input = el.querySelector('input');				
+				if (input) {
+					input.click();
+					if (input.checked === true) {
+						el.classList.add('active');
+					} else if (input.checked === false) {
+						el.classList.remove('active');
+					}
+				} else {
+					el.classList.toggle('active');
+				}
+			});
+		}
+
+		const adc = el.getAttribute("data-click");
+		if(adc){
+			el.addEventListener('click', (e) => {
+
+					if(el.className.indexOf("refresh-extra-networks") !== -1){						
+					const ctemp = el.closest(".template");
+					const ckey = ctemp?.getAttribute("key") || "txt2img";
+					//console.log(ckey);
+					setTimeout(() => {
+						const tempnet = document.querySelector(`#txt2img_temp_tabitem #${ckey}_cards`);
+						if(tempnet){
+							ctemp.querySelector(".extra-network-cards")?.remove();
+							ctemp.querySelector(".extra-network-subdirs")?.remove();
+							ctemp.querySelectorAll(`.portal`).forEach((el, index, array) => {
+								setAttrSelector(el, ctemp, 0, index, array.length);
+							});
+							updateExtraNetworksCards(ctemp);
+						}
+					}, 1000);
+					
+				}
+
+				//}else{
+					document.querySelectorAll(adc).forEach((el) => {
+						el.click();
+					})	
+				//}
+			})
+		}
+
+	});
+
+	// step ticks for performant input range
+	function ui_show_range_ticks(value, interactive) {
+		if (value) {
+			const range_selectors = "input[type='range']";
+			//const range_selectors = "[id$='_clone']:is(input[type='range'])";
+			gradioApp()
+				.querySelectorAll(range_selectors)
+				.forEach(function (elem) {
+					let spacing = (elem.step / (elem.max - elem.min)) * 100.0;
+					let tsp = "max(3px, calc(" + spacing + "% - 1px))";
+					let fsp = "max(4px, calc(" + spacing + "% + 0px))";
+					var style = elem.style;
+					style.setProperty(
+						"--ae-slider-bg-overlay",
+						"repeating-linear-gradient( 90deg, transparent, transparent " +
+						tsp +
+						", var(--ae-input-border-color) " +
+						tsp +
+						", var(--ae-input-border-color) " +
+						fsp +
+						" )"
+					);
+				});
+		} else if (interactive) {
+			gradioApp()
+				.querySelectorAll("input[type='range']")
+				.forEach(function (elem) {
+					var style = elem.style;
+					style.setProperty("--ae-slider-bg-overlay", "transparent");
+				});
+		}
+	}
+	/*  
+	gradioApp().querySelector("#setting_ui_show_range_ticks input").addEventListener("click", function (e) {
+		ui_show_range_ticks(e.target.checked, true);
+	});
+	ui_show_range_ticks(opts.ui_show_range_ticks);
+	*/
+	ui_show_range_ticks(true);
+
+	// try to attach Logger Screen to main before full UIUXReady
+	const asideconsole = document.querySelector("#layout-console-log");
+	asideconsole.append(loggerUiUx);
+	document.querySelector("#logger_screen")?.remove();
+
+
+}
+
+function setupOnLoadResources() {
+
+	const content_div = document.querySelector("#anapnoe_app");
+	gradioApp().insertAdjacentElement('afterbegin', content_div);
+
+	active_main_tab = document.querySelector("#tab_txt2img");
+	createButtons4Extensions();
+	setupAnimationEventListeners();
+
+	//const tempDiv = document.createElement('div');
+	const initSplitLib = function () {
+		initDefaultComponents(content_div);
+		onUiUxReady(content_div);
+	}
+
+	const script = document.createElement('script');
+	script.id = 'splitjs-main';
+	script.setAttribute("data-scope", "#anapnoe_app");
+	script.onload = initSplitLib;
+	script.src = 'https://unpkg.com/split.js/dist/split.js';
+
+	content_div.appendChild(script);
+
+}
+
+function removeStyleAssets(){
+	
+	//console.log("Starting optimizations for Extra Networks");
+	console.log("Starting optimizations");
+	document.querySelector("#img2img_textual_inversion_cards_html")?.remove();
+	document.querySelector("#img2img_checkpoints_cards_html")?.remove();
+	document.querySelector("#img2img_hypernetworks_cards_html")?.remove();
+	document.querySelector("#img2img_lora_cards_html")?.remove();
+
+	console.log("Remove element #img2img_textual_inversion_cards_html");
+	console.log("Remove element #img2img_checkpoints_cards_html");
+	console.log("Remove element #img2img_hypernetworks_cards_html");
+	console.log("Remove element #img2img_lora_cards_html");
+
+	document.querySelectorAll(`
+	[rel="stylesheet"][href*="/assets/"], 
+	[rel="stylesheet"][href*="theme.css"],
+	[rel="stylesheet"][href*="file=style.css"]`
+			).forEach((c) => {
+				c.remove();
+				//loggerUiUx.innerHTML = `Remove stylesheets ${c.getAttribute("href")}`;
+				console.log("Remove stylesheet", c.getAttribute("href"));	
+				
+			});
+
+	const styler = document.querySelectorAll('.styler, [class*="svelte"]:not(input)');
+	const count = styler.length;
+	let s = 0;
+	styler.forEach((c) => {
+		if(c.style.display !== "none" && c.style.display !== "block"){
+			//if(c.className.indexOf('hidden') === -1 && c.className.indexOf('hide') === -1){
+				c.removeAttribute("style");
+				s++;
+			//}
+		}
+
+		[...c.classList].filter(c => {
+		return c.match(/^svelte.*/)
+		}).forEach(e => {			
+			c.classList.remove(e)
+		});
+		
+	});
+	//loggerUiUx.innerHTML = `Remove inline styles from DOM selectors:${count} removed:${s}`;
+	console.log("Remove inline styles from DOM", "Total Selectors:", count, "Removed Selectors:", s);	
+	console.log("Finishing optimizations");
+	//console.log("Loading template files");
+	templateData();
+}
+
+function getNestedTemplates(container) {
+	const nestedData = [];	
+	container.querySelectorAll(`.template:not([status])`).forEach((el, j) => {
+		//console.log(el, j)
+		const obj = {};	
+		const url = el.getAttribute('url');
+		if(url){
+			obj.url = url;
+		}else{
+			obj.url = default_ext_path;
+		}
+		const key = el.getAttribute('key');
+		if(key){
+			obj.key = key;
+		} 
+		const template = el.getAttribute('template');
+		if(template){
+			obj.template = `${template}.html`;
+		}else{
+			obj.template = `${el.id}.html`;
+		}
+		obj.id = el.id;
+		nestedData.push(obj);
+	});
+
+	return nestedData;
+}
+
+function loadCurrentTemplate(data, i, callback) {
+	const curr_data = data[i];
+	const xmlHttp = new XMLHttpRequest();
+	const next = i < data.length;
+	let target;
+
+	if(next){
+
+		if(curr_data?.parent){
+			target = curr_data.parent;
+		}else if(curr_data?.id){
+			target = document.querySelector(`#${curr_data.id}`);
+		}
+
+		if(target){
+		
+			xmlHttp.onreadystatechange = function () {
+				
+				if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
+					let tempDiv = document.createElement('div');				
+					if(curr_data.key){
+						const filtered = xmlHttp.responseText.replace(/\s*\{\{.*?\}\}\s*/g, curr_data.key);					
+						tempDiv.innerHTML = filtered;
+					}else{
+						tempDiv.innerHTML = xmlHttp.responseText;
+					}
+
+					const nestedData =  getNestedTemplates(tempDiv);
+					if(nestedData.length > 0){
+						data = data.concat(nestedData);	
+					}
+					
+					//console.log(data)
+					target.setAttribute("status", "true");
+					target.append(tempDiv.firstElementChild);
+					
+					loadCurrentTemplate(data, i+1, callback);
+					
+				}else if (xmlHttp.readyState == 4 && xmlHttp.status == 404) {
+					target.setAttribute("status", "error");	
+					loadCurrentTemplate(data, i+1, callback)	
+				}
+			};
+
+			const url = `${curr_data.url}${curr_data.template}`;
+			console.log("Loading template", url);	
+			xmlHttp.open("GET", url, true); // true for asynchronous
+			xmlHttp.send(null);
+
+		}
+
+	}else{
+		//console.log("InitScripts")
+		//loggerUiUx.innerHTML = `Finished`;
+		console.log("Template files merged successfully");
+		console.log("Init runtime components");
+		callback();
+		//setupOnLoadResources();
+		
+	}
+	
+
+
+}
+
+function templateData() {
+	
+	const path = default_ext_path;
+	const data = [
+		{
+			url: path,
+			template:'template-app-root.html',
+			parent: getRootContainer()
+		}
+	];
+
+	loadCurrentTemplate(data, 0, setupOnLoadResources);
+	
+}
+
+
+function setupLogger() {
+
+	const tempDiv = document.createElement('div');
+	tempDiv.id = "logger_screen";
+	tempDiv.style = `
+	position: fixed; 
+	inset: 0; 
+	background-color: black; 
+	z-index: 99999;
+	display: flex;
+    flex-direction: column;
+	overflow:auto;
+	`;
+	
+	loggerUiUx = document.createElement('div');
+	loggerUiUx.id = "logger";
+	tempDiv.append(loggerUiUx);
+	document.body.append(tempDiv);
+	
+	(function (logger) {
+		console.old = console.log;
+		console.log = function () {
+			var output = "", arg, i;
+			
+			output += `
+			<div class="log-row"><span class="log-date">${new Date().toLocaleString().replace(',','')}</span>`;
+			for (i = 0; i < arguments.length; i++) {
+				arg = arguments[i];
+				const argstr = arg.toString().toLowerCase();
+				let acolor = "";
+				if(argstr.indexOf("remove") !== -1 || argstr.indexOf("error") !== -1){
+					acolor += " log-remove"
+				}else if(argstr.indexOf("loading") !== -1 
+				|| argstr.indexOf("| ref") !== -1 
+				|| argstr.indexOf("initial") !== -1 
+				|| argstr.indexOf("optimiz") !== -1 
+				|| argstr.indexOf("python") !== -1 				
+				|| argstr.indexOf("success") !== -1){
+					acolor += " log-load";
+				}else if(argstr.indexOf("[") !== -1){			
+					acolor += " log-object";
+				}
+				
+				if(arg.toString().indexOf(".css") !== -1 || arg.toString().indexOf(".html") !== -1 ){
+					acolor += " log-url";
+				}else if(arg.toString().indexOf("\n") !== -1 ){
+					output += "<br />"
+				}
+
+				output += `
+				<span class="log-${(typeof arg)} ${acolor}">`;				
+				if (
+					typeof arg === "object" &&
+					typeof JSON === "object" &&
+					typeof JSON.stringify === "function"
+				) {
+					output += JSON.stringify(arg);   
+				} else {
+					output += arg;   
+				}
+
+				output += " </span>";
+			}
+
+			logger.innerHTML += output + "</div>";
+			console.old.apply(undefined, arguments);
+		};
+	})(document.getElementById("logger"));
+
+	console.log(
+	'\n',"╔═╗╔═╦╦═╗╔═╦═╦╦═╦═╗",
+	'\n',"║╬╚╣║║║╬╚╣╬║║║║╬║╩╣",
+	'\n',"╚══╩╩═╩══╣╔╩╩═╩═╩═╝",
+	'\n',"─────────╚╝"
+	);
+
+	console.log("Initialize Anapnoe UI/UX runtime engine version 0.0.1");
+	console.log(navigator.userAgent);
+
+	const isFirefox = navigator.userAgent.toLowerCase().includes('firefox');
+	if(isFirefox){
+		console.log("Go to the Firefox about:config page, then search and toggle layout. css.has-selector. enabled")
+	}
+	
+
+	let link = document.querySelector("link[rel~='icon']");
+	if (!link) {
+		link = document.createElement('link');
+		link.rel = 'icon';
+		document.head.appendChild(link);
+	}
+	link.href = './file=extensions/anapnoe-sd-uiux/html/favicon.svg';
+
+
+	
+
+	removeStyleAssets(); 
+
+}
+
+/* 
+function observeGradioInit() {
+	const observer = new MutationObserver(() => {
+		const block = gradioApp().querySelector("#tab_anapnoe_sd_uiux_core");			
+		//const t = gradioApp().querySelector("#txt2img_textual_inversion_cards_html .card:last-child");	
+		//const c = gradioApp().querySelector("#txt2img_checkpoints_cards_html .card:last-child");	
+		//const h = gradioApp().querySelector("#txt2img_hypernetworks_cards_html > div:first-child");	
+		//const l = gradioApp().querySelector("#txt2img_lora_cards_html .card:last-child");	
+		if (block) {
+		//if (block && t && c && h && l) {
+			observer.disconnect();
+			setTimeout(() => {
+				removeStyleAssets();
+			}, 1000);
+		}
+	});
+	observer.observe(gradioApp(), { childList: true, subtree: true });
+} 
+*/
+
+onUiLoaded(function() {
+ 	setupLogger();
+}); 
+
+/* document.addEventListener("DOMContentLoaded", () => {
+	setupLogger();
+	observeGradioInit();
+}); */
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/scripts/anapnoe_sd_uiux.py b/extensions-builtin/anapnoe-sd-uiux/scripts/anapnoe_sd_uiux.py
new file mode 100644
index 00000000..c4782a03
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/scripts/anapnoe_sd_uiux.py
@@ -0,0 +1,111 @@
+import os
+import shutil
+from pathlib import Path
+import gradio as gr
+import modules.scripts as scripts
+from modules import script_callbacks, shared
+from datetime import datetime
+
+basedir = scripts.basedir() 
+html_folder = os.path.join(basedir, "html") 
+
+layouts_folder = os.path.join(basedir, "layouts") 
+javascript_folder = os.path.join(basedir, "javascript")
+
+def get_files(folder, file_filter=[], file_list=[], split=False):
+    file_list = [file_name if not split else os.path.splitext(file_name)[0] for file_name in os.listdir(folder) if os.path.isfile(os.path.join(folder, file_name)) and file_name not in file_filter] 
+    return file_list
+
+html = """
+<html>
+  <body>
+    <h1>My First JavaScript</h1>
+    <button type="testButton" onclick="testFn()"> Start </button>
+    <div id="root-dock-no"></div>
+  </body>
+</html>
+"""
+
+scripts = """
+async () => {
+   // set testFn() function on globalThis, so you html onlclick can access it
+    globalThis.testFn = () => {
+      document.getElementById('demo').innerHTML = "Hello"
+    }
+}
+"""
+
+# with gr.Blocks() as demo:   
+    # input_mic = gr.HTML(html)
+    # out_text  = gr.Textbox()
+    # # run script function on load,
+    # demo.load(None,None,None,_js=scripts)
+# static_dir = Path('./static')
+# static_dir.mkdir(parents=True, exist_ok=True)    
+    
+# def predict(text_input):
+    # file_name = f"{datetime.utcnow().strftime('%s')}.html"
+    # file_path = html_folder / file_name
+    # print(file_path)
+    # with open(file_path, "w") as f:
+        # f.write(f"""
+        # <script src="https://cdn.tailwindcss.com"></script>
+        # <body>
+        # <div id=q-app></div>
+        # <h1 class="text-3xl font-bold">Hello <i>{text_input}</i> From Gradio Iframe</h1>
+        # <h3>Filename: {file_name}</h3>
+        # </body>
+        # """)
+    # iframe = f"""<iframe src="file={file_path}" width="100%" height="500px"></iframe>"""
+    # link = f'<a href="file={file_path}" target="_blank">{file_name}</a>'
+    # return link, iframe
+
+
+
+def on_ui_tabs():
+
+    with gr.Blocks(analytics_enabled=False) as anapnoe_sd_uiux_core: 
+        """ with gr.Row():
+            with gr.Column(): 
+                with gr.Row():            
+                    layouts_dropdown = gr.Dropdown(label="Layout", elem_id="layout_drop_down", interactive=True, choices=get_files(layouts_folder,[".json"]), type="value")
+                    layout_save_as_filename = gr.Text(label="Save / Save as", elem_id="layout_save_as_name",)
+                with gr.Row(): 
+                    layout_reset_button = gr.Button(elem_id="layout_reset_btn", value="Reset", variant="primary")
+                    layout_save_button = gr.Button(value="Save", elem_id="layout_save_btn", variant="primary")           
+            with gr.Row(elem_id="layout_hidden"):
+                layout_json = gr.Textbox(label="Json", elem_id="layout_json", show_label=True, lines=7, interactive=False, visible=True)  
+
+        def save_layout( layout_json, filename):                
+            with open(os.path.join(layouts_folder, f"{filename}.json"), 'w', encoding="utf-8") as file:                
+                file.write(layout_json)
+                file.close()       
+            layouts_dropdown.choices=get_files(layouts_folder,[".json"])
+            return gr.update(choices=layouts_dropdown.choices, value=f"{filename}.json")
+
+        def open_layout(filename):                           
+            with open(os.path.join(layouts_folder, f"{filename}"), 'r') as file:
+                layout_json=file.read()
+            no_ext=filename.rsplit('.', 1)[0]
+            return [layout_json, no_ext]
+               
+        
+        layout_save_button.click(
+            fn=save_layout,
+            inputs=[layout_json, layout_save_as_filename],
+            outputs=layouts_dropdown
+        )
+        
+        layouts_dropdown.change(
+            fn=open_layout,
+            inputs=[layouts_dropdown],
+            outputs=[layout_json, layout_save_as_filename]
+        )      """
+                         
+
+
+    return (anapnoe_sd_uiux_core, 'UI-UX Core', 'anapnoe_sd_uiux_core'),
+
+
+
+script_callbacks.on_ui_tabs(on_ui_tabs)
\ No newline at end of file
diff --git a/extensions-builtin/anapnoe-sd-uiux/style.css b/extensions-builtin/anapnoe-sd-uiux/style.css
new file mode 100644
index 00000000..6e08c93f
--- /dev/null
+++ b/extensions-builtin/anapnoe-sd-uiux/style.css
@@ -0,0 +1,3247 @@
+* {
+    box-sizing: border-box;
+    transition-property: color, opacity, background-color, border-color;
+    transition-duration: 0.2s;
+    transition-timing-function: ease-out;
+}
+
+:root {
+    --ae-primary-color: #1485d8;
+    --ae-secondary-color: #d81485;
+    --ae-main-bg-color: rgb(32 32 32);
+
+    --ae-input-height: 35px;
+    --ae-input-slider-height: 0.6;
+    --ae-input-icon-height: calc(var(--ae-input-height) - var(--ae-input-border-size) * 2);
+    --ae-input-padding: 5px;
+    --ae-input-font-size: 14px;
+    --ae-input-line-height: 14px;
+    --ae-label-color: rgba(255, 255, 255, 0.75);
+    --ae-secondary-label-color: rgba(255, 255, 255, 0.5);
+    --ae-input-border-size: 2px;
+    --ae-input-border-radius: 0px;
+
+    --ae-input-text-color: rgba(255, 255, 255, 0.75);
+    --ae-input-placeholder-color: rgba(255, 255, 255, 0.35);
+    --ae-input-bg-color: rgba(0, 0, 0, 0.25);
+    --ae-input-border-color: rgba(0, 0, 0, 0.1);
+
+    --ae-input-hover-text-color: rgba(255, 255, 255, 0.75);
+
+    --ae-panel-bg-color: rgba(64, 64, 64, 0.5);
+    --ae-panel-border-color: rgba(64, 64, 64, 0.75);
+    --ae-panel-padding: 5px;
+    --ae-border-radius: 5px;
+    --ae-border-size: 2px;
+    --ae-gap-size-val: 5px;
+
+    --ae-gap-size: max(var(--ae-gap-size-val), var(--ae-border-size));
+    --ae-border-size-neg: calc(var(--ae-border-size) * -1);
+    --ae-border-size-x2: calc((var(--ae-border-size) * 2) + 0px);
+
+    --ae-group-bg-color: #0c171e;
+    --ae-group-padding: 2px;
+    --ae-group-radius: 7px;
+    --ae-group-border-size: 2px;
+    --ae-group-border-color: #0c171e;
+    --ae-group-gap: 6px;
+    
+}
+
+body {
+    margin: 0;
+    color: var(--ae-label-color);
+    font-size: var(--ae-input-font-size);
+    /* line-height: 16px; */
+    background-color: var(--ae-main-bg-color);
+    font-family: "IBM Plex Mono", monospace;
+}
+
+.portal,
+* .panel {
+    background-color: var(--ae-panel-bg-color);
+    padding: var(--ae-panel-padding);
+    border-radius: var(--ae-border-radius);
+    outline: var(--ae-border-size) solid var(--ae-panel-border-color);
+    flex-direction: column;
+    display: flex;
+    flex: 1 1 0%;
+    justify-content: space-between;
+    height: auto;
+}
+
+* .panel {
+    flex-direction: inherit;
+    justify-content: flex-start !important;
+}
+
+* .no-panel .portal {
+    background-color: transparent;;
+}
+
+.flexbox {
+    display: flex;
+    justify-content: flex-start;
+    align-items: stretch;
+    flex-wrap: wrap;
+    padding: 0;
+    margin: 0;
+    flex: 1 1 0%;
+    gap: 5px;
+    min-width: min(160px, 100%);
+    flex-grow: 1;
+}
+
+.flexbox.row {
+    flex-direction: row;
+}
+
+.flexbox.col {
+    flex-direction: column;
+    flex-wrap: nowrap;
+    justify-content: center;
+}
+
+.flexbox.group{
+    background-color: var(--ae-group-bg-color);
+    padding: var(--ae-group-padding);;
+    border-radius: var(--ae-group-radius) ;
+    outline: var(--ae-group-border-size) solid var(--ae-group-border-color);
+    gap: var(--ae-group-gap);
+} 
+.sub-group{
+    background-color: transparent !important;
+    outline: none !important;
+    padding: 0 !important;
+}
+.inset{
+    padding: 2px !important;
+    margin: -2px;
+}
+ 
+.flexbox.group .flexbox:not(.no-border) {
+    gap: var(--ae-group-gap);
+}
+
+.grow-all div:not(.shrink){
+    flex-grow: 1 !important;
+}
+
+.unset-min-width {
+    flex-grow: 0;
+    min-width: unset;
+}
+
+.row {
+    gap: var(--ae-gap-size);
+    flex-direction: row;
+}
+
+.col {
+    gap: var(--ae-gap-size);
+    flex-direction: column;
+}
+
+.no-border {
+    outline: var(--ae-border-size) solid var(--ae-panel-border-color);
+    border-radius: var(--ae-border-radius);
+    background-color: var(--ae-panel-bg-color);
+   /*  gap: 0; */
+    min-width: unset;
+    padding: var(--ae-panel-padding);
+}
+
+.shrink {
+    min-width: unset;
+    flex-wrap: nowrap;
+    white-space: nowrap;
+    flex-grow: 0;
+}
+
+.no-wrap {
+    flex-wrap: nowrap;
+}
+
+.fb-60 {
+    flex-basis: 66%;
+    min-width: min(220px, 100%);
+}
+
+.fb-40 {
+    flex-basis: 32.5%;
+}
+
+.min-width {
+    min-width: min(220px, 100%);
+}
+
+*.gradio-button.tool {
+    padding: 0;
+    align-self: flex-end;
+}
+
+.fb-50 {
+    flex-basis: 49%;
+}
+
+.flexbox.no-border.shrink {
+    color: black;
+}
+
+.no-border>* {
+    align-self: flex-end;
+    background-color: transparent;
+    outline: none;
+    flex-basis: 0%;
+    flex-grow: 1;
+    padding: 0;
+}
+
+.invisible *.gradio-button.tool {
+    font-size: 0;
+    line-height: 0;
+    background-color: var(--ae-input-bg-color);
+}
+
+.invisible *.gradio-button.tool:hover {
+    background-color: var(--ae-primary-color);
+}
+
+.invisible *.gradio-button.tool:hover .mask-icon {
+    background-color: var(--ae-input-hover-text-color);
+}
+
+*.tab-nav button:hover,
+*.tab-nav button.selected,
+*.gradio-button:hover {
+    color: var(--ae-input-hover-text-color);
+}
+
+.portal.no-border {
+    flex-basis: 0%;
+}
+
+.portal.gap {
+    gap: var(--ae-gap-size);
+}
+
+.portal.gap>* {
+    gap: var(--ae-gap-size);
+    display: flex;
+    flex-direction: column;
+}
+
+.portal.gap>div>* {
+    gap: var(--ae-gap-size);
+    display: flex;
+    flex-direction: row;
+}
+
+.portal.no-min-width {
+    min-width: unset;
+    width: 0%;
+    height: 100%;
+}
+
+* select,
+* input,
+* textarea,
+* button {
+    background: var(--ae-input-bg-color);
+    border: var(--ae-input-border-size) solid var(--ae-input-border-color);
+    border-radius: var(--ae-border-radius);
+    vertical-align: middle;
+    line-height: var(--ae-input-line-height);
+    font-size: var(--ae-input-font-size);
+    padding: var(--ae-input-padding);
+    color: var(--ae-input-text-color);
+    margin: 0;
+    min-height: var(--ae-input-height);
+}
+
+*.gradio-textbox label {
+    flex-direction: column;
+    display: flex;
+}
+
+*.gradio-slider label {
+    flex-direction: column;
+    display: flex;
+}
+
+* label>span {
+    border: var(--ae-input-border-size) solid transparent;
+    margin-bottom: 5px;
+    vertical-align: middle;
+    margin-top: 0;
+    color: var(--ae-label-color);
+    font-family: inherit;
+    line-height: 20px;
+    font-size: var(--ae-input-font-size);
+}
+
+*.gradio-slider .head {
+    margin-bottom: 0;
+    display: grid;
+    grid-template-columns: auto 70px;
+}
+
+*.gradio-slider input[type="range"] {
+    height: calc(var(--ae-input-height) * var(--ae-input-slider-height));
+    width: 100%;
+    min-height: calc(var(--ae-input-height) * var(--ae-input-slider-height));
+    margin-bottom: calc(var(--ae-input-height) * (1 - var(--ae-input-slider-height)) * 0.5);
+    margin-top: calc(var(--ae-input-height) * (1 - var(--ae-input-slider-height)) * 0.5);
+    padding: 0;
+}
+
+*.gradio-dropdown label {
+    flex-direction: column;
+    display: flex;
+    justify-content: space-between;
+    height: 100%;
+}
+
+* button {
+    min-width: var(--ae-input-height);
+    min-height: var(--ae-input-height);
+}
+
+*.gradio-slider input[type="number"] {
+    line-height: 16px;
+   /*  font-size: 14px; */
+    min-height: 22px;
+    max-height: 22px;
+    margin-top: 0px;
+    width: auto;
+    font-family: inherit;
+    padding: 0 5px;
+}
+
+*.no-border>*:not(:first-child) {
+    padding-left: 0;
+}
+
+*.wrap-inner {
+    display: flex;
+    position: relative;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: var(--ae-gap-size);
+}
+
+*.gradio-dropdown div.wrap,
+* input,
+* textarea,
+* button {
+    background: var(--ae-input-bg-color);
+    border: var(--ae-input-border-size) solid var(--ae-input-border-color);
+    border-radius: var(--ae-border-radius);
+    vertical-align: middle;
+    line-height: var(--ae-input-line-height);
+    font-size: var(--ae-input-font-size);
+    padding: var(--ae-input-padding);
+    color: var(--ae-input-text-color);
+    margin: 0;
+    min-height: var(--ae-input-height);
+}
+
+*.shrink {
+    min-width: unset;
+    flex-wrap: nowrap;
+    white-space: nowrap;
+    flex-grow: 0;
+}
+
+*.hidden {
+    display: none;
+}
+
+*.gradio-accordion .label-wrap {
+    min-height: var(--ae-input-height);
+    align-items: center;
+    display: flex;
+    justify-content: space-between;
+    cursor: pointer;
+    width: 100%;
+    margin: 0;
+    padding: var(--ae-panel-padding) calc(var(--ae-panel-padding) + 4px);
+    border-radius: var(--ae-border-radius);
+    outline: var(--ae-border-size) solid var(--ae-panel-border-color);
+    background-color: var(--ae-input-bg-color);
+    color: var(--ae-primary-color);
+    white-space: nowrap;
+}
+
+*.gradio-accordion .label-wrap.open {
+    margin-bottom: calc(var(--ae-panel-padding) - var(--ae-border-size));
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+   
+  /*   background-color: var(--ae-panel-bg-color);
+    outline-color: var(--ae-primary-color); */
+}
+
+.gradio-accordion:has(> .open) {
+  /*   outline: var(--ae-border-size) solid var(--ae-primary-color) !important;  */
+    background-color: var(--ae-input-bg-color);
+    outline: var(--ae-border-size) solid var(--ae-panel-border-color);
+    border-radius: var(--ae-border-radius);
+    position:relative;
+    outline-offset: 0px;
+}
+.gradio-accordion > div > .gap {
+    padding: var(--ae-panel-padding);
+}
+
+*.flexbox.align-flex-end {
+    justify-content: flex-end;
+}
+
+* input[type="checkbox"] {
+    min-height: var(--ae-input-line-height);
+}
+
+* input[type="radio"] {
+    min-height: var(--ae-input-line-height);
+}
+
+*.no-bg {
+    background-color: transparent;
+    outline: none;
+}
+
+*.gradio-radio label {
+    display: flex;
+    align-items: center;
+    transition: none;
+    cursor: pointer;
+    box-shadow: none;
+    gap: 5px;
+    flex: 0 1 0%;
+    background: var(--ae-input-bg-color);
+    border: var(--ae-input-border-size) solid var(--ae-input-border-color);
+    border-radius: var(--ae-border-radius);
+    vertical-align: middle;
+    line-height: var(--ae-input-line-height);
+    font-size: var(--ae-input-font-size);
+    padding: var(--ae-input-padding);
+    color: var(--ae-input-text-color);
+    margin: 0;
+    min-height: var(--ae-input-height);
+}
+
+*.gradio-radio label span {
+    margin: 0;
+    white-space: nowrap;
+    border: 0;
+}
+
+*.gradio-radio .wrap {
+    gap: 5px;
+    display: flex;
+    flex-wrap: wrap;
+}
+
+*.gradio-radio>span {
+    border: var(--ae-input-border-size) solid transparent;
+    margin-bottom: 5px;
+    vertical-align: middle;
+    margin-top: 0;
+    color: var(--ae-label-color);
+    font-family: inherit;
+    line-height: var(--ae-input-font-size);
+    font-size: var(--ae-input-font-size);
+}
+
+* textarea::placeholder {
+    color: var(--ae-input-placeholder-color);
+    opacity: 1;
+}
+
+*.gradio-gallery .icon {
+    opacity: 0.5;
+    height: var(--ae-input-icon-height);
+    color: var(--ae-input-text-color);
+}
+
+*.gradio-html p {
+    margin: 0;
+    font-size: 13px;
+    line-height: 16px;
+    color: var(--ae-label-color);
+}
+
+*.gradio-image .image-container {
+    width: 100%;
+    height: 100%;
+}
+
+/* *[class*="gradio"] .center {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    text-align: center;
+    cursor: pointer;
+    width: 100%;
+    height: 100%;
+    background: var(--ae-input-bg-color);
+    border: var(--ae-input-border-size) solid var(--ae-input-border-color);
+    border-radius: var(--ae-border-radius);
+    min-height: 25vh;
+    position: relative;
+} */
+
+* [data-testid="image"] img {
+    max-height: 40vh;
+}
+
+*.block {
+    border: 0 !important;
+    padding: 0;
+    margin: 0;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    height: auto;
+    flex: 1 1 0%;
+    min-width: min(160px, 100%);
+}
+
+[data-testid="block-label"],
+div.float {
+    position: absolute;
+    display: inline-flex;
+    align-items: center;
+    z-index: 20;
+    background: var(--ae-input-bg-color);
+    padding: 3px;
+    pointer-events: none;
+    font-weight: normal;
+    font-size: 10px;
+    line-height: 10px;
+    width: fit-content;
+    border-radius: var(--ae-border-radius);
+    border-bottom-left-radius: 0;
+    border-top-right-radius: 0;
+    border: var(--ae-input-border-size) solid var(--ae-input-border-color);
+}
+
+[data-testid="block-label"] span,
+div.float span {
+    opacity: 0.8;
+    margin-right: 3px;
+    width: 11px;
+    height: 11px;
+}
+[data-testid="block-label"]{
+    position: relative;
+}
+.gradio-highlightedtext span {
+    padding: 0;
+}
+
+.gradio-highlightedtext .textfield span {
+    padding: 2px;
+    border-radius: 5px;
+}
+
+.gradio-highlightedtext span.textspan span {
+    color: #000;
+    border-radius: 5px;
+    min-width: 16px;
+    display: inline-block;
+    text-align: center;
+}
+.gradio-highlightedtext .textfield{
+    display: flex;
+    gap: 5px;
+    padding: 5px;
+    background-color: var(--ae-input-bg-color);
+    border-radius: var(--ae-border-radius);
+    margin-top: 5px;
+    flex-wrap: wrap;
+}
+[id$="edit_user_metadata"] {
+    gap: var(--ae-gap-size);
+    text-align: left;
+}
+[id$="edit_user_metadata"] .gradio-column.gap{
+    flex-grow:1;
+    justify-content: flex-end;
+    width: auto;
+}
+[id$="edit_user_metadata"] .gradio-column.gap:first-child {
+    flex-grow: 100;
+}
+[id$="edit_user_metadata"] .extra-network-name{
+    font-size: 16px;
+    flex-grow:0;
+}
+[id$="edit_user_metadata"] .extra-network-name + .form label,
+[id$="edit_user_metadata"] .extra-network-name + .form textarea,
+[id$="edit_user_metadata"] .extra-network-name + .form{
+    flex-grow:10;
+}
+[id$="edit_user_metadata"] .extra-network-name ~ .form .gradio-dropdown,
+[id$="edit_user_metadata"] .extra-network-name + .form .gradio-textbox {
+    padding:0;
+    background-color: transparent;
+    outline: 0;
+}
+[id$="edit_user_metadata"] .gradio-column.gap:has(img) {
+    line-height: 0;
+}
+[id$="edit_user_metadata"] .scroll-hide{
+    overflow-y:auto !important;
+}
+
+* input.svelte-116rqfv {
+    display: none;
+}
+
+*.wrap.svelte-xwlu1w {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+}
+
+* button:hover {
+    cursor: pointer;
+    background-color: var(--ae-primary-color);
+}
+* select:focus,
+* input:focus,
+* button:focus,
+* textarea:focus {
+    outline: none;
+    border-color: var(--ae-primary-color);
+}
+
+*.gradio-dropdown input:focus {
+    outline: var(--ae-input-border-size) solid var(--ae-primary-color);
+}
+
+*.tab-nav button {
+    border-radius: 0;
+}
+
+*.tab-nav button:first-child {
+    border-top-left-radius: var(--ae-border-radius);
+}
+
+*.tab-nav button:last-child {
+    border-top-right-radius: var(--ae-border-radius);
+}
+
+*.tab-item {
+    background-color: var(--ae-panel-bg-color);
+    padding: var(--ae-panel-padding);
+}
+
+*.gradio-tabitem {
+    background-color: var(--ae-input-bg-color);
+    padding: var(--ae-panel-padding);
+    border-radius: var(--ae-border-radius);
+    border-top-left-radius: 0;
+}
+
+button:hover,
+button.active,
+*.tab-nav button:hover,
+*.tab-nav button.selected {
+    background-color: var(--ae-primary-color);
+}
+
+button.active span,
+button:hover span{
+    color: var(--ae-input-hover-text-color);
+}
+
+button.active .mask-icon,
+button:hover .mask-icon{
+    background-color: var(--ae-input-hover-text-color);
+}
+
+
+
+*.gap {
+    display: flex;
+    flex-direction: column;
+    gap: var(--ae-gap-size);
+}
+
+*.form {
+    display: inherit;
+    flex-direction: inherit;
+    gap: var(--ae-gap-size);
+    flex: 1 1 0%;
+    flex-wrap: inherit;
+}
+
+* textarea {
+    height: auto !important;
+    overflow-x: hidden;
+    overflow-y: auto !important;
+}
+
+*.hidden,
+*.hide {
+    display: none !important;
+}
+
+.gradio-column:empty,
+.hide-empty:has(.form.hidden),
+.hide-empty:has(.gradio-html:first-child:empty) {
+    display: none;
+}
+
+:not(.portal)>.gradio-row {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    gap: var(--ae-gap-size);
+}
+
+:not(.portal)>.gradio-column {
+    display: flex;
+    flex-direction: column;
+    gap: var(--ae-gap-size);
+    flex-grow: 1;
+    width: 100%;
+}
+
+:not(.portal)>.gradio-highlightedtext,
+:not(.portal)>.gradio-row,
+:not(.portal)>.block.gradio-slider,
+:not(.portal)>.block.gradio-dropdown,
+:not(.portal)>.block.gradio-radio,
+:not(.portal)>.block.gradio-checkbox,
+:not(.portal)>.block.gradio-textbox {
+    background-color: var(--ae-panel-bg-color);
+    padding: var(--ae-panel-padding);
+    outline: var(--ae-border-size) solid var(--ae-panel-border-color);
+    border-radius: var(--ae-border-radius);
+    margin: 0;
+}
+
+:not(.portal)>.gradio-row>.gradio-row>.gradio-column>.block,
+:not(.portal)>.gradio-row>.form>.block,
+:not(.portal)>.gradio-row .form {
+    padding: 0;
+    background-color: transparent;
+    outline: none;
+    justify-content: flex-end;
+}
+
+:not(.portal)>.gradio-row .form>.gradio-row {
+    flex-grow: 1;
+}
+:not(.portal)>.gradio-audio .wrap,
+:not(.portal)>.gradio-video .wrap,
+:not(.portal)>.gradio-file .wrap,
+:not(.portal)>.gradio-image .wrap {
+    flex-direction: column;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    min-height: 25vh;
+    width: 100%;
+    height: 100%;
+}
+
+[data-testid="block-info"] {
+    display: flex;
+    flex-direction: column;
+    text-wrap: wrap;
+}
+
+*.gradio-dropdown {
+    overflow: visible !important;
+    pointer-events: none;
+}
+
+*.gradio-dropdown .secondary-wrap input {
+    border: none !important;
+    background: none;
+    min-height: unset;
+    line-height: calc(var(--ae-input-icon-height) - 10px);
+    flex-grow: 1;
+    min-height: calc(var(--ae-input-height) - ( var(--ae-input-border-size) * 2 ));
+}
+
+*.gradio-dropdown .secondary-wrap {
+    display: flex;
+    align-items: center;
+    flex-grow: 1;
+    gap: var(--ae-gap-size-val);
+    padding-right: var(--ae-input-height);
+}
+
+*.gradio-dropdown div.wrap {
+    background: var(--ae-input-bg-color);
+    padding: 0;
+    position: relative;
+    pointer-events: all;
+}
+
+*.gradio-dropdown label>span {
+    margin-bottom: 5px;
+}
+
+*.gradio-dropdown label>* {
+    margin-bottom: 0;
+}
+
+* svg.dropdown-arrow {
+    height: 90%;
+    position: absolute;
+    right: 5px;
+    fill: var(--ae-input-text-color);
+}
+
+* .gradio-dropdown input {
+    display: flex;
+    flex: 1 1 100%;
+    width: 0px;
+}
+
+ul.options {
+    position: absolute;
+    z-index: 99999;
+    margin: 0px !important;
+    box-shadow: none;
+    border-radius: var(--ae-border-radius);
+    background: var(--ae-main-bg-color);
+    min-width: fit-content;
+    max-width: 50vh;
+    max-height: 25vh !important;
+    overflow: auto;
+    color: var(--ae-label-color);
+    list-style: none;
+    top: var(--ae-input-height) !important;
+    margin-top: calc(var(--ae-border-size) * -1) !important;
+    bottom: unset !important;
+    padding: 0;
+    width: 100% !important;
+    outline: var(--ae-border-size) solid var(--ae-input-border-color);
+    overflow-x: hidden;
+}
+
+li.item {
+    display: flex;
+    cursor: pointer;
+    padding: var(--ae-panel-padding);
+    justify-content: space-between;
+    margin: 0;
+}
+
+li.item.active {
+    background: var(--ae-primary-color);
+    color: var(--ae-input-hover-text-color);
+}
+
+li.item span {
+    order: 2;
+}
+
+*.token {
+    flex-direction: row;
+    display: flex;
+    gap: 5px;
+    line-height: calc(var(--ae-input-height) - (var(--ae-input-border-size) * 2));
+    background: var(--ae-panel-bg-color);
+    outline: var(--ae-input-border-size) solid var(--ae-input-border-color);
+    border-radius: var(--ae-border-radius);
+    font-size: var(--ae-input-font-size);
+    padding: 0 5px;
+    color: var(--ae-input-text-color);
+    margin: 0px;
+    overflow: hidden;
+}
+
+*.token>span {
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+}
+
+*.token-remove {
+    display: flex;
+    flex-direction: column;
+    align-self: center;
+    background: var(--ae-input-bg-color);
+    border-radius: 50%;
+    padding: 1px;
+    border: var(--ae-input-border-size) solid var(--ae-input-bg-color);
+}
+
+*.token-remove svg {
+    fill: var(--ae-input-text-color);
+}
+
+*.gradio-gallery {
+    justify-content: center;
+    position: relative;
+    width: 100%;
+}
+
+*.grid-container {
+    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
+    display: grid;
+    gap: var(--ae-gap-size);
+}
+
+*.thumbnails.scroll-hide {
+   /*  display: flex; */
+    scroll-behavior: smooth;
+    overflow: hidden;
+    align-self: center;
+    gap: 5px;
+    height: 100%;
+    padding: 5px;
+    flex-grow: 0;
+    max-height: 60px;
+}
+
+*.thumbnail-small img {
+    width: 100%;
+    height: 100%;
+    object-fit: contain;
+}
+
+*.gradio-gallery .preview {
+    position: absolute;
+    z-index: 1;
+    top: 0;
+    background-color: var(--ae-main-bg-color);
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    border: var(--ae-border-size) solid var(--ae-input-border-color);
+}
+
+*.gradio-gallery .preview img {
+    width: 100%;
+    max-height: 100vh;
+    object-fit: contain;
+    background-color: var(--ae-input-bg-color);
+    border: var(--ae-border-size) solid var(--ae-input-border-color);
+}
+
+*.gradio-gallery .preview>img {
+    border: 0;
+}
+
+*.grid-wrap {
+    overflow-y: auto;
+    position: absolute !important;
+    z-index: 0;
+    top: 0;
+    background-color: var(--ae-main-bg-color);
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+}
+
+*.thumbnail-lg img {
+    width: 100%;
+    height: 100%;
+    object-fit: contain;
+    margin-bottom: calc(var(--ae-border-size) * -1);
+}
+
+*.thumbnail-item {
+    height: auto;
+    width: 100%;
+    object-fit: contain;
+}
+
+* button.thumbnail-item.thumbnail-small {
+    min-width: fit-content;
+    padding: 0;
+}
+
+* button.thumbnail-item:hover {
+    background: var(--ae-panel-bg-color);
+}
+
+* button.thumbnail-item.selected {
+    border: var(--ae-border-size) solid var(--ae-primary-color);
+}
+
+*.gradio-gallery .preview button[aria-label] {
+    width: var(--ae-input-height);
+    height: var(--ae-input-height);
+}
+
+*.gradio-gallery .preview .svelte-19sk1im {
+    right: 0;
+}
+
+*.gradio-gallery .empty {
+    min-height: 100%;
+    align-items: center;
+    display: flex;
+    justify-content: center;
+}
+
+* .styler {
+    display: flex;
+    flex-direction: column;
+    gap: var(--ae-gap-size);
+}
+
+* .icon-buttons {
+    position: absolute;
+    display: flex;
+    right: 0;
+    padding: var(--ae-panel-padding);
+    gap: var(--ae-gap-size);
+}
+
+* .livePreview {
+    position: absolute;
+    z-index: 2;
+    width: 100% !important;
+    height: 100% !important;
+    object-fit: contain;
+    background-color: var(--ae-main-bg-color);
+}
+
+* .livePreview img {
+    object-fit: contain;
+    width: 100%;
+    height: 100%;
+    position: absolute;
+}
+
+::-webkit-scrollbar {
+    width: 10px;
+    height: 10px;
+}
+
+::-webkit-scrollbar-button {
+    display: none;
+}
+
+::-webkit-scrollbar-thumb,
+::-webkit-scrollbar-track {
+    border-radius: var(--ae-border-radius);
+    border: var(--ae-input-border-size) solid transparent;
+    background-clip: content-box;
+    background-color: var(--ae-input-bg-color);
+}
+
+::-webkit-scrollbar-thumb {
+    background-color: var(--ae-panel-border-color)
+}
+
+.split {
+    color: #ddd;
+    min-height: 50px;
+    display: flex;
+    flex-direction: row;
+    height: 100%;
+    flex-grow: 1;
+}
+
+.split[direction="vertical"] {
+    flex-direction: column;
+    height: 100%;
+}
+
+.split-container {
+    position: relative;
+    overflow: auto;
+}
+
+* .gutter.gutter-horizontal {
+    background: linear-gradient(90deg,
+            rgba(0, 0, 0, 0) 40%,
+            var(--ae-panel-bg-color) 45%,
+            var(--ae-panel-bg-color) 55%,
+            rgba(0, 0, 0, 0) 60%);
+}
+
+* .gutter.gutter-horizontal:hover {
+    background: linear-gradient(90deg,
+            rgba(0, 0, 0, 0) 40%,
+            var(--ae-primary-color) 45%,
+            var(--ae-primary-color) 55%,
+            rgba(0, 0, 0, 0) 60%);
+    cursor: col-resize;
+}
+
+* .gutter.gutter-vertical {
+    background: linear-gradient(0deg,
+            rgba(0, 0, 0, 0) 40%,
+            var(--ae-panel-bg-color) 45%,
+            var(--ae-panel-bg-color) 55%,
+            rgba(0, 0, 0, 0) 60%);
+}
+
+* .gutter.gutter-vertical:hover {
+    background: linear-gradient(0deg,
+            rgba(0, 0, 0, 0) 40%,
+            var(--ae-primary-color) 45%,
+            var(--ae-primary-color) 55%,
+            rgba(0, 0, 0, 0) 60%);
+    cursor: row-resize;
+}
+
+.gutter:has(+ .split-container .accordion-vertical:not(.expand)) {
+    display: none;
+}
+
+.accordion-title {
+    font-family: "IBM Plex Mono", monospace;
+   /*  text-shadow: 0px 2px 2px #000000; */
+}
+
+.accordion {
+    display: flex;
+    flex-direction: column;
+    border-radius: var(--ae-border-radius);
+    outline: var(--ae-border-size) solid var(--ae-panel-border-color);
+    background-color: var(--ae-panel-bg-color);
+}
+
+.accordion-container {
+    display: none;
+    flex-direction: column;
+    min-height: 16px;
+    margin-top: var(--ae-border-size);
+    gap: var(--ae-gap-size);
+    padding: var(--ae-panel-padding);
+}
+
+.accordion.expand .accordion-container {
+    display: flex;
+}
+
+.accordion-bar {
+    display: flex;
+    align-items: center;
+    background-color: var(--ae-panel-bg-color);
+    justify-content: space-between;
+    cursor: pointer;
+    border-radius: var(--ae-border-radius);
+    outline: var(--ae-border-size) solid var(--ae-panel-border-color);
+    line-height: var(--ae-input-line-height);
+    font-size: var(--ae-input-font-size);
+    padding: var(--ae-panel-padding) calc(var(--ae-panel-padding) + 4px);
+    color: var(--ae-input-text-color);
+    margin: 0px;
+    min-height: var(--ae-input-height);
+    gap: var(--ae-gap-size);
+}
+
+.accordion-bar .portal {
+    padding: 0;
+}
+
+.accordion-bar .flexbox {
+    gap: var(--ae-gap-size);
+    align-items: center;
+}
+
+.accordion.expand .accordion-bar {
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+}
+
+.accordion-icon {
+    transform: rotate(90deg);
+}
+
+.accordion.expand .accordion-icon {
+    transform: rotate(0deg);
+}
+
+.accordion-vertical.expand .accordion-icon {
+    transform: rotate(-90deg);
+}
+
+.accordion-vertical {
+    margin: calc(var(--ae-panel-padding) * 1);
+    height: calc(100% - var(--ae-panel-padding) * 2);
+    position: relative;
+    flex-direction: row;
+}
+
+.accordion-vertical .accordion-bar {
+    border-radius: var(--ae-border-radius) !important;
+    flex-direction: column-reverse;
+    min-height: 100%;
+    border-top-right-radius: 0 !important;
+    border-bottom-right-radius: 0 !important;
+    flex-grow: 0;
+    padding: var(--ae-panel-padding);
+    padding-left: var(--ae-panel-padding);
+}
+
+.accordion-vertical .accordion-container {
+    margin: 0;
+    overflow-x: hidden;
+    position: relative;
+    height: 100%;
+    flex-direction: row;
+    min-height: 100%;
+    overflow-y: auto;
+    flex-grow: 1;
+    margin-left: var(--ae-border-size);
+}
+
+.accordion-vertical .accordion-title {
+    transform: rotate(-90deg) translateX(50%);
+    white-space: nowrap;
+    width: 0;
+}
+
+/* .accordion-bar .xtabs-tab {
+    justify-content: flex-start;
+} */
+
+.split-container.v-expand {
+    flex-basis: 0% !important;
+    min-width: fit-content;
+}
+
+.split-container.v-expand .accordion-vertical .accordion-bar {
+    border-radius: var(--ae-border-radius) !important;
+}
+
+.portal.auto-scroll {
+    flex: 2 2 auto;
+    overflow-x: hidden;
+    overflow-y: auto;
+    min-height: 0px;
+}
+
+.layout {
+    display: flex;
+    flex-direction: column;
+    position: absolute;
+    inset:0;
+    padding: var(--ae-panel-padding);
+    gap: var(--ae-gap-size);
+}
+
+.layout-header {
+    flex-direction: column;
+    gap: var(--ae-gap-size);
+    display: flex;
+    padding: 0;
+}
+
+.layout-footer {
+    flex-direction: column;
+    gap: var(--ae-gap-size);
+    display: flex;
+    padding: 0;
+}
+
+.layout-content {
+    flex-direction: column;
+    gap: var(--ae-gap-size);
+    flex-grow: 1;
+    display: flex;
+    min-height: 16px;
+    overflow: auto;
+    padding: var(--ae-border-size);
+    margin: calc(var(--ae-border-size) * -1);
+}
+
+.mask-icon {
+    display: inline-block;
+    background: var(--ae-input-text-color);
+    border: var(--ae-input-border-size) solid var(--ae-input-border-color);
+    border-radius: var(--ae-border-radius);
+    line-height: var(--ae-input-line-height);
+    font-size: var(--ae-input-font-size);
+    padding: var(--ae-input-padding);
+    color: var(--ae-input-text-color);
+    margin: 0;
+    height: calc(var(--ae-input-height) - var(--ae-input-border-size) * 2);
+    width: calc(var(--ae-input-height) - var(--ae-input-border-size) * 2);
+    cursor: pointer;
+    -webkit-mask-size: contain;
+    -webkit-mask-repeat: no-repeat;
+    -webkit-mask-position: center center;
+    max-width: 24px;
+    max-height: 24px;
+    border: 0;
+}
+
+/* .mask-icon:hover {
+    background-color: var(--ae-primary-color);
+} */
+
+*.invisible {
+    position: relative;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+    background-color: transparent;
+    outline: none;
+}
+
+*.invisible .tool {
+    background: transparent;
+}
+
+*.invisible label {
+    display: none;
+}
+
+*.invisible:has(.gradio-checkbox) {
+    pointer-events: none;
+}
+
+.invisible *.gradio-button {
+    min-width: var(--ae-input-height);
+    min-height: var(--ae-input-height);
+    font-size: 0;
+    line-height: 0;
+}
+
+/* button .mask-icon:hover {
+    background-color: var(--ae-input-hover-text-color);
+} */
+
+.icons-bar {
+    padding-top: 0;
+    padding-bottom: 0;
+    justify-content: center;
+}
+
+.accordion-vertical .icons-bar {
+    padding-left: 0;
+    padding-right: 0;
+    padding-top: var(--ae-panel-padding);
+    padding-bottom: var(--ae-panel-padding);
+}
+
+.icons-bar .flexbox>.mask-icon {
+    min-width: calc(var(--ae-input-height) + var(--ae-input-border-size) * 2);
+}
+
+/* .icons-bar .mask-icon:hover {
+    background-color: var(--ae-input-hover-text-color);
+} */
+
+.xtabs {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    border-radius: var(--ae-border-radius);
+    outline: var(--ae-border-size) solid var(--ae-panel-border-color);
+    background-color: var(--ae-panel-bg-color);
+}
+
+.xtabs-item {
+    flex-direction: column;
+    min-height: 16px;
+    gap: var(--ae-gap-size);
+    padding: var(--ae-panel-padding);
+}
+
+.xtabs-item.active {
+    display: flex;
+}
+
+.xtabs-tab.active {
+    background-color: var(--ae-primary-color);
+}
+
+.xtabs-tabs {
+    display: flex;
+    flex-wrap: wrap;
+}
+
+.xtabs-tab {
+    display: flex;
+    gap: 5px;
+    align-items: center;
+    background: var(--ae-input-bg-color);
+    border: var(--ae-input-border-size) solid var(--ae-input-border-color);
+    border-radius: var(--ae-border-radius);
+    line-height: var(--ae-input-line-height);
+    font-size: var(--ae-input-font-size);
+    padding: var(--ae-input-padding);
+    color: var(--ae-input-text-color);
+    margin: 0;
+    min-height: var(--ae-input-height);
+    min-width: var(--ae-input-height);
+    cursor: pointer;
+    justify-content: center;
+}
+
+.xtabs-tab:hover {
+    background-color: var(--ae-primary-color);
+    color: var(--ae-input-text-color);
+}
+
+/* .xtabs-tab:hover .mask-icon {
+    background-color: var(--ae-input-hover-text-color);
+} */
+
+/* .active .mask-icon {
+    background-color: var(--ae-input-hover-text-color);
+} */
+
+.accordion-bar .xtabs-tab {
+    width: 100%;
+}
+
+* [data-testid="image"] img {
+    object-fit: contain;
+    width: 100%;
+    height: 100%;
+}
+
+* [data-testid="image"] .wrap {
+    display: flex;
+    flex-direction: column;
+}
+
+.gr-group {
+    width: 100%;
+    position: relative;
+}
+
+.border-padding {
+    padding: var(--ae-panel-padding);
+}
+
+.full-height>textarea,
+.full-height {
+    height: 100% !important;
+    resize: none;
+}
+
+h1 {
+    line-height: 1em;
+    margin: 0;
+}
+
+.no-padding-one,
+.no-padding {
+    padding: 0;
+}
+
+.no-padding>* {
+    padding: 0;
+}
+
+*.extra-network-cards {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
+    gap: var(--ae-gap-size);
+  /*   content-visibility: auto; */
+}
+
+*.extra-network-cards .card {
+    display: block;
+}
+
+*.extra-network-cards .card img {
+    object-fit: cover;
+    width: 100%;
+    height: auto;
+    aspect-ratio: 3/4;
+    border-radius: var(--ae-border-radius);
+    transform: scale(1.1);
+    pointer-events: none;
+}
+
+*.extra-network-cards .card:hover .button-row {
+    display: flex;
+}
+
+*.extra-network-cards .card:hover {
+    cursor: pointer;
+}
+
+*.extra-network-cards .card .button-row {
+    position: absolute;
+    display: none;
+    z-index: 1;
+    top: 0px;
+    right: 0;
+    background-color: var(--ae-input-bg-color);
+    padding: 2px;
+}
+
+*.extra-network-cards .card .card-button:hover {
+    background-color: var(--ae-primary-color);
+}
+
+*.extra-network-cards .card .card-button {
+    background-color: var(--ae-label-color);
+    width: 24px;
+    height: 24px;
+}
+
+*.extra-network-cards .card {
+    position: relative;
+    overflow: hidden;
+    background-color: var(--ae-input-bg-color);
+    border-radius: var(--ae-border-radius);
+    border: var(--ae-border-size) solid var(--ae-input-bg-color);
+}
+
+*.actions {
+    position: absolute;
+    bottom: 0;
+    padding: 10px;
+    background-color: var(--ae-main-bg-color);
+    font-size: 16px;
+    font-weight: 600;
+    left: 0;
+    right: 0;
+    display: flex;
+    flex-direction: column;
+    gap: 5px;
+    max-height: 100%;
+}
+
+span.name {
+    overflow-wrap: anywhere;
+   /*  text-shadow: 0 0px 3px #000; */
+    text-transform: uppercase;
+    display: block;
+    color: var(--ae-label-color);
+    text-align: center;
+}
+
+span.description {
+    font-size: 11px;
+    line-height: 14px;
+    display: block;
+    max-height: 80px;
+    overflow: hidden;
+    opacity: 0.6;
+}
+
+
+
+*.metadata-button {
+    -webkit-mask-image: url(./html/svg/file-info-fill.svg);
+}
+
+*.edit-button.card-button {
+    -webkit-mask-image: url(./html/svg/file-edit-fill.svg);
+}
+
+div#flexbox-10 {
+    justify-content: center;
+}
+
+div#flexbox-10>* {
+    flex-grow: 0;
+}
+
+div#iobp {
+    position: relative;
+    height: 90vh;
+}
+
+[id$="2img_neg_prompt"] textarea,
+[id$="2img_prompt"] textarea {
+    position: absolute;
+    inset: 0;
+    resize: none;
+    font-size: 16px;
+    line-height: 24px;
+    width: 100%;
+    min-height: 100%;
+}
+
+div#layout-3 {
+    position: relative;
+    height: 90vh;
+}
+
+
+.icon-folder {
+    -webkit-mask-image: url(./html/svg/folder-open-line.svg);
+}
+
+.icon-save {
+    -webkit-mask-image: url(./html/svg/save-2-line.svg);
+}
+
+.icon-zip {
+    -webkit-mask-image: url(./html/svg/file-zip-line.svg);
+}
+
+.icon-2txt2img {
+    -webkit-mask-image: url(./html/svg/t-box-line.svg);
+}
+
+.icon-2inpaint {
+    -webkit-mask-image: url(./html/svg/paint-brush-line.svg);
+}
+.gradio-button:has( [class*="icon-2"])::before,
+.gradio-button:has( [class*="icon-2"])::after{
+    content: "";
+    width: 11px;
+    height: 11px;
+    position: absolute;
+}
+
+.gradio-button:has( [class*="icon-2"])::after {
+    right: 0px;
+    top: 0px;
+    background-color: var(--ae-input-hover-text-color);
+    -webkit-mask-image: url(./html/svg/arrow-up-line.svg);
+    z-index: 2;
+}
+.gradio-button:has( [class*="icon-2"])::before {
+    right: -1px;
+    top: -1px;
+    background-color: var(--ae-primary-color);
+    padding: 1px;
+    border-radius: 50%;
+    z-index: 1;
+}
+
+.icon-2extras {
+    transform: scaleX(-1);
+    -webkit-mask-image: url(./html/svg/picture-in-picture-exit-line.svg);
+}
+
+.icon-2img2img {
+    -webkit-mask-image: url(./html/svg/image-line.svg);
+}
+
+.refresh {
+    -webkit-mask-image: url(./html/svg/loop-right-line.svg);
+}
+
+.icon-info {
+    -webkit-mask-image: url(./html/svg/information-line.svg);
+}
+
+.icon-crop {
+    -webkit-mask-image: url(./html/svg/crop-line.svg);
+}
+
+.icon-res-switch {
+    -webkit-mask-image: url(./html/svg/arrow-up-down-line.svg);
+}
+
+.icon-scripts {
+    -webkit-mask-image: url(./html/svg/plug-line.svg);
+}
+
+.icon-generate {
+    -webkit-mask-image: url(./html/svg/ai-generate.svg);
+}
+
+.icon-skip {
+    -webkit-mask-image: url(./html/svg/skip-forward-line.svg);
+}
+
+.icon-stop {
+    -webkit-mask-image: url(./html/svg/stop-circle-line.svg);
+}
+
+.icon-loop {
+    -webkit-mask-image: url(./html/svg/infinity-fill.svg);
+}
+
+.icon-node-tree {
+    -webkit-mask-image: url(./html/svg/node-tree.svg);
+}
+
+.icon-magic {
+    -webkit-mask-image: url(./html/svg/magic-line.svg);
+}
+
+.icon-delete {
+    -webkit-mask-image: url(./html/svg/delete-bin-2-line.svg);
+}
+
+.icon-styles-edit {
+    -webkit-mask-image: url(./html/svg/draft-line.svg);
+}
+
+.icon-styles-apply {
+    -webkit-mask-image: url(./html/svg/bill-line.svg);
+}
+
+.icon-dice {
+    -webkit-mask-image: url(./html/svg/dice-1.svg);
+}
+
+.icon-recycle {
+    -webkit-mask-image: url(./html/svg/recycle-line.svg);
+}
+
+.icon-equalize {
+    -webkit-mask-image: url(./html/svg/equalizer-line.svg);
+}
+
+.icon-bug {
+    -webkit-mask-image: url(./html/svg/bug-2-line.svg);
+}
+
+.icon-prompt {
+    -webkit-mask-image: url(./html/svg/edit-box-line.svg);
+}
+
+.icon-arrow-down {
+    -webkit-mask-image: url(./html/svg/arrow-down-s-line.svg);
+}
+.icon-arrow-up {
+    -webkit-mask-image: url(./html/svg/arrow-up-s-line.svg);
+}
+
+
+.icon-checkpoints {
+    -webkit-mask-image: url(./html/svg/sparkling-line.svg);
+}
+
+.icon-textual-inversion {
+    -webkit-mask-image: url(./html/svg/focus-line.svg);
+}
+
+.icon-hypernetworks {
+    -webkit-mask-image: url(./html/svg/focus-2-line.svg);
+}
+
+.icon-lora {
+    -webkit-mask-image: url(./html/svg/focus-2-fill.svg);
+}
+
+.icon-quicksettings {
+    -webkit-mask-image: url(./html/svg/list-settings-line.svg);
+}
+
+.icon-pnginfo {
+    -webkit-mask-image: url(./html/svg/image-add-line.svg);
+}
+
+.icon-extensions {
+    -webkit-mask-image: url(./html/svg/box-3-line.svg);
+}
+
+.icon-theme {
+    -webkit-mask-image: url(./html/svg/contrast-drop-2-line.svg);
+}
+
+.icon-settings {
+    -webkit-mask-image: url(./html/svg/settings-3-line.svg);
+}
+
+.icon-app-logo {
+    -webkit-mask-image: url(./html/SDNext_Logo.svg);
+}
+
+.icon-txt2img {
+    -webkit-mask-image: url(./html/svg/t-box-line.svg);
+}
+
+.icon-img2img {
+    -webkit-mask-image: url(./html/svg/image-line.svg);
+}
+
+.icon-extras {
+    transform: scaleX(-1);
+    -webkit-mask-image: url(./html/svg/picture-in-picture-exit-line.svg);
+}
+
+.icon-model-merger {
+    transform: rotate(90deg);
+    -webkit-mask-image: url(./html/svg/organization-chart.svg);
+}
+
+.icon-train {
+    -webkit-mask-image: url(./html/svg/robot-2-line.svg);
+}
+
+.icon-image-edit {
+    -webkit-mask-image: url(./html/svg/image-edit-line.svg);
+}
+.icon-ruler {
+    -webkit-mask-image: url(./html/svg/ruler-2-line.svg);
+}
+
+.question-answer {
+    -webkit-mask-image: url(./html/svg/question-answer-line.svg);
+}
+
+.icon-install {
+    -webkit-mask-image: url(./html/svg/install-line.svg);
+}
+
+.star_count:before
+{
+    content:"";
+    -webkit-mask-image: url(./html/svg/star-line.svg);
+    width: 16px;
+    height: 16px;
+    background-color: var(--ae-primary-color);
+    display: flex;
+
+}
+
+.icon-rocket {
+    -webkit-mask-image: url(./html/svg/rocket-fill.svg);
+}
+.icon-github {
+    -webkit-mask-image: url(./html/svg/github-fill.svg);
+}
+.icon-reload {
+    -webkit-mask-image: url(./html/svg/restart-fill.svg);
+}
+.icon-gradio {
+    -webkit-mask-image: url(./html/svg/gradio-fill.svg);
+}
+
+.icon-sort {
+    -webkit-mask-image: url(./html/svg/sort-asc.svg);
+}
+button.active .icon-sort {
+    -webkit-mask-image: url(./html/svg/sort-desc.svg);
+}
+
+.icon-cancel {
+    -webkit-mask-image: url(./html/svg/close-line.svg);
+}
+.icon-terminal {
+    -webkit-mask-image: url(./html/svg/terminal-box-line.svg);
+}
+
+.icon-dock {
+    -webkit-mask-image: url(./html/svg/layout-2-line.svg);
+}
+
+.icon-trophy {
+    -webkit-mask-image: url(./html/svg/trophy-line.svg);
+}
+
+.icon-vip {
+    -webkit-mask-image: url(./html/svg/vip-diamond-line.svg);
+}
+
+.icon-contributors{
+    -webkit-mask-image: url(./html/svg/team-line.svg);
+}
+
+#contributors_grid {
+    gap: 5px;
+    align-items: flex-start;
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
+    white-space: nowrap;
+    overflow: auto;
+    margin: var(--ae-panel-padding);
+    padding-right: var(--ae-panel-padding);
+}
+#contributors_grid a {
+    align-items: center;
+    padding: 10px;
+}
+#contributors_grid figure {
+    margin: 0;
+}
+#contributors_grid img {
+    width: 60px;
+    border-radius: 50%;
+}
+
+#flexbox-9 {
+    justify-content: flex-end;
+}
+
+#flexbox-8 {
+    min-width: 0px;
+    justify-content: flex-end;
+}
+
+#split-2 {
+    height: 100%;
+}
+
+#portal-49 {
+    min-height: 100%;
+}
+
+#portal-50 {
+    min-height: 100%;
+}
+
+
+
+
+
+
+
+
+.icons-bar>* {
+    flex-grow: 0;
+}
+
+.accordion-bar .xtabs-tab span {
+    display: none;
+}
+
+
+
+.xtabs-tab svg {
+    fill: var(--ae-input-text-color);
+    position: relative;
+    top: -2px;
+}
+
+/* #main-nav .xtabs-tab {
+    background-color: transparent;
+}
+
+#main-nav .xtabs-tab.hover,
+#main-nav .xtabs-tab.active {
+    background-color: var(--ae-input-bg-color);
+}
+*/
+
+div#main-nav {
+    padding: 0px;
+    margin: calc(var(--ae-panel-padding) * 2);
+    margin-right: calc(var(--ae-panel-padding) * -1);
+    margin-left: calc(var(--ae-panel-padding) * 2);
+    padding: var(--ae-panel-padding);
+} 
+.no-br{
+    border-bottom-right-radius: 0;
+    border-bottom-left-radius: 0;
+}
+.no-tr{
+    border-top-right-radius: 0;
+    border-top-left-radius: 0;
+}
+
+.no-rr{
+    border-top-right-radius: 0 !important;
+    border-bottom-right-radius: 0 !important;
+}
+.no-lr{
+    border-top-left-radius: 0 !important;
+    border-bottom-left-radius: 0 !important;
+}
+
+
+
+.extra-network-subdirs>button,
+.settings-tabs button {
+    text-align: left;
+    font-size: 98%;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+}
+
+.extra-network-subdirs,
+.settings-tabs .tab-nav {
+    gap: 1px;
+    display: flex;
+    flex-direction: column;
+}
+
+.split-container[data-initsize="25"] {
+    min-width: 135px !important;
+}
+
+.gradio-row:empty,
+.hide-empty:has(.form.hidden),
+.hide-empty:has(.gradio-html:first-child:empty) {
+    display: none;
+}
+
+* .settings-comment {
+    margin: 5px 0;
+    font-size: 10px;
+    color: rgba(255, 255, 255, 0.4);
+}
+
+* .settings-comment:has(a) {
+    font-size: 0;
+}
+
+* .settings-comment a {
+    font-size: 10px;
+}
+
+* a:not(:has(button)) {
+    color: var(--ae-input-text-color);
+    background-color: var(--ae-input-bg-color);
+    border-radius: 3px;
+    padding: 2px 10px;
+    text-decoration: none;
+}
+
+* a:not(:has(button)):hover {
+    color: var(--ae-input-hover-text-color);
+    background-color: var(--ae-primary-color);
+}
+
+.spacer-v {
+    max-height: var(--ae-input-border-size);
+    min-height: var(--ae-input-border-size);
+    background-color: var(--ae-input-border-color);
+}
+
+* button[aria-label] {
+    width: var(--ae-input-height);
+    height: var(--ae-input-height);
+}
+* button[aria-label="Edit"] {
+display:none;
+}
+
+
+* .center.boundedheight {
+    background-color: var(--ae-input-bg-color);
+}
+
+.ae-button {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: var(--ae-gap-size);
+    border-radius: var(--ae-border-radius);
+    border: var(--ae-input-border-size) solid var(--ae-input-border-color);
+    background-color: var(--ae-input-bg-color);
+   /*  padding: var(--ae-panel-padding); */
+    cursor: pointer;
+}
+
+
+/* .ae-button .mask-icon:hover,
+.ae-button.active .mask-icon:hover {
+    background-color: var(--ae-input-hover-text-color);
+} */
+
+.ae-button.active {
+    color: var(--ae-input-hover-text-color);
+    background-color: var(--ae-primary-color);
+}
+
+.ae-button:hover,
+.ae-button.active:hover {
+    color: var(--ae-input-hover-text-color);
+    background-color: var(--ae-primary-color);
+}
+
+button:hover .icon-letters,
+button.active .icon-letters {
+    color: var(--ae-input-hover-text-color);
+}
+
+button.active svg,
+button:hover svg {
+    fill: var(--ae-input-hover-text-color);
+}
+
+/* .ae-button:hover .mask-icon {
+    background-color: var(--ae-input-hover-text-color);
+}
+
+.ae-button:hover span{
+    color: var(--ae-input-hover-text-color);
+} */
+
+.portal:has(.gradio-accordion) {
+    padding: 0;
+}
+
+.icons-bar .portal {
+    border: 0;
+    outline: 0;
+    background: transparent;
+}
+
+.icons-bar .portal button {
+    padding: 0;
+    border: 0;
+    outline: 0;
+    background: transparent;
+}
+
+.ae-button .gradio-button {
+    border: 0;
+    padding: 0;
+    min-width: unset;
+    min-height: unset;
+    align-items: center;
+    display: flex;
+}
+
+.ae-button .gradio-button span {
+    padding: 5px;
+    font-size: var(--ae-input-font-size);
+}
+
+.padding {
+    padding: var(--ae-panel-padding);
+}
+
+.ae-button .portal {
+    padding: 0;
+    outline: 0;
+    background: transparent;
+}
+
+.ae-button .portal button {
+    background-color: transparent !important;
+}
+
+.center {
+    justify-content: center !important;
+}
+
+#portal-16>div>div:first-child {
+    display: none;
+}
+
+.toggle-seed {
+    padding: var(--ae-panel-padding) !important;
+    min-width: var(--ae-input-height);
+    height: var(--ae-input-height);
+}
+.gradio-group:has(> .styler:empty),
+.portal:has(> .hide),
+.gradio-column:has(> .form:empty),
+.gradio-row:has(> .form:empty) {
+    display: none;
+}
+
+.ae-button .gradio-button span {
+    padding: 5px;
+    font-size: var(--ae-input-font-size);
+}
+
+
+
+
+*.disable {
+    opacity: 0.5;
+    pointer-events: none;
+}
+*.disable > button {
+    display: flex !important;
+}
+
+.generate {
+    overflow: hidden;
+}
+
+.generate.active>.portal::before {
+    content: "";
+    position: absolute;
+    height: 200px;
+    width: 200px;
+    background-image: linear-gradient(90deg,
+            rgba(0, 0, 0, 0.1) 0%,
+            rgba(0, 0, 0, 0.1) 50%,
+            rgba(255, 255, 255, 0) 51%,
+            rgba(255, 255, 255, 0) 100%);
+    background-repeat: repeat;
+    background-size: 20px;
+    transform: rotate(30deg);
+    z-index: 1;
+    -webkit-animation-name: bg-slide;
+    -webkit-animation-duration: 3s;
+    -webkit-animation-iteration-count: infinite;
+    -webkit-animation-timing-function: linear;
+}
+
+.generate.active>.portal>button {
+    position: relative;
+    -webkit-filter: drop-shadow(0px 0px 1px var(--ae-primary-color)) drop-shadow(0px 0px 1px var(--ae-primary-color)) drop-shadow(0px 0px 1px var(--ae-primary-color)) drop-shadow(0px 0px 1px var(--ae-primary-color));
+    z-index: 1;
+}
+/* .generate.active > span{
+    display:none !important;
+} */
+
+* #extensions_installed_top {
+    display: flex !important;
+}
+
+*.notransition {
+    transition: none !important;
+    animation: none !important;
+   /* animation-duration: 0.0s !important;  */
+    /* animation-fill-mode: none !important; */
+}
+
+
+
+*.fade-in,
+*.fade-out {
+    position: absolute;
+    inset: 0;
+    justify-content: flex-start !important;
+    overflow: auto;
+    z-index: 999;
+}
+
+*.fade-in {
+    display: flex !important;
+    animation: fade-in 0.25s;
+    animation-fill-mode: forwards;
+}
+
+*.notransition.fade-in {
+    display: flex !important;
+    position: initial !important;
+}
+*.notransition.fade-out {
+    display: none !important;
+    position: initial !important;
+}
+
+*.fade-in > div:not(.layout-content) {
+    flex-grow:0;
+}
+
+*.fade-out {
+    animation: fade-out 0.25s;
+    animation-fill-mode: forwards;
+}
+
+*.template {
+    position: absolute;
+    inset: 0;
+}
+
+.initial {
+    position: initial;
+}
+
+.app {
+    min-height: 100vh;
+    width: 100%;
+    gap:0;
+}
+.app_footer {
+    flex-grow: 0;
+    margin: 0;
+    align-items: center;
+    gap: 0;
+}
+.app_footer br {
+    display:none;
+}
+
+.grow {
+    flex-grow: 1;
+}
+.flex-start {
+    justify-content: flex-start;
+}
+
+/* #main-nav .xtabs-tab {
+    justify-content: flex-start;
+} */
+
+#main-nav .xtabs-tab span {
+    display: none;
+}
+
+#split-left>.xtabs-item {
+    padding: 0;
+}
+
+.auto {
+    overflow: auto;
+}
+
+.center.flexbox {
+    justify-content: center;
+}
+.center > .portal > button {
+    align-self: center;
+}
+.ae-button.tool {
+    width: var(--ae-input-height);
+    height: var(--ae-input-height);
+    min-width: var(--ae-input-height);
+    min-height: var(--ae-input-height);
+}
+
+.xtabs-tab,
+.portal>button {
+    align-items: center;
+    justify-content: center;
+}
+
+#sp-ac1>.xtabs-item {
+    padding: 0;
+}
+
+#template-right-sidebar,
+#split-right {
+    min-width: calc(var(--ae-input-height) + var(--ae-border-size) + ((var(--ae-panel-padding) + var(--ae-input-padding)) * 2) + 1px);
+
+}
+
+.flex-start {
+    justify-content: flex-start !important;
+}
+
+.flex-end {
+    justify-content: flex-end;
+}
+
+#txt2img_header span {
+    display: none;
+}
+
+.scroll-hide{
+    overflow-y: hidden !important;
+    resize: none;
+}
+
+.no-labels span{
+display:none;
+}
+
+
+[id$='2img_script_container'] > div > .form ~ div {
+    padding: var(--ae-panel-padding);
+    outline: var(--ae-input-border-size) solid var(--ae-panel-border-color);  
+    background-color: var(--ae-input-bg-color);
+    border-radius: var(--ae-border-radius);
+    border: var(--ae-input-border-size) solid var(--ae-input-border-color);
+}
+.portal .gradio-accordion div:has( [id^='setting_']) {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    flex: 1 1 0%;
+    min-width: min(160px, 100%);
+}
+.portal .gradio-accordion .gradio-row:has( [id^='setting_']) {
+    padding:0;
+    background-color:transparent;
+    outline:none;
+}
+
+#imageARPreview {
+    position: absolute;
+    top: 0;
+    left: 0;
+    outline: 2px solid var(--ae-primary-color);
+    background: radial-gradient(circle, rgba(0, 0, 0, 0.2) 0%, var(--ae-primary-color) 200%);
+    z-index: 9000;
+    pointer-events: none;
+    display: block;
+  }
+
+
+  .tab-nav button {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+#resize_mode > span,
+.accordion:has( #inpaint_controls.hide){
+display:none;
+}
+
+.accordion:has( #resize_mode) .accordion-bar,
+.accordion:has( #inpaint_controls) .accordion-bar{
+    background-color:var(--ae-input-bg-color);
+}
+.icon-left button{
+    display: flex;
+    flex-direction: row-reverse;
+    gap: 5px;
+}
+
+.thumbnails.scroll-hide{
+    display: none;
+}
+.thumbnails.scroll-hide:has(.thumbnail-item:nth-child(2)) {
+    display: flex ;
+}
+.gradio-gallery .preview > img {
+    height:100% !important;
+}
+.gradio-gallery:has( .thumbnail-item:nth-child(2)) .preview > img {
+    height: calc(100% - 60px)!important;
+}
+
+.tabulator {
+    border: 1px solid var(--ae-panel-border-color);
+    background-color: var(--ae-panel-bg-color);
+}
+.tabulator .tabulator-header {
+    border-bottom: 1px solid var(--ae-panel-border-color);
+    background-color: var(--ae-panel-bg-color);
+    color: var(--ae-label-color);
+}
+.tabulator .tabulator-tableholder .tabulator-table {
+    background-color: var(--ae-panel-bg-color);
+    color: var(--ae-label-color);
+}
+.tabulator-row {
+    background-color: var(--ae-panel-bg-color);
+}
+.tabulator-row.tabulator-row-even {
+    background-color: var(--ae-panel-bg-color);
+}
+.tabulator-row.tabulator-selectable:hover{
+    background-color: var(--ae-input-bg-color);
+}
+.tabulator-row .tabulator-cell {
+    border-right: 1px solid var(--ae-panel-border-color);
+}
+
+.rgRow {
+    transition: none!important;
+}
+
+button.gridjs-sort-neutral {
+    width: 13px !important;
+    height: 13px !important;
+    min-width: unset;
+    min-height: unset;
+}
+.gridjs-td a{
+    display:block;
+    
+}
+.gridjs-tbody, td.gridjs-td {
+    background-color: var(--ae-panel-bg-color);
+}
+td.gridjs-td {
+    border: var(--ae-border-size) solid var(--ae-panel-border-color); 
+    padding: var(--ae-panel-padding);
+   
+}
+.gridjs-container {
+    color: var(--ae-label-color);
+    font-size: 14px;
+    font-family:inherit;
+}
+th.gridjs-th {
+    background-color: var(--ae-input-bg-color);;
+    border: var(--ae-border-size) solid var(--ae-input-border-color); 
+    color: var(--ae-label-color);
+    padding: var(--ae-panel-padding);
+
+}
+th.gridjs-th-sort:focus, th.gridjs-th-sort:hover {
+    background-color: var(--ae-panel-bg-color);
+}
+td.gridjs-td[data-column-id="description"] {
+    flex-grow: 1;
+}
+
+.gridjs-tr {
+    border: none;
+    display: flex;
+    flex-direction: column;
+    gap: 1px;
+}
+.gridjs-tbody, td.gridjs-td {
+    background-color: var(--ae-panel-bg-color);
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+    gap: var(--ae-gap-size);
+    overflow-wrap: anywhere;
+}
+
+
+.additional,
+.additional ul{
+    display:none !important;
+}
+.additional,
+.additional ul{
+    margin: auto;
+    padding: 0;
+    gap: 5px;
+    margin-bottom: 2px;
+}
+.card:hover .additional,
+.card:hover .additional ul{
+    display:flex;
+}
+.additional ul a {
+    width: 24px;
+    height: 24px;
+    font-size: 125% !important;
+    align-items: center;
+    display: flex;
+    justify-content: center;
+    margin:0 !important;
+}
+.params{
+    min-width:370px;
+    
+}
+
+#template-settings .split-container:first-child,
+.layout-extra-networks .split-container:first-child {
+    min-width: 135px;
+}
+#split-right:not(.v-expand){
+   min-width:512px;
+}
+.layout-extra-networks:has( .show-dirs) .gutter,
+.layout-extra-networks:has( .show-dirs) .split-container:first-child {
+    display :none;
+}
+.layout-extra-networks:has( .show-dirs:not(.active)) .split-container {
+    flex-basis: 100% !important;
+}
+.layout-extra-networks:has( .show-dirs.active) .gutter,
+.layout-extra-networks:has( .show-dirs.active) .split-container:first-child {
+    display :flex;
+}
+.layout-extra-networks{
+    gap:2px;
+
+}
+.layout-extra-networks > div:first-child{
+    padding-bottom:0 !important;
+    
+}
+
+/* tab extensions */
+.tabs_extensions table {
+    width:100%;
+}
+.tabs_extensions thead{
+    display:none;
+}
+
+.tabs_extensions tbody{
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+    gap: var(--ae-gap-size);
+    content-visibility: auto;
+}
+.tabs_extensions tr{
+    flex-direction: column;
+    display:flex;
+    padding:var(--ae-panel-padding);
+    background-color: var(--ae-panel-bg-color);
+    gap: 5px;
+    border: var(--ae-border-size) solid var(--ae-panel-border-color);
+    border-radius: var(--ae-border-radius);
+    position:relative;
+}
+.tabs_extensions td {
+    display: flex;
+    text-wrap: wrap;
+    flex-direction: row;
+    overflow-wrap: anywhere;
+    flex-wrap: wrap;
+    gap:5px;
+}
+.tabs_extensions td:has(p.info) {
+    flex-direction: column;
+    flex-grow: 1;
+    justify-content: space-between;
+    gap: 10px;
+}
+.tabs_extensions td p.info:has(span) {
+    flex-direction: row;
+    display: flex;
+    flex-wrap: wrap;
+    gap: 7px;
+    flex-grow: 0;
+    justify-content: space-between;
+    align-items: flex-end;
+}
+.tabs_extensions span.date_added {
+    max-width: 130px;
+    text-align: justify;
+    text-align-last: justify;
+    color: var(--ae-secondary-label-color);
+    background-color: var(--ae-input-bg-color);
+    padding: var(--ae-panel-padding);
+    border-radius: var(--ae-border-radius);
+    font-size: 11px;
+}
+span.star_count {
+    background-color: var(--ae-input-bg-color);
+    padding: 5px 10px 5px 5px;
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+    border-radius: 5px;
+    font-size: 0;
+    line-height: 0;
+    justify-items: end;
+    gap: 2px;
+    align-items: center;
+}
+span.star_count b {
+    font-size: 12px;
+}
+
+.tabs_extensions td br {
+    flex-basis: 100%;
+    content: "";
+}
+.tabs_extensions td a {
+    font-size: 14px;
+    padding: 5px;
+    display:block;
+}
+.tabs_extensions td button {
+    display: flex;
+    flex-grow: 1;
+    justify-content: center;
+    align-items: center;
+}
+.tabs_extensions td label:has(input) {
+    display: flex;
+    gap: 5px;
+    font-size: 14px;
+    border-radius: 5px;
+    line-height: 23px;
+    align-items: flex-start;
+}
+
+/* .tabs_extensions .wrap {
+    display: flex;
+    flex-direction: column;
+    position: relative;
+    z-index: 1;
+    background-color: black;
+    padding: 10px;
+    gap: 5px;
+} 
+*/
+.tabs_extensions tr:has(a[href=""]) {
+    background-color: var(--ae-input-bg-color);
+    border-color: var(--ae-input-border-color);
+}
+.tabs_extensions td:empty,
+.tabs_extensions td:has( a:empty){
+    display: none !important;
+}
+
+.tabs_extensions td:nth-child(1) a,
+.tabs_extensions td:nth-child(2) a {
+    background-color: transparent;
+    color: var(--ae-primary-color);
+    padding: 0;
+    font-size: 12px;
+}
+.tabs_extensions td:nth-child(1) a:hover,
+.tabs_extensions td:nth-child(2) a:hover {
+    color: var(--ae-label-color);
+}
+.tabs_extensions td:nth-child(1) a {
+    font-size: 14px;
+}
+
+.gradio-image {
+    height: 100%;
+    width: 100%;
+    object-fit: contain;
+}
+#pnginfo_image [data-testid="image"] img {
+    max-height: unset;
+    min-height: 100%;
+}
+.full-height>textarea {
+    overflow-y: auto!important;
+}
+
+
+.ae-popup{
+   /*  position: fixed;
+    width: 100vw;
+    height: 100vh; 
+     z-index: 9999;
+    */
+    align-items: center;
+    background-color: var(--ae-input-bg-color);
+    justify-content: center !important;
+}
+
+.ae-popup-inner{
+ /*    width:50vw;
+    height:50vh; */
+    width:100%;
+    height:100%;
+    background-color: var(--ae-main-bg-color);
+    position:relative;
+}
+
+ .ae-popup .standalone-card-preview img{
+    height: 100%;
+    width: 100%;
+    object-fit: contain;
+    max-height: 45vh;
+ }
+ .ae-popup .edit-user-metadata-buttons button:first-child{
+    display:none;
+ }
+ .global-popup-inner{
+     flex-grow: 0;
+ position: relative;
+ }
+ .relative-height{
+    flex-grow:0;
+    position:relative
+ }
+ 
+ #popup_close{
+    position: absolute;
+    right: calc(var(--ae-panel-padding) * 2);
+    bottom: calc(var(--ae-panel-padding) * 3);
+    height: 24px;
+    padding-right: calc(var(--ae-panel-padding) * 3);
+ }
+
+
+.wrap .svelte-zyxd38 svg {
+    display:none !important;
+}
+.wrap .progress-text{
+    background-color:var(--ae-main-bg-color);
+    color:var(--ae-label-color);
+    font-size:10px;
+    display:flex;
+    flex-grow:0;
+}
+#popup_trigger{
+    display:none;
+}
+
+
+@-webkit-keyframes bg-slide {
+    from {
+        background-position: 0%;
+    }
+
+    to {
+        background-position: -100%;
+    }
+}
+
+@-webkit-keyframes fade-in {
+    0% {
+        opacity: 0;
+       /*  transform: scale(0.5); */
+    }
+
+    100% {
+        opacity: 1;
+      /*   transform: scale(1.0); */
+    }
+}
+
+.icon-letters{
+    justify-content: center;
+    text-transform: uppercase;
+    font-size: 14px;
+    font-weight: 600;
+    width: 24px;
+    line-height: 24px;
+}
+
+
+.center.boundedheight.flex {
+    width: 100% !important;
+    height: auto !important;
+   /*  max-height: 50vh;*/
+  } 
+
+
+  
+  .image-container img.absolute-img {
+    /* position: relative !important; */
+    position: absolute !important;
+  }
+  
+  .image-container img {
+    max-height: 50vh !important;
+  }
+  
+  .image-container {
+    min-height: 25vh !important;
+   /*  height: auto !important; */
+    display: flex;
+    position:relative;
+  }
+  .image-container:has(canvas) {
+    min-height: 50vh !important;
+  }
+  
+  .absolute-img {
+    position: relative;
+    opacity: 0;
+  }
+  
+  .block.gradio-image {
+    /* height: auto !important; */
+  }
+  
+  div[data-testid="image"] canvas {
+    width: auto !important;
+    height: 100% !important;
+    position: absolute !important;
+   /*  top: 0 !important;
+    left: 0 !important; */
+    border: 0 !important;
+  }
+  
+ 
+  
+  #tab_img2img div.center.boundedheight.flex {
+    display: block !important;
+  }
+
+* .center.boundedheight > div:has(.brush),
+* .center.boundedheight > div:has([aria-label="Clear"]) {
+    position: absolute;
+    padding: var(--ae-panel-padding);
+    top: 0;
+    right: 0;
+    z-index: 999;
+}
+
+* .center.boundedheight > div:has(.brush) {
+    top: 70px;
+    min-height: unset;
+    width: auto;
+    height: auto;
+    gap: var(--ae-gap-size);
+}
+
+
+  
+[id*="label_copy_to"]{
+    /* flex-basis: 100%; */
+    font-size: 12px;
+    flex-grow: 0;
+    min-width: 65px;
+    justify-content: center;
+    line-height: 12px;
+}
+[id*="_copy_to_"].gradio-row{
+    justify-items: center;
+    background-color: transparent;
+    padding: 0;
+    outline: 0;
+}
+[id*="_copy_to_"].gradio-row button{
+flex-grow:1;
+}
+.group-row{
+    gap: 1px !important;
+}
+.group-row > * button,
+.group-row > *{
+    border-radius: 0 !important;
+}
+.group-row > *:last-child button,
+.group-row > *:last-child{
+    border-top-right-radius: var(--ae-border-radius) !important;
+    border-bottom-right-radius: var(--ae-border-radius) !important;
+}
+.group-row > *:first-child button,
+.group-row > *:first-child{
+    border-top-left-radius: var(--ae-border-radius) !important;
+    border-bottom-left-radius: var(--ae-border-radius) !important;
+}
+
+.progress-flex {
+    position: absolute;
+    padding: calc(var(--ae-panel-padding) * 1 );
+    bottom: 0;
+    left: 0;
+    right: 0;
+    display:none;
+}
+.progress-flex > div {
+    position: relative;
+    z-index: 123;
+    white-space: nowrap;
+    padding: 0;
+    border-radius: 0;
+}
+.progress-flex:has( .progress) {
+    display: flex;
+}
+
+.progress{
+    background-color:var(--ae-primary-color);
+    padding:2px;
+    border-radius: 0;
+}
+
+iframe{
+    border:0;
+}
+.other> div{
+    background: transparent;
+    outline: 0;
+}
+.other .gradio-column:first-child{
+    flex-grow: 1;
+    padding: 0;
+    gap: 0;
+}
+.other iframe:first-child{
+    max-height: calc(100vh - var(--ae-panel-padding) * 6);
+}
+
+.ae-button > a:hover,
+.ae-button > a{
+    padding: 0;
+    background-color: transparent;
+    line-height: 0;
+}
+
+div#workspaces_tabitem > div {
+    padding: 0;
+}
+
+/*infinite-image-browsing*/
+#tab_infinite-image-browsing_tabitem{
+    overflow:hidden;
+    padding: 0;
+}
+
+/*a1111-sd-webui-tagcomplete*/
+ul{
+    padding:0;
+    margin:0;
+}
+.autocompleteResults {
+    background-color: var(--ae-main-bg-color)!important;
+    border: var(--ae-border-size) solid var(--ae-input-border-color)!important;
+    border-radius: var(--ae-border-radius)!important;
+}
+.autocompleteResultsList > li:nth-child(odd) {
+    background-color: var(--ae-panel-bg-color)!important;
+}
+.autocompleteResultsList > li.selected {
+    background-color: var(--ae-primary-color)!important;
+}
+
+.log-row {
+    display: table;
+    overflow-wrap: anywhere;
+}
+.log-row a {
+    padding: 0 5px;
+}
+.log-date {
+    color: #cacaca;
+    display: table-cell;
+    white-space: nowrap;
+    padding: 0px 10px;
+    font-size: 9px;
+}
+.log-boolean,
+.log-undefined {color: magenta;}
+.log-object {color: #cfb0ff;}
+.log-string {color: #ffca68;}
+.log-number {color: cyan;}
+.log-info {color: yellow;}
+
+.log-string.log-remove {color: #ff4f4f;}
+.log-string.log-load {color: #74ff80;} 
+.log-string.log-url {color: #8fc9ff;}
+.log-string.log-object {color: #8fc9ff;}
+
+
+.card.selected {
+    border: var(--ae-border-size) solid var(--ae-primary-color);
+}
+.card.selected .actions{
+    background-color: var(--ae-primary-color);
+}
+.column-1{
+    column-count: 1;
+    gap:32px;
+}
+.column-2{
+    columns: 320px 2;
+    gap:32px;
+}
+.column-3{
+    column-count: 3;
+    gap:32px;
+}
+.lcol{
+    gap:32px;
+    align-items: flex-start;
+    display: grid;
+    /* grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); */
+}
+
+.lcol > .col{
+min-width: min(480px, 100%);
+}
+#about_tabitem {
+    font-size: 14px;
+    line-height: 20px;
+    font-family: monospace;
+   /*  text-align: justify; */
+}
+#about_tabitem img{
+    display:flex;
+    width: 100%;
+    height: auto;
+}
+#about_tabitem a{
+    background-color: transparent;
+    color:var(--ae-primary-color);
+    padding: 0;  
+}
+#about_tabitem a:hover{
+    color: var(--ae-label-color);   
+}
+#about_tabitem p, h1, h2{
+    margin:0;
+    margin-bottom: calc(var(--ae-panel-padding) * 1 ); 
+}
+#about_tabitem p, #about_tabitem ul, #about_tabitem img {
+    margin-bottom: 24px;
+}
+#about_tabitem h1, h2{
+    /* margin-top: calc(var(--ae-panel-padding) * 3 ); */
+    font-size:20px;
+    color: var(--ae-primary-color);
+}
+#about_tabitem ul{
+    padding-inline-start: calc(var(--ae-panel-padding) * 4 );
+}
+#about_tabitem li::marker{
+    color: var(--ae-primary-color);
+}
+.lrp-32{
+    gap:32px;
+    padding-top: 20px;
+    padding-left: 32px;
+    padding-right: 32px;
+    max-width: 960px;
+}
+.gradio-audio > .wrap, 
+.gradio-video > .wrap, 
+.gradio-file > .wrap, 
+.gradio-image > .wrap,
+.wrap.center.full.translucent{
+    min-height: unset;
+    position: absolute;
+    z-index: 100;
+    height: auto;
+    width: auto;
+}
+
+div#quicksettings {
+    flex-direction: row;
+    display: inline-flex;
+    gap: var(--ae-gap-size);
+    flex-wrap: wrap;
+}
+div#quicksettings > div {
+    flex: 1 0 calc(100% - var(--ae-input-height) * 2);
+}
+div#quicksettings div + button {
+    flex: 0 1 0%;
+    margin-bottom: var(--ae-panel-padding);
+}
+
+.relative{
+    position:relative;
+}
+.accordion-vertical.expand {
+    flex-grow: 1 !important;
+}
+
+.no-grow{
+    flex-grow: 0;
+}
+#sidebar_secondary_tabs{
+    justify-content: flex-end;
+}
+
+#pnginfo_image .center.boundedheight.flex{
+    display: flex;
+    align-items: center;
+    text-align: center;
+}
+
+.gradio-colorpicker label {
+    flex-direction: row;
+    align-items: center;
+    pointer-events: none;
+}
+.gradio-colorpicker input {
+    pointer-events: all;
+}
+
+input[type="radio"], 
+input[type="checkbox"] { 
+    accent-color: var(--ae-primary-color);
+    cursor: pointer;
+}
+.selected span.name {
+    color: var(--ae-input-hover-text-color);
+}
+#txt2img_edit_style_close,
+#lightboxModal,
+.gradio-container.app{
+    display:none !important;
+}
+
+.icon-physton {
+    -webkit-mask-image: url(./html/svg/pantone-line.svg);
+}
+.physton-prompt {
+    margin: 0 !important;
+}
+.physton-prompt .prompt-header .prompt-header-extend.prompt-append {
+    min-width:240px;
+    min-height: 26px;
+}
+
+.physton-prompt .prompt-header .prompt-header-extend .extend-content .gradio-checkbox{
+    display:none;
+}
+
+.physton-prompt .show-group-tags{
+    top: -15px;
+    right: 5px;
+}
+.physton-prompt .prompt-header .prompt-header-extend.prompt-append .extend-content {
+    margin-right: 20px;
+}
+#train_tabitem .tabs{
+    width:100%;
+}
+
+@-webkit-keyframes fade-out {
+    0% {
+        opacity: 1;
+       /*  transform: scale(1.0); */
+    }
+
+    100% {
+        opacity: 0;
+       /*  transform: scale(0.5); */
+    }
+}
+
+@media screen and (-webkit-min-device-pixel-ratio: 0) {
+    input[type="range"] {
+        overflow: hidden;
+        width: 100%;
+        -webkit-appearance: none;
+        background-color: var(--ae-input-bg-color);
+        border: var(--ae-input-border-size) solid var(--ae-input-border-color);
+        position: relative;
+        border-radius: var(--ae-border-radius);
+    }
+
+    input[type="range"]::after {
+        content: "";
+        position: absolute;
+        height: 100%;
+        background-image: var(--ae-slider-bg-overlay);
+        width: 100%;
+        left: 1px;
+    }
+
+    input[type="range"]::-webkit-slider-runnable-track {
+        height: 14px;
+        -webkit-appearance: none;
+        color: var(--ae-primary-color);
+        margin-top: -1px;
+    }
+
+    input[type="range"]::-webkit-slider-thumb {
+        width: 0px;
+        -webkit-appearance: none;
+        height: 14px;
+        cursor: ew-resize;
+        background-color: var(--ae-primary-color);
+        box-shadow: -1024px 0 0 1024px var(--ae-primary-color);
+    }
+}
+
+@media (max-width: 768px) {
+    .xtabs-tab span {
+        display: none;
+    }
+}
+
+/* Firefox */
+* {
+    scrollbar-color: var(--ae-panel-border-color) var(--ae-main-bg-color) !important;
+    scrollbar-width: thin !important;
+}
+
+input[type="range"]::-moz-range-progress {
+    background-color: var(--ae-primary-color);
+    height: 100%;
+    background-image: var(--ae-slider-bg-overlay);
+}
+  
+input[type="range"]::-moz-range-track {
+    width: 100%;
+    height: 100%;
+    background-color: var(--ae-input-bg-color);
+    border: none;
+    border-radius: 0px;
+    position: relative;
+    background-image: var(--ae-slider-bg-overlay);
+    opacity: 1;
+}
+
+input[type="range"]::-moz-range-thumb {
+    border: 0px solid var(--ae-primary-color);
+    width: 0px;
+    border-radius: 0%;
+    background-color: var(--ae-primary-color);
+}
+
+/*hide the outline behind the border*/
+input[type="range"]:-moz-focusring {
+    outline: 1px solid var(--ae-primary-color);
+    outline-offset: -1px;
+}
+
+input[type="range"]:focus::-moz-range-track {
+    background-color: var(--ae-input-bg-color);
+}
+
+input[type="number"] {
+    -moz-appearance: textfield;
+}
+
+input[type="number"]:hover,
+input[type="number"]:focus {
+    -moz-appearance: initial;
+}
+
+/* IE maybe later  */
+
+input[type="range"]::-ms-fill-lower {
+    background-color: var(--ae-primary-color);
+}
+
+input[type="range"]::-ms-fill-upper {
+    background-color: var(--ae-input-bg-color);
+}
\ No newline at end of file
diff --git a/screenshot.png b/screenshot.png
index 47a1be4e..2875b064 100644
Binary files a/screenshot.png and b/screenshot.png differ