change submission api url for dev and dev url

Reviewed-on: #46

.gitignore

@@ -19,3 +19,5 @@ pnpm-debug.log*
 # macOS-specific files
 .DS_Store
 dist.zip
+
+/public/config.js

info.txt

@@ -0,0 +1 @@
+1. Auto brake line Drag v4 Left & Right Heading.

package.json

@@ -16,8 +16,8 @@
     "astro": "^1.7.2",
     "astro-eslint-parser": "^0.14.0",
     "eslint": "^8.44.0",
-    "flowbite": "^1.7.0",
     "flowbite-typography": "^1.0.3",
+    "html2canvas": "^1.4.1",
     "phaser": "^3.60.0",
     "shiki": "^0.14.3",
     "tailwind-scrollbar": "^3.0.4",

public/assets/bg-star.svg

@@ -0,0 +1,20 @@
+<svg width="121" height="121" viewBox="0 0 121 121" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M20.4126 115.787C19.8985 114.112 21.2639 107.552 21.2639 107.552L27.369 113.403L60.1015 95.9766L92.8969 114.903L99.6269 108.807C99.6269 108.807 100.189 114.133 99.6269 115.787C98.858 118.049 97.4089 118.881 95.4323 119.59C93.7998 120.176 90.0446 119.946 90.0446 119.946L60.1015 102.704C60.1015 102.704 41.6796 112.319 29.8756 119.946C29.8756 119.946 25.9562 120.657 24.1855 119.946C22.2765 119.18 21.0992 118.024 20.4126 115.787Z" fill="url(#paint0_linear_6328_4264)"/>
+<path d="M119.781 43.9461C119.397 42.7568 118.672 41.7068 117.695 40.9269C116.719 40.147 115.534 39.6717 114.29 39.5603L79.6497 36.4147L65.9524 4.35427C64.9421 2.00477 62.642 0.484375 60.0865 0.484375C57.5309 0.484375 55.2306 2.005 54.2208 4.36013L40.5232 36.415L5.87788 39.5603C4.6346 39.6742 3.45208 40.1505 2.47694 40.9301C1.5018 41.7097 0.776923 42.7584 0.392182 43.9461C-0.398019 46.3765 0.331704 49.042 2.25739 50.7223L28.4412 73.6852L20.7201 107.696C20.1552 110.197 21.1256 112.782 23.2007 114.282C24.3157 115.087 25.6207 115.498 26.9365 115.498C28.071 115.498 29.1962 115.192 30.2065 114.587L60.0865 96.729L89.9556 114.587C92.1413 115.902 94.8966 115.782 96.9669 114.282C97.9804 113.548 98.756 112.532 99.197 111.362C99.638 110.191 99.7251 108.916 99.4474 107.696L91.7266 73.6852L117.91 50.727C118.852 49.9043 119.531 48.8231 119.864 47.6175C120.197 46.412 120.168 45.1353 119.781 43.9461Z" fill="#FFD211"/>
+<path d="M0.207031 52.9141V46.6641L28.9254 73.6811L27.955 78.1922L0.207031 52.9141Z" fill="url(#paint1_linear_6328_4264)"/>
+<path d="M120.094 52.9141V46.6641L91.3754 73.6811L92.3458 78.1922L120.094 52.9141Z" fill="url(#paint2_linear_6328_4264)"/>
+<defs>
+<linearGradient id="paint0_linear_6328_4264" x1="60.0299" y1="95.9766" x2="60.0299" y2="120.19" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FD9F02"/>
+<stop offset="1" stop-color="#FDCF03"/>
+</linearGradient>
+<linearGradient id="paint1_linear_6328_4264" x1="14.5662" y1="46.6641" x2="14.5662" y2="78.1922" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FD9F02"/>
+<stop offset="1" stop-color="#FDCF03"/>
+</linearGradient>
+<linearGradient id="paint2_linear_6328_4264" x1="105.735" y1="46.6641" x2="105.735" y2="78.1922" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FD9F02"/>
+<stop offset="1" stop-color="#FDCF03"/>
+</linearGradient>
+</defs>
+</svg>

public/assets/result-star.svg

@@ -0,0 +1,32 @@
+<svg width="129" height="128" viewBox="0 0 129 128" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g filter="url(#filter0_d_8863_7800)">
+<path d="M24.3345 115.303C23.8203 113.627 25.1857 107.067 25.1857 107.067L31.2908 112.919L64.0234 95.4922L96.8188 114.418L103.549 108.323C103.549 108.323 104.111 113.649 103.549 115.303C102.78 117.565 101.331 118.396 99.3542 119.105C97.7216 119.691 93.9665 119.462 93.9665 119.462L64.0234 102.22C64.0234 102.22 45.6015 111.835 33.7975 119.462C33.7975 119.462 29.8781 120.172 28.1074 119.462C26.1984 118.695 25.021 117.539 24.3345 115.303Z" fill="url(#paint0_linear_8863_7800)"/>
+<path d="M123.703 43.4618C123.319 42.2725 122.594 41.2224 121.617 40.4425C120.641 39.6626 119.456 39.1873 118.212 39.0759L83.5716 35.9304L69.8743 3.8699C68.8639 1.52039 66.5639 0 64.0083 0C61.4528 0 59.1525 1.52063 58.1427 3.87576L44.4451 35.9306L9.79975 39.0759C8.55647 39.1898 7.37396 39.6661 6.39881 40.4457C5.42367 41.2253 4.6988 42.274 4.31406 43.4618C3.52386 45.8921 4.25358 48.5576 6.17927 50.2379L32.363 73.2008L24.642 107.212C24.0771 109.712 25.0475 112.297 27.1225 113.797C28.2376 114.603 29.5426 115.013 30.8583 115.013C31.9929 115.013 33.1181 114.707 34.1284 114.103L64.0083 96.2447L93.8775 114.103C96.0632 115.418 98.8184 115.298 100.889 113.797C101.902 113.064 102.678 112.048 103.119 110.877C103.56 109.706 103.647 108.432 103.369 107.212L95.6485 73.2008L121.832 50.2426C122.774 49.4199 123.453 48.3387 123.786 47.1332C124.118 45.9276 124.09 44.651 123.703 43.4618Z" fill="#FFD211"/>
+<path d="M4.12891 52.4297V46.1797L32.8473 73.1967L31.8769 77.7078L4.12891 52.4297Z" fill="url(#paint1_linear_8863_7800)"/>
+<path d="M124.016 52.4297V46.1797L95.2972 73.1967L96.2677 77.7078L124.016 52.4297Z" fill="url(#paint2_linear_8863_7800)"/>
+</g>
+<defs>
+<filter id="filter0_d_8863_7800" x="0" y="0" width="128.016" height="127.781" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="4"/>
+<feGaussianBlur stdDeviation="2"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.15 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_8863_7800"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_8863_7800" result="shape"/>
+</filter>
+<linearGradient id="paint0_linear_8863_7800" x1="63.9518" y1="95.4922" x2="63.9518" y2="119.706" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FD9F02"/>
+<stop offset="1" stop-color="#FDCF03"/>
+</linearGradient>
+<linearGradient id="paint1_linear_8863_7800" x1="18.4881" y1="46.1797" x2="18.4881" y2="77.7078" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FD9F02"/>
+<stop offset="1" stop-color="#FDCF03"/>
+</linearGradient>
+<linearGradient id="paint2_linear_8863_7800" x1="109.656" y1="46.1797" x2="109.656" y2="77.7078" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FD9F02"/>
+<stop offset="1" stop-color="#FDCF03"/>
+</linearGradient>
+</defs>
+</svg>

public/assets/small-letter/bs.svg

@@ -7,92 +7,13 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="bs.svg"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.817661,104.871"
-       orientation="1,0"
-       id="guide51377"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
   <defs
      id="defs2">
     <marker
        style="overflow:visible"
-       id="Arrow2-1"
+       id="Arrow2-1-7"
        refX="0"
        refY="0"
        orient="auto-start-reverse"
@@ -104,11 +25,11 @@
          transform="scale(0.7)"
          d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
          style="fill:context-stroke;fill-rule:evenodd;stroke:none"
-         id="arrow2L-9" />
+         id="arrow2L-9-9" />
     </marker>
     <marker
        style="overflow:visible"
-       id="Arrow2-3-6"
+       id="Arrow2-3-6-2"
        refX="0"
        refY="0"
        orient="auto-start-reverse"
@@ -120,35 +41,35 @@
          transform="scale(0.7)"
          d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
          style="fill:context-stroke;fill-rule:evenodd;stroke:none"
-         id="arrow2L-6-9" />
+         id="arrow2L-6-9-0" />
     </marker>
   </defs>
   <path
-     style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-     d="m 33.925961,62.66356 c -0.03846,-3.805681 0.179081,-49.892837 0.179081,-49.892837"
+     style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7.047;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+     d="m 33.49094,71.100673 c -0.03821,-4.62453 0.177952,-60.628037 0.177952,-60.628037"
      id="path1236-3" />
   <path
-     style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-1);paint-order:stroke fill markers"
-     d="m 33.933962,27.117519 c -0.02456,-2.146424 -0.04485,-10.408377 -0.04485,-10.408377"
+     style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.480829;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-1-7);paint-order:stroke fill markers"
+     d="M 33.846126,34.230178 C 33.821526,32.089494 33.801206,23.84963 33.801206,23.84963"
      id="path1246-3" />
   <g
-     id="g2746"
-     transform="matrix(1.4072602,0,0,1.4072602,-35.010064,-11.673817)"
+     id="g2746-62"
+     transform="matrix(1.409452,0,0,1.4034978,-35.734447,-4.457449)"
      style="display:inline">
     <text
        xml:space="preserve"
        style="font-size:2.7912px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
        x="48.182404"
        y="19.336451"
-       id="text2742"
+       id="text2742-6"
        transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
-         id="tspan2740"
+         id="tspan2740-1"
          style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
          x="48.182404"
          y="19.336451">1</tspan></text>
     <circle
        style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-       id="circle2744"
+       id="circle2744-8"
        cx="-49.550514"
        cy="-16.824097"
        r="1.2760839"
@@ -157,14 +78,14 @@
   <path
      style="display:inline;fill:none;fill-opacity:1;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
      id="path4236-8"
-     d="M 34.600138,56.458062 A 12.639366,13.687705 8.4373572 0 0 48.801897,63.170337 12.639366,13.687705 8.4373572 0 0 58.534998,49.719213 12.639366,13.687705 8.4373572 0 0 48.952634,36.622942 12.639366,13.687705 8.4373572 0 0 34.671678,43.858484" />
+     d="m 33.896172,63.647843 a 13.174543,14.063217 10.380298 0 0 14.809049,6.89365 13.174543,14.063217 10.380298 0 0 10.149305,-13.81459 13.174543,14.063217 10.380298 0 0 -9.992122,-13.450145 13.174543,14.063217 10.380298 0 0 -14.891633,7.431054" />
   <path
-     style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-6);paint-order:stroke fill markers"
-     d="m 50.597819,38.356547 c -3.479672,-2.53512 -6.95274,-2.415059 -9.937039,-0.778814"
+     style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-6-2);paint-order:stroke fill markers"
+     d="m 50.509565,45.367091 c -3.479672,-2.53512 -6.95274,-2.415059 -9.937039,-0.778813"
      id="path13743-5-0" />
   <g
      id="g1244-5"
-     transform="matrix(1.3919656,-0.90209595,0.9428036,1.3318644,-56.751263,80.474842)"
+     transform="matrix(1.3919656,-0.90209595,0.9428036,1.3318644,-56.839517,87.485383)"
      style="display:inline">
     <text
        xml:space="preserve"

public/assets/small-letter/bs_l1.svg

@@ -7,92 +7,13 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="bs.svg"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.817661,104.871"
-       orientation="1,0"
-       id="guide51377"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
   <defs
      id="defs2">
     <marker
        style="overflow:visible"
-       id="Arrow2-1"
+       id="Arrow2-1-7"
        refX="0"
        refY="0"
        orient="auto-start-reverse"
@@ -104,11 +25,11 @@
          transform="scale(0.7)"
          d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
          style="fill:context-stroke;fill-rule:evenodd;stroke:none"
-         id="arrow2L-9" />
+         id="arrow2L-9-9" />
     </marker>
     <marker
        style="overflow:visible"
-       id="Arrow2-3-6"
+       id="Arrow2-3-6-2"
        refX="0"
        refY="0"
        orient="auto-start-reverse"
@@ -120,37 +41,37 @@
          transform="scale(0.7)"
          d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
          style="fill:context-stroke;fill-rule:evenodd;stroke:none"
-         id="arrow2L-6-9" />
+         id="arrow2L-6-9-0" />
     </marker>
   </defs>
   <g
-     id="g56231">
+     id="g2">
     <path
-       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 33.925961,62.66356 c -0.03846,-3.805681 0.179081,-49.892837 0.179081,-49.892837"
+       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7.047;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="m 33.49094,71.100673 c -0.03821,-4.62453 0.177952,-60.628037 0.177952,-60.628037"
        id="path1236-3" />
     <path
-       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-1);paint-order:stroke fill markers"
-       d="m 33.933962,27.117519 c -0.02456,-2.146424 -0.04485,-10.408377 -0.04485,-10.408377"
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.480829;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-1-7);paint-order:stroke fill markers"
+       d="M 33.846126,34.230178 C 33.821526,32.089494 33.801206,23.84963 33.801206,23.84963"
        id="path1246-3" />
     <g
-       id="g2746"
-       transform="matrix(1.4072602,0,0,1.4072602,-35.010064,-11.673817)"
+       id="g2746-62"
+       transform="matrix(1.409452,0,0,1.4034978,-35.734447,-4.457449)"
        style="display:inline">
       <text
          xml:space="preserve"
          style="font-size:2.7912px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
          x="48.182404"
          y="19.336451"
-         id="text2742"
+         id="text2742-6"
          transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
-           id="tspan2740"
+           id="tspan2740-1"
            style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
            x="48.182404"
            y="19.336451">1</tspan></text>
       <circle
          style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-         id="circle2744"
+         id="circle2744-8"
          cx="-49.550514"
          cy="-16.824097"
          r="1.2760839"
@@ -158,19 +79,19 @@
     </g>
   </g>
   <g
-     id="g56281"
+     id="g1"
      style="display:none">
     <path
        style="display:inline;fill:none;fill-opacity:1;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
        id="path4236-8"
-       d="M 34.600138,56.458062 A 12.639366,13.687705 8.4373572 0 0 48.801897,63.170337 12.639366,13.687705 8.4373572 0 0 58.534998,49.719213 12.639366,13.687705 8.4373572 0 0 48.952634,36.622942 12.639366,13.687705 8.4373572 0 0 34.671678,43.858484" />
+       d="m 33.896172,63.647843 a 13.174543,14.063217 10.380298 0 0 14.809049,6.89365 13.174543,14.063217 10.380298 0 0 10.149305,-13.81459 13.174543,14.063217 10.380298 0 0 -9.992122,-13.450145 13.174543,14.063217 10.380298 0 0 -14.891633,7.431054" />
     <path
-       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-6);paint-order:stroke fill markers"
-       d="m 50.597819,38.356547 c -3.479672,-2.53512 -6.95274,-2.415059 -9.937039,-0.778814"
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-6-2);paint-order:stroke fill markers"
+       d="m 50.509565,45.367091 c -3.479672,-2.53512 -6.95274,-2.415059 -9.937039,-0.778813"
        id="path13743-5-0" />
     <g
        id="g1244-5"
-       transform="matrix(1.3919656,-0.90209595,0.9428036,1.3318644,-56.751263,80.474842)"
+       transform="matrix(1.3919656,-0.90209595,0.9428036,1.3318644,-56.839517,87.485383)"
        style="display:inline">
       <text
          xml:space="preserve"

public/assets/small-letter/bs_l2.svg

@@ -7,92 +7,13 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="bs_l1.svg"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.817661,104.871"
-       orientation="1,0"
-       id="guide51377"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
   <defs
      id="defs2">
     <marker
        style="overflow:visible"
-       id="Arrow2-1"
+       id="Arrow2-1-7"
        refX="0"
        refY="0"
        orient="auto-start-reverse"
@@ -104,11 +25,11 @@
          transform="scale(0.7)"
          d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
          style="fill:context-stroke;fill-rule:evenodd;stroke:none"
-         id="arrow2L-9" />
+         id="arrow2L-9-9" />
     </marker>
     <marker
        style="overflow:visible"
-       id="Arrow2-3-6"
+       id="Arrow2-3-6-2"
        refX="0"
        refY="0"
        orient="auto-start-reverse"
@@ -120,38 +41,38 @@
          transform="scale(0.7)"
          d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
          style="fill:context-stroke;fill-rule:evenodd;stroke:none"
-         id="arrow2L-6-9" />
+         id="arrow2L-6-9-0" />
     </marker>
   </defs>
   <g
-     id="g56231"
+     id="g2"
      style="display:none">
     <path
-       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 33.925961,62.66356 c -0.03846,-3.805681 0.179081,-49.892837 0.179081,-49.892837"
+       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7.047;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="m 33.49094,71.100673 c -0.03821,-4.62453 0.177952,-60.628037 0.177952,-60.628037"
        id="path1236-3" />
     <path
-       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-1);paint-order:stroke fill markers"
-       d="m 33.933962,27.117519 c -0.02456,-2.146424 -0.04485,-10.408377 -0.04485,-10.408377"
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.480829;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-1-7);paint-order:stroke fill markers"
+       d="M 33.846126,34.230178 C 33.821526,32.089494 33.801206,23.84963 33.801206,23.84963"
        id="path1246-3" />
     <g
-       id="g2746"
-       transform="matrix(1.4072602,0,0,1.4072602,-35.010064,-11.673817)"
+       id="g2746-62"
+       transform="matrix(1.409452,0,0,1.4034978,-35.734447,-4.457449)"
        style="display:inline">
       <text
          xml:space="preserve"
          style="font-size:2.7912px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
          x="48.182404"
          y="19.336451"
-         id="text2742"
+         id="text2742-6"
          transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
-           id="tspan2740"
+           id="tspan2740-1"
            style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
            x="48.182404"
            y="19.336451">1</tspan></text>
       <circle
          style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-         id="circle2744"
+         id="circle2744-8"
          cx="-49.550514"
          cy="-16.824097"
          r="1.2760839"
@@ -159,19 +80,19 @@
     </g>
   </g>
   <g
-     id="g56281"
+     id="g1"
      style="display:inline">
     <path
        style="display:inline;fill:none;fill-opacity:1;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
        id="path4236-8"
-       d="M 34.600138,56.458062 A 12.639366,13.687705 8.4373572 0 0 48.801897,63.170337 12.639366,13.687705 8.4373572 0 0 58.534998,49.719213 12.639366,13.687705 8.4373572 0 0 48.952634,36.622942 12.639366,13.687705 8.4373572 0 0 34.671678,43.858484" />
+       d="m 33.896172,63.647843 a 13.174543,14.063217 10.380298 0 0 14.809049,6.89365 13.174543,14.063217 10.380298 0 0 10.149305,-13.81459 13.174543,14.063217 10.380298 0 0 -9.992122,-13.450145 13.174543,14.063217 10.380298 0 0 -14.891633,7.431054" />
     <path
-       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-6);paint-order:stroke fill markers"
-       d="m 50.597819,38.356547 c -3.479672,-2.53512 -6.95274,-2.415059 -9.937039,-0.778814"
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-6-2);paint-order:stroke fill markers"
+       d="m 50.509565,45.367091 c -3.479672,-2.53512 -6.95274,-2.415059 -9.937039,-0.778813"
        id="path13743-5-0" />
     <g
        id="g1244-5"
-       transform="matrix(1.3919656,-0.90209595,0.9428036,1.3318644,-56.751263,80.474842)"
+       transform="matrix(1.3919656,-0.90209595,0.9428036,1.3318644,-56.839517,87.485383)"
        style="display:inline">
       <text
          xml:space="preserve"

public/assets/small-letter/ds.svg

@@ -7,90 +7,49 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="cs.svg"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xml:space="preserve"
    xmlns="http://www.w3.org/2000/svg"
-   xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.596984,81.852399"
-       orientation="1,0"
-       id="guide58546"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
-  <defs
-     id="defs2">
-    <marker
+   xmlns:svg="http://www.w3.org/2000/svg"><defs
+     id="defs2"><marker
+       style="overflow:visible"
+       id="Arrow2-36"
+       refX="0"
+       refY="0"
+       orient="auto-start-reverse"
+       markerWidth="7.6999998"
+       markerHeight="5.5999999"
+       viewBox="0 0 7.7 5.6"
+       preserveAspectRatio="xMidYMid"><path
+         transform="scale(0.7)"
+         d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
+         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
+         id="arrow2L-0" /></marker><marker
+       style="overflow:visible"
+       id="Arrow2-3-62"
+       refX="0"
+       refY="0"
+       orient="auto-start-reverse"
+       markerWidth="7.6999998"
+       markerHeight="5.5999999"
+       viewBox="0 0 7.7 5.6"
+       preserveAspectRatio="xMidYMid"><path
+         transform="scale(0.7)"
+         d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
+         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
+         id="arrow2L-6-6" /></marker><marker
+       style="overflow:visible"
+       id="Arrow2-6"
+       refX="0"
+       refY="0"
+       orient="auto-start-reverse"
+       markerWidth="7.6999998"
+       markerHeight="5.5999999"
+       viewBox="0 0 7.7 5.6"
+       preserveAspectRatio="xMidYMid"><path
+         transform="scale(0.7)"
+         d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
+         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
+         id="arrow2L-7" /></marker><marker
        style="overflow:visible"
        id="Arrow2-3"
        refX="0"
@@ -99,99 +58,191 @@
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       preserveAspectRatio="xMidYMid">
-      <path
+       preserveAspectRatio="xMidYMid"><path
          transform="scale(0.7)"
          d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
          style="fill:context-stroke;fill-rule:evenodd;stroke:none"
-         id="arrow2L-6" />
-    </marker>
-    <marker
+         id="arrow2L-6" /></marker><marker
        style="overflow:visible"
-       id="Arrow2-6"
+       id="Arrow2-1"
        refX="0"
        refY="0"
        orient="auto-start-reverse"
-       inkscape:stockid="Arrow2"
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       inkscape:isstock="true"
-       inkscape:collect="always"
-       preserveAspectRatio="xMidYMid">
-      <path
+       preserveAspectRatio="xMidYMid"><path
          transform="scale(0.7)"
          d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
          style="fill:context-stroke;fill-rule:evenodd;stroke:none"
-         id="arrow2L-7" />
-    </marker>
-  </defs>
-  <path
-     style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:6.46094;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-     d="m 66.046726,63.742318 c -0.04959,-4.073392 0.230883,-53.402544 0.230883,-53.402544"
-     id="path1236-9"
-     sodipodi:nodetypes="cc" />
-  <path
-     style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.565155;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
-     d="M 66.380273,26.571294 C 66.348609,24.27388 66.322449,15.430741 66.322449,15.430741"
-     id="path1246-8"
-     sodipodi:nodetypes="cc"
-     inkscape:transform-center-x="0.0088349"
-     inkscape:transform-center-y="5.1277257" />
-  <g
+         id="arrow2L-9" /></marker><marker
+       style="overflow:visible"
+       id="Arrow2-3-6"
+       refX="0"
+       refY="0"
+       orient="auto-start-reverse"
+       markerWidth="7.6999998"
+       markerHeight="5.5999999"
+       viewBox="0 0 7.7 5.6"
+       preserveAspectRatio="xMidYMid"><path
+         transform="scale(0.7)"
+         d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
+         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
+         id="arrow2L-6-9" /></marker></defs><g
+     id="g4"
+     style="display:none"><path
+       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7.047;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="m 75.184854,71.482044 c -0.03647,-4.052143 0.184035,-60.657513 0.184035,-60.657513"
+       id="path1236-1" /><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481786;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36);paint-order:stroke fill markers"
+       d="m 75.254826,31.391094 c -0.02604,-2.031242 -0.04755,-9.849843 -0.04755,-9.849843"
+       id="path1246-8" /><g
        id="g2746"
-     transform="matrix(1.2849761,0,0,1.2223535,3.1447033,-9.2588114)"
-     style="display:inline">
-    <text
+       transform="matrix(1.4909448,0,0,1.3647474,1.9112848,-5.5868929)"
+       style="display:inline"><text
          xml:space="preserve"
          style="font-size:2.7912px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
          x="48.182404"
          y="19.336451"
          id="text2742"
          transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
-         sodipodi:role="line"
            id="tspan2740"
            style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
            x="48.182404"
-         y="19.336451">1</tspan></text>
-    <circle
+           y="19.336451">1</tspan></text><circle
          style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
          id="circle2744"
          cx="-49.550514"
          cy="-16.824097"
          r="1.2760839"
-       transform="rotate(-178.67073)" />
-  </g>
-  <path
-     style="display:inline;fill:none;fill-opacity:1;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
-     id="path57645"
-     d="M 65.607616,56.63065 A 14.04826,13.298772 83.189707 0 1 50.675313,63.676123 14.04826,13.298772 83.189707 0 1 40.454804,49.958726 14.04826,13.298772 83.189707 0 1 50.536389,36.402878 14.04826,13.298772 83.189707 0 1 65.54168,43.686577" />
-  <path
-     style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.354143;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3);paint-order:stroke fill markers"
-     d="m 49.207097,36.810781 c 3.242855,-1.399649 6.109266,-1.095812 8.358098,0.149097"
-     id="path57655" />
-  <g
-     id="g58394"
-     transform="matrix(1.2571663,-0.87051125,0.78952664,1.2406297,-23.391278,79.81556)"
-     style="display:inline">
-    <text
+         transform="rotate(-178.67073)" /></g><g
+       id="g1"
+       style="display:inline"
+       transform="translate(41.504681,0.06850035)"><path
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+         d="m 54.168067,71.384868 c 0.0263,-2.113555 0.09996,-6.93742 -0.146842,-16.538709 C 53.722805,43.23683 39.906985,36.421333 33.766311,54.15169"
+         id="path385" /><path
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.48023;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-62);paint-order:stroke fill markers"
+         d="m 46.26788,44.378094 c -4.559582,0.05579 -7.570594,2.107967 -9.267114,5.026196"
+         id="path1118" /><g
+         id="g1126"
+         transform="matrix(1.1799302,-0.80541095,0.79918818,1.1891176,-45.741712,89.250482)"
+         style="display:inline"><text
            xml:space="preserve"
            style="font-size:2.31549px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
            x="55.705479"
            y="-25.081388"
-       id="text58390"
+           id="text1122"
            transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
-         sodipodi:role="line"
-         id="tspan58388"
+             id="tspan1120"
              style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
              x="55.705479"
-         y="-25.081388">2</tspan></text>
-    <circle
+             y="-25.081388">2</tspan></text><circle
            style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-       id="circle58392"
+           id="circle1124"
            cx="-55.559937"
            cy="27.578447"
            r="1.2760839"
