diff --git a/examples/official-site/assets/screenshots/plot.svg b/examples/official-site/assets/screenshots/plot.svg
index 2d242453..d6026b4c 100644
--- a/examples/official-site/assets/screenshots/plot.svg
+++ b/examples/official-site/assets/screenshots/plot.svg
@@ -1,669 +1,124 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg
-   xml:space="preserve"
-   width="1910.7"
-   height="1448.5"
-   class="apexcharts-svg"
-   version="1.1"
-   id="svg64"
-   sodipodi:docname="plot.svg"
-   inkscape:version="1.4 (e7c3feb100, 2024-10-09)"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
-   xmlns:xlink="http://www.w3.org/1999/xlink"
-   xmlns="http://www.w3.org/2000/svg"
-   xmlns:svg="http://www.w3.org/2000/svg"
-   xmlns:xhtml="http://www.w3.org/1999/xhtml"
-   xmlns:data="ApexChartsNS">
-   <style>
-      * {
-         font-family: 'Fira Code', 'Monospace', sans-serif;
-      }
-   </style>
-   <sodipodi:namedview
-   id="namedview64"
-   pagecolor="#ffffff"
-   bordercolor="#000000"
-   borderopacity="0.25"
-   inkscape:showpageshadow="2"
-   inkscape:pageopacity="0.0"
-   inkscape:pagecheckerboard="0"
-   inkscape:deskcolor="#d1d1d1"
-   showgrid="false"
-   inkscape:zoom="0.31054484"
-   inkscape:cx="1015.9564"
-   inkscape:cy="837.2382"
-   inkscape:window-width="1536"
-   inkscape:window-height="795"
-   inkscape:window-x="0"
-   inkscape:window-y="0"
-   inkscape:window-maximized="1"
-   inkscape:current-layer="svg64" />
-  <defs
-   id="defs1">
-    <path
-   id="c"
-   stroke="#e0e0e0"
-   stroke-dasharray="none"
-   stroke-linecap="butt"
-   d="M0 185h333"
-   class="apexcharts-gridline" />
-    <path
-   id="g"
-   stroke="#b6b6b6"
-   stroke-dasharray="none"
-   stroke-linecap="butt"
-   stroke-width="1"
-   d="M0 0h333"
-   class="apexcharts-ycrosshairs" />
-  <filter
-   style="color-interpolation-filters:sRGB;"
-   inkscape:label="Drop Shadow"
-   id="filter70"
-   x="-0.038885907"
-   y="-0.068046632"
-   width="1.0835786"
-   height="1.1462546"><feFlood
-     result="flood"
-     in="SourceGraphic"
-     flood-opacity="0.129412"
-     flood-color="rgb(90,88,95)"
-     id="feFlood69" /><feGaussianBlur
-     result="blur"
-     in="SourceGraphic"
-     stdDeviation="22.322130"
-     id="feGaussianBlur69" /><feOffset
-     result="offset"
-     in="blur"
-     dx="8.000000"
-     dy="8.000000"
-     id="feOffset69" /><feComposite
-     result="comp1"
-     operator="in"
-     in="flood"
-     in2="offset"
-     id="feComposite69" /><feComposite
-     result="comp2"
-     operator="over"
-     in="SourceGraphic"
-     in2="comp1"
-     id="feComposite70" /></filter></defs>
-  <defs
-   id="defs6">
-    <filter
-   id="a"
-   width="1.0686473"
-   height="1.1103518"
-   x="-0.029582808"
-   y="-0.047554936"
-   style="color-interpolation-filters:sRGB">
-      <feFlood
-   flood-color="#000"
-   flood-opacity=".5"
-   result="flood"
-   id="feFlood1" />
-      <feGaussianBlur
-   in="SourceGraphic"
-   result="blur"
-   stdDeviation="7.8"
-   id="feGaussianBlur1" />
-      <feOffset
-   dx="6"
-   dy="6"
-   in="blur"
-   result="offset"
-   id="feOffset1" />
-      <feComposite
-   in="flood"
-   in2="offset"
-   operator="in"
-   result="comp1"
-   id="feComposite1" />
-      <feComposite
-   in="SourceGraphic"
-   in2="comp1"
-   result="fbSourceGraphic"
-   id="feComposite2" />
-      <feColorMatrix
-   in="fbSourceGraphic"
-   result="fbSourceGraphicAlpha"
-   values="0 0 0 -1 0 0 0 0 -1 0 0 0 0 -1 0 0 0 0 1 0"
-   id="feColorMatrix2" />
-      <feFlood
-   flood-color="#000"
-   flood-opacity=".5"
-   result="flood"
-   id="feFlood2" />
-      <feGaussianBlur
-   in="fbSourceGraphic"
-   result="blur"
-   stdDeviation="7.8"
-   id="feGaussianBlur2" />
-      <feOffset
-   dx="6"
-   dy="6"
-   in="blur"
-   result="offset"
-   id="feOffset2" />
-      <feComposite
-   in="flood"
-   in2="offset"
-   operator="in"
-   result="comp1"
-   id="feComposite3" />
-      <feComposite
-   in="fbSourceGraphic"
-   in2="comp1"
-   result="comp2"
-   id="feComposite4" />
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:data="ApexChartsNS" xmlns:xhtml="http://www.w3.org/1999/xhtml" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" width="1910.7" height="1448.5" class="apexcharts-svg">
+  <defs>
+    <filter id="b" width="1.1" height="1.1" x="0" y="0" color-interpolation-filters="sRGB">
+      <feFlood flood-color="#5A585F" flood-opacity=".1" result="flood"/>
+      <feGaussianBlur in="SourceGraphic" result="blur" stdDeviation="22.3"/>
+      <feOffset dx="8" dy="8" in="blur" result="offset"/>
+      <feComposite in="flood" in2="offset" operator="in" result="comp1"/>
+      <feComposite in="SourceGraphic" in2="comp1" result="comp2"/>
     </filter>
