@revikornmann/muka-ui 0.2.1

package/dist/styles/tokens-grip-dark.css

@@ -0,0 +1,1868 @@
+/* Muka Design System Tokens */
+/* Generated automatically from design tokens */
+
+:root {
+  --font-size-xs: 0.75rem;
+  --font-size-sm: 0.875rem;
+  --font-size-md: 1rem;
+  --font-size-lg: 1.125rem;
+  --font-size-xl: 1.25rem;
+  --font-size-2xl: 1.5rem;
+  --font-size-3xl: 2rem;
+  --font-size-4xl: 2.5rem;
+  --font-size-5xl: 3rem;
+  --font-size-6xl: 4rem;
+  --font-lineHeight-xs: 0.75rem;
+  --font-lineHeight-sm: 0.875rem;
+  --font-lineHeight-md: 1rem;
+  --font-lineHeight-lg: 1.125rem;
+  --font-lineHeight-xl: 1.25rem;
+  --font-lineHeight-2xl: 1.5rem;
+  --font-lineHeight-3xl: 2rem;
+  --font-lineHeight-4xl: 2.5rem;
+  --font-lineHeight-5xl: 3rem;
+  --font-lineHeight-6xl: 4rem;
+  --font-letterSpacing-tighter: -0.05em;
+  --font-letterSpacing-tight: -0.025em;
+  --font-letterSpacing-normal: 0;
+  --font-letterSpacing-wide: 0.025em;
+  --font-letterSpacing-wider: 0.05em;
+  --font-letterSpacing-widest: 0.1em;
+  --spacing-0: 0px;
+  --spacing-1: 0.25rem;
+  --spacing-2: 0.5rem;
+  --spacing-3: 0.75rem;
+  --spacing-4: 1rem;
+  --spacing-5: 1.25rem;
+  --spacing-6: 1.5rem;
+  --spacing-7: 1.75rem;
+  --spacing-8: 2rem;
+  --spacing-9: 2.25rem;
+  --spacing-10: 2.5rem;
+  --spacing-11: 2.75rem;
+  --spacing-12: 3rem;
+  --spacing-14: 3.5rem;
+  --spacing-16: 4rem;
+  --spacing-20: 5rem;
+  --spacing-24: 6rem;
+  --spacing-28: 7rem;
+  --spacing-32: 8rem;
+  --spacing-36: 9rem;
+  --spacing-40: 10rem;
+  --spacing-44: 11rem;
+  --spacing-48: 12rem;
+  --spacing-52: 13rem;
+  --spacing-56: 14rem;
+  --spacing-60: 15rem;
+  --spacing-64: 16rem;
+  --spacing-72: 18rem;
+  --spacing-80: 20rem;
+  --spacing-96: 24rem;
+  --spacing-px: 1px;
+  --radius-sm: 0.1875rem;
+  --radius-md: 0.375rem;
+  --radius-lg: 0.75rem;
+  --radius-xl: 1.5rem;
+  --radius-2xl: 3rem;
+  --radius-full: 999rem;
+  --breakpoint-sm: 640px;
+  --breakpoint-md: 768px;
+  --breakpoint-lg: 1024px;
+  --breakpoint-xl: 1280px;
+  --size-0: 0rem;
+  --size-4xs: 0.0625rem;
+  --size-3xs: 0.125rem;
+  --size-2xs: 0.25rem;
+  --size-xs: 0.5rem;
+  --size-sm: 0.75rem;
+  --size-md: 1rem;
+  --size-lg: 1.25rem;
+  --size-xl: 1.5rem;
+  --size-2xl: 2rem;
+  --size-3xl: 2.5rem;
+  --size-4xl: 3rem;
+  --size-5xl: 3.5rem;
+  --size-6xl: 4rem;
+  --size-7xl: 4.5rem;
+  --size-8xl: 5rem;
+  --size-9xl: 6rem;
+  --size-10xl: 7rem;
+  --size-11xl: 8rem;
+  --size-12xl: 9rem;
+  --size-13xl: 10rem;
+  --size-14xl: 11rem;
+  --size-15xl: 12rem;
+  --size-16xl: 13rem;
+  --size-17xl: 14rem;
+  --size-18xl: 15rem;
+  --size-19xl: 16rem;
+  --size-20xl: 17rem;
+  --size-21xl: 18rem;
+  --size-22xl: 19rem;
+  --size-23xl: 20rem;
+  --size-24xl: 21rem;
+  --size-25xl: 22rem;
+  --size-26xl: 23rem;
+  --size-27xl: 24rem;
+  --size-28xl: 25rem;
+  --size-29xl: 26rem;
+  --size-30xl: 27rem;
+  --size-31xl: 28rem;
+  --size-32xl: 29rem;
+  --size-33xl: 30rem;
+  --size-34xl: 31rem;
+  --size-35xl: 32rem;
+  --size-36xl: 33rem;
+  --size-37xl: 34rem;
+  --size-38xl: 35rem;
+  --size-39xl: 36rem;
+  --size-40xl: 37rem;
+  --size-41xl: 38rem;
+  --size-42xl: 39rem;
+  --size-43xl: 40rem;
+  --size-44xl: 41rem;
+  --size-45xl: 42rem;
+  --size-46xl: 43rem;
+  --size-47xl: 44rem;
+  --size-48xl: 45rem;
+  --size-49xl: 46rem;
+  --size-50xl: 47rem;
+  --size-51xl: 48rem;
+  --size-52xl: 49rem;
+  --size-53xl: 50rem;
+  --container-max-width-sm: 640px;
+  --container-max-width-md: 768px;
+  --container-max-width-lg: 1024px;
+  --container-max-width-xl: 1280px;
+  --container-max-width-2xl: 1536px;
+  --container-max-width-small: 640px;
+  --container-max-width-medium: 768px;
+  --container-max-width-large: 1024px;
+  --container-max-width-xlarge: 1280px;
+  --container-gap-default: 2rem;
+  --container-gap-compact: 1.5rem;
+  --container-gap-spacious: 2.5rem;
+  --color-white: #ffffff;
+  --color-black: #000000;
+  --color-gray-1: #fcfcfc;
+  --color-gray-2: #f9f9f9;
+  --color-gray-3: #f0f0f0;
+  --color-gray-4: #e8e8e8;
+  --color-gray-5: #e0e0e0;
+  --color-gray-6: #d9d9d9;
+  --color-gray-7: #cecece;
+  --color-gray-8: #bbbbbb;
+  --color-gray-9: #8d8d8d;
+  --color-gray-10: #838383;
+  --color-gray-11: #646464;
+  --color-gray-12: #202020;
+  --color-mauve-1: #fdfcfd;
+  --color-mauve-2: #faf9fb;
+  --color-mauve-3: #f2eff3;
+  --color-mauve-4: #eae7ec;
+  --color-mauve-5: #e3dfe6;
+  --color-mauve-6: #dbd8e0;
+  --color-mauve-7: #d0cdd7;
+  --color-mauve-8: #bcbac7;
+  --color-mauve-9: #8e8c99;
+  --color-mauve-10: #84828e;
+  --color-mauve-11: #65636d;
+  --color-mauve-12: #211f26;
+  --color-slate-1: #FCFCFD;
+  --color-slate-2: #F9F9FB;
+  --color-slate-3: #F0F0F3;
+  --color-slate-4: #E8E8EC;
+  --color-slate-5: #E0E1E6;
+  --color-slate-6: #D9D9E0;
+  --color-slate-7: #CDCED6;
+  --color-slate-8: #B9BBC6;
+  --color-slate-9: #8B8D98;
+  --color-slate-10: #80838D;
+  --color-slate-11: #60646C;
+  --color-slate-12: #1C2024;
+  --color-sage-1: #fbfdfc;
+  --color-sage-2: #f7f9f8;
+  --color-sage-3: #eef1f0;
+  --color-sage-4: #e6e9e8;
+  --color-sage-5: #dfe2e0;
+  --color-sage-6: #d7dad9;
+  --color-sage-7: #cbcfcd;
+  --color-sage-8: #b8bcba;
+  --color-sage-9: #868e8b;
+  --color-sage-10: #7c8481;
+  --color-sage-11: #5f6563;
+  --color-sage-12: #1a211e;
+  --color-olive-1: #fcfdfc;
+  --color-olive-2: #f8faf8;
+  --color-olive-3: #eff1ef;
+  --color-olive-4: #e7e9e7;
+  --color-olive-5: #dfe2df;
+  --color-olive-6: #d7dad7;
+  --color-olive-7: #cccfcc;
+  --color-olive-8: #b9bcb8;
+  --color-olive-9: #898e87;
+  --color-olive-10: #7f847d;
+  --color-olive-11: #60655f;
+  --color-olive-12: #1d211c;
+  --color-sand-1: #fdfdfc;
+  --color-sand-2: #f9f9f8;
+  --color-sand-3: #f1f0ef;
+  --color-sand-4: #e9e8e6;
+  --color-sand-5: #e2e1de;
+  --color-sand-6: #dad9d6;
+  --color-sand-7: #cfceca;
+  --color-sand-8: #bcbbb5;
+  --color-sand-9: #8d8d86;
+  --color-sand-10: #82827c;
+  --color-sand-11: #63635e;
+  --color-sand-12: #21201c;
+  --color-tomato-1: #fffcfc;
+  --color-tomato-2: #fff8f8;
+  --color-tomato-3: #ffefef;
+  --color-tomato-4: #ffe5e5;
+  --color-tomato-5: #fdd8d8;
+  --color-tomato-6: #f9c6c6;
+  --color-tomato-7: #f3b0b0;
+  --color-tomato-8: #ec9596;
+  --color-tomato-9: #e54666;
+  --color-tomato-10: #dc3d5d;
+  --color-tomato-11: #ca244d;
+  --color-tomato-12: #381316;
+  --color-red-1: #fffcfc;
+  --color-red-2: #fff8f8;
+  --color-red-3: #ffefef;
+  --color-red-4: #ffe5e5;
+  --color-red-5: #fdd8d8;
+  --color-red-6: #f9c6c6;
+  --color-red-7: #f3b0b0;
+  --color-red-8: #ec9596;
+  --color-red-9: #e5484d;
+  --color-red-10: #dc3d43;
+  --color-red-11: #cd2b31;
+  --color-red-12: #381316;
+  --color-ruby-1: #fffcfd;
+  --color-ruby-2: #fff7f8;
+  --color-ruby-3: #ffeef1;
+  --color-ruby-4: #ffe4e8;
+  --color-ruby-5: #fdd7dd;
+  --color-ruby-6: #f9c6cf;
+  --color-ruby-7: #f3b1bf;
+  --color-ruby-8: #ec97a9;
+  --color-ruby-9: #e54d75;
+  --color-ruby-10: #dc3e69;
+  --color-ruby-11: #ca2555;
+  --color-ruby-12: #3b1219;
+  --color-crimson-1: #fffcfd;
+  --color-crimson-2: #fef7f9;
+  --color-crimson-3: #ffe0e1;
+  --color-crimson-4: #ffcccb;
+  --color-crimson-5: #fdb8b5;
+  --color-crimson-6: #f7a09e;
+  --color-crimson-7: #ef8784;
+  --color-crimson-8: #e36d6a;
+  --color-crimson-9: #e5484d;
+  --color-crimson-10: #dc3d43;
+  --color-crimson-11: #cd2b31;
+  --color-crimson-12: #381316;
+  --color-pink-1: #fffcfe;
+  --color-pink-2: #fef7fb;
+  --color-pink-3: #fee7f4;
+  --color-pink-4: #fbdcef;
+  --color-pink-5: #f6cee7;
+  --color-pink-6: #efbddd;
+  --color-pink-7: #e7a6d0;
+  --color-pink-8: #dd87be;
+  --color-pink-9: #d6409f;
+  --color-pink-10: #cf3897;
+  --color-pink-11: #c2298a;
+  --color-pink-12: #651249;
+  --color-plum-1: #fefcff;
+  --color-plum-2: #fdf7fd;
+  --color-plum-3: #fbebfb;
+  --color-plum-4: #f7def8;
+  --color-plum-5: #f2d0f3;
+  --color-plum-6: #eabfec;
+  --color-plum-7: #e0a9e3;
+  --color-plum-8: #d48dd6;
+  --color-plum-9: #ab4aba;
+  --color-plum-10: #a144af;
+  --color-plum-11: #953ea3;
+  --color-plum-12: #53195d;
+  --color-purple-1: #fefcfe;
+  --color-purple-2: #fdf9ff;
+  --color-purple-3: #f9edff;
+  --color-purple-4: #f3e0ff;
+  --color-purple-5: #edcfff;
+  --color-purple-6: #e4bcfc;
+  --color-purple-7: #d8a4f4;
+  --color-purple-8: #c584e8;
+  --color-purple-9: #8e4ec6;
+  --color-purple-10: #8445bc;
+  --color-purple-11: #793aaf;
+  --color-purple-12: #402060;
+  --color-violet-1: #fdfcfe;
+  --color-violet-2: #faf8ff;
+  --color-violet-3: #f4f0fe;
+  --color-violet-4: #ebe4ff;
+  --color-violet-5: #e1d9ff;
+  --color-violet-6: #d4c7ff;
+  --color-violet-7: #c4b2ff;
+  --color-violet-8: #b29aff;
+  --color-violet-9: #6e56cf;
+  --color-violet-10: #654dc4;
+  --color-violet-11: #5b43b8;
+  --color-violet-12: #2f1b69;
+  --color-iris-1: #fdfdff;
+  --color-iris-2: #f8f8ff;
+  --color-iris-3: #f0f1fe;
+  --color-iris-4: #e6e7ff;
+  --color-iris-5: #dadcff;
+  --color-iris-6: #cbcdff;
+  --color-iris-7: #b8bcff;
+  --color-iris-8: #9ea7ff;
+  --color-iris-9: #5b70f6;
+  --color-iris-10: #5464ea;
+  --color-iris-11: #4c63d2;
+  --color-iris-12: #253974;
+  --color-indigo-1: #fdfdfe;
+  --color-indigo-2: #f7f9ff;
+  --color-indigo-3: #edf2fe;
+  --color-indigo-4: #e1e9ff;
+  --color-indigo-5: #d2deff;
+  --color-indigo-6: #c1d0ff;
+  --color-indigo-7: #abbdf9;
+  --color-indigo-8: #8da4ef;
+  --color-indigo-9: #3e63dd;
+  --color-indigo-10: #3358d4;
+  --color-indigo-11: #3a5ccc;
+  --color-indigo-12: #1f2d5c;
+  --color-blue-1: #fbfdff;
+  --color-blue-2: #f5faff;
+  --color-blue-3: #edf6ff;
+  --color-blue-4: #e1f0ff;
+  --color-blue-5: #cee7fe;
+  --color-blue-6: #b7d9f8;
+  --color-blue-7: #96c7f2;
+  --color-blue-8: #5eb0ef;
+  --color-blue-9: #0091ff;
+  --color-blue-10: #0588f0;
+  --color-blue-11: #0d74ce;
+  --color-blue-12: #113264;
+  --color-cyan-1: #fafefd;
+  --color-cyan-2: #f2fcfc;
+  --color-cyan-3: #e7f9f8;
+  --color-cyan-4: #d8f3f1;
+  --color-cyan-5: #c4ebe9;
+  --color-cyan-6: #acdedd;
+  --color-cyan-7: #8dcccf;
+  --color-cyan-8: #53b1b8;
+  --color-cyan-9: #00a2c7;
+  --color-cyan-10: #0797b9;
+  --color-cyan-11: #107d98;
+  --color-cyan-12: #0d3c48;
+  --color-teal-1: #fafefd;
+  --color-teal-2: #f3fbf9;
+  --color-teal-3: #e6f7f2;
+  --color-teal-4: #d5f1e9;
+  --color-teal-5: #c0e9dd;
+  --color-teal-6: #a7dccf;
+  --color-teal-7: #84cabf;
+  --color-teal-8: #53b0a7;
+  --color-teal-9: #12a594;
+  --color-teal-10: #0e9888;
+  --color-teal-11: #067c6f;
+  --color-teal-12: #0d3d38;
+  --color-jade-1: #fbfefc;
+  --color-jade-2: #f4fbf7;
+  --color-jade-3: #e6f7ed;
+  --color-jade-4: #d6f1e1;
+  --color-jade-5: #c3e9d0;
+  --color-jade-6: #acdcbb;
+  --color-jade-7: #8fcaa0;
+  --color-jade-8: #65b07e;
+  --color-jade-9: #29a383;
+  --color-jade-10: #26997b;
+  --color-jade-11: #208368;
+  --color-jade-12: #0d3b2f;
+  --color-green-1: #fbfefc;
+  --color-green-2: #f2fcf4;
+  --color-green-3: #e9f6ec;
+  --color-green-4: #ddf3df;
+  --color-green-5: #ccebd1;
+  --color-green-6: #b4dfc4;
+  --color-green-7: #92ceac;
+  --color-green-8: #5bb98c;
+  --color-green-9: #30a46c;
+  --color-green-10: #299764;
+  --color-green-11: #18794e;
+  --color-green-12: #153226;
+  --color-grass-1: #fbfefb;
+  --color-grass-2: #f3fcf3;
+  --color-grass-3: #ebf6eb;
+  --color-grass-4: #dff3df;
+  --color-grass-5: #ceebcf;
+  --color-grass-6: #b7dfba;
+  --color-grass-7: #97cf9c;
+  --color-grass-8: #65ba74;
+  --color-grass-9: #46a758;
+  --color-grass-10: #3e9b4f;
+  --color-grass-11: #2a7e3b;
+  --color-grass-12: #203c25;
+  --color-bronze-1: #fdfcfc;
+  --color-bronze-2: #fdf7f5;
+  --color-bronze-3: #f6edea;
+  --color-bronze-4: #efe4df;
+  --color-bronze-5: #e7dbd5;
+  --color-bronze-6: #dfd1c9;
+  --color-bronze-7: #d2c2b9;
+  --color-bronze-8: #c1aca0;
+  --color-bronze-9: #a18072;
+  --color-bronze-10: #957468;
+  --color-bronze-11: #7d5e54;
+  --color-bronze-12: #43302b;
+  --color-gold-1: #fdfdfc;
+  --color-gold-2: #fbf9f2;
+  --color-gold-3: #f7f4e4;
+  --color-gold-4: #f2efd6;
+  --color-gold-5: #ebe9c8;
+  --color-gold-6: #e4e2ba;
+  --color-gold-7: #d9d7a6;
+  --color-gold-8: #cac88e;
+  --color-gold-9: #a29985;
+  --color-gold-10: #978f7c;
+  --color-gold-11: #71695a;
+  --color-gold-12: #3b352b;
+  --color-brown-1: #fefdfc;
+  --color-brown-2: #fcf7f4;
+  --color-brown-3: #f6eee7;
+  --color-brown-4: #f0e4d9;
+  --color-brown-5: #ebdaca;
+  --color-brown-6: #e4cfba;
+  --color-brown-7: #dac0a3;
+  --color-brown-8: #cdab83;
+  --color-brown-9: #ad7f58;
+  --color-brown-10: #a07553;
+  --color-brown-11: #815e46;
+  --color-brown-12: #3e2923;
+  --color-orange-1: #fefcfb;
+  --color-orange-2: #fef8f4;
+  --color-orange-3: #fdeee5;
+  --color-orange-4: #fce0d4;
+  --color-orange-5: #facfc0;
+  --color-orange-6: #f7b9a7;
+  --color-orange-7: #f39e86;
+  --color-orange-8: #ed7d5b;
+  --color-orange-9: #f76808;
+  --color-orange-10: #ed5f00;
+  --color-orange-11: #bd4b00;
+  --color-orange-12: #451e11;
+  --color-amber-1: #fefdfb;
+  --color-amber-2: #fefbe9;
+  --color-amber-3: #fff7c2;
+  --color-amber-4: #ffee9c;
+  --color-amber-5: #fbe577;
+  --color-amber-6: #f3d673;
+  --color-amber-7: #e9c162;
+  --color-amber-8: #e2a336;
+  --color-amber-9: #ffc53d;
+  --color-amber-10: #ffba18;
+  --color-amber-11: #ab6400;
+  --color-amber-12: #4f3422;
+  --color-yellow-1: #fdfdf9;
+  --color-yellow-2: #fffce8;
+  --color-yellow-3: #fffbd1;
+  --color-yellow-4: #fff8bb;
+  --color-yellow-5: #fef2a4;
+  --color-yellow-6: #f9e68c;
+  --color-yellow-7: #efd36c;
+  --color-yellow-8: #ebbc00;
+  --color-yellow-9: #f5d90a;
+  --color-yellow-10: #f7ce00;
+  --color-yellow-11: #946800;
+  --color-yellow-12: #35290f;
+  --color-lime-1: #fcfdfa;
+  --color-lime-2: #f8fdf4;
+  --color-lime-3: #eefce7;
+  --color-lime-4: #e2f9d7;
+  --color-lime-5: #d3f5c2;
+  --color-lime-6: #c2efa5;
+  --color-lime-7: #ace97e;
+  --color-lime-8: #8ee357;
+  --color-lime-9: #bdee63;
+  --color-lime-10: #b0e64c;
+  --color-lime-11: #5c7c2f;
+  --color-lime-12: #37401c;
+  --color-mint-1: #f9fefd;
+  --color-mint-2: #f2fbf9;
+  --color-mint-3: #ddf9f2;
+  --color-mint-4: #c8f4e9;
+  --color-mint-5: #b3ecde;
+  --color-mint-6: #9ce0d0;
+  --color-mint-7: #7ecfbd;
+  --color-mint-8: #4cbba5;
+  --color-mint-9: #86ead4;
+  --color-mint-10: #7de0cb;
+  --color-mint-11: #027864;
+  --color-mint-12: #16433c;
+  --color-sky-1: #f9feff;
+  --color-sky-2: #f1fafd;
+  --color-sky-3: #e1f6fd;
+  --color-sky-4: #d1f0fa;
+  --color-sky-5: #bee7f5;
+  --color-sky-6: #a9daed;
+  --color-sky-7: #8ec8e1;
+  --color-sky-8: #60b3d1;
+  --color-sky-9: #68ddfd;
+  --color-sky-10: #5fd0f3;
+  --color-sky-11: #0d8bd9;
+  --color-sky-12: #1e3a8a;
+  --color-black-alpha-1: rgba(0, 0, 0, 0.012);
+  --color-black-alpha-2: rgba(0, 0, 0, 0.027);
+  --color-black-alpha-3: rgba(0, 0, 0, 0.047);
+  --color-black-alpha-4: rgba(0, 0, 0, 0.071);
+  --color-black-alpha-5: rgba(0, 0, 0, 0.090);
+  --color-black-alpha-6: rgba(0, 0, 0, 0.114);
+  --color-black-alpha-7: rgba(0, 0, 0, 0.141);
+  --color-black-alpha-8: rgba(0, 0, 0, 0.220);
+  --color-black-alpha-9: rgba(0, 0, 0, 0.439);
+  --color-black-alpha-10: rgba(0, 0, 0, 0.478);
+  --color-black-alpha-11: rgba(0, 0, 0, 0.565);
+  --color-black-alpha-12: rgba(0, 0, 0, 0.910);
+  --color-white-alpha-1: rgba(255, 255, 255, 0.012);
+  --color-white-alpha-2: rgba(255, 255, 255, 0.027);
+  --color-white-alpha-3: rgba(255, 255, 255, 0.047);
+  --color-white-alpha-4: rgba(255, 255, 255, 0.071);
+  --color-white-alpha-5: rgba(255, 255, 255, 0.090);
+  --color-white-alpha-6: rgba(255, 255, 255, 0.114);
+  --color-white-alpha-7: rgba(255, 255, 255, 0.141);
+  --color-white-alpha-8: rgba(255, 255, 255, 0.220);
+  --color-white-alpha-9: rgba(255, 255, 255, 0.439);
+  --color-white-alpha-10: rgba(255, 255, 255, 0.478);
+  --color-white-alpha-11: rgba(255, 255, 255, 0.565);
+  --color-white-alpha-12: rgba(255, 255, 255, 0.910);
+  --color-grayDark-1: #111111;
+  --color-grayDark-2: #191919;
+  --color-grayDark-3: #222222;
+  --color-grayDark-4: #2a2a2a;
+  --color-grayDark-5: #313131;
+  --color-grayDark-6: #3a3a3a;
+  --color-grayDark-7: #484848;
+  --color-grayDark-8: #606060;
+  --color-grayDark-9: #6e6e6e;
+  --color-grayDark-10: #7b7b7b;
+  --color-grayDark-11: #b4b4b4;
+  --color-grayDark-12: #eeeeee;
+  --color-mauveDark-1: #161618;
+  --color-mauveDark-2: #1c1c1f;
+  --color-mauveDark-3: #232326;
+  --color-mauveDark-4: #2b2b30;
+  --color-mauveDark-5: #323238;
+  --color-mauveDark-6: #3c3c44;
+  --color-mauveDark-7: #4c4c57;
+  --color-mauveDark-8: #656575;
+  --color-mauveDark-9: #737387;
+  --color-mauveDark-10: #828299;
+  --color-mauveDark-11: #b5b5c7;
+  --color-mauveDark-12: #e6e6ea;
+  --color-slateDark-1: #151718;
+  --color-slateDark-2: #1a1d1e;
+  --color-slateDark-3: #202425;
+  --color-slateDark-4: #26292b;
+  --color-slateDark-5: #2b2f31;
+  --color-slateDark-6: #313538;
+  --color-slateDark-7: #3a3f42;
+  --color-slateDark-8: #4c5155;
+  --color-slateDark-9: #5a6169;
+  --color-slateDark-10: #69717d;
+  --color-slateDark-11: #9ba1ab;
+  --color-slateDark-12: #e9ecef;
+  --color-sageDark-1: #151716;
+  --color-sageDark-2: #1a1d1a;
+  --color-sageDark-3: #1f231f;
+  --color-sageDark-4: #252925;
+  --color-sageDark-5: #2a2f2a;
+  --color-sageDark-6: #303530;
+  --color-sageDark-7: #393d39;
+  --color-sageDark-8: #4a4f4a;
+  --color-sageDark-9: #5a605a;
+  --color-sageDark-10: #6a716a;
+  --color-sageDark-11: #9ca49c;
+  --color-sageDark-12: #e9ebe9;
+  --color-oliveDark-1: #151715;
+  --color-oliveDark-2: #1a1d19;
+  --color-oliveDark-3: #1f231e;
+  --color-oliveDark-4: #252924;
+  --color-oliveDark-5: #2a2f29;
+  --color-oliveDark-6: #30352f;
+  --color-oliveDark-7: #393d38;
+  --color-oliveDark-8: #4a4f49;
+  --color-oliveDark-9: #5a6059;
+  --color-oliveDark-10: #6a7169;
+  --color-oliveDark-11: #9ca499;
+  --color-oliveDark-12: #e9ebe8;
+  --color-sandDark-1: #161615;
+  --color-sandDark-2: #1c1c19;
+  --color-sandDark-3: #23231e;
+  --color-sandDark-4: #2a2a24;
+  --color-sandDark-5: #31312a;
+  --color-sandDark-6: #383830;
+  --color-sandDark-7: #434339;
+  --color-sandDark-8: #54544a;
+  --color-sandDark-9: #63635a;
+  --color-sandDark-10: #73736a;
+  --color-sandDark-11: #a4a499;
+  --color-sandDark-12: #e9e9e8;
+  --color-tomatoDark-1: #1d1412;
+  --color-tomatoDark-2: #2a1410;
+  --color-tomatoDark-3: #3b1813;
+  --color-tomatoDark-4: #481a14;
+  --color-tomatoDark-5: #541c15;
+  --color-tomatoDark-6: #652016;
+  --color-tomatoDark-7: #7f2318;
+  --color-tomatoDark-8: #a42a1c;
+  --color-tomatoDark-9: #e54d2e;
+  --color-tomatoDark-10: #f5653c;
+  --color-tomatoDark-11: #fea594;
+  --color-tomatoDark-12: #fbd3cb;
+  --color-redDark-1: #1f1415;
+  --color-redDark-2: #2c1419;
+  --color-redDark-3: #3d181e;
+  --color-redDark-4: #4a1a22;
+  --color-redDark-5: #571c26;
+  --color-redDark-6: #681e2b;
+  --color-redDark-7: #82232f;
+  --color-redDark-8: #a72a35;
+  --color-redDark-9: #e54d4e;
+  --color-redDark-10: #f56565;
+  --color-redDark-11: #fea6a6;
+  --color-redDark-12: #fbd3d3;
+  --color-rubyDark-1: #1f1417;
+  --color-rubyDark-2: #2c141b;
+  --color-rubyDark-3: #3d1820;
+  --color-rubyDark-4: #4a1a24;
+  --color-rubyDark-5: #571c28;
+  --color-rubyDark-6: #681e2d;
+  --color-rubyDark-7: #822333;
+  --color-rubyDark-8: #a72a39;
+  --color-rubyDark-9: #e54d75;
+  --color-rubyDark-10: #f5658c;
+  --color-rubyDark-11: #fea6c4;
+  --color-rubyDark-12: #fbd3e0;
+  --color-crimsonDark-1: #1d1418;
+  --color-crimsonDark-2: #2a141c;
+  --color-crimsonDark-3: #3b1821;
+  --color-crimsonDark-4: #481a25;
+  --color-crimsonDark-5: #541c29;
+  --color-crimsonDark-6: #651e2e;
+  --color-crimsonDark-7: #7f2334;
+  --color-crimsonDark-8: #a42a3a;
+  --color-crimsonDark-9: #e54d4e;
+  --color-crimsonDark-10: #f56565;
+  --color-crimsonDark-11: #fea6a6;
+  --color-crimsonDark-12: #fbd3d3;
+  --color-pinkDark-1: #191117;
+  --color-pinkDark-2: #21121d;
+  --color-pinkDark-3: #37172f;
+  --color-pinkDark-4: #4b143d;
+  --color-pinkDark-5: #591c47;
+  --color-pinkDark-6: #692955;
+  --color-pinkDark-7: #833669;
+  --color-pinkDark-8: #a84885;
+  --color-pinkDark-9: #d6409f;
+  --color-pinkDark-10: #de51a8;
+  --color-pinkDark-11: #ff8dcc;
+  --color-pinkDark-12: #fdd1ea;
+  --color-plumDark-1: #181118;
+  --color-plumDark-2: #201320;
+  --color-plumDark-3: #351a35;
+  --color-plumDark-4: #451d47;
+  --color-plumDark-5: #512454;
+  --color-plumDark-6: #5e3061;
+  --color-plumDark-7: #734079;
+  --color-plumDark-8: #92549c;
+  --color-plumDark-9: #ab4aba;
+  --color-plumDark-10: #b658c4;
+  --color-plumDark-11: #e796f3;
+  --color-plumDark-12: #f4d4f4;
+  --color-purpleDark-1: #18111b;
+  --color-purpleDark-2: #1e1523;
+  --color-purpleDark-3: #301c3b;
+  --color-purpleDark-4: #3d224e;
+  --color-purpleDark-5: #48295c;
+  --color-purpleDark-6: #54346b;
+  --color-purpleDark-7: #664282;
+  --color-purpleDark-8: #8457aa;
+  --color-purpleDark-9: #8e4ec6;
+  --color-purpleDark-10: #9a5cd0;
+  --color-purpleDark-11: #d19dff;
+  --color-purpleDark-12: #ecd9fa;
+  --color-violetDark-1: #14121f;
+  --color-violetDark-2: #1b1525;
+  --color-violetDark-3: #291f43;
+  --color-violetDark-4: #33255b;
+  --color-violetDark-5: #3c2e69;
+  --color-violetDark-6: #473876;
+  --color-violetDark-7: #56468b;
+  --color-violetDark-8: #6958ad;
+  --color-violetDark-9: #6e56cf;
+  --color-violetDark-10: #7d66d9;
+  --color-violetDark-11: #baa7ff;
+  --color-violetDark-12: #e2ddfe;
+  --color-irisDark-1: #13131e;
+  --color-irisDark-2: #171625;
+  --color-irisDark-3: #202248;
+  --color-irisDark-4: #262a65;
+  --color-irisDark-5: #303374;
+  --color-irisDark-6: #3d3e82;
+  --color-irisDark-7: #4a4a95;
+  --color-irisDark-8: #5958b1;
+  --color-irisDark-9: #5b5bd6;
+  --color-irisDark-10: #6e6ade;
+  --color-irisDark-11: #b1a9ff;
+  --color-irisDark-12: #e0dffe;
+  --color-indigoDark-1: #11131f;
+  --color-indigoDark-2: #141726;
+  --color-indigoDark-3: #182449;
+  --color-indigoDark-4: #1d2e62;
+  --color-indigoDark-5: #253974;
+  --color-indigoDark-6: #304384;
+  --color-indigoDark-7: #3a4f97;
+  --color-indigoDark-8: #435db1;
+  --color-indigoDark-9: #3e63dd;
+  --color-indigoDark-10: #5472e4;
+  --color-indigoDark-11: #9eb1ff;
+  --color-indigoDark-12: #d6e1ff;
+  --color-blueDark-1: #0d1520;
+  --color-blueDark-2: #111927;
+  --color-blueDark-3: #0d2847;
+  --color-blueDark-4: #003362;
+  --color-blueDark-5: #004074;
+  --color-blueDark-6: #104d87;
+  --color-blueDark-7: #205d9e;
+  --color-blueDark-8: #2870bd;
+  --color-blueDark-9: #0090ff;
+  --color-blueDark-10: #3b9eff;
+  --color-blueDark-11: #70b8ff;
+  --color-blueDark-12: #c2e6ff;
+  --color-cyanDark-1: #0b161a;
+  --color-cyanDark-2: #101b20;
+  --color-cyanDark-3: #082c36;
+  --color-cyanDark-4: #003848;
+  --color-cyanDark-5: #004558;
+  --color-cyanDark-6: #045468;
+  --color-cyanDark-7: #12677e;
+  --color-cyanDark-8: #11809c;
+  --color-cyanDark-9: #00a2c7;
+  --color-cyanDark-10: #23afd0;
+  --color-cyanDark-11: #4ccce6;
+  --color-cyanDark-12: #b6ecf7;
+  --color-tealDark-1: #0d1514;
+  --color-tealDark-2: #111c1b;
+  --color-tealDark-3: #0d2d2a;
+  --color-tealDark-4: #023b37;
+  --color-tealDark-5: #084843;
+  --color-tealDark-6: #145750;
+  --color-tealDark-7: #1c6961;
+  --color-tealDark-8: #207e73;
+  --color-tealDark-9: #12a594;
+  --color-tealDark-10: #0eb39e;
+  --color-tealDark-11: #0bd8b6;
+  --color-tealDark-12: #adf0dd;
+  --color-jadeDark-1: #0d1512;
+  --color-jadeDark-2: #121c18;
+  --color-jadeDark-3: #0f2e22;
+  --color-jadeDark-4: #0b3b2c;
+  --color-jadeDark-5: #114837;
+  --color-jadeDark-6: #1b5745;
+  --color-jadeDark-7: #246854;
+  --color-jadeDark-8: #2a7e68;
+  --color-jadeDark-9: #29a383;
+  --color-jadeDark-10: #27b08b;
+  --color-jadeDark-11: #1fd8a4;
+  --color-jadeDark-12: #adf0d4;
+  --color-greenDark-1: #0e1512;
+  --color-greenDark-2: #121b17;
+  --color-greenDark-3: #132d21;
+  --color-greenDark-4: #113b29;
+  --color-greenDark-5: #174933;
+  --color-greenDark-6: #20573e;
+  --color-greenDark-7: #28684a;
+  --color-greenDark-8: #2f7c57;
+  --color-greenDark-9: #30a46c;
+  --color-greenDark-10: #33b074;
+  --color-greenDark-11: #3dd68c;
+  --color-greenDark-12: #b1f1cb;
+  --color-grassDark-1: #0e1511;
+  --color-grassDark-2: #141a15;
+  --color-grassDark-3: #1b2a1e;
+  --color-grassDark-4: #1d3a24;
+  --color-grassDark-5: #25482d;
+  --color-grassDark-6: #2d5736;
+  --color-grassDark-7: #366740;
+  --color-grassDark-8: #3e7949;
+  --color-grassDark-9: #46a758;
+  --color-grassDark-10: #53b365;
+  --color-grassDark-11: #71d083;
+  --color-grassDark-12: #c2f0c2;
+  --color-bronzeDark-1: #141110;
+  --color-bronzeDark-2: #1c1917;
+  --color-bronzeDark-3: #262220;
+  --color-bronzeDark-4: #302a27;
+  --color-bronzeDark-5: #3b3330;
+  --color-bronzeDark-6: #493e3a;
+  --color-bronzeDark-7: #5a4c47;
+  --color-bronzeDark-8: #6f5f58;
+  --color-bronzeDark-9: #a18072;
+  --color-bronzeDark-10: #ae8c7e;
+  --color-bronzeDark-11: #d4b3a5;
+  --color-bronzeDark-12: #ede0d9;
+  --color-goldDark-1: #121211;
+  --color-goldDark-2: #1b1a17;
+  --color-goldDark-3: #24231f;
+  --color-goldDark-4: #2d2b26;
+  --color-goldDark-5: #38352e;
+  --color-goldDark-6: #444039;
+  --color-goldDark-7: #544f46;
+  --color-goldDark-8: #696256;
+  --color-goldDark-9: #978365;
+  --color-goldDark-10: #a39073;
+  --color-goldDark-11: #cbb99f;
+  --color-goldDark-12: #e8e2d9;
+  --color-brownDark-1: #12110f;
+  --color-brownDark-2: #1c1816;
+  --color-brownDark-3: #28211d;
+  --color-brownDark-4: #322922;
+  --color-brownDark-5: #3e3128;
+  --color-brownDark-6: #4d3c2f;
+  --color-brownDark-7: #614a39;
+  --color-brownDark-8: #7c5f46;
+  --color-brownDark-9: #ad7f58;
+  --color-brownDark-10: #b88c67;
+  --color-brownDark-11: #dbb594;
+  --color-brownDark-12: #f2e1ca;
+  --color-orangeDark-1: #17120e;
+  --color-orangeDark-2: #1e160f;
+  --color-orangeDark-3: #331e0b;
+  --color-orangeDark-4: #462100;
+  --color-orangeDark-5: #562800;
+  --color-orangeDark-6: #66350c;
+  --color-orangeDark-7: #7e451d;
+  --color-orangeDark-8: #a35829;
+  --color-orangeDark-9: #f76b15;
+  --color-orangeDark-10: #ff801f;
+  --color-orangeDark-11: #ffa057;
+  --color-orangeDark-12: #ffe0c2;
+  --color-amberDark-1: #16120c;
+  --color-amberDark-2: #1d180f;
+  --color-amberDark-3: #302008;
+  --color-amberDark-4: #3f2700;
+  --color-amberDark-5: #4d3000;
+  --color-amberDark-6: #5c3d05;
+  --color-amberDark-7: #714f19;
+  --color-amberDark-8: #8f6424;
+  --color-amberDark-9: #ffc53d;
+  --color-amberDark-10: #ffd60a;
+  --color-amberDark-11: #ffca16;
+  --color-amberDark-12: #ffe7b3;
+  --color-yellowDark-1: #14120b;
+  --color-yellowDark-2: #1b180f;
+  --color-yellowDark-3: #2d2305;
+  --color-yellowDark-4: #362b00;
+  --color-yellowDark-5: #433500;
+  --color-yellowDark-6: #524202;
+  --color-yellowDark-7: #665417;
+  --color-yellowDark-8: #836a21;
+  --color-yellowDark-9: #ffe629;
+  --color-yellowDark-10: #ffff57;
+  --color-yellowDark-11: #f5e147;
+  --color-yellowDark-12: #f6eeb4;
+  --color-limeDark-1: #11130c;
+  --color-limeDark-2: #151a10;
+  --color-limeDark-3: #1f2917;
+  --color-limeDark-4: #29371d;
+  --color-limeDark-5: #334423;
+  --color-limeDark-6: #3d522a;
+  --color-limeDark-7: #496231;
+  --color-limeDark-8: #577538;
+  --color-limeDark-9: #bdee63;
+  --color-limeDark-10: #d4ff70;
+  --color-limeDark-11: #bde56c;
+  --color-limeDark-12: #e3f7ba;
+  --color-mintDark-1: #0e1515;
+  --color-mintDark-2: #0f1b1b;
+  --color-mintDark-3: #092c2b;
+  --color-mintDark-4: #003a38;
+  --color-mintDark-5: #004744;
+  --color-mintDark-6: #105650;
+  --color-mintDark-7: #1e685f;
+  --color-mintDark-8: #277f70;
+  --color-mintDark-9: #86ead4;
+  --color-mintDark-10: #a8f5e5;
+  --color-mintDark-11: #58d5ba;
+  --color-mintDark-12: #c4f5e1;
+  --color-skyDark-1: #0d141f;
+  --color-skyDark-2: #111a27;
+  --color-skyDark-3: #112840;
+  --color-skyDark-4: #113555;
+  --color-skyDark-5: #154467;
+  --color-skyDark-6: #1b537b;
+  --color-skyDark-7: #1f6692;
+  --color-skyDark-8: #197cae;
+  --color-skyDark-9: #7ce2fe;
+  --color-skyDark-10: #a8eeff;
+  --color-skyDark-11: #75c7f0;
+  --color-skyDark-12: #c2f3ff;
+  --color-surface-sunken: #383830;
+  --color-surface-level0: #31312a;
+  --color-surface-level1: #2a2a24;
+  --color-surface-level2: #23231e;
+  --color-surface-level3: #161615;
+  --color-surface-hover: #1c1c19;
+  --color-surface-pressed: #161615;
+  --color-surface-backdrop: rgba(0, 0, 0, 0.565);
+  --color-surface-inverse: #e9e9e8;
+  --color-surface-white: #ffffff;
+  --color-icon-default-default: #e9e9e8;
+  --color-icon-default-inverse: #161615;
+  --color-icon-subtle-default: #63635a;
+  --color-icon-subtle-inverse: #23231e;
+  --color-icon-muted-default: #434339;
+  --color-text-default-default: #e9e9e8;
+  --color-text-default-inverse: #161615;
+  --color-text-document: #000000;
+  --color-text-subtle-default: #63635a;
+  --color-text-subtle-inverse: #23231e;
+  --color-text-muted-default: #434339;
+  --color-text-action-default: #0bd8b6;
+  --color-text-action-hover: #adf0dd;
+  --color-text-action-pressed: #0eb39e;
+  --color-state-success-default: #58d5ba;
+  --color-state-success-contrast: #c4f5e1;
+  --color-state-success-background: #092c2b;
+  --color-state-error-default: #e54d4e;
+  --color-state-error-contrast: #fea6a6;
+  --color-state-error-background: #3d181e;
+  --color-state-info-default: #7ce2fe;
+  --color-state-info-contrast: #75c7f0;
+  --color-state-info-background: #112840;
+  --color-state-warning-default: #ffc53d;
+  --color-state-warning-contrast: #ffca16;
+  --color-state-warning-background: #302008;
+  --color-border-contrast: #434339;
+  --color-border-default: #2a2a24;
+  --color-border-muted: #23231e;
+  --color-border-focus: #0bd8b6;
+  --color-action-default: #0bd8b6;
+  --color-action-hover: #adf0dd;
+  --color-action-pressed: #0eb39e;
+  --color-action-muted: #145750;
+  --color-action-inverse-default: #0d1514;
+  --color-action-inverse-hover: #111c1b;
+  --color-action-inverse-pressed: #111c1b;
+  --color-action-inverse-muted: #0d2d2a;
+  --alias-color-neutral-1: #161615;
+  --alias-color-neutral-2: #1c1c19;
+  --alias-color-neutral-3: #23231e;
+  --alias-color-neutral-4: #2a2a24;
+  --alias-color-neutral-5: #31312a;
+  --alias-color-neutral-6: #383830;
+  --alias-color-neutral-7: #434339;
+  --alias-color-neutral-8: #54544a;
+  --alias-color-neutral-9: #63635a;
+  --alias-color-neutral-10: #73736a;
+  --alias-color-neutral-11: #a4a499;
+  --alias-color-neutral-12: #e9e9e8;
+  --alias-color-neutral-alpha-1: rgba(0, 0, 0, 0.090);
+  --alias-color-neutral-alpha-2: rgba(0, 0, 0, 0.220);
+  --alias-color-neutral-alpha-3: rgba(0, 0, 0, 0.439);
+  --alias-color-neutral-alpha-4: rgba(0, 0, 0, 0.439);
+  --alias-color-neutral-alpha-5: rgba(0, 0, 0, 0.478);
+  --alias-color-neutral-alpha-6: rgba(0, 0, 0, 0.565);
+  --alias-color-neutral-alpha-7: rgba(0, 0, 0, 0.565);
+  --alias-color-neutral-alpha-8: rgba(0, 0, 0, 0.910);
+  --alias-color-neutral-alpha-9: rgba(0, 0, 0, 0.910);
+  --alias-color-brand-primary-regular: #0bd8b6;
+  --alias-color-brand-primary-contrast: #adf0dd;
+  --alias-color-brand-primary-muted: #0d2d2a;
+  --alias-color-brand-secondary-regular: #277f70;
+  --alias-color-brand-secondary-contrast: #58d5ba;
+  --alias-color-brand-secondary-muted: #092c2b;
+  --alias-color-brand-default-deprecated: #12a594;
+  --alias-color-brand-contrast-deprecated: #adf0dd;
+  --alias-color-brand-muted-deprecated: #084843;
+  --alias-color-accent-default: #0bd8b6;
+  --alias-color-accent-hover: #adf0dd;
+  --alias-color-accent-pressed: #0eb39e;
+  --alias-color-accent-contrast: #adf0dd;
+  --alias-color-accent-muted: #145750;
+  --alias-color-accent-inverse-default: #0d1514;
+  --alias-color-accent-inverse-hover: #111c1b;
+  --alias-color-accent-inverse-pressed: #111c1b;
+  --alias-color-accent-inverse-contrast: #111c1b;
+  --alias-color-accent-inverse-muted: #0d2d2a;
+  --alias-color-state-success-contrast: #c4f5e1;
+  --alias-color-state-success-default: #58d5ba;
+  --alias-color-state-success-muted: #092c2b;
+  --alias-color-state-warning-contrast: #ffca16;
+  --alias-color-state-warning-default: #ffc53d;
+  --alias-color-state-warning-muted: #302008;
+  --alias-color-state-error-contrast: #fea6a6;
+  --alias-color-state-error-default: #e54d4e;
+  --alias-color-state-error-muted: #3d181e;
+  --alias-color-state-info-contrast: #75c7f0;
+  --alias-color-state-info-default: #7ce2fe;
+  --alias-color-state-info-muted: #112840;
+  --alias-color-state-neutral-contrast: #a4a499;
+  --alias-color-state-neutral-default: #63635a;
+  --alias-color-state-neutral-muted: #23231e;
+  --alias-font-plain-family: Quicksand;
+  --alias-font-plain-weight-regular: 400;
+  --alias-font-plain-weight-medium: 500;
+  --alias-font-plain-weight-semibold: 600;
+  --alias-font-plain-weight-bold: 700;
+  --alias-font-mono-family: Menlo;
+  --alias-font-mono-weight-regular: Regular;
+  --alias-font-mono-weight-bold: Bold;
+  --alias-font-script-family: Yesteryear;
+  --alias-font-brand-family: Quicksand;
+  --alias-font-brand-weight-regular: 400;
+  --alias-font-brand-weight-medium: 500;
+  --alias-font-brand-weight-semibold: 600;
+  --alias-font-brand-weight-bold: 700;
+  --alias-radius-sm: 0.1875rem;
+  --alias-radius-md: 0.375rem;
+  --alias-radius-lg: 0.75rem;
+  --alias-radius-xl: 1.5rem;
+  --alias-radius-2xl: 3rem;
+  --alias-radius-full: 999rem;
+  --section-padding-vertical-default: 2rem;
+  --section-padding-vertical-compact: 1.5rem;
+  --section-padding-vertical-spacious: 2.5rem;
+  --section-padding-horizontal-default: 1rem;
+  --section-padding-horizontal-compact: 0.75rem;
+  --section-padding-horizontal-spacious: 1.25rem;
+  --wrapper-gap-default: 1rem;
+  --wrapper-gap-compact: 0.75rem;
+  --wrapper-gap-spacious: 2rem;
+  --border-radius-sm: 0.1875rem;
+  --border-radius-md: 0.375rem;
+  --border-radius-lg: 0.75rem;
+  --border-radius-xl: 1.5rem;
+  --border-radius-2xl: 3rem;
+  --border-radius-full: 999rem;
+  --border-width-regular: 0.0625rem;
+  --border-width-bold: 0.125rem;
+  --text-heading-xl-fontFamily: Quicksand;
+  --text-heading-xl-fontWeight: 600;
+  --text-heading-xl-fontSize: 2.5rem;
+  --text-heading-xl-lineHeight: 3rem;
+  --text-heading-xl-letterSpacing: 0;
+  --text-heading-lg-fontFamily: Quicksand;
+  --text-heading-lg-fontWeight: 600;
+  --text-heading-lg-fontSize: 2rem;
+  --text-heading-lg-lineHeight: 2.5rem;
+  --text-heading-lg-letterSpacing: 0;
+  --text-heading-md-fontFamily: Quicksand;
+  --text-heading-md-fontWeight: 600;
+  --text-heading-md-fontSize: 1.5rem;
+  --text-heading-md-lineHeight: 2rem;
+  --text-heading-md-letterSpacing: 0;
+  --text-heading-sm-fontFamily: Quicksand;
+  --text-heading-sm-fontWeight: 600;
+  --text-heading-sm-fontSize: 1.25rem;
+  --text-heading-sm-lineHeight: 1.5rem;
+  --text-heading-sm-letterSpacing: 0;
+  --text-heading-xs-fontFamily: Quicksand;
+  --text-heading-xs-fontWeight: 500;
+  --text-heading-xs-fontSize: 1.125rem;
+  --text-heading-xs-lineHeight: 1.25rem;
+  --text-heading-xs-letterSpacing: 0;
+  --text-heading-overline-fontFamily: Quicksand;
+  --text-heading-overline-fontWeight: 600;
+  --text-heading-overline-fontSize: 1rem;
+  --text-heading-overline-lineHeight: 1rem;
+  --text-heading-overline-letterSpacing: 0.025em;
+  --text-heading-overline-textCase: uppercase;
+  --text-label-sm-regular-fontFamily: Quicksand;
+  --text-label-sm-regular-fontWeight: 400;
+  --text-label-sm-regular-fontSize: 0.875rem;
+  --text-label-sm-regular-lineHeight: 0.875rem;
+  --text-label-sm-semibold-fontFamily: Quicksand;
+  --text-label-sm-semibold-fontWeight: 600;
+  --text-label-sm-semibold-fontSize: 0.875rem;
+  --text-label-sm-semibold-lineHeight: 0.875rem;
+  --text-label-sm-bold-fontFamily: Quicksand;
+  --text-label-sm-bold-fontWeight: 700;
+  --text-label-sm-bold-fontSize: 0.875rem;
+  --text-label-sm-bold-lineHeight: 0.875rem;
+  --text-label-md-regular-fontFamily: Quicksand;
+  --text-label-md-regular-fontWeight: 400;
+  --text-label-md-regular-fontSize: 1rem;
+  --text-label-md-regular-lineHeight: 1rem;
+  --text-label-md-semibold-fontFamily: Quicksand;
+  --text-label-md-semibold-fontWeight: 600;
+  --text-label-md-semibold-fontSize: 1rem;
+  --text-label-md-semibold-lineHeight: 1rem;
+  --text-label-md-bold-fontFamily: Quicksand;
+  --text-label-md-bold-fontWeight: 700;
+  --text-label-md-bold-fontSize: 1rem;
+  --text-label-md-bold-lineHeight: 1rem;
+  --text-label-lg-regular-fontFamily: Quicksand;
+  --text-label-lg-regular-fontWeight: 400;
+  --text-label-lg-regular-fontSize: 1.125rem;
+  --text-label-lg-regular-lineHeight: 1.125rem;
+  --text-label-lg-semibold-fontFamily: Quicksand;
+  --text-label-lg-semibold-fontWeight: 600;
+  --text-label-lg-semibold-fontSize: 1.125rem;
+  --text-label-lg-semibold-lineHeight: 1.125rem;
+  --text-label-lg-bold-fontFamily: Quicksand;
+  --text-label-lg-bold-fontWeight: 700;
+  --text-label-lg-bold-fontSize: 1.125rem;
+  --text-label-lg-bold-lineHeight: 1.125rem;
+  --text-label-xl-regular-fontFamily: Quicksand;
+  --text-label-xl-regular-fontWeight: 400;
+  --text-label-xl-regular-fontSize: 1.25rem;
+  --text-label-xl-regular-lineHeight: 1.25rem;
+  --text-label-xl-semibold-fontFamily: Quicksand;
+  --text-label-xl-semibold-fontWeight: 600;
+  --text-label-xl-semibold-fontSize: 1.25rem;
+  --text-label-xl-semibold-lineHeight: 1.25rem;
+  --text-label-xl-bold-fontFamily: Quicksand;
+  --text-label-xl-bold-fontWeight: 700;
+  --text-label-xl-bold-fontSize: 1.25rem;
+  --text-label-xl-bold-lineHeight: 1.25rem;
+  --text-label-2xl-regular-fontFamily: Quicksand;
+  --text-label-2xl-regular-fontWeight: 400;
+  --text-label-2xl-regular-fontSize: 1.5rem;
+  --text-label-2xl-regular-lineHeight: 1.5rem;
+  --text-label-2xl-semibold-fontFamily: Quicksand;
+  --text-label-2xl-semibold-fontWeight: 600;
+  --text-label-2xl-semibold-fontSize: 1.5rem;
+  --text-label-2xl-semibold-lineHeight: 1.5rem;
+  --text-label-2xl-bold-fontFamily: Quicksand;
+  --text-label-2xl-bold-fontWeight: 700;
+  --text-label-2xl-bold-fontSize: 1.5rem;
+  --text-label-2xl-bold-lineHeight: 1.5rem;
+  --text-subheading-xl-fontFamily: Quicksand;
+  --text-subheading-xl-fontSize: 2rem;
+  --text-subheading-xl-lineHeight: 2.5rem;
+  --text-subheading-xl-paragraphSpacing: 1rem;
+  --text-subheading-xl-fontWeight: 400;
+  --text-subheading-lg-fontFamily: Quicksand;
+  --text-subheading-lg-fontWeight: 400;
+  --text-subheading-lg-fontSize: 1.25rem;
+  --text-subheading-lg-lineHeight: 1.5rem;
+  --text-subheading-lg-paragraphSpacing: 0.75rem;
+  --text-subheading-md-fontFamily: Quicksand;
+  --text-subheading-md-fontWeight: 400;
+  --text-subheading-md-fontSize: 1.125rem;
+  --text-subheading-md-lineHeight: 1.25rem;
+  --text-subheading-md-paragraphSpacing: 0.5rem;
+  --text-subheading-sm-fontFamily: Quicksand;
+  --text-subheading-sm-fontWeight: 400;
+  --text-subheading-sm-fontSize: 1rem;
+  --text-subheading-sm-lineHeight: 1.125rem;
+  --text-body-xs-regular-fontFamily: Quicksand;
+  --text-body-xs-regular-fontWeight: 400;
+  --text-body-xs-regular-fontSize: 0.75rem;
+  --text-body-xs-regular-lineHeight: 1.125rem;
+  --text-body-xs-regular-paragraphSpacing: 0.5rem;
+  --text-body-xs-bold-fontFamily: Quicksand;
+  --text-body-xs-bold-fontWeight: 700;
+  --text-body-xs-bold-fontSize: 0.75rem;
+  --text-body-xs-bold-lineHeight: 1.125rem;
+  --text-body-xs-bold-paragraphSpacing: 0.5rem;
+  --text-body-sm-regular-fontFamily: Quicksand;
+  --text-body-sm-regular-fontWeight: 400;
+  --text-body-sm-regular-fontSize: 0.875rem;
+  --text-body-sm-regular-lineHeight: 1.25rem;
+  --text-body-sm-regular-paragraphSpacing: 0.25rem;
+  --text-body-sm-bold-fontFamily: Quicksand;
+  --text-body-sm-bold-fontWeight: 700;
+  --text-body-sm-bold-fontSize: 0.875rem;
+  --text-body-sm-bold-lineHeight: 1.25rem;
+  --text-body-sm-bold-paragraphSpacing: 0.25rem;
+  --text-body-base-regular-fontFamily: Quicksand;
+  --text-body-base-regular-fontWeight: 400;
+  --text-body-base-regular-fontSize: 1rem;
+  --text-body-base-regular-lineHeight: 1.5rem;
+  --text-body-base-regular-paragraphSpacing: 0.5rem;
+  --text-body-base-bold-fontFamily: Quicksand;
+  --text-body-base-bold-fontWeight: 700;
+  --text-body-base-bold-fontSize: 1rem;
+  --text-body-base-bold-lineHeight: 1.5rem;
+  --text-body-base-bold-paragraphSpacing: 0.5rem;
+  --text-body-lg-regular-fontFamily: Quicksand;
+  --text-body-lg-regular-fontWeight: 400;
+  --text-body-lg-regular-fontSize: 1.125rem;
+  --text-body-lg-regular-lineHeight: 2rem;
+  --text-body-lg-regular-paragraphSpacing: 0.75rem;
+  --text-body-lg-bold-fontFamily: Quicksand;
+  --text-body-lg-bold-fontWeight: 700;
+  --text-body-lg-bold-fontSize: 1.125rem;
+  --text-body-lg-bold-lineHeight: 2rem;
+  --text-body-lg-bold-paragraphSpacing: 0.75rem;
+  --text-body-xl-regular-fontFamily: Quicksand;
+  --text-body-xl-regular-fontWeight: 400;
+  --text-body-xl-regular-fontSize: 1.25rem;
+  --text-body-xl-regular-lineHeight: 2.5rem;
+  --text-body-xl-regular-paragraphSpacing: 1rem;
+  --text-body-xl-bold-fontFamily: Quicksand;
+  --text-body-xl-bold-fontWeight: 700;
+  --text-body-xl-bold-fontSize: 1.25rem;
+  --text-body-xl-bold-lineHeight: 2.5rem;
+  --text-body-xl-bold-paragraphSpacing: 1rem;
+  --text-body-2xl-regular-fontFamily: Quicksand;
+  --text-body-2xl-regular-fontWeight: 400;
+  --text-body-2xl-regular-fontSize: 1.5rem;
+  --text-body-2xl-regular-lineHeight: 3rem;
+  --text-body-2xl-regular-paragraphSpacing: 1rem;
+  --text-body-2xl-bold-fontFamily: Quicksand;
+  --text-body-2xl-bold-fontWeight: 700;
+  --text-body-2xl-bold-fontSize: 1.5rem;
+  --text-body-2xl-bold-lineHeight: 3rem;
+  --text-body-2xl-bold-paragraphSpacing: 1rem;
+  --text-input-sm-fontFamily: Quicksand;
+  --text-input-sm-fontWeight: 400;
+  --text-input-sm-fontSize: 0.875rem;
+  --text-input-sm-lineHeight: 0.875rem;
+  --text-input-md-fontFamily: Quicksand;
+  --text-input-md-fontWeight: 400;
+  --text-input-md-fontSize: 1rem;
+  --text-input-md-lineHeight: 1rem;
+  --text-input-lg-fontFamily: Quicksand;
+  --text-input-lg-fontWeight: 400;
+  --text-input-lg-fontSize: 1.125rem;
+  --text-input-lg-lineHeight: 1.125rem;
+  --shadow-level1: 0px 0px 1px 0px rgba(0, 0, 0, 0.090), 0px 2px 4px 0px rgba(0, 0, 0, 0.090);
+  --shadow-level2: 0 0 1px 0 rgba(0, 0, 0, 0.090), 0 2px 4px 0 rgba(0, 0, 0, 0.090);
+  --shadow-level3: 0 0 1px 0 rgba(0, 0, 0, 0.090), 0 8px 16px 0 rgba(0, 0, 0, 0.090);
+  --shadow-level4: inset 0 0 1px 0 rgba(0, 0, 0, 0.090), 0 16px 32px 0 rgba(0, 0, 0, 0.220);
+  --shadow-level5: 0 32px 64px 0 rgba(0, 0, 0, 0.220);
+  --shadow-level6: 0 48px 96px 0 rgba(0, 0, 0, 0.220), inset 0 0 1px 0 rgba(0, 0, 0, 0.220);
+  --shadow-bevel: inset 0px -2px 0px 0px rgba(0, 0, 0, 0.090);
+  --shadow-sunken: inset 0px 0px 1px 0px rgba(0, 0, 0, 0.090), inset 0px 2px 4px 0px rgba(0, 0, 0, 0.090);
+  --button-color-primary-background-default: #0bd8b6;
+  --button-color-primary-background-hover: #adf0dd;
+  --button-color-primary-background-pressed: #0eb39e;
+  --button-color-primary-background-disabled: #145750;
+  --button-color-primary-foreground-default: #0d1514;
+  --button-color-primary-foreground-hover: #111c1b;
+  --button-color-primary-foreground-pressed: #111c1b;
+  --button-color-primary-foreground-disabled: #0d2d2a;
+  --button-color-primary-shadow-default: inset 0px -2px 0px 0px rgba(0, 0, 0, 0.090);
+  --button-color-primary-shadow-hover: inset 0px -2px 0px 0px rgba(0, 0, 0, 0.090);
+  --button-color-primary-shadow-pressed: none;
+  --button-color-primary-shadow-disabled: none;
+  --button-color-secondary-background-default: #23231e;
+  --button-color-secondary-background-hover: #23231e;
+  --button-color-secondary-background-pressed: #2a2a24;
+  --button-color-secondary-background-disabled: #2a2a24;
+  --button-color-secondary-foreground-default: #e9e9e8;
+  --button-color-secondary-foreground-hover: #adf0dd;
+  --button-color-secondary-foreground-pressed: #0eb39e;
+  --button-color-secondary-foreground-disabled: #434339;
+  --button-color-secondary-shadow-default: inset 0px -2px 0px 0px rgba(0, 0, 0, 0.090);
+  --button-color-secondary-shadow-hover: inset 0px -2px 0px 0px rgba(0, 0, 0, 0.090);
+  --button-color-secondary-shadow-pressed: none;
+  --button-color-secondary-shadow-disabled: none;
+  --button-color-ghost-background-default: transparent;
+  --button-color-ghost-background-hover: transparent;
+  --button-color-ghost-background-pressed: transparent;
+  --button-color-ghost-background-disabled: transparent;
+  --button-color-ghost-foreground-default: #e9e9e8;
+  --button-color-ghost-foreground-hover: #e9e9e8;
+  --button-color-ghost-foreground-pressed: #e9e9e8;
+  --button-color-ghost-foreground-disabled: #63635a;
+  --button-color-ghost-border-default: transparent;
+  --button-color-ghost-border-hover: #2a2a24;
+  --button-color-ghost-border-pressed: #2a2a24;
+  --button-color-ghost-border-disabled: transparent;
+  --button-color-tertiary-background-default: #161615;
+  --button-color-tertiary-background-hover: #161615;
+  --button-color-tertiary-background-pressed: #23231e;
+  --button-color-tertiary-background-disabled: #161615;
+  --button-color-tertiary-foreground-default: #0bd8b6;
+  --button-color-tertiary-foreground-hover: #adf0dd;
+  --button-color-tertiary-foreground-pressed: #0eb39e;
+  --button-color-tertiary-foreground-disabled: #434339;
+  --button-color-tertiary-border-default: #2a2a24;
+  --button-color-tertiary-border-hover: #434339;
+  --button-color-tertiary-border-pressed: #434339;
+  --button-color-tertiary-border-disabled: #2a2a24;
+  --button-radius-sm: 0.75rem;
+  --button-radius-md: 0.75rem;
+  --button-radius-lg: 0.75rem;
+  --button-radius-xl: 0.75rem;
+  --button-padding-sm-x: 0.75rem;
+  --button-padding-md-x: 0.75rem;
+  --button-padding-lg-x: 1rem;
+  --button-padding-xl-x: 1rem;
+  --button-gap-sm: 0.5rem;
+  --button-gap-md: 0.5rem;
+  --button-gap-lg: 0.75rem;
+  --button-gap-xl: 1rem;
+  --button-icon-sm: 1rem;
+  --button-icon-md: 1.25rem;
+  --button-icon-lg: 1.5rem;
+  --button-icon-xl: 2rem;
+  --card-color-default-background: #161615;
+  --card-color-default-foreground: #e9e9e8;
+  --card-color-default-border: #2a2a24;
+  --card-color-hover-background: #23231e;
+  --card-color-hover-foreground: #e9e9e8;
+  --card-color-hover-border: #434339;
+  --card-color-pressed-background: #2a2a24;
+  --card-color-pressed-foreground: #e9e9e8;
+  --card-color-pressed-border: #0bd8b6;
+  --card-color-selected-background: #23231e;
+  --card-color-selected-foreground: #e9e9e8;
+  --card-color-selected-border: #0bd8b6;
+  --card-radius-sm: 0.1875rem;
+  --card-radius-md: 0.375rem;
+  --card-radius-lg: 0.75rem;
+  --card-padding-sm: 0.75rem;
+  --card-padding-md: 1rem;
+  --card-padding-lg: 1.5rem;
+  --card-shadow-default: 0 0 1px 0 rgba(0, 0, 0, 0.090), 0 2px 4px 0 rgba(0, 0, 0, 0.090);
+  --card-shadow-hover: 0 0 1px 0 rgba(0, 0, 0, 0.090), 0 8px 16px 0 rgba(0, 0, 0, 0.090);
+  --card-shadow-pressed: 0 0 1px 0 rgba(0, 0, 0, 0.090), 0 2px 4px 0 rgba(0, 0, 0, 0.090);
+  --card-shadow-selected: 0px 0px 1px 0px rgba(0, 0, 0, 0.090), 0px 2px 4px 0px rgba(0, 0, 0, 0.090);
+  --card-border-default: 0.0625rem solid #2a2a24;
+  --card-border-hover: 0.0625rem solid #434339;
+  --card-border-pressed: 0.125rem solid #0bd8b6;
+  --card-border-selected: 0.125rem solid #0bd8b6;
+  --input-field-color-default-background: #161615;
+  --input-field-color-default-foreground: #e9e9e8;
+  --input-field-color-default-border: #434339;
+  --input-field-color-hover-background: #161615;
+  --input-field-color-hover-foreground: #e9e9e8;
+  --input-field-color-hover-border: #434339;
+  --input-field-color-focus-background: #161615;
+  --input-field-color-focus-foreground: #e9e9e8;
+  --input-field-color-focus-border: #0bd8b6;
+  --input-field-color-error-background: #161615;
+  --input-field-color-error-foreground: #e9e9e8;
+  --input-field-color-error-border: #fea6a6;
+  --input-field-color-disabled-background: #2a2a24;
+  --input-field-color-disabled-foreground: #63635a;
+  --input-field-color-disabled-border: #2a2a24;
+  --input-field-radius-sm: 0.1875rem;
+  --input-field-radius-md: 0.375rem;
+  --input-field-radius-lg: 0.75rem;
+  --input-field-padding-x: 0.75rem;
+  --input-field-padding-y: 0.5rem;
+  --input-field-border-default: 0.125rem solid #434339;
+  --input-field-border-hover: 0.0625rem solid #434339;
+  --input-field-border-focused: 0.125rem solid #0bd8b6;
+  --input-field-height-sm: 2rem;
+  --input-field-height-default: 2.5rem;
+  --input-field-height-lg: 3rem;
+  --input-textarea-height-sm: 5rem;
+  --input-textarea-height-default: 7rem;
+  --input-textarea-height-lg: 10rem;
+  --input-control-height-sm: 1.25rem;
+  --input-control-height-default: 1.5rem;
+  --input-control-height-lg: 2rem;
+  --input-control-color-default-background: #161615;
+  --input-control-color-default-foreground: #0bd8b6;
+  --input-control-color-default-border: #2a2a24;
+  --input-control-color-hover-background: #23231e;
+  --input-control-color-hover-foreground: #adf0dd;
+  --input-control-color-hover-border: #434339;
+  --input-control-color-pressed-background: #2a2a24;
+  --input-control-color-pressed-foreground: #0eb39e;
+  --input-control-color-pressed-border: #0bd8b6;
+  --input-control-color-disabled-background: #2a2a24;
+  --input-control-color-disabled-foreground: #2a2a24;
+  --input-control-color-disabled-border: #2a2a24;
+  --input-label-height-sm: 1.5rem;
+  --input-label-height-default: 2rem;
+  --input-label-height-lg: 2.5rem;
+  --icon-size-xs: 1rem;
+  --icon-size-sm: 1.25rem;
+  --icon-size-default: 1.5rem;
+  --icon-size-lg: 2rem;
+  --chip-size-height-sm: 2rem;
+  --chip-size-height-md: 2.5rem;
+  --chip-size-height-lg: 3rem;
+  --checkbox-size-sm: 1.25rem;
+  --checkbox-size-default: 1.5rem;
+  --checkbox-size-lg: 2rem;
+  --checkbox-radius: 0.1875rem;
+  --checkbox-icon-size-sm: 1rem;
+  --checkbox-icon-size-default: 1.25rem;
+  --checkbox-icon-size-lg: 1.5rem;
+  --checkbox-color-default-background: #161615;
+  --checkbox-color-default-border: #434339;
+  --checkbox-color-default-icon: #161615;
+  --checkbox-color-hover-background: #23231e;
+  --checkbox-color-hover-border: #434339;
+  --checkbox-color-checked-background: #0bd8b6;
+  --checkbox-color-checked-border: #0bd8b6;
+  --checkbox-color-checked-icon: #161615;
+  --checkbox-color-disabled-background: #2a2a24;
+  --checkbox-color-disabled-border: #2a2a24;
+  --checkbox-color-disabled-icon: #2a2a24;
+  --alert-color-info-background: #112840;
+  --alert-color-info-foreground: #e9e9e8;
+  --alert-color-info-accent: #75c7f0;
+  --alert-color-info-border: #7ce2fe;
+  --alert-color-success-background: #092c2b;
+  --alert-color-success-foreground: #e9e9e8;
+  --alert-color-success-accent: #c4f5e1;
+  --alert-color-success-border: #58d5ba;
+  --alert-color-error-background: #3d181e;
+  --alert-color-error-foreground: #e9e9e8;
+  --alert-color-error-accent: #e54d4e;
+  --alert-color-error-border: #e54d4e;
+  --alert-color-warning-background: #302008;
+  --alert-color-warning-foreground: #e9e9e8;
+  --alert-color-warning-accent: #ffca16;
+  --alert-color-warning-border: #ffc53d;
+  --alert-padding-sm-x: 0.75rem;
+  --alert-padding-sm-y: 0.5rem;
+  --alert-padding-md-x: 1rem;
+  --alert-padding-md-y: 0.75rem;
+  --alert-padding-lg-x: 1.25rem;
+  --alert-padding-lg-y: 1rem;
+  --alert-radius: 0.375rem;
+  --alert-gap: 0.75rem;
+  --alert-icon-size: 1rem;
+  --alert-border-width: 0.0625rem;
+  --select-field-color-default-background: #161615;
+  --select-field-color-default-foreground: #e9e9e8;
+  --select-field-color-default-border: #434339;
+  --select-field-color-hover-background: #161615;
+  --select-field-color-hover-foreground: #e9e9e8;
+  --select-field-color-hover-border: #434339;
+  --select-field-color-focus-background: #161615;
+  --select-field-color-focus-foreground: #e9e9e8;
+  --select-field-color-focus-border: #0bd8b6;
+  --select-field-color-error-background: #161615;
+  --select-field-color-error-foreground: #e9e9e8;
+  --select-field-color-error-border: #fea6a6;
+  --select-field-color-disabled-background: #2a2a24;
+  --select-field-color-disabled-foreground: #63635a;
+  --select-field-color-disabled-border: #2a2a24;
+  --select-field-radius-sm: 0.1875rem;
+  --select-field-radius-md: 0.375rem;
+  --select-field-radius-lg: 0.75rem;
+  --select-field-padding-x: 0.75rem;
+  --select-field-padding-y: 0.5rem;
+  --select-field-height-sm: 2rem;
+  --select-field-height-default: 2.5rem;
+  --select-field-height-lg: 3rem;
+  --dialog-color-backdrop: rgba(0, 0, 0, 0.565);
+  --dialog-color-background: #161615;
+  --dialog-color-body-background: #161615;
+  --dialog-border-radius: 1.5rem;
+  --dialog-border-radius-desktop: 1.5rem;
+  --dialog-shadow-default: 0 48px 96px 0 rgba(0, 0, 0, 0.220), inset 0 0 1px 0 rgba(0, 0, 0, 0.220);
+  --dialog-width-sm: 35rem;
+  --dialog-width-md: 54.5rem;
+  --dialog-width-lg: 76.5rem;
+  --dialog-height-sm: 33.75rem;
+  --dialog-height-md: 40rem;
+  --dialog-height-lg: 45rem;
+  --dialog-height-mobile-sm: 25rem;
+  --dialog-height-mobile-md: 37.5rem;
+  --dialog-min-height-mobile: 12.5rem;
+  --dialog-margin-top-mobile: 3.5rem;
+  --dialog-drag-handle-width: 64px;
+  --dialog-drag-handle-height: 4px;
+  --dialog-drag-handle-color: #434339;
+  --dialog-drag-handle-padding-y: 0.75rem;
+  --dialog-drag-handle-radius: 999rem;
+  --dialog-padding-x: 1rem;
+  --menu-content-color-background: #161615;
+  --menu-content-color-border: #23231e;
+  --menu-content-border-radius: 0.75rem;
+  --menu-content-border-width: 0.0625rem;
+  --menu-content-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.090), 0 8px 16px 0 rgba(0, 0, 0, 0.090);
+  --menu-content-padding: 0.25rem;
+  --menu-content-min-width: 12rem;
+  --menu-content-max-height: 20rem;
+  --menu-item-color-default-background: transparent;
+  --menu-item-color-default-foreground: #e9e9e8;
+  --menu-item-color-default-icon: #63635a;
+  --menu-item-color-hover-background: #1c1c19;
+  --menu-item-color-hover-foreground: #e9e9e8;
+  --menu-item-color-hover-icon: #e9e9e8;
+  --menu-item-color-focus-background: #145750;
+  --menu-item-color-focus-foreground: #e9e9e8;
+  --menu-item-color-focus-icon: #e9e9e8;
+  --menu-item-color-disabled-background: transparent;
+  --menu-item-color-disabled-foreground: #434339;
+  --menu-item-color-disabled-icon: #434339;
+  --menu-item-color-destructive-default-foreground: #fea6a6;
+  --menu-item-color-destructive-default-icon: #fea6a6;
+  --menu-item-color-destructive-hover-background: #3d181e;
+  --menu-item-color-destructive-hover-foreground: #fea6a6;
+  --menu-item-color-destructive-hover-icon: #fea6a6;
+  --menu-item-border-radius: 0.1875rem;
+  --menu-item-padding-x: 0.75rem;
+  --menu-item-padding-y: 0.5rem;
+  --menu-item-gap: 0.5rem;
+  --menu-item-height: 2.5rem;
+  --menu-separator-color: #23231e;
+  --menu-separator-height: 0.0625rem;
+  --menu-separator-margin-y: 0.25rem;
+  --menu-group-label-color: #63635a;
+  --menu-group-label-padding-x: 0.75rem;
+  --menu-group-label-padding-y: 0.5rem;
+  --menu-shortcut-color: #434339;
+  --menu-checkbox-indicator-size: 1rem;
+  --menu-checkbox-indicator-color: #0bd8b6;
+  --menu-radio-indicator-size: 1rem;
+  --menu-radio-indicator-color: #0bd8b6;
+  --contextmenu-trigger-outline-width: 0.125rem;
+  --contextmenu-trigger-outline-color: #0bd8b6;
+  --contextmenu-trigger-outline-offset: 0.25rem;
+  --tabs-trigger-color-default-background: #23231e;
+  --tabs-trigger-color-default-foreground: #e9e9e8;
+  --tabs-trigger-color-default-border: #434339;
+  --tabs-trigger-color-hover-background: #23231e;
+  --tabs-trigger-color-hover-foreground: #e9e9e8;
+  --tabs-trigger-color-hover-border: #434339;
+  --tabs-trigger-color-current-background: #161615;
+  --tabs-trigger-color-current-foreground: #e9e9e8;
+  --tabs-trigger-color-current-border: #434339;
+  --tabs-trigger-color-disabled-foreground: #434339;
+  --tabs-trigger-color-disabled-background: #23231e;
+  --tabs-trigger-color-disabled-border: #434339;
+  --tabs-trigger-padding-x: 0.75rem;
+  --tabs-trigger-padding-y: 0.5rem;
+  --tabs-trigger-height: 3rem;
+  --tabs-trigger-radius: 0.75rem;
+  --tabs-panel-background: #161615;
+  --tabs-panel-border: #434339;
+  --separator-color-default: #2a2a24;
+  --separator-color-contrast: #434339;
+  --separator-width: 0.0625rem;
+  --separator-spacing-sm: 0.5rem;
+  --separator-spacing-md: 1rem;
+  --separator-spacing-lg: 1.5rem;
+  --radio-size-sm: 1.25rem;
+  --radio-size-default: 1.5rem;
+  --radio-size-lg: 2rem;
+  --radio-dot-size-sm: 0.75rem;
+  --radio-dot-size-default: 1rem;
+  --radio-dot-size-lg: 1.25rem;
+  --radio-color-default-background: #161615;
+  --radio-color-default-border: #434339;
+  --radio-color-default-dot: #161615;
+  --radio-color-hover-background: #23231e;
+  --radio-color-hover-border: #434339;
+  --radio-color-checked-background: #161615;
+  --radio-color-checked-border: #0bd8b6;
+  --radio-color-checked-dot: #0bd8b6;
+  --radio-color-disabled-background: #2a2a24;
+  --radio-color-disabled-border: #2a2a24;
+  --radio-color-disabled-dot: #2a2a24;
+  --progress-size-bar-height-sm: 0.5rem;
+  --progress-size-bar-height-md: 0.75rem;
+  --progress-size-bar-height-lg: 1rem;
+  --progress-size-circle-diameter-sm: 4rem;
+  --progress-size-circle-diameter-md: 5rem;
+  --progress-size-circle-diameter-lg: 7rem;
+  --progress-size-circle-strokeWidth-sm: 0.25rem;
+  --progress-size-circle-strokeWidth-md: 0.5rem;
+  --progress-size-circle-strokeWidth-lg: 0.75rem;
+  --avatar-size-xs: 2.5rem;
+  --avatar-size-sm: 3rem;
+  --avatar-size-md: 4rem;
+  --avatar-size-lg: 5rem;
+  --avatar-size-xl: 7rem;
+  --avatar-color-background-default: #23231e;
+  --avatar-color-background-loading: #2a2a24;
+  --avatar-color-foreground-default: #e9e9e8;
+  --avatar-color-foreground-muted: #434339;
+  --avatar-color-border-default: #2a2a24;
+  --avatar-color-status-online: #58d5ba;
+  --avatar-color-status-offline: #434339;
+  --avatar-color-status-busy: #e54d4e;
+  --avatar-color-status-away: #ffc53d;
+  --avatar-radius-circle: 999rem;
+  --avatar-radius-square: 0.75rem;
+  --avatar-font-size-xs: 0.75rem;
+  --avatar-font-size-sm: 0.875rem;
+  --avatar-font-size-md: 1.125rem;
+  --avatar-font-size-lg: 1.25rem;
+  --avatar-font-size-xl: 1.5rem;
+  --avatar-status-size-xs: 0.5rem;
+  --avatar-status-size-sm: 0.75rem;
+  --avatar-status-size-md: 1rem;
+  --avatar-status-size-lg: 1.25rem;
+  --avatar-status-size-xl: 1.5rem;
+  --avatar-border-width: 1px;
+  --avatar-group-spacing-tight: -0.5rem;
+  --avatar-group-spacing-normal: -0.25rem;
+  --toast-color-info-background: #e9e9e8;
+  --toast-color-info-foreground: #161615;
+  --toast-color-info-accent: #112840;
+  --toast-color-success-background: #e9e9e8;
+  --toast-color-success-foreground: #161615;
+  --toast-color-success-accent: #092c2b;
+  --toast-color-warning-background: #e9e9e8;
+  --toast-color-warning-foreground: #161615;
+  --toast-color-warning-accent: #302008;
+  --toast-color-error-background: #e9e9e8;
+  --toast-color-error-foreground: #161615;
+  --toast-color-error-accent: #3d181e;
+  --toast-padding-x: 1rem;
+  --toast-padding-y: 0.75rem;
+  --toast-radius: 0.75rem;
+  --toast-gap: 0.75rem;
+  --toast-icon-size: 1rem;
+  --toast-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.090), 0 8px 16px 0 rgba(0, 0, 0, 0.090);
+  --toast-width-min: 280px;
+  --toast-width-max: 420px;
+  --toggle-track-width: 3.5rem;
+  --toggle-track-height: 2rem;
+  --toggle-track-radius: 999rem;
+  --toggle-track-color-off: #383830;
+  --toggle-track-color-on: #0bd8b6;
+  --toggle-track-color-disabled: #2a2a24;
+  --toggle-knob-size: 1.5rem;
+  --toggle-knob-offset: 0.25rem;
+  --toggle-knob-color-default: #161615;
+  --toggle-knob-color-disabled: #23231e;
+  --topbar-color-background: #161615;
+  --topbar-color-foreground: #e9e9e8;
+  --topbar-color-border: #2a2a24;
+  --topbar-height-sm: 64px;
+  --topbar-height-md: 80px;
+  --topbar-height-lg: 80px;
+  --topbar-padding-x-sm: 0.75rem;
+  --topbar-padding-x-md: 0.75rem;
+  --topbar-padding-x-lg: 1.5rem;
+  --topbar-title-max-width: 197px;
+  --topbar-icon-size-sm: 24px;
+  --topbar-icon-size-md: 32px;
+  --topbar-icon-size-lg: 32px;
+  --topbar-button-size-sm: 48px;
+  --topbar-button-size-md: 64px;
+  --topbar-button-size-lg: 64px;
+  --topbar-drag-handle-width: 54px;
+  --topbar-drag-handle-height: 4px;
+  --topbar-drag-handle-color: #2a2a24;
+  --topbar-drag-handle-padding-y: 0.75rem;
+  --topbar-drag-handle-radius: 999rem;
+  --controlbar-color-background: #161615;
+  --controlbar-max-width-sm: 768px;
+  --controlbar-max-width-lg: 1024px;
+  --controlbar-padding-x-sm: 1rem;
+  --controlbar-padding-x-lg: 1.5rem;
+  --controlbar-padding-bottom-sm: 1rem;
+  --controlbar-padding-bottom-lg: 1rem;
+  --controlbar-gap-sm: 0.5rem;
+  --controlbar-gap-lg: 1rem;
+  --controlbar-content-radius-sm: 0.75rem;
+  --controlbar-content-radius-lg: 0.375rem;
+  --bottombar-color-background: #161615;
+  --bottombar-color-border: #2a2a24;
+  --bottombar-color-tab-active: #e9e9e8;
+  --bottombar-color-tab-inactive: #63635a;
+  --bottombar-floating-radius: 1.5rem;
+  --bottombar-floating-padding: 0.75rem;
+  --bottombar-floating-margin-x: 0.75rem;
+  --bottombar-floating-margin-bottom: 0.75rem;
+  --bottombar-floating-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.090), 0 8px 16px 0 rgba(0, 0, 0, 0.090);
+  --bottombar-floating-max-width: 768px;
+  --bottombar-floating-backdrop-start: transparent;
+  --bottombar-floating-backdrop-end: rgba(0, 0, 0, 0.090);
+  --bottombar-floating-backdrop-blur: 2px;
+  --bottombar-floating-padding-top: 2rem;
+  --bottombar-tab-icon-size: 24px;
+  --bottombar-tab-gap: 0.25rem;
+  --bottombar-tab-padding-y: 0.5rem;
+  --bottombar-actions-padding-t: 0.75rem;
+  --bottombar-actions-padding-x: 0.75rem;
+  --bottombar-actions-gap: 0.75rem;
+  --bottombar-actions-button-height-sm: 3rem;
+  --bottombar-actions-button-height-lg: 4rem;
+  --bottombar-navigation-floating-padding: 0.5rem;
+  --view-color-background: #23231e;
+  --badge-size-height-sm: 1.5rem;
+  --badge-size-height-md: 2rem;
+  --badge-size-height-lg: 2.5rem;
+  --badge-size-dot-sm: 0.5rem;
+  --badge-size-dot-md: 0.75rem;
+  --badge-size-dot-lg: 1rem;
+  --table-cell-padding-x-sm: 0.5rem;
+  --table-cell-padding-x-md: 0.75rem;
+  --table-cell-padding-x-lg: 1rem;
+  --table-cell-padding-y-sm: 0.5rem;
+  --table-cell-padding-y-md: 0.75rem;
+  --table-cell-padding-y-lg: 1rem;
+  --table-row-selected-background: #112840;
+  --table-pagination-padding: 0.75rem;
+  --table-pagination-gap: 1rem;
+  --table-pagination-background: #2a2a24;
+  --table-pagination-border: #2a2a24;
+  --datepicker-color-background: #161615;
+  --datepicker-size-day-sm: 2.5rem;
+  --datepicker-size-day-md: 3rem;
+  --datepicker-size-day-lg: 3.5rem;
+  --datepicker-calendar-width: 280px;
+  --datepicker-calendar-gap: 0.25rem;
+  --segmentgroup-container-background: #23231e;
+  --segmentgroup-container-radius: 999rem;
+  --segmentgroup-container-padding: 0.25rem;
+  --segmentgroup-container-shadow: inset 0px 0px 1px 0px rgba(0, 0, 0, 0.090), inset 0px 2px 4px 0px rgba(0, 0, 0, 0.090);
+  --segmentgroup-segment-color-selected-background: #161615;
+  --segmentgroup-segment-color-selected-foreground: #e9e9e8;
+  --segmentgroup-segment-color-unselected-background: transparent;
+  --segmentgroup-segment-color-unselected-foreground: #63635a;
+  --segmentgroup-segment-color-hover-foreground: #e9e9e8;
+  --segmentgroup-segment-shadow-selected: 0px 0px 1px 0px rgba(0, 0, 0, 0.090), 0px 2px 4px 0px rgba(0, 0, 0, 0.090);
+  --segmentgroup-segment-shadow-unselected: none;
+  --segmentgroup-segment-radius: 1.5rem;
+  --segmentgroup-segment-padding-sm-x: 1rem;
+  --segmentgroup-segment-padding-sm-y: 0;
+  --segmentgroup-segment-padding-md-x: 1.25rem;
+  --segmentgroup-segment-padding-md-y: 0.5rem;
+  --segmentgroup-segment-padding-lg-x: 1.5rem;
+  --segmentgroup-segment-padding-lg-y: 0.5rem;
+  --segmentgroup-segment-height-sm: 1.5rem;
+  --emptystate-container-padding-sm: 1.5rem;
+  --emptystate-container-padding-md: 2rem;
+  --emptystate-container-padding-lg: 3rem;
+  --emptystate-container-gap: 1rem;
+  --emptystate-container-maxWidth: 24rem;
+  --emptystate-icon-size-sm: 2rem;
+  --emptystate-icon-size-md: 3rem;
+  --emptystate-icon-size-lg: 4rem;
+  --emptystate-icon-color: #434339;
+  --emptystate-title-color: #e9e9e8;
+  --emptystate-description-color: #434339;
+  --emptystate-actions-gap: 0.75rem;
+  --emptystate-actions-marginTop: 1rem;
+  --documentviewer-container-background: #161615;
+  --documentviewer-container-borderRadius: 0.75rem;
+  --documentviewer-toolbar-height: 3rem;
+  --documentviewer-toolbar-padding-x: 1rem;
+  --documentviewer-toolbar-padding-y: 0.5rem;
+  --documentviewer-toolbar-background: #2a2a24;
+  --documentviewer-toolbar-border: #2a2a24;
+  --documentviewer-toolbar-gap: 0.5rem;
+  --documentviewer-canvas-background: #23231e;
+  --documentviewer-canvas-padding: 1rem;
+  --documentviewer-thumbnails-width: 8rem;
+  --documentviewer-thumbnails-background: #2a2a24;
+  --documentviewer-thumbnails-border: #2a2a24;
+  --documentviewer-thumbnails-item-padding: 0.5rem;
+  --documentviewer-thumbnails-item-borderRadius: 0.1875rem;
+  --documentviewer-thumbnails-item-gap: 0.25rem;
+  --documentviewer-thumbnails-item-background-default: transparent;
+  --documentviewer-thumbnails-item-background-hover: #23231e;
+  --documentviewer-thumbnails-item-background-selected: #161615;
+  --documentviewer-thumbnails-item-border-default: transparent;
+  --documentviewer-thumbnails-item-border-selected: #0bd8b6;
+  --documentviewer-page-background: #ffffff;
+  --documentviewer-page-foreground: #000000;
+  --documentviewer-page-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.090), 0 2px 4px 0 rgba(0, 0, 0, 0.090);
+  --documentviewer-page-borderRadius: 0.1875rem;
+  --documentviewer-zoom-button-width: 2rem;
+  --documentviewer-loading-overlay-background: rgba(0, 0, 0, 0.565);
+  --documentviewer-error-background: #2a2a24;
+  --documentviewer-error-text: #e9e9e8;
+  --fileupload-dropzone-color-default-background: #23231e;
+  --fileupload-dropzone-color-default-border: #2a2a24;
+  --fileupload-dropzone-color-default-foreground: #63635a;
+  --fileupload-dropzone-color-hover-background: #2a2a24;
+  --fileupload-dropzone-color-hover-border: #434339;
+  --fileupload-dropzone-color-active-background: #112840;
+  --fileupload-dropzone-color-active-border: #0bd8b6;
+  --fileupload-dropzone-color-error-background: #3d181e;
+  --fileupload-dropzone-color-error-border: #fea6a6;
+  --fileupload-dropzone-color-disabled-background: #2a2a24;
+  --fileupload-dropzone-color-disabled-border: #2a2a24;
+  --fileupload-dropzone-color-disabled-foreground: #63635a;
+  --fileupload-dropzone-padding-sm: 1rem;
+  --fileupload-dropzone-padding-md: 1.5rem;
+  --fileupload-dropzone-padding-lg: 2rem;
+  --fileupload-dropzone-radius: 0.75rem;
+  --fileupload-dropzone-border-width: 0.125rem;
+  --fileupload-dropzone-border-style: dashed;
+  --fileupload-dropzone-gap: 0.75rem;
+  --fileupload-item-color-default-background: #23231e;
+  --fileupload-item-color-default-foreground: #e9e9e8;
+  --fileupload-item-color-error-background: #3d181e;
+  --fileupload-item-color-error-foreground: #e54d4e;
+  --fileupload-item-color-success-background: #092c2b;
+  --fileupload-item-color-success-foreground: #58d5ba;
+  --fileupload-item-padding-x: 0.75rem;
+  --fileupload-item-padding-y: 0.75rem;
+  --fileupload-item-radius: 0.375rem;
+  --fileupload-item-gap: 0.75rem;
+  --fileupload-preview-size: 2.5rem;
+  --fileupload-preview-radius: 0.1875rem;
+  --piechart-color-categorical-1: #0091ff;
+  --piechart-color-categorical-2: #f76808;
+  --piechart-color-categorical-3: #30a46c;
+  --piechart-color-categorical-4: #8e4ec6;
+  --piechart-color-categorical-5: #e5484d;
+  --piechart-color-categorical-6: #00a2c7;
+  --piechart-color-categorical-7: #ffc53d;
+  --piechart-color-categorical-8: #d6409f;
+  --piechart-color-track: #31312a;
+  --piechart-size-diameter-sm: 2rem;
+  --piechart-size-diameter-md: 4rem;
+  --piechart-size-diameter-lg: 8rem;
+}
+
+/* Responsive overrides: md (min-width: 768px) */
+@media (min-width: 768px) {
+  :root {
+    --section-padding-vertical-default: 2.5rem;
+    --section-padding-vertical-compact: 2rem;
+    --section-padding-vertical-spacious: 3rem;
+    --section-padding-horizontal-default: 1.5rem;
+    --section-padding-horizontal-compact: 1rem;
+    --section-padding-horizontal-spacious: 2rem;
+    --container-gap-default: 2rem;
+    --container-gap-compact: 1.5rem;
+    --container-gap-spacious: 2.5rem;
+  }
+}
+
+/* Responsive overrides: lg (min-width: 1024px) */
+@media (min-width: 1024px) {
+  :root {
+    --section-padding-vertical-default: 3rem;
+    --section-padding-vertical-compact: 2.5rem;
+    --section-padding-vertical-spacious: 4rem;
+    --section-padding-horizontal-default: 2.5rem;
+    --section-padding-horizontal-compact: 1.5rem;
+    --section-padding-horizontal-spacious: 3rem;
+    --container-gap-default: 2rem;
+    --container-gap-spacious: 3rem;
+  }
+}
+
+/* Layout mode: tablet (forced via data-layout attribute) */
+[data-layout="tablet"] {
+  --section-padding-vertical-default: 2.5rem;
+  --section-padding-vertical-compact: 2rem;
+  --section-padding-vertical-spacious: 3rem;
+  --section-padding-horizontal-default: 1.5rem;
+  --section-padding-horizontal-compact: 1rem;
+  --section-padding-horizontal-spacious: 2rem;
+  --container-gap-default: 2rem;
+  --container-gap-compact: 1.5rem;
+  --container-gap-spacious: 2.5rem;
+}
+
+/* Layout mode: desktop (forced via data-layout attribute) */
+[data-layout="desktop"] {
+  --section-padding-vertical-default: 3rem;
+  --section-padding-vertical-compact: 2.5rem;
+  --section-padding-vertical-spacious: 4rem;
+  --section-padding-horizontal-default: 2.5rem;
+  --section-padding-horizontal-compact: 1.5rem;
+  --section-padding-horizontal-spacious: 3rem;
+  --container-gap-default: 2rem;
+  --container-gap-spacious: 3rem;
+}