-       transform="rotate(-144.24458)" />
-  </g>
-</svg>
+           transform="rotate(-144.24458)" /></g></g></g><g
+     id="g5"
+     style="display:none"><path
+       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7.047;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="M 7.7385535,71.396922 C 7.70034,66.772391 7.9165054,10.768881 7.9165054,10.768881"
+       id="path1236-3" /><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.480829;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-1);paint-order:stroke fill markers"
+       d="M 8.093739,34.526423 C 8.069141,32.385739 8.048819,24.145875 8.048819,24.145875"
+       id="path1246-3" /><g
+       id="g2746-62"
+       transform="matrix(1.409452,0,0,1.4034978,-61.486834,-4.1612037)"
+       style="display:inline"><text
+         xml:space="preserve"
+         style="font-size:2.7912px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         x="48.182404"
+         y="19.336451"
+         id="text2742-6"
+         transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
+           id="tspan2740-1"
+           style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
+           x="48.182404"
+           y="19.336451">1</tspan></text><circle
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         id="circle2744-8"
+         cx="-49.550514"
+         cy="-16.824097"
+         r="1.2760839"
+         transform="rotate(-178.67073)" /></g><path
+       style="display:inline;fill:none;fill-opacity:1;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
+       id="path4236-8"
+       d="M 8.1437852,63.944087 A 13.174543,14.063217 10.380298 0 0 22.952834,70.837734 13.174543,14.063217 10.380298 0 0 33.102139,57.023148 13.174543,14.063217 10.380298 0 0 23.110017,43.573003 13.174543,14.063217 10.380298 0 0 8.2183837,51.004057" /><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-6);paint-order:stroke fill markers"
+       d="m 24.757178,45.663336 c -3.479672,-2.53512 -6.95274,-2.415059 -9.937039,-0.778813"
+       id="path13743-5-0" /><g
+       id="g1244-5"
+       transform="matrix(1.3919656,-0.90209595,0.9428036,1.3318644,-82.591904,87.781631)"
+       style="display:inline"><text
+         xml:space="preserve"
+         style="font-size:2.31549px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         x="55.705479"
+         y="-25.081388"
+         id="text1240-6"
+         transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
+           id="tspan1238-6"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
+           x="55.705479"
+           y="-25.081388">2</tspan></text><circle
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         id="circle1242-4"
+         cx="-55.559937"
+         cy="27.578447"
+         r="1.2760839"
+         transform="rotate(-144.24458)" /></g></g><g
+     id="g8"><path
+       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
+       id="path57645"
+       d="M 66.345062,63.884771 A 14.04826,13.298772 83.189707 0 1 51.412762,70.930244 14.04826,13.298772 83.189707 0 1 41.192253,57.212847 14.04826,13.298772 83.189707 0 1 51.273838,43.656999 14.04826,13.298772 83.189707 0 1 66.279132,50.940698" /><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.354143;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3);paint-order:stroke fill markers"
+       d="m 49.415379,44.064902 c 3.242855,-1.399649 6.109266,-1.095812 8.358098,0.149097"
+       id="path57655" /><g
+       id="g2"
+       transform="matrix(1.5730821,0,0,1.5086122,-17.02496,17.771258)"
+       style="display:inline"><text
+         xml:space="preserve"
+         style="font-size:2.7912px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         x="48.182404"
+         y="19.336451"
+         id="text2"
+         transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
+           id="tspan2"
+           style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
+           x="48.182404"
+           y="19.336451">1</tspan></text><circle
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         id="circle2"
+         cx="-49.550514"
+         cy="-16.824097"
+         r="1.2760839"
+         transform="rotate(-178.67073)" /></g></g><g
+     id="g7"><path
+       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7.047;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="m 66.268155,71.59369 c -0.0438,-4.654626 0.20379,-61.022576 0.20379,-61.022576"
+       id="path1236-9" /><text
+       xml:space="preserve"
+       style="font-size:3.80784px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.190993;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+       x="63.954109"
+       y="20.842781"
+       id="text3"
+       transform="matrix(1.0219114,-0.00211637,0.00221361,0.97855383,0,0)"><tspan
+         id="tspan3"
+         style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.190993;stroke-dasharray:none;stroke-opacity:1"
+         x="63.954109"
+         y="20.842781">2</tspan></text><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.565155;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
+       d="m 66.588555,33.825415 c -0.03166,-2.297414 -0.05782,-11.140553 -0.05782,-11.140553"
+       id="path1246-8-5" /><ellipse
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#f9f6f6;stroke-width:0.230232;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+       id="circle3"
+       cx="-67.118843"
+       cy="-17.201206"
+       transform="matrix(-0.99962271,-0.02746689,0.02999955,-0.99954991,0,0)"
+       rx="2.1452827"
+       ry="2.0528049" /></g></svg>

public/assets/small-letter/ds_l1.svg

@@ -7,90 +7,49 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="ds_l1.svg"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xml:space="preserve"
    xmlns="http://www.w3.org/2000/svg"
-   xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.596984,81.852399"
-       orientation="1,0"
-       id="guide58546"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
-  <defs
-     id="defs2">
-    <marker
+   xmlns:svg="http://www.w3.org/2000/svg"><defs
+     id="defs2"><marker
+       style="overflow:visible"
+       id="Arrow2-36"
+       refX="0"
+       refY="0"
+       orient="auto-start-reverse"
+       markerWidth="7.6999998"
+       markerHeight="5.5999999"
+       viewBox="0 0 7.7 5.6"
+       preserveAspectRatio="xMidYMid"><path
+         transform="scale(0.7)"
+         d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
+         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
+         id="arrow2L-0" /></marker><marker
+       style="overflow:visible"
+       id="Arrow2-3-62"
+       refX="0"
+       refY="0"
+       orient="auto-start-reverse"
+       markerWidth="7.6999998"
+       markerHeight="5.5999999"
+       viewBox="0 0 7.7 5.6"
+       preserveAspectRatio="xMidYMid"><path
+         transform="scale(0.7)"
+         d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
+         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
+         id="arrow2L-6-6" /></marker><marker
+       style="overflow:visible"
+       id="Arrow2-6"
+       refX="0"
+       refY="0"
+       orient="auto-start-reverse"
+       markerWidth="7.6999998"
+       markerHeight="5.5999999"
+       viewBox="0 0 7.7 5.6"
+       preserveAspectRatio="xMidYMid"><path
+         transform="scale(0.7)"
+         d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
+         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
+         id="arrow2L-7" /></marker><marker
        style="overflow:visible"
        id="Arrow2-3"
        refX="0"
@@ -99,106 +58,192 @@
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       preserveAspectRatio="xMidYMid">
-      <path
+       preserveAspectRatio="xMidYMid"><path
          transform="scale(0.7)"
          d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
          style="fill:context-stroke;fill-rule:evenodd;stroke:none"
-         id="arrow2L-6" />
-    </marker>
-    <marker
+         id="arrow2L-6" /></marker><marker
        style="overflow:visible"
-       id="Arrow2-6"
+       id="Arrow2-1"
        refX="0"
        refY="0"
        orient="auto-start-reverse"
-       inkscape:stockid="Arrow2"
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       inkscape:isstock="true"
-       inkscape:collect="always"
-       preserveAspectRatio="xMidYMid">
-      <path
+       preserveAspectRatio="xMidYMid"><path
          transform="scale(0.7)"
          d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
          style="fill:context-stroke;fill-rule:evenodd;stroke:none"
-         id="arrow2L-7" />
-    </marker>
-  </defs>
-  <g
-     id="g58761">
-    <path
-       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:6.46094;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 66.046726,63.742318 c -0.04959,-4.073392 0.230883,-53.402544 0.230883,-53.402544"
-       id="path1236-9"
-       sodipodi:nodetypes="cc" />
-    <path
-       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.565155;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
-       d="M 66.380273,26.571294 C 66.348609,24.27388 66.322449,15.430741 66.322449,15.430741"
-       id="path1246-8"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="0.0088349"
-       inkscape:transform-center-y="5.1277257" />
-    <g
+         id="arrow2L-9" /></marker><marker
+       style="overflow:visible"
+       id="Arrow2-3-6"
+       refX="0"
+       refY="0"
+       orient="auto-start-reverse"
+       markerWidth="7.6999998"
+       markerHeight="5.5999999"
+       viewBox="0 0 7.7 5.6"
+       preserveAspectRatio="xMidYMid"><path
+         transform="scale(0.7)"
+         d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
+         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
+         id="arrow2L-6-9" /></marker></defs><g
+     id="g4"
+     style="display:none"><path
+       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7.047;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="m 75.184854,71.482044 c -0.03647,-4.052143 0.184035,-60.657513 0.184035,-60.657513"
+       id="path1236-1" /><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481786;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36);paint-order:stroke fill markers"
+       d="m 75.254826,31.391094 c -0.02604,-2.031242 -0.04755,-9.849843 -0.04755,-9.849843"
+       id="path1246-8" /><g
        id="g2746"
-       transform="matrix(1.2849761,0,0,1.2223535,3.1447033,-9.2588114)"
-       style="display:inline">
-      <text
+       transform="matrix(1.4909448,0,0,1.3647474,1.9112848,-5.5868929)"
+       style="display:inline"><text
          xml:space="preserve"
          style="font-size:2.7912px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
          x="48.182404"
          y="19.336451"
          id="text2742"
          transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
-           sodipodi:role="line"
            id="tspan2740"
            style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
            x="48.182404"
-           y="19.336451">1</tspan></text>
-      <circle
+           y="19.336451">1</tspan></text><circle
          style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
          id="circle2744"
          cx="-49.550514"
          cy="-16.824097"
          r="1.2760839"
-         transform="rotate(-178.67073)" />
-    </g>
-  </g>
-  <g
-     id="g58705"
-     style="display:none">
-    <path
-       style="display:inline;fill:none;fill-opacity:1;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
-       id="path57645"
-       d="M 65.607616,56.63065 A 14.04826,13.298772 83.189707 0 1 50.675313,63.676123 14.04826,13.298772 83.189707 0 1 40.454804,49.958726 14.04826,13.298772 83.189707 0 1 50.536389,36.402878 14.04826,13.298772 83.189707 0 1 65.54168,43.686577" />
-    <path
-       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.354143;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3);paint-order:stroke fill markers"
-       d="m 49.207097,36.810781 c 3.242855,-1.399649 6.109266,-1.095812 8.358098,0.149097"
-       id="path57655" />
-    <g
-       id="g58394"
-       transform="matrix(1.2571663,-0.87051125,0.78952664,1.2406297,-23.391278,79.81556)"
-       style="display:inline">
-      <text
+         transform="rotate(-178.67073)" /></g><g
+       id="g1"
+       style="display:inline"
+       transform="translate(41.504681,0.06850035)"><path
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+         d="m 54.168067,71.384868 c 0.0263,-2.113555 0.09996,-6.93742 -0.146842,-16.538709 C 53.722805,43.23683 39.906985,36.421333 33.766311,54.15169"
+         id="path385" /><path
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.48023;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-62);paint-order:stroke fill markers"
+         d="m 46.26788,44.378094 c -4.559582,0.05579 -7.570594,2.107967 -9.267114,5.026196"
+         id="path1118" /><g
+         id="g1126"
+         transform="matrix(1.1799302,-0.80541095,0.79918818,1.1891176,-45.741712,89.250482)"
+         style="display:inline"><text
            xml:space="preserve"
            style="font-size:2.31549px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
            x="55.705479"
            y="-25.081388"
-         id="text58390"
+           id="text1122"
            transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
-           sodipodi:role="line"
-           id="tspan58388"
+             id="tspan1120"
              style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
              x="55.705479"
-           y="-25.081388">2</tspan></text>
-      <circle
+             y="-25.081388">2</tspan></text><circle
            style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-         id="circle58392"
+           id="circle1124"
            cx="-55.559937"
            cy="27.578447"
            r="1.2760839"
-         transform="rotate(-144.24458)" />
-    </g>
-  </g>
-</svg>
+           transform="rotate(-144.24458)" /></g></g></g><g
+     id="g5"
+     style="display:none"><path
+       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7.047;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="M 7.7385535,71.396922 C 7.70034,66.772391 7.9165054,10.768881 7.9165054,10.768881"
+       id="path1236-3" /><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.480829;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-1);paint-order:stroke fill markers"
+       d="M 8.093739,34.526423 C 8.069141,32.385739 8.048819,24.145875 8.048819,24.145875"
+       id="path1246-3" /><g
+       id="g2746-62"
+       transform="matrix(1.409452,0,0,1.4034978,-61.486834,-4.1612037)"
+       style="display:inline"><text
+         xml:space="preserve"
+         style="font-size:2.7912px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         x="48.182404"
+         y="19.336451"
+         id="text2742-6"
+         transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
+           id="tspan2740-1"
+           style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
+           x="48.182404"
+           y="19.336451">1</tspan></text><circle
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         id="circle2744-8"
+         cx="-49.550514"
+         cy="-16.824097"
+         r="1.2760839"
+         transform="rotate(-178.67073)" /></g><path
+       style="display:inline;fill:none;fill-opacity:1;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
+       id="path4236-8"
+       d="M 8.1437852,63.944087 A 13.174543,14.063217 10.380298 0 0 22.952834,70.837734 13.174543,14.063217 10.380298 0 0 33.102139,57.023148 13.174543,14.063217 10.380298 0 0 23.110017,43.573003 13.174543,14.063217 10.380298 0 0 8.2183837,51.004057" /><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-6);paint-order:stroke fill markers"
+       d="m 24.757178,45.663336 c -3.479672,-2.53512 -6.95274,-2.415059 -9.937039,-0.778813"
+       id="path13743-5-0" /><g
+       id="g1244-5"
+       transform="matrix(1.3919656,-0.90209595,0.9428036,1.3318644,-82.591904,87.781631)"
+       style="display:inline"><text
+         xml:space="preserve"
+         style="font-size:2.31549px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         x="55.705479"
+         y="-25.081388"
+         id="text1240-6"
+         transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
+           id="tspan1238-6"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
+           x="55.705479"
+           y="-25.081388">2</tspan></text><circle
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         id="circle1242-4"
+         cx="-55.559937"
+         cy="27.578447"
+         r="1.2760839"
+         transform="rotate(-144.24458)" /></g></g><g
+     id="g8"><path
+       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
+       id="path57645"
+       d="M 66.345062,63.884771 A 14.04826,13.298772 83.189707 0 1 51.412762,70.930244 14.04826,13.298772 83.189707 0 1 41.192253,57.212847 14.04826,13.298772 83.189707 0 1 51.273838,43.656999 14.04826,13.298772 83.189707 0 1 66.279132,50.940698" /><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.354143;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3);paint-order:stroke fill markers"
+       d="m 49.415379,44.064902 c 3.242855,-1.399649 6.109266,-1.095812 8.358098,0.149097"
+       id="path57655" /><g
+       id="g2"
+       transform="matrix(1.5730821,0,0,1.5086122,-17.02496,17.771258)"
+       style="display:inline"><text
+         xml:space="preserve"
+         style="font-size:2.7912px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         x="48.182404"
+         y="19.336451"
+         id="text2"
+         transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
+           id="tspan2"
+           style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
+           x="48.182404"
+           y="19.336451">1</tspan></text><circle
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         id="circle2"
+         cx="-49.550514"
+         cy="-16.824097"
+         r="1.2760839"
+         transform="rotate(-178.67073)" /></g></g><g
+     id="g7"
+     style="display:none"><path
+       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7.047;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="m 66.268155,71.59369 c -0.0438,-4.654626 0.20379,-61.022576 0.20379,-61.022576"
+       id="path1236-9" /><text
+       xml:space="preserve"
+       style="font-size:3.80784px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.190993;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+       x="63.954109"
+       y="20.842781"
+       id="text3"
+       transform="matrix(1.0219114,-0.00211637,0.00221361,0.97855383,0,0)"><tspan
+         id="tspan3"
+         style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.190993;stroke-dasharray:none;stroke-opacity:1"
+         x="63.954109"
+         y="20.842781">2</tspan></text><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.565155;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
+       d="m 66.588555,33.825415 c -0.03166,-2.297414 -0.05782,-11.140553 -0.05782,-11.140553"
+       id="path1246-8-5" /><ellipse
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#f9f6f6;stroke-width:0.230232;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+       id="circle3"
+       cx="-67.118843"
+       cy="-17.201206"
+       transform="matrix(-0.99962271,-0.02746689,0.02999955,-0.99954991,0,0)"
+       rx="2.1452827"
+       ry="2.0528049" /></g></svg>

public/assets/small-letter/ds_l2.svg

@@ -7,90 +7,49 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="ds_l1.svg"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xml:space="preserve"
    xmlns="http://www.w3.org/2000/svg"
-   xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.596984,81.852399"
-       orientation="1,0"
-       id="guide58546"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
-  <defs
-     id="defs2">
-    <marker
+   xmlns:svg="http://www.w3.org/2000/svg"><defs
+     id="defs2"><marker
+       style="overflow:visible"
+       id="Arrow2-36"
+       refX="0"
+       refY="0"
+       orient="auto-start-reverse"
+       markerWidth="7.6999998"
+       markerHeight="5.5999999"
+       viewBox="0 0 7.7 5.6"
+       preserveAspectRatio="xMidYMid"><path
+         transform="scale(0.7)"
+         d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
+         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
+         id="arrow2L-0" /></marker><marker
+       style="overflow:visible"
+       id="Arrow2-3-62"
+       refX="0"
+       refY="0"
+       orient="auto-start-reverse"
+       markerWidth="7.6999998"
+       markerHeight="5.5999999"
+       viewBox="0 0 7.7 5.6"
+       preserveAspectRatio="xMidYMid"><path
+         transform="scale(0.7)"
+         d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
+         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
+         id="arrow2L-6-6" /></marker><marker
+       style="overflow:visible"
+       id="Arrow2-6"
+       refX="0"
+       refY="0"
+       orient="auto-start-reverse"
+       markerWidth="7.6999998"
+       markerHeight="5.5999999"
+       viewBox="0 0 7.7 5.6"
+       preserveAspectRatio="xMidYMid"><path
+         transform="scale(0.7)"
+         d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
+         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
+         id="arrow2L-7" /></marker><marker
        style="overflow:visible"
        id="Arrow2-3"
        refX="0"
@@ -99,107 +58,193 @@
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       preserveAspectRatio="xMidYMid">
-      <path
+       preserveAspectRatio="xMidYMid"><path
          transform="scale(0.7)"
          d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
          style="fill:context-stroke;fill-rule:evenodd;stroke:none"
-         id="arrow2L-6" />
-    </marker>
-    <marker
+         id="arrow2L-6" /></marker><marker
        style="overflow:visible"
-       id="Arrow2-6"
+       id="Arrow2-1"
        refX="0"
        refY="0"
        orient="auto-start-reverse"
-       inkscape:stockid="Arrow2"
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       inkscape:isstock="true"
-       inkscape:collect="always"
-       preserveAspectRatio="xMidYMid">
-      <path
+       preserveAspectRatio="xMidYMid"><path
          transform="scale(0.7)"
          d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
          style="fill:context-stroke;fill-rule:evenodd;stroke:none"
-         id="arrow2L-7" />
-    </marker>
-  </defs>
-  <g
-     id="g58761"
-     style="display:none">
-    <path
-       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:6.46094;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 66.046726,63.742318 c -0.04959,-4.073392 0.230883,-53.402544 0.230883,-53.402544"
-       id="path1236-9"
-       sodipodi:nodetypes="cc" />
-    <path
-       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.565155;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
-       d="M 66.380273,26.571294 C 66.348609,24.27388 66.322449,15.430741 66.322449,15.430741"
-       id="path1246-8"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="0.0088349"
-       inkscape:transform-center-y="5.1277257" />
-    <g
+         id="arrow2L-9" /></marker><marker
+       style="overflow:visible"
+       id="Arrow2-3-6"
+       refX="0"
+       refY="0"
+       orient="auto-start-reverse"
+       markerWidth="7.6999998"
+       markerHeight="5.5999999"
+       viewBox="0 0 7.7 5.6"
+       preserveAspectRatio="xMidYMid"><path
+         transform="scale(0.7)"
+         d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
+         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
+         id="arrow2L-6-9" /></marker></defs><g
+     id="g4"
+     style="display:none"><path
+       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7.047;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="m 75.184854,71.482044 c -0.03647,-4.052143 0.184035,-60.657513 0.184035,-60.657513"
+       id="path1236-1" /><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481786;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36);paint-order:stroke fill markers"
+       d="m 75.254826,31.391094 c -0.02604,-2.031242 -0.04755,-9.849843 -0.04755,-9.849843"
+       id="path1246-8" /><g
        id="g2746"
-       transform="matrix(1.2849761,0,0,1.2223535,3.1447033,-9.2588114)"
-       style="display:inline">
-      <text
+       transform="matrix(1.4909448,0,0,1.3647474,1.9112848,-5.5868929)"
+       style="display:inline"><text
          xml:space="preserve"
          style="font-size:2.7912px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
          x="48.182404"
          y="19.336451"
          id="text2742"
          transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
-           sodipodi:role="line"
            id="tspan2740"
            style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
            x="48.182404"
-           y="19.336451">1</tspan></text>
-      <circle
+           y="19.336451">1</tspan></text><circle
          style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
          id="circle2744"
          cx="-49.550514"
          cy="-16.824097"
          r="1.2760839"
-         transform="rotate(-178.67073)" />
-    </g>
-  </g>
-  <g
-     id="g58705"
-     style="display:inline">
-    <path
-       style="display:inline;fill:none;fill-opacity:1;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
-       id="path57645"
-       d="M 65.607616,56.63065 A 14.04826,13.298772 83.189707 0 1 50.675313,63.676123 14.04826,13.298772 83.189707 0 1 40.454804,49.958726 14.04826,13.298772 83.189707 0 1 50.536389,36.402878 14.04826,13.298772 83.189707 0 1 65.54168,43.686577" />
-    <path
-       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.354143;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3);paint-order:stroke fill markers"
-       d="m 49.207097,36.810781 c 3.242855,-1.399649 6.109266,-1.095812 8.358098,0.149097"
-       id="path57655" />
-    <g
-       id="g58394"
-       transform="matrix(1.2571663,-0.87051125,0.78952664,1.2406297,-23.391278,79.81556)"
-       style="display:inline">
-      <text
+         transform="rotate(-178.67073)" /></g><g
+       id="g1"
+       style="display:inline"
+       transform="translate(41.504681,0.06850035)"><path
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+         d="m 54.168067,71.384868 c 0.0263,-2.113555 0.09996,-6.93742 -0.146842,-16.538709 C 53.722805,43.23683 39.906985,36.421333 33.766311,54.15169"
+         id="path385" /><path
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.48023;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-62);paint-order:stroke fill markers"
+         d="m 46.26788,44.378094 c -4.559582,0.05579 -7.570594,2.107967 -9.267114,5.026196"
+         id="path1118" /><g
+         id="g1126"
+         transform="matrix(1.1799302,-0.80541095,0.79918818,1.1891176,-45.741712,89.250482)"
+         style="display:inline"><text
            xml:space="preserve"
            style="font-size:2.31549px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
            x="55.705479"
            y="-25.081388"
-         id="text58390"
+           id="text1122"
            transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
-           sodipodi:role="line"
-           id="tspan58388"
+             id="tspan1120"
              style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
              x="55.705479"
-           y="-25.081388">2</tspan></text>
-      <circle
+             y="-25.081388">2</tspan></text><circle
            style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-         id="circle58392"
+           id="circle1124"
            cx="-55.559937"
            cy="27.578447"
            r="1.2760839"
-         transform="rotate(-144.24458)" />
-    </g>
-  </g>
-</svg>
+           transform="rotate(-144.24458)" /></g></g></g><g
+     id="g5"
+     style="display:none"><path
+       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7.047;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="M 7.7385535,71.396922 C 7.70034,66.772391 7.9165054,10.768881 7.9165054,10.768881"
+       id="path1236-3" /><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.480829;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-1);paint-order:stroke fill markers"
+       d="M 8.093739,34.526423 C 8.069141,32.385739 8.048819,24.145875 8.048819,24.145875"
+       id="path1246-3" /><g
+       id="g2746-62"
+       transform="matrix(1.409452,0,0,1.4034978,-61.486834,-4.1612037)"
+       style="display:inline"><text
+         xml:space="preserve"
+         style="font-size:2.7912px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         x="48.182404"
+         y="19.336451"
+         id="text2742-6"
+         transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
+           id="tspan2740-1"
+           style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
+           x="48.182404"
+           y="19.336451">1</tspan></text><circle
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         id="circle2744-8"
+         cx="-49.550514"
+         cy="-16.824097"
+         r="1.2760839"
+         transform="rotate(-178.67073)" /></g><path
+       style="display:inline;fill:none;fill-opacity:1;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
+       id="path4236-8"
+       d="M 8.1437852,63.944087 A 13.174543,14.063217 10.380298 0 0 22.952834,70.837734 13.174543,14.063217 10.380298 0 0 33.102139,57.023148 13.174543,14.063217 10.380298 0 0 23.110017,43.573003 13.174543,14.063217 10.380298 0 0 8.2183837,51.004057" /><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-6);paint-order:stroke fill markers"
+       d="m 24.757178,45.663336 c -3.479672,-2.53512 -6.95274,-2.415059 -9.937039,-0.778813"
+       id="path13743-5-0" /><g
+       id="g1244-5"
+       transform="matrix(1.3919656,-0.90209595,0.9428036,1.3318644,-82.591904,87.781631)"
+       style="display:inline"><text
+         xml:space="preserve"
+         style="font-size:2.31549px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         x="55.705479"
+         y="-25.081388"
+         id="text1240-6"
+         transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
+           id="tspan1238-6"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
+           x="55.705479"
+           y="-25.081388">2</tspan></text><circle
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         id="circle1242-4"
+         cx="-55.559937"
+         cy="27.578447"
+         r="1.2760839"
+         transform="rotate(-144.24458)" /></g></g><g
+     id="g8"
+     style="display:none"><path
+       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
+       id="path57645"
+       d="M 66.345062,63.884771 A 14.04826,13.298772 83.189707 0 1 51.412762,70.930244 14.04826,13.298772 83.189707 0 1 41.192253,57.212847 14.04826,13.298772 83.189707 0 1 51.273838,43.656999 14.04826,13.298772 83.189707 0 1 66.279132,50.940698" /><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.354143;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3);paint-order:stroke fill markers"
+       d="m 49.415379,44.064902 c 3.242855,-1.399649 6.109266,-1.095812 8.358098,0.149097"
+       id="path57655" /><g
+       id="g2"
+       transform="matrix(1.5730821,0,0,1.5086122,-17.02496,17.771258)"
+       style="display:inline"><text
+         xml:space="preserve"
+         style="font-size:2.7912px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         x="48.182404"
+         y="19.336451"
+         id="text2"
+         transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
+           id="tspan2"
+           style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
+           x="48.182404"
+           y="19.336451">1</tspan></text><circle
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         id="circle2"
+         cx="-49.550514"
+         cy="-16.824097"
+         r="1.2760839"
+         transform="rotate(-178.67073)" /></g></g><g
+     id="g7"
+     style="display:inline"><path
+       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7.047;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="m 66.268155,71.59369 c -0.0438,-4.654626 0.20379,-61.022576 0.20379,-61.022576"
+       id="path1236-9" /><text
+       xml:space="preserve"
+       style="font-size:3.80784px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.190993;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+       x="63.954109"
+       y="20.842781"
+       id="text3"
+       transform="matrix(1.0219114,-0.00211637,0.00221361,0.97855383,0,0)"><tspan
+         id="tspan3"
+         style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.190993;stroke-dasharray:none;stroke-opacity:1"
+         x="63.954109"
+         y="20.842781">2</tspan></text><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.565155;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
+       d="m 66.588555,33.825415 c -0.03166,-2.297414 -0.05782,-11.140553 -0.05782,-11.140553"
+       id="path1246-8-5" /><ellipse
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#f9f6f6;stroke-width:0.230232;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+       id="circle3"
+       cx="-67.118843"
+       cy="-17.201206"
+       transform="matrix(-0.99962271,-0.02746689,0.02999955,-0.99954991,0,0)"
+       rx="2.1452827"
+       ry="2.0528049" /></g></svg>