-    <filter
-   id="b"
-   width="1.0330551"
-   height="1.0851518"
-   x="-0.013587865"
-   y="-0.023777468"
-   style="color-interpolation-filters:sRGB">
-      <feFlood
-   flood-color="#5A585F"
-   flood-opacity=".1"
-   result="flood"
-   id="feFlood4" />
-      <feGaussianBlur
-   in="SourceGraphic"
-   result="blur"
-   stdDeviation="7.8"
-   id="feGaussianBlur4" />
-      <feOffset
-   dx="8.1"
-   dy="29.6"
-   in="blur"
-   result="offset"
-   id="feOffset4" />
-      <feComposite
-   in="flood"
-   in2="offset"
-   operator="in"
-   result="comp1"
-   id="feComposite5" />
-      <feComposite
-   in="SourceGraphic"
-   in2="comp1"
-   result="comp2"
-   id="feComposite6" />
+    <path id="c" stroke="#e0e0e0" stroke-dasharray="none" stroke-linecap="butt" d="M0 185h333" class="apexcharts-gridline"/>
+  </defs>
+  <defs>
+    <filter id="a" width="1.1" height="1.1" x="0" y="0" color-interpolation-filters="sRGB">
+      <feFlood flood-color="#000" flood-opacity=".5" result="flood"/>
+      <feGaussianBlur in="SourceGraphic" result="blur" stdDeviation="7.8"/>
+      <feOffset dx="6" dy="6" in="blur" result="offset"/>
+      <feComposite in="flood" in2="offset" operator="in" result="comp1"/>
+      <feComposite in="SourceGraphic" in2="comp1" result="fbSourceGraphic"/>
+      <feColorMatrix in="fbSourceGraphic" result="fbSourceGraphicAlpha" values="0 0 0 -1 0 0 0 0 -1 0 0 0 0 -1 0 0 0 0 1 0"/>
+      <feFlood flood-color="#000" flood-opacity=".5" result="flood"/>
+      <feGaussianBlur in="fbSourceGraphic" result="blur" stdDeviation="7.8"/>
+      <feOffset dx="6" dy="6" in="blur" result="offset"/>
+      <feComposite in="flood" in2="offset" operator="in" result="comp1"/>
+      <feComposite in="fbSourceGraphic" in2="comp1" result="comp2"/>
     </filter>
   </defs>
-  <g
-   transform="translate(550 -413)"
-   id="g9">
-    <rect
-   width="1265.6"
-   height="787.3"
-   x="-512.7"
-   y="449.9"
-   ry="15.9"
-   style="fill:#151718;fill-opacity:1;stroke-width:226.176;filter:url(#a)"
-   transform="matrix(.95846 0 0 1 -23 0)"
-   id="rect6" />
-    <g
-   transform="translate(-147 153) scale(.68282)"
-   id="g8">
-      <circle
-   cx="-475.8"
-   cy="487.7"
-   r="19.4"
-   style="fill:#ff5f56;fill-opacity:1;stroke-width:170"
-   id="circle6" />
-      <circle
-   cx="-418.3"
-   cy="487.7"
-   r="19.4"
-   style="fill:#ffbd2e;fill-opacity:1;stroke-width:170"
-   id="circle7" />
-      <circle
-   cx="-360.8"
-   cy="487.7"
-   r="19.4"
-   style="fill:#27c93f;fill-opacity:1;stroke-width:170"
-   id="circle8" />
+  <g transform="translate(550 -413)">
+    <rect width="1265.6" height="787.3" x="-513" y="450" fill="#151718" filter="url(#a)" ry="15.9" transform="matrix(.95846 0 0 1 -23 0)"/>
+    <g transform="translate(-147 153) scale(.68282)">
+      <circle cx="-475.8" cy="487.7" r="19.4" fill="#ff5f56"/>
+      <circle cx="-418.3" cy="487.7" r="19.4" fill="#ffbd2e"/>
+      <circle cx="-360.8" cy="487.7" r="19.4" fill="#27c93f"/>
     </g>
   </g>
