@memori.ai/memori-react 8.38.4 → 9.0.0-alpha.0

package/src/components/layouts/__snapshots__/Totem.test.tsx.snap

@@ -12,20 +12,47 @@ exports[`renders Totem layout unchanged 1`] = `
     style="height: 100vh;"
   >
     <style>
-      
-    memori-client, .memori-widget, .memori-drawer, .memori-modal {
-      --memori-chat-bubble-bg: #fff;
---memori-text-color: #2a2a2a;
---memori-button-bg: #823ce1;
---memori-primary: #823ce1;
---memori-button-text: #ffffff;
---memori-blur-background: 5px;
---memori-inner-bg: rgba(255, 255, 255, 0.8);
---memori-inner-content-pad: 1.5rem;
---memori-nav-bg-image: none;
---memori-nav-bg: rgba(255, 255, 255, 0.8);
-    }
-  
+      @layer integration {
+  body, .memori-client, .memori-widget, .memori-drawer, .memori-modal, .memori-header, .memori-dropdown, .memori-select {
+    --memori-primary-color: #823ce1;
+    --memori-primary: #823ce1;
+    --memori-primary-content: #ffffff;
+    --memori-primary-hover: color-mix(in oklch, var(--memori-primary), var(--memori-surface-contrast-inverse, black) 15%);
+    --memori-primary-active: color-mix(in oklch, var(--memori-primary), var(--memori-surface-contrast-inverse, black) 25%);
+    --memori-primary-disabled: color-mix(in oklch, var(--memori-primary), transparent 60%);
+    --memori-primary-subtle: color-mix(in oklch, var(--memori-primary), var(--memori-surface-contrast, white) 60%);
+    --memori-primary-subtle-hover: color-mix(in oklch, var(--memori-primary), var(--memori-surface-contrast, white) 50%);
+    --memori-border-primary: color-mix(in oklch, var(--memori-primary), transparent 70%);
+    --memori-border-primary-hover: color-mix(in oklch, var(--memori-primary), transparent 50%);
+    --memori-focus-ring-color: color-mix(in oklch, var(--memori-primary), transparent 80%);
+    --memori-focus-ring: 0 0 0 3px var(--memori-focus-ring-color);
+    --memori-shadow-primary: 0 8px 16px -4px color-mix(in oklch, var(--memori-primary), transparent 70%);
+    --memori-skeleton-base: color-mix(in oklch, var(--memori-primary), var(--memori-surface-contrast, white) 85%);
+    --memori-skeleton-highlight: color-mix(in oklch, var(--memori-primary), var(--memori-surface-contrast, white) 75%);
+  }
+  [data-theme="dark"] .memori-widget,
+  .memori-widget[data-theme="dark"],
+  [data-theme="dark"] memori-client .memori-widget,
+  memori-client[data-theme="dark"] .memori-widget {
+    --memori-primary-color: #823ce1;
+    --memori-primary: #823ce1;
+    --memori-primary-content: #ffffff;
+    --memori-primary-hover: color-mix(in oklch, var(--memori-primary), var(--memori-surface-contrast-inverse, black) 15%);
+    --memori-primary-active: color-mix(in oklch, var(--memori-primary), var(--memori-surface-contrast-inverse, black) 25%);
+    --memori-primary-disabled: color-mix(in oklch, var(--memori-primary), transparent 60%);
+    --memori-primary-subtle: color-mix(in oklch, var(--memori-primary), var(--memori-surface-contrast, white) 60%);
+    --memori-primary-subtle-hover: color-mix(in oklch, var(--memori-primary), var(--memori-surface-contrast, white) 50%);
+    --memori-border-primary: color-mix(in oklch, var(--memori-primary), transparent 70%);
+    --memori-border-primary-hover: color-mix(in oklch, var(--memori-primary), transparent 50%);
+    --memori-focus-ring-color: color-mix(in oklch, var(--memori-primary), transparent 80%);
+    --memori-focus-ring: 0 0 0 3px var(--memori-focus-ring-color);
+    --memori-shadow-primary: 0 8px 16px -4px color-mix(in oklch, var(--memori-primary), transparent 70%);
+    --memori-skeleton-base: color-mix(in oklch, var(--memori-primary), var(--memori-surface-contrast, white) 85%);
+    --memori-skeleton-highlight: color-mix(in oklch, var(--memori-primary), var(--memori-surface-contrast, white) 75%);
+  }
+  .memori-widget .memori--global-background { filter: blur(5px); }
+}
+
     </style>
     <div
       class="memori--global-background"
@@ -41,15 +68,131 @@ exports[`renders Totem layout unchanged 1`] = `
       <div
         class="memori--powered-by"
       >