public/assets/small-letter/es.svg

@@ -7,7 +7,7 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
+   sodipodi:docname="es.svg"
    inkscape:export-filename="ds_l2.svg"
    inkscape:export-xdpi="96"
    inkscape:export-ydpi="96"
@@ -159,7 +159,7 @@
      id="path1236-1" />
   <g
      id="g1244-4"
-     transform="matrix(1.1016092,-0.64486304,0.74614002,0.95208289,-6.1635281,72.543754)"
+     transform="matrix(1.1016092,-0.64486304,0.74614002,0.95208289,-28.786873,73.145439)"
      style="display:inline">
     <text
        xml:space="preserve"
@@ -182,6 +182,6 @@
   </g>
   <path
      style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.37715;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-7);paint-order:stroke fill markers"
-     d="m 54.779931,44.658047 c 1.974412,-0.0072 9.573823,0.01486 9.573823,0.01486"
+     d="M 56.028776,45.18763 C 54.054458,45.16698 46.456114,45.037749 46.456114,45.037749"
      id="path1246-7" />
 </svg>

public/assets/small-letter/es_l1.svg

@@ -7,87 +7,8 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="es.svg"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.596984,81.852399"
-       orientation="1,0"
-       id="guide58546"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
   <defs
      id="defs2">
     <marker
@@ -123,6 +44,8 @@
          id="arrow2L-61" />
     </marker>
   </defs>
+  <g
+     id="g2">
     <path
        style="fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
        id="path4236-3"
@@ -153,8 +76,9 @@
        style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.37715;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-60);paint-order:stroke fill markers"
        d="m 54.294694,35.212851 c 3.917178,-0.127434 6.38033,1.239312 7.660073,3.277869"
        id="path13743-5-9" />
+  </g>
   <g
-     id="g61662"
+     id="g1"
      style="display:none">
     <path
        style="display:inline;fill:#b16c57;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
@@ -162,7 +86,7 @@
        id="path1236-1" />
     <g
        id="g1244-4"
-       transform="matrix(1.1016092,-0.64486304,0.74614002,0.95208289,-6.1635281,72.543754)"
+       transform="matrix(1.1016092,-0.64486304,0.74614002,0.95208289,-28.786873,73.145439)"
        style="display:inline">
       <text
          xml:space="preserve"
@@ -185,7 +109,7 @@
     </g>
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.37715;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-7);paint-order:stroke fill markers"
-       d="m 54.779931,44.658047 c 1.974412,-0.0072 9.573823,0.01486 9.573823,0.01486"
+       d="M 56.028776,45.18763 C 54.054458,45.16698 46.456114,45.037749 46.456114,45.037749"
        id="path1246-7" />
   </g>
 </svg>

public/assets/small-letter/es_l2.svg

@@ -7,87 +7,8 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="es_l1.svg"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.596984,81.852399"
-       orientation="1,0"
-       id="guide58546"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
   <defs
      id="defs2">
     <marker
@@ -124,7 +45,7 @@
     </marker>
   </defs>
   <g
-     id="g61882"
+     id="g2"
      style="display:none">
     <path
        style="fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
@@ -158,7 +79,7 @@
        id="path13743-5-9" />
   </g>
   <g
-     id="g61662"
+     id="g1"
      style="display:inline">
     <path
        style="display:inline;fill:#b16c57;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
@@ -166,7 +87,7 @@
        id="path1236-1" />
     <g
        id="g1244-4"
-       transform="matrix(1.1016092,-0.64486304,0.74614002,0.95208289,-6.1635281,72.543754)"
+       transform="matrix(1.1016092,-0.64486304,0.74614002,0.95208289,-28.786873,73.145439)"
        style="display:inline">
       <text
          xml:space="preserve"
@@ -189,7 +110,7 @@
     </g>
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.37715;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-7);paint-order:stroke fill markers"
-       d="m 54.779931,44.658047 c 1.974412,-0.0072 9.573823,0.01486 9.573823,0.01486"
+       d="M 56.028776,45.18763 C 54.054458,45.16698 46.456114,45.037749 46.456114,45.037749"
        id="path1246-7" />
   </g>
 </svg>

public/assets/small-letter/fs.svg

@@ -7,87 +7,8 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="es_l2.svg"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.596984,81.852399"
-       orientation="1,0"
-       id="guide58546"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
   <defs
      id="defs2">
     <marker
@@ -123,10 +44,15 @@
          id="arrow2L-6-8" />
     </marker>
   </defs>
+  <g
+     id="g4">
+    <g
+       id="g2">
       <path
          style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
          d="M 40.987557,89.148649 C 40.880435,87.700565 40.760964,58.387914 40.819142,45.235628 40.881098,31.228446 60.900498,32.941912 59.37793,46.216072"
          id="path1236-7" />
+    </g>
     <g
        id="g2746"
        transform="matrix(1.353893,0,0,1.3502686,-6.9726516,20.293638)"
@@ -150,13 +76,20 @@
          r="1.2760839"
          transform="rotate(-178.67073)" />
     </g>
+    <path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.430285;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-5);paint-order:stroke fill markers"
+       d="m 51.741347,36.394533 c 3.846292,0.268023 6.157268,2.347049 7.259149,5.181348"
+       id="path13743-5-4" />
+  </g>
+  <g
+     id="g3">
     <path
        style="display:inline;fill:#b16c57;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
        d="m 47.275855,59.874526 c -1.084812,0.124987 -14.223247,0.279337 -14.223247,0.279337"
        id="path1236-9" />
     <g
        id="g1244-0"
-     transform="matrix(0.89961144,-0.60769192,0.60932315,0.89720307,-11.897872,86.152612)"
+       transform="matrix(0.89961144,-0.60769192,0.60932315,0.89720307,-26.338305,86.272949)"
        style="display:inline">
       <text
          xml:space="preserve"
@@ -179,10 +112,7 @@
     </g>
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.430285;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
-     d="m 35.778518,59.825204 c 1.922394,-0.0095 9.321594,0.01986 9.321594,0.01986"
+       d="m 44.720865,59.777257 c -1.922132,0.03315 -9.321133,0.09483 -9.321133,0.09483"
        id="path1246-1" />
-  <path
-     style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.430285;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-5);paint-order:stroke fill markers"
-     d="m 51.741347,36.394533 c 3.846292,0.268023 6.157268,2.347049 7.259149,5.181348"
-     id="path13743-5-4" />
+  </g>
 </svg>

public/assets/small-letter/fs_l1.svg

@@ -7,8 +7,8 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="fs.svg.2023_10_04_14_53_13.0.svg"
-   inkscape:export-filename="fs_l2.svg"
+   sodipodi:docname="fs.svg"
+   inkscape:export-filename="..\Desktop\LATTER\fs_l2.svg"
    inkscape:export-xdpi="96"
    inkscape:export-ydpi="96"
    xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
@@ -124,40 +124,7 @@
     </marker>
   </defs>
   <g
-     id="g380">
-    <g
-       id="g440"
-       style="display:inline">
-      <path
-         style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-         d="M 40.987557,89.148649 C 40.880435,87.700565 40.760964,58.387914 40.819142,45.235628 40.881098,31.228446 60.900498,32.941912 59.37793,46.216072"
-         id="path1236-7" />
-      <text
-         xml:space="preserve"
-         style="font-size:3.77392px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.189291;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-         x="58.02462"
-         y="46.403316"
-         id="text2742"
-         transform="matrix(1.0009199,-0.00766023,0.0076868,0.9990221,0,0)"><tspan
-           id="tspan2740"
-           style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.189291;stroke-dasharray:none;stroke-opacity:1"
-           x="58.02462"
-           y="46.403316">1</tspan></text>
-      <ellipse
-         style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.189291;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-         id="circle2744"
-         cx="-60.587273"
-         cy="-43.166607"
-         transform="matrix(-0.99973233,-0.02313599,0.02326029,-0.99972944,0,0)"
-         rx="1.7276787"
-         ry="1.7230586" />
-      <path
-         style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.430285;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-5);paint-order:stroke fill markers"
-         d="m 51.741347,36.394533 c 3.846292,0.268023 6.157268,2.347049 7.259149,5.181348"
-         id="path13743-5-4" />
-    </g>
-    <g
-       id="g306"
+     id="g1"
      style="display:none">
     <path
        style="display:inline;fill:#b16c57;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
@@ -165,7 +132,7 @@
        id="path1236-9" />
     <g
        id="g1244-0"
-         transform="matrix(0.89961144,-0.60769192,0.60932315,0.89720307,-11.897872,86.152612)"
+       transform="matrix(0.89961144,-0.60769192,0.60932315,0.89720307,-26.338305,86.272949)"
        style="display:inline">
       <text
          xml:space="preserve"
@@ -188,8 +155,48 @@
     </g>
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.430285;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
-         d="m 35.778518,59.825204 c 1.922394,-0.0095 9.321594,0.01986 9.321594,0.01986"
+       d="m 44.720865,59.777257 c -1.922132,0.03315 -9.321133,0.09483 -9.321133,0.09483"
        id="path1246-1" />
   </g>
+  <g
+     id="g3"
+     style="display:inline">
+    <g
+       id="g2">
+      <path
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+         d="M 40.987557,89.148649 C 40.880435,87.700565 40.760964,58.387914 40.819142,45.235628 40.881098,31.228446 60.900498,32.941912 59.37793,46.216072"
+         id="path1236-7"
+         inkscape:export-filename="path1236-7.png"
+         inkscape:export-xdpi="96"
+         inkscape:export-ydpi="96" />
+    </g>
+    <g
+       id="g2746"
+       transform="matrix(1.353893,0,0,1.3502686,-6.9726516,20.293638)"
+       style="display:inline">
+      <text
+         xml:space="preserve"
+         style="font-size:2.7912px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         x="48.182404"
+         y="19.336451"
+         id="text2742"
+         transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
+           id="tspan2740"
+           style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
+           x="48.182404"
+           y="19.336451">1</tspan></text>
+      <circle
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         id="circle2744"
+         cx="-49.550514"
+         cy="-16.824097"
+         r="1.2760839"
+         transform="rotate(-178.67073)" />
+    </g>
+    <path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.430285;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-5);paint-order:stroke fill markers"
+       d="m 51.741347,36.394533 c 3.846292,0.268023 6.157268,2.347049 7.259149,5.181348"
+       id="path13743-5-4" />
   </g>
 </svg>

public/assets/small-letter/fs_l2.svg

@@ -7,8 +7,8 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="fs.svg.2023_10_04_14_53_13.0.svg"
-   inkscape:export-filename="es_l2.svg"
+   sodipodi:docname="fs.svg"
+   inkscape:export-filename="..\Desktop\LATTER\es.svg"
    inkscape:export-xdpi="96"
    inkscape:export-ydpi="96"
    xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
@@ -124,40 +124,7 @@
     </marker>
   </defs>
   <g
-     id="g380">
-    <g
-       id="g440"
-       style="display:none">
-      <path
-         style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-         d="M 40.987557,89.148649 C 40.880435,87.700565 40.760964,58.387914 40.819142,45.235628 40.881098,31.228446 60.900498,32.941912 59.37793,46.216072"
-         id="path1236-7" />
-      <text
-         xml:space="preserve"
-         style="font-size:3.77392px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.189291;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-         x="58.02462"
-         y="46.403316"
-         id="text2742"
-         transform="matrix(1.0009199,-0.00766023,0.0076868,0.9990221,0,0)"><tspan
-           id="tspan2740"
-           style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.189291;stroke-dasharray:none;stroke-opacity:1"
-           x="58.02462"
-           y="46.403316">1</tspan></text>
-      <ellipse
-         style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.189291;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-         id="circle2744"
-         cx="-60.587273"
-         cy="-43.166607"
-         transform="matrix(-0.99973233,-0.02313599,0.02326029,-0.99972944,0,0)"
-         rx="1.7276787"
-         ry="1.7230586" />
-      <path
-         style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.430285;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-5);paint-order:stroke fill markers"
-         d="m 51.741347,36.394533 c 3.846292,0.268023 6.157268,2.347049 7.259149,5.181348"
-         id="path13743-5-4" />
-    </g>
-    <g
-       id="g306"
+     id="g1"
      style="display:inline">
     <path
        style="display:inline;fill:#b16c57;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
@@ -165,7 +132,7 @@
        id="path1236-9" />
     <g
        id="g1244-0"
-         transform="matrix(0.89961144,-0.60769192,0.60932315,0.89720307,-11.897872,86.152612)"
+       transform="matrix(0.89961144,-0.60769192,0.60932315,0.89720307,-26.338305,86.272949)"
        style="display:inline">
       <text
          xml:space="preserve"
@@ -188,8 +155,48 @@
     </g>
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.430285;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
-         d="m 35.778518,59.825204 c 1.922394,-0.0095 9.321594,0.01986 9.321594,0.01986"
+       d="m 44.720865,59.777257 c -1.922132,0.03315 -9.321133,0.09483 -9.321133,0.09483"
        id="path1246-1" />
   </g>
+  <g
+     id="g3"
+     style="display:none">
+    <g
+       id="g2">
+      <path
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+         d="M 40.987557,89.148649 C 40.880435,87.700565 40.760964,58.387914 40.819142,45.235628 40.881098,31.228446 60.900498,32.941912 59.37793,46.216072"
+         id="path1236-7"
+         inkscape:export-filename="path1236-7.png"
+         inkscape:export-xdpi="96"
+         inkscape:export-ydpi="96" />
+    </g>
+    <g
+       id="g2746"
+       transform="matrix(1.353893,0,0,1.3502686,-6.9726516,20.293638)"
+       style="display:inline">
+      <text
+         xml:space="preserve"
+         style="font-size:2.7912px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         x="48.182404"
+         y="19.336451"
+         id="text2742"
+         transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
+           id="tspan2740"
+           style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
+           x="48.182404"
+           y="19.336451">1</tspan></text>
+      <circle
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         id="circle2744"
+         cx="-49.550514"
+         cy="-16.824097"
+         r="1.2760839"
+         transform="rotate(-178.67073)" />
+    </g>
+    <path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.430285;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-5);paint-order:stroke fill markers"
+       d="m 51.741347,36.394533 c 3.846292,0.268023 6.157268,2.347049 7.259149,5.181348"
+       id="path13743-5-4" />
   </g>
 </svg>

public/assets/small-letter/hs.svg

@@ -7,87 +7,8 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="hs_l2.png"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.817661,104.871"
-       orientation="1,0"
-       id="guide51377"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
   <defs
      id="defs2">
     <marker
@@ -96,12 +17,9 @@
        refX="0"
        refY="0"
        orient="auto-start-reverse"
-       inkscape:stockid="Arrow2"
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       inkscape:isstock="true"
-       inkscape:collect="always"
        preserveAspectRatio="xMidYMid">
       <path
          transform="scale(0.7)"
@@ -115,12 +33,9 @@
        refX="0"
        refY="0"
        orient="auto-start-reverse"
-       inkscape:stockid="Arrow2"
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       inkscape:isstock="true"
-       inkscape:collect="always"
        preserveAspectRatio="xMidYMid">
       <path
          transform="scale(0.7)"
@@ -129,21 +44,20 @@
          id="arrow2L-6-6" />
     </marker>
   </defs>
+  <g
+     id="g2"
+     style="display:inline">
     <path
-     style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-     d="m 33.545293,63.643729 c -0.04107,-3.551071 0.207234,-53.15685 0.207234,-53.15685"
-     id="path1236-1"
-     sodipodi:nodetypes="cc" />
+       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7.02239;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="M 33.679525,71.437205 C 33.642787,67.441756 33.86489,11.628361 33.86489,11.628361"
+       id="path1236-1" />
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.48013;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36);paint-order:stroke fill markers"
-     d="M 33.62642,24.102526 C 33.60019,22.099703 33.57853,14.390494 33.57853,14.390494"
-     id="path1246-8"
-     sodipodi:nodetypes="cc"
-     inkscape:transform-center-x="0.0094338882"
-     inkscape:transform-center-y="4.7846689" />
+       d="m 33.750003,31.907174 c -0.02623,-2.002823 -0.04789,-9.712032 -0.04789,-9.712032"
+       id="path1246-8" />
     <g
        id="g2746"
-     transform="matrix(1.5017246,0,0,1.345653,-40.24741,-12.358096)"
+       transform="matrix(1.5017246,0,0,1.345653,-40.123827,-4.5534477)"
        style="display:inline">
       <text
          xml:space="preserve"
@@ -152,7 +66,6 @@
          y="19.336451"
          id="text2742"
          transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
-         sodipodi:role="line"
            id="tspan2740"
            style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
            x="48.182404"
@@ -165,21 +78,21 @@
          r="1.2760839"
          transform="rotate(-178.67073)" />
     </g>
+  </g>
+  <g
+     id="g1"
+     style="display:inline">
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-     d="m 54.044484,63.58022 c 0.0263,-2.113555 0.09996,-6.93742 -0.146842,-16.538709 -0.29842,-11.609329 -14.11424,-18.424826 -20.254914,-0.694469"
-     id="path385"
-     sodipodi:nodetypes="csc" />
+       d="m 54.168067,71.384868 c 0.0263,-2.113555 0.09996,-6.93742 -0.146842,-16.538709 C 53.722805,43.23683 39.906985,36.421333 33.766311,54.15169"
+       id="path385" />
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.48023;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-62);paint-order:stroke fill markers"
-     d="m 46.144297,36.573446 c -4.559582,0.05579 -7.570594,2.107967 -9.267114,5.026196"
-     id="path1118"
-     sodipodi:nodetypes="cc"
-     inkscape:transform-center-x="-4.9534769"
-     inkscape:transform-center-y="-2.6843876" />
+       d="m 46.26788,44.378094 c -4.559582,0.05579 -7.570594,2.107967 -9.267114,5.026196"
+       id="path1118" />
     <g
        id="g1126"
-     transform="matrix(1.1799302,-0.80541095,0.79918818,1.1891176,-45.865295,81.445834)"
+       transform="matrix(1.1799302,-0.80541095,0.79918818,1.1891176,-45.741712,89.250482)"
        style="display:inline">
       <text
          xml:space="preserve"
@@ -188,7 +101,6 @@
          y="-25.081388"
          id="text1122"
          transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
-         sodipodi:role="line"
            id="tspan1120"
            style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
            x="55.705479"
@@ -201,4 +113,5 @@
          r="1.2760839"
          transform="rotate(-144.24458)" />
     </g>
+  </g>
 </svg>

public/assets/small-letter/hs__l1.svg

@@ -0,0 +1,117 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="100mm"
+   height="100mm"
+   viewBox="0 0 100 100"
+   version="1.1"
+   id="svg5"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs2">
+    <marker
+       style="overflow:visible"
+       id="Arrow2-36"
+       refX="0"
+       refY="0"
+       orient="auto-start-reverse"
+       markerWidth="7.6999998"
+       markerHeight="5.5999999"
+       viewBox="0 0 7.7 5.6"
+       preserveAspectRatio="xMidYMid">
+      <path
+         transform="scale(0.7)"
+         d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
+         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
+         id="arrow2L-0" />
+    </marker>
+    <marker
+       style="overflow:visible"
+       id="Arrow2-3-62"
+       refX="0"
+       refY="0"
+       orient="auto-start-reverse"
+       markerWidth="7.6999998"
+       markerHeight="5.5999999"
+       viewBox="0 0 7.7 5.6"
+       preserveAspectRatio="xMidYMid">
+      <path
+         transform="scale(0.7)"
+         d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
+         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
+         id="arrow2L-6-6" />
+    </marker>
+  </defs>
+  <g
+     id="g2"
+     style="display:inline">
+    <path
+       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7.0233;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="M 33.556375,63.632101 C 33.519816,59.616326 33.740851,3.5189636 33.740851,3.5189636"
+       id="path1236-1" />
+    <path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.48013;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36);paint-order:stroke fill markers"
+       d="m 33.867094,19.650059 c -0.02623,-2.002823 -0.04789,-9.7120319 -0.04789,-9.7120319"
+       id="path1246-8" />
+    <g
+       id="g2746"
+       transform="matrix(1.4967131,0,0,1.5298001,-39.880775,-20.721196)"
+       style="display:inline">
+      <text
+         xml:space="preserve"
+         style="font-size:2.7912px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         x="48.182404"
+         y="19.336451"
+         id="text2742"
+         transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
+           id="tspan2740"
+           style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
+           x="48.182404"
+           y="19.336451">1</tspan></text>
+      <circle
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         id="circle2744"
+         cx="-49.550514"
+         cy="-16.824097"
+         r="1.2760839"
+         transform="rotate(-178.67073)" />
+    </g>
+  </g>
+  <g
+     id="g1"
+     style="display:none">
+    <path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="m 54.044484,63.58022 c 0.0263,-2.113555 0.09996,-6.93742 -0.146842,-16.538709 -0.29842,-11.609329 -14.11424,-18.424826 -20.254914,-0.694469"
+       id="path385" />
+    <path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.48023;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-62);paint-order:stroke fill markers"
+       d="m 46.144297,36.573446 c -4.559582,0.05579 -7.570594,2.107967 -9.267114,5.026196"
+       id="path1118" />
+    <g
+       id="g1126"
+       transform="matrix(1.1799302,-0.80541095,0.79918818,1.1891176,-45.865295,81.445834)"
+       style="display:inline">
+      <text
+         xml:space="preserve"
+         style="font-size:2.31549px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         x="55.705479"
+         y="-25.081388"
+         id="text1122"
+         transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
+           id="tspan1120"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
+           x="55.705479"
+           y="-25.081388">2</tspan></text>
+      <circle
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         id="circle1124"
+         cx="-55.559937"
+         cy="27.578447"
+         r="1.2760839"
+         transform="rotate(-144.24458)" />
+    </g>
+  </g>
+</svg>

public/assets/small-letter/hs__l2.svg

@@ -0,0 +1,117 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="100mm"
+   height="100mm"
+   viewBox="0 0 100 100"
+   version="1.1"
+   id="svg5"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs2">
+    <marker
+       style="overflow:visible"
+       id="Arrow2-36"
+       refX="0"
+       refY="0"
+       orient="auto-start-reverse"
+       markerWidth="7.6999998"
+       markerHeight="5.5999999"
+       viewBox="0 0 7.7 5.6"
+       preserveAspectRatio="xMidYMid">
+      <path
+         transform="scale(0.7)"
+         d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
+         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
+         id="arrow2L-0" />
+    </marker>
+    <marker
+       style="overflow:visible"
+       id="Arrow2-3-62"
+       refX="0"
+       refY="0"
+       orient="auto-start-reverse"
+       markerWidth="7.6999998"
+       markerHeight="5.5999999"
+       viewBox="0 0 7.7 5.6"
+       preserveAspectRatio="xMidYMid">
+      <path
+         transform="scale(0.7)"
+         d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
+         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
+         id="arrow2L-6-6" />
+    </marker>
+  </defs>
+  <g
+     id="g2"
+     style="display:none">
+    <path
+       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7.0233;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="M 33.556375,63.632101 C 33.519816,59.616326 33.740851,3.5189636 33.740851,3.5189636"
+       id="path1236-1" />
+    <path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.48013;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36);paint-order:stroke fill markers"
+       d="m 33.867094,19.650059 c -0.02623,-2.002823 -0.04789,-9.7120319 -0.04789,-9.7120319"
+       id="path1246-8" />
+    <g
+       id="g2746"
+       transform="matrix(1.4967131,0,0,1.5298001,-39.880775,-20.721196)"
+       style="display:inline">
+      <text
+         xml:space="preserve"
+         style="font-size:2.7912px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         x="48.182404"
+         y="19.336451"
+         id="text2742"
+         transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
+           id="tspan2740"
+           style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
+           x="48.182404"
+           y="19.336451">1</tspan></text>
+      <circle
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         id="circle2744"
+         cx="-49.550514"
+         cy="-16.824097"
+         r="1.2760839"
+         transform="rotate(-178.67073)" />
+    </g>
+  </g>
+  <g
+     id="g1"
+     style="display:inline">
+    <path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="m 54.044484,63.58022 c 0.0263,-2.113555 0.09996,-6.93742 -0.146842,-16.538709 -0.29842,-11.609329 -14.11424,-18.424826 -20.254914,-0.694469"
+       id="path385" />
+    <path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.48023;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-62);paint-order:stroke fill markers"
+       d="m 46.144297,36.573446 c -4.559582,0.05579 -7.570594,2.107967 -9.267114,5.026196"
+       id="path1118" />
+    <g
+       id="g1126"
+       transform="matrix(1.1799302,-0.80541095,0.79918818,1.1891176,-45.865295,81.445834)"
+       style="display:inline">
+      <text
+         xml:space="preserve"
+         style="font-size:2.31549px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         x="55.705479"
+         y="-25.081388"
+         id="text1122"
+         transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
+           id="tspan1120"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
+           x="55.705479"
+           y="-25.081388">2</tspan></text>
+      <circle
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         id="circle1124"
+         cx="-55.559937"
+         cy="27.578447"
+         r="1.2760839"
+         transform="rotate(-144.24458)" />
+    </g>
+  </g>
+</svg>

public/assets/small-letter/hs_l1.svg

@@ -7,87 +7,8 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="hs.svg"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.817661,104.871"
-       orientation="1,0"
-       id="guide51377"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
   <defs
      id="defs2">
     <marker
@@ -96,12 +17,9 @@
        refX="0"
        refY="0"
        orient="auto-start-reverse"
-       inkscape:stockid="Arrow2"
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       inkscape:isstock="true"
-       inkscape:collect="always"
        preserveAspectRatio="xMidYMid">
       <path
          transform="scale(0.7)"
@@ -115,12 +33,9 @@
        refX="0"
        refY="0"
        orient="auto-start-reverse"
-       inkscape:stockid="Arrow2"
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       inkscape:isstock="true"
-       inkscape:collect="always"
        preserveAspectRatio="xMidYMid">
       <path
          transform="scale(0.7)"
@@ -130,23 +45,18 @@
     </marker>
   </defs>
   <g
-     id="g1851"
-     style="display:inline">
+     id="g2">
     <path