-  <g
-   transform="translate(1142 163)"
-   id="g12">
-    <rect
-   width="1377.7"
-   height="787.3"
-   x="-512.7"
-   y="449.9"
-   ry="15.9"
-   style="fill:#eef3f7;fill-opacity:1;stroke-width:226.176;opacity:0.92774419;filter:url(#filter70)"
-   transform="matrix(.88741 0 0 1 -23 0)"
-   id="rect9" />
-    <g
-   transform="translate(-125 151) scale(.68282)"
-   id="g11">
-      <circle
-   cx="-475.8"
-   cy="487.7"
-   r="19.4"
-   style="fill:#ff5f56;fill-opacity:1;stroke-width:170"
-   id="circle9" />
-      <circle
-   cx="-418.3"
-   cy="487.7"
-   r="19.4"
-   style="fill:#ffbd2e;fill-opacity:1;stroke-width:170"
-   id="circle10" />
-      <circle
-   cx="-360.8"
-   cy="487.7"
-   r="19.4"
-   style="fill:#27c93f;fill-opacity:1;stroke-width:170"
-   id="circle11" />
+  <g transform="translate(1142 163)">
+    <rect width="1377.7" height="787.3" x="-513" y="450" fill="#eef3f7" filter="url(#b)" opacity=".9" ry="15.9" transform="matrix(.88741 0 0 1 -23 0)"/>
+    <g transform="translate(-125 151) scale(.68282)">
+      <circle cx="-475.8" cy="487.7" r="19.4" fill="#ff5f56"/>
+      <circle cx="-418.3" cy="487.7" r="19.4" fill="#ffbd2e"/>
+      <circle cx="-360.8" cy="487.7" r="19.4" fill="#27c93f"/>
     </g>
   </g>
-  <foreignObject
-   width="388"
-   height="250"
-   x="0"
-   y="0">
-    <xhtml:div
-   class="apexcharts-legend"
-   style="max-height:125px" />
+  <foreignObject width="388" height="250" x="0" y="0">
+    <xhtml:div class="apexcharts-legend" style="max-height:125px"/>
   </foreignObject>
-  <g
-   class="apexcharts-yaxis"
-   id="g19">
-    <g
-   fill="#373d3f"
-   class="apexcharts-yaxis-texts-g"
-   font-family="inherit"
-   font-size="11"
-   font-weight="400"
-   text-anchor="end"
-   id="g18">
-      <text
-   x="20"
-   y="33.7"
-   class="apexcharts-text apexcharts-yaxis-label"
-   style="font-family:mono"
-   transform="translate(709 616) scale(3.02526)"
-   id="text12"><tspan
-     id="tspan12">120</tspan></text>
-      <text
-   x="20"
-   y="64.5"
-   class="apexcharts-text apexcharts-yaxis-label"
-   style="font-family:mono"
-   transform="translate(709 616) scale(3.02526)"
-   id="text13"><tspan
-     id="tspan13">100</tspan></text>
-      <text
-   x="20"
-   y="95.4"
-   class="apexcharts-text apexcharts-yaxis-label"
-   style="font-family:mono"
-   transform="translate(709 616) scale(3.02526)"
-   id="text14"><tspan
-     id="tspan14">80</tspan></text>
-      <text
-   x="20"
-   y="126.3"
-   class="apexcharts-text apexcharts-yaxis-label"
-   style="font-family:mono"
-   transform="translate(709 616) scale(3.02526)"
-   id="text15"><tspan
-     id="tspan15">60</tspan></text>
-      <text
-   x="20"
-   y="157.1"
-   class="apexcharts-text apexcharts-yaxis-label"
-   style="font-family:mono"
-   transform="translate(709 616) scale(3.02526)"
-   id="text16"><tspan
-     id="tspan16">40</tspan></text>
-      <text
-   x="20"
-   y="188"
-   class="apexcharts-text apexcharts-yaxis-label"
-   style="font-family:mono"
-   transform="translate(709 616) scale(3.02526)"
-   id="text17"><tspan
-     id="tspan17">20</tspan></text>
-      <text
-   x="20"
-   y="218.9"
-   class="apexcharts-text apexcharts-yaxis-label"
-   style="font-family:mono"
-   transform="translate(709 616) scale(3.02526)"
-   id="text18"><tspan
-     id="tspan18">0</tspan></text>
+  <g class="apexcharts-yaxis">
+    <g fill="#373d3f" class="apexcharts-yaxis-texts-g" font-family="mono" font-size="11" font-weight="400" text-anchor="end">
+      <text x="20" y="34" class="apexcharts-text apexcharts-yaxis-label" transform="translate(709 616) scale(3.02526)"><tspan>120</tspan></text>
+      <text x="20" y="65" class="apexcharts-text apexcharts-yaxis-label" transform="translate(709 616) scale(3.02526)"><tspan>100</tspan></text>
+      <text x="20" y="95" class="apexcharts-text apexcharts-yaxis-label" transform="translate(709 616) scale(3.02526)"><tspan>80</tspan></text>
+      <text x="20" y="126" class="apexcharts-text apexcharts-yaxis-label" transform="translate(709 616) scale(3.02526)"><tspan>60</tspan></text>
+      <text x="20" y="157" class="apexcharts-text apexcharts-yaxis-label" transform="translate(709 616) scale(3.02526)"><tspan>40</tspan></text>
+      <text x="20" y="188" class="apexcharts-text apexcharts-yaxis-label" transform="translate(709 616) scale(3.02526)"><tspan>20</tspan></text>
+      <text x="20" y="219" class="apexcharts-text apexcharts-yaxis-label" transform="translate(709 616) scale(3.02526)"><tspan>0</tspan></text>
     </g>
   </g>
