@coinswap-app/uikit 1.0.1 → 1.0.3

package/dist/index.esm.js

@@ -270,6 +270,13 @@ function _regeneratorDefine(e, r, n, t) {
 function _slicedToArray(r, e) {
   return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest();
 }
+function _taggedTemplateLiteral(e, t) {
+  return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, {
+    raw: {
+      value: Object.freeze(t)
+    }
+  }));
+}
 function _toConsumableArray(r) {
   return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread();
 }
@@ -302,12 +309,10 @@ var getThemeValue = function getThemeValue(path, fallback) {
   };
 };
 
-var rotate$1 = keyframes(["from{transform:rotate(0deg);}to{transform:rotate(360deg);}"]);
-var spinStyle = css(["animation:", " 2s linear infinite;"], rotate$1);
-var Svg = styled.svg.withConfig({
-  displayName: "Svg",
-  componentId: "sc-1oa1mzv-0"
-})(["fill:", ";flex-shrink:0;", " ", " path{fill:", ";fill-opacity:", ";}"], function (_ref) {
+var _templateObject$2b, _templateObject2$16, _templateObject3$O;
+var rotate$1 = keyframes(_templateObject$2b || (_templateObject$2b = _taggedTemplateLiteral(["\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n"])));
+var spinStyle = css(_templateObject2$16 || (_templateObject2$16 = _taggedTemplateLiteral(["\n  animation: ", " 2s linear infinite;\n"])), rotate$1);
+var Svg = styled("svg")(_templateObject3$O || (_templateObject3$O = _taggedTemplateLiteral(["\n  fill: ", ";\n  flex-shrink: 0;\n\n  ", "\n  ", "\n  path {\n    fill: ", ";\n    //Opacity set on 0.5\n    fill-opacity: ", ";\n  }\n"])), function (_ref) {
   var theme = _ref.theme,
     color = _ref.color;
   return getThemeValue("colors.".concat(color), color)(theme);
@@ -375,6 +380,7 @@ var Icon$2E = function Icon(props) {
   }));
 };
 
+var _templateObject$2a;
 var getColor$1 = function getColor(_ref) {
   var color = _ref.color,
     theme = _ref.theme;
@@ -385,10 +391,7 @@ var getFontSize = function getFontSize(_ref2) {
     small = _ref2.small;
   return small ? "14px" : fontSize || "16px";
 };
-var Text = styled.div.withConfig({
-  displayName: "Text",
-  componentId: "sc-nskjht-0"
-})(["color:", ";font-size:", ";font-weight:", ";line-height:1.5;", " ", " ", ""], getColor$1, getFontSize, function (_ref3) {
+var Text = styled.div(_templateObject$2a || (_templateObject$2a = _taggedTemplateLiteral(["\n  color: ", ";\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: 1.5;\n  ", "\n  ", "\n  ", "\n"])), getColor$1, getFontSize, function (_ref3) {
   var bold = _ref3.bold;
   return bold ? 700 : 400;
 }, function (_ref4) {
@@ -438,6 +441,7 @@ var variants$4 = {
   OUTLINE: "outline"
 };
 
+var _templateObject$29;
 var getDisabledStyles$3 = function getDisabledStyles(_ref) {
   var isLoading = _ref.isLoading,
     theme = _ref.theme;
@@ -462,10 +466,7 @@ var getButtonVariantProp$3 = function getButtonVariantProp(prop) {
     return theme.button[variant][prop];
   };
 };
-var StyledButton$2 = styled.button.withConfig({
-  displayName: "StyledButton",
-  componentId: "sc-pxfjak-0"
-})(["align-items:center;background-color:", ";border:", ";border-radius:10px;color:", ";cursor:pointer;display:inline-flex;font-family:inherit;font-size:16px;font-weight:600;width:", ";height:", ";line-height:1;letter-spacing:0.03em;justify-content:center;outline:0;padding:", ";transition:background-color 0.2s;opacity:", ";&:hover:not(:disabled):not(.button--disabled):not(:active){background-color:", ";border-color:", ";}&:focus:not(:active){box-shadow:0 0 0 1px ", ";}&:active{background-color:", ";box-shadow:", ";}", " ", " ", ""], getButtonVariantProp$3("background"), getButtonVariantProp$3("border"), function (_ref4) {
+var StyledButton$2 = styled.button(_templateObject$29 || (_templateObject$29 = _taggedTemplateLiteral(["\n  align-items: center;\n  background-color: ", ";\n  border: ", ";\n  border-radius: 10px;\n  color: ", ";\n  cursor: pointer;\n  display: inline-flex;\n  font-family: inherit;\n  font-size: 16px;\n  font-weight: 600;\n  /* max-content instead of auto for Safari fix */\n  width: ", ";\n  height: ", ";\n  line-height: 1;\n  letter-spacing: 0.03em;\n  justify-content: center;\n  outline: 0;\n  padding: ", ";\n  transition: background-color 0.2s;\n  opacity: ", ";\n\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    background-color: ", ";\n    border-color: ", ";\n  }\n\n  &:focus:not(:active) {\n    box-shadow: 0 0 0 1px ", ";\n  }\n\n  &:active {\n    background-color: ", ";\n    box-shadow: ", ";\n  }\n\n  ", "\n  ", "\n  ", "\n"])), getButtonVariantProp$3("background"), getButtonVariantProp$3("border"), function (_ref4) {
   var white = _ref4.white;
   return white ? "white" : getButtonVariantProp$3("color");
 }, function (_ref5) {
@@ -7891,16 +7892,11 @@ var Icon$T = function Icon(props) {
   });
 };
 
-var ButtonText = styled.span.withConfig({
-  displayName: "RampButtonLite__ButtonText",
-  componentId: "sc-kepl07-0"
-})(["font-weight:bold;font-size:16px;line-height:28px;width:84px;transition:all 0.5s ease-in;display:", ";"], function (props) {
+var _templateObject$28, _templateObject2$15;
+var ButtonText = styled.span(_templateObject$28 || (_templateObject$28 = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 16px;\n  line-height: 28px;\n  width: 84px;\n  transition: all 0.5s ease-in;\n  display: ", ";\n"])), function (props) {
   return props.extended ? "block" : "none";
 });
-var RampButtonWrapper$1 = styled(Button$1).withConfig({
-  displayName: "RampButtonLite__RampButtonWrapper",
-  componentId: "sc-kepl07-1"
-})(["padding:6px 10px;padding:", ";outline:none;border:none;width:", "px;height:40px;background:", ";border-radius:10px;display:flex;flex-direction:row;justify-content:center;align-items:center;cursor:pointer;overflow:hidden;transition:all 0.5s ease-in;"], function (props) {
+var RampButtonWrapper$1 = styled(Button$1)(_templateObject2$15 || (_templateObject2$15 = _taggedTemplateLiteral(["\n  padding: 6px 10px;\n  padding: ", ";\n  outline: none;\n  border: none;\n  width: ", "px;\n  height: 40px;\n  background: ", ";\n  border-radius: 10px;\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n  overflow: hidden;\n  transition: all 0.5s ease-in;\n"])), function (props) {
   return props.extended ? "6px 25px" : "6px 10px";
 }, function (props) {
   return props.extended ? 110 : 60;
@@ -7928,18 +7924,14 @@ var RampButtonLite = function RampButtonLite(_ref2) {
   });
 };
 
-var IconButton = styled(Button$1).withConfig({
-  displayName: "IconButton",
-  componentId: "sc-9rnm19-0"
-})(["padding:0;width:", ";margin:0px 4px;border:none;outline:none;"], function (_ref) {
+var _templateObject$27;
+var IconButton = styled(Button$1)(_templateObject$27 || (_templateObject$27 = _taggedTemplateLiteral(["\n  padding: 0;\n  width: ", ";\n  margin: 0px 4px;\n  border: none;\n  outline: none;\n"])), function (_ref) {
   var size = _ref.size;
   return size === "sm" ? "32px" : "60px";
 });
 
-var RampButtonWrapper = styled.button.withConfig({
-  displayName: "RampButton__RampButtonWrapper",
-  componentId: "sc-1y4rjmy-0"
-})(["padding:6px 10px;outline:none;border:none;width:", "px;height:40px;background:#2b2b38;border-radius:10px;display:flex;flex-direction:row;justify-content:space-around;align-items:center;color:black;cursor:pointer;position:relative;overflow:hidden;&:active{background:", ";}transition:all 0.5s ease-in;"], function (props) {
+var _templateObject$26;
+var RampButtonWrapper = styled.button(_templateObject$26 || (_templateObject$26 = _taggedTemplateLiteral(["\n  padding: 6px 10px;\n  outline: none;\n  border: none;\n  width: ", "px;\n  height: 40px;\n  background: #2b2b38;\n  border-radius: 10px;\n  display: flex;\n  flex-direction: row;\n  justify-content: space-around;\n  align-items: center;\n  color: black;\n  cursor: pointer;\n  position: relative;\n  overflow: hidden;\n  &:active {\n    background: ", ";\n  }\n  transition: all 0.5s ease-in;\n"])), function (props) {
   return props.extended ? 108 : 70;
 }, function (_ref) {
   var theme = _ref.theme;
@@ -7963,15 +7955,11 @@ var RampButton = function RampButton(_ref2) {
   });
 };
 
-var Box = styled.div.withConfig({
-  displayName: "Box",
-  componentId: "sc-1vk503f-0"
-})(["", " ", " ", " ", " ", ""], background, border, layout, position, space);
+var _templateObject$25;
+var Box = styled.div(_templateObject$25 || (_templateObject$25 = _taggedTemplateLiteral(["\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n"])), background, border, layout, position, space);
 
-var Flex = styled(Box).withConfig({
-  displayName: "Flex",
-  componentId: "sc-10l7f81-0"
-})(["display:flex;", ""], flexbox);
+var _templateObject$24;
+var Flex = styled(Box)(_templateObject$24 || (_templateObject$24 = _taggedTemplateLiteral(["\n  display: flex;\n  ", "\n"])), flexbox);
 
 var variants$3 = {
   INFO: "info",
@@ -7980,6 +7968,7 @@ var variants$3 = {
   WARNING: "warning"
 };
 
+var _templateObject$23, _templateObject2$14, _templateObject3$N, _templateObject4$y;
 var getThemeColor = function getThemeColor(_ref) {
   var theme = _ref.theme,
     _ref$variant = _ref.variant,
@@ -8010,26 +7999,14 @@ var getIcon = function getIcon() {
       return Icon$2E;
   }
 };
-var IconLabel = styled.div.withConfig({
-  displayName: "Alert__IconLabel",
-  componentId: "sc-iju7nx-0"
-})(["background-color:", ";border-radius:10px 0 0 10px;color:black;padding:12px;"], getThemeColor);
+var IconLabel = styled.div(_templateObject$23 || (_templateObject$23 = _taggedTemplateLiteral(["\n  background-color: ", ";\n  border-radius: 10px 0 0 10px;\n  color: black;\n  padding: 12px;\n"])), getThemeColor);
 var withHandlerSpacing = 32 + 12 + 8; // button size + inner spacing + handler position
-var Details = styled.div.withConfig({
-  displayName: "Alert__Details",
-  componentId: "sc-iju7nx-1"
-})(["flex:1;padding-bottom:12px;padding-left:12px;padding-right:", ";padding-top:12px;"], function (_ref2) {
+var Details = styled.div(_templateObject2$14 || (_templateObject2$14 = _taggedTemplateLiteral(["\n  flex: 1;\n  padding-bottom: 12px;\n  padding-left: 12px;\n  padding-right: ", ";\n  padding-top: 12px;\n"])), function (_ref2) {
   var hasHandler = _ref2.hasHandler;
   return hasHandler ? "".concat(withHandlerSpacing, "px") : "12px";
 });
-var CloseHandler = styled.div.withConfig({
-  displayName: "Alert__CloseHandler",
-  componentId: "sc-iju7nx-2"
-})(["border-radius:0 16px 16px 0;right:8px;position:absolute;top:8px;"]);
-var StyledAlert = styled(Flex).withConfig({
-  displayName: "Alert__StyledAlert",
-  componentId: "sc-iju7nx-3"
-})(["position:relative;background:", ";@-moz-document url-prefix(){background:rgba(36,36,36,0.95) !important;}box-shadow:0 13px 20px rgba(0,0,0,0.25);border:1px solid ", ";border-radius:10px;"], function (_ref3) {
+var CloseHandler = styled.div(_templateObject3$N || (_templateObject3$N = _taggedTemplateLiteral(["\n  border-radius: 0 16px 16px 0;\n  right: 8px;\n  position: absolute;\n  top: 8px;\n"])));
+var StyledAlert = styled(Flex)(_templateObject4$y || (_templateObject4$y = _taggedTemplateLiteral(["\n  position: relative;\n  background: ", ";\n  @-moz-document url-prefix() {\n    background: rgba(36, 36, 36, 0.95) !important;\n  }\n  box-shadow: 0 13px 20px rgba(0, 0, 0, 0.25);\n  border: 1px solid ", ";\n  border-radius: 10px;\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.backgrounds.secondary;
 }, function (_ref4) {
@@ -8079,10 +8056,8 @@ var observerOptions = {
   threshold: 0
 };
 
-var Wrapper$3 = styled.div.withConfig({
-  displayName: "Wrapper",
-  componentId: "sc-1ie94f-0"
-})(["position:relative;background-position:center center;background-repeat:no-repeat;background-size:cover;height:", "px;max-width:", "px;max-height:", "px;width:100%;padding-top:", "%;", ""], function (_ref) {
+var _templateObject$22;
+var Wrapper$3 = styled.div(_templateObject$22 || (_templateObject$22 = _taggedTemplateLiteral(["\n  position: relative;\n  background-position: center center;\n  background-repeat: no-repeat;\n  background-size: cover;\n  height: ", "px;\n  max-width: ", "px;\n  max-height: ", "px;\n  width: 100%;\n  padding-top: ", "%;\n  ", "\n"])), function (_ref) {
   var height = _ref.height,
     responsive = _ref.responsive;
   return responsive ? 0 : height;
@@ -8100,14 +8075,9 @@ var Wrapper$3 = styled.div.withConfig({
 }, space);
 
 var _excluded$q = ["src", "alt"];
-var StyledImage = styled.img.withConfig({
-  displayName: "Image__StyledImage",
-  componentId: "sc-10tqvvr-0"
-})(["position:absolute;top:0;left:0;width:100%;height:100%;max-width:100%;"]);
-var Placeholder = styled.div.withConfig({
-  displayName: "Image__Placeholder",
-  componentId: "sc-10tqvvr-1"
-})(["position:absolute;top:0;left:0;width:100%;height:100%;"]);
+var _templateObject$21, _templateObject2$13;
+var StyledImage = styled.img(_templateObject$21 || (_templateObject$21 = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  max-width: 100%;\n"])));
+var Placeholder = styled.div(_templateObject2$13 || (_templateObject2$13 = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n"])));
 var Image = function Image(_ref) {
   var src = _ref.src,
     alt = _ref.alt,
@@ -8143,6 +8113,7 @@ var Image = function Image(_ref) {
   }));
 };
 
+var _templateObject$20;
 var breakpointMap = {
   xs: 370,
   sm: 576,
@@ -8185,7 +8156,7 @@ var grids = {
   mobile: "grid-template-columns: repeat(".concat(gridsMap.mobile.gridColumns, ", minmax(0, 1fr));\n            grid-gap: 20px;\n            "),
   desktop: "grid-template-columns: repeat(".concat(gridsMap.desktop.gridColumns, ", minmax(0, 1fr));\n            grid-gap: 24px;\n            ")
 };
-var gridLayout = css(["display:grid;", "{", ";}", "{", ";}"], function (_ref) {
+var gridLayout = css(_templateObject$20 || (_templateObject$20 = _taggedTemplateLiteral(["\n  display: grid;\n  ", " {\n    ", ";\n  }\n  ", " {\n    ", ";\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.xs;
 }, grids.mobile, function (_ref2) {
@@ -8409,6 +8380,7 @@ var sizes$1 = {
   XXL: "xxl"
 };
 
+var _templateObject$1$;
 var style = _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, sizes$1.MD, {
   fontSize: "20px",
   fontSizeLg: "20px"
@@ -8424,10 +8396,7 @@ var style = _defineProperty(_defineProperty(_defineProperty(_defineProperty({},
 });
 var Heading = styled(Text).attrs({
   bold: true
-}).withConfig({
-  displayName: "Heading",
-  componentId: "sc-1bynhbg-0"
-})(["font-size:", ";font-weight:600;line-height:1.1;", "{font-size:", ";}"], function (_ref) {
+})(_templateObject$1$ || (_templateObject$1$ = _taggedTemplateLiteral(["\n  font-size: ", ";\n  font-weight: 600;\n  line-height: 1.1;\n\n  ", " {\n    font-size: ", ";\n  }\n"])), function (_ref) {
   var size = _ref.size;
   return style[size || sizes$1.MD].fontSize;
 }, function (_ref2) {
@@ -8441,10 +8410,8 @@ Heading.defaultProps = {
   as: tags.H2
 };
 
-var StyledModal = styled.div.withConfig({
-  displayName: "Modal__StyledModal",
-  componentId: "sc-gb2uez-0"
-})(["background:", ";box-shadow:0 13px 20px rgba(0,0,0,0.25);@-moz-document url-prefix(){background:#191921 !important;}border-radius:15px;width:100%;z-index:99;overflow-y:auto;padding-bottom:8px;", "{width:auto;min-width:360px;max-width:100%;max-height:80%;}", "{max-height:80vh;}"], function (_ref) {
+var _templateObject$1_, _templateObject2$12, _templateObject3$M, _templateObject4$x;
+var StyledModal = styled.div(_templateObject$1_ || (_templateObject$1_ = _taggedTemplateLiteral(["\n  background: ", ";\n  box-shadow: 0 13px 20px rgba(0, 0, 0, 0.25);\n  @-moz-document url-prefix() {\n    background: #191921 !important;\n  }\n  border-radius: 15px;\n  width: 100%;\n  z-index: 99;\n  overflow-y: auto;\n  padding-bottom: 8px;\n  ", " {\n    width: auto;\n    min-width: 360px;\n    max-width: 100%;\n    max-height: 80%;\n  }\n  ", " {\n    max-height: 80vh;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.card;
 }, function (_ref2) {
@@ -8454,18 +8421,9 @@ var StyledModal = styled.div.withConfig({
   var theme = _ref3.theme;
   return theme.mediaQueries.mobile;
 });
-var CloseButton$1 = styled(Button$1).withConfig({
-  displayName: "Modal__CloseButton",
-  componentId: "sc-gb2uez-1"
-})(["z-index:99999;width:16px;border:none;align-items:flex-start !important;padding:0px !important;&:hover:not(:disabled):not(.button--disabled):not(:active){background-color:transparent;border-color:transparent;}&:focus:not(:active){box-shadow:none;}"]);
-var ModalHeader = styled.div.withConfig({
-  displayName: "Modal__ModalHeader",
-  componentId: "sc-gb2uez-2"
-})(["display:flex;align-items:center;padding:24px 24px 0;"]);
-var ModalTitle = styled(Flex).withConfig({
-  displayName: "Modal__ModalTitle",
-  componentId: "sc-gb2uez-3"
-})(["align-items:center;flex:1;"]);
+var CloseButton$1 = styled(Button$1)(_templateObject2$12 || (_templateObject2$12 = _taggedTemplateLiteral(["\n  z-index: 99999;\n  width: 16px;\n  border: none;\n  align-items: flex-start !important;\n  padding: 0px !important;\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    background-color: transparent;\n    border-color: transparent;\n  }\n  &:focus:not(:active) {\n    box-shadow: none;\n  }\n"])));
+var ModalHeader = styled.div(_templateObject3$M || (_templateObject3$M = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  padding: 24px 24px 0;\n"])));
+var ModalTitle = styled(Flex)(_templateObject4$x || (_templateObject4$x = _taggedTemplateLiteral(["\n  align-items: center;\n  flex: 1;\n"])));
 var Modal = function Modal(_ref4) {
   var title = _ref4.title,
     onDismiss = _ref4.onDismiss,
@@ -8506,12 +8464,10 @@ var Modal = function Modal(_ref4) {
   });
 };
 
+var _templateObject$1Z;
 var Overlay = styled.div.attrs({
   role: "presentation"
-}).withConfig({
-  displayName: "Overlay",
-  componentId: "sc-1u1va95-0"
-})(["position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgb(22,22,29);transition:opacity 0.4s;opacity:", ";z-index:", ";pointer-events:", ";"], function (_ref) {
+})(_templateObject$1Z || (_templateObject$1Z = _taggedTemplateLiteral(["\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background-color: rgb(22, 22, 29);\n  transition: opacity 0.4s;\n  opacity: ", ";\n  z-index: ", ";\n  pointer-events: ", ";\n"])), function (_ref) {
   var show = _ref.show;
   return show ? 0.6 : 0;
 }, function (_ref2) {
@@ -8526,10 +8482,8 @@ Overlay.defaultProps = {
   zIndex: 10
 };
 
-var ModalWrapper = styled.div.withConfig({
-  displayName: "ModalContext__ModalWrapper",
-  componentId: "sc-4rfz2j-0"
-})(["display:flex;flex-direction:column;justify-content:center;align-items:center;position:fixed;top:0;right:0;bottom:0;left:0;z-index:", ";", "{justify-content:flex-start;padding-top:50px;}"], function (_ref) {
+var _templateObject$1Y;
+var ModalWrapper = styled.div(_templateObject$1Y || (_templateObject$1Y = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: ", ";\n  ", " {\n    justify-content: flex-start;\n    padding-top: 50px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.zIndices.modal - 1;
 }, function (_ref2) {
@@ -8921,10 +8875,8 @@ var ConnectModal = function ConnectModal(_ref) {
 };
 
 var _excluded$p = ["external"];
-var StyledLink$1 = styled(Text).withConfig({
-  displayName: "Link__StyledLink",
-  componentId: "sc-qw3uvt-0"
-})(["display:flex;align-items:center;width:fit-content;margin-right:21px;&:hover{text-decoration:underline;}"]);
+var _templateObject$1X;
+var StyledLink$1 = styled(Text)(_templateObject$1X || (_templateObject$1X = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  width: fit-content;\n  margin-right: 21px;\n  &:hover {\n    text-decoration: underline;\n  }\n"])));
 var Link = function Link(_ref) {
   var external = _ref.external,
     props = _objectWithoutProperties(_ref, _excluded$p);
@@ -8955,19 +8907,14 @@ var LinkExternal = function LinkExternal(_ref) {
 };
 
 var _excluded$n = ["toCopy", "translations", "children"];
+var _templateObject$1W, _templateObject2$11;
 var StyleButton = styled(Text).attrs({
   role: "button"
-}).withConfig({
-  displayName: "CopyToClipboard__StyleButton",
-  componentId: "sc-v35pzo-0"
-})(["position:relative;display:flex;align-items:center;color:", ";"], function (_ref) {
+})(_templateObject$1W || (_templateObject$1W = _taggedTemplateLiteral(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  color: ", ";\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.primary;
 });
-var Tooltip$1 = styled.div.withConfig({
-  displayName: "CopyToClipboard__Tooltip",
-  componentId: "sc-v35pzo-1"
-})(["display:", ";position:absolute;bottom:-40px;right:0;left:0;text-align:center;background-color:", ";color:", ";border-radius:5px;opacity:0.7;padding:5px;"], function (_ref2) {
+var Tooltip$1 = styled.div(_templateObject2$11 || (_templateObject2$11 = _taggedTemplateLiteral(["\n  display: ", ";\n  position: absolute;\n  bottom: -40px;\n  right: 0;\n  left: 0;\n  text-align: center;\n  background-color: ", ";\n  color: ", ";\n  border-radius: 5px;\n  opacity: 0.7;\n  padding: 5px;\n"])), function (_ref2) {
   var isTooltipDisplayed = _ref2.isTooltipDisplayed;
   return isTooltipDisplayed ? "block" : "none";
 }, function (_ref3) {
@@ -9308,20 +9255,15 @@ var useConnectWalletEvent = function useConnectWalletEvent(account) {
   }, [account]);
 };
 
-var BannerSlideWrapper = styled.div.withConfig({
-  displayName: "BannerSlide__BannerSlideWrapper",
-  componentId: "sc-1mbqjcw-0"
-})(["position:relative;height:", ";max-height:225px;display:flex;flex-direction:row;justify-content:", ";align-items:center;"], function (_ref) {
+var _templateObject$1V, _templateObject2$10;
+var BannerSlideWrapper = styled.div(_templateObject$1V || (_templateObject$1V = _taggedTemplateLiteral(["\n  position: relative;\n  height: ", ";\n  max-height: 225px;\n  display: flex;\n  flex-direction: row;\n  justify-content: ", ";\n  align-items: center;\n"])), function (_ref) {
   var height = _ref.height;
   return "".concat(height, "px");
 }, function (_ref2) {
   var isMobile = _ref2.isMobile;
   return isMobile ? "flex-start" : "space-between";
 });
-var StyledImg = styled(Image).withConfig({
-  displayName: "BannerSlide__StyledImg",
-  componentId: "sc-1mbqjcw-1"
-})(["position:absolute;max-height:225px;top:0;img{object-fit:contain;border-radius:", ";}"], function (_ref3) {
+var StyledImg = styled(Image)(_templateObject2$10 || (_templateObject2$10 = _taggedTemplateLiteral(["\n  position: absolute;\n  max-height: 225px;\n  top: 0;\n  img {\n    object-fit: contain;\n    border-radius: ", ";\n  }\n"])), function (_ref3) {
   var isMobile = _ref3.isMobile,
     theme = _ref3.theme;
   return isMobile ? 0 : theme.radii.primary;
@@ -9358,17 +9300,12 @@ var BannerSlide = function BannerSlide(_ref4) {
   });
 };
 
-var CarouselWrapper = styled.div.withConfig({
-  displayName: "BannerSlider__CarouselWrapper",
-  componentId: "sc-whzh3q-0"
-})(["margin:0 -32px;", "{margin:0;}"], function (_ref) {
+var _templateObject$1U, _templateObject2$$;
+var CarouselWrapper = styled.div(_templateObject$1U || (_templateObject$1U = _taggedTemplateLiteral(["\n  margin: 0 -32px;\n\n  ", " {\n    margin: 0;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.sm;
 });
-var StyledSlider$2 = styled(Slider).withConfig({
-  displayName: "BannerSlider__StyledSlider",
-  componentId: "sc-whzh3q-1"
-})([".slick-track{> div{padding:0 10px;}}.slick-dots{.slick-active{div{background:", " !important;border:2px ", " solid;}}}"], function (_ref2) {
+var StyledSlider$2 = styled(Slider)(_templateObject2$$ || (_templateObject2$$ = _taggedTemplateLiteral(["\n  .slick-track {\n    > div {\n      padding: 0 10px;\n    }\n  }\n\n  .slick-dots {\n    .slick-active {\n      div {\n        background: ", " !important;\n        border: 2px ", " solid;\n      }\n    }\n  }\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.blue;
 }, function (_ref3) {
@@ -9427,20 +9364,15 @@ var BannerSlider = function BannerSlider(_ref4) {
   });
 };
 
-var Separator = styled.div.withConfig({
-  displayName: "Breadcrumbs__Separator",
-  componentId: "sc-1c6k3v2-0"
-})(["align-items:center;color:currentColor;display:flex;justify-content:center;padding-left:4px;padding-right:4px;", "{padding-left:8px;padding-right:8px;}", "{padding-left:16px;padding-right:16px;}"], function (_ref) {
+var _templateObject$1T, _templateObject2$_;
+var Separator = styled.div(_templateObject$1T || (_templateObject$1T = _taggedTemplateLiteral(["\n  align-items: center;\n  color: currentColor;\n  display: flex;\n  justify-content: center;\n  padding-left: 4px;\n  padding-right: 4px;\n\n  ", " {\n    padding-left: 8px;\n    padding-right: 8px;\n  }\n\n  ", " {\n    padding-left: 16px;\n    padding-right: 16px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.sm;
 }, function (_ref2) {
   var theme = _ref2.theme;
   return theme.mediaQueries.md;
 });
-var StyledBreadcrumbs = styled.ul.withConfig({
-  displayName: "Breadcrumbs__StyledBreadcrumbs",
-  componentId: "sc-1c6k3v2-1"
-})(["align-items:center;color:", ";display:flex;flex-wrap:wrap;list-style-type:none;", ""], function (_ref3) {
+var StyledBreadcrumbs = styled.ul(_templateObject2$_ || (_templateObject2$_ = _taggedTemplateLiteral(["\n  align-items: center;\n  color: ", ";\n  display: flex;\n  flex-wrap: wrap;\n  list-style-type: none;\n\n  ", "\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.colors.textDisabled;
 }, space);
@@ -9476,10 +9408,8 @@ var Breadcrumbs = function Breadcrumbs(_ref4) {
   });
 };
 
-var StyledButtonMenu = styled.div.withConfig({
-  displayName: "StyledButtonMenu",
-  componentId: "sc-14hzc1v-0"
-})(["background-color:transparent;border-radius:16px;display:inline-flex;@media (max-width:500px){width:100%;justify-content:space-around;}"]);
+var _templateObject$1S;
+var StyledButtonMenu = styled.div(_templateObject$1S || (_templateObject$1S = _taggedTemplateLiteral(["\n  background-color: transparent;\n  border-radius: 16px;\n  display: inline-flex;\n  @media (max-width: 500px) {\n    width: 100%;\n    justify-content: space-around;\n  }\n"])));
 
 var ButtonMenu = function ButtonMenu(_ref) {
   var _ref$activeIndex = _ref.activeIndex,
@@ -9511,6 +9441,7 @@ var sizes = {
 var variants$2 = {
   PRIMARY: "primary"};
 
+var _templateObject$1R;
 var getDisabledStyles$2 = function getDisabledStyles(_ref) {
   var isLoading = _ref.isLoading,
     theme = _ref.theme;
@@ -9535,10 +9466,7 @@ var getButtonVariantProp$2 = function getButtonVariantProp(prop) {
     return theme.button[variant][prop];
   };
 };
-var StyledButton$1 = styled.button.withConfig({
-  displayName: "StyledButton",
-  componentId: "sc-zft497-0"
-})(["align-items:center;background-color:transparent;border:none;border-radius:10px;cursor:pointer;display:flex;flex-direction:column;font-family:inherit;font-size:16px;font-weight:700;color:white;width:", ";height:", ";line-height:1;letter-spacing:0.03em;justify-content:center;outline:0;padding:", ";transition:all 0.5s;.dot{margin-top:10px;height:", ";width:", ";border-radius:", ";display:inline-block;background-color:", ";}&:hover:not(:disabled):not(.button--disabled):not(:active){border-color:", ";color:", ";}&:active{background-color:transparent;color:", ";}", " ", " ", ""], function (_ref4) {
+var StyledButton$1 = styled.button(_templateObject$1R || (_templateObject$1R = _taggedTemplateLiteral(["\n  align-items: center;\n  background-color: transparent;\n  border: none;\n  border-radius: 10px;\n  cursor: pointer;\n  display: flex;\n  flex-direction: column;\n  font-family: inherit;\n  font-size: 16px;\n  font-weight: 700;\n  color: white;\n  /* max-content instead of auto for Safari fix */\n  width: ", ";\n  height: ", ";\n  line-height: 1;\n  letter-spacing: 0.03em;\n  justify-content: center;\n  outline: 0;\n  padding: ", ";\n  transition: all 0.5s;\n\n  .dot {\n    margin-top: 10px;\n    height: ", ";\n    width: ", ";\n    border-radius: ", ";\n    display: inline-block;\n    background-color: ", ";\n  }\n\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    border-color: ", ";\n    color: ", ";\n  }\n\n  &:active {\n    background-color: transparent;\n    color: ", ";\n  }\n\n  ", "\n  ", "\n  ", "\n"])), function (_ref4) {
   var fullWidth = _ref4.fullWidth;
   return fullWidth ? "100%" : "max-content";
 }, function (_ref5) {
@@ -9610,6 +9538,7 @@ var getColor = function getColor(color, theme) {
   return getThemeValue("colors.".concat(color), color)(theme);
 };
 
+var _templateObject$1Q;
 var getThemeTextColor = function getThemeTextColor(_ref) {
   var outline = _ref.outline,
     _ref$variant = _ref.variant,
@@ -9617,10 +9546,7 @@ var getThemeTextColor = function getThemeTextColor(_ref) {
     theme = _ref.theme;
   return outline ? getColor(variant, theme) : "#ffffff";
 };
-var StyledTag = styled.div.withConfig({
-  displayName: "StyledTag",
-  componentId: "sc-j7cw9s-0"
-})(["align-items:center;background-color:", ";border:1px solid ", ";border-radius:16px;color:", ";display:inline-flex;font-size:14px;font-weight:400;height:28px;line-height:1.5;padding:0 8px;white-space:nowrap;svg{fill:", ";}"], function (_ref2) {
+var StyledTag = styled.div(_templateObject$1Q || (_templateObject$1Q = _taggedTemplateLiteral(["\n  align-items: center;\n  background-color: ", ";\n  border: 1px solid ", ";\n  border-radius: 16px;\n  color: ", ";\n  display: inline-flex;\n  font-size: 14px;\n  font-weight: 400;\n  height: 28px;\n  line-height: 1.5;\n  padding: 0 8px;\n  white-space: nowrap;\n\n  svg {\n    fill: ", ";\n  }\n"])), function (_ref2) {
   var outline = _ref2.outline,
     theme = _ref2.theme,
     _ref2$variant = _ref2.variant,
@@ -9634,18 +9560,10 @@ var StyledTag = styled.div.withConfig({
 }, getThemeTextColor, getThemeTextColor);
 
 var _excluded$l = ["isActive", "size", "variant", "as", "children", "tag", "hide"];
-var ButtonBody = styled.div.withConfig({
-  displayName: "ButtonMenuItem__ButtonBody",
-  componentId: "sc-1bbtdtk-0"
-})(["display:inline-flex;align-items:center;"]);
-var ButtonTag = styled(StyledTag).withConfig({
-  displayName: "ButtonMenuItem__ButtonTag",
-  componentId: "sc-1bbtdtk-1"
-})(["margin-left:7px;font-weight:bold;font-size:11px;padding:1px 5px;height:unset;border-width:1px;"]);
-var InactiveButton$1 = styled(Button).withConfig({
-  displayName: "ButtonMenuItem__InactiveButton",
-  componentId: "sc-1bbtdtk-2"
-})(["background-color:transparent;color:#535459;.dot{background-color:transparent;}&:hover:not(:disabled):not(:active){background-color:transparent;}"]);
+var _templateObject$1P, _templateObject2$Z, _templateObject3$L;
+var ButtonBody = styled.div(_templateObject$1P || (_templateObject$1P = _taggedTemplateLiteral(["\n  display: inline-flex;\n  align-items: center;\n"])));
+var ButtonTag = styled(StyledTag)(_templateObject2$Z || (_templateObject2$Z = _taggedTemplateLiteral(["\n  margin-left: 7px;\n  font-weight: bold;\n  font-size: 11px;\n  padding: 1px 5px;\n  height: unset;\n  border-width: 1px;\n"])));
+var InactiveButton$1 = styled(Button)(_templateObject3$L || (_templateObject3$L = _taggedTemplateLiteral(["\n  background-color: transparent;\n  color: #535459;\n  .dot {\n    background-color: transparent;\n  }\n\n  &:hover:not(:disabled):not(:active) {\n    background-color: transparent;\n  }\n"])));
 var ButtonMenuItem = function ButtonMenuItem(_ref) {
   var _ref$isActive = _ref.isActive,
     isActive = _ref$isActive === void 0 ? false : _ref$isActive,
@@ -9693,10 +9611,8 @@ var ButtonMenuItem = function ButtonMenuItem(_ref) {
   }));
 };
 
-var StyledButtonActivityMenu = styled.div.withConfig({
-  displayName: "StyledButtonActivityMenu",
-  componentId: "sc-byew2t-0"
-})(["background:linear-gradient(180deg,#000000 0%,rgba(0,0,0,0) 17.71%),#16161d;border:1px solid #808080;box-sizing:border-box;border-radius:99px;display:inline-flex;"]);
+var _templateObject$1O;
+var StyledButtonActivityMenu = styled.div(_templateObject$1O || (_templateObject$1O = _taggedTemplateLiteral(["\n  background: linear-gradient(180deg, #000000 0%, rgba(0, 0, 0, 0) 17.71%), #16161d;\n  border: 1px solid #808080;\n  box-sizing: border-box;\n  border-radius: 99px;\n  display: inline-flex;\n"])));
 
 var ButtonActivityMenu = function ButtonActivityMenu(_ref) {
   var _ref$activeIndex = _ref.activeIndex,
@@ -9722,6 +9638,7 @@ var ButtonActivityMenu = function ButtonActivityMenu(_ref) {
   });
 };
 
+var _templateObject$1N;
 var getDisabledStyles$1 = function getDisabledStyles(_ref) {
   var isLoading = _ref.isLoading,
     theme = _ref.theme;
@@ -9746,10 +9663,7 @@ var getButtonVariantProp$1 = function getButtonVariantProp(prop) {
     return theme.button[variant][prop];
   };
 };
-var StyledButtonActivity = styled.button.withConfig({
-  displayName: "StyledButtonActivity",
-  componentId: "sc-pam326-0"
-})(["align-items:center;border:none;cursor:pointer;display:flex;flex-direction:column;font-family:inherit;font-size:16px;font-weight:600;color:white;width:", ";height:", ";line-height:1;letter-spacing:0.03em;justify-content:center;outline:0;padding:", ";transition:all 0.5s;border-radius:99px;background:linear-gradient(332.11deg,#13c3af 8.45%,#13d8b2 39.11%,#12ffb8 85.67%);color:rgba(22,22,29,1);&:hover:not(:disabled):not(.button--disabled):not(:active){border-color:", ";color:white;}", " ", " ", ""], function (_ref4) {
+var StyledButtonActivity = styled.button(_templateObject$1N || (_templateObject$1N = _taggedTemplateLiteral(["\n  align-items: center;\n  border: none;\n  cursor: pointer;\n  display: flex;\n  flex-direction: column;\n  font-family: inherit;\n  font-size: 16px;\n  font-weight: 600;\n  color: white;\n  /* max-content instead of auto for Safari fix */\n  width: ", ";\n  height: ", ";\n  line-height: 1;\n  letter-spacing: 0.03em;\n  justify-content: center;\n  outline: 0;\n  padding: ", ";\n  transition: all 0.5s;\n\n  // Activity\n  border-radius: 99px;\n  background: linear-gradient(332.11deg, #13c3af 8.45%, #13d8b2 39.11%, #12ffb8 85.67%);\n  color: rgba(22, 22, 29, 1);\n\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    border-color: ", ";\n    color: white;\n  }\n\n  ", "\n  ", "\n  ", "\n"])), function (_ref4) {
   var fullWidth = _ref4.fullWidth;
   return fullWidth ? "100%" : "max-content";
 }, function (_ref5) {
@@ -9796,10 +9710,8 @@ ButtonActivity.defaultProps = {
 };
 
 var _excluded$j = ["isActive", "size", "variant", "as"];
-var InactiveButton = styled(ButtonActivity).withConfig({
-  displayName: "ButtonActivityMenuItem__InactiveButton",
-  componentId: "sc-kqgtlg-0"
-})(["background:transparent;color:#808080;&:hover:not(:disabled):not(:active){background-color:transparent;}"]);
+var _templateObject$1M;
+var InactiveButton = styled(ButtonActivity)(_templateObject$1M || (_templateObject$1M = _taggedTemplateLiteral(["\n  background: transparent;\n  color: #808080;\n  &:hover:not(:disabled):not(:active) {\n    background-color: transparent;\n  }\n"])));
 var ButtonActivityMenuItem = function ButtonActivityMenuItem(_ref) {
   var _ref$isActive = _ref.isActive,
     isActive = _ref$isActive === void 0 ? false : _ref$isActive,
@@ -9824,6 +9736,7 @@ var ButtonActivityMenuItem = function ButtonActivityMenuItem(_ref) {
   }, props));
 };
 
+var _templateObject$1L;
 var getDisabledStyles = function getDisabledStyles(_ref) {
   var isLoading = _ref.isLoading,
     theme = _ref.theme;
@@ -9848,10 +9761,7 @@ var getButtonVariantProp = function getButtonVariantProp(prop) {
     return theme.button[variant][prop];
   };
 };
-var StyledButtonSwitch = styled.button.withConfig({
-  displayName: "StyledButtonSwitch",
-  componentId: "sc-obsjj-0"
-})(["display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:transparent;border:none;cursor:pointer;font-family:inherit;font-size:16px;line-height:28px;font-weight:700;color:", ";width:", ";height:36px;outline:0;padding:0 8px;transition:all 0.5s;&:hover:not(:disabled):not(.button--disabled):not(:active){border-color:", ";color:", ";}", " ", " ", ""], function (_ref4) {
+var StyledButtonSwitch = styled.button(_templateObject$1L || (_templateObject$1L = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  background-color: transparent;\n  border: none;\n  cursor: pointer;\n  font-family: inherit;\n  font-size: 16px;\n  line-height: 28px;\n  font-weight: 700;\n  color: ", ";\n  width: ", ";\n  height: 36px;\n  outline: 0;\n  padding: 0 8px;\n  transition: all 0.5s;\n\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    border-color: ", ";\n    color: ", ";\n  }\n\n  ", "\n  ", "\n  ", "\n"])), function (_ref4) {
   var theme = _ref4.theme,
     active = _ref4.active;
   return active ? "white" : theme.colors.grey;
@@ -9889,16 +9799,15 @@ var ButtonSwitch = function ButtonSwitch(_ref) {
   }));
 };
 
-var StyledButtonSwitchMenu = styled.div.withConfig({
-  displayName: "StyledButtonSwitchMenu",
-  componentId: "sc-1qzp9bs-0"
-})(["background:transparent;box-sizing:border-box;display:inline-flex;flex-direction:row;justify-content:center;align-items:center;"]);
+var _templateObject$1K;
+var StyledButtonSwitchMenu = styled.div(_templateObject$1K || (_templateObject$1K = _taggedTemplateLiteral(["\n  background: transparent;\n  box-sizing: border-box;\n  display: inline-flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n"])));
 
 var variants$1 = {
   DEFAULT: "default",
   PANEL: "panel"
 };
 
+var _templateObject$1J, _templateObject2$Y, _templateObject3$K;
 var getToggleVariantProp = function getToggleVariantProp(prop) {
   return function (_ref) {
     var theme = _ref.theme,
@@ -9907,21 +9816,12 @@ var getToggleVariantProp = function getToggleVariantProp(prop) {
     return theme.toggle[variant][prop];
   };
 };
-var Handle = styled.div.withConfig({
-  displayName: "StyledToggle__Handle",
-  componentId: "sc-11wqnqq-0"
-})(["background-color:", ";border-radius:50%;cursor:pointer;height:16px;left:3px;position:absolute;top:2px;transition:all 200ms ease-in;width:16px;z-index:1;"], function (_ref2) {
+var Handle = styled.div(_templateObject$1J || (_templateObject$1J = _taggedTemplateLiteral(["\n  background-color: ", ";\n  border-radius: 50%;\n  cursor: pointer;\n  height: 16px;\n  left: 3px;\n  position: absolute;\n  top: 2px;\n  transition: all 200ms ease-in;\n  width: 16px;\n  z-index: 1;\n"])), function (_ref2) {
   var checked = _ref2.checked;
   return checked ? getToggleVariantProp("backgroundHandleActive") : getToggleVariantProp("backgroundHandleInactive");
 });
-var Input$1 = styled.input.withConfig({
-  displayName: "StyledToggle__Input",
-  componentId: "sc-11wqnqq-1"
-})(["cursor:pointer;opacity:0;height:100%;position:absolute;width:100%;z-index:3;&:checked + ", "{left:calc(100% - 18px);}"], Handle);
-var StyledToggle = styled.div.withConfig({
-  displayName: "StyledToggle",
-  componentId: "sc-11wqnqq-2"
-})(["align-items:center;background:", ";border:1px solid ", ";border-radius:11px;cursor:pointer;display:inline-flex;height:22px;position:relative;transition:background-color 200ms;width:42px;"], function (_ref3) {
+var Input$1 = styled.input(_templateObject2$Y || (_templateObject2$Y = _taggedTemplateLiteral(["\n  cursor: pointer;\n  opacity: 0;\n  height: 100%;\n  position: absolute;\n  width: 100%;\n  z-index: 3;\n\n  &:checked + ", " {\n    left: calc(100% - 18px);\n  }\n"])), Handle);
+var StyledToggle = styled.div(_templateObject3$K || (_templateObject3$K = _taggedTemplateLiteral(["\n  align-items: center;\n  background: ", ";\n  border: 1px solid ", ";\n  border-radius: 11px;\n  cursor: pointer;\n  display: inline-flex;\n  height: 22px;\n  position: relative;\n  transition: background-color 200ms;\n  width: 42px;\n"])), function (_ref3) {
   var checked = _ref3.checked;
   return checked ? getToggleVariantProp("backgroundToggleActive") : getToggleVariantProp("backgroundToggleInactive");
 }, getToggleVariantProp("borderColor"));
@@ -10002,6 +9902,7 @@ var ButtonSwitchMenu = function ButtonSwitchMenu(_ref) {
   });
 };
 
+var _templateObject$1I;
 /**
  * Priority: Warning --> Success --> Active
  */
@@ -10021,10 +9922,7 @@ var getBoxShadow$2 = function getBoxShadow(_ref) {
   }
   return theme.card.boxShadow;
 };
-var StyledCard = styled.div.withConfig({
-  displayName: "StyledCard",
-  componentId: "sc-b498h5-0"
-})(["background:", ";@-moz-document url-prefix(){background:rgba(36,36,36,0.95) !important;}box-shadow:0 13px 20px rgba(0,0,0,0.25);border:1px solid ", ";border-radius:15px;box-shadow:", ";color:", ";overflow:hidden;position:relative;padding:30px;", ""], function (_ref2) {
+var StyledCard = styled.div(_templateObject$1I || (_templateObject$1I = _taggedTemplateLiteral(["\n  background: ", ";\n  @-moz-document url-prefix() {\n    background: rgba(36, 36, 36, 0.95) !important;\n  }\n  box-shadow: 0 13px 20px rgba(0, 0, 0, 0.25);\n  border: 1px solid ", ";\n  border-radius: 15px;\n  box-shadow: ", ";\n  color: ", ";\n  overflow: hidden;\n  position: relative;\n  padding: 30px;\n\n  ", "\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.card;
 }, function (_ref3) {
@@ -10052,32 +9950,24 @@ var Card = function Card(_ref) {
   }));
 };
 
-var CardBody = styled.div.withConfig({
-  displayName: "CardBody",
-  componentId: "sc-1of0iur-0"
-})(["", " display:flex;justify-content:center;"], space);
+var _templateObject$1H;
+var CardBody = styled.div(_templateObject$1H || (_templateObject$1H = _taggedTemplateLiteral(["\n  ", "\n  display: flex;\n  justify-content: center;\n"])), space);
 CardBody.defaultProps = {
   p: "24px"
 };
 
-var CardHeader = styled.div.withConfig({
-  displayName: "CardHeader",
-  componentId: "sc-1ikcixt-0"
-})(["", " font-weight:700;font-size:26px;line-height:130%;display:flex;width:100%;justify-content:space-between;"], space);
+var _templateObject$1G;
+var CardHeader = styled.div(_templateObject$1G || (_templateObject$1G = _taggedTemplateLiteral(["\n  ", "\n  font-weight: 700;\n  font-size: 26px;\n  line-height: 130%;\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n"])), space);
 CardHeader.defaultProps = {};
 
-var CardFooter = styled.div.withConfig({
-  displayName: "CardFooter",
-  componentId: "sc-7k1ypk-0"
-})(["", " display:flex;justify-content:center;"], space);
+var _templateObject$1F;
+var CardFooter = styled.div(_templateObject$1F || (_templateObject$1F = _taggedTemplateLiteral(["\n  ", "\n  display: flex;\n  justify-content: center;\n"])), space);
 CardFooter.defaultProps = {
   p: "24px"
 };
 
-var StyledCardRibbon = styled.div.withConfig({
-  displayName: "CardRibbon__StyledCardRibbon",
-  componentId: "sc-1qhw702-0"
-})(["background-color:", ";color:white;margin:0;padding:0;padding:8px 0;position:absolute;right:0;top:0;text-align:center;transform:translateX(30%) translateY(0%) rotate(45deg);transform-origin:top left;width:96px;&:before,&:after{background-color:", ";content:\"\";height:100%;margin:0 -1px;position:absolute;top:0;width:100%;}&:before{right:100%;}&:after{left:100%;}& > div{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:96px;}"], function (_ref) {
+var _templateObject$1E;
+var StyledCardRibbon = styled.div(_templateObject$1E || (_templateObject$1E = _taggedTemplateLiteral(["\n  background-color: ", ";\n  color: white;\n  margin: 0;\n  padding: 0;\n  padding: 8px 0;\n  position: absolute;\n  right: 0;\n  top: 0;\n  text-align: center;\n  transform: translateX(30%) translateY(0%) rotate(45deg);\n  transform-origin: top left;\n  width: 96px;\n\n  &:before,\n  &:after {\n    background-color: ", ";\n    content: \"\";\n    height: 100%;\n    margin: 0 -1px; /* Removes tiny gap */\n    position: absolute;\n    top: 0;\n    width: 100%;\n  }\n\n  &:before {\n    right: 100%;\n  }\n\n  &:after {\n    left: 100%;\n  }\n\n  & > div {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    width: 96px;\n  }\n"])), function (_ref) {
   var _ref$variantColor = _ref.variantColor,
     variantColor = _ref$variantColor === void 0 ? "secondary" : _ref$variantColor,
     theme = _ref.theme;
@@ -10105,6 +9995,7 @@ var scales$2 = {
   MD: "md"
 };
 
+var _templateObject$1D;
 var getScale$1 = function getScale(_ref) {
   var scale = _ref.scale;
   switch (scale) {
@@ -10117,10 +10008,7 @@ var getScale$1 = function getScale(_ref) {
 };
 var Checkbox = styled.input.attrs({
   type: "checkbox"
-}).withConfig({
-  displayName: "Checkbox",
-  componentId: "sc-1dgqwt2-0"
-})(["appearance:none;overflow:hidden;cursor:pointer;position:relative;display:inline-block;height:", ";width:", ";vertical-align:middle;transition:background-color 0.2s ease-in-out;border:", ";border-radius:8px;background-color:", ";box-shadow:", ";&:after{content:\"\";position:absolute;border-bottom:2px solid;border-left:2px solid;border-color:transparent;top:30%;left:0;right:0;width:50%;height:25%;margin:auto;transform:rotate(-50deg);transition:border-color 0.2s ease-in-out;}&:hover:not(:disabled):not(:checked){box-shadow:", ";border:", ";}&:focus{outline:none;box-shadow:", ";}&:checked{background-color:", ";border:", ";&:after{border-color:white;}}&:disabled{cursor:default;opacity:0.6;}"], getScale$1, getScale$1, function (_ref2) {
+})(_templateObject$1D || (_templateObject$1D = _taggedTemplateLiteral(["\n  appearance: none;\n  overflow: hidden;\n  cursor: pointer;\n  position: relative;\n  display: inline-block;\n  height: ", ";\n  width: ", ";\n  vertical-align: middle;\n  transition: background-color 0.2s ease-in-out;\n  border: ", ";\n  border-radius: 8px;\n  background-color: ", ";\n  box-shadow: ", ";\n\n  &:after {\n    content: \"\";\n    position: absolute;\n    border-bottom: 2px solid;\n    border-left: 2px solid;\n    border-color: transparent;\n    top: 30%;\n    left: 0;\n    right: 0;\n    width: 50%;\n    height: 25%;\n    margin: auto;\n    transform: rotate(-50deg);\n    transition: border-color 0.2s ease-in-out;\n  }\n\n  &:hover:not(:disabled):not(:checked) {\n    box-shadow: ", ";\n    border: ", ";\n  }\n\n  &:focus {\n    outline: none;\n    box-shadow: ", ";\n  }\n\n  &:checked {\n    background-color: ", ";\n    border: ", ";\n    &:after {\n      border-color: white;\n    }\n  }\n\n  &:disabled {\n    cursor: default;\n    opacity: 0.6;\n  }\n"])), getScale$1, getScale$1, function (_ref2) {
   var bordered = _ref2.bordered;
   return bordered ? "0.1px solid white !important" : "";
 }, function (_ref3) {
@@ -10149,6 +10037,7 @@ Checkbox.defaultProps = {
   scale: scales$2.MD
 };
 
+var _templateObject$1C, _templateObject2$X;
 var getLeft = function getLeft(_ref) {
   var position = _ref.position;
   if (position === "top-right") {
@@ -10163,10 +10052,7 @@ var getBottom = function getBottom(_ref2) {
   }
   return "auto";
 };
-var DropdownContent = styled.div.withConfig({
-  displayName: "Dropdown__DropdownContent",
-  componentId: "sc-1ns2r4e-0"
-})(["width:max-content;display:none;flex-direction:column;position:absolute;transform:translate(-50%,0);left:", ";bottom:", ";background-color:", ";box-shadow:", ";padding:16px;max-height:400px;overflow-y:auto;overflow-x:hidden;z-index:", ";border-radius:", ";"], getLeft, getBottom, function (_ref3) {
+var DropdownContent = styled.div(_templateObject$1C || (_templateObject$1C = _taggedTemplateLiteral(["\n  width: max-content;\n  display: none;\n  flex-direction: column;\n  position: absolute;\n  transform: translate(-50%, 0);\n  left: ", ";\n  bottom: ", ";\n  background-color: ", ";\n  box-shadow: ", ";\n  padding: 16px;\n  max-height: 400px;\n  overflow-y: auto;\n  overflow-x: hidden;\n  z-index: ", ";\n  border-radius: ", ";\n"])), getLeft, getBottom, function (_ref3) {
   var theme = _ref3.theme;
   return theme.nav.background;
 }, function (_ref4) {
@@ -10179,10 +10065,7 @@ var DropdownContent = styled.div.withConfig({
   var theme = _ref6.theme;
   return theme.radii.small;
 });
-var Container$7 = styled.div.withConfig({
-  displayName: "Dropdown__Container",
-  componentId: "sc-1ns2r4e-1"
-})(["position:relative;&:hover ", ",&:focus-within ", "{display:flex;}"], DropdownContent, DropdownContent);
+var Container$7 = styled.div(_templateObject2$X || (_templateObject2$X = _taggedTemplateLiteral(["\n  position: relative;\n  &:hover ", ", &:focus-within ", " {\n    display: flex;\n  }\n"])), DropdownContent, DropdownContent);
 var Dropdown = function Dropdown(_ref7) {
   var target = _ref7.target,
     _ref7$position = _ref7.position,
@@ -10200,14 +10083,9 @@ Dropdown.defaultProps = {
 };
 
 var _excluded$e = ["tokenName", "amount", "tokenIcon", "actions"];
-var StyledHeading = styled.div.withConfig({
-  displayName: "EarnedToken__StyledHeading",
-  componentId: "sc-1kzbws6-0"
-})(["font-weight:700;"]);
-var StyledEarnedToken = styled.div.withConfig({
-  displayName: "EarnedToken__StyledEarnedToken",
-  componentId: "sc-1kzbws6-1"
-})(["width:100%;background:", ";border-radius:", ";overflow:hidden;position:relative;padding:", ";color:", ";font-size:16px;font-weight:700;line-height:28px;", " ", "{padding:15px;border:1px solid ", ";font-size:20px;line-height:26px;}"], function (_ref) {
+var _templateObject$1B, _templateObject2$W, _templateObject3$J, _templateObject4$w, _templateObject5$t, _templateObject6$j, _templateObject7$f;
+var StyledHeading = styled.div(_templateObject$1B || (_templateObject$1B = _taggedTemplateLiteral(["\n  font-weight: 700;\n"])));
+var StyledEarnedToken = styled.div(_templateObject2$W || (_templateObject2$W = _taggedTemplateLiteral(["\n  width: 100%;\n  background: ", ";\n  border-radius: ", ";\n  overflow: hidden;\n  position: relative;\n  padding: ", ";\n  color: ", ";\n  font-size: 16px;\n  font-weight: 700;\n  line-height: 28px;\n\n  ", "\n\n  ", " {\n    padding: 15px;\n    border: 1px solid ", ";\n    font-size: 20px;\n    line-height: 26px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.backgrounds.secondary;
 }, function (_ref2) {
@@ -10222,7 +10100,7 @@ var StyledEarnedToken = styled.div.withConfig({
   return theme.colors.white;
 }, function (_ref5) {
   var toggled = _ref5.toggled;
-  return toggled && css(["border:1px solid ", ";"], function (_ref6) {
+  return toggled && css(_templateObject3$J || (_templateObject3$J = _taggedTemplateLiteral(["\n      border: 1px solid ", ";\n    "])), function (_ref6) {
     var theme = _ref6.theme;
     return theme.colors.white10;
   });
@@ -10233,31 +10111,19 @@ var StyledEarnedToken = styled.div.withConfig({
   var theme = _ref8.theme;
   return theme.colors.white10;
 });
-var Amount = styled.div.withConfig({
-  displayName: "EarnedToken__Amount",
-  componentId: "sc-1kzbws6-2"
-})(["display:flex;flex-direction:row;justify-content:flex-start;align-items:flex-start;width:100%;svg{width:24px;height:24px;margin-top:5px;margin-right:15px;", "{margin-top:0;margin-right:8px;}}", "{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;height:24px;padding:25px 0;}"], function (_ref9) {
+var Amount = styled.div(_templateObject4$w || (_templateObject4$w = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-start;\n  align-items: flex-start;\n  width: 100%;\n\n  svg {\n    width: 24px;\n    height: 24px;\n    margin-top: 5px;\n    margin-right: 15px;\n\n    ", " {\n      margin-top: 0;\n      margin-right: 8px;\n    }\n  }\n\n  ", " {\n    display: flex;\n    flex-direction: row;\n    justify-content: flex-start;\n    align-items: center;\n    height: 24px;\n    padding: 25px 0;\n  }\n"])), function (_ref9) {
   var theme = _ref9.theme;
   return theme.mediaQueries.sm;
 }, function (_ref0) {
   var theme = _ref0.theme;
   return theme.mediaQueries.sm;
 });
-var Actions = styled.div.withConfig({
-  displayName: "EarnedToken__Actions",
-  componentId: "sc-1kzbws6-3"
-})(["display:flex;flex-direction:row;justify-content:center;align-items:center;width:100%;button{width:100%;height:40px;font-size:11px;padding:0;}", "{flex-direction:column;button{font-size:16px;margin-bottom:5px;}}"], function (_ref1) {
+var Actions = styled.div(_templateObject5$t || (_templateObject5$t = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n\n  button {\n    width: 100%;\n    height: 40px;\n    font-size: 11px;\n    padding: 0;\n  }\n\n  ", " {\n    flex-direction: column;\n\n    button {\n      font-size: 16px;\n      margin-bottom: 5px;\n    }\n  }\n"])), function (_ref1) {
   var theme = _ref1.theme;
   return theme.mediaQueries.sm;
 });
-var MobileInfo = styled.div.withConfig({
-  displayName: "EarnedToken__MobileInfo",
-  componentId: "sc-1kzbws6-4"
-})(["display:flex;flex-direction:column;width:80%;margin-bottom:10px;"]);
-var Toggle = styled.div.withConfig({
-  displayName: "EarnedToken__Toggle",
-  componentId: "sc-1kzbws6-5"
-})(["justify-self:flex-end;svg{margin:0;}"]);
+var MobileInfo = styled.div(_templateObject6$j || (_templateObject6$j = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  width: 80%;\n  margin-bottom: 10px;\n"])));
+var Toggle = styled.div(_templateObject7$f || (_templateObject7$f = _taggedTemplateLiteral(["\n  justify-self: flex-end;\n\n  svg {\n    margin: 0;\n  }\n"])));
 var EarnedToken = function EarnedToken(_ref10) {
   var tokenName = _ref10.tokenName,
     amount = _ref10.amount,
@@ -10317,10 +10183,8 @@ var Tokens;
   Tokens["ETH"] = "ETH";
 })(Tokens || (Tokens = {}));
 
-var StyledEarnedWrapper = styled.div.withConfig({
-  displayName: "StyledEarnedWrapper",
-  componentId: "sc-vkh54k-0"
-})(["border:1px solid ", ";background:", ";width:100%;border-radius:", ";color:", ";overflow:hidden;position:relative;"], function (_ref) {
+var _templateObject$1A;
+var StyledEarnedWrapper = styled.div(_templateObject$1A || (_templateObject$1A = _taggedTemplateLiteral(["\n  border: 1px solid ", ";\n  background: ", ";\n  width: 100%;\n  border-radius: ", ";\n  color: ", ";\n  overflow: hidden;\n  position: relative;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.white7;
 }, function (_ref2) {
@@ -10343,10 +10207,8 @@ var EarnedWrapper = function EarnedWrapper(_ref) {
   }));
 };
 
-var EarnedWrapperHeader = styled.div.withConfig({
-  displayName: "EarnedWrapperHeader",
-  componentId: "sc-fpoazu-0"
-})(["font-size:20px;line-height:26px;padding:15px;font-weight:700;color:", ";display:flex;justify-content:flex-start;align-items:center;", "{font-size:26px;line-height:33.8px;padding:25px 10px 25px 30px;}"], function (_ref) {
+var _templateObject$1z;
+var EarnedWrapperHeader = styled.div(_templateObject$1z || (_templateObject$1z = _taggedTemplateLiteral(["\n  font-size: 20px;\n  line-height: 26px;\n  padding: 15px;\n  font-weight: 700;\n  color: ", ";\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n\n  ", " {\n    font-size: 26px;\n    line-height: 33.8px;\n    padding: 25px 10px 25px 30px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.white;
 }, function (_ref2) {
@@ -10357,10 +10219,8 @@ EarnedWrapperHeader.defaultProps = {
   as: tags.H2
 };
 
-var GridLayout$1 = styled.div.withConfig({
-  displayName: "BaseLayout__GridLayout",
-  componentId: "sc-183ri5-0"
-})(["display:grid;grid-template-columns:repeat(8,1fr);grid-gap:16px;", "{grid-gap:10px;}", "{grid-template-columns:repeat(12,1fr);grid-gap:24px;}", "{grid-template-columns:repeat(12,1fr);grid-gap:32px;}"], function (_ref) {
+var _templateObject$1y;
+var GridLayout$1 = styled.div(_templateObject$1y || (_templateObject$1y = _taggedTemplateLiteral(["\n  display: grid;\n  grid-template-columns: repeat(8, 1fr);\n  grid-gap: 16px;\n  ", " {\n    grid-gap: 10px;\n  }\n  ", " {\n    grid-template-columns: repeat(12, 1fr);\n    grid-gap: 24px;\n  }\n  ", " {\n    grid-template-columns: repeat(12, 1fr);\n    grid-gap: 32px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.sm;
 }, function (_ref2) {
@@ -10371,28 +10231,21 @@ var GridLayout$1 = styled.div.withConfig({
   return theme.mediaQueries.lg;
 });
 
-var GridLayout = styled(GridLayout$1).withConfig({
-  displayName: "CardsLayout__GridLayout",
-  componentId: "sc-1cke1k8-0"
-})(["& > div{grid-column:span 6;", "{grid-column:span 4;}}"], function (_ref) {
+var _templateObject$1x;
+var GridLayout = styled(GridLayout$1)(_templateObject$1x || (_templateObject$1x = _taggedTemplateLiteral(["\n  & > div {\n    grid-column: span 6;\n    ", " {\n      grid-column: span 4;\n    }\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.sm;
 });
 
-var StyledEarnedWrapperBody = styled.div.withConfig({
-  displayName: "EarnedWrapperBody__StyledEarnedWrapperBody",
-  componentId: "sc-1bcwv2i-0"
-})(["width:100%;display:flex;justify-content:flex-start;padding:0 10px;", "{padding:0 30px;margin-bottom:", " !important;}"], function (_ref) {
+var _templateObject$1w, _templateObject2$V, _templateObject3$I;
+var StyledEarnedWrapperBody = styled.div(_templateObject$1w || (_templateObject$1w = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  justify-content: flex-start;\n  padding: 0 10px;\n\n  ", " {\n    padding: 0 30px;\n    margin-bottom: ", " !important;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.md;
 }, function (_ref2) {
   var withoutMore = _ref2.withoutMore;
   return withoutMore ? "30px" : "0px";
 });
-var StyledCardsLayout = styled(GridLayout$1).withConfig({
-  displayName: "EarnedWrapperBody__StyledCardsLayout",
-  componentId: "sc-1bcwv2i-1"
-})(["width:100%;& > div{grid-column:span 12;", "{grid-column:span 4;}", "{grid-column:span 4;}", "{grid-column:span ", ";}}"], function (_ref3) {
+var StyledCardsLayout = styled(GridLayout$1)(_templateObject2$V || (_templateObject2$V = _taggedTemplateLiteral(["\n  width: 100%;\n\n  & > div {\n    grid-column: span 12;\n    ", " {\n      grid-column: span 4;\n    }\n    ", " {\n      grid-column: span 4;\n    }\n    ", " {\n      grid-column: span ", ";\n    }\n  }\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.mediaQueries.sm;
 }, function (_ref4) {
@@ -10405,10 +10258,7 @@ var StyledCardsLayout = styled(GridLayout$1).withConfig({
   var childrenNumber = _ref6.childrenNumber;
   return childrenNumber === 3 ? "4" : "3";
 });
-var EarnedWrapperFooter = styled.div.withConfig({
-  displayName: "EarnedWrapperBody__EarnedWrapperFooter",
-  componentId: "sc-1bcwv2i-2"
-})(["display:flex;justify-content:center;align-items:center;padding:10px 5px;", "{padding:20px 30px;}"], function (_ref7) {
+var EarnedWrapperFooter = styled.div(_templateObject3$I || (_templateObject3$I = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  padding: 10px 5px;\n\n  ", " {\n    padding: 20px 30px;\n  }\n"])), function (_ref7) {
   var theme = _ref7.theme;
   return theme.mediaQueries.md;
 });
@@ -10475,10 +10325,8 @@ var EarnedWrapperBody = function EarnedWrapperBody(_ref8) {
   });
 };
 
-var StyledEarnedCarouselWrapper = styled.div.withConfig({
-  displayName: "StyledEarnedCarouselWrapper",
-  componentId: "sc-1fmwe6r-0"
-})(["border:1px solid ", ";background:", ";width:100%;border-radius:", ";color:", ";overflow:hidden;position:relative;padding-bottom:10px;", "{padding-bottom:0px;}"], function (_ref) {
+var _templateObject$1v;
+var StyledEarnedCarouselWrapper = styled.div(_templateObject$1v || (_templateObject$1v = _taggedTemplateLiteral(["\n  border: 1px solid ", ";\n  background: ", ";\n  width: 100%;\n  border-radius: ", ";\n  color: ", ";\n  overflow: hidden;\n  position: relative;\n  padding-bottom: 10px;\n  ", " {\n    padding-bottom: 0px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.white7;
 }, function (_ref2) {
@@ -10504,10 +10352,8 @@ var EarnedCarouselWrapper = function EarnedCarouselWrapper(_ref) {
   }));
 };
 
-var EarnedCarouselWrapperHeader = styled.div.withConfig({
-  displayName: "EarnedCarouselWrapperHeader",
-  componentId: "sc-zz4zep-0"
-})(["font-size:20px;line-height:26px;padding:15px;font-weight:700;color:", ";display:flex;justify-content:flex-start;align-items:center;", "{font-size:26px;line-height:33.8px;padding:25px 10px 25px 30px;}"], function (_ref) {
+var _templateObject$1u;
+var EarnedCarouselWrapperHeader = styled.div(_templateObject$1u || (_templateObject$1u = _taggedTemplateLiteral(["\n  font-size: 20px;\n  line-height: 26px;\n  padding: 15px;\n  font-weight: 700;\n  color: ", ";\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n\n  ", " {\n    font-size: 26px;\n    line-height: 33.8px;\n    padding: 25px 10px 25px 30px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.white;
 }, function (_ref2) {
@@ -10518,14 +10364,9 @@ EarnedCarouselWrapperHeader.defaultProps = {
   as: tags.H2
 };
 
-var CSSTokenWrapper = styled.div.withConfig({
-  displayName: "EarnedCarouselWrapperBody__CSSTokenWrapper",
-  componentId: "sc-63miep-0"
-})(["padding:0 10px;@media (max-width:800px){width:50%;}@media (min-width:800px){width:33.3%;}@media (min-width:1200px){width:25%;}"]);
-var SliderWrapper = styled.div.withConfig({
-  displayName: "EarnedCarouselWrapperBody__SliderWrapper",
-  componentId: "sc-63miep-1"
-})(["", "{margin:", ";}", "{margin:", ";}display:flex;flex-direction:row;justify-content:flex-start;align-items:center;"], function (_ref) {
+var _templateObject$1t, _templateObject2$U, _templateObject3$H;
+var CSSTokenWrapper = styled.div(_templateObject$1t || (_templateObject$1t = _taggedTemplateLiteral(["\n  padding: 0 10px;\n\n  @media (max-width: 800px) {\n    width: 50%;\n  }\n  @media (min-width: 800px) {\n    width: 33.3%;\n  }\n  @media (min-width: 1200px) {\n    width: 25%;\n  }\n"])));
+var SliderWrapper = styled.div(_templateObject2$U || (_templateObject2$U = _taggedTemplateLiteral(["\n  ", " {\n    margin: ", ";\n  }\n\n  ", " {\n    margin: ", ";\n  }\n\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-start;\n  align-items: center;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.sm;
 }, function (_ref2) {
@@ -10538,10 +10379,7 @@ var SliderWrapper = styled.div.withConfig({
   var dots = _ref4.dots;
   return dots ? "0 20px 60px" : "0 5px 15px";
 });
-var StyledSlider$1 = styled(Slider).withConfig({
-  displayName: "EarnedCarouselWrapperBody__StyledSlider",
-  componentId: "sc-63miep-2"
-})(["@media (max-width:800px){width:", ";}@media (min-width:800px){width:", ";}@media (min-width:1200px){width:", ";}.slick-track{display:flex;> div{padding:0 10px;}}.slick-dots{.slick-active{div{background:", " !important;}}}"], function (_ref5) {
+var StyledSlider$1 = styled(Slider)(_templateObject3$H || (_templateObject3$H = _taggedTemplateLiteral(["\n  @media (max-width: 800px) {\n    width: ", ";\n  }\n  @media (min-width: 800px) {\n    width: ", ";\n  }\n  @media (min-width: 1200px) {\n    width: ", ";\n  }\n\n  .slick-track {\n    display: flex;\n    > div {\n      padding: 0 10px;\n    }\n  }\n\n  .slick-dots {\n    .slick-active {\n      div {\n        background: ", " !important;\n      }\n    }\n  }\n"])), function (_ref5) {
   var withoutMain = _ref5.withoutMain;
   if (withoutMain) {
     return "100%";
@@ -10706,6 +10544,7 @@ var BackgroundImage = function BackgroundImage(_ref) {
   }, otherProps));
 };
 
+var _templateObject$1s;
 var getBoxShadow$1 = function getBoxShadow(_ref) {
   var isActive = _ref.isActive,
     isWarning = _ref.isWarning,
@@ -10718,10 +10557,7 @@ var getBoxShadow$1 = function getBoxShadow(_ref) {
   }
   return theme.infoBox.boxShadow;
 };
-var StyledInfoBox = styled.div.withConfig({
-  displayName: "StyledInfoBox",
-  componentId: "sc-132sfwq-0"
-})(["filter:drop-shadow(rgba(25,19,38,0.15) 0px 1px 4px);width:100%;background:rgb(22,22,29);border:1px solid rgb(82,75,99);border-radius:15px;border:1px solid ", ";box-shadow:", ";color:", ";overflow:hidden;position:relative;", ""], function (_ref2) {
+var StyledInfoBox = styled.div(_templateObject$1s || (_templateObject$1s = _taggedTemplateLiteral(["\n  filter: drop-shadow(rgba(25, 19, 38, 0.15) 0px 1px 4px);\n  width: 100%;\n  background: rgb(22, 22, 29);\n  border: 1px solid rgb(82, 75, 99);\n  border-radius: 15px;\n  border: 1px solid ", ";\n  box-shadow: ", ";\n  color: ", ";\n  overflow: hidden;\n  position: relative;\n\n  ", "\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.borderColor;
 }, getBoxShadow$1, function (_ref3) {
@@ -10742,24 +10578,18 @@ var InfoBox$1 = function InfoBox(_ref) {
   }));
 };
 
-var InfoBox = styled.div.withConfig({
-  displayName: "InfoBoxBody__InfoBox",
-  componentId: "sc-1opp4pn-0"
-})(["", ";padding:20px;display:flex;justify-content:flex-start;"], space);
+var _templateObject$1r;
+var InfoBox = styled.div(_templateObject$1r || (_templateObject$1r = _taggedTemplateLiteral(["\n  ", ";\n  padding: 20px;\n  display: flex;\n  justify-content: flex-start;\n"])), space);
 InfoBox.defaultProps = {
   p: "24px"
 };
 
-var InfoBoxHeader = styled.div.withConfig({
-  displayName: "InfoBoxHeader",
-  componentId: "sc-ll0lgz-0"
-})(["", ";font-weight:600;font-size:24px;line-height:130%;color:white;display:flex;height:55px;padding:0 20px;justify-content:space-between;align-items:center;background:rgba(10,10,10,1);"], space);
+var _templateObject$1q;
+var InfoBoxHeader = styled.div(_templateObject$1q || (_templateObject$1q = _taggedTemplateLiteral(["\n  ", ";\n  font-weight: 600;\n  font-size: 24px;\n  line-height: 130%;\n  color: white;\n\n  display: flex;\n  height: 55px;\n  padding: 0 20px;\n  justify-content: space-between;\n  align-items: center;\n  background: rgba(10, 10, 10, 1);\n"])), space);
 InfoBoxHeader.defaultProps = {};
 
-var InfoBoxFooter = styled.div.withConfig({
-  displayName: "InfoBoxFooter",
-  componentId: "sc-suth0r-0"
-})(["", ";padding:20px;display:flex;justify-content:flex-start;"], space);
+var _templateObject$1p;
+var InfoBoxFooter = styled.div(_templateObject$1p || (_templateObject$1p = _taggedTemplateLiteral(["\n  ", ";\n  padding: 20px;\n  display: flex;\n  justify-content: flex-start;\n"])), space);
 InfoBoxFooter.defaultProps = {
   p: "24px"
 };
@@ -10770,6 +10600,7 @@ var scales$1 = {
   LG: "lg"
 };
 
+var _templateObject$1o;
 /**
  * Priority: Warning --> Success
  */
@@ -10800,10 +10631,7 @@ var getHeight = function getHeight(_ref2) {
       return "40px";
   }
 };
-var Input = styled.input.withConfig({
-  displayName: "Input",
-  componentId: "sc-i7ggno-0"
-})(["background-color:", ";border:1px solid rgba(255,255,255,0.3);border-radius:10px;box-shadow:", ";color:", ";display:block;font-size:16px;height:", ";outline:0;padding:0 16px;width:100%;&::placeholder{color:", ";}&:disabled{background-color:", ";box-shadow:none;color:", ";cursor:not-allowed;}&:focus:not(:disabled){box-shadow:", ";}"], function (_ref3) {
+var Input = styled.input(_templateObject$1o || (_templateObject$1o = _taggedTemplateLiteral(["\n  background-color: ", ";\n  border: 1px solid rgba(255, 255, 255, 0.3);\n  border-radius: 10px;\n  box-shadow: ", ";\n  color: ", ";\n  display: block;\n  font-size: 16px;\n  height: ", ";\n  outline: 0;\n  padding: 0 16px;\n  width: 100%;\n\n  &::placeholder {\n    color: ", ";\n  }\n\n  &:disabled {\n    background-color: ", ";\n    box-shadow: none;\n    color: ", ";\n    cursor: not-allowed;\n  }\n\n  &:focus:not(:disabled) {\n    box-shadow: ", ";\n  }\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.colors.input;
 }, getBoxShadow, function (_ref4) {
@@ -10831,48 +10659,25 @@ Input.defaultProps = {
 var _excluded$9 = ["children"],
   _excluded2 = ["children"],
   _excluded3 = ["children"];
-var InputLabelBox = styled.div.withConfig({
-  displayName: "InputAssets__InputLabelBox",
-  componentId: "sc-1xa506b-0"
-})(["display:flex;justify-content:space-between;margin-bottom:8px;"]);
-var Label = styled(Text).withConfig({
-  displayName: "InputAssets__Label",
-  componentId: "sc-1xa506b-1"
-})(["color:", ";font-weight:bold;font-size:16px;line-height:28px;"], function (_ref) {
+var _templateObject$1n, _templateObject2$T, _templateObject3$G, _templateObject4$v, _templateObject5$s, _templateObject6$i, _templateObject7$e, _templateObject8$a, _templateObject9$9;
+var InputLabelBox = styled.div(_templateObject$1n || (_templateObject$1n = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  margin-bottom: 8px;\n"])));
+var Label = styled(Text)(_templateObject2$T || (_templateObject2$T = _taggedTemplateLiteral(["\n  color: ", ";\n  font-weight: bold;\n  font-size: 16px;\n  line-height: 28px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.white55;
 });
-var OptionalBox = styled(Text).withConfig({
-  displayName: "InputAssets__OptionalBox",
-  componentId: "sc-1xa506b-2"
-})(["display:flex;justify-content:center;flex-direction:column;"]);
-var Optional = styled(Text).withConfig({
-  displayName: "InputAssets__Optional",
-  componentId: "sc-1xa506b-3"
-})(["color:#373749;font-weight:bold;font-size:11px;line-height:138.5%;"]);
-var StyledInputDesc = styled(Text).withConfig({
-  displayName: "InputAssets__StyledInputDesc",
-  componentId: "sc-1xa506b-4"
-})(["color:", ";font-weight:normal;font-size:12px;line-height:170%;"], function (_ref2) {
+var OptionalBox = styled(Text)(_templateObject3$G || (_templateObject3$G = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  flex-direction: column;\n"])));
+var Optional = styled(Text)(_templateObject4$v || (_templateObject4$v = _taggedTemplateLiteral(["\n  color: #373749;\n  font-weight: bold;\n  font-size: 11px;\n  line-height: 138.5%;\n"])));
+var StyledInputDesc = styled(Text)(_templateObject5$s || (_templateObject5$s = _taggedTemplateLiteral(["\n  color: ", ";\n  font-weight: normal;\n  font-size: 12px;\n  line-height: 170%;\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.white55;
 });
-var StyledInputBottomDesc = styled(StyledInputDesc).withConfig({
-  displayName: "InputAssets__StyledInputBottomDesc",
-  componentId: "sc-1xa506b-5"
-})(["padding-left:8px;"]);
-var textStyle = css(["font-size:11px;line-height:138.5%;font-weight:bold;padding:0px 0px 10px 24px;margin-bottom:-25px;"]);
-var StyledErrorMessage = styled(Text).withConfig({
-  displayName: "InputAssets__StyledErrorMessage",
-  componentId: "sc-1xa506b-6"
-})(["", ";color:", ";"], textStyle, function (_ref3) {
+var StyledInputBottomDesc = styled(StyledInputDesc)(_templateObject6$i || (_templateObject6$i = _taggedTemplateLiteral(["\n  padding-left: 8px;\n"])));
+var textStyle = css(_templateObject7$e || (_templateObject7$e = _taggedTemplateLiteral(["\n  font-size: 11px;\n  line-height: 138.5%;\n  font-weight: bold;\n  padding: 0px 0px 10px 24px;\n  margin-bottom: -25px;\n"])));
+var StyledErrorMessage = styled(Text)(_templateObject8$a || (_templateObject8$a = _taggedTemplateLiteral(["\n  ", ";\n  color: ", ";\n"])), textStyle, function (_ref3) {
   var theme = _ref3.theme;
   return theme.colors.error;
 });
-var StyledSuccessMessage = styled(Text).withConfig({
-  displayName: "InputAssets__StyledSuccessMessage",
-  componentId: "sc-1xa506b-7"
-})(["", ";color:", ";"], textStyle, function (_ref4) {
+var StyledSuccessMessage = styled(Text)(_templateObject9$9 || (_templateObject9$9 = _taggedTemplateLiteral(["\n  ", ";\n  color: ", ";\n"])), textStyle, function (_ref4) {
   var theme = _ref4.theme;
   return theme.colors.primary;
 });
@@ -10939,13 +10744,11 @@ var InputWrapper$1 = function InputWrapper(_ref0) {
   });
 };
 
+var _templateObject$1m, _templateObject2$S;
 var StyledInput$1 = styled(function (_ref) {
   var props = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
   return /*#__PURE__*/jsx(DatePicker, _objectSpread2({}, props));
-}).withConfig({
-  displayName: "MuiDateInput__StyledInput",
-  componentId: "sc-2l4k3e-0"
-})(["width:100%;height:60px;.MuiInputBase-root{border:1px solid ", ";border-radius:10px;background:", ";padding:16px 24px;color:white;font-weight:500;font-size:16px;line-height:28px;&.Mui-disabled{.MuiInputBase-input{color:", ";}}}.MuiFormHelperText-root.Mui-error{display:none;}"], function (props) {
+})(_templateObject$1m || (_templateObject$1m = _taggedTemplateLiteral(["\n  width: 100%;\n  height: 60px;\n  .MuiInputBase-root {\n    border: 1px solid\n      ", ";\n    border-radius: 10px;\n    background: ", ";\n    padding: 16px 24px;\n    color: white;\n    font-weight: 500;\n    font-size: 16px;\n    line-height: 28px;\n    &.Mui-disabled {\n      .MuiInputBase-input {\n        color: ", ";\n      }\n    }\n  }\n  .MuiFormHelperText-root.Mui-error {\n    display: none;\n  }\n"])), function (props) {
   return props.disabled ? "".concat(props.theme.colors.white55) : props.error ? "".concat(props.theme.colors.error) : props.value ? "".concat(props.theme.colors.white55) : "rgba(255, 255, 255, 0.03)";
 }, function (props) {
   return props.disabled ? props.theme.colors.disabled : props.theme.backgrounds.secondary;
@@ -10956,10 +10759,7 @@ var StyledInput$1 = styled(function (_ref) {
 var DateInputWrapper = styled(function (_ref3) {
   var props = _extends({}, (_objectDestructuringEmpty(_ref3), _ref3));
   return /*#__PURE__*/jsx("div", _objectSpread2({}, props));
-}).withConfig({
-  displayName: "MuiDateInput__DateInputWrapper",
-  componentId: "sc-2l4k3e-1"
-})(["margin-bottom:15px;"]);
+})(_templateObject2$S || (_templateObject2$S = _taggedTemplateLiteral(["\n  margin-bottom: 15px;\n"])));
 var MuiDateInput = function MuiDateInput(_ref4) {
   var name = _ref4.name,
     label = _ref4.label,
@@ -11023,13 +10823,11 @@ var MuiDateInput = function MuiDateInput(_ref4) {
   });
 };
 
+var _templateObject$1l, _templateObject2$R;
 var DragAndDropZone = styled(function (_ref) {
   var props = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
   return /*#__PURE__*/jsx("div", _objectSpread2({}, props));
-}).withConfig({
-  displayName: "MuiFileInput__DragAndDropZone",
-  componentId: "sc-1qlv44t-0"
-})(["background:", ";cursor:", ";border:1px ", ";box-sizing:border-box;border-radius:10px;padding:16px 24px;font-weight:500;font-size:16px;line-height:28px;display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;"], function (props) {
+})(_templateObject$1l || (_templateObject$1l = _taggedTemplateLiteral(["\n  background: ", ";\n  cursor: ", ";\n  border: 1px\n    ", ";\n  box-sizing: border-box;\n  border-radius: 10px;\n  padding: 16px 24px;\n  font-weight: 500;\n  font-size: 16px;\n  line-height: 28px;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 10px;\n"])), function (props) {
   return props.disabled ? props.theme.colors.disabled : props.theme.backgrounds.secondary;
 }, function (props) {
   return props.disabled ? "not-allowed" : "pointer";
@@ -11039,10 +10837,7 @@ var DragAndDropZone = styled(function (_ref) {
 var DragAndDropText = styled(function (_ref2) {
   var props = _extends({}, (_objectDestructuringEmpty(_ref2), _ref2));
   return /*#__PURE__*/jsx(Text, _objectSpread2({}, props));
-}).withConfig({
-  displayName: "MuiFileInput__DragAndDropText",
-  componentId: "sc-1qlv44t-1"
-})(["font-weight:500;font-size:16px;line-height:28px;color:", ";span{color:", ";}"], function (props) {
+})(_templateObject2$R || (_templateObject2$R = _taggedTemplateLiteral(["\n  font-weight: 500;\n  font-size: 16px;\n  line-height: 28px;\n  color: ", ";\n  span {\n    color: ", ";\n  }\n"])), function (props) {
   return props.disabled ? props.theme.colors.white55 : props.theme.colors.white;
 }, function (props) {
   return props.disabled ? props.theme.colors.white55 : props.theme.colors.primary;
@@ -11116,21 +10911,13 @@ var MuiFileInput = function MuiFileInput(_ref3) {
 };
 
 var _excluded$8 = ["name", "label", "placeholderLabel", "placeholder", "topDesc", "bottomDesc", "optional", "value", "onChange", "onBlur", "error", "textarea", "maxLength", "disabled", "success", "successMsg"];
-var TextAreaWrapper = styled.div.withConfig({
-  displayName: "MuiTextInput__TextAreaWrapper",
-  componentId: "sc-1pp44v8-0"
-})(["position:relative;"]);
-var LengthText = styled(Text).withConfig({
-  displayName: "MuiTextInput__LengthText",
-  componentId: "sc-1pp44v8-1"
-})(["position:absolute;font-weight:bold;font-size:11px;line-height:138.5%;color:", ";bottom:20px;right:15px;"], function (_ref) {
+var _templateObject$1k, _templateObject2$Q, _templateObject3$F;
+var TextAreaWrapper = styled.div(_templateObject$1k || (_templateObject$1k = _taggedTemplateLiteral(["\n  position: relative;\n"])));
+var LengthText = styled(Text)(_templateObject2$Q || (_templateObject2$Q = _taggedTemplateLiteral(["\n  position: absolute;\n  font-weight: bold;\n  font-size: 11px;\n  line-height: 138.5%;\n  color: ", ";\n  bottom: 20px;\n  right: 15px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.grey;
 });
-var StyledTextField = styled(TextField).withConfig({
-  displayName: "MuiTextInput__StyledTextField",
-  componentId: "sc-1pp44v8-2"
-})(["&.MuiTextField-root{margin-bottom:10px;width:100%;.MuiInputBase-input{color:white;::placeholder{opacity:1;color:", ";}}.MuiFilledInput-root{background-color:", ";border:1px solid ", ";border-radius:10px;height:", ";.MuiFilledInput-input{padding:", ";}&.Mui-error{border:1px solid ", ";}&.Mui-focused{border:1px solid ", ";box-shadow:0px 0px 8px rgba(18,255,184,0.15);&.Mui-error{border:1px solid ", ";box-shadow:unset;}}&.Mui-disabled{background-color:", ";border:1px solid ", ";.MuiInputBase-input{color:", ";}}&.MuiFilledInput-underline:before{border-bottom:unset;}&.MuiFilledInput-underline:after{border-bottom:unset;}}.MuiInputLabel-filled{font-weight:500;font-size:16px;line-height:28px;transform:translate(24px,17px);color:", ";transition:all 0.15s;&.MuiInputLabel-shrink{font-weight:bold;font-size:11px;line-height:138.5%;transform:translate(24px,10px);color:", ";}}}.MuiFilledInput-multiline{padding:0px 12px 30px 0px;}"], function (_ref2) {
+var StyledTextField = styled(TextField)(_templateObject3$F || (_templateObject3$F = _taggedTemplateLiteral(["\n  &.MuiTextField-root {\n    margin-bottom: 10px;\n    width: 100%;\n    .MuiInputBase-input {\n      color: white;\n      ::placeholder {\n        opacity: 1;\n        color: ", ";\n      }\n    }\n    .MuiFilledInput-root {\n      background-color: ", ";\n      border: 1px solid ", ";\n      border-radius: 10px;\n      height: ", ";\n      .MuiFilledInput-input {\n        padding: ", ";\n      }\n      &.Mui-error {\n        border: 1px solid ", ";\n      }\n      &.Mui-focused {\n        border: 1px solid ", ";\n        box-shadow: 0px 0px 8px rgba(18, 255, 184, 0.15);\n        &.Mui-error {\n          border: 1px solid ", ";\n          box-shadow: unset;\n        }\n      }\n      &.Mui-disabled {\n        background-color: ", ";\n        border: 1px solid ", ";\n        .MuiInputBase-input {\n          color: ", ";\n        }\n      }\n      &.MuiFilledInput-underline:before {\n        border-bottom: unset;\n      }\n      &.MuiFilledInput-underline:after {\n        border-bottom: unset;\n      }\n    }\n    .MuiInputLabel-filled {\n      font-weight: 500;\n      font-size: 16px;\n      line-height: 28px;\n      transform: translate(24px, 17px);\n      color: ", ";\n      transition: all 0.15s;\n      &.MuiInputLabel-shrink {\n        font-weight: bold;\n        font-size: 11px;\n        line-height: 138.5%;\n        transform: translate(24px, 10px);\n        color: ", ";\n      }\n    }\n  }\n  .MuiFilledInput-multiline {\n    padding: 0px 12px 30px 0px;\n  }\n"])), function (_ref2) {
   var theme = _ref2.theme,
     disabled = _ref2.disabled;
   return disabled ? theme.colors.white55 : theme.colors.grey;
@@ -11238,21 +11025,13 @@ var MuiTextInput = function MuiTextInput(_ref11) {
   });
 };
 
-var CarouselBox = styled.div.withConfig({
-  displayName: "NewsCarousel__CarouselBox",
-  componentId: "sc-xakklk-0"
-})(["height:200px;"]);
-var StyledSlider = styled(Slider).withConfig({
-  displayName: "NewsCarousel__StyledSlider",
-  componentId: "sc-xakklk-1"
-})([".slick-track{> div{padding:0 10px;}}.slick-dots{.slick-active{div{background:", " !important;}}}"], function (_ref) {
+var _templateObject$1j, _templateObject2$P, _templateObject3$E;
+var CarouselBox = styled.div(_templateObject$1j || (_templateObject$1j = _taggedTemplateLiteral(["\n  height: 200px;\n"])));
+var StyledSlider = styled(Slider)(_templateObject2$P || (_templateObject2$P = _taggedTemplateLiteral(["\n  .slick-track {\n    > div {\n      padding: 0 10px;\n    }\n  }\n\n  .slick-dots {\n    .slick-active {\n      div {\n        background: ", " !important;\n      }\n    }\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.blue;
 });
-var ImageDiv = styled.div.withConfig({
-  displayName: "NewsCarousel__ImageDiv",
-  componentId: "sc-xakklk-2"
-})(["background:", ";background-size:cover;color:white;display:flex;flex-direction:row;justify-content:center;align-items:flex-end;padding-bottom:30px;height:200px;border-radius:15px;border:1px solid ", ";"], function (_ref2) {
+var ImageDiv = styled.div(_templateObject3$E || (_templateObject3$E = _taggedTemplateLiteral(["\n  background: ", ";\n  background-size: cover;\n  color: white;\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: flex-end;\n  padding-bottom: 30px;\n  height: 200px;\n  border-radius: 15px;\n  border: 1px solid ", ";\n"])), function (_ref2) {
   var background = _ref2.background;
   return background;
 }, function (_ref3) {
@@ -11301,6 +11080,7 @@ var scales = {
   MD: "md"
 };
 
+var _templateObject$1i;
 var getScale = function getScale(_ref) {
   var scale = _ref.scale;
   switch (scale) {
@@ -11323,10 +11103,7 @@ var getCheckedScale = function getCheckedScale(_ref2) {
 };
 var Radio = styled.input.attrs({
   type: "radio"
-}).withConfig({
-  displayName: "Radio",
-  componentId: "sc-955j6u-0"
-})(["appearance:none;overflow:hidden;cursor:pointer;position:relative;display:inline-block;height:", ";width:", ";vertical-align:middle;transition:background-color 0.2s ease-in-out;border:0;border-radius:50%;background-color:", ";box-shadow:", ";&:after{border-radius:50%;content:\"\";height:", ";left:6px;position:absolute;top:6px;width:", ";}&:hover:not(:disabled):not(:checked){box-shadow:", ";}&:focus{outline:none;box-shadow:", ";}&:checked{background-color:", ";&:after{background-color:", ";}}&:disabled{cursor:default;opacity:0.6;}", ""], getScale, getScale, function (_ref3) {
+})(_templateObject$1i || (_templateObject$1i = _taggedTemplateLiteral(["\n  appearance: none;\n  overflow: hidden;\n  cursor: pointer;\n  position: relative;\n  display: inline-block;\n  height: ", ";\n  width: ", ";\n  vertical-align: middle;\n  transition: background-color 0.2s ease-in-out;\n  border: 0;\n  border-radius: 50%;\n  background-color: ", ";\n  box-shadow: ", ";\n\n  &:after {\n    border-radius: 50%;\n    content: \"\";\n    height: ", ";\n    left: 6px;\n    position: absolute;\n    top: 6px;\n    width: ", ";\n  }\n\n  &:hover:not(:disabled):not(:checked) {\n    box-shadow: ", ";\n  }\n\n  &:focus {\n    outline: none;\n    box-shadow: ", ";\n  }\n\n  &:checked {\n    background-color: ", ";\n    &:after {\n      background-color: ", ";\n    }\n  }\n\n  &:disabled {\n    cursor: default;\n    opacity: 0.6;\n  }\n  ", "\n"])), getScale, getScale, function (_ref3) {
   var theme = _ref3.theme;
   return theme.colors.input;
 }, function (_ref4) {
@@ -11466,10 +11243,8 @@ var darkColors = _objectSpread2(_objectSpread2(_objectSpread2({}, baseColors), b
   }
 });
 
-var StyledCoreTag = styled.div.withConfig({
-  displayName: "CoreTag__StyledCoreTag",
-  componentId: "sc-1bfj6gr-0"
-})(["width:auto;height:24px;display:inline-flex;justify-content:space-between;align-items:center;background-color:transparent;border:1px solid ", ";border-radius:", ";color:", ";font-size:14px;font-weight:700;line-height:1.5;padding:0 8px;white-space:nowrap;svg{margin-left:", "px;margin-right:", "px;width:16px;height:16px;fill:", ";}"], function (_ref) {
+var _templateObject$1h, _templateObject2$O;
+var StyledCoreTag = styled.div(_templateObject$1h || (_templateObject$1h = _taggedTemplateLiteral(["\n  width: auto;\n  height: 24px;\n  display: inline-flex;\n  justify-content: space-between;\n  align-items: center;\n  background-color: transparent;\n  border: 1px solid ", ";\n  border-radius: ", ";\n  color: ", ";\n  font-size: 14px;\n  font-weight: 700;\n  line-height: 1.5;\n  padding: 0 8px;\n  white-space: nowrap;\n\n  svg {\n    margin-left: ", "px;\n    margin-right: ", "px;\n    width: 16px;\n    height: 16px;\n    fill: ", ";\n  }\n"])), function (_ref) {
   var theme = _ref.theme,
     active = _ref.active,
     color = _ref.color;
@@ -11493,10 +11268,7 @@ var StyledCoreTag = styled.div.withConfig({
     active = _ref6.active;
   return active ? theme.colors.primary : theme.colors.grey;
 });
-var StyledText = styled(Text).withConfig({
-  displayName: "CoreTag__StyledText",
-  componentId: "sc-1bfj6gr-1"
-})(["font-weight:700;color:", ";font-size:14px;line-height:20px;"], function (_ref7) {
+var StyledText = styled(Text)(_templateObject2$O || (_templateObject2$O = _taggedTemplateLiteral(["\n  font-weight: 700;\n  color: ", ";\n  font-size: 14px;\n  line-height: 20px;\n"])), function (_ref7) {
   var theme = _ref7.theme,
     active = _ref7.active,
     color = _ref7.color;
@@ -11584,21 +11356,16 @@ var Icon$M = function Icon(props) {
   }));
 };
 
-var rotate = keyframes(["from{transform:rotate(0deg);}to{transform:rotate(360deg);}"]);
-var Container$6 = styled.div.withConfig({
-  displayName: "Spinner__Container",
-  componentId: "sc-1wgci3j-0"
-})(["position:relative;height:", "px;width:", "px;"], function (_ref) {
+var _templateObject$1g, _templateObject2$N, _templateObject3$D;
+var rotate = keyframes(_templateObject$1g || (_templateObject$1g = _taggedTemplateLiteral(["\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n"])));
+var Container$6 = styled.div(_templateObject2$N || (_templateObject2$N = _taggedTemplateLiteral(["\n  position: relative;\n  height: ", "px;\n  width: ", "px;\n"])), function (_ref) {
   var size = _ref.size;
   return size;
 }, function (_ref2) {
   var size = _ref2.size;
   return size;
 });
-var RotatingSpinnerIcon = styled(Icon$M).withConfig({
-  displayName: "Spinner__RotatingSpinnerIcon",
-  componentId: "sc-1wgci3j-1"
-})(["position:absolute;top:0;left:0;animation:", " 2s linear infinite;transform:translate3d(0,0,0);"], rotate);
+var RotatingSpinnerIcon = styled(Icon$M)(_templateObject3$D || (_templateObject3$D = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  animation: ", " 2s linear infinite;\n  transform: translate3d(0, 0, 0);\n"])), rotate);
 var Spinner = function Spinner(_ref3) {
   var _ref3$size = _ref3.size,
     size = _ref3$size === void 0 ? 128 : _ref3$size;
@@ -11610,25 +11377,14 @@ var Spinner = function Spinner(_ref3) {
   });
 };
 
-var StyledContainer = styled.div.withConfig({
-  displayName: "List__StyledContainer",
-  componentId: "sc-1c4vjp9-0"
-})(["width:100%;height:100%;overflow:auto;", ""], function (_ref) {
+var _templateObject$1f, _templateObject2$M, _templateObject3$C, _templateObject4$u;
+var StyledContainer = styled.div(_templateObject$1f || (_templateObject$1f = _taggedTemplateLiteral(["\n  width: 100%;\n  height: 100%;\n  overflow: auto;\n  ", "\n"])), function (_ref) {
   var loader = _ref.loader;
   return loader && "\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  ";
 });
-var StyledItem = styled.div.withConfig({
-  displayName: "List__StyledItem",
-  componentId: "sc-1c4vjp9-1"
-})(["display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(55,55,73,0.3);padding-top:8px;padding-bottom:8px;"]);
-var StyledLabel = styled(Text).withConfig({
-  displayName: "List__StyledLabel",
-  componentId: "sc-1c4vjp9-2"
-})(["opacity:0.55;"]);
-var ListWrapper = styled.div.withConfig({
-  displayName: "List__ListWrapper",
-  componentId: "sc-1c4vjp9-3"
-})(["display:flex;height:", ";"], function (_ref2) {
+var StyledItem = styled.div(_templateObject2$M || (_templateObject2$M = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  border-bottom: 1px solid rgba(55, 55, 73, 0.3);\n  padding-top: 8px;\n  padding-bottom: 8px;\n"])));
+var StyledLabel = styled(Text)(_templateObject3$C || (_templateObject3$C = _taggedTemplateLiteral(["\n  opacity: 0.55;\n"])));
+var ListWrapper = styled.div(_templateObject4$u || (_templateObject4$u = _taggedTemplateLiteral(["\n  display: flex;\n  height: ", ";\n"])), function (_ref2) {
   var customHeight = _ref2.customHeight;
   return customHeight ? "".concat(customHeight, "px") : "100%";
 });
@@ -11691,19 +11447,14 @@ var List = function List(_ref3) {
   });
 };
 
-var Bar = styled.div.withConfig({
-  displayName: "StyledProgress__Bar",
-  componentId: "sc-1wd61gz-0"
-})(["position:absolute;top:0;left:0;background-color:", ";border-top-left-radius:32px;border-bottom-left-radius:32px;height:16px;transition:width 200ms ease;"], function (props) {
+var _templateObject$1e, _templateObject2$L;
+var Bar = styled.div(_templateObject$1e || (_templateObject$1e = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  background-color: ", ";\n  border-top-left-radius: 32px;\n  border-bottom-left-radius: 32px;\n  height: 16px;\n  transition: width 200ms ease;\n"])), function (props) {
   return props.primary ? props.theme.colors.secondary : "".concat(props.theme.colors.secondary, "80");
 });
 Bar.defaultProps = {
   primary: false
 };
-var StyledProgress = styled.div.withConfig({
-  displayName: "StyledProgress",
-  componentId: "sc-1wd61gz-1"
-})(["position:relative;background-color:", ";border-radius:32px;box-shadow:", ";height:16px;overflow:hidden;"], function (_ref) {
+var StyledProgress = styled.div(_templateObject2$L || (_templateObject2$L = _taggedTemplateLiteral(["\n  position: relative;\n  background-color: ", ";\n  border-radius: 32px;\n  box-shadow: ", ";\n  height: 16px;\n  overflow: hidden;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.input;
 }, function (_ref2) {
@@ -11711,10 +11462,8 @@ var StyledProgress = styled.div.withConfig({
   return theme.shadows.inset;
 });
 
-var ProgressBunnyWrapper = styled.div.withConfig({
-  displayName: "ProgressBunnyWrapper",
-  componentId: "sc-12wvu5w-0"
-})(["display:flex;z-index:2;top:-65%;position:absolute;transform:translate(-50%,-50%);transition:left 200ms ease-out;"]);
+var _templateObject$1d;
+var ProgressBunnyWrapper = styled.div(_templateObject$1d || (_templateObject$1d = _taggedTemplateLiteral(["\n  display: flex;\n  z-index: 2;\n  top: -65%;\n  position: absolute;\n  transform: translate(-50%, -50%);\n  transition: left 200ms ease-out;\n"])));
 
 var stepGuard = function stepGuard(step) {
   if (step < 0) {
@@ -11761,12 +11510,10 @@ var variant = {
 };
 
 var _excluded$6 = ["variant", "animation"];
-var waves = keyframes(["from{left:-150px;}to{left:100%;}"]);
-var pulse = keyframes(["0%{opacity:1;}50%{opacity:0.4;}100%{opacity:1;}"]);
-var Root = styled.div.withConfig({
-  displayName: "Skeleton__Root",
-  componentId: "sc-20824z-0"
-})(["min-height:20px;display:block;background-color:", ";border-radius:", ";", " ", ""], function (_ref) {
+var _templateObject$1c, _templateObject2$K, _templateObject3$B, _templateObject4$t, _templateObject5$r;
+var waves = keyframes(_templateObject$1c || (_templateObject$1c = _taggedTemplateLiteral(["\n   from {\n        left: -150px;\n    }\n    to   {\n        left: 100%;\n    }\n"])));
+var pulse = keyframes(_templateObject2$K || (_templateObject2$K = _taggedTemplateLiteral(["\n  0% {\n    opacity: 1;\n  }\n  50% {\n    opacity: 0.4;\n  }\n  100% {\n    opacity: 1;\n  }\n"])));
+var Root = styled.div(_templateObject3$B || (_templateObject3$B = _taggedTemplateLiteral(["\n  min-height: 20px;\n  display: block;\n  background-color: ", ";\n  border-radius: ", ";\n\n  ", "\n  ", "\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.backgroundDisabled;
 }, function (_ref2) {
@@ -11774,14 +11521,8 @@ var Root = styled.div.withConfig({
     theme = _ref2.theme;
   return variant$1 === variant.CIRCLE ? theme.radii.circle : theme.radii.small;
 }, layout, space);
-var Pulse = styled(Root).withConfig({
-  displayName: "Skeleton__Pulse",
-  componentId: "sc-20824z-1"
-})(["animation:", " 2s infinite ease-out;transform:translate3d(0,0,0);"], pulse);
-var Waves = styled(Root).withConfig({
-  displayName: "Skeleton__Waves",
-  componentId: "sc-20824z-2"
-})(["position:relative;overflow:hidden;transform:translate3d(0,0,0);display:flex;justify-content:center;align-items:center;&:before{content:\"\";position:absolute;background-image:linear-gradient(90deg,transparent,rgba(243,243,243,0.5),transparent);top:0;left:-150px;height:100%;width:150px;animation:", " 2s cubic-bezier(0.4,0,0.2,1) infinite;}"], waves);
+var Pulse = styled(Root)(_templateObject4$t || (_templateObject4$t = _taggedTemplateLiteral(["\n  animation: ", " 2s infinite ease-out;\n  transform: translate3d(0, 0, 0);\n"])), pulse);
+var Waves = styled(Root)(_templateObject5$r || (_templateObject5$r = _taggedTemplateLiteral(["\n  position: relative;\n  overflow: hidden;\n  transform: translate3d(0, 0, 0);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  &:before {\n    content: \"\";\n    position: absolute;\n    background-image: linear-gradient(90deg, transparent, rgba(243, 243, 243, 0.5), transparent);\n    top: 0;\n    left: -150px;\n    height: 100%;\n    width: 150px;\n    animation: ", " 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;\n  }\n"])), waves);
 var Skeleton = function Skeleton(_ref3) {
   var _ref3$variant = _ref3.variant,
     variant$1 = _ref3$variant === void 0 ? variant.RECT : _ref3$variant,
@@ -11799,14 +11540,9 @@ var Skeleton = function Skeleton(_ref3) {
 };
 
 var _excluded$5 = ["text"];
-var StyledButton = styled(Button$1).withConfig({
-  displayName: "SwapButton__StyledButton",
-  componentId: "sc-1ofv4rm-0"
-})(["width:100%;display:flex;justify-content:space-between;align-items:center;padding:11px 27px;border-radius:10px;background-color:rgb(43,43,56);#open-new{width:13.25px;height:13.25px;}"]);
-var DetailsContainer = styled.div.withConfig({
-  displayName: "SwapButton__DetailsContainer",
-  componentId: "sc-1ofv4rm-1"
-})(["display:flex;align-items:center;*{margin-right:10px;}"]);
+var _templateObject$1b, _templateObject2$J;
+var StyledButton = styled(Button$1)(_templateObject$1b || (_templateObject$1b = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 11px 27px;\n  border-radius: 10px;\n  // Should this color be added to theme colors?\n  background-color: rgb(43, 43, 56);\n\n  #open-new {\n    width: 13.25px;\n    height: 13.25px;\n  }\n"])));
+var DetailsContainer = styled.div(_templateObject2$J || (_templateObject2$J = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n\n  * {\n    margin-right: 10px;\n  }\n"])));
 var SwapButton = function SwapButton(_ref) {
   var _ref$text = _ref.text,
     text = _ref$text === void 0 ? "Token info page" : _ref$text,
@@ -12518,10 +12254,8 @@ var lightTheme = _objectSpread2(_objectSpread2({}, base), {}, {
   tooltip: light
 });
 
-var TableActiveDot = styled.div.withConfig({
-  displayName: "TableActiveDot",
-  componentId: "sc-1phywr3-0"
-})(["width:8px;height:8px;background:", ";border-radius:50%;margin:auto;box-shadow:", ";@media (max-width:576px){margin:0;}"], function (_ref) {
+var _templateObject$1a;
+var TableActiveDot = styled.div(_templateObject$1a || (_templateObject$1a = _taggedTemplateLiteral(["\n  width: 8px;\n  height: 8px;\n  background: ", ";\n  border-radius: 50%;\n  margin: auto;\n  box-shadow: ", ";\n  @media (max-width: 576px) {\n    margin: 0;\n  }\n"])), function (_ref) {
   var actionActive = _ref.actionActive;
   return actionActive ? "#12FFB8" : "#373749";
 }, function (_ref2) {
@@ -12529,10 +12263,8 @@ var TableActiveDot = styled.div.withConfig({
   return actionActive ? "0px 0px 14px 3px rgba(18, 255, 184, 0.17)" : "none";
 });
 
-var StyledRow = styled.div.withConfig({
-  displayName: "TableRow__StyledRow",
-  componentId: "sc-qzdbwn-0"
-})(["position:relative;width:calc(100% - 60px);height:", ";margin:", " 30px 0 30px;padding:", ";display:flex;align-items:center;justify-content:center;flex-direction:column;border-radius:", ";border:", ";border-bottom:", ";background:", ";@media (max-width:576px){min-height:59px;width:calc(100% - 16px);margin:", " 8px 0 8px;}"], function (_ref) {
+var _templateObject$19, _templateObject2$I, _templateObject3$A, _templateObject4$s, _templateObject5$q;
+var StyledRow = styled.div(_templateObject$19 || (_templateObject$19 = _taggedTemplateLiteral(["\n  position: relative;\n  width: calc(100% - 60px);\n  height: ", ";\n  margin: ", " 30px 0 30px;\n  padding: ", ";\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-direction: column;\n  border-radius: ", ";\n  border: ", ";\n  border-bottom: ", ";\n  background: ", ";\n  @media (max-width: 576px) {\n    min-height: 59px;\n    width: calc(100% - 16px);\n    margin: ", " 8px 0 8px;\n  }\n"])), function (_ref) {
   var active = _ref.active;
   return active ? "auto" : "77.5px";
 }, function (_ref2) {
@@ -12558,22 +12290,10 @@ var StyledRow = styled.div.withConfig({
   var active = _ref8.active;
   return active ? "5.5px" : "0px";
 });
-var StyledTableChildren = styled(GridLayout$1).withConfig({
-  displayName: "TableRow__StyledTableChildren",
-  componentId: "sc-qzdbwn-1"
-})(["width:100%;height:77.5px;align-items:center;justify-content:center;flex-direction:row;cursor:pointer;position:relative;"]);
-var StyledTableDetails = styled(GridLayout$1).withConfig({
-  displayName: "TableRow__StyledTableDetails",
-  componentId: "sc-qzdbwn-2"
-})(["padding:13px;width:100%;height:100%;display:flex;flex-direction:column;"]);
-var ToggleContainer = styled.div.withConfig({
-  displayName: "TableRow__ToggleContainer",
-  componentId: "sc-qzdbwn-3"
-})(["grid-column:span 1 / -1;cursor:pointer;margin-right:19px;@media (max-width:576px){position:absolute;right:0;margin-right:10px;}"]);
-var DotContainer = styled.div.withConfig({
-  displayName: "TableRow__DotContainer",
-  componentId: "sc-qzdbwn-4"
-})(["grid-column:span 1;@media (max-width:576px){margin-left:10px;}"]);
+var StyledTableChildren = styled(GridLayout$1)(_templateObject2$I || (_templateObject2$I = _taggedTemplateLiteral(["\n  width: 100%;\n  height: 77.5px;\n  align-items: center;\n  justify-content: center;\n  flex-direction: row;\n  cursor: pointer;\n  position: relative;\n"])));
+var StyledTableDetails = styled(GridLayout$1)(_templateObject3$A || (_templateObject3$A = _taggedTemplateLiteral(["\n  padding: 13px;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n"])));
+var ToggleContainer = styled.div(_templateObject4$s || (_templateObject4$s = _taggedTemplateLiteral(["\n  grid-column: span 1 / -1;\n  cursor: pointer;\n  margin-right: 19px;\n  @media (max-width: 576px) {\n    position: absolute;\n    right: 0;\n    margin-right: 10px;\n  }\n"])));
+var DotContainer = styled.div(_templateObject5$q || (_templateObject5$q = _taggedTemplateLiteral(["\n  grid-column: span 1;\n  @media (max-width: 576px) {\n    margin-left: 10px;\n  }\n"])));
 var TableRow = function TableRow(_ref9) {
   var children = _ref9.children,
     details = _ref9.details,
@@ -12611,18 +12331,10 @@ var TableRow = function TableRow(_ref9) {
   });
 };
 
-var LiquidityWrapper = styled.div.withConfig({
-  displayName: "LiquidityContainer__LiquidityWrapper",
-  componentId: "sc-wsy021-0"
-})(["padding-right:4px;width:100%;"]);
-var DescriptionRow = styled.div.withConfig({
-  displayName: "LiquidityContainer__DescriptionRow",
-  componentId: "sc-wsy021-1"
-})(["display:flex;flex-direction:row;align-items:center;"]);
-var Container$5 = styled.div.withConfig({
-  displayName: "LiquidityContainer__Container",
-  componentId: "sc-wsy021-2"
-})(["height:100%;padding:17px;display:flex;flex-direction:column;justify-content:space-between;align-items:space-around;grid-column:span ", ";border:1px solid rgba(255,255,255,0.1);border-radius:10px;svg{margin-left:0;}"], function (_ref) {
+var _templateObject$18, _templateObject2$H, _templateObject3$z;
+var LiquidityWrapper = styled.div(_templateObject$18 || (_templateObject$18 = _taggedTemplateLiteral(["\n  padding-right: 4px;\n  width: 100%;\n"])));
+var DescriptionRow = styled.div(_templateObject2$H || (_templateObject2$H = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n"])));
+var Container$5 = styled.div(_templateObject3$z || (_templateObject3$z = _taggedTemplateLiteral(["\n  height: 100%;\n  padding: 17px;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  align-items: space-around;\n  grid-column: span ", ";\n  border: 1px solid rgba(255, 255, 255, 0.1);\n  border-radius: 10px;\n  svg {\n    margin-left: 0;\n  }\n"])), function (_ref) {
   var grid = _ref.grid;
   return grid;
 });
@@ -12654,10 +12366,8 @@ var LiquidityContainer = function LiquidityContainer(_ref2) {
   });
 };
 
-var Container$4 = styled.div.withConfig({
-  displayName: "TableActionBox__Container",
-  componentId: "sc-1t71h7-0"
-})(["width:100%;padding:", ";display:flex;flex-direction:column;justify-content:space-between;align-items:space-around;grid-column:span ", ";border:", ";border-radius:10px;svg{margin-left:0;}"], function (_ref) {
+var _templateObject$17, _templateObject2$G, _templateObject3$y;
+var Container$4 = styled.div(_templateObject$17 || (_templateObject$17 = _taggedTemplateLiteral(["\n  width: 100%;\n  padding: ", ";\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  align-items: space-around;\n  grid-column: span ", ";\n  border: ", ";\n  border-radius: 10px;\n  svg {\n    margin-left: 0;\n  }\n"])), function (_ref) {
   var mobile = _ref.mobile;
   return mobile ? "0px" : "17px";
 }, function (_ref2) {
@@ -12667,17 +12377,11 @@ var Container$4 = styled.div.withConfig({
   var mobile = _ref3.mobile;
   return mobile ? "none" : "1px solid rgba(255, 255, 255, 0.1)";
 });
-var TokenValueWrapper = styled.div.withConfig({
-  displayName: "TableActionBox__TokenValueWrapper",
-  componentId: "sc-1t71h7-1"
-})(["display:flex;flex-direction:row;align-items:center;justify-content:", ";"], function (_ref4) {
+var TokenValueWrapper = styled.div(_templateObject2$G || (_templateObject2$G = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: ", ";\n"])), function (_ref4) {
   var mobile = _ref4.mobile;
   return mobile ? "flex-start" : "space-between";
 });
-var ActionsWrapper = styled.div.withConfig({
-  displayName: "TableActionBox__ActionsWrapper",
-  componentId: "sc-1t71h7-2"
-})(["display:flex;flex-direction:row;margin-top:4px;width:100%;justify-content:space-between;"]);
+var ActionsWrapper = styled.div(_templateObject3$y || (_templateObject3$y = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  margin-top: 4px;\n  width: 100%;\n  justify-content: space-between;\n"])));
 var TableActionBox = function TableActionBox(_ref5) {
   var title = _ref5.title,
     value = _ref5.value,
@@ -12737,30 +12441,15 @@ var getNumberedDifference = function getNumberedDifference(differenceToConvert)
   return 0;
 };
 
-/* eslint-disable no-nested-ternary */
-var ValueBox = styled.div.withConfig({
-  displayName: "Value__ValueBox",
-  componentId: "sc-2a5tiq-0"
-})(["background:transparent;color:white;display:flex;flex-direction:row;justify-content:flex-start;align-items:flex-start;max-width:190px;"]);
-var IconColumn = styled.div.withConfig({
-  displayName: "Value__IconColumn",
-  componentId: "sc-2a5tiq-1"
-})(["width:auto;padding-right:10px;padding-top:1px;"]);
-var InfoColumn = styled.div.withConfig({
-  displayName: "Value__InfoColumn",
-  componentId: "sc-2a5tiq-2"
-})(["display:flex;flex-direction:column;"]);
-var PairContainer = styled.div.withConfig({
-  displayName: "Value__PairContainer",
-  componentId: "sc-2a5tiq-3"
-})(["width:100%;display:flex;margin-bottom:5px;align-items:center;flex-direction:", ";"], function (_ref) {
+var _templateObject$16, _templateObject2$F, _templateObject3$x, _templateObject4$r, _templateObject5$p;
+var ValueBox = styled.div(_templateObject$16 || (_templateObject$16 = _taggedTemplateLiteral(["\n  background: transparent;\n  color: white;\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-start;\n  align-items: flex-start;\n  max-width: 190px;\n"])));
+var IconColumn = styled.div(_templateObject2$F || (_templateObject2$F = _taggedTemplateLiteral(["\n  width: auto;\n  padding-right: 10px;\n  padding-top: 1px;\n"])));
+var InfoColumn = styled.div(_templateObject3$x || (_templateObject3$x = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n"])));
+var PairContainer = styled.div(_templateObject4$r || (_templateObject4$r = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  margin-bottom: 5px;\n  align-items: center;\n  flex-direction: ", ";\n"])), function (_ref) {
   var mobile = _ref.mobile;
   return mobile ? "column" : "row";
 });
-var ValueRow = styled.div.withConfig({
-  displayName: "Value__ValueRow",
-  componentId: "sc-2a5tiq-4"
-})(["width:100%;"]);
+var ValueRow = styled.div(_templateObject5$p || (_templateObject5$p = _taggedTemplateLiteral(["\n  width: 100%;\n"])));
 var Value = function Value(_ref2) {
   var coin = _ref2.coin,
     value = _ref2.value,
@@ -12814,14 +12503,9 @@ var Value = function Value(_ref2) {
   });
 };
 
-var ValueFullBox = styled.div.withConfig({
-  displayName: "ValueFull__ValueFullBox",
-  componentId: "sc-ig82wo-0"
-})(["background:transparent;color:white;display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;width:100%;"]);
-var DifferenceBox = styled.div.withConfig({
-  displayName: "ValueFull__DifferenceBox",
-  componentId: "sc-ig82wo-1"
-})(["display:flex;justify-content:flex-start;align-items:center;height:24px;"]);
+var _templateObject$15, _templateObject2$E;
+var ValueFullBox = styled.div(_templateObject$15 || (_templateObject$15 = _taggedTemplateLiteral(["\n  background: transparent;\n  color: white;\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: flex-start;\n  width: 100%;\n"])));
+var DifferenceBox = styled.div(_templateObject2$E || (_templateObject2$E = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n  height: 24px;\n"])));
 var ValueFull = function ValueFull(_ref) {
   var value = _ref.value,
     difference = _ref.difference;
@@ -12852,10 +12536,8 @@ var ValueFull = function ValueFull(_ref) {
   });
 };
 
-var VContainer = styled.div.withConfig({
-  displayName: "VersionContainer__VContainer",
-  componentId: "sc-o09b6h-0"
-})(["position:absolute;right:20px;bottom:20px;color:", ";opacity:0.6;font-size:12px;"], function (_ref) {
+var _templateObject$14;
+var VContainer = styled.div(_templateObject$14 || (_templateObject$14 = _taggedTemplateLiteral(["\n  position: absolute;\n  right: 20px;\n  bottom: 20px;\n  color: ", ";\n  opacity: 0.6;\n  font-size: 12px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.secondaryText;
 });
@@ -12866,44 +12548,24 @@ var VersionContainer = function VersionContainer(_ref2) {
   });
 };
 
-var ProgressDataColumn = styled.div.withConfig({
-  displayName: "SpacePadProgressBar__ProgressDataColumn",
-  componentId: "sc-ri8846-0"
-})(["display:flex;flex-direction:column;width:100%;height:100%;"]);
-var ProgressDataRow = styled.div.withConfig({
-  displayName: "SpacePadProgressBar__ProgressDataRow",
-  componentId: "sc-ri8846-1"
-})(["display:flex;flex-direction:row;align-items:center;justify-content:space-between;"]);
-var ProgressBarWrapper = styled.div.withConfig({
-  displayName: "SpacePadProgressBar__ProgressBarWrapper",
-  componentId: "sc-ri8846-2"
-})(["position:relative;width:100%;height:8px;background:#272730;display:flex;justify-content:flex-start;align-items:center;border-radius:4px;box-sizing:border-box;"]);
-var ProgressBar = styled.div.withConfig({
-  displayName: "SpacePadProgressBar__ProgressBar",
-  componentId: "sc-ri8846-3"
-})(["position:relative;height:100%;width:", "%;background:", ";border-radius:4px;"], function (_ref) {
+var _templateObject$13, _templateObject2$D, _templateObject3$w, _templateObject4$q, _templateObject5$o, _templateObject6$h, _templateObject7$d;
+var ProgressDataColumn = styled.div(_templateObject$13 || (_templateObject$13 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  height: 100%;\n"])));
+var ProgressDataRow = styled.div(_templateObject2$D || (_templateObject2$D = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n"])));
+var ProgressBarWrapper = styled.div(_templateObject3$w || (_templateObject3$w = _taggedTemplateLiteral(["\n  position: relative;\n  width: 100%;\n  height: 8px;\n  background: #272730;\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n  border-radius: 4px;\n  box-sizing: border-box;\n"])));
+var ProgressBar = styled.div(_templateObject4$q || (_templateObject4$q = _taggedTemplateLiteral(["\n  position: relative;\n  height: 100%;\n  width: ", "%;\n  background: ", ";\n  border-radius: 4px;\n"])), function (_ref) {
   var width = _ref.width;
   return width;
 }, function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.primary;
 });
-var ProgressDescription = styled(Text).withConfig({
-  displayName: "SpacePadProgressBar__ProgressDescription",
-  componentId: "sc-ri8846-4"
-})(["font-weight:600;font-size:18px;line-height:170%;color:", ";margin-bottom:8px;"], function (_ref3) {
+var ProgressDescription = styled(Text)(_templateObject5$o || (_templateObject5$o = _taggedTemplateLiteral(["\n  font-weight: 600;\n  font-size: 18px;\n  line-height: 170%;\n  color: ", ";\n  margin-bottom: 8px;\n"])), function (_ref3) {
   var theme = _ref3.theme,
     color = _ref3.color;
   return color || theme.colors.white;
 });
-var CapDescription = styled(Text).withConfig({
-  displayName: "SpacePadProgressBar__CapDescription",
-  componentId: "sc-ri8846-5"
-})(["font-weight:bold;font-size:14px;line-height:170%;color:#818c92;margin-top:4px;"]);
-var StyledCapRow = styled.div.withConfig({
-  displayName: "SpacePadProgressBar__StyledCapRow",
-  componentId: "sc-ri8846-6"
-})(["display:flex;"]);
+var CapDescription = styled(Text)(_templateObject6$h || (_templateObject6$h = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 14px;\n  line-height: 170%;\n  color: #818c92;\n  margin-top: 4px;\n"])));
+var StyledCapRow = styled.div(_templateObject7$d || (_templateObject7$d = _taggedTemplateLiteral(["\n  display: flex;\n"])));
 var SpacePadProgressBar = function SpacePadProgressBar(_ref4) {
   var _ref4$currentCap = _ref4.currentCap,
     currentCap = _ref4$currentCap === void 0 ? 70 : _ref4$currentCap,
@@ -12947,38 +12609,24 @@ var SpacePadProgressBar = function SpacePadProgressBar(_ref4) {
   });
 };
 
-var MainWrapper$1 = styled.div.withConfig({
-  displayName: "SpaceProjectName__MainWrapper",
-  componentId: "sc-1lzbjkk-0"
-})(["display:flex;height:94px;justify-content:flex-start;align-items:center;flex-direction:row;"]);
-var ProjectImage = styled.div.withConfig({
-  displayName: "SpaceProjectName__ProjectImage",
-  componentId: "sc-1lzbjkk-1"
-})(["display:flex;width:46px;height:46px;margin-right:34px;border-radius:50%;justify-content:center;align-items:center;", "{margin-right:12px;}"], function (_ref) {
+var _templateObject$12, _templateObject2$C, _templateObject3$v, _templateObject4$p, _templateObject5$n;
+var MainWrapper$1 = styled.div(_templateObject$12 || (_templateObject$12 = _taggedTemplateLiteral(["\n  display: flex;\n  height: 94px;\n  justify-content: flex-start;\n  align-items: center;\n  flex-direction: row;\n"])));
+var ProjectImage = styled.div(_templateObject2$C || (_templateObject2$C = _taggedTemplateLiteral(["\n  display: flex;\n  width: 46px;\n  height: 46px;\n  margin-right: 34px;\n  border-radius: 50%;\n  justify-content: center;\n  align-items: center;\n  ", " {\n    margin-right: 12px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.mobile;
 });
-var ProjectName$1 = styled.div.withConfig({
-  displayName: "SpaceProjectName__ProjectName",
-  componentId: "sc-1lzbjkk-2"
-})(["display:flex;margin-right:8px;justify-content:center;align-items:flex-end;font-size:26px;font-weight:bold;color:", ";", "{margin-bottom:6px;}"], function (_ref2) {
+var ProjectName$1 = styled.div(_templateObject3$v || (_templateObject3$v = _taggedTemplateLiteral(["\n  display: flex;\n  margin-right: 8px;\n  justify-content: center;\n  align-items: flex-end;\n  font-size: 26px;\n  font-weight: bold;\n  color: ", ";\n  ", " {\n    margin-bottom: 6px;\n  }\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.white;
 }, function (_ref3) {
   var theme = _ref3.theme;
   return theme.mediaQueries.mobile;
 });
-var ProjectFullName = styled.div.withConfig({
-  displayName: "SpaceProjectName__ProjectFullName",
-  componentId: "sc-1lzbjkk-3"
-})(["display:flex;align-items:flex-end;justify-content:center;color:", ";letter-spacing:0.03rem;font-size:14px;"], function (_ref4) {
+var ProjectFullName = styled.div(_templateObject4$p || (_templateObject4$p = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: flex-end;\n  justify-content: center;\n  color: ", ";\n  letter-spacing: 0.03rem;\n  font-size: 14px;\n"])), function (_ref4) {
   var theme = _ref4.theme;
   return theme.colors.white55;
 });
-var ProjectDetails = styled.div.withConfig({
-  displayName: "SpaceProjectName__ProjectDetails",
-  componentId: "sc-1lzbjkk-4"
-})(["display:flex;align-items:flex-end;justify-content:flex-start;", "{flex-direction:column;align-items:flex-start;}"], function (_ref5) {
+var ProjectDetails = styled.div(_templateObject5$n || (_templateObject5$n = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: flex-end;\n  justify-content: flex-start;\n  ", " {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n"])), function (_ref5) {
   var theme = _ref5.theme;
   return theme.mediaQueries.mobile;
 });
@@ -13352,15 +13000,11 @@ var connectors = [{
 }];
 var connectorLocalStorageKey = "connectorId";
 
-var AccountNumber = styled(Text).withConfig({
-  displayName: "AccountNumber",
-  componentId: "sc-1jw25yf-0"
-})(["color:#818c92;line-height:23.8px;"]);
+var _templateObject$11;
+var AccountNumber = styled(Text)(_templateObject$11 || (_templateObject$11 = _taggedTemplateLiteral(["\n  color: #818c92;\n  line-height: 23.8px;\n"])));
 
-var AccountNumberWrapper = styled.div.withConfig({
-  displayName: "AccountNumberWrapper",
-  componentId: "sc-1bz6nuv-0"
-})(["display:flex;flex-direction:", ";align-items:center;justify-content:center;text-align:", ";"], function (_ref) {
+var _templateObject$10;
+var AccountNumberWrapper = styled.div(_templateObject$10 || (_templateObject$10 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: ", ";\n  align-items: center;\n  justify-content: center;\n  text-align: ", ";\n"])), function (_ref) {
   var isVerifiedUser = _ref.isVerifiedUser;
   return !isVerifiedUser ? "column" : "row";
 }, function (_ref2) {
@@ -13368,85 +13012,57 @@ var AccountNumberWrapper = styled.div.withConfig({
   return textAlign && textAlign;
 });
 
-var Background = styled.div.withConfig({
-  displayName: "Background",
-  componentId: "sc-s9bf1w-0"
-})(["position:absolute;width:100vw;height:100vh;background-color:black;opacity:0.4;left:0;top:0;z-index:11;"]);
+var _templateObject$$;
+var Background = styled.div(_templateObject$$ || (_templateObject$$ = _taggedTemplateLiteral(["\n  position: absolute;\n  width: 100vw;\n  height: 100vh;\n  background-color: black;\n  opacity: 0.4;\n  left: 0;\n  top: 0;\n  z-index: 11;\n"])));
 
-var BottomRow = styled.div.withConfig({
-  displayName: "BottomRow",
-  componentId: "sc-1elsl0s-0"
-})(["padding-top:20px;"]);
+var _templateObject$_;
+var BottomRow = styled.div(_templateObject$_ || (_templateObject$_ = _taggedTemplateLiteral(["\n  padding-top: 20px;\n"])));
 
-styled(Button$1).withConfig({
-  displayName: "ChangeProviderButton",
-  componentId: "sc-w1eu8g-0"
-})(["background:#383847;color:", ";width:85px;height:32px;font-size:14px;"], function (_ref) {
+var _templateObject$Z;
+styled(Button$1)(_templateObject$Z || (_templateObject$Z = _taggedTemplateLiteral(["\n  background: #383847;\n  color: ", ";\n  width: 85px;\n  height: 32px;\n  font-size: 14px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.white;
 });
 
-var CloseButton = styled(Icon$2m).withConfig({
-  displayName: "CloseButton",
-  componentId: "sc-1afnq0v-0"
-})(["width:24px;height:24px;border-radius:50%;cursor:pointer;background:#383847;position:absolute;left:-35px;top:5px;"]);
-
-var ConnectedInfoWrapper = styled.div.withConfig({
-  displayName: "ConnectedInfoWrapper",
-  componentId: "sc-lxc0i5-0"
-})(["display:flex;align-items:center;justify-content:space-between;margin-top:16px;"]);
-
-var ConnectedProvider = styled.div.withConfig({
-  displayName: "ConnectedProvider",
-  componentId: "sc-1satccs-0"
-})(["height:72px;width:309px;margin-top:24px;display:flex;align-items:center;padding-left:32px;border-radius:10px;background:#272730;"]);
-
-var fadeInAnimation = keyframes(["0%{right:-357px;}100%{right:0;}"]);
-var ConnectWalletWrapper = styled.div.withConfig({
-  displayName: "ConnectWalletWrapper",
-  componentId: "sc-1oauz4x-0"
-})(["display:flex;flex-direction:column;width:357px;height:100vh;padding:24px;background:#191921;position:fixed;top:0%;right:0;animation:", " 0.4s;z-index:20;"], fadeInAnimation);
-
-var LogoutButton = styled(Button$1).withConfig({
-  displayName: "LogoutButton",
-  componentId: "sc-ljmmm0-0"
-})(["display:flex;align-items:center;justify-content:center;background:#383847;color:", ";width:100%;font-weight:700;font-size:14px;"], function (_ref) {
+var _templateObject$Y;
+var CloseButton = styled(Icon$2m)(_templateObject$Y || (_templateObject$Y = _taggedTemplateLiteral(["\n  width: 24px;\n  height: 24px;\n  border-radius: 50%;\n  cursor: pointer;\n  background: #383847;\n  position: absolute;\n  left: -35px;\n  top: 5px;\n"])));
+
+var _templateObject$X;
+var ConnectedInfoWrapper = styled.div(_templateObject$X || (_templateObject$X = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-top: 16px;\n"])));
+
+var _templateObject$W;
+var ConnectedProvider = styled.div(_templateObject$W || (_templateObject$W = _taggedTemplateLiteral(["\n  height: 72px;\n  width: 309px;\n  margin-top: 24px;\n  display: flex;\n  align-items: center;\n  padding-left: 32px;\n  border-radius: 10px;\n  background: #272730;\n"])));
+
+var _templateObject$V, _templateObject2$B;
+var fadeInAnimation = keyframes(_templateObject$V || (_templateObject$V = _taggedTemplateLiteral(["\n  0% {\n    right: -357px;\n  }\n  100% {\n    right: 0;\n  }\n"])));
+var ConnectWalletWrapper = styled.div(_templateObject2$B || (_templateObject2$B = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  width: 357px;\n  height: 100vh;\n  padding: 24px;\n  background: #191921;\n  position: fixed;\n  top: 0%;\n  right: 0;\n  animation: ", " 0.4s;\n  z-index: 20;\n"])), fadeInAnimation);
+
+var _templateObject$U;
+var LogoutButton = styled(Button$1)(_templateObject$U || (_templateObject$U = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: #383847;\n  color: ", ";\n  width: 100%;\n  font-weight: 700;\n  font-size: 14px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.white;
 });
 
-var MiddleRow = styled.div.withConfig({
-  displayName: "MiddleRow",
-  componentId: "sc-deagnw-0"
-})(["padding:20px 0;border-bottom:1px solid #252530;"]);
-
-var MyWallet = styled(Text).withConfig({
-  displayName: "MyWallet",
-  componentId: "sc-17gxhjg-0"
-})(["line-height:28px;margin-left:18px;"]);
-
-var MyWalletWrapper = styled.div.withConfig({
-  displayName: "MyWalletWrapper",
-  componentId: "sc-126mq9l-0"
-})(["display:flex;align-items:center;"]);
-
-var ProviderTitle = styled(Text).withConfig({
-  displayName: "ProviderTitle",
-  componentId: "sc-cz48yj-0"
-})(["font-weight:600;line-height:24px;margin-left:16px;"]);
-
-var SettingsButton = styled(Button$1).withConfig({
-  displayName: "SettingsButton",
-  componentId: "sc-zhm3ih-0"
-})(["display:flex;align-items:center;justify-content:center;background:#383847;color:", ";width:100%;font-weight:700;font-size:14px;margin-bottom:16px;"], function (_ref) {
+var _templateObject$T;
+var MiddleRow = styled.div(_templateObject$T || (_templateObject$T = _taggedTemplateLiteral(["\n  padding: 20px 0;\n  border-bottom: 1px solid #252530;\n"])));
+
+var _templateObject$S;
+var MyWallet = styled(Text)(_templateObject$S || (_templateObject$S = _taggedTemplateLiteral(["\n  line-height: 28px;\n  margin-left: 18px;\n"])));
+
+var _templateObject$R;
+var MyWalletWrapper = styled.div(_templateObject$R || (_templateObject$R = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n"])));
+
+var _templateObject$Q;
+var ProviderTitle = styled(Text)(_templateObject$Q || (_templateObject$Q = _taggedTemplateLiteral(["\n  font-weight: 600;\n  line-height: 24px;\n  margin-left: 16px;\n"])));
+
+var _templateObject$P;
+var SettingsButton = styled(Button$1)(_templateObject$P || (_templateObject$P = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: #383847;\n  color: ", ";\n  width: 100%;\n  font-weight: 700;\n  font-size: 14px;\n  margin-bottom: 16px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.white;
 });
 
-var UpperRow = styled.div.withConfig({
-  displayName: "UpperRow",
-  componentId: "sc-zlngw8-0"
-})(["width:100%;height:54px;display:flex;align-items:", ";justify-content:", ";border-bottom:1px solid #252530;position:relative;padding-bottom:20px;"], function (_ref) {
+var _templateObject$O;
+var UpperRow = styled.div(_templateObject$O || (_templateObject$O = _taggedTemplateLiteral(["\n  width: 100%;\n  height: 54px;\n  display: flex;\n  align-items: ", ";\n  justify-content: ", ";\n  border-bottom: 1px solid #252530;\n  position: relative;\n  padding-bottom: 20px;\n"])), function (_ref) {
   var alignItems = _ref.alignItems;
   return alignItems && alignItems;
 }, function (_ref2) {
@@ -13454,26 +13070,20 @@ var UpperRow = styled.div.withConfig({
   return justifyContent && justifyContent;
 });
 
-var VerificationInfo = styled.div.withConfig({
-  displayName: "VerificationInfo",
-  componentId: "sc-1jviz6b-0"
-})(["display:flex;align-items:center;justify-content:space-between;margin-top:", ";"], function (_ref) {
+var _templateObject$N;
+var VerificationInfo = styled.div(_templateObject$N || (_templateObject$N = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-top: ", ";\n"])), function (_ref) {
   var marginTop = _ref.marginTop;
   return marginTop && marginTop;
 });
 
-var VerifiedWalletIcon = styled(Icon$28).withConfig({
-  displayName: "VerifiedWalletIcon",
-  componentId: "sc-1l4uhr0-0"
-})(["fill:", ";margin-right:8px;"], function (_ref) {
+var _templateObject$M;
+var VerifiedWalletIcon = styled(Icon$28)(_templateObject$M || (_templateObject$M = _taggedTemplateLiteral(["\n  fill: ", ";\n  margin-right: 8px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.vividBlue;
 });
 
-var Provider = styled.div.withConfig({
-  displayName: "ProviderRow__Provider",
-  componentId: "sc-ipxejr-0"
-})(["height:72px;width:309px;display:flex;align-items:center;padding-left:32px;border-radius:10px;background:", ";margin-bottom:", ";border:1px solid transparent;&:hover{border:", ";cursor:pointer;}"], function (_ref) {
+var _templateObject$L;
+var Provider = styled.div(_templateObject$L || (_templateObject$L = _taggedTemplateLiteral(["\n  height: 72px;\n  width: 309px;\n  display: flex;\n  align-items: center;\n  padding-left: 32px;\n  border-radius: 10px;\n  background: ", ";\n  margin-bottom: ", ";\n  border: 1px solid transparent;\n\n  &:hover {\n    border: ", ";\n    cursor: pointer;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.backgrounds.secondary;
 }, function (_ref2) {
@@ -13528,10 +13138,8 @@ var Icon$F = function Icon(props) {
   }));
 };
 
-var ConnectDescription = styled(Text).withConfig({
-  displayName: "ConnectWallet__ConnectDescription",
-  componentId: "sc-mzj27o-0"
-})(["line-height:24px;font-weight:400;color:#818c92;margin:16px 0;"]);
+var _templateObject$K;
+var ConnectDescription = styled(Text)(_templateObject$K || (_templateObject$K = _taggedTemplateLiteral(["\n  line-height: 24px;\n  font-weight: 400;\n  color: #818c92;\n  margin: 16px 0;\n"])));
 var ConnectWallet$1 = function ConnectWallet(_ref) {
   var handleLogin = _ref.handleLogin,
     setIsConnectWalletPanelOpen = _ref.setIsConnectWalletPanelOpen,
@@ -13577,21 +13185,13 @@ var ConnectWallet$1 = function ConnectWallet(_ref) {
   });
 };
 
-var VerifyAddressIndicator$1 = styled(Text).withConfig({
-  displayName: "VerifyWallet__VerifyAddressIndicator",
-  componentId: "sc-ooxgfj-0"
-})(["color:", ";line-height:20.4px;"], function (_ref) {
+var _templateObject$J, _templateObject2$A, _templateObject3$u;
+var VerifyAddressIndicator$1 = styled(Text)(_templateObject$J || (_templateObject$J = _taggedTemplateLiteral(["\n  color: ", ";\n  line-height: 20.4px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.red;
 });
-var ConnectedInfo = styled(Text).withConfig({
-  displayName: "VerifyWallet__ConnectedInfo",
-  componentId: "sc-ooxgfj-1"
-})(["color:#818c92;"]);
-var VerifyButton = styled(Button$1).withConfig({
-  displayName: "VerifyWallet__VerifyButton",
-  componentId: "sc-ooxgfj-2"
-})(["font-size:14px;width:100%;margin:24px 0;"]);
+var ConnectedInfo = styled(Text)(_templateObject2$A || (_templateObject2$A = _taggedTemplateLiteral(["\n  color: #818c92;\n"])));
+var VerifyButton = styled(Button$1)(_templateObject3$u || (_templateObject3$u = _taggedTemplateLiteral(["\n  font-size: 14px;\n  width: 100%;\n  margin: 24px 0;\n"])));
 var ConnectWallet = function ConnectWallet(_ref2) {
   var account = _ref2.account,
     setIsConnectWalletPanelOpen = _ref2.setIsConnectWalletPanelOpen;
@@ -14025,88 +13625,44 @@ var getTimeValue = function getTimeValue(value, timeUnit) {
   return "".concat(value).concat(timeUnit);
 };
 
-var ActiveDot$1 = styled.div.withConfig({
-  displayName: "SpacePadComponents__ActiveDot",
-  componentId: "sc-1kin2xe-0"
-})(["height:8px;width:8px;border-radius:50%;background:", ";margin-right:8px;", ""], function (_ref) {
+var _templateObject$I, _templateObject2$z, _templateObject3$t, _templateObject4$o, _templateObject5$m, _templateObject6$g, _templateObject7$c, _templateObject8$9, _templateObject9$8, _templateObject0$6, _templateObject1$6, _templateObject10$5, _templateObject11$5, _templateObject12$4, _templateObject13$2;
+var ActiveDot$1 = styled.div(_templateObject$I || (_templateObject$I = _taggedTemplateLiteral(["\n  height: 8px;\n  width: 8px;\n  border-radius: 50%;\n  background: ", ";\n  margin-right: 8px;\n  ", "\n"])), function (_ref) {
   var dotColor = _ref.dotColor;
   return dotColor;
 }, function (_ref2) {
   var fetchingData = _ref2.fetchingData;
   return fetchingData && "\n    transition: all 0.25s ease-in-out;\n    animation: stretch 2s infinite;\n    @keyframes stretch {\n      0% {\n        transform: scale(1);\n      }\n      25% {\n        transform: scale(0.9);\n      }\n      50% {\n        transform: scale(1.2);\n      }\n      75% {\n        transform: scale(0.9);\n      }\n      100% {\n        transform: scale(1);\n      }\n    }\n  ";
 });
-var ActivityDescription = styled(Text).withConfig({
-  displayName: "SpacePadComponents__ActivityDescription",
-  componentId: "sc-1kin2xe-1"
-})(["font-weight:bold;font-size:14px;line-height:140%;width:max-content;"]);
-var ActivityWrapper = styled.div.withConfig({
-  displayName: "SpacePadComponents__ActivityWrapper",
-  componentId: "sc-1kin2xe-2"
-})(["display:flex;position:absolute;right:15px;top:15px;"]);
-var ActivityComponent = styled.div.withConfig({
-  displayName: "SpacePadComponents__ActivityComponent",
-  componentId: "sc-1kin2xe-3"
-})(["display:flex;align-items:center;justify-content:space-between;padding:4px 8px;width:max-content;height:28px;background:rgba(55,55,73,0.5);backdrop-filter:blur(53px);border-radius:10px;margin-left:8px;"]);
-var ProjectNameColumn = styled.div.withConfig({
-  displayName: "SpacePadComponents__ProjectNameColumn",
-  componentId: "sc-1kin2xe-4"
-})(["display:flex;flex-direction:column;justify-content:center;align-items:flex-start;"]);
-var ProjectName = styled(Text).withConfig({
-  displayName: "SpacePadComponents__ProjectName",
-  componentId: "sc-1kin2xe-5"
-})(["font-weight:bold;font-size:32px;line-height:130%;", "{font-size:24px;}"], function (_ref3) {
+var ActivityDescription = styled(Text)(_templateObject2$z || (_templateObject2$z = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 14px;\n  line-height: 140%;\n  width: max-content;\n"])));
+var ActivityWrapper = styled.div(_templateObject3$t || (_templateObject3$t = _taggedTemplateLiteral(["\n  display: flex;\n  position: absolute;\n  right: 15px;\n  top: 15px;\n"])));
+var ActivityComponent = styled.div(_templateObject4$o || (_templateObject4$o = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 4px 8px;\n  width: max-content;\n  height: 28px;\n  background: rgba(55, 55, 73, 0.5);\n  backdrop-filter: blur(53px);\n  border-radius: 10px;\n  margin-left: 8px;\n"])));
+var ProjectNameColumn = styled.div(_templateObject5$m || (_templateObject5$m = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: flex-start;\n"])));
+var ProjectName = styled(Text)(_templateObject6$g || (_templateObject6$g = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 32px;\n  line-height: 130%;\n  ", " {\n    font-size: 24px;\n  }\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.mediaQueries.mobile;
 });
-var ProjectTicker = styled(Text).withConfig({
-  displayName: "SpacePadComponents__ProjectTicker",
-  componentId: "sc-1kin2xe-6"
-})(["font-size:14px;line-height:170%;text-align:right;letter-spacing:0.03em;font-weight:bold;color:#535459;", ";"], function (_ref4) {
+var ProjectTicker = styled(Text)(_templateObject7$c || (_templateObject7$c = _taggedTemplateLiteral(["\n  font-size: 14px;\n  line-height: 170%;\n  text-align: right;\n  letter-spacing: 0.03em;\n  font-weight: bold;\n  color: #535459;\n  ", ";\n"])), function (_ref4) {
   var customStyle = _ref4.customStyle;
   return customStyle;
 });
-var TimerDescription = styled(Text).withConfig({
-  displayName: "SpacePadComponents__TimerDescription",
-  componentId: "sc-1kin2xe-7"
-})(["font-weight:bold;font-size:14px;line-height:170%;color:#818c92;"]);
-var Timer = styled(Text).withConfig({
-  displayName: "SpacePadComponents__Timer",
-  componentId: "sc-1kin2xe-8"
-})(["font-weight:bold;font-size:32px;line-height:130%;color:", ";", "{font-size:24px;}"], function (_ref5) {
+var TimerDescription = styled(Text)(_templateObject8$9 || (_templateObject8$9 = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 14px;\n  line-height: 170%;\n  color: #818c92;\n"])));
+var Timer = styled(Text)(_templateObject9$8 || (_templateObject9$8 = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 32px;\n  line-height: 130%;\n  color: ", ";\n  ", " {\n    font-size: 24px;\n  }\n"])), function (_ref5) {
   var isIncoming = _ref5.isIncoming;
   return isIncoming ? "#FF7342" : "#12ffb8";
 }, function (_ref6) {
   var theme = _ref6.theme;
   return theme.mediaQueries.mobile;
 });
-var RatioColumn = styled.div.withConfig({
-  displayName: "SpacePadComponents__RatioColumn",
-  componentId: "sc-1kin2xe-9"
-})(["display:flex;flex-direction:column;align-items:flex-end;"]);
-var DetailsRow = styled.div.withConfig({
-  displayName: "SpacePadComponents__DetailsRow",
-  componentId: "sc-1kin2xe-10"
-})(["display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between;width:100%;"]);
+var RatioColumn = styled.div(_templateObject0$6 || (_templateObject0$6 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n"])));
+var DetailsRow = styled.div(_templateObject1$6 || (_templateObject1$6 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: flex-start;\n  justify-content: space-between;\n  width: 100%;\n"])));
 // Details components
-var SpaceInfoTableWrapper = styled.div.withConfig({
-  displayName: "SpacePadComponents__SpaceInfoTableWrapper",
-  componentId: "sc-1kin2xe-11"
-})(["display:flex;flex-direction:column;width:100%;"]);
-var SpaceInfoTableRow = styled.div.withConfig({
-  displayName: "SpacePadComponents__SpaceInfoTableRow",
-  componentId: "sc-1kin2xe-12"
-})(["display:flex;align-items:flex-start;justify-content:space-between;padding:11px 0px;border-bottom:", ";"], function (_ref7) {
+var SpaceInfoTableWrapper = styled.div(_templateObject10$5 || (_templateObject10$5 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n"])));
+var SpaceInfoTableRow = styled.div(_templateObject11$5 || (_templateObject11$5 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  padding: 11px 0px;\n  border-bottom: ", ";\n"])), function (_ref7) {
   var underlined = _ref7.underlined;
   return underlined && "1px solid #272730";
 });
-var RowTitle = styled(Text).withConfig({
-  displayName: "SpacePadComponents__RowTitle",
-  componentId: "sc-1kin2xe-13"
-})(["font-weight:bold;font-size:14px;line-height:170%;color:#818c92;"]);
-var RowValue = styled(Text).withConfig({
-  displayName: "SpacePadComponents__RowValue",
-  componentId: "sc-1kin2xe-14"
-})(["display:flex;flex-direction:column;font-weight:600;font-size:16px;line-height:24px;color:#ffffff;"]);
+var RowTitle = styled(Text)(_templateObject12$4 || (_templateObject12$4 = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 14px;\n  line-height: 170%;\n  color: #818c92;\n"])));
+var RowValue = styled(Text)(_templateObject13$2 || (_templateObject13$2 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  font-weight: 600;\n  font-size: 16px;\n  line-height: 24px;\n  color: #ffffff;\n"])));
 var SpacePadInfoRow = function SpacePadInfoRow(props) {
   var title = props.title,
     value = props.value,
@@ -14228,65 +13784,33 @@ var getPreciseRatio = function getPreciseRatio(ratio) {
   return ratio.toString();
 };
 
-var SpacePadProjectDetailsWrapper = styled.div.withConfig({
-  displayName: "SpacePadProjectDetails__SpacePadProjectDetailsWrapper",
-  componentId: "sc-18f4woi-0"
-})(["display:flex;flex-direction:column;"]);
-var StyledDetailsHeader = styled.div.withConfig({
-  displayName: "SpacePadProjectDetails__StyledDetailsHeader",
-  componentId: "sc-18f4woi-1"
-})(["display:flex;flex-direction:row;align-items:center;justify-content:space-between;width:100%;margin-bottom:32px;", "{flex-direction:column-reverse;align-items:flex-start;justify-content:space-between;margin-bottom:16px;}"], function (_ref) {
+var _templateObject$H, _templateObject2$y, _templateObject3$s, _templateObject4$n, _templateObject5$l, _templateObject6$f, _templateObject7$b, _templateObject8$8, _templateObject9$7, _templateObject0$5, _templateObject1$5;
+var SpacePadProjectDetailsWrapper = styled.div(_templateObject$H || (_templateObject$H = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n"])));
+var StyledDetailsHeader = styled.div(_templateObject2$y || (_templateObject2$y = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  margin-bottom: 32px;\n  ", " {\n    flex-direction: column-reverse;\n    align-items: flex-start;\n    justify-content: space-between;\n    margin-bottom: 16px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.mobile;
 });
-var StyledDetails = styled.div.withConfig({
-  displayName: "SpacePadProjectDetails__StyledDetails",
-  componentId: "sc-18f4woi-2"
-})(["display:grid;grid-template-columns:repeat(2,1fr);grid-gap:32px;height:max-content;", "{display:flex;flex-direction:column;}"], function (_ref2) {
+var StyledDetails = styled.div(_templateObject3$s || (_templateObject3$s = _taggedTemplateLiteral(["\n  display: grid;\n  grid-template-columns: repeat(2, 1fr);\n  grid-gap: 32px;\n  height: max-content;\n  ", " {\n    display: flex;\n    flex-direction: column;\n  }\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.mediaQueries.mobile;
 });
-var ProjectLogo$1 = styled.div.withConfig({
-  displayName: "SpacePadProjectDetails__ProjectLogo",
-  componentId: "sc-18f4woi-3"
-})(["display:flex;justify-content:center;align-items:center;width:80px;height:80px;border-radius:50%;background:#16161d;background-image:", ";background-position:center;background-repeat:no-repeat;background-size:cover;border:3px solid #373749;overflow:hidden;margin-right:16px;"], function (_ref3) {
+var ProjectLogo$1 = styled.div(_templateObject4$n || (_templateObject4$n = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 80px;\n  height: 80px;\n  border-radius: 50%;\n  background: #16161d;\n  background-image: ", ";\n  background-position: center; /* Center the image */\n  background-repeat: no-repeat; /* Do not repeat the image */\n  background-size: cover;\n  border: 3px solid #373749;\n  overflow: hidden;\n  margin-right: 16px;\n"])), function (_ref3) {
   var background = _ref3.background;
   return background;
 });
-var TimerWrapper = styled.div.withConfig({
-  displayName: "SpacePadProjectDetails__TimerWrapper",
-  componentId: "sc-18f4woi-4"
-})(["position:relative;display:flex;flex-direction:row;align-items:center;", "{flex-direction:column;align-items:flex-start;margin-bottom:44px;}"], function (_ref4) {
+var TimerWrapper = styled.div(_templateObject5$l || (_templateObject5$l = _taggedTemplateLiteral(["\n  position: relative;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  ", " {\n    flex-direction: column;\n    align-items: flex-start;\n    margin-bottom: 44px;\n  }\n"])), function (_ref4) {
   var theme = _ref4.theme;
   return theme.mediaQueries.mobile;
 });
-var ProjectNameData = styled.div.withConfig({
-  displayName: "SpacePadProjectDetails__ProjectNameData",
-  componentId: "sc-18f4woi-5"
-})(["display:inline-flex;"]);
-var DetailsPoster = styled.div.withConfig({
-  displayName: "SpacePadProjectDetails__DetailsPoster",
-  componentId: "sc-18f4woi-6"
-})(["height:200px;width:100%;position:relative;background:#16161d;background-image:", ";background-position:center;background-repeat:no-repeat;background-size:cover;border-radius:16px;"], function (_ref5) {
+var ProjectNameData = styled.div(_templateObject6$f || (_templateObject6$f = _taggedTemplateLiteral(["\n  display: inline-flex;\n"])));
+var DetailsPoster = styled.div(_templateObject7$b || (_templateObject7$b = _taggedTemplateLiteral(["\n  height: 200px;\n  width: 100%;\n  position: relative;\n  background: #16161d;\n  background-image: ", ";\n  background-position: center; /* Center the image */\n  background-repeat: no-repeat; /* Do not repeat the image */\n  background-size: cover;\n  border-radius: 16px;\n"])), function (_ref5) {
   var background = _ref5.background;
   return background;
 });
-var StyledDetailsDescriptionColumn = styled.div.withConfig({
-  displayName: "SpacePadProjectDetails__StyledDetailsDescriptionColumn",
-  componentId: "sc-18f4woi-7"
-})(["position:relative;display:flex;flex-direction:column;justify-content:space-between;"]);
-var DetailsSpacer = styled.div.withConfig({
-  displayName: "SpacePadProjectDetails__DetailsSpacer",
-  componentId: "sc-18f4woi-8"
-})(["width:100%;height:1px;background:#272730;margin:16px 0px;"]);
-var ParticipantsRow = styled(DetailsRow).withConfig({
-  displayName: "SpacePadProjectDetails__ParticipantsRow",
-  componentId: "sc-18f4woi-9"
-})(["position:absolute;bottom:-40px;"]);
-var IdoEventTimestamp = styled.div.withConfig({
-  displayName: "SpacePadProjectDetails__IdoEventTimestamp",
-  componentId: "sc-18f4woi-10"
-})(["position:absolute;font-weight:500;font-size:12px;line-height:170%;color:#535459;right:0px;bottom:-20px;", "{left:0px;}"], function (_ref6) {
+var StyledDetailsDescriptionColumn = styled.div(_templateObject8$8 || (_templateObject8$8 = _taggedTemplateLiteral(["\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n"])));
+var DetailsSpacer = styled.div(_templateObject9$7 || (_templateObject9$7 = _taggedTemplateLiteral(["\n  width: 100%;\n  height: 1px;\n  background: #272730;\n  margin: 16px 0px;\n"])));
+var ParticipantsRow = styled(DetailsRow)(_templateObject0$5 || (_templateObject0$5 = _taggedTemplateLiteral(["\n  position: absolute;\n  bottom: -40px;\n"])));
+var IdoEventTimestamp = styled.div(_templateObject1$5 || (_templateObject1$5 = _taggedTemplateLiteral(["\n  position: absolute;\n  font-weight: 500;\n  font-size: 12px;\n  line-height: 170%;\n  color: #535459;\n  right: 0px;\n  bottom: -20px;\n  ", " {\n    left: 0px;\n  }\n"])), function (_ref6) {
   var theme = _ref6.theme;
   return theme.mediaQueries.mobile;
 });
@@ -14412,73 +13936,47 @@ var SpacePadProjectDetails = function SpacePadProjectDetails(props) {
   });
 };
 
-var WalletWrapper = styled.div.withConfig({
-  displayName: "WalletCap__WalletWrapper",
-  componentId: "sc-1uosrv7-0"
-})(["display:flex;width:100%;height:129px;background:", ";border:1px solid ", ";border-radius:10px;justify-content:space-around;flex-direction:column;padding:12px 16px 34px 16px;"], function (_ref) {
+var _templateObject$G, _templateObject2$x, _templateObject3$r, _templateObject4$m, _templateObject5$k, _templateObject6$e, _templateObject7$a, _templateObject8$7, _templateObject9$6;
+var WalletWrapper = styled.div(_templateObject$G || (_templateObject$G = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  height: 129px;\n  background: ", ";\n  border: 1px solid ", ";\n  border-radius: 10px;\n  justify-content: space-around;\n  flex-direction: column;\n  padding: 12px 16px 34px 16px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.backgrounds.secondary;
 }, function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.white3;
 });
-styled.div.withConfig({
-  displayName: "WalletCap__WalletValueBar",
-  componentId: "sc-1uosrv7-1"
-})(["display:flex;width:100%;height:100%;justify-content:space-between;align-items:flex-start;flex-direction:column;flex:2;"]);
-styled.div.withConfig({
-  displayName: "WalletCap__ProgressBarWrapper",
-  componentId: "sc-1uosrv7-2"
-})(["position:relative;width:100%;height:30px;background:", ";display:flex;justify-content:flex-start;align-items:center;border-radius:7px;border:1px solid ", ";box-sizing:border-box;padding:3px;"], function (_ref3) {
+styled.div(_templateObject2$x || (_templateObject2$x = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  height: 100%;\n  justify-content: space-between;\n  align-items: flex-start;\n  flex-direction: column;\n  flex: 2;\n"])));
+styled.div(_templateObject3$r || (_templateObject3$r = _taggedTemplateLiteral(["\n  position: relative;\n  width: 100%;\n  height: 30px;\n  background: ", ";\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n  border-radius: 7px;\n  border: 1px solid ", ";\n  box-sizing: border-box;\n  padding: 3px;\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.colors.dark;
 }, function (_ref4) {
   var theme = _ref4.theme;
   return theme.colors.white3;
 });
-styled.div.withConfig({
-  displayName: "WalletCap__ProgressBar",
-  componentId: "sc-1uosrv7-3"
-})(["position:relative;height:100%;width:", "%;font-size:14px;background:", ";border-radius:7px;"], function (_ref5) {
+styled.div(_templateObject4$m || (_templateObject4$m = _taggedTemplateLiteral(["\n  position: relative;\n  height: 100%;\n  width: ", "%;\n  font-size: 14px;\n  background: ", ";\n  border-radius: 7px;\n"])), function (_ref5) {
   var width = _ref5.width;
   return width;
 }, function (_ref6) {
   var theme = _ref6.theme;
   return theme.colors.grey;
 });
-styled.div.withConfig({
-  displayName: "WalletCap__ProcentValue",
-  componentId: "sc-1uosrv7-4"
-})(["position:absolute;color:", ";top:50%;left:50%;transform:translate(-50%,-50%);font-weight:bold;display:inline-block;width:100%;text-align:center;"], function (_ref7) {
+styled.div(_templateObject5$k || (_templateObject5$k = _taggedTemplateLiteral(["\n  position: absolute;\n  color: ", ";\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  font-weight: bold;\n  display: inline-block;\n  width: 100%;\n  text-align: center;\n"])), function (_ref7) {
   var theme = _ref7.theme;
   return theme.colors.white;
 });
-var Description$1 = styled.div.withConfig({
-  displayName: "WalletCap__Description",
-  componentId: "sc-1uosrv7-5"
-})(["display:flex;font-size:12px;line-height:2;color:", ";align-items:flex-start;font-weight:normal;"], function (_ref8) {
+var Description$1 = styled.div(_templateObject6$e || (_templateObject6$e = _taggedTemplateLiteral(["\n  display: flex;\n  font-size: 12px;\n  line-height: 2;\n  color: ", ";\n  align-items: flex-start;\n  font-weight: normal;\n"])), function (_ref8) {
   var theme = _ref8.theme;
   return theme.colors.white55;
 });
-var Title = styled(Description$1).withConfig({
-  displayName: "WalletCap__Title",
-  componentId: "sc-1uosrv7-6"
-})(["font-weight:bold;font-size:14px;flex-direction:row;"]);
+var Title = styled(Description$1)(_templateObject7$a || (_templateObject7$a = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 14px;\n  flex-direction: row;\n"])));
 // We need to implement it in such a way until walletCap per wallet wont be implemented
-var DescriptionWrapper = styled.div.withConfig({
-  displayName: "WalletCap__DescriptionWrapper",
-  componentId: "sc-1uosrv7-7"
-})(["color:", ";line-height:2;display:flex;flex-direction:column;font-weight:bold;font-size:14px;flex:1;border-right:", ";margin-right:24px;"], function (_ref9) {
+var DescriptionWrapper = styled.div(_templateObject8$7 || (_templateObject8$7 = _taggedTemplateLiteral(["\n  color: ", ";\n  line-height: 2;\n  display: flex;\n  flex-direction: column;\n  font-weight: bold;\n  font-size: 14px;\n  flex: 1;\n  border-right: ", ";\n  margin-right: 24px;\n"])), function (_ref9) {
   var theme = _ref9.theme;
   return theme.colors.white;
 }, function (_ref0) {
   var withoutBorder = _ref0.withoutBorder;
   return withoutBorder ? "none" : "1px solid #252530";
 });
-var DetailsWrapper = styled.div.withConfig({
-  displayName: "WalletCap__DetailsWrapper",
-  componentId: "sc-1uosrv7-8"
-})(["display:flex;height:50px;flex-direction:row;"]);
+var DetailsWrapper = styled.div(_templateObject9$6 || (_templateObject9$6 = _taggedTemplateLiteral(["\n  display: flex;\n  height: 50px;\n  flex-direction: row;\n"])));
 var WalletCap = function WalletCap(_ref1) {
   _ref1.currentWalletCap;
     var _ref1$softCap = _ref1.softCap,
@@ -14509,10 +14007,8 @@ var WalletCap = function WalletCap(_ref1) {
   });
 };
 
-var TooltipContent = styled.div.withConfig({
-  displayName: "Tooltip__TooltipContent",
-  componentId: "sc-isj8qi-0"
-})(["background:", ";padding:16px;border-radius:10px;border:1px solid ", ";box-shadow:0px 13px 20px rgba(0,0,0,0.25);color:", ";width:max-content;min-width:200px;display:none;max-height:500px;z-index:9999999;position:absolute;bottom:calc(100% + 16px);transform:translate(34px,0);right:", "px;font-size:", "px;", ""], function (_ref) {
+var _templateObject$F, _templateObject2$w, _templateObject3$q;
+var TooltipContent = styled.div(_templateObject$F || (_templateObject$F = _taggedTemplateLiteral(["\n  background: ", ";\n  padding: 16px;\n  border-radius: 10px;\n  border: 1px solid ", ";\n  box-shadow: 0px 13px 20px rgba(0, 0, 0, 0.25);\n  color: ", ";\n  width: max-content;\n  min-width: 200px;\n  display: none;\n  max-height: 500px;\n  z-index: 9999999;\n  position: absolute;\n  bottom: calc(100% + 16px);\n  transform: translate(34px, 0);\n  right: ", "px;\n  font-size: ", "px;\n\n  ", "\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.card;
 }, function (_ref2) {
@@ -14527,15 +14023,12 @@ var TooltipContent = styled.div.withConfig({
 }, function (props) {
   return props.small ? 12 : "";
 }, function (props) {
-  return !props.removeAfter && css(["&:after{content:\"\";display:block;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid ", ";bottom:", "px;position:absolute;transform:translate(-34px,9px);right:0;}"], function (_ref5) {
+  return !props.removeAfter && css(_templateObject2$w || (_templateObject2$w = _taggedTemplateLiteral(["\n      &:after {\n        content: \"\";\n        display: block;\n        width: 0;\n        height: 0;\n        border-left: 10px solid transparent;\n        border-right: 10px solid transparent;\n        border-top: 10px solid ", ";\n        bottom: ", "px;\n        position: absolute;\n        transform: translate(-34px, 9px);\n        right: 0;\n      }\n    "])), function (_ref5) {
     var theme = _ref5.theme;
     return theme.tooltip.background;
   }, props.bottom || 0);
 });
-var Container$3 = styled.div.withConfig({
-  displayName: "Tooltip__Container",
-  componentId: "sc-isj8qi-1"
-})(["position:relative;z-index:99999999999;&:hover ", ",&:focus-within ", "{display:block;}"], TooltipContent, TooltipContent);
+var Container$3 = styled.div(_templateObject3$q || (_templateObject3$q = _taggedTemplateLiteral(["\n  position: relative;\n  z-index: 99999999999;\n\n  &:hover ", ", &:focus-within ", " {\n    display: block;\n  }\n"])), TooltipContent, TooltipContent);
 var Tooltip = function Tooltip(_ref6) {
   var content = _ref6.content,
     children = _ref6.children,
@@ -14560,57 +14053,31 @@ var Tooltip = function Tooltip(_ref6) {
   });
 };
 
-var CSSPowerWrapper = styled.div.withConfig({
-  displayName: "CSSPower__CSSPowerWrapper",
-  componentId: "sc-12ic40m-0"
-})(["display:flex;flex-direction:row;justify-content:space-between;align-items:center;background:#252530;border:1px solid ", ";padding:16px 24px;border-radius:10px;", "{width:100%;align-items:center;margin-top:24px;}"], function (_ref) {
+var _templateObject$E, _templateObject2$v, _templateObject3$p, _templateObject4$l, _templateObject5$j, _templateObject6$d, _templateObject7$9, _templateObject8$6, _templateObject9$5;
+var CSSPowerWrapper = styled.div(_templateObject$E || (_templateObject$E = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n  background: #252530;\n  border: 1px solid ", ";\n  padding: 16px 24px;\n  border-radius: 10px;\n  ", " {\n    width: 100%;\n    align-items: center;\n    margin-top: 24px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.white3;
 }, function (_ref2) {
   var theme = _ref2.theme;
   return theme.mediaQueries.tablet;
 });
-var PowerWrapper = styled.div.withConfig({
-  displayName: "CSSPower__PowerWrapper",
-  componentId: "sc-12ic40m-1"
-})(["display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between;margin-left:30px;"]);
-var CSSPowerText = styled(Text).withConfig({
-  displayName: "CSSPower__CSSPowerText",
-  componentId: "sc-12ic40m-2"
-})(["display:flex;align-items:center;font-weight:bold;font-size:14px;line-height:140%;color:", ";width:max-content;"], function (_ref3) {
+var PowerWrapper = styled.div(_templateObject2$v || (_templateObject2$v = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n  justify-content: space-between;\n  margin-left: 30px;\n"])));
+var CSSPowerText = styled(Text)(_templateObject3$p || (_templateObject3$p = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  font-weight: bold;\n  font-size: 14px;\n  line-height: 140%;\n  color: ", ";\n  width: max-content;\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.colors.white55;
 });
-var CSSPowerValue = styled(Text).withConfig({
-  displayName: "CSSPower__CSSPowerValue",
-  componentId: "sc-12ic40m-3"
-})(["font-weight:bold;font-size:36px;line-height:130%;color:", ";"], function (_ref4) {
+var CSSPowerValue = styled(Text)(_templateObject4$l || (_templateObject4$l = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 36px;\n  line-height: 130%;\n  color: ", ";\n"])), function (_ref4) {
   var theme = _ref4.theme;
   return theme.colors.white;
 });
-var StyledInfoIcon = styled(Icon$2E).withConfig({
-  displayName: "CSSPower__StyledInfoIcon",
-  componentId: "sc-12ic40m-4"
-})(["margin-left:5px;height:18px;cursor:pointer;"]);
-var PowerDescriptionWrapper = styled.div.withConfig({
-  displayName: "CSSPower__PowerDescriptionWrapper",
-  componentId: "sc-12ic40m-5"
-})(["display:flex;flex-direction:column;"]);
-var PowerTitle = styled(Text).withConfig({
-  displayName: "CSSPower__PowerTitle",
-  componentId: "sc-12ic40m-6"
-})(["font-weight:bold;font-size:14px;line-height:140%;"]);
-var PowerAmount = styled(Text).withConfig({
-  displayName: "CSSPower__PowerAmount",
-  componentId: "sc-12ic40m-7"
-})(["font-weight:bold;font-size:14px;line-height:140%;color:", ";margin-left:30px;"], function (_ref5) {
+var StyledInfoIcon = styled(Icon$2E)(_templateObject5$j || (_templateObject5$j = _taggedTemplateLiteral(["\n  margin-left: 5px;\n  height: 18px;\n  cursor: pointer;\n"])));
+var PowerDescriptionWrapper = styled.div(_templateObject6$d || (_templateObject6$d = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n"])));
+var PowerTitle = styled(Text)(_templateObject7$9 || (_templateObject7$9 = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 14px;\n  line-height: 140%;\n"])));
+var PowerAmount = styled(Text)(_templateObject8$6 || (_templateObject8$6 = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 14px;\n  line-height: 140%;\n  color: ", ";\n  margin-left: 30px;\n"])), function (_ref5) {
   var theme = _ref5.theme;
   return theme.colors.white55;
 });
-var PowerLine = styled.div.withConfig({
-  displayName: "CSSPower__PowerLine",
-  componentId: "sc-12ic40m-8"
-})(["display:flex;flex:direction:row;justify-content:space-between;margin-bottom:", "px;"], function (_ref6) {
+var PowerLine = styled.div(_templateObject9$5 || (_templateObject9$5 = _taggedTemplateLiteral(["\n  display: flex;\n  flex: direction: row;\n  justify-content: space-between;\n  margin-bottom: ", "px;\n"])), function (_ref6) {
   var mb = _ref6.mb;
   return mb || 0;
 });
@@ -14663,10 +14130,8 @@ var CSSPower = function CSSPower(_ref7) {
 };
 
 var _excluded$4 = ["value", "onUserInput", "placeholder", "type"];
-var StyledInput = styled.input.withConfig({
-  displayName: "NumericalInput__StyledInput",
-  componentId: "sc-mu1fop-0"
-})(["color:", ";width:0;position:relative;font-weight:700;outline:none;border:none;flex:1 1 auto;background-color:transparent;background:transparent;font-size:24px;text-align:", ";white-space:nowrap;line-height:33px;overflow:hidden;text-overflow:ellipsis;padding:0px;-webkit-appearance:textfield;::-webkit-search-decoration{-webkit-appearance:none;}[type=\"number\"]{-moz-appearance:textfield;}::-webkit-outer-spin-button,::-webkit-inner-spin-button{-webkit-appearance:none;}::placeholder{color:", ";}"], function (_ref) {
+var _templateObject$D;
+var StyledInput = styled.input(_templateObject$D || (_templateObject$D = _taggedTemplateLiteral(["\n  color: ", ";\n  width: 0;\n  position: relative;\n  font-weight: 700;\n  outline: none;\n  border: none;\n  flex: 1 1 auto;\n  background-color: transparent;\n  background: transparent;\n  font-size: 24px;\n  text-align: ", ";\n  white-space: nowrap;\n  line-height: 33px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  padding: 0px;\n  -webkit-appearance: textfield;\n\n  ::-webkit-search-decoration {\n    -webkit-appearance: none;\n  }\n\n  [type=\"number\"] {\n    -moz-appearance: textfield;\n  }\n\n  ::-webkit-outer-spin-button,\n  ::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n  }\n\n  ::placeholder {\n    color: ", ";\n  }\n"])), function (_ref) {
   var error = _ref.error,
     theme = _ref.theme;
   return error ? theme.colors.failure : theme.colors.text;
@@ -14712,10 +14177,8 @@ var NumericalInput = /*#__PURE__*/React__default.memo(function InnerInput(_ref4)
   }));
 });
 
-var SpacePadDatesWrapper = styled.div.withConfig({
-  displayName: "SpacePadDates__SpacePadDatesWrapper",
-  componentId: "sc-wmdxzq-0"
-})(["display:flex;width:100%;background:", ";border:1px solid ", ";border-radius:10px;padding:16px 24px;align-items:center;justify-content:space-between;", "{flex-direction:column;align-items:flex-start;}"], function (_ref) {
+var _templateObject$C, _templateObject2$u, _templateObject3$o, _templateObject4$k, _templateObject5$i, _templateObject6$c, _templateObject7$8, _templateObject8$5, _templateObject9$4, _templateObject0$4, _templateObject1$4, _templateObject10$4, _templateObject11$4, _templateObject12$3;
+var SpacePadDatesWrapper = styled.div(_templateObject$C || (_templateObject$C = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  background: ", ";\n  border: 1px solid ", ";\n  border-radius: 10px;\n  padding: 16px 24px;\n  align-items: center;\n  justify-content: space-between;\n  ", " {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.backgrounds.secondary;
 }, function (_ref2) {
@@ -14725,10 +14188,7 @@ var SpacePadDatesWrapper = styled.div.withConfig({
   var theme = _ref3.theme;
   return theme.mediaQueries.mobile;
 });
-var ActiveDot = styled.div.withConfig({
-  displayName: "SpacePadDates__ActiveDot",
-  componentId: "sc-wmdxzq-1"
-})(["height:16px;width:16px;border-radius:50%;background:", ";margin-right:", "px;", ""], function (_ref4) {
+var ActiveDot = styled.div(_templateObject2$u || (_templateObject2$u = _taggedTemplateLiteral(["\n  height: 16px;\n  width: 16px;\n  border-radius: 50%;\n  background: ", ";\n  margin-right: ", "px;\n  ", "\n"])), function (_ref4) {
   var color = _ref4.color;
   return color;
 }, function (_ref5) {
@@ -14738,81 +14198,45 @@ var ActiveDot = styled.div.withConfig({
   var fetchingData = _ref6.fetchingData;
   return fetchingData && "\n    transition: all 0.25s ease-in-out;\n    animation: stretch 2s infinite;\n    @keyframes stretch {\n      0% {\n        transform: scale(1);\n      }\n      25% {\n        transform: scale(0.9);\n      }\n      50% {\n        transform: scale(1.2);\n      }\n      75% {\n        transform: scale(0.9);\n      }\n      100% {\n        transform: scale(1);\n      }\n    }\n  ";
 });
-var TimeWrapper = styled.div.withConfig({
-  displayName: "SpacePadDates__TimeWrapper",
-  componentId: "sc-wmdxzq-2"
-})(["display:flex;flex-direction:row;align-items:center;", "{flex-direction:column;align-items:flex-start;margin-bottom:21px;}"], function (_ref7) {
+var TimeWrapper = styled.div(_templateObject3$o || (_templateObject3$o = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  ", " {\n    flex-direction: column;\n    align-items: flex-start;\n    margin-bottom: 21px;\n  }\n"])), function (_ref7) {
   var theme = _ref7.theme;
   return theme.mediaQueries.mobile;
 });
-var EndTimeWrapper = styled.div.withConfig({
-  displayName: "SpacePadDates__EndTimeWrapper",
-  componentId: "sc-wmdxzq-3"
-})(["display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;height:41px;"]);
-var TimeNumber = styled(Text).withConfig({
-  displayName: "SpacePadDates__TimeNumber",
-  componentId: "sc-wmdxzq-4"
-})(["font-weight:600;font-size:20px;margin:0px;padding:0px;height:100%;line-height:100%;"]);
-var PeriodText = styled(Text).withConfig({
-  displayName: "SpacePadDates__PeriodText",
-  componentId: "sc-wmdxzq-5"
-})(["font-weight:600;font-size:16px;margin-right:0px;padding:0px;color:", ";height:100%;line-height:17px;"], function (_ref8) {
+var EndTimeWrapper = styled.div(_templateObject4$k || (_templateObject4$k = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  align-items: flex-start;\n  height: 41px;\n"])));
+var TimeNumber = styled(Text)(_templateObject5$i || (_templateObject5$i = _taggedTemplateLiteral(["\n  font-weight: 600;\n  font-size: 20px;\n  margin: 0px;\n  padding: 0px;\n  height: 100%;\n  line-height: 100%;\n"])));
+var PeriodText = styled(Text)(_templateObject6$c || (_templateObject6$c = _taggedTemplateLiteral(["\n  font-weight: 600;\n  font-size: 16px;\n  margin-right: 0px;\n  padding: 0px;\n  color: ", ";\n  height: 100%;\n  // Temporarly\n  line-height: 17px;\n"])), function (_ref8) {
   var theme = _ref8.theme;
   return theme.colors.primary;
 });
-var DetailedTimeWrapper = styled.div.withConfig({
-  displayName: "SpacePadDates__DetailedTimeWrapper",
-  componentId: "sc-wmdxzq-6"
-})(["width:150px;display:flex;flex-direction:row;align-items:flex-end;justify-content:space-between;color:", ";font-size:20px;font-weight:bold;"], function (_ref9) {
+var DetailedTimeWrapper = styled.div(_templateObject7$8 || (_templateObject7$8 = _taggedTemplateLiteral(["\n  width: 150px;\n  display: flex;\n  flex-direction: row;\n  align-items: flex-end;\n  justify-content: space-between;\n  color: ", ";\n  font-size: 20px;\n  font-weight: bold;\n"])), function (_ref9) {
   var theme = _ref9.theme;
   return theme.colors.white30;
 });
-var TimeValues = styled.div.withConfig({
-  displayName: "SpacePadDates__TimeValues",
-  componentId: "sc-wmdxzq-7"
-})(["display:flex;flex-direction:row;align-items:flex-end;width:30px;"]);
-var DateWrapper = styled.div.withConfig({
-  displayName: "SpacePadDates__DateWrapper",
-  componentId: "sc-wmdxzq-8"
-})(["display:flex;flex-direction:row;", "{width:100%;justify-content:space-between;}"], function (_ref0) {
+var TimeValues = styled.div(_templateObject8$5 || (_templateObject8$5 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: flex-end;\n  width: 30px;\n"])));
+var DateWrapper = styled.div(_templateObject9$4 || (_templateObject9$4 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  ", " {\n    width: 100%;\n    justify-content: space-between;\n  }\n"])), function (_ref0) {
   var theme = _ref0.theme;
   return theme.mediaQueries.mobile;
 });
-var ActiveStateWrapper = styled.div.withConfig({
-  displayName: "SpacePadDates__ActiveStateWrapper",
-  componentId: "sc-wmdxzq-9"
-})(["display:flex;flex-direction:row;align-items:center;", "{margin-bottom:17px;}"], function (_ref1) {
+var ActiveStateWrapper = styled.div(_templateObject0$4 || (_templateObject0$4 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  ", " {\n    margin-bottom: 17px;\n  }\n"])), function (_ref1) {
   var theme = _ref1.theme;
   return theme.mediaQueries.mobile;
 });
-var RoundDescription = styled.div.withConfig({
-  displayName: "SpacePadDates__RoundDescription",
-  componentId: "sc-wmdxzq-10"
-})(["font-size:15px;color:", ";line-height:20px;margin-top:3px;margin-left:-40px;"], function (_ref10) {
+var RoundDescription = styled.div(_templateObject1$4 || (_templateObject1$4 = _taggedTemplateLiteral(["\n  font-size: 15px;\n  color: ", ";\n  line-height: 20px;\n  margin-top: 3px;\n  margin-left: -40px;\n"])), function (_ref10) {
   var theme = _ref10.theme;
   return theme.colors.white55;
 });
-var AcocuntDataWrapper = styled.div.withConfig({
-  displayName: "SpacePadDates__AcocuntDataWrapper",
-  componentId: "sc-wmdxzq-11"
-})(["display:flex;flex-direction:row;justify-content:space-between;align-items:center;", "{flex-direction:column;align-items:flex-start;button{width:100%;}}"], function (_ref11) {
+var AcocuntDataWrapper = styled.div(_templateObject10$4 || (_templateObject10$4 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n  ", " {\n    flex-direction: column;\n    align-items: flex-start;\n    button {\n      width: 100%;\n    }\n  }\n"])), function (_ref11) {
   var theme = _ref11.theme;
   return theme.mediaQueries.mobile;
 });
-var AccountInfoText$1 = styled(Text).withConfig({
-  displayName: "SpacePadDates__AccountInfoText",
-  componentId: "sc-wmdxzq-12"
-})(["font-weight:bold;font-size:18px;line-height:130%;display:flex;align-items:center;margin-right:8px;", "{font-size:16px;}", "{font-size:14px;margin-right:0px;margin-bottom:16px;}"], function (_ref12) {
+var AccountInfoText$1 = styled(Text)(_templateObject11$4 || (_templateObject11$4 = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 18px;\n  line-height: 130%;\n  display: flex;\n  align-items: center;\n  margin-right: 8px;\n  ", " {\n    font-size: 16px;\n  }\n  ", " {\n    font-size: 14px;\n    margin-right: 0px;\n    margin-bottom: 16px;\n  }\n"])), function (_ref12) {
   var theme = _ref12.theme;
   return theme.mediaQueries.tablet;
 }, function (_ref13) {
   var theme = _ref13.theme;
   return theme.mediaQueries.mobile;
 });
-var TimerText = styled(Text).withConfig({
-  displayName: "SpacePadDates__TimerText",
-  componentId: "sc-wmdxzq-13"
-})(["font-weight:bold;font-size:11px;color:", ";strong{color:", ";}"], baseColors.white55, baseColors.white);
+var TimerText = styled(Text)(_templateObject12$3 || (_templateObject12$3 = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 11px;\n  color: ", ";\n  strong {\n    color: ", ";\n  }\n"])), baseColors.white55, baseColors.white);
 var SpacePadDates = function SpacePadDates(_ref14) {
   var _ref14$days = _ref14.days,
     days = _ref14$days === void 0 ? "3" : _ref14$days,
@@ -14952,21 +14376,13 @@ var SpacePadDates = function SpacePadDates(_ref14) {
   });
 };
 
-var AddToCapWrapper = styled.div.withConfig({
-  displayName: "AddToCap__AddToCapWrapper",
-  componentId: "sc-1vjnrpf-0"
-})(["display:flex;flex-direction:column;height:max-content;width:100%;padding:32px;background:#191921;border-radius:16px;"]);
-var LogicComponentsWrapper = styled.div.withConfig({
-  displayName: "AddToCap__LogicComponentsWrapper",
-  componentId: "sc-1vjnrpf-1"
-})(["display:flex;flex-direction:column;align-items:center;justify-content:center;", "{flex-direction:column;}"], function (_ref) {
+var _templateObject$B, _templateObject2$t, _templateObject3$n, _templateObject4$j, _templateObject5$h, _templateObject6$b, _templateObject7$7, _templateObject8$4, _templateObject9$3, _templateObject0$3, _templateObject1$3, _templateObject10$3, _templateObject11$3, _templateObject12$2, _templateObject13$1;
+var AddToCapWrapper = styled.div(_templateObject$B || (_templateObject$B = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  height: max-content;\n  width: 100%;\n  padding: 32px;\n  background: #191921;\n  border-radius: 16px;\n"])));
+var LogicComponentsWrapper = styled.div(_templateObject2$t || (_templateObject2$t = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  ", " {\n    flex-direction: column;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.mobile;
 });
-var CapInput = styled(NumericalInput).withConfig({
-  displayName: "AddToCap__CapInput",
-  componentId: "sc-1vjnrpf-2"
-})(["height:50px;font-size:16px;padding:11px 0px 11px 24px;border:1px solid ", ";background:", ";border-radius:10px;margin-bottom:20px;::placeholder{color:", ";font-weight:500;}"], function (_ref2) {
+var CapInput = styled(NumericalInput)(_templateObject3$n || (_templateObject3$n = _taggedTemplateLiteral(["\n  height: 50px;\n  font-size: 16px;\n  padding: 11px 0px 11px 24px;\n  border: 1px solid ", ";\n  background: ", ";\n  border-radius: 10px;\n  margin-bottom: 20px;\n  ::placeholder {\n    color: ", ";\n    font-weight: 500;\n  }\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.white10;
 }, function (_ref3) {
@@ -14976,52 +14392,31 @@ var CapInput = styled(NumericalInput).withConfig({
   var theme = _ref4.theme;
   return theme.colors.white55;
 });
-var EligibleWrapper = styled.div.withConfig({
-  displayName: "AddToCap__EligibleWrapper",
-  componentId: "sc-1vjnrpf-3"
-})(["display:flex;flex-direction:row;align-items:center;justify-content:center;width:max-content;height:50px;width:100%;padding:15.5px;background:#272730;box-sizing:border-box;border-radius:10px;margin-bottom:26px;"]);
-var IdoActionButton = styled(Button$1).withConfig({
-  displayName: "AddToCap__IdoActionButton",
-  componentId: "sc-1vjnrpf-4"
-})(["color:", " !important;height:50px;width:100%;&:disabled,&.button--disabled{background:#12ffb8;opacity:0.2;color:#3d3d41 !important;}", "{margin-top:16px;width:100%;}"], function (_ref5) {
+var EligibleWrapper = styled.div(_templateObject4$j || (_templateObject4$j = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  width: max-content;\n  height: 50px;\n  width: 100%;\n  padding: 15.5px;\n  //Used only once in this component, not declared on theme\n  background: #272730;\n  box-sizing: border-box;\n  border-radius: 10px;\n  margin-bottom: 26px;\n"])));
+var IdoActionButton = styled(Button$1)(_templateObject5$h || (_templateObject5$h = _taggedTemplateLiteral(["\n  color: ", " !important;\n  height: 50px;\n  width: 100%;\n  &:disabled,\n  &.button--disabled {\n    background: #12ffb8;\n    opacity: 0.2;\n    color: #3d3d41 !important;\n  }\n  ", " {\n    margin-top: 16px;\n    width: 100%;\n  }\n"])), function (_ref5) {
   var theme = _ref5.theme;
   return theme.colors.dark;
 }, function (_ref6) {
   var theme = _ref6.theme;
   return theme.mediaQueries.mobile;
 });
-var MainFunctionsWrapper = styled.div.withConfig({
-  displayName: "AddToCap__MainFunctionsWrapper",
-  componentId: "sc-1vjnrpf-5"
-})(["position:relative;width:100%;height:50px;display:flex;flex-direction:row;justify-content:center;align-items:center;margin-top:10px;", "{margin-bottom:10px;}"], function (_ref7) {
+var MainFunctionsWrapper = styled.div(_templateObject6$b || (_templateObject6$b = _taggedTemplateLiteral(["\n  position: relative;\n  width: 100%;\n  height: 50px;\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  margin-top: 10px;\n  ", " {\n    margin-bottom: 10px;\n  }\n"])), function (_ref7) {
   var theme = _ref7.theme;
   return theme.mediaQueries.mobile;
 });
-var SignedRow = styled.div.withConfig({
-  displayName: "AddToCap__SignedRow",
-  componentId: "sc-1vjnrpf-6"
-})(["display:flex;flex-direction:row;width:max-content;justify-content:center;", "{margin-top:16px;width:100%;}"], function (_ref8) {
+var SignedRow = styled.div(_templateObject7$7 || (_templateObject7$7 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  width: max-content;\n  justify-content: center;\n  ", " {\n    margin-top: 16px;\n    width: 100%;\n  }\n"])), function (_ref8) {
   var theme = _ref8.theme;
   return theme.mediaQueries.mobile;
 });
-var ErrorComponent = styled(Text).withConfig({
-  displayName: "AddToCap__ErrorComponent",
-  componentId: "sc-1vjnrpf-7"
-})(["font-weight:600;position:absolute;top:41px;left:10px;color:", ";font-size:12px;"], function (_ref9) {
+var ErrorComponent = styled(Text)(_templateObject8$4 || (_templateObject8$4 = _taggedTemplateLiteral(["\n  font-weight: 600;\n  position: absolute;\n  top: 41px;\n  left: 10px;\n  color: ", ";\n  font-size: 12px;\n"])), function (_ref9) {
   var theme = _ref9.theme;
   return theme.colors.error;
 });
-var CoinWrapper = styled.div.withConfig({
-  displayName: "AddToCap__CoinWrapper",
-  componentId: "sc-1vjnrpf-8"
-})(["display:flex;flex-direction:row;align-items:center;justify-content:space-between;width:97px;height:50px;margin-left:16px;padding:15.5px;border:1px solid #373749;background:#1f1f29;box-sizing:border-box;border-radius:10px;", "{margin-right:0px;}"], function (_ref0) {
+var CoinWrapper = styled.div(_templateObject9$3 || (_templateObject9$3 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  width: 97px;\n  height: 50px;\n  margin-left: 16px;\n  padding: 15.5px;\n  border: 1px solid #373749;\n  //Used only once in this component, not declared on theme\n  background: #1f1f29;\n  box-sizing: border-box;\n  border-radius: 10px;\n  ", " {\n    margin-right: 0px;\n  }\n"])), function (_ref0) {
   var theme = _ref0.theme;
   return theme.mediaQueries.mobile;
 });
-var AddCapButton = styled(Button$1).withConfig({
-  displayName: "AddToCap__AddCapButton",
-  componentId: "sc-1vjnrpf-9"
-})(["color:", ";height:50px;width:100%;&:disabled,&.button--disabled{background:", ";color:", ";}"], function (_ref1) {
+var AddCapButton = styled(Button$1)(_templateObject0$3 || (_templateObject0$3 = _taggedTemplateLiteral(["\n  color: ", ";\n  height: 50px;\n  width: 100%;\n  &:disabled,\n  &.button--disabled {\n    background: ", ";\n    color: ", ";\n  }\n"])), function (_ref1) {
   var theme = _ref1.theme;
   return theme.colors.dark;
 }, function (_ref10) {
@@ -15031,32 +14426,17 @@ var AddCapButton = styled(Button$1).withConfig({
   var theme = _ref11.theme;
   return theme.colors.white55;
 });
-var AccountInfoText = styled(Text).withConfig({
-  displayName: "AddToCap__AccountInfoText",
-  componentId: "sc-1vjnrpf-10"
-})(["font-weight:bold;font-size:18px;line-height:130%;display:flex;align-items:center;margin-bottom:26px;text-align:center;", "{font-size:16px;}", "{font-size:14px;}", ""], function (_ref12) {
+var AccountInfoText = styled(Text)(_templateObject1$3 || (_templateObject1$3 = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 18px;\n  line-height: 130%;\n  display: flex;\n  align-items: center;\n  margin-bottom: 26px;\n  text-align: center;\n  ", " {\n    font-size: 16px;\n  }\n  ", " {\n    font-size: 14px;\n  }\n  ", "\n"])), function (_ref12) {
   var theme = _ref12.theme;
   return theme.mediaQueries.tablet;
 }, function (_ref13) {
   var theme = _ref13.theme;
   return theme.mediaQueries.mobile;
 }, space);
-var PersonalValuesWrapper = styled.div.withConfig({
-  displayName: "AddToCap__PersonalValuesWrapper",
-  componentId: "sc-1vjnrpf-11"
-})(["display:flex;flex-direction:column;height:max-content;width:100%;padding:14px 16px;border:1px solid #383847;border-radius:8px;margin-bottom:30px;"]);
-var PersonalValueRow = styled.div.withConfig({
-  displayName: "AddToCap__PersonalValueRow",
-  componentId: "sc-1vjnrpf-12"
-})(["display:flex;justify-content:space-between;"]);
-var PersonalValueTitle = styled(Text).withConfig({
-  displayName: "AddToCap__PersonalValueTitle",
-  componentId: "sc-1vjnrpf-13"
-})(["font-weight:bold;font-size:14px;line-height:170%;text-align:center;color:#818c92;"]);
-var Row = styled(Box).withConfig({
-  displayName: "AddToCap__Row",
-  componentId: "sc-1vjnrpf-14"
-})(["width:100%;display:flex;padding:0;align-items:", ";padding:", ";border:", ";border-radius:", ";"], function (_ref14) {
+var PersonalValuesWrapper = styled.div(_templateObject10$3 || (_templateObject10$3 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  height: max-content;\n  width: 100%;\n  padding: 14px 16px;\n  border: 1px solid #383847;\n  border-radius: 8px;\n  margin-bottom: 30px;\n"])));
+var PersonalValueRow = styled.div(_templateObject11$3 || (_templateObject11$3 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n"])));
+var PersonalValueTitle = styled(Text)(_templateObject12$2 || (_templateObject12$2 = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 14px;\n  line-height: 170%;\n  text-align: center;\n  color: #818c92;\n"])));
+var Row = styled(Box)(_templateObject13$1 || (_templateObject13$1 = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  padding: 0;\n  align-items: ", ";\n  padding: ", ";\n  border: ", ";\n  border-radius: ", ";\n"])), function (_ref14) {
   var align = _ref14.align;
   return align || "center";
 }, function (_ref15) {
@@ -15390,32 +14770,18 @@ var AddToCap = function AddToCap(_ref18) {
   return withoutActions ? /*#__PURE__*/jsx(Fragment, {}) : contentWrapper;
 };
 
-var Description = styled.div.withConfig({
-  displayName: "CapCounter__Description",
-  componentId: "sc-h5yjzn-0"
-})(["font-family:Manrope;font-size:12px;line-height:170%;color:rgba(255,255,255,0.55);align-self:flex-start;font-weight:normal;"]);
-var CounterWrapper = styled.div.withConfig({
-  displayName: "CapCounter__CounterWrapper",
-  componentId: "sc-h5yjzn-1"
-})(["position:relative;width:100%;height:81px;background:", ";border:1px solid rgba(255,255,255,0.03);display:flex;border-radius:10px;padding:15px 0px 21px 20px;"], function (_ref) {
+var _templateObject$A, _templateObject2$s, _templateObject3$m, _templateObject4$i, _templateObject5$g;
+var Description = styled.div(_templateObject$A || (_templateObject$A = _taggedTemplateLiteral(["\n  font-family: Manrope;\n  font-size: 12px;\n  line-height: 170%;\n  color: rgba(255, 255, 255, 0.55);\n  align-self: flex-start;\n  font-weight: normal;\n"])));
+var CounterWrapper = styled.div(_templateObject2$s || (_templateObject2$s = _taggedTemplateLiteral(["\n  position: relative;\n  width: 100%;\n  height: 81px;\n  background: ", ";\n  border: 1px solid rgba(255, 255, 255, 0.03);\n  display: flex;\n  border-radius: 10px;\n  padding: 15px 0px 21px 20px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.backgrounds.secondary;
 });
-var CapDescriptionWrapper = styled.div.withConfig({
-  displayName: "CapCounter__CapDescriptionWrapper",
-  componentId: "sc-h5yjzn-2"
-})(["color:", ";display:flex;flex-direction:column;justify-content:space-around;font-weight:bold;"], function (_ref2) {
+var CapDescriptionWrapper = styled.div(_templateObject3$m || (_templateObject3$m = _taggedTemplateLiteral(["\n  color: ", ";\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n  font-weight: bold;\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.white;
 });
-var SoftCapWrapper = styled(CapDescriptionWrapper).withConfig({
-  displayName: "CapCounter__SoftCapWrapper",
-  componentId: "sc-h5yjzn-3"
-})(["border-right:2px solid #252530;margin-left:10px;padding-right:17px;"]);
-var HardCapWrapper = styled(CapDescriptionWrapper).withConfig({
-  displayName: "CapCounter__HardCapWrapper",
-  componentId: "sc-h5yjzn-4"
-})(["align-items:center;margin-left:32px;"]);
+var SoftCapWrapper = styled(CapDescriptionWrapper)(_templateObject4$i || (_templateObject4$i = _taggedTemplateLiteral(["\n  border-right: 2px solid #252530;\n  margin-left: 10px;\n  padding-right: 17px;\n"])));
+var HardCapWrapper = styled(CapDescriptionWrapper)(_templateObject5$g || (_templateObject5$g = _taggedTemplateLiteral(["\n  align-items: center;\n  margin-left: 32px;\n"])));
 var CapCounter = function CapCounter(_ref3) {
   var _ref3$softCap = _ref3.softCap,
     softCap = _ref3$softCap === void 0 ? 332.52 : _ref3$softCap,
@@ -15469,32 +14835,18 @@ var SpacePadSchedule = function SpacePadSchedule(_ref) {
   });
 };
 
-var MainWrapper = styled.div.withConfig({
-  displayName: "Switch__MainWrapper",
-  componentId: "sc-1bkh9t5-0"
-})(["position:relative;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,0.1);width:", ";height:34px;border-radius:10px;font-weight:bold;font-size:14px;padding:2px;z-index:99;"], function (_ref) {
+var _templateObject$z, _templateObject2$r, _templateObject3$l, _templateObject4$h, _templateObject5$f;
+var MainWrapper = styled.div(_templateObject$z || (_templateObject$z = _taggedTemplateLiteral(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: rgba(255, 255, 255, 0.1);\n  width: ", ";\n  height: 34px;\n  border-radius: 10px;\n  font-weight: bold;\n  font-size: 14px;\n  padding: 2px;\n  z-index: 99;\n"])), function (_ref) {
   var width = _ref.width;
   return width ? "".concat(width, "px") : "100%";
 });
-var SecondWrapper = styled.div.withConfig({
-  displayName: "Switch__SecondWrapper",
-  componentId: "sc-1bkh9t5-1"
-})(["position:relative;display:flex;border-radius:8px;z-index:101;width:100%;"]);
-var ToggleButton = styled.div.withConfig({
-  displayName: "Switch__ToggleButton",
-  componentId: "sc-1bkh9t5-2"
-})(["position:absolute;display:flex;height:100%;width:50%;background:rgba(255,255,255,0.85);border-radius:8px;transform:translateX(", ");transition:0.4s ease-out;z-index:100;"], function (_ref2) {
+var SecondWrapper = styled.div(_templateObject2$r || (_templateObject2$r = _taggedTemplateLiteral(["\n  position: relative;\n  display: flex;\n  border-radius: 8px;\n  z-index: 101;\n  width: 100%;\n"])));
+var ToggleButton = styled.div(_templateObject3$l || (_templateObject3$l = _taggedTemplateLiteral(["\n  position: absolute;\n  display: flex;\n  height: 100%;\n  width: 50%;\n  background: rgba(255, 255, 255, 0.85);\n  border-radius: 8px;\n  transform: translateX(", ");\n  transition: 0.4s ease-out;\n  z-index: 100;\n"])), function (_ref2) {
   var isSwitched = _ref2.isSwitched;
   return isSwitched ? "100%" : "0%";
 });
-var RowWrapper = styled.div.withConfig({
-  displayName: "Switch__RowWrapper",
-  componentId: "sc-1bkh9t5-3"
-})(["display:flex;flex-direction:row;width:100%;height:100%;"]);
-var SubscriptionWrapper = styled.div.withConfig({
-  displayName: "Switch__SubscriptionWrapper",
-  componentId: "sc-1bkh9t5-4"
-})(["display:flex;align-items:center;justify-content:center;height:30px;width:50%;border-radius:8px;cursor:pointer;z-index:101;color:", ";transition:0.4s ease-out;"], function (_ref3) {
+var RowWrapper = styled.div(_templateObject4$h || (_templateObject4$h = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n  height: 100%;\n"])));
+var SubscriptionWrapper = styled.div(_templateObject5$f || (_templateObject5$f = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 30px;\n  width: 50%;\n  border-radius: 8px;\n  cursor: pointer;\n  z-index: 101;\n  color: ", ";\n  transition: 0.4s ease-out;\n"])), function (_ref3) {
   var isActive = _ref3.isActive;
   return isActive ? "black" : "rgba(255, 255, 255, 0.25)";
 });
@@ -15540,24 +14892,16 @@ var Switch = function Switch(_ref4) {
   });
 };
 
-var SponsoredText = styled(Text).withConfig({
-  displayName: "SpacePadProject__SponsoredText",
-  componentId: "sc-8tid8r-0"
-})(["position:absolute;font-weight:normal;font-size:10px;line-height:170%;color:#12ffb8;top:-20px;left:10px;"]);
-var SpacePadProjectWrapper = styled.div.withConfig({
-  displayName: "SpacePadProject__SpacePadProjectWrapper",
-  componentId: "sc-8tid8r-1"
-})(["position:relative;width:406px;height:max-content;", "{min-width:max-content;}", "{width:100%;}"], function (_ref) {
+var _templateObject$y, _templateObject2$q, _templateObject3$k, _templateObject4$g, _templateObject5$e, _templateObject6$a, _templateObject7$6, _templateObject8$3, _templateObject9$2, _templateObject0$2, _templateObject1$2, _templateObject10$2, _templateObject11$2, _templateObject12$1;
+var SponsoredText = styled(Text)(_templateObject$y || (_templateObject$y = _taggedTemplateLiteral(["\n  position: absolute;\n  font-weight: normal;\n  font-size: 10px;\n  line-height: 170%;\n  color: #12ffb8;\n  top: -20px;\n  left: 10px;\n"])));
+var SpacePadProjectWrapper = styled.div(_templateObject2$q || (_templateObject2$q = _taggedTemplateLiteral(["\n  position: relative;\n  width: 406px;\n  height: max-content;\n  ", " {\n    min-width: max-content;\n  }\n  ", " {\n    width: 100%;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.desktop;
 }, function (_ref2) {
   var theme = _ref2.theme;
   return theme.mediaQueries.mobile;
 });
-var SpacePadProjectCard = styled.div.withConfig({
-  displayName: "SpacePadProject__SpacePadProjectCard",
-  componentId: "sc-8tid8r-2"
-})(["background:", ";border:1px solid ", ";box-sizing:border-box;border-radius:15px;max-width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:space-between;overflow:hidden;cursor:pointer;padding-bottom:24px;"], function (_ref3) {
+var SpacePadProjectCard = styled.div(_templateObject3$k || (_templateObject3$k = _taggedTemplateLiteral(["\n  background: ", ";\n  border: 1px solid ", ";\n  box-sizing: border-box;\n  border-radius: 15px;\n  max-width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: space-between;\n  overflow: hidden;\n  cursor: pointer;\n  padding-bottom: 24px;\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.backgrounds.primary;
 }, function (_ref4) {
@@ -15565,62 +14909,29 @@ var SpacePadProjectCard = styled.div.withConfig({
     highlighted = _ref4.highlighted;
   return highlighted ? "#12FFB8" : theme.colors.white3;
 });
-var ProjectPoster = styled.div.withConfig({
-  displayName: "SpacePadProject__ProjectPoster",
-  componentId: "sc-8tid8r-3"
-})(["min-height:175px;width:100%;position:relative;background:#16161d;background-image:", ";background-position:center;background-repeat:no-repeat;background-size:cover;"], function (_ref5) {
+var ProjectPoster = styled.div(_templateObject4$g || (_templateObject4$g = _taggedTemplateLiteral(["\n  min-height: 175px;\n  width: 100%;\n  position: relative;\n  background: #16161d;\n  background-image: ", ";\n  background-position: center; /* Center the image */\n  background-repeat: no-repeat; /* Do not repeat the image */\n  background-size: cover;\n"])), function (_ref5) {
   var background = _ref5.background;
   return background;
 });
-var ProjectLogo = styled.div.withConfig({
-  displayName: "SpacePadProject__ProjectLogo",
-  componentId: "sc-8tid8r-4"
-})(["position:absolute;display:flex;justify-content:center;align-items:center;width:80px;height:80px;border-radius:50%;top:138px;left:20px;background:#16161d;background-image:", ";background-position:center;background-repeat:no-repeat;background-size:cover;border:3px solid #373749;overflow:hidden;"], function (_ref6) {
+var ProjectLogo = styled.div(_templateObject5$e || (_templateObject5$e = _taggedTemplateLiteral(["\n  position: absolute;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 80px;\n  height: 80px;\n  border-radius: 50%;\n  top: 138px;\n  left: 20px;\n  background: #16161d;\n  background-image: ", ";\n  background-position: center; /* Center the image */\n  background-repeat: no-repeat; /* Do not repeat the image */\n  background-size: cover;\n  border: 3px solid #373749;\n  overflow: hidden;\n"])), function (_ref6) {
   var background = _ref6.background;
   return background;
 });
-var RoundWrapper = styled.div.withConfig({
-  displayName: "SpacePadProject__RoundWrapper",
-  componentId: "sc-8tid8r-5"
-})(["position:absolute;top:154px;right:16px;display:flex;align-items:center;justify-content:space-between;padding:10px 12px 10px 16px;background:#272730;box-sizing:border-box;border-radius:10px;width:max-content;height:40px;"]);
-var RoundNumber = styled.div.withConfig({
-  displayName: "SpacePadProject__RoundNumber",
-  componentId: "sc-8tid8r-6"
-})(["display:flex;align-items:flex-end;justify-content:space-around;color:", ";"], function (_ref7) {
+var RoundWrapper = styled.div(_templateObject6$a || (_templateObject6$a = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 154px;\n  right: 16px;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 10px 12px 10px 16px;\n  background: #272730;\n  box-sizing: border-box;\n  border-radius: 10px;\n  width: max-content;\n  height: 40px;\n"])));
+var RoundNumber = styled.div(_templateObject7$6 || (_templateObject7$6 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: flex-end;\n  justify-content: space-around;\n  color: ", ";\n"])), function (_ref7) {
   var theme = _ref7.theme;
   return theme.colors.white55;
 });
-var ProjectDetailsWrapper = styled.div.withConfig({
-  displayName: "SpacePadProject__ProjectDetailsWrapper",
-  componentId: "sc-8tid8r-7"
-})(["display:flex;flex-direction:column;align-items:flex-start;width:100%;height:100%;padding:20px;padding-top:58px;"]);
-var IDOButton = styled(Button$1).withConfig({
-  displayName: "SpacePadProject__IDOButton",
-  componentId: "sc-8tid8r-8"
-})(["width:max-content;color:", ";padding:8px 40px;"], function (_ref8) {
+var ProjectDetailsWrapper = styled.div(_templateObject8$3 || (_templateObject8$3 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  width: 100%;\n  height: 100%;\n  padding: 20px;\n  padding-top: 58px;\n"])));
+var IDOButton = styled(Button$1)(_templateObject9$2 || (_templateObject9$2 = _taggedTemplateLiteral(["\n  width: max-content;\n  color: ", ";\n  padding: 8px 40px;\n"])), function (_ref8) {
   var theme = _ref8.theme;
   return theme.colors.white;
 });
-var SwitcherRow = styled.div.withConfig({
-  displayName: "SpacePadProject__SwitcherRow",
-  componentId: "sc-8tid8r-9"
-})(["display:flex;width:100%;flex-direction:row;justify-content:flex-end;margin-bottom:16px;z-index:99999;"]);
-var DetailsColumn = styled.div.withConfig({
-  displayName: "SpacePadProject__DetailsColumn",
-  componentId: "sc-8tid8r-10"
-})(["display:flex;flex-direction:column;justify-content:space-between;padding:16px 0px;width:100%;height:108px !important;border-top:1px solid #272730;border-bottom:1px solid #272730;margin:16px 0px;"]);
-var CommingSoonWrapper = styled.div.withConfig({
-  displayName: "SpacePadProject__CommingSoonWrapper",
-  componentId: "sc-8tid8r-11"
-})(["display:flex;flex-direction:column;justify-content:center;align-items:center;padding:38px 0px;height:max-content;width:100%;margin-bottom:30px;"]);
-var CommingSoonTitle = styled(Text).withConfig({
-  displayName: "SpacePadProject__CommingSoonTitle",
-  componentId: "sc-8tid8r-12"
-})(["font-weight:bold;font-size:26px;line-height:130%;color:#7763f6;text-align:center;margin-top:24px;"]);
-var MockedProgressComponent = styled.div.withConfig({
-  displayName: "SpacePadProject__MockedProgressComponent",
-  componentId: "sc-8tid8r-13"
-})(["width:100%;height:75px;"]);
+var SwitcherRow = styled.div(_templateObject0$2 || (_templateObject0$2 = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  flex-direction: row;\n  justify-content: flex-end;\n  margin-bottom: 16px;\n  z-index: 99999;\n"])));
+var DetailsColumn = styled.div(_templateObject1$2 || (_templateObject1$2 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  padding: 16px 0px;\n  width: 100%;\n  height: 108px !important;\n  border-top: 1px solid #272730;\n  border-bottom: 1px solid #272730;\n  margin: 16px 0px;\n"])));
+var CommingSoonWrapper = styled.div(_templateObject10$2 || (_templateObject10$2 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  padding: 38px 0px;\n  height: max-content;\n  width: 100%;\n  margin-bottom: 30px;\n"])));
+var CommingSoonTitle = styled(Text)(_templateObject11$2 || (_templateObject11$2 = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 26px;\n  line-height: 130%;\n  color: #7763f6;\n  text-align: center;\n  margin-top: 24px;\n"])));
+var MockedProgressComponent = styled.div(_templateObject12$1 || (_templateObject12$1 = _taggedTemplateLiteral(["\n  width: 100%;\n  height: 75px;\n"])));
 var SpacePadProject = function SpacePadProject(props) {
   var spacePadData = props.spacePadData,
     spaceRound = props.spaceRound,
@@ -15836,10 +15147,8 @@ var SpacePadProject = function SpacePadProject(props) {
   });
 };
 
-var AccountInfoWrapper = styled.div.withConfig({
-  displayName: "AccountInfo__AccountInfoWrapper",
-  componentId: "sc-1p04ez8-0"
-})(["position:relative;background:", ";border:1px solid ", ";border-radius:10px;padding:42px 30px;display:flex;flex-direction:row;justify-content:space-between;align-items:center;", "{flex-direction:column;padding:30px 20px;}"], function (_ref) {
+var _templateObject$x, _templateObject2$p, _templateObject3$j, _templateObject4$f, _templateObject5$d, _templateObject6$9, _templateObject7$5, _templateObject8$2, _templateObject9$1, _templateObject0$1, _templateObject1$1, _templateObject10$1, _templateObject11$1, _templateObject12, _templateObject13;
+var AccountInfoWrapper = styled.div(_templateObject$x || (_templateObject$x = _taggedTemplateLiteral(["\n  position: relative;\n  background: ", ";\n  border: 1px solid ", ";\n  border-radius: 10px;\n  padding: 42px 30px;\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n  ", " {\n    flex-direction: column;\n    padding: 30px 20px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.card;
 }, function (_ref2) {
@@ -15849,20 +15158,14 @@ var AccountInfoWrapper = styled.div.withConfig({
   var theme = _ref3.theme;
   return theme.mediaQueries.tablet;
 });
-var StyledAccountInfo = styled.div.withConfig({
-  displayName: "AccountInfo__StyledAccountInfo",
-  componentId: "sc-1p04ez8-1"
-})(["display:flex;flex-direction:column;align-items:space-between;justify-content:flex-start;margin-left:28px;", "{margin-bottom:", ";margin-left:0px;}"], function (_ref4) {
+var StyledAccountInfo = styled.div(_templateObject2$p || (_templateObject2$p = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: space-between;\n  justify-content: flex-start;\n  margin-left: 28px;\n  ", " {\n    margin-bottom: ", ";\n    margin-left: 0px;\n  }\n"])), function (_ref4) {
   var theme = _ref4.theme;
   return theme.mediaQueries.mobile;
 }, function (_ref5) {
   var connectionInProgress = _ref5.connectionInProgress;
   return connectionInProgress ? "0px" : "24px";
 });
-var UserComponent = styled.p.withConfig({
-  displayName: "AccountInfo__UserComponent",
-  componentId: "sc-1p04ez8-2"
-})(["display:flex;flex-direction:row;align-items:center;", "{width:100%;margin-bottom:", ";}", "{width:100%;justify-content:", ";}"], function (_ref6) {
+var UserComponent = styled.p(_templateObject3$j || (_templateObject3$j = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  ", " {\n    width: 100%;\n    margin-bottom: ", ";\n  }\n  ", " {\n    width: 100%;\n    justify-content: ", ";\n  }\n"])), function (_ref6) {
   var theme = _ref6.theme;
   return theme.mediaQueries.tablet;
 }, function (_ref7) {
@@ -15885,10 +15188,7 @@ var UserComponent = styled.p.withConfig({
 //   border-radius: 23px;
 //   background: #2b2b38;
 // `;
-var AccountComponent = styled.div.withConfig({
-  displayName: "AccountInfo__AccountComponent",
-  componentId: "sc-1p04ez8-3"
-})(["display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between;border:1px solid ", ";border-radius:10px;background:", ";padding:16px 24px;margin-left:31px;", "{width:100%;align-items:center;margin-left:0px;}"], function (_ref0) {
+var AccountComponent = styled.div(_templateObject4$f || (_templateObject4$f = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n  justify-content: space-between;\n  border: 1px solid ", ";\n  border-radius: 10px;\n  background: ", ";\n  padding: 16px 24px;\n  margin-left: 31px;\n  ", " {\n    width: 100%;\n    align-items: center;\n    margin-left: 0px;\n  }\n"])), function (_ref0) {
   var theme = _ref0.theme;
   return theme.colors.white3;
 }, function (_ref1) {
@@ -15898,38 +15198,23 @@ var AccountComponent = styled.div.withConfig({
   var theme = _ref10.theme;
   return theme.mediaQueries.tablet;
 });
-var BalanceText = styled(Text).withConfig({
-  displayName: "AccountInfo__BalanceText",
-  componentId: "sc-1p04ez8-4"
-})(["margin-left:50px;", "{margin-left:0px;}"], function (_ref11) {
+var BalanceText = styled(Text)(_templateObject5$d || (_templateObject5$d = _taggedTemplateLiteral(["\n  margin-left: 50px;\n  ", " {\n    margin-left: 0px;\n  }\n"])), function (_ref11) {
   var theme = _ref11.theme;
   return theme.mediaQueries.tablet;
 });
-var AccountTitle = styled(Text).withConfig({
-  displayName: "AccountInfo__AccountTitle",
-  componentId: "sc-1p04ez8-5"
-})(["", "{display:none;}"], function (_ref12) {
+var AccountTitle = styled(Text)(_templateObject6$9 || (_templateObject6$9 = _taggedTemplateLiteral(["\n  ", " {\n    display: none;\n  }\n"])), function (_ref12) {
   var theme = _ref12.theme;
   return theme.mediaQueries.mobile;
 });
-var StyledUserAvatar = styled(Icon$20).withConfig({
-  displayName: "AccountInfo__StyledUserAvatar",
-  componentId: "sc-1p04ez8-6"
-})(["width:44px;height:44px;z-index:99999;", "{display:none;}"], function (_ref13) {
+var StyledUserAvatar = styled(Icon$20)(_templateObject7$5 || (_templateObject7$5 = _taggedTemplateLiteral(["\n  width: 44px;\n  height: 44px;\n  z-index: 99999;\n  ", " {\n    display: none;\n  }\n"])), function (_ref13) {
   var theme = _ref13.theme;
   return theme.mediaQueries.mobile;
 });
-var StyledMobileUserAvatar = styled(Icon$1$).withConfig({
-  displayName: "AccountInfo__StyledMobileUserAvatar",
-  componentId: "sc-1p04ez8-7"
-})(["width:44px;height:44px;display:none;", "{display:block;}"], function (_ref14) {
+var StyledMobileUserAvatar = styled(Icon$1$)(_templateObject8$2 || (_templateObject8$2 = _taggedTemplateLiteral(["\n  width: 44px;\n  height: 44px;\n  display: none;\n  ", " {\n    display: block;\n  }\n"])), function (_ref14) {
   var theme = _ref14.theme;
   return theme.mediaQueries.mobile;
 });
-var UserUpdateComponent = styled.div.withConfig({
-  displayName: "AccountInfo__UserUpdateComponent",
-  componentId: "sc-1p04ez8-8"
-})(["right:0px;top:-54px;position:absolute;display:", ";flex-direction:row;align-items:center;", "{display:", ";position:relative;top:0px;flex-direction:column;justify-content:space-between;align-items:flex-end;}"], function (_ref15) {
+var UserUpdateComponent = styled.div(_templateObject9$1 || (_templateObject9$1 = _taggedTemplateLiteral(["\n  right: 0px;\n  top: -54px;\n  position: absolute;\n  display: ", ";\n  flex-direction: row;\n  align-items: center;\n  ", " {\n    display: ", ";\n    position: relative;\n    top: 0px;\n    flex-direction: column;\n    justify-content: space-between;\n    align-items: flex-end;\n  }\n"])), function (_ref15) {
   var mobile = _ref15.mobile;
   return mobile ? "none" : "flex";
 }, function (_ref16) {
@@ -15939,10 +15224,7 @@ var UserUpdateComponent = styled.div.withConfig({
   var mobile = _ref17.mobile;
   return mobile ? "flex" : "none";
 });
-var MobileUserAndUpdate = styled.div.withConfig({
-  displayName: "AccountInfo__MobileUserAndUpdate",
-  componentId: "sc-1p04ez8-9"
-})(["display:none;", "{display:flex;width:100%;flex-direction:row;align-items:center;justify-content:", ";margin-bottom:", ";}"], function (_ref18) {
+var MobileUserAndUpdate = styled.div(_templateObject0$1 || (_templateObject0$1 = _taggedTemplateLiteral(["\n  display: none;\n  ", " {\n    display: flex;\n    width: 100%;\n    flex-direction: row;\n    align-items: center;\n    justify-content: ", ";\n    margin-bottom: ", ";\n  }\n"])), function (_ref18) {
   var theme = _ref18.theme;
   return theme.mediaQueries.mobile;
 }, function (_ref19) {
@@ -15952,41 +15234,26 @@ var MobileUserAndUpdate = styled.div.withConfig({
   var connectionInProgress = _ref20.connectionInProgress;
   return connectionInProgress ? "10px" : "39px";
 });
-var RefreshButton = styled.div.withConfig({
-  displayName: "AccountInfo__RefreshButton",
-  componentId: "sc-1p04ez8-10"
-})(["display:flex;flex-direction:row;padding:4px 16px;justify-content:space-between;align-items:center;color:", ";font-weight:bold;font-size:14px;line-height:140%;background:#2b2b38;border-radius:7px;cursor:pointer;"], function (_ref21) {
+var RefreshButton = styled.div(_templateObject1$1 || (_templateObject1$1 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  padding: 4px 16px;\n  justify-content: space-between;\n  align-items: center;\n  color: ", ";\n  font-weight: bold;\n  font-size: 14px;\n  line-height: 140%;\n  background: #2b2b38;\n  border-radius: 7px;\n  cursor: pointer;\n"])), function (_ref21) {
   var theme = _ref21.theme;
   return theme.colors.white;
 });
-var StyledSyncIcon = styled.div.withConfig({
-  displayName: "AccountInfo__StyledSyncIcon",
-  componentId: "sc-1p04ez8-11"
-})(["margin-right:10px;height:20px;@keyframes spin{100%{transform:rotate(1turn);}};", "}"], function (_ref22) {
+var StyledSyncIcon = styled.div(_templateObject10$1 || (_templateObject10$1 = _taggedTemplateLiteral(["\n  margin-right: 10px;\n  height: 20px;\n  @keyframes spin {\n    100% {\n      transform: rotate(1turn);\n    }\n  };\n  ", "\n}\n"])), function (_ref22) {
   var syncing = _ref22.syncing;
   return syncing && "animation: spin 2s linear infinite;";
 });
-var UpdatedText = styled(Text).withConfig({
-  displayName: "AccountInfo__UpdatedText",
-  componentId: "sc-1p04ez8-12"
-})(["font-size:12px;line-height:170%;margin-bottom:0px;margin-right:14px;color:", ";", "{margin-bottom:10px;margin-right:0px;}"], function (_ref23) {
+var UpdatedText = styled(Text)(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteral(["\n  font-size: 12px;\n  line-height: 170%;\n  margin-bottom: 0px;\n  margin-right: 14px;\n  color: ", ";\n  ", " {\n    margin-bottom: 10px;\n    margin-right: 0px;\n  }\n"])), function (_ref23) {
   var theme = _ref23.theme;
   return theme.colors.white55;
 }, function (_ref24) {
   var theme = _ref24.theme;
   return theme.mediaQueries.mobile;
 });
-var ValuesDetails = styled.div.withConfig({
-  displayName: "AccountInfo__ValuesDetails",
-  componentId: "sc-1p04ez8-13"
-})(["display:flex;justify-content:flex-end;align-items:center;", "{flex-direction:column-reverse;width:100%;}"], function (_ref25) {
+var ValuesDetails = styled.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n  ", " {\n    flex-direction: column-reverse;\n    width: 100%;\n  }\n"])), function (_ref25) {
   var theme = _ref25.theme;
   return theme.mediaQueries.tablet;
 });
-var LoadingDots = styled.p.withConfig({
-  displayName: "AccountInfo__LoadingDots",
-  componentId: "sc-1p04ez8-14"
-})(["width:50px;color:white;font-size:26px;text-align:", ";&::after{content:\" .\";animation:dots 1.5s steps(5,end) infinite;}@keyframes dots{0%,20%{color:rgba(0,0,0,0);text-shadow:0.25em 0 0 rgba(0,0,0,0),0.5em 0 0 rgba(0,0,0,0);}40%{color:white;text-shadow:0.25em 0 0 rgba(0,0,0,0),0.5em 0 0 rgba(0,0,0,0);}60%{text-shadow:0.25em 0 0 white,0.5em 0 0 rgba(0,0,0,0);}80%,100%{text-shadow:0.25em 0 0 white,0.5em 0 0 white;}}"], function (_ref26) {
+var LoadingDots = styled.p(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n  width: 50px;\n  color: white;\n  font-size: 26px;\n  text-align: ", ";\n  &::after {\n    content: \" .\";\n    animation: dots 1.5s steps(5, end) infinite;\n  }\n\n  @keyframes dots {\n    0%,\n    20% {\n      color: rgba(0, 0, 0, 0);\n      text-shadow: 0.25em 0 0 rgba(0, 0, 0, 0), 0.5em 0 0 rgba(0, 0, 0, 0);\n    }\n    40% {\n      color: white;\n      text-shadow: 0.25em 0 0 rgba(0, 0, 0, 0), 0.5em 0 0 rgba(0, 0, 0, 0);\n    }\n    60% {\n      text-shadow: 0.25em 0 0 white, 0.5em 0 0 rgba(0, 0, 0, 0);\n    }\n    80%,\n    100% {\n      text-shadow: 0.25em 0 0 white, 0.5em 0 0 white;\n    }\n  }\n"])), function (_ref26) {
   var centered = _ref26.centered;
   return centered ? "center" : "left";
 });
@@ -16220,61 +15487,23 @@ var Icon$C = function Icon() {
   });
 };
 
-var Wrapper$2 = styled.div.withConfig({
-  displayName: "TierCard__Wrapper",
-  componentId: "sc-kcmda0-0"
-})(["height:", ";width:350px;padding:24px;background:#191921;border-radius:10px;@media screen and (max-width:1180px){height:auto;}"], function (_ref) {
+var _templateObject$w, _templateObject2$o, _templateObject3$i, _templateObject4$e, _templateObject5$c, _templateObject6$8, _templateObject7$4, _templateObject8$1, _templateObject9, _templateObject0, _templateObject1, _templateObject10, _templateObject11;
+var Wrapper$2 = styled.div(_templateObject$w || (_templateObject$w = _taggedTemplateLiteral(["\n    height: ", ";\n    width: 350px;\n    padding: 24px;\n    background: #191921;\n    border-radius: 10px;\n    @media screen and (max-width: 1180px) {\n      height: auto;\n    }\n"])), function (_ref) {
   var height = _ref.height;
   return height ? "".concat(height, "px") : "auto";
 });
-var Header = styled.div.withConfig({
-  displayName: "TierCard__Header",
-  componentId: "sc-kcmda0-1"
-})(["display:flex;align-items:center;justify-content:space-between;"]);
-var PoolWeightWrapper = styled.div.withConfig({
-  displayName: "TierCard__PoolWeightWrapper",
-  componentId: "sc-kcmda0-2"
-})(["width:auto;display:flex;flex-direction:column;"]);
-var PoolWeightText = styled(Text).withConfig({
-  displayName: "TierCard__PoolWeightText",
-  componentId: "sc-kcmda0-3"
-})(["color:rgba(255,255,255,0.55);"]);
-var CssPowerText = styled(Text).withConfig({
-  displayName: "TierCard__CssPowerText",
-  componentId: "sc-kcmda0-4"
-})(["color:rgba(255,255,255,0.55);"]);
-var RequirementDescripton = styled(Text).withConfig({
-  displayName: "TierCard__RequirementDescripton",
-  componentId: "sc-kcmda0-5"
-})(["color:rgba(255,255,255,0.55);"]);
-var BulletPointText = styled(Text).withConfig({
-  displayName: "TierCard__BulletPointText",
-  componentId: "sc-kcmda0-6"
-})(["color:rgba(255,255,255,0.55);margin-left:20px;"]);
-var CssPowerWrapper = styled.div.withConfig({
-  displayName: "TierCard__CssPowerWrapper",
-  componentId: "sc-kcmda0-7"
-})(["display:flex;justify-content:flex-start;margin-top:16px;margin-bottom:30px;"]);
-var CssPowerValueWrapper = styled.div.withConfig({
-  displayName: "TierCard__CssPowerValueWrapper",
-  componentId: "sc-kcmda0-8"
-})(["display:flex;flex-direction:column;margin-left:12px;"]);
-var RequirementsDescriptionWrapper = styled.div.withConfig({
-  displayName: "TierCard__RequirementsDescriptionWrapper",
-  componentId: "sc-kcmda0-9"
-})(["display:flex;flex-direction:column;margin-top:32px;margin-bottom:16px;gap:16px;"]);
-var BulletPointLine = styled(Text).withConfig({
-  displayName: "TierCard__BulletPointLine",
-  componentId: "sc-kcmda0-10"
-})(["display:flex;align-items:center;margin-bottom:8px;"]);
-var BulletPointIconWrapper = styled.div.withConfig({
-  displayName: "TierCard__BulletPointIconWrapper",
-  componentId: "sc-kcmda0-11"
-})(["display:flex;"]);
-var AdditionalInfo = styled(Text).withConfig({
-  displayName: "TierCard__AdditionalInfo",
-  componentId: "sc-kcmda0-12"
-})(["color:rgba(255,255,255,0.55);margin-top:32px;"]);
+var Header = styled.div(_templateObject2$o || (_templateObject2$o = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"])));
+var PoolWeightWrapper = styled.div(_templateObject3$i || (_templateObject3$i = _taggedTemplateLiteral(["\n  width: auto;\n  display: flex;\n  flex-direction: column;\n"])));
+var PoolWeightText = styled(Text)(_templateObject4$e || (_templateObject4$e = _taggedTemplateLiteral(["\n  color: rgba(255, 255, 255, 0.55);\n"])));
+var CssPowerText = styled(Text)(_templateObject5$c || (_templateObject5$c = _taggedTemplateLiteral(["\n  color: rgba(255, 255, 255, 0.55);\n"])));
+var RequirementDescripton = styled(Text)(_templateObject6$8 || (_templateObject6$8 = _taggedTemplateLiteral(["\ncolor: rgba(255, 255, 255, 0.55);\n"])));
+var BulletPointText = styled(Text)(_templateObject7$4 || (_templateObject7$4 = _taggedTemplateLiteral(["\ncolor: rgba(255, 255, 255, 0.55);\nmargin-left: 20px;\n"])));
+var CssPowerWrapper = styled.div(_templateObject8$1 || (_templateObject8$1 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: flex-start;\n  margin-top: 16px;\n  margin-bottom: 30px;\n"])));
+var CssPowerValueWrapper = styled.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  margin-left: 12px;\n"])));
+var RequirementsDescriptionWrapper = styled.div(_templateObject0 || (_templateObject0 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  margin-top: 32px;\n  margin-bottom: 16px;\n  gap: 16px;\n"])));
+var BulletPointLine = styled(Text)(_templateObject1 || (_templateObject1 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  margin-bottom: 8px;\n"])));
+var BulletPointIconWrapper = styled.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n  display: flex;\n"])));
+var AdditionalInfo = styled(Text)(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n  color: rgba(255, 255, 255, 0.55);\n  margin-top: 32px;\n"])));
 var TierCard = function TierCard(_ref2) {
   var tierNumber = _ref2.tierNumber,
     poolWeightPercentage = _ref2.poolWeightPercentage,
@@ -16343,33 +15572,16 @@ var TierCard = function TierCard(_ref2) {
   });
 };
 
-var Wrapper$1 = styled.div.withConfig({
-  displayName: "IdoParticipationStep__Wrapper",
-  componentId: "sc-8hnj4a-0"
-})(["display:flex;flex-direction:column;align-items:center;width:300px;"]);
-var Upper = styled.div.withConfig({
-  displayName: "IdoParticipationStep__Upper",
-  componentId: "sc-8hnj4a-1"
-})(["display:flex;flex-direction:column;width:100%;"]);
-var IconWrapper = styled.div.withConfig({
-  displayName: "IdoParticipationStep__IconWrapper",
-  componentId: "sc-8hnj4a-2"
-})(["margin:0 auto;max-width:220px;max-height:160px;"]);
-var StepNumber = styled.p.withConfig({
-  displayName: "IdoParticipationStep__StepNumber",
-  componentId: "sc-8hnj4a-3"
-})(["display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid rgba(255,255,255,0.03);color:#ffffff;opacity:0.55;border-radius:10px;background:#1d1d26;"]);
-var StepDescription = styled(Text).withConfig({
-  displayName: "IdoParticipationStep__StepDescription",
-  componentId: "sc-8hnj4a-4"
-})(["text-align:center;color:rgba(255,255,255,0.55);max-width:229px;", "{font-size:14px;}"], function (_ref) {
+var _templateObject$v, _templateObject2$n, _templateObject3$h, _templateObject4$d, _templateObject5$b, _templateObject6$7;
+var Wrapper$1 = styled.div(_templateObject$v || (_templateObject$v = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  width: 300px;\n"])));
+var Upper = styled.div(_templateObject2$n || (_templateObject2$n = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n"])));
+var IconWrapper = styled.div(_templateObject3$h || (_templateObject3$h = _taggedTemplateLiteral(["\n  margin: 0 auto;\n  max-width: 220px;\n  max-height: 160px;\n"])));
+var StepNumber = styled.p(_templateObject4$d || (_templateObject4$d = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 40px;\n  height: 40px;\n  border: 1px solid rgba(255, 255, 255, 0.03);\n  color: #ffffff;\n  opacity: 0.55;\n  border-radius: 10px;\n  background: #1d1d26;\n"])));
+var StepDescription = styled(Text)(_templateObject5$b || (_templateObject5$b = _taggedTemplateLiteral(["\n  text-align: center;\n  color: rgba(255, 255, 255, 0.55);\n  max-width: 229px;\n  ", " {\n    font-size: 14px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.mobile;
 });
-var StepLowerDescription = styled(StepDescription).withConfig({
-  displayName: "IdoParticipationStep__StepLowerDescription",
-  componentId: "sc-8hnj4a-5"
-})(["margin-top:20px;"]);
+var StepLowerDescription = styled(StepDescription)(_templateObject6$7 || (_templateObject6$7 = _taggedTemplateLiteral(["\n  margin-top: 20px;\n"])));
 var getIconByStepNumber = function getIconByStepNumber(stepNumer) {
   switch (stepNumer) {
     case 1:
@@ -16422,35 +15634,21 @@ var IdoParticipationStep = function IdoParticipationStep(_ref2) {
   });
 };
 
-var UserTiersWrapper = styled.div.withConfig({
-  displayName: "UserTiers__UserTiersWrapper",
-  componentId: "sc-ge61bg-0"
-})(["display:flex;flex-direction:column;height:max-content;background:", ";border-radius:16px;padding:32px;"], function (_ref) {
+var _templateObject$u, _templateObject2$m, _templateObject3$g, _templateObject4$c, _templateObject5$a, _templateObject6$6, _templateObject7$3;
+var UserTiersWrapper = styled.div(_templateObject$u || (_templateObject$u = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  height: max-content;\n  background: ", ";\n  border-radius: 16px;\n  padding: 32px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.card;
 });
-var TiersTitle = styled(Text).withConfig({
-  displayName: "UserTiers__TiersTitle",
-  componentId: "sc-ge61bg-1"
-})(["font-weight:bold;font-size:32px;line-height:130%;color:", ";margin-bottom:20px;"], function (_ref2) {
+var TiersTitle = styled(Text)(_templateObject2$m || (_templateObject2$m = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 32px;\n  line-height: 130%;\n  color: ", ";\n  margin-bottom: 20px;\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.white;
 });
-var Column = styled.div.withConfig({
-  displayName: "UserTiers__Column",
-  componentId: "sc-ge61bg-2"
-})(["display:flex;flex-direction:column;justify-content:flex-start;"]);
-var TierRow = styled(Box).withConfig({
-  displayName: "UserTiers__TierRow",
-  componentId: "sc-ge61bg-3"
-})(["width:100%;display:flex;justify-content:space-between;align-items:center;padding:10px 0px;border-bottom:", ";"], function (_ref3) {
+var Column = styled.div(_templateObject3$g || (_templateObject3$g = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n"])));
+var TierRow = styled(Box)(_templateObject4$c || (_templateObject4$c = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 10px 0px;\n  border-bottom: ", ";\n"])), function (_ref3) {
   var bordered = _ref3.bordered;
   return bordered && "1px solid #272730";
 });
-var TierNumberText = styled(Text).withConfig({
-  displayName: "UserTiers__TierNumberText",
-  componentId: "sc-ge61bg-4"
-})(["font-size:14px;line-height:160%;color:", ";font-weight:", ";position:relative;"], function (_ref4) {
+var TierNumberText = styled(Text)(_templateObject5$a || (_templateObject5$a = _taggedTemplateLiteral(["\n  font-size: 14px;\n  line-height: 160%;\n  color: ", ";\n  font-weight: ", ";\n  position: relative;\n"])), function (_ref4) {
   var theme = _ref4.theme,
     active = _ref4.active;
   return active ? theme.colors.white : "#818c92";
@@ -16458,14 +15656,8 @@ var TierNumberText = styled(Text).withConfig({
   var active = _ref5.active;
   return active ? "bold" : "normal";
 });
-var TierInfoTag = styled(StyledTag).withConfig({
-  displayName: "UserTiers__TierInfoTag",
-  componentId: "sc-ge61bg-5"
-})(["font-size:11px;height:max-content;margin-right:5px;"]);
-var TagsRow = styled.div.withConfig({
-  displayName: "UserTiers__TagsRow",
-  componentId: "sc-ge61bg-6"
-})(["position:absolute;left:45px;display:flex;"]);
+var TierInfoTag = styled(StyledTag)(_templateObject6$6 || (_templateObject6$6 = _taggedTemplateLiteral(["\n  font-size: 11px;\n  height: max-content;\n  margin-right: 5px;\n"])));
+var TagsRow = styled.div(_templateObject7$3 || (_templateObject7$3 = _taggedTemplateLiteral(["\n  position: absolute;\n  left: 45px;\n  display: flex;\n"])));
 var UserTiers = function UserTiers(props) {
   var tiers = props.tiers,
     _props$currentUserTie = props.currentUserTier,
@@ -16533,10 +15725,8 @@ var UserTiers = function UserTiers(props) {
   });
 };
 
-var StyledMultiValue = styled.div.withConfig({
-  displayName: "SpacePadKeyMetrics__StyledMultiValue",
-  componentId: "sc-11c5hed-0"
-})(["display:flex;justify-content:flex-end;"]);
+var _templateObject$t;
+var StyledMultiValue = styled.div(_templateObject$t || (_templateObject$t = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: flex-end;\n"])));
 var SpacePadKeyMetrics = function SpacePadKeyMetrics(_ref) {
   var spaceRound = _ref.spaceRound,
     useEndTime = _ref.useEndTime,
@@ -16570,14 +15760,9 @@ var SpacePadKeyMetrics = function SpacePadKeyMetrics(_ref) {
   });
 };
 
-var LaunchWrapper = styled.div.withConfig({
-  displayName: "SpacePadLaunch__LaunchWrapper",
-  componentId: "sc-8kj88a-0"
-})(["width:100%;background:#1d1d26;padding:44px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;margin-top:70px;"]);
-var ForProjects = styled(Text).withConfig({
-  displayName: "SpacePadLaunch__ForProjects",
-  componentId: "sc-8kj88a-1"
-})(["margin:0 auto;width:135px;text-align:center;border:1px solid ", ";color:", ";line-height:28px;border-radius:10px;"], function (_ref) {
+var _templateObject$s, _templateObject2$l, _templateObject3$f, _templateObject4$b, _templateObject5$9;
+var LaunchWrapper = styled.div(_templateObject$s || (_templateObject$s = _taggedTemplateLiteral(["\n  width: 100%;\n  background: #1d1d26;\n  padding: 44px;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  align-items: center;\n  margin-top: 70px;\n"])));
+var ForProjects = styled(Text)(_templateObject2$l || (_templateObject2$l = _taggedTemplateLiteral(["\n  margin: 0 auto;\n  width: 135px;\n  text-align: center;\n  border: 1px solid ", ";\n  color: ", ";\n  line-height: 28px;\n  border-radius: 10px;\n"])), function (_ref) {
   var theme = _ref.theme,
     mainColor = _ref.mainColor;
   return mainColor || theme.colors.darkPurple;
@@ -16586,18 +15771,9 @@ var ForProjects = styled(Text).withConfig({
     mainColor = _ref2.mainColor;
   return mainColor || theme.colors.darkPurple;
 });
-var LaunchHeader = styled(Text).withConfig({
-  displayName: "SpacePadLaunch__LaunchHeader",
-  componentId: "sc-8kj88a-2"
-})(["margin:20px 0;text-align:center;@media screen and (max-width:760px){width:310px;font-size:26px;}"]);
-var LaunchDescription = styled(Text).withConfig({
-  displayName: "SpacePadLaunch__LaunchDescription",
-  componentId: "sc-8kj88a-3"
-})(["width:630px;color:rgba(255,255,255,0.55);text-align:center;@media screen and (max-width:760px){width:310px;}"]);
-var ApplyForIdoButton = styled(Button$1).withConfig({
-  displayName: "SpacePadLaunch__ApplyForIdoButton",
-  componentId: "sc-8kj88a-4"
-})(["width:161px;height:44px;border-radius:10px;background:#12ffb8;margin-top:45px;"]);
+var LaunchHeader = styled(Text)(_templateObject3$f || (_templateObject3$f = _taggedTemplateLiteral(["\n  margin: 20px 0;\n  text-align: center;\n  @media screen and (max-width: 760px) {\n    width: 310px;\n    font-size: 26px;\n  }\n"])));
+var LaunchDescription = styled(Text)(_templateObject4$b || (_templateObject4$b = _taggedTemplateLiteral(["\n  width: 630px;\n  color: rgba(255, 255, 255, 0.55);\n  text-align: center;\n  @media screen and (max-width: 760px) {\n    width: 310px;\n  }\n"])));
+var ApplyForIdoButton = styled(Button$1)(_templateObject5$9 || (_templateObject5$9 = _taggedTemplateLiteral(["\n  width: 161px;\n  height: 44px;\n  border-radius: 10px;\n  background: #12ffb8;\n  margin-top: 45px;\n"])));
 var SpacePadLaunch = function SpacePadLaunch(_ref3) {
   var title = _ref3.title,
     description = _ref3.description,
@@ -16626,22 +15802,15 @@ var SpacePadLaunch = function SpacePadLaunch(_ref3) {
   });
 };
 
-var ReferralTitle = styled(Text).withConfig({
-  displayName: "components__ReferralTitle",
-  componentId: "sc-q2pgu9-0"
-})(["font-weight:bold;font-size:32px;line-height:130%;color:", ";"], function (_ref) {
+var _templateObject$r;
+var ReferralTitle = styled(Text)(_templateObject$r || (_templateObject$r = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 32px;\n  line-height: 130%;\n  color: ", ";\n"])), function (_ref) {
   var fontColor = _ref.fontColor;
   return fontColor || "#ffffff";
 });
 
-var ReferralBannerWrapper = styled.div.withConfig({
-  displayName: "ReferralBanner__ReferralBannerWrapper",
-  componentId: "sc-3cib5z-0"
-})(["display:flex;flex-direction:column;"]);
-var InvitationDescription = styled(Text).withConfig({
-  displayName: "ReferralBanner__InvitationDescription",
-  componentId: "sc-3cib5z-1"
-})(["font-weight:normal;font-size:16px;line-height:24px;color:#818c92;margin-bottom:24px;"]);
+var _templateObject$q, _templateObject2$k;
+var ReferralBannerWrapper = styled.div(_templateObject$q || (_templateObject$q = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n"])));
+var InvitationDescription = styled(Text)(_templateObject2$k || (_templateObject2$k = _taggedTemplateLiteral(["\n  font-weight: normal;\n  font-size: 16px;\n  line-height: 24px;\n  color: #818c92;\n  margin-bottom: 24px;\n"])));
 var ReferralBanner = function ReferralBanner(props) {
   var refFee = props.refFee,
     onReadMore = props.onReadMore,
@@ -16706,36 +15875,19 @@ var copyValueToClipboard = function copyValueToClipboard(value, copyCallback) {
   }, 3000);
 };
 
-var TableCard = styled(Card).withConfig({
-  displayName: "CopyLinkCard__TableCard",
-  componentId: "sc-wd2wdf-0"
-})(["border:none;padding:15px;width:100%;margin-bottom:24px;", "{padding:25px 30px;}"], function (_ref) {
+var _templateObject$p, _templateObject2$j, _templateObject3$e, _templateObject4$a, _templateObject5$8, _templateObject6$5;
+var TableCard = styled(Card)(_templateObject$p || (_templateObject$p = _taggedTemplateLiteral(["\n  border: none;\n  padding: 15px;\n  width: 100%;\n  margin-bottom: 24px;\n  ", " {\n    padding: 25px 30px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.sm;
 });
-var CopyLinkCardWrapper = styled(TableCard).withConfig({
-  displayName: "CopyLinkCard__CopyLinkCardWrapper",
-  componentId: "sc-wd2wdf-1"
-})(["background:#1d1d26;display:flex;flex-direction:column;justify-content:space-between;"]);
-var MyReferralCard = styled(TableCard).withConfig({
-  displayName: "CopyLinkCard__MyReferralCard",
-  componentId: "sc-wd2wdf-2"
-})(["background:#16161d;display:flex;justify-content:space-between;align-items:center;grid-column:span 6;", "{grid-column:span 7;}"], function (_ref2) {
+var CopyLinkCardWrapper = styled(TableCard)(_templateObject2$j || (_templateObject2$j = _taggedTemplateLiteral(["\n  background: #1d1d26;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n"])));
+var MyReferralCard = styled(TableCard)(_templateObject3$e || (_templateObject3$e = _taggedTemplateLiteral(["\n  background: #16161d;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  grid-column: span 6;\n  ", " {\n    grid-column: span 7;\n  }\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.mediaQueries.sm;
 });
-var RefLink = styled(Text).withConfig({
-  displayName: "CopyLinkCard__RefLink",
-  componentId: "sc-wd2wdf-3"
-})(["display:inline;align-items:center;text-overflow:ellipsis;width:80%;overflow:hidden;white-space:nowrap;height:max-content;font-weight:600;font-size:16px;line-height:24px;"]);
-var SocialRow = styled.div.withConfig({
-  displayName: "CopyLinkCard__SocialRow",
-  componentId: "sc-wd2wdf-4"
-})(["display:flex;align-items:center;justify-content:flex-start;"]);
-var ShareText = styled(Text).withConfig({
-  displayName: "CopyLinkCard__ShareText",
-  componentId: "sc-wd2wdf-5"
-})(["font-weight:700;font-size:14px;line-height:170%;color:#ffffff;margin-right:32px;"]);
+var RefLink = styled(Text)(_templateObject4$a || (_templateObject4$a = _taggedTemplateLiteral(["\n  display: inline;\n  align-items: center;\n  text-overflow: ellipsis;\n  width: 80%;\n  overflow: hidden;\n  white-space: nowrap;\n  height: max-content;\n  font-weight: 600;\n  font-size: 16px;\n  line-height: 24px;\n"])));
+var SocialRow = styled.div(_templateObject5$8 || (_templateObject5$8 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n"])));
+var ShareText = styled(Text)(_templateObject6$5 || (_templateObject6$5 = _taggedTemplateLiteral(["\n  font-weight: 700;\n  font-size: 14px;\n  line-height: 170%;\n  color: #ffffff;\n  margin-right: 32px;\n"])));
 var CopyLinkCard = function CopyLinkCard(_ref3) {
   var refLink = _ref3.refLink;
   var _useState = useState(false),
@@ -17481,17 +16633,12 @@ var IconModule = /*#__PURE__*/Object.freeze({
   YouTubeIcon: Icon$e
 });
 
-var StyledLink = styled(Link$1).withConfig({
-  displayName: "Logo__StyledLink",
-  componentId: "sc-1u6975p-0"
-})(["display:flex;display:-webkit-flex;align-items:center;-webkit-align-items:center;.mobile-icon{width:32px;margin-left:10px;}.desktop-icon{width:156px;display:none;", "{display:block;}}margin-left:0px;"], function (_ref) {
+var _templateObject$o, _templateObject2$i;
+var StyledLink = styled(Link$1)(_templateObject$o || (_templateObject$o = _taggedTemplateLiteral(["\n  display: flex;\n  display: -webkit-flex;\n  align-items: center;\n  -webkit-align-items: center;\n  .mobile-icon {\n    width: 32px;\n    margin-left: 10px;\n  }\n  .desktop-icon {\n    width: 156px;\n    display: none;\n    ", " {\n      display: block;\n    }\n  }\n  margin-left: 0px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.nav;
 });
-var CoinswapLogo = styled.div.withConfig({
-  displayName: "Logo__CoinswapLogo",
-  componentId: "sc-1u6975p-1"
-})(["opacity:", ";width:", ";transition:width 0.6s,opacity 0.3s;"], function (_ref2) {
+var CoinswapLogo = styled.div(_templateObject2$i || (_templateObject2$i = _taggedTemplateLiteral(["\n  opacity: ", ";\n  width: ", ";\n  transition: width 0.6s, opacity 0.3s;\n"])), function (_ref2) {
   var isPushed = _ref2.isPushed;
   return isPushed ? 1 : 0;
 }, function (_ref3) {
@@ -17684,11 +16831,9 @@ var MENU_ACCORDION_HEIGHT = 30;
 var SIDEBAR_WIDTH_FULL = 240;
 var SIDEBAR_WIDTH_REDUCED = 70;
 
-var rainbowAnimation = keyframes(["0%,100%{background-position:0 0;}50%{background-position:100% 0;}"]);
-var LinkLabel = styled.div.withConfig({
-  displayName: "MenuEntry__LinkLabel",
-  componentId: "sc-1sxukum-0"
-})(["display:flex;flex-direction:row;color:", ";transition:all 0.7s;flex-grow:1;font-weight:700;font-size:14px;width:100%;opacity:", ";"], function (_ref) {
+var _templateObject$n, _templateObject2$h, _templateObject3$d;
+var rainbowAnimation = keyframes(_templateObject$n || (_templateObject$n = _taggedTemplateLiteral(["\n  0%,\n  100% {\n    background-position: 0 0;\n  }\n  50% {\n    background-position: 100% 0;\n  }\n"])));
+var LinkLabel = styled.div(_templateObject2$h || (_templateObject2$h = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  color: ", ";\n  transition: all 0.7s;\n  flex-grow: 1;\n  font-weight: 700;\n  font-size: 14px;\n  width: 100%;\n  opacity: ", ";\n"])), function (_ref) {
   var isPushed = _ref.isPushed,
     isActive = _ref.isActive;
   return !isPushed ? "transparent" : isActive ? "rgba(255, 255, 255, 1)" : "rgba(255, 255, 255, 0.5)";
@@ -17696,10 +16841,7 @@ var LinkLabel = styled.div.withConfig({
   var isPushed = _ref2.isPushed;
   return isPushed ? "1" : "0";
 });
-var MenuEntry = styled.div.withConfig({
-  displayName: "MenuEntry",
-  componentId: "sc-1sxukum-1"
-})(["cursor:pointer;display:flex;align-items:center;height:", "px;width:", "px;padding:", ";font-size:14px;background-color:", ";color:", ";transition:all 0.9s;", "{height:40px;}a{display:flex;align-items:center;width:100%;height:100%;color:", ";font-weight:700;transition:all 0.5s;}.dot{height:5px;width:5px;border-radius:50%;display:inline-block;background-color:", ";}svg{fill:", ";margin-right:13px;}&:hover{svg{path{fill:#12ffb8;fill-opacity:1;}margin-right:", ";}div,a{svg{path{fill:", ";}}}div,a{color:rgba(255,255,255,1);}}flex-shrink:0;&.rainbow{background-clip:text;animation:", " 3s ease-in-out infinite;background:", ";background-size:400% 100%;}"], MENU_ENTRY_HEIGHT, SIDEBAR_WIDTH_FULL, function (_ref3) {
+var MenuEntry = styled.div(_templateObject3$d || (_templateObject3$d = _taggedTemplateLiteral(["\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  height: ", "px;\n  width: ", "px;\n  padding: ", ";\n  font-size: 14px;\n  background-color: ", ";\n  color: ", ";\n  transition: all 0.9s;\n  ", " {\n    height: 40px;\n  }\n\n  a {\n    display: flex;\n    align-items: center;\n    width: 100%;\n    height: 100%;\n    color: ", ";\n    font-weight: 700;\n    transition: all 0.5s;\n  }\n\n  .dot {\n    height: 5px;\n    width: 5px;\n    border-radius: 50%;\n    display: inline-block;\n    background-color: ", ";\n  }\n\n  svg {\n    fill: ", ";\n    margin-right: 13px;\n  }\n\n  &:hover {\n    svg {\n      path {\n        fill: #12ffb8;\n        fill-opacity: 1;\n      }\n      margin-right: ", ";\n    }\n    div,\n    a {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n\n    div,\n    a {\n      color: rgba(255, 255, 255, 1);\n    }\n  }\n\n  // Safari fix\n  flex-shrink: 0;\n\n  &.rainbow {\n    background-clip: text;\n    animation: ", " 3s ease-in-out infinite;\n    background: ", ";\n    background-size: 400% 100%;\n  }\n"])), MENU_ENTRY_HEIGHT, SIDEBAR_WIDTH_FULL, function (_ref3) {
   var secondary = _ref3.secondary;
   return secondary ? "0 32px" : "0 25px";
 }, function (_ref4) {
@@ -17738,14 +16880,9 @@ MenuEntry.defaultProps = {
   role: "button"
 };
 
-var Container$2 = styled.div.withConfig({
-  displayName: "Accordion__Container",
-  componentId: "sc-1j605qy-0"
-})(["display:flex;flex-direction:column;flex-shrink:0;"]);
-var AccordionContent = styled.div.withConfig({
-  displayName: "Accordion__AccordionContent",
-  componentId: "sc-1j605qy-1"
-})(["max-height:", ";transition:max-height 0.3s ease-out;overflow-x:hidden;overflow-y:scroll;border-color:", ";border-style:solid;border-width:1px 0;border-bottom:none;"], function (_ref) {
+var _templateObject$m, _templateObject2$g, _templateObject3$c;
+var Container$2 = styled.div(_templateObject$m || (_templateObject$m = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  // Safari fix\n  flex-shrink: 0;\n"])));
+var AccordionContent = styled.div(_templateObject2$g || (_templateObject2$g = _taggedTemplateLiteral(["\n  max-height: ", ";\n  transition: max-height 0.3s ease-out;\n  overflow-x: hidden;\n  overflow-y: scroll;\n  border-color: ", ";\n  border-style: solid;\n  border-width: 1px 0;\n  border-bottom: none;\n"])), function (_ref) {
   var isOpen = _ref.isOpen,
     maxHeight = _ref.maxHeight;
   return isOpen ? "".concat(maxHeight, "px") : 0;
@@ -17754,10 +16891,7 @@ var AccordionContent = styled.div.withConfig({
     isPushed = _ref2.isPushed;
   return isOpen && isPushed ? "rgba(133, 133, 133, 0.1)" : "transparent";
 });
-var ArrowIcon = styled(Icon$2x).withConfig({
-  displayName: "Accordion__ArrowIcon",
-  componentId: "sc-1j605qy-2"
-})(["margin-right:-7px !important;transform:rotate(", "deg);transition:transform 0.4s;"], function (_ref3) {
+var ArrowIcon = styled(Icon$2x)(_templateObject3$c || (_templateObject3$c = _taggedTemplateLiteral(["\n  margin-right: -7px !important;\n  transform: rotate(", "deg);\n  transition: transform 0.4s;\n"])), function (_ref3) {
   var isOpen = _ref3.isOpen;
   return isOpen ? 0 : 180;
 });
@@ -17830,18 +16964,13 @@ var ExtraIcon;
   ExtraIcon["new"] = "new";
 })(ExtraIcon || (ExtraIcon = {}));
 
+var _templateObject$l, _templateObject2$f;
 var Icons$2 = IconModule;
-var Container$1 = styled.div.withConfig({
-  displayName: "PanelBody__Container",
-  componentId: "sc-1qgqorz-0"
-})(["display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;scrollbar-color:", " transparent;scrollbar-width:thin !important;"], function (_ref) {
+var Container$1 = styled.div(_templateObject$l || (_templateObject$l = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  overflow-y: auto;\n  overflow-x: hidden;\n  scrollbar-color: ", " transparent;\n  scrollbar-width: thin !important;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.primary;
 });
-var NewLabel = styled.div.withConfig({
-  displayName: "PanelBody__NewLabel",
-  componentId: "sc-1qgqorz-1"
-})(["display:flex;justify-content:center;align-items:center;color:", " !important;border:solid 1px ", ";border-radius:12px;padding:2px 8px;font-size:10px;line-height:9px;font-weight:700;margin-left:5px;text-align:center;"], function (_ref2) {
+var NewLabel = styled.div(_templateObject2$f || (_templateObject2$f = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  color: ", " !important;\n  border: solid 1px ", ";\n  border-radius: 12px;\n  padding: 2px 8px;\n  font-size: 10px;\n  line-height: 9px;\n  font-weight: 700;\n  margin-left: 5px;\n  text-align: center;\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.primary;
 }, function (_ref3) {
@@ -17945,10 +17074,8 @@ var PanelBody = function PanelBody(_ref4) {
 };
 
 var _excluded$1 = ["startIcon", "endIcon", "children", "external", "isLoading", "disabled"];
-var StyledNavButton = styled.button.withConfig({
-  displayName: "NavButton__StyledNavButton",
-  componentId: "sc-11strgr-0"
-})(["align-items:center;cursor:pointer;display:flex;justify-content:center;font-family:inherit;font-size:16px;font-weight:600;width:", ";height:", ";line-height:1;letter-spacing:0.03em;justify-content:center;outline:0;border:none;transition:background-color 0.2s;background-color:transparent;opacity:", ";margin-left:10px;"], function (_ref) {
+var _templateObject$k;
+var StyledNavButton = styled.button(_templateObject$k || (_templateObject$k = _taggedTemplateLiteral(["\n  align-items: center;\n  cursor: pointer;\n  display: flex;\n  justify-content: center;\n  font-family: inherit;\n  font-size: 16px;\n  font-weight: 600;\n  /* max-content instead of auto for Safari fix */\n  width: ", ";\n  height: ", ";\n  line-height: 1;\n  letter-spacing: 0.03em;\n  justify-content: center;\n  outline: 0;\n  border: none;\n  transition: background-color 0.2s;\n  background-color: transparent;\n  opacity: ", ";\n  margin-left: 10px;\n"])), function (_ref) {
   var fullWidth = _ref.fullWidth;
   return fullWidth ? "100%" : "max-content";
 }, function (_ref2) {
@@ -17986,10 +17113,8 @@ NavButton.defaultProps = {
   disabled: false
 };
 
-var MenuButton = styled(NavButton).withConfig({
-  displayName: "MenuButton",
-  componentId: "sc-1nwrww1-0"
-})(["color:", ";padding:0 8px;border-radius:8px;"], function (_ref) {
+var _templateObject$j;
+var MenuButton = styled(NavButton)(_templateObject$j || (_templateObject$j = _taggedTemplateLiteral(["\n  color: ", ";\n  padding: 0 8px;\n  border-radius: 8px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.text;
 });
@@ -18029,54 +17154,34 @@ var getLangFlag = function getLangFlag(lang) {
   }
 };
 
+var _templateObject$i, _templateObject2$e, _templateObject3$b, _templateObject4$9, _templateObject5$7, _templateObject6$4, _templateObject7$2;
 var Icons$1 = IconModule;
 var LanguageIcon = Icons$1.LanguageIcon;
-var LangButton = styled(Button$1).withConfig({
-  displayName: "LangSelector__LangButton",
-  componentId: "sc-1yvxo6n-0"
-})(["display:flex;flex-direction:row;position:relative;justify-content:flex-start;z-index:9999999;border:1px solid ", ";&:hover:not(:disabled):not(.button--disabled):not(:active){border:1px solid rgba(255,255,255,0.03);}transition:width 0.6s;height:28px;width:", "px;margin-bottom:15px;padding:0px 10px;"], function (_ref) {
+var LangButton = styled(Button$1)(_templateObject$i || (_templateObject$i = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  position: relative;\n  justify-content: flex-start;\n  z-index: 9999999;\n  border: 1px solid ", ";\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    border: 1px solid rgba(255, 255, 255, 0.03);\n  }\n  transition: width 0.6s;\n  height: 28px;\n  width: ", "px;\n  margin-bottom: 15px;\n  padding: 0px 10px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.white3;
 }, function (_ref2) {
   var isPushed = _ref2.isPushed;
   return isPushed ? 80 : 40;
 });
-var LangModal = styled.div.withConfig({
-  displayName: "LangSelector__LangModal",
-  componentId: "sc-1yvxo6n-1"
-})(["position:absolute;display:", "};bottom:45px;left:0px;background:", ";border:1px solid rgba(255,255,255,0.03);width:267px;height:auto;padding:27px 17px 27px 27px;border-radius:15px;"], function (_ref3) {
+var LangModal = styled.div(_templateObject2$e || (_templateObject2$e = _taggedTemplateLiteral(["\n  position: absolute;\n  display: ", "};\n  bottom: 45px;\n  left: 0px;\n  background: ", ";\n  border: 1px solid rgba(255, 255, 255, 0.03);\n  width: 267px;\n  height: auto;\n  padding: 27px 17px 27px 27px;\n  border-radius: 15px;\n"])), function (_ref3) {
   var display = _ref3.display;
   return display ? "block" : "none";
 }, function (_ref4) {
   var theme = _ref4.theme;
   return theme.backgrounds.primary;
 });
-var LangsList = styled.div.withConfig({
-  displayName: "LangSelector__LangsList",
-  componentId: "sc-1yvxo6n-2"
-})(["max-height:170px;overflow-y:scroll;&::-webkit-scrollbar{width:5px !important;}&::-webkit-scrollbar-thumb{background:", " !important;border-radius:8px;}&::-webkit-scrollbar-track{box-shadow:inset 0 0 5px ", ";border-radius:3px;}"], function (_ref5) {
+var LangsList = styled.div(_templateObject3$b || (_templateObject3$b = _taggedTemplateLiteral(["\n  max-height: 170px;\n  overflow-y: scroll;\n  &::-webkit-scrollbar {\n    width: 5px !important;\n  }\n  &::-webkit-scrollbar-thumb {\n    background: ", " !important;\n    border-radius: 8px;\n  }\n  &::-webkit-scrollbar-track {\n    box-shadow: inset 0 0 5px ", ";\n    border-radius: 3px;\n  }\n"])), function (_ref5) {
   var theme = _ref5.theme;
   return theme.colors.white55;
 }, function (_ref6) {
   var theme = _ref6.theme;
   return theme.colors.white30;
 });
-var TitleContainer = styled.div.withConfig({
-  displayName: "LangSelector__TitleContainer",
-  componentId: "sc-1yvxo6n-3"
-})(["display:flex;flex-direction:row;align-items:center;margin-bottom:10px;"]);
-var ButtonContainer$1 = styled.div.withConfig({
-  displayName: "LangSelector__ButtonContainer",
-  componentId: "sc-1yvxo6n-4"
-})(["width:100%;text-align:start;padding:0px 8px;"]);
-var LangText = styled(Text).withConfig({
-  displayName: "LangSelector__LangText",
-  componentId: "sc-1yvxo6n-5"
-})(["font-size:14px;margin-left:12px;"]);
-var MainLangText = styled(Text).withConfig({
-  displayName: "LangSelector__MainLangText",
-  componentId: "sc-1yvxo6n-6"
-})(["opacity:", ";width:", ";transition:width 0.6s,opacity 0.3s;"], function (_ref7) {
+var TitleContainer = styled.div(_templateObject4$9 || (_templateObject4$9 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  margin-bottom: 10px;\n"])));
+var ButtonContainer$1 = styled.div(_templateObject5$7 || (_templateObject5$7 = _taggedTemplateLiteral(["\n  width: 100%;\n  text-align: start;\n  padding: 0px 8px;\n"])));
+var LangText = styled(Text)(_templateObject6$4 || (_templateObject6$4 = _taggedTemplateLiteral(["\n  font-size: 14px;\n  margin-left: 12px;\n"])));
+var MainLangText = styled(Text)(_templateObject7$2 || (_templateObject7$2 = _taggedTemplateLiteral(["\n  opacity: ", ";\n  width: ", ";\n  transition: width 0.6s, opacity 0.3s;\n"])), function (_ref7) {
   var isPushed = _ref7.isPushed;
   return isPushed ? 1 : 0;
 }, function (_ref8) {
@@ -18184,14 +17289,9 @@ var LangSelector = /*#__PURE__*/React__default.memo(LangSelector$1, function (pr
   return prev.currentLang === next.currentLang && prev.isPushed === next.isPushed;
 });
 
-var Container = styled.div.withConfig({
-  displayName: "PanelFooter__Container",
-  componentId: "sc-11jjlfd-0"
-})(["flex:none;padding:5px 5px 20px 5px;background-color:transparent;position:relative;width:100%;margin-top:15px;"]);
-var SettingsEntry = styled.div.withConfig({
-  displayName: "PanelFooter__SettingsEntry",
-  componentId: "sc-11jjlfd-1"
-})(["display:flex;flex-direction:column;align-items:center;justify-content:center;height:auto;"]);
+var _templateObject$h, _templateObject2$d;
+var Container = styled.div(_templateObject$h || (_templateObject$h = _taggedTemplateLiteral(["\n  flex: none;\n  padding: 5px 5px 20px 5px;\n  background-color: transparent;\n  position: relative;\n  width: 100%;\n  margin-top: 15px;\n"])));
+var SettingsEntry = styled.div(_templateObject2$d || (_templateObject2$d = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: auto;\n"])));
 var PanelFooter = function PanelFooter(_ref) {
   var isPushed = _ref.isPushed;
     _ref.pushNav;
@@ -18216,33 +17316,23 @@ var PanelFooter = function PanelFooter(_ref) {
   });
 };
 
-var MobileEntry = styled.div.withConfig({
-  displayName: "MobileEntry",
-  componentId: "sc-ialwsc-0"
-})(["&:hover{div,a{svg{path{fill:", ";}}}div,a{color:rgba(255,255,255,1);}}"], function (_ref) {
+var _templateObject$g;
+var MobileEntry = styled.div(_templateObject$g || (_templateObject$g = _taggedTemplateLiteral(["\n    &:hover {\n    div,\n    a {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n\n    div,\n    a {\n      color: rgba(255, 255, 255, 1);\n    }\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.primary;
 });
 
+var _templateObject$f, _templateObject2$c, _templateObject3$a;
 var MOBILE_MENU_PANEL_HEIGHT = 83;
-var MobileMenuContainer = styled.div.withConfig({
-  displayName: "MobileMenu__MobileMenuContainer",
-  componentId: "sc-11f9rbo-0"
-})(["position:fixed;bottom:0px;width:100%;right:0px;left:0px;z-index:98;height:", "px;display:none;flex-direction:row;justify-content:space-around;align-items:center;background:", ";", "{display:flex;}"], MOBILE_MENU_PANEL_HEIGHT, function (_ref) {
+var MobileMenuContainer = styled.div(_templateObject$f || (_templateObject$f = _taggedTemplateLiteral(["\n  position: fixed;\n  bottom: 0px;\n  width: 100%;\n  right: 0px;\n  left: 0px;\n  z-index: 98;\n  height: ", "px;\n  display: none;\n  flex-direction: row;\n  justify-content: space-around;\n  align-items: center;\n  background: ", ";\n  ", " {\n    display: flex;\n  }\n"])), MOBILE_MENU_PANEL_HEIGHT, function (_ref) {
   var theme = _ref.theme;
   return theme.colors.card;
 }, function (_ref2) {
   var theme = _ref2.theme;
   return theme.mediaQueries.mobile;
 });
-var MobileLink = styled(MenuLink).withConfig({
-  displayName: "MobileMenu__MobileLink",
-  componentId: "sc-11f9rbo-1"
-})(["display:flex;flex-direction:column;justify-items:soace-between;align-items:center;"]);
-var MenuLinkLabel = styled.div.withConfig({
-  displayName: "MobileMenu__MenuLinkLabel",
-  componentId: "sc-11f9rbo-2"
-})(["display:flex;flex-direction:row;font-weight:700;font-size:9px;color:white;"]);
+var MobileLink = styled(MenuLink)(_templateObject2$c || (_templateObject2$c = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-items: soace-between;\n  align-items: center;\n"])));
+var MenuLinkLabel = styled.div(_templateObject3$a || (_templateObject3$a = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  font-weight: 700;\n  font-size: 9px;\n  color: white;\n"])));
 var Icons = IconModule;
 var MobileMenu = function MobileMenu(_ref3) {
   var links = _ref3.links,
@@ -18277,10 +17367,8 @@ var MobileMenu = function MobileMenu(_ref3) {
   });
 };
 
-var StyledPanel = styled.div.withConfig({
-  displayName: "Panel__StyledPanel",
-  componentId: "sc-1b3g4s2-0"
-})(["position:fixed;padding-top:100px;top:0;left:0;flex-direction:column;justify-content:space-between;flex-shrink:0;background-color:#191921;width:", ";height:100vh;transition:padding-top 0.2s,width 0.6s,box-shadow 0.4s;z-index:11;overflow:", ";transform:translate3d(0,0,0);", "{width:", ";padding-top:100px;margin-top:0px;transition:none;overflow-y:auto;padding-bottom:", "px;}"], function (_ref) {
+var _templateObject$e, _templateObject2$b;
+var StyledPanel = styled.div(_templateObject$e || (_templateObject$e = _taggedTemplateLiteral(["\n  position: fixed;\n  padding-top: 100px;\n  top: 0;\n  left: 0;\n  flex-direction: column;\n  justify-content: space-between;\n  flex-shrink: 0;\n  background-color: #191921;\n  width: ", ";\n  height: 100vh;\n  transition: padding-top 0.2s, width 0.6s, box-shadow 0.4s;\n  z-index: 11;\n  overflow: ", ";\n  transform: translate3d(0, 0, 0);\n  ", " {\n    width: ", ";\n    padding-top: 100px;\n    margin-top: 0px;\n    transition: none;\n    overflow-y: auto;\n    padding-bottom: ", "px;\n  }\n"])), function (_ref) {
   var isPushed = _ref.isPushed;
   return "".concat(isPushed ? SIDEBAR_WIDTH_FULL : SIDEBAR_WIDTH_REDUCED, "px");
 }, function (_ref2) {
@@ -18293,10 +17381,7 @@ var StyledPanel = styled.div.withConfig({
   var isPushed = _ref4.isPushed;
   return isPushed ? "100%" : "0px";
 }, MOBILE_MENU_PANEL_HEIGHT);
-var RowSplitter = styled.div.withConfig({
-  displayName: "Panel__RowSplitter",
-  componentId: "sc-1b3g4s2-1"
-})(["border:1px solid #252530;margin:", ";"], function (_ref5) {
+var RowSplitter = styled.div(_templateObject2$b || (_templateObject2$b = _taggedTemplateLiteral(["\n  border: 1px solid #252530;\n  margin: ", ";\n"])), function (_ref5) {
   var isPushed = _ref5.isPushed;
   return isPushed ? "20px" : "20px 15px";
 });
@@ -18318,26 +17403,12 @@ var Panel = function Panel(props) {
   });
 };
 
-var Space = styled.div.withConfig({
-  displayName: "DisclaimerModal__Space",
-  componentId: "sc-11tnsw3-0"
-})(["width:30px;"]);
-var DisclaimerContainer = styled.div.withConfig({
-  displayName: "DisclaimerModal__DisclaimerContainer",
-  componentId: "sc-11tnsw3-1"
-})(["max-width:430px;"]);
-var CheckBoxContainer = styled.div.withConfig({
-  displayName: "DisclaimerModal__CheckBoxContainer",
-  componentId: "sc-11tnsw3-2"
-})(["width:20%;display:flex;justify-content:center;align-items:center;"]);
-var ButtonContainer = styled.div.withConfig({
-  displayName: "DisclaimerModal__ButtonContainer",
-  componentId: "sc-11tnsw3-3"
-})(["margin-top:25px;"]);
-var ListContainer = styled.div.withConfig({
-  displayName: "DisclaimerModal__ListContainer",
-  componentId: "sc-11tnsw3-4"
-})(["font-size:13px;color:white;margin-bottom:10px;padding-left:14px;ul li{list-style-position:outside;padding:4px;line-height:17px;}"]);
+var _templateObject$d, _templateObject2$a, _templateObject3$9, _templateObject4$8, _templateObject5$6;
+var Space = styled.div(_templateObject$d || (_templateObject$d = _taggedTemplateLiteral(["\n  width: 30px;\n"])));
+var DisclaimerContainer = styled.div(_templateObject2$a || (_templateObject2$a = _taggedTemplateLiteral(["\n  max-width: 430px;\n"])));
+var CheckBoxContainer = styled.div(_templateObject3$9 || (_templateObject3$9 = _taggedTemplateLiteral(["\n  width: 20%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n"])));
+var ButtonContainer = styled.div(_templateObject4$8 || (_templateObject4$8 = _taggedTemplateLiteral(["\n  margin-top: 25px;\n"])));
+var ListContainer = styled.div(_templateObject5$6 || (_templateObject5$6 = _taggedTemplateLiteral(["\n  font-size: 13px;\n  color: white;\n  margin-bottom: 10px;\n  padding-left: 14px;\n  ul li {\n    list-style-position: outside;\n    padding: 4px;\n    line-height: 17px;\n  }\n"])));
 var DiclaimerModal = function DiclaimerModal(_ref) {
   var _ref$onDismiss = _ref.onDismiss,
     onDismiss = _ref$onDismiss === void 0 ? function () {
@@ -18579,21 +17650,13 @@ var useAutoDisclaimer = function useAutoDisclaimer(_ref) {
   }, [disclaimer, disclaimerConnector, inProgress, login, onPresentDisclaimerModal, title]);
 };
 
-var UserBlockWrapper = styled.div.withConfig({
-  displayName: "UserBlock__UserBlockWrapper",
-  componentId: "sc-1speva4-0"
-})(["display:flex;justify-content:flex-end;@media (max-width:608px){flex:100%;}"]);
-var ConnectButton = styled(Button$1).withConfig({
-  displayName: "UserBlock__ConnectButton",
-  componentId: "sc-1speva4-1"
-})(["color:black;width:180px;box-shadow:0px 9px 63px rgba(18,255,184,0.22);font-weight:700;height:40px;", "{width:113px;height:31px;font-size:11px;padding:0px 10px;}"], function (_ref) {
+var _templateObject$c, _templateObject2$9, _templateObject3$8, _templateObject4$7, _templateObject5$5;
+var UserBlockWrapper = styled.div(_templateObject$c || (_templateObject$c = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: flex-end;\n\n  @media (max-width: 608px) {\n    flex: 100%;\n  }\n"])));
+var ConnectButton = styled(Button$1)(_templateObject2$9 || (_templateObject2$9 = _taggedTemplateLiteral(["\n  color: black;\n  width: 180px;\n  box-shadow: 0px 9px 63px rgba(18, 255, 184, 0.22);\n  font-weight: 700;\n  height: 40px;\n  ", " {\n    width: 113px;\n    height: 31px;\n    font-size: 11px;\n    padding: 0px 10px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.mobile;
 });
-var AccountButton = styled(Button$1).withConfig({
-  displayName: "UserBlock__AccountButton",
-  componentId: "sc-1speva4-2"
-})(["display:flex;flex-direction:", ";align-items:", ";color:white;padding:10px;height:40px;width:144px;background:#2b2b38;", "{height:31px;width:116px;font-size:11px;padding:0px 10px;}"], function (_ref2) {
+var AccountButton = styled(Button$1)(_templateObject3$8 || (_templateObject3$8 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: ", ";\n  align-items: ", ";\n  color: white;\n  padding: 10px;\n  height: 40px;\n  width: 144px;\n  background: #2b2b38;\n  ", " {\n    height: 31px;\n    width: 116px;\n    font-size: 11px;\n    padding: 0px 10px;\n  }\n"])), function (_ref2) {
   var isUserVerified = _ref2.isUserVerified;
   return isUserVerified ? "row" : "column-reverse";
 }, function (_ref3) {
@@ -18603,17 +17666,11 @@ var AccountButton = styled(Button$1).withConfig({
   var theme = _ref4.theme;
   return theme.mediaQueries.mobile;
 });
-var VerifyAddressIndicator = styled(Text).withConfig({
-  displayName: "UserBlock__VerifyAddressIndicator",
-  componentId: "sc-1speva4-3"
-})(["color:#f6465d;", "{font-size:10px;}"], function (_ref5) {
+var VerifyAddressIndicator = styled(Text)(_templateObject4$7 || (_templateObject4$7 = _taggedTemplateLiteral(["\n  color: #f6465d;\n  ", " {\n    font-size: 10px;\n  }\n"])), function (_ref5) {
   var theme = _ref5.theme;
   return theme.mediaQueries.mobile;
 });
-var Account = styled(Text).withConfig({
-  displayName: "UserBlock__Account",
-  componentId: "sc-1speva4-4"
-})(["margin-bottom:", ";", "{font-size:10px;}"], function (_ref6) {
+var Account = styled(Text)(_templateObject5$5 || (_templateObject5$5 = _taggedTemplateLiteral(["\n  margin-bottom: ", ";\n  ", " {\n    font-size: 10px;\n  }\n"])), function (_ref6) {
   var isUserVerified = _ref6.isUserVerified;
   return !isUserVerified && "-5px";
 }, function (_ref7) {
@@ -18665,10 +17722,8 @@ var UserBlock = function UserBlock(_ref8) {
   });
 };
 
-var BellBoxWrapper = styled.div.withConfig({
-  displayName: "BellNotifier__BellBoxWrapper",
-  componentId: "sc-1ga2zxd-0"
-})(["height:40px;width:50px;overflow:visible;cursor:pointer;margin-right:28px;display:", ";z-index:999;", "{display:", ";position:fixed;bottom:107px;left:initial;right:0px;height:50px;}"], function (_ref) {
+var _templateObject$b, _templateObject2$8, _templateObject3$7;
+var BellBoxWrapper = styled.div(_templateObject$b || (_templateObject$b = _taggedTemplateLiteral(["\n  height: 40px;\n  width: 50px;\n  overflow: visible;\n  cursor: pointer;\n  margin-right: 28px;\n  display: ", ";\n  z-index: 999;\n  ", " {\n    display: ", ";\n    position: fixed;\n    bottom: 107px;\n    left: initial;\n    right: 0px;\n    height: 50px;\n  }\n"])), function (_ref) {
   var mobile = _ref.mobile;
   return mobile ? "none" : "block";
 }, function (_ref2) {
@@ -18679,10 +17734,7 @@ var BellBoxWrapper = styled.div.withConfig({
     hasMsg = _ref3.hasMsg;
   return mobile && hasMsg ? "block" : "none";
 });
-var BellBox = styled(Link).withConfig({
-  displayName: "BellNotifier__BellBox",
-  componentId: "sc-1ga2zxd-1"
-})(["position:relative;display:flex;justify-content:center;align-items:center;height:100%;width:100%;border:1px solid ", ";border-radius:10px;background:", ";box-sizing:border-box;", "{border-radius:50%;}", " ", ""], function (_ref4) {
+var BellBox = styled(Link)(_templateObject2$8 || (_templateObject2$8 = _taggedTemplateLiteral(["\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 100%;\n  width: 100%;\n  border: 1px solid ", ";\n  border-radius: 10px;\n  background: ", ";\n  box-sizing: border-box;\n  ", " {\n    border-radius: 50%;\n  }\n  ", "\n  ", "\n"])), function (_ref4) {
   var hasMsg = _ref4.hasMsg,
     theme = _ref4.theme;
   return hasMsg ? "#1AC8FF" : theme.backgrounds.secondary;
@@ -18700,10 +17752,7 @@ var BellBox = styled(Link).withConfig({
   var hasMsg = _ref8.hasMsg;
   return hasMsg && "\n        box-shadow: 0px 0px 14px 3px rgba(46, 124, 246, 0.25);\n    ";
 });
-var NotificationNumber = styled.div.withConfig({
-  displayName: "BellNotifier__NotificationNumber",
-  componentId: "sc-1ga2zxd-2"
-})(["position:absolute;top:4px;right:3px;display:flex;justify-content:center;align-items:center;width:18.46px;height:18.46px;background:#de4040;border-radius:50%;opacity:", ";transition:all 0.25s ease-in-out;animation:stretch 2s infinite;", "{top:12.25px;right:7px;}@keyframes stretch{0%{transform:scale(1);}50%{transform:scale(1.2);}100%{transform:scale(1);}}"], function (_ref9) {
+var NotificationNumber = styled.div(_templateObject3$7 || (_templateObject3$7 = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 4px;\n  right: 3px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 18.46px;\n  height: 18.46px;\n  background: #de4040;\n  border-radius: 50%;\n  opacity: ", ";\n  transition: all 0.25s ease-in-out;\n  animation: stretch 2s infinite;\n  ", " {\n    top: 12.25px;\n    right: 7px;\n  }\n  @keyframes stretch {\n    0% {\n      transform: scale(1);\n    }\n\n    50% {\n      transform: scale(1.2);\n    }\n\n    100% {\n      transform: scale(1);\n    }\n  }\n"])), function (_ref9) {
   var hasMsg = _ref9.hasMsg;
   return hasMsg ? 1 : 0;
 }, function (_ref0) {
@@ -18740,10 +17789,8 @@ var BellNotifier = function BellNotifier(_ref1) {
   });
 };
 
-var CryptoDropdownWrapper = styled.button.withConfig({
-  displayName: "CryptoButton__CryptoDropdownWrapper",
-  componentId: "sc-uo8r8r-0"
-})(["padding:", "px;outline:none;border:none;width:", "px;height:40px;background:#2b2b38;border-radius:10px;display:flex;flex-direction:row;justify-content:space-around;align-items:center;color:black;cursor:pointer;position:relative;&:active{background:", ";}", "{width:113px;height:31px;font-size:11px;padding:0px 10px;margin:0 6px;}transition:all 0.5s ease-in;"], function (props) {
+var _templateObject$a, _templateObject2$7, _templateObject3$6, _templateObject4$6;
+var CryptoDropdownWrapper = styled.button(_templateObject$a || (_templateObject$a = _taggedTemplateLiteral(["\n  padding: ", "px;\n  outline: none;\n  border: none;\n  width: ", "px;\n  height: 40px;\n  background: #2b2b38;\n  border-radius: 10px;\n  display: flex;\n  flex-direction: row;\n  justify-content: space-around;\n  align-items: center;\n  color: black;\n  cursor: pointer;\n  position: relative;\n  &:active {\n    background: ", ";\n  }\n  ", " {\n    width: 113px;\n    height: 31px;\n    font-size: 11px;\n    padding: 0px 10px;\n    margin: 0 6px;\n  }\n  transition: all 0.5s ease-in;\n"])), function (props) {
   return props.extended ? "6px 5px 6px 10px" : "10px";
 }, function (props) {
   return props.extended ? 130 : 70;
@@ -18754,10 +17801,7 @@ var CryptoDropdownWrapper = styled.button.withConfig({
   var theme = _ref2.theme;
   return theme.mediaQueries.mobile;
 });
-var ButtonsContainer = styled.div.withConfig({
-  displayName: "CryptoButton__ButtonsContainer",
-  componentId: "sc-uo8r8r-1"
-})(["position:absolute;width:159px;height:89px;top:53px;right:0px;background:", ";border:1px solid ", ";box-sizing:border-box;opacity:", ";display:flex;z-index:", "999;transition-property:opacity,box-shadow;transition-duration:0.5s,0.3s;box-shadow:0px 0px 24px -11px rgba(0,0,0,0.25);border-radius:10px;flex-direction:column;justify-content:space-between;align-items:center;", "{display:", ";}"], function (_ref3) {
+var ButtonsContainer = styled.div(_templateObject2$7 || (_templateObject2$7 = _taggedTemplateLiteral(["\n  position: absolute;\n  width: 159px;\n  height: 89px;\n  top: 53px;\n  right: 0px;\n  background: ", ";\n  border: 1px solid ", ";\n  box-sizing: border-box;\n  opacity: ", ";\n  display: flex;\n  z-index: ", "999;\n  transition-property: opacity, box-shadow;\n  transition-duration: 0.5s, 0.3s;\n  box-shadow: 0px 0px 24px -11px rgba(0, 0, 0, 0.25);\n  border-radius: 10px;\n  flex-direction: column;\n  justify-content: space-between;\n  align-items: center;\n  ", " {\n    display: ", ";\n  }\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.backgrounds.secondary;
 }, function (_ref4) {
@@ -18773,14 +17817,8 @@ var ButtonsContainer = styled.div.withConfig({
 }, function (props) {
   return props.visible ? "flex" : "none";
 });
-var ButtonRow = styled(Link).withConfig({
-  displayName: "CryptoButton__ButtonRow",
-  componentId: "sc-uo8r8r-2"
-})(["display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:11px;width:100%;height:100%;overflow:visible;z-index:99999;svg{opacity:0.55;}&:hover{svg{opacity:1;}}transition:all 0.3s ease-in;"]);
-var ButtonsSpacer = styled.div.withConfig({
-  displayName: "CryptoButton__ButtonsSpacer",
-  componentId: "sc-uo8r8r-3"
-})(["border:1px solid #373749;width:calc(100% - 20px);"]);
+var ButtonRow = styled(Link)(_templateObject3$6 || (_templateObject3$6 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n  padding: 11px;\n  width: 100%;\n  height: 100%;\n  overflow: visible;\n  z-index: 99999;\n  svg {\n    opacity: 0.55;\n  }\n  &:hover {\n    svg {\n      opacity: 1;\n    }\n  }\n  transition: all 0.3s ease-in;\n"])));
+var ButtonsSpacer = styled.div(_templateObject4$6 || (_templateObject4$6 = _taggedTemplateLiteral(["\n  border: 1px solid #373749;\n  width: calc(100% - 20px);\n"])));
 var CryptoButton = function CryptoButton(_ref6) {
   var _ref6$extended = _ref6.extended,
     extended = _ref6$extended === void 0 ? false : _ref6$extended,
@@ -18865,10 +17903,8 @@ var CryptoButton = function CryptoButton(_ref6) {
   });
 };
 
-var StyledUserButton = styled.div.withConfig({
-  displayName: "UserButton__StyledUserButton",
-  componentId: "sc-3kmnlp-0"
-})(["display:flex;justify-content:center;align-items:center;cursor:pointer;width:40px;height:40px;border-radius:10px;background:#2b2b38;svg{fill:", ";path{fill:", ";}}", "{width:32px;height:32px;border-radius:8px;}"], function (_ref) {
+var _templateObject$9, _templateObject2$6;
+var StyledUserButton = styled.div(_templateObject$9 || (_templateObject$9 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n  width: 40px;\n  height: 40px;\n  border-radius: 10px;\n  background: #2b2b38;\n  svg {\n    fill: ", ";\n    path {\n      fill: ", ";\n    }\n  }\n  ", " {\n    width: 32px;\n    height: 32px;\n    border-radius: 8px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.primary;
 }, function (_ref2) {
@@ -18878,10 +17914,7 @@ var StyledUserButton = styled.div.withConfig({
   var theme = _ref3.theme;
   return theme.mediaQueries.mobile;
 });
-var StyledUserIcon = styled(Icon$1c).withConfig({
-  displayName: "UserButton__StyledUserIcon",
-  componentId: "sc-3kmnlp-1"
-})(["", "{height:18px;}"], function (_ref4) {
+var StyledUserIcon = styled(Icon$1c)(_templateObject2$6 || (_templateObject2$6 = _taggedTemplateLiteral(["\n  ", " {\n    height: 18px;\n  }\n"])), function (_ref4) {
   var theme = _ref4.theme;
   return theme.mediaQueries.mobile;
 });
@@ -18900,25 +17933,14 @@ var UserButton = function UserButton(_ref5) {
   });
 };
 
-var Wrapper = styled.div.withConfig({
-  displayName: "Menu__Wrapper",
-  componentId: "sc-2hf3ez-0"
-})(["position:relative;width:100%;height:100%;overscroll-behavior-y:contain;scroll-snap-type:y proximity;"]);
-var StyledNav = styled.nav.withConfig({
-  displayName: "Menu__StyledNav",
-  componentId: "sc-2hf3ez-1"
-})(["align-items:flex-start;position:fixed;left:0;transition:top 0.2s;display:flex;justify-content:space-between;padding:30px 15px;background-color:transparent;z-index:20;transform:translate3d(0,0,0);", "{position:absolute;left:-12px;};"], function (_ref) {
+var _templateObject$8, _templateObject2$5, _templateObject3$5, _templateObject4$5, _templateObject5$4, _templateObject6$3;
+var Wrapper = styled.div(_templateObject$8 || (_templateObject$8 = _taggedTemplateLiteral(["\n  position: relative;\n  width: 100%;\n  height: 100%;\n  overscroll-behavior-y: contain;\n  scroll-snap-type: y proximity;\n"])));
+var StyledNav = styled.nav(_templateObject2$5 || (_templateObject2$5 = _taggedTemplateLiteral(["\n  align-items: flex-start;\n  position: fixed;\n  left: 0;\n  transition: top 0.2s;\n  display: flex;\n  justify-content: space-between;\n  padding: 30px 15px;\n  background-color: transparent;\n  z-index: 20;\n  transform: translate3d(0, 0, 0);\n  ", " {\n    position: absolute;\n    left: -12px;\n  } ;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.mobile;
 });
-var BodyWrapper = styled.div.withConfig({
-  displayName: "Menu__BodyWrapper",
-  componentId: "sc-2hf3ez-2"
-})(["position:relative;display:flex;min-height:100vh;"]);
-var Inner = styled.div.withConfig({
-  displayName: "Menu__Inner",
-  componentId: "sc-2hf3ez-3"
-})(["flex-grow:1;margin-top:25px;transition:margin-top 0.2s;transform:translate3d(0,0,0);margin-left:", "px;max-width:calc(100% - ", "px);", "{max-width:100%;margin-left:0px;}"], SIDEBAR_WIDTH_REDUCED, SIDEBAR_WIDTH_REDUCED, function (_ref2) {
+var BodyWrapper = styled.div(_templateObject3$5 || (_templateObject3$5 = _taggedTemplateLiteral(["\n  position: relative;\n  display: flex;\n  min-height: 100vh;\n"])));
+var Inner = styled.div(_templateObject4$5 || (_templateObject4$5 = _taggedTemplateLiteral(["\n  flex-grow: 1;\n  margin-top: 25px;\n  transition: margin-top 0.2s;\n  transform: translate3d(0, 0, 0);\n  margin-left: ", "px;\n  max-width: calc(100% - ", "px);\n  ", " {\n    max-width: 100%;\n    margin-left: 0px;\n  }\n"])), SIDEBAR_WIDTH_REDUCED, SIDEBAR_WIDTH_REDUCED, function (_ref2) {
   var theme = _ref2.theme;
   return theme.mediaQueries.mobile;
 });
@@ -18930,10 +17952,7 @@ var Inner = styled.div.withConfig({
 //     opacity: 0;
 //   }
 // `;
-var ButtonsRow$1 = styled.div.withConfig({
-  displayName: "Menu__ButtonsRow",
-  componentId: "sc-2hf3ez-4"
-})(["display:flex;justify-content:flex-end;aling-items:center;flex-direction:row;background:transparent;", "{z-index:99999;position:", ";top:30px;right:25px;padding-bottom:30px;", "}"], function (_ref3) {
+var ButtonsRow$1 = styled.div(_templateObject5$4 || (_templateObject5$4 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: flex-end;\n  aling-items: center;\n  flex-direction: row;\n  background: transparent;\n  ", " {\n    z-index: 99999;\n    position: ", ";\n    top: 30px;\n    right: 25px;\n    padding-bottom: 30px;\n    ", "\n  }\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.mediaQueries.mobile;
 }, function (_ref4) {
@@ -18943,10 +17962,7 @@ var ButtonsRow$1 = styled.div.withConfig({
   var isPushed = _ref5.isPushed;
   return !isPushed && "\n        margin-right: 12px;\n        margin-top: 5px;\n    ";
 });
-var MenuContent = styled.div.withConfig({
-  displayName: "Menu__MenuContent",
-  componentId: "sc-2hf3ez-5"
-})(["display:flex;gap:20px;flex-direction:row-reverse;transition:all 0.2s;width:100%;", "{margin-right:50px;}@media (max-width:900px){flex-direction:column;gap:7px;align-items:flex-end;}"], function (_ref6) {
+var MenuContent = styled.div(_templateObject6$3 || (_templateObject6$3 = _taggedTemplateLiteral(["\n  display: flex;\n  gap: 20px;\n  flex-direction: row-reverse;\n  transition: all 0.2s;\n  width: 100%;\n\n  ", " {\n    margin-right: 50px;\n  }\n\n  @media (max-width: 900px) {\n    flex-direction: column;\n    gap: 7px;\n    align-items: flex-end;\n  }\n"])), function (_ref6) {
   var theme = _ref6.theme;
   return theme.mediaQueries.mobile;
 });
@@ -19175,11 +18191,9 @@ var types = {
 };
 
 var _excluded = ["toast", "onRemove", "style", "ttl"];
+var _templateObject$7;
 var alertTypeMap = _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, types.INFO, variants$3.INFO), types.SUCCESS, variants$3.SUCCESS), types.DANGER, variants$3.DANGER), types.WARNING, variants$3.WARNING);
-var StyledToast = styled.div.withConfig({
-  displayName: "Toast__StyledToast",
-  componentId: "sc-1y3cmzu-0"
-})(["right:30px;position:fixed;max-width:calc(100% - 32px);transition:all 250ms ease-in;width:100%;", "{max-width:400px;}"], function (_ref) {
+var StyledToast = styled.div(_templateObject$7 || (_templateObject$7 = _taggedTemplateLiteral(["\n  right: 30px; // 14px+\n  position: fixed;\n  max-width: calc(100% - 32px);\n  transition: all 250ms ease-in;\n  width: 100%;\n\n  ", " {\n    max-width: 400px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.sm;
 });
@@ -19253,12 +18267,10 @@ var Toast = function Toast(_ref2) {
   );
 };
 
+var _templateObject$6;
 var ZINDEX = 1000;
 var TOP_POSITION = 94; // Initial position from the top, 14px+
-var StyledToastContainer = styled.div.withConfig({
-  displayName: "ToastContainer__StyledToastContainer",
-  componentId: "sc-1cnkl3o-0"
-})([".enter,.appear{opacity:0.01;}.enter.enter-active,.appear.appear-active{opacity:1;transition:opacity 250ms ease-in;}.exit{opacity:1;}.exit.exit-active{opacity:0.01;transition:opacity 250ms ease-out;}"]);
+var StyledToastContainer = styled.div(_templateObject$6 || (_templateObject$6 = _taggedTemplateLiteral(["\n  .enter,\n  .appear {\n    opacity: 0.01;\n  }\n\n  .enter.enter-active,\n  .appear.appear-active {\n    opacity: 1;\n    transition: opacity 250ms ease-in;\n  }\n\n  .exit {\n    opacity: 1;\n  }\n\n  .exit.exit-active {\n    opacity: 0.01;\n    transition: opacity 250ms ease-out;\n  }\n"])));
 var ToastContainer = function ToastContainer(_ref) {
   var toasts = _ref.toasts,
     onRemove = _ref.onRemove,
@@ -19285,26 +18297,12 @@ var ToastContainer = function ToastContainer(_ref) {
   });
 };
 
-var VerificationModalContent = styled.div.withConfig({
-  displayName: "VerificationModal__VerificationModalContent",
-  componentId: "sc-1hw1n7f-0"
-})(["display:flex;flex-direction:column;justify-content:flex-start;align-items:center;height:100%;margin-top:-30px;"]);
-var DescriptionSection = styled.div.withConfig({
-  displayName: "VerificationModal__DescriptionSection",
-  componentId: "sc-1hw1n7f-1"
-})(["width:305px;text-align:center;margin-top:32px;margin-bottom:32px;"]);
-var ModalText$1 = styled(Text).withConfig({
-  displayName: "VerificationModal__ModalText",
-  componentId: "sc-1hw1n7f-2"
-})(["line-height:170%;"]);
-var ButtonsRow = styled.div.withConfig({
-  displayName: "VerificationModal__ButtonsRow",
-  componentId: "sc-1hw1n7f-3"
-})(["display:flex;justify-content:space-around;align-items:center;width:100%;"]);
-var ModalButton$1 = styled(Button$1).withConfig({
-  displayName: "VerificationModal__ModalButton",
-  componentId: "sc-1hw1n7f-4"
-})(["width:120px;padding:0 8px;"]);
+var _templateObject$5, _templateObject2$4, _templateObject3$4, _templateObject4$4, _templateObject5$3;
+var VerificationModalContent = styled.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: center;\n  height: 100%;\n  margin-top: -30px;\n"])));
+var DescriptionSection = styled.div(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteral(["\n  width: 305px;\n  text-align: center;\n  margin-top: 32px;\n  margin-bottom: 32px;\n"])));
+var ModalText$1 = styled(Text)(_templateObject3$4 || (_templateObject3$4 = _taggedTemplateLiteral(["\n  line-height: 170%;\n"])));
+var ButtonsRow = styled.div(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-around;\n  align-items: center;\n  width: 100%;\n"])));
+var ModalButton$1 = styled(Button$1)(_templateObject5$3 || (_templateObject5$3 = _taggedTemplateLiteral(["\n  width: 120px;\n  padding: 0 8px;\n"])));
 var VerificationModal = function VerificationModal(props) {
   var onVerify = props.onVerify,
     modalDescription = props.modalDescription,
@@ -19374,24 +18372,16 @@ var useVerificationModal = function useVerificationModal(_ref) {
   };
 };
 
-var IdoExtensionsModalContent = styled.div.withConfig({
-  displayName: "IdoExtensionsModal__IdoExtensionsModalContent",
-  componentId: "sc-cbodpl-0"
-})(["display:flex;flex-direction:column;justify-content:flex-start;align-items:center;height:100%;margin-top:-30px;"]);
-var ModalText = styled(Text).withConfig({
-  displayName: "IdoExtensionsModal__ModalText",
-  componentId: "sc-cbodpl-1"
-})(["line-height:170%;width:", ";", "{width:90%;}"], function (_ref) {
+var _templateObject$4, _templateObject2$3, _templateObject3$3, _templateObject4$3, _templateObject5$2, _templateObject6$2;
+var IdoExtensionsModalContent = styled.div(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: center;\n  height: 100%;\n  margin-top: -30px;\n"])));
+var ModalText = styled(Text)(_templateObject2$3 || (_templateObject2$3 = _taggedTemplateLiteral(["\n  line-height: 170%;\n  width: ", ";\n  ", " {\n    width: 90%;\n  }\n"])), function (_ref) {
   var textWidth = _ref.textWidth;
   return textWidth ? "".concat(textWidth, "px") : "100%";
 }, function (_ref2) {
   var theme = _ref2.theme;
   return theme.mediaQueries.tablet;
 });
-var InputWrapper = styled.div.withConfig({
-  displayName: "IdoExtensionsModal__InputWrapper",
-  componentId: "sc-cbodpl-2"
-})(["position:relative;width:100%;margin-top:", "px;min-width:420px;", "{min-width:100%;}", "{margin-top:10px;}"], function (_ref3) {
+var InputWrapper = styled.div(_templateObject3$3 || (_templateObject3$3 = _taggedTemplateLiteral(["\n  position: relative;\n  width: 100%;\n  margin-top: ", "px;\n  min-width: 420px;\n  ", " {\n    min-width: 100%;\n  }\n  ", " {\n    margin-top: 10px;\n  }\n"])), function (_ref3) {
   var marginTop = _ref3.marginTop;
   return marginTop || 0;
 }, function (_ref4) {
@@ -19401,21 +18391,12 @@ var InputWrapper = styled.div.withConfig({
   var theme = _ref5.theme;
   return theme.mediaQueries.mobile;
 });
-var InfoText = styled(Text).withConfig({
-  displayName: "IdoExtensionsModal__InfoText",
-  componentId: "sc-cbodpl-3"
-})(["text-align:center;font-weight:400;font-size:14px;line-height:160%;color:#535459;margin-top:24px;b{color:", ";cursor:pointer;}"], function (_ref6) {
+var InfoText = styled(Text)(_templateObject4$3 || (_templateObject4$3 = _taggedTemplateLiteral(["\n  text-align: center;\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 160%;\n  color: #535459;\n  margin-top: 24px;\n  b {\n    color: ", ";\n    cursor: pointer;\n  }\n"])), function (_ref6) {
   var theme = _ref6.theme;
   return theme.colors.primary;
 });
-var IdoExtensionsForm = styled.form.withConfig({
-  displayName: "IdoExtensionsModal__IdoExtensionsForm",
-  componentId: "sc-cbodpl-4"
-})(["width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;"]);
-var ModalButton = styled(Button$1).withConfig({
-  displayName: "IdoExtensionsModal__ModalButton",
-  componentId: "sc-cbodpl-5"
-})(["width:144px;margin-top:24px;font-size:14px;"]);
+var IdoExtensionsForm = styled.form(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n"])));
+var ModalButton = styled(Button$1)(_templateObject6$2 || (_templateObject6$2 = _taggedTemplateLiteral(["\n  width: 144px;\n  margin-top: 24px;\n  font-size: 14px;\n"])));
 var IdoExtensionsModal = function IdoExtensionsModal(_ref7) {
   var onExtensionsAdd = _ref7.onExtensionsAdd,
     onDismiss = _ref7.onDismiss,
@@ -19652,25 +18633,14 @@ var useIdoExtensionsModal = function useIdoExtensionsModal(_ref) {
   };
 };
 
-var PriceContainerWrapper$1 = styled.div.withConfig({
-  displayName: "PriceContainer__PriceContainerWrapper",
-  componentId: "sc-13wizbq-0"
-})(["display:flex;justify-content:space-between;align-items:space-around;flex-direction:column;padding:20px;background:", ";@-moz-document url-prefix(){background:rgba(36,36,36,0.95) !important;}border:1px solid rgba(255,255,255,0.03);box-sizing:border-box;border-radius:10px;max-height:170px;width:100%;height:100%;"], function (_ref) {
+var _templateObject$3, _templateObject2$2, _templateObject3$2, _templateObject4$2;
+var PriceContainerWrapper$1 = styled.div(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  align-items: space-around;\n  flex-direction: column;\n  padding: 20px;\n  background: ", ";\n  @-moz-document url-prefix() {\n    background: rgba(36, 36, 36, 0.95) !important;\n  }\n  border: 1px solid rgba(255, 255, 255, 0.03);\n  box-sizing: border-box;\n  border-radius: 10px;\n  max-height: 170px;\n  width: 100%;\n  height: 100%;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.backgrounds.secondary;
 });
-var HeaderWrapper$1 = styled.div.withConfig({
-  displayName: "PriceContainer__HeaderWrapper",
-  componentId: "sc-13wizbq-1"
-})(["display:flex;justify-content:space-between;align-items:center;margin-bottom:26px;"]);
-var OriginsWrapper = styled.div.withConfig({
-  displayName: "PriceContainer__OriginsWrapper",
-  componentId: "sc-13wizbq-2"
-})(["display:flex;justify-content:space-between;"]);
-var OriginTitle = styled(Text).withConfig({
-  displayName: "PriceContainer__OriginTitle",
-  componentId: "sc-13wizbq-3"
-})(["color:", ";cursor:pointer;padding:0px 12px;transition:all 0.5s;"], function (_ref2) {
+var HeaderWrapper$1 = styled.div(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 26px;\n"])));
+var OriginsWrapper = styled.div(_templateObject3$2 || (_templateObject3$2 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n"])));
+var OriginTitle = styled(Text)(_templateObject4$2 || (_templateObject4$2 = _taggedTemplateLiteral(["\n  color: ", ";\n  cursor: pointer;\n  padding: 0px 12px;\n  transition: all 0.5s;\n"])), function (_ref2) {
   var currentIndex = _ref2.currentIndex,
     index = _ref2.index,
     theme = _ref2.theme;
@@ -19720,28 +18690,17 @@ var PriceContainer = function PriceContainer(_ref3) {
   });
 };
 
-var PriceContainerWrapper = styled.div.withConfig({
-  displayName: "TopTokensContainer__PriceContainerWrapper",
-  componentId: "sc-1yxjpp7-0"
-})(["display:flex;justify-content:flex-start;align-items:space-around;flex-direction:column;padding:20px;@-moz-document url-prefix(){background:", ";!important;}background:", ";border:1px solid rgba(255,255,255,0.03);box-sizing:border-box;border-radius:10px;box-shadow:none;position:relative;overflow:hidden;"], function (_ref) {
+var _templateObject$2, _templateObject2$1, _templateObject3$1, _templateObject4$1, _templateObject5$1, _templateObject6$1, _templateObject7$1;
+var PriceContainerWrapper = styled.div(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: flex-start;\n  align-items: space-around;\n  flex-direction: column;\n  padding: 20px;\n  @-moz-document url-prefix() {\n    background: ", "; !important;\n  }\n\n  background: ", ";\n  border: 1px solid rgba(255, 255, 255, 0.03);\n  box-sizing: border-box;\n  border-radius: 10px;\n  box-shadow: none;\n\n  position: relative;\n  overflow: hidden;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.backgrounds.secondary;
 }, function (_ref2) {
   var theme = _ref2.theme;
   return theme.backgrounds.secondary;
 });
-var HeaderWrapper = styled.div.withConfig({
-  displayName: "TopTokensContainer__HeaderWrapper",
-  componentId: "sc-1yxjpp7-1"
-})(["display:flex;justify-content:space-between;align-items:center;margin-bottom:26px;"]);
-var TokensContainer = styled(GridLayout$1).withConfig({
-  displayName: "TopTokensContainer__TokensContainer",
-  componentId: "sc-1yxjpp7-2"
-})(["color:white;"]);
-var MainCoinWrapper = styled.div.withConfig({
-  displayName: "TopTokensContainer__MainCoinWrapper",
-  componentId: "sc-1yxjpp7-3"
-})(["grid-column:span 8;border-bottom:1px solid ", ";padding-bottom:10px;display:flex;justify-content:center;padding-right:20px;", "{grid-column:span 3;border-right:1px solid ", ";border-bottom:none;justify-content:flex-start;}"], function (_ref3) {
+var HeaderWrapper = styled.div(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 26px;\n"])));
+var TokensContainer = styled(GridLayout$1)(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteral(["\n  color: white;\n"])));
+var MainCoinWrapper = styled.div(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteral(["\n  grid-column: span 8;\n  border-bottom: 1px solid ", ";\n  padding-bottom: 10px;\n  display: flex;\n  justify-content: center;\n  padding-right: 20px;\n  ", " {\n    grid-column: span 3;\n    border-right: 1px solid ", ";\n    border-bottom: none;\n    justify-content: flex-start;\n  }\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.colors.grey;
 }, function (_ref4) {
@@ -19751,10 +18710,7 @@ var MainCoinWrapper = styled.div.withConfig({
   var theme = _ref5.theme;
   return theme.colors.grey;
 });
-var TokensWrapper = styled.div.withConfig({
-  displayName: "TopTokensContainer__TokensWrapper",
-  componentId: "sc-1yxjpp7-4"
-})(["height:100%;display:flex;justify-content:", ";grid-column:span 8;padding-bottom:20px;", " ", "{padding-bottom:0px;}"], function (_ref6) {
+var TokensWrapper = styled.div(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteral(["\n  height: 100%;\n  display: flex;\n  justify-content: ", ";\n  grid-column: span 8;\n  padding-bottom: 20px;\n  ", "\n  ", " {\n    padding-bottom: 0px;\n  }\n"])), function (_ref6) {
   var noData = _ref6.noData;
   return noData ? "center" : "space-between";
 }, function (_ref7) {
@@ -19764,14 +18720,8 @@ var TokensWrapper = styled.div.withConfig({
   var theme = _ref8.theme;
   return theme.mediaQueries.sm;
 });
-var DotsContainer = styled.div.withConfig({
-  displayName: "TopTokensContainer__DotsContainer",
-  componentId: "sc-1yxjpp7-5"
-})(["position:absolute;display:flex;align-items:center;@media (min-width:576px){right:20px;top:29px;}@media (max-width:576px){left:50%;transform:translate(-50%);bottom:17px !important;}"]);
-var Dot = styled.div.withConfig({
-  displayName: "TopTokensContainer__Dot",
-  componentId: "sc-1yxjpp7-6"
-})(["width:8px;height:8px;display:inline - block;margin:0 8px;border-radius:99px;background:", ";border:", ";cursor:pointer;padding:3px;"], function (_ref9) {
+var DotsContainer = styled.div(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteral(["\n  position: absolute;\n  display: flex;\n  align-items: center;\n  @media (min-width: 576px) {\n    right: 20px;\n    top: 29px;\n  }\n  @media (max-width: 576px) {\n    left: 50%;\n    transform: translate(-50%);\n    bottom: 17px !important;\n  }\n"])));
+var Dot = styled.div(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteral(["\n  width: 8px;\n  height: 8px;\n  display: inline - block;\n  margin: 0 8px;\n  border-radius: 99px;\n  background: ", ";\n  border: ", ";\n  cursor: pointer;\n  padding: 3px;\n"])), function (_ref9) {
   var active = _ref9.active,
     theme = _ref9.theme;
   return active ? theme.colors.blue : "transparent";
@@ -19865,47 +18815,24 @@ var TopTokensContainer = function TopTokensContainer(_ref1) {
   });
 };
 
-var ForParticipants = styled(Text).withConfig({
-  displayName: "IdoInfoDescription__ForParticipants",
-  componentId: "sc-16j3rl5-0"
-})(["margin:0 auto;width:155px;text-align:center;border:1px solid #12ffb8;line-height:28px;border-radius:10px;margin:106px auto 26px;"]);
-var HowToParticipate = styled(Text).withConfig({
-  displayName: "IdoInfoDescription__HowToParticipate",
-  componentId: "sc-16j3rl5-1"
-})(["text-align:center;width:100%;", "{font-size:26px;width:200px;margin:0 auto;}"], function (_ref) {
+var _templateObject$1, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
+var ForParticipants = styled(Text)(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteral(["\n  margin: 0 auto;\n  width: 155px;\n  text-align: center;\n  border: 1px solid #12ffb8;\n  line-height: 28px;\n  border-radius: 10px;\n  margin: 106px auto 26px;\n"])));
+var HowToParticipate = styled(Text)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  text-align: center;\n  width: 100%;\n  ", " {\n    font-size: 26px;\n    width: 200px;\n    margin: 0 auto;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.mobile;
 });
-var StepsWrapper = styled.div.withConfig({
-  displayName: "IdoInfoDescription__StepsWrapper",
-  componentId: "sc-16j3rl5-2"
-})(["display:flex;justify-content:space-between;align-items:flex-start;margin-top:40px;margin-bottom:60px;", "{flex-wrap:wrap;justify-content:center;row-gap:45px;}"], function (_ref2) {
+var StepsWrapper = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  margin-top: 40px;\n  margin-bottom: 60px;\n  ", " {\n    flex-wrap: wrap;\n    justify-content: center;\n    row-gap: 45px;\n  }\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.mediaQueries.desktop;
 });
-var SpacePadTierSystem = styled(Text).withConfig({
-  displayName: "IdoInfoDescription__SpacePadTierSystem",
-  componentId: "sc-16j3rl5-3"
-})(["text-align:center;width:100%;margin-top:170px;", "{font-size:26px;width:181px;margin:0 auto;margin-top:170px;}"], function (_ref3) {
+var SpacePadTierSystem = styled(Text)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  text-align: center;\n  width: 100%;\n  margin-top: 170px;\n  ", " {\n    font-size: 26px;\n    width: 181px;\n    margin: 0 auto;\n    margin-top: 170px;\n  }\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.mediaQueries.mobile;
 });
-var SpacePadTierSystemDescription = styled(Text).withConfig({
-  displayName: "IdoInfoDescription__SpacePadTierSystemDescription",
-  componentId: "sc-16j3rl5-4"
-})(["width:630px;margin:0 auto;color:rgba(255,255,255,0.55);text-align:center;margin-bottom:30px;@media screen and (max-width:760px){width:320px;}"]);
-var TiersWrapper = styled.div.withConfig({
-  displayName: "IdoInfoDescription__TiersWrapper",
-  componentId: "sc-16j3rl5-5"
-})(["display:flex;justify-content:center;gap:30px;@media screen and (max-width:1180px){flex-direction:column;align-items:center;}"]);
-var RightTiersColumn = styled.div.withConfig({
-  displayName: "IdoInfoDescription__RightTiersColumn",
-  componentId: "sc-16j3rl5-6"
-})(["display:flex;flex-wrap:wrap;justify-content:flex-end;max-width:730px;gap:30px;@media screen and (max-width:1180px){flex-direction:column;justify-content:center;}"]);
-var VerticalSeparator = styled.div.withConfig({
-  displayName: "IdoInfoDescription__VerticalSeparator",
-  componentId: "sc-16j3rl5-7"
-})(["border-left:1px solid #12ffb8;height:60px;position:absolute;left:50%;"]);
+var SpacePadTierSystemDescription = styled(Text)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  width: 630px;\n  margin: 0 auto;\n  color: rgba(255, 255, 255, 0.55);\n  text-align: center;\n  margin-bottom: 30px;\n  @media screen and (max-width: 760px) {\n    width: 320px;\n  }\n"])));
+var TiersWrapper = styled.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  gap: 30px;\n  @media screen and (max-width: 1180px) {\n    flex-direction: column;\n    align-items: center;\n  }\n"])));
+var RightTiersColumn = styled.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: flex-end;\n  max-width: 730px;\n  gap: 30px;\n  @media screen and (max-width: 1180px) {\n    flex-direction: column;\n    justify-content: center;\n  }\n"])));
+var VerticalSeparator = styled.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  border-left: 1px solid #12ffb8;\n  height: 60px;\n  position: absolute;\n  left: 50%;\n"])));
 var IdoInfoDescription = function IdoInfoDescription(_ref4) {
   var idoSteps = _ref4.idoSteps,
     tiers = _ref4.tiers;
@@ -19948,7 +18875,8 @@ var IdoInfoDescription = function IdoInfoDescription(_ref4) {
   });
 };
 
-var ResetCSS = createGlobalStyle(["html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}body{line-height:1;font-size:16px;}ol,ul{list-style:disc;list-style-position:inside;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:\"\";content:none;}table{border-collapse:collapse;border-spacing:0;}a{color:inherit;text-decoration:none;}[role=\"button\"]{cursor:pointer;}*,*::before,*::after{box-sizing:border-box;}*{font-family:'Manrope',sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}::-webkit-scrollbar{width:7px;}::-webkit-scrollbar-thumb{background:", ";border-radius:8px;}::-webkit-scrollbar-track{box-shadow:inset 0 0 5px ", ";border-radius:10px;}"], function (_ref) {
+var _templateObject;
+var ResetCSS = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  /* prettier-ignore */\n  html, body, div, span, applet, object, iframe,\n  h1, h2, h3, h4, h5, h6, p, blockquote, pre,\n  a, abbr, acronym, address, big, cite, code,\n  del, dfn, em, img, ins, kbd, q, s, samp,\n  small, strike, strong, sub, sup, tt, var,\n  b, u, i, center,\n  dl, dt, dd, ol, ul, li,\n  fieldset, form, label, legend,\n  table, caption, tbody, tfoot, thead, tr, th, td,\n  article, aside, canvas, details, embed, \n  figure, figcaption, footer, header, hgroup, \n  menu, nav, output, ruby, section, summary,\n  time, mark, audio, video {\n    margin: 0;\n    padding: 0;\n    border: 0;\n    font-size: 100%;\n    vertical-align: baseline;\n  }\n  /* HTML5 display-role reset for older browsers */\n  /* prettier-ignore */\n  article, aside, details, figcaption, figure, \n  footer, header, hgroup, menu, nav, section {\n    display: block;\n  }\n  body {\n    line-height: 1;\n    font-size: 16px;\n  }\n  ol,\n  ul {\n    list-style: disc;\n    list-style-position: inside;\n  }\n  blockquote,\n  q {\n    quotes: none;\n  }\n  blockquote:before,\n  blockquote:after,\n  q:before,\n  q:after {\n    content: \"\";\n    content: none;\n  }\n  table {\n    border-collapse: collapse;\n    border-spacing: 0;\n  }\n  a {\n    color: inherit;\n    text-decoration: none;\n  }\n  [role=\"button\"] {\n    cursor: pointer;\n  }\n  *,\n  *::before,\n  *::after {\n    box-sizing: border-box;\n  }\n  * {\n    font-family: 'Manrope', sans-serif;\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n  }\n  /* Scrollbar */\n  ::-webkit-scrollbar {\n    width: 7px;\n  }\n  ::-webkit-scrollbar-thumb {\n    background: ", "; \n    border-radius: 8px;\n  }\n  ::-webkit-scrollbar-track {\n    box-shadow: inset 0 0 5px ", "; \n    border-radius: 10px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.primary;
 }, function (_ref2) {