-       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 33.545293,63.643729 c -0.04107,-3.551071 0.207234,-53.15685 0.207234,-53.15685"
-       id="path1236-1"
-       sodipodi:nodetypes="cc" />
+       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7.02239;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="M 33.679525,71.437205 C 33.642787,67.441756 33.86489,11.628361 33.86489,11.628361"
+       id="path1236-1" />
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.48013;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36);paint-order:stroke fill markers"
-       d="M 33.62642,24.102526 C 33.60019,22.099703 33.57853,14.390494 33.57853,14.390494"
-       id="path1246-8"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="0.0094338882"
-       inkscape:transform-center-y="4.7846689" />
+       d="m 33.750003,31.907174 c -0.02623,-2.002823 -0.04789,-9.712032 -0.04789,-9.712032"
+       id="path1246-8" />
     <g
        id="g2746"
-       transform="matrix(1.5017246,0,0,1.345653,-40.24741,-12.358096)"
+       transform="matrix(1.5017246,0,0,1.345653,-40.123827,-4.5534477)"
        style="display:inline">
       <text
          xml:space="preserve"
@@ -155,7 +65,6 @@
          y="19.336451"
          id="text2742"
          transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
-           sodipodi:role="line"
            id="tspan2740"
            style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
            x="48.182404"
@@ -170,23 +79,19 @@
     </g>
   </g>
   <g
-     id="g1807"
+     id="g1"
      style="display:none">
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 54.044484,63.58022 c 0.0263,-2.113555 0.09996,-6.93742 -0.146842,-16.538709 -0.29842,-11.609329 -14.11424,-18.424826 -20.254914,-0.694469"
-       id="path385"
-       sodipodi:nodetypes="csc" />
+       d="m 54.168067,71.384868 c 0.0263,-2.113555 0.09996,-6.93742 -0.146842,-16.538709 C 53.722805,43.23683 39.906985,36.421333 33.766311,54.15169"
+       id="path385" />
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.48023;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-62);paint-order:stroke fill markers"
-       d="m 46.144297,36.573446 c -4.559582,0.05579 -7.570594,2.107967 -9.267114,5.026196"
-       id="path1118"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="-4.9534769"
-       inkscape:transform-center-y="-2.6843876" />
+       d="m 46.26788,44.378094 c -4.559582,0.05579 -7.570594,2.107967 -9.267114,5.026196"
+       id="path1118" />
     <g
        id="g1126"
-       transform="matrix(1.1799302,-0.80541095,0.79918818,1.1891176,-45.865295,81.445834)"
+       transform="matrix(1.1799302,-0.80541095,0.79918818,1.1891176,-45.741712,89.250482)"
        style="display:inline">
       <text
          xml:space="preserve"
@@ -195,7 +100,6 @@
          y="-25.081388"
          id="text1122"
          transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
-           sodipodi:role="line"
            id="tspan1120"
            style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
            x="55.705479"

public/assets/small-letter/hs_l2.svg

@@ -7,87 +7,8 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="hs_l1.svg"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.817661,104.871"
-       orientation="1,0"
-       id="guide51377"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
   <defs
      id="defs2">
     <marker
@@ -96,12 +17,9 @@
        refX="0"
        refY="0"
        orient="auto-start-reverse"
-       inkscape:stockid="Arrow2"
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       inkscape:isstock="true"
-       inkscape:collect="always"
        preserveAspectRatio="xMidYMid">
       <path
          transform="scale(0.7)"
@@ -115,12 +33,9 @@
        refX="0"
        refY="0"
        orient="auto-start-reverse"
-       inkscape:stockid="Arrow2"
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       inkscape:isstock="true"
-       inkscape:collect="always"
        preserveAspectRatio="xMidYMid">
       <path
          transform="scale(0.7)"
@@ -130,23 +45,19 @@
     </marker>
   </defs>
   <g
-     id="g1851"
+     id="g2"
      style="display:none">
     <path
-       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 33.545293,63.643729 c -0.04107,-3.551071 0.207234,-53.15685 0.207234,-53.15685"
-       id="path1236-1"
-       sodipodi:nodetypes="cc" />
+       style="display:inline;fill:#009e40;fill-opacity:1;fill-rule:nonzero;stroke:#009e40;stroke-width:7.02239;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="M 33.679525,71.437205 C 33.642787,67.441756 33.86489,11.628361 33.86489,11.628361"
+       id="path1236-1" />
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.48013;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36);paint-order:stroke fill markers"
-       d="M 33.62642,24.102526 C 33.60019,22.099703 33.57853,14.390494 33.57853,14.390494"
-       id="path1246-8"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="0.0094338882"
-       inkscape:transform-center-y="4.7846689" />
+       d="m 33.750003,31.907174 c -0.02623,-2.002823 -0.04789,-9.712032 -0.04789,-9.712032"
+       id="path1246-8" />
     <g
        id="g2746"
-       transform="matrix(1.5017246,0,0,1.345653,-40.24741,-12.358096)"
+       transform="matrix(1.5017246,0,0,1.345653,-40.123827,-4.5534477)"
        style="display:inline">
       <text
          xml:space="preserve"
@@ -155,7 +66,6 @@
          y="19.336451"
          id="text2742"
          transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
-           sodipodi:role="line"
            id="tspan2740"
            style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
            x="48.182404"
@@ -170,23 +80,19 @@
     </g>
   </g>
   <g
-     id="g1807"
+     id="g1"
      style="display:inline">
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 54.044484,63.58022 c 0.0263,-2.113555 0.09996,-6.93742 -0.146842,-16.538709 -0.29842,-11.609329 -14.11424,-18.424826 -20.254914,-0.694469"
-       id="path385"
-       sodipodi:nodetypes="csc" />
+       d="m 54.168067,71.384868 c 0.0263,-2.113555 0.09996,-6.93742 -0.146842,-16.538709 C 53.722805,43.23683 39.906985,36.421333 33.766311,54.15169"
+       id="path385" />
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.48023;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-62);paint-order:stroke fill markers"
-       d="m 46.144297,36.573446 c -4.559582,0.05579 -7.570594,2.107967 -9.267114,5.026196"
-       id="path1118"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="-4.9534769"
-       inkscape:transform-center-y="-2.6843876" />
+       d="m 46.26788,44.378094 c -4.559582,0.05579 -7.570594,2.107967 -9.267114,5.026196"
+       id="path1118" />
     <g
        id="g1126"
-       transform="matrix(1.1799302,-0.80541095,0.79918818,1.1891176,-45.865295,81.445834)"
+       transform="matrix(1.1799302,-0.80541095,0.79918818,1.1891176,-45.741712,89.250482)"
        style="display:inline">
       <text
          xml:space="preserve"
@@ -195,7 +101,6 @@
          y="-25.081388"
          id="text1122"
          transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
-           sodipodi:role="line"
            id="tspan1120"
            style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
            x="55.705479"

public/assets/small-letter/ks.svg

@@ -7,214 +7,106 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="js_l2.svg"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xml:space="preserve"
    xmlns="http://www.w3.org/2000/svg"
-   xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.817661,104.871"
-       orientation="1,0"
-       id="guide51377"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
-  <defs
-     id="defs2">
-    <marker
+   xmlns:svg="http://www.w3.org/2000/svg"><defs
+     id="defs2"><linearGradient
+       id="swatch6"><stop
+         style="stop-color:#808080;stop-opacity:1;"
+         offset="0"
+         id="stop6" /></linearGradient><marker
        style="overflow:visible"
-       id="Arrow2-36"
+       id="Arrow2-36-3"
        refX="0"
        refY="0"
        orient="auto-start-reverse"
-       inkscape:stockid="Arrow2"
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       inkscape:isstock="true"
-       inkscape:collect="always"
-       preserveAspectRatio="xMidYMid">
-      <path
+       preserveAspectRatio="xMidYMid"><path
          transform="scale(0.7)"
          d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
          style="fill:context-stroke;fill-rule:evenodd;stroke:none"
-         id="arrow2L-0" />
-    </marker>
-  </defs>
-  <path
-     style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-     d="m 33.921393,11.147309 c -0.314864,-0.910336 -0.124404,53.44247 -0.124404,53.44247"
-     id="path127"
-     sodipodi:nodetypes="cc" />
-  <g
-     id="g4983"
-     transform="matrix(1.3106705,0,0,1.3612996,-10.525636,-3.5362715)"
-     style="display:inline">
-    <text
+         id="arrow2L-0-6" /></marker></defs><g
+     id="g9"
+     style="display:inline"><path
+       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7.023;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="M 33.897256,10.914479 C 33.616971,9.8851391 33.786514,71.343218 33.786514,71.343218"
+       id="path127-7" /><g
+       id="g4983-5"
+       transform="matrix(1.5341872,0,0,1.4840821,-18.065036,-1.352247)"
+       style="display:inline"><text
          xml:space="preserve"
          style="font-size:2.7912px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
          x="32.887978"
          y="12.794106"
-       id="text9342"
+         id="text9342-3"
          transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
-         sodipodi:role="line"
-         id="tspan9340"
+           id="tspan9340-5"
            style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
            x="32.887978"
-         y="12.794106">1</tspan></text>
-    <circle
+           y="12.794106">1</tspan></text><circle
          style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-       id="path9448"
+         id="path9448-6"
          cx="-34.067326"
          cy="-10.754245"
          transform="rotate(-178.67073)"
-       r="1.2760839" />
-  </g>
-  <path
-     style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36);paint-order:stroke fill markers"
-     d="m 33.887502,25.269364 c -0.01675,-2.146498 -0.007,-10.408471 -0.007,-10.408471"
-     id="path13743"
-     sodipodi:nodetypes="cc" />
-  <path
+         r="1.2760839" /></g><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36-3);paint-order:stroke fill markers"
+       d="m 33.859011,29.420135 c -0.01675,-2.146498 -0.007,-10.408471 -0.007,-10.408471"
+       id="path13743-2" /></g><g
+     id="g10"
+     style="display:inline"><path
        style="display:inline;fill:#b16c57;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-     d="M 53.121566,28.128633 C 52.980692,28.306461 34.558514,54.770101 34.558514,54.770101"
-     id="path15674"
-     sodipodi:nodetypes="cc" />
-  <g
-     id="g21551"
-     transform="matrix(1.0709125,-0.77569872,0.72534851,1.1452501,-18.674442,63.55512)"
-     style="display:inline">
-    <text
+       d="M 58.816429,43.133531 C 56.694269,44.70809 37.161399,59.276133 35.853105,60.460409"
+       id="path15674-9" /><g
+       id="g21551-1"
+       transform="matrix(1.0493551,-0.80462172,0.75631798,1.1250384,-11.344737,78.798908)"
+       style="display:inline"><text
          xml:space="preserve"
          style="font-size:2.31549px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
          x="54.113926"
          y="-23.497944"
-       id="text15678"
+         id="text15678-2"
          transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
-         sodipodi:role="line"
-         id="tspan15676"
+           id="tspan15676-7"
            style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
            x="54.113926"
-         y="-23.497944">2</tspan></text>
-    <circle
+           y="-23.497944">2</tspan></text><circle
          style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-       id="circle15680"
+         id="circle15680-0"
          cx="-54.018658"
          cy="25.946033"
          r="1.2760839"
-       transform="rotate(-144.24458)" />
-  </g>
-  <path
-     style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36);paint-order:stroke fill markers"
-     d="m 44.081818,40.087032 c 1.269428,-1.730977 6.21501,-8.34923 6.21501,-8.34923"
-     id="path15682"
-     sodipodi:nodetypes="cc"
-     inkscape:transform-center-x="3.0865939"
-     inkscape:transform-center-y="4.0947028" />
-  <path
-     style="display:inline;fill:#000000;fill-opacity:1;stroke:#de0029;stroke-width:6.90976;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-     d="M 40.051918,47.333345 55.451943,64.62565"
-     id="path1108"
-     sodipodi:nodetypes="cc" />
-  <path
-     style="display:inline;fill:#fffcfc;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.452017;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36);paint-order:normal"
-     d="M 48.935982,58.682648 43.108673,51.653571"
-     id="path9576"
-     sodipodi:nodetypes="cc"
-     inkscape:transform-center-x="-2.7683077"
-     inkscape:transform-center-y="3.9580734" />
-  <g
-     id="g21538"
-     transform="matrix(1.2270494,0,0,1.2270494,-30.897128,-43.158996)"
-     style="display:inline">
-    <ellipse
+         transform="rotate(-144.24458)" /></g><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.411819;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36-3);paint-order:stroke fill markers"
+       d="m 48.976421,50.160424 c 1.491381,-1.085308 7.26986,-5.212171 7.26986,-5.212171"
+       id="path15682-9" /></g><g
+     id="g11"
+     style="display:inline"><path
+       style="display:inline;fill:#000000;fill-opacity:1;stroke:#de0029;stroke-width:6.88793;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="M 44.011809,54.273077 59.185821,71.265479"
+       id="path1108-3" /><path
+       style="display:inline;fill:#fffcfc;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.452017;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36-3);paint-order:normal"
+       d="M 53.607403,65.037959 47.429246,58.315175"
+       id="path9576-6" /><g
+       id="g21538-0"
+       transform="matrix(1.2270494,0,0,1.2270494,-27.438185,-36.914981)"
+       style="display:inline"><ellipse
          style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.131538;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal"
-       id="circle9582"
+         id="circle9582-6"
          cx="-74.661598"
          cy="60.70055"
          transform="matrix(0.01839222,-0.99983085,0.99981223,0.0193779,0,0)"
          rx="1.2146922"
-       ry="1.1834064" />
-    <text
+         ry="1.1834064" /><text
          xml:space="preserve"
          style="font-size:2.14253px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.131537;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal"
          x="59.531094"
          y="75.579971"
-       id="text9714"
+         id="text9714-2"
          transform="scale(0.98702867,1.0131418)"><tspan
-         sodipodi:role="line"
-         id="tspan9712"
+           id="tspan9712-6"
            style="stroke:#f9f6f6;stroke-width:0.131537;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
            x="59.531094"
-         y="75.579971">3</tspan></text>
-  </g>
-</svg>
+           y="75.579971">3</tspan></text></g></g></svg>

public/assets/small-letter/ks_l1.svg

@@ -7,225 +7,106 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="ks.svg"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xml:space="preserve"
    xmlns="http://www.w3.org/2000/svg"
-   xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.817661,104.871"
-       orientation="1,0"
-       id="guide51377"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
-  <defs
-     id="defs2">
-    <marker
+   xmlns:svg="http://www.w3.org/2000/svg"><defs
+     id="defs2"><linearGradient
+       id="swatch6"><stop
+         style="stop-color:#808080;stop-opacity:1;"
+         offset="0"
+         id="stop6" /></linearGradient><marker
        style="overflow:visible"
-       id="Arrow2-36"
+       id="Arrow2-36-3"
        refX="0"
        refY="0"
        orient="auto-start-reverse"
-       inkscape:stockid="Arrow2"
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       inkscape:isstock="true"
-       inkscape:collect="always"
-       preserveAspectRatio="xMidYMid">
-      <path
+       preserveAspectRatio="xMidYMid"><path
          transform="scale(0.7)"
          d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
          style="fill:context-stroke;fill-rule:evenodd;stroke:none"
-         id="arrow2L-0" />
-    </marker>
-  </defs>
-  <g
-     id="g5482">
-    <path
-       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 33.921393,11.147309 c -0.314864,-0.910336 -0.124404,53.44247 -0.124404,53.44247"
-       id="path127"
-       sodipodi:nodetypes="cc" />
-    <g
-       id="g4983"
-       transform="matrix(1.3106705,0,0,1.3612996,-10.525636,-3.5362715)"
-       style="display:inline">
-      <text
+         id="arrow2L-0-6" /></marker></defs><g
+     id="g9"
+     style="display:inline"><path
+       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7.023;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="M 33.897256,10.914479 C 33.616971,9.8851391 33.786514,71.343218 33.786514,71.343218"
+       id="path127-7" /><g
+       id="g4983-5"
+       transform="matrix(1.5341872,0,0,1.4840821,-18.065036,-1.352247)"
+       style="display:inline"><text
          xml:space="preserve"
          style="font-size:2.7912px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
          x="32.887978"
          y="12.794106"
-         id="text9342"
+         id="text9342-3"
          transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
-           sodipodi:role="line"
-           id="tspan9340"
+           id="tspan9340-5"
            style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
            x="32.887978"
-           y="12.794106">1</tspan></text>
-      <circle
+           y="12.794106">1</tspan></text><circle
          style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-         id="path9448"
+         id="path9448-6"
          cx="-34.067326"
          cy="-10.754245"
          transform="rotate(-178.67073)"
-         r="1.2760839" />
-    </g>
-    <path
-       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36);paint-order:stroke fill markers"
-       d="m 33.887502,25.269364 c -0.01675,-2.146498 -0.007,-10.408471 -0.007,-10.408471"
-       id="path13743"
-       sodipodi:nodetypes="cc" />
-  </g>
-  <g
-     id="g5444"
-     style="display:none">
-    <path
+         r="1.2760839" /></g><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36-3);paint-order:stroke fill markers"
+       d="m 33.859011,29.420135 c -0.01675,-2.146498 -0.007,-10.408471 -0.007,-10.408471"
+       id="path13743-2" /></g><g
+     id="g10"
+     style="display:none"><path
        style="display:inline;fill:#b16c57;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="M 53.121566,28.128633 C 52.980692,28.306461 34.558514,54.770101 34.558514,54.770101"
-       id="path15674"
-       sodipodi:nodetypes="cc" />
-    <g
-       id="g21551"
-       transform="matrix(1.0709125,-0.77569872,0.72534851,1.1452501,-18.674442,63.55512)"
-       style="display:inline">
-      <text
+       d="M 58.816429,43.133531 C 56.694269,44.70809 37.161399,59.276133 35.853105,60.460409"
+       id="path15674-9" /><g
+       id="g21551-1"
+       transform="matrix(1.0493551,-0.80462172,0.75631798,1.1250384,-11.344737,78.798908)"
+       style="display:inline"><text
          xml:space="preserve"
          style="font-size:2.31549px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
          x="54.113926"
          y="-23.497944"
-         id="text15678"
+         id="text15678-2"
          transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
-           sodipodi:role="line"
-           id="tspan15676"
+           id="tspan15676-7"
            style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
            x="54.113926"
-           y="-23.497944">2</tspan></text>
-      <circle
+           y="-23.497944">2</tspan></text><circle
          style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-         id="circle15680"
+         id="circle15680-0"
          cx="-54.018658"
          cy="25.946033"
          r="1.2760839"
-         transform="rotate(-144.24458)" />
-    </g>
-    <path
-       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36);paint-order:stroke fill markers"
-       d="m 44.081818,40.087032 c 1.269428,-1.730977 6.21501,-8.34923 6.21501,-8.34923"
-       id="path15682"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="3.0865939"
-       inkscape:transform-center-y="4.0947028" />
-  </g>
-  <g
-     id="g5406"
-     style="display:none">
-    <path
-       style="display:inline;fill:#000000;fill-opacity:1;stroke:#de0029;stroke-width:6.90976;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="M 40.051918,47.333345 55.451943,64.62565"
-       id="path1108"
-       sodipodi:nodetypes="cc" />
-    <path
-       style="display:inline;fill:#fffcfc;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.452017;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36);paint-order:normal"
-       d="M 48.935982,58.682648 43.108673,51.653571"
-       id="path9576"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="-2.7683077"
-       inkscape:transform-center-y="3.9580734" />
-    <g
-       id="g21538"
-       transform="matrix(1.2270494,0,0,1.2270494,-30.897128,-43.158996)"
-       style="display:inline">
-      <ellipse
+         transform="rotate(-144.24458)" /></g><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.411819;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36-3);paint-order:stroke fill markers"
+       d="m 48.976421,50.160424 c 1.491381,-1.085308 7.26986,-5.212171 7.26986,-5.212171"
+       id="path15682-9" /></g><g
+     id="g11"
+     style="display:none"><path
+       style="display:inline;fill:#000000;fill-opacity:1;stroke:#de0029;stroke-width:6.88793;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="M 44.011809,54.273077 59.185821,71.265479"
+       id="path1108-3" /><path
+       style="display:inline;fill:#fffcfc;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.452017;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36-3);paint-order:normal"
+       d="M 53.607403,65.037959 47.429246,58.315175"
+       id="path9576-6" /><g
+       id="g21538-0"
+       transform="matrix(1.2270494,0,0,1.2270494,-27.438185,-36.914981)"
+       style="display:inline"><ellipse
          style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.131538;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal"
-         id="circle9582"
+         id="circle9582-6"
          cx="-74.661598"
          cy="60.70055"
          transform="matrix(0.01839222,-0.99983085,0.99981223,0.0193779,0,0)"
          rx="1.2146922"
-         ry="1.1834064" />
-      <text
+         ry="1.1834064" /><text
          xml:space="preserve"
          style="font-size:2.14253px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.131537;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal"
          x="59.531094"
          y="75.579971"
-         id="text9714"
+         id="text9714-2"
          transform="scale(0.98702867,1.0131418)"><tspan
-           sodipodi:role="line"
-           id="tspan9712"
+           id="tspan9712-6"
            style="stroke:#f9f6f6;stroke-width:0.131537;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
            x="59.531094"
-           y="75.579971">3</tspan></text>
-    </g>
-  </g>
-</svg>
+           y="75.579971">3</tspan></text></g></g></svg>

public/assets/small-letter/ks_l2.svg

@@ -7,226 +7,106 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="ks_l1.svg"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xml:space="preserve"
    xmlns="http://www.w3.org/2000/svg"
-   xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.817661,104.871"
-       orientation="1,0"
-       id="guide51377"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
-  <defs
-     id="defs2">
-    <marker
+   xmlns:svg="http://www.w3.org/2000/svg"><defs
+     id="defs2"><linearGradient
+       id="swatch6"><stop
+         style="stop-color:#808080;stop-opacity:1;"
+         offset="0"
+         id="stop6" /></linearGradient><marker
        style="overflow:visible"
-       id="Arrow2-36"
+       id="Arrow2-36-3"
        refX="0"
        refY="0"
        orient="auto-start-reverse"
-       inkscape:stockid="Arrow2"
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       inkscape:isstock="true"
-       inkscape:collect="always"
-       preserveAspectRatio="xMidYMid">
-      <path
+       preserveAspectRatio="xMidYMid"><path
          transform="scale(0.7)"
          d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
          style="fill:context-stroke;fill-rule:evenodd;stroke:none"
-         id="arrow2L-0" />
-    </marker>
-  </defs>
-  <g
-     id="g5482"
-     style="display:none">
-    <path
-       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 33.921393,11.147309 c -0.314864,-0.910336 -0.124404,53.44247 -0.124404,53.44247"
-       id="path127"
-       sodipodi:nodetypes="cc" />
-    <g
-       id="g4983"
-       transform="matrix(1.3106705,0,0,1.3612996,-10.525636,-3.5362715)"
-       style="display:inline">
-      <text
+         id="arrow2L-0-6" /></marker></defs><g
+     id="g9"
+     style="display:none"><path
+       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7.023;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="M 33.897256,10.914479 C 33.616971,9.8851391 33.786514,71.343218 33.786514,71.343218"
+       id="path127-7" /><g
+       id="g4983-5"
+       transform="matrix(1.5341872,0,0,1.4840821,-18.065036,-1.352247)"
+       style="display:inline"><text
          xml:space="preserve"
          style="font-size:2.7912px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
          x="32.887978"
          y="12.794106"
-         id="text9342"
+         id="text9342-3"
          transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
-           sodipodi:role="line"
-           id="tspan9340"
+           id="tspan9340-5"
            style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
            x="32.887978"
-           y="12.794106">1</tspan></text>
-      <circle
+           y="12.794106">1</tspan></text><circle
          style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-         id="path9448"
+         id="path9448-6"
          cx="-34.067326"
          cy="-10.754245"
          transform="rotate(-178.67073)"
-         r="1.2760839" />
-    </g>
-    <path
-       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36);paint-order:stroke fill markers"
-       d="m 33.887502,25.269364 c -0.01675,-2.146498 -0.007,-10.408471 -0.007,-10.408471"
-       id="path13743"
-       sodipodi:nodetypes="cc" />
-  </g>
-  <g
-     id="g5444"
-     style="display:inline">
-    <path
+         r="1.2760839" /></g><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36-3);paint-order:stroke fill markers"
+       d="m 33.859011,29.420135 c -0.01675,-2.146498 -0.007,-10.408471 -0.007,-10.408471"
+       id="path13743-2" /></g><g
+     id="g10"
+     style="display:inline"><path
        style="display:inline;fill:#b16c57;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="M 53.121566,28.128633 C 52.980692,28.306461 34.558514,54.770101 34.558514,54.770101"
-       id="path15674"
-       sodipodi:nodetypes="cc" />
-    <g
-       id="g21551"
-       transform="matrix(1.0709125,-0.77569872,0.72534851,1.1452501,-18.674442,63.55512)"
-       style="display:inline">
-      <text
+       d="M 58.816429,43.133531 C 56.694269,44.70809 37.161399,59.276133 35.853105,60.460409"
+       id="path15674-9" /><g
+       id="g21551-1"
+       transform="matrix(1.0493551,-0.80462172,0.75631798,1.1250384,-11.344737,78.798908)"
+       style="display:inline"><text
          xml:space="preserve"
          style="font-size:2.31549px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
          x="54.113926"
          y="-23.497944"
-         id="text15678"
+         id="text15678-2"
          transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
-           sodipodi:role="line"
-           id="tspan15676"
+           id="tspan15676-7"
            style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
            x="54.113926"
-           y="-23.497944">2</tspan></text>
-      <circle
+           y="-23.497944">2</tspan></text><circle
          style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-         id="circle15680"
+         id="circle15680-0"
          cx="-54.018658"
          cy="25.946033"
          r="1.2760839"
-         transform="rotate(-144.24458)" />
-    </g>
-    <path
-       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36);paint-order:stroke fill markers"
-       d="m 44.081818,40.087032 c 1.269428,-1.730977 6.21501,-8.34923 6.21501,-8.34923"
-       id="path15682"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="3.0865939"
-       inkscape:transform-center-y="4.0947028" />
-  </g>
-  <g
-     id="g5406"
-     style="display:none">
-    <path
-       style="display:inline;fill:#000000;fill-opacity:1;stroke:#de0029;stroke-width:6.90976;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="M 40.051918,47.333345 55.451943,64.62565"
-       id="path1108"
-       sodipodi:nodetypes="cc" />
-    <path
-       style="display:inline;fill:#fffcfc;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.452017;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36);paint-order:normal"
-       d="M 48.935982,58.682648 43.108673,51.653571"
-       id="path9576"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="-2.7683077"
-       inkscape:transform-center-y="3.9580734" />
-    <g
-       id="g21538"
-       transform="matrix(1.2270494,0,0,1.2270494,-30.897128,-43.158996)"
-       style="display:inline">
-      <ellipse
+         transform="rotate(-144.24458)" /></g><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.411819;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36-3);paint-order:stroke fill markers"
+       d="m 48.976421,50.160424 c 1.491381,-1.085308 7.26986,-5.212171 7.26986,-5.212171"
+       id="path15682-9" /></g><g
+     id="g11"
+     style="display:none"><path
+       style="display:inline;fill:#000000;fill-opacity:1;stroke:#de0029;stroke-width:6.88793;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="M 44.011809,54.273077 59.185821,71.265479"
+       id="path1108-3" /><path
+       style="display:inline;fill:#fffcfc;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.452017;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36-3);paint-order:normal"
+       d="M 53.607403,65.037959 47.429246,58.315175"
+       id="path9576-6" /><g
+       id="g21538-0"
+       transform="matrix(1.2270494,0,0,1.2270494,-27.438185,-36.914981)"
+       style="display:inline"><ellipse
          style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.131538;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal"