-  <g
-   class="apexcharts-inner apexcharts-graphical"
-   transform="translate(800 707) scale(3.02526)"
-   id="g48">
-    <defs
-   id="defs22">
-      <clipPath
-   id="e">
-        <rect
-   width="333.3"
-   height="185.2"
-   fill="#fff"
-   stroke-width="0"
-   rx="0"
-   ry="0"
-   id="rect19" />
+  <g class="apexcharts-inner apexcharts-graphical" transform="translate(800 707) scale(3.02526)">
+    <defs>
+      <clipPath id="e">
+        <rect width="333.3" height="185.2" fill="#fff" stroke-width="0" rx="0" ry="0"/>
       </clipPath>
-      <clipPath
-   id="f">
-        <rect
-   width="353.3"
-   height="205.2"
-   x="-10"
-   y="-10"
-   fill="#fff"
-   stroke-width="0"
-   rx="0"
-   ry="0"
-   id="rect20" />
+      <clipPath id="f">
+        <rect width="353.3" height="205.2" x="-10" y="-10" fill="#fff" stroke-width="0" rx="0" ry="0"/>
       </clipPath>
-      <linearGradient
-   id="d"
-   x1="0"
-   x2="0"
-   y1="30.8"
-   y2="264.3"
-   gradientTransform="scale(1.42726 .70064)"
-   gradientUnits="userSpaceOnUse">
-        <stop
-   offset="0"
-   stop-color="rgba(66,99,235,0.65)"
-   stop-opacity=".7"
-   style="stop-color:#4263eb;stop-opacity:.61612219"
-   id="stop20" />
-        <stop
-   offset="1"
-   stop-color="rgba(161,177,245,0.5)"
-   stop-opacity=".5"
-   style="stop-color:#66b4c4;stop-opacity:.02697173"
-   id="stop21" />
-        <stop
-   offset="1"
-   stop-color="rgba(161,177,245,0.5)"
-   stop-opacity=".5"
-   style="stop-color:#bdd4ef;stop-opacity:.06038623"
-   id="stop22" />
+      <linearGradient id="d" x1="0" x2="0" y1="30.8" y2="264.3" gradientTransform="scale(1.42726 .70064)" gradientUnits="userSpaceOnUse">
+        <stop offset="0" stop-color="#4263eb" stop-opacity=".6"/>
+        <stop offset="1" stop-color="#66b4c4" stop-opacity="0"/>
+        <stop offset="1" stop-color="#bdd4ef" stop-opacity=".1"/>
       </linearGradient>
     </defs>