-        <img
-          alt=""
-          src="https://aisuru.com/images/aisuru/logo.png"
-        />
-        <p>
-          <span
-            class="sr-only"
+        <svg
+          aria-hidden="true"
+          aria-label="Memori AI"
+          class="memori--powered-by-icon"
+          fill="currentColor"
+          height="800"
+          viewBox="0 0 670.70013 639.67999"
+          width="800"
+        >
+          <defs>
+            <style>
+              
+      .cls-1 {
+        fill: url(#Sfumatura_senza_nome_6);
+      }
+
+      .cls-1,
+      .cls-2 {
+        stroke-width: 0px;
+      }
+
+      .cls-2 {
+        fill: var(--memori-logo-text-color, '#744c99');
+      }
+    
+            </style>
+            <lineargradient
+              data-name="Sfumatura senza nome 6"
+              gradientTransform="translate(-304.65445,-80.16)"
+              gradientUnits="userSpaceOnUse"
+              id="Sfumatura_senza_nome_6"
+              x1="392.82999"
+              x2="786.29999"
+              y1="-13.83"
+              y2="628.33002"
+            >
+              <stop
+                id="stop1"
+                offset="0.18"
+                stop-color="#9ad2d5"
+              />
+              <stop
+                id="stop2"
+                offset="0.32"
+                stop-color="#26b5cb"
+              />
+              <stop
+                id="stop3"
+                offset="0.38"
+                stop-color="#379cbe"
+              />
+              <stop
+                id="stop4"
+                offset="0.46"
+                stop-color="#4c7eb0"
+              />
+              <stop
+                id="stop5"
+                offset="0.55"
+                stop-color="#5d66a4"
+              />
+              <stop
+                id="stop6"
+                offset="0.65"
+                stop-color="#69569c"
+              />
+              <stop
+                id="stop7"
+                offset="0.76"
+                stop-color="#704c97"
+              />
+              <stop
+                id="stop8"
+                offset="0.89"
+                stop-color="#734996"
+              />
+            </lineargradient>
+          </defs>
+          <g
+            id="g13"
+            transform="translate(-304.65445,-80.16)"
           >
-            Powered by
+            <path
+              class="cls-2"
+              d="m 451.79,434.96 v -78.79 c 0,-15.73 8.09,-25.54 22.73,-25.54 7.01,0 12.93,3.11 16.82,8.41 3.9,-5.29 9.81,-8.41 16.82,-8.41 14.64,0 22.74,9.81 22.74,25.54 v 78.79 c 0,3.27 -2.65,5.92 -5.92,5.92 -3.27,0 -5.92,-2.65 -5.92,-5.92 v -77.08 c 0,-11.21 -3.74,-16.35 -10.9,-16.35 -7.16,0 -10.9,5.14 -10.9,16.35 v 77.08 c 0,3.27 -2.65,5.92 -5.92,5.92 -3.27,0 -5.92,-2.65 -5.92,-5.92 v -77.08 c 0,-11.21 -3.74,-16.35 -10.9,-16.35 -7.16,0 -10.9,5.14 -10.9,16.35 v 77.08 c 0,3.27 -2.65,5.92 -5.92,5.92 -3.27,0 -5.92,-2.65 -5.92,-5.92 z"
+              id="path8"
+            />
+            <path
+              class="cls-2"
+              d="m 588.37,435.12 c 0,3.11 -2.65,5.45 -5.76,5.45 h -23.98 c -6.7,0 -9.5,-2.81 -9.5,-9.34 v -90.31 c 0,-6.54 2.8,-9.34 9.5,-9.34 h 23.98 c 3.11,0 5.76,2.33 5.76,5.45 0,3.12 -2.65,5.45 -5.76,5.45 h -21.65 v 32.7 h 19.31 c 3.11,0 5.76,2.33 5.76,5.45 0,3.12 -2.65,5.45 -5.76,5.45 h -19.31 v 43.6 h 21.65 c 3.11,0 5.76,2.33 5.76,5.45 z"
+              id="path9"
+            />
+            <path
+              class="cls-2"
+              d="m 599.59,434.96 v -78.79 c 0,-15.73 8.09,-25.54 22.73,-25.54 7.01,0 12.93,3.11 16.82,8.41 3.9,-5.29 9.81,-8.41 16.82,-8.41 14.64,0 22.74,9.81 22.74,25.54 v 78.79 c 0,3.27 -2.65,5.92 -5.92,5.92 -3.27,0 -5.92,-2.65 -5.92,-5.92 v -77.08 c 0,-11.21 -3.74,-16.35 -10.9,-16.35 -7.16,0 -10.9,5.14 -10.9,16.35 v 77.08 c 0,3.27 -2.65,5.92 -5.92,5.92 -3.27,0 -5.92,-2.65 -5.92,-5.92 v -77.08 c 0,-11.21 -3.74,-16.35 -10.9,-16.35 -7.16,0 -10.9,5.14 -10.9,16.35 v 77.08 c 0,3.27 -2.65,5.92 -5.92,5.92 -3.27,0 -5.92,-2.65 -5.92,-5.92 z"
+              id="path10"
+            />
+            <path
+              class="cls-2"
+              d="m 692.72,416.28 v -60.1 c 0,-15.73 8.09,-25.54 23.35,-25.54 15.26,0 23.36,9.81 23.36,25.54 v 60.1 c 0,15.73 -8.1,25.54 -23.36,25.54 -15.26,0 -23.35,-9.81 -23.35,-25.54 z m 34.88,-2.02 v -56.05 c 0,-11.68 -4.05,-16.35 -11.52,-16.35 -7.47,0 -11.52,4.67 -11.52,16.35 v 56.05 c 0,11.68 4.05,16.35 11.52,16.35 7.47,0 11.52,-4.67 11.52,-16.35 z"
+              id="path11"
+            />
+            <path
+              class="cls-2"
+              d="m 789.27,391.52 c 4.36,2.49 8.88,8.88 8.88,18.07 v 25.38 c 0,3.27 -2.65,5.92 -5.92,5.92 -3.27,0 -5.92,-2.65 -5.92,-5.92 v -22.11 c 0,-8.88 -4.67,-15.73 -12.3,-15.73 h -8.25 v 37.84 c 0,3.27 -2.65,5.92 -5.92,5.92 -3.27,0 -5.92,-2.65 -5.92,-5.92 v -94.05 c 0,-6.54 2.8,-9.34 9.5,-9.34 h 10.43 c 15.57,0 24.6,10.27 24.6,29.11 v 7.32 c 0,10.75 -2.81,18.69 -9.19,23.51 z m -2.33,-26 v -2.34 c 0,-14.02 -4.2,-20.71 -14.17,-20.71 h -7.01 v 43.75 h 7.01 c 9.97,0 14.17,-6.7 14.17,-20.71 z"
+              id="path12"
+            />
+            <path
+              class="cls-2"
+              d="m 812.95,434.96 v -98.1 c 0,-3.27 2.65,-5.92 5.92,-5.92 3.27,0 5.92,2.65 5.92,5.92 v 98.1 c 0,3.27 -2.65,5.92 -5.92,5.92 -3.27,0 -5.92,-2.65 -5.92,-5.92 z"
+              id="path13"
+            />
+          </g>
+          <path
+            class="cls-1"
+            d="m 667.73555,242.64 c -6.38,-56.35 -42.43,-113.07 -98.9,-155.61 -49.7,-37.44 -109.37,-60.33 -170.6,-65.94 C 364.22555,7.6 328.15555,0 291.96555,0 c -69.91,0 -135.47,27.64 -189.6,79.93 C 82.235546,99.38 55.165546,139 38.215546,191.67 c -9.13,16.42 -16.91,33.67 -23.02,51.57 -33.85,99.22 -10.5500001,199.69 63.94,275.65 9.79,9.98 26.710004,23.27 49.530004,36.03 70.06,71.95 151.03,84.76 199.59,84.76 45.54,0 92.21,-11.24 124.84,-30.07 28.3,-16.34 52.64,-36.17 72.92,-59.28 108.74,-60.36 157.72,-166.32 141.72,-307.69 z m -73.68,9.57 c -8.31,-61.54 -42.48,-119.59 -90.75,-164.46 37.26,23.3 66.15,54.54 87.71,91.36 27.6,47.13 46.44,143.64 0.76,233.55 9.47,-47.57 10.27,-101.25 2.28,-160.44 z m -11.27,1.52 c 10.34,76.59 5.37,140.08 -11.29,192.23 -24.15,33.64 -58.84,65.28 -107.4,91.69 -31.3,17.03 -61.5,28.71 -90.28,36.23 -8.25,-0.19 -16.63,-0.69 -25.09,-1.54 22.94,-3.81 46.17,-10.56 69.46,-20.26 96.74,-40.31 136.66,-112.17 153.12,-165.35 20.63,-66.68 13.55,-131.72 1.21,-167.16 -36.47,-104.77 -118.35,-165.33 -237.85,-176.66 46.26,0.76 86.54,8.18 121.19,21.31 67.54,45.83 117.02,116.16 126.92,189.52 z m -78.06,294.93 c -21.61,10.54 -52.6,19.64 -88.2,23.43 17.75,-6.76 35.44,-14.89 53.01,-24.45 35,-19.04 64.77,-41.9 88.88,-67.95 -10.72,23.16 -24.08,43.65 -39.67,61.68 -4.6,2.51 -9.26,4.97 -14.02,7.29 z m -368.96,-2.75 c -19.71,-20.45 -38.150004,-45.4 -54.570004,-75.6 -59.13,-108.81 -54.64,-204.44 -32.59,-273.88 40.79,-72.66 110.320004,-128.92 184.840004,-145.21 -6.05,2.97 -12.04,6.12 -17.94,9.49 -48.68,23.3 -93.61,65.79 -123.390004,119.76 -51.8,93.85 -49.11,199.1 7.38,288.77 23.170004,36.78 95.600004,106.18 204.320004,106.77 10.31,2.55 20.33,4.47 29.9,5.87 -15.51,2.15 -30.53,3.16 -44.97,3.16 -63.65,0 -116.29,-18.88 -152.97,-39.14 z m 169.2,18.75 c -62.68,-15.85 -125.37,-53.95 -169.73,-129.36 -100.020004,-170.04 3.83,-303.77 44.43,-336.4 14.06,-11.3 28.49,-21 43.15,-29.29 24.09,-11.11 49.2,-17.27 73.97,-17.27 0.69,0 1.41,0 2.1,0.02 148.62,2.08 228.54,72.27 262.89,170.95 25.29,72.64 20.48,248.09 -147.96,318.27 -39.5,16.46 -75.82,23.09 -108.64,23.09 -0.07,0 -0.14,0 -0.21,0 z m -50.13,-5.41 c -78.55,-17.09 -129.59,-70.46 -145.73,-96.07 -63.580004,-100.94 -49.220004,-209.44 0.22,-289.59 -5.85,11.99 -11.140004,24.86 -15.460004,38.56 -23.54,74.64 -12.63,153.8 31.560004,228.92 36.33,61.76 83.37,97.63 129.41,118.18 z m 93.31,-527.42 c 6.92,-0.48 13.83,-0.76 20.7,-0.76 9.21,0 18.36,0.43 27.44,1.24 5.8,2.34 11.5,4.89 17.15,7.57 -20.54,-4.36 -42.3,-7.05 -65.28,-8.06 z m -237.88,56.28 c 56.12,-54.22 119.7,-76.74 181.69,-76.74 22.56,0 44.9,3.01 66.59,8.54 -27.97,0.93 -55.36,5.59 -81.73,13.89 -9.47,0.87 -19.03,1.9 -28.75,3.25 -66.39,9.19 -130.73,49.37 -177.320004,106.6 13.93,-26.25 28.93,-45.3 39.520004,-55.54 z M 87.255546,510.92 C 8.3455459,430.46 -2.7544541,333.8 25.095546,249.55 c -9.9,74.5 5.8,152.05 46.09,226.19 9.7,17.85 20.01,33.8 30.760004,48.04 -5.970004,-4.67 -10.990004,-9.07 -14.700004,-12.85 z m 360.150004,88.83 c -27.18,15.69 -70.3,28.55 -119.16,28.55 -52.11,0 -110.74,-14.68 -163.49,-56.16 34.18,13.85 76.16,24.27 123.97,24.27 28.75,0 57.59,-3.76 86.33,-11.13 2.13,0.04 4.2,0.06 6.22,0.06 40.23,0 81.61,-7.43 114.06,-20.19 -14.66,13.13 -30.69,24.65 -47.93,34.6 z m 98.55,-75.09 c 10.02,-14.65 18.69,-30.34 25.92,-47.11 3.74,-8.67 7.06,-17.66 10.05,-26.89 17.66,-24.96 30.8,-52.23 38.94,-81.46 22.51,-80.87 3.27,-156.05 -20.04,-195.85 -33.54,-57.28 -80.82,-97.29 -141.07,-119.95 -8.19,-5.44 -16.61,-10.57 -25.24,-15.28 116.19,24.92 211.36,112.54 221.92,205.8 15.48,136.7 -31.24,226.21 -110.47,280.75 z"
+            id="path14"
+            style="fill: url(#Sfumatura_senza_nome_6);"
+          />
+        </svg>
+        <p
+          class="memori--powered-by-label"
+        >
+          <span>
+            Powered by 
           </span>
           <a
             href="https://memori.ai/it?integrationID=cb3c4776-7f0b-4f97-a773-c32a5d7a3bf1&memori=aisuru.com-username-Memori"
@@ -66,106 +209,213 @@ exports[`renders Totem layout unchanged 1`] = `
         <div
           class="memori-header"
         >
-          <button
-            class="memori-button memori-button--primary memori-button--circle memori-button--padded memori-button--icon-only memori-header--button memori-header--button--reload"
-            title="reload"
+          <span
+            class="styles-module__root___-ALla"
           >
             <span
-              class="memori-button--icon"
+              class="styles-module__trigger___V2aIF"
+              id="base-ui-:r1:"
             >
-              <svg
-                aria-hidden="true"
-                fill="none"
-                focusable="false"
-                role="img"
-                stroke="currentColor"
-                stroke-linecap="round"
-                stroke-linejoin="round"
-                stroke-width="2"
-                viewBox="0 0 24 24"
-                xmlns="http://www.w3.org/2000/svg"
+              <span
+                style="display: inline-flex;"
               >
-                <path
-                  d="M23 4L23 10 17 10"
-                />
-                <path
-                  d="M1 20L1 14 7 14"
-                />
-                <path
-                  d="M3.51 9a9 9 0 0114.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0020.49 15"
-                />
-              </svg>
+                <button
+                  aria-label="reload"
+                  class="memori-button memori-button--outline memori-button--md memori-button--icon-only"
+                  tabindex="0"
+                  type="button"
+                >
+                  <span
+                    class="memori-button__icon"
+                  >
+                    <svg
+                      class="lucide lucide-refresh-cw"
+                      fill="none"
+                      height="24"
+                      stroke="currentColor"
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
+                      viewBox="0 0 24 24"
+                      width="24"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"
+                      />
+                      <path
+                        d="M21 3v5h-5"
+                      />
+                      <path
+                        d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"
+                      />
+                      <path
+                        d="M8 16H3v5"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </span>
             </span>
-          </button>
-          <button
-            class="memori-button memori-button--primary memori-button--circle memori-button--padded memori-button--icon-only memori-header--button memori-header--button--speaker"
-            title="Suono"
+          </span>
+          <span
+            class="styles-module__root___-ALla"
           >
             <span
-              class="memori-button--icon"
+              class="styles-module__trigger___V2aIF"
+              id="base-ui-:r3:"
             >
-              <svg
-                aria-hidden="true"
-                focusable="false"
-                role="img"
-                viewBox="0 0 1024 1024"
-                xmlns="http://www.w3.org/2000/svg"
+              <span
+                style="display: inline-flex;"
               >
-                <path
-                  d="M625.9 115c-5.9 0-11.9 1.6-17.4 5.3L254 352H90c-8.8 0-16 7.2-16 16v288c0 8.8 7.2 16 16 16h164l354.5 231.7c5.5 3.6 11.6 5.3 17.4 5.3 16.7 0 32.1-13.3 32.1-32.1V147.1c0-18.8-15.4-32.1-32.1-32.1zM586 803L293.4 611.7l-18-11.7H146V424h129.4l17.9-11.7L586 221v582zm348-327H806c-8.8 0-16 7.2-16 16v40c0 8.8 7.2 16 16 16h128c8.8 0 16-7.2 16-16v-40c0-8.8-7.2-16-16-16zm-41.9 261.8l-110.3-63.7a15.9 15.9 0 00-21.7 5.9l-19.9 34.5c-4.4 7.6-1.8 17.4 5.8 21.8L856.3 800a15.9 15.9 0 0021.7-5.9l19.9-34.5c4.4-7.6 1.7-17.4-5.8-21.8zM760 344a15.9 15.9 0 0021.7 5.9L892 286.2c7.6-4.4 10.2-14.2 5.8-21.8L878 230a15.9 15.9 0 00-21.7-5.9L746 287.8a15.99 15.99 0 00-5.8 21.8L760 344z"
-                />
-              </svg>
+                <button
+                  aria-label="widget.sound"
+                  class="memori-button memori-button--outline memori-button--md memori-button--icon-only"
+                  tabindex="0"
+                  type="button"
+                >
+                  <span
+                    class="memori-button__icon"
+                  >
+                    <svg
+                      class="lucide lucide-volume2"
+                      fill="none"
+                      height="24"
+                      stroke="currentColor"
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
+                      viewBox="0 0 24 24"
+                      width="24"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M11 4.702a.705.705 0 0 0-1.203-.498L6.413 7.587A1.4 1.4 0 0 1 5.416 8H3a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h2.416a1.4 1.4 0 0 1 .997.413l3.383 3.384A.705.705 0 0 0 11 19.298z"
+                      />
+                      <path
+                        d="M16 9a5 5 0 0 1 0 6"
+                      />
+                      <path
+                        d="M19.364 18.364a9 9 0 0 0 0-12.728"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </span>
             </span>
-          </button>
-          <button
-            class="memori-button memori-button--primary memori-button--circle memori-button--padded memori-button--icon-only memori-header--button memori-header--button-settings"
-            title="Impostazioni"
+          </span>
+          <span
+            class="styles-module__root___-ALla"
           >
             <span
-              class="memori-button--icon"
+              class="styles-module__trigger___V2aIF"
+              id="base-ui-:r5:"
             >
-              <svg
-                aria-hidden="true"
-                focusable="false"
-                role="img"
-                viewBox="0 0 1024 1024"
-                xmlns="http://www.w3.org/2000/svg"
+              <span
+                style="display: inline-flex;"
               >
-                <path
-                  d="M924.8 625.7l-65.5-56c3.1-19 4.7-38.4 4.7-57.8s-1.6-38.8-4.7-57.8l65.5-56a32.03 32.03 0 009.3-35.2l-.9-2.6a443.74 443.74 0 00-79.7-137.9l-1.8-2.1a32.12 32.12 0 00-35.1-9.5l-81.3 28.9c-30-24.6-63.5-44-99.7-57.6l-15.7-85a32.05 32.05 0 00-25.8-25.7l-2.7-.5c-52.1-9.4-106.9-9.4-159 0l-2.7.5a32.05 32.05 0 00-25.8 25.7l-15.8 85.4a351.86 351.86 0 00-99 57.4l-81.9-29.1a32 32 0 00-35.1 9.5l-1.8 2.1a446.02 446.02 0 00-79.7 137.9l-.9 2.6c-4.5 12.5-.8 26.5 9.3 35.2l66.3 56.6c-3.1 18.8-4.6 38-4.6 57.1 0 19.2 1.5 38.4 4.6 57.1L99 625.5a32.03 32.03 0 00-9.3 35.2l.9 2.6c18.1 50.4 44.9 96.9 79.7 137.9l1.8 2.1a32.12 32.12 0 0035.1 9.5l81.9-29.1c29.8 24.5 63.1 43.9 99 57.4l15.8 85.4a32.05 32.05 0 0025.8 25.7l2.7.5a449.4 449.4 0 00159 0l2.7-.5a32.05 32.05 0 0025.8-25.7l15.7-85a350 350 0 0099.7-57.6l81.3 28.9a32 32 0 0035.1-9.5l1.8-2.1c34.8-41.1 61.6-87.5 79.7-137.9l.9-2.6c4.5-12.3.8-26.3-9.3-35zM788.3 465.9c2.5 15.1 3.8 30.6 3.8 46.1s-1.3 31-3.8 46.1l-6.6 40.1 74.7 63.9a370.03 370.03 0 01-42.6 73.6L721 702.8l-31.4 25.8c-23.9 19.6-50.5 35-79.3 45.8l-38.1 14.3-17.9 97a377.5 377.5 0 01-85 0l-17.9-97.2-37.8-14.5c-28.5-10.8-55-26.2-78.7-45.7l-31.4-25.9-93.4 33.2c-17-22.9-31.2-47.6-42.6-73.6l75.5-64.5-6.5-40c-2.4-14.9-3.7-30.3-3.7-45.5 0-15.3 1.2-30.6 3.7-45.5l6.5-40-75.5-64.5c11.3-26.1 25.6-50.7 42.6-73.6l93.4 33.2 31.4-25.9c23.7-19.5 50.2-34.9 78.7-45.7l37.9-14.3 17.9-97.2c28.1-3.2 56.8-3.2 85 0l17.9 97 38.1 14.3c28.7 10.8 55.4 26.2 79.3 45.8l31.4 25.8 92.8-32.9c17 22.9 31.2 47.6 42.6 73.6L781.8 426l6.5 39.9zM512 326c-97.2 0-176 78.8-176 176s78.8 176 176 176 176-78.8 176-176-78.8-176-176-176zm79.2 255.2A111.6 111.6 0 01512 614c-29.9 0-58-11.7-79.2-32.8A111.6 111.6 0 01400 502c0-29.9 11.7-58 32.8-79.2C454 401.6 482.1 390 512 390c29.9 0 58 11.6 79.2 32.8A111.6 111.6 0 01624 502c0 29.9-11.7 58-32.8 79.2z"
-                />
-              </svg>
+                <button
+                  aria-label="widget.settings"
+                  class="memori-button memori-button--outline memori-button--md memori-button--icon-only"
+                  tabindex="0"
+                  type="button"
+                >
+                  <span
+                    class="memori-button__icon"
+                  >
+                    <svg
+                      class="lucide lucide-settings"
+                      fill="none"
+                      height="24"
+                      stroke="currentColor"
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
+                      viewBox="0 0 24 24"
+                      width="24"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"
+                      />
+                      <circle
+                        cx="12"
+                        cy="12"
+                        r="3"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </span>
             </span>
-          </button>
+          </span>
           <div
-            class="memori-share-button memori-share-button--align-left"
-            data-headlessui-state=""
+            class="memori-dropdown memori-share-button memori-share-button--align-left"
           >
-            <button
-              aria-expanded="false"
-              aria-haspopup="true"
-              class="memori-button memori-button--circle memori-button--icon-only memori-share-button--button memori-header--button memori-header--button-share memori-button--primary"
-              data-headlessui-state=""
-              id="headlessui-menu-button-:r0:"
-              title="Condividi"
-              type="button"
+            <span
+              class="styles-module__root___-ALla"
             >
-              <div
-                class="memori-button--icon"
+              <span
+                class="styles-module__trigger___V2aIF"
+                id="base-ui-:rb:"
               >
-                <svg
-                  aria-hidden="true"
-                  focusable="false"
-                  role="img"
-                  viewBox="0 0 1024 1024"
-                  xmlns="http://www.w3.org/2000/svg"
+                <button
+                  aria-expanded="false"
+                  aria-haspopup="menu"
+                  aria-label="widget.share"
+                  class="memori-button memori-button--outline memori-button--md memori-button--icon-only"
+                  id="base-ui-:rc:"
+                  tabindex="0"
+                  type="button"
                 >
-                  <path
-                    d="M752 664c-28.5 0-54.8 10-75.4 26.7L469.4 540.8a160.68 160.68 0 0 0 0-57.6l207.2-149.9C697.2 350 723.5 360 752 360c66.2 0 120-53.8 120-120s-53.8-120-120-120-120 53.8-120 120c0 11.6 1.6 22.7 4.7 33.3L439.9 415.8C410.7 377.1 364.3 352 312 352c-88.4 0-160 71.6-160 160s71.6 160 160 160c52.3 0 98.7-25.1 127.9-63.8l196.8 142.5c-3.1 10.6-4.7 21.8-4.7 33.3 0 66.2 53.8 120 120 120s120-53.8 120-120-53.8-120-120-120zm0-476c28.7 0 52 23.3 52 52s-23.3 52-52 52-52-23.3-52-52 23.3-52 52-52zM312 600c-48.5 0-88-39.5-88-88s39.5-88 88-88 88 39.5 88 88-39.5 88-88 88zm440 236c-28.7 0-52-23.3-52-52s23.3-52 52-52 52 23.3 52 52-23.3 52-52 52z"
-                  />
-                </svg>
-              </div>
-            </button>
+                  <span
+                    class="memori-button__icon"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      class="lucide lucide-share2"
+                      fill="none"
+                      height="24"
+                      stroke="currentColor"
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
+                      viewBox="0 0 24 24"
+                      width="24"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <circle
+                        cx="18"
+                        cy="5"
+                        r="3"
+                      />
+                      <circle
+                        cx="6"
+                        cy="12"
+                        r="3"
+                      />
+                      <circle
+                        cx="18"
+                        cy="19"
+                        r="3"
+                      />
+                      <line
+                        x1="8.59"
+                        x2="15.42"
+                        y1="13.51"
+                        y2="17.49"
+                      />
+                      <line
+                        x1="15.41"
+                        x2="8.59"
+                        y1="6.51"
+                        y2="10.49"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </span>
+            </span>
           </div>
         </div>
       </div>
@@ -203,30 +453,49 @@ exports[`renders Totem layout unchanged 1`] = `
           class="memori--avatar-toggle"
         >
           <button
-            class="memori-button memori-button--ghost memori-button--rounded memori-button--padded memori-button--with-icon"
+            aria-label="hide"
+            class="memori-button memori-button--ghost memori-button--md"
+            tabindex="0"
+            type="button"
           >
             <span
-              class="memori-button--icon"
+              class="memori-button__icon"
             >
               <svg
                 aria-hidden="true"
-                focusable="false"
-                role="img"
-                viewBox="0 0 1024 1024"
+                class="lucide lucide-eye-off"
+                fill="none"
+                height="24"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="24"
                 xmlns="http://www.w3.org/2000/svg"
               >
                 <path
-                  d="M942.2 486.2Q889.47 375.11 816.7 305l-50.88 50.88C807.31 395.53 843.45 447.4 874.7 512 791.5 684.2 673.4 766 512 766q-72.67 0-133.87-22.38L323 798.75Q408 838 512 838q288.3 0 430.2-300.3a60.29 60.29 0 000-51.5zm-63.57-320.64L836 122.88a8 8 0 00-11.32 0L715.31 232.2Q624.86 186 512 186q-288.3 0-430.2 300.3a60.3 60.3 0 000 51.5q56.69 119.4 136.5 191.41L112.48 835a8 8 0 000 11.31L155.17 889a8 8 0 0011.31 0l712.15-712.12a8 8 0 000-11.32zM149.3 512C232.6 339.8 350.7 258 512 258c54.54 0 104.13 9.36 149.12 28.39l-70.3 70.3a176 176 0 00-238.13 238.13l-83.42 83.42C223.1 637.49 183.3 582.28 149.3 512zm246.7 0a112.11 112.11 0 01146.2-106.69L401.31 546.2A112 112 0 01396 512z"
+                  d="M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49"
                 />
                 <path
-                  d="M508 624c-3.46 0-6.87-.16-10.25-.47l-52.82 52.82a176.09 176.09 0 00227.42-227.42l-52.82 52.82c.31 3.38.47 6.79.47 10.25a111.94 111.94 0 01-112 112z"
+                  d="M14.084 14.158a3 3 0 0 1-4.242-4.242"
+                />
+                <path
+                  d="M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143"
+                />
+                <path
+                  d="m2 2 20 20"
                 />
               </svg>
             </span>
             <span
-              class="memori--avatar-toggle-text"
+              class="memori-button__content"
             >
-              Nascondi
+              <span
+                class="memori--avatar-toggle-text"
+              >
+                hide
+              </span>
             </span>
           </button>
         </div>
@@ -243,318 +512,272 @@ exports[`renders Totem layout unchanged 1`] = `
           <div
             class="memori--cover"
           />
-          <picture
-            class="memori--avatar"
-          >
-            <source
-              src="https://aisuru.com/images/aisuru/square_logo.png"
-            />
-            <img
-              alt="Memori"
-              src="https://aisuru.com/images/aisuru/square_logo.png"
-            />
-          </picture>
-          <h2
-            class="memori--title"
-          >
-            Memori
-          </h2>
           <div
-            class="memori--description"
+            class="memori--start-panel__body"
           >
-            <p>
-              <div
-                class="memori-expandable memori--description-text"
-              >
-                <div
-                  class="memori-expandable--inner"
-                  style="max-height: 9999px;"
-                >
-                  Lorem ipsum.
-                </div>
-              </div>
-            </p>
             <div
-              class="memori--language-chooser"
+              class="memori--title-container"
             >
-              <label
-                for="user-lang-pref"
-                id="user-lang-pref-label"
+              <picture
+                class="memori--avatar"
               >
-                Voglio parlare con Memori in
-              </label>
-              <select
-                aria-labelledby="user-lang-pref-label"
-                class="memori-select--button"
-                id="user-lang-pref"
+                <source
+                  src="https://aisuru.com/images/aisuru/square_logo.png"
+                />
+                <img
+                  alt="Memori"
+                  src="https://aisuru.com/images/aisuru/square_logo.png"
+                />
+              </picture>
+              <div
+                class="memori--title-container__content"
               >
-                <optgroup
-                  label="Popolari"
+                <h2
+                  class="memori--title"
                 >
-                  <option
-                    aria-label="English"
-                    value="EN"
-                  >
-                    English
-                  </option>
-                  <option
-                    aria-label="Italiano"
-                    value="IT"
-                  >
-                    Italiano
-                  </option>
-                </optgroup>
-                <optgroup
-                  label="Tutte le lingue"
+                  Memori
+                </h2>
+                <div
+                  class="memori-expandable memori--description-text memori--description-text--collapsible"
                 >
-                  <option
-                    aria-label="العربية"
-                    value="AR"
-                  >
-                    العربية
-                  </option>
-                  <option
-                    aria-label="български"
-                    value="BG"
-                  >
-                    български
-                  </option>
-                  <option
-                    aria-label="Čeština / český jazyk"
-                    value="CS"
-                  >
-                    Čeština / český jazyk
-                  </option>
-                  <option
-                    aria-label="Dansk"
-                    value="DA"
-                  >
-                    Dansk
-                  </option>
-                  <option
-                    aria-label="Deutsch"
-                    value="DE"
-                  >
-                    Deutsch
-                  </option>
-                  <option
-                    aria-label="Ελληνικά"
-                    value="EL"
-                  >
-                    Ελληνικά
-                  </option>
-                  <option
-                    aria-label="Español"
-                    value="ES"
-                  >
-                    Español
-                  </option>
-                  <option
-                    aria-label="Eesti keel"
-                    value="ET"
-                  >
-                    Eesti keel
-                  </option>
-                  <option
-                    aria-label="Suomi"
-                    value="FI"
-                  >
-                    Suomi
-                  </option>
-                  <option
-                    aria-label="Français"
-                    value="FR"
-                  >
-                    Français
-                  </option>
-                  <option
-                    aria-label="Hrvatski"
-                    value="HR"
-                  >
-                    Hrvatski
-                  </option>
-                  <option
-                    aria-label="Magyar"
-                    value="HU"
-                  >
-                    Magyar
-                  </option>
-                  <option
-                    aria-label="日本語"
-                    value="JA"
-                  >
-                    日本語
-                  </option>
-                  <option
-                    aria-label="Lietuvių kalba"
-                    value="LT"
-                  >
-                    Lietuvių kalba
-                  </option>
-                  <option
-                    aria-label="Latvian"
-                    value="LV"
-                  >
-                    Latvian
-                  </option>
-                  <option
-                    aria-label="Nederlands"
-                    value="NL"
-                  >
-                    Nederlands
-                  </option>
-                  <option
-                    aria-label="Polski"
-                    value="PL"
-                  >
-                    Polski
-                  </option>
-                  <option
-                    aria-label="Português"
-                    value="PT"
-                  >
-                    Português
-                  </option>
-                  <option
-                    aria-label="Română"
-                    value="RO"
-                  >
-                    Română
-                  </option>
-                  <option
-                    aria-label="Русский"
-                    value="RU"
-                  >
-                    Русский
-                  </option>
-                  <option
-                    aria-label="Slovenčina"
-                    value="SK"
+                  <div
+                    class="memori-expandable__inner"
+                    style="max-height: 9999px;"
                   >
-                    Slovenčina
-                  </option>
-                  <option
-                    aria-label="Slovenščina"
-                    value="SL"
-                  >
-                    Slovenščina
-                  </option>
-                  <option
-                    aria-label="Svenska"
-                    value="SV"
-                  >
-                    Svenska
-                  </option>
-                  <option
-                    aria-label="Українська"
-                    value="UK"
-                  >
-                    Українська
-                  </option>
-                  <option
-                    aria-label="中文"
-                    value="ZH"
-                  >
-                    中文
-                  </option>
-                </optgroup>
-              </select>
-            </div>
-            <div
-              class="memori--start-privacy-explanation-container"
-            >
-              <p
-                class="memori--start-privacy-explanation"
-              >
-                Le conversazioni sono visibili all'autore dell'agente
-              </p>
+                    Lorem ipsum.
+                  </div>
+                </div>
+              </div>
               <div
-                class="memori-tooltip memori-tooltip--align-topLeft"
+                class="memori--completion-provider-status--loading"
               >
                 <div
-                  class="memori-tooltip--trigger"
+                  class="memori-spin memori-spin--spinning"
                 >
-                  <svg
-                    aria-hidden="true"
-                    class="memori--start-privacy-explanation-icon"
-                    fill="none"
-                    focusable="false"
-                    role="img"
-                    stroke="currentColor"
-                    stroke-linecap="round"
-                    stroke-linejoin="round"
-                    stroke-width="1.5"
-                    viewBox="0 0 24 24"
-                    xmlns="http://www.w3.org/2000/svg"
+                  <div
+                    aria-label="Loading"
+                    aria-live="polite"
+                    class="memori-spin__overlay"
+                    role="status"
                   >
-                    <circle
-                      cx="12"
-                      cy="12"
-                      r="10"
-                    />
-                    <path
-                      d="M9.09 9a3 3 0 015.83 1c0 2-3 3-3 3"
-                    />
-                    <path
-                      d="M12 17L12.01 17"
-                    />
-                  </svg>
+                    <div
+                      class="memori-spin__container"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        class="lucide lucide-loader-circle memori-spin__icon"
+                        fill="none"
+                        height="24"
+                        stroke="currentColor"
+                        stroke-linecap="round"
+                        stroke-linejoin="round"
+                        stroke-width="2"
+                        viewBox="0 0 24 24"
+                        width="24"
+                        xmlns="http://www.w3.org/2000/svg"
+                      >
+                        <path
+                          d="M21 12a9 9 0 1 1-6.219-8.56"
+                        />
+                      </svg>
+                    </div>
+                  </div>
                 </div>
               </div>
             </div>
-            <button
-              class="memori-button memori-button--primary memori-button--rounded memori-button--padded memori--start-button"
-            >
-              INIZIAMO
-            </button>
             <div
-              class="memori--completion-provider-status--loading"
+              class="memori--description"
             >
               <div
-                class="memori-spin memori-spin--spinning"
+                class="memori--language-row"
               >
                 <div
-                  class="memori-spin--spinner"
+                  class="memori-combobox memori-combobox--language-chooser memori--language-row__combobox"
                 >
-                  <svg
+                  <label
+                    class="memori-combobox__label"
+                    for=":re:"
+                    id=":re:-label"
+                  >
+                    write_and_speak.chatLanguageLabel
+                  </label>
+                  <button
+                    aria-expanded="false"
+                    aria-haspopup="dialog"
+                    aria-labelledby=":re:-label"
+                    class="memori-combobox__trigger"
+                    id=":re:"
+                    role="combobox"
+                    tabindex="0"
+                    type="button"
+                  >
+                    <span
+                      class="memori-combobox__value"
+                    >
+                      Italian
+                    </span>
+                    <span
+                      aria-hidden="true"
+                      class="memori-combobox__trigger-icon"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        class="lucide lucide-chevron-down"
+                        fill="none"
+                        height="16"
+                        stroke="currentColor"
+                        stroke-linecap="round"
+                        stroke-linejoin="round"
+                        stroke-width="2"
+                        viewBox="0 0 24 24"
+                        width="16"
+                        xmlns="http://www.w3.org/2000/svg"
+                      >
+                        <path
+                          d="m6 9 6 6 6-6"
+                        />
+                      </svg>
+                    </span>
+                  </button>
+                  <input
                     aria-hidden="true"
-                    class="memori-loading-icon"
-                    focusable="false"
-                    role="img"
-                    viewBox="0 0 1024 1024"
-                    xmlns="http://www.w3.org/2000/svg"
+                    id="base-ui-:rf:"
+                    name="user-lang-pref"
+                    style="overflow: hidden; white-space: nowrap; position: fixed; top: 0px; left: 0px; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px;"
+                    tabindex="-1"
+                    value="IT"
+                  />
+                </div>
+              </div>
+              <section
+                class="memori--start-panel__mobile-info"
+              >
+                <div
+                  class="memori--start-panel__mobile-info-content"
+                >
+                  <section
+                    class="memori--settings-section"
                   >
-                    <path
-                      d="M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 00-94.3-139.9 437.71 437.71 0 00-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z"
-                    />
-                  </svg>
+                    <div
+                      class="memori--settings-section__row"
+                    >
+                      <div
+                        aria-hidden="true"
+                        class="memori--settings-section__icon-box memori--settings-section__icon-box--neutral"
+                      >
+                        <svg
+                          class="lucide lucide-eye memori--settings-section__icon"
+                          fill="none"
+                          height="24"
+                          stroke="currentColor"
+                          stroke-linecap="round"
+                          stroke-linejoin="round"
+                          stroke-width="2"
+                          viewBox="0 0 24 24"
+                          width="24"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <path
+                            d="M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0"
+                          />
+                          <circle
+                            cx="12"
+                            cy="12"
+                            r="3"
+                          />
+                        </svg>
+                      </div>
+                      <div
+                        class="memori--settings-section__content"
+                      >
+                        <div
+                          class="memori--settings-section__title-inline"
+                        >
+                          <p
+                            class="memori--settings-section__title"
+                          >
+                            write_and_speak.pagePrivacyExplanation
+                          </p>
+                        </div>
+                        <p
+                          class="memori--settings-section__description"
+                        >
+                          write_and_speak.pagePrivacyExplanationList.authorUsesInfo
+                        </p>
+                      </div>
+                      <span
+                        class="styles-module__root___-ALla"
+                      >
+                        <span
+                          class="styles-module__trigger___V2aIF"
+                          id="base-ui-:ri:"
+                        >
+                          <button
+                            aria-label="privacyPolicy"
+                            class="memori-button memori-button--toolbar memori-button--sm memori--privacy-popover-trigger memori--settings-section__info-trigger"
+                            tabindex="0"
+                            type="button"
+                          >
+                            <span
+                              class="memori-button__content"
+                            >
+                              <svg
+                                class="lucide lucide-info memori--settings-section__inline-info-icon"
+                                fill="none"
+                                height="24"
+                                stroke="currentColor"
+                                stroke-linecap="round"
+                                stroke-linejoin="round"
+                                stroke-width="2"
+                                viewBox="0 0 24 24"
+                                width="24"
+                                xmlns="http://www.w3.org/2000/svg"
+                              >
+                                <circle
+                                  cx="12"
+                                  cy="12"
+                                  r="10"
+                                />
+                                <path
+                                  d="M12 16v-4"
+                                />
+                                <path
+                                  d="M12 8h.01"
+                                />
+                              </svg>
+                            </span>
+                          </button>
+                        </span>
+                      </span>
+                    </div>
+                  </section>
                 </div>
+              </section>
+              <div
+                class="memori--start-actions"
+              >
+                <button
+                  class="memori-button memori-button--primary memori-button--lg memori--start-actions__start"
+                  style="font-weight: var(--memori-text-weight-bold);"
+                  tabindex="0"
+                  type="button"
+                >
+                  <span
+                    class="memori-button__content"
+                  >
+                    write_and_speak.tryMeButton
+                  </span>
+                </button>
               </div>
+              <p
+                class="memori--start-description"
+              >
+                write_and_speak.pageTryMeExplanation
+              </p>
             </div>
-            <p
-              class="memori--start-description"
-            >
-              Per parlare con me clicca sul pulsante INIZIAMO per cominciare
-            </p>
           </div>
         </div>
       </div>
-      <div
-        class="memori-spin--spinner"
-      >
-        <svg
-          aria-hidden="true"
-          class="memori-loading-icon"
-          focusable="false"
-          role="img"
-          viewBox="0 0 1024 1024"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 00-94.3-139.9 437.71 437.71 0 00-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z"
-          />
-        </svg>
-      </div>
     </div>
     <audio
       id="memori-audio"
@@ -562,5 +785,14 @@ exports[`renders Totem layout unchanged 1`] = `
       style="display: none;"
     />
   </div>
+  <div
+    aria-atomic="false"
+    aria-label="Notifications"
+    aria-live="polite"
+    aria-relevant="additions text"
+    class="memori-alert-viewport memori-alert-viewport--top-end"
+    role="region"
+    tabindex="-1"
+  />
 </div>
 `;