-         id="circle9582"
+         id="circle9582-6"
          cx="-74.661598"
          cy="60.70055"
          transform="matrix(0.01839222,-0.99983085,0.99981223,0.0193779,0,0)"
          rx="1.2146922"
-         ry="1.1834064" />
-      <text
+         ry="1.1834064" /><text
          xml:space="preserve"
          style="font-size:2.14253px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.131537;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal"
          x="59.531094"
          y="75.579971"
-         id="text9714"
+         id="text9714-2"
          transform="scale(0.98702867,1.0131418)"><tspan
-           sodipodi:role="line"
-           id="tspan9712"
+           id="tspan9712-6"
            style="stroke:#f9f6f6;stroke-width:0.131537;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
            x="59.531094"
-           y="75.579971">3</tspan></text>
-    </g>
-  </g>
-</svg>
+           y="75.579971">3</tspan></text></g></g></svg>

public/assets/small-letter/ks_l3.svg

@@ -7,226 +7,106 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="ks_l2.svg"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xml:space="preserve"
    xmlns="http://www.w3.org/2000/svg"
-   xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.817661,104.871"
-       orientation="1,0"
-       id="guide51377"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
-  <defs
-     id="defs2">
-    <marker
+   xmlns:svg="http://www.w3.org/2000/svg"><defs
+     id="defs2"><linearGradient
+       id="swatch6"><stop
+         style="stop-color:#808080;stop-opacity:1;"
+         offset="0"
+         id="stop6" /></linearGradient><marker
        style="overflow:visible"
-       id="Arrow2-36"
+       id="Arrow2-36-3"
        refX="0"
        refY="0"
        orient="auto-start-reverse"
-       inkscape:stockid="Arrow2"
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       inkscape:isstock="true"
-       inkscape:collect="always"
-       preserveAspectRatio="xMidYMid">
-      <path
+       preserveAspectRatio="xMidYMid"><path
          transform="scale(0.7)"
          d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
          style="fill:context-stroke;fill-rule:evenodd;stroke:none"
-         id="arrow2L-0" />
-    </marker>
-  </defs>
-  <g
-     id="g5482"
-     style="display:none">
-    <path
-       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 33.921393,11.147309 c -0.314864,-0.910336 -0.124404,53.44247 -0.124404,53.44247"
-       id="path127"
-       sodipodi:nodetypes="cc" />
-    <g
-       id="g4983"
-       transform="matrix(1.3106705,0,0,1.3612996,-10.525636,-3.5362715)"
-       style="display:inline">
-      <text
+         id="arrow2L-0-6" /></marker></defs><g
+     id="g9"
+     style="display:none"><path
+       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7.023;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="M 33.897256,10.914479 C 33.616971,9.8851391 33.786514,71.343218 33.786514,71.343218"
+       id="path127-7" /><g
+       id="g4983-5"
+       transform="matrix(1.5341872,0,0,1.4840821,-18.065036,-1.352247)"
+       style="display:inline"><text
          xml:space="preserve"
          style="font-size:2.7912px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
          x="32.887978"
          y="12.794106"
-         id="text9342"
+         id="text9342-3"
          transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
-           sodipodi:role="line"
-           id="tspan9340"
+           id="tspan9340-5"
            style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.14;stroke-dasharray:none;stroke-opacity:1"
            x="32.887978"
-           y="12.794106">1</tspan></text>
-      <circle
+           y="12.794106">1</tspan></text><circle
          style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-         id="path9448"
+         id="path9448-6"
          cx="-34.067326"
          cy="-10.754245"
          transform="rotate(-178.67073)"
-         r="1.2760839" />
-    </g>
-    <path
-       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36);paint-order:stroke fill markers"
-       d="m 33.887502,25.269364 c -0.01675,-2.146498 -0.007,-10.408471 -0.007,-10.408471"
-       id="path13743"
-       sodipodi:nodetypes="cc" />
-  </g>
-  <g
-     id="g5444"
-     style="display:none">
-    <path
+         r="1.2760839" /></g><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36-3);paint-order:stroke fill markers"
+       d="m 33.859011,29.420135 c -0.01675,-2.146498 -0.007,-10.408471 -0.007,-10.408471"
+       id="path13743-2" /></g><g
+     id="g10"
+     style="display:none"><path
        style="display:inline;fill:#b16c57;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="M 53.121566,28.128633 C 52.980692,28.306461 34.558514,54.770101 34.558514,54.770101"
-       id="path15674"
-       sodipodi:nodetypes="cc" />
-    <g
-       id="g21551"
-       transform="matrix(1.0709125,-0.77569872,0.72534851,1.1452501,-18.674442,63.55512)"
-       style="display:inline">
-      <text
+       d="M 58.816429,43.133531 C 56.694269,44.70809 37.161399,59.276133 35.853105,60.460409"
+       id="path15674-9" /><g
+       id="g21551-1"
+       transform="matrix(1.0493551,-0.80462172,0.75631798,1.1250384,-11.344737,78.798908)"
+       style="display:inline"><text
          xml:space="preserve"
          style="font-size:2.31549px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
          x="54.113926"
          y="-23.497944"
-         id="text15678"
+         id="text15678-2"
          transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
-           sodipodi:role="line"
-           id="tspan15676"
+           id="tspan15676-7"
            style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
            x="54.113926"
-           y="-23.497944">2</tspan></text>
-      <circle
+           y="-23.497944">2</tspan></text><circle
          style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-         id="circle15680"
+         id="circle15680-0"
          cx="-54.018658"
          cy="25.946033"
          r="1.2760839"
-         transform="rotate(-144.24458)" />
-    </g>
-    <path
-       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36);paint-order:stroke fill markers"
-       d="m 44.081818,40.087032 c 1.269428,-1.730977 6.21501,-8.34923 6.21501,-8.34923"
-       id="path15682"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="3.0865939"
-       inkscape:transform-center-y="4.0947028" />
-  </g>
-  <g
-     id="g5406"
-     style="display:inline">
-    <path
-       style="display:inline;fill:#000000;fill-opacity:1;stroke:#de0029;stroke-width:6.90976;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="M 40.051918,47.333345 55.451943,64.62565"
-       id="path1108"
-       sodipodi:nodetypes="cc" />
-    <path
-       style="display:inline;fill:#fffcfc;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.452017;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36);paint-order:normal"
-       d="M 48.935982,58.682648 43.108673,51.653571"
-       id="path9576"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="-2.7683077"
-       inkscape:transform-center-y="3.9580734" />
-    <g
-       id="g21538"
-       transform="matrix(1.2270494,0,0,1.2270494,-30.897128,-43.158996)"
-       style="display:inline">
-      <ellipse
+         transform="rotate(-144.24458)" /></g><path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.411819;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36-3);paint-order:stroke fill markers"
+       d="m 48.976421,50.160424 c 1.491381,-1.085308 7.26986,-5.212171 7.26986,-5.212171"
+       id="path15682-9" /></g><g
+     id="g11"
+     style="display:inline"><path
+       style="display:inline;fill:#000000;fill-opacity:1;stroke:#de0029;stroke-width:6.88793;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="M 44.011809,54.273077 59.185821,71.265479"
+       id="path1108-3" /><path
+       style="display:inline;fill:#fffcfc;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.452017;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-36-3);paint-order:normal"
+       d="M 53.607403,65.037959 47.429246,58.315175"
+       id="path9576-6" /><g
+       id="g21538-0"
+       transform="matrix(1.2270494,0,0,1.2270494,-27.438185,-36.914981)"
+       style="display:inline"><ellipse
          style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.131538;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal"
-         id="circle9582"
+         id="circle9582-6"
          cx="-74.661598"
          cy="60.70055"
          transform="matrix(0.01839222,-0.99983085,0.99981223,0.0193779,0,0)"
          rx="1.2146922"
-         ry="1.1834064" />
-      <text
+         ry="1.1834064" /><text
          xml:space="preserve"
          style="font-size:2.14253px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.131537;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal"
          x="59.531094"
          y="75.579971"
-         id="text9714"
+         id="text9714-2"
          transform="scale(0.98702867,1.0131418)"><tspan
-           sodipodi:role="line"
-           id="tspan9712"
+           id="tspan9712-6"
            style="stroke:#f9f6f6;stroke-width:0.131537;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
            x="59.531094"
-           y="75.579971">3</tspan></text>
-    </g>
-  </g>
-</svg>
+           y="75.579971">3</tspan></text></g></g></svg>

public/assets/small-letter/ms.svg

@@ -7,8 +7,8 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="ks_l3.svg"
+   sodipodi:docname="ms.svg"
+   inkscape:export-filename="ms_.png"
    inkscape:export-xdpi="96"
    inkscape:export-ydpi="96"
    xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
@@ -87,6 +87,11 @@
        orientation="1,0"
        id="guide53860"
        inkscape:locked="false" />
+    <sodipodi:guide
+       position="49.699157,65.944645"
+       orientation="0,-1"
+       id="guide1"
+       inkscape:locked="false" />
   </sodipodi:namedview>
   <defs
      id="defs2">
@@ -111,33 +116,33 @@
     </marker>
   </defs>
   <path
-     style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-     d="m 33.822278,28.413439 c 0.119792,1.223818 -0.06878,35.442283 -0.06878,35.442283"
+     style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:6.9633;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+     d="m 33.827168,37.661031 c 0.160276,0.905134 -0.09202,26.213044 -0.09202,26.213044"
      id="path127"
      sodipodi:nodetypes="cc" />
   <text
      xml:space="preserve"
      style="font-size:3.46348px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.17372;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-     x="33.553684"
-     y="29.776054"
+     x="33.126442"
+     y="37.159477"
      id="text9342"
      transform="matrix(0.97428327,-0.00786965,0.00748224,1.0263351,0,0)"><tspan
        sodipodi:role="line"
        id="tspan9340"
        style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.17372;stroke-dasharray:none;stroke-opacity:1"
-       x="33.553684"
-       y="29.776054">1</tspan></text>
+       x="33.126442"
+       y="37.159477">1</tspan></text>
   <ellipse
      style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.17372;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
      id="path9448"
-     cx="-34.556458"
-     cy="-28.180008"
+     cx="-34.242313"
+     cy="-35.770748"
      transform="matrix(-0.99970185,-0.0244176,0.02203936,-0.9997571,0,0)"
      rx="1.5434091"
      ry="1.624505" />
   <path
      style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.517543;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
-     d="M 33.89306,38.744499 C 33.86234,37.38988 33.88022,32.175886 33.88022,32.175886"
+     d="m 33.772723,58.600095 c -0.03072,-1.354619 -0.01284,-6.568613 -0.01284,-6.568613"
      id="path13743"
      sodipodi:nodetypes="cc" />
   <path

public/assets/small-letter/ms_l1.svg

@@ -7,87 +7,8 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="ms_l1.svg"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.817661,104.871"
-       orientation="1,0"
-       id="guide51377"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
   <defs
      id="defs2">
     <marker
@@ -96,12 +17,9 @@
        refX="0"
        refY="0"
        orient="auto-start-reverse"
-       inkscape:stockid="Arrow2"
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       inkscape:isstock="true"
-       inkscape:collect="always"
        preserveAspectRatio="xMidYMid">
       <path
          transform="scale(0.7)"
@@ -111,46 +29,42 @@
     </marker>
   </defs>
   <g
-     id="g6916">
+     id="g3">
     <path
-       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 33.822278,28.413439 c 0.119792,1.223818 -0.06878,35.442283 -0.06878,35.442283"
-       id="path127"
-       sodipodi:nodetypes="cc" />
+       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:6.9633;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="m 33.827168,37.661031 c 0.160276,0.905134 -0.09202,26.213044 -0.09202,26.213044"
+       id="path127" />
     <text
        xml:space="preserve"
        style="font-size:3.46348px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.17372;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-       x="33.553684"
-       y="29.776054"
+       x="33.126442"
+       y="37.159477"
        id="text9342"
        transform="matrix(0.97428327,-0.00786965,0.00748224,1.0263351,0,0)"><tspan
-         sodipodi:role="line"
          id="tspan9340"
          style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.17372;stroke-dasharray:none;stroke-opacity:1"
-         x="33.553684"
-         y="29.776054">1</tspan></text>
+         x="33.126442"
+         y="37.159477">1</tspan></text>
     <ellipse
        style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.17372;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
        id="path9448"
-       cx="-34.556458"
-       cy="-28.180008"
+       cx="-34.242313"
+       cy="-35.770748"
        transform="matrix(-0.99970185,-0.0244176,0.02203936,-0.9997571,0,0)"
        rx="1.5434091"
        ry="1.624505" />
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.517543;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
-       d="M 33.89306,38.744499 C 33.86234,37.38988 33.88022,32.175886 33.88022,32.175886"
-       id="path13743"
-       sodipodi:nodetypes="cc" />
+       d="m 33.772723,58.600095 c -0.03072,-1.354619 -0.01284,-6.568613 -0.01284,-6.568613"
+       id="path13743" />
   </g>
   <g
-     id="g6879"
+     id="g2"
      style="display:none">
     <path
-       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:6.98157;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="M 49.665646,64.144399 C 49.406983,56.924836 50.688044,48.315235 48.328053,42.472951 45.638263,35.814232 33.132956,34.6236 33.835003,52.488456"
-       id="path6285"
-       sodipodi:nodetypes="csc" />
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:6.92979;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="m 49.725065,64.043076 c -0.259489,-7.328875 1.025659,-16.068837 -1.34186,-21.999579 -2.698371,-6.759541 -15.24357,-7.9682 -14.539283,10.167151"
+       id="path6285" />
     <g
        id="g6313"
        transform="matrix(0.97035549,-0.65723941,0.65723941,0.97035549,-31.442501,79.56139)"
@@ -162,7 +76,6 @@
          y="-23.497944"
          id="text6309"
          transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
-           sodipodi:role="line"
            id="tspan6307"
            style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
            x="54.113926"
@@ -177,27 +90,20 @@
     </g>
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
-       d="m 38.349052,39.347895 c -3.566392,1.489354 -5.526222,4.175033 -5.246421,9.256318"
-       id="path6315"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="0.41460034"
-       inkscape:transform-center-y="0.46910942" />
+       d="m 37.819885,39.347895 c -3.566392,1.489354 -5.526222,4.175033 -5.246421,9.256318"
+       id="path6315" />
   </g>
   <g
-     id="g6841"
+     id="g1"
      style="display:none">
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#de0029;stroke-width:6.94498;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
        d="M 66.256418,64.14057 C 65.825166,56.796699 67.320273,48.051958 64.864587,42.113916 62.06573,35.346057 49.053349,34.135911 49.783864,52.29358"
-       id="path6287"
-       sodipodi:nodetypes="csc" />
+       id="path6287" />
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
        d="m 55.811563,39.347895 c -3.566392,1.489354 -5.526222,4.175033 -5.246421,9.256318"
-       id="path6317"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="0.41460034"
-       inkscape:transform-center-y="0.46910942" />
+       id="path6317" />
     <g
        id="g6325"
        transform="matrix(1.2912359,0,0,1.2912359,-26.452174,-46.397985)"
@@ -217,7 +123,6 @@
          y="75.579971"
          id="text6323"
          transform="scale(0.98702867,1.0131418)"><tspan
-           sodipodi:role="line"
            id="tspan6321"
            style="stroke:#f9f6f6;stroke-width:0.131537;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
            x="59.531094"

public/assets/small-letter/ms_l2.svg

@@ -7,87 +7,8 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="ms_l1.svg"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.817661,104.871"
-       orientation="1,0"
-       id="guide51377"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
   <defs
      id="defs2">
     <marker
@@ -96,12 +17,9 @@
        refX="0"
        refY="0"
        orient="auto-start-reverse"
-       inkscape:stockid="Arrow2"
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       inkscape:isstock="true"
-       inkscape:collect="always"
        preserveAspectRatio="xMidYMid">
       <path
          transform="scale(0.7)"
@@ -111,47 +29,43 @@
     </marker>
   </defs>
   <g
-     id="g6916"
+     id="g3"
      style="display:none">
     <path
-       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 33.822278,28.413439 c 0.119792,1.223818 -0.06878,35.442283 -0.06878,35.442283"
-       id="path127"
-       sodipodi:nodetypes="cc" />
+       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:6.9633;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="m 33.827168,37.661031 c 0.160276,0.905134 -0.09202,26.213044 -0.09202,26.213044"
+       id="path127" />
     <text
        xml:space="preserve"
        style="font-size:3.46348px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.17372;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-       x="33.553684"
-       y="29.776054"
+       x="33.126442"
+       y="37.159477"
        id="text9342"
        transform="matrix(0.97428327,-0.00786965,0.00748224,1.0263351,0,0)"><tspan
-         sodipodi:role="line"
          id="tspan9340"
          style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.17372;stroke-dasharray:none;stroke-opacity:1"
-         x="33.553684"
-         y="29.776054">1</tspan></text>
+         x="33.126442"
+         y="37.159477">1</tspan></text>
     <ellipse
        style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.17372;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
        id="path9448"
-       cx="-34.556458"
-       cy="-28.180008"
+       cx="-34.242313"
+       cy="-35.770748"
        transform="matrix(-0.99970185,-0.0244176,0.02203936,-0.9997571,0,0)"
        rx="1.5434091"
        ry="1.624505" />
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.517543;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
-       d="M 33.89306,38.744499 C 33.86234,37.38988 33.88022,32.175886 33.88022,32.175886"
-       id="path13743"
-       sodipodi:nodetypes="cc" />
+       d="m 33.772723,58.600095 c -0.03072,-1.354619 -0.01284,-6.568613 -0.01284,-6.568613"
+       id="path13743" />
   </g>
   <g
-     id="g6879"
+     id="g2"
      style="display:inline">
     <path
-       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:6.98157;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="M 49.665646,64.144399 C 49.406983,56.924836 50.688044,48.315235 48.328053,42.472951 45.638263,35.814232 33.132956,34.6236 33.835003,52.488456"
-       id="path6285"
-       sodipodi:nodetypes="csc" />
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:6.92979;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="m 49.725065,64.043076 c -0.259489,-7.328875 1.025659,-16.068837 -1.34186,-21.999579 -2.698371,-6.759541 -15.24357,-7.9682 -14.539283,10.167151"
+       id="path6285" />
     <g
        id="g6313"
        transform="matrix(0.97035549,-0.65723941,0.65723941,0.97035549,-31.442501,79.56139)"
@@ -163,7 +77,6 @@
          y="-23.497944"
          id="text6309"
          transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
-           sodipodi:role="line"
            id="tspan6307"
            style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
            x="54.113926"
@@ -178,27 +91,20 @@
     </g>
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
-       d="m 38.349052,39.347895 c -3.566392,1.489354 -5.526222,4.175033 -5.246421,9.256318"
-       id="path6315"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="0.41460034"
-       inkscape:transform-center-y="0.46910942" />
+       d="m 37.819885,39.347895 c -3.566392,1.489354 -5.526222,4.175033 -5.246421,9.256318"
+       id="path6315" />
   </g>
   <g
-     id="g6841"
+     id="g1"
      style="display:none">
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#de0029;stroke-width:6.94498;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
        d="M 66.256418,64.14057 C 65.825166,56.796699 67.320273,48.051958 64.864587,42.113916 62.06573,35.346057 49.053349,34.135911 49.783864,52.29358"
-       id="path6287"
-       sodipodi:nodetypes="csc" />
+       id="path6287" />
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
        d="m 55.811563,39.347895 c -3.566392,1.489354 -5.526222,4.175033 -5.246421,9.256318"
-       id="path6317"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="0.41460034"
-       inkscape:transform-center-y="0.46910942" />
+       id="path6317" />
     <g
        id="g6325"
        transform="matrix(1.2912359,0,0,1.2912359,-26.452174,-46.397985)"
@@ -218,7 +124,6 @@
          y="75.579971"
          id="text6323"
          transform="scale(0.98702867,1.0131418)"><tspan
-           sodipodi:role="line"
            id="tspan6321"
            style="stroke:#f9f6f6;stroke-width:0.131537;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
            x="59.531094"

public/assets/small-letter/ms_l3.svg

@@ -7,87 +7,8 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="ms_l2.svg"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.817661,104.871"
-       orientation="1,0"
-       id="guide51377"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
   <defs
      id="defs2">
     <marker
@@ -96,12 +17,9 @@
        refX="0"
        refY="0"
        orient="auto-start-reverse"
-       inkscape:stockid="Arrow2"
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       inkscape:isstock="true"
-       inkscape:collect="always"
        preserveAspectRatio="xMidYMid">
       <path
          transform="scale(0.7)"
@@ -111,47 +29,43 @@
     </marker>
   </defs>
   <g
-     id="g6916"
+     id="g3"
      style="display:none">
     <path
-       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 33.822278,28.413439 c 0.119792,1.223818 -0.06878,35.442283 -0.06878,35.442283"
-       id="path127"
-       sodipodi:nodetypes="cc" />
+       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:6.9633;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="m 33.827168,37.661031 c 0.160276,0.905134 -0.09202,26.213044 -0.09202,26.213044"
+       id="path127" />
     <text
        xml:space="preserve"
        style="font-size:3.46348px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.17372;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-       x="33.553684"
-       y="29.776054"
+       x="33.126442"
+       y="37.159477"
        id="text9342"
        transform="matrix(0.97428327,-0.00786965,0.00748224,1.0263351,0,0)"><tspan
-         sodipodi:role="line"
          id="tspan9340"
          style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.17372;stroke-dasharray:none;stroke-opacity:1"
-         x="33.553684"
-         y="29.776054">1</tspan></text>
+         x="33.126442"
+         y="37.159477">1</tspan></text>
     <ellipse
        style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.17372;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
        id="path9448"
-       cx="-34.556458"
-       cy="-28.180008"
+       cx="-34.242313"
+       cy="-35.770748"
        transform="matrix(-0.99970185,-0.0244176,0.02203936,-0.9997571,0,0)"
        rx="1.5434091"
        ry="1.624505" />
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.517543;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
-       d="M 33.89306,38.744499 C 33.86234,37.38988 33.88022,32.175886 33.88022,32.175886"
-       id="path13743"
-       sodipodi:nodetypes="cc" />
+       d="m 33.772723,58.600095 c -0.03072,-1.354619 -0.01284,-6.568613 -0.01284,-6.568613"
+       id="path13743" />
   </g>
   <g
-     id="g6879"
+     id="g2"
      style="display:none">
     <path
-       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:6.98157;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="M 49.665646,64.144399 C 49.406983,56.924836 50.688044,48.315235 48.328053,42.472951 45.638263,35.814232 33.132956,34.6236 33.835003,52.488456"
-       id="path6285"
-       sodipodi:nodetypes="csc" />
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:6.92979;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="m 49.725065,64.043076 c -0.259489,-7.328875 1.025659,-16.068837 -1.34186,-21.999579 -2.698371,-6.759541 -15.24357,-7.9682 -14.539283,10.167151"
+       id="path6285" />
     <g
        id="g6313"
        transform="matrix(0.97035549,-0.65723941,0.65723941,0.97035549,-31.442501,79.56139)"
@@ -163,7 +77,6 @@
          y="-23.497944"
          id="text6309"
          transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
-           sodipodi:role="line"
            id="tspan6307"
            style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
            x="54.113926"
@@ -178,27 +91,20 @@
     </g>
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
-       d="m 38.349052,39.347895 c -3.566392,1.489354 -5.526222,4.175033 -5.246421,9.256318"
-       id="path6315"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="0.41460034"
-       inkscape:transform-center-y="0.46910942" />
+       d="m 37.819885,39.347895 c -3.566392,1.489354 -5.526222,4.175033 -5.246421,9.256318"
+       id="path6315" />
   </g>
   <g
-     id="g6841"
+     id="g1"
      style="display:inline">
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#de0029;stroke-width:6.94498;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
        d="M 66.256418,64.14057 C 65.825166,56.796699 67.320273,48.051958 64.864587,42.113916 62.06573,35.346057 49.053349,34.135911 49.783864,52.29358"
-       id="path6287"
-       sodipodi:nodetypes="csc" />
+       id="path6287" />
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
        d="m 55.811563,39.347895 c -3.566392,1.489354 -5.526222,4.175033 -5.246421,9.256318"
-       id="path6317"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="0.41460034"
-       inkscape:transform-center-y="0.46910942" />
+       id="path6317" />
     <g
        id="g6325"
        transform="matrix(1.2912359,0,0,1.2912359,-26.452174,-46.397985)"
@@ -218,7 +124,6 @@
          y="75.579971"
          id="text6323"
          transform="scale(0.98702867,1.0131418)"><tspan
-           sodipodi:role="line"
            id="tspan6321"
            style="stroke:#f9f6f6;stroke-width:0.131537;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
            x="59.531094"

public/assets/small-letter/ns.svg

@@ -7,7 +7,7 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
+   sodipodi:docname="ns.svg"
    inkscape:export-filename="ms_l3.svg"
    inkscape:export-xdpi="96"
    inkscape:export-ydpi="96"
@@ -87,6 +87,11 @@
        orientation="1,0"
        id="guide53860"
        inkscape:locked="false" />
+    <sodipodi:guide
+       position="47.172081,65.583634"
+       orientation="0,-1"
+       id="guide1"
+       inkscape:locked="false" />
   </sodipodi:namedview>
   <defs
      id="defs2">
@@ -110,40 +115,36 @@
          id="arrow2L-2" />
     </marker>
   </defs>
-  <g
-     id="g6916"
-     style="display:inline">
   <path
-       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 33.822278,28.413439 c 0.119792,1.223818 -0.06878,35.442283 -0.06878,35.442283"
+     style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:6.96393;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+     d="m 33.827084,37.541011 c 0.159576,0.909267 -0.09162,26.332747 -0.09162,26.332747"
      id="path127"
      sodipodi:nodetypes="cc" />
   <text
      xml:space="preserve"
      style="font-size:3.46348px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.17372;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-       x="33.553684"
-       y="29.776054"
+     x="33.249947"
+     y="37.160423"
      id="text9342"
      transform="matrix(0.97428327,-0.00786965,0.00748224,1.0263351,0,0)"><tspan
        sodipodi:role="line"
        id="tspan9340"
        style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.17372;stroke-dasharray:none;stroke-opacity:1"
-         x="33.553684"
-         y="29.776054">1</tspan></text>
+       x="33.249947"
+       y="37.160423">1</tspan></text>
   <ellipse
      style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.17372;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
      id="path9448"