-    <path
-   fill="#b1b9c4"
-   fill-opacity=".9"
-   stroke="#b6b6b6"
-   stroke-dasharray="3"
-   d="M0 0v185"
-   class="apexcharts-xcrosshairs"
-   id="path22" />
-    <path
-   stroke="#e0e0e0"
-   d="M0 185v6"
-   class="apexcharts-xaxis-tick"
-   style="stroke:#7c848d;stroke-opacity:0.254902"
-   id="path23" />
-    <path
-   stroke="#e0e0e0"
-   d="M55 185v6m56-6v6m56-6v6m56-6v6m55-6v6"
-   class="apexcharts-xaxis-tick"
-   id="path24" />
-    <g
-   class="apexcharts-grid"
-   id="g27">
-      <g
-   stroke="#e0e0e0"
-   class="apexcharts-gridlines-horizontal"
-   id="g26">
-        <path
-   d="M0 31h333"
-   class="apexcharts-gridline"
-   style="stroke:#7c848d;stroke-opacity:0.255064"
-   id="path25" />
-        <path
-   d="M0 62h333M0 93h333M0 124h333M0 154h333"
-   class="apexcharts-gridline"
-   style="stroke:#7c848d;stroke-opacity:0.254902"
-   id="path26" />
+    <path fill="#b1b9c4" fill-opacity=".9" stroke="#b6b6b6" stroke-dasharray="3" d="M0 0v185" class="apexcharts-xcrosshairs"/>
+    <path stroke="#7c848d" stroke-opacity=".3" d="M0 185v6" class="apexcharts-xaxis-tick"/>
+    <path stroke="#e0e0e0" d="M55 185v6m56-6v6m56-6v6m56-6v6m55-6v6" class="apexcharts-xaxis-tick"/>
+    <g class="apexcharts-grid">
+      <g stroke="#7c848d" stroke-opacity=".3" class="apexcharts-gridlines-horizontal">
+        <path d="M0 31h333M0 62h333M0 93h333M0 124h333M0 154h333" class="apexcharts-gridline"/>
       </g>
-      <path
-   stroke="transparent"
-   d="M0 185h333M0 1v184"
-   id="path27" />
+      <path stroke="transparent" d="M0 185h333M0 1v184"/>
     </g>
-    <g
-   class="apexcharts-grid-borders"
-   id="g29">
-      <path
-   stroke="#e0e0e0"
-   d="M0 0h333"
-   class="apexcharts-gridline"
-   id="path28"
-   style="stroke:#7c848d;stroke-opacity:0.25490198;opacity:0.42367436" />
-      <use
-   xlink:href="#c"
-   class="apexcharts-gridline"
-   id="use28" />
-      <use
-   xlink:href="#c"
-   style="stroke:#7c848d;stroke-opacity:0.254902"
-   id="use29" />
+    <g class="apexcharts-grid-borders">
+      <path stroke="#7c848d" stroke-opacity=".3" d="M0 0h333" class="apexcharts-gridline" opacity=".4"/>
+      <use xlink:href="#c" class="apexcharts-gridline"/>
+      <use xlink:href="#c" stroke="#7c848d" stroke-opacity=".3"/>
     </g>
-    <g
-   class="apexcharts-area-series apexcharts-plot-series"
-   id="g40">
-      <g
-   data:longestSeries="true"
-   data:realIndex="0"
-   class="apexcharts-series"
-   id="g39">
-        <path
-   fill="url(#d)"
-   d="M0 162c19 0 36-48 55-48s36 36 55 36c20 0 37-73 57-73 19 0 36 54 56 54 19 0 35-109 55-109 19 0 36 81 55 81v82H0Z"
-   class="apexcharts-area"
-   clip-path="url(#e)"
-   style="fill:url(#d)"
-   id="path29" />
-        <path
-   fill="none"
-   stroke="#4263eb"
-   stroke-linecap="round"
-   stroke-width="3"
-   d="M0 162c19 0 36-48 55-48s36 36 55 36c20 0 37-73 57-73 19 0 36 54 56 54 19 0 35-109 55-109 19 0 36 81 55 81"
-   class="apexcharts-area"
-   clip-path="url(#e)"
-   id="path30" />
-        <g
-   data:realIndex="0"
-   class="apexcharts-series-markers-wrap apexcharts-hidden-element-shown"
-   id="g38">
-          <g
-   fill="#4263eb"
-   class="apexcharts-series-markers"
-   clip-path="url(#f)"
-   id="g32">
-            <path
-   d="M-5 162a5 5 0 1 0 10 0 5 5 0 1 0-10 0"
-   class="apexcharts-marker no-pointer-events wizctsd8ch"
-   id="path31" />
-            <path
-   d="M50 114a5 5 0 1 0 10 0 5 5 0 1 0-10 0"
-   class="apexcharts-marker no-pointer-events w5uw23abo"
-   id="path32" />
+    <g class="apexcharts-area-series apexcharts-plot-series">
+      <g data:longestSeries="true" data:realIndex="0" class="apexcharts-series">
+        <path fill="url(#d)" d="M0 162c19 0 36-48 55-48s36 36 55 36c20 0 37-73 57-73 19 0 36 54 56 54 19 0 35-109 55-109 19 0 36 81 55 81v82H0Z" class="apexcharts-area" clip-path="url(#e)"/>
+        <path fill="none" stroke="#4263eb" stroke-linecap="round" stroke-width="3" d="M0 162c19 0 36-48 55-48s36 36 55 36c20 0 37-73 57-73 19 0 36 54 56 54 19 0 35-109 55-109 19 0 36 81 55 81" class="apexcharts-area" clip-path="url(#e)"/>
+        <g data:realIndex="0" class="apexcharts-series-markers-wrap apexcharts-hidden-element-shown">
+          <g fill="#4263eb" class="apexcharts-series-markers" clip-path="url(#f)">
+            <path d="M-5 162a5 5 0 1 0 10 0 5 5 0 1 0-10 0" class="apexcharts-marker no-pointer-events wizctsd8ch"/>
+            <path d="M50 114a5 5 0 1 0 10 0 5 5 0 1 0-10 0" class="apexcharts-marker no-pointer-events w5uw23abo"/>
           </g>
