@sproutsocial/racine 12.2.0 → 12.4.1

package/dist/themes/light/theme.scss

@@ -1,712 +1,716 @@
 $theme: (
-  __esModule: true,
-  borderWidths: (
-    500: 1px
+  "__esModule": true,
+  "borderWidths": (
+    "500": 1px
   ),
-  borders: (
-    500: 1px solid
+  "borders": (
+    "500": 1px solid
   ),
-  breakpoints: (900px, 1200px, 1500px, 1800px),
-  default: (
-    breakpoints: (900px, 1200px, 1500px, 1800px),
-    colors: (
-      app: (
-        background: (
-          base: #f3f4f4
+  "breakpoints": (900px, 1200px, 1500px, 1800px),
+  "default": (
+    "breakpoints": (900px, 1200px, 1500px, 1800px),
+    "colors": (
+      "app": (
+        "background": (
+          "base": #f3f4f4
         )
       ),
-      container: (
-        background: (
-          base: #FFFFFF,
-          success: #d7f4d7,
-          warning: #fdefcd,
-          error: #ffd5d2,
-          info: #dcf2ff,
-          opportunity: #eaeaf9,
-          danger: #ffd5d2,
-          decorative: (
-            green: #d7f4d7,
-            blue: #dcf2ff,
-            purple: #eaeaf9,
-            yellow: #fdefcd,
-            orange: #fcdccc,
-            red: #ffd5d2,
-            neutral: #f3f4f4
+      "container": (
+        "background": (
+          "base": #FFFFFF,
+          "success": #d7f4d7,
+          "warning": #fdefcd,
+          "error": #ffd5d2,
+          "info": #dcf2ff,
+          "opportunity": #eaeaf9,
+          "danger": #ffd5d2,
+          "decorative": (
+            "green": #d7f4d7,
+            "blue": #dcf2ff,
+            "purple": #eaeaf9,
+            "yellow": #fdefcd,
+            "orange": #fcdccc,
+            "red": #ffd5d2,
+            "neutral": #f3f4f4
           ),
-          selected: #364141,
-          positive_sentiment: #3896e3,
-          negative_sentiment: #f76054,
-          neutral_sentiment: #c8cccc
+          "selected": #364141,
+          "positive_sentiment": #3896e3,
+          "negative_sentiment": #f76054,
+          "neutral_sentiment": #c8cccc
         ),
-        border: (
-          base: #dee1e1,
-          success: #59cb59,
-          warning: #ffbc00,
-          error: #ed4c42,
-          danger: #ed4c42,
-          info: #2b87d3,
-          opportunity: #9180f4,
-          decorative: (
-            green: #59cb59,
-            blue: #2b87d3,
-            purple: #9180f4,
-            yellow: #ffbc00,
-            orange: #f57d33,
-            red: #ed4c42,
-            neutral: #929a9b
+        "border": (
+          "base": #dee1e1,
+          "success": #59cb59,
+          "warning": #ffbc00,
+          "error": #ed4c42,
+          "danger": #ed4c42,
+          "info": #2b87d3,
+          "opportunity": #9180f4,
+          "decorative": (
+            "green": #59cb59,
+            "blue": #2b87d3,
+            "purple": #9180f4,
+            "yellow": #ffbc00,
+            "orange": #f57d33,
+            "red": #ed4c42,
+            "neutral": #929a9b
           ),
-          selected: #364141
+          "selected": #364141
         )
       ),
-      button: (
-        primary: (
-          background: (
-            base: #2079c3,
-            hover: #116daa,
-            active: #0c5689
+      "button": (
+        "primary": (
+          "background": (
+            "base": #2079c3,
+            "hover": #116daa,
+            "active": #0c5689
           ),
-          border: (
-            base: transparent
+          "border": (
+            "base": transparent
           ),
-          text: (
-            base: #FFFFFF,
-            hover: #FFFFFF
+          "text": (
+            "base": #FFFFFF,
+            "hover": #FFFFFF
           )
         ),
-        secondary: (
-          background: (
-            base: transparent,
-            hover: #364141,
-            active: #273333
+        "secondary": (
+          "background": (
+            "base": transparent,
+            "hover": #364141,
+            "active": #273333
           ),
-          border: (
-            base: #364141
+          "border": (
+            "base": #364141
           ),
-          text: (
-            base: #364141,
-            hover: #FFFFFF
+          "text": (
+            "base": #364141,
+            "hover": #FFFFFF
           )
         ),
-        pill: (
-          background: (
-            base: transparent,
-            hover: #f3f4f4,
-            active: #dee1e1
+        "pill": (
+          "background": (
+            "base": transparent,
+            "hover": #f3f4f4,
+            "active": #dee1e1
           ),
-          border: (
-            base: transparent
+          "border": (
+            "base": transparent
           ),
-          text: (
-            base: #364141,
-            hover: #273333
+          "text": (
+            "base": #364141,
+            "hover": #273333
           )
         ),
-        destructive: (
-          background: (
-            base: #c63434,
-            hover: #992222,
-            active: #6d1313
+        "destructive": (
+          "background": (
+            "base": #c63434,
+            "hover": #992222,
+            "active": #6d1313
           ),
-          border: (
-            base: transparent
+          "border": (
+            "base": transparent
           ),
-          text: (
-            base: #FFFFFF,
-            hover: #FFFFFF
+          "text": (
+            "base": #FFFFFF,
+            "hover": #FFFFFF
           )
         ),
-        placeholder: (
-          background: (
-            base: transparent,
-            hover: #FFFFFF,
-            active: #FFFFFF
+        "placeholder": (
+          "background": (
+            "base": transparent,
+            "hover": #FFFFFF,
+            "active": #FFFFFF
           ),
-          border: (
-            base: #929a9b
+          "border": (
+            "base": #929a9b
           ),
-          text: (
-            base: #2079c3,
-            hover: #116daa
+          "text": (
+            "base": #2079c3,
+            "hover": #116daa
           )
         ),
-        unstyled: (
-          background: (
-            base: transparent
+        "unstyled": (
+          "background": (
+            "base": transparent
           ),
-          border: (
-            base: transparent
+          "border": (
+            "base": transparent
           ),
-          text: (
-            base: #515e5f,
-            hover: #273333
+          "text": (
+            "base": #515e5f,
+            "hover": #273333
           )
         )
       ),
-      link: (
-        base: #116daa,
-        hover: #0c5689
-      ),
-      text: (
-        headline: #273333,
-        subtext: #515e5f,
-        body: #364141,
-        inverse: #FFFFFF,
-        error: #c63434,
-        background: (
-          highlight: #ffe99a
+      "link": (
+        "base": #116daa,
+        "hover": #0c5689
+      ),
+      "text": (
+        "headline": #273333,
+        "subtext": #515e5f,
+        "body": #364141,
+        "inverse": #FFFFFF,
+        "error": #c63434,
+        "background": (
+          "highlight": #ffe99a
         )
       ),
-      icon: (
-        base: #364141,
-        inverse: #FFFFFF,
-        success: #006b40,
-        warning: #944c0c,
-        error: #992222,
-        danger: #992222,
-        info: #0c5689,
-        opportunity: #5e4eba,
-        applied: #2079c3,
-        positive_sentiment: #2079c3,
-        negative_sentiment: #ed4c42,
-        neutral_sentiment: #6e797a
-      ),
-      form: (
-        background: (
-          base: #FFFFFF,
-          selected: #364141
+      "icon": (
+        "base": #364141,
+        "inverse": #FFFFFF,
+        "success": #006b40,
+        "warning": #944c0c,
+        "error": #992222,
+        "danger": #992222,
+        "info": #0c5689,
+        "opportunity": #5e4eba,
+        "applied": #2079c3,
+        "positive_sentiment": #2079c3,
+        "negative_sentiment": #ed4c42,
+        "neutral_sentiment": #6e797a
+      ),
+      "form": (
+        "background": (
+          "base": #FFFFFF,
+          "selected": #364141
         ),
-        border: (
-          base: #b0b6b7,
-          error: #ed4c42,
-          warning: #ffbc00,
-          selected: #364141
+        "border": (
+          "base": #b0b6b7,
+          "error": #ed4c42,
+          "warning": #ffbc00,
+          "selected": #364141
         ),
-        placeholder: (
-          base: #6e797a
+        "placeholder": (
+          "base": #6e797a
         )
       ),
-      listItem: (
-        background: (
-          base: transparent,
-          hover: #f3f4f4,
-          selected: #364141
+      "listItem": (
+        "background": (
+          "base": transparent,
+          "hover": #f3f4f4,
+          "selected": #364141
         )
       ),
-      overlay: (
-        background: (
-          base: rgba(22,32,32,0.56)
+      "overlay": (
+        "background": (
+          "base": rgba(22,32,32,0.56)
         ),
-        text: (
-          base: #FFFFFF
+        "text": (
+          "base": #FFFFFF
         ),
-        icon: (
-          base: #FFFFFF
+        "icon": (
+          "base": #FFFFFF
         )
       ),
-      elevation: (
-        base: #2733333D
-      ),
-      network: (
-        twitter: #1da1f2,
-        twitter_like: #e0245e,
-        facebook: #217bee,
-        facebook_audience_network: #58409B,
-        linkedin: #0A66C2,
-        instagram: #e4405f,
-        feedly: #2bb24c,
-        analytics: #ef6c00,
-        youtube: #ff0000,
-        messenger: #0084ff,
-        snapchat: #fffc00,
-        pinterest: #E60023,
-        tumblr: #35465c,
-        reddit: #ff4500,
-        tripadvisor: #00B087,
-        glassdoor: #0CAA41,
-        google_my_business: #4285F4,
-        google_business_messages: #1A73EA,
-        salesforce: #1589EE,
-        zendesk: #03363D,
-        hubspot: #FF7A59,
-        microsoft_dynamics: #002050,
-        yelp: #FF1A1A,
-        whatsapp: #25D366,
-        tiktok: #000000
-      ),
-      dataviz: (
-        map: (
-          1: #08c4b2,
-          2: #6f5ed3,
-          3: #ce3665,
-          4: #ffcd1c,
-          5: #3896e3,
-          6: #db61db,
-          7: #59cb59,
-          8: #fc8943,
-          9: #db3e3e,
-          10: #026661,
-          11: #a193f2,
-          12: #931847,
-          13: #944c0c,
-          14: #0c5689,
-          15: #6c2277,
-          16: #006b40,
-          17: #962c0b,
-          18: #ff7f6e,
-          19: #0ca750,
-          20: #ba7506
+      "elevation": (
+        "base": #2733333D
+      ),
+      "illustration": (
+        "fill": #56adf5,
+        "stroke": #273333
+      ),
+      "network": (
+        "twitter": #1da1f2,
+        "twitter_like": #e0245e,
+        "facebook": #217bee,
+        "facebook_audience_network": #58409B,
+        "linkedin": #0A66C2,
+        "instagram": #e4405f,
+        "feedly": #2bb24c,
+        "analytics": #ef6c00,
+        "youtube": #ff0000,
+        "messenger": #0084ff,
+        "snapchat": #fffc00,
+        "pinterest": #E60023,
+        "tumblr": #35465c,
+        "reddit": #ff4500,
+        "tripadvisor": #00B087,
+        "glassdoor": #0CAA41,
+        "google_my_business": #4285F4,
+        "google_business_messages": #1A73EA,
+        "salesforce": #1589EE,
+        "zendesk": #03363D,
+        "hubspot": #FF7A59,
+        "microsoft_dynamics": #002050,
+        "yelp": #FF1A1A,
+        "whatsapp": #25D366,
+        "tiktok": #000000
+      ),
+      "dataviz": (
+        "map": (
+          "1": #08c4b2,
+          "2": #6f5ed3,
+          "3": #ce3665,
+          "4": #ffcd1c,
+          "5": #3896e3,
+          "6": #db61db,
+          "7": #59cb59,
+          "8": #fc8943,
+          "9": #db3e3e,
+          "10": #026661,
+          "11": #a193f2,
+          "12": #931847,
+          "13": #944c0c,
+          "14": #0c5689,
+          "15": #6c2277,
+          "16": #006b40,
+          "17": #962c0b,
+          "18": #ff7f6e,
+          "19": #0ca750,
+          "20": #ba7506
         ),
-        list: (#08c4b2, #6f5ed3, #ce3665, #ffcd1c, #3896e3, #db61db, #59cb59, #fc8943, #db3e3e, #026661, #a193f2, #931847, #944c0c, #0c5689, #6c2277, #006b40, #962c0b, #ff7f6e, #0ca750, #ba7506)
-      ),
-      neutral: (
-        0: #FFFFFF,
-        100: #f3f4f4,
-        200: #dee1e1,
-        300: #c8cccc,
-        400: #b0b6b7,
-        500: #929a9b,
-        600: #6e797a,
-        700: #515e5f,
-        800: #364141,
-        900: #273333,
-        1000: #162020,
-        1100: #040404
-      ),
-      green: (
-        0: #ebf9eb,
-        100: #d7f4d7,
-        200: #c2f2bd,
-        300: #98e58e,
-        400: #75dd66,
-        500: #59cb59,
-        600: #2bb656,
-        700: #0ca750,
-        800: #008b46,
-        900: #006b40,
-        1000: #08422f,
-        1100: #002b20
-      ),
-      red: (
-        0: #ffeae9,
-        100: #ffd5d2,
-        200: #ffb8b1,
-        300: #ff9c8f,
-        400: #ff7f6e,
-        500: #f76054,
-        600: #ed4c42,
-        700: #db3e3e,
-        800: #c63434,
-        900: #992222,
-        1000: #6d1313,
-        1100: #2b1111
-      ),
-      blue: (
-        0: #e9f8ff,
-        100: #dcf2ff,
-        200: #c7e4f9,
-        300: #a1d2f8,
-        400: #56adf5,
-        500: #3896e3,
-        600: #2b87d3,
-        700: #2079c3,
-        800: #116daa,
-        900: #0c5689,
-        1000: #0a3960,
-        1100: #002138
-      ),
-      teal: (
-        0: #e5f9f5,
-        100: #cdf7ef,
-        200: #b3f2e6,
-        300: #7dead5,
-        400: #24e0c5,
-        500: #08c4b2,
-        600: #00a99c,
-        700: #0b968f,
-        800: #067c7c,
-        900: #026661,
-        1000: #083f3f,
-        1100: #002528
-      ),
-      aqua: (
-        0: #d9fcfb,
-        100: #c5f9f9,
-        200: #a5f2f2,
-        300: #76e5e2,
-        400: #33d6e2,
-        500: #17b8ce,
-        600: #0797ae,
-        700: #0b8599,
-        800: #0f6e84,
-        900: #035e73,
-        1000: #083d4f,
-        1100: #002838
-      ),
-      purple: (
-        0: #f2f2f9,
-        100: #eaeaf9,
-        200: #d8d7f9,
-        300: #c1c1f7,
-        400: #a193f2,
-        500: #9180f4,
-        600: #816fea,
-        700: #6f5ed3,
-        800: #5e4eba,
-        900: #483a9c,
-        1000: #2d246b,
-        1100: #1d1d38
-      ),
-      magenta: (
-        0: #fef0ff,
-        100: #f9e3fc,
-        200: #f4c4f7,
-        300: #edadf2,
-        400: #f282f5,
-        500: #db61db,
-        600: #c44eb9,
-        700: #ac44a8,
-        800: #8f3896,
-        900: #6c2277,
-        1000: #451551,
-        1100: #29192d
-      ),
-      yellow: (
-        0: #fff8e2,
-        100: #fdefcd,
-        200: #ffe99a,
-        300: #ffe16e,
-        400: #ffd943,
-        500: #ffcd1c,
-        600: #ffbc00,
-        700: #dd9903,
-        800: #ba7506,
-        900: #944c0c,
-        1000: #542a00,
-        1100: #2d1a05
-      ),
-      pink: (
-        0: #ffe9f3,
-        100: #fcdbeb,
-        200: #ffb5d5,
-        300: #ff95c1,
-        400: #ff76ae,
-        500: #ef588b,
-        600: #e0447c,
-        700: #ce3665,
-        800: #b22f5b,
-        900: #931847,
-        1000: #561231,
-        1100: #2b1721
-      ),
-      orange: (
-        0: #ffede3,
-        100: #fcdccc,
-        200: #ffc6a4,
-        300: #ffb180,
-        400: #ff9c5d,
-        500: #fc8943,
-        600: #f57d33,
-        700: #ed7024,
-        800: #ce5511,
-        900: #962c0b,
-        1000: #601700,
-        1100: #2d130e
-      ),
-      DATAVIZ_COLORS_LIST: (#08c4b2, #6f5ed3, #ce3665, #ffcd1c, #3896e3, #db61db, #59cb59, #fc8943, #db3e3e, #026661, #a193f2, #931847, #944c0c, #0c5689, #6c2277, #006b40, #962c0b, #ff7f6e, #0ca750, #ba7506),
-      DATAVIZ_COLORS_MAP: (
-        1: #08c4b2,
-        2: #6f5ed3,
-        3: #ce3665,
-        4: #ffcd1c,
-        5: #3896e3,
-        6: #db61db,
-        7: #59cb59,
-        8: #fc8943,
-        9: #db3e3e,
-        10: #026661,
-        11: #a193f2,
-        12: #931847,
-        13: #944c0c,
-        14: #0c5689,
-        15: #6c2277,
-        16: #006b40,
-        17: #962c0b,
-        18: #ff7f6e,
-        19: #0ca750,
-        20: #ba7506
+        "list": (#08c4b2, #6f5ed3, #ce3665, #ffcd1c, #3896e3, #db61db, #59cb59, #fc8943, #db3e3e, #026661, #a193f2, #931847, #944c0c, #0c5689, #6c2277, #006b40, #962c0b, #ff7f6e, #0ca750, #ba7506)
+      ),
+      "neutral": (
+        "0": #FFFFFF,
+        "100": #f3f4f4,
+        "200": #dee1e1,
+        "300": #c8cccc,
+        "400": #b0b6b7,
+        "500": #929a9b,
+        "600": #6e797a,
+        "700": #515e5f,
+        "800": #364141,
+        "900": #273333,
+        "1000": #162020,
+        "1100": #040404
+      ),
+      "green": (
+        "0": #ebf9eb,
+        "100": #d7f4d7,
+        "200": #c2f2bd,
+        "300": #98e58e,
+        "400": #75dd66,
+        "500": #59cb59,
+        "600": #2bb656,
+        "700": #0ca750,
+        "800": #008b46,
+        "900": #006b40,
+        "1000": #08422f,
+        "1100": #002b20
+      ),
+      "red": (
+        "0": #ffeae9,
+        "100": #ffd5d2,
+        "200": #ffb8b1,
+        "300": #ff9c8f,
+        "400": #ff7f6e,
+        "500": #f76054,
+        "600": #ed4c42,
+        "700": #db3e3e,
+        "800": #c63434,
+        "900": #992222,
+        "1000": #6d1313,
+        "1100": #2b1111
+      ),
+      "blue": (
+        "0": #e9f8ff,
+        "100": #dcf2ff,
+        "200": #c7e4f9,
+        "300": #a1d2f8,
+        "400": #56adf5,
+        "500": #3896e3,
+        "600": #2b87d3,
+        "700": #2079c3,
+        "800": #116daa,
+        "900": #0c5689,
+        "1000": #0a3960,
+        "1100": #002138
+      ),
+      "teal": (
+        "0": #e5f9f5,
+        "100": #cdf7ef,
+        "200": #b3f2e6,
+        "300": #7dead5,
+        "400": #24e0c5,
+        "500": #08c4b2,
+        "600": #00a99c,
+        "700": #0b968f,
+        "800": #067c7c,
+        "900": #026661,
+        "1000": #083f3f,
+        "1100": #002528
+      ),
+      "aqua": (
+        "0": #d9fcfb,
+        "100": #c5f9f9,
+        "200": #a5f2f2,
+        "300": #76e5e2,
+        "400": #33d6e2,
+        "500": #17b8ce,
+        "600": #0797ae,
+        "700": #0b8599,
+        "800": #0f6e84,
+        "900": #035e73,
+        "1000": #083d4f,
+        "1100": #002838
+      ),
+      "purple": (
+        "0": #f2f2f9,
+        "100": #eaeaf9,
+        "200": #d8d7f9,
+        "300": #c1c1f7,
+        "400": #a193f2,
+        "500": #9180f4,
+        "600": #816fea,
+        "700": #6f5ed3,
+        "800": #5e4eba,
+        "900": #483a9c,
+        "1000": #2d246b,
+        "1100": #1d1d38
+      ),
+      "magenta": (
+        "0": #fef0ff,
+        "100": #f9e3fc,
+        "200": #f4c4f7,
+        "300": #edadf2,
+        "400": #f282f5,
+        "500": #db61db,
+        "600": #c44eb9,
+        "700": #ac44a8,
+        "800": #8f3896,
+        "900": #6c2277,
+        "1000": #451551,
+        "1100": #29192d
+      ),
+      "yellow": (
+        "0": #fff8e2,
+        "100": #fdefcd,
+        "200": #ffe99a,
+        "300": #ffe16e,
+        "400": #ffd943,
+        "500": #ffcd1c,
+        "600": #ffbc00,
+        "700": #dd9903,
+        "800": #ba7506,
+        "900": #944c0c,
+        "1000": #542a00,
+        "1100": #2d1a05
+      ),
+      "pink": (
+        "0": #ffe9f3,
+        "100": #fcdbeb,
+        "200": #ffb5d5,
+        "300": #ff95c1,
+        "400": #ff76ae,
+        "500": #ef588b,
+        "600": #e0447c,
+        "700": #ce3665,
+        "800": #b22f5b,
+        "900": #931847,
+        "1000": #561231,
+        "1100": #2b1721
+      ),
+      "orange": (
+        "0": #ffede3,
+        "100": #fcdccc,
+        "200": #ffc6a4,
+        "300": #ffb180,
+        "400": #ff9c5d,
+        "500": #fc8943,
+        "600": #f57d33,
+        "700": #ed7024,
+        "800": #ce5511,
+        "900": #962c0b,
+        "1000": #601700,
+        "1100": #2d130e
+      ),
+      "DATAVIZ_COLORS_LIST": (#08c4b2, #6f5ed3, #ce3665, #ffcd1c, #3896e3, #db61db, #59cb59, #fc8943, #db3e3e, #026661, #a193f2, #931847, #944c0c, #0c5689, #6c2277, #006b40, #962c0b, #ff7f6e, #0ca750, #ba7506),
+      "DATAVIZ_COLORS_MAP": (
+        "1": #08c4b2,
+        "2": #6f5ed3,
+        "3": #ce3665,
+        "4": #ffcd1c,
+        "5": #3896e3,
+        "6": #db61db,
+        "7": #59cb59,
+        "8": #fc8943,
+        "9": #db3e3e,
+        "10": #026661,
+        "11": #a193f2,
+        "12": #931847,
+        "13": #944c0c,
+        "14": #0c5689,
+        "15": #6c2277,
+        "16": #006b40,
+        "17": #962c0b,
+        "18": #ff7f6e,
+        "19": #0ca750,
+        "20": #ba7506
       )
     ),
-    typography: (
-      100: (
-        fontSize: 11px,
-        lineHeight: 18.666666666666668px
-      ),
-      200: (
-        fontSize: 13px,
-        lineHeight: 21.333333333333332px
-      ),
-      300: (
-        fontSize: 16px,
-        lineHeight: 24px
-      ),
-      400: (
-        fontSize: 18px,
-        lineHeight: 26.666666666666668px
-      ),
-      500: (
-        fontSize: 21px,
-        lineHeight: 29.333333333333332px
-      ),
-      600: (
-        fontSize: 24px,
-        lineHeight: 32px
-      ),
-      700: (
-        fontSize: 32px,
-        lineHeight: 40px
-      ),
-      800: (
-        fontSize: 43px,
-        lineHeight: 50.666666666666664px
-      ),
-      900: (
-        fontSize: 57px,
-        lineHeight: 64px
-      ),
-      1000: (
-        fontSize: 76px,
-        lineHeight: 80px
-      ),
-      1100: (
-        fontSize: 101px,
-        lineHeight: 101.33333333333333px
-      ),
-      1200: (
-        fontSize: 135px,
-        lineHeight: 125.33333333333333px
-      ),
-      typography: (
-        100: (
-          fontSize: 11px,
-          lineHeight: 18.666666666666668px
+    "typography": (
+      "100": (
+        "fontSize": 11px,
+        "lineHeight": 18.666666666666668px
+      ),
+      "200": (
+        "fontSize": 13px,
+        "lineHeight": 21.333333333333332px
+      ),
+      "300": (
+        "fontSize": 16px,
+        "lineHeight": 24px
+      ),
+      "400": (
+        "fontSize": 18px,
+        "lineHeight": 26.666666666666668px
+      ),
+      "500": (
+        "fontSize": 21px,
+        "lineHeight": 29.333333333333332px
+      ),
+      "600": (
+        "fontSize": 24px,
+        "lineHeight": 32px
+      ),
+      "700": (
+        "fontSize": 32px,
+        "lineHeight": 40px
+      ),
+      "800": (
+        "fontSize": 43px,
+        "lineHeight": 50.666666666666664px
+      ),
+      "900": (
+        "fontSize": 57px,
+        "lineHeight": 64px
+      ),
+      "1000": (
+        "fontSize": 76px,
+        "lineHeight": 80px
+      ),
+      "1100": (
+        "fontSize": 101px,
+        "lineHeight": 101.33333333333333px
+      ),
+      "1200": (
+        "fontSize": 135px,
+        "lineHeight": 125.33333333333333px
+      ),
+      "typography": (
+        "100": (
+          "fontSize": 11px,
+          "lineHeight": 18.666666666666668px
         ),
-        200: (
-          fontSize: 13px,
-          lineHeight: 21.333333333333332px
+        "200": (
+          "fontSize": 13px,
+          "lineHeight": 21.333333333333332px
         ),
-        300: (
-          fontSize: 16px,
-          lineHeight: 24px
+        "300": (
+          "fontSize": 16px,
+          "lineHeight": 24px
         ),
-        400: (
-          fontSize: 18px,
-          lineHeight: 26.666666666666668px
+        "400": (
+          "fontSize": 18px,
+          "lineHeight": 26.666666666666668px
         ),
-        500: (
-          fontSize: 21px,
-          lineHeight: 29.333333333333332px
+        "500": (
+          "fontSize": 21px,
+          "lineHeight": 29.333333333333332px
         ),
-        600: (
-          fontSize: 24px,
-          lineHeight: 32px
+        "600": (
+          "fontSize": 24px,
+          "lineHeight": 32px
         ),
-        700: (
-          fontSize: 32px,
-          lineHeight: 40px
+        "700": (
+          "fontSize": 32px,
+          "lineHeight": 40px
         ),
-        800: (
-          fontSize: 43px,
-          lineHeight: 50.666666666666664px
+        "800": (
+          "fontSize": 43px,
+          "lineHeight": 50.666666666666664px
         ),
-        900: (
-          fontSize: 57px,
-          lineHeight: 64px
+        "900": (
+          "fontSize": 57px,
+          "lineHeight": 64px
         ),
-        1000: (
-          fontSize: 76px,
-          lineHeight: 80px
+        "1000": (
+          "fontSize": 76px,
+          "lineHeight": 80px
         ),
-        1100: (
-          fontSize: 101px,
-          lineHeight: 101.33333333333333px
+        "1100": (
+          "fontSize": 101px,
+          "lineHeight": 101.33333333333333px
         ),
-        1200: (
-          fontSize: 135px,
-          lineHeight: 125.33333333333333px
+        "1200": (
+          "fontSize": 135px,
+          "lineHeight": 125.33333333333333px
         )
       )
     ),
-    fontFamily: "system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif",
-    fontWeights: (
-      normal: 400,
-      semibold: 600,
-      bold: 700,
-      extrabold: 800
+    "fontFamily": "system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif",
+    "fontWeights": (
+      "normal": 400,
+      "semibold": 600,
+      "bold": 700,
+      "extrabold": 800
     ),
-    space: (
-      0: 0px,
-      100: 2px,
-      200: 4px,
-      300: 8px,
-      350: 12px,
-      400: 16px,
-      450: 24px,
-      500: 32px,
-      600: 40px,
-      space: (
-        0: 0px,
-        100: 2px,
-        200: 4px,
-        300: 8px,
-        350: 12px,
-        400: 16px,
-        450: 24px,
-        500: 32px,
-        600: 40px
-      ),
-      -space: (
-        0: -0px,
-        100: -2px,
-        200: -4px,
-        300: -8px,
-        350: -12px,
-        400: -16px,
-        450: -24px,
-        500: -32px,
-        600: -40px
+    "space": (
+      "0": 0px,
+      "100": 2px,
+      "200": 4px,
+      "300": 8px,
+      "350": 12px,
+      "400": 16px,
+      "450": 24px,
+      "500": 32px,
+      "600": 40px,
+      "space": (
+        "0": 0px,
+        "100": 2px,
+        "200": 4px,
+        "300": 8px,
+        "350": 12px,
+        "400": 16px,
+        "450": 24px,
+        "500": 32px,
+        "600": 40px
+      ),
+      "-space": (
+        "0": -0px,
+        "100": -2px,
+        "200": -4px,
+        "300": -8px,
+        "350": -12px,
+        "400": -16px,
+        "450": -24px,
+        "500": -32px,
+        "600": -40px
       )
     ),
-    radii: (
-      400: 4px,
-      500: 6px,
-      600: 8px,
-      1000: 999999px,
-      inner: 6px,
-      outer: 8px,
-      pill: 999999px,
-      radii: (
-        400: 4px,
-        500: 6px,
-        600: 8px,
-        1000: 999999px,
-        inner: 6px,
-        outer: 8px,
-        pill: 999999px
+    "radii": (
+      "400": 4px,
+      "500": 6px,
+      "600": 8px,
+      "1000": 999999px,
+      "inner": 6px,
+      "outer": 8px,
+      "pill": 999999px,
+      "radii": (
+        "400": 4px,
+        "500": 6px,
+        "600": 8px,
+        "1000": 999999px,
+        "inner": 6px,
+        "outer": 8px,
+        "pill": 999999px
       )
     ),
-    borders: (
-      500: 1px solid
+    "borders": (
+      "500": 1px solid
     ),
-    borderWidths: (
-      500: 1px
+    "borderWidths": (
+      "500": 1px
     ),
-    shadows: (
-      low: 0px 2px 4px #2733333D,
-      medium: 0px 8px 16px #2733333D,
-      high: 0px 16px 32px #2733333D
+    "shadows": (
+      "low": 0px 2px 4px #2733333D,
+      "medium": 0px 8px 16px #2733333D,
+      "high": 0px 16px 32px #2733333D
     ),
-    easing: (
-      ease_in: cubic-bezier(.4, 0, .7, .2),
-      ease_out: cubic-bezier(0, 0, .2, 1),
-      ease_inout: cubic-bezier(.4, 0, .2, 1)
+    "easing": (
+      "ease_in": cubic-bezier(.4, 0, .7, .2),
+      "ease_out": cubic-bezier(0, 0, .2, 1),
+      "ease_inout": cubic-bezier(.4, 0, .2, 1)
     ),
-    duration: (
-      fast: .15s,
-      medium: .3s,
-      slow: .6s
+    "duration": (
+      "fast": .15s,
+      "medium": .3s,
+      "slow": .6s
     ),
-    mode: light
+    "mode": light
   ),
-  duration: (
-    fast: .15s,
-    medium: .3s,
-    slow: .6s
+  "duration": (
+    "fast": .15s,
+    "medium": .3s,
+    "slow": .6s
   ),
-  easing: (
-    ease_in: cubic-bezier(.4, 0, .7, .2),
-    ease_out: cubic-bezier(0, 0, .2, 1),
-    ease_inout: cubic-bezier(.4, 0, .2, 1)
+  "easing": (
+    "ease_in": cubic-bezier(.4, 0, .7, .2),
+    "ease_out": cubic-bezier(0, 0, .2, 1),
+    "ease_inout": cubic-bezier(.4, 0, .2, 1)
   ),
-  fontFamily: "system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif",
-  fontWeights: (
-    normal: 400,
-    semibold: 600,
-    bold: 700,
-    extrabold: 800
+  "fontFamily": "system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif",
+  "fontWeights": (
+    "normal": 400,
+    "semibold": 600,
+    "bold": 700,
+    "extrabold": 800
   ),
-  radii: (
-    400: 4px,
-    500: 6px,
-    600: 8px,
-    1000: 999999px,
-    inner: 6px,
-    outer: 8px,
-    pill: 999999px
+  "radii": (
+    "400": 4px,
+    "500": 6px,
+    "600": 8px,
+    "1000": 999999px,
+    "inner": 6px,
+    "outer": 8px,
+    "pill": 999999px
   ),
-  shadows: (
-    low: 0px 2px 4px #2733333D,
-    medium: 0px 8px 16px #2733333D,
-    high: 0px 16px 32px #2733333D
+  "shadows": (
+    "low": 0px 2px 4px #2733333D,
+    "medium": 0px 8px 16px #2733333D,
+    "high": 0px 16px 32px #2733333D
   ),
-  space: (
-    0: 0px,
-    100: 2px,
-    200: 4px,
-    300: 8px,
-    350: 12px,
-    400: 16px,
-    450: 24px,
-    500: 32px,
-    600: 40px
+  "space": (
+    "0": 0px,
+    "100": 2px,
+    "200": 4px,
+    "300": 8px,
+    "350": 12px,
+    "400": 16px,
+    "450": 24px,
+    "500": 32px,
+    "600": 40px
   ),
-  typography: (
-    100: (
-      fontSize: 11px,
-      lineHeight: 18.666666666666668px
+  "typography": (
+    "100": (
+      "fontSize": 11px,
+      "lineHeight": 18.666666666666668px
     ),
-    200: (
-      fontSize: 13px,
-      lineHeight: 21.333333333333332px
+    "200": (
+      "fontSize": 13px,
+      "lineHeight": 21.333333333333332px
     ),
-    300: (
-      fontSize: 16px,
-      lineHeight: 24px
+    "300": (
+      "fontSize": 16px,
+      "lineHeight": 24px
     ),
-    400: (
-      fontSize: 18px,
-      lineHeight: 26.666666666666668px
+    "400": (
+      "fontSize": 18px,
+      "lineHeight": 26.666666666666668px
     ),
-    500: (
-      fontSize: 21px,
-      lineHeight: 29.333333333333332px
+    "500": (
+      "fontSize": 21px,
+      "lineHeight": 29.333333333333332px
     ),
-    600: (
-      fontSize: 24px,
-      lineHeight: 32px
+    "600": (
+      "fontSize": 24px,
+      "lineHeight": 32px
     ),
-    700: (
-      fontSize: 32px,
-      lineHeight: 40px
+    "700": (
+      "fontSize": 32px,
+      "lineHeight": 40px
     ),
-    800: (
-      fontSize: 43px,
-      lineHeight: 50.666666666666664px
+    "800": (
+      "fontSize": 43px,
+      "lineHeight": 50.666666666666664px
     ),
-    900: (
-      fontSize: 57px,
-      lineHeight: 64px
+    "900": (
+      "fontSize": 57px,
+      "lineHeight": 64px
     ),
-    1000: (
-      fontSize: 76px,
-      lineHeight: 80px
+    "1000": (
+      "fontSize": 76px,
+      "lineHeight": 80px
     ),
-    1100: (
-      fontSize: 101px,
-      lineHeight: 101.33333333333333px
+    "1100": (
+      "fontSize": 101px,
+      "lineHeight": 101.33333333333333px
     ),
-    1200: (
-      fontSize: 135px,
-      lineHeight: 125.33333333333333px
+    "1200": (
+      "fontSize": 135px,
+      "lineHeight": 125.33333333333333px
     )
   )
 );