-       cx="-34.556458"
-       cy="-28.180008"
+     cx="-34.482925"
+     cy="-35.764874"
      transform="matrix(-0.99970185,-0.0244176,0.02203936,-0.9997571,0,0)"
      rx="1.5434091"
      ry="1.624505" />
   <path
      style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.517543;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
-       d="M 33.89306,38.744499 C 33.86234,37.38988 33.88022,32.175886 33.88022,32.175886"
+     d="M 33.89306,58.323678 C 33.86234,56.969059 33.88022,51.755065 33.88022,51.755065"
      id="path13743"
      sodipodi:nodetypes="cc" />
-  </g>
   <g
      id="g6879"
      style="display:inline">

public/assets/small-letter/ns_l1.svg

@@ -7,87 +7,8 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="ns.svg"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.817661,104.871"
-       orientation="1,0"
-       id="guide51377"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
   <defs
      id="defs2">
     <marker
@@ -96,12 +17,9 @@
        refX="0"
        refY="0"
        orient="auto-start-reverse"
-       inkscape:stockid="Arrow2"
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       inkscape:isstock="true"
-       inkscape:collect="always"
        preserveAspectRatio="xMidYMid">
       <path
          transform="scale(0.7)"
@@ -110,48 +28,40 @@
          id="arrow2L-2" />
     </marker>
   </defs>
-  <g
-     id="g6916"
-     style="display:inline">
   <path
-       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 33.822278,28.413439 c 0.119792,1.223818 -0.06878,35.442283 -0.06878,35.442283"
-       id="path127"
-       sodipodi:nodetypes="cc" />
+     style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:6.96393;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+     d="m 33.827084,37.541011 c 0.159576,0.909267 -0.09162,26.332747 -0.09162,26.332747"
+     id="path127" />
   <text
      xml:space="preserve"
      style="font-size:3.46348px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.17372;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-       x="33.553684"
-       y="29.776054"
+     x="33.249947"
+     y="37.160423"
      id="text9342"
      transform="matrix(0.97428327,-0.00786965,0.00748224,1.0263351,0,0)"><tspan
-         sodipodi:role="line"
        id="tspan9340"
        style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.17372;stroke-dasharray:none;stroke-opacity:1"
-         x="33.553684"
-         y="29.776054">1</tspan></text>
+       x="33.249947"
+       y="37.160423">1</tspan></text>
   <ellipse
      style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.17372;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
      id="path9448"
-       cx="-34.556458"
-       cy="-28.180008"
+     cx="-34.482925"
+     cy="-35.764874"
      transform="matrix(-0.99970185,-0.0244176,0.02203936,-0.9997571,0,0)"
      rx="1.5434091"
      ry="1.624505" />
   <path
      style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.517543;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
-       d="M 33.89306,38.744499 C 33.86234,37.38988 33.88022,32.175886 33.88022,32.175886"
-       id="path13743"
-       sodipodi:nodetypes="cc" />
-  </g>
+     d="M 33.89306,58.323678 C 33.86234,56.969059 33.88022,51.755065 33.88022,51.755065"
+     id="path13743" />
   <g
      id="g6879"
      style="display:none">
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:6.98157;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
        d="M 49.665646,64.144399 C 49.406983,56.924836 50.688044,48.315235 48.328053,42.472951 45.638263,35.814232 33.132956,34.6236 33.835003,52.488456"
-       id="path6285"
-       sodipodi:nodetypes="csc" />
+       id="path6285" />
     <g
        id="g6313"
        transform="matrix(0.97035549,-0.65723941,0.65723941,0.97035549,-31.442501,79.56139)"
@@ -163,7 +73,6 @@
          y="-23.497944"
          id="text6309"
          transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
-           sodipodi:role="line"
            id="tspan6307"
            style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
            x="54.113926"
@@ -179,10 +88,7 @@
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
        d="m 38.349052,39.347895 c -3.566392,1.489354 -5.526222,4.175033 -5.246421,9.256318"
-       id="path6315"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="0.41460034"
-       inkscape:transform-center-y="0.46910942" />
+       id="path6315" />
   </g>
   <g
      id="g6841"
@@ -190,15 +96,11 @@
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#de0029;stroke-width:6.94498;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
        d="M 66.256418,64.14057 C 65.825166,56.796699 67.320273,48.051958 64.864587,42.113916 62.06573,35.346057 49.053349,34.135911 49.783864,52.29358"
-       id="path6287"
-       sodipodi:nodetypes="csc" />
+       id="path6287" />
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
        d="m 55.811563,39.347895 c -3.566392,1.489354 -5.526222,4.175033 -5.246421,9.256318"
-       id="path6317"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="0.41460034"
-       inkscape:transform-center-y="0.46910942" />
+       id="path6317" />
     <ellipse
        style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.169847;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal"
        id="ellipse6319"
@@ -214,7 +116,6 @@
        y="51.795433"
        id="text6323"
        transform="scale(0.98702867,1.0131418)"><tspan
-         sodipodi:role="line"
          id="tspan6321"
          style="stroke:#f9f6f6;stroke-width:0.169845;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
          x="50.068886"

public/assets/small-letter/ns_l2.svg

@@ -7,87 +7,8 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
-   inkscape:export-filename="ns_l1.svg"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview51242"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:document-units="mm"
-     showgrid="false"
-     showguides="true">
-    <sodipodi:guide
-       position="107.64909,49.99107"
-       orientation="0,-1"
-       id="guide51373"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.63086,74.995535"
-       orientation="0,-1"
-       id="guide51375"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="69.817661,104.871"
-       orientation="1,0"
-       id="guide51377"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="49.846563,90.7451"
-       orientation="1,0"
-       id="guide51379"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="30.037831,109.742"
-       orientation="1,0"
-       id="guide51381"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="114.14376,25.148972"
-       orientation="0,-1"
-       id="guide51383"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="121.77499,67.526669"
-       orientation="0,-1"
-       id="guide51385"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="-62.511162,32.455471"
-       orientation="0,-1"
-       id="guide51387"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="79.722027,92.531133"
-       orientation="0,-1"
-       id="guide51389"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="75.500494,7.6133734"
-       orientation="0,-1"
-       id="guide51391"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="62.674703,108.2319"
-       orientation="1,0"
-       id="guide53858"
-       inkscape:locked="false" />
-    <sodipodi:guide
-       position="37.604822,110.66405"
-       orientation="1,0"
-       id="guide53860"
-       inkscape:locked="false" />
-  </sodipodi:namedview>
   <defs
      id="defs2">
     <marker
@@ -96,12 +17,9 @@
        refX="0"
        refY="0"
        orient="auto-start-reverse"
-       inkscape:stockid="Arrow2"
        markerWidth="7.6999998"
        markerHeight="5.5999999"
        viewBox="0 0 7.7 5.6"
-       inkscape:isstock="true"
-       inkscape:collect="always"
        preserveAspectRatio="xMidYMid">
       <path
          transform="scale(0.7)"
@@ -111,38 +29,35 @@
     </marker>
   </defs>
   <g
-     id="g6916"
+     id="g1"
      style="display:none">
     <path
-       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 33.822278,28.413439 c 0.119792,1.223818 -0.06878,35.442283 -0.06878,35.442283"
-       id="path127"
-       sodipodi:nodetypes="cc" />
+       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:6.96393;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="m 33.827084,37.541011 c 0.159576,0.909267 -0.09162,26.332747 -0.09162,26.332747"
+       id="path127" />
     <text
        xml:space="preserve"
        style="font-size:3.46348px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.17372;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-       x="33.553684"
-       y="29.776054"
+       x="33.249947"
+       y="37.160423"
        id="text9342"
        transform="matrix(0.97428327,-0.00786965,0.00748224,1.0263351,0,0)"><tspan
-         sodipodi:role="line"
          id="tspan9340"
          style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.17372;stroke-dasharray:none;stroke-opacity:1"
-         x="33.553684"
-         y="29.776054">1</tspan></text>
+         x="33.249947"
+         y="37.160423">1</tspan></text>
     <ellipse
        style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.17372;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
        id="path9448"
-       cx="-34.556458"
-       cy="-28.180008"
+       cx="-34.482925"
+       cy="-35.764874"
        transform="matrix(-0.99970185,-0.0244176,0.02203936,-0.9997571,0,0)"
        rx="1.5434091"
        ry="1.624505" />
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.517543;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
-       d="M 33.89306,38.744499 C 33.86234,37.38988 33.88022,32.175886 33.88022,32.175886"
-       id="path13743"
-       sodipodi:nodetypes="cc" />
+       d="M 33.89306,58.323678 C 33.86234,56.969059 33.88022,51.755065 33.88022,51.755065"
+       id="path13743" />
   </g>
   <g
      id="g6879"
@@ -150,8 +65,7 @@
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:6.98157;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
        d="M 49.665646,64.144399 C 49.406983,56.924836 50.688044,48.315235 48.328053,42.472951 45.638263,35.814232 33.132956,34.6236 33.835003,52.488456"
-       id="path6285"
-       sodipodi:nodetypes="csc" />
+       id="path6285" />
     <g
        id="g6313"
        transform="matrix(0.97035549,-0.65723941,0.65723941,0.97035549,-31.442501,79.56139)"
@@ -163,7 +77,6 @@
          y="-23.497944"
          id="text6309"
          transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
-           sodipodi:role="line"
            id="tspan6307"
            style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
            x="54.113926"
@@ -179,10 +92,7 @@
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
        d="m 38.349052,39.347895 c -3.566392,1.489354 -5.526222,4.175033 -5.246421,9.256318"
-       id="path6315"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="0.41460034"
-       inkscape:transform-center-y="0.46910942" />
+       id="path6315" />
   </g>
   <g
      id="g6841"
@@ -190,15 +100,11 @@
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#de0029;stroke-width:6.94498;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
        d="M 66.256418,64.14057 C 65.825166,56.796699 67.320273,48.051958 64.864587,42.113916 62.06573,35.346057 49.053349,34.135911 49.783864,52.29358"
-       id="path6287"
-       sodipodi:nodetypes="csc" />
+       id="path6287" />
     <path
        style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-6);paint-order:stroke fill markers"
        d="m 55.811563,39.347895 c -3.566392,1.489354 -5.526222,4.175033 -5.246421,9.256318"
-       id="path6317"
-       sodipodi:nodetypes="cc"
-       inkscape:transform-center-x="0.41460034"
-       inkscape:transform-center-y="0.46910942" />
+       id="path6317" />
     <ellipse
        style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.169847;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal"
        id="ellipse6319"
@@ -214,7 +120,6 @@
        y="51.795433"
        id="text6323"
        transform="scale(0.98702867,1.0131418)"><tspan
-         sodipodi:role="line"
          id="tspan6321"
          style="stroke:#f9f6f6;stroke-width:0.169845;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
          x="50.068886"

public/assets/small-letter/ts.svg

@@ -8,7 +8,7 @@
    version="1.1"
    id="svg5"
    sodipodi:docname="ts_l2.svg"
-   inkscape:export-filename="ts_l2.svg"
+   inkscape:export-filename="ts-l3.svg"
    inkscape:export-xdpi="96"
    inkscape:export-ydpi="96"
    inkscape:version="1.3 (0e150ed6c4, 2023-07-21)"
@@ -138,9 +138,9 @@
      style="display:inline">
     <path
        style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 50.08549,24.331693 c 0.276649,8.508821 -0.204874,28.733484 -0.204874,37.237207 0,4.994314 10.537236,5.173737 10.111561,-3.778473"
+       d="m 49.923123,20.759627 c 0.276649,8.508821 -0.04251,41.885183 -0.04251,50.388906"
        id="path127"
-       sodipodi:nodetypes="ccc" />
+       sodipodi:nodetypes="cc" />
     <text
        xml:space="preserve"
        style="font-size:3.62443px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.181793;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
@@ -166,12 +166,13 @@
   </g>
   <g
      id="g18551"
-     transform="translate(-1.0583333,-0.52916667)"
+     transform="translate(-1.0583333,-3.9071252)"
      style="display:inline">
     <path
        style="display:inline;fill:#b16c57;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 63.698073,36.333523 c -2.013851,0.08758 -26.404088,0.195734 -26.404088,0.195734"
-       id="path1236-5" />
+       d="m 62.074406,36.333523 c -2.013851,0.08758 -21.695455,0.03337 -21.695455,0.03337"
+       id="path1236-5"
+       sodipodi:nodetypes="cc" />
     <g
        id="g1301"
        transform="matrix(1.0751203,-0.72819851,0.72819851,1.0751203,-30.931124,68.289741)"

public/assets/small-letter/ts_l1.svg

@@ -8,9 +8,10 @@
    version="1.1"
    id="svg5"
    sodipodi:docname="ts_l2.svg"
-   inkscape:export-filename="ts-l1.svg"
+   inkscape:export-filename="..\Desktop\LATTER\ts_l1.png"
    inkscape:export-xdpi="96"
    inkscape:export-ydpi="96"
+   inkscape:version="1.3 (0e150ed6c4, 2023-07-21)"
    xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
    xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns="http://www.w3.org/2000/svg"
@@ -28,12 +29,12 @@
      showgrid="false"
      showguides="true"
      inkscape:zoom="1.6295423"
-     inkscape:cx="47.252532"
-     inkscape:cy="206.19287"
+     inkscape:cx="125.49536"
+     inkscape:cy="151.88314"
      inkscape:window-width="1920"
-     inkscape:window-height="1007"
-     inkscape:window-x="0"
-     inkscape:window-y="0"
+     inkscape:window-height="1027"
+     inkscape:window-x="-8"
+     inkscape:window-y="-8"
      inkscape:window-maximized="1"
      inkscape:current-layer="svg5">
     <sodipodi:guide
@@ -115,15 +116,31 @@
          style="fill:context-stroke;fill-rule:evenodd;stroke:none"
          id="arrow2L-54" />
     </marker>
+    <marker
+       style="overflow:visible"
+       id="Arrow2-3-7"
+       refX="0"
+       refY="0"
+       orient="auto-start-reverse"
+       markerWidth="7.6999998"
+       markerHeight="5.5999999"
+       viewBox="0 0 7.7 5.6"
+       preserveAspectRatio="xMidYMid">
+      <path
+         transform="scale(0.7)"
+         d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
+         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
+         id="arrow2L-6-6" />
+    </marker>
   </defs>
   <g
      id="g18882"
      style="display:inline">
     <path
        style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 50.08549,24.331693 c 0.276649,8.508821 -0.204874,28.733484 -0.204874,37.237207 0,4.994314 10.537236,5.173737 10.111561,-3.778473"
+       d="m 49.923123,20.759627 c 0.276649,8.508821 -0.04251,41.885183 -0.04251,50.388906"
        id="path127"
-       sodipodi:nodetypes="ccc" />
+       sodipodi:nodetypes="cc" />
     <text
        xml:space="preserve"
        style="font-size:3.62443px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.181793;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
@@ -147,4 +164,41 @@
        d="m 50.181312,42.781753 c -0.01038,-3.228056 -0.0043,-15.652996 -0.0043,-15.652996"
        id="path13743" />
   </g>
+  <g
+     id="g18551"
+     transform="translate(-1.0583333,-3.9071252)"
+     style="display:none">
+    <path
+       style="display:inline;fill:#b16c57;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="m 62.074406,36.333523 c -2.013851,0.08758 -21.695455,0.03337 -21.695455,0.03337"
+       id="path1236-5"
+       sodipodi:nodetypes="cc" />
+    <g
+       id="g1301"
+       transform="matrix(1.0751203,-0.72819851,0.72819851,1.0751203,-30.931124,68.289741)"
+       style="display:inline">
+      <text
+         xml:space="preserve"
+         style="font-size:2.31549px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         x="54.113926"
+         y="-23.497944"
+         id="text1240-6"
+         transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
+           id="tspan1238-9"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
+           x="54.113926"
+           y="-23.497944">2</tspan></text>
+      <circle
+         style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+         id="circle1242-3"
+         cx="-54.018658"
+         cy="25.946033"
+         r="1.2760839"
+         transform="rotate(-144.24458)" />
+    </g>
+    <path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-7);paint-order:stroke fill markers"
+       d="m 53.475324,36.181898 c -2.146558,0.0055 -10.407988,0.100872 -10.407988,0.100872"
+       id="path1246-7" />
+  </g>
 </svg>

public/assets/small-letter/ts_l2.svg

@@ -8,7 +8,7 @@
    version="1.1"
    id="svg5"
    sodipodi:docname="ts_l2.svg"
-   inkscape:export-filename="ts-l3.svg"
+   inkscape:export-filename="..\Desktop\LATTER\ts_l1.svg"
    inkscape:export-xdpi="96"
    inkscape:export-ydpi="96"
    inkscape:version="1.3 (0e150ed6c4, 2023-07-21)"
@@ -138,9 +138,9 @@
      style="display:none">
     <path
        style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 50.08549,24.331693 c 0.276649,8.508821 -0.204874,28.733484 -0.204874,37.237207 0,4.994314 10.537236,5.173737 10.111561,-3.778473"
+       d="m 49.923123,20.759627 c 0.276649,8.508821 -0.04251,41.885183 -0.04251,50.388906"
        id="path127"
-       sodipodi:nodetypes="ccc" />
+       sodipodi:nodetypes="cc" />
     <text
        xml:space="preserve"
        style="font-size:3.62443px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.181793;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
@@ -166,12 +166,13 @@
   </g>
   <g
      id="g18551"
-     transform="translate(-1.0583333,-0.52916667)"
+     transform="translate(-1.0583333,-3.9071252)"
      style="display:inline">
     <path
        style="display:inline;fill:#b16c57;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 63.698073,36.333523 c -2.013851,0.08758 -26.404088,0.195734 -26.404088,0.195734"
-       id="path1236-5" />
+       d="m 62.074406,36.333523 c -2.013851,0.08758 -21.695455,0.03337 -21.695455,0.03337"
+       id="path1236-5"
+       sodipodi:nodetypes="cc" />
     <g
        id="g1301"
        transform="matrix(1.0751203,-0.72819851,0.72819851,1.0751203,-30.931124,68.289741)"

public/assets/svg/bg-star.svg

@@ -0,0 +1,4 @@
+
+<svg width="33" height="53" viewBox="0 0 33 53" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M20.0133 0.670076C12.0873 11.9725 9.40142 12.9708 -3.98258 9.58949C7.31986 17.5155 8.31817 20.2013 4.93684 33.5854C12.8629 22.2829 15.5486 21.2846 28.9327 24.666C17.6303 16.7399 16.6319 14.0541 20.0133 0.670076ZM27.2696 32.0069C22.2291 39.1949 20.5208 39.8298 12.0092 37.6793C19.197 42.7199 19.832 44.4282 17.6816 52.9398C22.722 45.7519 24.4304 45.1169 32.9419 47.2673C25.754 42.2268 25.1192 40.5187 27.2696 32.0069Z" fill="white" fill-opacity="0.7"/>
+</svg>

public/assets/svg/border-correct.svg

@@ -0,0 +1,5 @@
+
+<svg width="121" height="121" viewBox="0 0 121 121" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="1.03516" y="1.51172" width="118" height="118" rx="9" fill="#EDF8F1"/>
+<rect x="1.03516" y="1.51172" width="118" height="118" rx="9" stroke="#49B76E" stroke-width="2"/>
+</svg>

public/assets/svg/border-wrong.svg

@@ -0,0 +1,5 @@
+
+<svg width="121" height="121" viewBox="0 0 121 121" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="1.03516" y="1.51172" width="118" height="118" rx="9" fill="#D14B62" fill-opacity="0.1"/>
+<rect x="1.03516" y="1.51172" width="118" height="118" rx="9" stroke="#D14B62" stroke-width="2"/>
+</svg>

public/assets/svg/border.svg

@@ -0,0 +1,4 @@
+
+<svg width="121" height="121" viewBox="0 0 121 121" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="1.03516" y="1.51172" width="118" height="118" rx="9" stroke="#60C6CB" stroke-width="2"/>
+</svg>

public/assets/svg/button-icon.svg

@@ -1 +1 @@
-<svg width="64px" height="64px" viewBox="-2.4 -2.4 28.80 28.80" fill="none" xmlns="http://www.w3.org/2000/svg"><g id="SVGRepo_bgCarrier" stroke-width="0" transform="translate(0,0), scale(1)"><rect x="-2.4" y="-2.4" width="28.80" height="28.80" rx="14.4" fill="#eceaea" strokewidth="0"></rect></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round" stroke="#ff0000" stroke-width="0.048"></g><g id="SVGRepo_iconCarrier"> <path d="M8 12L12 16M12 16L16 12M12 16V8M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#0000FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path> </g></svg>
+<svg width="50px" height="50px" viewBox="-2.4 -2.4 28.80 28.80" fill="none" xmlns="http://www.w3.org/2000/svg"><g id="SVGRepo_bgCarrier" stroke-width="0" transform="translate(0,0), scale(1)"><rect x="-2.4" y="-2.4" width="28.80" height="28.80" rx="14.4" fill="" strokewidth="0"></rect></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round" stroke="2" stroke-width=""></g><g id="SVGRepo_iconCarrier"> <path d="M8 12L12 16M12 16L16 12M12 16V8M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#BB4D6A" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path> </g></svg>

public/assets/svg/cancel.svg

@@ -0,0 +1,4 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="20" cy="20" r="19.5" fill="#FFFFFF" stroke="#BB4D6A"/>
+<path d="M26.3002 13.71C26.1134 13.5227 25.8597 13.4175 25.5952 13.4175C25.3307 13.4175 25.077 13.5227 24.8902 13.71L20.0002 18.59L15.1102 13.7C14.9234 13.5127 14.6697 13.4075 14.4052 13.4075C14.1407 13.4075 13.887 13.5127 13.7002 13.7C13.3102 14.09 13.3102 14.72 13.7002 15.11L18.5902 20L13.7002 24.89C13.3102 25.28 13.3102 25.91 13.7002 26.3C14.0902 26.69 14.7202 26.69 15.1102 26.3L20.0002 21.41L24.8902 26.3C25.2802 26.69 25.9102 26.69 26.3002 26.3C26.6902 25.91 26.6902 25.28 26.3002 24.89L21.4102 20L26.3002 15.11C26.6802 14.73 26.6802 14.09 26.3002 13.71Z" fill="#BB4D6A"/>
+</svg>

public/assets/svg/clear.svg

@@ -0,0 +1,4 @@
+<svg width="35" height="35" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="12" cy="12" r="12" fill="#F5F5F5"/>
+<path d="M13.0528 5.25134C9.23531 5.14634 6.10781 8.21384 6.10781 12.0013H4.76531C4.42781 12.0013 4.26281 12.4063 4.50281 12.6388L6.59531 14.7313C6.74531 14.8813 6.97781 14.8813 7.12781 14.7313L9.22031 12.6388C9.45281 12.4063 9.28781 12.0013 8.95031 12.0013H7.60781C7.60781 9.07634 9.99281 6.71384 12.9328 6.75134C15.7228 6.78884 18.0703 9.13634 18.1078 11.9263C18.1453 14.8588 15.7828 17.2513 12.8578 17.2513C11.9203 17.2513 11.0428 16.9963 10.2778 16.5688C9.98531 16.4038 9.62531 16.4638 9.39281 16.7038C9.04781 17.0488 9.11531 17.6413 9.54281 17.8813C10.5253 18.4288 11.6503 18.7513 12.8578 18.7513C16.6453 18.7513 19.7128 15.6238 19.6078 11.8063C19.5103 8.28884 16.5703 5.34884 13.0528 5.25134Z" fill="#8D8D8D"/>
+</svg>

public/assets/svg/collapse.svg

@@ -0,0 +1,3 @@
+<svg width="15" height="9" viewBox="0 0 15 9" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M1.46484 7.19141L7.46484 1.19141L13.4648 7.19141" stroke="#0348A8" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

public/assets/svg/crossIcon.svg

@@ -0,0 +1,3 @@
+<svg width="22" height="23" viewBox="0 0 22 23" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M19.1604 0.568359L10.9927 8.73414L2.82691 0.568359L0.10498 3.29029L8.27076 11.4561L0.10498 19.6218L2.82691 22.3438L10.9927 14.178L19.1604 22.3438L21.8823 19.6218L13.7165 11.4561L21.8823 3.29029L19.1604 0.568359Z" fill="#0348A8"/>
+</svg>

public/assets/svg/draw-cursor.svg

@@ -0,0 +1,4 @@
+<svg width="25" height="25" viewBox="0 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="12.832" cy="12.6328" r="12" fill="#F7A915"/>
+<path d="M12.834 3.76953L12.834 21.9905" stroke="black" stroke-opacity="0.5" stroke-linecap="round" stroke-dasharray="3 3"/>
+</svg>

public/assets/svg/eraser-cursor.svg

@@ -0,0 +1,6 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="0.9375" width="23" height="23" fill="white"/>
+<rect x="0.5" y="0.9375" width="23" height="23" stroke="black"/>
+<path d="M12.1367 3.52344L12.1367 22.1211" stroke="black" stroke-opacity="0.5" stroke-linecap="round" stroke-dasharray="3 3"/>
+<path d="M2.83594 12.8242H21.4336" stroke="black" stroke-opacity="0.5" stroke-linecap="round" stroke-dasharray="3 3"/>
+</svg>

public/assets/svg/gallery-icon.svg

@@ -0,0 +1,5 @@
+
+<svg width="40" height="41" viewBox="0 0 40 41" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="20" cy="20.5586" r="20" fill="#73BFE1"/>
+<path d="M23.75 18.6465C23.75 18.9449 23.6315 19.231 23.4205 19.442C23.2095 19.653 22.9234 19.7715 22.625 19.7715C22.3266 19.7715 22.0405 19.653 21.8295 19.442C21.6185 19.231 21.5 18.9449 21.5 18.6465C21.5 18.3481 21.6185 18.062 21.8295 17.851C22.0405 17.64 22.3266 17.5215 22.625 17.5215C22.9234 17.5215 23.2095 17.64 23.4205 17.851C23.6315 18.062 23.75 18.3481 23.75 18.6465ZM29.75 14.5215V26.5215V28.0215C29.75 28.4193 29.592 28.8008 29.3107 29.0821C29.0294 29.3634 28.6478 29.5215 28.25 29.5215H11.75C11.3522 29.5215 10.9706 29.3634 10.6893 29.0821C10.408 28.8008 10.25 28.4193 10.25 28.0215V25.0215V14.5215C10.25 14.1237 10.408 13.7421 10.6893 13.4608C10.9706 13.1795 11.3522 13.0215 11.75 13.0215H28.25C28.6478 13.0215 29.0294 13.1795 29.3107 13.4608C29.592 13.7421 29.75 14.1237 29.75 14.5215ZM28.25 24.7121V14.5215H11.75V23.2121L15.1906 19.7715C15.473 19.4932 15.8536 19.3373 16.25 19.3373C16.6464 19.3373 17.027 19.4932 17.3094 19.7715L21.5 23.9621L23.4406 22.0215C23.723 21.7432 24.1036 21.5873 24.5 21.5873C24.8964 21.5873 25.277 21.7432 25.5594 22.0215L28.25 24.7121Z" fill="white"/>
+</svg>

public/assets/svg/help_icon.svg