-          <g
-   class="apexcharts-series-markers"
-   clip-path="url(#f)"
-   id="g33">
-            <path
-   fill="#4263eb"
-   d="M105 150a5 5 0 1 0 10 0 5 5 0 1 0-10 0"
-   class="apexcharts-marker no-pointer-events w7vxnyqx2h"
-   id="path33" />
+          <g class="apexcharts-series-markers" clip-path="url(#f)">
+            <path fill="#4263eb" d="M105 150a5 5 0 1 0 10 0 5 5 0 1 0-10 0" class="apexcharts-marker no-pointer-events w7vxnyqx2h"/>
           </g>
-          <g
-   class="apexcharts-series-markers"
-   clip-path="url(#f)"
-   id="g34">
-            <path
-   fill="#4263eb"
-   d="M162 77a5 5 0 1 0 10 0 5 5 0 1 0-10 0"
-   class="apexcharts-marker no-pointer-events wid1srl7bl"
-   id="path34" />
+          <g class="apexcharts-series-markers" clip-path="url(#f)">
+            <path fill="#4263eb" d="M162 77a5 5 0 1 0 10 0 5 5 0 1 0-10 0" class="apexcharts-marker no-pointer-events wid1srl7bl"/>
           </g>
-          <g
-   class="apexcharts-series-markers"
-   clip-path="url(#f)"
-   id="g35">
-            <path
-   fill="#4263eb"
-   d="M218 131a5 5 0 1 0 10 0 5 5 0 1 0-10 0"
-   class="apexcharts-marker no-pointer-events wniqhqn2y"
-   id="path35" />
+          <g class="apexcharts-series-markers" clip-path="url(#f)">
+            <path fill="#4263eb" d="M218 131a5 5 0 1 0 10 0 5 5 0 1 0-10 0" class="apexcharts-marker no-pointer-events wniqhqn2y"/>
           </g>
-          <g
-   class="apexcharts-series-markers"
-   clip-path="url(#f)"
-   id="g36">
-            <path
-   fill="#4263eb"
-   d="M273 22a5 5 0 1 0 10 0 5 5 0 1 0-10 0"
-   class="apexcharts-marker no-pointer-events wtujsnty1"
-   id="path36" />
+          <g class="apexcharts-series-markers" clip-path="url(#f)">
+            <path fill="#4263eb" d="M273 22a5 5 0 1 0 10 0 5 5 0 1 0-10 0" class="apexcharts-marker no-pointer-events wtujsnty1"/>
           </g>
-          <g
-   class="apexcharts-series-markers"
-   clip-path="url(#f)"
-   id="g37">
-            <path
-   fill="#4263eb"
-   d="M328 103a5 5 0 1 0 10 0 5 5 0 1 0-10 0"
-   class="apexcharts-marker no-pointer-events w2tg2g2qi"
-   id="path37" />
+          <g class="apexcharts-series-markers" clip-path="url(#f)">
+            <path fill="#4263eb" d="M328 103a5 5 0 1 0 10 0 5 5 0 1 0-10 0" class="apexcharts-marker no-pointer-events w2tg2g2qi"/>
           </g>
         </g>
       </g>
     </g>
