diff --git a/src/pages/media/ModelViewer/index.tsx b/src/pages/media/ModelViewer/index.tsx
index 36d0442..ce75996 100644
--- a/src/pages/media/ModelViewer/index.tsx
+++ b/src/pages/media/ModelViewer/index.tsx
@@ -3,13 +3,14 @@ import { OrbitControls, Stage, useGLTF } from "@react-three/drei";
 
 type ModelViewerProps = {
   fileUrl: string;
+  height?: string;
 };
 
-export const ModelViewer = ({ fileUrl }: ModelViewerProps) => {
+export const ModelViewer = ({ fileUrl, height }: ModelViewerProps) => {
   const { scene } = useGLTF(fileUrl);
 
   return (
-    <Canvas style={{ width: "100%", height: "80vh" }}>
+    <Canvas style={{ width: "100%", height: "400px" }}>
       <ambientLight />
       <directionalLight />
       <Stage environment="city" intensity={0.6}>
diff --git a/src/pages/media/show.tsx b/src/pages/media/show.tsx
index a12e0c6..c5dc884 100644
--- a/src/pages/media/show.tsx
+++ b/src/pages/media/show.tsx
@@ -94,7 +94,7 @@ export const MediaShow = () => {
             src={`${import.meta.env.VITE_KRBL_MEDIA}${
               record?.id
             }/download?token=${token}`}
-            width={"100%px"}
+            width={"100%"}
             height={"80vh"}
           />
         )}
diff --git a/src/pages/sight/edit.tsx b/src/pages/sight/edit.tsx
index a71c7f2..994c9ca 100644
--- a/src/pages/sight/edit.tsx
+++ b/src/pages/sight/edit.tsx
@@ -21,6 +21,8 @@ import { observer } from "mobx-react-lite";
 import { languageStore } from "../../store/LanguageStore";
 import axios from "axios";
 import { LanguageSwitch } from "../../components/LanguageSwitch/index";
+import { ReactPhotoSphereViewer } from "react-photo-sphere-viewer";
+import { ModelViewer } from "../media/ModelViewer";
 
 function a11yProps(index: number) {
   return {
@@ -109,9 +111,11 @@ export const SightEdit = observer(() => {
   });
   const [mediaFile, setMediaFile] = useState<{
     src: string;
+    media_type: number;
     filename: string;
   }>({
     src: "",
+    media_type: 1,
     filename: "",
   });
 
@@ -249,18 +253,20 @@ export const SightEdit = observer(() => {
             src: `${import.meta.env.VITE_KRBL_MEDIA}${
               media.id
             }/download?token=${localStorage.getItem(TOKEN_KEY)}`,
+            media_type: media.media_type,
             filename: media.filename,
           });
-          console.log(media);
         } else {
           setMediaFile({
             src: "",
+            media_type: 1,
             filename: "",
           }); // или другой дефолт
         }
       } catch (error) {
         setMediaFile({
           src: "",
+          media_type: 1,
           filename: "",
         }); // или обработка ошибки
       }
@@ -360,160 +366,6 @@ export const SightEdit = observer(() => {
       </Box>
 
       <CustomTabPanel value={tabValue} index={0}>
-        <Edit
-          saveButtonProps={saveButtonProps}
-          footerButtonProps={{
-            sx: {
-              bottom: 0,
-              left: 0,
-            },
-          }}
-        >
-          <Box
-            sx={{
-              maxWidth: "50%",
-              display: "flex",
-              flexDirection: "column",
-              gap: 2,
-              position: "relative",
-            }}
-          >
-            <Box
-              component="form"
-              sx={{ flex: 1, display: "flex", flexDirection: "column" }}
-              autoComplete="off"
-            >
-              <TextField
-                {...register("name", {
-                  required: "Это поле является обязательным",
-                })}
-                error={!!(errors as any)?.name}
-                helperText={(errors as any)?.name?.message}
-                margin="normal"
-                fullWidth
-                InputLabelProps={{ shrink: true }}
-                type="text"
-                label={"Название *"}
-                name="name"
-              />
-            </Box>
-            <LanguageSwitch />
-            <Box sx={{ mt: 3 }}>
-              <LinkedItems<ArticleItem>
-                type="edit"
-                parentId={sightId!}
-                dragAllowed={true}
-                setItemsParent={setLinkedArticles}
-                parentResource="sight"
-                fields={articleFields}
-                childResource="article"
-                title="статьи"
-              />
-
-              <CreateSightArticle
-                parentId={sightId!}
-                parentResource="sight"
-                childResource="article"
-                title="статью"
-              />
-            </Box>
-          </Box>
-        </Edit>
-        <Paper
-          sx={{
-            position: "fixed",
-            p: 2,
-
-            width: "30%",
-
-            top: "178px",
-
-            right: 50,
-            zIndex: 1000,
-            borderRadius: 2,
-            border: "1px solid",
-            borderColor: "primary.main",
-            bgcolor: (theme) =>
-              theme.palette.mode === "dark" ? "background.paper" : "#fff",
-          }}
-        >
-          <Typography variant="h6" gutterBottom color="primary">
-            Предпросмотр
-          </Typography>
-
-          <Box sx={{ mb: 2 }}>
-            {mediaFile.src && (
-              <>
-                {mediaFile.filename.endsWith(".mp4") ? (
-                  <video
-                    style={{ width: "100%", height: "100%" }}
-                    src={mediaFile.src}
-                    controls
-                  />
-                ) : (
-                  <img
-                    style={{ width: "100%", height: "100%" }}
-                    src={mediaFile.src}
-                    alt="Предпросмотр"
-                  />
-                )}
-              </>
-            )}
-            <p style={{ fontSize: "12px", color: "white" }}>
-              {mediaFile.filename}
-            </p>
-          </Box>
-          {/* Водяные знаки */}
-          <Box sx={{ mb: 2 }}>
-            <Box sx={{ display: "flex", flexDirection: "column", gap: 2 }}>
-              {selectedArticle && (
-                <Typography
-                  variant="h4"
-                  gutterBottom
-                  sx={{ color: "text.primary" }}
-                >
-                  {selectedArticle.heading}
-                </Typography>
-              )}
-
-              {selectedArticle && (
-                <Typography
-                  variant="body1"
-                  gutterBottom
-                  sx={{ color: "text.primary" }}
-                >
-                  {selectedArticle.body}
-                </Typography>
-              )}
-            </Box>
-            {/* Координаты */}
-            <Box sx={{ display: "flex", gap: 1, mt: 2 }}>
-              {linkedArticles.map((article, index) => (
-                <Box
-                  key={article.id}
-                  onClick={() => setSelectedArticleIndex(index)}
-                  sx={{
-                    cursor: "pointer",
-                    bgcolor:
-                      selectedArticleIndex === index
-                        ? "primary.main"
-                        : "transparent",
-                    color: selectedArticleIndex === index ? "white" : "inherit",
-                    p: 1,
-                    borderRadius: 1,
-                  }}
-                >
-                  <Typography variant="body1" gutterBottom>
-                    {article.heading}
-                  </Typography>
-                </Box>
-              ))}
-            </Box>
-          </Box>
-        </Paper>
-      </CustomTabPanel>
-
-      <CustomTabPanel value={tabValue} index={1}>
         <Edit
           saveButtonProps={saveButtonProps}
           footerButtonProps={{
@@ -1032,6 +884,233 @@ export const SightEdit = observer(() => {
           </Box>
         </Edit>
       </CustomTabPanel>
+
+      <CustomTabPanel value={tabValue} index={1}>
+        <Edit
+          saveButtonProps={saveButtonProps}
+          footerButtonProps={{
+            sx: {
+              bottom: 0,
+              left: 0,
+            },
+          }}
+        >
+          <Box
+            sx={{
+              maxWidth: "50%",
+              display: "flex",
+              flexDirection: "column",
+              gap: 2,
+              position: "relative",
+            }}
+          >
+            <Box
+              component="form"
+              sx={{ flex: 1, display: "flex", flexDirection: "column" }}
+              autoComplete="off"
+            >
+              <TextField
+                {...register("name", {
+                  required: "Это поле является обязательным",
+                })}
+                error={!!(errors as any)?.name}
+                helperText={(errors as any)?.name?.message}
+                margin="normal"
+                fullWidth
+                InputLabelProps={{ shrink: true }}
+                type="text"
+                label={"Название *"}
+                name="name"
+              />
+            </Box>
+            <LanguageSwitch />
+            <Box sx={{ mt: 3 }}>
+              <LinkedItems<ArticleItem>
+                type="edit"
+                parentId={sightId!}
+                dragAllowed={true}
+                setItemsParent={setLinkedArticles}
+                parentResource="sight"
+                fields={articleFields}
+                childResource="article"
+                title="статьи"
+              />
+
+              <CreateSightArticle
+                parentId={sightId!}
+                parentResource="sight"
+                childResource="article"
+                title="статью"
+              />
+            </Box>
+          </Box>
+        </Edit>
+        <Paper
+          sx={{
+            display: "flex",
+            flexDirection: "column",
+            position: "fixed",
+            p: 2,
+
+            width: "30%",
+            overflowY: "scroll",
+            height: "80vh",
+            top: "178px",
+
+            right: 50,
+            zIndex: 1000,
+            borderRadius: 2,
+            border: "1px solid",
+            borderColor: "primary.main",
+            bgcolor: (theme) =>
+              theme.palette.mode === "dark" ? "background.paper" : "#fff",
+          }}
+        >
+          <Typography variant="h6" gutterBottom color="primary">
+            Предпросмотр
+          </Typography>
+
+          <Box sx={{ mb: 2, margin: "0 auto" }}>
+            {mediaFile && mediaFile.src && mediaFile.media_type === 1 && (
+              <img
+                src={mediaFile.src}
+                alt={mediaFile.filename}
+                style={{
+                  maxWidth: "100%",
+                  height: "40vh",
+                  objectFit: "contain",
+                  borderRadius: 8,
+                }}
+              />
+            )}
+
+            {mediaFile && mediaFile.media_type === 2 && (
+              <video
+                src={mediaFile.src}
+                style={{
+                  maxWidth: "50%",
+
+                  objectFit: "contain",
+                  borderRadius: 30,
+                }}
+                controls
+                autoPlay
+                muted
+              />
+            )}
+            {mediaFile && mediaFile.media_type === 3 && (
+              <img
+                src={mediaFile.src}
+                alt={mediaFile.filename}
+                style={{
+                  maxWidth: "100%",
+                  height: "40vh",
+                  objectFit: "contain",
+                  borderRadius: 8,
+                }}
+              />
+            )}
+            {mediaFile && mediaFile.media_type === 4 && (
+              <img
+                src={mediaFile.src}
+                alt={mediaFile.filename}
+                style={{
+                  maxWidth: "100%",
+                  height: "40vh",
+                  objectFit: "contain",
+                  borderRadius: 8,
+                }}
+              />
+            )}
+
+            {mediaFile && mediaFile.src && mediaFile.media_type == 5 && (
+              <ReactPhotoSphereViewer
+                src={mediaFile.src}
+                width={"100%"}
+                height={"300px"}
+              />
+            )}
+
+            {mediaFile && mediaFile.media_type === 6 && (
+              <ModelViewer height={"30%"} fileUrl={mediaFile.src} />
+            )}
+          </Box>
+          {/* Водяные знаки */}
+          <Box
+            sx={{
+              mb: 2,
+              flexGrow: 1,
+              display: "flex",
+              flexDirection: "column",
+              justifyContent: "space-between",
+            }}
+          >
+            <Box sx={{ display: "flex", flexDirection: "column", gap: 2 }}>
+              {selectedArticle && (
+                <Typography
+                  variant="h4"
+                  gutterBottom
+                  sx={{ color: "text.primary" }}
+                >
+                  {selectedArticle.heading}
+                </Typography>
+              )}
+
+              {selectedArticle && (
+                <Typography
+                  variant="body1"
+                  gutterBottom
+                  sx={{ color: "text.primary" }}
+                >
+                  {selectedArticle.body}
+                </Typography>
+              )}
+              {selectedArticle && (
+                <Typography
+                  variant="body1"
+                  gutterBottom
+                  sx={{ color: "text.primary" }}
+                >
+                  {selectedArticle.body}
+                </Typography>
+              )}
+              {selectedArticle && (
+                <Typography
+                  variant="body1"
+                  gutterBottom
+                  sx={{ color: "text.primary" }}
+                >
+                  {selectedArticle.body}
+                </Typography>
+              )}
+            </Box>
+
+            <Box sx={{ display: "flex", gap: 1, mt: 2 }}>
+              {linkedArticles.map((article, index) => (
+                <Box
+                  key={article.id}
+                  onClick={() => setSelectedArticleIndex(index)}
+                  sx={{
+                    cursor: "pointer",
+                    bgcolor:
+                      selectedArticleIndex === index
+                        ? "primary.main"
+                        : "transparent",
+                    color: selectedArticleIndex === index ? "white" : "inherit",
+                    p: 1,
+                    borderRadius: 1,
+                  }}
+                >
+                  <Typography variant="body1" gutterBottom>
+                    {article.heading}
+                  </Typography>
+                </Box>
+              ))}
+            </Box>
+          </Box>
+        </Paper>
+      </CustomTabPanel>
+
       <CustomTabPanel value={tabValue} index={2}>
         <Edit
           saveButtonProps={saveButtonProps}
@@ -1056,6 +1135,50 @@ export const SightEdit = observer(() => {
               autoComplete="off"
             >
               <LanguageSwitch />
+              <Controller
+                control={control}
+                name="thumbnail"
+                defaultValue={null}
+                render={({ field }) => (
+                  <Autocomplete
+                    {...mediaAutocompleteProps}
+                    value={
+                      mediaAutocompleteProps.options.find(
+                        (option) =>
+                          option.id === field.value && option.media_type === 3
+                      ) || null
+                    }
+                    onChange={(_, value) => {
+                      field.onChange(value?.id || "");
+                    }}
+                    getOptionLabel={(item) => {
+                      return item ? item.media_name : "";
+                    }}
+                    isOptionEqualToValue={(option, value) => {
+                      return option.id === value?.id;
+                    }}
+                    filterOptions={(options, { inputValue }) => {
+                      return options.filter((option) =>
+                        option.media_name
+                          .toLowerCase()
+                          .includes(inputValue.toLowerCase())
+                      );
+                    }}
+                    renderInput={(params) => (
+                      <TextField
+                        {...params}
+                        label="Выберите водный знак (Левый верх)"
+                        margin="normal"
+                        variant="outlined"
+                        error={!!errors.arms}
+                        helperText={(errors as any)?.arms?.message}
+                        required
+                      />
+                    )}
+                  />
+                )}
+              />
+
               <Controller
                 control={control}
                 name="watermark_lu"
@@ -1177,6 +1300,29 @@ export const SightEdit = observer(() => {
                 Предпросмотр
               </Typography>
 
+              {thumbnailPreview && (
+                <Box>
+                  <Typography
+                    variant="body2"
+                    gutterBottom
+                    sx={{ color: "text.secondary" }}
+                  >
+                    Логотип достопримечательности:
+                  </Typography>
+                  <Box
+                    component="img"
+                    src={thumbnailPreview}
+                    alt="Логотип достопримечательности"
+                    sx={{
+                      width: "50%",
+                      objectFit: "cover",
+                      borderRadius: 1,
+                      marginBottom: 2,
+                    }}
+                  />
+                </Box>
+              )}
+
               {/* Водяные знаки */}
               <Box sx={{ mb: 2 }}>
                 <Typography
diff --git a/src/preview/components/AttractionShortPreview/AttractionShortPreview.css b/src/preview/components/AttractionShortPreview/AttractionShortPreview.css
new file mode 100644
index 0000000..7b68896
--- /dev/null
+++ b/src/preview/components/AttractionShortPreview/AttractionShortPreview.css
@@ -0,0 +1,39 @@
+.attraction-card {
+  height: 415px;
+  width: 315px;
+  background: linear-gradient(
+      113.51deg,
+      rgba(255, 255, 255, 0) 8.71%,
+      rgba(255, 255, 255, 0.16) 69.69%
+    ),
+    #806c59;
+  border-radius: 10px;
+
+  overflow: hidden;
+  color: #ffffff;
+}
+
+.attraction-card__content {
+  padding: 12px;
+}
+
+.attraction-card__title {
+  margin: 8px 0 0 0;
+}
+
+.attraction-card__text {
+  margin: 30px 0 0 0;
+  white-space: pre-wrap;
+}
+
+.attraction-card__subtitle {
+  margin: 8px 0 0 0;
+  font-weight: 400;
+}
+
+.attraction-card__image {
+  min-width: 100%;
+  max-height: 50%;
+  padding: 2px;
+  border-radius: 10px 10px 0 0;
+}
diff --git a/src/preview/components/AttractionShortPreview/AttractionShortPreview.tsx b/src/preview/components/AttractionShortPreview/AttractionShortPreview.tsx
new file mode 100644
index 0000000..a22537a
--- /dev/null
+++ b/src/preview/components/AttractionShortPreview/AttractionShortPreview.tsx
@@ -0,0 +1,55 @@
+import "./AttractionShortPreview.css";
+
+import { LocalizedString, useServerLocalization } from "@mt/i18n";
+import classNames from "classnames";
+import { TouchScrollWrapper } from "../TouchScrollWrapper/TouchScrollWrapper";
+import { HTMLAttributes } from "react";
+
+export interface AttractionShortPreviewProps
+  extends Omit<HTMLAttributes<HTMLElement>, "title" | "content"> {
+  img: string;
+  title: LocalizedString;
+  subtitle: LocalizedString;
+  content: LocalizedString;
+}
+
+export function AttractionShortPreview({
+  img,
+  title,
+  subtitle,
+  content,
+  className,
+  ...props
+}: AttractionShortPreviewProps) {
+  const localizeText = useServerLocalization();
+
+  return (
+    <div
+      className={classNames(className, "attraction-card g-flex-column")}
+      {...props}
+    >
+      {img && (
+        <img
+          className="attraction-card__image"
+          src={img}
+          alt={localizeText(title)}
+        />
+      )}
+
+      <TouchScrollWrapper className="g-flex-column__item">
+        <div className="attraction-card__content">
+          <h4 className="attraction-card__title">{localizeText(title)}</h4>
+
+          <h5 className="attraction-card__subtitle">
+            {localizeText(subtitle)}
+          </h5>
+
+          <p
+            className="attraction-card__text"
+            dangerouslySetInnerHTML={{ __html: localizeText(content) }}
+          />
+        </div>
+      </TouchScrollWrapper>
+    </div>
+  );
+}
diff --git a/src/preview/components/AttractionWidget/AttractionWidget.css b/src/preview/components/AttractionWidget/AttractionWidget.css
new file mode 100644
index 0000000..3ae3c4e
--- /dev/null
+++ b/src/preview/components/AttractionWidget/AttractionWidget.css
@@ -0,0 +1,126 @@
+.widget-container {
+  width: 545px;
+  height: var(--attraction-widget-container-height, 100%);
+  max-height: calc(100% - 90px);
+  color: #ffffff;
+  background: #806c59;
+  border: 2px solid #806c59;
+  border-radius: 10px;
+}
+
+.widget-content {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: center;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+
+.widget-slide {
+  position: relative;
+  display: none;
+  top: 0;
+  left: 0;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: center;
+  width: 100%;
+}
+
+.widget-slide.active,
+.widget-slide.preview {
+  display: flex;
+  flex: 1;
+  overflow: auto;
+}
+
+.widget-media {
+  width: 100%;
+  height: auto;
+  max-height: 644px;
+}
+
+.view-container {
+  border-radius: 8px 8px 0 0;
+}
+
+.widget-header {
+  background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%),
+    rgba(179, 165, 152, 0.4);
+  box-shadow: inset 4px 4px 12px rgba(255, 255, 255, 0.12);
+  width: 100%;
+  padding: 9px 16px;
+  font-weight: 700;
+  font-size: 24px;
+  line-height: 120%;
+}
+
+.widget-text {
+  width: 100%;
+  align-self: self-start;
+  padding: 16px;
+  font-weight: 400;
+  font-size: 18px;
+  line-height: 150%; /* or 27px */
+  opacity: 0;
+  transition: opacity 0.5s ease-in-out;
+  user-select: none;
+  word-break: break-word;
+  white-space: pre-wrap;
+}
+
+.widget-text p {
+  margin: 0;
+}
+
+.widget-text.preview {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  font-weight: 700;
+  font-size: 48px;
+  line-height: 120%;
+  text-align: center;
+}
+
+.widget-text.active {
+  opacity: 1;
+}
+
+.widget-titles {
+  display: flex;
+  height: 50px;
+  justify-content: space-evenly;
+  align-items: center;
+  width: 100%;
+  margin: 5px 0 0 0;
+  background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%),
+    rgba(179, 165, 152, 0.4);
+  box-shadow: inset 4px 4px 12px rgba(255, 255, 255, 0.12);
+  border-radius: 0 0 10px 10px;
+  padding: 12px 0;
+}
+
+.widget-title {
+  font-weight: 400;
+  font-size: 18px;
+  line-height: 21px;
+  cursor: pointer;
+  user-select: none;
+  width: 100px;
+  text-align: center;
+}
+
+.widget-title.active {
+  font-weight: bold;
+  text-decoration: underline;
+  text-underline-offset: 5px;
+}
+
+.widget-title.preview {
+  display: none;
+}
diff --git a/src/preview/components/AttractionWidget/AttractionWidget.tsx b/src/preview/components/AttractionWidget/AttractionWidget.tsx
new file mode 100644
index 0000000..b682909
--- /dev/null
+++ b/src/preview/components/AttractionWidget/AttractionWidget.tsx
@@ -0,0 +1,114 @@
+import React, { HTMLAttributes, useEffect, useState } from "react";
+import { useServerLocalization } from "@mt/i18n";
+import cn from "classnames";
+import { useSwipeable } from "react-swipeable";
+import { ArticleBase } from "@mt/common-types";
+import "./AttractionWidget.css";
+import { usePrevious } from "@mt/utils";
+import { AttractionMedia } from "./media/AttractionMedia";
+import { TouchScrollWrapper } from "../TouchScrollWrapper/TouchScrollWrapper";
+
+export interface AttractionsWidgetProps extends HTMLAttributes<HTMLElement> {
+  articles: ArticleBase[];
+  isIdleMode: boolean;
+  isPreviewOnly?: boolean;
+}
+
+export function AttractionWidget({
+  articles,
+  isIdleMode,
+  isPreviewOnly = false,
+  ...props
+}: AttractionsWidgetProps) {
+  const [activeIndex, setActiveIndex] = useState(0);
+  const prevArticles = usePrevious<ArticleBase[]>(articles) || [];
+  const localizeText = useServerLocalization();
+
+  const swipeHandlers = useSwipeable({
+    onSwipedLeft: ({ event }) => {
+      event.preventDefault();
+      setActiveIndex((activeIndex) => (activeIndex + 1) % articles.length);
+    },
+    onSwipedRight: ({ event }) => {
+      event.preventDefault();
+      setActiveIndex(
+        (activeIndex) => (activeIndex - 1 + articles.length) % articles.length
+      );
+    },
+    swipeDuration: 500,
+    preventScrollOnSwipe: true,
+    trackMouse: true,
+  });
+
+  const handleClick = (index: number) => {
+    setActiveIndex(index);
+    document.querySelector(".widget-text.active")!.scrollTop = 0;
+  };
+
+  useEffect(() => setActiveIndex(activeIndex), [activeIndex]);
+
+  useEffect(() => {
+    if (
+      !isPreviewOnly &&
+      (isIdleMode || JSON.stringify(prevArticles) !== JSON.stringify(articles))
+    ) {
+      setActiveIndex(0);
+    }
+
+    // admin specific case: during edit we removed active article
+    if (prevArticles?.length > articles?.length) {
+      setActiveIndex(0);
+    }
+  }, [isPreviewOnly, isIdleMode, articles]);
+
+  return (
+    <div className="widget-container g-flex-column__item-fixed" {...props}>
+      <div className="widget-content">
+        {articles?.map((article, index) => (
+          <div
+            key={index}
+            className={`widget-slide ${index === activeIndex ? "active" : ""}`}
+            onPointerUp={() => handleClick(index)}
+          >
+            <div className="widget-media">
+              <AttractionMedia media={article.media} />
+            </div>
+
+            {index !== 0 && (
+              <div className="widget-header">
+                {localizeText(articles[0].text)}
+              </div>
+            )}
+
+            <TouchScrollWrapper
+              className={cn("widget-text", {
+                active: index === activeIndex,
+                preview: article.isPreview,
+              })}
+            >
+              <div
+                dangerouslySetInnerHTML={{ __html: localizeText(article.text) }}
+                {...swipeHandlers}
+              />
+            </TouchScrollWrapper>
+          </div>
+        ))}
+
+        <div className="widget-titles">
+          {articles?.map((article, index) => (
+            <div
+              key={`title-${index}`}
+              className={cn("widget-title", {
+                active: index === activeIndex,
+                preview: article.isPreview,
+              })}
+              onPointerUp={() => handleClick(index)}
+            >
+              {localizeText(article.name)}
+            </div>
+          ))}
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/src/preview/components/AttractionWidget/media/AttractionMedia.css b/src/preview/components/AttractionWidget/media/AttractionMedia.css
new file mode 100644
index 0000000..34774e4
--- /dev/null
+++ b/src/preview/components/AttractionWidget/media/AttractionMedia.css
@@ -0,0 +1,52 @@
+.widget-image,
+.widget-video,
+.widget-3d-model {
+  max-width: 100%;
+  max-height: 100%;
+  width: 100%;
+  height: 100%;
+  display: block;
+  border-radius: 8px 8px 0 0;
+}
+
+.widget-3d-model {
+  height: 350px;
+}
+
+.widget-media__wrapper {
+  position: relative;
+  /*TODO: it worth to investigate it further... quite weird behavior of */
+  box-sizing: content-box !important;
+}
+
+.fullscreen-photo-sphere-btn,
+.fullscreen-3d-btn {
+  width: 20px;
+  height: 20px;
+  position: absolute;
+  right: 10px;
+  bottom: 10px;
+  cursor: pointer;
+  z-index: 100;
+  opacity: 0.7;
+}
+
+.media-with-watermark {
+  position: relative;
+}
+
+.watermark {
+  position: absolute;
+  top: 10px;
+  left: 10px;
+  width: 50px;
+  height: auto;
+}
+
+.psv-autorotate-button {
+  display: block !important;
+}
+
+.psv-menu-button {
+  display: none !important;
+}
diff --git a/src/preview/components/AttractionWidget/media/AttractionMedia.tsx b/src/preview/components/AttractionWidget/media/AttractionMedia.tsx
new file mode 100644
index 0000000..a0f9b32
--- /dev/null
+++ b/src/preview/components/AttractionWidget/media/AttractionMedia.tsx
@@ -0,0 +1,36 @@
+import { Media } from "@mt/common-types";
+import { ImageMedia } from "./ImageMedia";
+import { VideoMedia } from "./VideoMedia";
+import { PhotoSphereMedia } from "./PhotoSphereMedia";
+import { Object3DMedia } from "./Object3DMedia";
+import { memo } from "react";
+
+export const AttractionMedia = memo(
+  ({ media }: { media: Media }) => {
+    const { type, url, watermarkUrl } = media;
+
+    if (!url) return null;
+
+    switch (type) {
+      case "IMAGE":
+        return (
+          <ImageMedia url={url} alt={media.url} watermarkUrl={watermarkUrl} />
+        );
+      case "VIDEO":
+        return <VideoMedia url={url} watermarkUrl={watermarkUrl} />;
+      case "PHOTO_SPHERE":
+        return <PhotoSphereMedia url={url} watermarkUrl={watermarkUrl} />;
+      case "OBJECT_3D":
+        return <Object3DMedia url={url} watermarkUrl={watermarkUrl} />;
+      default:
+        return null;
+    }
+  },
+  ({ media }, { media: newMedia }) => {
+    return (
+      media.url === newMedia.url &&
+      media.watermarkUrl === newMedia.watermarkUrl &&
+      media.type === newMedia.type
+    );
+  }
+);
diff --git a/src/preview/components/AttractionWidget/media/ImageMedia.tsx b/src/preview/components/AttractionWidget/media/ImageMedia.tsx
new file mode 100644
index 0000000..94f4934
--- /dev/null
+++ b/src/preview/components/AttractionWidget/media/ImageMedia.tsx
@@ -0,0 +1,25 @@
+import cn from 'classnames';
+import React from 'react';
+
+import './AttractionMedia.css';
+
+interface ImageMediaProps {
+  url: string;
+  alt: string;
+  watermarkUrl?: string;
+}
+
+export const ImageMedia = ({ url, alt, watermarkUrl }: ImageMediaProps) => (
+  <>
+    <img
+      src={url}
+      alt={alt}
+      className={cn('widget-image', {
+        'media-with-watermark': watermarkUrl !== null,
+      })}
+    />
+    {watermarkUrl && (
+      <img src={watermarkUrl} alt="Watermark" className="watermark" />
+    )}
+  </>
+);
diff --git a/src/preview/components/AttractionWidget/media/Object3DMedia.tsx b/src/preview/components/AttractionWidget/media/Object3DMedia.tsx
new file mode 100644
index 0000000..853600a
--- /dev/null
+++ b/src/preview/components/AttractionWidget/media/Object3DMedia.tsx
@@ -0,0 +1,52 @@
+import cn from "classnames";
+import React, { useEffect, useState } from "react";
+
+import "./AttractionMedia.css";
+import ModelViewer from "../../model-viewer/ModelViewer";
+import { Icons, useLightboxContext } from "@mt/components";
+import { Object3DLightboxData } from "@mt/common-types";
+
+interface Object3DMediaProps {
+  url: string;
+  watermarkUrl?: string;
+}
+
+export const Object3DMedia = ({ url, watermarkUrl }: Object3DMediaProps) => {
+  // prettier-ignore
+  const { setData, openLightbox } = useLightboxContext<Object3DLightboxData>();
+  const [autoRotate, setAutoRotate] = useState(true);
+
+  const handle3DFullscreenOpen = () => {
+    setAutoRotate(false);
+    setData({
+      type: "OBJECT_3D",
+      modelUrl: url,
+      watermarkUrl,
+    });
+    openLightbox();
+  };
+
+  useEffect(() => {
+    setAutoRotate(true);
+  }, [url]);
+
+  return (
+    <div className="widget-media__wrapper">
+      <div
+        className={cn("widget-3d-model", {
+          "media-with-watermark": watermarkUrl !== null,
+        })}
+      >
+        <ModelViewer key={url} pathToModel={url} autoRotate={autoRotate} />
+        {watermarkUrl && (
+          <img src={watermarkUrl} alt="Watermark" className="watermark" />
+        )}
+      </div>
+
+      <Icons.FullscreenIcon
+        className="fullscreen-3d-btn"
+        onPointerUp={() => handle3DFullscreenOpen()}
+      />
+    </div>
+  );
+};
diff --git a/src/preview/components/AttractionWidget/media/PhotoSphereMedia.tsx b/src/preview/components/AttractionWidget/media/PhotoSphereMedia.tsx
new file mode 100644
index 0000000..15c9ed6
--- /dev/null
+++ b/src/preview/components/AttractionWidget/media/PhotoSphereMedia.tsx
@@ -0,0 +1,62 @@
+import cn from "classnames";
+import React, { useRef } from "react";
+import { ReactPhotoSphereViewer } from "react-photo-sphere-viewer";
+
+import { PhotoSphereLightboxData } from "@mt/common-types";
+
+import "./AttractionMedia.css";
+import { useLightboxContext } from "../../lightbox";
+import { Icons } from "@mt/components";
+
+interface PhotoSphereMediaProps {
+  url: string;
+  watermarkUrl?: string;
+}
+
+export const PhotoSphereMedia = ({
+  url,
+  watermarkUrl,
+}: PhotoSphereMediaProps) => {
+  // prettier-ignore
+  const { setData, openLightbox } = useLightboxContext<PhotoSphereLightboxData>();
+  // react-photo-sphere-viewer doesn't have exported types, so here's a bit of a hardcoded piece
+  const photoSphereRef = useRef<any>(null);
+
+  const handlePhotoSphereFullscreenOpen = () => {
+    photoSphereRef.current?.stopAutoRotate();
+    setData({
+      type: "PHOTO_SPHERE",
+      imageUrl: url,
+      watermarkUrl,
+    });
+    openLightbox();
+  };
+
+  return (
+    <div className="widget-media__wrapper">
+      <ReactPhotoSphereViewer
+        ref={photoSphereRef}
+        key={url}
+        src={url}
+        height={"350px"}
+        width={"100%"}
+        container={cn("widget-media", {
+          "media-with-watermark": watermarkUrl !== null,
+        })}
+        moveInertia={false}
+        mousemove={true}
+        navbar={["autorotate", "zoom"]}
+        keyboard={false}
+        loadingTxt="Загрузка..."
+      />
+      {watermarkUrl && (
+        <img src={watermarkUrl} alt="Watermark" className="watermark" />
+      )}
+      {/* the following is a workaround to open lightbox-like preview in the middle of the screen instead of the real fullscreen */}
+      <Icons.FullscreenIcon
+        className="fullscreen-photo-sphere-btn"
+        onPointerUp={() => handlePhotoSphereFullscreenOpen()}
+      />
+    </div>
+  );
+};
diff --git a/src/preview/components/AttractionWidget/media/VideoMedia.tsx b/src/preview/components/AttractionWidget/media/VideoMedia.tsx
new file mode 100644
index 0000000..c8af0f6
--- /dev/null
+++ b/src/preview/components/AttractionWidget/media/VideoMedia.tsx
@@ -0,0 +1,26 @@
+import cn from "classnames";
+import React from "react";
+
+import "./AttractionMedia.css";
+
+interface VideoMediaProps {
+  url: string;
+  watermarkUrl?: string;
+}
+
+export const VideoMedia = ({ url, watermarkUrl }: VideoMediaProps) => (
+  <>
+    <video
+      src={url}
+      className={cn("widget-video", {
+        "media-with-watermark": watermarkUrl !== null,
+      })}
+      autoPlay
+      loop
+      muted
+    />
+    {watermarkUrl && (
+      <img src={watermarkUrl} alt="Watermark" className="watermark" />
+    )}
+  </>
+);
diff --git a/src/preview/components/Drawer/Drawer.styles.tsx b/src/preview/components/Drawer/Drawer.styles.tsx
new file mode 100644
index 0000000..204ad87
--- /dev/null
+++ b/src/preview/components/Drawer/Drawer.styles.tsx
@@ -0,0 +1,47 @@
+// TODO: rewrite as css module
+import styled from '@emotion/styled';
+
+export const StyledDrawer = styled.div`
+  z-index: 1000;
+  position: absolute;
+  width: 290px;
+  height: 100%;
+  transition: all ease-in-out 0.3s;
+
+  transform: translateX(-100%);
+
+  color: #fff;
+  background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%),
+    #806c59;
+
+  &.nav-widget--opened {
+    transform: translateX(0);
+
+    .toggle-btn {
+      transform: rotate(0);
+    }
+  }
+
+  .actions {
+    position: absolute;
+    bottom: 12px;
+    left: 310px;
+  }
+
+  .action-btn {
+    width: 48px;
+    height: 48px;
+    display: block;
+
+    cursor: pointer;
+    margin-right: 16px;
+  }
+
+  .toggle-btn {
+    transform: rotate(180deg);
+  }
+
+  .order-btn-inverse {
+    transform: scale(1, -1);
+  }
+`;
diff --git a/src/preview/components/Drawer/Drawer.tsx b/src/preview/components/Drawer/Drawer.tsx
new file mode 100644
index 0000000..c72d0f3
--- /dev/null
+++ b/src/preview/components/Drawer/Drawer.tsx
@@ -0,0 +1,53 @@
+import cn from "classnames";
+import { HTMLAttributes, ReactNode } from "react";
+
+import { StyledDrawer } from "./Drawer.styles";
+import { Icons } from "@mt/components";
+import { Locale, LocaleSwitcher } from "@mt/i18n";
+
+export interface DrawerProps extends HTMLAttributes<HTMLDivElement> {
+  onToggle: (isOpened: boolean) => void;
+  isOpen: boolean;
+  onHomeBtnClick?: () => void;
+  onLocaleChange: (locale: Locale) => void;
+  actions?: ReactNode;
+}
+
+// TODO: consider refactoring - drawer and controls should be separated
+export function Drawer({
+  children,
+  isOpen,
+  onToggle,
+  onHomeBtnClick,
+  onLocaleChange,
+  actions,
+  ...props
+}: DrawerProps) {
+  return (
+    <StyledDrawer
+      className={cn("g-flex-column", { "nav-widget--opened": isOpen })}
+      {...props}
+    >
+      {children}
+
+      <div className="g-flex actions">
+        <div
+          className="action-btn toggle-btn"
+          onPointerUp={() => onToggle(!isOpen)}
+        >
+          <Icons.ArrowBtn />
+        </div>
+
+        {isOpen && (
+          <div className="action-btn" onPointerUp={() => onHomeBtnClick?.()}>
+            <Icons.HomeBtn />
+          </div>
+        )}
+
+        {actions}
+
+        <LocaleSwitcher onLocaleChange={onLocaleChange} />
+      </div>
+    </StyledDrawer>
+  );
+}
diff --git a/src/preview/components/Drawer/index.ts b/src/preview/components/Drawer/index.ts
new file mode 100644
index 0000000..777c377
--- /dev/null
+++ b/src/preview/components/Drawer/index.ts
@@ -0,0 +1 @@
+export { Drawer } from './Drawer';
diff --git a/src/preview/components/MapWidget/MapWidgetContext.tsx b/src/preview/components/MapWidget/MapWidgetContext.tsx
new file mode 100644
index 0000000..c0e68b1
--- /dev/null
+++ b/src/preview/components/MapWidget/MapWidgetContext.tsx
@@ -0,0 +1,274 @@
+import React, {
+  createContext,
+  useState,
+  useContext,
+  ReactNode,
+  useMemo,
+  useEffect,
+} from "react";
+import { geoMercator } from "d3-geo";
+import { Coordinates, Track, uuid } from "@mt/common-types";
+import { useNearStation, usePassedTrackIndex } from "./hooks";
+import { AttractionGroup, MapData, StationOnMap } from "./map-widget.interface";
+import { getMapPoint } from "./utils";
+import { EMPTY_SETTING_VALUE, zeroCoordinates } from "./map-widget.constant";
+import {
+  MapSettings,
+  MapWidgetContextType,
+} from "./map-widget-context.interface";
+import { useForm } from "react-hook-form";
+
+export const mapCanvasProps = {
+  style: {
+    width: "100%",
+    height: "100%",
+  },
+  width: 500,
+  height: 400,
+};
+
+// prettier-ignore
+export const MapWidgetContext = createContext<MapWidgetContextType | undefined>(undefined);
+
+export const MapWidgetProvider = ({ children }: { children: ReactNode }) => {
+  const [track, setTrack] = useState<Track | null>(null);
+  const [stations, setStations] = useState<StationOnMap[]>([]);
+  const [updatedStationIds, setUpdatedStationIds] = useState<uuid[]>([]);
+  const [attractionGroups, setAttractionGroups] = useState<AttractionGroup[]>(
+    []
+  );
+  const [rotateAngle, setRotateAngle] = useState<number>(0);
+
+  const [scale, setScale] = useState<number>(0);
+  const [fullScale, setFullScale] = useState<number>(0);
+  const [zoomedScale, setZoomedScale] = useState<number>(0);
+
+  const [center, setCenter] = useState(zeroCoordinates);
+  const [baseCenter, setBaseCenter] = useState(zeroCoordinates);
+
+  const [currentPosition, setCurrentPosition] = useState<Coordinates | null>(
+    null
+  );
+
+  const [isEditMode, setIsEditMode] = useState<boolean>(false);
+  const [isDragMode, setIsDragMode] = useState<boolean>(false);
+
+  const [initialSettingsData, setInitialSettingsData] =
+    useState<MapSettings>(EMPTY_SETTING_VALUE);
+  const [isSettingsDataChanged, setIsSettingsDataChanged] =
+    useState<boolean>(false);
+
+  const isMapDataChanged = useMemo(
+    () => isSettingsDataChanged || updatedStationIds.length > 0,
+    [isSettingsDataChanged, updatedStationIds]
+  );
+
+  const stationsMap = useMemo(
+    () => new Map(stations.map((station) => [station.id, station])),
+    [stations]
+  );
+
+  const middleTrackCoordinates: Coordinates | null = useMemo(() => {
+    if (!track?.length) {
+      return null;
+    }
+
+    const middleTrackIndex = Math.floor(track.length / 2);
+
+    return track[middleTrackIndex];
+  }, [track]);
+
+  const settingsForm = useForm({
+    mode: "onChange",
+    reValidateMode: "onChange",
+    defaultValues: initialSettingsData,
+  });
+  useEffect(
+    () => settingsForm.reset(initialSettingsData),
+    [initialSettingsData]
+  );
+
+  const onMapDataFetched = (data: MapData) => {
+    setTrack(data.trackPoints);
+    setStations(data.stationsOnMap);
+    setAttractionGroups(data.touristAttractionGroupsOnMap);
+    setRotateAngle(data.mapRotateAngle);
+
+    setCenter(data.centerOfMapPoint);
+    setBaseCenter(data.centerOfMapPoint);
+
+    setScale(data.fullMapScale);
+    setFullScale(data.fullMapScale);
+    setZoomedScale(data.zoomedMapScale);
+
+    setInitialSettingsData({
+      rotateAngle: data.mapRotateAngle,
+      center: data.centerOfMapPoint,
+      fullScale: data.fullMapScale,
+      zoomedScale: data.zoomedMapScale,
+    });
+
+    setIsSettingsDataChanged(false);
+    setUpdatedStationIds([]);
+  };
+
+  const onSettingsFormChange = () => {
+    const formData = settingsForm.getValues();
+    const { center, rotateAngle, fullScale, zoomedScale, currentStationId } =
+      formData;
+
+    setBaseCenter(center);
+    setRotateAngle(rotateAngle);
+    setFullScale(fullScale);
+    setZoomedScale(zoomedScale);
+
+    if (currentStationId) {
+      const { pointOnMap } = stationsMap.get(currentStationId) as StationOnMap;
+      setCenter(pointOnMap);
+      setScale(zoomedScale);
+      setCurrentPosition(pointOnMap);
+      setIsDragMode(false);
+    } else {
+      setCenter(center);
+      setScale(fullScale);
+      setCurrentPosition(middleTrackCoordinates);
+    }
+
+    updateMapDataChanged(formData);
+  };
+
+  const onMapCenterMoved = (center: Coordinates) => {
+    setBaseCenter(center);
+    setCenter(center);
+    settingsForm.setValue("center", center, { shouldDirty: true });
+
+    updateMapDataChanged(settingsForm.getValues());
+  };
+
+  const updateMapDataChanged = (data: MapSettings) => {
+    const { rotateAngle, center, fullScale, zoomedScale } = data;
+
+    setIsSettingsDataChanged(
+      JSON.stringify({
+        rotateAngle,
+        center,
+        fullScale,
+        zoomedScale,
+      }) !== JSON.stringify(initialSettingsData)
+    );
+  };
+
+  const onStationUpdate: MapWidgetContextType["onStationUpdate"] = (
+    stationId,
+    { labelOffset, labelAlignment }
+  ) => {
+    const updatedStation = {
+      ...(stationsMap.get(stationId) as StationOnMap),
+      ...(labelOffset && { labelOffset }),
+      ...(labelAlignment && { labelAlignment }),
+    };
+
+    setStations((stations) =>
+      stations.map((station) =>
+        station.id === stationId ? updatedStation : station
+      )
+    );
+    setUpdatedStationIds((ids) => [...ids, stationId]);
+  };
+
+  const getUpdatedStations = () => {
+    return updatedStationIds.reduce((acc: Record<uuid, any>, id: uuid) => {
+      const { labelAlignment, labelOffset } = stationsMap.get(
+        id
+      ) as StationOnMap;
+
+      acc[id] = {
+        textAlignment: labelAlignment,
+        mapOffsets: labelOffset,
+      };
+
+      return acc;
+    }, {});
+  };
+
+  const projection = useMemo(() => {
+    const { width, height } = mapCanvasProps;
+
+    return geoMercator()
+      .translate([width / 2, height / 2])
+      .center(getMapPoint(center))
+      .scale(scale);
+  }, [center, scale]);
+
+  const { passedTrackIndex } = usePassedTrackIndex(track, currentPosition);
+  const { currentStation, nextStation, isOnStation } = useNearStation(
+    currentPosition,
+    stations,
+    passedTrackIndex
+  );
+
+  // Bind map center and zoom to currentStation in not EditMode
+  useEffect(() => {
+    if (isEditMode) {
+      return;
+    }
+
+    if (currentStation) {
+      const { pointOnMap } = currentStation;
+      setCenter(pointOnMap);
+      setScale(zoomedScale);
+    } else {
+      setCenter(baseCenter);
+      setScale(fullScale);
+    }
+  }, [currentStation]);
+
+  const contextValue = {
+    track,
+    center,
+    rotateAngle,
+    projection,
+    attractionGroups,
+    stations,
+    currentPosition,
+    middleTrackCoordinates,
+    passedTrackIndex,
+    currentStation,
+    isOnStation,
+    nextStation,
+
+    setCurrentPosition,
+
+    isDragMode,
+    setIsDragMode,
+    isEditMode,
+    setIsEditMode,
+
+    onMapDataFetched,
+    settingsForm,
+    onSettingsFormChange,
+    onMapCenterMoved,
+    onStationUpdate,
+    getUpdatedStations,
+
+    isMapDataChanged,
+  };
+
+  return (
+    <MapWidgetContext.Provider value={contextValue}>
+      {children}
+    </MapWidgetContext.Provider>
+  );
+};
+
+export const useMapWidgetContext = function (): MapWidgetContextType {
+  const context = useContext(MapWidgetContext);
+
+  if (!context) {
+    throw new Error(
+      "useMapWidgetContext must be used within a MapWidgetProvider"
+    );
+  }
+
+  return context;
+};
diff --git a/src/preview/components/MapWidget/components/MapWidget/MapContent.tsx b/src/preview/components/MapWidget/components/MapWidget/MapContent.tsx
new file mode 100644
index 0000000..45c629c
--- /dev/null
+++ b/src/preview/components/MapWidget/components/MapWidget/MapContent.tsx
@@ -0,0 +1,25 @@
+import { TrackAttractions, TrackLine, TrackStations, TramMarker } from '../index';
+import { getMapPoint } from '../../utils';
+import { useMapWidgetContext } from '../../MapWidgetContext';
+
+export const MapContent = () => {
+  const { rotateAngle, isEditMode, currentPosition, currentStation, nextStation } =
+    useMapWidgetContext();
+
+  return (
+    <g className="g-transform-origin__center" style={{ transform: `rotate(${rotateAngle}deg)` }}>
+      <TrackLine />
+
+      <TrackAttractions />
+
+      <TrackStations />
+
+      {!isEditMode && currentPosition && nextStation && (
+        <TramMarker
+          coordinates={getMapPoint(currentPosition)}
+          nextStopPoint={(currentStation ?? nextStation).pointOnMap}
+        />
+      )}
+    </g>
+  );
+};
diff --git a/src/preview/components/MapWidget/components/MapWidget/MapWidget.module.css b/src/preview/components/MapWidget/components/MapWidget/MapWidget.module.css
new file mode 100644
index 0000000..4967997
--- /dev/null
+++ b/src/preview/components/MapWidget/components/MapWidget/MapWidget.module.css
@@ -0,0 +1,4 @@
+.mapWidget {
+  position: relative;
+  z-index: 100;
+}
diff --git a/src/preview/components/MapWidget/components/MapWidget/MapWidget.tsx b/src/preview/components/MapWidget/components/MapWidget/MapWidget.tsx
new file mode 100644
index 0000000..6862c27
--- /dev/null
+++ b/src/preview/components/MapWidget/components/MapWidget/MapWidget.tsx
@@ -0,0 +1,65 @@
+import {
+  ComposableMap,
+  ZoomableGroup,
+  ZoomableGroupProps,
+} from "react-simple-maps";
+import styles from "./MapWidget.module.css";
+import { mapCanvasProps, useMapWidgetContext } from "../../MapWidgetContext";
+import { useState, FC, ReactNode } from "react";
+import { MapContent } from "./MapContent";
+
+// Create wrapper components to handle type issues
+const ComposableMapWrapper: FC<any> = (props) => {
+  // @ts-ignore - Ignore type issues with the ComposableMap component
+  return <ComposableMap {...props} />;
+};
+
+const ZoomableGroupWrapper: FC<ZoomableGroupProps> = (props) => {
+  // @ts-ignore - Ignore type issues with the ZoomableGroup component
+  return <ZoomableGroup {...props} />;
+};
+
+// default coordinates for 3a route: 59.943, 30.331
+export const MapWidget = () => {
+  const { onMapCenterMoved, projection, isDragMode, rotateAngle } =
+    useMapWidgetContext();
+  const [key, setKey] = useState(42);
+
+  const handleMoveEnd: ZoomableGroupProps["onMoveEnd"] = (e, d3Zoom) => {
+    const { PI, cos, sin } = Math;
+    const { x, y } = d3Zoom.transform;
+    const { width, height } = mapCanvasProps;
+
+    const alpha = (-rotateAngle * PI) / 180;
+
+    const x1 = x * cos(alpha) - y * sin(alpha);
+    const y1 = x * sin(alpha) + y * cos(alpha);
+
+    const cX = width / 2 - x1;
+    const cY = height / 2 - y1;
+
+    const [lon, lat] = projection.invert?.([cX, cY]) ?? [0, 0];
+
+    onMapCenterMoved({ lon, lat });
+    setKey(-key);
+  };
+
+  return (
+    <ComposableMapWrapper
+      projection={projection as any}
+      className={styles.mapWidget}
+      {...mapCanvasProps}
+    >
+      <ZoomableGroupWrapper
+        key={key}
+        center={projection.center()}
+        onMoveEnd={handleMoveEnd}
+        filterZoomEvent={() => isDragMode}
+        minZoom={1}
+        maxZoom={1}
+      >
+        <MapContent />
+      </ZoomableGroupWrapper>
+    </ComposableMapWrapper>
+  );
+};
diff --git a/src/preview/components/MapWidget/components/MapWidget/index.ts b/src/preview/components/MapWidget/components/MapWidget/index.ts
new file mode 100644
index 0000000..c38e613
--- /dev/null
+++ b/src/preview/components/MapWidget/components/MapWidget/index.ts
@@ -0,0 +1 @@
+export * from './MapWidget';
diff --git a/src/preview/components/MapWidget/components/TrackAttractions/AttractionMarker.module.css b/src/preview/components/MapWidget/components/TrackAttractions/AttractionMarker.module.css
new file mode 100644
index 0000000..30317e0
--- /dev/null
+++ b/src/preview/components/MapWidget/components/TrackAttractions/AttractionMarker.module.css
@@ -0,0 +1,41 @@
+.markerLarge,
+.markerSmall {
+  overflow: visible;
+}
+
+.markerLarge {
+  width: 23px;
+}
+
+.markerLarge .counter {
+  transform: translate(30%, 15%);
+}
+
+.markerSmall {
+  width: 15px;
+}
+
+.markerSmall .counter {
+  transform: translate(50%, -25%);
+}
+
+.icon {
+  width: 100%;
+}
+
+.counter {
+  position: absolute;
+  top: 0;
+  right: 0;
+
+  width: 8px;
+  height: 8px;
+  line-height: 8px;
+  text-align: center;
+
+  border-radius: 50%;
+  background-color: #896f58;
+  font-size: 0.3rem;
+  font-weight: 700;
+  color: #ffffff;
+}
diff --git a/src/preview/components/MapWidget/components/TrackAttractions/AttractionMarker.tsx b/src/preview/components/MapWidget/components/TrackAttractions/AttractionMarker.tsx
new file mode 100644
index 0000000..8760445
--- /dev/null
+++ b/src/preview/components/MapWidget/components/TrackAttractions/AttractionMarker.tsx
@@ -0,0 +1,40 @@
+import { Point, Marker } from "react-simple-maps";
+import { Icons } from "@mt/components";
+import { AttractionGroupIconSizeType } from "@mt/common-types";
+
+import styles from "./AttractionMarker.module.css";
+import cn from "classnames";
+
+interface Props {
+  coordinates: Point;
+  rotate: number;
+  size: AttractionGroupIconSizeType;
+  counter?: number;
+}
+
+export const AttractionMarker = ({
+  coordinates,
+  counter = 0,
+  rotate,
+  size,
+}: Props) => {
+  return (
+    <Marker coordinates={coordinates}>
+      <foreignObject
+        className={cn({
+          [styles.markerLarge]: size === "LARGE",
+          [styles.markerSmall]: size === "SMALL",
+        })}
+      >
+        <div
+          className="g-transform-origin__center"
+          style={{ transform: `rotate(${rotate}deg)` }}
+        >
+          <Icons.AttractionIcon className={styles.icon} />
+
+          {counter > 1 && <div className={styles.counter}>{counter}</div>}
+        </div>
+      </foreignObject>
+    </Marker>
+  );
+};
diff --git a/src/preview/components/MapWidget/components/TrackAttractions/TrackAttractions.tsx b/src/preview/components/MapWidget/components/TrackAttractions/TrackAttractions.tsx
new file mode 100644
index 0000000..ff0f390
--- /dev/null
+++ b/src/preview/components/MapWidget/components/TrackAttractions/TrackAttractions.tsx
@@ -0,0 +1,25 @@
+import { AttractionMarker } from "./AttractionMarker";
+import { getMapPoint } from "../../utils";
+import { useMapWidgetContext } from "../../MapWidgetContext";
+
+export const TrackAttractions = () => {
+  const { attractionGroups, rotateAngle } = useMapWidgetContext();
+
+  return (
+    <>
+      {attractionGroups.map((group) => (
+        <AttractionMarker
+          key={
+            group.touristAttractionsOnMap[0]?.id ||
+            `${group.pointOnMap.lat}:${group.pointOnMap.lon}`
+          }
+          coordinates={getMapPoint(group.pointOnMap)}
+          // Inverse angle to compensate map rotation
+          rotate={-rotateAngle}
+          counter={group.touristAttractionsOnMap.length}
+          size={group.iconSize}
+        />
+      ))}
+    </>
+  );
+};
diff --git a/src/preview/components/MapWidget/components/TrackAttractions/index.ts b/src/preview/components/MapWidget/components/TrackAttractions/index.ts
new file mode 100644
index 0000000..00338e4
--- /dev/null
+++ b/src/preview/components/MapWidget/components/TrackAttractions/index.ts
@@ -0,0 +1 @@
+export * from './TrackAttractions';
diff --git a/src/preview/components/MapWidget/components/TrackLine.tsx b/src/preview/components/MapWidget/components/TrackLine.tsx
new file mode 100644
index 0000000..c7675de
--- /dev/null
+++ b/src/preview/components/MapWidget/components/TrackLine.tsx
@@ -0,0 +1,37 @@
+import { useMemo } from "react";
+import { Line, Point } from "react-simple-maps";
+import { getMapPoint } from "../utils";
+import { useMapWidgetContext } from "../MapWidgetContext";
+import { zeroCoordinates } from "../map-widget.constant";
+
+const passedTrackColor = "#ed1c24";
+const trackColor = "#cccccc";
+
+export const TrackLine = () => {
+  const { track, passedTrackIndex, currentPosition } = useMapWidgetContext();
+  const mappedTrack: Point[] = useMemo(
+    () => (track ? track.map(({ lat, lon }) => [lon, lat]) : []),
+    [track]
+  );
+
+  return (
+    <>
+      <Line
+        coordinates={mappedTrack}
+        strokeWidth={2.5}
+        strokeLinecap="round"
+        stroke={trackColor}
+      />
+
+      <Line
+        coordinates={[
+          ...mappedTrack.slice(0, passedTrackIndex),
+          getMapPoint(currentPosition ?? zeroCoordinates),
+        ]}
+        strokeWidth={3.5}
+        strokeLinecap="round"
+        stroke={passedTrackColor}
+      />
+    </>
+  );
+};
diff --git a/src/preview/components/MapWidget/components/TrackStations/StationLabel.tsx b/src/preview/components/MapWidget/components/TrackStations/StationLabel.tsx
new file mode 100644
index 0000000..719c419
--- /dev/null
+++ b/src/preview/components/MapWidget/components/TrackStations/StationLabel.tsx
@@ -0,0 +1,8 @@
+// TODO: resolve circular deps
+import { StationLabelContent, StationLabelContentProps } from './StationLabelContent';
+
+export const StationLabel = ({ station }: StationLabelContentProps) => (
+  <foreignObject className="track-station" {...station.labelOffset}>
+    <StationLabelContent station={station} />
+  </foreignObject>
+);
diff --git a/src/preview/components/MapWidget/components/TrackStations/StationLabelContent.tsx b/src/preview/components/MapWidget/components/TrackStations/StationLabelContent.tsx
new file mode 100644
index 0000000..2802996
--- /dev/null
+++ b/src/preview/components/MapWidget/components/TrackStations/StationLabelContent.tsx
@@ -0,0 +1,55 @@
+import { HTMLAttributes, ReactNode, useContext } from 'react';
+
+import { StationOnMap, TransportIcon, useMapWidgetContext } from '@mt/components';
+import { OnMapTextAlignment } from '@mt/common-types';
+import { LocalizationContext } from '@mt/i18n';
+
+export interface StationLabelContentProps extends HTMLAttributes<HTMLDivElement> {
+  station: StationOnMap;
+  children?: ReactNode;
+}
+
+type TextAlign = Lowercase<OnMapTextAlignment>;
+
+export const StationLabelContent = ({
+  station,
+  children,
+  className = '',
+}: StationLabelContentProps) => {
+  const { locale } = useContext(LocalizationContext);
+  const { rotateAngle } = useMapWidgetContext();
+
+  const { pointOnMap, labelAlignment, iconUrl, shortName, name, transferStationInfos } = station;
+
+  return (
+    <div
+      id={`${pointOnMap.lat}:${pointOnMap.lon}`}
+      className={`track-station__wrapper ${className}`}
+      style={{
+        textAlign: labelAlignment as TextAlign,
+        // Inverse angle to compensate map rotation
+        transform: `rotate(${-rotateAngle}deg)`,
+      }}
+    >
+      <div className="track-station__label">
+        {iconUrl && <img className="track-station__icon" src={iconUrl} />}
+        {(shortName ?? name).ru}
+      </div>
+
+      <div className="track-station__transfers-wrapper">
+        {transferStationInfos.map((transfer) => (
+          <div className="track-station__label" key={transfer.name.ru}>
+            <TransportIcon type={transfer.type} className="transport-icon" />
+            {transfer.name.ru}
+          </div>
+        ))}
+      </div>
+
+      <div className="track-station__label-locale">
+        {locale === 'zh' ? (shortName ?? name).zh : (shortName ?? name).en}
+      </div>
+
+      {children}
+    </div>
+  );
+};
diff --git a/src/preview/components/MapWidget/components/TrackStations/StationLabelEdit.tsx b/src/preview/components/MapWidget/components/TrackStations/StationLabelEdit.tsx
new file mode 100644
index 0000000..ac2d6b0
--- /dev/null
+++ b/src/preview/components/MapWidget/components/TrackStations/StationLabelEdit.tsx
@@ -0,0 +1,63 @@
+import { useState } from 'react';
+import Draggable, { DraggableData, DraggableEvent } from 'react-draggable';
+import { ButtonGroup, IconButton } from '@mui/material';
+import AlignHorizontalLeftRoundedIcon from '@mui/icons-material/AlignHorizontalLeftRounded';
+import AlignHorizontalCenterRoundedIcon from '@mui/icons-material/AlignHorizontalCenterRounded';
+import AlignHorizontalRightRoundedIcon from '@mui/icons-material/AlignHorizontalRightRounded';
+
+// TODO: resolve circular deps
+import { OnMapOffset, OnMapTextAlignment } from '@mt/common-types';
+import { useMapWidgetContext } from '@mt/components';
+import { StationLabelContent, StationLabelContentProps } from './StationLabelContent';
+
+const CONTAINER_WIDTH = 1343;
+const SVG_WIDTH = 500;
+
+export const StationLabelEdit = ({ station }: StationLabelContentProps) => {
+  const { onStationUpdate } = useMapWidgetContext();
+  const { id, labelOffset } = station;
+
+  const [calculatedOffset] = useState<OnMapOffset>(labelOffset);
+  const [dragStartPoint, setDragStartPoint] = useState<OnMapOffset>({ x: -1, y: -1 });
+
+  const onDragStart = () => setDragStartPoint(calculatedOffset);
+
+  const onDragStop = (e: DraggableEvent, { lastX, lastY }: DraggableData) => {
+    const labelOffset = {
+      x: dragStartPoint.x + lastX,
+      y: dragStartPoint.y + lastY,
+    };
+
+    onStationUpdate(id, { labelOffset });
+  };
+
+  const setAlignment = (labelAlignment: OnMapTextAlignment): void =>
+    onStationUpdate(id, { labelAlignment });
+
+  return (
+    <Draggable
+      onStart={onDragStart}
+      onStop={onDragStop}
+      scale={CONTAINER_WIDTH / SVG_WIDTH}
+      positionOffset={calculatedOffset}
+    >
+      <foreignObject className="track-station">
+        <StationLabelContent station={station} className="editable">
+          <ButtonGroup size="small" className="align-btns-group">
+            <IconButton size="small" onClick={() => setAlignment('LEFT')}>
+              <AlignHorizontalLeftRoundedIcon />
+            </IconButton>
+
+            <IconButton size="small" onClick={() => setAlignment('CENTER')}>
+              <AlignHorizontalCenterRoundedIcon />
+            </IconButton>
+
+            <IconButton size="small" onClick={() => setAlignment('RIGHT')}>
+              <AlignHorizontalRightRoundedIcon />
+            </IconButton>
+          </ButtonGroup>
+        </StationLabelContent>
+      </foreignObject>
+    </Draggable>
+  );
+};
diff --git a/src/preview/components/MapWidget/components/TrackStations/TrackStations.css b/src/preview/components/MapWidget/components/TrackStations/TrackStations.css
new file mode 100644
index 0000000..87566bf
--- /dev/null
+++ b/src/preview/components/MapWidget/components/TrackStations/TrackStations.css
@@ -0,0 +1,68 @@
+/* foreignObject */
+.track-station {
+  overflow: visible;
+}
+
+.track-station__wrapper {
+  transform-origin: left top;
+  transform-box: fill-box;
+  position: absolute;
+  top: 0;
+  left: 0;
+}
+
+.track-station__wrapper.editable {
+  cursor: move;
+}
+
+.track-station__label,
+.track-station__label-locale {
+  white-space: nowrap;
+}
+
+.track-station__label {
+  color: #ffffff;
+  font-size: 0.32rem;
+  line-height: 1;
+  letter-spacing: initial;
+}
+
+.track-station__label-locale {
+  color: #cbcbcb;
+  font-size: 0.25rem;
+}
+
+.track-station__transfers-wrapper:not(:empty) {
+  margin: 1.5px 0;
+}
+
+.align-btns-group {
+  position: absolute;
+  left: 50%;
+  transform: translate(-50%, 0);
+  background-color: #ffffff;
+  display: none !important;
+}
+
+.track-station__wrapper:hover .align-btns-group {
+  display: flex !important;
+}
+
+.align-btns-group > button {
+  width: 10px;
+  height: 10px;
+}
+
+.transport-icon,
+.track-station__icon {
+  display: inline-block;
+  margin-right: 1px;
+  vertical-align: middle;
+}
+
+.transport-icon,
+.track-station__icon,
+.track-station svg {
+  width: 6px;
+  height: 6px;
+}
diff --git a/src/preview/components/MapWidget/components/TrackStations/TrackStations.tsx b/src/preview/components/MapWidget/components/TrackStations/TrackStations.tsx
new file mode 100644
index 0000000..3a0909d
--- /dev/null
+++ b/src/preview/components/MapWidget/components/TrackStations/TrackStations.tsx
@@ -0,0 +1,71 @@
+import { Marker } from "react-simple-maps";
+// TODO: resolve circular deps
+import type { uuid } from "@mt/common-types";
+
+import { getMapPoint } from "../../utils";
+
+import "./TrackStations.css";
+import { StationLabelEdit } from "./StationLabelEdit";
+import { useMapWidgetContext } from "../../MapWidgetContext";
+import { StationLabel } from "./StationLabel";
+
+const colors = {
+  black: "#000000",
+  red: "#ed1c24",
+  grey: "#cccccc",
+  yellow: "#fcd500",
+};
+
+export const TrackStations = () => {
+  const {
+    stations,
+    currentStation,
+    passedTrackIndex,
+    isOnStation,
+    isEditMode,
+  } = useMapWidgetContext();
+  const isTerminalStation = (index: number) =>
+    index === 0 || index === stations.length - 1;
+
+  const getStationFill = (
+    id: uuid,
+    trackIndex: number,
+    index: number
+  ): string => {
+    if (isOnStation && currentStation?.id === id) {
+      return colors.yellow;
+    }
+
+    if (isTerminalStation(index)) {
+      return colors.black;
+    }
+
+    return trackIndex <= passedTrackIndex ? colors.red : colors.grey;
+  };
+
+  const getStationStroke = (index: number) => {
+    if (index === 0) return colors.red;
+    if (index === stations.length - 1) return colors.grey;
+    return colors.black;
+  };
+
+  return (
+    <>
+      {stations.map((it, index) => (
+        <Marker key={it.id} coordinates={getMapPoint(it.pointOnMap)}>
+          <circle
+            fill={getStationFill(it.id, it.pointOnMap.trackIndex, index)}
+            stroke={getStationStroke(index)}
+            r={3.5}
+            strokeWidth={isTerminalStation(index) ? 2 : 1.5}
+          />
+          {isEditMode ? (
+            <StationLabelEdit station={it} />
+          ) : (
+            <StationLabel station={it} />
+          )}
+        </Marker>
+      ))}
+    </>
+  );
+};
diff --git a/src/preview/components/MapWidget/components/TrackStations/index.ts b/src/preview/components/MapWidget/components/TrackStations/index.ts
new file mode 100644
index 0000000..5a8e72d
--- /dev/null
+++ b/src/preview/components/MapWidget/components/TrackStations/index.ts
@@ -0,0 +1 @@
+export * from './TrackStations';
diff --git a/src/preview/components/MapWidget/components/TramMarker/TramMarker.module.css b/src/preview/components/MapWidget/components/TramMarker/TramMarker.module.css
new file mode 100644
index 0000000..e358597
--- /dev/null
+++ b/src/preview/components/MapWidget/components/TramMarker/TramMarker.module.css
@@ -0,0 +1,36 @@
+.icon {
+  width: 100%;
+  height: 100%;
+}
+
+.iconContainer {
+  position: relative;
+  overflow: visible;
+  border-radius: 50%;
+  background: #e20613;
+  padding: 3px;
+  width: 32px;
+  height: 32px;
+  transform: translate(16px, 16px);
+}
+
+.flipped {
+  transform: translate(-48px, -48px);
+}
+
+.iconContainer:after {
+  content: '';
+  background: linear-gradient(135deg, #e20713, #00000000);
+  clip-path: polygon(0 0, 50% 100%, 100% 50%);
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  transform: translate(-50%, -50%);
+  transform-origin: bottom right;
+}
+
+.flipped:after {
+  transform: translate(-50%, -50%) rotate(180deg);
+}
diff --git a/src/preview/components/MapWidget/components/TramMarker/TramMarker.tsx b/src/preview/components/MapWidget/components/TramMarker/TramMarker.tsx
new file mode 100644
index 0000000..a14be16
--- /dev/null
+++ b/src/preview/components/MapWidget/components/TramMarker/TramMarker.tsx
@@ -0,0 +1,52 @@
+import { useEffect, useState } from "react";
+import { getIntersection, getIntersectionArea } from "../../utils";
+import { Marker, Point } from "react-simple-maps";
+import { Coordinates } from "@mt/common-types";
+import cn from "classnames";
+import styles from "./TramMarker.module.css";
+import { Icons, useMapWidgetContext } from "@mt/components";
+
+interface TramMarkerProps {
+  coordinates: Point;
+  nextStopPoint: Coordinates;
+}
+
+export const TramMarker = ({ coordinates, nextStopPoint }: TramMarkerProps) => {
+  const [flipped, setFlipped] = useState(false);
+
+  const { rotateAngle } = useMapWidgetContext();
+
+  useEffect(() => {
+    const tramRect = document
+      .getElementById("tram-marker")
+      ?.getBoundingClientRect();
+    const nextStopRect = document
+      .getElementById(`${nextStopPoint.lat}:${nextStopPoint.lon}`)
+      ?.getBoundingClientRect();
+
+    if (tramRect && nextStopRect) {
+      // prettier-ignore
+      const hasIntersection = getIntersection(tramRect, nextStopRect) !== null;
+      const intersectionArea = getIntersectionArea(tramRect, nextStopRect);
+
+      if (hasIntersection && intersectionArea > 150) {
+        setFlipped((isFlipped) => !isFlipped);
+      }
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [coordinates]);
+
+  return (
+    <Marker coordinates={coordinates} id="tram-marker">
+      <foreignObject
+        className={cn(styles.iconContainer, { [styles.flipped]: flipped })}
+      >
+        <Icons.TramMarkerIcon
+          className={`${styles.icon} g-transform-origin__center`}
+          // Inverse angle to compensate map rotation
+          style={{ transform: `rotate(${-rotateAngle}deg)` }}
+        />
+      </foreignObject>
+    </Marker>
+  );
+};
diff --git a/src/preview/components/MapWidget/components/TramMarker/index.ts b/src/preview/components/MapWidget/components/TramMarker/index.ts
new file mode 100644
index 0000000..5808b55
--- /dev/null
+++ b/src/preview/components/MapWidget/components/TramMarker/index.ts
@@ -0,0 +1 @@
+export * from './TramMarker';
diff --git a/src/preview/components/MapWidget/components/index.ts b/src/preview/components/MapWidget/components/index.ts
new file mode 100644
index 0000000..d0d4376
--- /dev/null
+++ b/src/preview/components/MapWidget/components/index.ts
@@ -0,0 +1,5 @@
+export * from './TramMarker';
+export * from './TrackLine';
+export * from './TrackStations';
+export * from './TrackAttractions';
+export * from './MapWidget';
diff --git a/src/preview/components/MapWidget/hooks/index.ts b/src/preview/components/MapWidget/hooks/index.ts
new file mode 100644
index 0000000..43ae2c0
--- /dev/null
+++ b/src/preview/components/MapWidget/hooks/index.ts
@@ -0,0 +1,2 @@
+export * from './usePassedTrackIndex';
+export * from './useNearStation';
diff --git a/src/preview/components/MapWidget/hooks/useNearStation.ts b/src/preview/components/MapWidget/hooks/useNearStation.ts
new file mode 100644
index 0000000..819fda4
--- /dev/null
+++ b/src/preview/components/MapWidget/hooks/useNearStation.ts
@@ -0,0 +1,61 @@
+import { useEffect, useState } from "react";
+import { StationOnMap } from "../map-widget.interface";
+import { getDistance } from "../utils";
+import { Coordinates } from "@mt/common-types";
+
+const ZOOM_DISTANCE = 100;
+const ON_STATION_DISTANCE = 15;
+
+export function useNearStation(
+  currentPosition: Coordinates | null,
+  stations: StationOnMap[],
+  passedTrackIndex: number
+) {
+  const [nextStation, setNextStation] = useState<StationOnMap | null>(null);
+  const [currentStation, setCurrentStation] = useState<StationOnMap | null>(
+    null
+  );
+  const [isOnStation, setIsOnStation] = useState<boolean>(false);
+
+  useEffect(() => {
+    if (!currentPosition) {
+      return;
+    }
+
+    const nextStationIndex = stations.findIndex(
+      ({ pointOnMap }) => pointOnMap.trackIndex > passedTrackIndex
+    );
+
+    const nextStation = stations[nextStationIndex] ?? null;
+    const prevStation = stations[nextStationIndex - 1] ?? null;
+
+    const distanceToNext = nextStation
+      ? getDistance(currentPosition, nextStation.pointOnMap)
+      : ZOOM_DISTANCE + 1;
+
+    setNextStation(nextStation);
+
+    if (distanceToNext <= ZOOM_DISTANCE) {
+      setCurrentStation(nextStation);
+      setIsOnStation(distanceToNext <= ON_STATION_DISTANCE);
+
+      return;
+    }
+
+    const distanceToPrev = prevStation
+      ? getDistance(currentPosition, prevStation.pointOnMap)
+      : ZOOM_DISTANCE + 1;
+
+    if (distanceToPrev <= ZOOM_DISTANCE) {
+      setCurrentStation(prevStation);
+      setIsOnStation(distanceToPrev <= ON_STATION_DISTANCE);
+
+      return;
+    }
+
+    setCurrentStation(null);
+    setIsOnStation(false);
+  }, [currentPosition, stations, passedTrackIndex]);
+
+  return { currentStation, nextStation, isOnStation };
+}
diff --git a/src/preview/components/MapWidget/hooks/usePassedTrackIndex.ts b/src/preview/components/MapWidget/hooks/usePassedTrackIndex.ts
new file mode 100644
index 0000000..fe403d3
--- /dev/null
+++ b/src/preview/components/MapWidget/hooks/usePassedTrackIndex.ts
@@ -0,0 +1,61 @@
+import { useEffect, useState } from "react";
+import { Coordinates, Track } from "@mt/common-types";
+
+import { getDistance, getPointDeviation } from "../utils";
+
+const APPROXIMATE_DISTANCE = 15; // [meters] half of tramway length (~30 meters)
+
+export function usePassedTrackIndex(
+  track: Track | null,
+  currentPosition: Coordinates | null
+) {
+  const [passedTrackIndex, setPassedTrackIndex] = useState<number>(0);
+
+  useEffect(() => {
+    if (!track || !currentPosition) {
+      return;
+    }
+
+    let minDistance = getDistance(track[0], currentPosition);
+    let newPassedIndex = 0;
+
+    for (let i = 1; i < track.length; i++) {
+      const distance = getDistance(track[i], currentPosition);
+
+      if (distance < minDistance) {
+        newPassedIndex = i;
+        minDistance = distance;
+      }
+    }
+
+    /**
+     * Is current position more than APPROXIMATE_DISTANCE far from found track point
+     * we need to check that we really reach newPassedIndex. If not — should decrement index
+     */
+    if (
+      getDistance(track[newPassedIndex], currentPosition) > APPROXIMATE_DISTANCE
+    ) {
+      const prevIndex = Math.max(newPassedIndex - 1, 0);
+      const nextIndex = Math.min(newPassedIndex + 1, track.length - 1);
+
+      const leftDeviation = getPointDeviation(
+        track[prevIndex],
+        track[newPassedIndex], // Ближайшая точка трека
+        currentPosition
+      );
+      const rightDeviation = getPointDeviation(
+        track[newPassedIndex], // Ближайшая точка трека
+        track[nextIndex],
+        currentPosition
+      );
+
+      if (leftDeviation >= rightDeviation) {
+        newPassedIndex--;
+      }
+    }
+
+    setPassedTrackIndex(newPassedIndex);
+  }, [track, currentPosition]);
+
+  return { passedTrackIndex };
+}
diff --git a/src/preview/components/MapWidget/index.ts b/src/preview/components/MapWidget/index.ts
new file mode 100644
index 0000000..aded485
--- /dev/null
+++ b/src/preview/components/MapWidget/index.ts
@@ -0,0 +1,5 @@
+export * from './map-widget.constant';
+export * from './map-widget.interface';
+export * from './components';
+export * from './MapWidgetContext';
+export * from './map-widget-context.interface';
diff --git a/src/preview/components/MapWidget/map-widget-context.interface.ts b/src/preview/components/MapWidget/map-widget-context.interface.ts
new file mode 100644
index 0000000..4604273
--- /dev/null
+++ b/src/preview/components/MapWidget/map-widget-context.interface.ts
@@ -0,0 +1,50 @@
+import { Coordinates, SetState, uuid } from "@mt/common-types";
+import { MapData, StationOnMap } from "@mt/components";
+
+import { UseFormReturn } from "react-hook-form";
+import { RouteStation } from "@mt/common-types";
+import { GeoProjection } from "d3-geo";
+
+export interface MapWidgetContextType {
+  // External data
+  track: MapData["trackPoints"] | null;
+  stations: MapData["stationsOnMap"];
+  attractionGroups: MapData["touristAttractionGroupsOnMap"];
+  rotateAngle: MapData["mapRotateAngle"];
+  center: Coordinates;
+  projection: GeoProjection;
+  currentPosition: Coordinates | null;
+  middleTrackCoordinates: Coordinates | null;
+  passedTrackIndex: number;
+  currentStation: StationOnMap | null;
+  nextStation: StationOnMap | null;
+  isOnStation: boolean;
+
+  // Calculated data
+  setCurrentPosition: SetState<Coordinates | null>;
+
+  isDragMode: boolean;
+
+  setIsDragMode: SetState<boolean>;
+  isEditMode: boolean;
+  setIsEditMode: SetState<boolean>;
+
+  onMapDataFetched: (payload: MapData) => void;
+  settingsForm: UseFormReturn<MapSettings>;
+  onSettingsFormChange: () => void;
+  onMapCenterMoved: (center: Coordinates) => void;
+  onStationUpdate: (
+    stationId: uuid,
+    data: Partial<Pick<StationOnMap, "labelAlignment" | "labelOffset">>
+  ) => void;
+  getUpdatedStations: () => Partial<RouteStation>;
+  isMapDataChanged: boolean;
+}
+
+export interface MapSettings {
+  rotateAngle: number;
+  fullScale: number;
+  zoomedScale: number;
+  center: Coordinates;
+  currentStationId?: string;
+}
diff --git a/src/preview/components/MapWidget/map-widget.constant.ts b/src/preview/components/MapWidget/map-widget.constant.ts
new file mode 100644
index 0000000..e6562f6
--- /dev/null
+++ b/src/preview/components/MapWidget/map-widget.constant.ts
@@ -0,0 +1,10 @@
+import { MapSettings } from "./map-widget-context.interface";
+
+export const zeroCoordinates = { lat: 0, lon: 0 };
+
+export const EMPTY_SETTING_VALUE: MapSettings = {
+  rotateAngle: 0,
+  center: zeroCoordinates,
+  fullScale: 0,
+  zoomedScale: 0,
+};
diff --git a/src/preview/components/MapWidget/map-widget.interface.ts b/src/preview/components/MapWidget/map-widget.interface.ts
new file mode 100644
index 0000000..32db9ef
--- /dev/null
+++ b/src/preview/components/MapWidget/map-widget.interface.ts
@@ -0,0 +1,38 @@
+import {
+  AttractionGroupIconSizeType,
+  Coordinates,
+  StationOnMap as StationOnMapBase,
+  Track,
+  uuid,
+  Transfer,
+} from "@mt/common-types";
+
+export type PointOnTrack = Coordinates & {
+  trackIndex: number;
+};
+
+export type StationOnMap = StationOnMapBase & {
+  pointOnMap: PointOnTrack;
+  transferStationInfos: Transfer[];
+};
+
+export interface AttractionOnMap {
+  id: uuid;
+  pointOnMap: Coordinates;
+}
+
+export interface AttractionGroup {
+  iconSize: AttractionGroupIconSizeType;
+  pointOnMap: Coordinates;
+  touristAttractionsOnMap: AttractionOnMap[];
+}
+
+export interface MapData {
+  mapRotateAngle: number;
+  fullMapScale: number;
+  zoomedMapScale: number;
+  centerOfMapPoint: Coordinates;
+  trackPoints: Track;
+  stationsOnMap: StationOnMap[];
+  touristAttractionGroupsOnMap: AttractionGroup[];
+}
diff --git a/src/preview/components/MapWidget/utils/get-deviation.ts b/src/preview/components/MapWidget/utils/get-deviation.ts
new file mode 100644
index 0000000..f376b2e
--- /dev/null
+++ b/src/preview/components/MapWidget/utils/get-deviation.ts
@@ -0,0 +1,23 @@
+import { Coordinates } from '@mt/common-types';
+import { getDistance } from './get-distance';
+
+/**
+ * This function return deviation of point form the passed straight line
+ * If deviation equals 0 this means the point lay on the line
+ * otherwise don't and we can draw a triangle by this 3 point
+ * @param begin: Point
+ * @param end: Point
+ * @param point: Point
+ * @returns deviation: number
+ */
+export function getPointDeviation(
+  begin: Coordinates,
+  end: Coordinates,
+  point: Coordinates
+): number {
+  const distanceBtw = getDistance(begin, end);
+  const distanceTo = getDistance(begin, point);
+  const distanceFrom = getDistance(point, end);
+
+  return distanceBtw - (distanceFrom + distanceTo);
+}
diff --git a/src/preview/components/MapWidget/utils/get-distance.ts b/src/preview/components/MapWidget/utils/get-distance.ts
new file mode 100644
index 0000000..02554ba
--- /dev/null
+++ b/src/preview/components/MapWidget/utils/get-distance.ts
@@ -0,0 +1,28 @@
+import { Coordinates } from '@mt/common-types';
+
+const EARTH_RADIUS = 6372795; // meters
+
+export function getDistance(a: Coordinates, b: Coordinates): number {
+  const { PI, sin, cos, pow, sqrt, atan2 } = Math;
+
+  const aRad = {
+    lat: (a.lat * PI) / 180,
+    lon: (a.lon * PI) / 180,
+  };
+
+  const bRad = {
+    lat: (b.lat * PI) / 180,
+    lon: (b.lon * PI) / 180,
+  };
+
+  const delta = bRad.lon - aRad.lon;
+
+  // вычисления длины большого круга
+  const y = sqrt(
+    pow(cos(bRad.lat) * sin(delta), 2) +
+      pow(cos(aRad.lat) * sin(bRad.lat) - sin(aRad.lat) * cos(bRad.lat) * cos(delta), 2)
+  );
+  const x = sin(aRad.lat) * sin(bRad.lat) + cos(aRad.lat) * cos(bRad.lat) * cos(delta);
+
+  return +(atan2(y, x) * EARTH_RADIUS).toFixed(2);
+}
diff --git a/src/preview/components/MapWidget/utils/get-map-point.ts b/src/preview/components/MapWidget/utils/get-map-point.ts
new file mode 100644
index 0000000..cc9fca1
--- /dev/null
+++ b/src/preview/components/MapWidget/utils/get-map-point.ts
@@ -0,0 +1,6 @@
+import { Coordinates } from '@mt/common-types';
+import { Point } from 'react-simple-maps';
+
+export function getMapPoint({ lat, lon }: Coordinates): Point {
+  return [lon, lat];
+}
diff --git a/src/preview/components/MapWidget/utils/index.ts b/src/preview/components/MapWidget/utils/index.ts
new file mode 100644
index 0000000..649e252
--- /dev/null
+++ b/src/preview/components/MapWidget/utils/index.ts
@@ -0,0 +1,4 @@
+export * from './get-deviation';
+export * from './get-distance';
+export * from './get-map-point';
+export * from './intersections';
diff --git a/src/preview/components/MapWidget/utils/intersections.ts b/src/preview/components/MapWidget/utils/intersections.ts
new file mode 100644
index 0000000..9fd095b
--- /dev/null
+++ b/src/preview/components/MapWidget/utils/intersections.ts
@@ -0,0 +1,30 @@
+interface Rectangle {
+  left: number;
+  top: number;
+  right: number;
+  bottom: number;
+}
+
+export function getIntersection(rect1: Rectangle, rect2: Rectangle): Rectangle | null {
+  const left = Math.max(rect1.left, rect2.left);
+  const top = Math.max(rect1.top, rect2.top);
+  const right = Math.min(rect1.right, rect2.right);
+  const bottom = Math.min(rect1.bottom, rect2.bottom);
+
+  if (left < right && top < bottom) {
+    return { left, top, right, bottom };
+  }
+
+  return null;
+}
+
+export function getIntersectionArea(rect1: Rectangle, rect2: Rectangle): number {
+  const intersection = getIntersection(rect1, rect2);
+  if (intersection === null) {
+    return 0;
+  }
+
+  const width = intersection.right - intersection.left;
+  const height = intersection.bottom - intersection.top;
+  return width * height;
+}
diff --git a/src/preview/components/MyComponent/index.tsx b/src/preview/components/MyComponent/index.tsx
new file mode 100644
index 0000000..bbbf59e
--- /dev/null
+++ b/src/preview/components/MyComponent/index.tsx
@@ -0,0 +1,7 @@
+export const MyComponent = () => {
+  return (
+    <div style={{ width: "100px", height: "100px", backgroundColor: "red" }}>
+      MyComponent
+    </div>
+  );
+};
diff --git a/src/preview/components/RoutInfoWidget/RouteInfoWidget.module.css b/src/preview/components/RoutInfoWidget/RouteInfoWidget.module.css
new file mode 100644
index 0000000..45ddc4d
--- /dev/null
+++ b/src/preview/components/RoutInfoWidget/RouteInfoWidget.module.css
@@ -0,0 +1,67 @@
+.root {
+  display: flex;
+  background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%),
+    rgba(179, 165, 152, 0.4);
+  box-shadow: inset 4px 4px 12px rgba(255, 255, 255, 0.12);
+  border-radius: 10px;
+}
+
+.number {
+  width: 96px;
+  height: 96px;
+  background: #fcd500;
+  border-radius: 10px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 92px;
+  font-weight: 900;
+}
+
+.content {
+  width: 265px;
+  height: 96px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  padding: 8px;
+}
+
+.title {
+  white-space: nowrap;
+  overflow: hidden;
+}
+
+.crawlLine {
+  display: inline-block;
+  animation: crawl linear infinite;
+  animation-duration: 10s;
+  animation-timing-function: linear;
+  animation-iteration-count: infinite;
+}
+
+.titleStart,
+.titleEnd {
+  font-weight: 700;
+  font-size: 24px;
+  line-height: 28px;
+  color: #ffffff;
+}
+
+.titleTranslation {
+  margin-top: 4px;
+  font-weight: 400;
+  font-size: 12px;
+  line-height: 15px;
+
+  color: #cbcbcb;
+}
+
+@keyframes crawl {
+  0% {
+    transform: translateX(100%);
+  }
+  100% {
+    transform: translateX(-100%);
+  }
+}
diff --git a/src/preview/components/RoutInfoWidget/RouteInfoWidget.tsx b/src/preview/components/RoutInfoWidget/RouteInfoWidget.tsx
new file mode 100644
index 0000000..62ba49d
--- /dev/null
+++ b/src/preview/components/RoutInfoWidget/RouteInfoWidget.tsx
@@ -0,0 +1,74 @@
+import React, { HTMLAttributes, useContext, useEffect, useRef } from "react";
+import { LocalizationContext, LocalizedString } from "@mt/i18n";
+
+import styles from "./RouteInfoWidget.module.css";
+import cn from "classnames";
+
+export interface RouteInfoData {
+  routeNumber: string;
+  firstStationName: LocalizedString;
+  lastStationName: LocalizedString;
+}
+interface RouteInfoWidgetProps extends HTMLAttributes<HTMLDivElement> {
+  routeInfo?: RouteInfoData;
+}
+
+export function RouteInfoWidget({
+  routeInfo,
+  className,
+  ...props
+}: RouteInfoWidgetProps) {
+  const contentContainerRef = useRef<HTMLDivElement>(null);
+  const titleRefs = useRef<Array<HTMLSpanElement>>([]);
+
+  const { locale } = useContext(LocalizationContext);
+
+  useEffect(() => {
+    if (!routeInfo?.firstStationName || !routeInfo?.lastStationName) {
+      return;
+    }
+
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+    const container = contentContainerRef.current!;
+    const containerWidth = container.offsetWidth;
+
+    titleRefs.current.forEach((title) => {
+      const titleWidth = title.offsetWidth;
+      const paddingWidth = 8 * 2;
+
+      if (titleWidth + paddingWidth > containerWidth) {
+        title.classList.add(styles.crawlLine);
+      } else {
+        title.classList.remove(styles.crawlLine);
+      }
+    });
+  }, [routeInfo, titleRefs, contentContainerRef]);
+
+  return (
+    <div className={cn(styles.root, className)} {...props}>
+      <div className={styles.number}>{routeInfo?.routeNumber || "--"}</div>
+
+      {routeInfo ? (
+        <div className={styles.content} ref={contentContainerRef}>
+          <div className={cn(styles.title, styles.titleStart)}>
+            <span ref={(ref) => (titleRefs.current[0] = ref!)}>
+              {routeInfo.firstStationName.ru}
+            </span>
+          </div>
+          <div className={cn(styles.title, styles.titleEnd)}>
+            <span ref={(ref) => (titleRefs.current[1] = ref!)}>
+              {routeInfo.lastStationName.ru}
+            </span>
+          </div>
+          <div className={cn(styles.title, styles.titleTranslation)}>
+            <span ref={(ref) => (titleRefs.current[2] = ref!)}>
+              {locale === "zh"
+                ? `${routeInfo.firstStationName.zh} – ${routeInfo.lastStationName.zh}`
+                : `${routeInfo.firstStationName.en} – ${routeInfo.lastStationName.en}`}
+            </span>
+          </div>
+        </div>
+      ) : null}
+    </div>
+  );
+}
diff --git a/src/preview/components/TouchScrollWrapper/TouchScrollWrapper.module.css b/src/preview/components/TouchScrollWrapper/TouchScrollWrapper.module.css
new file mode 100644
index 0000000..ebb405c
--- /dev/null
+++ b/src/preview/components/TouchScrollWrapper/TouchScrollWrapper.module.css
@@ -0,0 +1,24 @@
+.root {
+  position: relative;
+  touch-action: none;
+  overflow-y: hidden !important;
+}
+
+.scrollbar {
+  --scrollbar-min-height: 10px;
+  --scrollbar-height: var(--scrollbar-min-height);
+  --scrollbar-offset: 0px;
+  --scrollbar-visibility: hidden;
+
+  position: absolute;
+  top: 0;
+  right: 0;
+  width: 3px;
+  border-radius: 6px;
+  z-index: 1;
+  background-color: #ffffff;
+  min-height: var(--scrollbar-min-height);
+  height: var(--scrollbar-height);
+  visibility: var(--scrollbar-visibility);
+  transform: translateY(var(--scrollbar-offset));
+}
diff --git a/src/preview/components/TouchScrollWrapper/TouchScrollWrapper.tsx b/src/preview/components/TouchScrollWrapper/TouchScrollWrapper.tsx
new file mode 100644
index 0000000..67f1cab
--- /dev/null
+++ b/src/preview/components/TouchScrollWrapper/TouchScrollWrapper.tsx
@@ -0,0 +1,142 @@
+import {
+  HTMLAttributes,
+  PointerEvent,
+  WheelEvent,
+  useEffect,
+  useRef,
+  useState,
+} from "react";
+import cn from "classnames";
+import styles from "./TouchScrollWrapper.module.css";
+import { useCssProperty } from "@mt/utils";
+
+const getNumberPxFormatter = (numberStr: string | null) =>
+  Number(numberStr?.replace(/px$/, ""));
+const setNumberPxFormatter = (number: number) => `${number}px`;
+
+const { abs, min } = Math;
+
+export const TouchScrollWrapper = ({
+  className,
+  children,
+  ...props
+}: HTMLAttributes<HTMLDivElement>) => {
+  const contentRef = useRef<HTMLDivElement>(null);
+  const containerRef = useRef<HTMLDivElement>(null);
+  const scrollbarRef = useRef<HTMLDivElement>(null);
+
+  const scrollbarHeight = useCssProperty<number>(
+    "--scrollbar-height",
+    scrollbarRef,
+    setNumberPxFormatter,
+    getNumberPxFormatter
+  );
+  const scrollbarVisibility = useCssProperty<string>(
+    "--scrollbar-visibility",
+    scrollbarRef
+  );
+  const scrollbarOffset = useCssProperty<number>(
+    "--scrollbar-offset",
+    scrollbarRef,
+    setNumberPxFormatter
+  );
+
+  const [contentHeight, setContentHeight] = useState<number>(0);
+  const [containerHeight, setContainerHeight] = useState<number>(0);
+  const [startSwipeY, setStartSwipeY] = useState<number>(0);
+  const [startContentOffset, setStartContentOffset] = useState<number>(0);
+  const [pointerId, setPointerId] = useState(0);
+
+  useEffect(() => {
+    const containerEl = containerRef?.current;
+    const contentEl = contentRef?.current;
+
+    if (!(containerEl && contentEl)) return;
+
+    const observer = new ResizeObserver(() => {
+      setContainerHeight(containerEl.offsetHeight);
+      setContentHeight(containerEl.scrollHeight);
+    });
+
+    observer.observe(containerEl);
+    observer.observe(contentEl);
+
+    return () => {
+      observer.disconnect();
+    };
+  }, []);
+
+  useEffect(() => {
+    if (containerHeight >= contentHeight) {
+      scrollbarVisibility.value = "hidden";
+    } else {
+      scrollbarHeight.value =
+        (containerHeight / contentHeight) * containerHeight + 1;
+      scrollbarVisibility.value = "visible";
+    }
+  }, [contentHeight, containerHeight]);
+
+  const handlePointerDown = (e: PointerEvent) => {
+    setStartSwipeY(e.clientY);
+    setStartContentOffset(containerRef?.current?.scrollTop || 0);
+  };
+
+  const handleTouchScroll = (e: PointerEvent) => {
+    const swipeDistance = startSwipeY - e.clientY;
+
+    if (
+      e.pointerType !== "touch" ||
+      containerHeight >= contentHeight ||
+      (pointerId && pointerId !== e.pointerId) ||
+      abs(swipeDistance) < 2
+    ) {
+      return;
+    }
+
+    setPointerId(e.pointerId);
+
+    containerRef?.current?.scrollTo(0, startContentOffset + swipeDistance);
+  };
+
+  const handleScroll = (e: WheelEvent) => {
+    if (containerHeight >= contentHeight) {
+      return;
+    }
+
+    containerRef?.current?.scrollBy(0, e.deltaY);
+  };
+
+  const capturePointerUp = (e: PointerEvent) => {
+    if (pointerId) {
+      e.preventDefault();
+      e.stopPropagation();
+      setPointerId(0);
+    }
+  };
+
+  const captureScroll = () => {
+    const { scrollTop } = containerRef.current as HTMLDivElement;
+    const barHeight = (scrollbarHeight.value as number) + 1; // plus 1 safety px!;
+    const barOffset = (scrollTop * barHeight) / containerHeight;
+    const maxBarOffset = containerHeight - barHeight;
+
+    scrollbarOffset.value = scrollTop + min(barOffset, maxBarOffset);
+  };
+
+  return (
+    <div
+      className={cn(styles.root, className)}
+      ref={containerRef}
+      onPointerDown={handlePointerDown}
+      onPointerMove={handleTouchScroll}
+      onPointerUpCapture={capturePointerUp}
+      onWheel={handleScroll}
+      onScroll={captureScroll}
+      {...props}
+    >
+      <div className={styles.scrollbar} ref={scrollbarRef} />
+
+      <div ref={contentRef}>{children}</div>
+    </div>
+  );
+};
diff --git a/src/preview/components/TransportIcon/TransportIcon.tsx b/src/preview/components/TransportIcon/TransportIcon.tsx
new file mode 100644
index 0000000..8fe4cef
--- /dev/null
+++ b/src/preview/components/TransportIcon/TransportIcon.tsx
@@ -0,0 +1,24 @@
+import { HTMLAttributes, ReactNode } from "react";
+
+import { Icons } from "../Icons";
+import { TransportType } from "@mt/common-types";
+
+const transportStopIcons: Record<TransportType, ReactNode> = {
+  METRO_RED: <Icons.SubwayIcon width="18" height="18" fill="#E52629" />,
+  METRO_BLUE: <Icons.SubwayIcon width="18" height="18" fill="#2D3B8E" />,
+  METRO_GREEN: <Icons.SubwayIcon width="18" height="18" fill="#056939" />,
+  METRO_ORANGE: <Icons.SubwayIcon width="18" height="18" fill="#EB5C2C" />,
+  METRO_PURPLE: <Icons.SubwayIcon width="18" height="18" fill="#64328A" />,
+  TRAM: <Icons.TramIcon width="18" height="18" />,
+  TRAIN: <Icons.TrainIcon width="18" height="18" />,
+  TROLLEY: <Icons.TrolleyIcon width="18" height="18" />,
+  BUS: <Icons.BusIcon width="18" height="18" />,
+};
+
+export interface TransportIconProps extends HTMLAttributes<HTMLDivElement> {
+  type: TransportType;
+}
+
+export function TransportIcon({ type, ...props }: TransportIconProps) {
+  return <div {...props}>{transportStopIcons[type]}</div>;
+}
diff --git a/src/preview/components/WeatherWidget/icons/DetHumidity.tsx b/src/preview/components/WeatherWidget/icons/DetHumidity.tsx
new file mode 100644
index 0000000..0bad0f7
--- /dev/null
+++ b/src/preview/components/WeatherWidget/icons/DetHumidity.tsx
@@ -0,0 +1,16 @@
+export const DetHumidity = () => {
+  return (
+    <svg
+      width="64"
+      height="64"
+      viewBox="0 0 64 64"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M32 63.68C19.42 63.68 9.19 53.45 9.19 40.87C9.19 28.25 22.63 9.87001 28.41 2.56001C29.28 1.45001 30.59 0.820007 32 0.820007C33.41 0.820007 34.72 1.45001 35.59 2.56001C41.37 9.88001 54.81 28.26 54.81 40.87C54.81 53.44 44.58 63.68 32 63.68ZM32 4.81001C31.9 4.81001 31.7 4.84001 31.55 5.03001C27.24 10.48 13.19 29.18 13.19 40.86C13.19 51.23 21.63 59.67 32 59.67C42.37 59.67 50.81 51.23 50.81 40.86C50.81 29.18 36.76 10.48 32.46 5.03001C32.3 4.84001 32.1 4.81001 32 4.81001Z"
+        fill="white"
+      />
+    </svg>
+  );
+};
diff --git a/src/preview/components/WeatherWidget/icons/DetWind.tsx b/src/preview/components/WeatherWidget/icons/DetWind.tsx
new file mode 100644
index 0000000..d0c1226
--- /dev/null
+++ b/src/preview/components/WeatherWidget/icons/DetWind.tsx
@@ -0,0 +1,24 @@
+export const DetWind = () => {
+  return (
+    <svg
+      width="64"
+      height="64"
+      viewBox="0 0 64 64"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M22.03 23.32H4.59998C3.49998 23.32 2.59998 22.42 2.59998 21.32C2.59998 20.22 3.49998 19.32 4.59998 19.32H22.02C26 19.32 29.24 16.08 29.24 12.1C29.24 8.12001 26 4.88 22.02 4.88C18.04 4.88 14.8 8.12001 14.8 12.1C14.8 13.2 13.9 14.1 12.8 14.1C11.7 14.1 10.8 13.2 10.8 12.1C10.8 5.91001 15.84 0.880005 22.02 0.880005C28.2 0.880005 33.24 5.92001 33.24 12.1C33.24 18.28 28.21 23.32 22.03 23.32Z"
+        fill="white"
+      />
+      <path
+        d="M50.17 34.3H14.15C13.05 34.3 12.15 33.4 12.15 32.3C12.15 31.2 13.05 30.3 14.15 30.3H50.17C54.15 30.3 57.39 27.06 57.39 23.08C57.39 19.1 54.15 15.86 50.17 15.86C46.19 15.86 42.95 19.1 42.95 23.08C42.95 24.18 42.05 25.08 40.95 25.08C39.85 25.08 38.95 24.18 38.95 23.08C38.95 16.89 43.99 11.86 50.17 11.86C56.36 11.86 61.39 16.9 61.39 23.08C61.39 29.26 56.36 34.3 50.17 34.3Z"
+        fill="white"
+      />
+      <path
+        d="M40.63 63.13C34.44 63.13 29.41 58.09 29.41 51.91C29.41 50.81 30.31 49.91 31.41 49.91C32.51 49.91 33.41 50.81 33.41 51.91C33.41 55.89 36.65 59.13 40.63 59.13C44.61 59.13 47.85 55.89 47.85 51.91C47.85 47.93 44.61 44.69 40.63 44.69H4.59998C3.49998 44.69 2.59998 43.79 2.59998 42.69C2.59998 41.59 3.49998 40.69 4.59998 40.69H40.62C46.81 40.69 51.84 45.73 51.84 51.91C51.84 58.09 46.82 63.13 40.63 63.13Z"
+        fill="white"
+      />
+    </svg>
+  );
+};
diff --git a/src/preview/components/WeatherWidget/icons/cond_cloudy.svg b/src/preview/components/WeatherWidget/icons/cond_cloudy.svg
new file mode 100644
index 0000000..f44242f
--- /dev/null
+++ b/src/preview/components/WeatherWidget/icons/cond_cloudy.svg
@@ -0,0 +1,3 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M47.15 14.23C46.84 14.23 46.53 14.24 46.23 14.26C44.81 14.34 43.42 13.73 42.63 12.54C39.6 7.98 34.51 5 28.75 5C21.58 5 15.45 9.63 13.02 16.15C12.62 17.24 11.72 18.08 10.61 18.44C4.47 20.42 0 26.35 0 33.36C0 42 6.78 49 15.15 49H47.15C56.46 49 64 41.22 64 31.61C64 22.01 56.46 14.23 47.15 14.23Z" fill="white"/>
+</svg>
diff --git a/src/preview/components/WeatherWidget/icons/cond_partlycloudy.svg b/src/preview/components/WeatherWidget/icons/cond_partlycloudy.svg
new file mode 100644
index 0000000..ac3626d
--- /dev/null
+++ b/src/preview/components/WeatherWidget/icons/cond_partlycloudy.svg
@@ -0,0 +1,4 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M49.0191 29.96C57.2891 29.96 63.9991 23.25 63.9991 14.98C63.9991 6.71 57.2891 0 49.0191 0C40.7491 0 34.0391 6.71 34.0391 14.98C34.0291 23.26 40.7391 29.96 49.0191 29.96Z" fill="#FCD500"/>
+<path d="M43.4668 17.3834C43.1948 17.3834 42.9128 17.3933 42.6408 17.4033C41.2708 17.4728 39.9713 16.8073 39.1957 15.6948C36.3852 11.6422 31.7514 9 26.5032 9C19.9655 9 14.3748 13.1122 12.078 18.933C11.6348 20.0554 10.7181 20.8997 9.56975 21.2871C4.00922 23.1545 0 28.4984 0 34.7859C0 42.633 6.25559 49 13.9718 49H43.4668C52.0393 49 59 41.9277 59 33.1967C59 24.4656 52.0493 17.3834 43.4668 17.3834Z" fill="white"/>
+</svg>
diff --git a/src/preview/components/WeatherWidget/icons/cond_rainy.svg b/src/preview/components/WeatherWidget/icons/cond_rainy.svg
new file mode 100644
index 0000000..41b4a56
--- /dev/null
+++ b/src/preview/components/WeatherWidget/icons/cond_rainy.svg
@@ -0,0 +1,7 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M47.15 11.22C46.84 11.22 46.53 11.23 46.23 11.25C44.81 11.33 43.42 10.72 42.63 9.53C39.59 4.98 34.51 2 28.75 2C21.58 2 15.45 6.63 13.02 13.15C12.62 14.24 11.72 15.08 10.61 15.44C4.47 17.41 0 23.35 0 30.35C0 38.99 6.78 45.99 15.15 45.99H47.15C56.45 45.99 64 38.21 64 28.6C64 19 56.46 11.22 47.15 11.22Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M17.6908 48.5015C18.4079 48.9162 18.6532 49.8337 18.2385 50.5509L14.4685 57.0709C14.0538 57.7881 13.1362 58.0333 12.4191 57.6186C11.7019 57.2039 11.4567 56.2864 11.8714 55.5692L15.6414 49.0492C16.0561 48.332 16.9736 48.0868 17.6908 48.5015Z" fill="#00B1FF"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M25.8607 53.2215C26.5779 53.6362 26.8231 54.5537 26.4084 55.2709L22.6384 61.7909C22.2237 62.508 21.3062 62.7533 20.589 62.3386C19.8718 61.9239 19.6266 61.0063 20.0413 60.2892L23.8113 53.7692C24.226 53.052 25.1435 52.8068 25.8607 53.2215Z" fill="#00B1FF"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M39.1988 48.9706C39.9165 49.3845 40.1627 50.3017 39.7489 51.0194L35.9889 57.5394C35.575 58.257 34.6578 58.5033 33.9401 58.0894C33.2225 57.6756 32.9762 56.7583 33.39 56.0407L37.1501 49.5207C37.5639 48.803 38.4812 48.5568 39.1988 48.9706Z" fill="#00B1FF"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M47.3687 53.6906C48.0864 54.1044 48.3326 55.0217 47.9188 55.7394L44.1588 62.2593C43.7449 62.977 42.8277 63.2233 42.11 62.8094C41.3924 62.3955 41.1461 61.4783 41.56 60.7606L45.32 54.2406C45.7338 53.523 46.6511 53.2767 47.3687 53.6906Z" fill="#00B1FF"/>
+</svg>
diff --git a/src/preview/components/WeatherWidget/icons/cond_snow.svg b/src/preview/components/WeatherWidget/icons/cond_snow.svg
new file mode 100644
index 0000000..b6e324e
--- /dev/null
+++ b/src/preview/components/WeatherWidget/icons/cond_snow.svg
@@ -0,0 +1,11 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M31.95 0.190002C33.0545 0.190002 33.95 1.08543 33.95 2.19V61.87C33.95 62.9746 33.0545 63.87 31.95 63.87C30.8454 63.87 29.95 62.9746 29.95 61.87V2.19C29.95 1.08543 30.8454 0.190002 31.95 0.190002Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M20.4458 4.92578C21.2268 4.14473 22.4932 4.14473 23.2742 4.92578L32.0107 13.6623L40.6265 5.05508C41.4079 4.27442 42.6742 4.27505 43.4549 5.05649C44.2356 5.83793 44.2349 7.10426 43.4535 7.88491L32.0093 19.3177L20.4458 7.75421C19.6647 6.97316 19.6647 5.70683 20.4458 4.92578Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M31.89 45.0416L43.4542 56.6058C44.2352 57.3868 44.2352 58.6532 43.4542 59.4342C42.6732 60.2153 41.4068 60.2153 40.6258 59.4342L31.89 50.6984L23.2742 59.3142C22.4932 60.0953 21.2268 60.0953 20.4458 59.3142C19.6647 58.5332 19.6647 57.2668 20.4458 56.4858L31.89 45.0416Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4.36797 16.1101C4.92021 15.1535 6.14337 14.8257 7.09998 15.3779L58.79 45.2179C59.7466 45.7701 60.0744 46.9933 59.5222 47.9499C58.9699 48.9065 57.7468 49.2343 56.7901 48.6821L5.10015 18.8421C4.14354 18.2899 3.81573 17.0667 4.36797 16.1101Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M14.3312 8.57847C15.398 8.29193 16.495 8.92441 16.7816 9.99117L20.981 25.6247L5.17684 29.8521C4.10978 30.1375 3.01339 29.5039 2.72797 28.4368C2.44255 27.3697 3.07619 26.2733 4.14324 25.9879L16.0791 22.7953L12.9185 11.0288C12.632 9.96208 13.2645 8.86502 14.3312 8.57847Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M49.6571 8.51802C50.7242 8.80363 51.3576 9.90015 51.072 10.9672L47.8787 22.8969L59.6488 26.0585C60.7156 26.345 61.3481 27.4421 61.0615 28.5088C60.775 29.5756 59.6779 30.2081 58.6112 29.9215L42.9813 25.7232L47.208 9.93286C47.4936 8.86585 48.5901 8.23241 49.6571 8.51802Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M2.56812 35.7025C2.85394 34.6355 3.95058 34.0023 5.01753 34.2881L20.65 38.4758L16.4117 54.2781C16.1256 55.345 15.0288 55.9779 13.9619 55.6917C12.895 55.4056 12.2621 54.3088 12.5483 53.2419L15.75 41.3042L3.98249 38.1519C2.91554 37.8661 2.28231 36.7694 2.56812 35.7025Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M61.4318 35.7619C61.7179 36.8288 61.085 37.9256 60.0181 38.2117L48.0793 41.4138L51.2319 53.1825C51.5177 54.2494 50.8845 55.3461 49.8176 55.6319C48.7506 55.9177 47.654 55.2845 47.3681 54.2175L43.1808 38.5862L58.9819 34.3483C60.0488 34.0621 61.1456 34.695 61.4318 35.7619Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M59.5222 16.1101C60.0744 17.0667 59.7466 18.2899 58.79 18.8421L7.09998 48.6821C6.14337 49.2343 4.92021 48.9065 4.36797 47.9499C3.81573 46.9933 4.14354 45.7701 5.10015 45.2179L56.7901 15.3779C57.7468 14.8257 58.9699 15.1535 59.5222 16.1101Z" fill="white"/>
+</svg>
diff --git a/src/preview/components/WeatherWidget/icons/cond_snowy.svg b/src/preview/components/WeatherWidget/icons/cond_snowy.svg
new file mode 100644
index 0000000..e3ab988
--- /dev/null
+++ b/src/preview/components/WeatherWidget/icons/cond_snowy.svg
@@ -0,0 +1,11 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M47.15 10.22C46.84 10.22 46.53 10.23 46.23 10.25C44.81 10.33 43.42 9.72 42.63 8.53C39.59 3.98 34.51 1 28.75 1C21.58 1 15.45 5.63 13.02 12.15C12.62 13.24 11.72 14.08 10.61 14.44C4.47 16.42 0 22.35 0 29.36C0 38 6.78 45 15.15 45H47.15C56.45 45 64 37.22 64 27.61C64 18.01 56.46 10.22 47.15 10.22Z" fill="white"/>
+<path d="M34.6995 58.07C35.5334 58.07 36.2095 57.394 36.2095 56.56C36.2095 55.7261 35.5334 55.05 34.6995 55.05C33.8655 55.05 33.1895 55.7261 33.1895 56.56C33.1895 57.394 33.8655 58.07 34.6995 58.07Z" fill="white"/>
+<path d="M38.4397 51.5901C39.2736 51.5901 39.9497 50.914 39.9497 50.0801C39.9497 49.2461 39.2736 48.5701 38.4397 48.5701C37.6057 48.5701 36.9297 49.2461 36.9297 50.0801C36.9297 50.914 37.6057 51.5901 38.4397 51.5901Z" fill="white"/>
+<path d="M42.8694 62.82C43.7033 62.82 44.3794 62.144 44.3794 61.31C44.3794 60.4761 43.7033 59.8 42.8694 59.8C42.0354 59.8 41.3594 60.4761 41.3594 61.31C41.3594 62.144 42.0354 62.82 42.8694 62.82Z" fill="white"/>
+<path d="M46.6096 56.3401C47.4436 56.3401 48.1196 55.664 48.1196 54.8301C48.1196 53.9961 47.4436 53.3201 46.6096 53.3201C45.7757 53.3201 45.0996 53.9961 45.0996 54.8301C45.0996 55.664 45.7757 56.3401 46.6096 56.3401Z" fill="white"/>
+<path d="M13.1799 58.07C14.0139 58.07 14.6899 57.394 14.6899 56.56C14.6899 55.7261 14.0139 55.05 13.1799 55.05C12.346 55.05 11.6699 55.7261 11.6699 56.56C11.6699 57.394 12.346 58.07 13.1799 58.07Z" fill="white"/>
+<path d="M16.9202 51.5901C17.7541 51.5901 18.4302 50.914 18.4302 50.0801C18.4302 49.2461 17.7541 48.5701 16.9202 48.5701C16.0862 48.5701 15.4102 49.2461 15.4102 50.0801C15.4102 50.914 16.0862 51.5901 16.9202 51.5901Z" fill="white"/>
+<path d="M21.3498 62.82C22.1838 62.82 22.8598 62.144 22.8598 61.31C22.8598 60.4761 22.1838 59.8 21.3498 59.8C20.5159 59.8 19.8398 60.4761 19.8398 61.31C19.8398 62.144 20.5159 62.82 21.3498 62.82Z" fill="white"/>
+<path d="M25.0901 56.3401C25.924 56.3401 26.6001 55.664 26.6001 54.8301C26.6001 53.9961 25.924 53.3201 25.0901 53.3201C24.2561 53.3201 23.5801 53.9961 23.5801 54.8301C23.5801 55.664 24.2561 56.3401 25.0901 56.3401Z" fill="white"/>
+</svg>
diff --git a/src/preview/components/WeatherWidget/icons/cond_sunny.svg b/src/preview/components/WeatherWidget/icons/cond_sunny.svg
new file mode 100644
index 0000000..7c8c107
--- /dev/null
+++ b/src/preview/components/WeatherWidget/icons/cond_sunny.svg
@@ -0,0 +1,18 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_383_344)">
+<path d="M19.3993 21.64C18.8293 21.64 18.2593 21.42 17.8193 20.99L9.3693 12.53C8.4993 11.66 8.4993 10.25 9.3693 9.38004C10.2393 8.51004 11.6493 8.51004 12.5193 9.38004L20.9693 17.83C21.8393 18.7 21.8393 20.11 20.9693 20.98C20.5393 21.42 19.9693 21.64 19.3993 21.64Z" fill="#FCD500"/>
+<path d="M61.7701 34.24H49.8101C48.5801 34.24 47.5801 33.24 47.5801 32.01C47.5801 30.78 48.5801 29.78 49.8101 29.78H61.7701C63.0001 29.78 64.0001 30.78 64.0001 32.01C64.0001 33.24 63.0001 34.24 61.7701 34.24Z" fill="#FCD500"/>
+<path d="M44.5997 21.64C44.0297 21.64 43.4597 21.42 43.0197 20.99C42.1497 20.12 42.1497 18.71 43.0197 17.84L51.4697 9.39005C52.3397 8.52005 53.7497 8.52005 54.6197 9.39005C55.4897 10.26 55.4897 11.67 54.6197 12.54L46.1697 20.99C45.7397 21.42 45.1697 21.64 44.5997 21.64Z" fill="#FCD500"/>
+<path d="M31.9995 16.42C30.7695 16.42 29.7695 15.42 29.7695 14.19V2.23C29.7695 1 30.7695 0 31.9995 0C33.2295 0 34.2295 1 34.2295 2.23V14.19C34.2295 15.42 33.2295 16.42 31.9995 16.42Z" fill="#FCD500"/>
+<path d="M14.19 34.24H2.24C1 34.24 0 33.24 0 32.01C0 30.78 1 29.78 2.23 29.78H14.18C15.41 29.78 16.41 30.78 16.41 32.01C16.41 33.24 15.42 34.24 14.19 34.24Z" fill="#FCD500"/>
+<path d="M10.9493 55.29C10.3793 55.29 9.8093 55.0699 9.3693 54.6399C8.4993 53.7699 8.4993 52.36 9.3693 51.49L17.8193 43.04C18.6893 42.17 20.0993 42.17 20.9693 43.04C21.8393 43.91 21.8393 45.3199 20.9693 46.1899L12.5193 54.6399C12.0893 55.0699 11.5193 55.29 10.9493 55.29Z" fill="#FCD500"/>
+<path d="M31.9995 64.0098C30.7695 64.0098 29.7695 63.0098 29.7695 61.7798V49.8198C29.7695 48.5898 30.7695 47.5898 31.9995 47.5898C33.2295 47.5898 34.2295 48.5898 34.2295 49.8198V61.7798C34.2295 63.0098 33.2295 64.0098 31.9995 64.0098Z" fill="#FCD500"/>
+<path d="M53.0497 55.29C52.4797 55.29 51.9097 55.0699 51.4697 54.6399L43.0197 46.1899C42.1497 45.3199 42.1497 43.91 43.0197 43.04C43.8897 42.17 45.2997 42.17 46.1697 43.04L54.6197 51.49C55.4897 52.36 55.4897 53.7699 54.6197 54.6399C54.1897 55.0699 53.6197 55.29 53.0497 55.29Z" fill="#FCD500"/>
+<path d="M32 43.9299C38.6252 43.9299 44 38.5551 44 31.9299C44 25.3047 38.6252 19.9299 32 19.9299C25.3748 19.9299 20 25.3047 20 31.9299C20 38.5551 25.3748 43.9299 32 43.9299Z" fill="#FCD500"/>
+</g>
+<defs>
+<clipPath id="clip0_383_344">
+<rect width="64" height="64" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/src/preview/components/WeatherWidget/icons/cond_thunder.svg b/src/preview/components/WeatherWidget/icons/cond_thunder.svg
new file mode 100644
index 0000000..3158680
--- /dev/null
+++ b/src/preview/components/WeatherWidget/icons/cond_thunder.svg
@@ -0,0 +1,4 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M47.15 12.22C46.84 12.22 46.53 12.23 46.23 12.25C44.81 12.33 43.42 11.72 42.63 10.53C39.59 5.98 34.51 3 28.75 3C21.58 3 15.45 7.63 13.02 14.15C12.62 15.24 11.72 16.08 10.61 16.44C4.47 18.42 0 24.35 0 31.35C0 39.99 6.78 46.99 15.15 46.99H47.15C56.45 46.99 64 39.21 64 29.6C64 20 56.46 12.22 47.15 12.22Z" fill="white"/>
+<path d="M26.0996 47.0101L47.6396 22.1001L44.5296 36.8901H56.9796L33.3696 61.8001L37.0596 47.0101H26.0996Z" fill="#FCD500"/>
+</svg>
diff --git a/src/preview/components/WeatherWidget/icons/det_humidity.svg b/src/preview/components/WeatherWidget/icons/det_humidity.svg
new file mode 100644
index 0000000..b464149
--- /dev/null
+++ b/src/preview/components/WeatherWidget/icons/det_humidity.svg
@@ -0,0 +1,3 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M32 63.68C19.42 63.68 9.19 53.45 9.19 40.87C9.19 28.25 22.63 9.87001 28.41 2.56001C29.28 1.45001 30.59 0.820007 32 0.820007C33.41 0.820007 34.72 1.45001 35.59 2.56001C41.37 9.88001 54.81 28.26 54.81 40.87C54.81 53.44 44.58 63.68 32 63.68ZM32 4.81001C31.9 4.81001 31.7 4.84001 31.55 5.03001C27.24 10.48 13.19 29.18 13.19 40.86C13.19 51.23 21.63 59.67 32 59.67C42.37 59.67 50.81 51.23 50.81 40.86C50.81 29.18 36.76 10.48 32.46 5.03001C32.3 4.84001 32.1 4.81001 32 4.81001Z" fill="white"/>
+</svg>
diff --git a/src/preview/components/WeatherWidget/icons/det_wind.svg b/src/preview/components/WeatherWidget/icons/det_wind.svg
new file mode 100644
index 0000000..1388939
--- /dev/null
+++ b/src/preview/components/WeatherWidget/icons/det_wind.svg
@@ -0,0 +1,5 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M22.03 23.32H4.59998C3.49998 23.32 2.59998 22.42 2.59998 21.32C2.59998 20.22 3.49998 19.32 4.59998 19.32H22.02C26 19.32 29.24 16.08 29.24 12.1C29.24 8.12001 26 4.88 22.02 4.88C18.04 4.88 14.8 8.12001 14.8 12.1C14.8 13.2 13.9 14.1 12.8 14.1C11.7 14.1 10.8 13.2 10.8 12.1C10.8 5.91001 15.84 0.880005 22.02 0.880005C28.2 0.880005 33.24 5.92001 33.24 12.1C33.24 18.28 28.21 23.32 22.03 23.32Z" fill="white"/>
+<path d="M50.17 34.3H14.15C13.05 34.3 12.15 33.4 12.15 32.3C12.15 31.2 13.05 30.3 14.15 30.3H50.17C54.15 30.3 57.39 27.06 57.39 23.08C57.39 19.1 54.15 15.86 50.17 15.86C46.19 15.86 42.95 19.1 42.95 23.08C42.95 24.18 42.05 25.08 40.95 25.08C39.85 25.08 38.95 24.18 38.95 23.08C38.95 16.89 43.99 11.86 50.17 11.86C56.36 11.86 61.39 16.9 61.39 23.08C61.39 29.26 56.36 34.3 50.17 34.3Z" fill="white"/>
+<path d="M40.63 63.13C34.44 63.13 29.41 58.09 29.41 51.91C29.41 50.81 30.31 49.91 31.41 49.91C32.51 49.91 33.41 50.81 33.41 51.91C33.41 55.89 36.65 59.13 40.63 59.13C44.61 59.13 47.85 55.89 47.85 51.91C47.85 47.93 44.61 44.69 40.63 44.69H4.59998C3.49998 44.69 2.59998 43.79 2.59998 42.69C2.59998 41.59 3.49998 40.69 4.59998 40.69H40.62C46.81 40.69 51.84 45.73 51.84 51.91C51.84 58.09 46.82 63.13 40.63 63.13Z" fill="white"/>
+</svg>
diff --git a/src/preview/components/WeatherWidget/index.ts b/src/preview/components/WeatherWidget/index.ts
new file mode 100644
index 0000000..cac74bb
--- /dev/null
+++ b/src/preview/components/WeatherWidget/index.ts
@@ -0,0 +1,3 @@
+export * from './weather-widget';
+export * from './weather.interface';
+export * from './weather.constant';
diff --git a/src/preview/components/WeatherWidget/weather-widget-icon.tsx b/src/preview/components/WeatherWidget/weather-widget-icon.tsx
new file mode 100644
index 0000000..cc2816b
--- /dev/null
+++ b/src/preview/components/WeatherWidget/weather-widget-icon.tsx
@@ -0,0 +1,44 @@
+import { createElement } from "react";
+import IconCloudy from "./icons/cond_cloudy.svg";
+import IconRainy from "./icons/cond_rainy.svg";
+import IconPartlyCloudy from "./icons/cond_partlycloudy.svg";
+import IconSnow from "./icons/cond_snow.svg";
+import IconSnowy from "./icons/cond_snowy.svg";
+import IconSunny from "./icons/cond_sunny.svg";
+import IconThunder from "./icons/cond_thunder.svg";
+
+interface WeatherWidgetIconProps {
+  icon: string | null;
+  size: number;
+}
+
+const Icons = {
+  CLOUDY: IconCloudy,
+  RAINY: IconRainy,
+  PARTLYCLOUDY: IconPartlyCloudy,
+  SNOW: IconSnow,
+  SNOWY: IconSnowy,
+  SUNNY: IconSunny,
+  THUNDER: IconThunder,
+};
+
+export function WeatherWidgetIcon({ icon, size = 16 }: WeatherWidgetIconProps) {
+  const svg = Icons[icon as keyof typeof Icons] || null;
+  if (!svg || !icon)
+    return (
+      <div
+        style={{
+          width: `${size}px`,
+          height: `${size}px`,
+          textAlign: "center",
+          margin: "0 auto",
+          fontSize: `${size}px`,
+          lineHeight: 1,
+          overflow: "hidden",
+        }}
+        children="--"
+      />
+    );
+
+  return createElement(svg);
+}
diff --git a/src/preview/components/WeatherWidget/weather-widget-right.tsx b/src/preview/components/WeatherWidget/weather-widget-right.tsx
new file mode 100644
index 0000000..b03e118
--- /dev/null
+++ b/src/preview/components/WeatherWidget/weather-widget-right.tsx
@@ -0,0 +1,77 @@
+import { WeatherWidgetIcon } from "./weather-widget-icon";
+
+import IconHumidity from "./icons/det_humidity.svg";
+import IconWind from "./icons/det_wind.svg";
+import { WeatherDayRow, WeatherWidgetData } from "./weather.interface";
+
+const Weekdays = ["Вс", "Пн", "Вт", "Ср", "Чт", "Пт", "Сб", "Вс"];
+
+const WRow = ({ temperature, weekday, condition }: WeatherDayRow) => (
+  <div
+    style={{
+      display: "flex",
+      marginBottom: "8px",
+    }}
+  >
+    <div
+      style={{
+        width: 16,
+        height: 16,
+      }}
+    >
+      <WeatherWidgetIcon icon={condition} size={16} />
+    </div>
+    <div style={{ marginLeft: 8, minWidth: 22 }} children={Weekdays[weekday]} />
+    <div style={{ marginLeft: 8 }} children={`${temperature ?? "--"}°`} />
+  </div>
+);
+
+export function WeatherWidgetRight({
+  forecasts,
+  weatherInfo,
+}: WeatherWidgetData) {
+  const wd = new Date().getDay();
+  return (
+    <div
+      style={{
+        textAlign: "center",
+        width: "50%",
+        fontSize: 18,
+        lineHeight: "21px",
+      }}
+    >
+      <div
+        style={{
+          borderBottom: "1px solid #999",
+          marginBottom: "8px",
+          marginTop: "8px",
+        }}
+      >
+        {[...forecasts].slice(0, 3).map((d, idx) => (
+          <WRow key={idx} {...d?.weatherInfo} weekday={(wd + idx + 1) % 7} />
+        ))}
+      </div>
+
+      <div
+        style={{
+          display: "flex",
+          alignItems: "center",
+          marginBottom: 8,
+        }}
+      >
+        <IconHumidity />
+        <b children={weatherInfo?.humidity ?? "--"} />%
+      </div>
+      <div
+        style={{
+          display: "flex",
+          alignItems: "center",
+        }}
+      >
+        <IconWind />
+        <b children={weatherInfo?.windSpeed ?? "--"} />
+        &nbsp;м/с
+      </div>
+    </div>
+  );
+}
diff --git a/src/preview/components/WeatherWidget/weather-widget-time.tsx b/src/preview/components/WeatherWidget/weather-widget-time.tsx
new file mode 100644
index 0000000..18b85c2
--- /dev/null
+++ b/src/preview/components/WeatherWidget/weather-widget-time.tsx
@@ -0,0 +1,54 @@
+import { useEffect, useState } from 'react';
+
+const add0 = (val: number) => `${val < 10 ? '0' : ''}${val}`;
+const weekdays = [
+  'воскресенье',
+  'понедельник',
+  'вторник',
+  'среда',
+  'четверг',
+  'пятница',
+  'суббота',
+  'воскресенье',
+];
+
+export function WeatherWidgetTime() {
+  const [now, setNow] = useState(new Date());
+
+  useEffect(() => {
+    const interval = setInterval(() => setNow(new Date()), 1000);
+
+    return () => clearInterval(interval);
+  }, []);
+
+  return (
+    <div
+      style={{
+        textAlign: 'center',
+        borderBottom: '1px solid #999',
+        paddingBottom: '13px',
+      }}
+    >
+      <div
+        style={{
+          fontWeight: 600,
+          fontSize: '48px',
+          lineHeight: '56px',
+        }}
+      >
+        {now.getHours()}
+        <span children={':'} style={{ opacity: now.getSeconds() % 4 !== 3 ? 1 : 0 }} />
+        {add0(now.getMinutes())}
+      </div>
+      <div
+        style={{
+          fontWeight: 400,
+          fontSize: '14px',
+          lineHeight: '1',
+        }}
+      >
+        {now.getDate()}.{add0(now.getMonth() + 1)}, {weekdays[now.getDay()]}
+      </div>
+    </div>
+  );
+}
diff --git a/src/preview/components/WeatherWidget/weather-widget-today.tsx b/src/preview/components/WeatherWidget/weather-widget-today.tsx
new file mode 100644
index 0000000..fe88d3a
--- /dev/null
+++ b/src/preview/components/WeatherWidget/weather-widget-today.tsx
@@ -0,0 +1,48 @@
+import { WeatherWidgetIcon } from './weather-widget-icon';
+import { WeatherDayProps } from './weather.interface';
+
+const WeatherTypes = {
+  RAINY: 'дождь',
+  CLOUDY: 'облачно',
+  PARTLYCLOUDY: 'переменная облачность',
+  SNOW: 'снег',
+  SNOWY: 'идет снег',
+  SUNNY: 'солнце',
+  THUNDER: '',
+  UNKNOWN: 'неизвестно',
+};
+
+export function WeatherWidgetToday(props: WeatherDayProps) {
+  const { temperature, condition } = props;
+
+  const wType = WeatherTypes[condition as keyof typeof WeatherTypes] ?? WeatherTypes.UNKNOWN;
+
+  return (
+    <div
+      style={{
+        textAlign: 'center',
+        width: '50%',
+      }}
+    >
+      <div>
+        <WeatherWidgetIcon icon={condition} size={72} />
+      </div>
+      <div
+        style={{
+          fontSize: 52,
+          lineHeight: '61px',
+          fontWeight: '600',
+          letterSpacing: '-.075',
+        }}
+        children={`${temperature ?? '--'}°`}
+      />
+      <div
+        style={{
+          fontSize: 16,
+          lineHeight: '18.75px',
+        }}
+        children={wType}
+      />
+    </div>
+  );
+}
diff --git a/src/preview/components/WeatherWidget/weather-widget.tsx b/src/preview/components/WeatherWidget/weather-widget.tsx
new file mode 100644
index 0000000..c515ad8
--- /dev/null
+++ b/src/preview/components/WeatherWidget/weather-widget.tsx
@@ -0,0 +1,46 @@
+import styled from '@emotion/styled';
+import { HTMLAttributes } from 'react';
+import { WeatherWidgetRight } from './weather-widget-right';
+import { WeatherWidgetTime } from './weather-widget-time';
+import { WeatherWidgetToday } from './weather-widget-today';
+import { WeatherWidgetData } from './weather.interface';
+import { WEATHER_DEFAULTS } from './weather.constant';
+
+const StyledWeatherWidget = styled.div`
+  width: 225px;
+  height: 260px;
+  padding: 8px;
+
+  background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%),
+    rgba(179, 165, 152, 0.4);
+  box-shadow: inset 4px 4px 12px rgba(255, 255, 255, 0.12);
+  backdrop-filter: blur(6px);
+  color: #fff;
+  font-weight: 400;
+
+  border-radius: 10px;
+`;
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  weatherData?: WeatherWidgetData;
+}
+
+export function WeatherWidget({ weatherData = WEATHER_DEFAULTS, ...props }: Props) {
+  const { weatherInfo, forecasts } = weatherData;
+
+  return (
+    <StyledWeatherWidget {...props}>
+      <WeatherWidgetTime />
+      <div
+        style={{
+          display: 'flex',
+          justifyContent: 'space-between',
+          marginTop: '8px',
+        }}
+      >
+        <WeatherWidgetToday {...weatherInfo} />
+        <WeatherWidgetRight weatherInfo={weatherInfo} forecasts={forecasts} />
+      </div>
+    </StyledWeatherWidget>
+  );
+}
diff --git a/src/preview/components/WeatherWidget/weather.constant.ts b/src/preview/components/WeatherWidget/weather.constant.ts
new file mode 100644
index 0000000..1abc7aa
--- /dev/null
+++ b/src/preview/components/WeatherWidget/weather.constant.ts
@@ -0,0 +1,28 @@
+export const WEATHER_DEFAULTS = {
+  weatherInfo: {
+    condition: null,
+    temperature: null,
+    humidity: null,
+    windSpeed: null,
+  },
+  forecasts: [
+    {
+      weatherInfo: {
+        condition: null,
+        temperature: null,
+      },
+    },
+    {
+      weatherInfo: {
+        condition: null,
+        temperature: null,
+      },
+    },
+    {
+      weatherInfo: {
+        condition: null,
+        temperature: null,
+      },
+    },
+  ],
+};
diff --git a/src/preview/components/WeatherWidget/weather.interface.ts b/src/preview/components/WeatherWidget/weather.interface.ts
new file mode 100644
index 0000000..d6301b6
--- /dev/null
+++ b/src/preview/components/WeatherWidget/weather.interface.ts
@@ -0,0 +1,29 @@
+export type WeatherTypes =
+  | 'CLOUDY'
+  | 'PARTLYCLOUDY'
+  | 'RAINY'
+  | 'SNOW'
+  | 'SNOWY'
+  | 'SUNNY'
+  | 'THUNDER';
+
+export interface WeatherDayShortProps {
+  condition: WeatherTypes | null;
+  temperature: number | null;
+}
+export type WeatherDayProps = WeatherDayShortProps & {
+  humidity: number | null;
+  windSpeed: number | null;
+};
+export interface WeatherForecastsProps {
+  weatherInfo: WeatherDayShortProps;
+}
+
+export interface WeatherWidgetData {
+  forecasts: WeatherForecastsProps[];
+  weatherInfo: WeatherDayProps;
+}
+
+export type WeatherDayRow = WeatherDayShortProps & {
+  weekday: number;
+};
diff --git a/src/preview/components/fonts/LICENSE.txt b/src/preview/components/fonts/LICENSE.txt
new file mode 100644
index 0000000..d645695
--- /dev/null
+++ b/src/preview/components/fonts/LICENSE.txt
@@ -0,0 +1,202 @@
+
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "[]"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright [yyyy] [name of copyright owner]
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.
diff --git a/src/preview/components/fonts/Roboto-Black.ttf b/src/preview/components/fonts/Roboto-Black.ttf
new file mode 100644
index 0000000..0112e7d
Binary files /dev/null and b/src/preview/components/fonts/Roboto-Black.ttf differ
diff --git a/src/preview/components/fonts/Roboto-BlackItalic.ttf b/src/preview/components/fonts/Roboto-BlackItalic.ttf
new file mode 100644
index 0000000..b2c6aca
Binary files /dev/null and b/src/preview/components/fonts/Roboto-BlackItalic.ttf differ
diff --git a/src/preview/components/fonts/Roboto-Bold.ttf b/src/preview/components/fonts/Roboto-Bold.ttf
new file mode 100644
index 0000000..43da14d
Binary files /dev/null and b/src/preview/components/fonts/Roboto-Bold.ttf differ
diff --git a/src/preview/components/fonts/Roboto-BoldItalic.ttf b/src/preview/components/fonts/Roboto-BoldItalic.ttf
new file mode 100644
index 0000000..bcfdab4
Binary files /dev/null and b/src/preview/components/fonts/Roboto-BoldItalic.ttf differ
diff --git a/src/preview/components/fonts/Roboto-Italic.ttf b/src/preview/components/fonts/Roboto-Italic.ttf
new file mode 100644
index 0000000..1b5eaa3
Binary files /dev/null and b/src/preview/components/fonts/Roboto-Italic.ttf differ
diff --git a/src/preview/components/fonts/Roboto-Light.ttf b/src/preview/components/fonts/Roboto-Light.ttf
new file mode 100644
index 0000000..e7307e7
Binary files /dev/null and b/src/preview/components/fonts/Roboto-Light.ttf differ
diff --git a/src/preview/components/fonts/Roboto-LightItalic.ttf b/src/preview/components/fonts/Roboto-LightItalic.ttf
new file mode 100644
index 0000000..2d277af
Binary files /dev/null and b/src/preview/components/fonts/Roboto-LightItalic.ttf differ
diff --git a/src/preview/components/fonts/Roboto-Medium.ttf b/src/preview/components/fonts/Roboto-Medium.ttf
new file mode 100644
index 0000000..ac0f908
Binary files /dev/null and b/src/preview/components/fonts/Roboto-Medium.ttf differ
diff --git a/src/preview/components/fonts/Roboto-MediumItalic.ttf b/src/preview/components/fonts/Roboto-MediumItalic.ttf
new file mode 100644
index 0000000..fc36a47
Binary files /dev/null and b/src/preview/components/fonts/Roboto-MediumItalic.ttf differ
diff --git a/src/preview/components/fonts/Roboto-Regular.ttf b/src/preview/components/fonts/Roboto-Regular.ttf
new file mode 100644
index 0000000..ddf4bfa
Binary files /dev/null and b/src/preview/components/fonts/Roboto-Regular.ttf differ
diff --git a/src/preview/components/fonts/Roboto-Thin.ttf b/src/preview/components/fonts/Roboto-Thin.ttf
new file mode 100644
index 0000000..2e0dee6
Binary files /dev/null and b/src/preview/components/fonts/Roboto-Thin.ttf differ
diff --git a/src/preview/components/fonts/Roboto-ThinItalic.ttf b/src/preview/components/fonts/Roboto-ThinItalic.ttf
new file mode 100644
index 0000000..084f9c0
Binary files /dev/null and b/src/preview/components/fonts/Roboto-ThinItalic.ttf differ
diff --git a/src/preview/components/icons/index.tsx b/src/preview/components/icons/index.tsx
new file mode 100644
index 0000000..b833c61
--- /dev/null
+++ b/src/preview/components/icons/index.tsx
@@ -0,0 +1,1938 @@
+/* 🤖 this file was generated by svg-to-ts */
+import { SVGAttributes } from "react";
+
+export const Icons = {
+  SortIcon: (props: SVGAttributes<SVGElement>) => (
+    <svg
+      viewBox="0 0 48 48"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M24 0C10.75 0 0 10.75 0 24C0 37.25 10.75 48 24 48C37.25 48 48 37.25 48 24C48 10.75 37.25 0 24 0ZM26.18 33.63H13.27C12.44 33.63 11.77 32.96 11.77 32.13C11.77 31.3 12.44 30.63 13.27 30.63H26.19C27.02 30.63 27.69 31.3 27.69 32.13C27.69 32.96 27.01 33.63 26.18 33.63ZM30.46 25.62H13.26C12.43 25.62 11.76 24.95 11.76 24.12C11.76 23.29 12.43 22.62 13.26 22.62H30.46C31.29 22.62 31.96 23.29 31.96 24.12C31.96 24.95 31.29 25.62 30.46 25.62ZM34.73 17.37H13.27C12.44 17.37 11.77 16.7 11.77 15.87C11.77 15.04 12.44 14.37 13.27 14.37H34.73C35.56 14.37 36.23 15.04 36.23 15.87C36.23 16.7 35.56 17.37 34.73 17.37Z"
+        fill="white"
+      />
+    </svg>
+  ),
+  ChevronIcon: (props: SVGAttributes<SVGElement>) => (
+    <svg
+      viewBox="0 0 21 12"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <g clipPath="url(#clip0_658_91956)">
+        <path
+          d="M10.426 3.53158C10.2911 3.71878 10.2232 3.84702 10.1251 3.9453C7.63105 6.43048 5.13328 8.91098 2.63927 11.3962C2.19311 11.8408 1.67902 12.0186 1.0659 11.8361C0.0339623 11.5281 -0.339573 10.2776 0.349957 9.45295C0.425419 9.36309 0.510313 9.28165 0.593321 9.19928C3.4552 6.35279 6.31802 3.50537 9.18084 0.659815C10.0656 -0.219125 10.8542 -0.218188 11.7399 0.661687C14.6367 3.54 17.5382 6.41457 20.4199 9.30786C20.6708 9.55966 20.8802 9.91441 20.9623 10.2561C21.117 10.9019 20.7783 11.515 20.2133 11.8193C19.6464 12.1263 18.939 12.0392 18.4485 11.5806C18.0712 11.2286 17.7127 10.8561 17.3477 10.491C15.1442 8.29601 12.9407 6.10193 10.7391 3.90599C10.6561 3.82362 10.5891 3.72721 10.4269 3.53158L10.426 3.53158Z"
+          fill="white"
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_658_91956">
+          <rect
+            width={21}
+            height={12}
+            fill="white"
+            transform="translate(21 12) rotate(-180)"
+          />
+        </clipPath>
+      </defs>
+    </svg>
+  ),
+  ArrowBtn: (props: SVGAttributes<SVGElement>) => (
+    <svg
+      viewBox="0 0 48 48"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M24 0C10.75 0 0 10.75 0 24s10.75 24 24 24 24-10.75 24-24S37.25 0 24 0zm13.54 25.84c0 .56-.45 1.01-1.01 1.01H20.59c-.45 0-.67.54-.36.86l7.45 7.45c.4.4.4 1.04 0 1.43l-2.6 2.6c-.4.4-1.04.4-1.43 0L12.49 28.03l-3.32-3.32c-.4-.4-.4-1.04 0-1.43l3.32-3.32L23.65 8.8c.4-.4 1.04-.4 1.43 0l2.6 2.6c.4.4.4 1.04 0 1.43l-7.45 7.45c-.32.32-.09.86.36.86h15.94c.56 0 1.01.45 1.01 1.01v3.69z"
+        fill="white"
+      />
+    </svg>
+  ),
+  AttractionIcon: (props: SVGAttributes<SVGElement>) => (
+    <svg
+      viewBox="0 0 60 60"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M3.6413 25.7502H56.3587V21.8174L30.0075 5.82058L3.6413 21.8174V25.7502ZM30.0072 9.57771L8.3946 22.6821H51.6049L30.0072 9.57771Z"
+        fill="#A6A6A6"
+      />
+      <path d="M56.3587 51.228H3.6413V54.1794H56.3587V51.228Z" fill="#A6A6A6" />
+      <path
+        d="M53.7154 47.2961H6.28475V50.2476H53.7154V47.2961Z"
+        fill="#A6A6A6"
+      />
+      <path
+        d="M13.1044 27.4248H9.13934V44.8457H13.1044V27.4248Z"
+        fill="#A6A6A6"
+      />
+      <path
+        d="M15.0866 45.2521H7.15644V46.4032H15.0866V45.2521Z"
+        fill="#A6A6A6"
+      />
+      <path
+        d="M8.04244 26.4798C7.74205 26.4798 7.50175 26.716 7.50175 27.0111C7.50175 27.3062 7.74205 27.5424 8.04244 27.5424C8.34282 27.5424 8.58313 27.3062 8.58313 27.0111H13.6596C13.6596 27.3062 13.8999 27.5424 14.2003 27.5424C14.5007 27.5424 14.741 27.3062 14.741 27.0111C14.741 26.716 14.5007 26.4798 14.2003 26.4798H8.04244Z"
+        fill="#A6A6A6"
+      />
+      <path
+        d="M25.7389 27.4248H21.7739V44.8457H25.7389V27.4248Z"
+        fill="#A6A6A6"
+      />
+      <path
+        d="M27.7229 45.2521H19.7928V46.4032H27.7229V45.2521Z"
+        fill="#A6A6A6"
+      />
+      <path
+        d="M20.677 26.4798C20.3766 26.4798 20.1363 26.716 20.1363 27.0111C20.1363 27.3062 20.3766 27.5424 20.677 27.5424C20.9774 27.5424 21.2177 27.3062 21.2177 27.0111H26.2942C26.2942 27.3062 26.5345 27.5424 26.8348 27.5424C27.1352 27.5424 27.3755 27.3062 27.3755 27.0111C27.3755 26.716 27.1352 26.4798 26.8348 26.4798H20.677Z"
+        fill="#A6A6A6"
+      />
+      <path
+        d="M38.3828 27.4248H34.4177V44.8457H38.3828V27.4248Z"
+        fill="#A6A6A6"
+      />
+      <path
+        d="M40.3649 45.2521H32.4348V46.4032H40.3649V45.2521Z"
+        fill="#A6A6A6"
+      />
+      <path
+        d="M33.3208 26.4798C33.0204 26.4798 32.7801 26.716 32.7801 27.0111C32.7801 27.3062 33.0204 27.5424 33.3208 27.5424C33.6212 27.5424 33.8615 27.3062 33.8615 27.0111H38.938C38.938 27.3062 39.1783 27.5424 39.4787 27.5424C39.779 27.5424 40.0193 27.3062 40.0193 27.0111C40.0193 26.716 39.779 26.4798 39.4787 26.4798H33.3208Z"
+        fill="#A6A6A6"
+      />
+      <path
+        d="M51.0168 27.4248H47.0518V44.8457H51.0168V27.4248Z"
+        fill="#A6A6A6"
+      />
+      <path
+        d="M53.0008 45.2521H45.0707V46.4032H53.0008V45.2521Z"
+        fill="#A6A6A6"
+      />
+      <path
+        d="M45.9549 26.4798C45.6545 26.4798 45.4142 26.716 45.4142 27.0111C45.4142 27.3062 45.6545 27.5424 45.9549 27.5424C46.2552 27.5424 46.4955 27.3062 46.4955 27.0111H51.572C51.572 27.3062 51.8123 27.5424 52.1127 27.5424C52.4131 27.5424 52.6534 27.3062 52.6534 27.0111C52.6534 26.716 52.4131 26.4798 52.1127 26.4798H45.9549Z"
+        fill="#A6A6A6"
+      />
+      <path
+        d="M30.489 15.2435C30.489 15.0073 30.2562 14.8155 29.9708 14.8155C29.6855 14.8155 29.4527 15.0073 29.4527 15.2435V15.5829C29.4527 15.8633 29.6855 16.092 29.9708 16.092C30.2562 16.092 30.489 15.8633 30.489 15.5829V15.2435Z"
+        fill="#A6A6A6"
+      />
+      <path
+        d="M23.1514 17.4721C22.9111 17.4721 22.7159 17.7008 22.7159 17.9886C22.7159 18.269 22.9111 18.5051 23.1514 18.5051H24.0526C24.3379 18.5051 24.5782 18.2764 24.5782 17.9886C24.5782 17.7082 24.3454 17.4721 24.0526 17.4721H23.1514Z"
+        fill="#A6A6A6"
+      />
+      <path
+        d="M35.843 17.4721C35.6027 17.4721 35.4075 17.7008 35.4075 17.9886C35.4075 18.269 35.6027 18.5051 35.843 18.5051H36.7442C37.0296 18.5051 37.2699 18.2764 37.2699 17.9886C37.2699 17.7082 37.0371 17.4721 36.7442 17.4721H35.843Z"
+        fill="#A6A6A6"
+      />
+      <path
+        d="M31.2599 16.985L30.6141 16.5792C30.6141 16.5792 30.539 16.5423 30.4939 16.5423H29.4426C29.3975 16.5423 29.36 16.557 29.3224 16.5792L28.6766 16.985C28.609 17.0292 28.5715 17.0957 28.5715 17.1694V17.6417C28.5715 17.6859 28.5865 17.7302 28.609 17.7671L29.1722 18.5861C29.2173 18.6525 29.2248 18.7263 29.1948 18.8001L28.5865 20.1578C28.5865 20.1578 28.564 20.2168 28.564 20.2463V21.5966C28.564 21.722 28.6616 21.818 28.7892 21.818H31.1322C31.2599 21.818 31.3575 21.722 31.3575 21.5966V20.2463C31.3575 20.2463 31.3575 20.1873 31.335 20.1578L30.7267 18.8001C30.6967 18.7337 30.7042 18.6525 30.7493 18.5861L31.3125 17.7671C31.3125 17.7671 31.35 17.6859 31.35 17.6417V17.1694C31.35 17.0957 31.3125 17.0219 31.2449 16.985H31.2599Z"
+        fill="#A6A6A6"
+      />
+    </svg>
+  ),
+  BusIcon: (props: SVGAttributes<SVGElement>) => (
+    <svg
+      viewBox="0 0 72 72"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <g>
+        <path
+          d="M67.03 32.175c-.097 17.144-14.06 30.952-31.204 30.855C18.68 62.933 4.873 48.97 4.97 31.806 5.086 14.681 19.05.873 36.175.97c17.144.097 30.972 14.08 30.855 31.205z"
+          fill="white"
+        />
+        <path
+          d="m45.658 12.276-19.064-.116a5.46 5.46 0 0 0-5.489 5.43l-.155 26.628a5.452 5.452 0 0 0 4.17 5.314v.194c0 1.105.892 1.998 1.998 2.017a2.02 2.02 0 0 0 2.017-1.978v-.02l13.42.078v.02c0 1.086.892 1.997 1.978 2.016 1.106 0 2.017-.893 2.017-1.979v-.135a5.453 5.453 0 0 0 4.403-5.333l.155-26.608c0-3.045-2.444-5.508-5.45-5.528zM24.907 22.458c0-1.435 1.454-2.58 3.18-2.58l15.787.098c1.745 0 3.18 1.183 3.161 2.618l-.039 9.212c-.02 1.435-1.454 2.58-3.2 2.58l-15.786-.097c-1.746-.001-3.162-1.185-3.162-2.62l.059-9.212zm3.937 19.452c-.466.505-1.048.737-1.785.737-.718 0-1.32-.252-1.804-.756-.485-.503-.718-1.104-.718-1.822 0-.718.252-1.3.776-1.746a2.69 2.69 0 0 1 1.804-.659c.717 0 1.28.252 1.745.718.446.486.679 1.067.679 1.707a2.47 2.47 0 0 1-.698 1.823zm17.61.097c-.486.505-1.067.737-1.785.737-.718 0-1.32-.252-1.785-.756-.485-.504-.737-1.105-.718-1.823 0-.718.252-1.3.776-1.746a2.692 2.692 0 0 1 1.804-.66c.717 0 1.28.233 1.745.718.446.504.679 1.047.66 1.706 0 .757-.233 1.358-.699 1.823z"
+          fill="#816C5A"
+        />
+      </g>
+    </svg>
+  ),
+  CubeIcon: (props: SVGAttributes<SVGElement>) => (
+    <svg
+      viewBox="0 0 44 48"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M42.69 11.337 22.79.247c-.59-.33-1.31-.33-1.9 0L1 11.348c-.62.34-1 1-1 1.7v21.94c0 .71.38 1.36 1 1.7l19.9 11.06c.59.33 1.3.33 1.89 0l19.9-11.07c.62-.34 1-1 1-1.7v-21.94c0-.7-.38-1.36-1-1.7zm-23.05 29.26c0 .64-.68 1.04-1.24.73l-12.99-7.22a1.964 1.964 0 0 1-1.01-1.72v-14.02c0-.64.68-1.04 1.24-.73l12.99 7.22c.63.35 1.01 1.01 1.01 1.72v14.02zm1.24-19.53-12.85-7.14a.837.837 0 0 1 0-1.46l12.85-7.17c.59-.33 1.32-.33 1.92 0l12.85 7.16c.57.32.57 1.14 0 1.46l-12.85 7.15c-.59.33-1.32.33-1.91 0h-.01zm18.41 11.32c0 .72-.39 1.37-1.01 1.72l-12.99 7.22a.833.833 0 0 1-1.24-.73v-14.02c0-.72.39-1.37 1.01-1.72l12.99-7.22a.833.833 0 0 1 1.24.73v14.02z"
+        fill="white"
+        opacity="0.75"
+      />
+    </svg>
+  ),
+  FullscreenIcon: (props: SVGAttributes<SVGElement>) => (
+    <svg
+      viewBox="0 0 100 100"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        fill="white"
+        d="M100 40H87.1V18.8h-21V6H100zM100 93.2H66V80.3h21.1v-21H100zM34 93.2H0v-34h12.9v21.1h21zM12.9 40H0V6h34v12.9H12.8z"
+      ></path>
+    </svg>
+  ),
+  GerbIcon: (props: SVGAttributes<SVGElement>) => (
+    <svg
+      viewBox="0 0 69 86"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M28.865 48.447h.526v-.102h-.403V47.5h-.122v.947zm.927-.695c-.188 0-.337.133-.337.36 0 .216.142.35.326.35.165 0 .34-.109.34-.36 0-.208-.133-.35-.328-.35zm-.003.093c.145 0 .203.146.203.26 0 .154-.089.265-.207.265-.12 0-.206-.112-.206-.261 0-.13.063-.265.209-.265zm.962-.078-.005.103h-.003c-.03-.056-.094-.118-.212-.118-.156 0-.306.13-.306.36 0 .19.12.333.29.333.104 0 .177-.051.215-.114h.004v.076c0 .172-.093.238-.22.238a.384.384 0 0 1-.198-.053l-.031.095a.44.44 0 0 0 .226.056.36.36 0 0 0 .248-.08c.066-.06.097-.155.097-.311v-.396c0-.083.003-.137.006-.187h-.108zm-.02.39c0 .022-.002.046-.01.067a.18.18 0 0 1-.17.126c-.134 0-.201-.11-.201-.244 0-.157.085-.257.203-.257a.178.178 0 0 1 .18.186v.122zm.615-.405c-.188 0-.337.133-.337.36 0 .216.142.35.326.35.165 0 .339-.109.339-.36 0-.208-.132-.35-.327-.35zm-.002.093c.146 0 .203.146.203.26 0 .154-.088.265-.206.265-.12 0-.207-.112-.207-.261 0-.13.064-.265.21-.265zm1.508.105h-.312v.098h.194v.283a.4.4 0 0 1-.163.026c-.22 0-.365-.142-.365-.382 0-.238.15-.38.381-.38a.49.49 0 0 1 .21.04l.03-.1a.587.587 0 0 0-.237-.043c-.319 0-.512.207-.514.49 0 .147.05.273.132.352.093.089.21.125.354.125a.88.88 0 0 0 .29-.052v-.455zm.737.18c.001-.013.004-.033.004-.058 0-.125-.06-.32-.281-.32-.198 0-.32.161-.32.367 0 .204.126.341.335.341a.552.552 0 0 0 .227-.04l-.021-.09a.45.45 0 0 1-.189.036c-.123 0-.23-.07-.233-.236h.478zm-.477-.089c.01-.084.065-.2.19-.2.14 0 .173.123.171.201h-.36zm.662-.436v.163h-.105v.095h.105v.37c0 .08.013.14.048.177.03.033.076.051.133.051a.304.304 0 0 0 .11-.015l-.006-.093a.272.272 0 0 1-.071.008c-.07 0-.094-.048-.094-.132v-.367h.177v-.093h-.177v-.195l-.12.032z"
+        fill="black"
+      />
+      <path
+        d="M68.68 71.27v.03c0 2.79-.825 4.83-2.329 6.2-1.493 1.36-3.637 2.03-6.305 2.09-.136 0-.272.01-.417.01H42.125c-.533 0-1.057.06-1.561.18-.505.11-.99.28-1.456.49-3.318 1.47-3.987 3.55-4.637 5.5-.504-1.76-.465-2.59-2.502-4.27-1.252-1.02-2.901-1.83-4.55-1.91a4.293 4.293 0 0 0-.621.01H8.547c-2.881 0-4.996-.67-6.403-2.09C.776 76.13.107 74.08.068 71.26H0V0H68.795V71.27h-.116z"
+        fill="#131414"
+      />
+      <path
+        d="M68.244 70.99c.126 5.67-3.143 8.17-8.615 8.17H42.135c-4.055 0-7.422 3.4-7.645 5.55.098-2.08-3.9-5.8-7.74-5.55H8.547c-5.54 0-8.052-2.5-8.052-8.17v-.16H.428V.44H68.37v70.39h-.126v.16z"
+        fill="#D8281B"
+      />
+      <path
+        d="M60.045 73.19c2.668 0 4.832-2.26 4.832-4.98 0-2.75-2.164-4.98-4.832-4.98a4.73 4.73 0 0 0-2.551.76l.863.83-1.33 1.25-.833-.86c-.592.83-.98 1.87-.98 2.99 0 2.73 2.163 4.99 4.831 4.99zm-5.598-9.77 1.155-1.34 1.368 1.37c.892-.61 1.96-.95 3.085-.95 3.056 0 5.54 2.56 5.54 5.71 0 3.14-2.484 5.71-5.54 5.71-3.046 0-5.54-2.57-5.54-5.71 0-1.34.446-2.56 1.184-3.51l-1.253-1.28z"
+        fill="#57140C"
+      />
+      <path
+        d="M59.54 72.31c2.668 0 4.831-2.26 4.831-4.98.001-2.75-2.162-4.98-4.83-4.98-.922 0-1.805.28-2.552.73l.864.86-1.3 1.25-.864-.85a5.13 5.13 0 0 0-.98 2.99c0 2.72 2.193 4.98 4.832 4.98zm-5.57-9.78 1.126-1.34 1.397 1.37c.864-.61 1.93-.95 3.047-.95 3.056 0 5.54 2.56 5.54 5.71s-2.484 5.71-5.54 5.71c-3.047 0-5.54-2.56-5.54-5.71 0-1.34.446-2.56 1.183-3.51l-1.212-1.28z"
+        fill="white"
+      />
+      <path
+        d="m49.974 73.04-2.551-1.22-.36 1.28 2.426 1.28.484-1.34zm-.504-6.93 2.697 1.37-1.6 3.12.416.21-.863 1.83-2.484-1.22 1.834-5.31zM8.42 34.06c-1.328-6.2-.95-10.17 3.232-9.28C24.39 36.9 37.11 49 49.848 61.1c-.388.58-.504.83-.892 1.37l1.63 1.37c-.301.61-.592 1.22-.893 1.83.98.49 1.805 1.01 2.784 1.49 2.106-4.95 6.307-7.94 12.535-8.8-.145-.76-.145-.83-.29-1.59-4.037.06-7.675 1.19-10.819 3.12-.475-.46-.921-1.07-1.426-1.53-.3.15-.446.46-.737.61-12.263-12.35-24.7-24.84-36.974-37.21-1.038-3.54 2.9-5.71 9.217-4.4-.417.55-.864 1.1-1.3 1.65 3.434-.43 6.723-.09 9.721 1.83-2.309-2.84-5.569-5.22-9.721-7.15.475.86.98 1.74 1.455 2.6-3.464-1.56-7.878-1.37-11.885 1.37-1.843.46-3.463.46-4.86 0 .242 1.71.262 3.42-.893 5.16-1.213 4.27-1.067 8.06.446 11.39-.737-.46-1.484-.92-2.221-1.37 2.367 3.97 5.006 7.76 8.266 11.24-2.435-4.28-2.968-7.91-2.638-11.24-.65.4-1.31.83-1.93 1.22z"
+        fill="#57140C"
+      />
+      <path
+        d="m49.674 70.75-2.552-1.19-.388 1.25 2.435 1.28.504-1.34zm-.534-6.93 2.726 1.41-1.6 3.09.387.21-.853 1.83-2.494-1.22 1.834-5.32zM8.1 31.78c-1.328-6.2-.95-10.17 3.26-9.26 7.102 6.74 13.66 12.94 20.763 19.7.883-.76 1.63-1.51 2.522-2.27-6.975-7.02-13.262-13.53-20.209-20.49-1.038-3.54 2.814-4.64 9.159-3.33-.446.55-.893 1.1-1.33 1.65 3.435-.43 6.724-.12 9.722 1.83-2.31-2.84-5.569-5.22-9.721-7.15.475.85.98 1.74 1.455 2.6-3.463-1.56-7.382-1.47-11.767.3-1.863.46-3.493.46-4.89 0 .242 1.71.3 3.45-.883 5.16-1.213 4.28-1.067 8.06.446 11.39-.708-.46-1.455-.91-2.192-1.37 2.338 3.97 4.977 7.76 8.236 11.24-2.425-4.28-2.968-7.91-2.638-11.24-.66.44-1.281.84-1.931 1.24zM35.393 45.4c4.715 4.46 9.42 8.95 14.136 13.44-.388.55-.505.79-.893 1.37l1.63 1.34c-.3.61-.591 1.22-.892 1.83.98.49 1.843 1.01 2.813 1.53 2.106-4.98 6.316-7.97 12.506-8.83-.116-.76-.145-.83-.3-1.59-4.027.06-7.675 1.19-10.79 3.11-.504-.46-.95-1.07-1.425-1.53-.291.15-.447.46-.738.61-4.531-4.55-9.072-9.13-13.632-13.72l-2.416 2.44z"
+        fill="#F4F4F4"
+      />
+      <path
+        d="M11.925 62.5c13.63-11.48 27-23.03 40.631-34.51 1.892-2.2 5.123-5.8 4.026-8.77-1.93-3.3-5.16-1.65-6.937.18.893.15 1.213.46 2.106.61-2.842.3-5.219 2.84-7.343 6.38.853-3.79 1.93-7.42 4.53-10.14.03.79.058 1.56.088 2.32 1.397-1.41 3.968-3.3 6.374-1.99-2.107-2.29-5.037-3.79-8.267-2.6.65.31 1.213.49 1.892.79-2.97.21-5.395 2.29-7.878 5.99 1.154-3.57 2.425-7 4.948-9.65-.059.83-.117 1.68-.204 2.54 4.978-2.17 8.917-.73 11.498 4.28 1.6 1.71 1.368 3.54.203 6.69 4.057-.58 10.344.12 7.385 13.62.504-.12 1.154-.52 1.688-.64-2.698 3.76-5.482 5.01-8.325 5.5 2.018-1.07 3.56-2.26 4.89-7.11.117.79.388 1.68.534 2.47 1.368-3.3 1.542-5.8.592-8.89-.835 2.66-2.523 3.82-4.027 4.83.534.27 1.068.52 1.601.79-3.172 2.35-6.345 2.87-9.547 2.9 2.67-1.25 5.008-3.24 6.996-6.29.088.73.204 1.47.33 2.2 1.805-1.59 4.27-4.55 3.706-6.69-3.706-2.11-6.46-.76-9.274 1.68L14.525 66.23l-1.213-1.59-.417.4.592.88-.835.73-.533.46-.03.03-.447.4-1.154-1.44.474-.43c-.68-1.07-2.163-1.95-3.318-1.95-2.61 0-4.735 2.2-4.735 4.95.001 2.72 2.136 4.95 4.736 4.95 2.61 0 4.744-2.23 4.744-4.95v-.21l.65-.49c.03.25.03.46.03.7 0 3.12-2.426 5.65-5.424 5.65-2.988 0-5.423-2.53-5.423-5.65 0-3.11 2.425-5.68 5.423-5.68 1.368 0 2.969.88 3.852 2.23l1.125-.95-1.096-1.47.398-.3z"
+        fill="#57140C"
+      />
+      <path
+        d="M11.536 60.79c13.631-11.48 27-23.15 40.632-34.63 1.891-2.2 5.103-5.71 4.026-8.65-2.222-2.47-4.89-1.01-6.665.83.891.18 1.24.49 2.133.64-2.843.31-5.22 2.81-7.383 6.35.863-3.76 1.96-7.42 4.53-10.11.03.76.088 1.53.117 2.32 1.397-1.44 2.785-2.53 6.074-2.69-2.105-2.29-5.064-2.69-8.324-1.47.65.28 1.252.49 1.902.76-2.93.21-5.394 2.29-7.859 5.99 1.125-3.54 2.434-7 4.947-9.65-.058.83-.145 1.68-.203 2.54 4.977-2.14 8.954-1.53 11.496 3.18 1.63 1.74 1.456 4.37.301 7.54 3.795-.86 10.518-.55 7.316 12.77.505-.12 1.155-.52 1.66-.61-2.669 3.76-5.482 4.98-8.325 5.5 2.048-1.07 3.581-2.26 4.89-7.15.146.83.418 1.68.564 2.47.921-3.24 1.416-5.59.65-8.86-.835 2.66-1.99 4.52-3.56 5.71.533.25.979.37 1.542.61-3.202 2.35-6.375 2.87-9.576 2.9 2.668-1.25 5.035-3.24 6.995-6.29.116.73.204 1.47.33 2.2 1.804-1.59 3.822-5.28 3.26-7.42-3.707-2.11-6.724-.52-9.547 1.92l-39.312 37-1.213-1.59-.417.43.592.86-.825.73-.563.49-.446.43-1.154-1.46.475-.43c-.834-.7-1.863-1.13-3.017-1.13-2.61 0-4.745 2.23-4.745 4.95 0 2.72 2.135 4.95 4.745 4.95s4.744-2.23 4.744-4.95v-.21l.65-.49c.03.24.03.46.03.7 0 3.11-2.436 5.65-5.424 5.65-2.998 0-5.424-2.53-5.424-5.65 0-3.12 2.426-5.65 5.424-5.65 1.368 0 2.61.52 3.55 1.37l1.126-.95-1.096-1.47.378-.28z"
+        fill="#F4F4F4"
+      />
+      <path
+        d="M34.975 56.33c1.426 0 2.61.12 2.61.28 0 .18-1.184.3-2.61.3-1.455 0-2.64-.12-2.64-.3 0-.16 1.185-.28 2.64-.28z"
+        fill="#FCD500"
+      />
+      <path
+        d="M24.099 15.98c-.418.46-.894 1.1-1.301 1.53 3.045-.46 6.286.28 8.595 1.62-2.853-2.11-5.278-2.9-7.296-3.15z"
+        fill="#ECECEC"
+      />
+      <path
+        d="M61.374 34.31c-.476-.37-.854-.21-1.417-.67-1.989 2.41-4.24 2.56-6.82 3.3 3.172.03 6.646-1.32 8.237-2.63z"
+        fill="#ECECEC"
+      />
+      <path
+        d="M65.584 36.51c-.388.09-.883.27-1.484.43-2.018 2.23-3.086 3.42-5.657 4.15 3.086-.12 5.754-3.08 7.14-4.58z"
+        fill="#ECECEC"
+      />
+      <path
+        d="M47.482 14.06c-.417-.18-.834-.52-1.242-.7-2.105 1.1-4.055 3.7-5.365 6.29 2.193-3.12 4.444-5.04 6.607-5.59z"
+        fill="#ECECEC"
+      />
+      <path
+        d="M50.536 18.91c-.417-.18-1.009-.33-1.426-.52-1.843.64-3.347 3.18-4.657 6.48 1.785-2.68 3.92-5.38 6.083-5.96z"
+        fill="#ECECEC"
+      />
+      <path
+        d="M8.102 32.17c.32 1.34.98 4.37 3.288 7.48-1.241-2.75-1.833-5.25-1.717-8.37-.446.28-.834.56-1.571.89z"
+        fill="#ECECEC"
+      />
+      <path
+        d="m34.83 12.62-.058.06c0-.03 0-.03-.03-.06v.09c-.32.34-.805.61-1.008 1.07-.146.37-.059.82 0 1.22.058.21.359.37.359.61-.03.37-.388.67-.447 1.04-.029.34.088.64.175.98.06.15.292.25.263.43-.058.28-.36.43-.446.7-.088.37-.117.76-.059 1.13.03.27.36.49.32.79-.028.46-.387.85-.504 1.31-.087.37-.174.76-.087 1.13.145.52.708.86.766 1.41.03.64-.388 1.19-.504 1.83-.147.73-.331 1.47-.273 2.2.03.49.505.89.505 1.37.029.37-.33.64-.418.98-.087.37-.145.76-.087 1.13.087.46.446.86.505 1.31.029.21-.204.4-.243.61-.03.25.086.46.057.7-.029.21-.203.4-.242.61-.058.24-.058.52 0 .79.029.28.242.52.242.79.03.31-.116.64-.058.95.057.46.387.86.416 1.31a37.77 37.77 0 0 1-.116 6.29c-.117 1.34-.534 2.56-.825 3.85-.204.98-.359 1.99-.417 2.99-.03.61.058 1.22.087 1.83.03.58.272 1.19.088 1.74-.088.21-.476.06-.68.18-.116.06-.242.18-.271.33 0 .31.058.61.174.89.059.12.301.12.33.24.175.55.088 1.13.262 1.68.243.7.922 1.25 1.01 2.02.057.31-.505.4-.68.7-.116.21-.116.52-.145.76-.03.28-.059.55 0 .79.087.4.242.76.417 1.13.174.4.708.64.679 1.07-.03 1.07-.651 2.08-.855 3.14a8.314 8.314 0 0 0-.087 2.08c.087.52.475.92.533 1.41.001.31-.27.52-.358.79-.029.21-.058.43 0 .61.059.21.389.31.36.52-.059.34-.447.49-.534.79-.058.28 0 .61.087.89.117.3.476.52.534.86.028.33-.302.64-.273.98.03.49.272.92.417 1.41.175.28.36.58.505.86.144.12.29.21.416.31v.15l.087-.09.088.09v-.15c.146-.09.301-.18.447-.31.145-.28.33-.58.504-.86.118-.49.39-.91.419-1.41.028-.33-.302-.64-.273-.98.058-.34.417-.55.533-.86.088-.28.146-.61.059-.89-.06-.3-.448-.46-.506-.79-.029-.21.3-.3.36-.52.057-.18.028-.4 0-.61-.088-.28-.36-.49-.36-.79.058-.49.446-.89.505-1.41.086-.67.057-1.41-.06-2.08-.203-1.07-.834-2.08-.863-3.14-.03-.43.505-.67.68-1.07.174-.37.32-.73.416-1.13.059-.25.03-.52 0-.79-.029-.25-.029-.55-.174-.76-.147-.3-.71-.4-.651-.7.086-.76.765-1.31 1.008-2.02.174-.55.087-1.13.271-1.68.028-.12.261-.12.32-.24.116-.28.174-.58.174-.89a.486.486 0 0 0-.271-.33c-.204-.12-.592.03-.68-.18-.174-.55.059-1.16.088-1.74.03-.61.117-1.22.088-1.83a19.108 19.108 0 0 0-.417-2.99c-.3-1.28-.834-2.5-.95-3.85-.204-2.08-.146-4.18 0-6.29.03-.46.36-.86.417-1.31.058-.31-.087-.64-.058-.95 0-.27.203-.52.242-.79.058-.27.058-.55 0-.79-.03-.21-.204-.4-.243-.61-.03-.24.086-.46.057-.7-.029-.21-.262-.4-.233-.61.059-.46.417-.85.505-1.31.057-.37-.001-.76-.088-1.13-.088-.34-.447-.61-.418-.98 0-.49.476-.88.505-1.37.057-.73-.118-1.47-.273-2.2-.116-.64-.533-1.19-.504-1.83.058-.55.62-.89.766-1.41.086-.37 0-.76-.088-1.13-.117-.46-.476-.86-.505-1.31-.029-.31.291-.52.32-.79.059-.37.03-.76-.058-1.13-.088-.27-.389-.43-.447-.7-.03-.18.204-.27.272-.43.087-.33.203-.64.174-.98-.059-.37-.418-.67-.447-1.04 0-.25.3-.4.36-.61.057-.4.145-.86 0-1.22-.205-.46-.622-.73-.952-1.07.04-.03.04-.06.04-.09z"
+        fill="#57140C"
+      />
+      <path
+        d="M34.083 15.65c-.03.37-.388.64-.446 1.01-.03.21.029.46.087.67.146.06.32.06.446.06.3 0 .835-.03 1.01-.61.203-.49-.175-.91-.622-1.04-.145-.03-.32-.15-.475-.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.084 17.97v.09c-.059.28-.36.43-.447.7-.087.37-.116.76-.058 1.13 0 .12.086.25.145.37.417.15.98.15 1.212.03 1.01-.49.563-2.5-.708-2.32h-.146z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.792 21.11c-.117.31-.33.58-.389.89-.058.24-.145.55-.116.79.272.27.767.52 1.038.33.175-.09.233-.37.417-.37.088-.03.146.49.447.49.532.03.649-.43.62-.89 0-.24-.243-.91-.418-1.1-.203-.15-.863-.37-1.125-.31-.146.05-.3.08-.475.17z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.082 24.78c-.058.52-.417 1.04-.504 1.59-.146.73-.33 1.47-.272 2.2v.06c.146.06.3.12.417.21.03.03.087.06.146.06.173-.03.358-.09.532-.15.088-.03.175-.15.262-.12.117 0 .146.15.243.21.116.06.271.18.417.15.146-.06.33-.18.388-.34.116-.25.03-1.41-.03-1.62-.086-.55-.33-1.34-.533-1.83-.292-.66-.622-.48-1.068-.42z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.646 30.46c-.087.15-.203.27-.242.46-.088.37-.146.76-.088 1.13 0 .09.03.15.059.25.504.33 1.329.46 1.814.3.503-.15.503-1.65.174-2.02-.33-.3-1.34-.36-1.718-.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.13 62.38c-.145-.46-.921-.82-1.329-.82-.736.03-1.396.33-1.512 1.16-.058.58.446 1.01.95 1.1.389.03 1.572-.06 1.776-.43.146-.25.204-.77.117-1.01z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.617 65.77c.3.09.504.4.679.67.533.85.679 1.83.708 2.81.03.52.272 1.16-.03 1.56-.232.31-.766.09-1.125 0-.117-.03-.088-.43-.175-.33-.146.18 0 .49-.087.67-.204.46-.796.64-1.184.3-.175-.18-.32-1.68-.262-1.89.058-.49.29-.92.504-1.34.117-.25.32-.46.447-.73.058-.19.204-1.84.524-1.72z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.8 73.07c.709 0 1.271.15 1.271.37.001.18-.561.37-1.27.37-.708 0-1.27-.18-1.27-.37-.01-.22.552-.37 1.27-.37z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.8 74.45c.709 0 1.271.33 1.271.76.001.43-.561.76-1.27.76-.708 0-1.27-.34-1.27-.76-.01-.43.552-.76 1.27-.76z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.49 78.45c.088-.12.175-.24.243-.33.446-.55 1.542-.58 1.892.06.058.09-.117.79-.204.79-.358.09-.707-.24-1.066-.15-.243.03-.301.4-.505.49-.03-.06-.06-.12-.117-.18a3.477 3.477 0 0 0-.243-.68z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.558 13.6c-.262.18-.534.64-.68.89-.145.21-.058.46 0 .67.301.12.738.09 1.039-.03.32-.12.533-.37.32-.67 0-.03-.621-.83-.68-.86z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.763 33.58c-.059.12-.175.25-.175.4-.03.15.03.31.058.46.262.06.563-.06.835-.06.233 0 .883.09 1.068-.15.058-.09 0-.21 0-.33-.088-.37-.3-.21-.592-.21-.272-.03-.534-.03-.805-.03-.125-.02-.242-.05-.387-.08z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.403 35.26v.03c-.058.24-.058.52 0 .79.03.21.146.43.204.61.174 0 .359-.09.533-.09.243 0 .476.12.709.12.27-.03.532 0 .765-.15.116-.09.058-.31.058-.46.03-.15.058-.33-.029-.49-.058-.15-.204-.25-.359-.33a1.334 1.334 0 0 0-.592-.15 1.533 1.533 0 0 0-.737 0c-.165.03-.369.06-.553.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.734 57.89c.174-.12.232.33.388.46.504.28 2.192.43 1.804 1.44-.204.55-2.076.34-2.396-.06-.388-.43-.272-1.54.204-1.84z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.646 38.1c.117.3.292.61.32.95.272-.06.505-.27.767-.3.204-.03.708.09.893-.03 0-.03.029-.09.058-.15-.03-.06-.058-.18-.175-.34-.32-.53-1.456-.62-1.863-.13z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.18 40.15c.116 1.8.203 3.66.058 5.44-.389 4.15-2.018 4.4-.893 9.38.058.25.204.61.446.64.448 0 .768-1.22.826-1.5.116.34.417 1.29.863 1.25a.74.74 0 0 0 .65-.46c.417-.95.116-3.79-.059-4.76-.173-1.16-.736-2.32-.862-3.45-.146-1.19-.088-2.41-.146-3.64-.029-1.07.117-2.17-.087-3.21-.058-.18-.388-.21-.563-.12-.145.09-.145.27-.233.43z"
+        fill="#FCD500"
+      />
+      <path
+        d="M31.094 11.55 28.629 7.7l-.059.18 2.107 3.6c.3-.28 1.242-.58 1.368-.61-.117-.06-.291-.09-.262-.21.029 0 .087.06.174.06.117-.09.117-.18.146-.28-.03-.03-.03-.18-.03-.21-.028-.25.204-.46.505-.52 0-.03-.029-.06-.029-.06.057.03.116-.03.242.03.116-.06.242-.15.3-.28-.058.03-.087.03-.174 0 .242-.18.116-.52.058-.76l-.087-.12c-.03.18-.273.06-.331.25-.03 0-.03-.03-.03 0 0 .09-.058.18-.03.3 0 .25-.271.25-.3.4-.088-.12-.33-.28-.243-.46-.058-.15.117-.27-.029-.33-.058.18-.116.43-.233.61 0 .18-.242.18-.388.25l-.029-.06c-.174-.21-.058-.49-.03-.58 0 0-.144.33-.29.43-.146.03-.272 0-.33.06 0-.06 0-.12-.058-.15-.087-.15-.058-.27.116-.64-.116.21-.533.52-.834.4-.03-.28.243-.49.243-.49-.175.06-.505.12-.65.03-.03-.3.145-.33.33-.43-.146-.03-.418.15-.738-.09.087-.21.32-.34.475-.43-.271-.06-.62-.06-.679-.37.204-.03.388-.12.592-.15-.242 0-.737-.3-.68-.52.273-.03.534 0 .767-.03-.33-.09-.892-.37-.834-.67.204-.03.534.03.68.03-.03-.03-.71-.15-.71-.61.243-.12.117-.31.243-.28-.27-.24-.057-.3.205-.73l.01.18 1.154.76c-.447-.43-1.834-1.04-1.834-1.65.058-.12.029-.33.233-.37.241.49 1.541 1.1 1.93 1.53 0 .06.116.15.145.09.145.21.33.52.592.64.058-.06.058-.12.116-.12.175.37.708.55.893.98.145.21-.03.4-.175.58-.028.06 0 .21.06.27.145.12.32.21.504.21.145.03.271-.09.33-.21-.204-.12-.272-.21-.243-.52.06.03.118.03.118.09.203 0 .387 0 .562-.12-.116 0-.417-.03-.388-.34.204.12.32.12.475-.03.175-.46-.058-.79-.33-1.13-.116.03-.174.06-.29 0a.753.753 0 0 0-.534.12c-.058.06-.03.09 0 .15-.446-.12 0-.37.175-.4-.088 0-.233.03-.36.03-.145.15-.387.28-.678.12-.117-.03-.175-.15-.175-.25h.03c.27.43.678-.06 1.066-.06-.086-.03-.203 0-.329-.06-.115-.03-.27.06-.329.12-.115-.09-.144-.27-.086-.43.087-.12.291-.15.476-.21 0-.09.087-.06.145-.12.03-.03-.03-.06-.058-.09-.272 0-.476-.06-.65-.18-.117-.12-.175-.25-.117-.37.03-.15.175-.31.088-.46-.175.06-.388.06-.505.21-.058.18 0 .4.146.55.144.18-.118.34-.176.55 0 .03.03.09.087.12v.03c-.144 0-.173-.03-.26-.12-.146-.18.242-.24.058-.46-.078.12-.233.12-.32.15-.03 0-.088-.06-.117 0-.028 0 .001.06.001.12h-.028c-.03-.09-.087-.15-.116-.28.029-.21.232.03.358-.09.03-.06-.058-.15-.116-.25-.058-.09-.116-.24-.058-.33.087-.15.242-.12.417-.18.175.03.233-.24.446-.33.088-.09.204.03.301.06.087.06.233.03.291.12.146.4-.388.64-.087.98.116.06.3.18.475.12-.029-.21-.203-.46-.203-.7.058-.12.116-.12.174-.15.117-.09.291 0 .36-.03.028-.03-.03-.09-.03-.09-.03-.03-.03-.18.058-.18l-.029-.03v-.04l-.058.06-.049-.18h.088l-.03-.1.117-.03h.147l-.059.09.117.03.029.18-.146-.06-.029.04.028.03c.088.03.088.15.059.21 0 0-.03 0-.03.06.059.03.175-.09.36 0 .087.06.145.09.203.15 0 .25-.145.52-.204.73.204-.03.389-.09.505-.25v.06c.146-.06.263-.21.39-.33-.03-.28-.273-.58-.243-.95a.38.38 0 0 1 .203-.25c.146-.06.446.03.505-.03.029-.03 0-.06-.059-.06 0-.12-.029-.3.059-.3l.058-.06-.03-.03-.145.07V1.6l.175.03-.058-.15.126-.04h.175l-.058.15.146-.03v.28l-.117-.09-.029.09h.03c.116.03.116.21.058.3-.03.03-.03.03-.03.09.117.06.262-.15.505 0 .087.09.204.12.204.25.029.37-.146.67-.204.98.116.09.272.21.417.27V3.7c.146.15.33.18.505.21-.03-.25-.175-.46-.175-.73 0-.06.058-.09.146-.15.145-.09.29-.03.359-.06 0-.03 0-.03-.03-.06-.029-.03-.029-.18.059-.18l.03.03v-.09l-.146.03v-.19l.136.03-.058-.09h.232l-.049.09.087-.06v.21l-.087-.03v.06l.03.03c.087 0 .057.09.028.15 0 .06-.029.03 0 .06.03.06.175-.09.32.06.059.03.146.03.175.12.028.28-.146.49-.175.73.174.03.388-.12.504-.15.29-.33-.273-.61-.117-.95.058-.12.174-.09.232-.15.117 0 .243-.15.33-.06.272.06.301.33.505.33.145.03.3 0 .359.15.115.09.028.21-.001.34-.089.08-.186.2-.156.26.145.12.32-.15.388.09.029.09-.059.15-.088.28h-.029c0-.09 0-.12-.029-.15-.03 0-.087.03-.145.03s-.203 0-.3-.12c-.175.21.204.28.058.46-.087.09-.116.15-.233.15l-.029-.03c.087-.03.087-.09.117-.18-.088-.15-.418-.25-.175-.52.116-.12.116-.4.087-.58-.174-.06-.33-.09-.475-.18-.088.18.058.31.087.46.03.15 0 .27-.116.4-.174.12-.417.25-.708.25v.04c.059.03.117.03.146.15.146 0 .359.03.475.18.03.15.03.34-.087.43-.087-.15-.504-.12-.65-.03.417-.06.796.43 1.067 0l.058-.03a.55.55 0 0 1-.202.3c-.505.25-.65-.3-1.067-.12.175.06.68.12.292.37.029-.09 0-.09 0-.21-.175-.06-.418-.09-.592 0-.146.03-.175 0-.291 0-.273.31-.419.7-.331 1.1.115.15.3.21.474.06.03.27-.204.3-.32.33.262.12.505.09.65 0 .058.28.03.4-.204.49.058.12.204.21.33.21a.963.963 0 0 0 .505-.21c.087-.06.087-.21.029-.27-.117-.18-.3-.37-.175-.58.116-.43.707-.61.863-1.04.058 0 .058.09.058.15.292-.15.534-.46.622-.73 0 .06.087.09.087.09.387-.46 1.804-1.71 1.988-2.23.233.03.32.4.32.58 0 .58-1.397 1.53-1.93 1.95.417-.27 1.513-1.01 1.746-1.28.29.25.029.67-.36.98.175-.03.175.15.418.15.03.27-.204.58-.505.76.36-.06.175 0 .36.03-.059.37-.534.61-.835.67.32 0 .592 0 .805.09-.048.2-.436.44-.727.5.203 0 .446.06.591.12-.057.31-.445.31-.648.4.203.09.388.15.475.33.087.28-.534.21-.68.18.117.09.272.15.33.4-.174.15-.475.06-.62 0 .087.06.203.27.174.46.03.09-.115.06-.202.06-.476 0-.621-.43-.922-.67.446.49.592.49.475.91-.057.06-.086.09-.086.15-.058-.03-.146-.09-.262-.03-.272-.24-.359-.55-.563-.79-.03.06.562.52.145.95v.06c-.117-.06-.388-.06-.388-.25l-.291-.61c-.088.06.058.25.058.37.058.15-.146.3-.233.46-.028-.18-.3-.12-.329-.4.03-.03.001-.4-.057-.31-.087-.15-.32-.06-.32-.25-.088.06-.117.21-.117.25-.058.25-.058.49.059.67-.03.03-.059 0-.088 0 .088.12.146.21.272.25.086 0 .29-.03.29-.03-.03 0 0 .03 0 .06.175.09.504.27.446.49.03.06.03.18-.029.25.058.09.03.18.146.24.058 0 .116-.06.174-.06 0 .12-.203.21-.29.28.057.03.853.3 1.067.33.029 0 .058-.03.087-.03-.203-.21-.3-.43-.242-.7.03-.24.243-.52.476-.64a.752.752 0 0 1 .504-.03c.088 0 .534.18.592.7 0 .28-.146.61-.3.67.028.12-.088.15-.088.15 0 .06-.146.12-.146.09-.116.15-.174.21-.203.28-.146.03-.563 0-.65-.18-.175-.31-1.33-.15-1.63-.28-.175-.03.145-.15-.505-.12-.058-.06 0-.18-.116-.18-.117.15-.476.09-.505-.09.33 0 .388-.12.301-.34-.087-.06-.146-.15-.3-.12-.175.03-.272.09-.389.15-.088.09-.175.25-.088.4.087.18.388.15.388.4 0 0 .03.09-.03.09.03-.15-.203-.15-.32-.15.234.25.059.25.32.43.146.06.272.27.418.24.117-.03.262-.15.146-.27.271.06.446.49.145.55.174.06.33.28.27.49-.116.12-.174.18-.203.31-.175-.06-.175-.21-.243-.34 0 .15-.174.46-.32.49-.145.03.204-.03.117-.12-.058.09-.145.24-.3.27-.175.03-.475.03-.592-.09-.058.15-.29.4-.475.4-.243.03-.447-.25-.505-.37-.145.15-.388.12-.62.09-.117-.03-.175-.15-.263-.21-.116.06-.359.03-.417.03-.145 0-.29-.28-.388-.46-.03.12-.058.31-.174.37-.03-.12-.117-.21-.204-.31-.088-.18.029-.4.203-.49-.087-.03-.116-.12-.145-.21a.58.58 0 0 1 .262-.33c-.087.12 0 .24.146.27.203.06.242-.18.475-.24.271-.18.592-.21.805-.46-.116 0-.388 0-.32.18-.058-.03-.03-.09-.058-.12.029-.24.388-.21.446-.43.058-.12-.03-.28-.116-.37a.682.682 0 0 0-.418-.12c-.087 0-.203.06-.3.12-.059.18.145.43.33.34 0 .09-.117.12-.175.18-.117.03-.272 0-.33-.09-.116 0-.058.15-.087.15-.146 0-1.66.58-2.58 1.28.028-.15.057-.25.144-.43-.203.06-.446.18-.591.28-.04-.1.854-.58.94-.68zm3.23-7.85c-.145.03-.3.09-.417.21-.058.06 0 .18 0 .25 0 .3.301.76.621 1.19.36-.34.476-.73.621-1.13.028-.12.028-.3-.06-.4-.057-.12-.242-.12-.358-.15a.908.908 0 0 0-.407.03z"
+        fill="#57140C"
+      />
+      <path
+        d="m34.674 12.81.204-.21c-.049.08-.107.18-.204.21z"
+        fill="#FCD500"
+      />
+      <path
+        d="M31.123 3.03c.175-.03.388-.21.62-.18-.086-.03-.27-.18-.358-.12-.087.06-.262.15-.262.3z"
+        fill="#FCD500"
+      />
+      <path
+        d="M31.715 2.88c-.174 0-.33.06-.475.12-.175.12-.621-.03-.65.25.145-.18.446-.09.65-.18.145-.03.33-.21.534-.12.145.18-.146.49-.146.67-.03.18.204.25.359.31-.087-.06-.204-.12-.262-.21-.117-.3.204-.49.146-.79-.01-.05-.126-.08-.155-.05z"
+        fill="#FCD500"
+      />
+      <path
+        d="M30.89 3.34c0-.06 0-.15.06-.18-.176.03-.117.25-.147.18 0-.06 0-.12.059-.18-.204.03-.059.28-.146.18v-.12c-.03-.03-.058.03-.058.06-.03.12.33.24.204.46.029 0 .058-.03.087 0 .086.06.086.25 0 .34.028.03.057.03.028.06.058-.12.291-.21.175-.4-.146-.12-.204-.4-.117-.58-.145-.01-.087.27-.145.18zm.146.61c.03-.18-.087-.25-.058-.31.087.09.116.19.058.31z"
+        fill="#FCD500"
+      />
+      <path
+        d="M28.31 3.37c.262.52 1.96 1.59 2.425 2.02 0 0-.145-.31-.174-.4-.358-.27-1.775-1.28-1.988-1.65h.029c.272.27 1.573 1.31 1.96 1.59 0-.09 0-.15.03-.21-.388-.46-1.96-1.62-2.222-2.11-.272.18-.146.54-.058.76zm.262.24c-.291-.3-.388-.73-.233-.91.086.24.29.46.474.67l-.029.03c-.087-.06-.388-.37-.446-.55-.088.3.115.61.232.76z"
+        fill="#FCD500"
+      />
+      <path
+        d="M30.765 3.73c-.029.04-.087.04-.146.07.029.03.174.03.204-.03.087-.18-.117-.3-.205-.43-.03.15.243.21.145.39z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.326 3.46c0 .06.175.09.204.09.03 0 .204-.03.204-.09-.059 0-.32-.03-.408 0z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.21 3.46v.03c-.059.03-.146.09-.204.12-.185.09-.36.25-.573.28l-.058.03c.33-.09.68-.18.922-.46h-.088z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.646 3.77c.146-.09.292-.18.447-.27-.185-.01-.3.17-.446.27z"
+        fill="#FCD500"
+      />
+      <path d="m30.445 3.77.03.06.058-.06s-.058-.07-.088 0z" fill="#FCD500" />
+      <path
+        d="m30.531 3.8-.028.06c.087.03.204.06.3 0l.059-.09c-.096.09-.213.12-.329.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.277 4.04c0 .15.059.24.175.37 0-.06-.175-.21-.03-.24.32 0 .68.09 1.04.03.115-.03.241-.06.329-.15h-1.513v-.01z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.162 4.13c.087.33.505.55.805.73.32.27.534.64.476 1.04 0 .28-.32.34-.476.28.03.06.088.09.175.12.058.06.291-.03.262-.12-.117-.06.03-.09.03-.18.086-.25.086-.55-.088-.79-.175-.52-1.038-.49-1.155-1.1l-.028.02z"
+        fill="#FCD500"
+      />
+      <path
+        d="M30.92 4.13c-.088.09.06.15.088.15l-.029-.09c0 .03-.06-.12-.06-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M28.281 4.1c.088.21.292.4.506.58.359.15 1.27.7 1.6.91 0-.09-.058-.15-.087-.21-.176-.12-1.369-.79-1.456-.92.029-.06 1.426.86 1.542.92.117 0 .204.03.32.06-.533-.4-1.804-1.19-2.367-1.62-.088.07-.088.19-.059.28zm.593.52c-.417-.21-.534-.55-.505-.7.204.18.447.3.65.43-.242-.09-.358-.12-.562-.27.029.3.3.45.417.54z"
+        fill="#FCD500"
+      />
+      <path
+        d="m32.607 4.31.205-.06a.547.547 0 0 0-.244-.06l.04.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="M31.715 4.38c-.058.12-.029.21.03.31.261-.18.62 0 .882.09.117.09.175.21.33.18-.3-.18-.65-.43-.863-.73-.146-.04-.35.08-.379.15zm.117.21c-.03-.09.058-.12.116-.15-.029.06 0 .09.03.09-.059-.03-.088.03-.146.06z"
+        fill="#FCD500"
+      />
+      <path d="m32.58 4.35-.088-.12c-.03.06 0 .09 0 .12h.088z" fill="#FCD500" />
+      <path
+        d="M32.492 4.44c.087.06.175.15.291.18 0 0-.145-.12-.029-.18.146.18.36.31.534.4-.088-.15-.204-.31-.388-.4-.03-.03.029-.06.029-.06.144.15.387.21.532.4-.116-.12-.145-.31-.32-.4 0-.03-.058-.03 0-.06.146.03.36.03.505-.03-.272.12-.447-.09-.738 0-.156.02-.272.09-.418.15z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.49 4.38c.117.15.3.25.505.25-.175-.03-.32-.12-.476-.25h-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.287 4.38c.087.15.243.25.388.34 0-.15-.242-.21-.3-.34h-.088z"
+        fill="#FCD500"
+      />
+      <path
+        d="m34.21 5.26.087.15c-.087-.28-.175-.55-.446-.73h.03l-.175-.06c.058.27.32.43.505.64z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.46 4.65c.06.06.06.18.117.27.117.09.204.25.32.37a.704.704 0 0 0-.436-.64z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.587 5.23c-.087-.18-.058-.43-.3-.55.029.09.116.18.087.24-.175-.06-.32-.15-.476-.24.243.16.505.37.69.55z"
+        fill="#FCD500"
+      />
+      <path
+        d="m30.823 5.45.476.3c.028-.24-.321-.33-.476-.61.174.15.388.34.446.37v-.16l-.291-.25c-.001.03.028.09-.001.09l-.244-.23c-.029.09.058.34.243.52h-.03c-.117-.12-.33-.43-.243-.64.058.09.116.15.243.24-.088-.09-.175-.24-.272-.37-.116.25-.03.49.146.74z"
+        fill="#FCD500"
+      />
+      <path
+        d="M31.512 4.92c.116.09.271.12.388.03a.67.67 0 0 1 .533-.15.725.725 0 0 0-.359 0c-.184.09-.359.16-.562.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.133 5.05c0 .03 0 .06.03.09 0-.12.145-.15.203-.21-.058.06-.146-.01-.233.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="M28.572 4.99c.03.58.98.7 1.543.98.03-.09.116-.12.271-.12-.3-.12-.863-.3-1.183-.49.504.12.922.4 1.426.49a1.278 1.278 0 0 0-.205-.18c-.427-.22-1.29-.68-1.853-.68zm.088.06c.242-.03.98.28 1.067.31l-.03.03c-.27-.15-.678-.21-.892-.25-.03.15.087.21.272.34.116.06.29.06.359.18-.33-.12-.708-.31-.776-.61z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.705 5.38c-.059.04-.059 0-.088-.03.058.15.088.3.117.46.058-.18.117-.4.03-.61l-.176-.18c.058.12.087.27.117.36z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.413 6.15c.03-.25-.058-.4-.058-.61-.146-.09-.204-.28-.359-.4.184.34.33.64.417 1.01z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.996 5.45c-.087 0-.087-.09-.146-.12-.029.09.176.49.234.64.058-.31-.03-.58-.146-.83.03.09.058.21.058.31z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.375 5.14c.175.18.204.67.117.92.126-.16.214-.8-.117-.92z"
+        fill="#FCD500"
+      />
+      <path
+        d="M31.453 5.87c.175.12.272.25.417.37-.058.09-.233-.09-.32-.12-.087.03-.174 0-.204.03 0 .09.088.15.146.21-.116-.03-.204-.15-.204-.24.058-.09.117 0 .204-.03-.175-.09-.272 0-.3.06.028.27.387.21.504.37-.058.03-.175 0-.272-.06-.204.06-.175.09-.262.21.116.15.058.21.505.18-.175.09-.418.09-.389.33.301.31.418-.09.563-.06-.028.09-.173.12-.173.25 0 .06.116.06.087.15h.175a.435.435 0 0 0 .173-.28c.058 0 .03.09.03.12.057.12.116.25.27.03.03.09-.086.18-.145.18-.029 0-.116-.12-.145-.18-.058.21.116.18.174.3.175-.09.146-.21.175-.43 0 .18.058.4.32.4.204-.12.03-.33 0-.46.146.21.417.4.388.03.059.09.03.18.03.21.145-.12-.117-.34.029-.4.057.06.057.18.173.21.117.09.214 0 .243-.13.029-.15-.243-.24-.088-.4-.145.06-.242.12-.087-.09-.144.15-.358.31-.562.28a.443.443 0 0 1-.446.21.662.662 0 0 1-.504-.27c-.146-.31.3-.43.203-.7-.173-.43-.62-.58-.804-.92a.614.614 0 0 0 .097.64zM33.025 7s.233-.15.29-.18a.6.6 0 0 1-.29.18zm.35-.06c.028.03.086.12.086.18-.057-.06-.086-.12-.086-.18zm.116.28c.088-.03.03-.12.059-.15l.028.06c-.058.15-.146.12-.204.06.03.03.087-.03.117.03zm-.465-.06c0 .03.145.15.03.18 0-.09-.03-.12-.03-.18zm-.476.27c.029 0 .174.3.242-.03.136.27-.3.25-.243.03zm.087-.18c.029.03.029.15.058.18-.087-.03-.087-.12-.058-.18zm-.388.15c-.03 0-.001-.15-.001-.18.057.06.057.15-.001.18zm-.923-.24c.058-.03.03-.12.175-.21-.117.15-.175.27.116.24-.107.09-.262-.03-.29-.03zm.214-.07c0-.06.175-.12.204-.15-.029.06-.116.15-.203.15zm-.155-.45c0-.03.175 0 .3 0-.028.09-.232.06-.3 0zm-.174 0c.059-.06.146-.12.272-.09-.388.06-.145.25 0 .25-.155.05-.242-.1-.271-.16zm.301-.4c.089.03.205.09.244.18-.126-.06-.243-.09-.243-.18zm.06-.55c.145.09.29.25.359.34-.099.03-.331-.28-.36-.34zm-.214-.34c.058.09.175.15.272.24-.087-.03-.146-.09-.243-.12-.058.15.117.27.146.43-.106-.18-.261-.3-.174-.55z"
+        fill="#FCD500"
+      />
+      <path
+        d="M30.416 5.45c.116.37.388.49.737.67.03-.06.059-.09.146-.12-.06-.04-.564-.28-.506-.37.117.09.389.34.65.4.03 0 .117 0 .146.03-.3-.21-.62-.52-1.01-.58.04.15.156.24.243.36-.087.03-.32-.3-.261-.36-.03-.03-.088-.03-.146-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.267 6.51c.03-.12.088-.18.088-.3.058-.03-.03-.09-.03-.15 0-.18-.146-.34-.175-.52-.068.33.146.64.117.97z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.88 6.42c.203-.24.174-.61-.03-.85-.146.27.117.55.03.85z"
+        fill="#FCD500"
+      />
+      <path
+        d="M28.63 5.66c.33.55 1.068.55 1.66.7.058-.06.116-.06.174-.06-.116-.06-1.31-.37-1.28-.43.087-.06 1.009.28 1.125.34-.03-.06-.117-.15-.146-.21-.873-.4-1.174-.4-1.533-.34zm.156.03c.087 0 .737.03.737.12-.242-.06-.359-.09-.62-.06.087.09.679.34.562.37-.174-.12-.562-.19-.679-.43z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.52 6.21c-.116.06-.087.21-.204.3.146-.12.33-.27.388-.49l-.058-.27c.03.18-.126.28-.126.46z"
+        fill="#FCD500"
+      />
+      <path
+        d="M30.23 5.96c.243.43.738.33 1.097.43-.146-.21-.476-.18-.68-.3 0 0 0-.03.03-.03.145.03.3.09.475.12-.03 0-.03-.03-.03-.06-.503-.16-.62-.4-.892-.16zm.097 0c.059-.06.204-.06.292 0-.448-.03-.118.09-.03.25-.088 0-.233-.18-.263-.25z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.763 6.12c-.088.18-.175.37-.273.58.273-.28.39-.34.302-.73l-.03.15z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.025 6.7a.492.492 0 0 0 .146-.34h.03l-.058-.3c-.205.12-.088.42-.117.64z"
+        fill="#FCD500"
+      />
+      <path
+        d="M28.844 6.33c.271.4.62.43 1.572.37-.117-.03-.204-.12-.175-.15-.3-.06-.65-.03-.863-.06-.029-.06.709-.03.864 0 0 0 .03-.03.03-.09-.446-.13-.95-.16-1.426-.07zm.174.03c.146-.03.592-.06.738 0-.243 0-.388 0-.621.03.174.21.271.18.504.25v.03c-.233 0-.534-.09-.622-.31z"
+        fill="#FCD500"
+      />
+      <path
+        d="M30.532 6.33c-.087-.03-.36.18-.204.28.175.15.534.06.767.09 0-.03.058-.12.116-.18-.144.06-.62.06-.649.03-.028-.03.593.03.738-.09-.261-.04-.533-.13-.766-.13zm-.175.18c.059-.09.262-.15.388-.09-.446.03-.475.12-.058.25-.184.03-.33-.09-.33-.16z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.792 6.67a.263.263 0 0 1 0-.21c-.146.08-.175.3-.175.42.146-.15.36-.28.36-.52-.098.09-.069.25-.185.31z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.23 6.58c.058-.06.116-.12.145-.21-.146.15-.505.25-.708.15-.058.4.446.43.679.15.087-.12.204-.12.204-.28-.117.09-.204.19-.32.19zm-.534 0c.174.06.388 0 .417 0-.087.09-.272.03-.359.03.03.12.087.18.3.18-.125.09-.358-.09-.358-.21zm.145.09c.089.03.147.03.205.03-.02.03-.204.03-.204-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.267 6.67c-.058-.03-.087-.06-.058-.12-.118.09-.147.28-.118.43.059.09.243-.03.272.12.204-.06.058-.3.117-.46-.028.03-.058.06-.087.06l-.029-.28c-.039.06-.039.19-.097.25z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.85 6.94c.059.03-.087.21-.029-.15-.086.06-.174.18-.116.27.03.03.117 0 .146.06.176-.09.146-.21.176-.33-.117.12-.059-.09-.088-.18-.058.09-.088.3-.088.33z"
+        fill="#FCD500"
+      />
+      <path
+        d="M30.386 6.88c-.029.12.059.15.175.21.001-.03.622-.06.71-.09-.03-.09.058-.06.145-.12-.36-.06-.534 0-.805.03.145-.09.533-.09.591-.09l-.076-.09c-.233.06-.592-.06-.738.15zm.408.12c-.243.09-.62-.09-.116-.21 0 .03-.476.21.116.21z"
+        fill="#FCD500"
+      />
+      <path
+        d="m28.96 6.91.088.03c.204-.06.563-.12.65-.09-.446.03-.475.09-.533.12.116.09.33.09.533.12v.06c.233.03.563-.03.825-.06-.058-.03-.204-.09-.175-.12h-.921c.087-.09.708-.03.921-.06-.058-.06.088-.12.117-.15-.524.06-1.174-.03-1.504.15z"
+        fill="#FCD500"
+      />
+      <path
+        d="M28.932 6.94c.145.18.533.21.766.21 0-.03 0-.03.03-.03-.273-.03-.65-.03-.68-.21l-.116.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.88 7.19c-.03-.06-.088-.09-.204-.06.058.15.174.34.204.37.174-.06.174-.34.174-.49-.03.11-.116.05-.174.18zm.029.21c-.06-.09-.001-.15.028-.18.029.06 0 .12-.03.18z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.267 7.43a.87.87 0 0 0 .175-.34c-.088.03-.058.09-.117.12-.029-.03-.058-.06-.029-.12-.058-.03-.146 0-.204-.03.058.03.03.4.175.37z"
+        fill="#FCD500"
+      />
+      <path
+        d="M30.56 7.37c.175.18.563.03.738-.15-.058 0-.058-.03-.058-.06-.03-.03-.262.09-.447.12.088-.06.36-.15.447-.15v-.1c-.505.09-.68.03-.68.34zm.36 0c-.272.09-.447-.03-.117-.21-.155.15-.184.18.117.21z"
+        fill="#FCD500"
+      />
+      <path
+        d="M29.105 7.62c.292.3 1.039-.12 1.388-.21v-.12c-.117.03-.796.28-.854.21.174-.12.116 0 .882-.25l.058-.09c-.32.06-1.232 0-1.475.46zm.059 0c.116-.18.359-.28.562-.34-.145.12-.388.09-.504.31.116.09.446-.03.592 0-.175.06-.495.15-.65.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.676 7.74c-.03-.15-.087-.27-.146-.43h-.145c.029.15.087.61.359.52.029-.03.058-.09.058-.15.058.25-.116.31-.3.09 0 .15.116.18.27.21.292-.25-.057-.52-.116-.79l-.087.12c.048.12.135.27.106.43z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.646 7.37c-.058-.03-.116-.03-.116-.09 0 .06-.03.06-.088.09-.087.06-.204.15-.116.28.03.09.116.15.204.21.087-.06.203-.12.242-.21.088-.16-.03-.22-.126-.28zm-.116.06c.058.09.029.21 0 .27-.03-.05-.03-.18 0-.27z"
+        fill="#FCD500"
+      />
+      <path
+        d="M30.92 7.8c.116.09.417 0 .475-.15-.29.21-.592.18-.32-.15-.242.46.32.24.534-.15l-.147-.03c-.116.09-.203.18-.32.34-.03-.09.175-.28.262-.34l-.058-.03-.388.25c-.04.08-.04.13-.04.26z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.122 7.7c-.029-.06-.087-.18-.087-.27-.03.06-.088.09-.117.09 0 .18.058.24.272.33.059-.21.088-.37-.087-.55-.107.13.107.25.02.4z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.229 7.52c-.001.09.086.33.028.33-.058-.21-.087-.3-.087-.3-.029.03-.203-.06-.203-.03.087.27.087.58.359.64.242-.12 0-.73 0-.83l-.097.19zm-.118.31c.204.25.204.21.233-.03.058.24-.058.4-.233.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.142 7.52c0-.03.03-.06.03-.06-.089.03-.176 0-.244-.03.029.06.126.09.214.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M29.493 8.01c.117-.18.272-.21.417-.34.03.03 0 .03.03.03 0 .03-.36.21-.32.31.116.09.32 0 .475-.09l.029.03c-.146.09-.476.21-.621.09v.06c.446.21 1.426-.61 1.426-.61-.06 0-.147.03-.147.03-.087 0-.892.46-.863.33.272-.09.563-.21.766-.37-.116 0-.145-.06-.174-.03-.214.1-1.077.32-1.02.56z"
+        fill="#FCD500"
+      />
+      <path
+        d="M31.89 7.62c-.058.12-.087.15-.116.3.058.34.204.12.233.09-.03.18-.233.25-.262-.03-.03.09-.03.18.087.25.36-.03.243-.34.33-.58l-.058-.06c-.03.12-.204.24-.175.37-.117-.15.086-.15.145-.46-.088.02-.127.08-.185.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="M29.881 8.5c.39.09.806-.43 1.01-.64v-.09c-.087.03-.388.31-.65.43.146-.18.417-.34.65-.49v-.12c-.087.06-.33.24-.592.37-.271.14-.475.39-.417.54zm.477-.24c-.418.37-.592.15-.204-.15-.272.3-.156.36.204.15z"
+        fill="#FCD500"
+      />
+      <path
+        d="m32.366 8.07-.03-.4c0 .03-.144.09-.115-.03-.058.37-.203.58.117.64.504-.06.116-.52.233-.61l-.087-.09c-.175.16-.02.4-.117.49zm-.145-.09c.059.28.243.21.292-.03.068.25-.32.46-.291.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.84 7.7v.28c-.058.06-.058-.25-.058-.28l-.145-.03c.029.4-.03.52.271.61.272-.09.059-.52 0-.67l-.068.09zm-.145.31c.272.4.272-.06.3-.06.059.31-.242.4-.3.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.354 8.23c.059-.06.088-.21.088-.34-.088-.06-.088-.09-.175-.15-.088.15 0 .33.087.49zm0-.13a.196.196 0 0 1 0-.18c.03.09.059.12 0 .18z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.083 8.26c.059-.09.088-.25.059-.34l-.058-.06c0 .09-.03.12 0 .21-.146-.06.029-.28-.146-.31-.059.13.058.4.146.5z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.005 8.26a.475.475 0 0 1-.058-.34l.088-.06c-.03.09 0 .12-.03.21.146-.06-.029-.28.146-.31.06.13-.028.4-.145.5z"
+        fill="#FCD500"
+      />
+      <path
+        d="M30.59 8.87c.36 0 .622-.67.738-.83-.03-.03 0-.12-.03-.15-.145.21-.387.46-.533.64-.116-.03.476-.64.534-.7-.088.06-.292.09-.36.06-.116.21-.708.61-.35.98zm.33-.34c-.145.43-.533.31-.271-.15-.118.33.028.46.27.15z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.82 8.07c.088.15-.087.52.06.64.028-.12.145-.28.174-.43-.058 0-.058-.03-.058-.06-.058.03-.03.06-.088.21-.058-.06.03-.24.03-.3l-.03-.18c-.029.03-.146 0-.087.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.404 8.38c.03-.09 0-.12 0-.21-.058.03-.03.27-.117.4.175-.09.273-.37.33-.55l-.116-.06c-.096.14-.009.17-.096.42z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.617 8.23c-.03.12-.03.27.03.4.203-.12.174-.37.145-.55-.146-.19-.146.05-.175.15zm.058.21c-.03-.03-.03-.3.059-.37 0 .13.029.28-.059.37z"
+        fill="#FCD500"
+      />
+      <path
+        d="M31.328 8.74c-.088-.21.271-.64.3-.7-.029.09-.174.03-.203.06-.243.25-.505.7-.204.89.33.03.447-.58.505-.76 0-.06-.029-.09-.029-.15-.155.18-.31.33-.368.66zm.184-.06c-.243.55-.446.03-.3-.18-.03.46.145.4.3.18z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.209 8.56c.202-.18.057-.4.028-.49-.058.13-.117.37-.03.49zm.028-.15c0-.06-.058-.12 0-.15.029.03.029.12 0 .15z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.055 8.23c.029.09.029.49 0 .58.146-.15.262-.37.262-.58 0-.03-.058-.03-.087-.03 0 .12-.059.21-.059.37-.028-.09.09-.33-.086-.46 0 .02 0 .09-.03.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="M31.89 8.29c-.088.33-.146.52.087.64.3-.09.174-.37.242-.58l-.117-.09c-.059.15-.03.27-.088.43-.058 0 .03-.43.059-.46-.059 0-.127.09-.185.06zm0 .24c.028.25.116.4.242.03-.03.49-.301.34-.243-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M31.6 7.43c-.03.15-.175.24-.272.37.03.06-.03.12.058.25.417 0 .33-.25.417-.46l-.087-.06c-.087.15-.145.18-.174.33-.088-.09.116-.3.145-.37l-.087-.06zm-.146.27c-.029.15.03.46.204.06 0 .34-.388.31-.204-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M40.99 3.34c-.3.52-2.164 1.62-2.64 2.05-.028 0 .146-.31.176-.4.388-.27 1.96-1.31 2.163-1.68-.292.27-1.747 1.34-2.164 1.62 0-.09 0-.15-.03-.21.418-.46 2.135-1.65 2.426-2.14.281.18.155.54.068.76zm-.262.24c.3-.3.388-.73.204-.91-.088.24-.301.46-.476.67l.03.03c.116-.06.417-.37.475-.55.088.3-.116.61-.232.76z"
+        fill="#FCD500"
+      />
+      <path
+        d="M41.02 4.07c-.058.21-.3.4-.505.58-.388.15-1.455.73-1.775.95 0-.09.029-.15.087-.21.175-.12 1.514-.83 1.63-.98-.058-.03-1.6.92-1.717.98-.117 0-.233.03-.36.06.564-.4 2.019-1.22 2.61-1.65.059.06.059.18.03.27zm-.621.52c.445-.21.59-.55.532-.7-.203.18-.446.3-.679.43.272-.09.388-.12.592-.27-.03.3-.33.45-.446.54z"
+        fill="#FCD500"
+      />
+      <path
+        d="m38.235 5.45-.476.3c-.03-.24.358-.33.475-.61-.146.15-.36.34-.446.37v-.16l.319-.25c-.03.03-.03.09-.03.09l.271-.25c.001.09-.086.34-.241.52.144-.12.358-.43.27-.64a1.7 1.7 0 0 1-.271.24c.115-.09.173-.24.27-.37.155.27.068.51-.145.76z"
+        fill="#FCD500"
+      />
+      <path
+        d="M40.758 4.81c-.029.58-1.27.88-1.804 1.16-.03-.09-.116-.12-.243-.12.273-.12 1.156-.49 1.486-.64l-.03-.03c-.475.15-1.183.58-1.688.67l.175-.18c.417-.22 1.572-.86 2.105-.86zm-.058.08c-.233-.03-1.3.43-1.368.46v.03c.3-.15 1.01-.4 1.213-.43.03.15-.087.21-.262.34-.116.09-.3.09-.359.21.33-.15.708-.33.776-.61z"
+        fill="#FCD500"
+      />
+      <path
+        d="M38.652 5.45c-.116.37-.388.49-.708.67A.514.514 0 0 0 37.8 6c.057-.03.561-.28.503-.37-.116.09-.417.34-.65.4-.03 0-.116 0-.174.03.3-.21.62-.52 1.037-.58-.03.15-.175.24-.243.37.087.03.291-.3.272-.37.02-.03.077-.03.106-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M40.544 5.66c-.359.55-1.096.55-1.746.7-.059-.06-.117-.06-.175-.06.116-.06 1.33-.37 1.33-.43-.088-.06-1.039.28-1.184.34.028-.06.144-.15.173-.21.922-.4 1.223-.4 1.6-.34zm-.146.03c-.116 0-.766.03-.766.12.233-.06.36-.09.62-.06-.086.09-.707.34-.59.37.203-.12.59-.19.736-.43z"
+        fill="#FCD500"
+      />
+      <path
+        d="M38.827 5.96c-.204.43-.708.33-1.067.43.145-.21.446-.18.679-.3-.001 0-.001-.03-.03-.03-.146.03-.3.09-.476.12.03 0 .03-.03.03-.06.514-.16.6-.4.863-.16zm-.087 0c-.059-.06-.175-.06-.291 0 .474-.03.115.09.028.25.087 0 .262-.18.262-.25z"
+        fill="#FCD500"
+      />
+      <path
+        d="M40.253 6.33c-.242.4-.62.43-1.571.37.145-.03.203-.12.203-.15.272-.06.621-.03.835-.06.029-.06-.68-.03-.835 0-.029 0-.058-.03-.029-.09.417-.13.951-.16 1.397-.07zm-.155.03c-.174-.03-.62-.06-.766 0 .242 0 .388 0 .62.03-.174.21-.261.18-.475.25v.03c.243 0 .534-.09.621-.31z"
+        fill="#FCD500"
+      />
+      <path
+        d="M38.565 6.33c.088-.03.36.18.204.28-.146.15-.534.06-.767.09 0-.03-.058-.12-.117-.18.146.06.621.06.65.03.03-.03-.591.03-.708-.09.233-.04.495-.13.737-.13zm.204.18c-.088-.09-.292-.15-.418-.09.446.03.475.12.058.25.185.03.33-.09.36-.16z"
+        fill="#FCD500"
+      />
+      <path
+        d="M38.68 6.88c.06.12-.028.15-.174.21 0-.03-.591-.06-.679-.09.03-.09-.058-.06-.145-.12.32-.06.533 0 .805.03-.146-.09-.534-.09-.62-.09l.086-.09c.253.06.611-.06.728.15zm-.416.12c.271.09.62-.09.116-.21 0 .03.505.21-.116.21z"
+        fill="#FCD500"
+      />
+      <path
+        d="m40.136 6.91-.097.03c-.205-.06-.564-.12-.65-.09.416.03.474.09.504.12-.088.09-.32.09-.534.12l.03.06c-.263.03-.593-.03-.835-.06.058-.03.174-.09.174-.12h.92c-.115-.09-.736-.03-.92-.06.028-.06-.088-.12-.117-.15.543.06 1.193-.03 1.523.15z"
+        fill="#FCD500"
+      />
+      <path
+        d="M40.167 6.94c-.146.18-.534.21-.767.21 0-.03-.029-.03-.029-.03.244-.03.651-.03.68-.21l.117.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M38.536 7.37c-.174.18-.562.03-.737-.15.057 0 .086-.03.057-.06.03-.03.291.09.446.12-.058-.06-.359-.15-.446-.15v-.1c.524.09.68.03.68.34zm-.359 0c.272.09.447-.03.117-.21.184.15.184.18-.117.21z"
+        fill="#FCD500"
+      />
+      <path
+        d="M39.982 7.62c-.29.3-1.067-.12-1.397-.21 0-.03-.029-.09-.029-.12.117.03.835.28.893.21-.205-.12-.118 0-.923-.25l-.03-.09c.302.06 1.253 0 1.485.46zm-.058 0c-.116-.18-.359-.28-.592-.34.146.12.389.09.505.31-.087.09-.446-.03-.592 0 .175.06.534.15.68.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M38.177 7.8c-.145.09-.417 0-.504-.15.29.21.62.18.32-.15.242.46-.32.24-.505-.15l.117-.03c.145.09.242.18.359.34 0-.09-.175-.28-.291-.34l.087-.03.359.25c.057.08.057.13.057.26z"
+        fill="#FCD500"
+      />
+      <path
+        d="M39.575 8.01c-.088-.18-.243-.21-.418-.34-.029.03 0 .03 0 .03 0 .03.36.21.32.31-.116.09-.32 0-.504-.09l-.03.03c.146.09.476.21.65.09v.06c-.474.21-1.454-.61-1.454-.61.057 0 .144.03.144.03.087 0 .893.46.864.33-.243-.09-.563-.21-.767-.37.147 0 .147-.06.205-.03.213.1 1.048.32.99.56z"
+        fill="#FCD500"
+      />
+      <path
+        d="M37.197 7.62c.03.12.088.15.117.3-.058.34-.204.12-.262.09.058.18.233.25.29-.03 0 .09 0 .18-.086.25-.36-.03-.233-.34-.32-.58l.058-.06c0 .12.174.24.145.37.116-.15-.088-.15-.117-.46.058.02.087.08.174.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="M39.216 8.5c-.388.09-.795-.43-1.01-.64v-.09c.088.03.39.31.651.43-.175-.18-.446-.34-.65-.49v-.12c.058.06.3.24.563.37.271.14.504.39.446.54zm-.505-.24c.419.37.623.15.205-.15.272.3.185.36-.204.15z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.722 8.07v-.4c.03.03.175.09.146-.03.058.37.174.58-.146.64-.475-.06-.087-.52-.233-.61l.116-.09c.174.16 0 .4.116.49zm.155-.09c-.087.28-.242.21-.33-.03-.029.25.33.46.33.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M38.507 8.87c-.36 0-.62-.67-.737-.83.029-.03 0-.12.029-.15.173.21.387.46.532.64.117-.03-.475-.64-.533-.7.086.06.29.09.387.06.077.21.698.61.32.98zm-.33-.34c.146.43.534.31.272-.15.115.33-.03.46-.273.15z"
+        fill="#FCD500"
+      />
+      <path
+        d="M37.76 8.74c.086-.21-.243-.64-.272-.7 0 .09.145.03.174.06.233.25.505.7.204.89-.32.03-.447-.58-.505-.76.001-.06.06-.09.03-.15.194.18.31.33.37.66zm-.175-.06c.242.55.475.03.29-.18.03.46-.116.4-.29.18z"
+        fill="#FCD500"
+      />
+      <path
+        d="M37.197 8.29c.087.33.145.52-.087.64-.33-.09-.204-.37-.272-.58l.116-.09c.088.15.059.27.088.43.087 0-.03-.43-.03-.46.068 0 .127.09.185.06zm0 .24c-.03.25-.117.4-.272.03.04.49.3.34.272-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M37.47 7.43c.058.15.203.24.27.37 0 .06.06.12-.057.25-.417 0-.3-.25-.417-.46l.116-.06c.058.15.117.18.175.33.058-.09-.146-.3-.146-.37l.06-.06zm.174.27c.03.15-.03.46-.243.06.04.34.419.31.244-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.443 8.84c.087-.06.087-.18.087-.28a.398.398 0 0 1-.146-.18c-.058.21-.301.21.059.46zm-.059-.31c.059.09.059.15.059.18-.117-.06-.03-.15-.059-.18z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.434 8.47c.058.06 0 .18.029.21l.058.21c.03-.09.176-.15.06-.25-.03 0 0 .09-.03.12-.029-.06 0-.12.03-.21l-.059-.24c.001.04-.057.16-.086.16z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.055 8.93c.087-.09.116-.18.146-.31a.376.376 0 0 1-.116-.25c-.059.16-.263.44-.03.56zm-.03-.15c0-.06 0-.15.03-.18-.03.05.029.14-.03.18z"
+        fill="#FCD500"
+      />
+      <path d="M33.434 8.68v-.15l-.088.06.088.09z" fill="#FCD500" />
+      <path
+        d="M33.617 9.17c.146-.09.292-.33.175-.49-.058.03-.029.12-.087.25l.058-.37c-.146.22-.117.4-.146.61z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.2 9.05c.058-.09.203-.18.203-.27 0 0-.058-.12-.058-.09-.03.37-.058.12-.03-.06-.174-.07-.028.3-.116.42z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.122 9.14c.175-.12.03-.21.146-.24-.058.12-.029.21.059.27.087-.03.087-.18.116-.27-.087-.03-.146-.09-.204-.18 0 .15-.244.24-.118.42zm.205-.03c-.03-.09-.03-.12 0-.18.029.03.058.12 0 .18z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.812 9.2c.145-.12.243-.3.145-.3.059-.03-.116.12-.116.09-.115.12-.057.24-.27.3.087.03.145 0 .33-.03-.088.06-.272.12-.36.03h-.116c.204.12.32.12.504.03a.587.587 0 0 0 .243-.61c-.028.09-.057.12-.116.15.03.07-.058.28-.242.34z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.878 9.2c.03 0 .117-.15.146-.27l-.058-.03c0 .06-.058.06-.058.18-.088-.03.029-.18.029-.21 0-.03-.03-.06-.03-.09-.029.12-.175.3-.029.42z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.288 9.23c.03-.12.087-.21.087-.3-.116.09-.174.3-.232.46.116.09.232-.25.358-.34l-.057-.27c-.01.15-.068.36-.155.45z"
+        fill="#FCD500"
+      />
+      <path d="m33.588 9.08.03-.21-.098.09.068.12z" fill="#FCD500" />
+      <path
+        d="M34.53 8.9c-.03.09-.263.3-.117.49 0 .03.087.06.117.09.058 0 .116-.06.146-.09.097-.13-.117-.4-.146-.49zm0 .24c.029.06.029.12 0 .18-.03-.09-.059-.12 0-.18z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.405 9.45c.116-.03.146-.15.175-.21 0-.03-.03-.06-.03-.09a.663.663 0 0 1-.087.15c0-.06.058-.15.058-.21-.057.08-.174.2-.115.36z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.18 9.51c.174-.12.116-.31.029-.43-.09.09-.274.24-.03.43zm0-.12c-.03-.06-.03-.12.029-.18.028.05.028.14-.03.18z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.618 9.48c.117-.09.175-.28.175-.4-.058.09-.301.21-.175.4z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.85 9.23c0 .09.058.21.116.28.03-.03.03-.31.088-.34l-.03-.09c-.058.06-.116.18-.174.15z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.578 9.63c.243.03.446-.09.62-.21-.057 0-.115.03-.115 0-.088.03-.204.15-.272.12.117-.06.205-.15.273-.18l.087-.28c-.087.31-.417.34-.592.55z"
+        fill="#FCD500"
+      />
+      <path
+        d="M31.89 9.66c-.03.24.03.33 0 .46l-.087.09c.087 0 .145-.03.145-.09.03-.15-.116-.52.36-.79a.485.485 0 0 0-.418.33z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.209 9.54v.18c-.03-.06-.06-.12-.03-.15-.03-.03-.117-.09-.117-.15-.087.25.03.28.175.43.087-.09.174-.24.204-.33a.46.46 0 0 1-.117-.18c0 .11-.058.11-.116.2z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.366 9.35c-.146.03-.175.15-.204.21.175.06.417 0 .534-.12-.117.03-.262.12-.36.06.088-.03.175-.03.263-.09-.108-.06-.137-.06-.234-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.938 9.9c.088-.3.059-.3-.087-.49 0 .06.03.12 0 .25l-.057-.31c-.088.09-.117.15-.117.21.03.1.175.25.263.34z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.618 9.72c-.088-.06-.088-.18-.117-.28-.144.06-.028.21.001.31l.302.24c.087-.15-.174-.33-.242-.58-.04.01.029.22.058.31z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.783 9.84c.272-.06.446-.12.708-.06a.46.46 0 0 1-.115-.33c-.058.03-.058.15-.058.25-.058-.03-.058-.12-.03-.18-.087.06-.145.09-.29.18.029-.06.32-.21.359-.37-.156.15-.515.3-.573.51z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.19 10.12c.059-.21.175-.21.302-.43-.117 0-.204.09-.272.18 0-.09.087-.18.204-.21-.35-.15-.35.34-.233.46z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.83 9.9c-.087-.06-.116-.15-.203-.24 0 .09-.058.15-.087.24-.03-.09-.088-.15-.088-.24a1.66 1.66 0 0 1-.174.24.46.46 0 0 1-.243-.21c.03.21.3.52.505.55.203-.03.475-.34.504-.55a.404.404 0 0 1-.213.21z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.133 9.54c-.175.21-.146.4-.117.55.059.15.146.31.088.43.204-.06.272-.27.146-.4-.03.15-.331-.12-.059-.49-.086 0-.057-.03-.057-.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.395 10c.058-.03.262-.06.359-.15l.087-.18c-.086.03-.3.18-.33.21 0-.09.147-.15.205-.21-.03 0-.117.03-.175.03-.03.02-.204.17-.145.3z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.063 9.75c-.029.18-.145.33-.3.49-.059.09-.03.3-.243.33-.204-.03-.175-.24-.233-.33-.145-.15-.272-.31-.3-.49 0 .18.116.3.116.49.058.15.271.37.417.49.175-.12.359-.33.417-.49.01-.18.155-.31.126-.49z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.928 10c-.058.12-.087.28 0 .4.087.12.262.12.388 0-.592-.03-.204-.7.272-.49-.185-.13-.505-.16-.66.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.782 10.51c.146-.15-.087-.33.175-.64-.087-.03-.146 0-.175.03-.146.28-.087.43 0 .61z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.82 10.03c.088.06.205.25.263.34 0-.09 0-.34-.234-.52-.03.02.029.15-.03.18z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.463 10.58c.447-.06.058-.24.233-.61-.058 0-.116.15-.146.21-.029-.06.03-.15.03-.18-.214.15.029.39-.117.58z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.336 10.15c.03.09 0 .18 0 .27.204-.03.03-.27.146-.4-.02.01-.117.04-.146.13z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.307 10.12c0-.06.059-.06.03-.15-.089.03-.118.09-.03.15z"
+        fill="#FCD500"
+      />
+      <path
+        d="M31.658 10.24c.146.06.446.09.36-.12 0 .12-.243.15-.36.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.559 10.73c.144-.09.387.03.445-.18.058-.09.03-.21-.058-.3-.01.36-.33.3-.388.48z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.055 11.62c-.088.03-.36-.09-.3-.25-.088.09-.117.21-.088.37.029.06.116.09.174.03-.086-.03-.202-.12-.115-.31 0 .12-.03.18.087.25.058-.03.058.06.088.06-.03.03 0 .06 0 .09-.03.03-.03.06-.059.03-.028 0-.086.03-.115.06-.116.03-.087.18-.146.31-.03.18.145.24.145.43.116-.12-.03-.43.204-.43-.001.15-.001.3.086.43.087.12.233.21.388.12.058-.09.146-.21.272-.15 0-.03-.03-.12-.088-.15-.087-.06-.271 0-.33-.18 0-.06-.028-.21.03-.28.058-.03.029.06.087.09.058.03.204.06.272-.12-.088.06-.146-.06-.175-.12 0-.7.834-.73.737-1.49-.127.78-.835.63-1.155 1.21zm.233.24c.029 0 .029-.03.029-.03.029.21.145.18.242.25-.156.02-.272-.1-.272-.22zm-.03.92c-.203-.03-.358-.3-.261-.46.029.24.029.33.262.43v.03zm-.087-1.07c.176-.34.535-.46.797-.73-.117.27-.767.43-.854 1.04-.03.21 0 .4.117.52.058.03.145.03.145.09-.116-.03-.233-.06-.262-.24-.087-.26-.03-.47.058-.68zm-.27.03c.029-.09.087-.03.116 0-.02 0-.087.06-.116 0zm-.175.64c-.116-.18.058-.37.243-.43v.03c-.059.03-.272.12-.204.28.029-.06.058-.03.058-.06.058-.03.116-.09.175-.03-.03 0-.03 0-.03.03-.097-.03-.184.09-.242.18z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.675 11.89c.145-.09-.059.31-.117.34-.029.03-.029.09-.058.15.087.03.146.06.204.15 0 .09.058.18 0 .25a.218.218 0 0 0-.117-.06c-.145.21.175.4.291.37.03-.03.059-.06.059-.03a.484.484 0 0 0 .3-.18c-.087-.09-.271-.06-.3-.25-.117-.76.359-1.34.33-2.08-.03.58-.505.85-.592 1.34zm.475-.73h.03c-.117.31-.36.61-.418.98-.03.28 0 .58.175.73-.03.03-.088-.03-.117-.06a1.044 1.044 0 0 1-.058-.79c0-.28.262-.53.388-.86zm-.213 1.86c-.175.03-.389-.09-.32-.21.028.09.203.15.32.21z"
+        fill="#FCD500"
+      />
+      <path d="m34.384 12.81-.175-.21c.028.08.086.18.174.21z" fill="#FCD500" />
+      <path
+        d="M34.529 7.89c-.089.12-.06.28-.147.4.03.09.058.15.146.21a.347.347 0 0 0 .145-.21c-.088-.13-.059-.28-.146-.4zm-.001.27c.028.06.028.12-.001.15-.03-.02-.03-.08-.001-.15z"
+        fill="#FCD500"
+      />
+      <path
+        d="m34.53 9.54-.06.06c0 .06.03.15.06.18.029-.03.058-.12.058-.18l-.059-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.53 13.23c-.146-.03-.262-.21-.292-.33.03-.09.088-.09.059-.18-.03.03-.03.03-.059.03-.058-.15 0-.52 0-.7-.058.15-.058.55-.058.7-.058-.25 0-.49 0-.7.058-.4.175-.83.204-1.22 0 0 .087.18.145.18s.145-.18.145-.18c.058.4.146.83.204 1.22-.001.21.086.46-.001.7.028-.18-.001-.55-.03-.7-.03.18.029.55-.03.7 0 0-.029 0-.029-.03-.057.09.03.09.03.18-.019.12-.145.31-.29.33zm-.03.03.03.09.058-.09H34.5zm.03-2.07c-.059 1.04-.059 1.71 0 1.9 0 .03 0 .03 0 0 .087-.59.058-1.23 0-1.9 0-.03 0-.03 0 0z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.326 10.18c.058.09.03.33.204.37.174-.03.145-.27.204-.37-.175.15-.204.18-.408 0z"
+        fill="#FCD500"
+      />
+      <path
+        d="M31.51 3.4c.06-.09.176-.37.06-.43.058-.03.087-.06.174 0 .146.15-.204.49-.146.73-.087-.09-.116-.21-.087-.3z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.413 6.15s.059.15.059.18c-.06.06-.06.12-.06.12-.058-.12-.029-.18 0-.3z"
+        fill="#FCD500"
+      />
+      <path d="m34.53 8.78-.06.12.06-.03.058.03-.059-.12z" fill="#FCD500" />
+      <path
+        d="M32.813 2.67h-.087v-.06h-.088l.03.06h-.117v.06h.088v.06h.088v-.06h.087v-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.782 2.91c0-.03-.03-.06-.087-.06-.058 0-.088.03-.088.06 0 .06.03.09.088.09s.087-.03.087-.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="m34.714 1.75-.127.03v-.09l-.03-.03-.057.03v.09l-.117-.03v.09l.117-.03v.09h.088v-.09l.126.03v-.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M38.914 9.2v-.09l-.087-.03-.117.03v.09l-.116-.03v.28l.116-.03v.09h.204v-.09l.126.03v-.28l-.126.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M39.011 9.26h-.154l.03-.12h-.117v.12h-.118v.09l.117-.03v.13H38.884l-.029-.13.155.03v-.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.675 2.11c0-.06-.059-.12-.117-.12-.087 0-.146.06-.146.12s.059.12.146.12c.058.01.117-.05.117-.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.277 4.01v-.03s.262-.06.388-.06c.117 0 .418.03.418.06.029 0 .203-.03.232-.06.059 0-.029.06.03.09h-1.068z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.929 8.71c.057-.09.028-.31.028-.4l.058-.06c.03.24.059.58-.204.7-.058-.09.03-.15.03-.21 0-.18 0-.37-.117-.49.058.03.116.03.146.09.03.04.059.22.059.37z"
+        fill="#FCD500"
+      />
+      <path
+        d="M37.973 3.03c-.146-.03-.388-.21-.592-.18.088-.03.243-.18.36-.12.077.06.233.15.233.3z"
+        fill="#FCD500"
+      />
+      <path
+        d="M37.371 2.88c.176 0 .331.06.477.12.203.12.62-.03.65.25-.146-.18-.447-.09-.65-.18-.146-.04-.32-.22-.534-.13-.146.18.146.49.175.67 0 .18-.243.25-.388.31.087-.06.203-.12.262-.21.116-.3-.204-.49-.146-.79.039-.04.126-.07.155-.04z"
+        fill="#FCD500"
+      />
+      <path
+        d="M38.235 3.34c-.029-.06-.029-.15-.087-.18.175.03.116.25.146.18.029-.06 0-.12-.059-.18.204.03.058.28.146.18 0-.03.03-.09 0-.12.06-.03.06.03.06.06.028.12-.33.24-.205.46-.029 0-.058-.03-.087 0-.087.06-.087.25 0 .34-.03.03-.058.03-.03.06-.057-.12-.29-.21-.174-.4.146-.12.204-.4.117-.58.146-.01.088.27.175.18zm-.174.61c-.028-.18.088-.25.059-.31-.088.09-.118.19-.06.31z"
+        fill="#FCD500"
+      />
+      <path
+        d="M38.322 3.73c.03.03.088.03.146.06-.03.03-.146.03-.204-.03-.088-.18.116-.3.204-.43.039.16-.234.22-.146.4z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.888 3.46c0 .03 0 .03.03.03.028.03.116.09.174.12.174.09.359.25.592.28l.029.03c-.33-.09-.68-.18-.922-.46h.098z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.48 3.77c-.175-.09-.32-.18-.476-.27.184-.01.3.17.475.27z"
+        fill="#FCD500"
+      />
+      <path
+        d="M38.653 3.77v.06l-.06-.06c-.028 0 .03-.07.06 0z"
+        fill="#FCD500"
+      />
+      <path
+        d="m38.565 3.8.03.06c-.088.03-.205.06-.292 0l-.059-.09c.078.09.204.12.321.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.808 4.04c0 .15-.058.24-.145.37 0-.06.145-.21 0-.24-.32 0-.68.09-1.038.03-.117-.03-.243-.06-.33-.15h1.513v-.01z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.964 4.13c-.116.33-.533.55-.834.73-.32.27-.534.64-.446 1.04-.03.28.29.34.446.28 0 .06-.087.09-.146.12-.087.06-.32-.03-.29-.12.116-.06-.03-.09-.03-.18a.948.948 0 0 1 .088-.79c.174-.52 1.038-.49 1.154-1.1l.058.02z"
+        fill="#FCD500"
+      />
+      <path
+        d="M38.178 4.13c.088.09-.059.15-.088.15l.03-.09c0 .03.058-.12.058-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="m36.49 4.31-.205-.06a.67.67 0 0 1 .234-.06l-.03.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="M37.41 4.38c.058.12.029.21-.03.31-.29-.18-.62 0-.921.09-.089.09-.147.21-.331.18.329-.18.678-.43.891-.73.147-.04.35.08.39.15zm-.127.21c.03-.09-.058-.12-.116-.15.03.06 0 .09-.058.09.086-.03.115.03.173.06z"
+        fill="#FCD500"
+      />
+      <path d="m36.518 4.35.117-.12c0 .06 0 .09-.03.12h-.087z" fill="#FCD500" />
+      <path
+        d="M36.606 4.44a.702.702 0 0 1-.291.18s.145-.12.029-.18c-.146.18-.33.31-.534.4.087-.15.204-.31.388-.4.03-.03 0-.06-.029-.06-.146.15-.39.21-.534.4.116-.12.145-.31.32-.4.029-.03.058-.03.029-.06-.175.03-.388.03-.534-.03.273.12.447-.09.738 0 .156.02.272.09.418.15z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.626 4.38c-.117.15-.301.25-.505.25.147-.03.292-.12.447-.25h.059z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.84 4.38a1.5 1.5 0 0 1-.418.34c0-.15.242-.21.3-.34h.117z"
+        fill="#FCD500"
+      />
+      <path
+        d="m34.917 5.26-.116.15c.088-.28.175-.55.447-.73h-.03l.205-.06c-.088.27-.36.43-.505.64z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.626 4.65c-.058.06-.058.18-.116.27-.088.09-.204.25-.32.37 0-.21.145-.52.436-.64z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.51 5.23c.087-.18.087-.43.33-.55-.059.09-.146.18-.117.24.175-.06.32-.15.476-.24-.244.16-.477.37-.69.55z"
+        fill="#FCD500"
+      />
+      <path
+        d="M37.615 4.92c-.146.09-.3.12-.417.03a.636.636 0 0 0-.505-.15.616.616 0 0 1 .33 0c.175.09.388.16.592.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.964 5.05c0 .03 0 .06-.03.09.03-.12-.145-.15-.203-.21.05.06.146-.01.234.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.422 5.38c.03.03.03 0 .059-.03-.058.15-.087.3-.116.46-.03-.18-.117-.4-.03-.61l.176-.18c-.03.12-.088.27-.088.36z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.674 6.15c-.03-.25.058-.4.058-.61.146-.09.204-.28.36-.4-.146.34-.321.64-.418 1.01z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.122 5.45c.058 0 .058-.09.116-.12.03.09-.175.49-.233.64-.059-.31.03-.58.146-.83-.028.09-.058.21-.028.31z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.722 5.14c-.175.18-.204.67-.117.92-.126-.16-.214-.8.117-.92z"
+        fill="#FCD500"
+      />
+      <path
+        d="M37.643 5.87c-.175.12-.243.25-.388.37.029.09.203-.09.3-.12.088.03.175 0 .243 0 0 .12-.116.18-.174.24.116-.03.203-.15.203-.24-.058-.09-.116 0-.203-.03.203-.09.261 0 .29.06-.029.27-.388.21-.504.37.087.03.175 0 .272-.06.203.06.174.09.29.21-.145.15-.087.21-.533.18.174.09.416.09.387.33-.271.31-.417-.09-.562-.06.058.09.174.12.174.25 0 .06-.117.06-.088.15h-.175c-.087-.06-.116-.15-.174-.28-.059 0-.03.09-.03.12-.058.12-.116.25-.271.03-.03.09.087.18.145.18.03 0 .117-.12.146-.18.058.21-.117.18-.175.3-.174-.09-.145-.21-.174-.43 0 .18-.059.4-.32.4-.204-.12-.03-.33 0-.46-.146.21-.418.4-.389.03-.058.09-.029.18-.029.21-.145-.12.117-.34-.029-.4-.058.06-.058.18-.145.21-.117.06-.243-.03-.243-.15-.06-.15.203-.24.057-.4.146.06.243.12.117-.09.145.15.32.31.533.28.117.15.272.24.447.21.203 0 .417-.12.504-.27.146-.31-.3-.43-.174-.7.145-.43.591-.58.805-.92.038.24.008.48-.137.66zM36.07 7c.001 0-.203-.15-.29-.18a.6.6 0 0 0 .291.18zm-.348-.06c-.03.03-.087.12-.058.18.02-.06.058-.12.058-.18zm-.126.28c-.058-.03-.03-.12-.058-.15v.06c.029.15.145.12.174.06-.029.03-.087-.03-.116.03zm.475-.06c.001.03-.115.15-.028.18 0-.09.03-.12.03-.18zm.477.27s-.175.3-.233-.03c-.155.27.29.25.233.03zm-.059-.18c-.058.03-.058.15-.058.18.058-.03.058-.12.058-.18zm.36.15c.028 0 0-.15 0-.18-.04.06-.04.15 0 .18zm.911-.24c-.059-.03-.03-.12-.146-.21.087.15.145.27-.146.24.117.09.262-.03.291-.03zm-.204-.07c0-.06-.175-.12-.204-.15.02.06.116.15.204.15zm.174-.45c-.029-.03-.203 0-.3 0 .01.06.213.06.3 0zm.146 0c-.03-.06-.146-.12-.262-.09.417.06.145.25 0 .25.145.05.262-.1.262-.16zm-.291-.4c-.088.03-.204.09-.243.18.097-.06.185-.12.243-.18zm-.058-.55c-.117.09-.301.25-.36.34.03.03.301-.28.36-.34zm.203-.34c-.058.09-.174.15-.271.24.086-.03.173-.12.27-.15.058.15-.145.3-.174.46.145-.18.262-.3.174-.55z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.83 6.51c-.029-.12-.087-.18-.087-.3-.059-.03.029-.09.029-.15 0-.18.146-.34.175-.52.058.33-.146.64-.117.97z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.21 6.42c-.176-.24-.146-.61.029-.85.154.27-.118.55-.03.85z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.567 6.21c.146.06.117.21.204.3-.144-.12-.329-.27-.358-.49l.03-.28c-.02.19.125.29.125.47z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.335 6.12c.087.18.174.37.3.58-.3-.28-.417-.34-.33-.73l.03.15z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.064 6.7c-.059-.09-.146-.21-.146-.34h-.03l.06-.3c.213.12.087.42.116.64z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.305 6.67c.03-.06.03-.15 0-.21.146.09.175.31.175.43-.146-.15-.359-.28-.359-.52.088.08.07.24.185.3z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.867 6.58c-.058-.06-.087-.12-.146-.21.147.15.535.25.71.15.058.4-.446.43-.68.15-.087-.12-.203-.12-.203-.28.107.09.204.19.32.19zm.534 0c-.145.06-.387 0-.417 0 .088.09.272.03.36.03-.03.12-.088.18-.301.18.145.09.359-.09.359-.21zm-.155.09c-.058.03-.145.03-.203.03.029.03.203.03.203-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.86 6.67c.029-.03.058-.06.058-.12.087.09.116.28.087.43-.058.09-.242-.03-.271.12-.175-.06-.059-.3-.088-.46 0 .03.03.06.058.06l.03-.28c.067.06.038.19.126.25z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.276 6.94c-.087.03.087.21.03-.15.057.06.174.18.116.27-.059.03-.117 0-.175.06-.146-.09-.146-.21-.175-.33.117.12.088-.09.088-.18.048.09.077.3.116.33z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.208 7.19c.03-.06.088-.09.205-.06-.059.15-.146.34-.205.37-.175-.06-.146-.34-.146-.49 0 .11.127.05.146.18zm-.02.21c.06-.09 0-.15-.028-.18 0 .06 0 .12.029.18z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.83 7.43a.874.874 0 0 1-.176-.34c.088.03.059.09.117.12.03-.03.06-.06.03-.12.059-.03.146 0 .205-.03-.059.03-.03.4-.176.37z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.422 7.74c.03-.15.088-.27.146-.43h.145c-.029.15-.087.61-.359.52-.029-.03-.029-.09-.058-.15-.058.25.117.31.33.09-.03.15-.116.18-.3.21-.292-.25.057-.52.116-.79l.087.12c-.05.12-.108.27-.108.43z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.976 7.7c.058-.06.088-.18.088-.27.029.06.116.09.146.09-.03.18-.088.24-.292.33-.059-.21-.059-.37.117-.55.058.13-.146.25-.059.4z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.898 7.52c-.03.09-.116.33-.058.33.058-.21.087-.3.087-.3.03.03.204-.06.204-.03-.087.27-.087.58-.358.64-.243-.12 0-.73 0-.83l.126.19zm.087.31c-.203.25-.203.21-.233-.03-.067.24.059.4.233.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="m35.984 7.52-.058-.06c.087.03.175 0 .243-.03-.04.06-.127.09-.186.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.285 7.7c-.03.09-.03.21-.03.28.088.06.059-.25.088-.28l.116-.03c-.03.4.028.52-.272.61-.272-.09-.059-.52 0-.67l.097.09zm.116.31c-.27.4-.27-.06-.3-.06-.058.31.243.4.3.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.742 8.23c-.059-.06-.088-.21-.088-.34.088-.06.088-.09.175-.15.087.15 0 .33-.088.49zm0-.13c.03-.06.03-.12 0-.18-.03.09-.068.12 0 .18z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.277 8.07c-.088.15.087.52-.059.64-.03-.12-.146-.28-.146-.43.03 0 .03-.03.059-.06.03.03.03.06.06.21.057-.06 0-.24-.03-.3l.058-.18c-.01.03.117 0 .059.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.685 8.38c-.03-.09 0-.12 0-.21.058.03.058.27.117.4-.175-.09-.273-.37-.302-.55l.088-.06c.097.14.01.17.097.42z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.51 8.23c.03.12 0 .27-.059.4-.174-.12-.174-.37-.145-.55.146-.19.176.05.205.15zm-.088.21c.03-.03.03-.3-.058-.37 0 .13 0 .28.058.37z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.888 8.56c-.204-.18-.058-.4 0-.49.058.13.117.37 0 .49zm-.03-.15c0-.06.06-.12 0-.15 0 .03-.028.12 0 .15z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.044 8.23c0 .09-.03.49.03.58-.147-.15-.293-.37-.293-.58.03-.03.06-.03.089-.03-.001.12.057.21.086.37 0-.09-.116-.33.059-.46 0 .02 0 .09.029.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.675 8.84c-.116-.06-.116-.18-.116-.28.086-.06.115-.12.144-.18.098.21.302.21-.029.46zm.04-.31c-.06.09-.06.15-.03.18.117-.06-.01-.15.03-.18z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.655 8.47c-.059.06 0 .18-.03.21l-.058.21c0-.09-.175-.15-.058-.25.028 0-.001.09.057.12.03-.06-.029-.12-.029-.21l.03-.24c0 .04.058.16.087.16z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.035 8.93c-.059-.09-.117-.18-.117-.31.03-.06.088-.15.088-.25.058.16.272.44.029.56zm.029-.15c0-.06 0-.15-.03-.18.03.05-.028.14.03.18z"
+        fill="#FCD500"
+      />
+      <path d="m35.683 8.68-.029-.15.126.06-.097.09z" fill="#FCD500" />
+      <path
+        d="M35.481 9.17c-.145-.09-.29-.33-.174-.49.058.03.03.12.088.25l-.03-.37c.117.22.088.4.117.61z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.897 9.05c-.029-.09-.174-.18-.174-.27 0 0 .029-.12.029-.09.029.37.087.12.029-.06.176-.07.06.3.117.42z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.975 9.14c-.146-.12-.029-.21-.146-.24.058.12.029.21-.03.27-.117-.03-.087-.18-.146-.27.088-.03.146-.09.205-.18.028.15.232.24.115.42zm-.204-.03c.03-.09.03-.12 0-.18 0 .03-.028.12 0 .18z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.285 9.2c-.146-.12-.243-.3-.146-.3-.06-.03.116.12.116.09.116.12.058.24.261.3-.087.03-.145 0-.32-.03.088.06.272.12.36.03h.145c-.233.12-.36.12-.505.03-.242-.15-.33-.37-.271-.61.029.09.087.12.116.15 0 .07.058.28.243.34z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.208 9.2c-.029 0-.116-.15-.146-.27l.059-.03c.03.06.06.06.088.18.059-.03-.029-.18-.029-.21-.03-.03 0-.06.028-.09 0 .12.156.3 0 .42z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.81 9.23c-.03-.12-.088-.21-.088-.3.116.09.204.3.262.46-.146.09-.262-.25-.388-.34l.058-.27c.03.15.068.36.155.45z"
+        fill="#FCD500"
+      />
+      <path d="m35.51 9.08-.03-.21.089.09-.06.12z" fill="#FCD500" />
+      <path
+        d="M35.685 9.45c-.117-.03-.146-.15-.175-.21 0-.03.058-.06.03-.09.028.06.057.12.086.15 0-.06-.058-.15-.058-.21.088.08.185.2.117.36z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.918 9.51c-.175-.12-.117-.31-.03-.43.089.09.273.24.03.43zm0-.12c.03-.06.03-.12-.03-.18-.028.05-.028.14.03.18z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.48 9.48c-.117-.09-.175-.28-.175-.4.058.09.292.21.175.4z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.277 9.23a.952.952 0 0 1-.146.28c-.028-.03-.028-.31-.058-.34v-.09c.049.06.117.18.205.15z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.547 9.63c-.233.03-.476-.09-.65-.21.058 0 .116.03.116 0 .087.03.204.15.272.12-.117-.06-.204-.15-.272-.18l-.087-.28c.116.31.417.34.62.55z"
+        fill="#FCD500"
+      />
+      <path
+        d="M37.196 9.66c.03.24-.029.33 0 .46l.088.09c-.088 0-.146-.03-.146-.09 0-.15.146-.52-.359-.79.242.02.358.18.417.33z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.887 9.54v.18c.03-.06.058-.12.058-.15.03-.03.088-.09.117-.15.058.25-.058.28-.204.43a1.018 1.018 0 0 1-.204-.33c.059-.03.088-.09.117-.18 0 .11.059.11.117.2z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.751 9.35c.118.03.176.15.176.21a.564.564 0 0 1-.533-.12c.116.03.261.12.358.06-.057-.03-.173-.03-.26-.09.116-.06.145-.06.261-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.16 9.9c-.088-.3-.06-.3.116-.49-.03.06-.03.12 0 .25l.03-.31c.116.09.145.15.116.21 0 .1-.185.25-.263.34z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.48 9.72c.087-.06.116-.18.145-.28.116.06.029.21-.03.31l-.3.24c-.087-.15.175-.33.243-.58.058.01 0 .22-.059.31z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.314 9.84c-.272-.06-.446-.12-.68-.06a.64.64 0 0 0 .117-.33c.06.03.03.15.03.25.059-.03.059-.12.059-.18.057.06.115.09.26.18-.029-.06-.32-.21-.358-.37.155.15.504.3.572.51z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.906 10.12c-.058-.21-.174-.21-.3-.43.116 0 .203.09.271.18 0-.09-.087-.18-.204-.21.35-.15.35.34.233.46z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.994 9.54c.146.21.146.4.088.55s-.146.31-.088.43c-.175-.06-.272-.27-.146-.4.03.15.331-.12.059-.49.087 0 .087-.03.087-.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.692 10c-.058-.03-.262-.06-.359-.15l-.087-.18c.117.03.291.18.36.21-.03-.09-.176-.15-.234-.21.03 0 .146.03.175.03.03.02.204.17.145.3z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.16 10c.058.12.087.28.029.4-.118.12-.302.12-.418 0 .591-.03.203-.7-.272-.49.184-.13.514-.16.66.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.314 10.51c-.117-.15.087-.33-.175-.64.086-.03.174 0 .203.03.117.28.058.43-.03.61z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.276 10.03c-.087.06-.204.25-.262.34.029-.09 0-.34.262-.52 0 .02-.039.15 0 .18z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.636 10.58c-.321-.09-.088-.27-.234-.61.059 0 .117.15.146.21.03-.06-.029-.15-.029-.18.203.15 0 .39.116.58z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.75 10.15c-.028.09 0 .18 0 .27-.203-.03-.028-.27-.145-.4.059.01.117.04.146.13z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.78 10.12c0-.06-.059-.06-.03-.15.098.03.128.09.03.15z"
+        fill="#FCD500"
+      />
+      <path
+        d="M37.441 10.24c-.145.06-.417.09-.32-.12-.01.12.195.15.321.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.538 10.73c-.146-.09-.388.03-.446-.18a.293.293 0 0 1 .058-.3c.01.36.33.3.388.48z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.043 11.62c.088.03.388-.09.3-.25.088.09.146.21.088.37-.028.06-.115.09-.144.03.087-.03.203-.12.087-.31 0 .12.03.18-.087.25-.058-.03-.03.06-.087.06.028.03.028.06-.001.09.028.03.028.06.057.03.029 0 .087.03.116.06.116.03.116.18.146.31.028.18-.147.24-.147.43-.116-.12.03-.43-.204-.43 0 .15 0 .3-.088.43-.058.12-.233.21-.388.12-.058-.09-.146-.21-.243-.15.001-.03.001-.12.06-.15.116-.06.271 0 .33-.18.029-.06.029-.21-.03-.28-.029-.03-.029.06-.087.09-.03.03-.204.06-.272-.12.089.06.147-.06.176-.12 0-.7-.834-.73-.737-1.49.144.78.833.63 1.153 1.21zm-.233.24-.029-.03c.001.21-.144.18-.241.25.144.02.27-.1.27-.22zm.03.92c.203-.03.359-.3.261-.46.001.24-.028.33-.26.43v.03zm.087-1.07c-.175-.34-.534-.46-.767-.73.088.27.738.43.825 1.07.03.18 0 .37-.116.49-.06.03-.147.03-.147.09.117-.03.262-.06.291-.24.058-.26 0-.47-.087-.68zm.262.03c-.03-.09-.06-.03-.118 0 .03 0 .088.06.117 0zm.183.64c.146-.18-.058-.37-.204-.43l-.03.03c.059.03.272.12.204.28-.03-.06-.058-.03-.058-.06-.058-.03-.117-.09-.175-.03.03 0 .03 0 .06.03.048-.03.145.09.203.18z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.422 11.89c-.146-.09.058.31.145.34 0 .03 0 .09.03.15a.337.337 0 0 0-.204.15c0 .09-.059.18 0 .25.029-.03.087-.06.116-.06.145.21-.175.4-.302.37-.029-.03-.058-.06-.058-.03a.484.484 0 0 1-.3-.18c.087-.09.271-.06.3-.25.117-.76-.33-1.34-.33-2.08.04.58.514.85.602 1.34zm-.447-.73h-.029c.088.31.36.61.389.98.029.28 0 .58-.175.73.058.03.087-.03.116-.06.117-.21.146-.52.058-.79 0-.28-.271-.53-.359-.86zm.185 1.86c.204.03.388-.09.359-.21-.098.09-.283.15-.36.21z"
+        fill="#FCD500"
+      />
+      <path
+        d="M37.585 3.4c-.058-.09-.175-.37-.058-.43-.059-.03-.088-.06-.175 0-.156.15.204.49.175.73.058-.09.117-.21.058-.3z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.674 6.15s-.058.15-.03.18c.03.06.03.12.03.12.069-.12.069-.18 0-.3z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.285 2.67h.088v-.06h.087l-.029.06h.118v.06h-.088v.06h-.088v-.06h-.087v-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.314 2.91c0-.03.059-.06.088-.06.058 0 .087.03.087.06 0 .06-.03.09-.088.09-.03 0-.088-.03-.088-.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="m36.81 4.01.028-.03s-.3-.06-.417-.06c-.115 0-.387.03-.416.06-.03 0-.204-.03-.233-.06-.028 0 .06.06-.028.09h1.067z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.159 8.71c-.06-.09-.001-.31-.001-.4l-.089-.06c-.028.24-.057.58.206.7.058-.09-.03-.15 0-.21-.03-.18 0-.37.087-.49-.058.03-.117.03-.146.09-.03.04-.058.22-.058.37z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.695 3.03c-.029 0-.058.03-.058.03 0 .03.03.03.058.03 0 0 .03 0 .03-.03l-.03-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.695 3.15c-.03 0-.03 0-.03.03h.06c0-.03-.03-.03-.03-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.695 3.22c-.03 0-.03.03-.03.03 0 .03 0 .03.03.03 0 0 .03 0 .03-.03l-.03-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.695 3.31c-.03 0-.03 0-.03.03 0 0 0 .03.03.03l.03-.03c0-.03-.03-.03-.03-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.695 3.4h-.03c0 .03 0 .03.03.03 0 0 .03 0 .03-.03h-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.898 3.8c.03 0 .03 0 .03.03 0 0 0 .03-.03.03l-.029-.03c0-.03.028-.03.028-.03zm.126 0 .03.03c0 .03-.03.03-.03.03-.029 0-.029 0-.029-.03 0 0 0-.03.03-.03zm-.242-.03c.029 0 .029.03.029.03 0 .03 0 .03-.028.03 0 0-.03 0-.03-.03l.03-.03zm-.32.03s.029 0 .029.03l-.028.03c-.03 0-.03-.03-.03-.03 0-.03 0-.03.03-.03zm.116-.03.03.03c0 .03-.03.03-.03.03-.03 0-.058 0-.058-.03-.01 0 .03-.03.058-.03zm.117 0 .029.03c0 .03-.03.03-.03.03-.029 0-.058 0-.058-.03 0 0 .03-.03.058-.03zm-.36.03c.03 0 .03 0 .03.03s0 .03-.03.03c0 0-.029 0-.029-.03s.03-.03.03-.03zm-.058 0 .03.09c.174-.06.562-.03.766 0l.03-.09c-.205-.07-.641-.07-.826 0z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.19 3.15c-.057 0-.057.09-.057.15a.16.16 0 0 1 .145-.09c-.029-.02-.029-.06-.087-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.22 3.12c.03-.03.117-.06.146-.06 0 .03 0 .03.03.03-.059.03-.088.03-.088.09-.03-.03-.03-.06-.087-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.191 3.34c.001-.06.06-.09.118-.09.03 0 .059.03.088.06-.059.03-.117.06-.117.09-.03-.06-.06-.09-.089-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.434 3.15c0 .03 0 .09.03.12h-.03c-.03-.03-.06-.06-.088-.06-.01-.02.02-.06.088-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.307 3.43c.029-.03.058-.06.116-.09.03.03.03.06.058.09-.057 0-.086.03-.086.09 0-.06-.03-.09-.087-.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.25 3.43c-.058 0-.058.03-.058.06-.03-.06-.03-.09-.03-.12.059-.03.059.03.088.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.366 3.55c-.087 0-.116.03-.146.09 0-.03 0-.09-.029-.12.001-.03.03-.06.089-.06.057 0 .086.03.086.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.365 3.58c0 .03.03.03.03.06h-.118c0-.03.03-.06.088-.06z"
+        fill="#FCD500"
+      />
+      <path d="M32.512 3.49v.03h-.088c.01-.03.04-.03.088-.03z" fill="#FCD500" />
+      <path
+        d="M33.2 3.15c.059 0 .059.09.059.15a.16.16 0 0 0-.147-.09c.03-.02.03-.06.088-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.17 3.12a.302.302 0 0 0-.145-.06c0 .03 0 .03-.029.03.058.03.087.03.087.09.03-.03.03-.06.088-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.2 3.34c0-.06-.058-.09-.116-.09-.03 0-.059.03-.088.06.059.03.117.06.117.09.03-.06.058-.09.087-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.957 3.15c0 .03 0 .09-.03.12h.03c.03-.03.059-.06.088-.06.01-.02-.02-.06-.088-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.083 3.43c-.03-.03-.058-.06-.117-.09-.029.03-.029.06-.058.09.058 0 .087.03.087.09 0-.06.03-.09.088-.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.143 3.43c.058 0 .058.03.058.06.03-.06.03-.09.03-.12-.058-.03-.058.03-.087.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.025 3.55c.088 0 .117.03.146.09 0-.03 0-.09.03-.12 0-.03-.03-.06-.087-.06-.058 0-.088.03-.088.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.025 3.58c0 .03-.029.03-.029.06h.118c0-.03-.03-.06-.089-.06z"
+        fill="#FCD500"
+      />
+      <path d="M32.87 3.49v.03h.087c0-.03-.03-.03-.088-.03z" fill="#FCD500" />
+      <path d="M32.434 3.09h.146l.058.46-.088-.03-.116-.43z" fill="#FCD500" />
+      <path d="M32.929 3.09h-.118l-.058.43h.087l.089-.43z" fill="#FCD500" />
+      <path
+        d="M32.25 3.73v-.06c.058-.03.146 0 .204 0l-.058-.09.116.03s-.058-.03-.058-.06c0 0 .087.03.116.03v-.03h.058s.03-.06.059-.06c0 0 .029.03.029.06h.116v.03c.03 0 .058-.03.087-.03 0 .03-.059.06-.059.09.06-.03.06-.06.118-.06 0 0-.03.03-.03.09.03 0 .146-.03.175 0l-.029.09a1.63 1.63 0 0 0-.844-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.432 3.03c-.03 0-.06.03-.06.03 0 .03.03.03.06.03 0 0 .03 0 .03-.03l-.03-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.432 3.15c-.03 0-.03 0-.03.03h.06c0-.03-.03-.03-.03-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.432 3.22c-.03 0-.03.03-.03.03 0 .03 0 .03.03.03 0 0 .03 0 .03-.03l-.03-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.432 3.31c-.03 0-.03 0-.03.03 0 0 0 .03.03.03l.03-.03c0-.03-.03-.03-.03-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.432 3.4h-.03c0 .03 0 .03.03.03 0 0 .03 0 .03-.03h-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.635 3.8c.029 0 .029 0 .029.03 0 0 0 .03-.03.03l-.028-.03c0-.03.029-.03.029-.03zm.116 0 .03.03c0 .03-.03.03-.03.03-.028 0-.028 0-.028-.03 0 0 0-.03.03-.03zm-.232-.03c.03 0 .03.03.03.03 0 .03 0 .03-.03.03 0 0-.029 0-.029-.03l.028-.03zm-.359.03c.028 0 .057 0 .057.03 0 0-.029.03-.058.03l-.03-.03c0-.03.03-.03.03-.03zm.125-.03c.03 0 .03.03.03.03 0 .03 0 .03-.03.03 0 0-.029 0-.029-.03l.03-.03zm.117 0c.029 0 .029.03.029.03 0 .03 0 .03-.028.03 0 0-.03 0-.03-.03l.03-.03zm-.33.03c.03 0 .03 0 .03.03s0 .03-.03.03-.03 0-.03-.03 0-.03.03-.03zm-.058 0v.09c.203-.06.591-.03.805 0l.028-.09c-.213-.07-.66-.07-.834 0z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.925 3.15c-.058 0-.058.09-.058.15.03-.06.058-.09.146-.09-.03-.02-.03-.06-.088-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.955 3.12a.22.22 0 0 1 .146-.06v.03c-.028.03-.058.03-.087.09 0-.03-.029-.06-.058-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.896 3.34c.03-.06.088-.09.117-.09.059 0 .088.03.088.06-.058.03-.087.06-.087.09-.03-.06-.058-.09-.117-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.13 3.15c.03.03.03.09.03.12-.03-.03-.058-.06-.088-.06 0-.02.03-.06.06-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.043 3.43c0-.03.058-.06.116-.09 0 .03.028.06.058.09-.059 0-.088.03-.088.09-.029-.06-.029-.09-.087-.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.985 3.43c-.06 0-.06.03-.06.06-.028-.06-.028-.09-.028-.12.058-.03.058.03.088.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.1 3.55c-.087 0-.116.03-.145.09 0-.03-.03-.09-.03-.12 0-.03.03-.06.06-.06.086 0 .086.03.115.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.102 3.58c0 .03.03.03.03.06h-.118c0-.03.03-.06.088-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.217 3.49c.03 0 .03.03.03.03h-.089c0-.03.03-.03.059-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.906 3.15c.058 0 .058.09.058.15-.03-.06-.058-.09-.146-.09.03-.02.03-.06.088-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.876 3.12a.22.22 0 0 0-.146-.06v.03c.03.03.059.03.088.09-.01-.03.029-.06.058-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.935 3.34c-.03-.06-.088-.09-.117-.09-.058 0-.088.03-.088.06.059.03.088.06.088.09.03-.06.058-.09.117-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.694 3.15c-.03.03-.03.09-.06.12h.03c.03-.03.059-.06.088-.06 0-.02-.03-.06-.058-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.78 3.43c0-.03-.058-.06-.116-.09-.03.03-.03.06-.059.09.059 0 .088.03.088.09.029-.06.029-.09.087-.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.848 3.43c.058 0 .058.03.058.06.03-.06.03-.09.03-.12-.06-.03-.06.03-.088.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.723 3.55c.087 0 .116.03.145.09 0-.03 0-.09.03-.12 0-.03-.03-.06-.059-.06-.088 0-.088.03-.117.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.723 3.58c0 .03-.03.03-.03.06h.118c0-.03-.029-.06-.087-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M36.605 3.49c-.029 0-.029.03-.029.03h.088c0-.03-.03-.03-.059-.03z"
+        fill="#FCD500"
+      />
+      <path d="M36.158 3.09h.156l.058.46-.087-.03-.127-.43z" fill="#FCD500" />
+      <path d="M36.663 3.09h-.146l-.058.43h.087l.116-.43z" fill="#FCD500" />
+      <path
+        d="M35.984 3.73v-.06c.059-.03.146 0 .204 0l-.058-.09.116.03c-.029 0-.058-.03-.058-.06l.087.03v-.03h.088s.029-.06.058-.06c0 0 .03.03.03.06h.117v.03c.029 0 .058-.03.087-.03-.03.03-.058.06-.058.09.058-.03.058-.06.116-.06 0 0-.03.03-.03.09.03 0 .146-.03.175 0l-.01.1c-.33-.1-.6-.1-.863-.04z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.559 2.3c-.03 0-.06.03-.06.03 0 .03.03.06.059.06-.001 0 .028-.03.028-.06l-.03-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.559 2.42c-.03 0-.06.03-.06.06 0 0 .03.03.059.03l.028-.03c0-.03-.03-.06-.03-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.559 2.54c-.03 0-.06.03-.06.03 0 .03.03.06.059.06-.001 0 .028-.03.028-.06l-.03-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.559 2.67c-.03 0-.06 0-.06.03 0 0 .03.03.059.03l.028-.03c0-.03-.03-.03-.03-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.559 2.76c-.03 0-.06.03-.06.03 0 .03.03.06.059.06-.001 0 .028-.03.028-.06l-.03-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.86 3.31c.029 0 .058 0 .058.03s-.03.03-.058.03c-.03 0-.059 0-.059-.03.001-.03.03-.03.06-.03zm.145 0c.03 0 .03.03.03.06s0 .03-.03.03-.058 0-.058-.03.03-.06.058-.06zm-.33-.03c.03 0 .058.03.058.06 0 0-.029.03-.058.03l-.029-.03c0-.03.03-.06.03-.06zm-.436.03c.028 0 .028 0 .028.03s0 .03-.03.03c-.028 0-.058 0-.058-.03s.03-.03.059-.03zm.144-.03c.03 0 .03.03.03.03 0 .03 0 .06-.03.06-.029 0-.058-.03-.058-.06 0 0 .03-.03.058-.03zm.175 0 .028.03c0 .03-.03.06-.03.06-.028 0-.057-.03-.057-.06 0 0 .03-.03.059-.03zm-.477.03c.03 0 .059.03.059.03 0 .03-.03.06-.059.06-.029 0-.058-.03-.058-.06 0 0 .03-.03.058-.03zm-.087 0 .03.12c.242-.06.805-.06 1.066 0l.03-.12c-.292-.06-.854-.09-1.126 0z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.878 2.45c-.087 0-.087.12-.058.21.03-.09.088-.12.146-.15 0-.03-.03-.06-.088-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.938 2.42c.029-.03.116-.06.175-.09 0 .03.029.03.029.06-.059 0-.117.03-.117.12-.03-.06-.058-.09-.088-.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.85 2.7c.029-.06.087-.12.175-.12.058 0 .087.03.116.09-.086.03-.145.06-.145.12-.029-.09-.087-.12-.145-.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.179 2.45c.028.06.028.09.057.15-.03.04-.03.04-.058.04-.03-.06-.06-.09-.118-.09.02-.07.059-.1.117-.1z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.053 2.85c0-.09.058-.12.146-.12l.086.09c-.087 0-.146.06-.146.12.01-.06-.02-.09-.087-.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M33.938 2.85c-.06 0-.06.03-.088.06 0-.06 0-.12-.03-.18.088 0 .118.06.118.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.122 2.97c-.117.03-.146.06-.175.15-.03-.06-.03-.12-.058-.15-.001-.06.057-.09.086-.09.078 0 .107.03.146.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.122 3.06s.03.03.03.06h-.146c.02-.06.02-.09.116-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.297 2.91s.03.03.03.06h-.118c0-.06.028-.09.087-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.208 2.45c.088 0 .088.12.088.21-.03-.09-.088-.12-.175-.15.001-.03.04-.06.088-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.16 2.42c0-.03-.117-.06-.176-.09 0 .03 0 .03-.029.06.088 0 .117.03.146.12-.009-.06.02-.09.06-.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.237 2.7c-.03-.06-.087-.12-.146-.12a.16.16 0 0 0-.145.09c.088.03.146.06.146.12.07-.09.098-.12.147-.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.918 2.45c0 .06-.03.09-.03.15 0 .03 0 .03.03.03.029-.06.058-.09.116-.09-.029-.06-.058-.09-.116-.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.063 2.85c-.029-.09-.087-.12-.146-.12-.029.03-.058.06-.116.09.088 0 .147.06.147.12 0-.06.029-.09.117-.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M35.16 2.85c.059 0 .059.03.088.06 0-.06.03-.12.03-.18-.089 0-.089.06-.118.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.975 2.97c.116.03.146.06.175.15.029-.06.029-.12.058-.15 0-.06-.03-.09-.088-.09-.087 0-.116.03-.145.09z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.974 3.06s-.029.03-.029.06h.146c0-.06-.028-.09-.116-.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="M34.8 2.91s0 .03-.028.06h.117c-.001-.06-.03-.09-.09-.06z"
+        fill="#FCD500"
+      />
+      <path d="m34.18 2.33.204.03.088.61-.117-.03-.175-.61z" fill="#FCD500" />
+      <path d="m34.919 2.33-.205.03-.098.58h.127l.175-.61z" fill="#FCD500" />
+      <path
+        d="m33.967 3.25-.03-.1c.088-.03.204-.03.301-.03L34.151 3c.03.03.146.09.176.09-.03-.03-.088-.06-.088-.09l.117.03c.029 0 0-.03 0-.06.029 0 .116.03.145.03-.029-.03.03-.12.03-.12.028.03.058.06.058.09.029.03.116 0 .145 0v.06c.058 0 .087-.03.116-.03 0 .03-.059.06-.059.09.089-.03.089-.06.147-.06 0 0-.03.06-.03.12.03 0 .204-.03.272 0l-.059.12c-.445-.12-.823-.12-1.153-.02z"
+        fill="#FCD500"
+      />
+      <path
+        d="M38.799 10.82c.387 0 .678-.31.678-.67 0-.4-.292-.7-.68-.7-.359 0-.65.31-.65.7 0 .36.301.67.65.67z"
+        fill="#FCD500"
+      />
+      <path
+        d="M38.178 10h.562v-.55h.146V10h.562l.03.18h-1.33l.03-.18zm.591-.52v.55h-.592l-.03.12h1.33v-.12h-.621v-.55h-.088z"
+        fill="#FCD500"
+      />
+      <path
+        d="M37.081 10.3c-.028.09-.028.27.001.27-.115 0-.202 0-.202-.12v.12l-.204-.12c0 .12.087.12.087.25-.057 0 1.068 0 1.486.18.174.12.087.27.533.27 0 0 .116-.06.27-.27.117.06.234-.09.146-.21h-.058s0-.12-.087-.12c.06.06 0 .12 0 .12-.028-.03-.086.06-.057.12l-.204.21c-.118-.03-.176-.25-.321-.31-.06 0-.147.06-.147.06-.33-.09-.863-.25-1.038-.31-.204.01-.116-.05-.204-.14z"
+        fill="#FCD500"
+      />
+      <path
+        d="M28.31 7.77c.387.58.766 1.34 1.183 1.9 0 0 .146-.09.116-.12-.33-.58-.806-1.28-1.243-1.83 0-.02-.058.02-.058.05zm-.03-.07c-.087 0-.145-.03-.145-.12-.03-.06.029-.12.087-.12.058-.03.116.03.146.09 0 .07-.03.12-.088.15z"
+        fill="#FCD500"
+      />
+      <path
+        d="M29.854 10.27c-.03.09.058.21.087.33.03.06.06.15.146.18.03.03.146 0 .146-.06.03-.09-.03-.15-.03-.25-.028-.12 0-.27-.087-.33-.087-.05-.232.04-.261.13z"
+        fill="#FCD500"
+      />
+      <path
+        d="M30.649 11.4c.057.15.203.21.329.31l.028-.03c0-.09-.087-.31-.175-.52-.087-.21-.204-.46-.242-.55-.028 0-.174 0-.174.06 0 .03.388.61.388.61-.039.06-.184.06-.155.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="M30.299 11.43c.028-.03.086 0 .115 0 .03 0 .059-.03.088-.03 0 0 .03.03.03.06s.028.09 0 .09c-.03.03-.089 0-.118 0h-.117c0-.03-.038-.09 0-.12z"
+        fill="#FCD500"
+      />
+      <path
+        d="m29.94 11.16-.03.03c0 .03.03.09.058.09.03.03.117.09.175.09.058.03.146-.03.204-.03.029 0 .087-.03.087-.06.03 0 0-.06 0-.09h-.301c-.048 0-.135-.03-.194-.03z"
+        fill="#FCD500"
+      />
+      <path
+        d="M29.882 10.79c-.03-.03-.087.03-.116.06 0 .03.058.18.058.21.058.06.087 0 .175.03.086.03.173.06.27.06.03 0 .058-.06.058-.09 0-.03 0-.09-.029-.09a.087.087 0 0 0-.117 0c-.03 0-.087.06-.117.06-.029 0-.058-.06-.087-.09-.04-.03-.069-.12-.098-.15z"
+        fill="#FCD500"
+      />
+      <path
+        d="M32.016 10.3a.3.3 0 0 1 .03.27c.086-.03.203-.06.27-.15l-.028.09.174-.09c0 .09-.058.15-.058.18.175.03-.145.15-.388.09-.058.03-.058 0-.262 0a.608.608 0 0 0-.3.09c-.175.06-.389.21-.563.31-.057.03-.116.12-.174.09-.058-.03-.116-.15-.087-.18.057-.06.173 0 .241 0 .03-.03.089-.12.06-.15-.088-.06-.243.09-.33.03-.059-.03-.059-.15-.088-.21-.029 0-.029.03-.058.06l-.087.09c-.058.03-.088-.03-.117-.09-.029-.03-.029-.12 0-.15.03-.06.059-.15.117-.18.058-.03.145-.03.233 0 .087.06.116.27.242.33.117.03.272 0 .417 0 .27-.09.116-.06.387-.18.059 0 .088-.06.175-.09.087 0 .116-.03.116-.03.01-.04.05-.1.078-.13z"
+        fill="#FCD500"
+      />
+      <path
+        d="M29.523 9.72c0 .15.03.33.146.46.057.06.26-.03.26-.12 0-.15-.145-.3-.26-.4-.03-.03-.147 0-.147.06z"
+        fill="#FCD500"
+      />
+      <path
+        d="m27.835 7.47-.3-.14v.01l.261.14c.01-.03.059-.08.059-.09-.01 0-.02.01-.03 0h.01c.01-.01 0-.02 0-.02l-.01-.01c-.01-.01 0-.04.01-.05h-.01c.01 0 .01-.01.02-.01.01-.01.01-.02.01-.03l-.01.01c.01-.02-.01-.04-.03-.05l-.009-.01c.039 0 .02 0 .02.02 0 0 0 .01.01.02.009.01-.01.02-.01.03-.01-.01-.03-.01-.03-.02-.01-.01 0-.02-.02-.02.01.01.01.03.01.05.01.01-.01.02-.01.03h-.009c-.02-.01-.02-.03-.02-.04v.04c-.009.01-.018.01-.018.02l-.011-.01c-.01-.01-.02-.01-.02-.04 0 .02-.02.06-.04.06-.01-.02 0-.04 0-.04-.01.01-.028.03-.038.03-.01-.02 0-.03.01-.04-.01 0-.02.03-.05.02 0-.02.01-.03.01-.04-.019.01-.038.02-.057 0l.029-.03c-.01.01-.059.01-.059-.01.02-.01.04-.02.049-.03-.03.01-.068.01-.078-.01.01-.01.04-.02.049-.03-.01 0-.049.02-.068-.01.01-.02-.01-.02 0-.03-.03 0-.02-.01-.02-.05l.01.01h.097c-.039-.01-.155.01-.175-.03 0-.01-.01-.02 0-.03.029.02.135.01.174.02 0 .01.01.01.01 0 .02.01.039.02.058.02v-.01c.03.01.068.01.087.03.019.01.01.03.01.04s.009.01.009.02c.009 0 .028 0 .038-.01.01 0 .01-.02.01-.03-.02 0-.03 0-.03-.02h.01c.01-.01.03-.01.03-.03-.01.01-.03.02-.04-.01.02 0 .03-.01.03-.02-.01-.04-.03-.05-.059-.06-.01.01-.01.01-.02.01-.01.01-.03.02-.03.03s0 .01.01.01c-.029.01-.01-.02-.01-.03-.01 0-.01.01-.019.01-.008.02-.008.03-.038.04-.01 0-.02 0-.02-.01.03.01.04-.03.069-.05-.009 0-.009.01-.028.01-.01 0-.01.01-.02.02-.01 0-.02-.01-.02-.03 0-.01.01-.02.02-.03 0-.01.01-.01.01-.01h-.01c-.02.01-.029.01-.048.01-.01 0-.02-.01-.02-.02s0-.03-.01-.03c.02.02.01.03.01.04.01.01.02.03.03.03.02.01.01.03.01.04h.01c-.01.01-.01.01-.02 0-.02-.01.01-.03-.01-.03 0 .01-.01.01-.02.02 0 0-.01 0-.01.01v.01c-.009 0-.009-.01-.019-.01-.01-.02.02-.01.02-.02s-.01-.01-.02-.01-.02-.01-.02-.02.01-.02.02-.03.01-.03.02-.04c0-.01.01-.01.02-.01.009 0 .019-.01.028-.01.03.02 0 .06.03.06.01 0 .028 0 .038-.01-.008-.01-.028-.02-.038-.04 0-.01 0-.01.01-.01.01-.01.02-.01.02-.02l-.01-.01s-.01-.01 0-.01v.01l-.01-.01h.01-.02l.01-.01.01-.01v.01h.01l.01.01h-.01c.01 0 .01.01.01.01v.01c.009 0 .009-.01.019-.01h.02c.01.02.01.04.01.06.01-.01.02-.02.02-.04.019 0 .019-.02.019-.03-.011-.01-.04-.03-.05-.05 0-.01 0-.02.01-.03s.029-.01.029-.02h-.01c0-.01-.01-.02-.01-.02l-.01.01-.01-.01.01-.01-.01-.01.01-.01.01-.01v.01l.01-.01.009.02h-.01v.01c.009 0 .019.01.019.02l-.001.01c.008 0 .008-.02.028-.02.01 0 .02 0 .02.01.018.02.018.05.028.07h.039c.01 0 .03 0 .039-.01-.01-.01-.03-.02-.04-.04v-.02c.01-.01.02-.01.02-.02h-.01s-.01-.01 0-.01v-.01l-.01.01-.009-.01h.01l-.01-.01h.01l.01-.01.01.01h-.01c.01 0 .01 0 .01.01v.01c.01 0 .01-.01.028-.01h.01c.01.01.01.04.02.05.01 0 .02-.02.029-.03.01-.03-.04-.03-.04-.06 0-.01.01-.01.01-.02.01-.01.01-.02.02-.02.02-.01.03.01.039 0 .01 0 .02-.01.03-.01s.01.01.01.02v.02c.01 0 .02-.02.029-.01.008.01-.001.01.008.02 0-.01 0-.01-.01-.01l-.01.01c-.009 0-.009.01-.028 0 0 .02.03.01.02.03 0 .01 0 .02-.01.02.01-.01 0-.01 0-.02-.01-.01-.03 0-.03-.03 0-.01-.01-.03-.019-.04-.009 0-.018.01-.038.01 0 .01.01.02.02.03s.01.02.01.03c-.01.01-.02.03-.04.04h.01c.01-.01.03-.01.04-.01.009.01.009.02.009.03-.009-.01-.038.01-.038.03.03-.02.068-.01.068-.04v-.01.03c-.02.04-.049.01-.068.04.01-.01.049-.02.03.01 0-.01-.01-.01-.01-.01-.01 0-.03.01-.04.02s-.01.01-.019.01c-.01.03 0 .06.02.08.01.01.029 0 .029-.01.01.02 0 .03-.01.03.02 0 .039-.01.039-.03.01.01.02.02.01.04.01.01.02.01.03 0l.029-.03c-.001-.01-.001-.02-.01-.02-.02-.01-.03-.01-.03-.03-.01-.03.02-.07.01-.1 0 0 .01 0 .01.01.01-.02.019-.05.01-.07 0 .01.009 0 .009 0 .008-.04.047-.18.038-.22.019-.01.038.01.038.02.02.04-.029.15-.048.2a.48.48 0 0 0 .058-.15c.03 0 .03.04.01.08.01-.01.02 0 .029-.01.01.02.01.04 0 .07.02-.02.01-.01.02-.01.009.03-.01.06-.03.08.02-.01.039-.03.058-.03.01.01-.01.04-.029.06.01-.01.03-.01.04-.02.009.02-.02.04-.03.05.02 0 .03-.01.039 0 .01.01-.03.03-.04.04.01 0 .03 0 .04.01-.01.02-.03.02-.04.03.01 0 .03.01.03.02.01.01 0 .01-.01.01-.029.02-.058 0-.087-.01.049.01.058.01.068.04v.01c-.01 0-.01 0-.02.01-.029-.01-.038-.02-.067-.03 0 .01.058.01.048.05V7c-.01 0-.03.01-.039 0l-.038-.03c0 .01.01.01.019.02.01.01 0 .03 0 .04-.01-.01-.02.01-.039-.01 0 0-.01-.03-.01-.02-.01-.01-.02.01-.029 0v.02c.01.02.01.03.028.04 0 .01 0 0-.01.01.01 0 .02.01.03 0 .01 0 .02-.01.02-.01.009 0 .038 0 .048.01l.01.01c.01.01.01.01.019.01.01 0 .01-.01.01-.01 0 .01-.01.02-.01.03.01 0 .068-.01.077-.02v-.01a.077.077 0 0 1-.038-.04c-.01-.02 0-.04.01-.06.01-.01.028-.02.028-.02.01 0 .04-.01.068.02.01.02.01.04.01.05.01.01 0 .01 0 .01l-.01.01v.03c-.01.01-.038.02-.048.01-.03-.01-.087.04-.117.05-.01.01.01-.02-.038.01-.01 0-.01-.01-.01-.01 0 .01-.03.03-.039.01.02-.01.02-.02.01-.03-.01 0-.01 0-.02.01s-.01.02-.02.03c0 .01 0 .02.01.03s.03-.01.04.01v.01c0-.01-.02 0-.03 0 .02.01.01.01.04.01.009 0 .028.01.038 0 .01-.01.01-.02 0-.02.02-.01.049.01.03.03.009 0 .028.01.038.02v.03c-.01 0-.02-.01-.03-.01.01.01.01.04 0 .04-.009.01.01-.01 0-.01 0 .01 0 .02-.009.03-.01.01-.03.02-.039.02 0 .01 0 .04-.02.04-.009.01-.038 0-.038 0 0 .02-.02.03-.039.03H28c-.01.01-.02.02-.029.02-.009.01-.028-.01-.038-.01 0 .01.01.02 0 .03-.01-.01-.01-.01-.029-.01-.01-.01-.01-.03-.01-.04-.01 0-.01 0-.02-.01 0-.01 0-.02.01-.03 0 .01.01.01.02.01.01-.01.01-.02.02-.03.01-.02.029-.04.029-.06-.01.01-.02.02-.01.03-.01 0-.01-.01-.01-.01-.01-.02.02-.03.01-.04 0-.01-.01-.01-.02-.02-.01 0-.019 0-.029.01-.01 0-.01.01-.01.02s.03.02.03.01c0 .01 0 .01-.01.02s-.02.01-.03.01c-.009.01 0 .01 0 .01-.009.01-.086.1-.115.18-.01-.01-.01-.02-.01-.03-.01.01-.02.03-.03.04.078.02.117-.04.117-.05zm-.087-.62c-.01.01-.01.02-.02.03 0 .01.01.01.01.02.01.02.049.04.087.05.01-.04 0-.06 0-.09 0-.01-.01-.02-.019-.02-.01-.01-.02 0-.03 0-.009 0-.018 0-.028.01z"
+        fill="#FCD500"
+      />
+    </svg>
+  ),
+  HomeBtn: (props: SVGAttributes<SVGElement>) => (
+    <svg
+      viewBox="0 0 48 48"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <g>
+        <path
+          d="M24 0C10.75 0 0 10.74 0 24c0 13.25 10.75 24 24 24 13.26 0 24-10.75 24-24C48 10.74 37.26 0 24 0zm12.8 35.98c0 .63-.51 1.15-1.15 1.15h-6.82a.95.95 0 0 1-.95-.95v-8.72c0-2.25-1.82-4.07-4.07-4.07s-4.07 1.82-4.07 4.07v8.72c0 .52-.42.95-.95.95h-6.85c-.63 0-1.15-.51-1.15-1.15V19.96c0-.66.37-1.26.96-1.56l11.24-5.67c.5-.25 1.08-.25 1.58 0l11.24 5.67c.59.3.96.9.96 1.56v16.02h.03zm2.9-18.36a.952.952 0 0 1-1.27.42l-14.09-7.1c-.4-.2-.88-.2-1.28 0L9.18 18.03a.94.94 0 0 1-1.27-.41.947.947 0 0 1 .41-1.27L22.2 9.26c.94-.48 2.06-.48 3-.01l14.09 7.1c.46.23.65.8.41 1.27z"
+          fill="white"
+        />
+      </g>
+    </svg>
+  ),
+  InfoBtn: (props: SVGAttributes<SVGElement>) => (
+    <svg
+      viewBox="0 0 49 48"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M24.003 0c-.65 0-1.3.03-1.96.08C10.423 1 1.013 10.41.083 22.03c-.51 6.36 1.47 12.25 5.06 16.8.46.59.62 1.38.32 2.06-.7 1.54-1.83 2.75-2.41 3.34-.55.55-1.08 1.04-1.67 1.47-.59.43-.54 1.33.07 1.72.63.4 1.56.57 2.67.57 2.72 0 6.46-1 9.18-1.93.2-.07.4-.1.61-.1.27 0 .55.06.8.17 2.86 1.2 6 1.87 9.29 1.87.65 0 1.32-.03 1.98-.08 11.65-.94 21.08-10.41 21.95-22.07C48.993 11.76 37.873 0 24.003 0zm5.51 37.71c-.03.11-.17.23-.28.27-1.49.5-2.96 1.14-4.5 1.44-1.78.35-3.59.26-5.18-.84-1.33-.92-1.82-2.22-1.74-3.78.09-1.89.7-3.67 1.19-5.47.52-1.91 1.11-3.8 1.46-5.74.48-2.65-.68-3.11-3.07-2.85-.59.06-1.16.3-1.81.48.14-.6.25-1.14.41-1.67.03-.1 3.64-1.61 5.45-1.77 1.91-.17 3.76.02 5.16 1.54.79.85 1.01 1.89.99 3.01-.05 2.47-1.01 4.74-1.61 7.09-.37 1.44-.73 2.88-1.05 4.33-.09.4-.09.84-.05 1.25.08.97.56 1.39 1.55 1.57 1.19.21 2.29-.12 3.5-.53-.15.62-.27 1.15-.41 1.66l-.01.01zm-2.66-22.5c-.2.02-.39.02-.65.04-1.8.02-3.47-1.1-4-2.73-.61-1.87.36-3.81 2.33-4.66 2.26-.98 5.05.21 5.74 2.47.78 2.54-1.21 4.62-3.41 4.88h-.01z"
+        fill="white"
+      />
+    </svg>
+  ),
+  PinchIcon: (props: SVGAttributes<SVGElement>) => (
+    <svg
+      viewBox="0 0 39 48"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <g>
+        <path
+          opacity="0.75"
+          d="M20.073 14.57c0 1.17.5 2.22 1.3 2.95V19.45a5.51 5.51 0 0 1-2.87-4.87c0-3.06 2.49-5.55 5.55-5.55 3.05 0 5.52 2.48 5.51 5.54 0 2.1-1.18 3.93-2.9 4.87V17.52a3.96 3.96 0 0 0 1.32-2.95c0-2.19-1.76-3.96-3.94-3.96a3.97 3.97 0 0 0-3.96 3.97l-.01-.01zm14.12 33.34h-9.5c-.08-.28-.15-.56-.22-.83-.17-.65-.34-1.28-.54-1.9-.13-.4-.37-.8-.64-1.12-1.55-1.79-2.57-3.89-3.5-6.04l-.45-1.05c-.65-1.54-1.31-3.07-2.02-4.58a11.74 11.74 0 0 0-3.48-4.31c-.31-.24-.59-.57-.78-.91-.42-.75 0-1.44.85-1.49.99-.05 1.87.3 2.68.82 1.54.97 2.68 2.35 3.76 3.79.3.4.59.82.88 1.23.22.32.48.5.88.37.39-.13.49-.44.49-.82 0-4.57.02-9.13.04-13.7v-2.83c.02-.46.05-.95.53-1.18.57-.28 1.19-.28 1.75.03.19.1.34.36.4.58.08.28.09.6.09.9v8.52c0 .22.02.52.16.64.18.15.51.27.72.21.2-.06.44-.35.48-.57.17-.9.53-1.18 1.56-1.11.8.05 1.23.51 1.23 1.31v2.44c0 .49.26.77.68.77.41 0 .66-.24.71-.71.09-.79.57-1.17 1.45-1.13.8.04 1.31.51 1.31 1.25v2.56c0 .5.23.78.65.8.42.02.68-.24.74-.73.09-.77.64-1.24 1.42-1.22.78.02 1.34.53 1.34 1.3 0 3.01.01 6.02-.03 9.04-.01 1.18-.54 2.23-1.08 3.26-.13.25-.27.51-.4.76-.45.86-.91 1.72-1.27 2.62-.26.65-.43 1.33-.6 2.04-.08.32-.16.65-.25.99h-.04zm-19.91-16.86a3.94 3.94 0 0 1-3.94-3.96c0-2.19 1.78-3.96 3.96-3.97 1.82 0 3.36 1.24 3.81 2.93a14.1 14.1 0 0 1 1.68 1.58c.02-.18.03-.36.03-.54 0-3.06-2.46-5.54-5.51-5.54-3.05 0-5.54 2.48-5.54 5.55 0 3.06 2.46 5.54 5.51 5.54.56 0 1.1-.08 1.6-.24-.27-.5-.58-.96-.92-1.4-.22.04-.45.06-.68.06v-.01z"
+          fill="white"
+        />
+        <path
+          opacity="0.75"
+          d="M9.564 32.63c-.26-.28-.65-.3-.97-.05-.1.08-.19.18-.28.27l-6.51 6.51c-.11.11-.22.2-.4.36v-.56c0-1.52.02-3.04.02-4.56 0-.52-.24-.81-.67-.82-.45 0-.71.29-.71.84-.02 2.25-.04 4.49-.04 6.73 0 .53.24.79.75.79h6.8c.16 0 .35-.04.49-.13.3-.18.37-.48.26-.8-.11-.34-.39-.48-.74-.48h-4.63c-.14 0-.27-.01-.48-.02.14-.15.23-.26.33-.36l6.51-6.51c.09-.09.19-.18.27-.28.25-.3.24-.68 0-.95v.02z"
+          fill="white"
+        />
+        <path
+          opacity="0.75"
+          d="M28.914 9.53c.26.28.65.3.97.05.1-.08.19-.18.28-.27l6.51-6.51c.11-.11.22-.2.4-.36V3c0 1.52-.02 3.04-.02 4.56 0 .52.24.81.67.82.45 0 .71-.29.71-.84l.03-6.73c0-.53-.24-.79-.75-.79-2.26-.02-4.53-.02-6.79-.02-.16 0-.35.04-.49.13-.3.18-.37.48-.26.8.11.34.39.48.74.48h4.63c.14 0 .27.01.48.02-.14.15-.23.26-.33.36l-6.51 6.51c-.09.09-.19.18-.27.28-.25.3-.24.68 0 .95z"
+          fill="white"
+        />
+      </g>
+    </svg>
+  ),
+  Rf: (props: SVGAttributes<SVGElement>) => (
+    <svg
+      viewBox="0 0 159 133"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <g opacity="0.7">
+        <path
+          d="m17.664 98.39 1.445-.015c-.157.781-.451 1.458-.883 2.03a4.255 4.255 0 0 1-1.618 1.322c-.647.307-1.37.45-2.173.43-.718-.016-1.322-.18-1.812-.493a3.33 3.33 0 0 1-1.14-1.234 5.135 5.135 0 0 1-.54-1.688 6.95 6.95 0 0 1 0-1.86l.164-1.132a8.15 8.15 0 0 1 .562-1.984c.276-.64.633-1.211 1.07-1.711a4.88 4.88 0 0 1 1.563-1.18c.604-.286 1.289-.422 2.054-.406.765.014 1.406.186 1.921.514.517.328.907.776 1.173 1.344.27.568.417 1.219.438 1.953h-1.452a4.32 4.32 0 0 0-.227-1.296 1.907 1.907 0 0 0-.663-.922c-.307-.229-.724-.351-1.25-.367-.573-.015-1.076.091-1.508.32-.428.23-.793.542-1.095.938a5.02 5.02 0 0 0-.726 1.313 7.468 7.468 0 0 0-.392 1.468l-.172 1.157c-.057.412-.078.85-.062 1.313.015.458.09.893.226 1.305a2.3 2.3 0 0 0 .672 1.008c.313.26.735.398 1.266.414.583.02 1.08-.07 1.492-.274a2.688 2.688 0 0 0 1.023-.883c.271-.39.485-.851.641-1.382zm3.008-.476.023-.18a5.943 5.943 0 0 1 .422-1.64c.224-.526.518-.995.883-1.407a3.96 3.96 0 0 1 1.297-.968 3.666 3.666 0 0 1 1.672-.33c.593.01 1.1.139 1.522.383.427.245.77.57 1.031.977.266.4.45.854.555 1.36.104.505.13 1.025.078 1.562l-.015.18a5.87 5.87 0 0 1-.437 1.632c-.224.52-.52.985-.89 1.39a4.01 4.01 0 0 1-1.297.962 3.71 3.71 0 0 1-1.664.32c-.59-.01-1.097-.135-1.524-.375a2.984 2.984 0 0 1-1.023-.968c-.26-.4-.443-.851-.547-1.351a5.27 5.27 0 0 1-.086-1.546zm1.43-.18-.016.188a5.16 5.16 0 0 0-.008 1.023c.037.354.12.683.25.985.135.302.33.55.586.742.255.193.586.294.992.305.432.01.813-.073 1.14-.25.33-.183.608-.428.837-.735.234-.307.42-.648.555-1.023.14-.376.234-.749.28-1.118l.016-.18c.037-.328.037-.67 0-1.024a3.138 3.138 0 0 0-.25-1 1.79 1.79 0 0 0-.578-.757c-.255-.197-.586-.301-.992-.312a2.14 2.14 0 0 0-1.148.258c-.329.182-.607.43-.836.742-.23.313-.414.66-.555 1.04a5.213 5.213 0 0 0-.273 1.116zm9.21-4.187 1.305 3.07 2.297-3.07h1.742l-3.39 4.242 2.062 4.21H33.79l-1.4-3.164L30.009 102H28.28l3.486-4.352-1.993-4.101h1.54zm7.97 1.71-1.735 9.993h-1.422l2.031-11.703h1.297l-.172 1.71zm5.085 2.4-.015.163a7.77 7.77 0 0 1-.375 1.547c-.178.516-.42.987-.727 1.414a3.556 3.556 0 0 1-1.133 1.025c-.443.255-.963.375-1.562.36-.526-.01-.977-.126-1.352-.345a2.676 2.676 0 0 1-.906-.882 3.91 3.91 0 0 1-.492-1.235c-.094-.458-.125-.927-.094-1.406l.11-.867a6.64 6.64 0 0 1 .446-1.493c.213-.49.484-.93.812-1.32a3.53 3.53 0 0 1 1.164-.914c.453-.224.966-.328 1.54-.312.577.016 1.046.157 1.405.423.365.26.641.601.829 1.023.192.417.312.872.36 1.367.046.49.043.974-.009 1.453zm-1.437.156.023-.172c.037-.312.044-.643.024-.992a3.133 3.133 0 0 0-.196-.976 1.7 1.7 0 0 0-.522-.758c-.235-.198-.555-.302-.961-.312a2.21 2.21 0 0 0-.922.164 2.57 2.57 0 0 0-.781.492c-.235.208-.435.45-.602.726-.167.271-.289.558-.367.86l-.336 2.039c-.006.37.075.713.241 1.031.168.313.395.565.68.758.293.193.623.294.993.305.432.01.807-.076 1.125-.258.323-.19.594-.44.813-.751.22-.32.394-.665.524-1.04.13-.38.219-.753.266-1.118zm7.593 2.742.704-4.368a1.73 1.73 0 0 0-.094-.851 1.114 1.114 0 0 0-.477-.57c-.218-.136-.494-.209-.828-.22a2.438 2.438 0 0 0-.86.142c-.275.098-.515.247-.718.445a1.42 1.42 0 0 0-.398.75l-1.407.008c.037-.421.17-.788.399-1.1a2.9 2.9 0 0 1 .86-.79 3.87 3.87 0 0 1 1.109-.469 4.3 4.3 0 0 1 1.156-.147c.566.01 1.059.133 1.475.367.422.23.74.552.953.969.214.415.292.915.235 1.499l-.649 3.936a6.917 6.917 0 0 0-.086.867 3.07 3.07 0 0 0 .102.844l-.016.133-1.43.008a3.118 3.118 0 0 1-.085-.727c.004-.244.022-.486.053-.725zm.868-3.68-.163 1.016-1.336-.007c-.28 0-.577.02-.89.062-.312.042-.61.12-.89.235a1.874 1.874 0 0 0-.712.5c-.192.213-.31.492-.351.836a1.34 1.34 0 0 0 .101.734c.105.203.26.362.47.477.208.114.45.174.726.18.36.004.713-.066 1.062-.212.35-.146.654-.354.914-.625.26-.27.44-.583.54-.937l.515.695c-.1.344-.26.662-.484.953a3.47 3.47 0 0 1-.796.743c-.302.21-.628.37-.977.485-.349.114-.698.17-1.047.164a2.87 2.87 0 0 1-1.289-.32 2.34 2.34 0 0 1-.905-.852c-.219-.37-.312-.8-.281-1.29.03-.535.172-.986.422-1.35.25-.365.57-.657.96-.876a4.48 4.48 0 0 1 1.297-.468 6.723 6.723 0 0 1 1.391-.149l1.727.008zm8.883.336-.203 1.173H55.72l.21-1.172h4.343zm-3.406-3.663L55.398 102h-1.406l1.469-8.453h1.407zm5.18 0L60.578 102h-1.422l1.47-8.453h1.42zm3.094 4.422h1.618l-3.078 4.03h-1.618l3.079-4.031zm1.9-4.43 3.522.007L69.094 102H67.68l1.265-7.281-1.937-.01a2.69 2.69 0 0 0-.906.173 1.904 1.904 0 0 0-.75.484 1.493 1.493 0 0 0-.375.836c-.037.27-.008.503.086.695.098.193.244.342.437.446.198.104.427.161.688.172l2.664.007-.211 1.188-2.476-.007a3.472 3.472 0 0 1-1.055-.187 2.59 2.59 0 0 1-.844-.485 2.08 2.08 0 0 1-.547-.78 2.408 2.408 0 0 1-.15-1.062c.026-.459.144-.855.352-1.188a2.63 2.63 0 0 1 .805-.82c.328-.22.692-.38 1.093-.485a4.828 4.828 0 0 1 1.22-.156zm6.616 4.429h1.617l-3.078 4.03h-1.617l3.078-4.031zm1.899-4.43 3.523.007L77.61 102h-1.415l1.266-7.281-1.937-.01a2.69 2.69 0 0 0-.906.173 1.904 1.904 0 0 0-.75.484 1.495 1.495 0 0 0-.375.836c-.036.27-.008.503.086.695.1.193.245.342.438.446.198.104.427.161.687.172l2.664.007-.21 1.188-2.477-.007a3.472 3.472 0 0 1-1.055-.187 2.59 2.59 0 0 1-.844-.485 2.08 2.08 0 0 1-.546-.78 2.408 2.408 0 0 1-.148-1.062c.026-.459.143-.855.352-1.188a2.63 2.63 0 0 1 .804-.82c.328-.22.693-.38 1.094-.485a4.828 4.828 0 0 1 1.219-.156zm10.172 6.077 4.78-6.07h1.47L90.507 102h-1.421l1.062-6.07-4.78 6.07h-1.454l1.469-8.453h1.398l-1.053 6.07zm10.554 1.36a2.2 2.2 0 0 0 .962-.196c.297-.134.55-.327.758-.577.208-.25.357-.539.445-.867l1.344-.008a2.93 2.93 0 0 1-.665 1.492c-.354.427-.79.76-1.305 1a3.612 3.612 0 0 1-1.601.336c-.595-.01-1.1-.133-1.517-.367a2.855 2.855 0 0 1-.992-.954 3.803 3.803 0 0 1-.515-1.336 5.417 5.417 0 0 1-.062-1.54l.031-.335c.063-.568.2-1.107.414-1.617a4.77 4.77 0 0 1 .852-1.367c.36-.4.784-.713 1.273-.937.49-.224 1.04-.328 1.649-.312.593.01 1.109.152 1.546.423a2.72 2.72 0 0 1 1.016 1.085c.24.459.36.98.36 1.563l-1.329-.007a2.336 2.336 0 0 0-.195-.922 1.614 1.614 0 0 0-.555-.678c-.244-.172-.547-.266-.906-.282-.433-.01-.81.07-1.134.243a2.462 2.462 0 0 0-.812.71 3.835 3.835 0 0 0-.524.993c-.125.364-.21.734-.257 1.11l-.04.327a6.697 6.697 0 0 0-.015 1.024c.026.349.099.674.219.976.12.297.304.54.554.727.251.187.585.286 1.001.297zm9.423-7.43-1.47 8.453h-1.413l1.47-8.453h1.413zm2.75 0-.203 1.172h-6.867l.203-1.173h6.867zm-.062 4.367.024-.18a5.954 5.954 0 0 1 .422-1.64 5.13 5.13 0 0 1 .883-1.407 3.953 3.953 0 0 1 1.296-.968 3.665 3.665 0 0 1 1.672-.33c.593.01 1.1.139 1.523.383.428.245.772.57 1.032.977.266.4.45.854.555 1.36.104.505.13 1.025.078 1.562l-.016.18a5.846 5.846 0 0 1-.438 1.632c-.224.52-.52.985-.89 1.39a4.004 4.004 0 0 1-1.298.962c-.5.23-1.054.336-1.664.32-.588-.01-1.096-.135-1.523-.375a2.99 2.99 0 0 1-1.024-.968c-.26-.4-.442-.851-.546-1.351a5.24 5.24 0 0 1-.086-1.546zm1.43-.18-.015.188a5.13 5.13 0 0 0-.008 1.023c.036.354.12.683.25.985.135.302.33.55.586.742.255.193.586.294.992.305.432.01.813-.073 1.14-.25.33-.183.607-.428.837-.735.234-.307.42-.648.554-1.023a4.94 4.94 0 0 0 .282-1.118l.015-.18a4.73 4.73 0 0 0 0-1.024 3.115 3.115 0 0 0-.25-1 1.792 1.792 0 0 0-.578-.757c-.255-.197-.586-.301-.992-.312a2.144 2.144 0 0 0-1.15.258c-.327.182-.605.43-.835.742-.23.313-.414.66-.554 1.04a5.19 5.19 0 0 0-.274 1.116zm9.65-2.476-1.736 9.992h-1.422l2.032-11.703h1.297l-.17 1.71zm5.085 2.398-.016.164a7.813 7.813 0 0 1-.376 1.547c-.177.516-.42.987-.726 1.414a3.563 3.563 0 0 1-1.133 1.025c-.443.255-.964.375-1.563.36-.526-.01-.976-.126-1.35-.345a2.686 2.686 0 0 1-.908-.882 3.917 3.917 0 0 1-.492-1.235c-.094-.458-.125-.927-.094-1.406l.11-.867c.088-.51.237-1.008.445-1.493.214-.49.485-.93.813-1.32a3.53 3.53 0 0 1 1.164-.914c.453-.224.966-.328 1.54-.312.577.016 1.046.157 1.405.423.365.26.64.601.828 1.023.193.417.313.872.36 1.367.046.49.044.974-.008 1.453zm-1.438.157.024-.172c.037-.312.045-.643.024-.992a3.158 3.158 0 0 0-.195-.976 1.704 1.704 0 0 0-.525-.758c-.234-.198-.554-.302-.96-.312a2.21 2.21 0 0 0-.923.164 2.583 2.583 0 0 0-.78.492c-.235.208-.436.45-.602.726-.167.271-.29.558-.368.86l-.335 2.039a2.108 2.108 0 0 0 .92 1.79c.293.192.624.293.994.304.433.01.808-.076 1.126-.258.323-.19.593-.44.812-.751.22-.32.393-.665.524-1.04.13-.38.218-.753.265-1.118zm4.422 1.804 4.78-6.07h1.47L132.32 102h-1.422l1.063-6.07-4.78 6.07h-1.453l1.468-8.453h1.4l-1.056 6.07zm12.562-2.484-.21 1.18h-4.37l.205-1.18h4.375zm-2.524-3.586-1.47 8.453h-1.405l1.47-8.453h1.405zm1.188 4.383.023-.188c.072-.567.22-1.114.444-1.64.23-.532.53-1.003.9-1.414a4.13 4.13 0 0 1 1.31-.97 3.67 3.67 0 0 1 1.69-.335c.593.015 1.1.146 1.522.39.422.245.76.57 1.016.977.255.406.43.862.523 1.367.1.5.12 1.016.063 1.547l-.024.188a5.525 5.525 0 0 1-.453 1.64 5 5 0 0 1-.905 1.39c-.37.407-.807.727-1.313.962-.5.23-1.057.336-1.67.32-.59-.016-1.095-.143-1.517-.383a2.933 2.933 0 0 1-1.008-.968 3.906 3.906 0 0 1-.53-1.343c-.1-.501-.123-1.014-.07-1.54zm1.453-.188-.025.18c-.036.328-.04.67-.015 1.023.026.35.1.675.226.977.125.302.313.552.563.75.25.193.577.294.983.305.432.015.815-.066 1.15-.243.332-.182.616-.427.85-.734.24-.307.43-.648.57-1.023a4.98 4.98 0 0 0 .297-1.125l.024-.18c.04-.328.047-.67.015-1.024a3.128 3.128 0 0 0-.235-1 1.798 1.798 0 0 0-.57-.757c-.25-.197-.58-.304-.993-.32a2.237 2.237 0 0 0-1.148.258c-.328.182-.61.432-.844.75a4.07 4.07 0 0 0-.562 1.04c-.14.374-.237.75-.29 1.124zm8.608 2.54-.187 1.156a4.086 4.086 0 0 1-.6 1.585 4.76 4.76 0 0 1-1.15 1.25l-.78-.585c.182-.224.348-.454.5-.688.15-.23.278-.47.382-.727.11-.255.193-.523.25-.804l.203-1.19h1.383zM4.29 117.546h1.42l-.67 3.156c-.105.542-.24 1.073-.407 1.594a8.42 8.42 0 0 1-.633 1.47 5.868 5.868 0 0 1-.938 1.264c-.364.38-.804.704-1.32.97H.945l.22-1.172h.28c.308-.297.578-.6.813-.906a6.558 6.558 0 0 0 1.062-2.008c.125-.376.227-.777.305-1.204l.664-3.163zm.35 0h4.946L8.117 126H6.703l1.234-7.117h-3.53l.234-1.336zm-3.796 7.265h8.53l-.64 3.68H7.32L7.758 126H2.047l-.438 2.492H.194l.649-3.68zm14.453-2.53h-2.774l.188-1.157 2.118.008c.292-.005.602-.037.93-.094.333-.058.625-.175.875-.352.25-.178.4-.446.453-.805.031-.25-.003-.45-.102-.602a.88.88 0 0 0-.406-.342 2.25 2.25 0 0 0-.578-.165 4.036 4.036 0 0 0-.594-.046l-1.883-.008-1.265 7.28h-1.406l1.468-8.453 3.102.008a6.11 6.11 0 0 1 1.101.117 3.58 3.58 0 0 1 1.024.36c.307.16.55.387.726.68.183.285.26.65.235 1.093a1.82 1.82 0 0 1-.266.883c-.156.244-.36.447-.61.61-.25.16-.523.288-.82.382a4.764 4.764 0 0 1-.882.18l-.633.42zM14.672 126h-3.344l.899-1.172 2.468.008c.302-.005.6-.047.89-.125.298-.077.55-.213.759-.405.213-.193.344-.46.39-.805.042-.307-.005-.547-.14-.72a1.057 1.057 0 0 0-.547-.366 2.465 2.465 0 0 0-.735-.125l-2.226-.01.219-1.155 2.593.008.422.437c.35.047.664.154.946.32.28.167.5.39.656.665.156.276.226.6.21.976-.02.47-.135.863-.343 1.18-.21.32-.48.574-.813.767a3.85 3.85 0 0 1-1.102.406c-.4.083-.802.122-1.203.117zm6.86-2.383 4.78-6.07h1.47L26.311 126h-1.421l1.063-6.07-4.781 6.07h-1.453l1.468-8.453h1.398l-1.055 6.07zm10.21-1.297-2.281-4.773h1.603l1.515 3.5h1.703l-.428 1.273h-2.11zm.742-.078L29.492 126h-1.875l4.11-4.875.757 1.117zm3.11-4.695L34.124 126h-1.413l1.47-8.453h1.414zm4.828 0-3.938 4.773h-2.18v-1.273h1.579l2.734-3.5h1.805zM37.445 126l-1.765-3.898 1.03-.985L39.126 126h-1.68zm6.43.156c-.578-.01-1.08-.125-1.508-.344a2.98 2.98 0 0 1-1.039-.898 3.74 3.74 0 0 1-.57-1.297 4.76 4.76 0 0 1-.102-1.523l.032-.336a5.596 5.596 0 0 1 .398-1.594c.214-.526.497-1 .852-1.422a4.05 4.05 0 0 1 1.265-1 3.32 3.32 0 0 1 1.625-.35c.589.01 1.078.134 1.469.374.39.24.695.557.914.953.225.39.37.83.438 1.32.068.483.073.98.016 1.49l-.086.65h-6.133l.188-1.18 4.68.008.023-.125a2.708 2.708 0 0 0-.063-1.086 1.72 1.72 0 0 0-.515-.86c-.245-.23-.576-.348-.992-.36-.433-.015-.808.074-1.125.267a2.42 2.42 0 0 0-.796.765 4.247 4.247 0 0 0-.508 1.046 6.29 6.29 0 0 0-.25 1.102l-.031.328c-.032.333-.021.67.03 1.008.053.338.152.648.298.93.15.275.36.502.625.68.265.17.594.262.984.273.474.01.899-.092 1.274-.305.38-.22.726-.495 1.039-.828l.804.687a3.622 3.622 0 0 1-1.985 1.454c-.4.12-.818.177-1.25.172zm9.672-2.086 3.922-6.523h1.428L53.781 126h-.983l-2.172-8.453h1.29l1.632 6.523zm-2.008-6.523L50.07 126h-1.406l1.469-8.453h1.406zM56.382 126l1.469-8.453h1.421L57.805 126h-1.422zm7.187-1.023a2.2 2.2 0 0 0 .961-.196c.298-.134.55-.327.76-.577.207-.25.356-.54.444-.867l1.344-.008a2.93 2.93 0 0 1-.664 1.492c-.354.427-.79.76-1.305 1a3.612 3.612 0 0 1-1.602.336c-.594-.01-1.1-.133-1.516-.367a2.854 2.854 0 0 1-.992-.954 3.8 3.8 0 0 1-.516-1.336 5.413 5.413 0 0 1-.062-1.54l.031-.335c.063-.568.2-1.107.414-1.617.214-.516.498-.972.852-1.367.358-.4.783-.713 1.272-.937.49-.224 1.04-.328 1.649-.312.594.01 1.11.152 1.548.422.437.266.775.628 1.015 1.086.24.46.36.98.36 1.563l-1.329-.007a2.336 2.336 0 0 0-.195-.922 1.61 1.61 0 0 0-.556-.678c-.244-.172-.547-.266-.906-.282-.432-.01-.81.07-1.133.242-.317.172-.588.41-.812.71a3.838 3.838 0 0 0-.524.994c-.126.364-.212.734-.258 1.11l-.04.327a6.676 6.676 0 0 0-.015 1.024c.026.35.099.674.219.976.12.297.304.54.554.727.25.187.584.286 1 .297zm6.922-3.008h1.617L69.03 126h-1.616l3.078-4.03zm1.899-4.43 3.524.007L74.445 126h-1.414l1.267-7.28-1.938-.01a2.67 2.67 0 0 0-.907.173 1.9 1.9 0 0 0-.75.484c-.203.22-.328.498-.375.836-.036.27-.008.503.086.695.1.193.245.342.438.446.198.104.427.16.687.172l2.663.007-.21 1.188-2.477-.007a3.478 3.478 0 0 1-1.055-.187 2.588 2.588 0 0 1-.843-.485 2.078 2.078 0 0 1-.547-.78 2.405 2.405 0 0 1-.148-1.062c.026-.46.143-.855.351-1.188.209-.333.477-.607.805-.82.328-.22.693-.38 1.094-.485.4-.104.807-.156 1.219-.156zm12.813 4.74H82.43l.187-1.155 2.117.008a6.06 6.06 0 0 0 .93-.094c.333-.058.625-.175.875-.352.25-.178.4-.446.452-.805.031-.25-.002-.45-.101-.602a.88.88 0 0 0-.406-.342 2.25 2.25 0 0 0-.578-.165 4.035 4.035 0 0 0-.593-.046l-1.883-.008-1.266 7.28h-1.406l1.469-8.453 3.101.008a6.11 6.11 0 0 1 1.102.117c.375.073.716.193 1.023.36.307.16.55.387.727.68.182.285.26.65.234 1.093a1.82 1.82 0 0 1-.266.883c-.156.244-.359.447-.609.61-.25.16-.524.288-.821.382a4.765 4.765 0 0 1-.884.18l-.633.42zm-.625 3.72h-3.344l.899-1.172 2.469.008a3.67 3.67 0 0 0 .89-.125c.297-.077.55-.213.758-.405.214-.193.344-.46.39-.805.042-.307-.005-.547-.14-.72a1.056 1.056 0 0 0-.547-.366 2.464 2.464 0 0 0-.734-.125l-2.228-.01.219-1.155 2.595.008.422.437c.349.047.664.154.945.32.281.167.5.39.656.665.156.276.227.6.211.976-.022.47-.136.863-.345 1.18-.208.32-.479.574-.812.767-.334.187-.7.322-1.102.406-.4.083-.8.122-1.202.117zm16.07-12.133 1.133-.008c-.04.463-.145.843-.31 1.14a1.96 1.96 0 0 1-.65.703 3.378 3.378 0 0 1-.922.406c-.343.098-.718.187-1.125.265-.65.125-1.198.336-1.64.633a3.84 3.84 0 0 0-1.078 1.094c-.276.427-.49.908-.64 1.445-.152.53-.261 1.1-.33 1.71l-.1.72H93.82l.102-.72a12.98 12.98 0 0 1 .46-2.03 7.94 7.94 0 0 1 .845-1.86 5.19 5.19 0 0 1 1.343-1.437c.542-.396 1.19-.662 1.946-.797.28-.052.573-.112.875-.18.303-.068.568-.182.798-.344.234-.162.388-.41.46-.743zm-2.398 4.164c.536.012.997.124 1.383.337.385.214.698.5.937.86.245.354.417.757.516 1.21.1.448.128.917.086 1.407l-.024.172a5.223 5.223 0 0 1-.42 1.6c-.22.5-.51.946-.869 1.337-.36.386-.785.688-1.274.906-.49.218-1.031.32-1.625.304-.577-.01-1.075-.13-1.491-.36a2.885 2.885 0 0 1-1.017-.92 3.887 3.887 0 0 1-.555-1.314 4.88 4.88 0 0 1-.078-1.515l.016-.18c.02-.15.062-.292.125-.422.069-.135.142-.265.22-.39.083-.13.159-.26.226-.39.26-.485.578-.93.953-1.337a4.41 4.41 0 0 1 1.288-.96 3.42 3.42 0 0 1 1.602-.345zm-.328 1.173c-.516-.01-.964.11-1.344.36a2.684 2.684 0 0 0-.898.984c-.224.41-.368.854-.43 1.328l-.016.172a4.58 4.58 0 0 0 0 1c.037.338.118.654.243.945.13.287.32.52.57.703.25.183.575.28.976.29.417.01.784-.068 1.102-.235.318-.172.586-.4.805-.688.224-.29.4-.614.53-.968.136-.354.228-.714.274-1.078l.016-.172a3.824 3.824 0 0 0-.023-.946 2.35 2.35 0 0 0-.29-.843c-.14-.25-.335-.45-.585-.602-.25-.156-.56-.24-.93-.25zm6.578 5.836 3.562-7.493h1.563l-4.96 9.765c-.13.277-.285.542-.462.797-.172.255-.37.484-.594.687a2.355 2.355 0 0 1-1.656.648c-.142-.005-.282-.02-.423-.047a7.854 7.854 0 0 1-.42-.086l.085-1.187c.063.01.125.018.188.023.062.01.122.02.18.024.348.01.648-.04.898-.15.256-.108.475-.27.657-.483a3.45 3.45 0 0 0 .5-.767l.883-1.734zm-.39-7.493 1.007 6.64.094 1.493-1.054.515-1.53-8.648h1.483zm7.773 0h1.422l-.672 3.156c-.104.542-.24 1.073-.406 1.594a8.463 8.463 0 0 1-.633 1.47 5.856 5.856 0 0 1-.938 1.264c-.364.38-.804.704-1.32.97h-.797l.218-1.172h.28c.308-.297.58-.6.814-.906a6.583 6.583 0 0 0 1.062-2.008c.124-.376.226-.777.304-1.204l.663-3.163zm.35 0h4.947L115.71 126h-1.413l1.234-7.117H112l.234-1.336zm-3.795 7.265h8.53l-.64 3.68h-1.414l.438-2.492h-5.71l-.44 2.492h-1.413l.648-3.68zm12.343.227 3.564-7.493h1.562l-4.96 9.765c-.13.277-.285.542-.462.797a3.73 3.73 0 0 1-.593.687c-.218.203-.466.362-.742.476a2.35 2.35 0 0 1-.914.172 2.9 2.9 0 0 1-.422-.047 7.814 7.814 0 0 1-.42-.086l.085-1.187c.062.01.125.018.187.023.063.01.122.02.18.024.35.01.648-.04.898-.15.255-.108.474-.27.656-.483.188-.214.355-.47.5-.767l.883-1.734zm-.39-7.493 1.008 6.64.094 1.493-1.054.515-1.532-8.648h1.485zm16.89 7.265-.78 3.696h-1.266l.438-2.508h-1.07l.21-1.188h2.47zm-10.116-7.265h1.414l-1.266 7.265h2.993l1.265-7.265h1.414l-1.257 7.265h2.984l1.26-7.265h1.413l-1.47 8.453h-10.218l1.47-8.453zm15.008 8.61c-.578-.01-1.08-.126-1.508-.345a2.98 2.98 0 0 1-1.04-.898 3.72 3.72 0 0 1-.57-1.297 4.743 4.743 0 0 1-.1-1.523l.03-.336a5.577 5.577 0 0 1 .4-1.594c.212-.526.496-1 .85-1.422.36-.422.782-.755 1.266-1a3.32 3.32 0 0 1 1.625-.35c.59.01 1.078.134 1.47.374.39.24.694.557.913.953.224.39.37.83.437 1.32.068.483.073.98.016 1.49l-.085.65h-6.133l.188-1.18 4.68.008.023-.125c.052-.375.03-.737-.063-1.086a1.713 1.713 0 0 0-.515-.86c-.245-.23-.576-.348-.993-.36-.432-.015-.807.074-1.124.267a2.413 2.413 0 0 0-.797.765 4.233 4.233 0 0 0-.507 1.046 6.28 6.28 0 0 0-.25 1.102l-.03.328c-.033.333-.022.67.03 1.008s.15.648.297.93c.15.275.36.502.625.68.265.17.593.262.984.273.473.01.898-.092 1.272-.305.38-.22.727-.495 1.04-.828l.804.687a3.617 3.617 0 0 1-1.984 1.454c-.4.12-.818.177-1.25.172zm8.234 0c-.578-.01-1.08-.126-1.508-.345a2.99 2.99 0 0 1-1.04-.898 3.758 3.758 0 0 1-.57-1.297 4.743 4.743 0 0 1-.1-1.523l.03-.336a5.608 5.608 0 0 1 .4-1.594c.213-.526.497-1 .85-1.422.36-.422.782-.755 1.266-1a3.32 3.32 0 0 1 1.625-.35c.588.01 1.078.134 1.468.374.39.24.695.557.914.953.224.39.37.83.438 1.32.067.483.073.98.015 1.49l-.086.65h-6.133l.187-1.18 4.68.008.023-.125c.052-.375.03-.737-.062-1.086a1.722 1.722 0 0 0-.516-.86c-.246-.23-.576-.348-.993-.36-.432-.015-.807.074-1.125.267a2.423 2.423 0 0 0-.797.765 4.233 4.233 0 0 0-.508 1.046 6.28 6.28 0 0 0-.25 1.102l-.03.328c-.032.333-.022.67.03 1.008s.15.648.297.93c.15.275.36.502.625.68.265.17.593.262.983.273.474.01.9-.092 1.274-.305.38-.22.726-.495 1.04-.828l.804.687a3.634 3.634 0 0 1-1.984 1.454c-.4.12-.817.177-1.25.172zm4.82-.9a.9.9 0 0 1 .243-.64.867.867 0 0 1 .632-.265.817.817 0 0 1 .867.86.865.865 0 0 1-.875.89.852.852 0 0 1-.626-.227.78.78 0 0 1-.243-.617z"
+          fill="white"
+        />
+        <g>
+          <path
+            d="M93.606 8.155v-1.09H89.15v13.857h4.507v-1.089H90.37v-5.402h2.947v-1.105h-2.948v-5.17h3.236z"
+            fill="white"
+          />
+          <path
+            d="M95.56 20.922h3.14c.723 0 1.326-.234 1.8-.704.48-.47.716-1.07.716-1.802V9.57c0-.731-.237-1.333-.71-1.803-.473-.47-1.076-.704-1.807-.704h-3.14v13.859zM96.78 8.155h1.693c.45 0 .817.14 1.1.42.282.28.424.649.424 1.104v8.614c0 .477-.147.855-.444 1.128-.294.275-.68.411-1.153.411h-1.624V8.155h.003z"
+            fill="white"
+          />
+          <path
+            d="M107.867 19.833h-3.29v-5.402h2.947v-1.105h-2.946v-5.17h3.235v-1.09h-4.456v13.857h4.51v-1.089z"
+            fill="white"
+          />
+          <path
+            d="M110.99 8.155h3.13v5.1h-2.176l-.166.248 2.552 7.42h1.28c-.783-2.22-1.57-4.434-2.358-6.643.075 0 .198.005.37.012.168.01.298.012.385.012.888 0 1.334-.333 1.334-1v-5.26a.968.968 0 0 0-.27-.708.947.947 0 0 0-.704-.275h-4.595v13.857h1.22V8.155z"
+            fill="white"
+          />
+          <path
+            d="M118.55 17.84h2.728l.483 3.082h1.212l-2.43-13.893h-1.2l-2.447 13.855v.037h1.174l.482-3.081h-.002zm1.367-8.597 1.202 7.51h-2.414l1.21-7.51z"
+            fill="white"
+          />
+          <path
+            d="M126.004 20.922h1.22V8.155h2.122v-1.09h-5.482v1.09h2.14v12.767z"
+            fill="white"
+          />
+          <path d="M132.062 7.066h-1.218v13.856h1.218V7.066z" fill="white" />
+          <path
+            d="M135.327 20.922h3.84c.288 0 .522-.093.708-.275a.96.96 0 0 0 .277-.709V8.048c0-.29-.09-.527-.277-.71a.96.96 0 0 0-.707-.275h-3.84a.946.946 0 0 0-.703.276c-.18.181-.272.418-.272.707v11.891c0 .29.09.526.272.709.18.183.415.275.702.275zm.246-12.767h3.36v11.678h-3.36V8.155z"
+            fill="white"
+          />
+          <path
+            d="M146.852 7.066v10.013l-3.595-10.014h-.914v13.856h1.15v-10.19l3.665 10.19H148V7.066h-1.148z"
+            fill="white"
+          />
+          <path
+            d="M93.814 39.357h-2.58V28.083H89.32v11.754c0 .79.388 1.181 1.162 1.181h4.07c.787 0 1.18-.394 1.18-1.18V28.082h-1.916v11.274h-.002z"
+            fill="white"
+          />
+          <path
+            d="M96.704 29.795h2.113v11.223h1.906V29.795h2.114v-1.712h-6.133v1.712z"
+            fill="white"
+          />
+          <path
+            d="M108.306 39.357h-2.58V28.083h-1.914v11.754c0 .79.388 1.181 1.162 1.181h4.07c.787 0 1.18-.394 1.18-1.18V28.082h-1.915v11.274h-.004z"
+            fill="white"
+          />
+          <path
+            d="M117.452 35.034c.364-.16.548-.511.548-1.057v-4.703c0-.794-.384-1.191-1.156-1.191h-5.083v12.935h1.916V29.744h2.415v4.1h-1.883v1.166l2.113 6.008h1.998l-2.113-5.86c.632 0 1.047-.041 1.245-.124h.002z"
+            fill="white"
+          />
+          <path
+            d="M121.406 35.248h2.88V33.57h-2.88v-3.775h3.348v-1.712h-5.264v12.935h5.313v-1.71h-3.397v-4.06z"
+            fill="white"
+          />
+          <path
+            d="M86.948 5.76h10.135V2.311H83.088v19.966H35.33c1.69-.545 3.125-1.344 4.295-2.401 1.89-1.644 2.835-3.685 2.835-6.123 0-2.438-1.035-4.463-3.105-5.895-1.708-1.188-4.275-1.904-7.706-2.148 1.295-2.117 2.824-3.83 4.585-5.14l-.472-.57c-.59.38-1.154.755-1.696 1.12-1.327.867-2.985 2.4-4.975 4.592-2.804.182-5.252.762-7.346 1.736-2.353 1.082-4.251 2.718-5.697 4.913-1.508 2.3-2.261 4.685-2.261 7.152-.001 3.152 1.181 5.977 3.55 8.476 1.327 1.081 2.381 1.858 3.166 2.33l-2.148 9.824h-5.131l-.227.845h14.673l.227-.845h-5.267l1.65-7.95a85.49 85.49 0 0 1 3.212.662l.135-.755a46.5 46.5 0 0 1-3.141-.892L26 23.813h3.403c.044.012.087.024.128.04.742.257 1.388 1.149 1.948 2.673.5 1.372.883 2.448 1.155 3.225l3.894 11.341c.59 1.723 1.238 3.065 1.947 4.025 1.887 2.592 4.423 3.887 7.607 3.887.71 0 1.36-.06 1.948-.185 1.51-.385 3.146-1.28 4.915-2.694l-.543-.548c-1.585 1.218-3.074 1.827-4.464 1.827-2.19 0-4.077-1.31-5.664-3.928-.468-.763-.93-1.844-1.383-3.245l-4.191-12.337c-.455-1.354-.839-2.292-1.157-2.81a6.854 6.854 0 0 0-.994-1.272h48.54v17.201h3.86V25.916h6.803a2.53 2.53 0 0 0 2.485-2.104h51.622v-1.536H86.95V5.76h-.002zm-64.7 15.941-1.562 7.676c-1.266-.745-2.193-1.417-2.779-2.01-2.154-2.087-3.233-4.705-3.233-7.857 0-.351.03-.739.092-1.165.21-1.371.536-2.574.972-3.61 1.19-2.954 3.36-5.153 6.512-6.602a17.555 17.555 0 0 1 6.217-1.576c-2.91 4.05-4.982 9.1-6.217 15.144h-.003zm9.674.299c-.321.1-.698.194-1.122.276h-4.456l1.148-5.438c.181-.928.415-1.866.702-2.811.888-3.108 1.892-5.597 3.006-7.47 1.072.153 2.013.365 2.826.64 2.59 1.006 3.889 3.162 3.889 6.464 0 2.469-.792 4.495-2.374 6.078-1.085 1.096-2.291 1.851-3.616 2.263L31.922 22z"
+            fill="white"
+          />
+          <path
+            d="M46.923 36.646h.603c.645 0 1.313-.097 2.005-.29.89-.245 1.603-.66 2.144-1.246.593-.639.887-1.398.887-2.283.001-.723-.25-1.295-.75-1.714-.498-.427-1.111-.638-1.835-.638-.85 0-1.653.246-2.408.738-.94.61-1.7 1.476-2.28 2.591-.578 1.116-.868 2.253-.868 3.408-.001 1.088.296 1.97.89 2.64.593.665 1.423.996 2.49.996.954 0 1.74-.22 2.36-.658.488-.326 1.062-.95 1.72-1.873l-.276-.16c-.54.745-1.009 1.27-1.404 1.585-.594.478-1.248.719-1.96.719-.711 0-1.298-.326-1.662-.976-.285-.53-.424-1.213-.424-2.044 0-.285.019-.565.06-.837.27.026.507.039.712.039l-.003.005zm.724-3.877c.772-1.27 1.672-1.906 2.7-1.906.506 0 .902.166 1.187.5.282.326.424.755.424 1.286 0 1.096-.504 2-1.513 2.71a5.292 5.292 0 0 1-3.095.958c-.448 0-.813-.02-1.097-.061.335-1.35.8-2.511 1.394-3.488z"
+            fill="white"
+          />
+          <path
+            d="M57.517 28.443h-1.619l-.613 2.891h-1.49l-.08.368h1.49l-1.312 6.262a4.477 4.477 0 0 0-.099.86v.06c0 .546.162 1 .483 1.355.323.355.753.532 1.293.532.705 0 1.204-.246 1.5-.74.27-.44.524-1.123.76-2.048l-.296-.061c-.422 1.507-.902 2.26-1.44 2.26-.48 0-.722-.326-.722-.977 0-.258.027-.519.08-.777l1.411-6.73h1.906l.079-.368h-1.907l.572-2.891.002.003z"
+            fill="white"
+          />
+          <path
+            d="M67.28 30.706a1.31 1.31 0 0 0-.907-.348c-1.428 0-2.953 1.96-4.572 5.88l1.256-5.802-3.723.557.039.339 1.864-.258-1.944 9.409h1.619l.326-1.286c.27-1.062.514-1.907.731-2.531.671-2.039 1.554-3.663 2.647-4.874.282-.33.47-.5.562-.5.073 0 .109.072.109.21 0 .34.11.631.33.877.22.245.5.367.835.367.335 0 .606-.117.85-.348a1.08 1.08 0 0 0 .344-.82c0-.353-.123-.645-.364-.876v.002z"
+            fill="white"
+          />
+          <path
+            d="M72.933 30.438h-.128a4.698 4.698 0 0 0-2.244.6c-.954.545-1.714 1.334-2.281 2.367a6.648 6.648 0 0 0-.85 3.244c0 1.88.752 3.15 2.26 3.816.594.258 1.24.39 1.945.39 1.25 0 2.34-.39 3.266-1.167.896-.732 1.53-1.733 1.907-3.002.217-.719.326-1.371.326-1.963 0-1.276-.398-2.316-1.194-3.12-.77-.777-1.772-1.167-3.007-1.167zm2.323 4.535c-.232 1.308-.528 2.355-.89 3.14-.376.804-.731 1.376-1.07 1.715-.474.477-1.07.718-1.79.718-.718 0-1.343-.3-1.78-.896-.388-.531-.583-1.194-.583-1.983 0-.173.012-.363.038-.567.134-1.308.47-2.636 1.01-3.978.632-1.568 1.6-2.353 2.897-2.353.434 0 .835.102 1.197.309.712.43 1.069 1.307 1.069 2.63 0 .425-.034.847-.1 1.266l.003-.003z"
+            fill="white"
+          />
+          <path
+            d="M46.151 16.416c-.276 1.116-.414 1.86-.414 2.236 0 .41.135.728.406.96.258.236.598.353 1.015.353.456 0 .833-.144 1.132-.431.527-.514 1.02-1.313 1.475-2.395l-.267 1.468a2.18 2.18 0 0 0-.034.358c0 .11.012.217.034.31.106.49.427.733.962.733.365-.001.652-.174.864-.52.135-.222.256-.565.367-1.033l-.175-.044c-.107.37-.191.624-.251.76-.145.331-.324.5-.536.5-.212 0-.338-.117-.367-.349a2.616 2.616 0 0 1 .031-.714l.87-4.164h-.94c-.072.38-.147.73-.224 1.054a10.26 10.26 0 0 1-1.373 3.293c-.37.556-.784.833-1.247.833-.55 0-.825-.324-.825-.972 0-.287.042-.61.121-.971l.407-1.708c.164-.682.28-1.26.345-1.734l-1.901.31-.043.21.94-.144a25.972 25.972 0 0 1-.366 1.8z"
+            fill="white"
+          />
+          <path
+            d="M53.95 20.009c1.077-.001 1.774-.36 2.095-1.078.094-.217.142-.419.142-.606 0-.366-.123-.677-.367-.938-.17-.173-.456-.37-.851-.59a8.582 8.582 0 0 0-.503-.258c-.463-.202-.695-.533-.695-.993 0-.34.135-.612.406-.816.243-.18.54-.27.89-.27.263 0 .526.064.786.193.3.158.45.338.45.54-.165-.102-.295-.153-.394-.153a.503.503 0 0 0-.394.178.68.68 0 0 0-.152.43c0 .16.051.29.153.398.106.114.236.17.393.17.42 0 .63-.236.63-.71 0-.325-.138-.6-.416-.829-.35-.287-.784-.43-1.3-.43-.3 0-.57.045-.815.138-.742.273-1.111.762-1.111 1.469-.001.302.083.557.255.767.128.16.34.334.639.524.135.08.232.14.29.178.262.158.523.32.786.485a.975.975 0 0 1 .398.806v.022c0 .36-.16.658-.48.894a1.704 1.704 0 0 1-.994.303c-.726 0-1.173-.326-1.344-.981.164.143.32.214.47.214a.56.56 0 0 0 .428-.183.61.61 0 0 0 .159-.43.622.622 0 0 0-.17-.441.603.603 0 0 0-.436-.176.545.545 0 0 0-.479.248.952.952 0 0 0-.18.575c0 .257.085.499.256.723.314.424.8.635 1.46.635l-.005-.01z"
+            fill="white"
+          />
+          <path
+            d="M58.841 20.009c1.077-.001 1.775-.36 2.096-1.078.094-.217.142-.419.142-.606 0-.366-.123-.677-.367-.938-.17-.173-.455-.37-.85-.59a8.62 8.62 0 0 0-.502-.258c-.464-.202-.695-.533-.695-.993 0-.34.135-.612.405-.816.244-.18.54-.27.89-.27.263 0 .526.064.787.193.3.158.449.338.449.54-.164-.102-.295-.153-.394-.153a.503.503 0 0 0-.393.178.68.68 0 0 0-.152.43c0 .16.05.29.152.398.106.114.237.17.393.17.42 0 .63-.236.63-.71 0-.325-.138-.6-.415-.829-.35-.287-.784-.43-1.3-.43-.3 0-.57.045-.816.138-.741.273-1.11.762-1.11 1.469 0 .302.084.557.255.767.128.16.34.334.64.524.135.08.231.14.29.178.262.158.523.32.786.485a.975.975 0 0 1 .399.806v.022c-.001.36-.16.658-.481.894a1.704 1.704 0 0 1-.995.303c-.727 0-1.173-.326-1.344-.981.165.143.322.214.471.214a.56.56 0 0 0 .428-.183.61.61 0 0 0 .16-.43.62.62 0 0 0-.17-.441.603.603 0 0 0-.436-.176.545.545 0 0 0-.48.248.953.953 0 0 0-.181.575c0 .257.085.499.257.723.313.424.8.635 1.46.635l-.006-.01z"
+            fill="white"
+          />
+          <path
+            d="M64.291 12.84a.577.577 0 0 0 .428-.172.596.596 0 0 0 .17-.434.598.598 0 0 0-.17-.43.634.634 0 0 0-.864 0 .575.575 0 0 0-.189.43c0 .166.063.317.19.431.121.117.266.178.437.178v-.002z"
+            fill="white"
+          />
+          <path
+            d="M63.428 14.597a7.9 7.9 0 0 1-.324 1.412c-.142.418-.285.9-.427 1.446-.186.714-.277 1.213-.277 1.5 0 .31.084.558.255.746.165.192.396.287.695.287.365 0 .659-.169.886-.507.135-.208.272-.546.415-1.02l-.18-.045c-.242.845-.517 1.27-.83 1.27-.251 0-.376-.174-.376-.52 0-.073.012-.163.033-.27a8.77 8.77 0 0 1 .203-.894l.388-1.5.181-.745c.057-.252.115-.498.168-.747l.152-.728-2.043.31.021.165 1.062-.166-.002.003z"
+            fill="white"
+          />
+          <path
+            d="M66.779 19.987c.341 0 .648-.095.918-.288.343-.24.651-.593.929-1.06.135-.217.347-.65.64-1.303l-.257 1.203c-.048.21-.07.368-.07.475 0 .29.095.53.285.723a.91.91 0 0 0 .705.293c.378 0 .675-.165.89-.496.142-.215.272-.553.393-1.02l-.18-.057c-.237.853-.52 1.281-.848 1.281-.255 0-.383-.17-.383-.514 0-.036.007-.102.021-.2.172-.89.31-1.56.415-2.014l.558-2.52a1.647 1.647 0 0 0-.345-.11 4.65 4.65 0 0 0-1.01-.117c-.459 0-.98.088-1.563.258-.727.223-1.342.673-1.848 1.358-.508.694-.761 1.425-.761 2.185-.001.238.032.47.098.694.24.816.711 1.225 1.41 1.225v.005zm-.226-3.266c.208-.51.493-.957.852-1.334.598-.619 1.29-.928 2.082-.928h.28c.022 0 .05.005.087.012-.065.431-.145.83-.234 1.198-.306 1.274-.762 2.341-1.365 3.2-.357.512-.74.768-1.153.768-.313 0-.545-.158-.695-.475-.116-.238-.173-.537-.173-.893 0-.511.108-1.025.323-1.544l-.003-.002z"
+            fill="white"
+          />
+          <path
+            d="M72.687 19.828c.405-1.446.617-2.206.64-2.284.291-.85.626-1.523 1.005-2.02.517-.672 1-1.01 1.443-1.01.57 0 .852.297.852.894 0 .144-.046.387-.138.733l-.54 2.06a3.05 3.05 0 0 0-.098.744c0 .317.087.57.258.76.172.19.41.285.72.285.37 0 .672-.176.897-.527.128-.195.258-.538.388-1.03l-.164-.034c-.247.84-.532 1.26-.85 1.26-.256 0-.384-.15-.384-.453 0-.21.04-.472.125-.789l.592-2.26c.063-.224.092-.424.092-.594v-.022c0-.407-.145-.728-.437-.96-.27-.214-.608-.32-1.015-.32-.464 0-.9.172-1.313.515-.493.411-.906 1.02-1.24 1.824l-.339.817.653-3.176-2.06.332.043.188 1.033-.166-1.077 5.232h.919l-.005.002z"
+            fill="white"
+          />
+        </g>
+      </g>
+    </svg>
+  ),
+  SortBtn: (props: SVGAttributes<SVGElement>) => (
+    <svg
+      viewBox="0 0 48 48"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <g>
+        <path
+          d="M24 0C10.75 0 0 10.75 0 24s10.75 24 24 24 24-10.75 24-24S37.25 0 24 0zm2.18 33.63H13.27c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5h12.92c.83 0 1.5.67 1.5 1.5s-.68 1.5-1.51 1.5zm4.28-8.01h-17.2c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5h17.2c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5zm4.27-8.25H13.27c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5h21.46c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5z"
+          fill="white"
+        />
+      </g>
+    </svg>
+  ),
+  SubwayIcon: (props: SVGAttributes<SVGElement>) => (
+    <svg
+      viewBox="0 0 64 64"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path d="M62.933 31.961c0-17.124-13.925-30.99-30.991-30.99C14.875.97.872 14.817.872 31.96c0 17.126 13.829 31.07 31.07 31.07 17.24 0 30.991-13.905 30.991-31.069z" />
+      <path
+        d="M55.796 31.05c-.698-9.891-7.68-17.125-15.573-19.84-2.773 9.057-5.508 18.269-8.32 27.21-2.831-8.941-5.547-18.153-8.32-27.21C15.69 13.925 8.708 21.159 8.01 31.05a16.37 16.37 0 0 0 0 3.083c.349 6.478 3.18 12.277 6.807 15.845h9.561c.136-.446-.795-.892-1.28-1.183-3.685-2.676-7.389-6.09-9.173-10.802-2.463-6.09-1.125-13.712 2.23-18.017.892-1.028 3.86-3.802 5.74-2.366.64.504 1.087 2.734 1.494 3.86a9492.64 9492.64 0 0 1 8.436 27.46l.097.33.096-.33s5.565-18.21 8.436-27.46c.388-1.126.834-3.375 1.493-3.86 1.88-1.436 4.848 1.338 5.74 2.366 3.374 4.305 4.713 11.927 2.23 18.017-1.784 4.712-5.508 8.126-9.173 10.802-.485.29-1.416.737-1.28 1.183h9.56c3.628-3.568 6.44-9.348 6.808-15.845.078-.989.078-1.997-.039-3.083z"
+        fill="white"
+      />
+    </svg>
+  ),
+  TrainIcon: (props: SVGAttributes<SVGElement>) => (
+    <svg
+      viewBox="0 0 64 64"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M63.03 31.593C63.03 14.448 49.028.582 31.923.582 14.816.582.97 14.429.97 31.592c0 17.145 13.789 31.05 30.953 31.05 17.163 0 31.107-13.886 31.107-31.05z"
+        fill="white"
+      />
+      <path
+        d="M45.265 39.506V18.25c0-2.968-2.52-5.78-6.012-5.78H33.3l1.376-4.305v-.117c3.724.097 4.403.408 4.46.64 0 .156.253.194.253.194s.445-.038.445-.252c0-.077 0-.349-.135-.485-.68-.543-2.968-.892-7.875-.892-2.288 0-4.17.155-5.507.291-1.843.194-2.735.504-2.735 1.086 0 .194.194.252.194.252s.601-.038.601-.194c0-.077.64-.543 4.46-.64v.097l1.785 4.306h-6.05c-3.434 0-5.993 2.813-5.993 5.78v21.256c0 2.967 2.288 5.353 4.615 5.702h2.075l-5.663 9.736h2.618l.156-.194c0-.078.195-.136.195-.136h18.56s.252.039.388.136v.194h2.773l-5.663-9.736h2.036c2.307-.33 4.596-2.715 4.596-5.682zM29.595 8.01h4.46l-1.55 4.46H31.32l-1.725-4.46zm-1.551 6.632c0-.504.446-.95 1.008-.95h5.74c.602 0 .99.446.99.95v1.726c0 .544-.407.95-.99.95h-5.74c-.64 0-1.008-.406-1.008-.95v-1.726zM21.74 21.47c0-1.63 1.145-2.968 2.987-2.968h14.371c1.94 0 2.929 1.338 2.929 2.967v3.8c.155 1.9-1.28 2.987-2.929 2.987h-14.37c-1.688 0-2.987-1.086-2.987-2.987v-3.8zm14.352 23.873c0 .097.99 1.784 1.144 2.056.117.134 0 .193 0 .193H26.92c-.001 0-.311-.04-.253-.194.116-.253 1.105-1.94 1.144-2.057.04-.078.156-.136.156-.136h7.835c-.018 0 .176.058.292.136zm-11.617-3.22c-1.474 0-2.734-1.124-2.734-2.656 0-1.455 1.261-2.58 2.735-2.58 1.338 0 2.58 1.145 2.58 2.58 0 1.532-1.242 2.657-2.58 2.657zm14.294 7.894c.096.039.949 1.823 1.085 2.036.155.097 0 .194 0 .194h-15.71s-.252-.077-.155-.194c.097-.194 1.145-1.978 1.145-2.036.038-.097.155-.155.155-.155h13.246c-.02 0 .116.039.233.155zm-2.038-10.55c0-1.455 1.144-2.58 2.677-2.58 1.337 0 2.52 1.145 2.52 2.58 0 1.532-1.183 2.657-2.521 2.657-1.534 0-2.678-1.125-2.678-2.657z"
+        fill="#816C5A"
+      />
+    </svg>
+  ),
+  TramIcon: (props: SVGAttributes<SVGElement>) => (
+    <svg
+      viewBox="0 0 64 64"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <g>
+        <path
+          d="M64 31.787c-.097 17.144-14.08 30.972-31.205 30.875-17.144-.097-30.953-14.08-30.856-31.244C2.035 14.274 16 .446 33.143.543 50.29.64 64.097 14.623 64 31.787z"
+          fill="white"
+        />
+        <path
+          d="m42.59 17.959-19.065-.117a5.475 5.475 0 0 0-5.508 5.43l-.155 26.647c-.02 3.026 2.405 5.47 5.43 5.508l19.064.116c3.026.02 5.47-2.424 5.489-5.43L48 23.467c.02-3.026-2.405-5.489-5.41-5.508zm-20.752 10.18c0-1.434 1.435-2.598 3.18-2.579l15.787.098c1.765.02 3.18 1.183 3.161 2.618l-.058 9.251c0 1.416-1.435 2.58-3.2 2.58L24.92 40.01c-1.744-.02-3.18-1.183-3.16-2.618l.078-9.251zm3.937 19.472c-.466.485-1.048.737-1.785.737-.717 0-1.318-.253-1.803-.757-.485-.504-.718-1.106-.718-1.823 0-.718.251-1.3.775-1.746a2.64 2.64 0 0 1 1.803-.678c.718 0 1.3.252 1.746.736.465.485.679 1.048.66 1.707a2.484 2.484 0 0 1-.68 1.822zm17.61.097c-.486.503-1.067.756-1.785.736-.717-.02-1.319-.271-1.784-.756a2.503 2.503 0 0 1-.718-1.804c0-.737.272-1.3.776-1.765.524-.445 1.105-.677 1.804-.677.717 0 1.3.252 1.745.736.446.484.679 1.047.66 1.706.019.718-.233 1.319-.699 1.823z"
+          fill="#816C5A"
+        />
+        <path
+          d="m25.93 9.464 2.346 6.982c.233.698.99 1.067 1.688.853.698-.233 1.066-1.01.834-1.707l-1.746-5.198 7.777.039-1.824 5.178a1.36 1.36 0 0 0 .834 1.707 1.348 1.348 0 0 0 1.707-.816l2.424-6.962c.02-.04.02-.097.04-.136v-.039c0-.058.02-.116.02-.194v-.097c0-.097 0-.155-.02-.232a1.328 1.328 0 0 0-.854-1.009 1.396 1.396 0 0 0-.562-.058c-.058 0-.097-.02-.136-.02L27.442 7.7h-.116a1.43 1.43 0 0 0-.562.058 1.345 1.345 0 0 0-.873.95c-.038.097-.038.194-.038.33 0 .135.02.252.058.368 0 .02.02.039.02.058z"
+          fill="#816C5A"
+        />
+      </g>
+    </svg>
+  ),
+  TramMarkerIcon: (props: SVGAttributes<SVGElement>) => (
+    <svg
+      viewBox="0 0 60 60"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M28.211 40.187c-.103-.041-8.422.346-8.422.346l.003.204v.025l8.499.02s.007-.072 0-.143c0-.166-.01-.425-.08-.452Zm3.715-.047c-.07.027-.08.286-.08.452a.765.765 0 0 0 0 .142l8.5-.019v-.229s-8.316-.387-8.42-.346Zm4.506 7.162a.895.895 0 0 0-.043-.263l-.005-.017a.929.929 0 0 0-.883-.65.926.926 0 0 0-.812 1.374.926.926 0 0 0 1.743-.443v-.001Zm1.145-.756c-.021.014-.04.031-.06.048a.923.923 0 0 0-.332.706v.001a.926.926 0 0 0 .117.444.932.932 0 0 0 .813.486.93.93 0 0 0 .93-.93.929.929 0 0 0-.047-.28.927.927 0 0 0-1.421-.476Zm-13.01-.175a.91.91 0 0 0-.247.038c-.041.012-.084.023-.122.04a.93.93 0 0 0 0 1.706.906.906 0 0 0 .232.063c.045.007.09.013.137.013a.928.928 0 0 0 .764-.4.923.923 0 0 0-.065-1.138.923.923 0 0 0-.699-.322Zm-1.683.931a.925.925 0 0 0-.392-.756.61.61 0 0 0-.085-.05.916.916 0 0 0-.454-.124.914.914 0 0 0-.246.038.928.928 0 0 0-.684.891c0 .468.345.85.793.917.045.007.09.014.137.014a.927.927 0 0 0 .432-.111.927.927 0 0 0 .498-.82Z"
+        fill="#fff"
+      />
+      <path
+        d="m46.726 30.982-.005-9.383-.008-.19a102.661 102.661 0 0 0-.053-1.04l-.024-.393a116.955 116.955 0 0 0-.11-1.587 6.976 6.976 0 0 0-.095-.721c-.094-.494-.191-.883-.389-1.297-.372-.78-.941-1.267-1.54-1.737a18.023 18.023 0 0 0-.808-.597c-.126-.083-.48-.283-.766-.444-.11-.062-.209-.117-.274-.155-.628-.36-1.608-.697-2.08-.825a35.558 35.558 0 0 0-1.218-.251 22.077 22.077 0 0 0-2.16-.263 27.607 27.607 0 0 0-.796-.037l-.063-.002c-.21-.007-.732-.014-1.457-.019v-.633a.575.575 0 0 0-.578-.572h-3.741V7.303h6.034a.298.298 0 0 0 .298-.298v-.449h-.004 1.482a.763.763 0 0 0 .763-.763v-.265h-.32V4.504c.394.19.771.4 1.122.634 3.746 2.498 3.315 3.415 3.309 3.425a.198.198 0 0 0 .17.297c.06 0 .12-.029.156-.083.025-.038.149-.243.072-.635-.126-.652-.813-1.787-3.368-3.49-3.71-2.474-10.044-2.512-10.358-2.512h-.006c-.314 0-6.649.038-10.359 2.511-2.554 1.704-3.242 2.838-3.368 3.491-.077.392.047.598.073.635a.187.187 0 0 0 .156.083.198.198 0 0 0 .17-.296c-.007-.011-.22-1.276 3.611-3.64.297-.183.61-.35.932-.504v1.108h-.433v.265c0 .421.342.763.764.763h1.478v.45c0 .164.133.297.297.297h6.104v3.533h-3.798a.59.59 0 0 0-.59.59v.621l-.256.002c-.171.002-.31.004-.34.003a25.705 25.705 0 0 0-1.526.052c-2.287.17-3.826.515-5.149 1.151-.478.23-1.422.758-1.652.915a9.03 9.03 0 0 0-.413.304l-.116.09c-.428.325-.998.82-1.312 1.231-.379.496-.514.96-.633 1.368l-.022.074c-.155.529-.208 1.399-.247 2.034l-.022.345a41.5 41.5 0 0 0-.107 1.975v.022a43.141 43.141 0 0 0-.002 2.104l-.005 11.442-.003 6.035v14.04c0 .38.31.69.69.69h2.482v.708c0 .381.31.69.69.69h1.813v.378a.69.69 0 0 0 .69.691H40.54a.69.69 0 0 0 .69-.69v-.378h1.786a.69.69 0 0 0 .69-.691v-.709h2.336a.69.69 0 0 0 .69-.69V41.468l-.005-10.486h-.001Zm-.21 1.895.004 8.313c-.555-.152-2.76-.758-5.288-1.44-1.94-.521-3.106-.767-3.117-.77l-.022-.002h-.042l1.07-16.409 4.74.735 2.65.427.004 9.147Zm-8.673 6.047-15.647-.074-.779-16.346 17.495.016-1.07 16.403.001.001ZM21.827 5.527V4.113c3.555-1.415 7.953-1.328 8.083-1.325h.006c.128-.003 4.632-.037 8.196 1.405v1.334H21.827Zm-8.464 16.1v-.032l.007-.176.029-.595.025-.441c.034-.587.078-1.22.128-1.884a7.33 7.33 0 0 1 .107-.816c.092-.48.236-.923.427-1.316.35-.72 1.298-1.436 1.865-1.864l.06-.046c.304-.229.99-.612 1.932-1.076a14.14 14.14 0 0 1 1.129-.426c.08-.023.612-.16.802-.202a17.586 17.586 0 0 1 .896-.175 20.386 20.386 0 0 1 2.091-.242c.26-.018.526-.031.792-.041.548-.02 3.314-.024 6.436-.009 3.065-.015 5.784-.011 6.326.009a25.714 25.714 0 0 1 1.505.103 19.625 19.625 0 0 1 1.625.234c.199.038.39.078.575.12.189.043.71.18.787.202.122.035.896.32 1.106.427.925.464 1.597.846 1.895 1.076l.06.046c.555.428 1.485 1.144 1.828 1.864.188.393.329.836.42 1.316a6.911 6.911 0 0 1 .097.726l.008.09c.041.555.077 1.085.108 1.582l.02.336c.01.163.056 1.21.056 1.21l.003 1.876-2.692-.417-4.8-.772-17.714-.017-2.273.373-.84.125-4.83.79c0-1.104.002-1.83.002-1.956l.002-.003Zm-.001 2.185 5.64-.927 2.207-.329.782 16.405v.011c-.163.03-.845.169-1.47.346l-.984.278-2.075.586c-1.96.551-3.938 1.086-4.108 1.132l.008-17.5v-.002Zm8.536 28.845c-1.47-.053-3.492-.24-8.145-.902l-.215-.018.143.005.07.006-.032-.005.153.006c.972.06 5.207.318 8.1.394a51.832 51.832 0 0 0 2.183.014l-.002.123.002.357-.108.004c-.197 0-.105.002-.293.002-.616 0-1.206.036-1.857.013Zm-7.991-1.882c.043 0 .095.003.153.005.966.06 5.156.316 8.046.392a47.988 47.988 0 0 0 2.05.018v.519l-.26-.001c-.63 0-1.183.003-1.854-.023-1.467-.054-3.495-.245-8.1-.9l-.215-.017.143.005.069.006-.031-.005h-.001Zm.313-.97.152.005c.945.06 4.97.304 7.85.387.74.021 1.405.032 1.922.026h.012v.515c-.665 0-1.251.003-1.988-.03-1.454-.064-3.5-.265-7.914-.892l-.215-.018.143.005.069.006-.031-.004Zm.896-2.177h.519c.082 0 .147.066.147.147v.213a.147.147 0 0 1-.147.148h-.519a.147.147 0 0 1-.147-.148v-.213c0-.081.066-.147.147-.147Zm-.098-2.9h.007-.008.001Zm23.736 3.713h-1.685c-.502.295-1.117.478-1.567.478a1.617 1.617 0 1 1 0-3.235c.467 0 1.115.2 1.626.516h1.525c1.6 0 4.888 1.101 4.888 1.101s-3.09 1.14-4.787 1.14Zm5.164.134a.457.457 0 1 1-.914.001.457.457 0 0 1 .914 0Zm-9.134 2.63h-.002.002Zm-.404-1.154h-.213.213Zm.018.187h.292v.497h-.094l-.296.004c-3.2.037-6.258.01-8.586-.002l-.26-.001-.04.092.04-.092h-.064v-.518h.553c2.297.001 5.506.026 8.162.021h.295v-.001Zm-9.827-1.311c-.45 0-1.065-.183-1.567-.478-.192 0-.402.04-.63.04-.348.028-.561.063-.94.063-1.699 0-4.901-1.243-4.901-1.243s3.218-1.098 4.691-1.183a8.45 8.45 0 0 1 1.173.023c.027-.001.04.005.05.002.182.007.327.05.495.05.513-.316 1.163-.51 1.63-.51a1.618 1.618 0 1 1 0 3.236h-.001Zm-7.792-.79a.457.457 0 1 1 0 .914.457.457 0 0 1 0-.914Zm6.788 7.4c.281-.622.785-1.738 1.303-2.898h.529l-.004-.353-.001-.13-.001-.178-.003-.273-.002-.234-.002-.156-.001-.13h.13c2.503 0 6.152.032 8.967.02h.207v.494c-3.454.05-6.803.019-9.3.007l.004.272.001.178c2.63 0 6.457.034 9.295.017.007 0 0 .47 0 .47l.362-.002c.5 1.246.963 2.366 1.182 2.896H23.567Zm13.273-2.916c-.298.008-.604.01-.907.013l-.004-.37v-.105c.275-.004.54-.007.778-.013 1.805-.043 6.947-.367 8.567-.432.253-.01.423-.015.478-.01 0 0-3.909.786-8.912.917Zm.188-.97c-.368.01-.736.019-1.103.026l-.004-.38.002-.093c.351-.004.676-.02.972-.027 1.805-.043 6.947-.367 8.567-.432a6.21 6.21 0 0 1 .478-.01s-3.909.786-8.912.917Zm.312-.969c-.474.012-.942.023-1.417.032v-.486c.475-.005.9-.012 1.285-.021 1.805-.043 6.947-.367 8.567-.433a6.13 6.13 0 0 1 .478-.01s-3.909.787-8.912.918Zm7.118-2.712v-.214c0-.081.066-.147.148-.147h.518c.082 0 .147.066.147.147v.214a.147.147 0 0 1-.147.147h-.519a.147.147 0 0 1-.147-.147Zm2.063-3.378H35.322c-.073-.003-1.793-.062-2.365.516-.113.114-.226.243-.265.336-.047.113-.065.341-.057.506.02.432.655 2.185 1.397 4.1-2.587.004-5.714-.01-8.011-.012.758-1.733 1.38-3.214 1.406-3.42.005-.037.011-.078.019-.123.034-.2.058-.485-.018-.804-.041-.173-.094-.369-.247-.545-.415-.478-1.413-.688-3.052-.648-.57.014-1.223.024-1.918.03a493.42 493.42 0 0 1-8.855-.026v-.4c.516-.05 2.57-.25 3.818-.34 1.13-.08 3.865-.18 4.745-.212l.278-.01h.025a.965.965 0 0 0 .696.297.976.976 0 0 0 .71-.314l1.04-.008c.178.201.435.33.724.33a.963.963 0 0 0 .722-.328c.657.006 1.222.02 1.52.048.387.037.702.128.943.228a1.65 1.65 0 0 0 2.788.148c.255-.146.67-.324 1.253-.38.317-.029.938-.043 1.651-.048a.962.962 0 0 0 1.439 0c.402.001.79.005 1.132.008a.963.963 0 0 0 1.405.023c.773.028 3.657.133 4.826.216 1.248.089 3.01.255 3.45.297v.535ZM23.503 43.1a.652.652 0 0 1-.59.408.65.65 0 0 1-.666-.617c0-.007-.003-.014-.003-.02 0-.021.003-.04.005-.06a.65.65 0 0 1 .632-.608.65.65 0 0 1 .621.414c.028.07.046.144.047.223l-.001.02a.654.654 0 0 1-.046.24h.001Zm2.518-.049a.652.652 0 0 1-.642.472c-.028 0-.054-.005-.082-.01a.648.648 0 0 1-.521-.441.654.654 0 0 1-.034-.212v-.005a.64.64 0 0 1 .073-.28.652.652 0 0 1 1.233.31v.006a.667.667 0 0 1-.027.159v.002ZM28.93 43v-.008c.003-.19.056-.363.144-.517a1.09 1.09 0 0 1 2.044.517c0 .006.003.011.003.017 0 .605-.49 1.096-1.096 1.096a1.084 1.084 0 0 1-.859-.424 1.088 1.088 0 0 1-.237-.672v-.01Zm.367 1.033-.005-.006.005.006Zm6.335-.961a.652.652 0 0 1-.747.44.65.65 0 0 1-.497-.461.657.657 0 0 1-.028-.189v-.005a.65.65 0 0 1 .081-.294.65.65 0 0 1 1.226.325v.005a.637.637 0 0 1-.034.18l-.001-.001Zm2.493.082a.652.652 0 0 1-1.23-.292l-.002-.021a.654.654 0 0 1 .043-.21.65.65 0 0 1 .626-.428.66.66 0 0 1 .209.043.651.651 0 0 1 .425.591c0 .012.003.023.003.035 0 .007-.002.014-.003.02a.656.656 0 0 1-.07.262c.078.004.078.004 0 0Zm8.398.599h-.003.003Zm0-.228c-.764-.082-5.534-.598-6.592-.704-.094-.01-.207-.037-.322-.058-.94-.178-1.144-.406-1.387-.593l.02.019c-.008-.01-.019-.015-.028-.024a.918.918 0 0 0-.118-.098l-.015-.008a.971.971 0 0 0-.516-.164.98.98 0 0 0-.967.722 15.902 15.902 0 0 0-.388-.013c-.063 0-.157-.003-.279-.005a.98.98 0 0 0-.914-.703.98.98 0 0 0-.948.66l-2.478-.06a1.65 1.65 0 0 0-3.144-.004l-2.147.052-.008-.024a.06.06 0 0 0-.003-.01l-.016-.033a.692.692 0 0 1-.018-.034l-.002-.004-.002-.005-.022-.043a.624.624 0 0 0-.031-.055l-.004-.005a.98.98 0 0 0-1.75.254l-.197.003c-.092.002-.233.006-.4.014a.968.968 0 0 0-.41-.55l-.026-.014a.936.936 0 0 0-.272-.11l-.027-.008a.959.959 0 0 0-.232-.025.97.97 0 0 0-.259.045l-.038.012a1.627 1.627 0 0 0-.218.108c-.017.009-.032.02-.047.029-.262.166-.384.384-1.06.57a5.672 5.672 0 0 1-.438.101c-.08.015-.15.03-.219.044-1.356.128-6.365.663-7.246.756v-2.027l.044-.013a468.147 468.147 0 0 0 6.197-1.722l.984-.278c.7-.197 1.44-.34 1.47-.345l.064.002c.108.004.333.012.708 0 .953-.03 2.41-.02 4.1-.006.794.006 1.631.012 2.474.014 2.275.006 4.603.004 6.307.004 1.14-.001 2.002-.002 2.38 0 .12.026 1.26.272 3.096.766 2.623.707 4.9 1.333 5.343 1.455v2.115h.001Z"
+        fill="#fff"
+      />
+      <path
+        d="M40.538 58.529H19.506a.83.83 0 0 1-.829-.83v-.239h-1.673a.83.83 0 0 1-.829-.829v-.57h-2.343a.83.83 0 0 1-.83-.828v-14.04l.008-17.477c-.01-.277-.018-.87.002-2.106v-.012l.003-.132c.009-.464.061-1.238.106-1.86l.022-.344c.04-.643.093-1.521.253-2.065l.021-.073c.123-.42.262-.897.656-1.414.323-.422.903-.927 1.339-1.258l.116-.088c.14-.108.273-.21.418-.31.235-.159 1.188-.692 1.671-.925 1.34-.644 2.893-.992 5.197-1.163a26.483 26.483 0 0 1 1.736-.055l.259-.003v-.484a.73.73 0 0 1 .729-.729h3.66V7.44h-5.966a.436.436 0 0 1-.436-.436v-.31h-1.34a.902.902 0 0 1-.9-.902v-.403h.432V4.64a9.572 9.572 0 0 0-.721.4c-3.48 2.148-3.554 3.35-3.55 3.483a.339.339 0 0 1-.125.422.328.328 0 0 1-.45-.091c-.043-.063-.179-.303-.094-.74.131-.677.832-1.848 3.427-3.578C23.21 2.045 29.585 2 29.907 2h.007c.273 0 6.687.035 10.438 2.535 2.595 1.73 3.296 2.901 3.427 3.579.085.436-.051.676-.095.74a.333.333 0 0 1-.45.09.338.338 0 0 1-.116-.44c.015-.057.171-.966-3.26-3.253a9.07 9.07 0 0 0-.906-.527v.664h.32v.403a.902.902 0 0 1-.902.901h-1.34v.311c0 .24-.195.436-.436.436h-5.896v3.256h3.603c.395 0 .716.32.716.711v.497c.673.005 1.13.01 1.324.018l.077.002c.248.01.555.021.787.037a22.311 22.311 0 0 1 2.174.265c.089.015 1.038.2 1.232.253.478.13 1.474.472 2.112.838.064.038.16.092.268.152.291.164.647.364.779.45.237.157.712.523.817.605.612.48 1.194.978 1.58 1.786.204.428.303.826.398 1.331a6.853 6.853 0 0 1 .098.735l.012.151c.037.486.069.957.098 1.44l.024.393.025.444.029.598.007.19.005 9.389.006 10.662v8.032l.376.03-.376.075v.89l.063.004-.063.013v4.545a.83.83 0 0 1-.829.828h-2.197v.57a.83.83 0 0 1-.829.83h-1.647v.24a.83.83 0 0 1-.829.828v.002ZM13.28 44.639v10.594c0 .304.248.552.552.552h2.62v.846c0 .305.248.553.552.553h1.95v.516c0 .304.248.552.553.552h21.032a.553.553 0 0 0 .552-.552v-.516h1.924a.553.553 0 0 0 .552-.553v-.846h2.474a.553.553 0 0 0 .552-.553v-3.557l-.815.164c-.04.007-3.978.79-8.936.92-.244.006-.497.009-.741.01l-.306.004-.007-.75.204-.003c.25-.004.492-.007.71-.013 1.092-.025 3.394-.154 5.425-.267 1.342-.075 2.5-.14 3.14-.165.363-.015.455-.012.495-.01l.83.068v-.89l-.627.127c-.039.007-3.978.79-8.935.92-.368.01-.737.018-1.104.025l-.14.003-.004-.52.004-.23.134-.002c.212-.003.413-.01.609-.016l.361-.011c1.091-.026 3.393-.154 5.423-.267 1.342-.075 2.502-.14 3.141-.165.363-.015.455-.013.495-.01l.643.051v-.81l-.314.063c-.04.007-3.979.79-8.936.92-.483.012-.947.023-1.419.032l-.14.002v-.757l.136-.007c.48-.005.9-.012 1.283-.021 1.09-.026 3.392-.154 5.423-.267 1.342-.075 2.501-.14 3.14-.165.363-.015.455-.013.495-.01l.331.026V44.73H35.32c-.648-.02-1.85.054-2.268.476-.172.174-.22.257-.235.292-.034.08-.055.281-.046.446.011.244.261 1.147 1.388 4.057l.008.02v-.108h.24v.186l.42-.001v.772l-.527.007c-2.726.031-5.376.016-7.506.004l-1.083-.006h-.17l-.004.01-.025-.011h-.06l-.203-.001v-.793h.602l.041-.096c1.006-2.295 1.38-3.252 1.396-3.381l.02-.13a1.84 1.84 0 0 0-.017-.749c-.043-.178-.09-.339-.218-.486-.385-.443-1.348-.639-2.944-.6-.537.013-1.182.023-1.92.03-2.398.023-5.351.006-7.182-.01l-.006.209-.002-.209a381.81 381.81 0 0 1-1.668-.017h-.07v-.002Zm22.787 7.655.002.199h.029c.244-.002.495-.005.737-.011a60.827 60.827 0 0 0 6.499-.533l-1.192.067c-2.033.113-4.338.241-5.433.267a55.37 55.37 0 0 1-.642.011Zm-.008-.956.002.196c.32-.007.641-.014.962-.023a60.788 60.788 0 0 0 6.499-.532c-.38.02-.783.044-1.193.066-2.033.113-4.337.242-5.432.267l-.357.012c-.155.005-.314.01-.48.013l-.002.001Zm-10.533-.742h.187l1.083.007c2.128.012 4.777.027 7.5-.005l.255-.002v-.223l-.448.002c-1.544.003-3.253-.005-4.905-.011-1.18-.005-2.296-.01-3.257-.01h-.415v.242Zm10.534-.232v.208c.423-.008.841-.018 1.276-.029a60.788 60.788 0 0 0 6.498-.532c-.38.02-.783.043-1.193.066-2.032.113-4.337.242-5.432.267-.347.008-.724.015-1.15.02Zm-9.83-.465 2.836.006c1.603.004 3.257.008 4.763.007-.88-2.28-1.316-3.575-1.334-3.956-.009-.175.009-.426.067-.566.04-.097.134-.217.295-.38.584-.59 2.159-.567 2.467-.557h11.057v-.272c-.617-.058-2.182-.204-3.322-.285-1.13-.08-3.857-.18-4.761-.213a1.097 1.097 0 0 1-1.52-.025c-.309-.004-.655-.006-1.013-.008a1.107 1.107 0 0 1-.78.325c-.29 0-.57-.117-.777-.325-.776.007-1.307.022-1.58.048a2.949 2.949 0 0 0-1.17.347 1.796 1.796 0 0 1-1.443.733 1.79 1.79 0 0 1-1.537-.876 3.14 3.14 0 0 0-.86-.2c-.257-.024-.744-.04-1.448-.047a1.105 1.105 0 0 1-.78.328c-.292 0-.576-.12-.784-.33l-.921.006c-.209.204-.48.316-.77.316-.291 0-.546-.104-.752-.296l-.244.01c-.825.029-3.605.132-4.74.212-1.205.086-3.143.273-3.69.327v.138c.952.01 5.375.056 8.717.025.736-.007 1.38-.017 1.915-.031 1.709-.041 2.711.18 3.16.694.17.195.23.405.277.604.066.273.072.554.02.86a3.182 3.182 0 0 0-.017.116c-.03.243-.721 1.867-1.333 3.266h.002Zm-.18-6.522h.063c.745.007 1.26.024 1.531.05.352.033.683.113.984.237l.045.019.023.042c.267.479.773.776 1.32.776.489 0 .951-.24 1.234-.641l.017-.025.027-.015c.258-.15.695-.34 1.308-.398.288-.026.847-.044 1.663-.05h.062l.041.046a.82.82 0 0 0 1.233 0l.042-.047h.062c.403.002.791.006 1.133.01h.06l.04.044a.822.822 0 0 0 1.206.02l.042-.044.062.002c.84.03 3.67.134 4.83.216a162.3 162.3 0 0 1 3.454.298l.06.005v-.254l-.07-.007-.012.226h-.006l.017-.226-.018-.002c-1.295-.14-5.597-.604-6.59-.704-.073-.008-.152-.024-.235-.04l-.1-.02c-.876-.166-1.14-.376-1.372-.562l-.065-.05h-.002c-.01-.01-.018-.015-.024-.02l-.01-.01c-.028-.025-.058-.052-.088-.073L38 42.17a.839.839 0 0 0-.443-.141h-.02a.843.843 0 0 0-.811.62l-.03.106-.11-.005a15.765 15.765 0 0 0-.662-.018l-.101-.002-.029-.097a.84.84 0 0 0-.785-.604h-.02a.841.841 0 0 0-.794.568l-.033.095-.1-.002-2.479-.06-.099-.003-.03-.094a1.505 1.505 0 0 0-1.44-1.056c-.664 0-1.24.423-1.44 1.052l-.03.094-.099.003-2.147.052-.1.002-.033-.093-.008-.022-.003-.01a.445.445 0 0 0-.009-.017l-.044-.086-.021-.037-.01-.012a.845.845 0 0 0-.678-.373h-.02a.847.847 0 0 0-.802.593l-.03.095-.1.002-.197.004c-.085 0-.214.005-.396.013l-.109.005-.03-.104a.828.828 0 0 0-.352-.472l-.022-.012a.803.803 0 0 0-.232-.094.84.84 0 0 0-.225-.029.804.804 0 0 0-.244.047l-.01.003a1.52 1.52 0 0 0-.195.097l-.038.024c-.063.04-.118.084-.175.13-.184.146-.395.312-.925.459a5.6 5.6 0 0 1-.449.102l-.217.043-.014.002c-1.252.12-5.56.577-6.975.727l-.357.038v.268l.06-.006c.25-.025 2.485-.246 3.822-.34 1.14-.081 3.924-.184 4.75-.214l.366-.011.041.043a.824.824 0 0 0 1.206-.016l.04-.044h.06l1.042-.008h.063l.041.047a.818.818 0 0 0 1.238.001l.042-.047.001.002Zm-12.559-1.742v1.768l.116-.012c1.413-.15 5.708-.607 6.971-.728l.213-.042a5.34 5.34 0 0 0 .427-.098c.476-.131.654-.273.826-.41a2.277 2.277 0 0 1 .249-.175c.093-.054.171-.092.238-.117l.013-.005.034-.012c.108-.032.202-.048.294-.05.083-.002.17.006.265.027l.027.007a1.039 1.039 0 0 1 .342.144l.014.009a1.1 1.1 0 0 1 .42.516 10.633 10.633 0 0 1 .403-.012 1.13 1.13 0 0 1 1.059-.692c.36.008.696.193.9.492l.009.014a.598.598 0 0 1 .038.066l.038.075 1.958-.047a1.781 1.781 0 0 1 1.67-1.151c.748 0 1.41.46 1.672 1.155l2.287.055c.181-.4.576-.659 1.017-.659h.027c.45.01.844.29 1.01.705l.182.004c.067 0 .161.004.286.009.166-.43.578-.718 1.043-.718h.027c.207.005.411.07.589.187a1.17 1.17 0 0 1 .139.11 2.657 2.657 0 0 1 .086.07c.207.163.442.35 1.252.504l.102.02c.077.016.149.03.207.037.958.096 4.99.53 6.44.688v-1.857c-.615-.17-2.778-.763-5.241-1.426a66.15 66.15 0 0 0-3.074-.761c-.39-.002-1.265-.002-2.367-.001h-.376c-1.701.001-3.819.003-5.93-.003-.84-.002-1.665-.009-2.464-.015h-.012c-1.684-.012-3.138-.023-4.094.006-.39.013-.619.004-.717 0h-.017l-.03-.001c-.1.018-.801.158-1.444.339l-1.054.298-2.005.565c-1.798.506-3.611.998-4.066 1.12l.001.002Zm.01-17.708-.01 17.202a466.523 466.523 0 0 0 6.008-1.67l.984-.278a19.887 19.887 0 0 1 1.364-.325l-.769-16.144-2.056.306-5.523.908.001.001Zm24.697 14.928c.272.059 1.372.303 3.07.76 2.308.622 4.333 1.177 5.114 1.392 0-.442 0-1.64-.002-3.237l-.007-13.924-2.533-.409-4.59-.71-1.052 16.127v.001Zm-13.707.162c.72 0 1.543.007 2.429.014h.012c.799.006 1.624.012 2.462.014 2.112.006 4.229.005 5.93.003l-13.194-.062.002.051c.104.005.323.011.683 0a57.335 57.335 0 0 1 1.676-.019Zm-2.162-.306 15.386.072 1.05-16.127-17.201-.016.765 16.07ZM13.5 21.625v1.791l4.669-.763.84-.125 2.295-.375 17.725.018 4.81.774 2.531.392-.003-1.714h.003a1.507 1.507 0 0 1-.01-.146c-.013-.303-.04-.933-.047-1.056l-.02-.336a129.7 129.7 0 0 0-.108-1.579l-.008-.09a6.859 6.859 0 0 0-.096-.712 5.222 5.222 0 0 0-.408-1.282c-.33-.69-1.243-1.393-1.788-1.814l-.06-.046c-.29-.225-.956-.602-1.871-1.063-.2-.1-.966-.383-1.083-.417a27.903 27.903 0 0 0-.779-.2 17.222 17.222 0 0 0-2.184-.352 22.53 22.53 0 0 0-1.496-.103c-.546-.02-3.263-.024-6.32-.01-3.126-.014-5.89-.01-6.433.01a25.94 25.94 0 0 0-1.526.103 20.1 20.1 0 0 0-1.646.233c-.195.037-.39.077-.581.12-.187.041-.72.179-.795.2-.12.034-.903.318-1.105.418-.936.46-1.614.838-1.91 1.062l-.06.046c-.557.421-1.488 1.125-1.824 1.815a5.135 5.135 0 0 0-.416 1.28 7.078 7.078 0 0 0-.105.802 112.299 112.299 0 0 0-.153 2.322l-.03.594-.007.202Zm13.104-9.49c1.023 0 2.226.002 3.488.008a619.02 619.02 0 0 1 4.648-.008v-.73a.437.437 0 0 0-.439-.434h-3.88V7.162h6.173a.16.16 0 0 0 .16-.16v-.448h.132l.003-.139h1.481c.345 0 .626-.28.626-.625v-.127h-.32V4.281l.198.095c.412.199.795.416 1.138.644 3.828 2.552 3.41 3.51 3.35 3.611a.059.059 0 0 0 .02.077c.01.007.02.01.032.01a.05.05 0 0 0 .042-.023c.013-.018.119-.186.052-.53-.122-.627-.795-1.725-3.31-3.403-3.683-2.455-10.015-2.488-10.282-2.488h-.008c-.265 0-6.597.033-10.279 2.488-2.515 1.678-3.188 2.776-3.31 3.401-.067.346.04.513.052.53a.05.05 0 0 0 .042.024.054.054 0 0 0 .031-.01.06.06 0 0 0 .019-.08c-.036-.06-.082-.427.373-1.084.573-.827 1.678-1.75 3.286-2.741.291-.18.61-.352.945-.512l.198-.094v1.3l.066.165h-.5v.127c0 .345.28.625.625.625h1.482l.004.138h.13v.45a.16.16 0 0 0 .16.159h6.24v3.809h-3.935a.453.453 0 0 0-.453.452v.715c.437-.002.95-.003 1.52-.003v.001Zm16.52-3.644-.005.008a.075.075 0 0 1 .005-.007V8.49ZM16.7 8.489l.005.007-.005-.007Zm19.74 47.183H23.352l.089-.195c.228-.504.76-1.684 1.303-2.898l.037-.082h.478l-.013-1.452h.269c.985 0 2.14.004 3.365.01 1.914.008 3.894.017 5.602.009l.304-.002h.042v.769l-.136.004c-2.96.042-5.854.026-8.18.012l-.981-.005.001.172c.944 0 2.026.006 3.17.01 2.065.01 4.202.019 5.987.008h.058l.04.04c.044.043.048.048.043.428l.315-.002.035.087c.481 1.198.92 2.262 1.156 2.833l.105.254h-.001Zm-12.66-.276h12.247c-.24-.579-.635-1.54-1.07-2.62l-.408.003.002-.141.003-.33c-1.76.01-3.84.001-5.855-.007-1.143-.005-2.224-.01-3.166-.01l.004.482h-.578c-.468 1.05-.926 2.062-1.18 2.623h.002Zm1.747-3.831.985.005c2.288.013 5.128.03 8.039-.01v-.22h-.063c-1.714.008-3.694 0-5.61-.01-1.22-.005-2.37-.01-3.353-.01l.002.244ZM22.364 52.8c-.154 0-.31-.002-.471-.008-1.256-.045-3.112-.185-8.155-.902l-.21-.018.016-.276.18.009v-.002l.154.006c1.185.074 5.26.32 8.099.393.68.018 1.24.025 1.665.02l.118-.002c.124 0 .25-.002.396-.004h.141l-.005.265.003.488-.243.008c-.095 0-.123.001-.147.002h-.15c-.231 0-.463.006-.687.01-.23.006-.464.011-.704.011Zm-.461-.284c.402.014.786.005 1.159-.003.226-.005.458-.01.692-.01l.147-.001.116-.002-.002-.207-.252.002-.118.002a44.95 44.95 0 0 1-1.677-.02 186.74 186.74 0 0 1-4.79-.203c2.574.324 3.81.408 4.725.441Zm2.252-.672h-.452c-.547 0-1.063 0-1.667-.022-1.25-.047-3.098-.188-8.111-.9l-.21-.018.016-.275.18.008v-.001l.154.005c.835.052 5.132.315 8.045.392a47.69 47.69 0 0 0 1.719.021l.325-.003h.14v.788l-.138.007-.001-.002Zm-.26-.277h.122v-.241l-.185.002a47.45 47.45 0 0 1-1.73-.021 192.403 192.403 0 0 1-4.745-.203c2.552.321 3.78.406 4.69.44.598.023 1.112.022 1.655.022h.193Zm-.049-.693a37.17 37.17 0 0 1-1.686-.03c-1.686-.074-3.982-.333-7.923-.893l-.21-.018.016-.275.18.008v-.001l.154.005c.803.05 4.94.303 7.848.387a48.78 48.78 0 0 0 1.917.026h.151v.784l-.138.007h-.308Zm-6.187-.738c1.988.25 3.389.383 4.514.432.682.03 1.246.03 1.843.03v-.238c-.465.004-1.07-.006-1.799-.027-1.405-.04-3.095-.12-4.558-.197Zm-.882-.95a.596.596 0 0 1 0-1.19.596.596 0 0 1 0 1.19Zm0-.914a.32.32 0 1 0 0 .639.32.32 0 0 0 0-.639Zm26.682.897a.596.596 0 0 1 0-1.191.596.596 0 0 1 0 1.19Zm0-.915a.32.32 0 1 0 0 .639.32.32 0 0 0 0-.639Zm-18.89.81c-.47 0-1.095-.187-1.603-.479a3.45 3.45 0 0 0-.238.018 3.504 3.504 0 0 1-.35.022l-.264.024c-.217.02-.404.038-.682.038-1.704 0-4.82-1.201-4.951-1.252l-.354-.138.36-.122c.132-.045 3.253-1.105 4.728-1.19a8.768 8.768 0 0 1 1.188.022l.036.002h.01c.095.003.177.016.256.027.068.01.132.02.197.022.515-.31 1.165-.508 1.667-.508.968 0 1.755.788 1.755 1.756s-.787 1.756-1.755 1.756v.001Zm-1.566-.755h.037l.033.02c.474.278 1.061.459 1.496.459.816 0 1.48-.664 1.48-1.48s-.664-1.48-1.48-1.48c-.458 0-1.084.197-1.556.489l-.034.02h-.039c-.098 0-.188-.012-.274-.025-.073-.01-.142-.02-.218-.023l-.038-.002-.01-.001h-.02a8.38 8.38 0 0 0-1.148-.024c-1.145.067-3.395.766-4.283 1.054.886.32 3.166 1.097 4.483 1.097.265 0 .447-.017.657-.037.085-.008.173-.017.273-.024h.011c.112 0 .223-.011.33-.022.103-.01.202-.02.3-.02v-.001Zm12.498.747a1.757 1.757 0 0 1-1.755-1.755c0-.969.787-1.756 1.755-1.756.494 0 1.143.201 1.665.516h1.486c1.603 0 4.795 1.063 4.93 1.108l.373.125-.368.136c-.127.047-3.132 1.149-4.834 1.149h-1.648c-.508.291-1.133.478-1.604.478Zm0-3.235c-.816 0-1.48.664-1.48 1.48 0 .815.664 1.479 1.48 1.479.435 0 1.022-.18 1.497-.46l.032-.019h1.723c1.302 0 3.475-.695 4.353-.996-.915-.288-3.218-.97-4.454-.97h-1.564l-.034-.02c-.479-.296-1.102-.495-1.553-.495v.001Zm-19.867 2.452h-.52a.285.285 0 0 1-.284-.285v-.214c0-.157.127-.285.285-.285h.519c.157 0 .285.128.285.285v.214a.285.285 0 0 1-.285.285Zm-.52-.508a.01.01 0 0 0-.008.009v.213a.01.01 0 0 0 .009.009h.519a.01.01 0 0 0 .009-.009v-.213a.01.01 0 0 0-.01-.01h-.518Zm30.007.49h-.518a.285.285 0 0 1-.286-.286v-.213c0-.158.128-.286.286-.286h.518c.158 0 .286.128.286.286v.213a.285.285 0 0 1-.286.285Zm-.518-.509a.01.01 0 0 0-.01.009v.213a.01.01 0 0 0 .01.01h.518a.01.01 0 0 0 .01-.01v-.213a.01.01 0 0 0-.01-.009h-.518ZM30.02 44.241c-.255 0-.502-.081-.71-.23l-.127.105-.005-.006.128-.1a1.182 1.182 0 0 1-.254-.246 1.221 1.221 0 0 1-.266-.758l.002-.027c.004-.2.058-.394.16-.575.22-.39.63-.632 1.072-.632a1.239 1.239 0 0 1 1.234 1.233c0 .68-.553 1.234-1.234 1.234v.002Zm-.957-1.226a.947.947 0 0 0 .207.58.953.953 0 0 0 1.705-.602.961.961 0 0 0-.956-.944.957.957 0 0 0-.83.491.94.94 0 0 0-.126.451l-.002.024h.002Zm0-.002v-.002.002Zm-.275-.03Zm-3.396.678h-.018c-.032-.001-.06-.006-.083-.01l-.017-.002a.79.79 0 0 1-.672-.783v-.017a.783.783 0 0 1 .088-.338.79.79 0 0 1 1.495.377v.015a.818.818 0 0 1-.09.326.794.794 0 0 1-.703.432Zm-.514-.811v.01a.548.548 0 0 0 .058.243.513.513 0 0 0 .38.273l.019.003c.015.002.03.005.045.005a.519.519 0 0 0 .526-.499v-.012a.498.498 0 0 0-.068-.257.51.51 0 0 0-.434-.26h-.012a.51.51 0 0 0-.457.281.51.51 0 0 0-.057.213Zm10.128.81h-.016a.787.787 0 0 1-.74-.574.802.802 0 0 1-.032-.22v-.012a.783.783 0 0 1 .096-.36.787.787 0 0 1 .694-.416h.019a.786.786 0 0 1 .691.45.78.78 0 0 1 .081.36v.016a.863.863 0 0 1-.098.342.79.79 0 0 1-.695.415Zm-.512-.811v.015a.546.546 0 0 0 .065.25.51.51 0 0 0 .936-.087.494.494 0 0 0 .027-.14v-.013a.5.5 0 0 0-.052-.226.513.513 0 0 0-.45-.293h-.012a.513.513 0 0 0-.451.273.498.498 0 0 0-.064.221Zm-11.6.796a.784.784 0 0 1-.705-.437.78.78 0 0 1-.082-.393l.001-.016a.793.793 0 0 1 .767-.736.796.796 0 0 1 .81.772l-.001.03a.79.79 0 0 1-.771.78h-.02Zm-.515-.784a.516.516 0 0 0 .514.508h.012a.51.51 0 0 0 .501-.51l.001-.023a.517.517 0 0 0-.526-.497.516.516 0 0 0-.499.48l-.002.027-.002.016.001-.001Zm15.163.783h-.02a.789.789 0 0 1-.77-.78c-.002-.01-.002-.02-.002-.03a.778.778 0 0 1 .051-.254.79.79 0 0 1 .759-.518.78.78 0 0 1 .253.05.787.787 0 0 1 .516.718.302.302 0 0 1 .003.041l-.003.03a.847.847 0 0 1-.024.152c.027.021.044.055.041.107-.004.099-.07.124-.144.128v.004h-.005a.787.787 0 0 1-.656.352Zm-.515-.81v.023a.502.502 0 0 0 .075.264c.092.15.252.243.427.247h.012a.511.511 0 0 0 .456-.281L38 43.08a.503.503 0 0 0 .038-.349.512.512 0 0 0-.32-.36.518.518 0 0 0-.165-.033.513.513 0 0 0-.493.338.524.524 0 0 0-.034.159Zm1.303.061v.003-.003Zm-.22-37.233H21.624l.066-.165v-1.48l.087-.035c3.54-1.41 7.95-1.339 8.137-1.335.046 0 4.632-.05 8.25 1.415l.087.035v1.4l.066.166h-.204v-.001Zm-16.145-.276h16.008V4.283c-3.305-1.31-7.39-1.361-7.983-1.361h-.112c-.445-.006-4.559-.026-7.912 1.281v1.183Z"
+        fill="#fff"
+      />
+      <path
+        d="m39.477 23.565-.096 14.988 2.684.707-.002-15.235-2.586-.46Zm3.219 15.89 2.684.68-.002-15.572-2.587-.433-.095 15.325ZM17.462 24.106l-2.586.434-.002 15.57 2.684-.679-.096-15.325Zm3.316-.564-2.588.46-.001 15.234 2.683-.706-.094-14.988Zm16.448 14.706.605-15.01H22.228l.726 14.943 14.272.067Zm2.739-19.596c.188.1.387.147.574.147.317 0 .6-.137.733-.391.212-.403-.03-.948-.54-1.216a1.196 1.196 0 0 0-.752-.132c-.253.043-.45.177-.555.377-.211.403.03.948.54 1.215Zm-.274-.907c.143-.271.545-.34.9-.155.353.186.525.557.382.828a.453.453 0 0 1-.038.06c-.213.148-.558.152-.871-.012a1.021 1.021 0 0 1-.4-.367.475.475 0 0 1 .028-.354Zm.167-1.044.032.027a.858.858 0 0 0 .122.077l.023.015c.029.014.058.026.086.038l.084.033a.997.997 0 0 0 .334.056c.282 0 .522-.125.637-.343a.652.652 0 0 0-.004-.588 1.038 1.038 0 0 0-.465-.472c-.444-.234-.954-.136-1.14.215-.157.3-.034.69.292.943h-.001Zm-.05-.672c.122-.232.466-.291.77-.131.303.158.45.476.327.708a.158.158 0 0 0-.006.011c-.118.102-.304.143-.512.105a.508.508 0 0 1-.108-.027l-.08-.033c-.023-.009-.044-.017-.069-.03l-.023-.014a.534.534 0 0 1-.087-.055l-.025-.02a.79.79 0 0 1-.224-.268.388.388 0 0 1 .037-.244v-.002Zm-2.836 3.081a2.09 2.09 0 0 0 2.088-2.088 2.091 2.091 0 0 0-2.088-2.089 2.091 2.091 0 0 0-2.089 2.089c0 1.151.937 2.088 2.089 2.088Zm-1.845-2.348a1.865 1.865 0 0 1 1.845-1.603c.939 0 1.792.768 1.858 1.736a.086.086 0 0 1-.017-.038 1.855 1.855 0 0 1-1.83 1.56c-.925 0-1.763-.741-1.848-1.687a.2.2 0 0 1-.008.032Zm-5.019 3.676a3.592 3.592 0 0 0 3.588-3.588 3.593 3.593 0 0 0-3.588-3.588 3.593 3.593 0 0 0-3.588 3.588 3.592 3.592 0 0 0 3.588 3.588Zm-.035-6.04a3.269 3.269 0 0 1 3.255 2.973v.055a3.277 3.277 0 0 1-3.22 2.696 3.275 3.275 0 0 1-3.258-2.977 3.267 3.267 0 0 1 3.224-2.746Zm-10.29 2.58a1 1 0 0 0 .18-.016.7.7 0 0 0 .15-.038l.089-.035c.029-.012.057-.023.085-.038l.024-.016a.71.71 0 0 0 .119-.074l.028-.022c.333-.26.456-.65.298-.95-.185-.352-.696-.449-1.14-.215-.443.232-.653.708-.468 1.06.114.219.355.344.634.344h.001Zm-.038-1.05c.303-.159.647-.1.77.132.039.074.05.158.037.242a.811.811 0 0 1-.23.275l-.02.015a.632.632 0 0 1-.091.058l-.022.013a.748.748 0 0 1-.065.03l-.08.032a.54.54 0 0 1-.114.029c-.204.037-.388-.004-.505-.105l-.007-.012c-.122-.232.025-.55.327-.708v-.001Zm3.468 3.291a2.136 2.136 0 0 0 2.134-2.134 2.136 2.136 0 0 0-2.134-2.134 2.136 2.136 0 0 0-2.134 2.134c0 1.177.957 2.134 2.134 2.134Zm-1.815-2.201v.012c0-.035.002-.034.004-.06a1.818 1.818 0 0 1 1.812-1.702c.963 0 1.797.832 1.817 1.818l-.002-.037a1.854 1.854 0 0 1-1.804 1.433 1.879 1.879 0 0 1-1.823-1.511c0 .016-.002.032-.004.048v-.001Z"
+        fill="#fff"
+      />
+      <path
+        d="M19.588 18.718c.11.037.228.055.35.055.136 0 .277-.023.414-.07.544-.186.868-.687.721-1.117-.072-.214-.247-.377-.49-.46a1.198 1.198 0 0 0-.764.016c-.259.088-.477.25-.613.454-.143.214-.181.45-.108.663.072.213.247.376.49.459Zm.423-1.2c.379-.129.765.002.865.292a.488.488 0 0 1 .017.069c-.04.257-.273.51-.608.624a1.019 1.019 0 0 1-.544.038.474.474 0 0 1-.236-.264c-.098-.29.128-.63.507-.759h-.001Z"
+        fill="#fff"
+      />
+    </svg>
+  ),
+  TrolleyIcon: (props: SVGAttributes<SVGElement>) => (
+    <svg
+      viewBox="0 0 64 64"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <g>
+        <path
+          d="M63.03 32.174c-.097 17.164-14.08 30.973-31.204 30.895C14.68 62.952.873 48.97.97 31.805 1.067 14.662 15.05.834 32.175.93c17.144.117 30.952 14.08 30.855 31.244z"
+          fill="white"
+        />
+        <path
+          d="m41.62 16.718-19.065-.097c-3.006-.019-5.488 2.425-5.488 5.43l-.175 26.648c-.02 2.58 1.765 4.732 4.17 5.333v.176a2.02 2.02 0 0 0 1.978 2.017c1.106 0 2.017-.892 2.017-1.978v-.02l13.42.078c0 1.105.893 2.017 1.979 2.017a2 2 0 0 0 2.017-1.998v-.135a5.448 5.448 0 0 0 4.402-5.314l.155-26.648c.04-3.025-2.404-5.488-5.41-5.507zM20.848 26.899c-.001-1.416 1.434-2.58 3.199-2.56l15.766.077c1.745 0 3.161 1.164 3.161 2.599l-.058 9.25c-.001 1.436-1.436 2.6-3.201 2.58L23.93 38.75c-1.765 0-3.18-1.184-3.16-2.62l.077-9.23zm3.936 19.49c-.466.485-1.048.737-1.785.737-.716 0-1.317-.252-1.802-.756-.485-.503-.698-1.105-.698-1.822 0-.718.252-1.3.775-1.746a2.657 2.657 0 0 1 1.804-.66c.697 0 1.298.253 1.744.738.446.485.68 1.067.68 1.707 0 .698-.253 1.318-.718 1.803zm17.61.117c-.466.485-1.067.737-1.785.717a2.36 2.36 0 0 1-1.783-.756c-.485-.504-.718-1.125-.718-1.823 0-.718.27-1.3.775-1.746.524-.447 1.125-.68 1.804-.66.716 0 1.298.252 1.744.737a2.42 2.42 0 0 1 .66 1.707c.019.698-.233 1.3-.699 1.823z"
+          fill="#816C5A"
+        />
+        <path
+          d="M28.51 16.058a1.464 1.464 0 0 0 1.9-.93l2.734-7.817a1.475 1.475 0 0 0-.911-1.919 1.515 1.515 0 0 0-1.92.932l-2.735 7.816c-.271.776.136 1.63.931 1.92z"
+          fill="#816C5A"
+        />
+        <path
+          d="M33.61 16.077c.776.292 1.648-.135 1.92-.91l2.734-7.836a1.5 1.5 0 0 0-.93-1.92 1.487 1.487 0 0 0-1.901.932l-2.715 7.816c-.291.795.135 1.648.892 1.92z"
+          fill="#816C5A"
+        />
+      </g>
+    </svg>
+  ),
+  I18NIcon: (props: SVGAttributes<SVGElement>) => (
+    <svg
+      viewBox="0 0 48 48"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M0 24C0 10.75 10.75 0 24 0C37.25 0 48 10.75 48 24C48 37.25 37.25 48 24 48C10.75 48 0 37.25 0 24ZM36.05 19.41L38.27 25.47L40.47 19.39L39.17 19.77C39.16 19.75 39.16 19.35 39.16 19.32C38.58 12.41 32.99 7.15 25.94 7.15C25.42 7.15 24.99 7.58 24.99 8.1C24.99 8.62 25.42 9.05 25.94 9.05C31.92 9.05 36.68 13.47 37.26 19.31C37.26 19.325 37.2625 19.435 37.265 19.545C37.2675 19.655 37.27 19.765 37.27 19.78L36.05 19.41ZM8.90347 27.5369C11.3532 26.9568 13.6329 25.8438 15.5698 24.2838L15.5706 24.2846C17.2121 25.8526 19.2494 26.9784 21.481 27.5521C21.5872 27.5649 21.6942 27.5649 21.8005 27.5521C22.3191 27.6074 22.8295 27.3911 23.1382 26.9848C23.4477 26.5786 23.5083 26.0441 23.2984 25.5826C23.0876 25.1211 22.6386 24.803 22.12 24.7477C20.4801 24.3182 18.9806 23.4937 17.7631 22.3495C20.2486 20.0131 22.1034 17.1245 23.1656 13.9363C23.2726 13.5077 23.1648 13.0566 22.8751 12.716C22.6013 12.3627 22.1706 12.1552 21.7133 12.1552H16.6304V10.402C16.6304 9.90121 16.3532 9.43889 15.9042 9.1881C15.4553 8.9373 14.9009 8.9373 14.452 9.1881C14.003 9.43809 13.7258 9.90121 13.7258 10.402V12.1824H8.64289C8.12339 12.1824 7.64456 12.45 7.38481 12.8835C7.12506 13.317 7.12506 13.8522 7.38481 14.2857C7.64456 14.7192 8.12422 14.9868 8.64289 14.9868H19.6652C18.6801 16.9971 17.3441 18.828 15.715 20.3993C14.837 19.3977 14.0686 18.3128 13.4204 17.1598C13.2744 16.7896 12.9731 16.4972 12.5906 16.3529C12.208 16.2087 11.7806 16.2279 11.4138 16.405C11.047 16.5821 10.7748 16.901 10.6644 17.2824C10.5541 17.6638 10.6163 18.0724 10.8354 18.4074C11.6055 19.7423 12.5151 20.997 13.5507 22.1516C12.0205 23.3728 10.2304 24.2533 8.30845 24.7317C7.92256 24.7709 7.56904 24.956 7.32589 25.2469C7.08191 25.5369 6.96739 25.9095 7.00805 26.2813C7.04871 26.6539 7.24041 26.9952 7.54166 27.23C7.84207 27.4656 8.22796 27.5761 8.61302 27.5369C8.70928 27.5513 8.80721 27.5513 8.90347 27.5369ZM34.8999 38.8803C35.251 39.0301 35.6485 39.0397 36.007 38.9067C36.3812 38.7865 36.6883 38.5237 36.8584 38.18C37.0285 37.8362 37.046 37.4404 36.9074 37.0839L30.3431 20.7767C30.2377 20.5131 30.0527 20.2863 29.8112 20.1261C29.5697 19.9658 29.2842 19.8793 28.9921 19.8785C28.7016 19.8785 28.417 19.9626 28.1763 20.1196C27.9357 20.2775 27.7498 20.501 27.6419 20.7623L21.1357 36.523C20.944 36.9885 21.0237 37.5181 21.3457 37.9116C21.6677 38.305 22.1822 38.5029 22.6959 38.4308C23.2104 38.3579 23.6453 38.0269 23.837 37.5606L25.4054 33.6489H32.3182L34.134 38.1079C34.2734 38.4524 34.5489 38.7304 34.8999 38.8803ZM28.905 25.1652L31.1854 30.8445H31.1846H26.5664L28.905 25.1652Z"
+        fill="white"
+      />
+    </svg>
+  ),
+};
diff --git a/src/preview/components/index.ts b/src/preview/components/index.ts
new file mode 100644
index 0000000..289fff9
--- /dev/null
+++ b/src/preview/components/index.ts
@@ -0,0 +1,12 @@
+export * from "./AttractionShortPreview/AttractionShortPreview";
+export * from "./AttractionWidget/AttractionWidget";
+export * from "./TransportIcon/TransportIcon";
+export * from "./TouchScrollWrapper/TouchScrollWrapper";
+export * from "./RoutInfoWidget/RouteInfoWidget";
+export * from "./WeatherWidget";
+export * from "./MapWidget";
+export * from "./Drawer";
+export * from "./lightbox";
+export * from "./model-viewer";
+export { Icons } from "./Icons";
+export * from "./MyComponent";
diff --git a/src/preview/components/lightbox/Lightbox.css b/src/preview/components/lightbox/Lightbox.css
new file mode 100644
index 0000000..f1dd622
--- /dev/null
+++ b/src/preview/components/lightbox/Lightbox.css
@@ -0,0 +1,61 @@
+.lightbox-overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  /*in case we'll decide to show overlay dimming*/
+  /*background-color: rgba(0, 0, 0, 0.8);*/
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  z-index: 999;
+}
+
+.lightbox-content {
+  max-width: 90%;
+  max-height: 90%;
+  border: 2px solid #806c59;
+  border-radius: 8px 8px 0 0;
+
+  /* UGLY HACK FOR CLIENTS */
+  position: fixed;
+  top: var(--lightbox-content-top, unset);
+  right: var(--lightbox-content-right, unset);
+  bottom: var(--lightbox-content-bottom, unset);
+  left: var(--lightbox-content-left, unset);
+  overflow: hidden;
+}
+
+.lightbox-content img {
+  max-width: 100%;
+  max-height: 100%;
+}
+
+.lightbox-content__wrapper {
+  position: relative;
+}
+
+.lightbox-content__close-btn {
+  position: absolute;
+  bottom: 10px;
+  right: 10px;
+  z-index: 100;
+  border: 0;
+  background: transparent;
+  text-transform: uppercase;
+  color: white;
+  cursor: pointer;
+}
+
+.media-with-watermark {
+  position: relative;
+}
+
+.watermark {
+  position: absolute;
+  top: 10px;
+  left: 10px;
+  width: 50px;
+  height: auto;
+}
diff --git a/src/preview/components/lightbox/Lightbox.tsx b/src/preview/components/lightbox/Lightbox.tsx
new file mode 100644
index 0000000..b847c0e
--- /dev/null
+++ b/src/preview/components/lightbox/Lightbox.tsx
@@ -0,0 +1,40 @@
+import React from "react";
+import { useLightboxContext } from "./LightboxContext";
+
+import "./Lightbox.css";
+import { LightboxData } from "@mt/common-types";
+import { LightboxContent } from "./LightboxContent";
+import { FormattedMessage } from "react-intl";
+
+export const Lightbox = () => {
+  // prettier-ignore
+  const { data, lightboxActive, closeLightbox } = useLightboxContext<LightboxData>();
+
+  return lightboxActive ? (
+    <div className="lightbox-overlay">
+      <div className="lightbox-content">
+        <div
+          className="lightbox-content__wrapper"
+          style={{ height: "749px", width: "1220px" }}
+        >
+          <LightboxContent />
+
+          {data.watermarkUrl && (
+            <img
+              src={data.watermarkUrl}
+              alt="Watermark"
+              className="watermark"
+            />
+          )}
+
+          <button
+            className="lightbox-content__close-btn"
+            onPointerUp={closeLightbox}
+          >
+            <FormattedMessage id="close" />
+          </button>
+        </div>
+      </div>
+    </div>
+  ) : null;
+};
diff --git a/src/preview/components/lightbox/LightboxContent.tsx b/src/preview/components/lightbox/LightboxContent.tsx
new file mode 100644
index 0000000..5986a4e
--- /dev/null
+++ b/src/preview/components/lightbox/LightboxContent.tsx
@@ -0,0 +1,26 @@
+import { useLightboxContext } from '@mt/components';
+import { Object3DLightbox } from './Object3DLightbox';
+import { PhotoSphereLightbox } from './PhotoSphereLightbox';
+import {
+  Object3DLightboxData,
+  PhotoSphereLightboxData,
+} from '@mt/common-types';
+
+export const LightboxContent = () => {
+  // prettier-ignore
+  const { data } = useLightboxContext<PhotoSphereLightboxData | Object3DLightboxData>();
+
+  switch (data.type) {
+    case 'PHOTO_SPHERE':
+      return (
+        <PhotoSphereLightbox
+          imageUrl={data.imageUrl}
+          watermarkUrl={data.watermarkUrl}
+        />
+      );
+    case 'OBJECT_3D':
+      return <Object3DLightbox modelUrl={data.modelUrl} />;
+    default:
+      return null;
+  }
+};
diff --git a/src/preview/components/lightbox/LightboxContext.tsx b/src/preview/components/lightbox/LightboxContext.tsx
new file mode 100644
index 0000000..90c7326
--- /dev/null
+++ b/src/preview/components/lightbox/LightboxContext.tsx
@@ -0,0 +1,51 @@
+import React, { createContext, useState, useContext, ReactNode } from 'react';
+
+interface LightboxContextType<T> {
+  data: T;
+  setData: (data: T) => void;
+  lightboxActive: boolean;
+  openLightbox: () => void;
+  closeLightbox: () => void;
+}
+
+// prettier-ignore
+export const LightboxContext = createContext<LightboxContextType<any> | undefined>(undefined);
+
+export const LightboxProvider = ({ children }: { children: ReactNode }) => {
+  const [data, setData] = useState(null);
+  const [lightboxActive, setLightboxActive] = useState(false);
+
+  const openLightbox = () => {
+    setLightboxActive(true);
+  };
+
+  const closeLightbox = () => {
+    setLightboxActive(false);
+  };
+
+  const contextValue = {
+    data,
+    setData,
+    lightboxActive,
+    openLightbox,
+    closeLightbox,
+  };
+
+  return (
+    <LightboxContext.Provider value={contextValue}>
+      {children}
+    </LightboxContext.Provider>
+  );
+};
+
+export const useLightboxContext = function <T>(): LightboxContextType<T> {
+  const context = useContext(LightboxContext);
+
+  if (!context) {
+    throw new Error(
+      'useLightboxContext must be used within a LightboxProvider'
+    );
+  }
+
+  return context;
+};
diff --git a/src/preview/components/lightbox/Object3DLightbox.tsx b/src/preview/components/lightbox/Object3DLightbox.tsx
new file mode 100644
index 0000000..35ec693
--- /dev/null
+++ b/src/preview/components/lightbox/Object3DLightbox.tsx
@@ -0,0 +1,9 @@
+import React from 'react';
+
+import ModelViewer from '../model-viewer/ModelViewer';
+
+export const Object3DLightbox = ({ modelUrl }: { modelUrl: string }) => (
+  <div style={{ height: '749px', width: '1220px' }}>
+    <ModelViewer pathToModel={modelUrl} />
+  </div>
+);
diff --git a/src/preview/components/lightbox/PhotoSphereLightbox.tsx b/src/preview/components/lightbox/PhotoSphereLightbox.tsx
new file mode 100644
index 0000000..6adf126
--- /dev/null
+++ b/src/preview/components/lightbox/PhotoSphereLightbox.tsx
@@ -0,0 +1,32 @@
+import React from 'react';
+import cn from 'classnames';
+import { ReactPhotoSphereViewer } from 'react-photo-sphere-viewer';
+
+import './Lightbox.css';
+import { useIntl } from 'react-intl';
+
+export const PhotoSphereLightbox = ({
+  imageUrl,
+  watermarkUrl,
+}: {
+  imageUrl: string;
+  watermarkUrl?: string;
+}) => {
+  const intl = useIntl();
+  const loadingMessage = intl.formatMessage({ id: 'loading' });
+
+  return (
+    <ReactPhotoSphereViewer
+      src={imageUrl}
+      height={'749px'}
+      width={'1220px'}
+      container={cn('widget-media', {
+        'media-with-watermark': watermarkUrl !== null,
+      })}
+      moveInertia={false}
+      navbar={['autorotate', 'zoom']}
+      keyboard={false}
+      loadingTxt={loadingMessage}
+    />
+  );
+};
diff --git a/src/preview/components/lightbox/index.ts b/src/preview/components/lightbox/index.ts
new file mode 100644
index 0000000..a545ae9
--- /dev/null
+++ b/src/preview/components/lightbox/index.ts
@@ -0,0 +1,2 @@
+export * from './LightboxContext';
+export * from './Lightbox';
diff --git a/src/preview/components/model-viewer/Model.tsx b/src/preview/components/model-viewer/Model.tsx
new file mode 100644
index 0000000..9e30edd
--- /dev/null
+++ b/src/preview/components/model-viewer/Model.tsx
@@ -0,0 +1,32 @@
+import React, { ForwardedRef, forwardRef, useMemo } from "react";
+import { Mesh, MeshPhysicalMaterial, Object3D, PerspectiveCamera } from "three";
+import { useGLTF } from "@react-three/drei";
+import * as SkeletonUtils from "three/examples/jsm/utils/SkeletonUtils";
+import { useThree } from "@react-three/fiber";
+import { fitCameraToObject } from "./fitCameraToObject";
+import { BufferGeometry } from "three/src/core/BufferGeometry";
+
+export const Model = forwardRef(
+  ({ url }: { url: string }, ref: ForwardedRef<Object3D>) => {
+    const { camera } = useThree();
+    const { scene } = useGLTF(url);
+
+    const model = useMemo(() => {
+      const model = (SkeletonUtils as any).clone(scene);
+      model.traverse((el: Mesh<BufferGeometry, MeshPhysicalMaterial>) => {
+        if (el.type === "Mesh") {
+          el.material.reflectivity = 0.0;
+          el.material.fog = false;
+          el.material.color.setHex(0xffffff);
+        }
+      });
+
+      fitCameraToObject(camera as PerspectiveCamera, scene);
+      scene.updateWorldMatrix(true, true);
+
+      return model;
+    }, [scene, camera]);
+
+    return <primitive key={url} object={model} ref={ref} />;
+  }
+);
diff --git a/src/preview/components/model-viewer/ModelViewer.tsx b/src/preview/components/model-viewer/ModelViewer.tsx
new file mode 100644
index 0000000..96c8a29
--- /dev/null
+++ b/src/preview/components/model-viewer/ModelViewer.tsx
@@ -0,0 +1,56 @@
+import React, { Suspense } from "react";
+
+import { Canvas, CanvasProps } from "@react-three/fiber";
+import { Html } from "@react-three/drei";
+import { OrbitControls } from "./OrbitControls";
+import { NoToneMapping } from "three";
+import { Model } from "./Model";
+import { CircularProgress } from "@mui/material";
+
+interface ModelViewerProps {
+  pathToModel: string;
+  autoRotate?: boolean;
+}
+
+const ModelViewer = ({ pathToModel, autoRotate = true }: ModelViewerProps) => {
+  const glConfig: NonNullable<CanvasProps["gl"]> = {
+    toneMapping: NoToneMapping,
+    powerPreference: "high-performance",
+  };
+
+  return (
+    <Canvas
+      gl={glConfig}
+      shadows={true}
+      performance={{ min: 0.3 }}
+      dpr={[0.3, 1]}
+      camera={{ position: [0, 0, 10], fov: 45, zoom: 0.7, near: 1, far: 500 }}
+      style={{
+        backgroundColor: "#000",
+        borderTopRightRadius: "8px",
+        borderTopLeftRadius: "8px",
+      }}
+    >
+      <ambientLight intensity={0.6} />
+      <directionalLight intensity={1} />
+
+      <Suspense fallback={<CanvasLoader />}>
+        <Model url={pathToModel} />
+      </Suspense>
+
+      <OrbitControls
+        autoRotate={autoRotate}
+        autoRotateSpeed={1.0}
+        zoomSpeed={0.5}
+      />
+    </Canvas>
+  );
+};
+
+const CanvasLoader = () => (
+  <Html>
+    <CircularProgress color="inherit" />
+  </Html>
+);
+
+export default ModelViewer;
diff --git a/src/preview/components/model-viewer/OrbitControls/TreeOrbitControls.js b/src/preview/components/model-viewer/OrbitControls/TreeOrbitControls.js
new file mode 100644
index 0000000..6dc4799
--- /dev/null
+++ b/src/preview/components/model-viewer/OrbitControls/TreeOrbitControls.js
@@ -0,0 +1,1131 @@
+//Этот файл был взят из node_modules/three/examples/jsm/controls/OrbitControls.js, переименован,
+//а также в него был добавлен метод connect (строчки кода 1106-1117) для корректной инициализации EventListeners
+//(без такой инициализации данный функционал не работает)
+//Этот метод был взят из исходного node_modules/three-stdlib/controls/OrbitControls.js который используется по умолчанию.
+
+import {
+  EventDispatcher,
+  MOUSE,
+  Quaternion,
+  Spherical,
+  TOUCH,
+  Vector2,
+  Vector3,
+  Plane,
+  Ray,
+  MathUtils,
+} from 'three';
+
+// TreeOrbitControls performs orbiting, dollying (zooming), and panning.
+// Unlike TrackballControls, it maintains the "up" direction object.up (+Y by default).
+//
+//    Orbit - left mouse / touch: one-finger move
+//    Zoom - middle mouse, or mousewheel / touch: two-finger spread or squish
+//    Pan - right mouse, or left mouse + ctrl/meta/shiftKey, or arrow keys / touch: two-finger move
+
+const _changeEvent = { type: 'change' };
+const _startEvent = { type: 'start' };
+const _endEvent = { type: 'end' };
+const _ray = new Ray();
+const _plane = new Plane();
+const TILT_LIMIT = Math.cos(70 * MathUtils.DEG2RAD);
+
+class TreeOrbitControls extends EventDispatcher {
+  constructor(object, domElement) {
+    super();
+
+    this.object = object;
+    this.domElement = domElement;
+    this.domElement.style.touchAction = 'none'; // disable touch scroll
+
+    // Set to false to disable this control
+    this.enabled = true;
+
+    // "target" sets the location of focus, where the object orbits around
+    this.target = new Vector3();
+
+    // How far you can dolly in and out ( PerspectiveCamera only )
+    this.minDistance = 0;
+    this.maxDistance = Infinity;
+
+    // How far you can zoom in and out ( OrthographicCamera only )
+    this.minZoom = 0;
+    this.maxZoom = Infinity;
+
+    // How far you can orbit vertically, upper and lower limits.
+    // Range is 0 to Math.PI radians.
+    this.minPolarAngle = 0; // radians
+    this.maxPolarAngle = Math.PI; // radians
+
+    // How far you can orbit horizontally, upper and lower limits.
+    // If set, the interval [ min, max ] must be a sub-interval of [ - 2 PI, 2 PI ], with ( max - min < 2 PI )
+    this.minAzimuthAngle = -Infinity; // radians
+    this.maxAzimuthAngle = Infinity; // radians
+
+    // Set to true to enable damping (inertia)
+    // If damping is enabled, you must call controls.update() in your animation loop
+    this.enableDamping = false;
+    this.dampingFactor = 0.05;
+
+    // This option actually enables dollying in and out; left as "zoom" for backwards compatibility.
+    // Set to false to disable zooming
+    this.enableZoom = true;
+    this.zoomSpeed = 1.0;
+
+    // Set to false to disable rotating
+    this.enableRotate = true;
+    this.rotateSpeed = 1.0;
+
+    // Set to false to disable panning
+    this.enablePan = true;
+    this.panSpeed = 1.0;
+    this.screenSpacePanning = true; // if false, pan orthogonal to world-space direction camera.up
+    this.keyPanSpeed = 7.0; // pixels moved per arrow key push
+    this.zoomToCursor = false;
+
+    // Set to true to automatically rotate around the target
+    // If auto-rotate is enabled, you must call controls.update() in your animation loop
+    this.autoRotate = false;
+    this.autoRotateSpeed = 2.0; // 30 seconds per orbit when fps is 60
+
+    // The four arrow keys
+    this.keys = { LEFT: 'ArrowLeft', UP: 'ArrowUp', RIGHT: 'ArrowRight', BOTTOM: 'ArrowDown' };
+
+    // Mouse buttons
+    this.mouseButtons = { LEFT: MOUSE.ROTATE, MIDDLE: MOUSE.DOLLY, RIGHT: MOUSE.PAN };
+
+    // Touch fingers
+    this.touches = { ONE: TOUCH.ROTATE, TWO: TOUCH.DOLLY_PAN };
+
+    // for reset
+    this.target0 = this.target.clone();
+    this.position0 = this.object.position.clone();
+    this.zoom0 = this.object.zoom;
+
+    // the target DOM element for key events
+    this._domElementKeyEvents = null;
+
+    //
+    // public methods
+    //
+
+    this.getPolarAngle = function () {
+      return spherical.phi;
+    };
+
+    this.getAzimuthalAngle = function () {
+      return spherical.theta;
+    };
+
+    this.getDistance = function () {
+      return this.object.position.distanceTo(this.target);
+    };
+
+    this.listenToKeyEvents = function (domElement) {
+      domElement.addEventListener('keydown', onKeyDown);
+      this._domElementKeyEvents = domElement;
+    };
+
+    this.stopListenToKeyEvents = function () {
+      this._domElementKeyEvents.removeEventListener('keydown', onKeyDown);
+      this._domElementKeyEvents = null;
+    };
+
+    this.saveState = function () {
+      scope.target0.copy(scope.target);
+      scope.position0.copy(scope.object.position);
+      scope.zoom0 = scope.object.zoom;
+    };
+
+    this.reset = function () {
+      scope.target.copy(scope.target0);
+      scope.object.position.copy(scope.position0);
+      scope.object.zoom = scope.zoom0;
+
+      scope.object.updateProjectionMatrix();
+      scope.dispatchEvent(_changeEvent);
+
+      scope.update();
+
+      state = STATE.NONE;
+    };
+
+    // this method is exposed, but perhaps it would be better if we can make it private...
+    this.update = (function () {
+      const offset = new Vector3();
+
+      // so camera.up is the orbit axis
+      const quat = new Quaternion().setFromUnitVectors(object.up, new Vector3(0, 1, 0));
+      const quatInverse = quat.clone().invert();
+
+      const lastPosition = new Vector3();
+      const lastQuaternion = new Quaternion();
+      const lastTargetPosition = new Vector3();
+
+      const twoPI = 2 * Math.PI;
+
+      return function update(deltaTime = null) {
+        const position = scope.object.position;
+
+        offset.copy(position).sub(scope.target);
+
+        // rotate offset to "y-axis-is-up" space
+        offset.applyQuaternion(quat);
+
+        // angle from z-axis around y-axis
+        spherical.setFromVector3(offset);
+
+        if (scope.autoRotate && state === STATE.NONE) {
+          rotateLeft(getAutoRotationAngle(deltaTime));
+        }
+
+        if (scope.enableDamping) {
+          spherical.theta += sphericalDelta.theta * scope.dampingFactor;
+          spherical.phi += sphericalDelta.phi * scope.dampingFactor;
+        } else {
+          spherical.theta += sphericalDelta.theta;
+          spherical.phi += sphericalDelta.phi;
+        }
+
+        // restrict theta to be between desired limits
+
+        let min = scope.minAzimuthAngle;
+        let max = scope.maxAzimuthAngle;
+
+        if (isFinite(min) && isFinite(max)) {
+          if (min < -Math.PI) min += twoPI;
+          else if (min > Math.PI) min -= twoPI;
+
+          if (max < -Math.PI) max += twoPI;
+          else if (max > Math.PI) max -= twoPI;
+
+          if (min <= max) {
+            spherical.theta = Math.max(min, Math.min(max, spherical.theta));
+          } else {
+            spherical.theta =
+              spherical.theta > (min + max) / 2
+                ? Math.max(min, spherical.theta)
+                : Math.min(max, spherical.theta);
+          }
+        }
+
+        // restrict phi to be between desired limits
+        spherical.phi = Math.max(scope.minPolarAngle, Math.min(scope.maxPolarAngle, spherical.phi));
+
+        spherical.makeSafe();
+
+        // move target to panned location
+
+        if (scope.enableDamping === true) {
+          scope.target.addScaledVector(panOffset, scope.dampingFactor);
+        } else {
+          scope.target.add(panOffset);
+        }
+
+        // adjust the camera position based on zoom only if we're not zooming to the cursor or if it's an ortho camera
+        // we adjust zoom later in these cases
+        if ((scope.zoomToCursor && performCursorZoom) || scope.object.isOrthographicCamera) {
+          spherical.radius = clampDistance(spherical.radius);
+        } else {
+          spherical.radius = clampDistance(spherical.radius * scale);
+        }
+
+        offset.setFromSpherical(spherical);
+
+        // rotate offset back to "camera-up-vector-is-up" space
+        offset.applyQuaternion(quatInverse);
+
+        position.copy(scope.target).add(offset);
+
+        scope.object.lookAt(scope.target);
+
+        if (scope.enableDamping === true) {
+          sphericalDelta.theta *= 1 - scope.dampingFactor;
+          sphericalDelta.phi *= 1 - scope.dampingFactor;
+
+          panOffset.multiplyScalar(1 - scope.dampingFactor);
+        } else {
+          sphericalDelta.set(0, 0, 0);
+
+          panOffset.set(0, 0, 0);
+        }
+
+        // adjust camera position
+        let zoomChanged = false;
+        if (scope.zoomToCursor && performCursorZoom) {
+          let newRadius = null;
+          if (scope.object.isPerspectiveCamera) {
+            // move the camera down the pointer ray
+            // this method avoids floating point error
+            const prevRadius = offset.length();
+            newRadius = clampDistance(prevRadius * scale);
+
+            const radiusDelta = prevRadius - newRadius;
+            scope.object.position.addScaledVector(dollyDirection, radiusDelta);
+            scope.object.updateMatrixWorld();
+          } else if (scope.object.isOrthographicCamera) {
+            // adjust the ortho camera position based on zoom changes
+            const mouseBefore = new Vector3(mouse.x, mouse.y, 0);
+            mouseBefore.unproject(scope.object);
+
+            scope.object.zoom = Math.max(
+              scope.minZoom,
+              Math.min(scope.maxZoom, scope.object.zoom / scale)
+            );
+            scope.object.updateProjectionMatrix();
+            zoomChanged = true;
+
+            const mouseAfter = new Vector3(mouse.x, mouse.y, 0);
+            mouseAfter.unproject(scope.object);
+
+            scope.object.position.sub(mouseAfter).add(mouseBefore);
+            scope.object.updateMatrixWorld();
+
+            newRadius = offset.length();
+          } else {
+            console.warn(
+              'WARNING: index.js encountered an unknown camera type - zoom to cursor disabled.'
+            );
+            scope.zoomToCursor = false;
+          }
+
+          // handle the placement of the target
+          if (newRadius !== null) {
+            if (this.screenSpacePanning) {
+              // position the orbit target in front of the new camera position
+              scope.target
+                .set(0, 0, -1)
+                .transformDirection(scope.object.matrix)
+                .multiplyScalar(newRadius)
+                .add(scope.object.position);
+            } else {
+              // get the ray and translation plane to compute target
+              _ray.origin.copy(scope.object.position);
+              _ray.direction.set(0, 0, -1).transformDirection(scope.object.matrix);
+
+              // if the camera is 20 degrees above the horizon then don't adjust the focus target to avoid
+              // extremely large values
+              if (Math.abs(scope.object.up.dot(_ray.direction)) < TILT_LIMIT) {
+                object.lookAt(scope.target);
+              } else {
+                _plane.setFromNormalAndCoplanarPoint(scope.object.up, scope.target);
+                _ray.intersectPlane(_plane, scope.target);
+              }
+            }
+          }
+        } else if (scope.object.isOrthographicCamera) {
+          scope.object.zoom = Math.max(
+            scope.minZoom,
+            Math.min(scope.maxZoom, scope.object.zoom / scale)
+          );
+          scope.object.updateProjectionMatrix();
+          zoomChanged = true;
+        }
+
+        scale = 1;
+        performCursorZoom = false;
+
+        // update condition is:
+        // min(camera displacement, camera rotation in radians)^2 > EPS
+        // using small-angle approximation cos(x/2) = 1 - x^2 / 8
+
+        if (
+          zoomChanged ||
+          lastPosition.distanceToSquared(scope.object.position) > EPS ||
+          8 * (1 - lastQuaternion.dot(scope.object.quaternion)) > EPS ||
+          lastTargetPosition.distanceToSquared(scope.target) > 0
+        ) {
+          scope.dispatchEvent(_changeEvent);
+
+          lastPosition.copy(scope.object.position);
+          lastQuaternion.copy(scope.object.quaternion);
+          lastTargetPosition.copy(scope.target);
+
+          zoomChanged = false;
+
+          return true;
+        }
+
+        return false;
+      };
+    })();
+
+    this.dispose = function () {
+      scope.domElement.removeEventListener('contextmenu', onContextMenu);
+
+      scope.domElement.removeEventListener('pointerdown', onPointerDown);
+      scope.domElement.removeEventListener('pointercancel', onPointerUp);
+      scope.domElement.removeEventListener('wheel', onMouseWheel);
+
+      scope.domElement.removeEventListener('pointermove', onPointerMove);
+      scope.domElement.removeEventListener('pointerup', onPointerUp);
+
+      if (scope._domElementKeyEvents !== null) {
+        scope._domElementKeyEvents.removeEventListener('keydown', onKeyDown);
+        scope._domElementKeyEvents = null;
+      }
+
+      //scope.dispatchEvent( { type: 'dispose' } ); // should this be added here?
+    };
+
+    //
+    // internals
+    //
+
+    const scope = this;
+
+    const STATE = {
+      NONE: -1,
+      ROTATE: 0,
+      DOLLY: 1,
+      PAN: 2,
+      TOUCH_ROTATE: 3,
+      TOUCH_PAN: 4,
+      TOUCH_DOLLY_PAN: 5,
+      TOUCH_DOLLY_ROTATE: 6,
+    };
+
+    let state = STATE.NONE;
+
+    const EPS = 0.000001;
+
+    // current position in spherical coordinates
+    const spherical = new Spherical();
+    const sphericalDelta = new Spherical();
+
+    let scale = 1;
+    const panOffset = new Vector3();
+
+    const rotateStart = new Vector2();
+    const rotateEnd = new Vector2();
+    const rotateDelta = new Vector2();
+
+    const panStart = new Vector2();
+    const panEnd = new Vector2();
+    const panDelta = new Vector2();
+
+    const dollyStart = new Vector2();
+    const dollyEnd = new Vector2();
+    const dollyDelta = new Vector2();
+
+    const dollyDirection = new Vector3();
+    const mouse = new Vector2();
+    let performCursorZoom = false;
+
+    const pointers = [];
+    const pointerPositions = {};
+
+    function getAutoRotationAngle(deltaTime) {
+      if (deltaTime !== null) {
+        return ((2 * Math.PI) / 60) * scope.autoRotateSpeed * deltaTime;
+      } else {
+        return ((2 * Math.PI) / 60 / 60) * scope.autoRotateSpeed;
+      }
+    }
+
+    function getZoomScale() {
+      return Math.pow(0.95, scope.zoomSpeed);
+    }
+
+    function rotateLeft(angle) {
+      sphericalDelta.theta -= angle;
+    }
+
+    function rotateUp(angle) {
+      sphericalDelta.phi -= angle;
+    }
+
+    const panLeft = (function () {
+      const v = new Vector3();
+
+      return function panLeft(distance, objectMatrix) {
+        v.setFromMatrixColumn(objectMatrix, 0); // get X column of objectMatrix
+        v.multiplyScalar(-distance);
+
+        panOffset.add(v);
+      };
+    })();
+
+    const panUp = (function () {
+      const v = new Vector3();
+
+      return function panUp(distance, objectMatrix) {
+        if (scope.screenSpacePanning === true) {
+          v.setFromMatrixColumn(objectMatrix, 1);
+        } else {
+          v.setFromMatrixColumn(objectMatrix, 0);
+          v.crossVectors(scope.object.up, v);
+        }
+
+        v.multiplyScalar(distance);
+
+        panOffset.add(v);
+      };
+    })();
+
+    // deltaX and deltaY are in pixels; right and down are positive
+    const pan = (function () {
+      const offset = new Vector3();
+
+      return function pan(deltaX, deltaY) {
+        const element = scope.domElement;
+
+        if (scope.object.isPerspectiveCamera) {
+          // perspective
+          const position = scope.object.position;
+          offset.copy(position).sub(scope.target);
+          let targetDistance = offset.length();
+
+          // half of the fov is center to top of screen
+          targetDistance *= Math.tan(((scope.object.fov / 2) * Math.PI) / 180.0);
+
+          // we use only clientHeight here so aspect ratio does not distort speed
+          panLeft((2 * deltaX * targetDistance) / element.clientHeight, scope.object.matrix);
+          panUp((2 * deltaY * targetDistance) / element.clientHeight, scope.object.matrix);
+        } else if (scope.object.isOrthographicCamera) {
+          // orthographic
+          panLeft(
+            (deltaX * (scope.object.right - scope.object.left)) /
+              scope.object.zoom /
+              element.clientWidth,
+            scope.object.matrix
+          );
+          panUp(
+            (deltaY * (scope.object.top - scope.object.bottom)) /
+              scope.object.zoom /
+              element.clientHeight,
+            scope.object.matrix
+          );
+        } else {
+          // camera neither orthographic nor perspective
+          console.warn('WARNING: index.js encountered an unknown camera type - pan disabled.');
+          scope.enablePan = false;
+        }
+      };
+    })();
+
+    function dollyOut(dollyScale) {
+      if (scope.object.isPerspectiveCamera || scope.object.isOrthographicCamera) {
+        scale /= dollyScale;
+      } else {
+        console.warn('WARNING: index.js encountered an unknown camera type - dolly/zoom disabled.');
+        scope.enableZoom = false;
+      }
+    }
+
+    function dollyIn(dollyScale) {
+      if (scope.object.isPerspectiveCamera || scope.object.isOrthographicCamera) {
+        scale *= dollyScale;
+      } else {
+        console.warn('WARNING: index.js encountered an unknown camera type - dolly/zoom disabled.');
+        scope.enableZoom = false;
+      }
+    }
+
+    function updateMouseParameters(event) {
+      if (!scope.zoomToCursor) {
+        return;
+      }
+
+      performCursorZoom = true;
+
+      const rect = scope.domElement.getBoundingClientRect();
+      const x = event.clientX - rect.left;
+      const y = event.clientY - rect.top;
+      const w = rect.width;
+      const h = rect.height;
+
+      mouse.x = (x / w) * 2 - 1;
+      mouse.y = -(y / h) * 2 + 1;
+
+      dollyDirection
+        .set(mouse.x, mouse.y, 1)
+        .unproject(scope.object)
+        .sub(scope.object.position)
+        .normalize();
+    }
+
+    function clampDistance(dist) {
+      return Math.max(scope.minDistance, Math.min(scope.maxDistance, dist));
+    }
+
+    //
+    // event callbacks - update the object state
+    //
+
+    function handleMouseDownRotate(event) {
+      rotateStart.set(event.clientX, event.clientY);
+    }
+
+    function handleMouseDownDolly(event) {
+      updateMouseParameters(event);
+      dollyStart.set(event.clientX, event.clientY);
+    }
+
+    function handleMouseDownPan(event) {
+      panStart.set(event.clientX, event.clientY);
+    }
+
+    function handleMouseMoveRotate(event) {
+      rotateEnd.set(event.clientX, event.clientY);
+
+      rotateDelta.subVectors(rotateEnd, rotateStart).multiplyScalar(scope.rotateSpeed);
+
+      const element = scope.domElement;
+
+      rotateLeft((2 * Math.PI * rotateDelta.x) / element.clientHeight); // yes, height
+
+      rotateUp((2 * Math.PI * rotateDelta.y) / element.clientHeight);
+
+      rotateStart.copy(rotateEnd);
+
+      scope.update();
+    }
+
+    function handleMouseMoveDolly(event) {
+      dollyEnd.set(event.clientX, event.clientY);
+
+      dollyDelta.subVectors(dollyEnd, dollyStart);
+
+      if (dollyDelta.y > 0) {
+        dollyOut(getZoomScale());
+      } else if (dollyDelta.y < 0) {
+        dollyIn(getZoomScale());
+      }
+
+      dollyStart.copy(dollyEnd);
+
+      scope.update();
+    }
+
+    function handleMouseMovePan(event) {
+      panEnd.set(event.clientX, event.clientY);
+
+      panDelta.subVectors(panEnd, panStart).multiplyScalar(scope.panSpeed);
+
+      pan(panDelta.x, panDelta.y);
+
+      panStart.copy(panEnd);
+
+      scope.update();
+    }
+
+    function handleMouseWheel(event) {
+      updateMouseParameters(event);
+
+      if (event.deltaY < 0) {
+        dollyIn(getZoomScale());
+      } else if (event.deltaY > 0) {
+        dollyOut(getZoomScale());
+      }
+
+      scope.update();
+    }
+
+    function handleKeyDown(event) {
+      let needsUpdate = false;
+
+      switch (event.code) {
+        case scope.keys.UP:
+          if (event.ctrlKey || event.metaKey || event.shiftKey) {
+            rotateUp((2 * Math.PI * scope.rotateSpeed) / scope.domElement.clientHeight);
+          } else {
+            pan(0, scope.keyPanSpeed);
+          }
+
+          needsUpdate = true;
+          break;
+
+        case scope.keys.BOTTOM:
+          if (event.ctrlKey || event.metaKey || event.shiftKey) {
+            rotateUp((-2 * Math.PI * scope.rotateSpeed) / scope.domElement.clientHeight);
+          } else {
+            pan(0, -scope.keyPanSpeed);
+          }
+
+          needsUpdate = true;
+          break;
+
+        case scope.keys.LEFT:
+          if (event.ctrlKey || event.metaKey || event.shiftKey) {
+            rotateLeft((2 * Math.PI * scope.rotateSpeed) / scope.domElement.clientHeight);
+          } else {
+            pan(scope.keyPanSpeed, 0);
+          }
+
+          needsUpdate = true;
+          break;
+
+        case scope.keys.RIGHT:
+          if (event.ctrlKey || event.metaKey || event.shiftKey) {
+            rotateLeft((-2 * Math.PI * scope.rotateSpeed) / scope.domElement.clientHeight);
+          } else {
+            pan(-scope.keyPanSpeed, 0);
+          }
+
+          needsUpdate = true;
+          break;
+      }
+
+      if (needsUpdate) {
+        // prevent the browser from scrolling on cursor keys
+        event.preventDefault();
+
+        scope.update();
+      }
+    }
+
+    function handleTouchStartRotate() {
+      if (pointers.length === 1) {
+        rotateStart.set(pointers[0].pageX, pointers[0].pageY);
+      } else {
+        const x = 0.5 * (pointers[0].pageX + pointers[1].pageX);
+        const y = 0.5 * (pointers[0].pageY + pointers[1].pageY);
+
+        rotateStart.set(x, y);
+      }
+    }
+
+    function handleTouchStartPan() {
+      if (pointers.length === 1) {
+        panStart.set(pointers[0].pageX, pointers[0].pageY);
+      } else {
+        const x = 0.5 * (pointers[0].pageX + pointers[1].pageX);
+        const y = 0.5 * (pointers[0].pageY + pointers[1].pageY);
+
+        panStart.set(x, y);
+      }
+    }
+
+    function handleTouchStartDolly() {
+      const dx = pointers[0].pageX - pointers[1].pageX;
+      const dy = pointers[0].pageY - pointers[1].pageY;
+
+      const distance = Math.sqrt(dx * dx + dy * dy);
+
+      dollyStart.set(0, distance);
+    }
+
+    function handleTouchStartDollyPan() {
+      if (scope.enableZoom) handleTouchStartDolly();
+
+      if (scope.enablePan) handleTouchStartPan();
+    }
+
+    function handleTouchStartDollyRotate() {
+      if (scope.enableZoom) handleTouchStartDolly();
+
+      if (scope.enableRotate) handleTouchStartRotate();
+    }
+
+    function handleTouchMoveRotate(event) {
+      if (pointers.length == 1) {
+        rotateEnd.set(event.pageX, event.pageY);
+      } else {
+        const position = getSecondPointerPosition(event);
+
+        const x = 0.5 * (event.pageX + position.x);
+        const y = 0.5 * (event.pageY + position.y);
+
+        rotateEnd.set(x, y);
+      }
+
+      rotateDelta.subVectors(rotateEnd, rotateStart).multiplyScalar(scope.rotateSpeed);
+
+      const element = scope.domElement;
+
+      rotateLeft((2 * Math.PI * rotateDelta.x) / element.clientHeight); // yes, height
+
+      rotateUp((2 * Math.PI * rotateDelta.y) / element.clientHeight);
+
+      rotateStart.copy(rotateEnd);
+    }
+
+    function handleTouchMovePan(event) {
+      if (pointers.length === 1) {
+        panEnd.set(event.pageX, event.pageY);
+      } else {
+        const position = getSecondPointerPosition(event);
+
+        const x = 0.5 * (event.pageX + position.x);
+        const y = 0.5 * (event.pageY + position.y);
+
+        panEnd.set(x, y);
+      }
+
+      panDelta.subVectors(panEnd, panStart).multiplyScalar(scope.panSpeed);
+
+      pan(panDelta.x, panDelta.y);
+
+      panStart.copy(panEnd);
+    }
+
+    function handleTouchMoveDolly(event) {
+      const position = getSecondPointerPosition(event);
+
+      const dx = event.pageX - position.x;
+      const dy = event.pageY - position.y;
+
+      const distance = Math.sqrt(dx * dx + dy * dy);
+
+      dollyEnd.set(0, distance);
+
+      dollyDelta.set(0, Math.pow(dollyEnd.y / dollyStart.y, scope.zoomSpeed));
+
+      dollyOut(dollyDelta.y);
+
+      dollyStart.copy(dollyEnd);
+    }
+
+    function handleTouchMoveDollyPan(event) {
+      if (scope.enableZoom) handleTouchMoveDolly(event);
+
+      if (scope.enablePan) handleTouchMovePan(event);
+    }
+
+    function handleTouchMoveDollyRotate(event) {
+      if (scope.enableZoom) handleTouchMoveDolly(event);
+
+      if (scope.enableRotate) handleTouchMoveRotate(event);
+    }
+
+    //
+    // event handlers - FSM: listen for events and reset state
+    //
+
+    function onPointerDown(event) {
+      if (scope.enabled === false) return;
+
+      if (pointers.length === 0) {
+        scope.domElement.setPointerCapture(event.pointerId);
+
+        scope.domElement.addEventListener('pointermove', onPointerMove);
+        scope.domElement.addEventListener('pointerup', onPointerUp);
+      }
+
+      //
+
+      addPointer(event);
+
+      if (event.pointerType === 'touch') {
+        onTouchStart(event);
+      } else {
+        onMouseDown(event);
+      }
+    }
+
+    function onPointerMove(event) {
+      if (scope.enabled === false) return;
+
+      if (event.pointerType === 'touch') {
+        onTouchMove(event);
+      } else {
+        onMouseMove(event);
+      }
+    }
+
+    function onPointerUp(event) {
+      removePointer(event);
+
+      if (pointers.length === 0) {
+        scope.domElement.releasePointerCapture(event.pointerId);
+
+        scope.domElement.removeEventListener('pointermove', onPointerMove);
+        scope.domElement.removeEventListener('pointerup', onPointerUp);
+      }
+
+      scope.dispatchEvent(_endEvent);
+
+      state = STATE.NONE;
+    }
+
+    function onMouseDown(event) {
+      let mouseAction;
+
+      switch (event.button) {
+        case 0:
+          mouseAction = scope.mouseButtons.LEFT;
+          break;
+
+        case 1:
+          mouseAction = scope.mouseButtons.MIDDLE;
+          break;
+
+        case 2:
+          mouseAction = scope.mouseButtons.RIGHT;
+          break;
+
+        default:
+          mouseAction = -1;
+      }
+
+      switch (mouseAction) {
+        case MOUSE.DOLLY:
+          if (scope.enableZoom === false) return;
+
+          handleMouseDownDolly(event);
+
+          state = STATE.DOLLY;
+
+          break;
+
+        case MOUSE.ROTATE:
+          if (event.ctrlKey || event.metaKey || event.shiftKey) {
+            if (scope.enablePan === false) return;
+
+            handleMouseDownPan(event);
+
+            state = STATE.PAN;
+          } else {
+            if (scope.enableRotate === false) return;
+
+            handleMouseDownRotate(event);
+
+            state = STATE.ROTATE;
+          }
+
+          break;
+
+        case MOUSE.PAN:
+          if (event.ctrlKey || event.metaKey || event.shiftKey) {
+            if (scope.enableRotate === false) return;
+
+            handleMouseDownRotate(event);
+
+            state = STATE.ROTATE;
+          } else {
+            if (scope.enablePan === false) return;
+
+            handleMouseDownPan(event);
+
+            state = STATE.PAN;
+          }
+
+          break;
+
+        default:
+          state = STATE.NONE;
+      }
+
+      if (state !== STATE.NONE) {
+        scope.dispatchEvent(_startEvent);
+      }
+    }
+
+    function onMouseMove(event) {
+      switch (state) {
+        case STATE.ROTATE:
+          if (scope.enableRotate === false) return;
+
+          handleMouseMoveRotate(event);
+
+          break;
+
+        case STATE.DOLLY:
+          if (scope.enableZoom === false) return;
+
+          handleMouseMoveDolly(event);
+
+          break;
+
+        case STATE.PAN:
+          if (scope.enablePan === false) return;
+
+          handleMouseMovePan(event);
+
+          break;
+      }
+    }
+
+    function onMouseWheel(event) {
+      if (scope.enabled === false || scope.enableZoom === false || state !== STATE.NONE) return;
+
+      event.preventDefault();
+
+      scope.dispatchEvent(_startEvent);
+
+      handleMouseWheel(event);
+
+      scope.dispatchEvent(_endEvent);
+    }
+
+    function onKeyDown(event) {
+      if (scope.enabled === false || scope.enablePan === false) return;
+
+      handleKeyDown(event);
+    }
+
+    function onTouchStart(event) {
+      trackPointer(event);
+
+      switch (pointers.length) {
+        case 1:
+          switch (scope.touches.ONE) {
+            case TOUCH.ROTATE:
+              if (scope.enableRotate === false) return;
+
+              handleTouchStartRotate();
+
+              state = STATE.TOUCH_ROTATE;
+
+              break;
+
+            case TOUCH.PAN:
+              if (scope.enablePan === false) return;
+
+              handleTouchStartPan();
+
+              state = STATE.TOUCH_PAN;
+
+              break;
+
+            default:
+              state = STATE.NONE;
+          }
+
+          break;
+
+        case 2:
+          switch (scope.touches.TWO) {
+            case TOUCH.DOLLY_PAN:
+              if (scope.enableZoom === false && scope.enablePan === false) return;
+
+              handleTouchStartDollyPan();
+
+              state = STATE.TOUCH_DOLLY_PAN;
+
+              break;
+
+            case TOUCH.DOLLY_ROTATE:
+              if (scope.enableZoom === false && scope.enableRotate === false) return;
+
+              handleTouchStartDollyRotate();
+
+              state = STATE.TOUCH_DOLLY_ROTATE;
+
+              break;
+
+            default:
+              state = STATE.NONE;
+          }
+
+          break;
+
+        default:
+          state = STATE.NONE;
+      }
+
+      if (state !== STATE.NONE) {
+        scope.dispatchEvent(_startEvent);
+      }
+    }
+
+    function onTouchMove(event) {
+      trackPointer(event);
+
+      switch (state) {
+        case STATE.TOUCH_ROTATE:
+          if (scope.enableRotate === false) return;
+
+          handleTouchMoveRotate(event);
+
+          scope.update();
+
+          break;
+
+        case STATE.TOUCH_PAN:
+          if (scope.enablePan === false) return;
+
+          handleTouchMovePan(event);
+
+          scope.update();
+
+          break;
+
+        case STATE.TOUCH_DOLLY_PAN:
+          if (scope.enableZoom === false && scope.enablePan === false) return;
+
+          handleTouchMoveDollyPan(event);
+
+          scope.update();
+
+          break;
+
+        case STATE.TOUCH_DOLLY_ROTATE:
+          if (scope.enableZoom === false && scope.enableRotate === false) return;
+
+          handleTouchMoveDollyRotate(event);
+
+          scope.update();
+
+          break;
+
+        default:
+          state = STATE.NONE;
+      }
+    }
+
+    function onContextMenu(event) {
+      if (scope.enabled === false) return;
+
+      event.preventDefault();
+    }
+
+    function addPointer(event) {
+      pointers.push(event);
+    }
+
+    function removePointer(event) {
+      delete pointerPositions[event.pointerId];
+
+      for (let i = 0; i < pointers.length; i++) {
+        if (pointers[i].pointerId == event.pointerId) {
+          pointers.splice(i, 1);
+          return;
+        }
+      }
+    }
+
+    function trackPointer(event) {
+      let position = pointerPositions[event.pointerId];
+
+      if (position === undefined) {
+        position = new Vector2();
+        pointerPositions[event.pointerId] = position;
+      }
+
+      position.set(event.pageX, event.pageY);
+    }
+
+    function getSecondPointerPosition(event) {
+      const pointer = event.pointerId === pointers[0].pointerId ? pointers[1] : pointers[0];
+
+      return pointerPositions[pointer.pointerId];
+    }
+
+    this.connect = (domElement2) => {
+      if (domElement2 === document) {
+        console.error(
+          'THREE.OrbitControls: "document" should not be used as the target "domElement". Please use "renderer.domElement" instead.'
+        );
+      }
+      scope.domElement = domElement2;
+      scope.domElement.addEventListener('contextmenu', onContextMenu);
+      scope.domElement.addEventListener('pointerdown', onPointerDown);
+      scope.domElement.addEventListener('pointercancel', onPointerUp);
+      scope.domElement.addEventListener('wheel', onMouseWheel, { passive: false });
+    };
+
+    scope.domElement.addEventListener('contextmenu', onContextMenu);
+
+    scope.domElement.addEventListener('pointerdown', onPointerDown);
+    scope.domElement.addEventListener('pointercancel', onPointerUp);
+    scope.domElement.addEventListener('wheel', onMouseWheel, { passive: false });
+
+    // force an update at start
+
+    this.update();
+  }
+}
+
+export { TreeOrbitControls };
diff --git a/src/preview/components/model-viewer/OrbitControls/index.d.ts b/src/preview/components/model-viewer/OrbitControls/index.d.ts
new file mode 100644
index 0000000..d3d3c82
--- /dev/null
+++ b/src/preview/components/model-viewer/OrbitControls/index.d.ts
@@ -0,0 +1,31 @@
+//Этот файл был взят из node_modules/@react-three/drei/core/OrbitControls.d.ts, переименован,
+//а также в нём поменяли импорт дефолтного OrbitControls на ./index
+
+import { ReactThreeFiber } from "@react-three/fiber";
+import { ForwardRefComponent } from "@react-three/drei/helpers/ts-utils";
+import { OrbitControlsChangeEvent } from "@react-three/drei";
+import type { Camera, Event } from "three";
+import { OrbitControls as OrbitControlsImpl } from "./index";
+
+export declare type OrbitControlsProps = Omit<
+  ReactThreeFiber.Overwrite<
+    ReactThreeFiber.Object3DNode<OrbitControlsImpl, typeof OrbitControlsImpl>,
+    {
+      camera?: Camera;
+      domElement?: HTMLElement;
+      enableDamping?: boolean;
+      makeDefault?: boolean;
+      onChange?: (e?: OrbitControlsChangeEvent) => void;
+      onEnd?: (e?: Event) => void;
+      onStart?: (e?: Event) => void;
+      regress?: boolean;
+      target?: ReactThreeFiber.Vector3;
+      keyEvents?: boolean | HTMLElement;
+    }
+  >,
+  "ref"
+>;
+export declare const OrbitControls: ForwardRefComponent<
+  OrbitControlsProps,
+  OrbitControlsImpl
+>;
diff --git a/src/preview/components/model-viewer/OrbitControls/index.js b/src/preview/components/model-viewer/OrbitControls/index.js
new file mode 100644
index 0000000..a367ea9
--- /dev/null
+++ b/src/preview/components/model-viewer/OrbitControls/index.js
@@ -0,0 +1,96 @@
+//Этот файл был взят из node_modules/@react-three/drei/core/OrbitControls.js, переименован,
+//а также в нём поменяли импорт дефолтного OrbitControls на ./TreeOrbitControls.js
+//и в строчке кода 37 для инициализации объекта добавили параметр в конструктор explDomElement для TreeOrbitControls
+
+import { useThree, useFrame } from "@react-three/fiber";
+import * as React from "react";
+import { TreeOrbitControls } from "./TreeOrbitControls.js";
+
+export const OrbitControls = React.forwardRef(
+  (
+    {
+      makeDefault,
+      camera,
+      regress,
+      domElement,
+      enableDamping = true,
+      keyEvents = false,
+      onChange,
+      onStart,
+      onEnd,
+      ...restProps
+    },
+    ref
+  ) => {
+    const invalidate = useThree((state) => state.invalidate);
+    const defaultCamera = useThree((state) => state.camera);
+    const gl = useThree((state) => state.gl);
+    const events = useThree((state) => state.events);
+    const setEvents = useThree((state) => state.setEvents);
+    const set = useThree((state) => state.set);
+    const get = useThree((state) => state.get);
+    const performance = useThree((state) => state.performance);
+    const explCamera = camera || defaultCamera;
+    const explDomElement = domElement || events.connected || gl.domElement;
+    const controls = React.useMemo(
+      () => new TreeOrbitControls(explCamera, explDomElement),
+      [explCamera]
+    );
+    useFrame(() => {
+      if (controls.enabled) controls.update();
+    }, -1);
+    React.useEffect(() => {
+      if (keyEvents) {
+        controls.connect(keyEvents === true ? explDomElement : keyEvents);
+      }
+
+      controls.connect(explDomElement);
+      return () => void controls.dispose();
+    }, [keyEvents, explDomElement, regress, controls, invalidate]);
+    React.useEffect(() => {
+      const callback = (e) => {
+        invalidate();
+        if (regress) performance.regress();
+        if (onChange) onChange(e);
+      };
+
+      const onStartCb = (e) => {
+        if (onStart) onStart(e);
+      };
+
+      const onEndCb = (e) => {
+        if (onEnd) onEnd(e);
+      };
+
+      controls.addEventListener("change", callback);
+      controls.addEventListener("start", onStartCb);
+      controls.addEventListener("end", onEndCb);
+      return () => {
+        controls.removeEventListener("start", onStartCb);
+        controls.removeEventListener("end", onEndCb);
+        controls.removeEventListener("change", callback);
+      };
+    }, [onChange, onStart, onEnd, controls, invalidate, setEvents]);
+    React.useEffect(() => {
+      if (makeDefault) {
+        const old = get().controls;
+        set({
+          controls,
+        });
+        return () =>
+          set({
+            controls: old,
+          });
+      }
+    }, [makeDefault, controls]);
+    return /*#__PURE__*/ React.createElement(
+      "primitive",
+      {
+        ref: ref,
+        object: controls,
+        enableDamping: enableDamping,
+      },
+      restProps
+    );
+  }
+);
diff --git a/src/preview/components/model-viewer/fitCameraToObject.ts b/src/preview/components/model-viewer/fitCameraToObject.ts
new file mode 100644
index 0000000..557d147
--- /dev/null
+++ b/src/preview/components/model-viewer/fitCameraToObject.ts
@@ -0,0 +1,22 @@
+import { Box3, Object3D, PerspectiveCamera, Vector3 } from "three";
+
+const center = new Vector3();
+const size = new Vector3();
+const boundingBox = new Box3();
+
+export function fitCameraToObject(camera: PerspectiveCamera, object: Object3D) {
+  boundingBox.setFromObject(object);
+  boundingBox.getCenter(center);
+  boundingBox.getSize(size);
+
+  // get the max side of the bounding box (fits to width OR height as needed )
+  const maxDim = Math.max(size.x, size.y, size.z);
+
+  camera.position.z = maxDim;
+  camera.position.y = maxDim;
+  camera.position.x = maxDim;
+
+  camera.updateProjectionMatrix();
+
+  camera.lookAt(center);
+}
diff --git a/src/preview/components/model-viewer/index.ts b/src/preview/components/model-viewer/index.ts
new file mode 100644
index 0000000..a4f89fb
--- /dev/null
+++ b/src/preview/components/model-viewer/index.ts
@@ -0,0 +1 @@
+export * from './ModelViewer';
diff --git a/src/preview/components/route-preview/components/RoutePreview.tsx b/src/preview/components/route-preview/components/RoutePreview.tsx
new file mode 100644
index 0000000..1d4fcb4
--- /dev/null
+++ b/src/preview/components/route-preview/components/RoutePreview.tsx
@@ -0,0 +1,8 @@
+import { MapWidgetProvider } from "@mt/components";
+import { RoutePreviewContainer } from "./RoutePreviewContainer";
+
+export const RoutePreview = () => (
+  <MapWidgetProvider>
+    <RoutePreviewContainer />
+  </MapWidgetProvider>
+);
diff --git a/src/preview/components/route-preview/components/RoutePreviewContainer.tsx b/src/preview/components/route-preview/components/RoutePreviewContainer.tsx
new file mode 100644
index 0000000..6bd7085
--- /dev/null
+++ b/src/preview/components/route-preview/components/RoutePreviewContainer.tsx
@@ -0,0 +1,82 @@
+import { useGetRouteData } from "../hooks/useGetRouteData";
+import { useUpdateRouteData } from "../hooks/useUpdateRouteData";
+import {
+  MapSettings,
+  MapWidget,
+  RouteInfoData,
+  useMapWidgetContext,
+} from "@mt/components";
+import { SettingsPanel } from "./SettingsPanel/SettingsPanel";
+import { useEffect, useState } from "react";
+import { RoutePreviewDashboard } from "./RoutePreviewDashboard/RoutePreviewDashboard";
+import { LocalizedStringDefaults } from "@mt/common-types";
+import { useParams } from "react-router";
+
+export const RoutePreviewContainer = () => {
+  const { routeId } = useParams();
+  const { routeData, mappedData, isLoading, isError } =
+    useGetRouteData(routeId);
+  const updateRouteView = useUpdateRouteData(routeId, routeData);
+  const [routeInfo, setRouteInfo] = useState<RouteInfoData>();
+
+  const {
+    onMapDataFetched,
+    setCurrentPosition,
+    middleTrackCoordinates,
+    setIsEditMode,
+    getUpdatedStations,
+  } = useMapWidgetContext();
+
+  const handleSubmit = (mapSettings: MapSettings) => {
+    updateRouteView(mapSettings, getUpdatedStations());
+  };
+
+  useEffect(() => {
+    if (!mappedData) {
+      return;
+    }
+
+    onMapDataFetched(mappedData);
+    setCurrentPosition(middleTrackCoordinates);
+    setIsEditMode(true);
+
+    setRouteInfo({
+      routeNumber: routeData?.number ?? "",
+      firstStationName:
+        mappedData.stationsOnMap.at(0)?.shortName ?? LocalizedStringDefaults,
+      lastStationName:
+        mappedData.stationsOnMap.at(-1)?.shortName ?? LocalizedStringDefaults,
+    });
+  }, [mappedData, middleTrackCoordinates]);
+
+  if (isLoading) {
+    return (
+      <div
+        className="g-flex-column g-flex--align-center g-flex--justify-center"
+        style={{ height: "1000px" }}
+      >
+        Загрузка...
+      </div>
+    );
+  }
+
+  if (isError) {
+    return (
+      <div
+        className="g-flex-column g-flex--align-center g-flex--justify-center"
+        style={{ height: "1000px" }}
+      >
+        Ошибка получения данных
+      </div>
+    );
+  }
+
+  if (mappedData) {
+    return (
+      <RoutePreviewDashboard routeInfo={routeInfo}>
+        <MapWidget />
+        {/* <SettingsPanel onSubmit={handleSubmit} /> */}
+      </RoutePreviewDashboard>
+    );
+  }
+};
diff --git a/src/preview/components/route-preview/components/RoutePreviewDashboard/RoutePreviewDashboard.module.css b/src/preview/components/route-preview/components/RoutePreviewDashboard/RoutePreviewDashboard.module.css
new file mode 100644
index 0000000..17bed23
--- /dev/null
+++ b/src/preview/components/route-preview/components/RoutePreviewDashboard/RoutePreviewDashboard.module.css
@@ -0,0 +1,79 @@
+.root {
+  background-color: #000000;
+  width: 1920px;
+  height: 1080px;
+
+  position: relative;
+  overflow: hidden;
+  display: flex;
+}
+
+.container {
+  position: relative;
+  width: 100%;
+  height: 100%;
+
+  margin-left: 0;
+
+  transition: margin-left ease-in-out 0.3s;
+}
+
+.pushed {
+  margin-left: 290px;
+}
+
+.leftTopWrapper {
+  position: absolute;
+  z-index: 10;
+}
+
+.routeNumber {
+  margin: 32px;
+}
+
+.weatherWidget {
+  margin: 32px;
+}
+
+.rightSidebar {
+  flex-shrink: 0;
+  margin: 32px 32px 32px 0;
+  height: calc(100% - 57px);
+  width: 545px;
+  color: #ffffff;
+  background: #806c59;
+  border: 2px solid #806c59;
+  border-radius: 10px;
+}
+
+.transferPlaceholder {
+  position: absolute;
+  bottom: 12px;
+  right: 32px;
+}
+
+.toggleTransferBtn {
+  width: 48px;
+  height: 48px;
+  border: 0;
+  padding: 0;
+  background: none;
+  cursor: pointer;
+}
+
+.transferPopup {
+  position: absolute;
+  right: 48px;
+  bottom: 0;
+
+  width: 371px;
+  height: 180px;
+
+  padding: 16px;
+  margin-right: 16px;
+  border-radius: 10px;
+
+  background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%),
+    rgba(179, 165, 152, 0.4);
+  box-shadow: inset 4px 4px 12px rgba(255, 255, 255, 0.12);
+}
diff --git a/src/preview/components/route-preview/components/RoutePreviewDashboard/RoutePreviewDashboard.tsx b/src/preview/components/route-preview/components/RoutePreviewDashboard/RoutePreviewDashboard.tsx
new file mode 100644
index 0000000..7f6c52d
--- /dev/null
+++ b/src/preview/components/route-preview/components/RoutePreviewDashboard/RoutePreviewDashboard.tsx
@@ -0,0 +1,54 @@
+import {
+  Drawer,
+  Icons,
+  RouteInfoData,
+  RouteInfoWidget,
+  WeatherWidget,
+} from "@mt/components";
+import { HTMLAttributes, useContext, useState } from "react";
+import cn from "classnames";
+import { LocalizationContext } from "@mt/i18n";
+import styles from "./RoutePreviewDashboard.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  routeInfo: RouteInfoData;
+}
+
+export const RoutePreviewDashboard = ({ children, routeInfo }: Props) => {
+  const { setLocale } = useContext(LocalizationContext);
+  const [openNav, setOpenNav] = useState(false);
+  const [openTransfers, setOpenTransfer] = useState(false);
+
+  return (
+    <div className={styles.root}>
+      <Drawer
+        isOpen={openNav}
+        onToggle={setOpenNav}
+        onLocaleChange={setLocale}
+      />
+
+      <div className={cn(styles.container, { [styles.pushed]: openNav })}>
+        <div className={styles.leftTopWrapper}>
+          <RouteInfoWidget
+            className={styles.routeNumber}
+            routeInfo={routeInfo}
+          />
+          <WeatherWidget className={styles.weatherWidget} />
+        </div>
+
+        {children}
+
+        <div className={styles.transferPlaceholder}>
+          <Icons.InfoBtn
+            className={styles.toggleTransferBtn}
+            onClick={() => setOpenTransfer(!openTransfers)}
+          />
+
+          {openTransfers ? <div className={styles.transferPopup} /> : null}
+        </div>
+      </div>
+
+      <div className={styles.rightSidebar} />
+    </div>
+  );
+};
diff --git a/src/preview/components/route-preview/components/SettingsPanel/SettingsPanel.module.css b/src/preview/components/route-preview/components/SettingsPanel/SettingsPanel.module.css
new file mode 100644
index 0000000..f196ae0
--- /dev/null
+++ b/src/preview/components/route-preview/components/SettingsPanel/SettingsPanel.module.css
@@ -0,0 +1,28 @@
+.root {
+  position: fixed;
+  z-index: 100;
+  right: var(--scroll-bar-width, 0);
+  bottom: var(--horizontal-scroll-bar-width, 0);
+  width: 600px;
+  background-color: #cccccc;
+
+  transform: translateY(100%);
+  padding: 10px;
+}
+
+.rootOpened {
+  transform: translateY(0);
+}
+
+.togglePanelBtn {
+  cursor: pointer;
+  position: absolute;
+  top: -10px;
+  right: 10px;
+  transform: translateY(-100%);
+  color: #ffffff;
+  border: 1px solid;
+  border-radius: 5px;
+  padding: 1.5px;
+  background: rgba(0, 0, 0, 0.5);
+}
diff --git a/src/preview/components/route-preview/components/SettingsPanel/SettingsPanel.tsx b/src/preview/components/route-preview/components/SettingsPanel/SettingsPanel.tsx
new file mode 100644
index 0000000..656a850
--- /dev/null
+++ b/src/preview/components/route-preview/components/SettingsPanel/SettingsPanel.tsx
@@ -0,0 +1,105 @@
+import cn from 'classnames';
+import SettingsIcon from '@mui/icons-material/Settings';
+import { Button, FormControlLabel, Switch } from '@mui/material';
+import { FormProvider } from 'react-hook-form';
+import { useState } from 'react';
+
+import { useMapWidgetContext, MapSettings } from '@mt/components';
+import { CoordinateField, ScaleField, RotationField, StationSelectField } from './settigs-fields';
+import styles from './SettingsPanel.module.css';
+import { useToggleScrollable } from '@mt/utils';
+
+interface Props {
+  onSubmit?: (data: MapSettings) => void;
+}
+
+export const SettingsPanel = ({ onSubmit }: Props) => {
+  const [isOpened, setOpened] = useState(true);
+  const { enableScroll, disableScroll } = useToggleScrollable();
+
+  const {
+    settingsForm,
+    onSettingsFormChange,
+    stations,
+    isDragMode,
+    setIsDragMode,
+    isMapDataChanged,
+  } = useMapWidgetContext();
+
+  const handleGoBack = () => {
+    if (
+      isMapDataChanged &&
+      !window.confirm('Изменения не сохранены! Вы уверены, что хотите покинуть страницу?')
+    ) {
+      return;
+    }
+
+    window.history.back();
+  };
+
+  return (
+    <FormProvider {...settingsForm}>
+      <form
+        className={cn('g-flex', styles.root, { [styles.rootOpened]: isOpened })}
+        onChange={() => onSettingsFormChange()}
+        onSubmit={settingsForm.handleSubmit(onSubmit)}
+      >
+        <SettingsIcon
+          className={styles.togglePanelBtn}
+          fontSize="large"
+          onClick={() => setOpened(!isOpened)}
+        />
+
+        <div className="g-flex-column g-flex__item">
+          <RotationField
+            name="rotateAngle"
+            label="Угол поворота карты"
+            onFocus={disableScroll}
+            onBlur={enableScroll}
+          />
+
+          <CoordinateField name="center" label="Координаты центра" />
+
+          <FormControlLabel
+            label="Включите для изменения центра карты с помощью мышки"
+            control={
+              <Switch checked={isDragMode} onChange={() => setIsDragMode((isDrag) => !isDrag)} />
+            }
+          />
+
+          <ScaleField
+            name="fullScale"
+            label="Масштаб 1"
+            onFocus={disableScroll}
+            onBlur={enableScroll}
+          />
+
+          <StationSelectField
+            name="currentStationId"
+            label="Выберете остановку"
+            hint="Для настройки масштаба при приближении к остановкам"
+            stations={stations}
+            onOpen={disableScroll}
+            onClose={enableScroll}
+            onChange={() => onSettingsFormChange()}
+          />
+
+          <ScaleField
+            name="zoomedScale"
+            label="Масштаб 2"
+            onFocus={disableScroll}
+            onBlur={enableScroll}
+          />
+
+          <Button type="submit" disabled={!isMapDataChanged}>
+            Сохранить изменения
+          </Button>
+
+          <Button type="button" onClick={handleGoBack}>
+            Назад
+          </Button>
+        </div>
+      </form>
+    </FormProvider>
+  );
+};
diff --git a/src/preview/components/route-preview/components/SettingsPanel/settigs-fields/CoordinateField.tsx b/src/preview/components/route-preview/components/SettingsPanel/settigs-fields/CoordinateField.tsx
new file mode 100644
index 0000000..8ea6036
--- /dev/null
+++ b/src/preview/components/route-preview/components/SettingsPanel/settigs-fields/CoordinateField.tsx
@@ -0,0 +1,59 @@
+import { TextField } from '@mui/material';
+import { Controller, useFormContext } from 'react-hook-form';
+import { ChangeEvent, useCallback } from 'react';
+import { Coordinates } from '@mt/common-types';
+import { FieldProps } from './field-props.interface';
+
+interface CoordinateFieldProps extends FieldProps {
+  onChange?: (event: ChangeEvent) => void;
+}
+
+const COORDINATE_PATTERN = /^(-?\d+(\.\d+)?),(\s*)(-?\d+(\.\d+)?)$/;
+const formatValue = (value: string | Coordinates) =>
+  typeof value === 'string' ? value : `${value.lat}, ${value.lon}`;
+export const CoordinateField = ({ name, label, hint, onChange }: CoordinateFieldProps) => {
+  const { getFieldState, control, setError, clearErrors } = useFormContext();
+
+  const handleChange = useCallback(
+    ({ target }, field) => {
+      const { value } = target;
+
+      let newValue: string | { lat: number; lon: number } = value;
+
+      if (COORDINATE_PATTERN.test(value)) {
+        const matches = value.match(COORDINATE_PATTERN) || [];
+        const [lat, lon] = (matches[0] ?? '').split(',');
+
+        newValue = { lat: Number(lat?.trim()), lon: Number(lon?.trim()) };
+        clearErrors();
+      } else {
+        setError(field.name, {
+          message: 'Неверный формат координаты',
+        });
+      }
+
+      return field.onChange(newValue);
+    },
+    [clearErrors, setError]
+  );
+
+  return (
+    <Controller
+      name={name}
+      control={control}
+      render={({ field }) => (
+        <TextField
+          type="text"
+          label={label}
+          value={formatValue(field.value)}
+          onChange={(e) => {
+            onChange?.(e);
+            handleChange(e, field);
+          }}
+          error={getFieldState(field.name).invalid}
+          helperText={getFieldState(field.name).error?.message || hint || ''}
+        />
+      )}
+    />
+  );
+};
diff --git a/src/preview/components/route-preview/components/SettingsPanel/settigs-fields/RotationField.tsx b/src/preview/components/route-preview/components/SettingsPanel/settigs-fields/RotationField.tsx
new file mode 100644
index 0000000..fd14d52
--- /dev/null
+++ b/src/preview/components/route-preview/components/SettingsPanel/settigs-fields/RotationField.tsx
@@ -0,0 +1,61 @@
+import { Controller, useFormContext } from 'react-hook-form';
+import { TextField } from '@mui/material';
+import { useCallback } from 'react';
+import { FieldProps } from './field-props.interface';
+import { TextFieldProps } from '@mui/material/TextField/TextField';
+
+function isValidNumberInRange(value: string | number) {
+  const numberValue = Number(value);
+
+  // Check if the value is a valid number, not NaN, within the range of -360 to 360,
+  // and disallow leading zeros (except for the value "0")
+  return (
+    !isNaN(numberValue) &&
+    /^-?(0|[1-9]\d*)$/.test(value.toString()) &&
+    numberValue >= -360 &&
+    numberValue <= 360
+  );
+}
+
+export const RotationField = ({ name, label, hint, ...props }: FieldProps & TextFieldProps) => {
+  const { control, getFieldState, setError, clearErrors } = useFormContext();
+
+  const handleChange = useCallback(
+    ({ target }, field) => {
+      const { value } = target;
+
+      let newValue: string | number = value;
+
+      if (isValidNumberInRange(value)) {
+        newValue = Number(value);
+        clearErrors(field.name);
+      } else {
+        setError(field.name, {
+          message: 'Неверный формат. Значение должно быть числом от -360 до 360',
+        });
+      }
+
+      return field.onChange(newValue);
+    },
+    [clearErrors, setError]
+  );
+
+  return (
+    <Controller
+      name={name}
+      control={control}
+      render={({ field }) => (
+        <TextField
+          type="number"
+          label={label}
+          inputProps={{ min: -360, max: 360 }}
+          value={field.value}
+          onChange={(e) => handleChange(e, field)}
+          error={getFieldState(field.name).invalid}
+          helperText={getFieldState(field.name).error?.message || hint || ''}
+          {...props}
+        />
+      )}
+    />
+  );
+};
diff --git a/src/preview/components/route-preview/components/SettingsPanel/settigs-fields/ScaleField.tsx b/src/preview/components/route-preview/components/SettingsPanel/settigs-fields/ScaleField.tsx
new file mode 100644
index 0000000..5eb6cea
--- /dev/null
+++ b/src/preview/components/route-preview/components/SettingsPanel/settigs-fields/ScaleField.tsx
@@ -0,0 +1,50 @@
+import { TextField } from '@mui/material';
+import { Controller, useFormContext } from 'react-hook-form';
+import { useCallback } from 'react';
+import { FieldProps } from './field-props.interface';
+import { TextFieldProps } from '@mui/material/TextField/TextField';
+
+const SCALE_PATTERN = /^[1-9]\d*$/;
+
+export const ScaleField = ({ label, name, hint, ...props }: FieldProps & TextFieldProps) => {
+  const { control, getFieldState, setError, clearErrors } = useFormContext();
+
+  const handleChange = useCallback(
+    ({ target }, field) => {
+      const { value } = target;
+
+      let newValue: string | number = value;
+
+      if (SCALE_PATTERN.test(value)) {
+        newValue = Number(value);
+        clearErrors(field.name);
+      } else {
+        setError(field.name, {
+          message: 'Неверный формат. Масштаб должен быть положительным числом',
+        });
+      }
+
+      return field.onChange(newValue);
+    },
+    [clearErrors, setError]
+  );
+
+  return (
+    <Controller
+      control={control}
+      name={name}
+      render={({ field }) => (
+        <TextField
+          type="number"
+          label={label}
+          inputProps={{ step: 1000, min: 0 }}
+          value={field.value}
+          onChange={(e) => handleChange(e, field)}
+          error={getFieldState(field.name).invalid}
+          helperText={getFieldState(field.name).error?.message || hint || ''}
+          {...props}
+        />
+      )}
+    />
+  );
+};
diff --git a/src/preview/components/route-preview/components/SettingsPanel/settigs-fields/StationSelectField.tsx b/src/preview/components/route-preview/components/SettingsPanel/settigs-fields/StationSelectField.tsx
new file mode 100644
index 0000000..16ab6ce
--- /dev/null
+++ b/src/preview/components/route-preview/components/SettingsPanel/settigs-fields/StationSelectField.tsx
@@ -0,0 +1,65 @@
+import {
+  FormControl,
+  FormHelperText,
+  InputLabel,
+  MenuItem,
+  Select,
+  SelectChangeEvent,
+} from '@mui/material';
+import { StationOnMap } from '@mt/components';
+import { useId } from 'react';
+import { Controller, useFormContext } from 'react-hook-form';
+import { FieldProps } from './field-props.interface';
+
+interface StationSelectFieldProps extends FieldProps {
+  onChange: () => void;
+  onOpen?: () => void;
+  onClose?: () => void;
+  stations: StationOnMap[];
+}
+
+export const StationSelectField = ({
+  name,
+  onChange,
+  stations,
+  label,
+  hint,
+  ...selectProps
+}: StationSelectFieldProps) => {
+  const labelId = useId();
+  const { control } = useFormContext();
+
+  const handleChange = ({ target: { value } }: SelectChangeEvent, field) => {
+    field.onChange(value);
+    onChange();
+  };
+
+  return (
+    <Controller
+      control={control}
+      name={name}
+      defaultValue=""
+      render={({ field }) => (
+        <FormControl>
+          <InputLabel id={labelId}>{label}</InputLabel>
+          <Select
+            labelId={labelId}
+            value={field.value}
+            onChange={(e) => handleChange(e, field)}
+            {...selectProps}
+          >
+            <MenuItem value="">Станция не выбрана</MenuItem>
+
+            {stations.map((station) => (
+              <MenuItem value={station.id} key={station.id}>
+                {station.name.ru}
+              </MenuItem>
+            ))}
+          </Select>
+
+          <FormHelperText>{hint}</FormHelperText>
+        </FormControl>
+      )}
+    />
+  );
+};
diff --git a/src/preview/components/route-preview/components/SettingsPanel/settigs-fields/field-props.interface.ts b/src/preview/components/route-preview/components/SettingsPanel/settigs-fields/field-props.interface.ts
new file mode 100644
index 0000000..a462593
--- /dev/null
+++ b/src/preview/components/route-preview/components/SettingsPanel/settigs-fields/field-props.interface.ts
@@ -0,0 +1,8 @@
+import { FieldPath } from 'react-hook-form';
+import { MapSettings } from '@mt/components';
+
+export interface FieldProps {
+  name: FieldPath<MapSettings>;
+  label: string;
+  hint?: string;
+}
diff --git a/src/preview/components/route-preview/components/SettingsPanel/settigs-fields/index.ts b/src/preview/components/route-preview/components/SettingsPanel/settigs-fields/index.ts
new file mode 100644
index 0000000..b435cd7
--- /dev/null
+++ b/src/preview/components/route-preview/components/SettingsPanel/settigs-fields/index.ts
@@ -0,0 +1,5 @@
+export * from './RotationField';
+export * from './ScaleField';
+export * from './CoordinateField';
+export * from './StationSelectField';
+export * from './field-props.interface';
diff --git a/src/preview/components/route-preview/hooks/useGetRouteData.ts b/src/preview/components/route-preview/hooks/useGetRouteData.ts
new file mode 100644
index 0000000..f597070
--- /dev/null
+++ b/src/preview/components/route-preview/hooks/useGetRouteData.ts
@@ -0,0 +1,58 @@
+import { MapData } from "@mt/components";
+import { useEffect, useState } from "react";
+import { mapRouteFromApi } from "../mappers/mapRouteFromApi";
+import { useOn, Station, useOne, useMany } from "@refinedev/core";
+import { Route } from "@mt/common-types";
+
+export const useGetRouteData = (routeId: string) => {
+  const [mappedData, setMappedData] = useState<MapData | null>(null);
+  const [error, setError] = useState<string | null>(null); // Handle error state
+
+  // Fetch route data
+  const {
+    data: routeData,
+    isSuccess,
+    isError,
+    isLoading,
+  } = useOne<Route>("routes", { id: routeId });
+
+  const { data: stations } = useMany<Station>("stations", {
+    ids: routeData?.stations.flatMap(({ stationId, transferStations }) => {
+      const transferIds = transferStations
+        .filter(({ isShowOnMap }) => isShowOnMap)
+        .map(({ stationId: id }) => id);
+      return [stationId, ...transferIds];
+    }),
+  });
+  // Handle loading state and errors
+  useEffect(() => {
+    if (isLoading || stationsLoading) {
+      setError(null); // Reset error during loading
+      return;
+    }
+
+    if (isError || stationsError) {
+      setError("Failed to fetch route or station data.");
+      return;
+    }
+
+    if (!routeData || !stations) {
+      return;
+    }
+
+    try {
+      const data = mapRouteFromApi(routeData, stations);
+      setMappedData(data); // Set the mapped data
+    } catch (err) {
+      setError("Error mapping the route data.");
+    }
+  }, [routeData, stations, isLoading, stationsLoading, isError, stationsError]);
+
+  return {
+    routeData,
+    mappedData,
+    isLoading: isLoading || stationsLoading, // Combine loading states
+    isError: isError || stationsError, // Combine error states
+    error, // Provide the error message
+  };
+};
diff --git a/src/preview/components/route-preview/hooks/useUpdateRouteData.ts b/src/preview/components/route-preview/hooks/useUpdateRouteData.ts
new file mode 100644
index 0000000..507d07d
--- /dev/null
+++ b/src/preview/components/route-preview/hooks/useUpdateRouteData.ts
@@ -0,0 +1,21 @@
+import { useCallback } from "react";
+
+import { mapRouteToApi } from "../mappers/mapRouteToApi";
+import { MapSettings } from "@mt/components";
+import { Route } from "@mt/common-types";
+import { useUpdate } from "@refinedev/core";
+
+export const useUpdateRouteData = (routeId: string, previousData: Route) => {
+  const update = useUpdate();
+
+  return useCallback(
+    (mapSettings: MapSettings, updatedStations) => {
+      update({
+        resource: "routes",
+        id: routeId,
+        data: mapRouteToApi(mapSettings, updatedStations, previousData),
+      });
+    },
+    [update, routeId, previousData]
+  );
+};
diff --git a/src/preview/components/route-preview/index.ts b/src/preview/components/route-preview/index.ts
new file mode 100644
index 0000000..a469b61
--- /dev/null
+++ b/src/preview/components/route-preview/index.ts
@@ -0,0 +1 @@
+export { RoutePreview } from './components/RoutePreview';
diff --git a/src/preview/components/route-preview/mappers/mapRouteFromApi.ts b/src/preview/components/route-preview/mappers/mapRouteFromApi.ts
new file mode 100644
index 0000000..9e3619d
--- /dev/null
+++ b/src/preview/components/route-preview/mappers/mapRouteFromApi.ts
@@ -0,0 +1,141 @@
+import { MapData, StationOnMap } from "@mt/components";
+import { TEMP_STATION_TYPE_MAP } from "@mt/common-types";
+import {
+  Coordinates,
+  Route,
+  RouteStation,
+  Station,
+  Track,
+  TransferStation,
+} from "@mt/common-types";
+
+export function mapRouteFromApi(
+  routeData: Route,
+  stations: Station[]
+): MapData {
+  const {
+    generalInfo,
+    attractionGroupings,
+    stations: routeStations,
+  } = routeData;
+  const { rotate, scale1, scale2, centerCoordinates, track } = generalInfo;
+
+  return {
+    mapRotateAngle: rotate,
+    fullMapScale: scale1,
+    zoomedMapScale: scale2,
+    centerOfMapPoint: centerCoordinates,
+    trackPoints: track,
+    stationsOnMap: mapStationsFromApi(routeStations, stations, track),
+    touristAttractionGroupsOnMap: attractionGroupings
+      .filter(({ coordinates }) => Boolean(coordinates))
+      .map(({ iconSize, coordinates, attractionIds }) => ({
+        iconSize,
+        pointOnMap: coordinates,
+        touristAttractionsOnMap: attractionIds.map((id) => ({
+          id,
+          pointOnMap: coordinates,
+        })),
+      })),
+  };
+}
+
+function mapStationsFromApi(
+  routeStations: RouteStation[],
+  stations: Station[],
+  track: Track
+): MapData["stationsOnMap"] {
+  const stationsMap = new Map(stations.map((station) => [station.id, station]));
+  const unionStations: Array<Omit<RouteStation, "stationId"> & Station> =
+    routeStations.map(({ stationId, ...station }) => ({
+      ...station,
+      ...stationsMap.get(stationId),
+    }));
+
+  const mappedStations = unionStations.map((station) => {
+    const {
+      id,
+      name,
+      shortName,
+      coordinates,
+      textAlignment,
+      mapOffsets,
+      stationTypeId,
+      transferStations,
+      iconUrl,
+    } = station;
+
+    return {
+      id,
+      name,
+      shortName,
+      coordinates,
+      transferStationInfos: mapTransfersToMap(transferStations, stationsMap),
+      labelAlignment: textAlignment,
+      labelOffset: mapOffsets,
+      iconUrl,
+      stationTypeId,
+    };
+  });
+
+  const stationsOnMap = mappedStations.map((station) => {
+    const { coordinates } = station;
+    const trackIndex = track.findIndex(
+      (trackPoint) =>
+        coordinates.lat === trackPoint.lat && coordinates.lon === trackPoint.lon
+    );
+
+    return {
+      ...station,
+      pointOnMap: {
+        ...coordinates,
+        trackIndex,
+      },
+    };
+  }) as MapData["stationsOnMap"];
+
+  return sortStationsByTrackOrder(track, stationsOnMap);
+}
+
+function sortStationsByTrackOrder(
+  track: Track,
+  stations: StationOnMap[]
+): StationOnMap[] {
+  // Create a map to store the index of each coordinate in the second array
+  const coordinateIndexMap = new Map<string, number>();
+  track.forEach((coordinate, index) => {
+    coordinateIndexMap.set(getCoordinateString(coordinate), index);
+  });
+
+  // Sort the first array based on the order of coordinates in the second array
+  return [...stations].sort((a, b) => {
+    const indexA =
+      coordinateIndexMap.get(getCoordinateString(a.coordinates)) || 0;
+    const indexB =
+      coordinateIndexMap.get(getCoordinateString(b.coordinates)) || 0;
+
+    return indexA - indexB;
+  });
+}
+
+// TODO: move to shared utils and refactor across the project
+function getCoordinateString(coordinate: Coordinates): string {
+  return `${coordinate.lat}:${coordinate.lon}`;
+}
+
+function mapTransfersToMap(
+  transferStations: TransferStation[],
+  stationsMap: Map<string, Station>
+) {
+  return transferStations
+    .filter(({ isShowOnMap }) => isShowOnMap)
+    .sort(({ ordinal: ordinalA }, { ordinal: ordinalB }) => ordinalA - ordinalB)
+    .map(({ stationId }) => {
+      const { stationTypeId, shortName } = stationsMap.get(stationId);
+
+      return {
+        type: TEMP_STATION_TYPE_MAP[stationTypeId].type,
+        name: shortName,
+      };
+    });
+}
diff --git a/src/preview/components/route-preview/mappers/mapRouteToApi.ts b/src/preview/components/route-preview/mappers/mapRouteToApi.ts
new file mode 100644
index 0000000..21654e4
--- /dev/null
+++ b/src/preview/components/route-preview/mappers/mapRouteToApi.ts
@@ -0,0 +1,25 @@
+import { Route, RouteStation } from "@admin/types";
+import { MapSettings } from "@mt/components";
+import { DeepPartial } from "react-hook-form";
+
+export const mapRouteToApi = (
+  { rotateAngle, fullScale, zoomedScale, center }: MapSettings,
+  updatedStations: Partial<RouteStation>,
+  previousData
+): DeepPartial<Route> => {
+  return {
+    ...previousData,
+    generalInfo: {
+      ...previousData.generalInfo,
+      rotate: rotateAngle,
+      scale1: fullScale,
+      scale2: zoomedScale,
+      centerCoordinates: center,
+    },
+    stations: previousData.stations.map((station: RouteStation) => {
+      return updatedStations[station.stationId]
+        ? { ...station, ...updatedStations[station.stationId] }
+        : station;
+    }),
+  };
+};
diff --git a/src/preview/components/styles/global.scss b/src/preview/components/styles/global.scss
new file mode 100644
index 0000000..2b782a0
--- /dev/null
+++ b/src/preview/components/styles/global.scss
@@ -0,0 +1,115 @@
+@import 'grid';
+
+@font-face {
+  font-family: 'Roboto';
+  font-weight: 400;
+  font-style: normal;
+  font-display: swap;
+
+  src: url('../fonts/Roboto-Regular.ttf') format('truetype');
+}
+
+@font-face {
+  font-family: 'Roboto';
+  font-weight: 400;
+  font-style: italic;
+  font-display: swap;
+
+  src: url('../fonts/Roboto-Italic.ttf') format('truetype');
+}
+
+@font-face {
+  font-family: 'Roboto';
+  font-weight: 300;
+  font-style: normal;
+  font-display: swap;
+
+  src: url('../fonts/Roboto-Light.ttf') format('truetype');
+}
+
+@font-face {
+  font-family: 'Roboto';
+  font-weight: 300;
+  font-style: italic;
+  font-display: swap;
+
+  src: url('../fonts/Roboto-LightItalic.ttf') format('truetype');
+}
+
+@font-face {
+  font-family: 'Roboto';
+  font-weight: 500;
+  font-style: normal;
+  font-display: swap;
+
+  src: url('../fonts/Roboto-Medium.ttf') format('truetype');
+}
+
+@font-face {
+  font-family: 'Roboto';
+  font-weight: 500;
+  font-style: italic;
+  font-display: swap;
+
+  src: url('../fonts/Roboto-MediumItalic.ttf') format('truetype');
+}
+
+@font-face {
+  font-family: 'Roboto';
+  font-weight: 700;
+  font-style: normal;
+  font-display: swap;
+
+  src: url('../fonts/Roboto-Bold.ttf') format('truetype');
+}
+
+@font-face {
+  font-family: 'Roboto';
+  font-weight: 700;
+  font-style: italic;
+  font-display: swap;
+
+  src: url('../fonts/Roboto-BoldItalic.ttf') format('truetype');
+}
+
+* {
+  box-sizing: border-box;
+}
+
+html,
+body,
+#root {
+  font-family: 'Roboto', 'system-ui', sans-serif;
+  font-size: 16px;
+  height: 100%;
+  user-select: none;
+}
+
+html {
+  --scroll-bar-width: 0;
+  --horizontal-scroll-bar-width: 0;
+}
+
+html {
+  scroll-behavior: smooth;
+  overscroll-behavior-x: none;
+  touch-action: none;
+}
+
+body {
+  margin: 0;
+  overscroll-behavior-x: none;
+}
+
+.psv-loader {
+  color: rgba(0, 0, 0, 0.7) !important;
+}
+
+.psv-loader-text {
+  max-width: 100% !important;
+}
+
+.g-no-scroll {
+  overflow: hidden;
+  padding-right: var(--scroll-bar-width);
+}
diff --git a/src/preview/components/styles/grid.scss b/src/preview/components/styles/grid.scss
new file mode 100644
index 0000000..fc4acaa
--- /dev/null
+++ b/src/preview/components/styles/grid.scss
@@ -0,0 +1,123 @@
+/* #GRIDS
+------------------------------------------- */
+
+/*=========================================== */
+/* # SCROLL GRID */
+/*=========================================== */
+.g-scroll-y {
+  overflow: hidden;
+  overflow-y: auto;
+}
+
+.g-scroll-x {
+  overflow: hidden;
+  overflow-x: auto;
+}
+
+/*=========================================== */
+/* # FLEX GRID */
+/*=========================================== */
+
+/* [ Mode ] Row flex grid */
+/*------------------------------------------ */
+.g-flex {
+  display: flex;
+}
+
+.g-flex__item {
+  flex-basis: auto;
+  flex-grow: 1;
+  flex-shrink: 1;
+  width: 1%;
+}
+
+/* Item with fixed width */
+.g-flex__item-fixed {
+  flex-shrink: 0;
+}
+
+/* [ Mode ] Column flex grid */
+/*------------------------------------------ */
+.g-flex-column {
+  display: flex;
+  flex-direction: column;
+}
+
+.g-flex-column__item {
+  flex-basis: auto;
+  flex-grow: 1;
+  flex-shrink: 1;
+  height: 1%;
+}
+
+/* Item with fixed height */
+.g-flex-column__item-fixed {
+  flex-shrink: 0;
+}
+
+/* [ Mode ] align center */
+/*------------------------------------------ */
+.g-flex--align-center {
+  align-items: center;
+}
+
+/* [ Mode ] align baseline */
+/*------------------------------------------ */
+.g-flex--align-baseline {
+  align-items: baseline;
+}
+
+/* [ Mode ] align start */
+/*------------------------------------------ */
+.g-flex--align-start {
+  align-items: flex-start;
+}
+
+/* [ Mode ] align end */
+/*------------------------------------------ */
+.g-flex--align-end {
+  align-items: flex-end;
+}
+
+/* [ Mode ] space between */
+/*------------------------------------------ */
+.g-flex--space-between {
+  justify-content: space-between;
+}
+
+/* [ Mode ] justify content center */
+/*------------------------------------------ */
+.g-flex--justify-center {
+  justify-content: center;
+}
+
+/* [ Mode ] justify content end */
+/*------------------------------------------ */
+.g-flex--justify-end {
+  justify-content: flex-end;
+}
+
+/* [ Mode ] wrap content */
+/*----------------------------------------- */
+.g-flex--wrap-content {
+  flex-wrap: wrap;
+}
+
+.ui-custom-scroll-small {
+  -webkit-overflow-scrolling: touch;
+  -ms-overflow-style: -ms-autohiding-scrollbar;
+}
+
+.ui-custom-scroll-small::-webkit-scrollbar {
+  width: 4px;
+  height: 4px;
+}
+
+.ui-custom-scroll-small::-webkit-scrollbar-thumb {
+  border-radius: 3px;
+  background: #ffffff;
+}
+
+.g-transform-origin__center {
+  transform-origin: center;
+}
diff --git a/src/preview/i18n/LocaleSwitcher/LocaleSwitcher.css b/src/preview/i18n/LocaleSwitcher/LocaleSwitcher.css
new file mode 100644
index 0000000..84685cc
--- /dev/null
+++ b/src/preview/i18n/LocaleSwitcher/LocaleSwitcher.css
@@ -0,0 +1,37 @@
+.locale-switcher {
+  position: relative;
+  display: inline-block;
+}
+
+.locale-switcher__button {
+  width: 48px;
+  height: 48px;
+  display: block;
+  cursor: pointer;
+  background: transparent;
+  border: none;
+  padding: 0;
+}
+
+.locale-switcher__options {
+  display: flex;
+  gap: 10px;
+}
+
+.locale-switcher__option {
+  width: 48px;
+  height: 48px;
+  cursor: pointer;
+  background: #ffffff;
+  border: none;
+  border-radius: 50%;
+  text-transform: uppercase;
+  font-weight: bold;
+  padding: 0;
+  font-size: 22px;
+}
+
+.locale-switcher__option.selected {
+  background-color: #cccccc;
+  color: #ffffff;
+}
diff --git a/src/preview/i18n/LocaleSwitcher/LocaleSwitcher.tsx b/src/preview/i18n/LocaleSwitcher/LocaleSwitcher.tsx
new file mode 100644
index 0000000..a37a67c
--- /dev/null
+++ b/src/preview/i18n/LocaleSwitcher/LocaleSwitcher.tsx
@@ -0,0 +1,50 @@
+import React, { useCallback, useState } from "react";
+// TODO: resolve circular deps (probably we should move icons to a separate lib)
+import { Icons } from "@mt/components";
+import { Locale, localesMap } from "../i18n.interface";
+import "./LocaleSwitcher.css";
+
+interface LocaleSwitcherProps {
+  onLocaleChange: (locale: Locale) => void;
+}
+
+export const LocaleSwitcher = ({ onLocaleChange }: LocaleSwitcherProps) => {
+  const [isOpen, setIsOpen] = useState(false);
+  const [selectedLocale, setSelectedLocale] = useState<Locale>("ru");
+
+  const handleLocaleChange = useCallback(
+    (locale: Locale) => {
+      setSelectedLocale(locale);
+      setIsOpen(false);
+      onLocaleChange(locale);
+    },
+    [isOpen]
+  );
+
+  return (
+    <div className="locale-switcher">
+      {!isOpen ? (
+        <button
+          className="locale-switcher__button"
+          onPointerUp={() => setIsOpen(!isOpen)}
+        >
+          <Icons.I18NIcon />
+        </button>
+      ) : (
+        <div className="locale-switcher__options">
+          {Object.entries(localesMap).map(([label, locale]) => (
+            <button
+              key={locale}
+              className={`locale-switcher__option ${
+                selectedLocale === locale ? "selected" : ""
+              }`}
+              onPointerUp={() => handleLocaleChange(locale)}
+            >
+              {label}
+            </button>
+          ))}
+        </div>
+      )}
+    </div>
+  );
+};
diff --git a/src/preview/i18n/en.json b/src/preview/i18n/en.json
new file mode 100644
index 0000000..6ea598b
--- /dev/null
+++ b/src/preview/i18n/en.json
@@ -0,0 +1,10 @@
+{
+  "support-of-the-government-of-spb": "With the support of the Government of St. Petersburg",
+  "attractions": "Attractions",
+  "stops": "Stops",
+  "available-transfers": "Available transfers:",
+  "hashtag": "#UsAlongTheWay",
+  "slogan": "Preserving history,{br}moving into the future.",
+  "loading": "Loading...",
+  "close": "Close"
+}
diff --git a/src/preview/i18n/i18n.interface.ts b/src/preview/i18n/i18n.interface.ts
new file mode 100644
index 0000000..be02898
--- /dev/null
+++ b/src/preview/i18n/i18n.interface.ts
@@ -0,0 +1,10 @@
+// and don't forget to add new locale here as well
+export type Locale = 'en' | 'ru' | 'zh';
+
+export const localesMap: Record<string, Locale> = {
+  ru: 'ru',
+  中文: 'zh',
+  en: 'en',
+};
+
+export type LocalizedString = Record<Locale, string>;
diff --git a/src/preview/i18n/index.ts b/src/preview/i18n/index.ts
new file mode 100644
index 0000000..a77478e
--- /dev/null
+++ b/src/preview/i18n/index.ts
@@ -0,0 +1,5 @@
+export * from './i18n.interface';
+export * from './language-loader';
+export * from './useServerLocalization';
+export * from './localization-context';
+export * from './LocaleSwitcher/LocaleSwitcher';
diff --git a/src/preview/i18n/language-loader.ts b/src/preview/i18n/language-loader.ts
new file mode 100644
index 0000000..976d962
--- /dev/null
+++ b/src/preview/i18n/language-loader.ts
@@ -0,0 +1,15 @@
+import en from './en.json';
+import ru from './ru.json';
+import zh from './zh.json';
+import { Locale } from './i18n.interface';
+
+const languages = {
+  en,
+  ru,
+  zh,
+  // Add more language imports here
+};
+export function getLanguage(locale: Locale): Record<string, string> {
+  // Return the language object for the specified locale
+  return languages[locale] || languages.ru; // Default to Russian if the locale is not found
+}
diff --git a/src/preview/i18n/localization-context.tsx b/src/preview/i18n/localization-context.tsx
new file mode 100644
index 0000000..e579aaa
--- /dev/null
+++ b/src/preview/i18n/localization-context.tsx
@@ -0,0 +1,25 @@
+import React, { createContext, ReactNode, useState } from 'react';
+import { IntlProvider } from 'react-intl';
+import { Locale } from './i18n.interface';
+import { getLanguage } from './language-loader';
+
+export const LocalizationContext = createContext<{
+  locale: Locale;
+  setLocale: (locale: Locale) => void;
+}>({
+  locale: 'ru',
+  // eslint-disable-next-line @typescript-eslint/no-empty-function
+  setLocale: (locale: Locale) => {},
+});
+
+export const LocalizationProvider = ({ children }: { children: ReactNode }) => {
+  const [locale, setLocale] = useState<Locale>('ru');
+
+  return (
+    <LocalizationContext.Provider value={{ locale, setLocale }}>
+      <IntlProvider locale={locale} messages={getLanguage(locale)}>
+        {children}
+      </IntlProvider>
+    </LocalizationContext.Provider>
+  );
+};
diff --git a/src/preview/i18n/ru.json b/src/preview/i18n/ru.json
new file mode 100644
index 0000000..c41ac43
--- /dev/null
+++ b/src/preview/i18n/ru.json
@@ -0,0 +1,10 @@
+{
+  "support-of-the-government-of-spb": "При поддержке Правительства Санкт-Петербурга",
+  "attractions": "Достопримечательности",
+  "stops": "Остановки",
+  "available-transfers": "Доступны пересадки:",
+  "hashtag": "#ВсемПоПути",
+  "slogan": "Сохраняя историю,{br}движемся в будущее.",
+  "loading": "Загрузка...",
+  "close": "Закрыть"
+}
diff --git a/src/preview/i18n/useServerLocalization.ts b/src/preview/i18n/useServerLocalization.ts
new file mode 100644
index 0000000..b50a4db
--- /dev/null
+++ b/src/preview/i18n/useServerLocalization.ts
@@ -0,0 +1,19 @@
+import { useContext } from 'react';
+import { LocalizationContext } from './localization-context';
+import { Locale, LocalizedString } from './i18n.interface';
+
+export type LocalizeTextFn = (content: LocalizedString | undefined) => string;
+
+export function useServerLocalization() {
+  const { locale } = useContext(LocalizationContext);
+
+  const localizeText: LocalizeTextFn = (content) => {
+    if (content && typeof content === 'object' && locale in content) {
+      return content[locale as Locale];
+    } else {
+      return '';
+    }
+  };
+
+  return localizeText;
+}
diff --git a/src/preview/i18n/zh.json b/src/preview/i18n/zh.json
new file mode 100644
index 0000000..cda9202
--- /dev/null
+++ b/src/preview/i18n/zh.json
@@ -0,0 +1,10 @@
+{
+  "support-of-the-government-of-spb": "在聖彼得堡政府的支持下",
+  "attractions": "景點",
+  "stops": "停止",
+  "available-transfers": "可用的轉移：",
+  "hashtag": "#我们在路上",
+  "slogan": "保存历史、{br}迈向未来。",
+  "loading": "載入中...",
+  "close": "關閉"
+}
diff --git a/src/preview/types/article.interface.ts b/src/preview/types/article.interface.ts
new file mode 100644
index 0000000..f60e168
--- /dev/null
+++ b/src/preview/types/article.interface.ts
@@ -0,0 +1,9 @@
+import { LocalizedString } from "@mt/i18n";
+import { Media } from "./media.type";
+
+export interface ArticleBase {
+  isPreview: boolean;
+  media: Media;
+  name: LocalizedString;
+  text: LocalizedString;
+}
diff --git a/src/preview/types/attraction-group-icon-size.type.ts b/src/preview/types/attraction-group-icon-size.type.ts
new file mode 100644
index 0000000..c5bab1b
--- /dev/null
+++ b/src/preview/types/attraction-group-icon-size.type.ts
@@ -0,0 +1 @@
+export type AttractionGroupIconSizeType = 'SMALL' | 'LARGE';
diff --git a/src/preview/types/attraction-widget.interface.ts b/src/preview/types/attraction-widget.interface.ts
new file mode 100644
index 0000000..3334428
--- /dev/null
+++ b/src/preview/types/attraction-widget.interface.ts
@@ -0,0 +1,12 @@
+import { LocalizedString } from "@mt/i18n";
+
+import { AttractionBase } from "./attraction.interface";
+import { Media } from "./media.type";
+
+export interface Attraction extends AttractionBase {
+  isPreview: boolean;
+  media: Required<Media>;
+
+  title?: LocalizedString;
+  text: LocalizedString;
+}
diff --git a/src/preview/types/attraction.interface.ts b/src/preview/types/attraction.interface.ts
new file mode 100644
index 0000000..5b7f9b8
--- /dev/null
+++ b/src/preview/types/attraction.interface.ts
@@ -0,0 +1,24 @@
+import { LocalizedString } from "@mt/i18n";
+import { Coordinates } from "./coordinates.type";
+import { uuid } from "./uuid.type";
+import { Media } from "./media.type";
+import { ArticleBase } from "./article.interface";
+
+export interface AttractionBase {
+  id: uuid;
+  name: LocalizedString;
+  shortName: LocalizedString;
+  coordinates: Coordinates;
+
+  shortDetails: {
+    imageMedia: Media;
+    address: LocalizedString;
+    description: LocalizedString;
+  };
+
+  iconUrl: string;
+  watermark: Media;
+  previewMedia: Media;
+
+  articles: ArticleBase[];
+}
diff --git a/src/preview/types/constants.ts b/src/preview/types/constants.ts
new file mode 100644
index 0000000..550a82a
--- /dev/null
+++ b/src/preview/types/constants.ts
@@ -0,0 +1,5 @@
+export const LocalizedStringDefaults = {
+  ru: "",
+  en: "",
+  zh: "",
+};
diff --git a/src/preview/types/coordinates.type.ts b/src/preview/types/coordinates.type.ts
new file mode 100644
index 0000000..cfdac4c
--- /dev/null
+++ b/src/preview/types/coordinates.type.ts
@@ -0,0 +1,4 @@
+export type Coordinates = {
+  lat: number;
+  lon: number;
+};
diff --git a/src/preview/types/index.ts b/src/preview/types/index.ts
new file mode 100644
index 0000000..a55e4da
--- /dev/null
+++ b/src/preview/types/index.ts
@@ -0,0 +1,248 @@
+import {
+  ArticleBase,
+  Coordinates,
+  StationOnMap,
+  TransportType,
+} from "@mt/common-types";
+import { LocalizedString } from "@mt/i18n";
+import { AttractionBase } from "./attraction.interface";
+import { StationBase } from "./station.interface";
+import { OnMapTextAlignment } from "./on-map.type";
+import { OnMapOffset } from "./on-map.type";
+import { uuid } from "./uuid.type";
+import { AttractionGroupIconSizeType } from "./attraction-group-icon-size.type";
+import { Track } from "./track.type";
+
+export interface Station extends Omit<StationOnMap, "coordinates"> {
+  pointOnMap: Coordinates;
+}
+
+export interface Article extends Omit<ArticleBase, "name"> {
+  title: LocalizedString;
+}
+
+export interface Transfer {
+  type: TransportType;
+  name: LocalizedString;
+}
+
+export interface Article extends ArticleBase {
+  isHidden: boolean;
+}
+
+export interface Attraction extends AttractionBase {
+  articles: Article[];
+  cityId: string;
+}
+
+export interface Station extends StationBase {
+  coordinates: Coordinates;
+  cityId: string;
+}
+
+export interface City {
+  id: string;
+  title: string;
+  version: number;
+  isDefault: boolean;
+}
+
+export interface RouteStation {
+  stationId: uuid;
+  textAlignment: OnMapTextAlignment;
+  mapOffsets: OnMapOffset;
+  transferStations: TransferStation[];
+  transferRoutes: TransferRoute[];
+}
+
+export interface TransferStation {
+  stationId: uuid;
+  isShowOnMap: boolean;
+  ordinal: number;
+}
+
+export interface TransferRoute {
+  routeNumber: string;
+  // TODO: check if they match (transportType & routeType) and probably create the copy of it to avoid naming confusion
+  routeTypeId: TransportType;
+  ordinal: number;
+}
+
+export interface RouteAttraction {
+  attractionId: uuid;
+}
+
+export interface RouteAttractionGrouping {
+  id: uuid; // FE virtual field
+  attractionIds: uuid[];
+  iconSize: AttractionGroupIconSizeType;
+  coordinates: Coordinates;
+}
+
+export interface RouteAttractionToStationBinding {
+  stationId: uuid;
+  nearbyAttractionIds: uuid[];
+}
+
+export interface RouteStationToAttractionBinding {
+  attractionId: uuid;
+  nearbyStationIds: uuid[];
+}
+
+export interface Route {
+  id: string;
+  cityId: string;
+  number: string;
+  speakingCityNumber: number;
+  name: LocalizedString;
+  generalInfo: {
+    track: Track;
+    // TODO: discuss and rename (?)
+    centerCoordinates: Coordinates;
+    scale1: number;
+    scale2: number;
+    rotate: number;
+  };
+  stations?: RouteStation[];
+  attractions?: RouteAttraction[];
+  attractionGroupings: RouteAttractionGrouping[];
+  attractionToStationBindings: RouteAttractionToStationBinding[];
+  stationToAttractionBindings: RouteStationToAttractionBinding[];
+}
+
+export type USER_ROLE = "operator" | "admin";
+
+export interface User {
+  firstName: string;
+  lastName: string;
+  patronymicName: string;
+  email: string;
+  password: string;
+  role: USER_ROLE;
+  avatarUrl: string;
+}
+
+export type AlertType = "ALL" | "ROUTES" | "STATIONS";
+
+export interface Alert {
+  id: uuid;
+  version: number;
+  cityId: string;
+  text: LocalizedString;
+  fontSize: number;
+  bgColor: string; // hex RGB-color (e.g. #ffffff).
+  icon?: { src: string };
+  iconUrl?: string;
+  order: number;
+  binding: AlertAll | AlertRoute | AlertStation;
+  isHidden: boolean;
+}
+
+interface AlertBase {
+  type: AlertType;
+}
+
+interface AlertAll extends AlertBase {
+  type: "ALL";
+}
+
+interface AlertRoute extends AlertBase {
+  type: "ROUTES";
+  routeIds: uuid[];
+}
+
+interface AlertStation extends AlertBase {
+  type: "STATIONS";
+  stationIds: uuid[];
+}
+
+export interface Tram {
+  id: uuid;
+  version: number;
+  number: string;
+  cityId: string;
+  apiKey: string;
+  autoDataUpdateDisabled: boolean;
+}
+
+export type ExportState = "SCHEDULED" | "IN_PROGRESS" | "DONE" | "SKIP";
+
+export interface TramState {
+  id: uuid;
+  tramId: uuid;
+  routeId?: uuid;
+  state: string;
+  coordinates: Coordinates;
+  lastExport: {
+    lastExportId: uuid;
+    lastExportState: ExportState;
+  };
+  timestamp: string;
+}
+
+export type UpdateType = "ALL" | "TRAMS";
+
+export interface Update {
+  id: uuid;
+  title: string;
+  createTimestamp: number;
+  exportBinding: UpdateAll | UpdateTrams;
+}
+
+interface UpdateBase {
+  type: UpdateType;
+}
+
+interface UpdateAll extends UpdateBase {
+  type: "ALL";
+}
+
+interface UpdateTrams extends UpdateBase {
+  type: "TRAMS";
+  tramIds: uuid[];
+}
+
+declare global {
+  interface Window {
+    restServer: any;
+  }
+}
+
+// TODO: Rename with BE pointOnMap => coordinates
+export interface Station extends Omit<StationOnMap, "coordinates"> {
+  pointOnMap: Coordinates;
+}
+
+export interface Article extends Omit<ArticleBase, "name"> {
+  title: LocalizedString;
+}
+
+export interface Transfer {
+  type: TransportType;
+  name: LocalizedString;
+}
+
+/**
+ * TYPES
+ */
+export * from "./uuid.type";
+export * from "./media.type";
+export * from "./track.type";
+export * from "./coordinates.type";
+export * from "./on-map.type";
+export * from "./transport.type";
+export * from "./option.type";
+export * from "./attraction-group-icon-size.type";
+export * from "./order.type";
+export * from "./set-state.type";
+
+/**
+ * INTERFACES
+ */
+export * from "./station.interface";
+export * from "./attraction.interface";
+export * from "./attraction-widget.interface";
+export * from "./article.interface";
+export * from "./lightbox.interface";
+export * from "./station";
+export * from "./constants";
diff --git a/src/preview/types/lightbox.interface.ts b/src/preview/types/lightbox.interface.ts
new file mode 100644
index 0000000..58945f9
--- /dev/null
+++ b/src/preview/types/lightbox.interface.ts
@@ -0,0 +1,14 @@
+export interface LightboxData {
+  type: 'PHOTO_SPHERE' | 'OBJECT_3D';
+  watermarkUrl?: string;
+}
+
+export interface PhotoSphereLightboxData extends LightboxData {
+  type: 'PHOTO_SPHERE';
+  imageUrl: string;
+}
+
+export interface Object3DLightboxData extends LightboxData {
+  type: 'OBJECT_3D';
+  modelUrl: string;
+}
diff --git a/src/preview/types/media.type.ts b/src/preview/types/media.type.ts
new file mode 100644
index 0000000..46d1e99
--- /dev/null
+++ b/src/preview/types/media.type.ts
@@ -0,0 +1,7 @@
+export type MediaType = 'IMAGE' | 'VIDEO' | 'PHOTO_SPHERE' | 'OBJECT_3D';
+
+export type Media = {
+  url: string;
+  type?: MediaType;
+  watermarkUrl?: string;
+};
diff --git a/src/preview/types/on-map.type.ts b/src/preview/types/on-map.type.ts
new file mode 100644
index 0000000..fc65cfd
--- /dev/null
+++ b/src/preview/types/on-map.type.ts
@@ -0,0 +1,6 @@
+export type OnMapOffset = {
+  x: number;
+  y: number;
+};
+
+export type OnMapTextAlignment = 'LEFT' | 'CENTER' | 'RIGHT';
diff --git a/src/preview/types/option.type.ts b/src/preview/types/option.type.ts
new file mode 100644
index 0000000..23835ee
--- /dev/null
+++ b/src/preview/types/option.type.ts
@@ -0,0 +1,4 @@
+export type OptionType<T> = {
+  id: T;
+  name: string;
+};
diff --git a/src/preview/types/order.type.ts b/src/preview/types/order.type.ts
new file mode 100644
index 0000000..d2d2a7e
--- /dev/null
+++ b/src/preview/types/order.type.ts
@@ -0,0 +1 @@
+export type Order = 'asc' | 'desc';
diff --git a/src/preview/types/set-state.type.ts b/src/preview/types/set-state.type.ts
new file mode 100644
index 0000000..9a239ac
--- /dev/null
+++ b/src/preview/types/set-state.type.ts
@@ -0,0 +1,3 @@
+import React, { Dispatch } from 'react';
+
+export type SetState<T> = Dispatch<React.SetStateAction<T>>;
diff --git a/src/preview/types/station.interface.ts b/src/preview/types/station.interface.ts
new file mode 100644
index 0000000..0581153
--- /dev/null
+++ b/src/preview/types/station.interface.ts
@@ -0,0 +1,19 @@
+import { LocalizedString } from "@mt/i18n";
+
+import { Coordinates } from "./coordinates.type";
+import { uuid } from "./uuid.type";
+import { OnMapTextAlignment, OnMapOffset } from "./on-map.type";
+
+export interface StationBase {
+  id: uuid;
+  name: LocalizedString;
+  shortName: LocalizedString;
+  stationTypeId: uuid;
+  iconUrl: string;
+}
+
+export interface StationOnMap extends StationBase {
+  coordinates: Coordinates;
+  labelAlignment: OnMapTextAlignment;
+  labelOffset: OnMapOffset;
+}
diff --git a/src/preview/types/station.ts b/src/preview/types/station.ts
new file mode 100644
index 0000000..14b0700
--- /dev/null
+++ b/src/preview/types/station.ts
@@ -0,0 +1,84 @@
+// TODO: resolve circular deps
+import { TransportType, uuid } from "@mt/common-types";
+
+interface StationTypeOption {
+  id: uuid;
+  type: TransportType;
+  name: string;
+}
+
+// TODO: Temp Solution! Remove after implement TRANSPORT TYPES in Admin Panel with BE
+
+const StationTypeToUuidMap: Record<TransportType, uuid> = {
+  TRAM: "3fa85f64-5717-4562-b3fc-2c963f66afa6",
+  TROLLEY: "cbb26715-8126-4129-9647-a3817b08d897",
+  BUS: "9664f5eb-2c80-4f02-9c87-663012a7f92e",
+  TRAIN: "7b657db6-aaa0-4d5e-b469-2ff94f5ca25e",
+  METRO_RED: "a95a25ab-c002-4814-9767-e56e2e8b732c",
+  METRO_GREEN: "a8f9c6ae-20e6-4113-9b0d-33710908c178",
+  METRO_BLUE: "0764576e-729a-4a44-8f34-166177e5d50a",
+  METRO_PURPLE: "5b0679ed-c614-4658-a30b-33c3c61734d4",
+  METRO_ORANGE: "4f5d142d-40f0-4a47-9aa9-b9b0e5bc7d15",
+};
+
+export const TEMP_STATION_TYPE_MAP: Record<uuid, StationTypeOption> = {
+  [StationTypeToUuidMap.TRAM]: {
+    id: StationTypeToUuidMap.TRAM,
+    type: "TRAM" as TransportType,
+    name: "Трамвай",
+  },
+  [StationTypeToUuidMap.TROLLEY]: {
+    id: StationTypeToUuidMap.TROLLEY,
+    type: "TROLLEY" as TransportType,
+    name: "Троллейбус",
+  },
+  [StationTypeToUuidMap.BUS]: {
+    id: StationTypeToUuidMap.BUS,
+    type: "BUS" as TransportType,
+    name: "Автобус",
+  },
+  [StationTypeToUuidMap.TRAIN]: {
+    id: StationTypeToUuidMap.TRAIN,
+    type: "TRAIN" as TransportType,
+    name: "Поезд",
+  },
+  [StationTypeToUuidMap.METRO_RED]: {
+    id: StationTypeToUuidMap.METRO_RED,
+    type: "METRO_RED" as TransportType,
+    name: "Метро (красная ветка)",
+  },
+  [StationTypeToUuidMap.METRO_GREEN]: {
+    id: StationTypeToUuidMap.METRO_GREEN,
+    type: "METRO_GREEN" as TransportType,
+    name: "Метро (зеленая ветка)",
+  },
+  [StationTypeToUuidMap.METRO_BLUE]: {
+    id: StationTypeToUuidMap.METRO_BLUE,
+    type: "METRO_BLUE" as TransportType,
+    name: "Метро (голубая ветка)",
+  },
+  [StationTypeToUuidMap.METRO_PURPLE]: {
+    id: StationTypeToUuidMap.METRO_PURPLE,
+    type: "METRO_PURPLE" as TransportType,
+    name: "Метро (фиолетовая ветка)",
+  },
+  [StationTypeToUuidMap.METRO_ORANGE]: {
+    id: StationTypeToUuidMap.METRO_ORANGE,
+    type: "METRO_ORANGE" as TransportType,
+    name: "Метро (оранжевая ветка)",
+  },
+};
+
+export const TEMP_STATION_TYPES: StationTypeOption[] = Object.values(
+  TEMP_STATION_TYPE_MAP
+);
+
+export const TEMP_ROUTE_TYPES: StationTypeOption[] = [
+  TEMP_STATION_TYPE_MAP[StationTypeToUuidMap.TRAM],
+  TEMP_STATION_TYPE_MAP[StationTypeToUuidMap.TROLLEY],
+  TEMP_STATION_TYPE_MAP[StationTypeToUuidMap.BUS],
+];
+
+export const getStationTypeById = (id: uuid): string => {
+  return TEMP_STATION_TYPES.find((type) => type.id === id)?.name ?? "";
+};
diff --git a/src/preview/types/track.type.ts b/src/preview/types/track.type.ts
new file mode 100644
index 0000000..c80b2d0
--- /dev/null
+++ b/src/preview/types/track.type.ts
@@ -0,0 +1,3 @@
+import { Coordinates } from './coordinates.type';
+
+export type Track = Coordinates[];
diff --git a/src/preview/types/transport.type.ts b/src/preview/types/transport.type.ts
new file mode 100644
index 0000000..193b056
--- /dev/null
+++ b/src/preview/types/transport.type.ts
@@ -0,0 +1,10 @@
+export type TransportType =
+  | 'TRAM'
+  | 'TROLLEY'
+  | 'BUS'
+  | 'TRAIN'
+  | 'METRO_RED'
+  | 'METRO_GREEN'
+  | 'METRO_BLUE'
+  | 'METRO_PURPLE'
+  | 'METRO_ORANGE';
diff --git a/src/preview/types/uuid.type.ts b/src/preview/types/uuid.type.ts
new file mode 100644
index 0000000..912920a
--- /dev/null
+++ b/src/preview/types/uuid.type.ts
@@ -0,0 +1 @@
+export type uuid = string | number;
diff --git a/src/preview/widgets/MapWidgetContainer/MapWidgetContainer.tsx b/src/preview/widgets/MapWidgetContainer/MapWidgetContainer.tsx
new file mode 100644
index 0000000..c3c882e
--- /dev/null
+++ b/src/preview/widgets/MapWidgetContainer/MapWidgetContainer.tsx
@@ -0,0 +1,50 @@
+import { MapWidget, useMapWidgetContext } from "@mt/components";
+import { useGetMapData } from "./useGetMapData";
+import { EventQueryData, useEventQuery, useLoading } from "@mt/utils";
+import { useEffect } from "react";
+// TODO: resolve circular deps
+import { Coordinates } from "@mt/common-types";
+
+export const MapWidgetContainer = () => {
+  const { isLoading } = useLoading();
+  const { data, refetch } = useGetMapData();
+  const { currentPosition, setCurrentPosition, onMapDataFetched } =
+    useMapWidgetContext();
+
+  const { data: events = [], isSuccess } = useEventQuery(
+    "/widgets/route-map/events",
+    ["REFRESH_DATA", "UPDATE_CURRENT_POINT_ON_TRACK"]
+  );
+
+  useEffect(() => {
+    if (!data) {
+      return;
+    }
+
+    onMapDataFetched(data);
+  }, [data]);
+
+  useEffect(() => {
+    if (!isSuccess || !events.length) {
+      return;
+    }
+
+    if (events.some((e) => e["@type"] === "REFRESH_DATA")) {
+      refetch();
+
+      return;
+    }
+
+    const { currentPointOnTrack } = events.at(-1) as EventQueryData<{
+      currentPointOnTrack: Coordinates;
+    }>;
+
+    setCurrentPosition(currentPointOnTrack);
+  }, [events, isSuccess, refetch]);
+
+  if (isLoading || !data || !currentPosition) {
+    return null;
+  }
+
+  return <MapWidget />;
+};
diff --git a/src/preview/widgets/MapWidgetContainer/index.ts b/src/preview/widgets/MapWidgetContainer/index.ts
new file mode 100644
index 0000000..68177a4
--- /dev/null
+++ b/src/preview/widgets/MapWidgetContainer/index.ts
@@ -0,0 +1 @@
+export * from './MapWidgetContainer';
diff --git a/src/preview/widgets/MapWidgetContainer/mapStationsFromApi.ts b/src/preview/widgets/MapWidgetContainer/mapStationsFromApi.ts
new file mode 100644
index 0000000..81155c1
--- /dev/null
+++ b/src/preview/widgets/MapWidgetContainer/mapStationsFromApi.ts
@@ -0,0 +1,19 @@
+import { Track } from '@mt/common-types';
+import { StationOnMap } from '@mt/components';
+
+export function mapStationsFromApi(stations: StationOnMap[], track: Track): StationOnMap[] {
+  return stations.map<StationOnMap>((station) => {
+    const { pointOnMap } = station;
+    const trackIndex = track.findIndex(
+      (trackPoint) => pointOnMap.lat === trackPoint.lat && pointOnMap.lon === trackPoint.lon
+    );
+
+    return {
+      ...station,
+      pointOnMap: {
+        ...pointOnMap,
+        trackIndex,
+      },
+    };
+  });
+}
diff --git a/src/preview/widgets/MapWidgetContainer/useGetMapData.ts b/src/preview/widgets/MapWidgetContainer/useGetMapData.ts
new file mode 100644
index 0000000..ec76dfb
--- /dev/null
+++ b/src/preview/widgets/MapWidgetContainer/useGetMapData.ts
@@ -0,0 +1,21 @@
+import { UseQueryResult, useQuery } from "@tanstack/react-query";
+import { MapData } from "@mt/components";
+import { mapStationsFromApi } from "./mapStationsFromApi";
+
+export function useGetMapData(): UseQueryResult<MapData> {
+  return useQuery<MapData>({
+    queryKey: ["getMapData"],
+    queryFn: async () => {
+      const { stationsOnMap, trackPoints, ...rest } = await fetch(
+        "https://localhost:8443/widgets/route-map/data"
+      ).then((res) => res.json());
+
+      return {
+        trackPoints,
+        stationsOnMap: mapStationsFromApi(stationsOnMap, trackPoints),
+        ...rest,
+      };
+    },
+    refetchOnWindowFocus: false,
+  });
+}
diff --git a/src/preview/widgets/RouteInfoWidgetContainer/RouteInfoWidgetContainer.tsx b/src/preview/widgets/RouteInfoWidgetContainer/RouteInfoWidgetContainer.tsx
new file mode 100644
index 0000000..61b52db
--- /dev/null
+++ b/src/preview/widgets/RouteInfoWidgetContainer/RouteInfoWidgetContainer.tsx
@@ -0,0 +1,9 @@
+import { RouteInfoWidget } from '@mt/components';
+import { useGetRouteInfo } from './useGetRouteInfo';
+import { HTMLAttributes } from 'react';
+
+export const RouteInfoWidgetContainer = (props: HTMLAttributes<HTMLDivElement>) => {
+  const { data } = useGetRouteInfo();
+
+  return <RouteInfoWidget routeInfo={data} {...props} />;
+};
diff --git a/src/preview/widgets/RouteInfoWidgetContainer/useGetRouteInfo.ts b/src/preview/widgets/RouteInfoWidgetContainer/useGetRouteInfo.ts
new file mode 100644
index 0000000..0c19f25
--- /dev/null
+++ b/src/preview/widgets/RouteInfoWidgetContainer/useGetRouteInfo.ts
@@ -0,0 +1,28 @@
+import { useQuery } from "@tanstack/react-query";
+import { useEffect } from "react";
+import { useEventQuery } from "@mt/utils";
+import { RouteInfoData } from "@mt/components";
+
+export const useGetRouteInfo = () => {
+  const { data, isSuccess } = useEventQuery(
+    // 'getRouteInfoEvents',
+    "/widgets/route-info/events",
+    ["REFRESH_DATA"]
+  );
+
+  const routeInfoQuery = useQuery<RouteInfoData>({
+    queryKey: ["getRouteInfo"],
+    queryFn: async () =>
+      await fetch("https://localhost:8443/widgets/route-info/data").then(
+        (res) => res.json()
+      ),
+  });
+
+  useEffect(() => {
+    if (isSuccess && data.length) {
+      routeInfoQuery.refetch();
+    }
+  }, [data, isSuccess]);
+
+  return routeInfoQuery;
+};
diff --git a/src/preview/widgets/WeatherWidget/WeatherWidgetContainer.tsx b/src/preview/widgets/WeatherWidget/WeatherWidgetContainer.tsx
new file mode 100644
index 0000000..febdc8b
--- /dev/null
+++ b/src/preview/widgets/WeatherWidget/WeatherWidgetContainer.tsx
@@ -0,0 +1,9 @@
+import { WeatherWidget } from "@mt/components";
+import { HTMLAttributes } from "react";
+import { useWeatherData } from "./useWeatherData";
+
+export function WeatherWidgetContainer(props: HTMLAttributes<HTMLDivElement>) {
+  const { data } = useWeatherData();
+
+  return <WeatherWidget weatherData={data} {...props} />;
+}
diff --git a/src/preview/widgets/WeatherWidget/useWeatherData.ts b/src/preview/widgets/WeatherWidget/useWeatherData.ts
new file mode 100644
index 0000000..1d53763
--- /dev/null
+++ b/src/preview/widgets/WeatherWidget/useWeatherData.ts
@@ -0,0 +1,38 @@
+import { useEffect, useState } from "react";
+import { useLongPollingQuery } from "@mt/utils";
+import { WEATHER_DEFAULTS, WeatherWidgetData } from "@mt/components";
+
+export const useWeatherData = () => {
+  const [data, setData] = useState<WeatherWidgetData>(WEATHER_DEFAULTS);
+
+  const { isSuccess, data: weatherData } = useLongPollingQuery<
+    WeatherWidgetData,
+    Error
+  >(
+    ["getWeatherData"],
+    async () => {
+      const response = await fetch(
+        "https://localhost:8443/widgets/general-info/data"
+      );
+
+      return response.json();
+    },
+    {
+      pollingInterval: 3000, // client-side delayed long-polling
+      maxRetries: Number.MAX_SAFE_INTEGER,
+    }
+  );
+
+  useEffect(() => {
+    if (isSuccess && weatherData) {
+      const { weatherInfo, forecasts } = weatherData;
+
+      setData({
+        weatherInfo,
+        forecasts,
+      });
+    }
+  }, [isSuccess, weatherData]);
+
+  return { data };
+};
diff --git a/src/preview/widgets/all-attractions-dropdown/AllAttractionsDropdown.css b/src/preview/widgets/all-attractions-dropdown/AllAttractionsDropdown.css
new file mode 100644
index 0000000..d9e0acb
--- /dev/null
+++ b/src/preview/widgets/all-attractions-dropdown/AllAttractionsDropdown.css
@@ -0,0 +1,160 @@
+.dropdown {
+  position: relative;
+}
+
+.dropdown-button {
+  position: relative;
+  display: flex;
+  width: 100%;
+  padding: 18px 0;
+  justify-content: center;
+  color: white;
+  font-weight: 700;
+  font-size: 18px;
+  line-height: 21px;
+  border: none;
+  background: linear-gradient(
+      113.51deg,
+      rgba(255, 255, 255, 0) 8.71%,
+      rgba(255, 255, 255, 0.16) 69.69%
+    ),
+    #806c59;
+  border-radius: 10px 10px 0 0;
+  margin-top: 33px;
+  cursor: pointer;
+  align-items: center;
+}
+
+.dropdown-icon {
+  height: 15px;
+  width: 21px;
+  left: 40px;
+  position: absolute;
+}
+
+.dropdown-icon--opened {
+  transform: rotate(180deg);
+}
+
+.dropdown-button:hover {
+  background: #806c59;
+}
+
+.dropdown-content {
+  overflow-y: auto;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 675px;
+  padding: 0;
+  background: linear-gradient(
+      113.51deg,
+      rgba(255, 255, 255, 0) 8.71%,
+      rgba(255, 255, 255, 0.16) 69.69%
+    ),
+    #806c59;
+  box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
+  border-radius: 10px 10px 0 0;
+  z-index: 100;
+}
+
+.dropdown-content-header {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  padding: 15px 0;
+  font-weight: 700;
+  font-size: 18px;
+  line-height: 21px;
+  text-align: center;
+  color: #ffffff;
+  border-bottom: 1px solid #ccc;
+}
+
+.dropdown-content-list {
+  /*52px - height of the header*/
+  height: calc(675px - 52px);
+  padding-right: 35px;
+}
+
+.alphabet-list {
+  position: fixed;
+  right: 35px;
+  bottom: 0;
+  padding: 0;
+  list-style: none;
+
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  /*52px - height of the header*/
+  /*28px - top&bottom paddings from .attraction-list*/
+  height: calc(675px - 52px - 28px);
+}
+
+.alphabet-list li {
+  text-align: center;
+  font-weight: 400;
+  font-size: 14px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-grow: 1;
+  width: 35px;
+  color: #ffffff;
+  cursor: pointer;
+}
+
+.alphabet-list li:first-child {
+  padding-top: 0;
+}
+
+.attraction-list {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  grid-auto-rows: 150px;
+  gap: 24px 0;
+  padding: 14px 0;
+  margin: 0;
+}
+
+.attraction-list li {
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+}
+
+.attraction-list li:hover {
+  cursor: pointer;
+}
+
+.attraction-list li .dropdown-list-item__image-wrapper {
+  background: #ffffff;
+  border-radius: 50%;
+  width: 96px;
+  height: 96px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.attraction-list li .dropdown-list-item__image-wrapper img {
+  max-width: 60px;
+}
+
+.attraction-list li span {
+  width: 150px;
+  max-height: 40px;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  margin-top: 8px;
+
+  font-weight: 600;
+  font-size: 16px;
+  line-height: 19px;
+  text-align: center;
+  letter-spacing: 0.02em;
+
+  color: #ffffff;
+}
diff --git a/src/preview/widgets/all-attractions-dropdown/all-attractions-dropdown.tsx b/src/preview/widgets/all-attractions-dropdown/all-attractions-dropdown.tsx
new file mode 100644
index 0000000..9bb5b59
--- /dev/null
+++ b/src/preview/widgets/all-attractions-dropdown/all-attractions-dropdown.tsx
@@ -0,0 +1,127 @@
+import { useServerLocalization } from "@mt/i18n";
+
+import React, { useCallback, useEffect, useRef, useState } from "react";
+import "./AllAttractionsDropdown.css";
+import { FormattedMessage } from "react-intl";
+
+import { useGetAttractionList } from "./useGetAttractionList";
+import { Icons, TouchScrollWrapper } from "@mt/components";
+
+interface AllAttractionsDropdownProps {
+  isIdleMode: boolean;
+  handleAttractionClick: (id: string) => void;
+}
+
+const AllAttractionsDropdown = React.memo(
+  ({ isIdleMode, handleAttractionClick }: AllAttractionsDropdownProps) => {
+    const { data: attractions = [] } = useGetAttractionList();
+
+    const [isOpen, setIsOpen] = useState(false);
+    const attractionsListRef = useRef<HTMLUListElement>(null);
+    const localizeText = useServerLocalization();
+    const letters = attractions
+      .sort((a, b) =>
+        localizeText(a.name)
+          .toLowerCase()
+          .localeCompare(localizeText(b.name).toLowerCase())
+      )
+      .reduce((acc: string[], cur) => {
+        const firstLetter = localizeText(cur.name).charAt(0).toUpperCase();
+
+        if (!acc.includes(firstLetter)) {
+          return acc.concat(firstLetter);
+        }
+
+        return acc;
+      }, []);
+
+    const handleLetterClick = useCallback(
+      (letter: string) => {
+        const attractionByFirstLetter = attractions.find((it) =>
+          localizeText(it.name).startsWith(letter)
+        );
+
+        if (attractionByFirstLetter) {
+          const item = attractionsListRef.current?.querySelector(
+            `#attraction-${attractionByFirstLetter.id}`
+          );
+
+          item?.scrollIntoView({
+            behavior: "smooth",
+            block: "end",
+            inline: "nearest",
+          });
+        }
+      },
+      [attractions, localizeText]
+    );
+
+    useEffect(() => {
+      if (isIdleMode) setIsOpen(false);
+    }, [isIdleMode]);
+
+    return (
+      <div className="dropdown">
+        <button
+          className="dropdown-button"
+          onPointerUp={() => setIsOpen(!isOpen)}
+        >
+          <Icons.ChevronIcon className="dropdown-icon" />
+
+          <div className="g-flex__item">
+            <FormattedMessage id="attractions" />
+          </div>
+        </button>
+
+        {isOpen && (
+          <div className="dropdown-content">
+            <div
+              className="dropdown-content-header"
+              onPointerUp={() => setIsOpen(!isOpen)}
+            >
+              <Icons.ChevronIcon className="dropdown-icon dropdown-icon--opened" />
+
+              <div className="g-flex__item">
+                <FormattedMessage id="attractions" />
+              </div>
+            </div>
+
+            <TouchScrollWrapper className="dropdown-content-list">
+              <ul className="attraction-list" ref={attractionsListRef}>
+                {attractions.map((attraction) => (
+                  <li
+                    id={`attraction-${attraction.id}`}
+                    key={attraction.id}
+                    className="dropdown-list-item"
+                    onPointerUp={() => {
+                      setIsOpen(!isOpen);
+                      handleAttractionClick(attraction.id);
+                    }}
+                  >
+                    <div className="dropdown-list-item__image-wrapper">
+                      <img
+                        src={attraction.iconUrl}
+                        alt={localizeText(attraction.name)}
+                      />
+                    </div>
+                    <span>{localizeText(attraction.name)}</span>
+                  </li>
+                ))}
+              </ul>
+            </TouchScrollWrapper>
+
+            <ul className="alphabet-list">
+              {letters.map((letter) => (
+                <li key={letter} onPointerUp={() => handleLetterClick(letter)}>
+                  <span>{letter}</span>
+                </li>
+              ))}
+            </ul>
+          </div>
+        )}
+      </div>
+    );
+  }
+);
+
+export default AllAttractionsDropdown;
diff --git a/src/preview/widgets/all-attractions-dropdown/useGetAttractionList.ts b/src/preview/widgets/all-attractions-dropdown/useGetAttractionList.ts
new file mode 100644
index 0000000..4cfea4e
--- /dev/null
+++ b/src/preview/widgets/all-attractions-dropdown/useGetAttractionList.ts
@@ -0,0 +1,42 @@
+import { LocalizedString } from "@mt/i18n";
+import { useEventQuery } from "@mt/utils";
+import { useQuery } from "@tanstack/react-query";
+import { UseQueryResult } from "@tanstack/react-query";
+import { useEffect } from "react";
+
+interface Attraction {
+  id: string;
+  name: LocalizedString;
+  iconUrl: string;
+}
+
+export function useGetAttractionList(): UseQueryResult<Attraction[]> {
+  const { data, isSuccess } = useEventQuery(
+    "/widgets/attraction-with-details-list/events",
+    ["REFRESH_DATA"]
+  );
+
+  const attractionListQuery = useQuery<Attraction[]>({
+    queryKey: ["getAttractionList"], // Query keys should be an array
+    queryFn: async () => {
+      const response = await fetch(
+        "https://localhost:8443/widgets/attraction-with-details-list/data"
+      );
+      if (!response.ok) {
+        throw new Error("Network response was not ok");
+      }
+      const data = await response.json();
+      return data.touristAttractions;
+    },
+    refetchOnWindowFocus: false,
+    refetchOnMount: false,
+  });
+
+  useEffect(() => {
+    if (isSuccess && data.length) {
+      attractionListQuery.refetch();
+    }
+  }, [data, isSuccess]);
+
+  return attractionListQuery;
+}
diff --git a/src/preview/widgets/attractions-widget/AttractionWidgetContainer.tsx b/src/preview/widgets/attractions-widget/AttractionWidgetContainer.tsx
new file mode 100644
index 0000000..9d43c53
--- /dev/null
+++ b/src/preview/widgets/attractions-widget/AttractionWidgetContainer.tsx
@@ -0,0 +1,168 @@
+import { useState, useEffect, useRef, useCallback } from "react";
+import { AttractionWidget } from "@mt/components";
+import AllAttractionsDropdown from "../all-attractions-dropdown/all-attractions-dropdown";
+import "./AttractionsWidgetContainer.css";
+import { useLightboxContext } from "@mt/components";
+import {
+  Article,
+  ArticleBase,
+  PhotoSphereLightboxData,
+} from "@mt/common-types";
+
+const POLL_INTERVAL_MS = 5000;
+
+const IDLE_TIME_MS = 2 * 60 * 1000; // Idle time in milliseconds before restarting polling (2 minutes)
+// const IDLE_TIME_MS = 15 * 1000; // debug
+
+export function AttractionWidgetContainer() {
+  const [touristArticles, setTouristArticles] = useState<ArticleBase[] | null>(
+    null
+  );
+  const [error, setError] = useState<TypeError | null>(null);
+  const [isPolling, setIsPolling] = useState<boolean>(true);
+  const [isIdleMode, setIdleMode] = useState<boolean>(true);
+  const idleTimeoutRef = useRef<NodeJS.Timeout | null>(null);
+  const containerRef = useRef<HTMLDivElement>(null);
+  const pollTimeoutRef = useRef<NodeJS.Timeout | null>(null);
+  const abortControllerRef = useRef<AbortController | null>(null);
+
+  const { closeLightbox } = useLightboxContext<PhotoSphereLightboxData>();
+
+  const startPolling = useCallback(async () => {
+    closeLightbox();
+    setIsPolling(true);
+
+    abortControllerRef.current = new AbortController();
+    const poll = async (attempt = 1) => {
+      try {
+        const response = await fetch(
+          "https://localhost:8443/widgets/attraction-details/events",
+          {
+            signal: abortControllerRef.current?.signal,
+          }
+        ).then((resp) => resp.json());
+
+        // if we receive empty array - preserve previous attraction on the screen
+        if (response?.[0]) {
+          const [{ touristAttractionInfoPages }] = response;
+
+          const articles: ArticleBase[] = touristAttractionInfoPages.map(
+            ({ title: name, ...rest }: Article) => ({ name, ...rest })
+          );
+
+          setTouristArticles(articles);
+        }
+
+        setError(null);
+
+        if (isPolling) {
+          // Schedule the next poll
+          pollTimeoutRef.current = setTimeout(poll, POLL_INTERVAL_MS);
+        }
+      } catch (error: unknown) {
+        if ((error as TypeError).name === "AbortError") {
+          console.log("Request was cancelled");
+        } else {
+          setError(error as TypeError);
+
+          if (isPolling && attempt < 3) {
+            // Schedule the next poll
+            pollTimeoutRef.current = setTimeout(
+              () => poll(attempt + 1),
+              POLL_INTERVAL_MS
+            );
+          }
+        }
+      }
+    };
+
+    await poll();
+
+    return () => {
+      abortControllerRef.current?.abort();
+    };
+  }, [isPolling]);
+
+  const stopPolling = () => {
+    setIsPolling(false);
+    abortControllerRef.current?.abort();
+
+    if (pollTimeoutRef.current) {
+      clearTimeout(pollTimeoutRef.current);
+    }
+  };
+
+  const handleUserAction = (e: Event) => {
+    const widgetContainer = containerRef.current;
+
+    if (!widgetContainer || !e.target) return;
+    if (!widgetContainer.contains(e.target as Node)) return;
+
+    e.stopPropagation();
+    resetIdleMode();
+  };
+
+  const handleAttractionSelect = useCallback(async (id: string) => {
+    const { touristAttractionInfoPages } = await fetch(
+      "https://localhost:8443/widgets/attraction-details/data-by-params?" +
+        new URLSearchParams({ touristAttractionId: id })
+    ).then((resp) => resp.json());
+
+    resetIdleMode();
+
+    const articles: ArticleBase[] = touristAttractionInfoPages.map(
+      ({ title: name, ...rest }: Article) => ({ name, ...rest })
+    );
+
+    setTouristArticles(articles);
+    // https://tracker.yandex.ru/TS-32
+    document.querySelector(".widget-text.active")!.scrollTop = 0;
+  }, []);
+
+  const resetIdleMode = () => {
+    abortControllerRef.current?.abort(); // cancel ongoing requests
+    idleTimeoutRef.current && clearTimeout(idleTimeoutRef.current); // reset idle timeout
+    setIdleMode(false);
+
+    idleTimeoutRef.current = setTimeout(() => setIdleMode(true), IDLE_TIME_MS);
+  };
+
+  useEffect(() => {
+    isIdleMode ? startPolling() : stopPolling();
+
+    return stopPolling;
+  }, [isIdleMode, startPolling]);
+
+  // Attach event listeners to stop polling on user actions
+  useEffect(() => {
+    window.addEventListener("click", handleUserAction);
+    window.addEventListener("scroll", handleUserAction);
+
+    return () => {
+      window.removeEventListener("click", handleUserAction);
+      window.removeEventListener("scroll", handleUserAction);
+
+      if (idleTimeoutRef.current) {
+        clearTimeout(idleTimeoutRef.current);
+      }
+    };
+  }, [containerRef]);
+
+  return error ? (
+    <p>Error: {error.message}</p>
+  ) : (
+    touristArticles && (
+      <div
+        className="attractions-widget-container g-flex-column g-flex--justify-end"
+        ref={containerRef}
+      >
+        <AttractionWidget articles={touristArticles} isIdleMode={isIdleMode} />
+
+        <AllAttractionsDropdown
+          isIdleMode={isIdleMode}
+          handleAttractionClick={handleAttractionSelect}
+        />
+      </div>
+    )
+  );
+}
diff --git a/src/preview/widgets/attractions-widget/AttractionsWidgetContainer.css b/src/preview/widgets/attractions-widget/AttractionsWidgetContainer.css
new file mode 100644
index 0000000..5d03a0a
--- /dev/null
+++ b/src/preview/widgets/attractions-widget/AttractionsWidgetContainer.css
@@ -0,0 +1,4 @@
+.attractions-widget-container {
+  padding: 32px 32px 0 0;
+  height: 100%;
+}
diff --git a/src/preview/widgets/dashboard/Dashboard.tsx b/src/preview/widgets/dashboard/Dashboard.tsx
new file mode 100644
index 0000000..5fb808f
--- /dev/null
+++ b/src/preview/widgets/dashboard/Dashboard.tsx
@@ -0,0 +1,115 @@
+import styled from "@emotion/styled";
+import { useState, useEffect } from "react";
+
+const StyledDashboard = styled.div`
+  background-color: #000;
+  width: 100%;
+  height: 100%;
+  position: relative;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+
+  .container {
+    width: 100%;
+    max-width: 960px;
+    padding: 24px;
+    box-sizing: border-box;
+  }
+
+  .video-wrapper {
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    margin-top: 24px;
+  }
+
+  video {
+    width: 100%;
+    max-height: 80vh;
+    border-radius: 12px;
+    object-fit: cover;
+  }
+
+  .error {
+    color: red;
+    margin-top: 12px;
+  }
+
+  .loader {
+    color: white;
+    margin-top: 12px;
+  }
+
+  .upload {
+    margin-top: 24px;
+    color: white;
+
+    input {
+      margin-left: 12px;
+    }
+  }
+`;
+
+export function Dashboard() {
+  const [videoUrl, setVideoUrl] = useState<string | undefined>();
+  const [isLoading, setIsLoading] = useState<boolean>(true);
+  const [error, setError] = useState<string | null>(null);
+
+  useEffect(() => {
+    const fetchVideo = async () => {
+      try {
+        const response = await fetch(
+          `https://wn.krbl.ru/media/981d44f9-85e7-4d1d-994b-9eab631ba5d1/download?token=${localStorage.getItem(
+            "refine-auth"
+          )}`
+        ); // <-- укажи тут свой URL
+        if (!response.ok) throw new Error("Не удалось загрузить видео");
+
+        const blob = await response.blob();
+        const objectUrl = URL.createObjectURL(blob);
+        setVideoUrl(objectUrl);
+        setIsLoading(false);
+      } catch (err) {
+        setError("Ошибка при загрузке видео");
+        setIsLoading(false);
+      }
+    };
+
+    fetchVideo();
+
+    // Очистка при размонтировании
+    return () => {
+      if (videoUrl) {
+        URL.revokeObjectURL(videoUrl);
+      }
+    };
+  }, []);
+
+  const handleFileUpload = (e: React.ChangeEvent<HTMLInputElement>) => {
+    const file = e.target.files?.[0];
+    if (file) {
+      const objectUrl = URL.createObjectURL(file);
+      setVideoUrl(objectUrl);
+      setError(null);
+      setIsLoading(false);
+    }
+  };
+
+  return (
+    <StyledDashboard>
+      <div className="container">
+        {isLoading && <div className="loader">Загрузка видео...</div>}
+        {error && <div className="error">{error}</div>}
+
+        {videoUrl && (
+          <div className="video-wrapper">
+            <video src={videoUrl} autoPlay controls muted />
+          </div>
+        )}
+      </div>
+    </StyledDashboard>
+  );
+}
diff --git a/src/preview/widgets/main/MainScreen.tsx b/src/preview/widgets/main/MainScreen.tsx
new file mode 100644
index 0000000..48c433e
--- /dev/null
+++ b/src/preview/widgets/main/MainScreen.tsx
@@ -0,0 +1,35 @@
+import { useEffect } from 'react';
+import { Lightbox } from '@mt/components';
+import { LoadingScreen, useLoading } from '@mt/utils';
+import { useBackendStatus } from './useBackendStatus';
+import { Dashboard } from '../dashboard/Dashboard';
+import { useSplashScreenIsDisplayed } from './useSplashScreenStatus';
+
+export function MainScreen() {
+  const { isLoading, hideLoadingScreen, showLoadingScreen } = useLoading();
+  const { backendStatus } = useBackendStatus();
+  const { isSplashScreenDisplayed } = useSplashScreenIsDisplayed();
+
+  useEffect(() => {
+    if (backendStatus === 'UP' && !isSplashScreenDisplayed) {
+      hideLoadingScreen();
+    } else if (backendStatus === 'DOWN' || isSplashScreenDisplayed) {
+      showLoadingScreen();
+    }
+  }, [
+    backendStatus,
+    isSplashScreenDisplayed,
+    hideLoadingScreen,
+    showLoadingScreen,
+  ]);
+
+  return isLoading ? (
+    <LoadingScreen />
+  ) : (
+    <>
+      <Dashboard />
+
+      <Lightbox />
+    </>
+  );
+}
diff --git a/src/preview/widgets/main/useBackendStatus.ts b/src/preview/widgets/main/useBackendStatus.ts
new file mode 100644
index 0000000..ad2a9b3
--- /dev/null
+++ b/src/preview/widgets/main/useBackendStatus.ts
@@ -0,0 +1,52 @@
+import { useEffect, useRef, useState } from 'react';
+import { useLoading } from '@mt/utils';
+
+type BE_STATUS = 'UP' | 'DOWN';
+interface BackendHealthResponse {
+  status: BE_STATUS;
+}
+
+export const useBackendStatus = () => {
+  const [backendStatus, setBackendStatus] = useState<BE_STATUS>('DOWN');
+  const timeoutRef = useRef<NodeJS.Timeout | null>(null);
+  const { isLoading } = useLoading();
+
+  useEffect(() => {
+    const retry = () => {
+      if (timeoutRef.current) {
+        clearTimeout(timeoutRef.current);
+      }
+
+      timeoutRef.current = setTimeout(() => checkStatus(), 1000);
+    };
+
+    const checkStatus = async () => {
+      await fetch('https://localhost:8443/_app/actuator/health')
+        .then((response) => {
+          if (!response.ok && response.status === 404) {
+            retry();
+          } else {
+            return response.json();
+          }
+        })
+        .then((data: BackendHealthResponse) => {
+          if (data.status === 'UP') {
+            setBackendStatus('UP');
+          } else {
+            setBackendStatus('DOWN');
+            retry();
+          }
+        })
+        .catch((error) => {
+          setBackendStatus('DOWN');
+          retry();
+        });
+    };
+
+    if (isLoading) {
+      checkStatus();
+    }
+  }, [isLoading]);
+
+  return { backendStatus };
+};
diff --git a/src/preview/widgets/main/useSplashScreenStatus.ts b/src/preview/widgets/main/useSplashScreenStatus.ts
new file mode 100644
index 0000000..633eccc
--- /dev/null
+++ b/src/preview/widgets/main/useSplashScreenStatus.ts
@@ -0,0 +1,27 @@
+import { useEffect, useState } from 'react';
+import { EventQueryData, useEventQuery } from '@mt/utils';
+
+export const useSplashScreenIsDisplayed = () => {
+  const [isSplashScreenDisplayed, setIsSplashScreenDisplayed] =
+    useState<boolean>();
+
+  const { data: events, isSuccess } = useEventQuery(
+    '/widgets/splash-screen/events',
+    ['UPDATE_DISPLAYED_FLAG'],
+    { maxRetries: Number.MAX_SAFE_INTEGER }
+  );
+
+  useEffect(() => {
+    if (!isSuccess || !events.length) {
+      return;
+    }
+
+    const { isDisplayed } = events.at(-1) as EventQueryData<{
+      isDisplayed: boolean;
+    }>;
+
+    setIsSplashScreenDisplayed(isDisplayed);
+  }, [isSuccess, events]);
+
+  return { isSplashScreenDisplayed };
+};
diff --git a/src/preview/widgets/nav-widget/components/AccordionListTab/AccordionListTab.tsx b/src/preview/widgets/nav-widget/components/AccordionListTab/AccordionListTab.tsx
new file mode 100644
index 0000000..409dfb6
--- /dev/null
+++ b/src/preview/widgets/nav-widget/components/AccordionListTab/AccordionListTab.tsx
@@ -0,0 +1,108 @@
+import cn from 'classnames';
+import { HTMLAttributes, useCallback, useId, useMemo, useState } from 'react';
+import { FormattedMessage } from 'react-intl';
+import { TouchScrollWrapper, TransportIcon } from '@mt/components';
+import { uuid } from '@mt/common-types';
+import { useServerLocalization } from '@mt/i18n';
+
+import { Attraction, Station } from '../../nav-widget.interface';
+import { NavAccordion, NavAccordionSummary, NavAccordionDetails } from '../../nav-widget.styles';
+import { getDistanceFormatter } from '../get-distance-formatter';
+
+const simulateClick = (id: uuid) => {
+  document.getElementById(`accordSummary_${id}`)?.click();
+};
+
+export type NestedItems = Array<
+  Attraction & Omit<Station, 'type'> & Partial<Pick<Station, 'type'>>
+>;
+export interface AccordionItem
+  extends Omit<Station | Attraction, 'nearbyTouristAttractions' | 'nearbyTransportStops'> {
+  nestedItems: NestedItems;
+}
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  titleId: string;
+  isOpened: boolean;
+  items: AccordionItem[];
+  onExpandChange?: (isExpanded: boolean, itemId: uuid) => void;
+  onNestedItemClick?: (itemId: uuid) => void;
+}
+
+export const AccordionListTab = (props: Props) => {
+  const { titleId, isOpened, items, onExpandChange, onNestedItemClick, ...args } = props;
+  const localizeText = useServerLocalization();
+  const formatDistance = getDistanceFormatter(localizeText);
+  const [expandedItem, setExpandedItem] = useState<uuid | null>(null);
+  const scrollToExpanded = useCallback((id: uuid) => {
+    const expandedEl = document.getElementById(`accordWrapper_${id}`);
+
+    expandedEl?.scrollIntoView({
+      behavior: 'smooth',
+      block: 'nearest',
+      inline: 'nearest',
+    });
+  }, []);
+
+  const tabClasses = useMemo(
+    () =>
+      cn('g-flex-column__item-fixed g-flex-column tab-container', {
+        'tab-container--opened': isOpened,
+      }),
+    [isOpened]
+  );
+
+  const isExpanded = useCallback((id: uuid) => id === expandedItem, [expandedItem]);
+
+  const handleChange = (isExpanded: boolean, itemId: uuid) => {
+    setExpandedItem(isExpanded ? itemId : null);
+    onExpandChange?.(isExpanded, itemId);
+  };
+
+  return (
+    <div className={tabClasses} {...args}>
+      <div className="g-flex-column__item-fixed tab-title">
+        <FormattedMessage id={titleId} />
+      </div>
+
+      <TouchScrollWrapper className="g-flex-column__item">
+        {items.map(({ id, name, nestedItems }) => (
+          <div className="tab-list__item" id={`accordWrapper_${id}`} key={id}>
+            <div className="tab-list__item-expander" onPointerUp={() => simulateClick(id)} />
+
+            <NavAccordion
+              onTransitionEnd={() => isExpanded(id) && scrollToExpanded(id)}
+              disabled={!nestedItems.length}
+              expanded={isExpanded(id)}
+              onChange={(_, expanded) => handleChange(expanded, id)}
+            >
+              <NavAccordionSummary id={`accordSummary_${id}`}>
+                <div className="tab-list__item-label">{localizeText(name)}</div>
+              </NavAccordionSummary>
+
+              {nestedItems.length && (
+                <NavAccordionDetails>
+                  {nestedItems.map(({ id: nestedId, name, type, distance }, index) => (
+                    <div
+                      key={index}
+                      className="g-flex tab-list__item-card"
+                      onPointerUp={() => onNestedItemClick?.(nestedId)}
+                    >
+                      {type && (
+                        <TransportIcon className="g-flex__item-fixed stop__icon" type={type} />
+                      )}
+
+                      <div className="g-flex__item">{localizeText(name)}</div>
+
+                      <div className="g-flex__item-fixed distance">{formatDistance(distance)}</div>
+                    </div>
+                  ))}
+                </NavAccordionDetails>
+              )}
+            </NavAccordion>
+          </div>
+        ))}
+      </TouchScrollWrapper>
+    </div>
+  );
+};
diff --git a/src/preview/widgets/nav-widget/components/AttractionCard/AttractionCard.module.css b/src/preview/widgets/nav-widget/components/AttractionCard/AttractionCard.module.css
new file mode 100644
index 0000000..d49f0c2
--- /dev/null
+++ b/src/preview/widgets/nav-widget/components/AttractionCard/AttractionCard.module.css
@@ -0,0 +1,5 @@
+.root {
+  position: absolute;
+  left: 312px;
+  bottom: 130px;
+}
diff --git a/src/preview/widgets/nav-widget/components/AttractionCard/AttractionCard.tsx b/src/preview/widgets/nav-widget/components/AttractionCard/AttractionCard.tsx
new file mode 100644
index 0000000..845e005
--- /dev/null
+++ b/src/preview/widgets/nav-widget/components/AttractionCard/AttractionCard.tsx
@@ -0,0 +1,21 @@
+import { HTMLAttributes } from 'react';
+
+import { uuid } from '@mt/common-types';
+import { AttractionShortPreview } from '@mt/components';
+import { useGetAttractionDetails } from '../../hooks/useGetAttractionDetails';
+
+import styles from './AttractionCard.module.css';
+
+interface AttractionCardProps {
+  attractionId: uuid;
+}
+
+export function AttractionCard({ attractionId }: AttractionCardProps) {
+  const { isSuccess, data: attractionDetails } = useGetAttractionDetails(attractionId);
+
+  if (!(isSuccess && attractionDetails)) {
+    return null;
+  }
+
+  return <AttractionShortPreview className={styles.root} {...attractionDetails} />;
+}
diff --git a/src/preview/widgets/nav-widget/components/HomeTab/HomeTab.tsx b/src/preview/widgets/nav-widget/components/HomeTab/HomeTab.tsx
new file mode 100644
index 0000000..510ba07
--- /dev/null
+++ b/src/preview/widgets/nav-widget/components/HomeTab/HomeTab.tsx
@@ -0,0 +1,51 @@
+import { ButtonBase } from "@mui/material";
+import { FormattedMessage } from "react-intl";
+
+import { HTMLAttributes } from "react";
+import { NavTabs } from "../../nav-widget";
+import { Icons } from "@mt/components";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  onOpenTab: (tabName: NavTabs) => void;
+}
+
+export const HomeTab = ({ onOpenTab, ...props }: Props) => {
+  return (
+    <div className="g-flex-column" style={{ height: "100%" }} {...props}>
+      <div className="g-flex-column__item-fixed">
+        <Icons.GerbIcon />
+      </div>
+
+      <div className="g-flex-column__item g-flex-column g-flex--justify-center">
+        <ButtonBase
+          className="tab-button"
+          onPointerUp={() => onOpenTab("attractionsTab")}
+        >
+          <FormattedMessage id="attractions" />
+        </ButtonBase>
+
+        <ButtonBase
+          className="tab-button"
+          onPointerUp={() => onOpenTab("stationsTab")}
+        >
+          <FormattedMessage id="stops" />
+        </ButtonBase>
+      </div>
+
+      <div
+        className="g-flex-column__item-fixed"
+        style={{ textAlign: "center" }}
+      >
+        <img src="/assets/icons/company-logo.svg" alt="company-logo" />
+
+        <p className="slogan">
+          <FormattedMessage id="slogan" values={{ br: <br /> }} />
+        </p>
+
+        <p className="hashtag">
+          <FormattedMessage id="hashtag" />
+        </p>
+      </div>
+    </div>
+  );
+};
diff --git a/src/preview/widgets/nav-widget/components/get-distance-formatter.ts b/src/preview/widgets/nav-widget/components/get-distance-formatter.ts
new file mode 100644
index 0000000..755d695
--- /dev/null
+++ b/src/preview/widgets/nav-widget/components/get-distance-formatter.ts
@@ -0,0 +1,29 @@
+import type { LocalizedString, LocalizeTextFn } from '@mt/i18n';
+
+const meterLabel: LocalizedString = {
+  ru: 'м',
+  en: 'm',
+  zh: '米',
+};
+
+const kilometerLabel: LocalizedString = {
+  ru: 'км',
+  en: 'km',
+  zh: '公里',
+};
+
+export function getDistanceFormatter(
+  localizeText: LocalizeTextFn
+): (distance: number | undefined) => string {
+  return (distance) => {
+    if (!distance) {
+      return '';
+    }
+
+    if (distance < 1000) {
+      return `${distance} ${localizeText(meterLabel)}`;
+    }
+
+    return `${(distance / 1000).toFixed(2)} ${localizeText(kilometerLabel)}`;
+  };
+}
diff --git a/src/preview/widgets/nav-widget/components/index.ts b/src/preview/widgets/nav-widget/components/index.ts
new file mode 100644
index 0000000..de0f640
--- /dev/null
+++ b/src/preview/widgets/nav-widget/components/index.ts
@@ -0,0 +1,3 @@
+export * from './HomeTab/HomeTab';
+export * from './AttractionCard/AttractionCard';
+export * from './AccordionListTab/AccordionListTab';
diff --git a/src/preview/widgets/nav-widget/hooks/index.ts b/src/preview/widgets/nav-widget/hooks/index.ts
new file mode 100644
index 0000000..447ca8d
--- /dev/null
+++ b/src/preview/widgets/nav-widget/hooks/index.ts
@@ -0,0 +1 @@
+export * from './useGetAttractions';
diff --git a/src/preview/widgets/nav-widget/hooks/useGetAttractionDetails.ts b/src/preview/widgets/nav-widget/hooks/useGetAttractionDetails.ts
new file mode 100644
index 0000000..d8dba45
--- /dev/null
+++ b/src/preview/widgets/nav-widget/hooks/useGetAttractionDetails.ts
@@ -0,0 +1,27 @@
+import { uuid } from "@mt/common-types";
+import { AttractionDetailsBE } from "../nav-widget.interface";
+import { AttractionShortPreviewProps } from "@mt/components";
+import { UseQueryResult, useQuery } from "@tanstack/react-query";
+
+export function useGetAttractionDetails(
+  touristAttractionId: uuid
+): UseQueryResult<AttractionShortPreviewProps> {
+  return useQuery({
+    queryKey: ["getAttractionDetails", touristAttractionId],
+    queryFn: async () => {
+      const {
+        touristAttractionAddress: subtitle,
+        touristAttractionDescription: content,
+        touristAttractionName: title,
+        touristAttractionImageUrl: img,
+      }: AttractionDetailsBE = await fetch(
+        "https://localhost:8443/widgets/attraction-info/data-by-params?" +
+          new URLSearchParams({
+            touristAttractionId: touristAttractionId as string,
+          })
+      ).then((res) => res.json());
+
+      return { img, title, subtitle, content };
+    },
+  });
+}
diff --git a/src/preview/widgets/nav-widget/hooks/useGetAttractions.ts b/src/preview/widgets/nav-widget/hooks/useGetAttractions.ts
new file mode 100644
index 0000000..d9e0ace
--- /dev/null
+++ b/src/preview/widgets/nav-widget/hooks/useGetAttractions.ts
@@ -0,0 +1,28 @@
+import { UseQueryResult, useQuery } from "@tanstack/react-query";
+import { Attraction } from "../nav-widget.interface";
+import { useEventQuery } from "@mt/utils";
+import { useEffect } from "react";
+
+export function useGetAttractions(): UseQueryResult<Attraction[]> {
+  const { data, isSuccess } = useEventQuery(
+    // 'getAttractionsEvents',
+    "/widgets/attraction-list/events",
+    ["REFRESH_DATA"]
+  );
+
+  const attractionQuery = useQuery({
+    queryKey: ["getAttractions"],
+    queryFn: async () =>
+      await fetch("https://localhost:8443/widgets/attraction-list/data")
+        .then((res) => res.json())
+        .then(({ touristAttractions }) => touristAttractions),
+  });
+
+  useEffect(() => {
+    if (isSuccess && data.length) {
+      attractionQuery.refetch();
+    }
+  }, [data, isSuccess]);
+
+  return attractionQuery;
+}
diff --git a/src/preview/widgets/nav-widget/hooks/useGetStations.ts b/src/preview/widgets/nav-widget/hooks/useGetStations.ts
new file mode 100644
index 0000000..dcde17f
--- /dev/null
+++ b/src/preview/widgets/nav-widget/hooks/useGetStations.ts
@@ -0,0 +1,31 @@
+import { UseQueryResult, useQuery } from "@tanstack/react-query";
+import { Station } from "../nav-widget.interface";
+import { useEventQuery } from "@mt/utils";
+import { useEffect } from "react";
+
+export function useGetStations(): UseQueryResult<Station[]> {
+  const { data = [], isSuccess } = useEventQuery(
+    // 'getStationsEvents',
+    "/widgets/station-list/events",
+    ["REFRESH_DATA"]
+  );
+
+  const stationQuery = useQuery({
+    queryKey: ["getStations"],
+    queryFn: async () => {
+      const { stations } = await fetch(
+        "https://localhost:8443/widgets/station-list/data"
+      ).then((res) => res.json());
+
+      return stations;
+    },
+  });
+
+  useEffect(() => {
+    if (isSuccess && data.length) {
+      stationQuery.refetch();
+    }
+  }, [data, isSuccess]);
+
+  return stationQuery;
+}
diff --git a/src/preview/widgets/nav-widget/nav-widget-container.tsx b/src/preview/widgets/nav-widget/nav-widget-container.tsx
new file mode 100644
index 0000000..3213f0b
--- /dev/null
+++ b/src/preview/widgets/nav-widget/nav-widget-container.tsx
@@ -0,0 +1,15 @@
+import { HTMLAttributes } from "react";
+import { NavWidget } from "./nav-widget";
+import { useGetStations } from "./hooks/useGetStations";
+import { useGetAttractions } from "./hooks";
+
+export function NavWidgetContainer(props: HTMLAttributes<HTMLDivElement>) {
+  const { data: stations } = useGetStations();
+  const { data: attractions } = useGetAttractions();
+
+  if (!stations || !attractions) {
+    return null;
+  }
+
+  return <NavWidget {...props} attractions={attractions} stations={stations} />;
+}
diff --git a/src/preview/widgets/nav-widget/nav-widget.interface.ts b/src/preview/widgets/nav-widget/nav-widget.interface.ts
new file mode 100644
index 0000000..50c978e
--- /dev/null
+++ b/src/preview/widgets/nav-widget/nav-widget.interface.ts
@@ -0,0 +1,24 @@
+import { uuid, TransportType } from '@mt/common-types';
+import { LocalizedString } from '@mt/i18n';
+
+export interface Station {
+  id: uuid;
+  name: LocalizedString;
+  type: TransportType;
+  distance?: number;
+  nearbyTouristAttractions: Attraction[];
+}
+
+export interface Attraction {
+  id: uuid;
+  name: LocalizedString;
+  distance?: number;
+  nearbyTransportStops: Station[];
+}
+
+export interface AttractionDetailsBE {
+  touristAttractionImageUrl: string;
+  touristAttractionName: LocalizedString;
+  touristAttractionAddress: LocalizedString;
+  touristAttractionDescription: LocalizedString;
+}
diff --git a/src/preview/widgets/nav-widget/nav-widget.styles.tsx b/src/preview/widgets/nav-widget/nav-widget.styles.tsx
new file mode 100644
index 0000000..ab13ac8
--- /dev/null
+++ b/src/preview/widgets/nav-widget/nav-widget.styles.tsx
@@ -0,0 +1,169 @@
+import styled from '@emotion/styled';
+import { AccordionDetails, AccordionSummary, accordionSummaryClasses } from '@mui/material';
+import MuiAccordion, { accordionClasses } from '@mui/material/Accordion';
+
+export const NavAccordion = styled(MuiAccordion)`
+  box-shadow: none;
+  background-color: transparent;
+  color: #ffffff;
+
+  &:before {
+    content: '';
+    display: none;
+  }
+
+  &.${accordionClasses.expanded} {
+    margin: 0;
+  }
+  &.${accordionClasses.disabled} {
+    background-color: transparent;
+  }
+`;
+
+export const NavAccordionSummary = styled(AccordionSummary)`
+  pointer-events: none;
+  border-bottom: 1px solid #a6a6a6;
+  padding: 8px 16px;
+  line-height: 24px;
+  margin-top: 8px;
+
+  .${accordionSummaryClasses.content} {
+    margin: 0;
+    width: 100%;
+  }
+  &.${accordionSummaryClasses.expanded} {
+    min-height: 0;
+    .${accordionSummaryClasses.content} {
+      margin: 0;
+    }
+  }
+
+  &.${accordionSummaryClasses.disabled} {
+    opacity: 1;
+  }
+`;
+
+export const NavAccordionDetails = styled(AccordionDetails)`
+  padding: 12px 16px;
+  background: linear-gradient(90.36deg, #4e351f 0.27%, #59422d 47.89%, #65503c 99.65%);
+`;
+
+export const StyledNavWidget = styled.div`
+  height: 100%;
+  transition: all ease-in-out 0.3s;
+
+  &:has(.tab-container--opened) {
+    background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%),
+      rgba(128, 108, 89, 0.4);
+  }
+
+  .tab-button {
+    display: block;
+    padding: 8px 16px;
+    background: #ffffff;
+    color: #000;
+    margin: 12px 30px;
+    width: calc(100% - 60px);
+    border-radius: 10px;
+  }
+
+  .slogan {
+    font-style: italic;
+    font-weight: 400;
+    font-size: 16px;
+    line-height: 150%;
+    margin-top: 35px;
+  }
+
+  .hashtag {
+    margin-top: 180px;
+    margin-bottom: 32px;
+  }
+
+  .tab-container {
+    transform: translateY(100%);
+    height: calc(100% - 250px);
+    width: 100%;
+    transition: all ease-in-out 0.3s;
+    position: absolute;
+    bottom: 0;
+
+    background: linear-gradient(
+        113.51deg,
+        rgba(255, 255, 255, 0) 8.71%,
+        rgba(255, 255, 255, 0.16) 69.69%
+      ),
+      #806c59;
+    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
+    border-radius: 10px 10px 0 0;
+
+    &.tab-container--opened {
+      transform: translateY(0);
+      filter: drop-shadow(0px -6px 13px rgba(0, 0, 0, 0.25));
+    }
+  }
+
+  .tab-title {
+    text-align: center;
+    font-weight: 700;
+    font-size: 16px;
+    line-height: 24px;
+    border-bottom: 1px solid #ffffff;
+    padding-top: 13px;
+    padding-bottom: 9px;
+    background: linear-gradient(
+        114deg,
+        rgba(255, 255, 255, 0) 8.71%,
+        rgba(255, 255, 255, 0.16) 69.69%
+      ),
+      #806c59;
+    position: relative;
+    &:before {
+      content: '';
+      width: 98px;
+      height: 4px;
+      border-radius: 0 0 4px 4px;
+      background: #a6a6a6;
+      opacity: 0.35;
+      position: absolute;
+      top: 0;
+      left: 50%;
+      transform: translateX(-50%);
+    }
+  }
+
+  .tab-list__item {
+    position: relative;
+  }
+  .tab-list__item-expander {
+    position: absolute;
+    top: -8px;
+    left: 0;
+    width: 100%;
+    height: 55px;
+    z-index: 1;
+    cursor: pointer;
+  }
+  .tab-list__item-label {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    text-align: left;
+    display: block;
+  }
+  .tab-list__item-card {
+    padding: 12px 0;
+  }
+
+  .stop__icon {
+    margin-right: 8px;
+    width: 18px;
+  }
+
+  .distance {
+    font-size: 12px;
+    color: #d9d9d9;
+    margin-left: 5px;
+    line-height: 185%;
+  }
+`;
diff --git a/src/preview/widgets/nav-widget/nav-widget.tsx b/src/preview/widgets/nav-widget/nav-widget.tsx
new file mode 100644
index 0000000..cd7906e
--- /dev/null
+++ b/src/preview/widgets/nav-widget/nav-widget.tsx
@@ -0,0 +1,119 @@
+import cn from "classnames";
+import {
+  HTMLAttributes,
+  ReactNode,
+  useContext,
+  useEffect,
+  useMemo,
+  useState,
+} from "react";
+import { LocalizationContext, useServerLocalization } from "@mt/i18n";
+import { Order, uuid } from "@mt/common-types";
+
+import { AttractionCard, AccordionListTab, NestedItems } from "./components";
+import { Drawer, Icons } from "@mt/components";
+
+import { Attraction, Station } from "./nav-widget.interface";
+import { HomeTab } from "./components";
+import { StyledNavWidget } from "./nav-widget.styles";
+
+export type NavTabs = "stationsTab" | "attractionsTab";
+
+export interface NavWidgetProps extends HTMLAttributes<HTMLDivElement> {
+  stations: Station[];
+  attractions: Attraction[];
+}
+export function NavWidget({ stations, attractions }: NavWidgetProps) {
+  const { setLocale, locale } = useContext(LocalizationContext);
+  const localizeText = useServerLocalization();
+  const [isOpen, setIsOpen] = useState<boolean>(false);
+  const [openedTab, setOpenedTab] = useState<NavTabs | null>(null);
+  const [attractionId, setAttractionId] = useState<uuid | null>(null);
+  const [attractionOrder, setAttractionOrder] = useState<Order>("asc");
+
+  const sortAttractionsBtn: ReactNode = useMemo(() => {
+    if (openedTab === "attractionsTab") {
+      return (
+        <div
+          className={cn([
+            { "order-btn-inverse": attractionOrder === "desc" },
+            "action-btn",
+          ])}
+          onPointerUp={() =>
+            setAttractionOrder((prev) => (prev === "asc" ? "desc" : "asc"))
+          }
+        >
+          <Icons.SortIcon />
+        </div>
+      );
+    }
+
+    return <></>;
+  }, [openedTab, setAttractionOrder, attractionOrder]);
+
+  useEffect(() => {
+    if (!isOpen) {
+      setOpenedTab(null);
+    }
+
+    if (!isOpen || !openedTab) {
+      setAttractionId(null);
+    }
+  }, [isOpen, openedTab]);
+
+  const mappedStations = useMemo(() => {
+    return (stations ?? []).map(({ nearbyTouristAttractions, ...station }) => ({
+      ...station,
+      nestedItems: nearbyTouristAttractions as NestedItems,
+    }));
+  }, [stations]);
+
+  const mappedAttractions = useMemo(() => {
+    return (attractions ?? [])
+      .map(({ nearbyTransportStops, ...attraction }) => ({
+        ...attraction,
+        nestedItems: nearbyTransportStops as NestedItems,
+      }))
+      .sort(
+        (a, b) =>
+          localizeText(a.name)
+            .toLowerCase()
+            .localeCompare(localizeText(b.name).toLowerCase()) *
+          (attractionOrder === "asc" ? 1 : -1)
+      );
+  }, [attractions, attractionOrder, locale]);
+
+  const handleExpandChange = (isExpanded: boolean, id: uuid) =>
+    setAttractionId(isExpanded ? id : null);
+
+  return (
+    <Drawer
+      className={cn({ "nav-widget--opened": isOpen })}
+      isOpen={isOpen}
+      onToggle={setIsOpen}
+      onHomeBtnClick={() => setOpenedTab(null)}
+      onLocaleChange={setLocale}
+      actions={sortAttractionsBtn}
+    >
+      <StyledNavWidget>
+        <HomeTab onOpenTab={setOpenedTab} />
+
+        <AccordionListTab
+          titleId="stops"
+          isOpened={openedTab === "stationsTab"}
+          items={mappedStations}
+          onNestedItemClick={setAttractionId}
+        />
+
+        <AccordionListTab
+          titleId="attractions"
+          isOpened={openedTab === "attractionsTab"}
+          items={mappedAttractions}
+          onExpandChange={handleExpandChange}
+        />
+      </StyledNavWidget>
+
+      {attractionId && <AttractionCard attractionId={attractionId} />}
+    </Drawer>
+  );
+}
diff --git a/src/preview/widgets/operative-info-widget/OperativeInfoWidget.css b/src/preview/widgets/operative-info-widget/OperativeInfoWidget.css
new file mode 100644
index 0000000..3c51f5d
--- /dev/null
+++ b/src/preview/widgets/operative-info-widget/OperativeInfoWidget.css
@@ -0,0 +1,76 @@
+.operative-info-widget {
+  position: absolute;
+  bottom: 12px;
+  right: 32px;
+}
+
+.info-btn {
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  width: 48px;
+  height: 48px;
+  border: 0;
+  padding: 0;
+  background: none;
+  cursor: pointer;
+}
+
+.popup {
+  position: absolute;
+  right: 48px; /*btn size*/
+  bottom: 0;
+
+  min-width: 371px;
+  padding: 16px;
+  margin-right: 16px;
+  border-radius: 10px;
+
+  background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%),
+    rgba(179, 165, 152, 0.4);
+  box-shadow: inset 4px 4px 12px rgba(255, 255, 255, 0.12);
+
+  font-weight: 700;
+  font-size: 18px;
+  line-height: 150%;
+  color: #ffffff;
+}
+
+.popup-title {
+  margin-bottom: 4px;
+}
+
+.transfers-list,
+.alerts-list {
+  margin: 0;
+  padding: 0;
+}
+
+.alerts-list {
+  margin-bottom: 20px;
+}
+
+.transfer-list-item,
+.alert-list-item {
+  display: flex;
+  align-items: center;
+  gap: 9px;
+  list-style: none;
+  padding: 6px 12px;
+}
+
+.alert-name {
+  display: flex;
+  align-items: center;
+}
+
+.transfer-type-icon,
+.transfer-type-icon svg,
+.alert-icon {
+  width: 23px;
+  height: 23px;
+}
+
+.alert-icon {
+  margin-right: 6px;
+}
diff --git a/src/preview/widgets/operative-info-widget/alert.interface.ts b/src/preview/widgets/operative-info-widget/alert.interface.ts
new file mode 100644
index 0000000..dbb391f
--- /dev/null
+++ b/src/preview/widgets/operative-info-widget/alert.interface.ts
@@ -0,0 +1,15 @@
+import { LocalizedString } from '@mt/i18n';
+
+export interface AlertMessage {
+  key: string;
+  bgColor: string;
+  fontSize: number;
+  iconUrl: string;
+  order: number;
+  text: LocalizedString;
+}
+
+export interface AlertEvent {
+  ['@type']: 'UPDATE_AVAILABLE_ALERTS';
+  msgs: AlertMessage[];
+}
diff --git a/src/preview/widgets/operative-info-widget/operative-info-widget.tsx b/src/preview/widgets/operative-info-widget/operative-info-widget.tsx
new file mode 100644
index 0000000..d55bec7
--- /dev/null
+++ b/src/preview/widgets/operative-info-widget/operative-info-widget.tsx
@@ -0,0 +1,73 @@
+import React, { useEffect, useState } from 'react';
+import { Icons, TransportIcon } from '@mt/components';
+import './OperativeInfoWidget.css';
+import { useOperativeInfo } from './useOperativeInfo';
+import { FormattedMessage } from 'react-intl';
+import { useServerLocalization } from '@mt/i18n';
+import { AlertMessage } from './alert.interface';
+import { TransferItem } from './transfer.interface';
+
+export function OperativeInfoWidget() {
+  const [isOpen, setIsOpen] = useState<boolean>(false);
+  const { transfers, alerts } = useOperativeInfo();
+
+  useEffect(() => {
+    setIsOpen(transfers.length > 0 || alerts.length > 0);
+  }, [transfers, alerts]);
+
+  return (
+    <div className="operative-info-widget">
+      <button className="info-btn" onPointerUp={() => setIsOpen(!isOpen)}>
+        <Icons.InfoBtn />
+      </button>
+
+      {isOpen && (
+        <div className="popup">
+          <AlertsList alerts={alerts} />
+          <TransfersList transfers={transfers} />
+        </div>
+      )}
+    </div>
+  );
+}
+
+function AlertsList({ alerts }: { alerts: AlertMessage[] }) {
+  const localizeText = useServerLocalization();
+
+  return alerts.length ? (
+    <ul className="alerts-list">
+      {alerts.map(({ key, bgColor, fontSize, iconUrl, text }) => (
+        <li
+          className="alert-list-item"
+          key={key}
+          style={{ backgroundColor: bgColor, fontSize: fontSize }}
+        >
+          <span className="alert-name">
+            {iconUrl && <img src={iconUrl} alt="" className="alert-icon" />}
+            {localizeText(text)}
+          </span>
+        </li>
+      ))}
+    </ul>
+  ) : null;
+}
+
+function TransfersList({ transfers }: { transfers: TransferItem[] }) {
+  return transfers.length ? (
+    <>
+      <div className="popup-title">
+        <FormattedMessage id="available-transfers" />
+      </div>
+
+      <ul className="transfers-list">
+        {transfers.map(({ type, label }) => (
+          <li className="transfer-list-item" key={type + label}>
+            <TransportIcon className="transfer-type-icon" type={type} />
+
+            <span className="transfer-name">{label}</span>
+          </li>
+        ))}
+      </ul>
+    </>
+  ) : null;
+}
diff --git a/src/preview/widgets/operative-info-widget/transfer.interface.ts b/src/preview/widgets/operative-info-widget/transfer.interface.ts
new file mode 100644
index 0000000..bbc620f
--- /dev/null
+++ b/src/preview/widgets/operative-info-widget/transfer.interface.ts
@@ -0,0 +1,18 @@
+import { Transfer, TransportType } from "@mt/common-types";
+
+export interface PublicRoute {
+  type: TransportType;
+  // Public route number string (ex.: '43')
+  number: string;
+}
+
+export interface TransferEvent {
+  ["@type"]: "UPDATE_AVAILABLE_TRANSFERS";
+  publicRoutes: PublicRoute[];
+  stations: Transfer[];
+}
+
+export interface TransferItem {
+  type: TransportType;
+  label: string;
+}
diff --git a/src/preview/widgets/operative-info-widget/useOperativeInfo.ts b/src/preview/widgets/operative-info-widget/useOperativeInfo.ts
new file mode 100644
index 0000000..9d59738
--- /dev/null
+++ b/src/preview/widgets/operative-info-widget/useOperativeInfo.ts
@@ -0,0 +1,89 @@
+import { Dispatch, useEffect, useState } from "react";
+import { EventQueryData, useEventQuery } from "@mt/utils";
+import { TransportType } from "@mt/common-types";
+import { LocalizeTextFn, useServerLocalization } from "@mt/i18n";
+import { TransferEvent, PublicRoute, TransferItem } from "./transfer.interface";
+import { AlertEvent, AlertMessage } from "./alert.interface";
+
+export const useOperativeInfo = () => {
+  const localizeText = useServerLocalization();
+  const [transfers, setTransfers] = useState<TransferItem[]>([]);
+  const [alerts, setAlerts] = useState<AlertMessage[]>([]);
+
+  const { data: events, isSuccess } = useEventQuery<TransferEvent | AlertEvent>(
+    "/widgets/operative-info/events",
+    ["UPDATE_AVAILABLE_TRANSFERS", "UPDATE_AVAILABLE_ALERTS"]
+  );
+
+  useEffect(() => {
+    if (isSuccess && events.length) {
+      // prettier-ignore
+      const transferEvent = events.filter((e) => e['@type'] === 'UPDATE_AVAILABLE_TRANSFERS').at(-1) as EventQueryData<TransferEvent>;
+      // prettier-ignore
+      const alertEvent = events.filter((e) => e['@type'] === 'UPDATE_AVAILABLE_ALERTS').at(-1) as EventQueryData<AlertEvent>;
+
+      updateTransfers(transferEvent, setTransfers, localizeText);
+      updateAlerts(alertEvent, setAlerts);
+    }
+  }, [events, isSuccess]);
+
+  return { transfers, alerts };
+};
+
+function updateTransfers(
+  transferEvent: EventQueryData<TransferEvent>,
+  setTransfers: Dispatch<TransferItem[]>,
+  localizeText: LocalizeTextFn
+) {
+  if (transferEvent) {
+    const { publicRoutes, stations } = transferEvent as TransferEvent;
+
+    const newTransfers: TransferItem[] = [
+      ...mapPublicRoutesToTransfers(publicRoutes),
+      ...stations.map(({ type, name }) => ({
+        type,
+        label: localizeText(name),
+      })),
+    ];
+
+    setTransfers(newTransfers);
+  }
+}
+
+function updateAlerts(
+  alertEvent: EventQueryData<AlertEvent>,
+  setAlerts: Dispatch<AlertMessage[]>
+) {
+  if (alertEvent) {
+    const { msgs } = alertEvent as AlertEvent;
+
+    const newAlerts: AlertMessage[] = [...msgs]
+      .sort((a, b) => a.order - a.order)
+      .map((msg) => ({
+        ...msg,
+        key: crypto.randomUUID(),
+      }));
+
+    setAlerts(newAlerts);
+  }
+}
+
+function mapPublicRoutesToTransfers(routes: PublicRoute[]): TransferItem[] {
+  const routeMap = routes.reduce(
+    (acc: Partial<Record<TransportType, string[]>>, item) => {
+      const { type, number } = item;
+
+      acc[type] = [...(acc[type] ?? []), number];
+
+      return acc;
+    },
+    {}
+  );
+
+  return Object.entries(routeMap).flatMap(([type, numbers]) => {
+    return {
+      type,
+      label: numbers.join(", "),
+    } as TransferItem;
+  });
+}
diff --git a/src/preview/widgets/weather-widget/weather.interface.ts b/src/preview/widgets/weather-widget/weather.interface.ts
new file mode 100644
index 0000000..d6301b6
--- /dev/null
+++ b/src/preview/widgets/weather-widget/weather.interface.ts
@@ -0,0 +1,29 @@
+export type WeatherTypes =
+  | 'CLOUDY'
+  | 'PARTLYCLOUDY'
+  | 'RAINY'
+  | 'SNOW'
+  | 'SNOWY'
+  | 'SUNNY'
+  | 'THUNDER';
+
+export interface WeatherDayShortProps {
+  condition: WeatherTypes | null;
+  temperature: number | null;
+}
+export type WeatherDayProps = WeatherDayShortProps & {
+  humidity: number | null;
+  windSpeed: number | null;
+};
+export interface WeatherForecastsProps {
+  weatherInfo: WeatherDayShortProps;
+}
+
+export interface WeatherWidgetData {
+  forecasts: WeatherForecastsProps[];
+  weatherInfo: WeatherDayProps;
+}
+
+export type WeatherDayRow = WeatherDayShortProps & {
+  weekday: number;
+};