@@ -0,0 +1,4 @@
+<svg width="40" height="41" viewBox="0 0 40 41" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="20" cy="20.9062" r="20" fill="#472DAC"/>
+<path d="M15.4956 16.4422C14.7066 16.1069 14.3713 15.1305 14.8447 14.4205C15.8013 13.0003 17.3989 11.9648 19.5094 11.9648C21.8269 11.9648 23.4147 13.0201 24.2234 14.3416C24.9137 15.4757 25.3181 17.596 24.253 19.1739C23.0695 20.9195 21.9354 21.452 21.324 22.5763C21.176 22.8426 21.0873 23.0595 21.0281 23.5033C20.9393 24.2232 20.3476 24.7854 19.6178 24.7854C18.7599 24.7854 18.0597 24.0457 18.1583 23.1877C18.2175 22.6848 18.3358 22.1621 18.6119 21.669C19.3713 20.2982 20.8309 19.4895 21.679 18.2765C22.5764 17.0043 22.0735 14.6276 19.5291 14.6276C18.3752 14.6276 17.6257 15.2291 17.1622 15.9491C16.8171 16.5112 16.0971 16.6887 15.4956 16.4422ZM21.4916 28.7302C21.4916 29.815 20.604 30.7026 19.5192 30.7026C18.4344 30.7026 17.5468 29.815 17.5468 28.7302C17.5468 27.6453 18.4344 26.7578 19.5192 26.7578C20.604 26.7578 21.4916 27.6453 21.4916 28.7302Z" fill="white"/>
+</svg>

public/assets/svg/leftIcon.svg

@@ -0,0 +1,3 @@
+<svg width="9" height="15" viewBox="0 0 9 15" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7.68115 13.4375L1.68115 7.4375L7.68115 1.4375" stroke="#0348A8" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

public/assets/svg/mute.svg

@@ -0,0 +1,5 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="20" cy="20" r="20" fill="#49B76E"/>
+<path d="M23.5669 27.4035C26.3366 26.1887 28.2778 23.5486 28.2778 20.3361C28.2778 17.1235 26.3366 14.4834 23.5669 13.2686V14.8391C25.4414 15.9275 26.7072 18.0171 26.7072 20.3361C26.7072 22.655 25.4414 24.7446 23.5669 25.833V27.4035Z" fill="white"/>
+<path d="M23.5671 16.4096V24.2624C24.5291 23.3986 25.1377 21.7268 25.1377 20.336C25.1377 18.9453 24.5291 17.2734 23.5671 16.4096ZM14.1438 24.2624H16.2617L21.9966 28.0851V12.5869L16.2617 16.4096H14.1438C13.2776 16.4096 12.5732 17.114 12.5732 17.9802V22.6919C12.5732 23.558 13.2776 24.2624 14.1438 24.2624Z" fill="white"/>
+</svg>

public/assets/svg/pointer.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="12" cy="12" r="12" fill="#D9D9D9"/>
+</svg>

public/assets/svg/reset.svg

@@ -0,0 +1,4 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="20" cy="20" r="19.5" fill="#F59D17" stroke="#F59D17"/>
+<path d="M19.9619 13.6426V10.8526C19.9619 10.4026 19.4219 10.1826 19.1119 10.5026L15.3119 14.2926C15.1119 14.4926 15.1119 14.8026 15.3119 15.0026L19.1019 18.7926C19.4219 19.1026 19.9619 18.8826 19.9619 18.4326V15.6426C23.6919 15.6426 26.6419 19.0626 25.8219 22.9326C25.3519 25.2026 23.5119 27.0326 21.2519 27.5026C17.6819 28.2526 14.5019 25.8026 14.0219 22.4926C13.9519 22.0126 13.5319 21.6426 13.0419 21.6426C12.4419 21.6426 11.9619 22.1726 12.0419 22.7726C12.6619 27.1626 16.8419 30.4126 21.5719 29.4926C24.6919 28.8826 27.2019 26.3726 27.8119 23.2526C28.8019 18.1226 24.9019 13.6426 19.9619 13.6426Z" fill="white"/>
+</svg>

public/assets/svg/rightIcon.svg

@@ -0,0 +1,3 @@
+<svg width="9" height="15" viewBox="0 0 9 15" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M1.09814 13.4375L7.09814 7.4375L1.09814 1.4375" stroke="#0348A8" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

public/assets/svg/tick2.svg

@@ -0,0 +1,4 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="20" cy="20" r="20" fill="#004AAD"/>
+<path d="M16.7999 23.9049L13.2999 20.4049C13.1151 20.2177 12.863 20.1124 12.5999 20.1124C12.3369 20.1124 12.0848 20.2177 11.8999 20.4049C11.5099 20.7949 11.5099 21.4149 11.8999 21.8049L16.0899 25.9949C16.4799 26.3849 17.1099 26.3849 17.4999 25.9949L28.0999 15.4049C28.4899 15.0149 28.4899 14.3949 28.0999 14.0049C27.9151 13.8177 27.663 13.7124 27.3999 13.7124C27.1369 13.7124 26.8848 13.8177 26.6999 14.0049L16.7999 23.9049Z" fill="white"/>
+</svg>

public/assets/top_logo.svg

@@ -0,0 +1,11 @@
+<svg width="148" height="41" viewBox="0 0 148 41" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M86.1816 0V39.6748H97.6575V27.3315H98.0989L103.837 40.5564L115.754 37.9114L106.926 22.0415L113.989 9.25744L102.954 6.61246L97.6575 18.1843V0H86.1816Z" fill="#FDE40D"/>
+<path d="M0.171817 33.3876V16.8932H4.74643V33.3876H0.171817ZM2.46986 14.767C1.78976 14.767 1.2063 14.5415 0.719482 14.0905C0.239827 13.6323 0 13.0846 0 12.4475C0 11.8175 0.239827 11.277 0.719482 10.8259C1.2063 10.3678 1.78976 10.1387 2.46986 10.1387C3.14997 10.1387 3.72985 10.3678 4.20951 10.8259C4.69632 11.277 4.93973 11.8175 4.93973 12.4475C4.93973 13.0846 4.69632 13.6323 4.20951 14.0905C3.72985 14.5415 3.14997 14.767 2.46986 14.767Z" fill="#004AAD"/>
+<path d="M12.9856 23.8518V33.3876H8.41096V16.8932H12.7708V19.8034H12.9641C13.3292 18.844 13.9413 18.0852 14.8004 17.5268C15.6595 16.9612 16.7011 16.6784 17.9253 16.6784C19.0707 16.6784 20.0694 16.929 20.9214 17.4301C21.7733 17.9313 22.4355 18.6472 22.908 19.5778C23.3805 20.5014 23.6167 21.6038 23.6167 22.8853V33.3876H19.0421V23.7014C19.0493 22.692 18.7915 21.9045 18.2689 21.339C17.7463 20.7662 17.0268 20.4799 16.1105 20.4799C15.4948 20.4799 14.9507 20.6123 14.4782 20.8772C14.0129 21.1421 13.6478 21.5287 13.3829 22.037C13.1252 22.5381 12.9927 23.143 12.9856 23.8518Z" fill="#004AAD"/>
+<path d="M35.9956 16.8932V20.3295H26.0624V16.8932H35.9956ZM28.3175 12.9414H32.8921V28.319C32.8921 28.7414 32.9566 29.0707 33.0854 29.307C33.2143 29.536 33.3933 29.6971 33.6224 29.7902C33.8586 29.8833 34.1307 29.9298 34.4385 29.9298C34.6533 29.9298 34.868 29.9119 35.0828 29.8761C35.2976 29.8331 35.4622 29.8009 35.5768 29.7795L36.2963 33.1836C36.0672 33.2552 35.745 33.3375 35.3298 33.4306C34.9146 33.5308 34.4099 33.5916 33.8157 33.6131C32.7132 33.6561 31.7467 33.5093 30.9163 33.1728C30.093 32.8364 29.4522 32.3138 28.9941 31.605C28.5359 30.8963 28.3104 30.0014 28.3175 28.9204V12.9414Z" fill="#004AAD"/>
+<path d="M46.3153 33.7098C44.6186 33.7098 43.1582 33.3661 41.934 32.6789C40.717 31.9844 39.7791 31.0037 39.1205 29.7365C38.4619 28.4622 38.1325 26.9552 38.1325 25.2156C38.1325 23.5189 38.4619 22.0298 39.1205 20.7483C39.7791 19.4669 40.7062 18.4682 41.9018 17.7523C43.1045 17.0364 44.5148 16.6784 46.1328 16.6784C47.2209 16.6784 48.2339 16.8538 49.1718 17.2046C50.1168 17.5483 50.94 18.0673 51.6416 18.7617C52.3504 19.4561 52.9016 20.3295 53.2954 21.3819C53.6891 22.4271 53.886 23.6513 53.886 25.0545V26.3109H39.9581V23.4759H49.5798C49.5798 22.8173 49.4366 22.2338 49.1503 21.7256C48.8639 21.2173 48.4666 20.8199 47.9583 20.5336C47.4572 20.2401 46.8737 20.0933 46.2079 20.0933C45.5135 20.0933 44.8978 20.2544 44.3609 20.5765C43.8311 20.8915 43.4159 21.3175 43.1152 21.8544C42.8145 22.3842 42.6606 22.9748 42.6535 23.6263V26.3216C42.6535 27.1378 42.8038 27.8429 43.1045 28.4371C43.4123 29.0313 43.8455 29.4895 44.4039 29.8117C44.9623 30.1338 45.6245 30.2949 46.3905 30.2949C46.8988 30.2949 47.3641 30.2233 47.7865 30.0801C48.2089 29.937 48.5704 29.7222 48.8711 29.4358C49.1718 29.1495 49.4009 28.7987 49.5584 28.3834L53.7893 28.6626C53.5746 29.6792 53.1343 30.5669 52.4685 31.3258C51.8099 32.0775 50.9579 32.6645 49.9127 33.0869C48.8747 33.5021 47.6755 33.7098 46.3153 33.7098Z" fill="#004AAD"/>
+<path d="M56.8713 33.3876V16.8932H61.3063V19.7711H61.4781C61.7788 18.7474 62.2835 17.9742 62.9923 17.4516C63.701 16.9218 64.5171 16.657 65.4407 16.657C65.6697 16.657 65.9167 16.6713 66.1816 16.6999C66.4465 16.7286 66.6792 16.7679 66.8796 16.818V20.8772C66.6648 20.8128 66.3677 20.7555 65.9883 20.7054C65.6089 20.6553 65.2617 20.6302 64.9467 20.6302C64.2737 20.6302 63.6724 20.777 63.1426 21.0705C62.62 21.3569 62.2048 21.7578 61.8969 22.2732C61.5963 22.7887 61.4459 23.3829 61.4459 24.0558V33.3876H56.8713Z" fill="#004AAD"/>
+<path d="M73.4758 33.699C72.4234 33.699 71.4855 33.5165 70.6623 33.1514C69.839 32.7791 69.1875 32.2314 68.7078 31.5084C68.2354 30.7781 67.9991 29.8689 67.9991 28.7808C67.9991 27.8644 68.1673 27.0948 68.5038 26.472C68.8403 25.8492 69.2985 25.348 69.8783 24.9686C70.4582 24.5892 71.1169 24.3028 71.8542 24.1095C72.5988 23.9162 73.3791 23.7802 74.1952 23.7014C75.1545 23.6012 75.9277 23.5082 76.5148 23.4222C77.1018 23.3292 77.5278 23.1932 77.7927 23.0142C78.0575 22.8352 78.19 22.5703 78.19 22.2195V22.1551C78.19 21.475 77.9752 20.9488 77.5457 20.5765C77.1233 20.2043 76.5219 20.0181 75.7416 20.0181C74.9183 20.0181 74.2633 20.2007 73.7764 20.5658C73.2896 20.9237 72.9675 21.3748 72.81 21.9188L68.579 21.5752C68.7938 20.573 69.2161 19.7067 69.8461 18.9765C70.4761 18.2391 71.2887 17.6735 72.2838 17.2798C73.286 16.8789 74.4458 16.6784 75.7631 16.6784C76.6794 16.6784 77.5564 16.7858 78.394 17.0006C79.2388 17.2154 79.9869 17.5483 80.6384 17.9993C81.297 18.4503 81.816 19.0302 82.1955 19.7389C82.5749 20.4405 82.7646 21.2817 82.7646 22.2625V33.3876H78.4262V31.1003H78.2974C78.0325 31.6157 77.6781 32.0703 77.2342 32.4641C76.7904 32.8507 76.257 33.1549 75.6342 33.3769C75.0114 33.5916 74.2919 33.699 73.4758 33.699ZM74.7859 30.5419C75.4588 30.5419 76.053 30.4095 76.5685 30.1446C77.0839 29.8725 77.4884 29.5074 77.7819 29.0492C78.0754 28.5911 78.2222 28.072 78.2222 27.4921V25.7418C78.079 25.8348 77.8821 25.9207 77.6316 25.9995C77.3882 26.0711 77.1125 26.1391 76.8047 26.2035C76.4969 26.2608 76.189 26.3145 75.8812 26.3646C75.5734 26.4076 75.2942 26.4469 75.0436 26.4827C74.5067 26.5615 74.0377 26.6868 73.6368 26.8586C73.2359 27.0304 72.9245 27.2631 72.7026 27.5566C72.4807 27.8429 72.3697 28.2009 72.3697 28.6304C72.3697 29.2533 72.5952 29.7293 73.0462 30.0587C73.5044 30.3808 74.0843 30.5419 74.7859 30.5419Z" fill="#004AAD"/>
+<path d="M127.069 14.6403V18.5547H115.754V14.6403H127.069ZM118.323 10.1387H123.534V27.6558C123.534 28.137 123.607 28.5121 123.754 28.7812C123.901 29.0422 124.105 29.2257 124.366 29.3317C124.635 29.4377 124.945 29.4907 125.295 29.4907C125.54 29.4907 125.785 29.4703 126.029 29.4295C126.274 29.3806 126.462 29.3439 126.592 29.3194L127.412 33.1972C127.151 33.2787 126.784 33.3725 126.311 33.4785C125.838 33.5927 125.263 33.662 124.586 33.6865C123.33 33.7354 122.229 33.5682 121.283 33.185C120.345 32.8017 119.615 32.2063 119.093 31.399C118.571 30.5916 118.315 29.5722 118.323 28.3408V10.1387Z" fill="#004AAD"/>
+<path d="M138.751 33.7966C136.851 33.7966 135.208 33.3929 133.822 32.5856C132.443 31.77 131.379 30.6365 130.629 29.1849C129.879 27.7251 129.503 26.0329 129.503 24.1083C129.503 22.1674 129.879 20.4712 130.629 19.0196C131.379 17.5598 132.443 16.4262 133.822 15.6189C135.208 14.8034 136.851 14.3956 138.751 14.3956C140.651 14.3956 142.291 14.8034 143.669 15.6189C145.055 16.4262 146.123 17.5598 146.874 19.0196C147.624 20.4712 147.999 22.1674 147.999 24.1083C147.999 26.0329 147.624 27.7251 146.874 29.1849C146.123 30.6365 145.055 31.77 143.669 32.5856C142.291 33.3929 140.651 33.7966 138.751 33.7966ZM138.776 29.7598C139.64 29.7598 140.362 29.5152 140.941 29.0259C141.52 28.5284 141.956 27.8515 142.25 26.9952C142.552 26.139 142.702 25.1644 142.702 24.0716C142.702 22.9789 142.552 22.0043 142.25 21.148C141.956 20.2918 141.52 19.6149 140.941 19.1174C140.362 18.62 139.64 18.3712 138.776 18.3712C137.903 18.3712 137.169 18.62 136.574 19.1174C135.987 19.6149 135.542 20.2918 135.24 21.148C134.947 22.0043 134.8 22.9789 134.8 24.0716C134.8 25.1644 134.947 26.139 135.24 26.9952C135.542 27.8515 135.987 28.5284 136.574 29.0259C137.169 29.5152 137.903 29.7598 138.776 29.7598Z" fill="#004AAD"/>
+</svg>

public/config.js

@@ -0,0 +1,4 @@
+window.APP_CONFIG = {
+  PUBLIC_GAME_DU_API_URL: "https://game-du.teachertrainingkolkata.in",
+  siteName: "Interakto Games"
+};

public/galleryFunction.js

@@ -0,0 +1,45 @@
+      const jsonData = [
+        {
+            "src": "/assets/back.jpeg",
+            "title": "Image Title 1",
+            "description": "Description for image 1 goes here."
+        },
+        {
+            "src": "/assets/background.jpg",
+            "title": "Image Title 2",
+            "description": "Description for image 2 goes here."
+        },
+        {
+            "src": "/assets/backgroundImage.png",
+            "title": "Image Title 3",
+            "description": "Description for image 3 goes here."
+        },
+        {
+            "src": "/assets/beanieImage.png",
+            "title": "Image Title 4",
+            "description": "Description for image 4 goes here."
+        }
+    ];
+    let currentSlide = 0;
+    function updateSlide(){
+        const slide = jsonData[currentSlide];
+        document.getElementById('slideImage').src = slide.src;
+        document.getElementById('imageTitle').textContent = slide.title;
+        document.getElementById('imageDescription').textContent = slide.description;
+    }
+    document.getElementById('nextButton').addEventListener('click', () => {
+        currentSlide = (currentSlide + 1) % jsonData.length;
+        console.log(currentSlide)
+        updateSlide();
+    })
+    document.getElementById('prevButton').addEventListener('click', () => {
+        currentSlide = (currentSlide - 1 + jsonData.length) % jsonData.length;
+        updateSlide();
+    })
+    updateSlide();
+    let parentMainContainer = document.getElementById('parentMainContainer');
+    let gallerySliderId = document.getElementById('gallerySliderId');
+    function closeGallery(){
+        gallerySliderId.classList.add('hidden');
+        
+    }

public/saveGameAI.js

@@ -0,0 +1,353 @@
+    function retryGame(){
+        window.location.reload();
+    }
+    const queryString = window.location.search;
+    const urlParams = new URLSearchParams(queryString);
+    const childId = urlParams.get('childId');
+    const schoolId = urlParams.get('schoolId');
+    const gameVersion = urlParams.get('gameName');
+    const gameId = urlParams.get('id');
+    const spriteName = urlParams.get('spriteName');
+    const assignmentId = urlParams.get('assignmentId');
+    const worksheetId = urlParams.get('worksheetId');
+    let submitNotic;
+    let startTime = Date.now();
+    // console.log('gameVersion', gameVersion)
+
+    const url = window.location.href;
+    const gameName = url.split('/');
+    const gameType = gameName[3].split('?id=');
+    // let gameVersion;
+    // if(gameType[0] == "guided-tracing"){
+    //     gameVersion = gameType[0].split('?')[0];
+    //     gameId = gameName[4];
+    //     console.log('Type - 1');
+
+    // } else if(gameName.length == 4){
+    //     gameVersion = gameName[3].split('?')[0];
+    //     gameId = urlParams.get('id');
+    // }
+    // else if(gameName.length == 5){
+    //     gameVersion = gameName[3] + '-' + gameName[4].split('?')[0];
+    //     gameId = urlParams.get('id');
+    //     console.log('Type - 2');
+    // }else if(gameName.length == 6){
+    //     gameVersion = gameType[0] + '-' + gameName[4];
+    //     gameId = urlParams.get('id');
+    //     console.log('Type - 3');
+    // }
+    // console.log("Here is game name ", gameType[0])
+
+    // console.log(gameVersion)
+    let imageCode;
+    let gameScore;
+    let timeDifferenceInSeconds;
+
+    // if(scoreTotal){
+    //     gameScore = scoreTotal;
+    // }else{
+    //     gameScore = 0;
+    // }
+
+
+function submitUserData(drawingZone) {
+    submitButton.setVisible(false);
+    galleryButton.setVisible(false);
+    customCursor.setVisible(false);
+    snapshotButton.setVisible(false);
+    if(!gameType[0] === 'guided-tracing'){
+        snapshotButton.setVisible(false);
+        customCursor.setVisible(false);
+        galleryButton.setVisible(false);
+    }
+    muteIcon.setVisible(false);
+    retryButton.setVisible(false);
+    
+    const endTime = Date.now();
+    const timeDifference = endTime - startTime;
+    timeDifferenceInSeconds = timeDifference / 1000;
+    // console.log(`Time difference: ${timeDifferenceInSeconds} seconds`);
+
+
+    // console.log('This is from main point', scoreTotal);
+    drawingZone.renderer.snapshot((image) => {
+        submitButton.setVisible(true);
+        galleryButton.setVisible(true);
+        customCursor.setVisible(true);
+        snapshotButton.setVisible(true);
+        if(!gameType[0] == "guided-tracing"){
+            snapshotButton.setVisible(true);
+            customCursor.setVisible(true);
+            galleryButton.setVisible(true);
+        }
+
+        muteIcon.setVisible(true);
+        retryButton.setVisible(true);
+        
+        if(gameType[0] == 'drawing'){
+            // submitButton.setVisible(true);
+            // snapshotButton.setVisible(true);
+            // customCursor.setVisible(true);
+            // galleryButton.setVisible(true);
+            image.style.width = '160px';
+            image.style.height = '120px';
+            image.style.paddingLeft = '2px';
+            document.body.appendChild(image);
+            // Download the snapshot as an image
+            // const link = document.createElement('a');
+            // link.href = image.src;
+            // link.download = 'my_drawing.png';
+            // link.click();
+            document.body.removeChild(image);
+            imageCode = image.src;
+        }else if( gameType[0] == "guided-tracing"){
+            // submitButton.setVisible(true);
+            // snapshotButton.setVisible(true);
+            // customCursor.setVisible(true);
+            image.style.width = '160px';
+            image.style.height = '120px';
+            image.style.paddingLeft = '2px';
+            document.body.appendChild(image);
+            // Download the snapshot as an image
+            // const link = document.createElement('a');
+            // link.href = image.src;
+            // link.download = `guided-tracing-${gameId}.png`;
+            // link.click();
+            document.body.removeChild(image);
+            imageCode = image.src;
+        }
+        
+        
+    });   
+    
+
+};
+
+    function calculateFromAI(){
+        let progress = 0;
+        let starValue;
+        
+        function progressIncrement() {
+            const interval = setInterval(() => {
+                if (progress >= 100) {
+                    clearInterval(interval);
+                } else {
+                    progress += 10; 
+                    progressBar.style.width = `${progress}%`;
+                }
+            }, 100);
+        }
+        progressIncrement();
+        function addStarScalingStyles() {
+            const style = document.createElement('style');
+            style.innerHTML = `
+                @keyframes scaleUp {
+                    0% {
+                        transform: scale(1.5);
+                    }
+                    100% {
+                        transform: scale(1);
+                    }
+                }
+                .star {
+                    display: inline-block;
+                    transform-origin: center;
+                    transform: scale(0); /* Initial state before animation */
+                    opacity: 0; /* Initial opacity */
+                    animation: scaleUp 0.5s ease forwards;
+                }
+            `;
+            document.head.appendChild(style);
+        }
+        addStarScalingStyles();
+        
+        const starContainer = document.getElementById('star-container');
+        let scoreBoard = document.getElementById('scoreBoard');
+        let loadingMainContainer = document.getElementById('loadingMainContainer');
+        loadingMainContainer.style.display = 'flex';
+
+        const loadingDiv = document.getElementById('loadingState');
+        loadingDiv.style.display = 'flex';
+
+        const containerDiv = document.createElement('div');
+        containerDiv.classList.add('w-full');
+        containerDiv.style.display = 'flex';
+        containerDiv.style.flexDirection = 'column';
+        containerDiv.style.justifyContent = 'center';
+        containerDiv.style.alignItems = 'center';
+
+        const paragraph = document.createElement('p');
+        paragraph.textContent = 'HOLD ON.';
+        paragraph.style.fontSize = '16px';
+        paragraph.style.fontWeight = '600';
+        paragraph.style.color = 'rgba(0, 0, 0, 0.38)';
+        containerDiv.appendChild(paragraph);
+
+        const progressBarContainer = document.createElement('div');
+        progressBarContainer.style.position = 'relative';
+        progressBarContainer.style.display = 'flex';
+        progressBarContainer.style.alignItems = 'center';
+        progressBarContainer.style.border = '1px solid #AFB8E6';
+        progressBarContainer.style.height = '10px'; 
+        progressBarContainer.style.width = '100%';
+        progressBarContainer.style.marginTop = '30px';
+        progressBarContainer.style.marginBottom = '30px';
+        containerDiv.appendChild(progressBarContainer);
+
+        const progressBar = document.createElement('div');
+        progressBar.style.height = '10px';
+        progressBar.style.backgroundColor = '#D7DCF2';
+        progressBar.style.width = '0%';
+        progressBarContainer.appendChild(progressBar);
+
+        loadingDiv.appendChild(containerDiv);
+
+        const calculationText = document.createElement('p');
+        calculationText.textContent = 'Your stars are being calculated...';
+        calculationText.style.fontSize = '14px';
+        calculationText.style.fontWeight = '600';
+        calculationText.style.color = 'rgba(0, 0, 0, 0.38)';
+        containerDiv.appendChild(calculationText);
+        let userDataForStar = {
+            gameName: gameVersion,
+            childId: childId,
+            gameID: gameId,
+            gameTime: timeDifferenceInSeconds,
+            screenShot: imageCode
+        };
+        
+        // First API call
+        fetch(`https://ai-image-api.cs1.hz.siliconpin.com/bs_drawing`, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json'
+            },
+            body: JSON.stringify(userDataForStar)
+        })
+        .then(response => {
+            if (!response.ok) {
+                throw new Error(`HTTP error! status: ${response.status}`);
+            }
+            return response.json();
+        })
+        .then(data => {
+            console.log('response from', data)
+            setTimeout(() => {
+                if (data && data.message === "Game data saved successfully") {
+                    let starValue = data.gameStar; // Ensure starValue is available
+        
+                    let feedbackMessage = '';
+                    if (starValue >= 1 && starValue <= 3) {
+                        feedbackMessage = "You're making progress! Let's keep going!";
+                    } else if (starValue >= 4 && starValue <= 6) {
+                        feedbackMessage = "Nice work! You're improving every day!";
+                    } else if (starValue >= 7 && starValue <= 8) {
+                        feedbackMessage = "Amazing work! Keep it up!";
+                    } else if (starValue >= 9 && starValue <= 10) {
+                        feedbackMessage = "Outstanding! You're a true superstar!";
+                    } else {
+                        feedbackMessage = "Invalid star value.";
+                    }
+        
+                    loadingMainContainer.style.display = 'none';
+                    loadingDiv.style.display = 'none';
+                    starContainer.style.display = 'flex';
+                    starContainer.style.flexDirection = 'row';
+                    document.getElementById('get-star-value').innerHTML = starValue;
+                    document.getElementById('starFeedbackMessage').innerHTML = feedbackMessage;
+                    scoreBoard.style.display = 'flex';
+        
+                    if (scoreBoard.style.display === 'flex') {
+                        const bottomAnimateClipart = document.getElementById('bottomAnimateClipart');
+                        bottomAnimateClipart.classList.remove('hidden');
+                        bottomAnimateClipart.classList.add('-translate-x-full', 'transition-transform', 'duration-700');
+                        setTimeout(() => {
+                            bottomAnimateClipart.classList.add('hidden');
+                            bottomAnimateClipart.classList.remove('translate-x-full');
+                        }, 100);
+                    }
+        
+                    // ✅ Now create `userData` inside the correct scope where starValue exists
+                    let userData = {
+                        gameName: gameVersion.trim(),
+                        gameID: gameId,
+                        screenShot: imageCode,
+                        childId: childId,
+                        gameTime: timeDifferenceInSeconds,
+                        gameStar: starValue // ✅ Now correctly assigned
+                    };
+        
+                    // ✅ Now perform the second fetch request
+                    fetch(`https://api.teachertrainingkolkata.in/api/saveGalleryImage`, {
+                        method: 'POST',
+                        headers: {
+                            'Content-Type': 'application/json'
+                        },
+                        body: JSON.stringify(userData)
+                    })
+                    .then(response => response.json())
+                    .then(data => {
+                        if (data.screenshotUrl) {
+                            fetch(`https://api.teachertrainingkolkata.in/api/saveGameScore2`, {
+                                method: 'POST',
+                                headers: {
+                                    'Content-Type': 'application/json'
+                                },
+                                body: JSON.stringify(userData)
+                            })
+                            .then(response => {
+                                setTimeout(() => {
+                                    if (response.ok && response.status == 200) {
+                                        document.getElementById('saved-toast').classList.remove('hidden');
+                                        setTimeout(() => {
+                                            document.getElementById('saved-toast').classList.add('hidden');
+                                        }, 2000);
+                                    }
+                                }, 100);
+                            })
+                            .catch(error => {
+                                console.error('An error occurred', error);
+                            });
+        
+                            // Final API Call
+                            const userAnotherData = {
+                                assignmentId: assignmentId,
+                                worksheetId: worksheetId,
+                                studentId: childId,
+                                schoolId: schoolId,
+                                submissionFile: data.screenshotUrl.split('/')[4].split('?')[0],
+                            };
+                            const authToken = 'Bearer eyJhbGciOiJSUzUxMiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImlkZW50aXR5SWQiOiI2NjNjNGMzNjRiNmYzZjU0YmExZjcxMTUiLCJfaWQiOiI2NjNjNGMzNjBiOWYyZDk5MGQyNWYwYjMiLCJ0eXBlIjoiQUtBREVNWSIsImRldmljZUlkIjoiMDBqNXJtODl5b3BvNjh1a2Yyb2c5cTdoIn0sImlhdCI6MTczNjM5ODkwNCwiZXhwIjoxNzM3MDAzNzA0LCJpc3MiOiJidXp6T25lIn0.vhH0zTkVisnbK6n5aPgV3RrtmpP095Gtz6ayUc29XerEV-XPVhYwg06JQnm2FWGPtadEJ2Ea5z6_YNp5Kz9DENL9LxpYYuXRUOGvMEaVM5YZOYQ88viqxM7SIvxElIsc8cQeJr5v-4ov4MyOuXws7R5MDDO2PuzYdwaA52GXbQ0LO3aFGOQL7nWPKVYqFWCQe_T-1JphbsGStHivcmUy8_DAdjs0VpXFJKiQm6jcWQO3j3uOUJSi14af4ZvrUPkjIT92OOHiZTL7CUbbFt4yktnw3Gm2Fv6lS5pamSJpVJnGJQ6ebjd70IXnE49Mn9IK9AssnjTBh2DaNeVc0C1z9Q';
+        
+                            fetch(`https://preschool-curriculum.in/api/one/v1/akademy/worksheet/submissions`, {
+                                method: 'POST',
+                                headers: {
+                                    'Content-Type': 'application/json',
+                                    'Authorization': authToken
+                                },
+                                body: JSON.stringify(userAnotherData)
+                            })
+                            .then(response => response.json())
+                            .then(data => {
+                                console.log('Submission API response', data);
+                            })
+                            .catch(error => {
+                                console.error('An error occurred', error);
+                            });
+                        }
+                    })
+                    .catch(error => {
+                        console.error('An error occurred', error);
+                    });
+                }
+            }, 150);
+        })
+        .catch(error => {
+            console.error('An error occurred', error);
+        });        
+    }
+
+
+
+
+