-    
-    
-    <g
-   class="apexcharts-xaxis"
-   id="g47">
-      <g
-   fill="#373d3f"
-   class="apexcharts-xaxis-texts-g"
-   font-family="inherit"
-   font-size="12"
-   text-anchor="middle"
-   id="g46">
-        <text
-   y="213.2"
-   class="apexcharts-text apexcharts-xaxis-label"
-   font-weight="400"
-   style="font-family:mono"
-   transform="translate(0 -4)"
-   id="text41">Jan 25</text>
-        <text
-   x="54.9"
-   y="213.2"
-   class="apexcharts-text apexcharts-xaxis-label"
-   font-weight="400"
-   style="font-family:mono"
-   transform="translate(0 -4)"
-   id="text42">Apr 25</text>
-        <text
-   x="110.5"
-   y="213.2"
-   class="apexcharts-text apexcharts-xaxis-label"
-   font-weight="400"
-   style="font-family:mono"
-   transform="translate(0 -4)"
-   id="text43">Jul 25</text>
-        <text
-   x="166.6"
-   y="213.2"
-   class="apexcharts-text apexcharts-xaxis-label"
-   font-weight="400"
-   style="font-family:mono"
-   transform="translate(0 -4)"
-   id="text44">Oct 25</text>
-        <text
-   x="222.8"
-   y="213.2"
-   class="apexcharts-text apexcharts-xaxis-label"
-   font-weight="600"
-   style="font-family:mono"
-   transform="translate(0 -4)"
-   id="text45">2026</text>
-        <text
-   x="277.7"
-   y="213.2"
-   class="apexcharts-text apexcharts-xaxis-label"
-   font-weight="400"
-   style="font-family:mono"
-   transform="translate(0 -4)"
-   id="text46">Apr 26</text>
+    <g class="apexcharts-xaxis">
+      <g fill="#373d3f" class="apexcharts-xaxis-texts-g" font-family="mono" font-size="12" text-anchor="middle">
+        <text y="213" class="apexcharts-text apexcharts-xaxis-label" font-weight="400" transform="translate(0 -4)">Jan 25</text>
+        <text x="55" y="213" class="apexcharts-text apexcharts-xaxis-label" font-weight="400" transform="translate(0 -4)">Apr 25</text>
+        <text x="111" y="213" class="apexcharts-text apexcharts-xaxis-label" font-weight="400" transform="translate(0 -4)">Jul 25</text>
+        <text x="167" y="213" class="apexcharts-text apexcharts-xaxis-label" font-weight="400" transform="translate(0 -4)">Oct 25</text>
+        <text x="223" y="213" class="apexcharts-text apexcharts-xaxis-label" font-weight="600" transform="translate(0 -4)">2026</text>
+        <text x="278" y="213" class="apexcharts-text apexcharts-xaxis-label" font-weight="400" transform="translate(0 -4)">Apr 26</text>
       </g>
     </g>
   </g>
-  <text
-   xml:space="preserve"
-   x="112.5"
-   y="257.1"
-   style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:64px;font-family:Monospace;-inkscape-font-specification:'Monospace, Normal';text-align:start;writing-mode:lr-tb;direction:ltr;text-anchor:start;fill:#fff;stroke-width:170;font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"
-   id="text64"><tspan
-     x="112.5"
-     y="257.1"
-     style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-family:Monospace;-inkscape-font-specification:'Monospace, Normal';fill:#fff;font-size:64px;font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"
-     id="tspan53"><tspan
-   style="fill:#dca654;fill-opacity:1;-inkscape-font-specification:'Monospace, Normal';font-family:Monospace;font-weight:normal;font-style:normal;font-stretch:normal;font-variant:normal;font-size:64px;font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"
-   id="tspan48">select</tspan> <tspan
-   style="fill:#84c6fa;fill-opacity:1;-inkscape-font-specification:'Monospace, Normal';font-family:Monospace;font-weight:normal;font-style:normal;font-stretch:normal;font-variant:normal;font-size:64px;font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"
-   id="tspan49">'chart'</tspan> <tspan
-   style="fill:#dca654;fill-opacity:1;-inkscape-font-specification:'Monospace, Normal';font-family:Monospace;font-weight:normal;font-style:normal;font-stretch:normal;font-variant:normal;font-size:64px;font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"
-   id="tspan50">as</tspan> <tspan
-   style="fill:#f8f7d9;fill-opacity:1;-inkscape-font-specification:'Monospace, Normal';font-family:Monospace;font-weight:normal;font-style:normal;font-stretch:normal;font-variant:normal;font-size:64px;font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"
-   id="tspan51">component</tspan><tspan
-   style="fill:#5c7580;fill-opacity:1;-inkscape-font-specification:'Monospace, Normal';font-family:Monospace;font-weight:normal;font-style:normal;font-stretch:normal;font-variant:normal;font-size:64px;font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"
-   id="tspan52">;</tspan></tspan><tspan
-     x="112.5"
-     y="417.1"
-     style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-family:Monospace;-inkscape-font-specification:'Monospace, Normal';fill:#dca654;fill-opacity:1;font-size:64px;font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"
-     id="tspan54">select</tspan><tspan
-     x="112.5"
-     y="497.1"
-     style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-family:Monospace;-inkscape-font-specification:'Monospace, Normal';fill:#fff;font-size:64px;font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"
-     id="tspan60">    date <tspan
-   style="fill:#dca654;fill-opacity:1;-inkscape-font-specification:'Monospace, Normal';font-family:Monospace;font-weight:normal;font-style:normal;font-stretch:normal;font-variant:normal;font-size:64px;font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"
-   id="tspan55">as</tspan> <tspan
-   style="fill:#f8f7d9;fill-opacity:1;-inkscape-font-specification:'Monospace, Normal';font-family:Monospace;font-weight:normal;font-style:normal;font-stretch:normal;font-variant:normal;font-size:64px;font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"
-   id="tspan56">x</tspan><tspan
-   style="fill:#5c7580;fill-opacity:1;-inkscape-font-specification:'Monospace, Normal';font-family:Monospace;font-weight:normal;font-style:normal;font-stretch:normal;font-variant:normal;font-size:64px;font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"
-   id="tspan57">,</tspan> revenue <tspan
-   style="fill:#dca654;fill-opacity:1;-inkscape-font-specification:'Monospace, Normal';font-family:Monospace;font-weight:normal;font-style:normal;font-stretch:normal;font-variant:normal;font-size:64px;font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"
-   id="tspan58">as</tspan> <tspan
-   style="fill:#f8f7d9;fill-opacity:1;-inkscape-font-specification:'Monospace, Normal';font-family:Monospace;font-weight:normal;font-style:normal;font-stretch:normal;font-variant:normal;font-size:64px;font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"
-   id="tspan59">y</tspan></tspan><tspan
-     x="112.5"
-     y="577.1"
-     style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-family:Monospace;-inkscape-font-specification:'Monospace, Normal';fill:#fff;font-size:64px;font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"
-     id="tspan63"><tspan
-   style="fill:#dca654;fill-opacity:1;-inkscape-font-specification:'Monospace, Normal';font-family:Monospace;font-weight:normal;font-style:normal;font-stretch:normal;font-variant:normal;font-size:64px;font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"
-   id="tspan61">from</tspan> sales<tspan
-   style="fill:#5c7580;fill-opacity:1;-inkscape-font-specification:'Monospace, Normal';font-family:Monospace;font-weight:normal;font-style:normal;font-stretch:normal;font-variant:normal;font-size:64px;font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"
-   id="tspan62">;</tspan></tspan><tspan
-     x="112.5"
-     y="737.1"
-     style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-family:Monospace;-inkscape-font-specification:'Monospace, Normal';fill:#fff;fill-opacity:0.501082;font-size:64px;font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"
-     id="tspan64">-- The end</tspan></text>
+  <text xml:space="preserve" x="113" y="257" fill="#fff" stroke-width="170" font-family="Monospace" font-size="64" font-weight="400" style="-inkscape-font-specification:'Monospace, Normal';text-align:start;font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"><tspan x="113" y="257" style="-inkscape-font-specification:'Monospace, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"><tspan fill="#dca654" style="-inkscape-font-specification:'Monospace, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal">select</tspan> <tspan fill="#84c6fa" style="-inkscape-font-specification:'Monospace, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal">&apos;chart&apos;</tspan> <tspan fill="#dca654" style="-inkscape-font-specification:'Monospace, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal">as</tspan> <tspan fill="#f8f7d9" style="-inkscape-font-specification:'Monospace, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal">component</tspan><tspan fill="#5c7580" style="-inkscape-font-specification:'Monospace, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal">;</tspan></tspan><tspan x="113" y="417" fill="#dca654" style="-inkscape-font-specification:'Monospace, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal">select</tspan><tspan x="113" y="497" style="-inkscape-font-specification:'Monospace, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal">    date <tspan fill="#dca654" style="-inkscape-font-specification:'Monospace, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal">as</tspan> <tspan fill="#f8f7d9" style="-inkscape-font-specification:'Monospace, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal">x</tspan><tspan fill="#5c7580" style="-inkscape-font-specification:'Monospace, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal">,</tspan> revenue <tspan fill="#dca654" style="-inkscape-font-specification:'Monospace, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal">as</tspan> <tspan fill="#f8f7d9" style="-inkscape-font-specification:'Monospace, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal">y</tspan></tspan><tspan x="113" y="577" style="-inkscape-font-specification:'Monospace, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"><tspan fill="#dca654" style="-inkscape-font-specification:'Monospace, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal">from</tspan> sales<tspan fill="#5c7580" style="-inkscape-font-specification:'Monospace, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal">;</tspan></tspan><tspan x="113" y="737" fill-opacity=".5" style="-inkscape-font-specification:'Monospace, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal">-- The end</tspan></text>
 </svg>