public/saveGameData copy 2.js

@@ -0,0 +1,243 @@
+function retryGame(){
+    window.location.reload();
+}
+ 
+const queryString = window.location.search;
+const urlParams = new URLSearchParams(queryString);
+const userId = urlParams.get('childId');
+const gameVersion = urlParams.get('gameName');
+const gameId = urlParams.get('id');
+let submitNotic;
+
+// console.log(userId);
+let startTime = Date.now();
+
+
+const url = window.location.href;
+const gameName = url.split('/');
+const gameType = gameName[3].split('?id=');
+// let gameVersion;
+
+// console.log("Here is game name ", gameType[0])
+
+// if(gameType[0] == "guided-tracing"){
+//     gameVersion = gameType[0].split('?')[0];
+//     gameId = gameName[4];
+//     console.log('Type - 1');
+
+// } else if(gameName.length == 4){
+//     gameVersion = gameName[3].split('?')[0];
+//     gameId = urlParams.get('id');
+// }
+// else if(gameName.length == 5){
+//     gameVersion = gameName[3] + '-' + gameName[4].split('?')[0];
+//     gameId = urlParams.get('id');
+//     console.log('Type - 2');
+// }else if(gameName.length == 6){
+//     gameVersion = gameType[0] + '-' + gameName[4];
+//     gameId = urlParams.get('id');
+//     console.log('Type - 3');
+// }
+
+console.log(gameVersion)
+
+function submitUserData(drawingZone) {
+    const endTime = Date.now();
+    const timeDifference = endTime - startTime;
+    const timeDifferenceInSeconds = timeDifference / 1000;
+    // console.log(`Time difference: ${timeDifferenceInSeconds} seconds`);
+
+    let imageCode;
+    let gameScore;
+
+    if(scoreTotal){
+        gameScore = scoreTotal;
+    }else{
+        gameScore = 0;
+    }
+    // console.log('This is from main point', scoreTotal);
+    drawingZone.renderer.snapshot((image) => {
+        if(gameType[0] == 'drawing'){
+            submitButton.setVisible(true);
+            snapshotButton.setVisible(true);
+            customCursor.setVisible(true);
+            image.style.width = '160px';
+            image.style.height = '120px';
+            image.style.paddingLeft = '2px';
+            document.body.appendChild(image);
+            // Download the snapshot as an image
+            // const link = document.createElement('a');
+            // link.href = image.src;
+            // link.download = 'my_drawing.png';
+            // link.click();
+            document.body.removeChild(image);
+            imageCode = image.src;
+        }else if( gameType[0] == "guided-tracing"){
+            // submitButton.setVisible(true);
+            // snapshotButton.setVisible(true);
+            // customCursor.setVisible(true);
+            image.style.width = '160px';
+            image.style.height = '120px';
+            image.style.paddingLeft = '2px';
+            document.body.appendChild(image);
+            // Download the snapshot as an image
+            // const link = document.createElement('a');
+            // link.href = image.src;
+            // link.download = `guided-tracing-${gameId}.png`;
+            // link.click(); 
+            document.body.removeChild(image);
+            imageCode = image.src;
+        }
+        let starValue;
+        if(scoreTotal === maxScore){
+            starValue = 5;
+        } else if(scoreTotal === maxScore - 1){
+            starValue = 4;
+        } else{
+            starValue = 3;
+        }
+        let maxStarValue = 10;
+        let progress = 0;
+        let feedbackMessage; starValue === 5 ? feedbackMessage = `Fantastic! You earned ${starValue} stars! <br> Keep up the amazing work – you're a superstar!` : starValue === 4 ? feedbackMessage = `Great job! ${starValue} stars – you're so close to <br> perfection! ` : starValue === 3 ? feedbackMessage = `Well done! ${starValue} stars for your effort! <br> Keep pushing, you’ve got this!` : '';
+        
+        function progressIncrement() {
+            const interval = setInterval(() => {
+                if (progress >= 100) {
+                    clearInterval(interval);
+                } else {
+                    progress += 10; 
+                    progressBar.style.width = `${progress}%`;
+                }
+            }, 100);
+        }
+        progressIncrement();
+        function addStarScalingStyles() {
+            const style = document.createElement('style');
+            style.innerHTML = `
+                @keyframes scaleUp {
+                    0% {
+                        transform: scale(1.5);
+                    }
+                    100% {
+                        transform: scale(1);
+                    }
+                }
+                .star {
+                    display: inline-block;
+                    transform-origin: center;
+                    transform: scale(0); /* Initial state before animation */
+                    opacity: 0; /* Initial opacity */
+                    animation: scaleUp 0.5s ease forwards;
+                }
+            `;
+            document.head.appendChild(style);
+        }
+        addStarScalingStyles();
+        const blankStar = `<svg width="48" height="48" viewBox="0 0 61 58" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M60.0193 21.917C59.8274 21.3224 59.4648 20.7975 58.9767 20.4076C58.4885 20.0177 57.8964 19.7801 57.2741 19.7244L39.9564 18.1518L33.1086 2.12366C32.6035 0.949062 31.4537 0.188965 30.176 0.188965C28.8984 0.188965 27.7484 0.94918 27.2436 2.12659L20.3957 18.1519L3.07528 19.7244C2.45372 19.7813 1.86254 20.0194 1.37503 20.4092C0.887526 20.799 0.525135 21.3232 0.332789 21.917C-0.0622597 23.132 0.302554 24.4646 1.26527 25.3046L14.3555 36.7846L10.4954 53.7878C10.213 55.038 10.6982 56.3304 11.7355 57.0801C12.293 57.483 12.9454 57.6881 13.6032 57.6881C14.1704 57.6881 14.7329 57.5352 15.238 57.2331L30.176 48.305L45.1087 57.2331C46.2014 57.8905 47.5788 57.8304 48.6139 57.0801C49.1206 56.7134 49.5083 56.2057 49.7288 55.6204C49.9492 55.035 49.9928 54.3977 49.854 53.7878L45.9941 36.7846L59.0841 25.307C59.555 24.8957 59.8947 24.3552 60.0609 23.7525C60.2272 23.1498 60.2127 22.5115 60.0193 21.917Z" fill="#E3E3E3"/></svg>`
+        
+        const starSVG = `<svg width="48" height="48" viewBox="0 0 61 58" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M60.0193 21.917C59.8274 21.3224 59.4648 20.7975 58.9767 20.4076C58.4885 20.0177 57.8964 19.7801 57.2741 19.7244L39.9564 18.1518L33.1086 2.12366C32.6035 0.949062 31.4537 0.188965 30.176 0.188965C28.8984 0.188965 27.7484 0.94918 27.2436 2.12659L20.3957 18.1519L3.07528 19.7244C2.45372 19.7813 1.86254 20.0194 1.37503 20.4092C0.887526 20.799 0.525135 21.3232 0.332789 21.917C-0.0622597 23.132 0.302554 24.4646 1.26527 25.3046L14.3555 36.7846L10.4954 53.7878C10.213 55.038 10.6982 56.3304 11.7355 57.0801C12.293 57.483 12.9454 57.6881 13.6032 57.6881C14.1704 57.6881 14.7329 57.5352 15.238 57.2331L30.176 48.305L45.1087 57.2331C46.2014 57.8905 47.5788 57.8304 48.6139 57.0801C49.1206 56.7134 49.5083 56.2057 49.7288 55.6204C49.9492 55.035 49.9928 54.3977 49.854 53.7878L45.9941 36.7846L59.0841 25.307C59.555 24.8957 59.8947 24.3552 60.0609 23.7525C60.2272 23.1498 60.2127 22.5115 60.0193 21.917Z" fill="#FECE00"/></svg>`;
+        const starContainer = document.getElementById('star-container');
+        let scoreBoard = document.getElementById('scoreBoard');
+        let loadingMainContainer = document.getElementById('loadingMainContainer');
+        loadingMainContainer.style.display = 'flex';
+
+        const loadingDiv = document.getElementById('loadingState');
+        loadingDiv.style.display = 'flex';
+
+        const containerDiv = document.createElement('div');
+        containerDiv.classList.add('w-full');
+        containerDiv.style.display = 'flex';
+        containerDiv.style.flexDirection = 'column';
+        containerDiv.style.justifyContent = 'center';
+        containerDiv.style.alignItems = 'center';
+
+        const paragraph = document.createElement('p');
+        paragraph.textContent = 'HOLD ON.';
+        paragraph.style.fontSize = '16px';
+        paragraph.style.fontWeight = '600';
+        paragraph.style.color = 'rgba(0, 0, 0, 0.38)';
+        containerDiv.appendChild(paragraph);
+
+        const progressBarContainer = document.createElement('div');
+        progressBarContainer.style.position = 'relative';
+        progressBarContainer.style.display = 'flex';
+        progressBarContainer.style.alignItems = 'center';
+        progressBarContainer.style.border = '1px solid #AFB8E6';
+        progressBarContainer.style.height = '10px'; 
+        progressBarContainer.style.width = '100%';
+        progressBarContainer.style.marginTop = '30px';
+        progressBarContainer.style.marginBottom = '30px';
+        containerDiv.appendChild(progressBarContainer);
+
+        const progressBar = document.createElement('div');
+        progressBar.style.height = '10px';
+        progressBar.style.backgroundColor = '#D7DCF2';
+        progressBar.style.width = '0%';
+        progressBarContainer.appendChild(progressBar);
+
+        loadingDiv.appendChild(containerDiv);
+
+        const calculationText = document.createElement('p');
+        calculationText.textContent = 'Your stars are being calculated...';
+        calculationText.style.fontSize = '14px';
+        calculationText.style.fontWeight = '600';
+        calculationText.style.color = 'rgba(0, 0, 0, 0.38)';
+        containerDiv.appendChild(calculationText);
+
+        let userData = {
+            'gameName': gameVersion,
+            'gameID': gameId,
+            'screenShot': imageCode,
+            'userId' : userId,
+            'gameTime' : timeDifferenceInSeconds,
+            'score' : scoreTotal,
+            'gameStar' : starValue
+        };
+        console.log(userData);
+        fetch(`https://api.teachertrainingkolkata.in/api/saveGameScore2`, {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json'
+        },
+        body: JSON.stringify(userData)
+        })
+        .then(response => {
+        setTimeout(() => { 
+            if (response.ok) {
+            if (response.status == 200) {
+                loadingMainContainer.style.display = 'none';
+                loadingDiv.style.display = 'none';
+                starContainer.style.display = 'flex';
+                starContainer.style.flexDirection = 'row';
+                document.getElementById('wsSavedImg').classList.remove('-z-10');
+                document.getElementById('starFeedbackMessage').innerHTML = feedbackMessage;
+                for (let i = 0; i < starValue; i++) {
+                    const starDiv = document.createElement('div');
+                    starDiv.innerHTML = starSVG;
+                    starDiv.classList.add('star');
+                    starContainer.appendChild(starDiv);
+                    setTimeout(() => {
+                        starDiv.style.opacity = '1'; 
+                        starDiv.style.animationDelay = `${i * 0.5}s`;
+                    }, i * 500);
+                }
+                for (let i = 0; i < maxStarValue - starValue; i++) {
+                    const starDiv = document.createElement('div');
+                    starDiv.innerHTML = blankStar;
+                    starContainer.appendChild(starDiv);
+                }
+                scoreBoard.style.display = 'flex';
+            }
+            } else {
+            console.log('Something went wrong', response);
+            }
+        }, 100);
+        })
+        .catch(error => {
+        console.error('An error occurred', error);
+        });
+            
+            // Clear the drawing
+            // graphics.clear();
+        });        
+};

public/saveGameData copy.js

@@ -0,0 +1,243 @@
+function retryGame(){
+    window.location.reload();
+}
+ 
+const queryString = window.location.search;
+const urlParams = new URLSearchParams(queryString);
+const userId = urlParams.get('childId');
+const gameVersion = urlParams.get('gameName');
+const gameId = urlParams.get('id');
+let submitNotic;
+
+// console.log(userId);
+let startTime = Date.now();
+
+
+const url = window.location.href;
+const gameName = url.split('/');
+const gameType = gameName[3].split('?id=');
+// let gameVersion;
+
+// console.log("Here is game name ", gameType[0])
+
+// if(gameType[0] == "guided-tracing"){
+//     gameVersion = gameType[0].split('?')[0];
+//     gameId = gameName[4];
+//     console.log('Type - 1');
+
+// } else if(gameName.length == 4){
+//     gameVersion = gameName[3].split('?')[0];
+//     gameId = urlParams.get('id');
+// }
+// else if(gameName.length == 5){
+//     gameVersion = gameName[3] + '-' + gameName[4].split('?')[0];
+//     gameId = urlParams.get('id');
+//     console.log('Type - 2');
+// }else if(gameName.length == 6){
+//     gameVersion = gameType[0] + '-' + gameName[4];
+//     gameId = urlParams.get('id');
+//     console.log('Type - 3');
+// }
+
+console.log(gameVersion)
+
+function submitUserData(drawingZone) {
+    const endTime = Date.now();
+    const timeDifference = endTime - startTime;
+    const timeDifferenceInSeconds = timeDifference / 1000;
+    // console.log(`Time difference: ${timeDifferenceInSeconds} seconds`);
+
+    let imageCode;
+    let gameScore;
+
+    if(scoreTotal){
+        gameScore = scoreTotal;
+    }else{
+        gameScore = 0;
+    }
+    // console.log('This is from main point', scoreTotal);
+    drawingZone.renderer.snapshot((image) => {
+        if(gameType[0] == 'drawing'){
+            submitButton.setVisible(true);
+            snapshotButton.setVisible(true);
+            customCursor.setVisible(true);
+            image.style.width = '160px';
+            image.style.height = '120px';
+            image.style.paddingLeft = '2px';
+            document.body.appendChild(image);
+            // Download the snapshot as an image
+            // const link = document.createElement('a');
+            // link.href = image.src;
+            // link.download = 'my_drawing.png';
+            // link.click();
+            document.body.removeChild(image);
+            imageCode = image.src;
+        }else if( gameType[0] == "guided-tracing"){
+            // submitButton.setVisible(true);
+            // snapshotButton.setVisible(true);
+            // customCursor.setVisible(true);
+            image.style.width = '160px';
+            image.style.height = '120px';
+            image.style.paddingLeft = '2px';
+            document.body.appendChild(image);
+            // Download the snapshot as an image
+            // const link = document.createElement('a');
+            // link.href = image.src;
+            // link.download = `guided-tracing-${gameId}.png`;
+            // link.click();
+            document.body.removeChild(image);
+            imageCode = image.src;
+        }
+        let starValue;
+        if(scoreTotal === maxScore){
+            starValue = 5;
+        } else if(scoreTotal === maxScore - 1){
+            starValue = 4;
+        } else{
+            starValue = 3;
+        }
+        let maxStarValue = 10;
+        let progress = 0;
+        let feedbackMessage; starValue === 5 ? feedbackMessage = `Fantastic! You earned ${starValue} stars! <br> Keep up the amazing work – you're a superstar!` : starValue === 4 ? feedbackMessage = `Great job! ${starValue} stars – you're so close to <br> perfection! ` : starValue === 3 ? feedbackMessage = `Well done! ${starValue} stars for your effort! <br> Keep pushing, you’ve got this!` : '';
+        
+        function progressIncrement() {
+            const interval = setInterval(() => {
+                if (progress >= 100) {
+                    clearInterval(interval);
+                } else {
+                    progress += 10; 
+                    progressBar.style.width = `${progress}%`;
+                }
+            }, 100);
+        }
+        progressIncrement();
+        function addStarScalingStyles() {
+            const style = document.createElement('style');
+            style.innerHTML = `
+                @keyframes scaleUp {
+                    0% {
+                        transform: scale(1.5);
+                    }
+                    100% {
+                        transform: scale(1);
+                    }
+                }
+                .star {
+                    display: inline-block;
+                    transform-origin: center;
+                    transform: scale(0); /* Initial state before animation */
+                    opacity: 0; /* Initial opacity */
+                    animation: scaleUp 0.5s ease forwards;
+                }
+            `;
+            document.head.appendChild(style);
+        }
+        addStarScalingStyles();
+        const blankStar = `<svg width="48" height="48" viewBox="0 0 61 58" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M60.0193 21.917C59.8274 21.3224 59.4648 20.7975 58.9767 20.4076C58.4885 20.0177 57.8964 19.7801 57.2741 19.7244L39.9564 18.1518L33.1086 2.12366C32.6035 0.949062 31.4537 0.188965 30.176 0.188965C28.8984 0.188965 27.7484 0.94918 27.2436 2.12659L20.3957 18.1519L3.07528 19.7244C2.45372 19.7813 1.86254 20.0194 1.37503 20.4092C0.887526 20.799 0.525135 21.3232 0.332789 21.917C-0.0622597 23.132 0.302554 24.4646 1.26527 25.3046L14.3555 36.7846L10.4954 53.7878C10.213 55.038 10.6982 56.3304 11.7355 57.0801C12.293 57.483 12.9454 57.6881 13.6032 57.6881C14.1704 57.6881 14.7329 57.5352 15.238 57.2331L30.176 48.305L45.1087 57.2331C46.2014 57.8905 47.5788 57.8304 48.6139 57.0801C49.1206 56.7134 49.5083 56.2057 49.7288 55.6204C49.9492 55.035 49.9928 54.3977 49.854 53.7878L45.9941 36.7846L59.0841 25.307C59.555 24.8957 59.8947 24.3552 60.0609 23.7525C60.2272 23.1498 60.2127 22.5115 60.0193 21.917Z" fill="#E3E3E3"/></svg>`
+        
+        const starSVG = `<svg width="48" height="48" viewBox="0 0 61 58" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M60.0193 21.917C59.8274 21.3224 59.4648 20.7975 58.9767 20.4076C58.4885 20.0177 57.8964 19.7801 57.2741 19.7244L39.9564 18.1518L33.1086 2.12366C32.6035 0.949062 31.4537 0.188965 30.176 0.188965C28.8984 0.188965 27.7484 0.94918 27.2436 2.12659L20.3957 18.1519L3.07528 19.7244C2.45372 19.7813 1.86254 20.0194 1.37503 20.4092C0.887526 20.799 0.525135 21.3232 0.332789 21.917C-0.0622597 23.132 0.302554 24.4646 1.26527 25.3046L14.3555 36.7846L10.4954 53.7878C10.213 55.038 10.6982 56.3304 11.7355 57.0801C12.293 57.483 12.9454 57.6881 13.6032 57.6881C14.1704 57.6881 14.7329 57.5352 15.238 57.2331L30.176 48.305L45.1087 57.2331C46.2014 57.8905 47.5788 57.8304 48.6139 57.0801C49.1206 56.7134 49.5083 56.2057 49.7288 55.6204C49.9492 55.035 49.9928 54.3977 49.854 53.7878L45.9941 36.7846L59.0841 25.307C59.555 24.8957 59.8947 24.3552 60.0609 23.7525C60.2272 23.1498 60.2127 22.5115 60.0193 21.917Z" fill="#FECE00"/></svg>`;
+        const starContainer = document.getElementById('star-container');
+        let scoreBoard = document.getElementById('scoreBoard');
+        let loadingMainContainer = document.getElementById('loadingMainContainer');
+        loadingMainContainer.style.display = 'flex';
+
+        const loadingDiv = document.getElementById('loadingState');
+        loadingDiv.style.display = 'flex';
+
+        const containerDiv = document.createElement('div');
+        containerDiv.classList.add('w-full');
+        containerDiv.style.display = 'flex';
+        containerDiv.style.flexDirection = 'column';
+        containerDiv.style.justifyContent = 'center';
+        containerDiv.style.alignItems = 'center';
+
+        const paragraph = document.createElement('p');
+        paragraph.textContent = 'HOLD ON.';
+        paragraph.style.fontSize = '16px';
+        paragraph.style.fontWeight = '600';
+        paragraph.style.color = 'rgba(0, 0, 0, 0.38)';
+        containerDiv.appendChild(paragraph);
+
+        const progressBarContainer = document.createElement('div');
+        progressBarContainer.style.position = 'relative';
+        progressBarContainer.style.display = 'flex';
+        progressBarContainer.style.alignItems = 'center';
+        progressBarContainer.style.border = '1px solid #AFB8E6';
+        progressBarContainer.style.height = '10px'; 
+        progressBarContainer.style.width = '100%';
+        progressBarContainer.style.marginTop = '30px';
+        progressBarContainer.style.marginBottom = '30px';
+        containerDiv.appendChild(progressBarContainer);
+
+        const progressBar = document.createElement('div');
+        progressBar.style.height = '10px';
+        progressBar.style.backgroundColor = '#D7DCF2';
+        progressBar.style.width = '0%';
+        progressBarContainer.appendChild(progressBar);
+
+        loadingDiv.appendChild(containerDiv);
+
+        const calculationText = document.createElement('p');
+        calculationText.textContent = 'Your stars are being calculated...';
+        calculationText.style.fontSize = '14px';
+        calculationText.style.fontWeight = '600';
+        calculationText.style.color = 'rgba(0, 0, 0, 0.38)';
+        containerDiv.appendChild(calculationText);
+
+        let userData = {
+            'gameName': gameVersion,
+            'gameID': gameId,
+            'screenShot': imageCode,
+            'userId' : userId,
+            'gameTime' : timeDifferenceInSeconds,
+            'score' : scoreTotal,
+            'gameStar' : starValue
+        };
+        console.log(userData);
+        fetch(`https://api.teachertrainingkolkata.in/api/saveGameScore2`, {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json'
+        },
+        body: JSON.stringify(userData)
+        })
+        .then(response => {
+        setTimeout(() => { 
+            if (response.ok) {
+            if (response.status == 200) {
+                loadingMainContainer.style.display = 'none';
+                loadingDiv.style.display = 'none';
+                starContainer.style.display = 'flex';
+                starContainer.style.flexDirection = 'row';
+                document.getElementById('wsSavedImg').classList.remove('-z-10');
+                document.getElementById('starFeedbackMessage').innerHTML = feedbackMessage;
+                for (let i = 0; i < starValue; i++) {
+                    const starDiv = document.createElement('div');
+                    starDiv.innerHTML = starSVG;
+                    starDiv.classList.add('star');
+                    starContainer.appendChild(starDiv);
+                    setTimeout(() => {
+                        starDiv.style.opacity = '1'; 
+                        starDiv.style.animationDelay = `${i * 0.5}s`;
+                    }, i * 500);
+                }
+                for (let i = 0; i < maxStarValue - starValue; i++) {
+                    const starDiv = document.createElement('div');
+                    starDiv.innerHTML = blankStar;
+                    starContainer.appendChild(starDiv);
+                }
+                scoreBoard.style.display = 'flex';
+            }
+            } else {
+            console.log('Something went wrong', response);
+            }
+        }, 100);
+        })
+        .catch(error => {
+        console.error('An error occurred', error);
+        });
+            
+            // Clear the drawing
+            // graphics.clear();
+        });        
+};