:root{--uxdsl__density__0:0;--uxdsl__density__1:var(--uxdsl__space__1);--uxdsl__density__2:var(--uxdsl__space__2);--uxdsl__density__3:var(--uxdsl__space__3);--uxdsl__density__4:var(--uxdsl__space__4);--uxdsl__density__5:var(--uxdsl__space__5);--uxdsl__density__6:var(--uxdsl__space__6);--uxdsl__density__7:var(--uxdsl__space__7);--uxdsl__density__8:var(--uxdsl__space__8);--uxdsl__density__9:var(--uxdsl__space__9);--uxdsl__density__10:var(--uxdsl__space__10);--uxdsl__density__11:var(--uxdsl__space__11);--uxdsl__density__12:var(--uxdsl__space__12);--uxdsl__density__13:var(--uxdsl__space__13);--uxdsl__density__14:var(--uxdsl__space__14);--uxdsl__density__15:var(--uxdsl__space__15);--uxdsl__color__blue-50:#e3f2fd;--uxdsl__color__blue-100:#bbdefb;--uxdsl__color__blue-200:#90caf9;--uxdsl__color__blue-300:#64b5f6;--uxdsl__color__blue-400:#3b82f6;--uxdsl__color__blue-500:#2563eb;--uxdsl__color__blue-600:#2e86c1;--uxdsl__color__blue-700:#1976d2;--uxdsl__color__blue-800:#1565c0;--uxdsl__color__blue-900:#0d47a1;--uxdsl__color__blue-contrast:#fff;--uxdsl__color__indigo-50:#e8eaf6;--uxdsl__color__indigo-100:#c5cae9;--uxdsl__color__indigo-200:#9fa8da;--uxdsl__color__indigo-300:#7986cb;--uxdsl__color__indigo-400:#5c6bc0;--uxdsl__color__indigo-500:#3f51b5;--uxdsl__color__indigo-600:#3949ab;--uxdsl__color__indigo-700:#303f9f;--uxdsl__color__indigo-800:#283593;--uxdsl__color__indigo-900:#1a237e;--uxdsl__color__indigo-contrast:#fff;--uxdsl__color__purple-50:#faf5ff;--uxdsl__color__purple-100:#f3e8ff;--uxdsl__color__purple-200:#e9d5ff;--uxdsl__color__purple-300:#d8b4fe;--uxdsl__color__purple-400:#a855f7;--uxdsl__color__purple-500:#9333ea;--uxdsl__color__purple-600:#7e22ce;--uxdsl__color__purple-700:#6b21a8;--uxdsl__color__purple-800:#581c87;--uxdsl__color__purple-900:#3b0764;--uxdsl__color__purple-contrast:#fff;--uxdsl__color__pink-50:#fce4ec;--uxdsl__color__pink-100:#f8bbd0;--uxdsl__color__pink-200:#f48fb1;--uxdsl__color__pink-300:#f06292;--uxdsl__color__pink-400:#ec407a;--uxdsl__color__pink-500:#e91e63;--uxdsl__color__pink-600:#d81b60;--uxdsl__color__pink-700:#c2185b;--uxdsl__color__pink-800:#ad1457;--uxdsl__color__pink-900:#880e4f;--uxdsl__color__pink-contrast:#fff;--uxdsl__color__red-50:#ffebee;--uxdsl__color__red-100:#ffcdd2;--uxdsl__color__red-200:#ef9a9a;--uxdsl__color__red-300:#e57373;--uxdsl__color__red-400:#ef5350;--uxdsl__color__red-500:#ec1b2e;--uxdsl__color__red-600:#c61625;--uxdsl__color__red-700:#d32f2f;--uxdsl__color__red-800:#c62828;--uxdsl__color__red-900:#771010;--uxdsl__color__red-contrast:#fff;--uxdsl__color__orange-50:#fff3e0;--uxdsl__color__orange-100:#ffe0b2;--uxdsl__color__orange-200:#ffcc80;--uxdsl__color__orange-300:#ffb74d;--uxdsl__color__orange-400:#ffa726;--uxdsl__color__orange-500:#f59e0b;--uxdsl__color__orange-600:#d97706;--uxdsl__color__orange-700:#f57c00;--uxdsl__color__orange-800:#ef6c00;--uxdsl__color__orange-900:#bb4600;--uxdsl__color__orange-contrast:#000;--uxdsl__color__yellow-50:#fffde7;--uxdsl__color__yellow-100:#fff9c4;--uxdsl__color__yellow-200:#fff59d;--uxdsl__color__yellow-300:#fff176;--uxdsl__color__yellow-400:#ffee58;--uxdsl__color__yellow-500:#ffeb3b;--uxdsl__color__yellow-600:#fdd835;--uxdsl__color__yellow-700:#fbc02d;--uxdsl__color__yellow-800:#f9a825;--uxdsl__color__yellow-900:#f57f17;--uxdsl__color__yellow-contrast:#000;--uxdsl__color__green-50:#e8f5e9;--uxdsl__color__green-100:#c8e6c9;--uxdsl__color__green-200:#a5d6a7;--uxdsl__color__green-300:#81c784;--uxdsl__color__green-400:#66bb6a;--uxdsl__color__green-500:#4caf50;--uxdsl__color__green-600:#15803d;--uxdsl__color__green-700:#166534;--uxdsl__color__green-800:#2e7d32;--uxdsl__color__green-900:#1b5e20;--uxdsl__color__green-contrast:#fff;--uxdsl__color__teal-50:#f0fdfa;--uxdsl__color__teal-100:#ccfbf1;--uxdsl__color__teal-200:#99f6e4;--uxdsl__color__teal-300:#5eead4;--uxdsl__color__teal-400:#2dd4bf;--uxdsl__color__teal-500:#14b8a6;--uxdsl__color__teal-600:#0d9488;--uxdsl__color__teal-700:#0f766e;--uxdsl__color__teal-800:#115e59;--uxdsl__color__teal-900:#134e4a;--uxdsl__color__teal-contrast:#fff;--uxdsl__color__cyan-50:#e0f7fa;--uxdsl__color__cyan-100:#b2ebf2;--uxdsl__color__cyan-200:#80deea;--uxdsl__color__cyan-300:#4dd0e1;--uxdsl__color__cyan-400:#26c6da;--uxdsl__color__cyan-500:#00bcd4;--uxdsl__color__cyan-600:#00acc1;--uxdsl__color__cyan-700:#0097a7;--uxdsl__color__cyan-800:#00838f;--uxdsl__color__cyan-900:#006064;--uxdsl__color__cyan-contrast:#000;--uxdsl__color__gray-50:#f8fafc;--uxdsl__color__gray-100:#f1f5f9;--uxdsl__color__gray-200:#e2e8f0;--uxdsl__color__gray-700:#334155;--uxdsl__color__gray-800:#1f2937;--uxdsl__color__gray-900:#0b1220;--uxdsl__color__gray-contrast:#000;--uxdsl__color__black:#000;--uxdsl__color__white:#fff;--uxdsl__color__slate-50:#f5f8fa;--uxdsl__color__slate-100:#dde5eb;--uxdsl__color__slate-200:#bcccdc;--uxdsl__color__slate-300:#9fb3c8;--uxdsl__color__slate-400:#829ab1;--uxdsl__color__slate-500:#627d98;--uxdsl__color__slate-600:#486581;--uxdsl__color__slate-700:#334e68;--uxdsl__color__slate-800:#2c415c;--uxdsl__color__slate-900:#102a43;--uxdsl__color__slate-contrast:#fff;--uxdsl__palette__primary-main:var(--uxdsl__color__purple-600);--uxdsl__palette__primary-light:var(--uxdsl__color__purple-400);--uxdsl__palette__primary-dark:var(--uxdsl__color__purple-800);--uxdsl__palette__primary-contrast:var(--uxdsl__color__white);--uxdsl__palette__surface-main:var(--uxdsl__color__white);--uxdsl__palette__surface-light:var(--uxdsl__color__slate-50);--uxdsl__palette__surface-dark:var(--uxdsl__color__slate-100);--uxdsl__palette__surface-contrast:var(--uxdsl__color__slate-900);--uxdsl__palette__secondary-main:var(--uxdsl__color__pink-600);--uxdsl__palette__secondary-light:var(--uxdsl__color__pink-400);--uxdsl__palette__secondary-dark:var(--uxdsl__color__pink-700);--uxdsl__palette__secondary-contrast:var(--uxdsl__color__white);--uxdsl__palette__tertiary-main:var(--uxdsl__color__slate-200);--uxdsl__palette__tertiary-light:var(--uxdsl__color__slate-100);--uxdsl__palette__tertiary-dark:var(--uxdsl__color__slate-300);--uxdsl__palette__tertiary-contrast:var(--uxdsl__color__slate-900);--uxdsl__palette__success-main:var(--uxdsl__color__green-700);--uxdsl__palette__success-light:var(--uxdsl__color__green-600);--uxdsl__palette__success-dark:var(--uxdsl__color__green-800);--uxdsl__palette__success-contrast:var(--uxdsl__color__white);--uxdsl__palette__info-main:var(--uxdsl__color__blue-600);--uxdsl__palette__info-light:var(--uxdsl__color__blue-500);--uxdsl__palette__info-dark:var(--uxdsl__color__blue-700);--uxdsl__palette__info-contrast:var(--uxdsl__color__white);--uxdsl__palette__warning-main:var(--uxdsl__color__orange-500);--uxdsl__palette__warning-light:var(--uxdsl__color__orange-400);--uxdsl__palette__warning-dark:var(--uxdsl__color__orange-600);--uxdsl__palette__warning-contrast:var(--uxdsl__color__gray-900);--uxdsl__palette__error-main:var(--uxdsl__color__red-600);--uxdsl__palette__error-light:var(--uxdsl__color__red-500);--uxdsl__palette__error-dark:var(--uxdsl__color__red-700);--uxdsl__palette__error-contrast:var(--uxdsl__color__white);--uxdsl__palette__dark-main:var(--uxdsl__color__slate-900);--uxdsl__palette__dark-light:var(--uxdsl__color__slate-800);--uxdsl__palette__dark-dark:var(--uxdsl__color__black);--uxdsl__palette__dark-contrast:var(--uxdsl__color__white);--uxdsl__palette__neutral-main:var(--uxdsl__color__gray-200);--uxdsl__palette__neutral-light:var(--uxdsl__color__gray-50);--uxdsl__palette__neutral-dark:var(--uxdsl__color__gray-300);--uxdsl__palette__neutral-contrast:var(--uxdsl__color__gray-900);--uxdsl__palette__light-main:var(--uxdsl__color__white);--uxdsl__palette__light-light:var(--uxdsl__color__gray-50);--uxdsl__palette__light-dark:var(--uxdsl__color__gray-100);--uxdsl__palette__light-contrast:var(--uxdsl__color__slate-900)}@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap");html{color-scheme:light dark}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--uxdsl__palette__primary-main:var(--uxdsl__color__slate-400);--uxdsl__palette__primary-light:var(--uxdsl__color__slate-300);--uxdsl__palette__primary-dark:var(--uxdsl__color__slate-500);--uxdsl__palette__primary-contrast:var(--uxdsl__color__slate-900);--uxdsl__palette__surface-main:var(--uxdsl__color__slate-900);--uxdsl__palette__surface-light:var(--uxdsl__color__slate-800);--uxdsl__palette__surface-dark:#0a1b2a;--uxdsl__palette__surface-contrast:var(--uxdsl__color__white);--uxdsl__palette__secondary-main:var(--uxdsl__color__gray-400);--uxdsl__palette__secondary-contrast:var(--uxdsl__color__gray-900);--uxdsl__palette__neutral-main:var(--uxdsl__color__gray-400);--uxdsl__palette__neutral-light:var(--uxdsl__color__gray-300);--uxdsl__palette__neutral-dark:var(--uxdsl__color__gray-500);--uxdsl__palette__neutral-contrast:var(--uxdsl__color__gray-900);--uxdsl__palette__light-main:var(--uxdsl__color__slate-800);--uxdsl__palette__light-contrast:var(--uxdsl__color__white)}}:root[data-theme=dark]{--uxdsl__palette__primary-main:var(--uxdsl__color__slate-400);--uxdsl__palette__primary-light:var(--uxdsl__color__slate-300);--uxdsl__palette__primary-dark:var(--uxdsl__color__slate-500);--uxdsl__palette__primary-contrast:var(--uxdsl__color__slate-900);--uxdsl__palette__surface-main:var(--uxdsl__color__slate-900);--uxdsl__palette__surface-light:var(--uxdsl__color__slate-800);--uxdsl__palette__surface-dark:#0a1b2a;--uxdsl__palette__surface-contrast:var(--uxdsl__color__white);--uxdsl__palette__secondary-main:var(--uxdsl__color__gray-400);--uxdsl__palette__secondary-contrast:var(--uxdsl__color__gray-900);--uxdsl__palette__neutral-main:var(--uxdsl__color__gray-400);--uxdsl__palette__neutral-light:var(--uxdsl__color__gray-300);--uxdsl__palette__neutral-dark:var(--uxdsl__color__gray-500);--uxdsl__palette__neutral-contrast:var(--uxdsl__color__gray-900);--uxdsl__palette__light-main:var(--uxdsl__color__slate-800);--uxdsl__palette__light-contrast:var(--uxdsl__color__white)}:root{--uxdsl__font__ui:Inter,system-ui,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--uxdsl__font__code:Menlo,"SF Mono",Monaco,Inconsolata,"Roboto Mono","Source Code Pro",monospace;--uxdsl__typography__default-transform:none;--uxdsl__typography__default-decoration:none;--uxdsl__typography__default-style:normal;--uxdsl__typography__default-margin-block-start:auto;--uxdsl__typography__default-margin-block-end:auto;--uxdsl__typography__h1-line:1.1;--uxdsl__typography__h1-font-family:var(--uxdsl__font__ui);--uxdsl__typography__h1-transform:var(--uxdsl__typography__default-transform,none);--uxdsl__typography__h1-decoration:var(--uxdsl__typography__default-decoration,none);--uxdsl__typography__h1-style:var(--uxdsl__typography__default-style,normal);--uxdsl__typography__h1-margin-block-start:var(--uxdsl__typography__default-margin-block-start,auto);--uxdsl__typography__h1-margin-block-end:var(--uxdsl__typography__default-margin-block-end,auto);--uxdsl__typography__h2-font-family:var(--uxdsl__font__ui);--uxdsl__typography__h2-transform:var(--uxdsl__typography__default-transform,none);--uxdsl__typography__h2-decoration:var(--uxdsl__typography__default-decoration,none);--uxdsl__typography__h2-style:var(--uxdsl__typography__default-style,normal);--uxdsl__typography__h2-margin-block-start:var(--uxdsl__typography__default-margin-block-start,auto);--uxdsl__typography__h2-margin-block-end:var(--uxdsl__typography__default-margin-block-end,auto);--uxdsl__typography__h3-font-family:var(--uxdsl__font__ui);--uxdsl__typography__h3-transform:var(--uxdsl__typography__default-transform,none);--uxdsl__typography__h3-decoration:var(--uxdsl__typography__default-decoration,none);--uxdsl__typography__h3-style:var(--uxdsl__typography__default-style,normal);--uxdsl__typography__h3-margin-block-start:var(--uxdsl__typography__default-margin-block-start,auto);--uxdsl__typography__h3-margin-block-end:var(--uxdsl__typography__default-margin-block-end,auto);--uxdsl__typography__h4-font-family:var(--uxdsl__font__ui);--uxdsl__typography__h4-transform:var(--uxdsl__typography__default-transform,none);--uxdsl__typography__h4-decoration:var(--uxdsl__typography__default-decoration,none);--uxdsl__typography__h4-style:var(--uxdsl__typography__default-style,normal);--uxdsl__typography__h4-margin-block-start:var(--uxdsl__typography__default-margin-block-start,auto);--uxdsl__typography__h4-margin-block-end:var(--uxdsl__typography__default-margin-block-end,auto);--uxdsl__typography__h5-font-family:var(--uxdsl__font__ui-2,var(--uxdsl__font__ui));--uxdsl__typography__h5-transform:var(--uxdsl__typography__default-transform,none);--uxdsl__typography__h5-decoration:var(--uxdsl__typography__default-decoration,none);--uxdsl__typography__h5-style:var(--uxdsl__typography__default-style,normal);--uxdsl__typography__h5-margin-block-start:var(--uxdsl__typography__default-margin-block-start,auto);--uxdsl__typography__h5-margin-block-end:var(--uxdsl__typography__default-margin-block-end,auto);--uxdsl__typography__h6-font-family:var(--uxdsl__font__ui-2,var(--uxdsl__font__ui));--uxdsl__typography__h6-transform:var(--uxdsl__typography__default-transform,none);--uxdsl__typography__h6-decoration:var(--uxdsl__typography__default-decoration,none);--uxdsl__typography__h6-style:var(--uxdsl__typography__default-style,normal);--uxdsl__typography__h6-margin-block-start:var(--uxdsl__typography__default-margin-block-start,auto);--uxdsl__typography__h6-margin-block-end:var(--uxdsl__typography__default-margin-block-end,auto);--uxdsl__typography__p-font-family:var(--uxdsl__font__ui);--uxdsl__typography__p-transform:var(--uxdsl__typography__default-transform,none);--uxdsl__typography__p-decoration:var(--uxdsl__typography__default-decoration,none);--uxdsl__typography__p-style:var(--uxdsl__typography__default-style,normal);--uxdsl__typography__p-margin-block-start:var(--uxdsl__typography__default-margin-block-start,auto);--uxdsl__typography__p-margin-block-end:var(--uxdsl__typography__default-margin-block-end,auto);--uxdsl__typography__span-line:1.5;--uxdsl__typography__span-font-family:var(--uxdsl__font__ui);--uxdsl__typography__span-transform:var(--uxdsl__typography__default-transform,none);--uxdsl__typography__span-decoration:var(--uxdsl__typography__default-decoration,none);--uxdsl__typography__span-style:var(--uxdsl__typography__default-style,normal);--uxdsl__typography__span-margin-block-start:var(--uxdsl__typography__default-margin-block-start,auto);--uxdsl__typography__span-margin-block-end:var(--uxdsl__typography__default-margin-block-end,auto);--uxdsl__typography__body-font-family:var(--uxdsl__font__ui);--uxdsl__typography__body-transform:var(--uxdsl__typography__default-transform,none);--uxdsl__typography__body-decoration:var(--uxdsl__typography__default-decoration,none);--uxdsl__typography__body-style:var(--uxdsl__typography__default-style,normal);--uxdsl__typography__body-margin-block-start:var(--uxdsl__typography__default-margin-block-start,auto);--uxdsl__typography__body-margin-block-end:var(--uxdsl__typography__default-margin-block-end,auto);--uxdsl__typography__caption-opacity:0.8;--uxdsl__typography__caption-font-family:var(--uxdsl__font__ui-2,var(--uxdsl__font__ui));--uxdsl__typography__caption-transform:var(--uxdsl__typography__default-transform,none);--uxdsl__typography__caption-decoration:var(--uxdsl__typography__default-decoration,none);--uxdsl__typography__caption-style:var(--uxdsl__typography__default-style,normal);--uxdsl__typography__caption-margin-block-start:var(--uxdsl__typography__default-margin-block-start,auto);--uxdsl__typography__caption-margin-block-end:var(--uxdsl__typography__default-margin-block-end,auto);--uxdsl__typography__small-font-family:var(--uxdsl__font__ui-2,var(--uxdsl__font__ui));--uxdsl__typography__small-transform:var(--uxdsl__typography__default-transform,none);--uxdsl__typography__small-decoration:var(--uxdsl__typography__default-decoration,none);--uxdsl__typography__small-style:var(--uxdsl__typography__default-style,normal);--uxdsl__typography__small-margin-block-start:var(--uxdsl__typography__default-margin-block-start,auto);--uxdsl__typography__small-margin-block-end:var(--uxdsl__typography__default-margin-block-end,auto);--uxdsl__typography__pre-line:1.5;--uxdsl__typography__pre-font-family:var(--uxdsl__font__code);--uxdsl__typography__pre-transform:var(--uxdsl__typography__default-transform,none);--uxdsl__typography__pre-decoration:var(--uxdsl__typography__default-decoration,none);--uxdsl__typography__pre-style:var(--uxdsl__typography__default-style,normal);--uxdsl__typography__pre-margin-block-start:var(--uxdsl__typography__default-margin-block-start,auto);--uxdsl__typography__pre-margin-block-end:var(--uxdsl__typography__default-margin-block-end,auto)}@media (min-width:768px){:root{--uxdsl__typography__h1-size:var(--uxdsl__space__8);--uxdsl__typography__h2-line:1.15;--uxdsl__typography__h3-size:var(--uxdsl__space__7);--uxdsl__typography__h3-line:1.25;--uxdsl__typography__h4-size:var(--uxdsl__space__6)}}.ds-typo{font-family:var(--uxdsl__font__ui),sans-serif;color:inherit;margin-block-start:auto;margin-block-end:auto}:where(h1).ds-typo{font-size:var(--uxdsl__typography__h1-size);font-weight:var(--uxdsl__typography__h1-weight,700);font-family:var(--uxdsl__typography__h1-font-family,var(--uxdsl__font__ui));line-height:var(--uxdsl__typography__h1-line);letter-spacing:var(--uxdsl__typography__h1-spacing);text-transform:var(--uxdsl__typography__h1-transform,none);text-decoration:var(--uxdsl__typography__h1-decoration,none);font-style:var(--uxdsl__typography__h1-style,normal);margin-block-start:var(--uxdsl__typography__h1-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h1-margin-block-end,auto)}:where(h2).ds-typo{font-size:var(--uxdsl__typography__h2-size);font-weight:var(--uxdsl__typography__h2-weight,700);font-family:var(--uxdsl__typography__h2-font-family,var(--uxdsl__font__ui));line-height:var(--uxdsl__typography__h2-line);letter-spacing:var(--uxdsl__typography__h2-spacing);text-transform:var(--uxdsl__typography__h2-transform,none);text-decoration:var(--uxdsl__typography__h2-decoration,none);font-style:var(--uxdsl__typography__h2-style,normal);margin-block-start:var(--uxdsl__typography__h2-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h2-margin-block-end,auto)}:where(h3).ds-typo{font-size:var(--uxdsl__typography__h3-size);font-weight:var(--uxdsl__typography__h3-weight,600);font-family:var(--uxdsl__typography__h3-font-family,var(--uxdsl__font__ui));line-height:var(--uxdsl__typography__h3-line);letter-spacing:var(--uxdsl__typography__h3-spacing);text-transform:var(--uxdsl__typography__h3-transform,none);text-decoration:var(--uxdsl__typography__h3-decoration,none);font-style:var(--uxdsl__typography__h3-style,normal);margin-block-start:var(--uxdsl__typography__h3-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h3-margin-block-end,auto)}:where(h4).ds-typo{font-size:var(--uxdsl__typography__h4-size);font-weight:var(--uxdsl__typography__h4-weight,600);font-family:var(--uxdsl__typography__h4-font-family,var(--uxdsl__font__ui));line-height:var(--uxdsl__typography__h4-line);letter-spacing:var(--uxdsl__typography__h4-spacing);text-transform:var(--uxdsl__typography__h4-transform,none);text-decoration:var(--uxdsl__typography__h4-decoration,none);font-style:var(--uxdsl__typography__h4-style,normal);margin-block-start:var(--uxdsl__typography__h4-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h4-margin-block-end,auto)}:where(h5).ds-typo{font-size:var(--uxdsl__typography__h5-size);font-weight:var(--uxdsl__typography__h5-weight,600);font-family:var(--uxdsl__typography__h5-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));line-height:var(--uxdsl__typography__h5-line);letter-spacing:var(--uxdsl__typography__h5-spacing);text-transform:var(--uxdsl__typography__h5-transform,none);text-decoration:var(--uxdsl__typography__h5-decoration,none);font-style:var(--uxdsl__typography__h5-style,normal);margin-block-start:var(--uxdsl__typography__h5-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h5-margin-block-end,auto)}:where(h6).ds-typo{font-size:var(--uxdsl__typography__h6-size);font-weight:var(--uxdsl__typography__h6-weight,600);font-family:var(--uxdsl__typography__h6-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));line-height:var(--uxdsl__typography__h6-line);letter-spacing:var(--uxdsl__typography__h6-spacing);text-transform:var(--uxdsl__typography__h6-transform,none);text-decoration:var(--uxdsl__typography__h6-decoration,none);font-style:var(--uxdsl__typography__h6-style,normal);margin-block-start:var(--uxdsl__typography__h6-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h6-margin-block-end,auto)}:where(p).ds-typo{font-size:var(--uxdsl__typography__p-size);line-height:var(--uxdsl__typography__p-line,normal);font-weight:var(--uxdsl__typography__p-weight,400);font-family:var(--uxdsl__typography__p-font-family,var(--uxdsl__font__ui));letter-spacing:var(--uxdsl__typography__p-spacing);text-transform:var(--uxdsl__typography__p-transform,none);text-decoration:var(--uxdsl__typography__p-decoration,none);font-style:var(--uxdsl__typography__p-style,normal);margin-block-start:var(--uxdsl__typography__p-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__p-margin-block-end,auto)}:where(span).ds-typo{font-size:var(--uxdsl__typography__span-size);font-weight:var(--uxdsl__typography__span-weight,400);font-family:var(--uxdsl__typography__span-font-family,var(--uxdsl__font__ui));line-height:var(--uxdsl__typography__span-line);letter-spacing:var(--uxdsl__typography__span-spacing);text-transform:var(--uxdsl__typography__span-transform,none);text-decoration:var(--uxdsl__typography__span-decoration,none);font-style:var(--uxdsl__typography__span-style,normal);margin-block-start:var(--uxdsl__typography__span-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__span-margin-block-end,auto)}:where(small).ds-typo{font-size:var(--uxdsl__typography__small-size);opacity:var(--uxdsl__typography__caption-opacity,1);font-family:var(--uxdsl__typography__small-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));line-height:var(--uxdsl__typography__small-line);letter-spacing:var(--uxdsl__typography__small-spacing);text-transform:var(--uxdsl__typography__small-transform,none);text-decoration:var(--uxdsl__typography__small-decoration,none);font-style:var(--uxdsl__typography__small-style,normal);margin-block-start:var(--uxdsl__typography__small-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__small-margin-block-end,auto)}:where(.caption).ds-typo,:where(caption).ds-typo{font-size:var(--uxdsl__typography__caption-size);opacity:var(--uxdsl__typography__caption-opacity,.8);font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));line-height:var(--uxdsl__typography__caption-line);letter-spacing:var(--uxdsl__typography__caption-spacing);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto)}:where(code).ds-typo,:where(pre).ds-typo{font-family:var(--uxdsl__typography__pre-font-family,var(--uxdsl__font__code)),monospace;font-size:var(--uxdsl__typography__pre-size);line-height:var(--uxdsl__typography__pre-line)}.ds-typo[data-typo=h1]{font-family:var(--uxdsl__typography__h1-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h1-size);line-height:var(--uxdsl__typography__h1-line,1.1);font-weight:var(--uxdsl__typography__h1-weight,700);letter-spacing:var(--uxdsl__typography__h1-spacing,-.02em);text-transform:var(--uxdsl__typography__h1-transform,none);text-decoration:var(--uxdsl__typography__h1-decoration,none);font-style:var(--uxdsl__typography__h1-style,normal);margin-block-start:var(--uxdsl__typography__h1-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h1-margin-block-end,auto)}.ds-typo[data-typo=h2]{font-family:var(--uxdsl__typography__h2-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h2-size);line-height:var(--uxdsl__typography__h2-line,1.2);font-weight:var(--uxdsl__typography__h2-weight,700);letter-spacing:var(--uxdsl__typography__h2-spacing,-.01em);text-transform:var(--uxdsl__typography__h2-transform,none);text-decoration:var(--uxdsl__typography__h2-decoration,none);font-style:var(--uxdsl__typography__h2-style,normal);margin-block-start:var(--uxdsl__typography__h2-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h2-margin-block-end,auto)}.ds-typo[data-typo=h3]{font-family:var(--uxdsl__typography__h3-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h3-size);line-height:var(--uxdsl__typography__h3-line,1.3);font-weight:var(--uxdsl__typography__h3-weight,600);letter-spacing:var(--uxdsl__typography__h3-spacing,normal);text-transform:var(--uxdsl__typography__h3-transform,none);text-decoration:var(--uxdsl__typography__h3-decoration,none);font-style:var(--uxdsl__typography__h3-style,normal);margin-block-start:var(--uxdsl__typography__h3-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h3-margin-block-end,auto)}.ds-typo[data-typo=h4]{font-family:var(--uxdsl__typography__h4-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h4-size);line-height:var(--uxdsl__typography__h4-line,1.4);font-weight:var(--uxdsl__typography__h4-weight,600);letter-spacing:var(--uxdsl__typography__h4-spacing,normal);text-transform:var(--uxdsl__typography__h4-transform,none);text-decoration:var(--uxdsl__typography__h4-decoration,none);font-style:var(--uxdsl__typography__h4-style,normal);margin-block-start:var(--uxdsl__typography__h4-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h4-margin-block-end,auto)}.ds-typo[data-typo=h5]{font-family:var(--uxdsl__typography__h5-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__h5-size);line-height:var(--uxdsl__typography__h5-line,1.4);font-weight:var(--uxdsl__typography__h5-weight,600);letter-spacing:var(--uxdsl__typography__h5-spacing,normal);text-transform:var(--uxdsl__typography__h5-transform,none);text-decoration:var(--uxdsl__typography__h5-decoration,none);font-style:var(--uxdsl__typography__h5-style,normal);margin-block-start:var(--uxdsl__typography__h5-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h5-margin-block-end,auto)}.ds-typo[data-typo=h6]{font-family:var(--uxdsl__typography__h6-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__h6-size);line-height:var(--uxdsl__typography__h6-line,1.4);font-weight:var(--uxdsl__typography__h6-weight,600);letter-spacing:var(--uxdsl__typography__h6-spacing,normal);text-transform:var(--uxdsl__typography__h6-transform,none);text-decoration:var(--uxdsl__typography__h6-decoration,none);font-style:var(--uxdsl__typography__h6-style,normal);margin-block-start:var(--uxdsl__typography__h6-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h6-margin-block-end,auto)}.ds-typo[data-typo=p]{font-family:var(--uxdsl__typography__p-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__p-size);line-height:var(--uxdsl__typography__p-line,1.6);font-weight:var(--uxdsl__typography__p-weight,400);letter-spacing:var(--uxdsl__typography__p-spacing,normal);text-transform:var(--uxdsl__typography__p-transform,none);text-decoration:var(--uxdsl__typography__p-decoration,none);font-style:var(--uxdsl__typography__p-style,normal);margin-block-start:var(--uxdsl__typography__p-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__p-margin-block-end,auto)}.ds-typo[data-typo=body]{font-family:var(--uxdsl__typography__body-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-size);line-height:var(--uxdsl__typography__body-line,1.6);font-weight:var(--uxdsl__typography__body-weight,400);letter-spacing:var(--uxdsl__typography__body-spacing,normal);text-transform:var(--uxdsl__typography__body-transform,none);text-decoration:var(--uxdsl__typography__body-decoration,none);font-style:var(--uxdsl__typography__body-style,normal);margin-block-start:var(--uxdsl__typography__body-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-margin-block-end,auto)}.ds-typo[data-typo=span]{font-family:var(--uxdsl__typography__span-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__span-size);line-height:var(--uxdsl__typography__span-line,1.5);font-weight:var(--uxdsl__typography__span-weight,400);letter-spacing:var(--uxdsl__typography__span-spacing,normal);text-transform:var(--uxdsl__typography__span-transform,none);text-decoration:var(--uxdsl__typography__span-decoration,none);font-style:var(--uxdsl__typography__span-style,normal);margin-block-start:var(--uxdsl__typography__span-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__span-margin-block-end,auto)}.ds-typo[data-typo=small]{font-family:var(--uxdsl__typography__small-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__small-size);line-height:var(--uxdsl__typography__small-line,1.4);letter-spacing:var(--uxdsl__typography__small-spacing,normal);text-transform:var(--uxdsl__typography__small-transform,none);text-decoration:var(--uxdsl__typography__small-decoration,none);font-style:var(--uxdsl__typography__small-style,normal);margin-block-start:var(--uxdsl__typography__small-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__small-margin-block-end,auto);opacity:var(--uxdsl__typography__small-opacity,.8)}.ds-typo[data-typo=caption]{font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8)}.ds-typo[data-typo=pre]{font-family:var(--uxdsl__typography__pre-font-family,var(--uxdsl__font__code),monospace);font-size:var(--uxdsl__typography__pre-size);line-height:var(--uxdsl__typography__pre-line,1.5);text-transform:var(--uxdsl__typography__pre-transform,none);text-decoration:var(--uxdsl__typography__pre-decoration,none);font-style:var(--uxdsl__typography__pre-style,normal);margin-block-start:var(--uxdsl__typography__pre-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__pre-margin-block-end,auto)}.ds-typo[data-typo=code]{font-family:var(--uxdsl__typography__code-font-family,var(--uxdsl__font__code),monospace);font-size:var(--uxdsl__typography__code-size);line-height:var(--uxdsl__typography__code-line,1.5);text-transform:var(--uxdsl__typography__code-transform,none);text-decoration:var(--uxdsl__typography__code-decoration,none);font-style:var(--uxdsl__typography__code-style,normal);margin-block-start:var(--uxdsl__typography__code-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__code-margin-block-end,auto)}.ds-typo[data-typo=default]{font-family:var(--uxdsl__typography__default-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__default-size);line-height:var(--uxdsl__typography__default-line,1.5);font-weight:var(--uxdsl__typography__default-weight,400);letter-spacing:var(--uxdsl__typography__default-spacing,normal);text-transform:var(--uxdsl__typography__default-transform,none);text-decoration:var(--uxdsl__typography__default-decoration,none);font-style:var(--uxdsl__typography__default-style,normal);margin-block-start:var(--uxdsl__typography__default-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__default-margin-block-end,auto)}.concentric-content,.concentric-wrapper{position:relative;display:flex;justify-content:center;align-items:center}.concentric-content{z-index:100;background:var(--uxdsl__palette__surface-main);padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__1);min-width:80px;min-height:40px;box-shadow:var(--uxdsl__shadow__2);font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);font-weight:700;color:var(--uxdsl__palette__primary-dark);border:1px solid var(--uxdsl__palette__neutral-light)}.concentric-ring{position:absolute;border-radius:var(--uxdsl__radius__2);border:1px solid color-mix(in srgb,var(--uxdsl__palette__primary-main) 20%,transparent);background:color-mix(in srgb,var(--uxdsl__palette__primary-main) 3%,transparent);pointer-events:auto;transition:all .2s ease;display:flex;justify-content:center;align-items:flex-start;cursor:pointer}.concentric-ring.is-hovered,.concentric-ring:hover{border-color:var(--uxdsl__palette__secondary-main);background:color-mix(in srgb,var(--uxdsl__palette__secondary-main) 10%,transparent);box-shadow:0 0 0 1px var(--uxdsl__palette__secondary-main)}.ring-label{background:var(--uxdsl__palette__secondary-main);color:var(--uxdsl__palette__secondary-contrast);font-size:.6rem;padding:1px 4px;border-radius:0 0 4px 4px;opacity:0;transition:opacity .2s;margin-top:-1px}.concentric-ring.is-hovered .ring-label,.concentric-ring:hover .ring-label{opacity:1}.concentric-ring--uxdsl__density__1{inset:calc(var(--uxdsl__density__1) * -1);z-index:calc(20 - 1)}.concentric-ring--uxdsl__density__2{inset:calc(var(--uxdsl__density__2) * -1);z-index:calc(20 - 2)}.concentric-ring--uxdsl__density__3{inset:calc(var(--uxdsl__density__3) * -1);z-index:calc(20 - 3)}.concentric-ring--uxdsl__density__4{inset:calc(var(--uxdsl__density__4) * -1);z-index:calc(20 - 4)}.concentric-ring--uxdsl__density__5{inset:calc(var(--uxdsl__density__5) * -1);z-index:calc(20 - 5)}.concentric-ring--uxdsl__density__6{inset:calc(var(--uxdsl__density__6) * -1);z-index:calc(20 - 6)}.concentric-ring--uxdsl__density__7{inset:calc(var(--uxdsl__density__7) * -1);z-index:calc(20 - 7)}.concentric-ring--uxdsl__density__8{inset:calc(var(--uxdsl__density__8) * -1);z-index:calc(20 - 8)}.concentric-ring--uxdsl__density__9{inset:calc(var(--uxdsl__density__9) * -1);z-index:calc(20 - 9)}.concentric-ring--uxdsl__density__10{inset:calc(var(--uxdsl__density__10) * -1);z-index:calc(20 - 10)}.concentric-ring--uxdsl__density__11{inset:calc(var(--uxdsl__density__11) * -1);z-index:calc(20 - 11)}.concentric-ring--uxdsl__density__12{inset:calc(var(--uxdsl__density__12) * -1);z-index:calc(20 - 12)}.concentric-ring--uxdsl__density__13{inset:calc(var(--uxdsl__density__13) * -1);z-index:calc(20 - 13)}.concentric-ring--uxdsl__density__14{inset:calc(var(--uxdsl__density__14) * -1);z-index:calc(20 - 14)}.concentric-ring--uxdsl__density__15{inset:calc(var(--uxdsl__density__15) * -1);z-index:calc(20 - 15)}.concentric-ring--uxdsl__density__16{inset:calc(var(--uxdsl__density__16) * -1);z-index:calc(20 - 16)}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:6px;background:var(--uxdsl__palette__neutral-light);border-radius:9999px;outline:none;opacity:.8;transition:opacity .2s;cursor:pointer;margin:var(--uxdsl__density__1) 0}input[type=range]:hover{opacity:1}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:9999px;background:var(--uxdsl__palette__primary-main);cursor:pointer;transition:background .15s ease-in-out,transform .1s;border:2px solid var(--uxdsl__palette__surface-main);box-shadow:var(--uxdsl__shadow__1)}input[type=range]::-webkit-slider-thumb:hover{background:var(--uxdsl__palette__primary-light);transform:scale(1.1)}input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:9999px;background:var(--uxdsl__palette__primary-main);cursor:pointer;transition:background .15s ease-in-out,transform .1s;border:2px solid var(--uxdsl__palette__surface-main);box-shadow:var(--uxdsl__shadow__1)}input[type=range]::-moz-range-thumb:hover{background:var(--uxdsl__palette__primary-light);transform:scale(1.1)}*,:after,:before{box-sizing:border-box}body,html{min-height:100%;margin:0!important;padding:0!important;width:100%;font-family:var(--uxdsl__font__ui,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif);background:var(--uxdsl__palette__surface-main);color:var(--uxdsl__palette__surface-contrast)}.main{display:block;min-height:100vh;padding:var(--uxdsl__space__6) var(--uxdsl__space__4);background:var(--uxdsl__palette__surface-light)}.container{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:var(--uxdsl__space__3)}.layout{display:grid;grid-template-columns:100%;gap:var(--uxdsl__space__4);padding:var(--uxdsl__space__2);margin:0 auto;max-width:1400px;align-items:start}@media (min-width:1024px){.layout{grid-template-columns:max-content 1fr}}@media (min-width:768px){.layout{gap:var(--uxdsl__space__6);padding:var(--uxdsl__space__4)}}.layout__nav{position:absolute;width:0;height:0;@media (min-width:1024px){position:static;width:auto;height:auto;min-width:0}}.layout__content{min-width:0}:root{--uxdsl__font__code:"JetBrains Mono","SF Mono",Menlo,monospace;--uxdsl__radius__full:9999px}@ds-surface ai-prompt-container{margin-top:var(--uxdsl__space__4);width:100%;max-width:600px;background:transparent;position:relative;z-index:10}.ai-prompt-form{width:100%}@ds-surface input-wrapper{display:flex;align-items:center;padding:var(--uxdsl__space__2);border-radius:9999px;background:var(--uxdsl__palette__surface-paper);border:1px solid var(--uxdsl__palette__divider-main);transition:border-color .2s ease;position:relative;z-index:1;&:focus-within{border-color:var(--uxdsl__palette__primary-main);box-shadow:0 0 0 2px var(--uxdsl__palette__primary-light)}}.ai-icon{color:var(--uxdsl__palette__primary-main);margin-right:var(--uxdsl__space__2)}.ai-input{flex:1;border:none;background:transparent;color:var(--uxdsl__palette__text-primary);font-size:1rem;outline:none;&::placeholder{color:var(--uxdsl__palette__text-secondary)}}.ai-submit-btn{padding:var(--uxdsl__surface__flat-padding);border-radius:var(--uxdsl__surface__flat-radius);background:transparent;color:var(--uxdsl__palette__primary-main);border:var(--uxdsl__surface__flat-border);box-shadow:var(--uxdsl__surface__flat-shadow);--uxdsl__button__tone-main:var(--uxdsl__palette__primary-main);--uxdsl__button__tone-dark:var(--uxdsl__palette__primary-dark);--uxdsl__button__tone-contrast:var(--uxdsl__palette__primary-contrast);&:disabled{color:var(--uxdsl__palette__action-disabled);border-color:var(--uxdsl__palette__action-disabled)}}.ai-submit-btn:hover{color:var(--uxdsl__button__flat-tone-primary-hover-color,var(--uxdsl__button__flat-hover-color))}.ai-submit-btn.is-selected,.ai-submit-btn[aria-pressed=true],.ai-submit-btn[aria-selected=true]{color:var(--uxdsl__button__flat-tone-primary-selected-color,var(--uxdsl__button__flat-selected-color))}@ds-surface ai-response{margin-top:var(--uxdsl__space__4);padding:var(--uxdsl__space__4);border-radius:var(--uxdsl__radius__3);background:var(--uxdsl__palette__surface-paper);border:1px solid var(--uxdsl__palette__divider-main);color:var(--uxdsl__palette__text-primary);font-size:.95rem;line-height:1.6}.theme-loading-overlay{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.7);backdrop-filter:blur(4px);display:grid;place-items:center;animation:fadeIn .2s ease-out}.loading-content{display:flex;flex-direction:column;align-items:center;gap:var(--uxdsl__space__4);color:#fff}.loading-spinner{animation:spin 1s linear infinite;color:var(--uxdsl__palette__primary-light)}.loading-text{font-size:1.25rem;font-weight:500;color:#fff;text-align:center}.loading-theme-name{font-family:monospace;background:hsla(0,0%,100%,.1);padding:var(--uxdsl__space__1) var(--uxdsl__space__2);border-radius:var(--uxdsl__radius__2);color:var(--uxdsl__palette__primary-light)}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}#AppHeader{width:100%;margin:0;padding:0;background:linear-gradient(135deg,var(--uxdsl__palette__primary-dark) 0,var(--uxdsl__palette__primary-main) 100%);background-color:var(--uxdsl__palette__primary-main);color:var(--uxdsl__palette__primary-contrast);position:relative;z-index:1000;box-shadow:var(--uxdsl__shadow__2);border-bottom:1px solid color-mix(in srgb,var(--uxdsl__palette__primary-light) 30%,transparent)}#AppHeader .app-header__container{max-width:1400px;margin:0 auto;padding:var(--uxdsl__density__2) var(--uxdsl__space__2);display:flex;flex-direction:row;justify-content:space-between;align-items:center;width:100%}@media (min-width:768px){#AppHeader .app-header__container{padding:var(--uxdsl__density__2) var(--uxdsl__space__4)}}#AppHeader .app-header__inner{padding:var(--uxdsl__surface__contained-padding);border-radius:var(--uxdsl__surface__contained-radius);background:var(--uxdsl__palette__light-main);color:var(--uxdsl__palette__light-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);display:flex;flex-direction:row;align-items:flex-end;gap:8px;background:color-mix(in srgb,var(--uxdsl__palette__surface-light) 90%,transparent);text-decoration:none;cursor:pointer;color:inherit;transition:transform .2s;&:hover{transform:translateY(-1px)}}#AppHeader .app-header__logo-img{display:block;width:40px;height:40px}@media (min-width:480px){#AppHeader .app-header__logo-img{width:50px;height:50px}}@media (min-width:768px){#AppHeader .app-header__logo-img{width:60px;height:60px}}#AppHeader .app-header__title-text{font-family:var(--uxdsl__typography__h6-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__h6-size);line-height:var(--uxdsl__typography__h6-line,1.4);font-weight:var(--uxdsl__typography__h6-weight,600);letter-spacing:var(--uxdsl__typography__h6-spacing,normal);text-transform:var(--uxdsl__typography__h6-transform,none);text-decoration:var(--uxdsl__typography__h6-decoration,none);font-style:var(--uxdsl__typography__h6-style,normal);margin-block-start:var(--uxdsl__typography__h6-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h6-margin-block-end,auto);color:var(--uxdsl__palette__primary-dark);font-weight:800;line-height:1;letter-spacing:-.5px;white-space:nowrap;margin-bottom:var(--uxdsl__space__1)}#AppHeader .app-header__subtitle-text{font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);opacity:.8;font-weight:500;font-size:.5rem;line-height:1.1;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}#AppHeader .app-header__actions,#AppHeader .app-header__settings{display:flex;align-items:center;gap:var(--uxdsl__density__2)}#AppHeader .theme-color-btn{width:32px;height:32px;border-radius:50%;border:3px solid var(--theme-color);background:hsla(0,0%,100%,.1);cursor:pointer;transition:all .2s ease;padding:0;box-sizing:border-box}#AppHeader .theme-color-btn:hover{transform:scale(1.1);background:hsla(0,0%,100%,.2)}#AppHeader .theme-color-btn.is-active{box-shadow:0 0 0 2px hsla(0,0%,100%,.8);background:hsla(0,0%,100%,.15)}#AppHeader .divider-vertical{width:1px;height:20px;background-color:hsla(0,0%,100%,.2);margin:0 var(--uxdsl__density__1)}#AppHeader .theme-toggle{width:32px;height:32px;border-radius:50%;background:hsla(0,0%,100%,.1);border:1px solid hsla(0,0%,100%,.3);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;padding:0;box-sizing:border-box}#AppHeader .theme-toggle:hover{background:hsla(0,0%,100%,.2);transform:scale(1.05)}.editor-content{padding:var(--uxdsl__density__6);display:grid;gap:var(--uxdsl__density__4);max-height:60vh;overflow-y:auto}.font-selector{display:flex;flex-direction:column;gap:var(--uxdsl__density__2)}#ButtonDemo{.btn{padding:var(--uxdsl__surface__contained-padding);border-radius:var(--uxdsl__surface__contained-radius);background:var(--uxdsl__surface__contained-bg);color:var(--uxdsl__surface__contained-color);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);font-family:var(--uxdsl__typography__body-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-size);line-height:var(--uxdsl__typography__body-line,1.6);font-weight:var(--uxdsl__typography__body-weight,400);letter-spacing:var(--uxdsl__typography__body-spacing,normal);text-transform:var(--uxdsl__typography__body-transform,none);text-decoration:var(--uxdsl__typography__body-decoration,none);font-style:var(--uxdsl__typography__body-style,normal);margin-block-start:var(--uxdsl__typography__body-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-margin-block-end,auto);cursor:pointer;transition:all .2s ease}.btn:hover{background:var(--uxdsl__button__contained-hover-bg);color:var(--uxdsl__button__contained-hover-color)}.btn.is-selected,.btn[aria-pressed=true],.btn[aria-selected=true]{background:var(--uxdsl__button__contained-selected-bg);color:var(--uxdsl__button__contained-selected-color)}.btn:hover{transform:translateY(-1px)}.btn--outlined{padding:var(--uxdsl__surface__outlined-padding);border-radius:var(--uxdsl__surface__outlined-radius);background:transparent;color:var(--uxdsl__palette__primary-main);border:1px solid var(--uxdsl__palette__primary-main);box-shadow:var(--uxdsl__surface__outlined-shadow);--uxdsl__button__tone-main:var(--uxdsl__palette__primary-main);--uxdsl__button__tone-dark:var(--uxdsl__palette__primary-dark);--uxdsl__button__tone-contrast:var(--uxdsl__palette__primary-contrast)}.btn--outlined:hover{color:var(--uxdsl__button__outlined-tone-primary-hover-color,var(--uxdsl__button__outlined-hover-color));border:var(--uxdsl__button__outlined-tone-primary-hover-border,var(--uxdsl__button__outlined-hover-border))}.btn--outlined.is-selected,.btn--outlined[aria-pressed=true],.btn--outlined[aria-selected=true]{background:var(--uxdsl__button__outlined-tone-primary-selected-bg,var(--uxdsl__button__outlined-selected-bg));color:var(--uxdsl__button__outlined-tone-primary-selected-color,var(--uxdsl__button__outlined-selected-color));border:var(--uxdsl__button__outlined-tone-primary-selected-border,var(--uxdsl__button__outlined-selected-border))}.btn--flat{padding:var(--uxdsl__surface__flat-padding);border-radius:var(--uxdsl__surface__flat-radius);background:transparent;color:var(--uxdsl__palette__primary-main);border:var(--uxdsl__surface__flat-border);box-shadow:var(--uxdsl__surface__flat-shadow);--uxdsl__button__tone-main:var(--uxdsl__palette__primary-main);--uxdsl__button__tone-dark:var(--uxdsl__palette__primary-dark);--uxdsl__button__tone-contrast:var(--uxdsl__palette__primary-contrast)}.btn--flat:hover{color:var(--uxdsl__button__flat-tone-primary-hover-color,var(--uxdsl__button__flat-hover-color))}.btn--flat.is-selected,.btn--flat[aria-pressed=true],.btn--flat[aria-selected=true]{color:var(--uxdsl__button__flat-tone-primary-selected-color,var(--uxdsl__button__flat-selected-color))}.btn--secondary{padding:var(--uxdsl__surface__contained-padding);border-radius:var(--uxdsl__surface__contained-radius);background:var(--uxdsl__palette__secondary-main);color:var(--uxdsl__palette__secondary-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);--uxdsl__button__tone-main:var(--uxdsl__palette__secondary-main);--uxdsl__button__tone-dark:var(--uxdsl__palette__secondary-dark);--uxdsl__button__tone-contrast:var(--uxdsl__palette__secondary-contrast)}.btn--secondary:hover{background:var(--uxdsl__button__contained-tone-secondary-hover-bg,var(--uxdsl__button__contained-hover-bg));color:var(--uxdsl__button__contained-tone-secondary-hover-color,var(--uxdsl__button__contained-hover-color))}.btn--secondary.is-selected,.btn--secondary[aria-pressed=true],.btn--secondary[aria-selected=true]{background:var(--uxdsl__button__contained-tone-secondary-selected-bg,var(--uxdsl__button__contained-selected-bg));color:var(--uxdsl__button__contained-tone-secondary-selected-color,var(--uxdsl__button__contained-selected-color))}.btn--outlined.btn--secondary{padding:var(--uxdsl__surface__outlined-padding);border-radius:var(--uxdsl__surface__outlined-radius);background:transparent;color:var(--uxdsl__palette__secondary-main);border:1px solid var(--uxdsl__palette__secondary-main);box-shadow:var(--uxdsl__surface__outlined-shadow);--uxdsl__button__tone-main:var(--uxdsl__palette__secondary-main);--uxdsl__button__tone-dark:var(--uxdsl__palette__secondary-dark);--uxdsl__button__tone-contrast:var(--uxdsl__palette__secondary-contrast)}.btn--outlined.btn--secondary:hover{color:var(--uxdsl__button__outlined-tone-secondary-hover-color,var(--uxdsl__button__outlined-hover-color));border:var(--uxdsl__button__outlined-tone-secondary-hover-border,var(--uxdsl__button__outlined-hover-border))}.btn--outlined.btn--secondary.is-selected,.btn--outlined.btn--secondary[aria-pressed=true],.btn--outlined.btn--secondary[aria-selected=true]{background:var(--uxdsl__button__outlined-tone-secondary-selected-bg,var(--uxdsl__button__outlined-selected-bg));color:var(--uxdsl__button__outlined-tone-secondary-selected-color,var(--uxdsl__button__outlined-selected-color));border:var(--uxdsl__button__outlined-tone-secondary-selected-border,var(--uxdsl__button__outlined-selected-border))}.btn--flat.btn--secondary{padding:var(--uxdsl__surface__flat-padding);border-radius:var(--uxdsl__surface__flat-radius);background:transparent;color:var(--uxdsl__palette__secondary-main);border:var(--uxdsl__surface__flat-border);box-shadow:var(--uxdsl__surface__flat-shadow);--uxdsl__button__tone-main:var(--uxdsl__palette__secondary-main);--uxdsl__button__tone-dark:var(--uxdsl__palette__secondary-dark);--uxdsl__button__tone-contrast:var(--uxdsl__palette__secondary-contrast)}.btn--flat.btn--secondary:hover{color:var(--uxdsl__button__flat-tone-secondary-hover-color,var(--uxdsl__button__flat-hover-color))}.btn--flat.btn--secondary.is-selected,.btn--flat.btn--secondary[aria-pressed=true],.btn--flat.btn--secondary[aria-selected=true]{color:var(--uxdsl__button__flat-tone-secondary-selected-color,var(--uxdsl__button__flat-selected-color))}.btn--sm{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);background:var(--uxdsl__palette__primary-main);color:var(--uxdsl__palette__primary-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);--uxdsl__button__tone-main:var(--uxdsl__palette__primary-main);--uxdsl__button__tone-dark:var(--uxdsl__palette__primary-dark);--uxdsl__button__tone-contrast:var(--uxdsl__palette__primary-contrast)}.btn--sm:hover{background:var(--uxdsl__button__contained-tone-primary-hover-bg,var(--uxdsl__button__contained-hover-bg));color:var(--uxdsl__button__contained-tone-primary-hover-color,var(--uxdsl__button__contained-hover-color))}.btn--sm.is-selected,.btn--sm[aria-pressed=true],.btn--sm[aria-selected=true]{background:var(--uxdsl__button__contained-tone-primary-selected-bg,var(--uxdsl__button__contained-selected-bg));color:var(--uxdsl__button__contained-tone-primary-selected-color,var(--uxdsl__button__contained-selected-color))}.btn--md{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);background:var(--uxdsl__palette__primary-main);color:var(--uxdsl__palette__primary-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);--uxdsl__button__tone-main:var(--uxdsl__palette__primary-main);--uxdsl__button__tone-dark:var(--uxdsl__palette__primary-dark);--uxdsl__button__tone-contrast:var(--uxdsl__palette__primary-contrast)}.btn--md:hover{background:var(--uxdsl__button__contained-tone-primary-hover-bg,var(--uxdsl__button__contained-hover-bg));color:var(--uxdsl__button__contained-tone-primary-hover-color,var(--uxdsl__button__contained-hover-color))}.btn--md.is-selected,.btn--md[aria-pressed=true],.btn--md[aria-selected=true]{background:var(--uxdsl__button__contained-tone-primary-selected-bg,var(--uxdsl__button__contained-selected-bg));color:var(--uxdsl__button__contained-tone-primary-selected-color,var(--uxdsl__button__contained-selected-color))}.btn--lg{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);background:var(--uxdsl__palette__primary-main);color:var(--uxdsl__palette__primary-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);--uxdsl__button__tone-main:var(--uxdsl__palette__primary-main);--uxdsl__button__tone-dark:var(--uxdsl__palette__primary-dark);--uxdsl__button__tone-contrast:var(--uxdsl__palette__primary-contrast)}.btn--lg:hover{background:var(--uxdsl__button__contained-tone-primary-hover-bg,var(--uxdsl__button__contained-hover-bg));color:var(--uxdsl__button__contained-tone-primary-hover-color,var(--uxdsl__button__contained-hover-color))}.btn--lg.is-selected,.btn--lg[aria-pressed=true],.btn--lg[aria-selected=true]{background:var(--uxdsl__button__contained-tone-primary-selected-bg,var(--uxdsl__button__contained-selected-bg));color:var(--uxdsl__button__contained-tone-primary-selected-color,var(--uxdsl__button__contained-selected-color))}}#CardDemo{.card{border-radius:var(--uxdsl__surface__contained-radius);background:var(--uxdsl__surface__contained-bg);color:var(--uxdsl__surface__contained-color);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);padding:var(--uxdsl__space__4);border-radius:var(--uxdsl__radius__2);transition:all .3s ease}.card:hover{transform:translateY(-2px);box-shadow:var(--uxdsl__shadow__3)}.card__title{font-family:var(--uxdsl__typography__h3-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h3-size);line-height:var(--uxdsl__typography__h3-line,1.3);font-weight:var(--uxdsl__typography__h3-weight,600);letter-spacing:var(--uxdsl__typography__h3-spacing,normal);text-transform:var(--uxdsl__typography__h3-transform,none);text-decoration:var(--uxdsl__typography__h3-decoration,none);font-style:var(--uxdsl__typography__h3-style,normal);margin-block-start:var(--uxdsl__typography__h3-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h3-margin-block-end,auto);margin:0 0 var(--uxdsl__space__2) 0}.card__content{font-family:var(--uxdsl__typography__body-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-size);line-height:var(--uxdsl__typography__body-line,1.6);font-weight:var(--uxdsl__typography__body-weight,400);letter-spacing:var(--uxdsl__typography__body-spacing,normal);text-transform:var(--uxdsl__typography__body-transform,none);text-decoration:var(--uxdsl__typography__body-decoration,none);font-style:var(--uxdsl__typography__body-style,normal);margin-block-start:var(--uxdsl__typography__body-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-margin-block-end,auto);margin:0;color:color-mix(in srgb,var(--uxdsl__palette__surface-contrast) 80%,transparent)}}#DemoBorders{.demo-borders{gap:var(--uxdsl__space__8);padding:var(--uxdsl__space__4)}.demo-borders,.section{display:flex;flex-direction:column}.section{gap:var(--uxdsl__space__4)}.section-title{font:font(h4);color:var(--uxdsl__palette__text-main);margin-bottom:var(--uxdsl__space__2)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--uxdsl__space__4)}.card{flex-direction:column;gap:var(--uxdsl__space__2);padding:var(--uxdsl__space__4);border:var(--uxdsl__border__1);border-radius:var(--uxdsl__radius__2)}.card,.preview-box{display:flex;background:var(--uxdsl__palette__surface-main)}.preview-box{width:100%;height:100px;align-items:center;justify-content:center}.label,.preview-box{color:var(--uxdsl__palette__text-secondary);font:font(body-sm)}.label{font-family:monospace}.playground{display:flex;flex-direction:column;background:var(--uxdsl__palette__surface-main);padding:var(--uxdsl__space__6);border-radius:var(--uxdsl__radius__3);border:var(--uxdsl__border__1)}@media (min-width:768px){.playground{display:grid;grid-template-columns:300px 1fr}}.controls{gap:var(--uxdsl__space__4);padding:var(--uxdsl__density__2)}.control-group,.controls{display:flex;flex-direction:column}.control-group{gap:var(--uxdsl__space__2)}.control-label{font:font(label);color:var(--uxdsl__palette__text-secondary)}.select{box-sizing:border-box;font:inherit;width:100%;border-radius:var(--uxdsl__surface__outlined-radius);background:transparent;color:var(--uxdsl__palette__neutral-main);border:1px solid var(--uxdsl__palette__neutral-main);box-shadow:var(--uxdsl__surface__outlined-shadow);caret-color:var(--uxdsl__input__outlined-tone-neutral-base-caret,var(--uxdsl__input__outlined-base-caret));--uxdsl__input__tone-main:var(--uxdsl__palette__neutral-main);--uxdsl__input__tone-dark:var(--uxdsl__palette__neutral-dark);--uxdsl__input__tone-contrast:var(--uxdsl__palette__neutral-contrast);padding:var(--uxdsl__space__2)}.select::placeholder{color:var(--uxdsl__input__outlined-tone-neutral-base-placeholder,var(--uxdsl__input__outlined-base-placeholder))}.select:focus{border:var(--uxdsl__input__outlined-tone-neutral-focus-border,var(--uxdsl__input__outlined-focus-border))}.select:invalid,.select[aria-invalid=true]{border:var(--uxdsl__input__outlined-tone-neutral-invalid-border,var(--uxdsl__input__outlined-invalid-border))}.select:disabled,.select[aria-disabled=true]{opacity:var(--uxdsl__input__outlined-tone-neutral-disabled-opacity,var(--uxdsl__input__outlined-disabled-opacity))}.preview-area{display:flex;flex-direction:column;gap:var(--uxdsl__space__4);min-width:0;padding:var(--uxdsl__density__2)}.live-preview{flex:1;border-radius:var(--uxdsl__radius__2);border:var(--uxdsl__border__1);min-height:300px;padding:var(--uxdsl__space__8)}.demo-element,.live-preview{display:flex;align-items:center;justify-content:center}.demo-element{width:200px;height:200px;max-width:100%;background:var(--uxdsl__palette__surface-main);color:var(--uxdsl__palette__text-main);font:font(h5);transition:all .2s ease}.demo-code-block{border-radius:var(--uxdsl__radius__2);overflow:hidden;font-size:14px;border:var(--uxdsl__border__1)}}#DemoBreakpoints{.breakpoints-section{display:flex;flex-direction:column;gap:var(--uxdsl__density__4)}.breakpoints-playground-wrapper{display:flex;flex-direction:column;gap:var(--uxdsl__density__2)}.breakpoints-playground-container{border-radius:var(--uxdsl__surface__outlined-radius);background:var(--uxdsl__surface__outlined-bg);color:var(--uxdsl__surface__outlined-color);border:var(--uxdsl__surface__outlined-border);box-shadow:var(--uxdsl__surface__outlined-shadow);padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__3);display:flex;flex-direction:column;gap:var(--uxdsl__density__6);background:var(--uxdsl__palette__surface-light)}.breakpoints-viz-container{display:flex;flex-direction:column;gap:var(--uxdsl__density__2)}.breakpoints-bar-wrapper{width:100%;overflow-x:auto;padding-bottom:var(--uxdsl__density__2)}.breakpoints-bar{display:flex;height:60px;width:100%;min-width:600px;border-radius:var(--uxdsl__radius__2);overflow:hidden;box-shadow:var(--uxdsl__shadow__1)}.breakpoints-segment{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:.85rem;font-weight:700;transition:all .3s ease;position:relative;padding:0 var(--uxdsl__density__1);overflow:hidden;white-space:nowrap}.breakpoints-segment.is-active{box-shadow:inset 0 0 0 2px var(--uxdsl__palette__surface-main);z-index:1}.breakpoints-segment-label{text-transform:uppercase;font-size:.75rem;letter-spacing:.05em}.breakpoints-segment-val{font-size:.7rem;opacity:.9;font-family:font(code);margin-top:2px}.breakpoints-segment--xs{background:var(--uxdsl__palette__tertiary-light);color:var(--uxdsl__palette__tertiary-dark)}.breakpoints-segment--sm{background:var(--uxdsl__palette__secondary-light);color:var(--uxdsl__palette__secondary-dark)}.breakpoints-segment--md{background:var(--uxdsl__palette__primary-light);color:var(--uxdsl__palette__primary-dark)}.breakpoints-segment--lg{background:var(--uxdsl__palette__info-light);color:var(--uxdsl__palette__info-dark)}.breakpoints-segment--xl{background:var(--uxdsl__palette__error-light);color:var(--uxdsl__palette__error-dark)}.breakpoints-grid{display:grid;grid-template-columns:1fr;gap:var(--uxdsl__density__6)}@media (min-width:768px){.breakpoints-grid{grid-template-columns:2fr 1fr;align-items:start}}.breakpoints-controls{display:flex;flex-direction:column;gap:var(--uxdsl__density__3)}.breakpoints-subtitle{font-size:1rem;font-weight:600;color:var(--uxdsl__palette__text-secondary);margin-bottom:var(--uxdsl__density__1);text-transform:uppercase;letter-spacing:.05em}.breakpoints-control-row{display:flex;align-items:center;gap:var(--uxdsl__density__3);padding:var(--uxdsl__density__2);background:var(--uxdsl__palette__surface-main);border-radius:var(--uxdsl__radius__2);border:1px solid var(--uxdsl__palette__neutral-light);transition:border-color .2s}.breakpoints-control-row:hover{border-color:var(--uxdsl__palette__primary-light)}.breakpoints-control-label{width:30px;font-weight:700;text-transform:uppercase;font-size:.85rem;color:var(--uxdsl__palette__text-secondary)}.breakpoints-slider{flex:1;cursor:pointer;margin:0 var(--uxdsl__density__2)}.breakpoints-input-wrapper{display:flex;align-items:center;gap:var(--uxdsl__density__1)}.breakpoints-input-val{width:80px;padding:4px 8px;border:1px solid var(--uxdsl__palette__neutral-light);border-radius:var(--uxdsl__radius__1);font-family:font(code);text-align:right;font-size:.9rem;color:var(--uxdsl__palette__text-main);background:transparent}.breakpoints-unit{font-size:.8rem;color:var(--uxdsl__palette__text-secondary)}.breakpoints-info-panel{gap:var(--uxdsl__density__3);padding:var(--uxdsl__density__4);background:var(--uxdsl__palette__surface-main);height:100%}.breakpoints-info-card,.breakpoints-info-panel{display:flex;flex-direction:column;border-radius:var(--uxdsl__radius__2);border:1px solid var(--uxdsl__palette__neutral-light)}.breakpoints-info-card{align-items:center;justify-content:center;padding:var(--uxdsl__density__3);background:var(--uxdsl__palette__surface-light);text-align:center}.breakpoints-info-card.is-compact{flex-direction:row;gap:var(--uxdsl__density__3);padding:var(--uxdsl__density__2) var(--uxdsl__density__3)}.breakpoints-icon{color:var(--uxdsl__palette__text-secondary)}.breakpoints-info-content{display:flex;flex-direction:column;align-items:flex-start}.breakpoints-info-card.is-highlighted{background:var(--uxdsl__palette__primary-light);border-color:var(--uxdsl__palette__primary-main);color:var(--uxdsl__palette__primary-contrast)}.breakpoints-info-card.is-highlighted .breakpoints-info-label{color:var(--uxdsl__palette__primary-contrast);opacity:.9}.breakpoints-info-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--uxdsl__palette__text-secondary);margin-bottom:2px}.breakpoints-info-value{font-family:font(code);font-size:1.1rem;font-weight:700}.breakpoints-info-value.is-large{font-size:2rem}.breakpoints-info-desc{font-size:.85rem;color:var(--uxdsl__palette__text-secondary);text-align:center;line-height:1.5;margin-top:auto}}#DemoBreakpointsCards{display:flex;flex-direction:column;gap:var(--uxdsl__space__2);padding:var(--uxdsl__surface__contained-padding);border-radius:var(--uxdsl__surface__contained-radius);background:var(--uxdsl__palette__light-main);color:var(--uxdsl__palette__light-contrast);box-shadow:var(--uxdsl__surface__contained-shadow);border:1px solid var(--uxdsl__palette__surface-contrast);border-radius:var(--uxdsl__radius__3);.demo-breakpoints-card-item{border-radius:var(--uxdsl__surface__contained-radius);background:var(--uxdsl__surface__contained-bg);color:var(--uxdsl__surface__contained-color);box-shadow:var(--uxdsl__surface__contained-shadow);flex:1;padding:var(--uxdsl__space__6);display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--uxdsl__space__3);border:1px solid var(--uxdsl__palette__surface-dark);border-radius:var(--uxdsl__radius__2);box-shadow:var(--uxdsl__shadow__1)}.demo-breakpoints-card-title{font-weight:600;color:var(--uxdsl__palette__surface-contrast)}.demo-breakpoints-card-text{font-size:.875rem;color:var(--uxdsl__palette__tertiary-dark)}.demo-breakpoints-card-icon--primary{color:var(--uxdsl__palette__primary-main)}.demo-breakpoints-card-icon--secondary{color:var(--uxdsl__palette__secondary-main)}.demo-breakpoints-card-icon--info{color:var(--uxdsl__palette__info-main)}}@media (min-width:768px){#DemoBreakpointsCards{flex-direction:row;gap:var(--uxdsl__space__4);padding:var(--uxdsl__space__6)}}#DemoButtons{background:transparent;.section,.surfaces-grid{margin-block:var(--uxdsl__density__3)}.surfaces-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--uxdsl__density__3)}pre{overflow-x:auto}label{margin-inline-end:var(--uxdsl__density__2)}}#DemoColors{.demo-section{gap:var(--uxdsl__density__3)}.demo-header,.demo-section{display:flex;flex-direction:column}.demo-header{gap:var(--uxdsl__density__2)}.demo-title{font-family:var(--uxdsl__typography__h4-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h4-size);line-height:var(--uxdsl__typography__h4-line,1.4);font-weight:var(--uxdsl__typography__h4-weight,600);letter-spacing:var(--uxdsl__typography__h4-spacing,normal);text-transform:var(--uxdsl__typography__h4-transform,none);text-decoration:var(--uxdsl__typography__h4-decoration,none);font-style:var(--uxdsl__typography__h4-style,normal);margin-block-start:var(--uxdsl__typography__h4-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h4-margin-block-end,auto);margin:0}.demo-subtitle{font-family:var(--uxdsl__typography__body-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-size);line-height:var(--uxdsl__typography__body-line,1.6);font-weight:var(--uxdsl__typography__body-weight,400);letter-spacing:var(--uxdsl__typography__body-spacing,normal);text-transform:var(--uxdsl__typography__body-transform,none);text-decoration:var(--uxdsl__typography__body-decoration,none);font-style:var(--uxdsl__typography__body-style,normal);margin-block-start:var(--uxdsl__typography__body-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-margin-block-end,auto);max-width:720px}.colors-stack{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--uxdsl__density__4)}.color-family{display:flex;flex-direction:column;gap:var(--uxdsl__density__2)}.family-title{font-family:var(--uxdsl__typography__h5-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__h5-size);line-height:var(--uxdsl__typography__h5-line,1.4);font-weight:var(--uxdsl__typography__h5-weight,600);letter-spacing:var(--uxdsl__typography__h5-spacing,normal);text-transform:var(--uxdsl__typography__h5-transform,none);text-decoration:var(--uxdsl__typography__h5-decoration,none);font-style:var(--uxdsl__typography__h5-style,normal);margin-block-start:var(--uxdsl__typography__h5-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h5-margin-block-end,auto);margin:0;text-transform:capitalize}.family-grid{list-style:none;padding:0;margin:0;gap:var(--uxdsl__density__1)}.color-token,.family-grid{display:flex;flex-direction:column}.color-token{border-radius:var(--uxdsl__radius__1);padding:var(--uxdsl__density__1);background:color-mix(in srgb,var(--uxdsl__palette__surface-main) 20%,transparent);justify-content:center;align-items:center;position:relative;height:var(--uxdsl__density__8);min-width:0;transition:transform .2s ease,box-shadow .2s ease}.color-token:hover{transform:scale(1.05);z-index:1;box-shadow:var(--uxdsl__shadow__2)}.token-shade{font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);font-weight:700;opacity:.9;pointer-events:none}.token-values{display:flex;flex-direction:column;align-items:flex-end;gap:2px;position:absolute;bottom:var(--uxdsl__density__1);right:var(--uxdsl__density__1);pointer-events:none}.token-hex{font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);font-family:monospace;font-weight:700;font-size:.75em}.token-rgb{font-family:var(--uxdsl__typography__tag-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__tag-size);line-height:var(--uxdsl__typography__tag-line,1.5);font-weight:var(--uxdsl__typography__tag-weight,400);letter-spacing:var(--uxdsl__typography__tag-spacing,normal);text-transform:var(--uxdsl__typography__tag-transform,none);text-decoration:var(--uxdsl__typography__tag-decoration,none);font-style:var(--uxdsl__typography__tag-style,normal);margin-block-start:var(--uxdsl__typography__tag-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__tag-margin-block-end,auto);font-family:monospace;opacity:.7;font-size:.65em}.surfaces-playground-container{display:flex;flex-direction:column;gap:var(--uxdsl__density__2)}.surface-playground{display:flex;flex-direction:column;gap:var(--uxdsl__density__3);border-radius:var(--uxdsl__surface__outlined-radius);background:var(--uxdsl__surface__outlined-bg);color:var(--uxdsl__surface__outlined-color);border:var(--uxdsl__surface__outlined-border);box-shadow:var(--uxdsl__surface__outlined-shadow);padding:var(--uxdsl__density__3);background:color-mix(in srgb,var(--uxdsl__palette__surface-light) 30%,transparent)}@media (min-width:768px){.surface-playground{flex-direction:row;align-items:flex-start}}.surface-playground__controls{display:flex;flex-direction:column;gap:var(--uxdsl__density__2);min-width:250px}.surface-playground__controls label{display:flex;flex-direction:column;gap:var(--uxdsl__density__1);font-size:.9rem;font-weight:500}.surface-playground__controls select{box-sizing:border-box;font:inherit;width:100%;border-radius:var(--uxdsl__surface__outlined-radius);background:transparent;color:var(--uxdsl__palette__neutral-main);border:1px solid var(--uxdsl__palette__neutral-main);box-shadow:var(--uxdsl__surface__outlined-shadow);caret-color:var(--uxdsl__input__outlined-tone-neutral-base-caret,var(--uxdsl__input__outlined-base-caret));--uxdsl__input__tone-main:var(--uxdsl__palette__neutral-main);--uxdsl__input__tone-dark:var(--uxdsl__palette__neutral-dark);--uxdsl__input__tone-contrast:var(--uxdsl__palette__neutral-contrast);padding:var(--uxdsl__density__1)}.surface-playground__controls select::placeholder{color:var(--uxdsl__input__outlined-tone-neutral-base-placeholder,var(--uxdsl__input__outlined-base-placeholder))}.surface-playground__controls select:focus{border:var(--uxdsl__input__outlined-tone-neutral-focus-border,var(--uxdsl__input__outlined-focus-border))}.surface-playground__controls select:invalid,.surface-playground__controls select[aria-invalid=true]{border:var(--uxdsl__input__outlined-tone-neutral-invalid-border,var(--uxdsl__input__outlined-invalid-border))}.surface-playground__controls select:disabled,.surface-playground__controls select[aria-disabled=true]{opacity:var(--uxdsl__input__outlined-tone-neutral-disabled-opacity,var(--uxdsl__input__outlined-disabled-opacity))}.surface-playground__preview{flex:1;display:flex;flex-direction:column;gap:var(--uxdsl__density__2)}.demo-code-block{padding:var(--uxdsl__surface__outlined-padding);border-radius:var(--uxdsl__surface__outlined-radius);background:var(--uxdsl__surface__outlined-bg);color:var(--uxdsl__surface__outlined-color);border:var(--uxdsl__surface__outlined-border);box-shadow:var(--uxdsl__surface__outlined-shadow);border-radius:var(--uxdsl__radius__2);overflow:hidden}.code-header{display:flex;justify-content:space-between;align-items:center;padding:var(--uxdsl__density__1) var(--uxdsl__density__2);background:var(--uxdsl__palette__neutral-dark);color:var(--uxdsl__palette__neutral-contrast)}.code-file{font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);opacity:.8}.chip--blue-50{background:var(--uxdsl__color__blue-50)}.chip--blue-100{background:var(--uxdsl__color__blue-100)}.chip--blue-200{background:var(--uxdsl__color__blue-200)}.chip--blue-300{background:var(--uxdsl__color__blue-300)}.chip--blue-400{background:var(--uxdsl__color__blue-400)}.chip--blue-500{background:var(--uxdsl__color__blue-500)}.chip--blue-600{background:var(--uxdsl__color__blue-600)}.chip--blue-700{background:var(--uxdsl__color__blue-700)}.chip--blue-800{background:var(--uxdsl__color__blue-800)}.chip--blue-900{background:var(--uxdsl__color__blue-900)}.chip--indigo-50{background:var(--uxdsl__color__indigo-50)}.chip--indigo-100{background:var(--uxdsl__color__indigo-100)}.chip--indigo-200{background:var(--uxdsl__color__indigo-200)}.chip--indigo-300{background:var(--uxdsl__color__indigo-300)}.chip--indigo-400{background:var(--uxdsl__color__indigo-400)}.chip--indigo-500{background:var(--uxdsl__color__indigo-500)}.chip--indigo-600{background:var(--uxdsl__color__indigo-600)}.chip--indigo-700{background:var(--uxdsl__color__indigo-700)}.chip--indigo-800{background:var(--uxdsl__color__indigo-800)}.chip--indigo-900{background:var(--uxdsl__color__indigo-900)}.chip--purple-50{background:var(--uxdsl__color__purple-50)}.chip--purple-100{background:var(--uxdsl__color__purple-100)}.chip--purple-200{background:var(--uxdsl__color__purple-200)}.chip--purple-300{background:var(--uxdsl__color__purple-300)}.chip--purple-400{background:var(--uxdsl__color__purple-400)}.chip--purple-500{background:var(--uxdsl__color__purple-500)}.chip--purple-600{background:var(--uxdsl__color__purple-600)}.chip--purple-700{background:var(--uxdsl__color__purple-700)}.chip--purple-800{background:var(--uxdsl__color__purple-800)}.chip--purple-900{background:var(--uxdsl__color__purple-900)}.chip--pink-50{background:var(--uxdsl__color__pink-50)}.chip--pink-100{background:var(--uxdsl__color__pink-100)}.chip--pink-200{background:var(--uxdsl__color__pink-200)}.chip--pink-300{background:var(--uxdsl__color__pink-300)}.chip--pink-400{background:var(--uxdsl__color__pink-400)}.chip--pink-500{background:var(--uxdsl__color__pink-500)}.chip--pink-600{background:var(--uxdsl__color__pink-600)}.chip--pink-700{background:var(--uxdsl__color__pink-700)}.chip--pink-800{background:var(--uxdsl__color__pink-800)}.chip--pink-900{background:var(--uxdsl__color__pink-900)}.chip--red-50{background:var(--uxdsl__color__red-50)}.chip--red-100{background:var(--uxdsl__color__red-100)}.chip--red-200{background:var(--uxdsl__color__red-200)}.chip--red-300{background:var(--uxdsl__color__red-300)}.chip--red-400{background:var(--uxdsl__color__red-400)}.chip--red-500{background:var(--uxdsl__color__red-500)}.chip--red-600{background:var(--uxdsl__color__red-600)}.chip--red-700{background:var(--uxdsl__color__red-700)}.chip--red-800{background:var(--uxdsl__color__red-800)}.chip--red-900{background:var(--uxdsl__color__red-900)}.chip--orange-50{background:var(--uxdsl__color__orange-50)}.chip--orange-100{background:var(--uxdsl__color__orange-100)}.chip--orange-200{background:var(--uxdsl__color__orange-200)}.chip--orange-300{background:var(--uxdsl__color__orange-300)}.chip--orange-400{background:var(--uxdsl__color__orange-400)}.chip--orange-500{background:var(--uxdsl__color__orange-500)}.chip--orange-600{background:var(--uxdsl__color__orange-600)}.chip--orange-700{background:var(--uxdsl__color__orange-700)}.chip--orange-800{background:var(--uxdsl__color__orange-800)}.chip--orange-900{background:var(--uxdsl__color__orange-900)}.chip--yellow-50{background:var(--uxdsl__color__yellow-50)}.chip--yellow-100{background:var(--uxdsl__color__yellow-100)}.chip--yellow-200{background:var(--uxdsl__color__yellow-200)}.chip--yellow-300{background:var(--uxdsl__color__yellow-300)}.chip--yellow-400{background:var(--uxdsl__color__yellow-400)}.chip--yellow-500{background:var(--uxdsl__color__yellow-500)}.chip--yellow-600{background:var(--uxdsl__color__yellow-600)}.chip--yellow-700{background:var(--uxdsl__color__yellow-700)}.chip--yellow-800{background:var(--uxdsl__color__yellow-800)}.chip--yellow-900{background:var(--uxdsl__color__yellow-900)}.chip--green-50{background:var(--uxdsl__color__green-50)}.chip--green-100{background:var(--uxdsl__color__green-100)}.chip--green-200{background:var(--uxdsl__color__green-200)}.chip--green-300{background:var(--uxdsl__color__green-300)}.chip--green-400{background:var(--uxdsl__color__green-400)}.chip--green-500{background:var(--uxdsl__color__green-500)}.chip--green-600{background:var(--uxdsl__color__green-600)}.chip--green-700{background:var(--uxdsl__color__green-700)}.chip--green-800{background:var(--uxdsl__color__green-800)}.chip--green-900{background:var(--uxdsl__color__green-900)}.chip--teal-50{background:var(--uxdsl__color__teal-50)}.chip--teal-100{background:var(--uxdsl__color__teal-100)}.chip--teal-200{background:var(--uxdsl__color__teal-200)}.chip--teal-300{background:var(--uxdsl__color__teal-300)}.chip--teal-400{background:var(--uxdsl__color__teal-400)}.chip--teal-500{background:var(--uxdsl__color__teal-500)}.chip--teal-600{background:var(--uxdsl__color__teal-600)}.chip--teal-700{background:var(--uxdsl__color__teal-700)}.chip--teal-800{background:var(--uxdsl__color__teal-800)}.chip--teal-900{background:var(--uxdsl__color__teal-900)}.chip--cyan-50{background:var(--uxdsl__color__cyan-50)}.chip--cyan-100{background:var(--uxdsl__color__cyan-100)}.chip--cyan-200{background:var(--uxdsl__color__cyan-200)}.chip--cyan-300{background:var(--uxdsl__color__cyan-300)}.chip--cyan-400{background:var(--uxdsl__color__cyan-400)}.chip--cyan-500{background:var(--uxdsl__color__cyan-500)}.chip--cyan-600{background:var(--uxdsl__color__cyan-600)}.chip--cyan-700{background:var(--uxdsl__color__cyan-700)}.chip--cyan-800{background:var(--uxdsl__color__cyan-800)}.chip--cyan-900{background:var(--uxdsl__color__cyan-900)}.chip--gray-50{background:var(--uxdsl__color__gray-50)}.chip--gray-100{background:var(--uxdsl__color__gray-100)}.chip--gray-200{background:var(--uxdsl__color__gray-200)}.chip--gray-300{background:var(--uxdsl__color__gray-300)}.chip--gray-400{background:var(--uxdsl__color__gray-400)}.chip--gray-500{background:var(--uxdsl__color__gray-500)}.chip--gray-600{background:var(--uxdsl__color__gray-600)}.chip--gray-700{background:var(--uxdsl__color__gray-700)}.chip--gray-800{background:var(--uxdsl__color__gray-800)}.chip--gray-900{background:var(--uxdsl__color__gray-900)}}#DemoDensity{.density-section{gap:var(--uxdsl__density__4)}.density-header,.density-section{display:flex;flex-direction:column}.density-header{gap:var(--uxdsl__density__2)}.density-code-snippet{background:var(--uxdsl__palette__surface-dark);color:var(--uxdsl__palette__surface-contrast);padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__1);font-family:monospace;font-size:.9rem;border-left:4px solid var(--uxdsl__palette__primary-main);margin-top:var(--uxdsl__density__1)}.density-doll-container{display:flex;flex-direction:column;gap:var(--uxdsl__density__2)}.density-doll-controls{display:flex;gap:var(--uxdsl__density__2);align-items:center;position:relative;z-index:10}.density-slider{width:200px}.density-doll-wrapper{height:auto;overflow-x:auto;overflow-y:hidden;padding:var(--uxdsl__density__4);background:var(--uxdsl__palette__surface-light);border-radius:var(--uxdsl__radius__2);border:1px solid var(--uxdsl__palette__neutral-light);z-index:0}.concentric-content,.concentric-wrapper,.density-doll-wrapper{display:flex;justify-content:center;align-items:center;position:relative}.concentric-content{z-index:100;background:var(--uxdsl__palette__surface-main);padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__1);min-width:80px;min-height:40px;box-shadow:var(--uxdsl__shadow__2);font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);font-weight:700;color:var(--uxdsl__palette__primary-dark);border:1px solid var(--uxdsl__palette__neutral-light)}.concentric-ring{position:absolute;border-radius:var(--uxdsl__radius__2);border:1px solid color-mix(in srgb,var(--uxdsl__palette__primary-main) 20%,transparent);background:color-mix(in srgb,var(--uxdsl__palette__primary-main) 3%,transparent);pointer-events:auto;transition:all .2s ease;display:flex;justify-content:center;align-items:flex-start;cursor:pointer}.concentric-ring.is-hovered,.concentric-ring:hover{border-color:var(--uxdsl__palette__secondary-main);background:color-mix(in srgb,var(--uxdsl__palette__secondary-main) 10%,transparent);box-shadow:0 0 0 1px var(--uxdsl__palette__secondary-main)}.ring-label{background:var(--uxdsl__palette__secondary-main);color:var(--uxdsl__palette__secondary-contrast);font-size:.6rem;padding:1px 4px;border-radius:0 0 4px 4px;opacity:0;transition:opacity .2s;margin-top:-1px}.concentric-ring.is-hovered .ring-label,.concentric-ring:hover .ring-label{opacity:1}.concentric-ring--uxdsl__density__1{inset:calc(var(--uxdsl__density__1) * -1);z-index:calc(20 - 1)}.concentric-ring--uxdsl__density__2{inset:calc(var(--uxdsl__density__2) * -1);z-index:calc(20 - 2)}.concentric-ring--uxdsl__density__3{inset:calc(var(--uxdsl__density__3) * -1);z-index:calc(20 - 3)}.concentric-ring--uxdsl__density__4{inset:calc(var(--uxdsl__density__4) * -1);z-index:calc(20 - 4)}.concentric-ring--uxdsl__density__5{inset:calc(var(--uxdsl__density__5) * -1);z-index:calc(20 - 5)}.concentric-ring--uxdsl__density__6{inset:calc(var(--uxdsl__density__6) * -1);z-index:calc(20 - 6)}.concentric-ring--uxdsl__density__7{inset:calc(var(--uxdsl__density__7) * -1);z-index:calc(20 - 7)}.concentric-ring--uxdsl__density__8{inset:calc(var(--uxdsl__density__8) * -1);z-index:calc(20 - 8)}.concentric-ring--uxdsl__density__9{inset:calc(var(--uxdsl__density__9) * -1);z-index:calc(20 - 9)}.concentric-ring--uxdsl__density__10{inset:calc(var(--uxdsl__density__10) * -1);z-index:calc(20 - 10)}.concentric-ring--uxdsl__density__11{inset:calc(var(--uxdsl__density__11) * -1);z-index:calc(20 - 11)}.concentric-ring--uxdsl__density__12{inset:calc(var(--uxdsl__density__12) * -1);z-index:calc(20 - 12)}.concentric-ring--uxdsl__density__13{inset:calc(var(--uxdsl__density__13) * -1);z-index:calc(20 - 13)}.concentric-ring--uxdsl__density__14{inset:calc(var(--uxdsl__density__14) * -1);z-index:calc(20 - 14)}.concentric-ring--uxdsl__density__15{inset:calc(var(--uxdsl__density__15) * -1);z-index:calc(20 - 15)}.concentric-ring--uxdsl__density__16{inset:calc(var(--uxdsl__density__16) * -1);z-index:calc(20 - 16)}.density-card,.density-grid,.density-grid-container{display:flex;flex-direction:column;gap:var(--uxdsl__density__2)}.density-card{border-radius:var(--uxdsl__surface__outlined-radius);background:var(--uxdsl__surface__outlined-bg);color:var(--uxdsl__surface__outlined-color);border:var(--uxdsl__surface__outlined-border);box-shadow:var(--uxdsl__surface__outlined-shadow);padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__1);height:auto;overflow-x:auto}.density-card__header{display:flex;justify-content:space-between;align-items:center;padding-bottom:var(--uxdsl__density__2);border-bottom:1px solid color-mix(in srgb,var(--uxdsl__palette__neutral-light) 50%,transparent)}.density-card__header-col{display:flex;flex-direction:column;gap:var(--uxdsl__space__1)}.density-card__header-col--bps,.density-card__header-col--main{justify-content:center}.density-card__header-col--right{flex-direction:row;align-items:center;gap:var(--uxdsl__density__2);justify-content:flex-end}.density-metric-group{display:flex;flex-direction:column;align-items:flex-end;gap:2px}.density-card__viz{padding-top:var(--uxdsl__density__2);display:flex;justify-content:center;align-items:center;min-height:120px}.density-card__token{font-family:var(--uxdsl__typography__body-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-size);line-height:var(--uxdsl__typography__body-line,1.6);font-weight:var(--uxdsl__typography__body-weight,400);letter-spacing:var(--uxdsl__typography__body-spacing,normal);text-transform:var(--uxdsl__typography__body-transform,none);text-decoration:var(--uxdsl__typography__body-decoration,none);font-style:var(--uxdsl__typography__body-style,normal);margin-block-start:var(--uxdsl__typography__body-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-margin-block-end,auto);font-weight:700;font-family:monospace;color:var(--uxdsl__palette__primary-main);background:color-mix(in srgb,var(--uxdsl__palette__primary-main) 10%,transparent);padding:2px 6px;border-radius:4px;width:fit-content}.density-def-list{display:flex;flex-direction:column;gap:2px}.density-def-item{display:flex;gap:4px;font-family:monospace;font-size:.75rem;background:color-mix(in srgb,var(--uxdsl__palette__neutral-light) 30%,transparent);padding:2px 4px;border-radius:2px;transition:all .2s ease}.density-def-item--active{background:color-mix(in srgb,var(--uxdsl__palette__primary-main) 15%,transparent);color:var(--uxdsl__palette__primary-dark);font-weight:700;box-shadow:0 0 0 1px color-mix(in srgb,var(--uxdsl__palette__primary-main) 30%,transparent)}.density-def-bp{font-weight:700;opacity:.7}.density-def-val{opacity:.9}.density-card__edit-btn{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);background:transparent;color:var(--uxdsl__palette__secondary-main);border:1px solid var(--uxdsl__palette__secondary-main);box-shadow:var(--uxdsl__surface__outlined-shadow);--uxdsl__button__tone-main:var(--uxdsl__palette__secondary-main);--uxdsl__button__tone-dark:var(--uxdsl__palette__secondary-dark);--uxdsl__button__tone-contrast:var(--uxdsl__palette__secondary-contrast);white-space:nowrap}.density-card__edit-btn:hover{color:var(--uxdsl__button__outlined-tone-secondary-hover-color,var(--uxdsl__button__outlined-hover-color));border:var(--uxdsl__button__outlined-tone-secondary-hover-border,var(--uxdsl__button__outlined-hover-border))}.density-card__edit-btn.is-selected,.density-card__edit-btn[aria-pressed=true],.density-card__edit-btn[aria-selected=true]{background:var(--uxdsl__button__outlined-tone-secondary-selected-bg,var(--uxdsl__button__outlined-selected-bg));color:var(--uxdsl__button__outlined-tone-secondary-selected-color,var(--uxdsl__button__outlined-selected-color));border:var(--uxdsl__button__outlined-tone-secondary-selected-border,var(--uxdsl__button__outlined-selected-border))}.density-metric-item{display:flex;align-items:baseline;gap:4px;font-family:monospace;font-size:.9rem}.density-metric-label{font-size:.75rem;opacity:.6}.density-metric-value{font-weight:500}.density-metric-value--highlight{color:var(--uxdsl__palette__secondary-dark);font-weight:700}.density-concentric-viz{position:relative;width:100%;height:auto;min-height:100px;display:grid;place-items:center}.density-concentric-center{width:4px;height:4px;background:var(--uxdsl__palette__primary-dark);border-radius:50%;position:relative;grid-area:1/1;z-index:10}.density-concentric-box{position:relative;grid-area:1/1;border:1px dashed;display:flex;align-items:center;justify-content:center;pointer-events:none}.density-concentric-inner{width:4px;height:4px;opacity:0}.density-concentric-label{position:absolute;top:2px;left:2px;font-size:.6rem;font-family:monospace;opacity:.8;line-height:1}.density-concentric-box--0{border-color:var(--uxdsl__palette__secondary-main);background:color-mix(in srgb,var(--uxdsl__palette__secondary-main) 5%,transparent);color:var(--uxdsl__palette__secondary-dark);z-index:3}.density-concentric-box--1{border-color:var(--uxdsl__palette__tertiary-main);background:color-mix(in srgb,var(--uxdsl__palette__tertiary-main) 5%,transparent);color:var(--uxdsl__palette__tertiary-dark);z-index:2}.density-concentric-box--2{border-color:var(--uxdsl__palette__primary-main);background:color-mix(in srgb,var(--uxdsl__palette__primary-main) 5%,transparent);color:var(--uxdsl__palette__primary-dark);z-index:1}.density-concentric-box--active{border-style:solid;border-width:2px;border-color:var(--uxdsl__palette__secondary-dark);background:color-mix(in srgb,var(--uxdsl__palette__secondary-main) 15%,transparent);z-index:10;box-shadow:0 0 0 1px var(--uxdsl__palette__surface-main)}}#DemoPalette,.demo-palette{.palette-header,.palette-section{display:flex;flex-direction:column;gap:var(--uxdsl__density__2)}.demo-title{font-family:var(--uxdsl__typography__h4-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h4-size);line-height:var(--uxdsl__typography__h4-line,1.4);font-weight:var(--uxdsl__typography__h4-weight,600);letter-spacing:var(--uxdsl__typography__h4-spacing,normal);text-transform:var(--uxdsl__typography__h4-transform,none);text-decoration:var(--uxdsl__typography__h4-decoration,none);font-style:var(--uxdsl__typography__h4-style,normal);margin-block-start:var(--uxdsl__typography__h4-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h4-margin-block-end,auto);margin:0}.demo-subtitle{font-family:var(--uxdsl__typography__body-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-size);line-height:var(--uxdsl__typography__body-line,1.6);font-weight:var(--uxdsl__typography__body-weight,400);letter-spacing:var(--uxdsl__typography__body-spacing,normal);text-transform:var(--uxdsl__typography__body-transform,none);text-decoration:var(--uxdsl__typography__body-decoration,none);font-style:var(--uxdsl__typography__body-style,normal);margin-block-start:var(--uxdsl__typography__body-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-margin-block-end,auto);opacity:.75;margin:0;max-width:720px}.palette-stack{gap:var(--uxdsl__density__2)}.palette-card,.palette-stack{display:flex;flex-direction:column}.palette-card{padding:var(--uxdsl__surface__contained-padding);border-radius:var(--uxdsl__surface__contained-radius);background:var(--uxdsl__palette__surface-main);color:var(--uxdsl__palette__surface-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);gap:var(--uxdsl__density__1)}.palette-card__header{display:flex;flex-direction:column;gap:var(--uxdsl__density__2)}.palette-card__title{font-family:var(--uxdsl__typography__h5-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__h5-size);line-height:var(--uxdsl__typography__h5-line,1.4);font-weight:var(--uxdsl__typography__h5-weight,600);letter-spacing:var(--uxdsl__typography__h5-spacing,normal);text-transform:var(--uxdsl__typography__h5-transform,none);text-decoration:var(--uxdsl__typography__h5-decoration,none);font-style:var(--uxdsl__typography__h5-style,normal);margin-block-start:var(--uxdsl__typography__h5-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h5-margin-block-end,auto);margin:0}.palette-card__detail{font-family:var(--uxdsl__typography__body-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-size);line-height:var(--uxdsl__typography__body-line,1.6);font-weight:var(--uxdsl__typography__body-weight,400);letter-spacing:var(--uxdsl__typography__body-spacing,normal);text-transform:var(--uxdsl__typography__body-transform,none);text-decoration:var(--uxdsl__typography__body-decoration,none);font-style:var(--uxdsl__typography__body-style,normal);margin-block-start:var(--uxdsl__typography__body-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-margin-block-end,auto);margin:0;opacity:.85}.palette-token-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--uxdsl__density__2)}.palette-token{border-radius:var(--uxdsl__radius__1);padding:var(--uxdsl__density__1);background:color-mix(in srgb,var(--uxdsl__palette__surface-main) 20%,transparent);display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;height:var(--uxdsl__density__11);min-width:0;transition:transform .2s ease,box-shadow .2s ease}.palette-token:hover{transform:scale(1.02);z-index:1;box-shadow:var(--uxdsl__shadow__2)}.palette-token:last-child{grid-column:1/-1;height:auto;flex-direction:column;justify-content:center;align-items:flex-start;padding:var(--uxdsl__density__2);gap:var(--uxdsl__density__1)}.palette-token:last-child .token-values{position:static;align-items:flex-start}.token-name{font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);opacity:.8}.token-values{display:flex;flex-direction:column;align-items:flex-end;gap:2px;position:absolute;bottom:var(--uxdsl__density__1);right:var(--uxdsl__density__1)}.token-hex{font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);font-family:monospace;opacity:.8}.token-rgb{font-family:var(--uxdsl__typography__tag-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__tag-size);line-height:var(--uxdsl__typography__tag-line,1.5);font-weight:var(--uxdsl__typography__tag-weight,400);letter-spacing:var(--uxdsl__typography__tag-spacing,normal);text-transform:var(--uxdsl__typography__tag-transform,none);text-decoration:var(--uxdsl__typography__tag-decoration,none);font-style:var(--uxdsl__typography__tag-style,normal);margin-block-start:var(--uxdsl__typography__tag-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__tag-margin-block-end,auto);font-family:monospace;opacity:.7;font-size:.7em}.surfaces-playground-container{display:flex;flex-direction:column;gap:var(--uxdsl__density__2)}.surface-playground{display:flex;flex-direction:column;gap:var(--uxdsl__density__3);border-radius:var(--uxdsl__surface__outlined-radius);background:var(--uxdsl__surface__outlined-bg);color:var(--uxdsl__surface__outlined-color);border:var(--uxdsl__surface__outlined-border);box-shadow:var(--uxdsl__surface__outlined-shadow);padding:var(--uxdsl__density__3);background:color-mix(in srgb,var(--uxdsl__palette__surface-light) 30%,transparent)}@media (min-width:768px){.surface-playground{flex-direction:row;align-items:flex-start}}.surface-playground__controls{display:flex;flex-direction:column;gap:var(--uxdsl__density__2);min-width:250px}.surface-playground__controls label{display:flex;flex-direction:column;gap:var(--uxdsl__density__1);font-size:.9rem;font-weight:500}.surface-playground__controls select{box-sizing:border-box;font:inherit;width:100%;border-radius:var(--uxdsl__surface__outlined-radius);background:transparent;color:var(--uxdsl__palette__neutral-main);border:1px solid var(--uxdsl__palette__neutral-main);box-shadow:var(--uxdsl__surface__outlined-shadow);caret-color:var(--uxdsl__input__outlined-tone-neutral-base-caret,var(--uxdsl__input__outlined-base-caret));--uxdsl__input__tone-main:var(--uxdsl__palette__neutral-main);--uxdsl__input__tone-dark:var(--uxdsl__palette__neutral-dark);--uxdsl__input__tone-contrast:var(--uxdsl__palette__neutral-contrast);padding:var(--uxdsl__density__1)}.surface-playground__controls select::placeholder{color:var(--uxdsl__input__outlined-tone-neutral-base-placeholder,var(--uxdsl__input__outlined-base-placeholder))}.surface-playground__controls select:focus{border:var(--uxdsl__input__outlined-tone-neutral-focus-border,var(--uxdsl__input__outlined-focus-border))}.surface-playground__controls select:invalid,.surface-playground__controls select[aria-invalid=true]{border:var(--uxdsl__input__outlined-tone-neutral-invalid-border,var(--uxdsl__input__outlined-invalid-border))}.surface-playground__controls select:disabled,.surface-playground__controls select[aria-disabled=true]{opacity:var(--uxdsl__input__outlined-tone-neutral-disabled-opacity,var(--uxdsl__input__outlined-disabled-opacity))}.surface-playground__preview{flex:1;display:flex;flex-direction:column;gap:var(--uxdsl__density__2)}.demo-code-block{padding:var(--uxdsl__surface__outlined-padding);border-radius:var(--uxdsl__surface__outlined-radius);background:var(--uxdsl__surface__outlined-bg);color:var(--uxdsl__surface__outlined-color);border:var(--uxdsl__surface__outlined-border);box-shadow:var(--uxdsl__surface__outlined-shadow);border-radius:var(--uxdsl__radius__2);overflow:hidden}.code-header{display:flex;justify-content:space-between;align-items:center;padding:var(--uxdsl__density__1) var(--uxdsl__density__2);background:var(--uxdsl__palette__neutral-dark);color:var(--uxdsl__palette__neutral-contrast)}.code-file{font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);opacity:.8}.palette-card-primary-light,.palette-card-primary-main{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__primary-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);background:var(--uxdsl__palette__primary-main);box-shadow:var(--uxdsl__shadow__1)}.palette-card-primary-light{background:var(--uxdsl__palette__primary-light)}.palette-card-primary-dark{background:var(--uxdsl__palette__primary-main);background:var(--uxdsl__palette__primary-dark)}.palette-card-primary-contrast,.palette-card-primary-dark{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__primary-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);box-shadow:var(--uxdsl__shadow__1)}.palette-card-primary-contrast{background:var(--uxdsl__palette__primary-main);background:var(--uxdsl__palette__primary-contrast);color:var(--uxdsl__palette__primary-dark)}.palette-card-secondary-light,.palette-card-secondary-main{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__secondary-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);background:var(--uxdsl__palette__secondary-main);box-shadow:var(--uxdsl__shadow__1)}.palette-card-secondary-light{background:var(--uxdsl__palette__secondary-light)}.palette-card-secondary-dark{background:var(--uxdsl__palette__secondary-main);background:var(--uxdsl__palette__secondary-dark)}.palette-card-secondary-contrast,.palette-card-secondary-dark{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__secondary-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);box-shadow:var(--uxdsl__shadow__1)}.palette-card-secondary-contrast{background:var(--uxdsl__palette__secondary-main);background:var(--uxdsl__palette__secondary-contrast);color:var(--uxdsl__palette__secondary-dark)}.palette-card-tertiary-light,.palette-card-tertiary-main{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__tertiary-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);background:var(--uxdsl__palette__tertiary-main);box-shadow:var(--uxdsl__shadow__1)}.palette-card-tertiary-light{background:var(--uxdsl__palette__tertiary-light)}.palette-card-tertiary-dark{background:var(--uxdsl__palette__tertiary-main);background:var(--uxdsl__palette__tertiary-dark)}.palette-card-tertiary-contrast,.palette-card-tertiary-dark{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__tertiary-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);box-shadow:var(--uxdsl__shadow__1)}.palette-card-tertiary-contrast{background:var(--uxdsl__palette__tertiary-main);background:var(--uxdsl__palette__tertiary-contrast);color:var(--uxdsl__palette__tertiary-dark)}.palette-card-success-light,.palette-card-success-main{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__success-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);background:var(--uxdsl__palette__success-main);box-shadow:var(--uxdsl__shadow__1)}.palette-card-success-light{background:var(--uxdsl__palette__success-light)}.palette-card-success-dark{background:var(--uxdsl__palette__success-main);background:var(--uxdsl__palette__success-dark)}.palette-card-success-contrast,.palette-card-success-dark{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__success-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);box-shadow:var(--uxdsl__shadow__1)}.palette-card-success-contrast{background:var(--uxdsl__palette__success-main);background:var(--uxdsl__palette__success-contrast);color:var(--uxdsl__palette__success-dark)}.palette-card-info-light,.palette-card-info-main{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__info-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);background:var(--uxdsl__palette__info-main);box-shadow:var(--uxdsl__shadow__1)}.palette-card-info-light{background:var(--uxdsl__palette__info-light)}.palette-card-info-dark{background:var(--uxdsl__palette__info-main);background:var(--uxdsl__palette__info-dark)}.palette-card-info-contrast,.palette-card-info-dark{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__info-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);box-shadow:var(--uxdsl__shadow__1)}.palette-card-info-contrast{background:var(--uxdsl__palette__info-main);background:var(--uxdsl__palette__info-contrast);color:var(--uxdsl__palette__info-dark)}.palette-card-warning-light,.palette-card-warning-main{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__warning-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);background:var(--uxdsl__palette__warning-main);box-shadow:var(--uxdsl__shadow__1)}.palette-card-warning-light{background:var(--uxdsl__palette__warning-light)}.palette-card-warning-dark{background:var(--uxdsl__palette__warning-main);background:var(--uxdsl__palette__warning-dark)}.palette-card-warning-contrast,.palette-card-warning-dark{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__warning-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);box-shadow:var(--uxdsl__shadow__1)}.palette-card-warning-contrast{background:var(--uxdsl__palette__warning-main);background:var(--uxdsl__palette__warning-contrast);color:var(--uxdsl__palette__warning-dark)}.palette-card-error-light,.palette-card-error-main{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__error-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);background:var(--uxdsl__palette__error-main);box-shadow:var(--uxdsl__shadow__1)}.palette-card-error-light{background:var(--uxdsl__palette__error-light)}.palette-card-error-dark{background:var(--uxdsl__palette__error-main);background:var(--uxdsl__palette__error-dark)}.palette-card-error-contrast,.palette-card-error-dark{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__error-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);box-shadow:var(--uxdsl__shadow__1)}.palette-card-error-contrast{background:var(--uxdsl__palette__error-main);background:var(--uxdsl__palette__error-contrast);color:var(--uxdsl__palette__error-dark)}.palette-card-dark-light,.palette-card-dark-main{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__dark-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);background:var(--uxdsl__palette__dark-main);box-shadow:var(--uxdsl__shadow__1)}.palette-card-dark-light{background:var(--uxdsl__palette__dark-light)}.palette-card-dark-dark{background:var(--uxdsl__palette__dark-main);background:var(--uxdsl__palette__dark-dark)}.palette-card-dark-contrast,.palette-card-dark-dark{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__dark-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);box-shadow:var(--uxdsl__shadow__1)}.palette-card-dark-contrast{background:var(--uxdsl__palette__dark-main);background:var(--uxdsl__palette__dark-contrast);color:var(--uxdsl__palette__dark-dark)}.palette-card-neutral-light,.palette-card-neutral-main{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__neutral-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);background:var(--uxdsl__palette__neutral-main);box-shadow:var(--uxdsl__shadow__1)}.palette-card-neutral-light{background:var(--uxdsl__palette__neutral-light)}.palette-card-neutral-dark{background:var(--uxdsl__palette__neutral-main);background:var(--uxdsl__palette__neutral-dark)}.palette-card-neutral-contrast,.palette-card-neutral-dark{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__neutral-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);box-shadow:var(--uxdsl__shadow__1)}.palette-card-neutral-contrast{background:var(--uxdsl__palette__neutral-main);background:var(--uxdsl__palette__neutral-contrast);color:var(--uxdsl__palette__neutral-dark)}.palette-card-light-light,.palette-card-light-main{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__light-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);background:var(--uxdsl__palette__light-main);box-shadow:var(--uxdsl__shadow__1)}.palette-card-light-light{background:var(--uxdsl__palette__light-light)}.palette-card-light-dark{background:var(--uxdsl__palette__light-main);background:var(--uxdsl__palette__light-dark)}.palette-card-light-contrast,.palette-card-light-dark{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__light-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);box-shadow:var(--uxdsl__shadow__1)}.palette-card-light-contrast{background:var(--uxdsl__palette__light-main);background:var(--uxdsl__palette__light-contrast);color:var(--uxdsl__palette__light-dark)}.palette-card-surface-light,.palette-card-surface-main{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__surface-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);background:var(--uxdsl__palette__surface-main);box-shadow:var(--uxdsl__shadow__1)}.palette-card-surface-light{background:var(--uxdsl__palette__surface-light)}.palette-card-surface-dark{background:var(--uxdsl__palette__surface-main);background:var(--uxdsl__palette__surface-dark)}.palette-card-surface-contrast,.palette-card-surface-dark{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);color:var(--uxdsl__palette__surface-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);box-shadow:var(--uxdsl__shadow__1)}.palette-card-surface-contrast{background:var(--uxdsl__palette__surface-main);background:var(--uxdsl__palette__surface-contrast);color:var(--uxdsl__palette__surface-dark)}}#DemoProductivity{.prod-container{display:grid;grid-template-columns:1fr;gap:var(--uxdsl__density__4)}@media (min-width:1024px){.prod-container{grid-template-columns:1fr 1fr}}.prod-card{border-radius:var(--uxdsl__surface__contained-radius);background:var(--uxdsl__surface__contained-bg);color:var(--uxdsl__surface__contained-color);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);display:flex;flex-direction:column;gap:var(--uxdsl__density__4);width:100%;padding:var(--uxdsl__density__3);margin:0 auto}@media (min-width:768px){.prod-card{width:480px;padding:var(--uxdsl__density__5)}}.prod-header{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--uxdsl__density__3)}@media (min-width:480px){.prod-header{flex-direction:row;text-align:left}}.prod-avatar{width:80px;height:80px;border-radius:9999px;background:var(--uxdsl__palette__primary-main);color:var(--uxdsl__palette__primary-contrast);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:2rem;box-shadow:var(--uxdsl__shadow__2);border:4px solid var(--uxdsl__palette__surface-main)}.prod-info{display:flex;flex-direction:column;gap:var(--uxdsl__density__1)}.prod-title{font-family:var(--uxdsl__typography__h4-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h4-size);line-height:var(--uxdsl__typography__h4-line,1.4);font-weight:var(--uxdsl__typography__h4-weight,600);letter-spacing:var(--uxdsl__typography__h4-spacing,normal);text-transform:var(--uxdsl__typography__h4-transform,none);text-decoration:var(--uxdsl__typography__h4-decoration,none);font-style:var(--uxdsl__typography__h4-style,normal);margin-block-start:var(--uxdsl__typography__h4-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h4-margin-block-end,auto);color:var(--uxdsl__palette__text-primary);margin:0}.prod-subtitle{font-family:var(--uxdsl__typography__body-sm-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-sm-size);line-height:var(--uxdsl__typography__body-sm-line,1.5);font-weight:var(--uxdsl__typography__body-sm-weight,400);letter-spacing:var(--uxdsl__typography__body-sm-spacing,normal);text-transform:var(--uxdsl__typography__body-sm-transform,none);text-decoration:var(--uxdsl__typography__body-sm-decoration,none);font-style:var(--uxdsl__typography__body-sm-style,normal);margin-block-start:var(--uxdsl__typography__body-sm-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-sm-margin-block-end,auto);color:var(--uxdsl__palette__text-secondary);margin:0;text-transform:uppercase;letter-spacing:1px;font-weight:600}.prod-stats{display:flex;justify-content:space-around;padding:var(--uxdsl__density__3) 0;border-top:1px solid var(--uxdsl__palette__neutral-light);border-bottom:1px solid var(--uxdsl__palette__neutral-light);background:var(--uxdsl__palette__surface-subtle);border-radius:var(--uxdsl__radius__2)}.prod-stat{display:flex;flex-direction:column;align-items:center;gap:var(--uxdsl__density__1)}.prod-stat-val{font-family:var(--uxdsl__typography__h5-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__h5-size);line-height:var(--uxdsl__typography__h5-line,1.4);font-weight:var(--uxdsl__typography__h5-weight,600);letter-spacing:var(--uxdsl__typography__h5-spacing,normal);text-transform:var(--uxdsl__typography__h5-transform,none);text-decoration:var(--uxdsl__typography__h5-decoration,none);font-style:var(--uxdsl__typography__h5-style,normal);margin-block-start:var(--uxdsl__typography__h5-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h5-margin-block-end,auto);color:var(--uxdsl__palette__primary-main);margin:0;line-height:1}.prod-stat-label{font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);color:var(--uxdsl__palette__text-secondary);font-weight:600}.prod-actions{display:flex;flex-direction:column;gap:var(--uxdsl__density__2)}@media (min-width:480px){.prod-actions{flex-direction:row}}.prod-btn-primary{border-radius:var(--uxdsl__surface__contained-radius);background:var(--uxdsl__palette__primary-main);color:var(--uxdsl__palette__primary-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);--uxdsl__button__tone-main:var(--uxdsl__palette__primary-main);--uxdsl__button__tone-dark:var(--uxdsl__palette__primary-dark);--uxdsl__button__tone-contrast:var(--uxdsl__palette__primary-contrast);flex:1;justify-content:center;padding:var(--uxdsl__density__3)}.prod-btn-primary:hover{background:var(--uxdsl__button__contained-tone-primary-hover-bg,var(--uxdsl__button__contained-hover-bg));color:var(--uxdsl__button__contained-tone-primary-hover-color,var(--uxdsl__button__contained-hover-color))}.prod-btn-primary.is-selected,.prod-btn-primary[aria-pressed=true],.prod-btn-primary[aria-selected=true]{background:var(--uxdsl__button__contained-tone-primary-selected-bg,var(--uxdsl__button__contained-selected-bg));color:var(--uxdsl__button__contained-tone-primary-selected-color,var(--uxdsl__button__contained-selected-color))}.prod-btn-secondary{border-radius:var(--uxdsl__surface__outlined-radius);background:transparent;color:var(--uxdsl__palette__secondary-main);border:1px solid var(--uxdsl__palette__secondary-main);box-shadow:var(--uxdsl__surface__outlined-shadow);--uxdsl__button__tone-main:var(--uxdsl__palette__secondary-main);--uxdsl__button__tone-dark:var(--uxdsl__palette__secondary-dark);--uxdsl__button__tone-contrast:var(--uxdsl__palette__secondary-contrast);flex:1;justify-content:center;padding:var(--uxdsl__density__3)}.prod-btn-secondary:hover{color:var(--uxdsl__button__outlined-tone-secondary-hover-color,var(--uxdsl__button__outlined-hover-color));border:var(--uxdsl__button__outlined-tone-secondary-hover-border,var(--uxdsl__button__outlined-hover-border))}.prod-btn-secondary.is-selected,.prod-btn-secondary[aria-pressed=true],.prod-btn-secondary[aria-selected=true]{background:var(--uxdsl__button__outlined-tone-secondary-selected-bg,var(--uxdsl__button__outlined-selected-bg));color:var(--uxdsl__button__outlined-tone-secondary-selected-color,var(--uxdsl__button__outlined-selected-color));border:var(--uxdsl__button__outlined-tone-secondary-selected-border,var(--uxdsl__button__outlined-selected-border))}.prod-code-block{background:#1e1e1e;color:#d4d4d4;padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);font-family:monospace;font-size:.85rem;overflow-x:auto;border:1px solid #333}.prod-code-title{color:#9cdcfe;font-weight:700;margin-bottom:var(--uxdsl__density__1);display:block}.prod-highlight{color:#ce9178}.prod-comment{color:#6a9955}.prod-tab-btn:hover{color:var(--uxdsl__palette__text-primary)}.prod-code-section{display:flex;flex-direction:column;gap:var(--uxdsl__density__3)}.prod-form,.prod-tab-content{margin-top:var(--uxdsl__density__3)}.prod-form{padding:var(--uxdsl__density__3);border:1px solid var(--uxdsl__palette__neutral-light);border-radius:var(--uxdsl__radius__2);background:var(--uxdsl__palette__surface-light);display:flex;flex-direction:column;gap:var(--uxdsl__space__2)}@media (min-width:768px){.prod-form{gap:var(--uxdsl__space__4)}}.prod-form-title{font-family:var(--uxdsl__typography__h6-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__h6-size);line-height:var(--uxdsl__typography__h6-line,1.4);font-weight:var(--uxdsl__typography__h6-weight,600);letter-spacing:var(--uxdsl__typography__h6-spacing,normal);text-transform:var(--uxdsl__typography__h6-transform,none);text-decoration:var(--uxdsl__typography__h6-decoration,none);font-style:var(--uxdsl__typography__h6-style,normal);margin-block-start:var(--uxdsl__typography__h6-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h6-margin-block-end,auto);margin:0;color:var(--uxdsl__palette__text-primary)}.prod-form-row{display:flex;flex-direction:column;gap:var(--uxdsl__density__2)}@media (min-width:768px){.prod-form-row{flex-direction:row}}.prod-input-group{flex:1;display:flex;flex-direction:column;gap:var(--uxdsl__space__1)}.prod-label{font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);font-weight:700;color:var(--uxdsl__palette__text-secondary)}.prod-input{box-sizing:border-box;font:inherit;width:100%;padding:var(--uxdsl__surface__outlined-padding);border-radius:var(--uxdsl__surface__outlined-radius);background:transparent;color:var(--uxdsl__palette__neutral-main);border:1px solid var(--uxdsl__palette__neutral-main);box-shadow:var(--uxdsl__surface__outlined-shadow);caret-color:var(--uxdsl__input__outlined-tone-neutral-base-caret,var(--uxdsl__input__outlined-base-caret));--uxdsl__input__tone-main:var(--uxdsl__palette__neutral-main);--uxdsl__input__tone-dark:var(--uxdsl__palette__neutral-dark);--uxdsl__input__tone-contrast:var(--uxdsl__palette__neutral-contrast);font-size:.875rem}@media (min-width:768px){.prod-input{font-size:1rem}}.prod-input::placeholder{color:var(--uxdsl__input__outlined-tone-neutral-base-placeholder,var(--uxdsl__input__outlined-base-placeholder))}.prod-input:focus{border:var(--uxdsl__input__outlined-tone-neutral-focus-border,var(--uxdsl__input__outlined-focus-border))}.prod-input:invalid,.prod-input[aria-invalid=true]{border:var(--uxdsl__input__outlined-tone-neutral-invalid-border,var(--uxdsl__input__outlined-invalid-border))}.prod-input:disabled,.prod-input[aria-disabled=true]{opacity:var(--uxdsl__input__outlined-tone-neutral-disabled-opacity,var(--uxdsl__input__outlined-disabled-opacity))}.demo-grid-hero{display:grid;grid-template-columns:1fr;align-items:start;gap:var(--uxdsl__density__4);margin-top:var(--uxdsl__density__4)}@media (min-width:1024px){.demo-grid-hero{grid-template-columns:1fr 1fr}}.demo-preview{display:flex;justify-content:center;padding:var(--uxdsl__density__4);background:var(--uxdsl__palette__surface-subtle);border-radius:var(--uxdsl__radius__3);border:1px solid var(--uxdsl__palette__neutral-light)}.code-header{background:#252526;padding:var(--uxdsl__density__2) var(--uxdsl__density__3);border-bottom:1px solid #333;display:flex;align-items:center}.code-lang{font-size:.8rem;color:#9cdcfe;font-weight:700;text-transform:uppercase;letter-spacing:1px}.demo-code pre{margin:0;padding:var(--uxdsl__density__3);overflow-x:auto;line-height:1.5}.demo-code code{font-family:Fira Code,Consolas,monospace}.prod-tabs{display:flex;gap:var(--uxdsl__density__2);margin-bottom:var(--uxdsl__density__4);border-bottom:1px solid var(--uxdsl__palette__neutral-light);padding-bottom:var(--uxdsl__density__2)}.prod-tab-btn{background:none;border:none;padding:var(--uxdsl__density__2) var(--uxdsl__density__4);font-size:1rem;font-weight:600;color:var(--uxdsl__palette__text-secondary);cursor:pointer;border-radius:var(--uxdsl__radius__2);transition:all .2s ease}.prod-tab-btn:hover{background:var(--uxdsl__palette__surface-subtle);color:var(--uxdsl__palette__primary-main)}.prod-tab-btn.active{background:var(--uxdsl__palette__primary-light);color:var(--uxdsl__palette__primary-dark)}.prod-comparison-grid{display:flex;flex-direction:column;align-items:center;gap:var(--uxdsl__density__4)}.demo-code{background:#1e1e1e;border-radius:var(--uxdsl__radius__3);overflow:hidden;color:#d4d4d4;font-family:monospace;font-size:.9rem;border:1px solid var(--uxdsl__palette__neutral-light);box-shadow:var(--uxdsl__shadow__2);width:100%;max-width:600px}}#DemoShadows{.demo-shadows{gap:var(--uxdsl__space__8);padding:var(--uxdsl__space__4)}.demo-shadows,.section{display:flex;flex-direction:column}.section{gap:var(--uxdsl__space__4)}.section-title{font:font(h4);color:var(--uxdsl__palette__text-main);margin-bottom:var(--uxdsl__space__2)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--uxdsl__space__4)}.card{flex-direction:column;gap:var(--uxdsl__space__2);padding:var(--uxdsl__space__4);border:var(--uxdsl__border__1);border-radius:var(--uxdsl__radius__2)}.card,.preview-box{display:flex;background:var(--uxdsl__palette__surface-main)}.preview-box{width:100%;height:100px;align-items:center;justify-content:center}.label,.preview-box{color:var(--uxdsl__palette__text-secondary);font:font(body-sm)}.label{font-family:monospace}.playground{display:flex;flex-direction:column;background:var(--uxdsl__palette__surface-main);padding:var(--uxdsl__space__6);border-radius:var(--uxdsl__radius__3);border:var(--uxdsl__border__1)}@media (min-width:768px){.playground{display:grid;grid-template-columns:300px 1fr}}.controls{gap:var(--uxdsl__space__4);padding:var(--uxdsl__density__2)}.control-group,.controls{display:flex;flex-direction:column}.control-group{gap:var(--uxdsl__space__2)}.control-label{font:font(label);color:var(--uxdsl__palette__text-secondary)}.select{box-sizing:border-box;font:inherit;width:100%;border-radius:var(--uxdsl__surface__outlined-radius);background:transparent;color:var(--uxdsl__palette__neutral-main);border:1px solid var(--uxdsl__palette__neutral-main);box-shadow:var(--uxdsl__surface__outlined-shadow);caret-color:var(--uxdsl__input__outlined-tone-neutral-base-caret,var(--uxdsl__input__outlined-base-caret));--uxdsl__input__tone-main:var(--uxdsl__palette__neutral-main);--uxdsl__input__tone-dark:var(--uxdsl__palette__neutral-dark);--uxdsl__input__tone-contrast:var(--uxdsl__palette__neutral-contrast);padding:var(--uxdsl__space__2)}.select::placeholder{color:var(--uxdsl__input__outlined-tone-neutral-base-placeholder,var(--uxdsl__input__outlined-base-placeholder))}.select:focus{border:var(--uxdsl__input__outlined-tone-neutral-focus-border,var(--uxdsl__input__outlined-focus-border))}.select:invalid,.select[aria-invalid=true]{border:var(--uxdsl__input__outlined-tone-neutral-invalid-border,var(--uxdsl__input__outlined-invalid-border))}.select:disabled,.select[aria-disabled=true]{opacity:var(--uxdsl__input__outlined-tone-neutral-disabled-opacity,var(--uxdsl__input__outlined-disabled-opacity))}.preview-area{display:flex;flex-direction:column;gap:var(--uxdsl__space__4);min-width:0;padding:var(--uxdsl__density__2)}.live-preview{flex:1;background:var(--uxdsl__palette__surface-light);border-radius:var(--uxdsl__radius__2);min-height:300px;padding:var(--uxdsl__space__8)}.demo-element,.live-preview{display:flex;align-items:center;justify-content:center}.demo-element{width:200px;height:200px;background:var(--uxdsl__palette__surface-main);color:var(--uxdsl__palette__text-main);font-weight:700;transition:all .3s ease}.demo-code-block{border-radius:var(--uxdsl__radius__2);overflow:hidden;border:var(--uxdsl__border__1)}}#DemoSpacing{.spacing-section{display:flex;flex-direction:column;gap:var(--uxdsl__density__4)}.spacing-doll-container,.spacing-header{display:flex;flex-direction:column;gap:var(--uxdsl__density__2)}.spacing-doll-controls{display:flex;gap:var(--uxdsl__density__2);align-items:center}.spacing-doll-wrapper{overflow:auto;padding:var(--uxdsl__density__4);background:var(--uxdsl__palette__surface-light);border-radius:var(--uxdsl__radius__2);border:1px solid var(--uxdsl__palette__neutral-light);transition:all .3s ease}.concentric-content,.concentric-wrapper,.spacing-doll-wrapper{display:flex;justify-content:center;align-items:center;position:relative}.concentric-content{z-index:100;background:var(--uxdsl__palette__surface-main);padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__1);min-width:80px;min-height:40px;box-shadow:var(--uxdsl__shadow__2);font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);font-weight:700;color:var(--uxdsl__palette__primary-dark);border:1px solid var(--uxdsl__palette__neutral-light)}.concentric-ring{position:absolute;border-radius:var(--uxdsl__radius__2);border:1px solid color-mix(in srgb,var(--uxdsl__palette__primary-main) 20%,transparent);background:color-mix(in srgb,var(--uxdsl__palette__primary-main) 3%,transparent);pointer-events:auto;transition:all .2s ease;display:flex;justify-content:center;align-items:flex-start;cursor:pointer}.concentric-ring.is-hovered,.concentric-ring:hover{border-color:var(--uxdsl__palette__secondary-main);background:color-mix(in srgb,var(--uxdsl__palette__secondary-main) 10%,transparent);box-shadow:0 0 0 1px var(--uxdsl__palette__secondary-main)}.ring-label{background:var(--uxdsl__palette__secondary-main);color:var(--uxdsl__palette__secondary-contrast);font-size:.6rem;padding:1px 4px;border-radius:0 0 4px 4px;opacity:0;transition:opacity .2s;margin-top:-1px}.concentric-ring.is-hovered .ring-label,.concentric-ring:hover .ring-label{opacity:1}.concentric-ring--1{inset:calc(var(--uxdsl__space__1) * -1);z-index:calc(20 - 1)}.concentric-ring--2{inset:calc(var(--uxdsl__space__2) * -1);z-index:calc(20 - 2)}.concentric-ring--3{inset:calc(var(--uxdsl__space__3) * -1);z-index:calc(20 - 3)}.concentric-ring--4{inset:calc(var(--uxdsl__space__4) * -1);z-index:calc(20 - 4)}.concentric-ring--5{inset:calc(var(--uxdsl__space__5) * -1);z-index:calc(20 - 5)}.concentric-ring--6{inset:calc(var(--uxdsl__space__6) * -1);z-index:calc(20 - 6)}.concentric-ring--7{inset:calc(var(--uxdsl__space__7) * -1);z-index:calc(20 - 7)}.concentric-ring--8{inset:calc(var(--uxdsl__space__8) * -1);z-index:calc(20 - 8)}.concentric-ring--9{inset:calc(var(--uxdsl__space__9) * -1);z-index:calc(20 - 9)}.concentric-ring--10{inset:calc(var(--uxdsl__space__10) * -1);z-index:calc(20 - 10)}.concentric-ring--11{inset:calc(var(--uxdsl__space__11) * -1);z-index:calc(20 - 11)}.concentric-ring--12{inset:calc(var(--uxdsl__space__12) * -1);z-index:calc(20 - 12)}.concentric-ring--13{inset:calc(var(--uxdsl__space__13) * -1);z-index:calc(20 - 13)}.concentric-ring--14{inset:calc(var(--uxdsl__space__14) * -1);z-index:calc(20 - 14)}.concentric-ring--15{inset:calc(var(--uxdsl__space__15) * -1);z-index:calc(20 - 15)}.concentric-ring--16{inset:calc(var(--uxdsl__space__16) * -1);z-index:calc(20 - 16)}.spacing-grid{display:flex;flex-direction:column;gap:var(--uxdsl__density__1)}.spacing-card{border-radius:var(--uxdsl__surface__outlined-radius);background:var(--uxdsl__surface__outlined-bg);color:var(--uxdsl__surface__outlined-color);border:var(--uxdsl__surface__outlined-border);box-shadow:var(--uxdsl__surface__outlined-shadow);padding:var(--uxdsl__density__2);display:grid;gap:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);transition:all .2s ease;align-items:center;grid-template-columns:auto 1fr;grid-template-areas:"token input" "sep sep" "preview preview"}@media (min-width:768px){.spacing-card{grid-template-columns:120px 1fr auto;grid-template-areas:"token input preview";padding:var(--uxdsl__density__1) var(--uxdsl__density__3)}}.spacing-card:hover{border-color:var(--uxdsl__palette__primary-main);box-shadow:var(--uxdsl__shadow__1)}.spacing-card__token{grid-area:token;font-family:var(--uxdsl__typography__subtitle2-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__subtitle2-size);line-height:var(--uxdsl__typography__subtitle2-line,1.5);font-weight:var(--uxdsl__typography__subtitle2-weight,400);letter-spacing:var(--uxdsl__typography__subtitle2-spacing,normal);text-transform:var(--uxdsl__typography__subtitle2-transform,none);text-decoration:var(--uxdsl__typography__subtitle2-decoration,none);font-style:var(--uxdsl__typography__subtitle2-style,normal);margin-block-start:var(--uxdsl__typography__subtitle2-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__subtitle2-margin-block-end,auto);font-family:monospace;font-weight:700;color:var(--uxdsl__palette__primary-dark)}.spacing-card__input-wrapper{grid-area:input;display:flex;justify-content:flex-end}.spacing-card__input{width:100%;max-width:120px;padding:var(--uxdsl__space__1) var(--uxdsl__density__1);background:transparent;border:1px solid var(--uxdsl__palette__neutral-main);border-radius:var(--uxdsl__radius__1);font-family:monospace;font-size:.85rem;text-align:right;color:var(--uxdsl__palette__surface-contrast)}@media (min-width:768px){.spacing-card__input-wrapper{justify-content:flex-start}.spacing-card__input{text-align:left;max-width:200px}}.spacing-card__input:focus{border-color:var(--uxdsl__palette__primary-main);outline:none}.spacing-card__separator{grid-area:sep;height:1px;background:color-mix(in srgb,var(--uxdsl__palette__neutral-light) 50%,transparent);width:100%;margin:var(--uxdsl__space__1) 0}@media (min-width:768px){.spacing-card__separator{display:none}}.spacing-card__preview{grid-area:preview;display:flex;justify-content:center;align-items:center;padding:var(--uxdsl__density__1) 0;min-height:40px}@media (min-width:768px){.spacing-card__preview{justify-content:flex-end;padding:0;min-width:60px}}.spacing-box{background:var(--uxdsl__palette__primary-main);border-radius:2px;box-shadow:0 0 0 1px color-mix(in srgb,var(--uxdsl__palette__primary-main) 20%,transparent)}.spacing-box--1{width:var(--uxdsl__space__1);height:var(--uxdsl__space__1)}.spacing-box--2{width:var(--uxdsl__space__2);height:var(--uxdsl__space__2)}.spacing-box--3{width:var(--uxdsl__space__3);height:var(--uxdsl__space__3)}.spacing-box--4{width:var(--uxdsl__space__4);height:var(--uxdsl__space__4)}.spacing-box--5{width:var(--uxdsl__space__5);height:var(--uxdsl__space__5)}.spacing-box--6{width:var(--uxdsl__space__6);height:var(--uxdsl__space__6)}.spacing-box--7{width:var(--uxdsl__space__7);height:var(--uxdsl__space__7)}.spacing-box--8{width:var(--uxdsl__space__8);height:var(--uxdsl__space__8)}.spacing-box--9{width:var(--uxdsl__space__9);height:var(--uxdsl__space__9)}.spacing-box--10{width:var(--uxdsl__space__10);height:var(--uxdsl__space__10)}.spacing-box--11{width:var(--uxdsl__space__11);height:var(--uxdsl__space__11)}.spacing-box--12{width:var(--uxdsl__space__12);height:var(--uxdsl__space__12)}.spacing-box--13{width:var(--uxdsl__space__13);height:var(--uxdsl__space__13)}.spacing-box--14{width:var(--uxdsl__space__14);height:var(--uxdsl__space__14)}.spacing-box--15{width:var(--uxdsl__space__15);height:var(--uxdsl__space__15)}.spacing-box--16{width:var(--uxdsl__space__16);height:var(--uxdsl__space__16)}}#DemoSurfaces{.surfaces-section{display:flex;flex-direction:column;gap:var(--uxdsl__density__4);--uxdsl__space__0:0px}.surfaces-header,.surfaces-viz-container{display:flex;flex-direction:column;gap:var(--uxdsl__density__2)}.surfaces-viz-wrapper{display:flex;justify-content:center;align-items:center;padding:var(--uxdsl__density__4);background:var(--uxdsl__palette__surface-light);border-radius:var(--uxdsl__radius__2);border:1px solid var(--uxdsl__palette__neutral-light);min-height:300px}.surfaces-stack{position:relative;width:300px;height:200px}.surface-card-viz{position:absolute;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;transition:all .3s ease;cursor:pointer}.surface-card-viz:hover{transform:translateY(-5px)}.surface-card-viz--contained{top:0;left:0;z-index:1}.surface-card-viz--outlined{top:20px;left:20px;z-index:2;backdrop-filter:blur(4px)}.surface-card-viz--flat{top:40px;left:40px;z-index:3}.surfaces-grid-container{display:flex;flex-direction:column;gap:var(--uxdsl__density__2)}.surfaces-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:var(--uxdsl__density__2)}.surface-card{border-radius:var(--uxdsl__surface__outlined-radius);background:var(--uxdsl__surface__outlined-bg);color:var(--uxdsl__surface__outlined-color);border:var(--uxdsl__surface__outlined-border);box-shadow:var(--uxdsl__surface__outlined-shadow);padding:var(--uxdsl__density__2);display:flex;flex-direction:column;gap:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__1)}.surface-card__header{display:flex;justify-content:space-between;align-items:flex-start;padding-bottom:var(--uxdsl__density__1);border-bottom:1px solid color-mix(in srgb,var(--uxdsl__palette__neutral-light) 50%,transparent)}.surface-card__title-group{display:flex;flex-direction:column;gap:var(--uxdsl__density__1)}.surface-card__desc{font-size:.85rem;color:var(--uxdsl__palette__neutral-dark);line-height:1.4;max-width:90%}.surface-card__token{font-family:var(--uxdsl__typography__body-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-size);line-height:var(--uxdsl__typography__body-line,1.6);font-weight:var(--uxdsl__typography__body-weight,400);letter-spacing:var(--uxdsl__typography__body-spacing,normal);text-transform:var(--uxdsl__typography__body-transform,none);text-decoration:var(--uxdsl__typography__body-decoration,none);font-style:var(--uxdsl__typography__body-style,normal);margin-block-start:var(--uxdsl__typography__body-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-margin-block-end,auto);font-weight:700;font-family:monospace;color:var(--uxdsl__palette__primary-main);background:color-mix(in srgb,var(--uxdsl__palette__primary-main) 10%,transparent);padding:2px 6px;border-radius:4px;width:fit-content}.surfaces-doc-container{display:flex;flex-direction:column;gap:var(--uxdsl__density__2)}.surface-doc-card{border-radius:var(--uxdsl__surface__outlined-radius);background:var(--uxdsl__surface__outlined-bg);color:var(--uxdsl__surface__outlined-color);border:var(--uxdsl__surface__outlined-border);box-shadow:var(--uxdsl__surface__outlined-shadow);padding:var(--uxdsl__density__3);background:color-mix(in srgb,var(--uxdsl__palette__surface-light) 30%,transparent)}.surface-doc-intro{margin-bottom:var(--uxdsl__density__2);line-height:1.5}.surface-doc-subtitle{font-weight:700;margin-bottom:var(--uxdsl__density__1);color:var(--uxdsl__palette__primary-dark)}.surface-doc-list{list-style:disc;padding-left:var(--uxdsl__density__3);display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--uxdsl__density__1)}.surface-doc-list li{font-size:.9rem}.surface-card__edit-btn{padding:4px 12px;font-size:.8rem;cursor:pointer;background:var(--uxdsl__palette__surface-light);border:1px solid var(--uxdsl__palette__neutral-light);border-radius:var(--uxdsl__radius__1);transition:all .2s ease}.surface-card__edit-btn:hover{border-color:var(--uxdsl__palette__primary-main);color:var(--uxdsl__palette__primary-main)}.surface-card__preview{height:120px;background:color-mix(in srgb,var(--uxdsl__palette__neutral-light) 10%,transparent);border-radius:var(--uxdsl__radius__1);padding:var(--uxdsl__density__2)}.surface-card__preview,.surface-preview-box{display:flex;justify-content:center;align-items:center}.surface-preview-box{min-width:120px;min-height:60px;font-size:.9rem;font-weight:500}.surface-props-list{display:flex;flex-direction:column;gap:4px;font-family:monospace;font-size:.8rem;color:var(--uxdsl__palette__neutral-dark)}.surface-prop{display:flex;gap:8px}.surface-prop-key{opacity:.7;min-width:60px}.surfaces-playground-container{display:flex;flex-direction:column;gap:var(--uxdsl__density__2)}.surface-playground{display:flex;flex-direction:column;gap:var(--uxdsl__density__3);border-radius:var(--uxdsl__surface__outlined-radius);background:var(--uxdsl__surface__outlined-bg);color:var(--uxdsl__surface__outlined-color);border:var(--uxdsl__surface__outlined-border);box-shadow:var(--uxdsl__surface__outlined-shadow);padding:var(--uxdsl__density__3);background:color-mix(in srgb,var(--uxdsl__palette__surface-light) 30%,transparent)}@media (min-width:768px){.surface-playground{flex-direction:row;align-items:flex-start}}.surface-playground__controls{display:flex;flex-direction:column;gap:var(--uxdsl__density__2);min-width:250px}.surface-playground__controls label{display:flex;flex-direction:column;gap:var(--uxdsl__density__1);font-size:.9rem;font-weight:500}.surface-playground__controls select{box-sizing:border-box;font:inherit;width:100%;border-radius:var(--uxdsl__surface__outlined-radius);background:transparent;color:var(--uxdsl__palette__neutral-main);border:1px solid var(--uxdsl__palette__neutral-main);box-shadow:var(--uxdsl__surface__outlined-shadow);caret-color:var(--uxdsl__input__outlined-tone-neutral-base-caret,var(--uxdsl__input__outlined-base-caret));--uxdsl__input__tone-main:var(--uxdsl__palette__neutral-main);--uxdsl__input__tone-dark:var(--uxdsl__palette__neutral-dark);--uxdsl__input__tone-contrast:var(--uxdsl__palette__neutral-contrast);padding:var(--uxdsl__density__1)}.surface-playground__controls select::placeholder{color:var(--uxdsl__input__outlined-tone-neutral-base-placeholder,var(--uxdsl__input__outlined-base-placeholder))}.surface-playground__controls select:focus{border:var(--uxdsl__input__outlined-tone-neutral-focus-border,var(--uxdsl__input__outlined-focus-border))}.surface-playground__controls select:invalid,.surface-playground__controls select[aria-invalid=true]{border:var(--uxdsl__input__outlined-tone-neutral-invalid-border,var(--uxdsl__input__outlined-invalid-border))}.surface-playground__controls select:disabled,.surface-playground__controls select[aria-disabled=true]{opacity:var(--uxdsl__input__outlined-tone-neutral-disabled-opacity,var(--uxdsl__input__outlined-disabled-opacity))}.surface-playground__preview{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;background:color-mix(in srgb,var(--uxdsl__palette__neutral-light) 10%,transparent);border-radius:var(--uxdsl__radius__2);padding:var(--uxdsl__density__4);min-height:300px}.surface-playground__box{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--uxdsl__density__2)}.surface-playground__box--contained-primary-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-primary-0,.surface-playground__box--contained-primary-1{background:var(--uxdsl__palette__primary-main);color:var(--uxdsl__palette__primary-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-primary-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-primary-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-primary-2,.surface-playground__box--contained-primary-3{background:var(--uxdsl__palette__primary-main);color:var(--uxdsl__palette__primary-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-primary-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-primary-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-primary-4,.surface-playground__box--contained-primary-5{background:var(--uxdsl__palette__primary-main);color:var(--uxdsl__palette__primary-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-primary-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-secondary-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-secondary-0,.surface-playground__box--contained-secondary-1{background:var(--uxdsl__palette__secondary-main);color:var(--uxdsl__palette__secondary-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-secondary-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-secondary-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-secondary-2,.surface-playground__box--contained-secondary-3{background:var(--uxdsl__palette__secondary-main);color:var(--uxdsl__palette__secondary-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-secondary-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-secondary-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-secondary-4,.surface-playground__box--contained-secondary-5{background:var(--uxdsl__palette__secondary-main);color:var(--uxdsl__palette__secondary-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-secondary-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-success-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-success-0,.surface-playground__box--contained-success-1{background:var(--uxdsl__palette__success-main);color:var(--uxdsl__palette__success-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-success-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-success-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-success-2,.surface-playground__box--contained-success-3{background:var(--uxdsl__palette__success-main);color:var(--uxdsl__palette__success-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-success-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-success-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-success-4,.surface-playground__box--contained-success-5{background:var(--uxdsl__palette__success-main);color:var(--uxdsl__palette__success-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-success-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-info-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-info-0,.surface-playground__box--contained-info-1{background:var(--uxdsl__palette__info-main);color:var(--uxdsl__palette__info-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-info-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-info-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-info-2,.surface-playground__box--contained-info-3{background:var(--uxdsl__palette__info-main);color:var(--uxdsl__palette__info-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-info-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-info-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-info-4,.surface-playground__box--contained-info-5{background:var(--uxdsl__palette__info-main);color:var(--uxdsl__palette__info-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-info-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-warning-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-warning-0,.surface-playground__box--contained-warning-1{background:var(--uxdsl__palette__warning-main);color:var(--uxdsl__palette__warning-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-warning-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-warning-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-warning-2,.surface-playground__box--contained-warning-3{background:var(--uxdsl__palette__warning-main);color:var(--uxdsl__palette__warning-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-warning-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-warning-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-warning-4,.surface-playground__box--contained-warning-5{background:var(--uxdsl__palette__warning-main);color:var(--uxdsl__palette__warning-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-warning-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-error-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-error-0,.surface-playground__box--contained-error-1{background:var(--uxdsl__palette__error-main);color:var(--uxdsl__palette__error-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-error-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-error-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-error-2,.surface-playground__box--contained-error-3{background:var(--uxdsl__palette__error-main);color:var(--uxdsl__palette__error-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-error-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-error-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-error-4,.surface-playground__box--contained-error-5{background:var(--uxdsl__palette__error-main);color:var(--uxdsl__palette__error-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-error-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-neutral-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-neutral-0,.surface-playground__box--contained-neutral-1{background:var(--uxdsl__palette__neutral-main);color:var(--uxdsl__palette__neutral-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-neutral-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-neutral-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-neutral-2,.surface-playground__box--contained-neutral-3{background:var(--uxdsl__palette__neutral-main);color:var(--uxdsl__palette__neutral-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-neutral-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-neutral-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-neutral-4,.surface-playground__box--contained-neutral-5{background:var(--uxdsl__palette__neutral-main);color:var(--uxdsl__palette__neutral-contrast);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-neutral-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-none-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-none-0,.surface-playground__box--contained-none-1{background:var(--uxdsl__surface__contained-bg);color:var(--uxdsl__surface__contained-color);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-none-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-none-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-none-2,.surface-playground__box--contained-none-3{background:var(--uxdsl__surface__contained-bg);color:var(--uxdsl__surface__contained-color);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-none-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-none-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--contained-none-4,.surface-playground__box--contained-none-5{background:var(--uxdsl__surface__contained-bg);color:var(--uxdsl__surface__contained-color);box-shadow:var(--uxdsl__surface__contained-shadow)}.surface-playground__box--contained-none-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:var(--uxdsl__surface__contained-border)}.surface-playground__box--outlined-primary-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:1px solid var(--uxdsl__palette__primary-main)}.surface-playground__box--outlined-primary-0,.surface-playground__box--outlined-primary-1{background:transparent;color:var(--uxdsl__palette__primary-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-primary-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:1px solid var(--uxdsl__palette__primary-main)}.surface-playground__box--outlined-primary-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:1px solid var(--uxdsl__palette__primary-main)}.surface-playground__box--outlined-primary-2,.surface-playground__box--outlined-primary-3{background:transparent;color:var(--uxdsl__palette__primary-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-primary-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:1px solid var(--uxdsl__palette__primary-main)}.surface-playground__box--outlined-primary-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:1px solid var(--uxdsl__palette__primary-main)}.surface-playground__box--outlined-primary-4,.surface-playground__box--outlined-primary-5{background:transparent;color:var(--uxdsl__palette__primary-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-primary-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:1px solid var(--uxdsl__palette__primary-main)}.surface-playground__box--outlined-secondary-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:1px solid var(--uxdsl__palette__secondary-main)}.surface-playground__box--outlined-secondary-0,.surface-playground__box--outlined-secondary-1{background:transparent;color:var(--uxdsl__palette__secondary-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-secondary-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:1px solid var(--uxdsl__palette__secondary-main)}.surface-playground__box--outlined-secondary-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:1px solid var(--uxdsl__palette__secondary-main)}.surface-playground__box--outlined-secondary-2,.surface-playground__box--outlined-secondary-3{background:transparent;color:var(--uxdsl__palette__secondary-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-secondary-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:1px solid var(--uxdsl__palette__secondary-main)}.surface-playground__box--outlined-secondary-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:1px solid var(--uxdsl__palette__secondary-main)}.surface-playground__box--outlined-secondary-4,.surface-playground__box--outlined-secondary-5{background:transparent;color:var(--uxdsl__palette__secondary-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-secondary-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:1px solid var(--uxdsl__palette__secondary-main)}.surface-playground__box--outlined-success-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:1px solid var(--uxdsl__palette__success-main)}.surface-playground__box--outlined-success-0,.surface-playground__box--outlined-success-1{background:transparent;color:var(--uxdsl__palette__success-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-success-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:1px solid var(--uxdsl__palette__success-main)}.surface-playground__box--outlined-success-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:1px solid var(--uxdsl__palette__success-main)}.surface-playground__box--outlined-success-2,.surface-playground__box--outlined-success-3{background:transparent;color:var(--uxdsl__palette__success-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-success-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:1px solid var(--uxdsl__palette__success-main)}.surface-playground__box--outlined-success-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:1px solid var(--uxdsl__palette__success-main)}.surface-playground__box--outlined-success-4,.surface-playground__box--outlined-success-5{background:transparent;color:var(--uxdsl__palette__success-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-success-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:1px solid var(--uxdsl__palette__success-main)}.surface-playground__box--outlined-info-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:1px solid var(--uxdsl__palette__info-main)}.surface-playground__box--outlined-info-0,.surface-playground__box--outlined-info-1{background:transparent;color:var(--uxdsl__palette__info-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-info-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:1px solid var(--uxdsl__palette__info-main)}.surface-playground__box--outlined-info-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:1px solid var(--uxdsl__palette__info-main)}.surface-playground__box--outlined-info-2,.surface-playground__box--outlined-info-3{background:transparent;color:var(--uxdsl__palette__info-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-info-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:1px solid var(--uxdsl__palette__info-main)}.surface-playground__box--outlined-info-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:1px solid var(--uxdsl__palette__info-main)}.surface-playground__box--outlined-info-4,.surface-playground__box--outlined-info-5{background:transparent;color:var(--uxdsl__palette__info-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-info-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:1px solid var(--uxdsl__palette__info-main)}.surface-playground__box--outlined-warning-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:1px solid var(--uxdsl__palette__warning-main)}.surface-playground__box--outlined-warning-0,.surface-playground__box--outlined-warning-1{background:transparent;color:var(--uxdsl__palette__warning-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-warning-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:1px solid var(--uxdsl__palette__warning-main)}.surface-playground__box--outlined-warning-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:1px solid var(--uxdsl__palette__warning-main)}.surface-playground__box--outlined-warning-2,.surface-playground__box--outlined-warning-3{background:transparent;color:var(--uxdsl__palette__warning-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-warning-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:1px solid var(--uxdsl__palette__warning-main)}.surface-playground__box--outlined-warning-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:1px solid var(--uxdsl__palette__warning-main)}.surface-playground__box--outlined-warning-4,.surface-playground__box--outlined-warning-5{background:transparent;color:var(--uxdsl__palette__warning-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-warning-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:1px solid var(--uxdsl__palette__warning-main)}.surface-playground__box--outlined-error-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:1px solid var(--uxdsl__palette__error-main)}.surface-playground__box--outlined-error-0,.surface-playground__box--outlined-error-1{background:transparent;color:var(--uxdsl__palette__error-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-error-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:1px solid var(--uxdsl__palette__error-main)}.surface-playground__box--outlined-error-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:1px solid var(--uxdsl__palette__error-main)}.surface-playground__box--outlined-error-2,.surface-playground__box--outlined-error-3{background:transparent;color:var(--uxdsl__palette__error-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-error-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:1px solid var(--uxdsl__palette__error-main)}.surface-playground__box--outlined-error-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:1px solid var(--uxdsl__palette__error-main)}.surface-playground__box--outlined-error-4,.surface-playground__box--outlined-error-5{background:transparent;color:var(--uxdsl__palette__error-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-error-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:1px solid var(--uxdsl__palette__error-main)}.surface-playground__box--outlined-neutral-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:1px solid var(--uxdsl__palette__neutral-main)}.surface-playground__box--outlined-neutral-0,.surface-playground__box--outlined-neutral-1{background:transparent;color:var(--uxdsl__palette__neutral-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-neutral-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:1px solid var(--uxdsl__palette__neutral-main)}.surface-playground__box--outlined-neutral-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:1px solid var(--uxdsl__palette__neutral-main)}.surface-playground__box--outlined-neutral-2,.surface-playground__box--outlined-neutral-3{background:transparent;color:var(--uxdsl__palette__neutral-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-neutral-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:1px solid var(--uxdsl__palette__neutral-main)}.surface-playground__box--outlined-neutral-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:1px solid var(--uxdsl__palette__neutral-main)}.surface-playground__box--outlined-neutral-4,.surface-playground__box--outlined-neutral-5{background:transparent;color:var(--uxdsl__palette__neutral-main);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-neutral-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:1px solid var(--uxdsl__palette__neutral-main)}.surface-playground__box--outlined-none-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:var(--uxdsl__surface__outlined-border)}.surface-playground__box--outlined-none-0,.surface-playground__box--outlined-none-1{background:var(--uxdsl__surface__outlined-bg);color:var(--uxdsl__surface__outlined-color);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-none-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:var(--uxdsl__surface__outlined-border)}.surface-playground__box--outlined-none-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:var(--uxdsl__surface__outlined-border)}.surface-playground__box--outlined-none-2,.surface-playground__box--outlined-none-3{background:var(--uxdsl__surface__outlined-bg);color:var(--uxdsl__surface__outlined-color);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-none-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:var(--uxdsl__surface__outlined-border)}.surface-playground__box--outlined-none-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:var(--uxdsl__surface__outlined-border)}.surface-playground__box--outlined-none-4,.surface-playground__box--outlined-none-5{background:var(--uxdsl__surface__outlined-bg);color:var(--uxdsl__surface__outlined-color);box-shadow:var(--uxdsl__surface__outlined-shadow)}.surface-playground__box--outlined-none-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:var(--uxdsl__surface__outlined-border)}.surface-playground__box--flat-primary-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-primary-0,.surface-playground__box--flat-primary-1{background:transparent;color:var(--uxdsl__palette__primary-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-primary-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-primary-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-primary-2,.surface-playground__box--flat-primary-3{background:transparent;color:var(--uxdsl__palette__primary-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-primary-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-primary-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-primary-4,.surface-playground__box--flat-primary-5{background:transparent;color:var(--uxdsl__palette__primary-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-primary-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-secondary-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-secondary-0,.surface-playground__box--flat-secondary-1{background:transparent;color:var(--uxdsl__palette__secondary-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-secondary-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-secondary-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-secondary-2,.surface-playground__box--flat-secondary-3{background:transparent;color:var(--uxdsl__palette__secondary-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-secondary-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-secondary-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-secondary-4,.surface-playground__box--flat-secondary-5{background:transparent;color:var(--uxdsl__palette__secondary-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-secondary-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-success-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-success-0,.surface-playground__box--flat-success-1{background:transparent;color:var(--uxdsl__palette__success-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-success-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-success-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-success-2,.surface-playground__box--flat-success-3{background:transparent;color:var(--uxdsl__palette__success-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-success-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-success-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-success-4,.surface-playground__box--flat-success-5{background:transparent;color:var(--uxdsl__palette__success-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-success-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-info-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-info-0,.surface-playground__box--flat-info-1{background:transparent;color:var(--uxdsl__palette__info-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-info-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-info-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-info-2,.surface-playground__box--flat-info-3{background:transparent;color:var(--uxdsl__palette__info-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-info-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-info-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-info-4,.surface-playground__box--flat-info-5{background:transparent;color:var(--uxdsl__palette__info-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-info-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-warning-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-warning-0,.surface-playground__box--flat-warning-1{background:transparent;color:var(--uxdsl__palette__warning-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-warning-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-warning-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-warning-2,.surface-playground__box--flat-warning-3{background:transparent;color:var(--uxdsl__palette__warning-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-warning-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-warning-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-warning-4,.surface-playground__box--flat-warning-5{background:transparent;color:var(--uxdsl__palette__warning-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-warning-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-error-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-error-0,.surface-playground__box--flat-error-1{background:transparent;color:var(--uxdsl__palette__error-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-error-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-error-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-error-2,.surface-playground__box--flat-error-3{background:transparent;color:var(--uxdsl__palette__error-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-error-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-error-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-error-4,.surface-playground__box--flat-error-5{background:transparent;color:var(--uxdsl__palette__error-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-error-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-neutral-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-neutral-0,.surface-playground__box--flat-neutral-1{background:transparent;color:var(--uxdsl__palette__neutral-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-neutral-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-neutral-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-neutral-2,.surface-playground__box--flat-neutral-3{background:transparent;color:var(--uxdsl__palette__neutral-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-neutral-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-neutral-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-neutral-4,.surface-playground__box--flat-neutral-5{background:transparent;color:var(--uxdsl__palette__neutral-main);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-neutral-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-none-0{padding:var(--uxdsl__density__0);border-radius:var(--uxdsl__radius__0);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-none-0,.surface-playground__box--flat-none-1{background:var(--uxdsl__surface__flat-bg);color:var(--uxdsl__surface__flat-color);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-none-1{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-none-2{padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-none-2,.surface-playground__box--flat-none-3{background:var(--uxdsl__surface__flat-bg);color:var(--uxdsl__surface__flat-color);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-none-3{padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__3);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-none-4{padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__4);border:var(--uxdsl__surface__flat-border)}.surface-playground__box--flat-none-4,.surface-playground__box--flat-none-5{background:var(--uxdsl__surface__flat-bg);color:var(--uxdsl__surface__flat-color);box-shadow:var(--uxdsl__surface__flat-shadow)}.surface-playground__box--flat-none-5{padding:var(--uxdsl__density__5);border-radius:var(--uxdsl__radius__5);border:var(--uxdsl__surface__flat-border)}.demo-radius-0{border-radius:0!important}.demo-radius-1{border-radius:var(--uxdsl__radius__1)!important}.demo-radius-2{border-radius:var(--uxdsl__radius__2)!important}.demo-radius-3{border-radius:var(--uxdsl__radius__3)!important}.demo-radius-4{border-radius:var(--uxdsl__radius__4)!important}.demo-radius-5{border-radius:var(--uxdsl__radius__5)!important}.demo-shadow-0{box-shadow:none!important}.demo-shadow-1{box-shadow:var(--uxdsl__shadow__1)!important}.demo-shadow-2{box-shadow:var(--uxdsl__shadow__2)!important}.demo-shadow-3{box-shadow:var(--uxdsl__shadow__3)!important}.demo-shadow-4{box-shadow:var(--uxdsl__shadow__4)!important}.demo-shadow-5{box-shadow:var(--uxdsl__shadow__5)!important}}#DemoTypography{.typo-header,.typo-section{display:flex;flex-direction:column;gap:var(--uxdsl__density__2)}.demo-title{font-family:var(--uxdsl__typography__h4-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h4-size);line-height:var(--uxdsl__typography__h4-line,1.4);font-weight:var(--uxdsl__typography__h4-weight,600);letter-spacing:var(--uxdsl__typography__h4-spacing,normal);text-transform:var(--uxdsl__typography__h4-transform,none);text-decoration:var(--uxdsl__typography__h4-decoration,none);font-style:var(--uxdsl__typography__h4-style,normal);margin-block-start:var(--uxdsl__typography__h4-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h4-margin-block-end,auto);margin:0}.demo-subtitle{font-family:var(--uxdsl__typography__body-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-size);line-height:var(--uxdsl__typography__body-line,1.6);font-weight:var(--uxdsl__typography__body-weight,400);letter-spacing:var(--uxdsl__typography__body-spacing,normal);text-transform:var(--uxdsl__typography__body-transform,none);text-decoration:var(--uxdsl__typography__body-decoration,none);font-style:var(--uxdsl__typography__body-style,normal);margin-block-start:var(--uxdsl__typography__body-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-margin-block-end,auto);opacity:.75;margin:0;max-width:720px}.typo-stack{display:flex;flex-direction:column;gap:0}.typo-row{gap:var(--uxdsl__density__4);padding:var(--uxdsl__density__3) 0;border-bottom:1px solid var(--uxdsl__palette__surface-dark);&:last-child{border-bottom:none}}.typo-row,.typo-row__meta{display:flex;align-items:flex-start}.typo-row__meta{width:50px;flex-shrink:0;flex-direction:column;gap:var(--uxdsl__space__1);border-right:1px solid var(--uxdsl__palette__surface-dark);padding-right:var(--uxdsl__density__1)}.typo-row__label{font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);font-size:.6rem;font-weight:400;color:var(--uxdsl__palette__text-secondary);opacity:.6;line-height:1.2;text-transform:none}.typo-row__edit{background:transparent;border:none;cursor:pointer;padding:0;color:var(--uxdsl__palette__secondary-main);display:flex;align-items:center;justify-content:center;opacity:.6;transition:all .2s;margin-top:var(--uxdsl__space__2);&:hover{opacity:1;border-color:var(--uxdsl__palette__secondary-main);background:color-mix(in srgb,var(--uxdsl__palette__surface-dark) 10%,transparent)}}.typo-row__content{flex:1}.sample-h1{font-family:var(--uxdsl__typography__h1-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h1-size);line-height:var(--uxdsl__typography__h1-line,1.1);font-weight:var(--uxdsl__typography__h1-weight,700);letter-spacing:var(--uxdsl__typography__h1-spacing,-.02em);text-transform:var(--uxdsl__typography__h1-transform,none);text-decoration:var(--uxdsl__typography__h1-decoration,none);font-style:var(--uxdsl__typography__h1-style,normal);margin-block-start:var(--uxdsl__typography__h1-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h1-margin-block-end,auto);margin:0}.sample-h2{font-family:var(--uxdsl__typography__h2-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h2-size);line-height:var(--uxdsl__typography__h2-line,1.2);font-weight:var(--uxdsl__typography__h2-weight,700);letter-spacing:var(--uxdsl__typography__h2-spacing,-.01em);text-transform:var(--uxdsl__typography__h2-transform,none);text-decoration:var(--uxdsl__typography__h2-decoration,none);font-style:var(--uxdsl__typography__h2-style,normal);margin-block-start:var(--uxdsl__typography__h2-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h2-margin-block-end,auto);margin:0;font-weight:var(--uxdsl__typography__p-weight)}.sample-h2,.sample-h3{font-size:var(--uxdsl__typography__h3-size)}.sample-h3{font-family:var(--uxdsl__typography__h3-font-family,var(--uxdsl__font__ui));line-height:var(--uxdsl__typography__h3-line,1.3);font-weight:var(--uxdsl__typography__h3-weight,600);letter-spacing:var(--uxdsl__typography__h3-spacing,normal);text-transform:var(--uxdsl__typography__h3-transform,none);text-decoration:var(--uxdsl__typography__h3-decoration,none);font-style:var(--uxdsl__typography__h3-style,normal);margin-block-start:var(--uxdsl__typography__h3-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h3-margin-block-end,auto);margin:0}.sample-h4{font-family:var(--uxdsl__typography__h4-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h4-size);line-height:var(--uxdsl__typography__h4-line,1.4);font-weight:var(--uxdsl__typography__h4-weight,600);letter-spacing:var(--uxdsl__typography__h4-spacing,normal);text-transform:var(--uxdsl__typography__h4-transform,none);text-decoration:var(--uxdsl__typography__h4-decoration,none);font-style:var(--uxdsl__typography__h4-style,normal);margin-block-start:var(--uxdsl__typography__h4-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h4-margin-block-end,auto);margin:0}.sample-h5{font-family:var(--uxdsl__typography__h5-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__h5-size);line-height:var(--uxdsl__typography__h5-line,1.4);font-weight:var(--uxdsl__typography__h5-weight,600);letter-spacing:var(--uxdsl__typography__h5-spacing,normal);text-transform:var(--uxdsl__typography__h5-transform,none);text-decoration:var(--uxdsl__typography__h5-decoration,none);font-style:var(--uxdsl__typography__h5-style,normal);margin-block-start:var(--uxdsl__typography__h5-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h5-margin-block-end,auto);margin:0}.sample-h6{font-family:var(--uxdsl__typography__h6-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__h6-size);line-height:var(--uxdsl__typography__h6-line,1.4);font-weight:var(--uxdsl__typography__h6-weight,600);letter-spacing:var(--uxdsl__typography__h6-spacing,normal);text-transform:var(--uxdsl__typography__h6-transform,none);text-decoration:var(--uxdsl__typography__h6-decoration,none);font-style:var(--uxdsl__typography__h6-style,normal);margin-block-start:var(--uxdsl__typography__h6-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h6-margin-block-end,auto);margin:0}.sample-p{font-family:var(--uxdsl__typography__p-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__p-size);line-height:var(--uxdsl__typography__p-line,1.6);font-weight:var(--uxdsl__typography__p-weight,400);letter-spacing:var(--uxdsl__typography__p-spacing,normal);text-transform:var(--uxdsl__typography__p-transform,none);text-decoration:var(--uxdsl__typography__p-decoration,none);font-style:var(--uxdsl__typography__p-style,normal);margin-block-start:var(--uxdsl__typography__p-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__p-margin-block-end,auto);margin:0}.sample-span{font-family:var(--uxdsl__typography__span-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__span-size);line-height:var(--uxdsl__typography__span-line,1.5);font-weight:var(--uxdsl__typography__span-weight,400);letter-spacing:var(--uxdsl__typography__span-spacing,normal);text-transform:var(--uxdsl__typography__span-transform,none);text-decoration:var(--uxdsl__typography__span-decoration,none);font-style:var(--uxdsl__typography__span-style,normal);margin-block-start:var(--uxdsl__typography__span-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__span-margin-block-end,auto)}.sample-body{font-family:var(--uxdsl__typography__body-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-size);line-height:var(--uxdsl__typography__body-line,1.6);font-weight:var(--uxdsl__typography__body-weight,400);letter-spacing:var(--uxdsl__typography__body-spacing,normal);text-transform:var(--uxdsl__typography__body-transform,none);text-decoration:var(--uxdsl__typography__body-decoration,none);font-style:var(--uxdsl__typography__body-style,normal);margin-block-start:var(--uxdsl__typography__body-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-margin-block-end,auto);margin:0}.sample-caption{font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);margin:0}.sample-small{font-family:var(--uxdsl__typography__small-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__small-size);line-height:var(--uxdsl__typography__small-line,1.4);letter-spacing:var(--uxdsl__typography__small-spacing,normal);text-transform:var(--uxdsl__typography__small-transform,none);text-decoration:var(--uxdsl__typography__small-decoration,none);font-style:var(--uxdsl__typography__small-style,normal);margin-block-start:var(--uxdsl__typography__small-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__small-margin-block-end,auto);opacity:var(--uxdsl__typography__small-opacity,.8);margin:0}.sample-pre{font-family:var(--uxdsl__typography__pre-font-family,var(--uxdsl__font__code),monospace);font-size:var(--uxdsl__typography__pre-size);line-height:var(--uxdsl__typography__pre-line,1.5);text-transform:var(--uxdsl__typography__pre-transform,none);text-decoration:var(--uxdsl__typography__pre-decoration,none);font-style:var(--uxdsl__typography__pre-style,normal);margin-block-start:var(--uxdsl__typography__pre-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__pre-margin-block-end,auto);margin:0;background:color-mix(in srgb,var(--uxdsl__palette__surface-dark) 5%,transparent);padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__1)}}.level-controls{display:flex;align-items:center;gap:var(--uxdsl__density__4);padding:0 var(--uxdsl__density__2);margin-left:auto}.level-label{font-size:.8rem;font-weight:600;color:var(--uxdsl__palette__text-secondary);text-transform:uppercase}.level-input-wrapper{display:flex;align-items:center;gap:var(--uxdsl__density__2)}.level-value{font-family:font(code);font-size:.9rem;font-weight:700;color:var(--uxdsl__palette__primary-main);min-width:20px;text-align:center}.playground-layout{display:flex;flex-direction:column;height:100%;gap:var(--uxdsl__density__6)}.viz-container{flex:1;display:flex;justify-content:center;background:var(--uxdsl__palette__surface-dark);border-radius:var(--uxdsl__radius__2);padding:var(--uxdsl__density__8) var(--uxdsl__density__4);overflow:hidden;min-height:300px}.density-playground-wrapper{width:100%;transition:width .3s ease;border-left:1px solid var(--uxdsl__palette__divider-main);border-right:1px solid var(--uxdsl__palette__divider-main);display:flex;align-items:center;justify-content:center;position:relative;container-type:inline-size}.auto-width-label{position:absolute;top:-1.5rem;font-size:.7rem;color:var(--uxdsl__palette__text-disabled);text-transform:uppercase}.density-doll-wrapper{border:none;background:transparent}.json-editor{background:var(--uxdsl__palette__surface-main);padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__1);border:1px dashed var(--uxdsl__palette__neutral-main);font-family:font(code);font-size:.9rem;color:var(--uxdsl__palette__primary-dark);overflow-x:auto;display:flex;flex-direction:column;gap:var(--uxdsl__density__1)}.json-header{display:flex;align-items:center;justify-content:space-between}.json-key{font-weight:600}.json-line{display:flex;align-items:center;justify-content:space-between;width:100%;padding-left:2ch}.json-value-wrapper{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.json-prop-key{color:var(--uxdsl__palette__secondary-main)}.edit-button{background:transparent;border:1px solid var(--uxdsl__palette__divider-main);border-radius:var(--uxdsl__radius__1);padding:var(--uxdsl__density__1);cursor:pointer;color:var(--uxdsl__palette__text-secondary);display:flex;align-items:center;justify-content:center;transition:all .2s;margin-left:var(--uxdsl__density__4);&:hover{color:var(--uxdsl__palette__primary-main);border-color:var(--uxdsl__palette__primary-main)}}.level-range-input{width:100px;cursor:pointer}.highlighter-base{color:var(--uxdsl__palette__info-main)}.highlighter-active{color:var(--uxdsl__palette__secondary-light);text-shadow:0 0 8px rgba(255,77,77,.4);font-weight:700;text-decoration:underline}.hero-background{position:absolute;inset:0;overflow:hidden;pointer-events:none;border-radius:inherit;z-index:0}.hero-background__blob{position:absolute;left:0;top:0;border-radius:50%;will-change:transform}.hero-background__blob--secondary{width:600px;height:600px;background:radial-gradient(circle,var(--uxdsl__palette__secondary-main) 0,transparent 60%);opacity:var(--blob-opacity,.05);filter:blur(80px)}.hero-background__blob--primary{width:500px;height:500px;background:radial-gradient(circle,var(--uxdsl__palette__primary-main) 0,transparent 60%);opacity:var(--blob-opacity,.08);filter:blur(60px)}.hero-background__blob--dark{width:400px;height:400px;background:radial-gradient(circle,var(--uxdsl__palette__primary-dark) 0,transparent 70%);opacity:0;filter:blur(40px);mix-blend-mode:multiply}.hero-background__overlay{position:absolute;inset:0;backdrop-filter:blur(20px);opacity:.5}#HomeDemo{.home-demo{display:flex;flex-direction:column;align-items:center;gap:var(--uxdsl__density__6);margin-top:var(--uxdsl__density__6)}.home-code{background:#1e1e1e;border-radius:var(--uxdsl__radius__3);overflow:hidden;color:#d4d4d4;font-family:monospace;font-size:.85rem;border:1px solid var(--uxdsl__palette__neutral-light);box-shadow:var(--uxdsl__shadow__2);width:100%;max-width:500px}.code-header{background:#252526;padding:var(--uxdsl__density__2) var(--uxdsl__density__3);border-bottom:1px solid #333;display:flex;align-items:center}.code-lang{font-size:.75rem;color:#9cdcfe;font-weight:700;text-transform:uppercase;letter-spacing:1px}.home-code pre{margin:0;overflow-x:auto;line-height:1.5}.home-code pre,.mb-card{padding:var(--uxdsl__density__3)}.mb-card{border-radius:var(--uxdsl__surface__contained-radius);background:var(--uxdsl__surface__contained-bg);color:var(--uxdsl__surface__contained-color);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);width:100%;gap:var(--uxdsl__density__4);display:flex;flex-direction:column;.mb-header{display:flex;justify-content:space-between;align-items:center;h3{font-family:var(--uxdsl__typography__h5-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__h5-size);line-height:var(--uxdsl__typography__h5-line,1.4);font-weight:var(--uxdsl__typography__h5-weight,600);letter-spacing:var(--uxdsl__typography__h5-spacing,normal);text-transform:var(--uxdsl__typography__h5-transform,none);text-decoration:var(--uxdsl__typography__h5-decoration,none);font-style:var(--uxdsl__typography__h5-style,normal);margin-block-start:var(--uxdsl__typography__h5-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h5-margin-block-end,auto);margin:0}}.mb-badge{font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);background:color-mix(in srgb,var(--uxdsl__palette__success-light) 20%,transparent);color:var(--uxdsl__palette__success-dark);padding:var(--uxdsl__density__1) var(--uxdsl__density__2);border-radius:9999px;font-weight:700;margin-left:var(--uxdsl__density__2)}.mb-title-group{display:flex;align-items:center}.mb-status-dot{width:12px;height:12px;background:var(--uxdsl__palette__success-main);border-radius:9999px;box-shadow:0 0 0 4px color-mix(in srgb,var(--uxdsl__palette__success-light) 20%,transparent);animation:pulse 2s infinite}.mb-stat{display:flex;flex-direction:column;gap:var(--uxdsl__density__1);margin-bottom:var(--uxdsl__density__3);.mb-stat-header{display:flex;justify-content:space-between;font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);font-weight:600}}.mb-bar{height:8px;background:var(--uxdsl__palette__neutral-light);border-radius:9999px;overflow:hidden;div{height:100%;background:var(--uxdsl__palette__primary-main);border-radius:9999px}}.mb-action{padding:var(--uxdsl__surface__contained-padding);border-radius:var(--uxdsl__surface__contained-radius);background:var(--uxdsl__palette__primary-main);color:var(--uxdsl__palette__primary-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);--uxdsl__button__tone-main:var(--uxdsl__palette__primary-main);--uxdsl__button__tone-dark:var(--uxdsl__palette__primary-dark);--uxdsl__button__tone-contrast:var(--uxdsl__palette__primary-contrast);width:100%;justify-content:center}.mb-action:hover{background:var(--uxdsl__button__contained-tone-primary-hover-bg,var(--uxdsl__button__contained-hover-bg));color:var(--uxdsl__button__contained-tone-primary-hover-color,var(--uxdsl__button__contained-hover-color))}.mb-action.is-selected,.mb-action[aria-pressed=true],.mb-action[aria-selected=true]{background:var(--uxdsl__button__contained-tone-primary-selected-bg,var(--uxdsl__button__contained-selected-bg));color:var(--uxdsl__button__contained-tone-primary-selected-color,var(--uxdsl__button__contained-selected-color))}}@media (min-width:768px){.mb-card{width:420px;padding:var(--uxdsl__density__5)}}}.demos-grid{display:grid;grid-template-columns:1fr;gap:var(--uxdsl__density__4);width:100%;@media (min-width:1024px){grid-template-columns:repeat(2,1fr)}}.demo-item{min-width:0}.demo-item-full{@media (min-width:1024px){grid-column:span 2}}.home-demos{width:100%;display:flex;flex-direction:column;gap:var(--uxdsl__density__3)}.home-demos__actions{width:100%;display:flex;justify-content:center}.home-demos__toggle{padding:var(--uxdsl__density__1);border-radius:var(--uxdsl__radius__1);background:transparent;color:var(--uxdsl__palette__secondary-main);border:var(--uxdsl__surface__flat-border);box-shadow:var(--uxdsl__surface__flat-shadow);--uxdsl__button__tone-main:var(--uxdsl__palette__secondary-main);--uxdsl__button__tone-dark:var(--uxdsl__palette__secondary-dark);--uxdsl__button__tone-contrast:var(--uxdsl__palette__secondary-contrast);min-width:6rem;opacity:.85;&:hover{opacity:1}}.home-demos__toggle:hover{color:var(--uxdsl__button__flat-tone-secondary-hover-color,var(--uxdsl__button__flat-hover-color))}.home-demos__toggle.is-selected,.home-demos__toggle[aria-pressed=true],.home-demos__toggle[aria-selected=true]{color:var(--uxdsl__button__flat-tone-secondary-selected-color,var(--uxdsl__button__flat-selected-color))}#InputDemo{.section,.surfaces-grid{margin-block:var(--uxdsl__density__3)}.surfaces-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--uxdsl__density__3)}pre{overflow-x:auto}label{margin-inline-end:var(--uxdsl__density__2)}}.InteractiveDemoContainer{padding:var(--uxdsl__surface__outlined-padding);border-radius:var(--uxdsl__surface__outlined-radius);background:var(--uxdsl__surface__outlined-bg);color:var(--uxdsl__surface__outlined-color);border:var(--uxdsl__surface__outlined-border);box-shadow:var(--uxdsl__surface__outlined-shadow);font-family:var(--uxdsl__typography__body-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-size);line-height:var(--uxdsl__typography__body-line,1.6);font-weight:var(--uxdsl__typography__body-weight,400);letter-spacing:var(--uxdsl__typography__body-spacing,normal);text-transform:var(--uxdsl__typography__body-transform,none);text-decoration:var(--uxdsl__typography__body-decoration,none);font-style:var(--uxdsl__typography__body-style,normal);margin-block-start:var(--uxdsl__typography__body-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-margin-block-end,auto);display:flex;flex-direction:column;height:100%;overflow:hidden;border-radius:var(--uxdsl__radius__2)}.InteractiveDemoContainer__header{display:flex;justify-content:space-between;align-items:center;gap:var(--uxdsl__density__4);padding:var(--uxdsl__density__3) var(--uxdsl__density__4);border-bottom:1px solid var(--uxdsl__palette__neutral-light);background:var(--uxdsl__palette__surface-main);flex-shrink:0}.InteractiveDemoContainer__headerLeft{display:flex;align-items:center;gap:var(--uxdsl__density__4);flex:1;min-width:0}.InteractiveDemoContainer__title{font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);font-weight:700;letter-spacing:.05em;color:var(--uxdsl__palette__text-secondary);text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.InteractiveDemoContainer__action{margin-left:var(--uxdsl__density__4);flex-shrink:0}.InteractiveDemoContainer__toolbar{padding:var(--uxdsl__density__3) var(--uxdsl__density__4);border-bottom:1px solid var(--uxdsl__palette__neutral-light);background:var(--uxdsl__palette__surface-light);display:flex;flex-direction:column;gap:var(--uxdsl__density__2);flex-shrink:0}.InteractiveDemoContainer__bodyScroll{flex:1;overflow:auto;position:relative;display:flex;flex-direction:column}.InteractiveDemoContainer__bodyInner{padding:var(--uxdsl__density__4);flex:1}.navigation-card-link{border-radius:var(--uxdsl__surface__contained-radius);background:var(--uxdsl__surface__contained-bg);color:var(--uxdsl__surface__contained-color);box-shadow:var(--uxdsl__surface__contained-shadow);width:100%;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;padding:var(--uxdsl__density__4);gap:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__2);text-decoration:none;color:inherit;transition:all .2s ease-in-out;border:1px solid transparent;background:var(--uxdsl__palette__surface-main);&:hover{transform:translateY(-2px);box-shadow:var(--uxdsl__shadow__3);border-color:color-mix(in srgb,var(--uxdsl__palette__primary-light) 30%,transparent);.nav-card-arrow{transform:translateX(4px);color:var(--uxdsl__palette__primary-main)}}.nav-card-content{display:flex;align-items:center;gap:var(--uxdsl__density__4);flex:1}.nav-card-icon{display:grid;place-items:center;width:var(--uxdsl__density__10);height:var(--uxdsl__density__10);border-radius:var(--uxdsl__radius__2);flex-shrink:0;&.primary{background:color-mix(in srgb,var(--uxdsl__palette__primary-light) 10%,transparent);color:var(--uxdsl__palette__primary-main)}&.secondary{background:transparent;border:1px solid color-mix(in srgb,var(--uxdsl__palette__secondary-main) 30%,transparent);color:var(--uxdsl__palette__secondary-main)}}.nav-card-text{display:flex;flex-direction:column;gap:var(--uxdsl__density__1);text-align:left}.nav-card-title{font-family:var(--uxdsl__typography__h4-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h4-size);line-height:var(--uxdsl__typography__h4-line,1.4);font-weight:var(--uxdsl__typography__h4-weight,600);letter-spacing:var(--uxdsl__typography__h4-spacing,normal);text-transform:var(--uxdsl__typography__h4-transform,none);text-decoration:var(--uxdsl__typography__h4-decoration,none);font-style:var(--uxdsl__typography__h4-style,normal);margin-block-start:var(--uxdsl__typography__h4-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h4-margin-block-end,auto);margin:0;color:var(--uxdsl__palette__surface-contrast)}.nav-card-desc{font-family:var(--uxdsl__typography__span-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__span-size);line-height:var(--uxdsl__typography__span-line,1.5);font-weight:var(--uxdsl__typography__span-weight,400);letter-spacing:var(--uxdsl__typography__span-spacing,normal);text-transform:var(--uxdsl__typography__span-transform,none);text-decoration:var(--uxdsl__typography__span-decoration,none);font-style:var(--uxdsl__typography__span-style,normal);margin-block-start:var(--uxdsl__typography__span-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__span-margin-block-end,auto);margin:0;color:var(--uxdsl__palette__secondary-main)}.nav-card-arrow{color:var(--uxdsl__palette__secondary-light);transition:all .2s}&.variant-secondary{background:transparent;border:var(--uxdsl__border__1);box-shadow:none;&:hover{background:color-mix(in srgb,var(--uxdsl__palette__surface-light) 50%,transparent);border-color:var(--uxdsl__palette__primary-main);box-shadow:var(--uxdsl__shadow__2)}}}#PageTitle{.page-title{text-align:center;display:flex;flex-direction:column;gap:var(--uxdsl__density__2);padding:var(--uxdsl__density__6) 0 var(--uxdsl__density__4)}.page-title__text{font-family:var(--uxdsl__typography__h1-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h1-size);line-height:var(--uxdsl__typography__h1-line,1.1);font-weight:var(--uxdsl__typography__h1-weight,700);letter-spacing:var(--uxdsl__typography__h1-spacing,-.02em);text-transform:var(--uxdsl__typography__h1-transform,none);text-decoration:var(--uxdsl__typography__h1-decoration,none);font-style:var(--uxdsl__typography__h1-style,normal);margin-block-start:var(--uxdsl__typography__h1-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h1-margin-block-end,auto);margin:0;background:linear-gradient(135deg,var(--uxdsl__palette__primary-main) 0,var(--uxdsl__palette__primary-light) 50%,var(--uxdsl__palette__secondary-main) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;color:var(--uxdsl__palette__primary-main)}.page-title__subtitle{font-family:var(--uxdsl__typography__h4-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h4-size);line-height:var(--uxdsl__typography__h4-line,1.4);font-weight:var(--uxdsl__typography__h4-weight,600);letter-spacing:var(--uxdsl__typography__h4-spacing,normal);text-transform:var(--uxdsl__typography__h4-transform,none);text-decoration:var(--uxdsl__typography__h4-decoration,none);font-style:var(--uxdsl__typography__h4-style,normal);margin-block-start:var(--uxdsl__typography__h4-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h4-margin-block-end,auto);color:var(--uxdsl__palette__surface-contrast);margin:0;line-height:1.4;font-weight:400}.page-title__subtext{font-family:var(--uxdsl__typography__body-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-size);line-height:var(--uxdsl__typography__body-line,1.6);font-weight:var(--uxdsl__typography__body-weight,400);letter-spacing:var(--uxdsl__typography__body-spacing,normal);text-transform:var(--uxdsl__typography__body-transform,none);text-decoration:var(--uxdsl__typography__body-decoration,none);font-style:var(--uxdsl__typography__body-style,normal);margin-block-start:var(--uxdsl__typography__body-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-margin-block-end,auto);color:color-mix(in srgb,var(--uxdsl__palette__surface-contrast) 85%,transparent);margin-top:var(--uxdsl__density__1);display:block}}#PageToolbar{width:100%;background:var(--uxdsl__palette__surface-light);border-bottom:1px solid var(--uxdsl__palette__neutral-light);position:-webkit-sticky;position:sticky;top:0;z-index:1100}#PageToolbar .page-toolbar{max-width:1400px;margin:0 auto;padding:var(--uxdsl__density__1) var(--uxdsl__density__4);display:flex;justify-content:space-between;align-items:center;min-height:var(--uxdsl__density__7);flex-wrap:nowrap}#PageToolbar .page-toolbar__left{display:flex;align-items:center;gap:var(--uxdsl__density__2);flex:1;min-width:0;overflow:hidden}#PageToolbar .page-toolbar__title{font-family:var(--uxdsl__typography__body-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-size);line-height:var(--uxdsl__typography__body-line,1.6);font-weight:var(--uxdsl__typography__body-weight,400);letter-spacing:var(--uxdsl__typography__body-spacing,normal);text-transform:var(--uxdsl__typography__body-transform,none);text-decoration:var(--uxdsl__typography__body-decoration,none);font-style:var(--uxdsl__typography__body-style,normal);margin-block-start:var(--uxdsl__typography__body-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-margin-block-end,auto);color:var(--uxdsl__palette__text-secondary);display:flex;align-items:center;gap:var(--uxdsl__density__1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#PageToolbar .breadcrumb-link-brand{text-decoration:none;color:inherit;font-weight:800;text-transform:uppercase;letter-spacing:.5px;transition:transform .2s;display:flex;align-items:center;gap:var(--uxdsl__density__1);flex-shrink:0;&:hover{transform:translateY(-1px);color:var(--uxdsl__palette__primary-main)}}#PageToolbar .page-toolbar__brand-text{font-family:var(--uxdsl__typography__body-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-size);line-height:var(--uxdsl__typography__body-line,1.6);font-weight:var(--uxdsl__typography__body-weight,400);letter-spacing:var(--uxdsl__typography__body-spacing,normal);text-transform:var(--uxdsl__typography__body-transform,none);text-decoration:var(--uxdsl__typography__body-decoration,none);font-style:var(--uxdsl__typography__body-style,normal);margin-block-start:var(--uxdsl__typography__body-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-margin-block-end,auto);color:var(--uxdsl__palette__primary-main);font-weight:800}#PageToolbar .breadcrumb-link{color:inherit;text-decoration:none;transition:color .2s;&:hover{color:var(--uxdsl__palette__primary-main);text-decoration:underline}}#PageToolbar .breadcrumb-separator{color:var(--uxdsl__palette__neutral-dark);opacity:.5}#PageToolbar .page-toolbar__burger{background:transparent;border:none;color:var(--uxdsl__palette__secondary-main);cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;flex-shrink:0}#PageToolbar .page-toolbar__burger:hover{color:var(--uxdsl__palette__secondary-dark);background:transparent}@media (min-width:1024px){#PageToolbar .page-toolbar__burger{display:none}}#PageToolbar .page-toolbar__right{flex-direction:row;margin-left:var(--uxdsl__density__2);flex-shrink:0;font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8)}#PageToolbar .page-toolbar__info-row,#PageToolbar .page-toolbar__right{display:flex;align-items:center;gap:var(--uxdsl__density__4)}#PageToolbar .page-toolbar__theme-row{display:flex;align-items:center;gap:var(--uxdsl__density__2);opacity:0;transform:translateX(10px);pointer-events:none;transition:all .3s cubic-bezier(.4,0,.2,1);&.visible{opacity:1;transform:translateX(0);pointer-events:auto}}#PageToolbar .page-toolbar__bp{background:color-mix(in srgb,var(--uxdsl__palette__secondary-light) 10%,transparent);padding:var(--uxdsl__density__1) var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__1)}#PageToolbar .page-toolbar__bp,#PageToolbar .page-toolbar__width{font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);line-height:1}#PageToolbar .page-toolbar__width{opacity:.7;display:none;@media (min-width:768px){display:block}}#PageToolbar .mini-theme-btn{width:12px;height:12px;border-radius:50%;border:1px solid rgba(0,0,0,.1);padding:0;cursor:pointer;opacity:.5;transition:all .2s;&.active,&:hover{opacity:1;transform:scale(1.2);border-color:color-mix(in srgb,var(--uxdsl__palette__surface-contrast) 50%,transparent)}&.default{background:#2c415c}&.green{background:#15803d}&.purple{background:#7b1fa2}}#PageToolbar .mini-theme-toggle{width:12px;height:12px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;padding:0;cursor:pointer;color:var(--uxdsl__palette__text-secondary);opacity:.7;transition:color .2s;&:hover{opacity:1;color:var(--uxdsl__palette__primary-main)}}#PalettePlayground{.playground-wrapper{display:flex;flex-direction:column;gap:var(--uxdsl__density__3)}.playground-controls{display:flex;flex-wrap:wrap;gap:var(--uxdsl__density__2);align-items:center;width:100%}.control-group{display:flex;flex-direction:column;gap:var(--uxdsl__density__1);flex:1;min-width:140px}.control-label{font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);color:var(--uxdsl__palette__neutral-dark);font-weight:600;text-transform:uppercase;letter-spacing:.05em}.control-select{padding:var(--uxdsl__density__1) var(--uxdsl__density__2);border:1px solid var(--uxdsl__palette__neutral-light);border-radius:var(--uxdsl__radius__1);background:var(--uxdsl__palette__surface-main);color:var(--uxdsl__palette__surface-contrast);font-size:.9rem;cursor:pointer;width:100%;&:focus,&:hover{border-color:var(--uxdsl__palette__primary-main)}&:focus{outline:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--uxdsl__palette__primary-main) 20%,transparent)}}.preview-container{display:flex;flex-direction:column;gap:var(--uxdsl__density__3);background:var(--uxdsl__palette__surface-light);padding:var(--uxdsl__density__3);border:1px dashed var(--uxdsl__palette__neutral-light)}.live-preview,.preview-container{border-radius:var(--uxdsl__radius__2)}.live-preview{min-height:120px;display:grid;place-items:center;box-shadow:var(--uxdsl__shadow__1);transition:all .3s ease}.code-block{padding:var(--uxdsl__surface__contained-padding);border-radius:var(--uxdsl__surface__contained-radius);background:var(--uxdsl__surface__contained-bg);color:var(--uxdsl__surface__contained-color);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);background:var(--uxdsl__palette__neutral-dark);border-radius:var(--uxdsl__radius__2);overflow:hidden}.code-header{background:color-mix(in srgb,var(--uxdsl__palette__neutral-dark) 50%,transparent);padding:var(--uxdsl__density__1) var(--uxdsl__density__2);border-bottom:1px solid color-mix(in srgb,var(--uxdsl__palette__neutral-main) 10%,transparent)}.code-filename{font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);font-family:monospace;color:var(--uxdsl__palette__neutral-light)}}.inspector-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--uxdsl__density__4)}.selector-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--uxdsl__density__3)}.inspector-item{display:flex;align-items:center;gap:var(--uxdsl__density__4);background:var(--uxdsl__palette__surface-main);padding:.75rem;border-radius:6px;border:1px solid var(--uxdsl__palette__neutral-light)}.inspector-item-details{display:flex;flex-direction:column}.inspector-item-meta{display:flex;gap:var(--uxdsl__density__2);align-items:center}.live-preview-box{background:color-mix(in srgb,var(--uxdsl__palette__surface-dark) 5%,transparent);border-radius:var(--uxdsl__radius__1);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:flex-start;border-top:1px dashed color-mix(in srgb,var(--uxdsl__palette__neutral-light) 50%,transparent);border-bottom:1px dashed color-mix(in srgb,var(--uxdsl__palette__neutral-light) 50%,transparent);&:after,&:before,.bottom-left-corner:after,.top-right-corner:before{content:"";position:absolute;width:10px;height:10px;border-color:color-mix(in srgb,var(--uxdsl__palette__neutral-main) 30%,transparent);border-style:solid;z-index:1}&:before{top:0;left:0;border-width:1px 0 0 1px}&:after{bottom:0;right:0;border-width:0 1px 1px 0}.top-right-corner:before{top:0;right:0;border-color:color-mix(in srgb,var(--uxdsl__palette__neutral-main) 30%,transparent);border-style:solid;border-width:1px 1px 0 0}.bottom-left-corner:after,.top-right-corner:before{content:"";position:absolute;width:10px;height:10px;z-index:1}.bottom-left-corner:after{bottom:0;left:0;border-color:color-mix(in srgb,var(--uxdsl__palette__neutral-main) 30%,transparent);border-style:solid;border-width:0 0 1px 1px}}.demo-layout-grid{display:flex;flex-direction:column;gap:var(--uxdsl__density__4)}.demo-logic-column{display:grid;grid-template-columns:1fr;gap:var(--uxdsl__density__4);align-items:start}@media (min-width:1024px){.demo-logic-column{grid-template-columns:2fr 1fr;gap:var(--uxdsl__density__6)}}.typography-showcase{margin-top:var(--uxdsl__density__6);padding:var(--uxdsl__density__4);background:var(--uxdsl__palette__surface-main);border-radius:var(--uxdsl__radius__2);border:1px solid var(--uxdsl__palette__divider-main)}.showcase-title{font-size:.9rem;font-weight:600;color:var(--uxdsl__palette__text-secondary);text-transform:uppercase;margin-bottom:var(--uxdsl__density__4);letter-spacing:.05em}.showcase-grid{display:flex;flex-direction:column;width:100%}.showcase-item{display:grid;grid-template-columns:4rem 1fr;align-items:center;gap:var(--uxdsl__density__4);padding:var(--uxdsl__density__2) 0;border-bottom:1px dashed var(--uxdsl__palette__divider-main);&:last-child{border-bottom:none}}.showcase-tag{font-family:font(code);font-size:.75rem;color:var(--uxdsl__palette__text-secondary);text-align:right;padding-right:var(--uxdsl__density__2);border-right:2px solid var(--uxdsl__palette__primary-main);height:100%;display:flex;align-items:center;justify-content:flex-end}.showcase-text{color:var(--uxdsl__palette__text-primary);margin:0!important;padding:0!important;border:1px solid color-mix(in srgb,var(--uxdsl__palette__neutral-main) 20%,transparent);background:var(--uxdsl__palette__surface-main);width:100%;text-align:left}.live-preview-section{margin-bottom:1.5rem;border-bottom:1px solid var(--uxdsl__palette__neutral-light);display:flex;justify-content:flex-start;background:var(--uxdsl__palette__surface-dark);border-radius:8px;padding:2rem 1rem;overflow:hidden}.live-preview-box{transition:all .3s cubic-bezier(.4,0,.2,1);margin:0 auto;background:transparent;border-left:1px solid var(--uxdsl__palette__divider-main);border-right:1px solid var(--uxdsl__palette__divider-main);min-height:120px;padding:0}.architectural-guide-center{position:absolute;top:0;bottom:0;left:50%;width:1px;background:var(--uxdsl__palette__divider-main);opacity:.1;pointer-events:none}.text-container-wrapper{position:relative;width:100%;max-width:100%;display:flex;justify-content:flex-start}.line-height-indicator{left:-8px;width:4px;border-left:1px solid var(--uxdsl__palette__primary-main);border-top:1px solid var(--uxdsl__palette__primary-main);border-bottom:1px solid var(--uxdsl__palette__primary-main);opacity:.3}.content-bounds-indicator,.line-height-indicator{position:absolute;top:0;bottom:0;pointer-events:none}.content-bounds-indicator{left:0;right:0;border:1px dashed var(--uxdsl__palette__primary-light);opacity:.15}.controls-section{display:flex;flex-direction:column;gap:1rem;margin-bottom:1rem;width:100%}.controls-row-bottom{display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;width:100%;gap:1rem}.controls-group{display:flex;align-items:center;gap:.25rem;background:var(--uxdsl__palette__surface-main);padding:2px;border-radius:6px;border:1px solid var(--uxdsl__palette__neutral-main);flex:1 1 auto;min-width:0}.control-button{padding:4px 12px;background:transparent;color:var(--uxdsl__palette__text-secondary);border:none;border-radius:4px;cursor:pointer;font-size:.8rem;display:flex;align-items:center;justify-content:center;&.active{background:var(--uxdsl__palette__primary-light);color:var(--uxdsl__palette__primary-contrast)}&.is-default{padding:4px 8px}}.element-select-group{display:flex;align-items:center;gap:.5rem;flex:1 1 180px;min-width:0;label{font-size:.8rem;opacity:.7}select{box-sizing:border-box;font:inherit;width:100%;padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);background:var(--uxdsl__surface__outlined-bg);color:var(--uxdsl__surface__outlined-color);border:var(--uxdsl__surface__outlined-border);box-shadow:var(--uxdsl__surface__outlined-shadow);caret-color:var(--uxdsl__input__outlined-base-caret);width:auto;cursor:pointer;min-width:120px;max-width:100%}select::placeholder{color:var(--uxdsl__input__outlined-base-placeholder)}select:focus{border:var(--uxdsl__input__outlined-focus-border)}select:invalid,select[aria-invalid=true]{border:var(--uxdsl__input__outlined-invalid-border)}select:disabled,select[aria-disabled=true]{opacity:var(--uxdsl__input__outlined-disabled-opacity)}}.ai-prompt-group{display:flex;align-items:center;gap:.5rem;width:100%;min-width:0;flex-wrap:nowrap;.input-wrapper{position:relative;flex:0 1 66%;min-width:0;display:flex;align-items:center;.ai-icon-btn{position:absolute;left:4px;background:transparent;border:none;cursor:pointer;color:var(--uxdsl__palette__neutral-main);opacity:.5;padding:2px;display:flex;align-items:center;justify-content:center;z-index:2;&:hover{opacity:1;color:var(--uxdsl__palette__primary-main)}}input{min-width:0;box-sizing:border-box;font:inherit;width:100%;padding:var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__2);background:var(--uxdsl__surface__outlined-bg);color:var(--uxdsl__surface__outlined-color);border:var(--uxdsl__surface__outlined-border);box-shadow:var(--uxdsl__surface__outlined-shadow);caret-color:var(--uxdsl__input__outlined-base-caret);height:32px;padding-left:30px}input::placeholder{color:var(--uxdsl__input__outlined-base-placeholder)}input:focus{border:var(--uxdsl__input__outlined-focus-border)}input:invalid,input[aria-invalid=true]{border:var(--uxdsl__input__outlined-invalid-border)}input:disabled,input[aria-disabled=true]{opacity:var(--uxdsl__input__outlined-disabled-opacity)}}.actions{display:flex;gap:.25rem;flex-shrink:0;flex:0 0 33%;justify-content:flex-end;button.fix-single{background:var(--uxdsl__palette__primary-main);color:var(--uxdsl__palette__primary-contrast);border:none;border-radius:6px}button.fix-all,button.fix-single{padding:6px 10px;cursor:pointer;font-size:.75rem;font-weight:600;white-space:nowrap}button.fix-all{background:transparent;color:var(--uxdsl__palette__primary-main);border:1px solid var(--uxdsl__palette__primary-main);border-radius:6px}}.loading{display:flex;align-items:center;gap:.5rem;color:var(--uxdsl__palette__primary-main);font-size:.8rem}}.json-preview-container{background:var(--uxdsl__palette__surface-main);padding:1rem;border-radius:6px;margin-bottom:1.5rem;border:1px dashed var(--uxdsl__palette__neutral-main);color:var(--uxdsl__palette__primary-dark);text-align:left;overflow-x:auto;display:flex;flex-direction:column;gap:.25rem}.json-preview-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem;span{font-size:.8rem;color:var(--uxdsl__palette__text-secondary);font-weight:600;text-transform:uppercase;letter-spacing:.05em}}.css-usage-container{margin-bottom:1.5rem;padding:1rem;background:var(--uxdsl__palette__surface-light);border:1px solid var(--uxdsl__palette__neutral-light);border-radius:6px}.css-usage-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem;span{font-size:.8rem;color:var(--uxdsl__palette__text-secondary);font-weight:600;text-transform:uppercase;letter-spacing:.05em}}.css-code-block{background:var(--uxdsl__palette__surface-dark);padding:.75rem;border-radius:6px;color:var(--uxdsl__palette__text-primary);display:flex;align-items:center;overflow-x:auto;border:1px solid var(--uxdsl__palette__neutral-dark);.selector{color:var(--uxdsl__palette__secondary-light)}.bracket{color:var(--uxdsl__palette__text-disabled)}.bracket,.mixin{margin-left:.5rem}.mixin{color:var(--uxdsl__palette__primary-light)}.paren{color:var(--uxdsl__palette__text-primary)}.argument{color:var(--uxdsl__palette__warning-light)}.semicolon{color:var(--uxdsl__palette__text-disabled)}}.css-usage-description{margin-top:.75rem;font-size:.8rem;color:var(--uxdsl__palette__text-secondary);line-height:1.5;strong{color:var(--uxdsl__palette__text-primary)}}.editable-typography-element{&.default{font-size:var(--uxdsl__typography__default-size);font-family:var(--uxdsl__typography__default-font-family);font-weight:var(--uxdsl__typography__default-weight);line-height:var(--uxdsl__typography__default-line);letter-spacing:var(--uxdsl__typography__default-spacing);text-transform:var(--uxdsl__typography__default-transform);text-decoration:var(--uxdsl__typography__default-decoration);font-style:var(--uxdsl__typography__default-style);margin-block-start:var(--uxdsl__typography__default-margin-block-start);margin-block-end:var(--uxdsl__typography__default-margin-block-end)}&.h1{font-size:var(--uxdsl__typography__h1-size);font-family:var(--uxdsl__typography__h1-font-family);font-weight:var(--uxdsl__typography__h1-weight);line-height:var(--uxdsl__typography__h1-line);letter-spacing:var(--uxdsl__typography__h1-spacing);text-transform:var(--uxdsl__typography__h1-transform);text-decoration:var(--uxdsl__typography__h1-decoration);font-style:var(--uxdsl__typography__h1-style);margin-block-start:var(--uxdsl__typography__h1-margin-block-start);margin-block-end:var(--uxdsl__typography__h1-margin-block-end)}&.h2{font-size:var(--uxdsl__typography__h2-size);font-family:var(--uxdsl__typography__h2-font-family);font-weight:var(--uxdsl__typography__h2-weight);line-height:var(--uxdsl__typography__h2-line);letter-spacing:var(--uxdsl__typography__h2-spacing);text-transform:var(--uxdsl__typography__h2-transform);text-decoration:var(--uxdsl__typography__h2-decoration);font-style:var(--uxdsl__typography__h2-style);margin-block-start:var(--uxdsl__typography__h2-margin-block-start);margin-block-end:var(--uxdsl__typography__h2-margin-block-end)}&.h3{font-size:var(--uxdsl__typography__h3-size);font-family:var(--uxdsl__typography__h3-font-family);font-weight:var(--uxdsl__typography__h3-weight);line-height:var(--uxdsl__typography__h3-line);letter-spacing:var(--uxdsl__typography__h3-spacing);text-transform:var(--uxdsl__typography__h3-transform);text-decoration:var(--uxdsl__typography__h3-decoration);font-style:var(--uxdsl__typography__h3-style);margin-block-start:var(--uxdsl__typography__h3-margin-block-start);margin-block-end:var(--uxdsl__typography__h3-margin-block-end)}&.h4{font-size:var(--uxdsl__typography__h4-size);font-family:var(--uxdsl__typography__h4-font-family);font-weight:var(--uxdsl__typography__h4-weight);line-height:var(--uxdsl__typography__h4-line);letter-spacing:var(--uxdsl__typography__h4-spacing);text-transform:var(--uxdsl__typography__h4-transform);text-decoration:var(--uxdsl__typography__h4-decoration);font-style:var(--uxdsl__typography__h4-style);margin-block-start:var(--uxdsl__typography__h4-margin-block-start);margin-block-end:var(--uxdsl__typography__h4-margin-block-end)}&.h5{font-size:var(--uxdsl__typography__h5-size);font-family:var(--uxdsl__typography__h5-font-family);font-weight:var(--uxdsl__typography__h5-weight);line-height:var(--uxdsl__typography__h5-line);letter-spacing:var(--uxdsl__typography__h5-spacing);text-transform:var(--uxdsl__typography__h5-transform);text-decoration:var(--uxdsl__typography__h5-decoration);font-style:var(--uxdsl__typography__h5-style);margin-block-start:var(--uxdsl__typography__h5-margin-block-start);margin-block-end:var(--uxdsl__typography__h5-margin-block-end)}&.h6{font-size:var(--uxdsl__typography__h6-size);font-family:var(--uxdsl__typography__h6-font-family);font-weight:var(--uxdsl__typography__h6-weight);line-height:var(--uxdsl__typography__h6-line);letter-spacing:var(--uxdsl__typography__h6-spacing);text-transform:var(--uxdsl__typography__h6-transform);text-decoration:var(--uxdsl__typography__h6-decoration);font-style:var(--uxdsl__typography__h6-style);margin-block-start:var(--uxdsl__typography__h6-margin-block-start);margin-block-end:var(--uxdsl__typography__h6-margin-block-end)}&.p{font-size:var(--uxdsl__typography__p-size);font-family:var(--uxdsl__typography__p-font-family);font-weight:var(--uxdsl__typography__p-weight);line-height:var(--uxdsl__typography__p-line);letter-spacing:var(--uxdsl__typography__p-spacing);text-transform:var(--uxdsl__typography__p-transform);text-decoration:var(--uxdsl__typography__p-decoration);font-style:var(--uxdsl__typography__p-style);margin-block-start:var(--uxdsl__typography__p-margin-block-start);margin-block-end:var(--uxdsl__typography__p-margin-block-end)}&.body{font-size:var(--uxdsl__typography__body-size);font-family:var(--uxdsl__typography__body-font-family);font-weight:var(--uxdsl__typography__body-weight);line-height:var(--uxdsl__typography__body-line);letter-spacing:var(--uxdsl__typography__body-spacing);text-transform:var(--uxdsl__typography__body-transform);text-decoration:var(--uxdsl__typography__body-decoration);font-style:var(--uxdsl__typography__body-style);margin-block-start:var(--uxdsl__typography__body-margin-block-start);margin-block-end:var(--uxdsl__typography__body-margin-block-end)}&.caption{font-size:var(--uxdsl__typography__caption-size);font-family:var(--uxdsl__typography__caption-font-family);font-weight:var(--uxdsl__typography__caption-weight);line-height:var(--uxdsl__typography__caption-line);letter-spacing:var(--uxdsl__typography__caption-spacing);text-transform:var(--uxdsl__typography__caption-transform);text-decoration:var(--uxdsl__typography__caption-decoration);font-style:var(--uxdsl__typography__caption-style);margin-block-start:var(--uxdsl__typography__caption-margin-block-start);margin-block-end:var(--uxdsl__typography__caption-margin-block-end)}&.span{font-size:var(--uxdsl__typography__span-size);font-family:var(--uxdsl__typography__span-font-family);font-weight:var(--uxdsl__typography__span-weight);line-height:var(--uxdsl__typography__span-line);letter-spacing:var(--uxdsl__typography__span-spacing);text-transform:var(--uxdsl__typography__span-transform);text-decoration:var(--uxdsl__typography__span-decoration);font-style:var(--uxdsl__typography__span-style);margin-block-start:var(--uxdsl__typography__span-margin-block-start);margin-block-end:var(--uxdsl__typography__span-margin-block-end)}&.small{font-size:var(--uxdsl__typography__small-size);font-family:var(--uxdsl__typography__small-font-family);font-weight:var(--uxdsl__typography__small-weight);line-height:var(--uxdsl__typography__small-line);letter-spacing:var(--uxdsl__typography__small-spacing);text-transform:var(--uxdsl__typography__small-transform);text-decoration:var(--uxdsl__typography__small-decoration);font-style:var(--uxdsl__typography__small-style);margin-block-start:var(--uxdsl__typography__small-margin-block-start);margin-block-end:var(--uxdsl__typography__small-margin-block-end)}&.pre{font-size:var(--uxdsl__typography__pre-size);font-family:var(--uxdsl__typography__pre-font-family);font-weight:var(--uxdsl__typography__pre-weight);line-height:var(--uxdsl__typography__pre-line);letter-spacing:var(--uxdsl__typography__pre-spacing);text-transform:var(--uxdsl__typography__pre-transform);text-decoration:var(--uxdsl__typography__pre-decoration);font-style:var(--uxdsl__typography__pre-style);margin-block-start:var(--uxdsl__typography__pre-margin-block-start);margin-block-end:var(--uxdsl__typography__pre-margin-block-end)}&.code{font-size:var(--uxdsl__typography__code-size);font-family:var(--uxdsl__typography__code-font-family);font-weight:var(--uxdsl__typography__code-weight);line-height:var(--uxdsl__typography__code-line);letter-spacing:var(--uxdsl__typography__code-spacing);text-transform:var(--uxdsl__typography__code-transform);text-decoration:var(--uxdsl__typography__code-decoration);font-style:var(--uxdsl__typography__code-style);margin-block-start:var(--uxdsl__typography__code-margin-block-start);margin-block-end:var(--uxdsl__typography__code-margin-block-end)}}.showcase-text{&.sample-default{font-size:var(--uxdsl__typography__default-size);font-family:var(--uxdsl__typography__default-font-family);font-weight:var(--uxdsl__typography__default-weight);line-height:var(--uxdsl__typography__default-line);letter-spacing:var(--uxdsl__typography__default-spacing);text-transform:var(--uxdsl__typography__default-transform);text-decoration:var(--uxdsl__typography__default-decoration);font-style:var(--uxdsl__typography__default-style);margin-block-start:var(--uxdsl__typography__default-margin-block-start);margin-block-end:var(--uxdsl__typography__default-margin-block-end)}&.sample-h1{font-size:var(--uxdsl__typography__h1-size);font-family:var(--uxdsl__typography__h1-font-family);font-weight:var(--uxdsl__typography__h1-weight);line-height:var(--uxdsl__typography__h1-line);letter-spacing:var(--uxdsl__typography__h1-spacing);text-transform:var(--uxdsl__typography__h1-transform);text-decoration:var(--uxdsl__typography__h1-decoration);font-style:var(--uxdsl__typography__h1-style);margin-block-start:var(--uxdsl__typography__h1-margin-block-start);margin-block-end:var(--uxdsl__typography__h1-margin-block-end)}&.sample-h2{font-size:var(--uxdsl__typography__h2-size);font-family:var(--uxdsl__typography__h2-font-family);font-weight:var(--uxdsl__typography__h2-weight);line-height:var(--uxdsl__typography__h2-line);letter-spacing:var(--uxdsl__typography__h2-spacing);text-transform:var(--uxdsl__typography__h2-transform);text-decoration:var(--uxdsl__typography__h2-decoration);font-style:var(--uxdsl__typography__h2-style);margin-block-start:var(--uxdsl__typography__h2-margin-block-start);margin-block-end:var(--uxdsl__typography__h2-margin-block-end)}&.sample-h3{font-size:var(--uxdsl__typography__h3-size);font-family:var(--uxdsl__typography__h3-font-family);font-weight:var(--uxdsl__typography__h3-weight);line-height:var(--uxdsl__typography__h3-line);letter-spacing:var(--uxdsl__typography__h3-spacing);text-transform:var(--uxdsl__typography__h3-transform);text-decoration:var(--uxdsl__typography__h3-decoration);font-style:var(--uxdsl__typography__h3-style);margin-block-start:var(--uxdsl__typography__h3-margin-block-start);margin-block-end:var(--uxdsl__typography__h3-margin-block-end)}&.sample-h4{font-size:var(--uxdsl__typography__h4-size);font-family:var(--uxdsl__typography__h4-font-family);font-weight:var(--uxdsl__typography__h4-weight);line-height:var(--uxdsl__typography__h4-line);letter-spacing:var(--uxdsl__typography__h4-spacing);text-transform:var(--uxdsl__typography__h4-transform);text-decoration:var(--uxdsl__typography__h4-decoration);font-style:var(--uxdsl__typography__h4-style);margin-block-start:var(--uxdsl__typography__h4-margin-block-start);margin-block-end:var(--uxdsl__typography__h4-margin-block-end)}&.sample-h5{font-size:var(--uxdsl__typography__h5-size);font-family:var(--uxdsl__typography__h5-font-family);font-weight:var(--uxdsl__typography__h5-weight);line-height:var(--uxdsl__typography__h5-line);letter-spacing:var(--uxdsl__typography__h5-spacing);text-transform:var(--uxdsl__typography__h5-transform);text-decoration:var(--uxdsl__typography__h5-decoration);font-style:var(--uxdsl__typography__h5-style);margin-block-start:var(--uxdsl__typography__h5-margin-block-start);margin-block-end:var(--uxdsl__typography__h5-margin-block-end)}&.sample-h6{font-size:var(--uxdsl__typography__h6-size);font-family:var(--uxdsl__typography__h6-font-family);font-weight:var(--uxdsl__typography__h6-weight);line-height:var(--uxdsl__typography__h6-line);letter-spacing:var(--uxdsl__typography__h6-spacing);text-transform:var(--uxdsl__typography__h6-transform);text-decoration:var(--uxdsl__typography__h6-decoration);font-style:var(--uxdsl__typography__h6-style);margin-block-start:var(--uxdsl__typography__h6-margin-block-start);margin-block-end:var(--uxdsl__typography__h6-margin-block-end)}&.sample-p{font-size:var(--uxdsl__typography__p-size);font-family:var(--uxdsl__typography__p-font-family);font-weight:var(--uxdsl__typography__p-weight);line-height:var(--uxdsl__typography__p-line);letter-spacing:var(--uxdsl__typography__p-spacing);text-transform:var(--uxdsl__typography__p-transform);text-decoration:var(--uxdsl__typography__p-decoration);font-style:var(--uxdsl__typography__p-style);margin-block-start:var(--uxdsl__typography__p-margin-block-start);margin-block-end:var(--uxdsl__typography__p-margin-block-end)}&.sample-body{font-size:var(--uxdsl__typography__body-size);font-family:var(--uxdsl__typography__body-font-family);font-weight:var(--uxdsl__typography__body-weight);line-height:var(--uxdsl__typography__body-line);letter-spacing:var(--uxdsl__typography__body-spacing);text-transform:var(--uxdsl__typography__body-transform);text-decoration:var(--uxdsl__typography__body-decoration);font-style:var(--uxdsl__typography__body-style);margin-block-start:var(--uxdsl__typography__body-margin-block-start);margin-block-end:var(--uxdsl__typography__body-margin-block-end)}&.sample-caption{font-size:var(--uxdsl__typography__caption-size);font-family:var(--uxdsl__typography__caption-font-family);font-weight:var(--uxdsl__typography__caption-weight);line-height:var(--uxdsl__typography__caption-line);letter-spacing:var(--uxdsl__typography__caption-spacing);text-transform:var(--uxdsl__typography__caption-transform);text-decoration:var(--uxdsl__typography__caption-decoration);font-style:var(--uxdsl__typography__caption-style);margin-block-start:var(--uxdsl__typography__caption-margin-block-start);margin-block-end:var(--uxdsl__typography__caption-margin-block-end)}&.sample-span{font-size:var(--uxdsl__typography__span-size);font-family:var(--uxdsl__typography__span-font-family);font-weight:var(--uxdsl__typography__span-weight);line-height:var(--uxdsl__typography__span-line);letter-spacing:var(--uxdsl__typography__span-spacing);text-transform:var(--uxdsl__typography__span-transform);text-decoration:var(--uxdsl__typography__span-decoration);font-style:var(--uxdsl__typography__span-style);margin-block-start:var(--uxdsl__typography__span-margin-block-start);margin-block-end:var(--uxdsl__typography__span-margin-block-end)}&.sample-small{font-size:var(--uxdsl__typography__small-size);font-family:var(--uxdsl__typography__small-font-family);font-weight:var(--uxdsl__typography__small-weight);line-height:var(--uxdsl__typography__small-line);letter-spacing:var(--uxdsl__typography__small-spacing);text-transform:var(--uxdsl__typography__small-transform);text-decoration:var(--uxdsl__typography__small-decoration);font-style:var(--uxdsl__typography__small-style);margin-block-start:var(--uxdsl__typography__small-margin-block-start);margin-block-end:var(--uxdsl__typography__small-margin-block-end)}&.sample-pre{font-size:var(--uxdsl__typography__pre-size);font-family:var(--uxdsl__typography__pre-font-family);font-weight:var(--uxdsl__typography__pre-weight);line-height:var(--uxdsl__typography__pre-line);letter-spacing:var(--uxdsl__typography__pre-spacing);text-transform:var(--uxdsl__typography__pre-transform);text-decoration:var(--uxdsl__typography__pre-decoration);font-style:var(--uxdsl__typography__pre-style);margin-block-start:var(--uxdsl__typography__pre-margin-block-start);margin-block-end:var(--uxdsl__typography__pre-margin-block-end)}&.sample-code{font-size:var(--uxdsl__typography__code-size);font-family:var(--uxdsl__typography__code-font-family);font-weight:var(--uxdsl__typography__code-weight);line-height:var(--uxdsl__typography__code-line);letter-spacing:var(--uxdsl__typography__code-spacing);text-transform:var(--uxdsl__typography__code-transform);text-decoration:var(--uxdsl__typography__code-decoration);font-style:var(--uxdsl__typography__code-style);margin-block-start:var(--uxdsl__typography__code-margin-block-start);margin-block-end:var(--uxdsl__typography__code-margin-block-end);font-size:var(--uxdsl__typography__pre-size);font-family:var(--uxdsl__typography__pre-font-family);font-weight:var(--uxdsl__typography__pre-weight);line-height:var(--uxdsl__typography__pre-line);letter-spacing:var(--uxdsl__typography__pre-spacing);text-transform:var(--uxdsl__typography__pre-transform);text-decoration:var(--uxdsl__typography__pre-decoration);font-style:var(--uxdsl__typography__pre-style);margin-block-start:var(--uxdsl__typography__pre-margin-block-start);margin-block-end:var(--uxdsl__typography__pre-margin-block-end)}}.json-property-row{display:flex;align-items:center;justify-content:space-between;width:100%;padding-left:2ch}.json-key{color:var(--uxdsl__palette__secondary-main)}.json-comment,.json-value-inherited{color:var(--uxdsl__palette__text-disabled)}.json-comment{font-size:.75rem;margin-left:.5rem}.json-action-group{display:flex;gap:.25rem}.json-action-button{background:transparent;border:1px solid var(--uxdsl__palette__divider-main);border-radius:4px;padding:4px;cursor:pointer;color:var(--uxdsl__palette__text-secondary);display:flex;align-items:center;justify-content:center;transition:all .2s;&:hover{color:var(--uxdsl__palette__primary-main);border-color:var(--uxdsl__palette__primary-main)}&.delete-button{border:none;color:var(--uxdsl__palette__text-disabled);&:hover{color:var(--uxdsl__palette__error-main);background:transparent}}}.editable-typography-element{margin:0;transition:all .2s ease;outline:none;min-width:10px;cursor:text;text-align:left;width:100%;position:relative;z-index:2}#SideNav{.side-nav__backdrop{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:1100;opacity:0;pointer-events:none;transition:opacity .15s ease;&.is-open{display:block;opacity:1;pointer-events:auto}}.side-nav__menu{display:none;position:fixed;top:0;left:0;bottom:0;width:280px;z-index:1200;transform:translateX(-100%);transition:transform .15s cubic-bezier(.4,0,.2,1);background:var(--uxdsl__palette__surface-main);box-shadow:var(--uxdsl__shadow__1);border:none;padding:var(--uxdsl__space__4);height:100%;overflow-y:auto;&.is-open{display:block;transform:translateX(0)}}.side-nav__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--uxdsl__space__4)}.side-nav__title{font-family:var(--uxdsl__typography__h5-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__h5-size);line-height:var(--uxdsl__typography__h5-line,1.4);font-weight:var(--uxdsl__typography__h5-weight,600);letter-spacing:var(--uxdsl__typography__h5-spacing,normal);text-transform:var(--uxdsl__typography__h5-transform,none);text-decoration:var(--uxdsl__typography__h5-decoration,none);font-style:var(--uxdsl__typography__h5-style,normal);margin-block-start:var(--uxdsl__typography__h5-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h5-margin-block-end,auto);margin:0}.side-nav__close{font-family:var(--uxdsl__typography__h4-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h4-size);line-height:var(--uxdsl__typography__h4-line,1.4);font-weight:var(--uxdsl__typography__h4-weight,600);letter-spacing:var(--uxdsl__typography__h4-spacing,normal);text-transform:var(--uxdsl__typography__h4-transform,none);text-decoration:var(--uxdsl__typography__h4-decoration,none);font-style:var(--uxdsl__typography__h4-style,normal);margin-block-start:var(--uxdsl__typography__h4-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h4-margin-block-end,auto);background:transparent;border:none;cursor:pointer;color:color-mix(in srgb,var(--uxdsl__palette__surface-contrast) 70%,transparent);padding:var(--uxdsl__space__1)}.side-nav__section+.side-nav__section{margin-top:var(--uxdsl__density__4)}.side-nav__section-title{font-family:var(--uxdsl__typography__span-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__span-size);line-height:var(--uxdsl__typography__span-line,1.5);font-weight:var(--uxdsl__typography__span-weight,400);letter-spacing:var(--uxdsl__typography__span-spacing,normal);text-transform:var(--uxdsl__typography__span-transform,none);text-decoration:var(--uxdsl__typography__span-decoration,none);font-style:var(--uxdsl__typography__span-style,normal);margin-block-start:var(--uxdsl__typography__span-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__span-margin-block-end,auto);text-transform:uppercase;opacity:.6;margin:0 0 var(--uxdsl__density__1) 0;padding-left:var(--uxdsl__density__1)}.side-nav__list{list-style:none;margin:0;padding:0;display:grid;gap:var(--uxdsl__density__1)}.side-nav__link{font-family:var(--uxdsl__typography__span-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__span-size);line-height:var(--uxdsl__typography__span-line,1.5);font-weight:var(--uxdsl__typography__span-weight,400);letter-spacing:var(--uxdsl__typography__span-spacing,normal);text-transform:var(--uxdsl__typography__span-transform,none);text-decoration:var(--uxdsl__typography__span-decoration,none);font-style:var(--uxdsl__typography__span-style,normal);margin-block-start:var(--uxdsl__typography__span-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__span-margin-block-end,auto);text-decoration:none;padding:var(--uxdsl__density__1) var(--uxdsl__density__2);border-radius:var(--uxdsl__radius__1);display:block;transition:all .1s ease;color:color-mix(in srgb,var(--uxdsl__palette__surface-contrast) 80%,transparent);&:hover{background:var(--uxdsl__palette__neutral-light);color:var(--uxdsl__palette__neutral-contrast)}&[aria-current=page]{background:color-mix(in srgb,var(--uxdsl__palette__primary-main) 10%,transparent);color:var(--uxdsl__palette__primary-main)}}@media (min-width:1024px){display:block;--side-nav-sticky-top:calc(var(--uxdsl__space__12) + var(--uxdsl__space__7));position:sticky;top:var(--side-nav-sticky-top);width:auto;height:auto;align-self:start;margin-left:0;margin-bottom:0;margin-right:0;margin-top:0;max-height:calc(100vh - var(--side-nav-sticky-top) - var(--uxdsl__space__3));overflow-y:auto;.side-nav__backdrop,.side-nav__burger,.side-nav__header{display:none}.side-nav__menu{display:block;position:static;width:auto;z-index:auto;transform:none;height:auto;overflow-y:visible;padding:var(--uxdsl__surface__flat-padding);border-radius:var(--uxdsl__surface__flat-radius);background:var(--uxdsl__surface__flat-bg);color:var(--uxdsl__surface__flat-color);border:var(--uxdsl__surface__flat-border);box-shadow:var(--uxdsl__surface__flat-shadow);box-shadow:var(--uxdsl__shadow__1);border-radius:var(--uxdsl__radius__2)}}}.theme-background-container{position:absolute;inset:0;width:100%;height:100%;z-index:0;overflow:hidden;pointer-events:none;background:var(--uxdsl__palette__surface-main)}.theme-background-image{width:100%;height:100%;object-fit:cover;filter:saturate(1.1);transition:opacity 1s ease-in-out,transform 1s ease}.theme-background-loading{position:absolute;top:65%;left:50%;transform:translate(-50%,-50%);font-family:var(--uxdsl__font__code,monospace);font-size:.75rem;color:var(--uxdsl__palette__text-secondary);z-index:1;opacity:.8;animation:pulse 1.5s ease-in-out infinite;letter-spacing:.05em;text-transform:uppercase}.theme-background-tint{position:absolute;inset:0;background:var(--uxdsl__palette__primary-main);opacity:.5;mix-blend-mode:color;z-index:2}.theme-background-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,color-mix(in srgb,var(--uxdsl__palette__surface-light) 50%,transparent) 0,color-mix(in srgb,var(--uxdsl__palette__surface-main) 5%,transparent) 50%,color-mix(in srgb,var(--uxdsl__palette__surface-main) 50%,transparent) 100%);z-index:3}@keyframes pulse{0%,to{opacity:.5}50%{opacity:1}}.uxdsl-demo-wrapper{display:flex;flex-direction:column;align-items:center;gap:var(--uxdsl__density__6);width:100%;margin-top:var(--uxdsl__density__4);.uxdsl-card{padding:var(--uxdsl__surface__contained-padding);border-radius:var(--uxdsl__surface__contained-radius);background:var(--uxdsl__surface__contained-bg);color:var(--uxdsl__surface__contained-color);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);width:100%;border-radius:var(--uxdsl__radius__3);box-shadow:var(--uxdsl__shadow__3);transition:all .2s;overflow:hidden}@media (min-width:768px){.uxdsl-card{width:400px}}.card-header{background:linear-gradient(135deg,var(--uxdsl__palette__primary-main),var(--uxdsl__palette__primary-dark));padding:var(--uxdsl__density__6);display:grid;place-items:center}.logo-circle{padding:var(--uxdsl__surface__contained-padding);border-radius:var(--uxdsl__surface__contained-radius);background:var(--uxdsl__palette__light-main);color:var(--uxdsl__palette__light-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);width:var(--uxdsl__density__10);height:var(--uxdsl__density__10);border-radius:9999px;display:grid;place-items:center;box-shadow:var(--uxdsl__shadow__2)}.card-logo{width:60%;height:auto}.card-body{padding:var(--uxdsl__density__5);text-align:center;display:flex;flex-direction:column;gap:var(--uxdsl__density__3)}.card-title{font-family:var(--uxdsl__typography__h5-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__h5-size);line-height:var(--uxdsl__typography__h5-line,1.4);font-weight:var(--uxdsl__typography__h5-weight,600);letter-spacing:var(--uxdsl__typography__h5-spacing,normal);text-transform:var(--uxdsl__typography__h5-transform,none);text-decoration:var(--uxdsl__typography__h5-decoration,none);font-style:var(--uxdsl__typography__h5-style,normal);margin-block-start:var(--uxdsl__typography__h5-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h5-margin-block-end,auto)}.card-desc,.card-title{color:var(--uxdsl__palette__primary-main)}.card-desc{font-family:var(--uxdsl__typography__body-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-size);line-height:var(--uxdsl__typography__body-line,1.6);font-weight:var(--uxdsl__typography__body-weight,400);letter-spacing:var(--uxdsl__typography__body-spacing,normal);text-transform:var(--uxdsl__typography__body-transform,none);text-decoration:var(--uxdsl__typography__body-decoration,none);font-style:var(--uxdsl__typography__body-style,normal);margin-block-start:var(--uxdsl__typography__body-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-margin-block-end,auto)}.card-actions{padding:var(--uxdsl__density__4);border-top:var(--uxdsl__border__1);display:flex;gap:var(--uxdsl__density__2)}.btn-primary{padding:var(--uxdsl__surface__contained-padding);border-radius:var(--uxdsl__surface__contained-radius);background:var(--uxdsl__palette__primary-main);color:var(--uxdsl__palette__primary-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);--uxdsl__button__tone-main:var(--uxdsl__palette__primary-main);--uxdsl__button__tone-dark:var(--uxdsl__palette__primary-dark);--uxdsl__button__tone-contrast:var(--uxdsl__palette__primary-contrast);width:100%;justify-content:center}.btn-primary:hover{background:var(--uxdsl__button__contained-tone-primary-hover-bg,var(--uxdsl__button__contained-hover-bg));color:var(--uxdsl__button__contained-tone-primary-hover-color,var(--uxdsl__button__contained-hover-color))}.btn-primary.is-selected,.btn-primary[aria-pressed=true],.btn-primary[aria-selected=true]{background:var(--uxdsl__button__contained-tone-primary-selected-bg,var(--uxdsl__button__contained-selected-bg));color:var(--uxdsl__button__contained-tone-primary-selected-color,var(--uxdsl__button__contained-selected-color))}.btn-secondary{padding:var(--uxdsl__surface__outlined-padding);border-radius:var(--uxdsl__surface__outlined-radius);background:transparent;color:var(--uxdsl__palette__neutral-main);border:1px solid var(--uxdsl__palette__neutral-main);box-shadow:var(--uxdsl__surface__outlined-shadow);--uxdsl__button__tone-main:var(--uxdsl__palette__neutral-main);--uxdsl__button__tone-dark:var(--uxdsl__palette__neutral-dark);--uxdsl__button__tone-contrast:var(--uxdsl__palette__neutral-contrast);width:100%;justify-content:center}.btn-secondary:hover{color:var(--uxdsl__button__outlined-tone-neutral-hover-color,var(--uxdsl__button__outlined-hover-color));border:var(--uxdsl__button__outlined-tone-neutral-hover-border,var(--uxdsl__button__outlined-hover-border))}.btn-secondary.is-selected,.btn-secondary[aria-pressed=true],.btn-secondary[aria-selected=true]{background:var(--uxdsl__button__outlined-tone-neutral-selected-bg,var(--uxdsl__button__outlined-selected-bg));color:var(--uxdsl__button__outlined-tone-neutral-selected-color,var(--uxdsl__button__outlined-selected-color));border:var(--uxdsl__button__outlined-tone-neutral-selected-border,var(--uxdsl__button__outlined-selected-border))}.demo-code-block{width:100%;max-width:600px;background:var(--uxdsl__palette__surface-main);border-radius:var(--uxdsl__radius__2);overflow:hidden;border:var(--uxdsl__border__1);box-shadow:var(--uxdsl__shadow__2)}.code-header{background:var(--uxdsl__palette__primary-main);padding:var(--uxdsl__density__2) var(--uxdsl__density__3);border-bottom:var(--uxdsl__border__1);display:flex;align-items:center}.code-file{font-family:monospace;font-size:.8rem;font-weight:700}.code-content,.code-file{color:var(--uxdsl__palette__neutral-light)}.code-content{font-family:var(--uxdsl__typography__pre-font-family,var(--uxdsl__font__code),monospace);font-size:var(--uxdsl__typography__pre-size);line-height:var(--uxdsl__typography__pre-line,1.5);text-transform:var(--uxdsl__typography__pre-transform,none);text-decoration:var(--uxdsl__typography__pre-decoration,none);font-style:var(--uxdsl__typography__pre-style,normal);margin-block-start:var(--uxdsl__typography__pre-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__pre-margin-block-end,auto);padding:var(--uxdsl__density__4);overflow-x:auto}}#BreakpointsPage{.demo-section{display:flex;flex-direction:column;gap:var(--uxdsl__density__3);margin-bottom:var(--uxdsl__density__6)}.demo-subtitle{font-size:1.25rem;font-weight:600;color:var(--uxdsl__palette__neutral-dark);margin-bottom:var(--uxdsl__density__2)}.demo-description{font-size:1rem;color:var(--uxdsl__palette__neutral-main);line-height:1.6;max-width:800px;margin-bottom:var(--uxdsl__density__3)}.demo-card{border-radius:var(--uxdsl__surface__outlined-radius);background:var(--uxdsl__surface__outlined-bg);color:var(--uxdsl__surface__outlined-color);border:var(--uxdsl__surface__outlined-border);box-shadow:var(--uxdsl__surface__outlined-shadow);padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__3);background:var(--uxdsl__palette__surface-main);display:flex;flex-direction:column;gap:var(--uxdsl__density__3)}.demo-card-title{font-size:1.1rem;font-weight:600;color:var(--uxdsl__palette__neutral-dark);margin-bottom:var(--uxdsl__density__2);border-bottom:1px solid var(--uxdsl__palette__neutral-light);padding-bottom:var(--uxdsl__density__2)}.demo-grid-2{display:grid;grid-template-columns:1fr;gap:var(--uxdsl__density__4)}@media (min-width:768px){.demo-grid-2{grid-template-columns:1fr 1fr}}.demo-code{background:var(--uxdsl__palette__neutral-light);padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__2);font-family:font(code);font-size:.9rem;color:var(--uxdsl__palette__neutral-dark);overflow-x:auto;border:1px solid var(--uxdsl__palette__neutral-main)}.demo-table{width:100%;border-collapse:collapse;font-size:.9rem}.demo-table th{text-align:left;border-bottom:2px solid var(--uxdsl__palette__neutral-light);color:var(--uxdsl__palette__neutral-dark);font-weight:600}.demo-table td,.demo-table th{padding:var(--uxdsl__density__2)}.demo-table td{border-bottom:1px solid var(--uxdsl__palette__neutral-light);color:var(--uxdsl__palette__neutral-main)}.demo-table code{background:var(--uxdsl__palette__neutral-light);padding:2px 6px;border-radius:var(--uxdsl__radius__1);font-family:font(code);font-size:.85em;color:var(--uxdsl__palette__primary-dark)}}#QuickStartPage{.section{gap:var(--uxdsl__density__6);margin-bottom:var(--uxdsl__density__6);margin-top:var(--uxdsl__density__4)}.section,.step-card{display:flex;flex-direction:column}.step-card{border-radius:var(--uxdsl__surface__flat-radius);background:var(--uxdsl__surface__flat-bg);color:var(--uxdsl__surface__flat-color);border:var(--uxdsl__surface__flat-border);box-shadow:var(--uxdsl__surface__flat-shadow);padding:0;gap:var(--uxdsl__density__3);position:relative;border-left:2px solid var(--uxdsl__palette__neutral-light);padding-left:var(--uxdsl__density__4);transition:all .3s ease}.step-card:hover{border-left-color:var(--uxdsl__palette__primary-main)}.step-header{display:flex;align-items:baseline;gap:var(--uxdsl__density__4)}.step-number{font-family:var(--uxdsl__typography__h6-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__h6-size);line-height:var(--uxdsl__typography__h6-line,1.4);font-weight:var(--uxdsl__typography__h6-weight,600);letter-spacing:var(--uxdsl__typography__h6-spacing,normal);text-transform:var(--uxdsl__typography__h6-transform,none);text-decoration:var(--uxdsl__typography__h6-decoration,none);font-style:var(--uxdsl__typography__h6-style,normal);margin-block-start:var(--uxdsl__typography__h6-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h6-margin-block-end,auto);color:var(--uxdsl__palette__secondary-main);font-family:font(code);font-weight:700;line-height:1}.step-title{font-family:var(--uxdsl__typography__h5-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__h5-size);line-height:var(--uxdsl__typography__h5-line,1.4);font-weight:var(--uxdsl__typography__h5-weight,600);letter-spacing:var(--uxdsl__typography__h5-spacing,normal);text-transform:var(--uxdsl__typography__h5-transform,none);text-decoration:var(--uxdsl__typography__h5-decoration,none);font-style:var(--uxdsl__typography__h5-style,normal);margin-block-start:var(--uxdsl__typography__h5-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h5-margin-block-end,auto);margin:0;font-weight:600;letter-spacing:-.5px}.step-desc,.step-title{color:var(--uxdsl__palette__surface-contrast)}.step-desc{font-family:var(--uxdsl__typography__body-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-size);line-height:var(--uxdsl__typography__body-line,1.6);font-weight:var(--uxdsl__typography__body-weight,400);letter-spacing:var(--uxdsl__typography__body-spacing,normal);text-transform:var(--uxdsl__typography__body-transform,none);text-decoration:var(--uxdsl__typography__body-decoration,none);font-style:var(--uxdsl__typography__body-style,normal);margin-block-start:var(--uxdsl__typography__body-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-margin-block-end,auto);font-weight:400;max-width:60ch;margin:0}.info-box{border-radius:var(--uxdsl__surface__outlined-radius);background:transparent;color:var(--uxdsl__palette__neutral-main);box-shadow:var(--uxdsl__surface__outlined-shadow);padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__1);display:flex;gap:var(--uxdsl__density__2);align-items:flex-start;background:color-mix(in srgb,var(--uxdsl__palette__surface-light) 50%,transparent);border:1px dashed var(--uxdsl__palette__neutral-main)}.info-icon{color:var(--uxdsl__palette__primary-main);margin-top:2px}.info-text{font-family:var(--uxdsl__typography__body-sm-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-sm-size);line-height:var(--uxdsl__typography__body-sm-line,1.5);font-weight:var(--uxdsl__typography__body-sm-weight,400);letter-spacing:var(--uxdsl__typography__body-sm-spacing,normal);text-transform:var(--uxdsl__typography__body-sm-transform,none);text-decoration:var(--uxdsl__typography__body-sm-decoration,none);font-style:var(--uxdsl__typography__body-sm-style,normal);margin-block-start:var(--uxdsl__typography__body-sm-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-sm-margin-block-end,auto);margin:0;color:color-mix(in srgb,var(--uxdsl__palette__surface-contrast) 80%,transparent)}.code-wrapper{margin-top:var(--uxdsl__density__4);box-shadow:var(--uxdsl__shadow__2)}.warning-blockquote{border-radius:var(--uxdsl__surface__outlined-radius);background:transparent;color:var(--uxdsl__palette__warning-main);border:1px solid var(--uxdsl__palette__warning-main);box-shadow:var(--uxdsl__surface__outlined-shadow);padding:var(--uxdsl__density__4);border-radius:var(--uxdsl__radius__1);margin-bottom:var(--uxdsl__density__8);color:var(--uxdsl__palette__text-primary)}}#TypographyPage{.doc-content{display:flex;flex-direction:column;gap:var(--uxdsl__density__3)}.doc-divider{border:0;border-top:1px solid var(--uxdsl__palette__neutral-light);opacity:.6;margin:var(--uxdsl__density__10) 0}.doc-content h2.ds-typo{font-family:var(--uxdsl__typography__h2-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h2-size);line-height:var(--uxdsl__typography__h2-line,1.2);font-weight:var(--uxdsl__typography__h2-weight,700);letter-spacing:var(--uxdsl__typography__h2-spacing,-.01em);text-transform:var(--uxdsl__typography__h2-transform,none);text-decoration:var(--uxdsl__typography__h2-decoration,none);font-style:var(--uxdsl__typography__h2-style,normal);margin-block-start:var(--uxdsl__typography__h2-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h2-margin-block-end,auto);margin:0;color:var(--uxdsl__palette__surface-contrast)}.doc-content h3.ds-typo{font-family:var(--uxdsl__typography__h3-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h3-size);line-height:var(--uxdsl__typography__h3-line,1.3);font-weight:var(--uxdsl__typography__h3-weight,600);letter-spacing:var(--uxdsl__typography__h3-spacing,normal);text-transform:var(--uxdsl__typography__h3-transform,none);text-decoration:var(--uxdsl__typography__h3-decoration,none);font-style:var(--uxdsl__typography__h3-style,normal);margin-block-start:var(--uxdsl__typography__h3-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h3-margin-block-end,auto);margin:var(--uxdsl__density__4) 0 var(--uxdsl__density__2);color:var(--uxdsl__palette__surface-contrast)}.doc-paragraph{font-family:var(--uxdsl__typography__p-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__p-size);line-height:var(--uxdsl__typography__p-line,1.6);font-weight:var(--uxdsl__typography__p-weight,400);letter-spacing:var(--uxdsl__typography__p-spacing,normal);text-transform:var(--uxdsl__typography__p-transform,none);text-decoration:var(--uxdsl__typography__p-decoration,none);font-style:var(--uxdsl__typography__p-style,normal);margin-block-start:var(--uxdsl__typography__p-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__p-margin-block-end,auto);margin:0;color:color-mix(in srgb,var(--uxdsl__palette__surface-contrast) 85%,transparent);max-width:75ch}.code-wrapper{margin-top:var(--uxdsl__density__3);box-shadow:var(--uxdsl__shadow__2)}.table-card{border-radius:var(--uxdsl__surface__outlined-radius);background:var(--uxdsl__surface__outlined-bg);color:var(--uxdsl__surface__outlined-color);border:var(--uxdsl__surface__outlined-border);box-shadow:var(--uxdsl__surface__outlined-shadow);padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__2);background:color-mix(in srgb,var(--uxdsl__palette__surface-light) 35%,transparent);overflow-x:auto}.doc-table{width:100%;border-collapse:collapse}.doc-table th{font-family:var(--uxdsl__typography__small-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__small-size);line-height:var(--uxdsl__typography__small-line,1.4);letter-spacing:var(--uxdsl__typography__small-spacing,normal);text-transform:var(--uxdsl__typography__small-transform,none);text-decoration:var(--uxdsl__typography__small-decoration,none);font-style:var(--uxdsl__typography__small-style,normal);margin-block-start:var(--uxdsl__typography__small-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__small-margin-block-end,auto);opacity:var(--uxdsl__typography__small-opacity,.8);text-align:left;border-bottom:2px solid var(--uxdsl__palette__neutral-light);color:var(--uxdsl__palette__surface-contrast);font-weight:600}.doc-table td,.doc-table th{padding:var(--uxdsl__density__2)}.doc-table td{font-family:var(--uxdsl__typography__body-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-size);line-height:var(--uxdsl__typography__body-line,1.6);font-weight:var(--uxdsl__typography__body-weight,400);letter-spacing:var(--uxdsl__typography__body-spacing,normal);text-transform:var(--uxdsl__typography__body-transform,none);text-decoration:var(--uxdsl__typography__body-decoration,none);font-style:var(--uxdsl__typography__body-style,normal);margin-block-start:var(--uxdsl__typography__body-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-margin-block-end,auto);border-bottom:1px solid var(--uxdsl__palette__neutral-light);color:color-mix(in srgb,var(--uxdsl__palette__surface-contrast) 85%,transparent);vertical-align:top}.doc-table tr:last-child td{border-bottom:0}.doc-table code{background:var(--uxdsl__palette__neutral-light);padding:2px 6px;border-radius:var(--uxdsl__radius__1);font-family:font(code);font-size:.9em;color:var(--uxdsl__palette__primary-dark)}.info-box{border-radius:var(--uxdsl__surface__outlined-radius);background:transparent;color:var(--uxdsl__palette__neutral-main);box-shadow:var(--uxdsl__surface__outlined-shadow);padding:var(--uxdsl__density__3);border-radius:var(--uxdsl__radius__2);background:color-mix(in srgb,var(--uxdsl__palette__surface-light) 35%,transparent);border:1px dashed var(--uxdsl__palette__neutral-main)}.info-text{font-family:var(--uxdsl__typography__small-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__small-size);line-height:var(--uxdsl__typography__small-line,1.4);letter-spacing:var(--uxdsl__typography__small-spacing,normal);text-transform:var(--uxdsl__typography__small-transform,none);text-decoration:var(--uxdsl__typography__small-decoration,none);font-style:var(--uxdsl__typography__small-style,normal);margin-block-start:var(--uxdsl__typography__small-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__small-margin-block-end,auto);opacity:var(--uxdsl__typography__small-opacity,.8);margin:0;color:color-mix(in srgb,var(--uxdsl__palette__surface-contrast) 85%,transparent);max-width:75ch}}.not-found-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;gap:var(--uxdsl__density__6);padding:var(--uxdsl__density__4);text-align:center;animation:fadeIn .5s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.error-code{font-size:8rem;font-weight:800;line-height:1;color:color-mix(in srgb,var(--uxdsl__palette__primary-light) 15%,transparent);margin:0;user-select:none}.title-group{display:flex;flex-direction:column;gap:var(--uxdsl__density__2);align-items:center;margin-top:-4.5rem;position:relative;z-index:1}.title{font-family:var(--uxdsl__typography__h2-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h2-size);line-height:var(--uxdsl__typography__h2-line,1.2);font-weight:var(--uxdsl__typography__h2-weight,700);letter-spacing:var(--uxdsl__typography__h2-spacing,-.01em);text-transform:var(--uxdsl__typography__h2-transform,none);text-decoration:var(--uxdsl__typography__h2-decoration,none);font-style:var(--uxdsl__typography__h2-style,normal);margin-block-start:var(--uxdsl__typography__h2-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h2-margin-block-end,auto);color:var(--uxdsl__palette__text-primary)}.subtitle{font-family:var(--uxdsl__typography__body-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-size);line-height:var(--uxdsl__typography__body-line,1.6);font-weight:var(--uxdsl__typography__body-weight,400);letter-spacing:var(--uxdsl__typography__body-spacing,normal);text-transform:var(--uxdsl__typography__body-transform,none);text-decoration:var(--uxdsl__typography__body-decoration,none);font-style:var(--uxdsl__typography__body-style,normal);margin-block-start:var(--uxdsl__typography__body-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-margin-block-end,auto);color:var(--uxdsl__palette__text-secondary);max-width:500px;line-height:1.6}.nav-grid{display:grid;grid-template-columns:1fr;gap:var(--uxdsl__density__3);width:100%;max-width:700px;margin-top:var(--uxdsl__density__4)}@media (min-width:600px){.nav-grid{grid-template-columns:1fr 1fr}}.nav-card{border-radius:var(--uxdsl__surface__contained-radius);background:var(--uxdsl__surface__contained-bg);color:var(--uxdsl__surface__contained-color);box-shadow:var(--uxdsl__surface__contained-shadow);padding:var(--uxdsl__density__4);display:flex;flex-direction:column;align-items:flex-start;gap:var(--uxdsl__density__2);transition:all .2s ease;cursor:pointer;text-decoration:none;border:1px solid transparent;height:100%;&:hover{transform:translateY(-3px);box-shadow:var(--uxdsl__shadow__3);border-color:color-mix(in srgb,var(--uxdsl__palette__primary-light) 30%,transparent);.nav-card-icon{background:var(--uxdsl__palette__primary-main);color:var(--uxdsl__palette__primary-contrast)}}}.nav-card-icon{width:40px;height:40px;background:color-mix(in srgb,var(--uxdsl__palette__surface-dark) 50%,transparent);border-radius:9999px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.nav-card-icon,.nav-card-title{color:var(--uxdsl__palette__text-primary)}.nav-card-title{font-family:var(--uxdsl__typography__h6-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__h6-size);line-height:var(--uxdsl__typography__h6-line,1.4);font-weight:var(--uxdsl__typography__h6-weight,600);letter-spacing:var(--uxdsl__typography__h6-spacing,normal);text-transform:var(--uxdsl__typography__h6-transform,none);text-decoration:var(--uxdsl__typography__h6-decoration,none);font-style:var(--uxdsl__typography__h6-style,normal);margin-block-start:var(--uxdsl__typography__h6-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h6-margin-block-end,auto);margin:0}.nav-card-desc{font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);color:var(--uxdsl__palette__text-secondary);text-align:left;margin:0;line-height:1.5}#WelcomePage{display:flex;flex-direction:column;min-height:calc(100vh - 64px);width:100%;.hero-surface{border-radius:var(--uxdsl__surface__contained-radius);background:var(--uxdsl__surface__contained-bg);color:var(--uxdsl__surface__contained-color);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);width:100%;flex:1;display:grid;place-items:center;gap:var(--uxdsl__density__8);background:transparent;border-bottom:var(--uxdsl__border__1);padding:var(--uxdsl__density__8)}.hero-content{display:flex;flex-direction:column;align-items:center;gap:var(--uxdsl__density__4);text-align:center;@media (min-width:768px){flex-direction:row;justify-content:center;text-align:left;.welcome-page-title{.page-title__text{margin-bottom:0}}}}.logo-container{width:7.5rem;height:7.5rem;display:grid;place-items:center;filter:drop-shadow(0 4px 12px rgba(0,0,0,.1))}.hero-logo{width:100%;height:auto}.welcome-page-title{margin-bottom:0;.page-title__text{font-family:var(--uxdsl__typography__h1-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h1-size);line-height:var(--uxdsl__typography__h1-line,1.1);font-weight:var(--uxdsl__typography__h1-weight,700);letter-spacing:var(--uxdsl__typography__h1-spacing,-.02em);text-transform:var(--uxdsl__typography__h1-transform,none);text-decoration:var(--uxdsl__typography__h1-decoration,none);font-style:var(--uxdsl__typography__h1-style,normal);margin-block-start:var(--uxdsl__typography__h1-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h1-margin-block-end,auto);background:linear-gradient(135deg,var(--uxdsl__palette__primary-dark),var(--uxdsl__palette__primary-main));-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:var(--uxdsl__density__2)}.page-title__subtitle{font-family:var(--uxdsl__typography__h3-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__h3-size);line-height:var(--uxdsl__typography__h3-line,1.3);font-weight:var(--uxdsl__typography__h3-weight,600);letter-spacing:var(--uxdsl__typography__h3-spacing,normal);text-transform:var(--uxdsl__typography__h3-transform,none);text-decoration:var(--uxdsl__typography__h3-decoration,none);font-style:var(--uxdsl__typography__h3-style,normal);margin-block-start:var(--uxdsl__typography__h3-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h3-margin-block-end,auto);color:var(--uxdsl__palette__text-secondary)}}.home-container{box-sizing:border-box;max-width:90vw;width:100%;margin:0 auto;display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--uxdsl__density__6);padding:var(--uxdsl__density__8) var(--uxdsl__density__4) var(--uxdsl__density__10)}.actions{margin-top:0}.actions,.get-started-btn{width:100%;display:flex;justify-content:center}.get-started-btn{border-radius:var(--uxdsl__radius__3);background:var(--uxdsl__palette__primary-main);color:var(--uxdsl__palette__primary-contrast);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);--uxdsl__button__tone-main:var(--uxdsl__palette__primary-main);--uxdsl__button__tone-dark:var(--uxdsl__palette__primary-dark);--uxdsl__button__tone-contrast:var(--uxdsl__palette__primary-contrast);align-items:center;gap:var(--uxdsl__density__2);padding:var(--uxdsl__density__4) var(--uxdsl__density__6);border-radius:9999px;transition:transform .2s;&:hover{transform:translateY(-2px);box-shadow:var(--uxdsl__shadow__4)}}.get-started-btn:hover{background:var(--uxdsl__button__contained-tone-primary-hover-bg,var(--uxdsl__button__contained-hover-bg));color:var(--uxdsl__button__contained-tone-primary-hover-color,var(--uxdsl__button__contained-hover-color))}.get-started-btn.is-selected,.get-started-btn[aria-pressed=true],.get-started-btn[aria-selected=true]{background:var(--uxdsl__button__contained-tone-primary-selected-bg,var(--uxdsl__button__contained-selected-bg));color:var(--uxdsl__button__contained-tone-primary-selected-color,var(--uxdsl__button__contained-selected-color))}.intro-section{width:100%;margin:0}.intro-text{font-family:var(--uxdsl__typography__span-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__span-size);line-height:var(--uxdsl__typography__span-line,1.5);font-weight:var(--uxdsl__typography__span-weight,400);letter-spacing:var(--uxdsl__typography__span-spacing,normal);text-transform:var(--uxdsl__typography__span-transform,none);text-decoration:var(--uxdsl__typography__span-decoration,none);font-style:var(--uxdsl__typography__span-style,normal);margin-block-start:var(--uxdsl__typography__span-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__span-margin-block-end,auto);color:var(--uxdsl__palette__text-secondary);text-align:center}.nav-grid{display:grid;grid-template-columns:1fr;margin-top:var(--uxdsl__density__2);margin-bottom:var(--uxdsl__density__2);box-sizing:border-box;@media (min-width:768px){grid-template-columns:repeat(2,1fr)}}.demo-section,.nav-grid{gap:var(--uxdsl__density__4);width:100%;max-width:100%}.demo-section{display:flex;flex-direction:column;align-items:center;margin-top:var(--uxdsl__density__4)}.section-label{font-family:var(--uxdsl__typography__h6-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__h6-size);line-height:var(--uxdsl__typography__h6-line,1.4);font-weight:var(--uxdsl__typography__h6-weight,600);letter-spacing:var(--uxdsl__typography__h6-spacing,normal);text-transform:var(--uxdsl__typography__h6-transform,none);text-decoration:var(--uxdsl__typography__h6-decoration,none);font-style:var(--uxdsl__typography__h6-style,normal);margin-block-start:var(--uxdsl__typography__h6-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h6-margin-block-end,auto);color:var(--uxdsl__palette__text-secondary);text-transform:uppercase;letter-spacing:.05em}.demo-wrapper-scale{width:100%}.welcome-footer{margin-top:auto;padding:var(--uxdsl__density__8) var(--uxdsl__density__4);background:var(--uxdsl__palette__surface-light);border-top:var(--uxdsl__border__1);display:flex;flex-direction:column;align-items:center;gap:var(--uxdsl__density__4);width:100%}.footer-links{display:flex;gap:var(--uxdsl__density__6);flex-wrap:wrap;justify-content:center}.footer-link{display:flex;align-items:center;gap:var(--uxdsl__density__2);color:var(--uxdsl__palette__text-secondary);text-decoration:none;font-weight:500;transition:color .2s;&:hover{color:var(--uxdsl__palette__primary-main)}}.footer-copy{font-family:var(--uxdsl__typography__caption-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__caption-size);line-height:var(--uxdsl__typography__caption-line,1.4);letter-spacing:var(--uxdsl__typography__caption-spacing,normal);text-transform:var(--uxdsl__typography__caption-transform,none);text-decoration:var(--uxdsl__typography__caption-decoration,none);font-style:var(--uxdsl__typography__caption-style,normal);margin-block-start:var(--uxdsl__typography__caption-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__caption-margin-block-end,auto);opacity:var(--uxdsl__typography__caption-opacity,.8);color:var(--uxdsl__palette__text-disabled)}}#ProductivityPage{.back-link{font-family:var(--uxdsl__typography__body-sm-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-sm-size);line-height:var(--uxdsl__typography__body-sm-line,1.5);font-weight:var(--uxdsl__typography__body-sm-weight,400);letter-spacing:var(--uxdsl__typography__body-sm-spacing,normal);text-transform:var(--uxdsl__typography__body-sm-transform,none);text-decoration:var(--uxdsl__typography__body-sm-decoration,none);font-style:var(--uxdsl__typography__body-sm-style,normal);margin-block-start:var(--uxdsl__typography__body-sm-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-sm-margin-block-end,auto);color:var(--uxdsl__palette__primary-main);text-decoration:none;font-weight:700}.back-link:hover{text-decoration:underline}}#ThemingPage{.palette-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--uxdsl__space__3)}.palette-swatch{border-radius:var(--uxdsl__surface__contained-radius);background:var(--uxdsl__surface__contained-bg);color:var(--uxdsl__surface__contained-color);border:var(--uxdsl__surface__contained-border);box-shadow:var(--uxdsl__surface__contained-shadow);padding:var(--uxdsl__space__3);border-radius:var(--uxdsl__radius__2);box-shadow:var(--uxdsl__shadow__1)}.palette-swatch__title{font-family:var(--uxdsl__typography__h5-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__h5-size);line-height:var(--uxdsl__typography__h5-line,1.4);font-weight:var(--uxdsl__typography__h5-weight,600);letter-spacing:var(--uxdsl__typography__h5-spacing,normal);text-transform:var(--uxdsl__typography__h5-transform,none);text-decoration:var(--uxdsl__typography__h5-decoration,none);font-style:var(--uxdsl__typography__h5-style,normal);margin-block-start:var(--uxdsl__typography__h5-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__h5-margin-block-end,auto);margin:0 0 var(--uxdsl__space__2) 0;text-transform:capitalize}.palette-swatch__rows{display:grid;gap:var(--uxdsl__space__1)}.palette-swatch .row{display:flex;align-items:baseline;justify-content:space-between}.palette-swatch .label{font-family:var(--uxdsl__typography__small-font-family,var(--uxdsl__font__ui-2,var(--uxdsl__font__ui)));font-size:var(--uxdsl__typography__small-size);line-height:var(--uxdsl__typography__small-line,1.4);letter-spacing:var(--uxdsl__typography__small-spacing,normal);text-transform:var(--uxdsl__typography__small-transform,none);text-decoration:var(--uxdsl__typography__small-decoration,none);font-style:var(--uxdsl__typography__small-style,normal);margin-block-start:var(--uxdsl__typography__small-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__small-margin-block-end,auto);opacity:var(--uxdsl__typography__small-opacity,.8);opacity:.75}.palette-swatch .value{font-family:var(--uxdsl__typography__body-font-family,var(--uxdsl__font__ui));font-size:var(--uxdsl__typography__body-size);line-height:var(--uxdsl__typography__body-line,1.6);font-weight:var(--uxdsl__typography__body-weight,400);letter-spacing:var(--uxdsl__typography__body-spacing,normal);text-transform:var(--uxdsl__typography__body-transform,none);text-decoration:var(--uxdsl__typography__body-decoration,none);font-style:var(--uxdsl__typography__body-style,normal);margin-block-start:var(--uxdsl__typography__body-margin-block-start,auto);margin-block-end:var(--uxdsl__typography__body-margin-block-end,auto)}}:root{--uxdsl__palette__primary-main:#7e22ce;--uxdsl__palette__primary-dark:#581c87;--uxdsl__palette__primary-contrast:#fff;--uxdsl__palette__primary-light:#a855f7;--uxdsl__palette__surface-main:#fff;--uxdsl__palette__surface-dark:#e2e8f0;--uxdsl__palette__surface-contrast:#0f172a;--uxdsl__palette__surface-light:#f8fafc;--uxdsl__palette__surface-paper:var(--uxdsl__palette__surface-light);--uxdsl__palette__surface-subtle:var(--uxdsl__palette__surface-dark);--uxdsl__palette__neutral-main:#64748b;--uxdsl__palette__neutral-dark:#334155;--uxdsl__palette__neutral-light:#cbd5e1;--uxdsl__palette__neutral-contrast:#fff;--uxdsl__palette__error-main:#dc2626;--uxdsl__palette__error-light:#ef4444;--uxdsl__palette__error-dark:#b91c1c;--uxdsl__palette__error-contrast:#fff;--uxdsl__palette__secondary-main:#db2777;--uxdsl__palette__secondary-light:#f472b6;--uxdsl__palette__secondary-dark:#be185d;--uxdsl__palette__secondary-contrast:#fff;--uxdsl__palette__tertiary-main:#94a3b8;--uxdsl__palette__tertiary-light:#cbd5e1;--uxdsl__palette__tertiary-dark:#475569;--uxdsl__palette__tertiary-contrast:#000;--uxdsl__palette__success-main:#15803d;--uxdsl__palette__success-light:#16a34a;--uxdsl__palette__success-dark:#14532d;--uxdsl__palette__success-contrast:#fff;--uxdsl__palette__info-main:#0369a1;--uxdsl__palette__info-light:#0284c7;--uxdsl__palette__info-dark:#075985;--uxdsl__palette__info-contrast:#fff;--uxdsl__palette__warning-main:#d97706;--uxdsl__palette__warning-light:#fbbf24;--uxdsl__palette__warning-dark:#c25e0a;--uxdsl__palette__warning-contrast:#000;--uxdsl__palette__dark-main:#0f172a;--uxdsl__palette__dark-light:#1e293b;--uxdsl__palette__dark-dark:#020617;--uxdsl__palette__dark-contrast:#fff;--uxdsl__palette__light-main:#f1f5f9;--uxdsl__palette__light-light:#fff;--uxdsl__palette__light-dark:#e2e8f0;--uxdsl__palette__light-contrast:#0f172a;--uxdsl__palette__text-main:var(--uxdsl__palette__text-primary);--uxdsl__palette__text-primary:var(--uxdsl__palette__surface-contrast);--uxdsl__palette__text-secondary:var(--uxdsl__palette__neutral-dark);--uxdsl__palette__text-disabled:var(--uxdsl__palette__tertiary-main);--uxdsl__palette__divider-main:var(--uxdsl__palette__surface-dark);--uxdsl__palette__action-disabled:var(--uxdsl__palette__text-disabled);--uxdsl__color__gray-300:#cbd5e1;--uxdsl__color__gray-400:#94a3b8;--uxdsl__color__gray-500:#64748b;--uxdsl__color__gray-600:#475569;--uxdsl__space__1:0.125rem;--uxdsl__space__2:0.25rem;--uxdsl__space__3:0.5rem;--uxdsl__space__4:0.75rem;--uxdsl__space__5:1rem;--uxdsl__space__6:1.5rem;--uxdsl__space__7:2rem;--uxdsl__space__8:2.5rem;--uxdsl__space__9:3.125rem;--uxdsl__space__10:3.875rem;--uxdsl__space__11:4.875rem;--uxdsl__space__12:6.125rem;--uxdsl__space__13:7.75rem;--uxdsl__space__14:9.75rem;--uxdsl__space__15:12.25rem;--uxdsl__space__16:15.375rem}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--uxdsl__palette__primary-main:#c084fc;--uxdsl__palette__primary-light:#d8b4fe;--uxdsl__palette__primary-dark:#a855f7;--uxdsl__palette__primary-contrast:#000;--uxdsl__palette__secondary-main:#f472b6;--uxdsl__palette__secondary-contrast:#000;--uxdsl__palette__surface-main:#020617;--uxdsl__palette__surface-light:#0f172a;--uxdsl__palette__surface-dark:#000;--uxdsl__palette__surface-contrast:#f8fafc;--uxdsl__palette__neutral-main:#94a3b8;--uxdsl__palette__neutral-light:#cbd5e1;--uxdsl__palette__neutral-dark:#475569;--uxdsl__palette__neutral-contrast:#000;--uxdsl__palette__tertiary-main:#94a3b8;--uxdsl__palette__tertiary-contrast:#000;--uxdsl__palette__success-main:#4ade80;--uxdsl__palette__success-contrast:#000;--uxdsl__palette__info-main:#38bdf8;--uxdsl__palette__info-contrast:#000;--uxdsl__palette__warning-main:#fbbf24;--uxdsl__palette__warning-contrast:#000;--uxdsl__palette__error-main:#f87171;--uxdsl__palette__error-contrast:#000;--uxdsl__palette__light-main:#1e293b;--uxdsl__palette__light-contrast:#f8fafc;--uxdsl__palette__dark-main:#000;--uxdsl__palette__dark-contrast:#f8fafc}}:root[data-theme=dark]{--uxdsl__palette__primary-main:#c084fc;--uxdsl__palette__primary-light:#d8b4fe;--uxdsl__palette__primary-dark:#a855f7;--uxdsl__palette__primary-contrast:#000;--uxdsl__palette__secondary-main:#f472b6;--uxdsl__palette__secondary-contrast:#000;--uxdsl__palette__surface-main:#020617;--uxdsl__palette__surface-light:#0f172a;--uxdsl__palette__surface-dark:#000;--uxdsl__palette__surface-contrast:#f8fafc;--uxdsl__palette__neutral-main:#94a3b8;--uxdsl__palette__neutral-light:#cbd5e1;--uxdsl__palette__neutral-dark:#475569;--uxdsl__palette__neutral-contrast:#000;--uxdsl__palette__tertiary-main:#94a3b8;--uxdsl__palette__tertiary-contrast:#000;--uxdsl__palette__success-main:#4ade80;--uxdsl__palette__success-contrast:#000;--uxdsl__palette__info-main:#38bdf8;--uxdsl__palette__info-contrast:#000;--uxdsl__palette__warning-main:#fbbf24;--uxdsl__palette__warning-contrast:#000;--uxdsl__palette__error-main:#f87171;--uxdsl__palette__error-contrast:#000;--uxdsl__palette__light-main:#1e293b;--uxdsl__palette__light-contrast:#f8fafc;--uxdsl__palette__dark-main:#000;--uxdsl__palette__dark-contrast:#f8fafc}:root{--uxdsl__font__ui:Inter,sans-serif;--uxdsl__font__ui-2:Roboto,"Helvetica Neue",Arial,sans-serif;--uxdsl__font__code:monospace;--font-code:"JetBrains Mono","SF Mono",Menlo,monospace;--uxdsl__typography__default-size:var(--uxdsl__space__5);--uxdsl__typography__default-weight:400;--uxdsl__typography__default-line:1.6;--uxdsl__typography__default-spacing:normal;--uxdsl__typography__tag-size:var(--uxdsl__space__4);--uxdsl__typography__tag-weight:400;--uxdsl__typography__tag-line:1.4;--uxdsl__typography__tag-spacing:0.01em;--uxdsl__typography__h1-size:var(--uxdsl__space__7);--uxdsl__typography__h1-weight:700;--uxdsl__typography__h1-line:1.2;--uxdsl__typography__h1-spacing:-0.02em;--uxdsl__typography__h1-margin-block-end:0.2em;--uxdsl__typography__h2-size:var(--uxdsl__space__6);--uxdsl__typography__h2-weight:700;--uxdsl__typography__h2-line:1.2;--uxdsl__typography__h2-spacing:-0.01em;--uxdsl__typography__h3-size:var(--uxdsl__space__6);--uxdsl__typography__h3-weight:600;--uxdsl__typography__h3-line:1.3;--uxdsl__typography__h3-spacing:normal;--uxdsl__typography__h4-size:var(--uxdsl__space__5);--uxdsl__typography__h4-weight:600;--uxdsl__typography__h4-line:1.4;--uxdsl__typography__h4-spacing:normal;--uxdsl__typography__h5-size:var(--uxdsl__space__5);--uxdsl__typography__h5-weight:600;--uxdsl__typography__h5-line:1.4;--uxdsl__typography__h5-spacing:normal;--uxdsl__typography__h6-size:var(--uxdsl__space__5);--uxdsl__typography__h6-weight:600;--uxdsl__typography__h6-line:1.4;--uxdsl__typography__h6-spacing:normal;--uxdsl__typography__p-size:var(--uxdsl__space__5);--uxdsl__typography__p-weight:400;--uxdsl__typography__p-line:1.6;--uxdsl__typography__p-spacing:normal;--uxdsl__typography__body-size:var(--uxdsl__space__5);--uxdsl__typography__body-weight:400;--uxdsl__typography__body-line:1.6;--uxdsl__typography__body-spacing:normal;--uxdsl__typography__span-size:var(--uxdsl__space__5);--uxdsl__typography__span-weight:400;--uxdsl__typography__span-line:1.6;--uxdsl__typography__span-spacing:normal;--uxdsl__typography__small-size:var(--uxdsl__space__4);--uxdsl__typography__small-weight:400;--uxdsl__typography__small-line:1.4;--uxdsl__typography__small-spacing:0.01em;--uxdsl__typography__code-size:var(--uxdsl__space__4);--uxdsl__typography__code-weight:400;--uxdsl__typography__code-line:1.55;--uxdsl__typography__code-spacing:normal;--uxdsl__typography__pre-size:var(--uxdsl__space__4);--uxdsl__typography__pre-weight:400;--uxdsl__typography__pre-line:1.55;--uxdsl__typography__pre-spacing:normal;--uxdsl__typography__caption-size:var(--uxdsl__space__4);--uxdsl__typography__caption-weight:400;--uxdsl__typography__caption-line:1.4;--uxdsl__typography__caption-spacing:0.01em;--uxdsl__typography__body-sm-size:var(--uxdsl__space__4);--uxdsl__typography__body-sm-weight:400;--uxdsl__typography__body-sm-line:1.4;--uxdsl__typography__body-sm-spacing:0.01em;--uxdsl__typography__subtitle2-size:var(--uxdsl__space__4);--uxdsl__typography__subtitle2-weight:500;--uxdsl__typography__subtitle2-line:1.4;--uxdsl__typography__subtitle2-spacing:0.01em}@media (min-width:480px){:root{--uxdsl__typography__h2-size:var(--uxdsl__space__7)}}@media (min-width:768px){:root{--uxdsl__typography__default-line:1.7;--uxdsl__typography__tag-line:1.5;--uxdsl__typography__h1-size:var(--uxdsl__space__8);--uxdsl__typography__h1-line:1.3;--uxdsl__typography__h2-line:1.3;--uxdsl__typography__h3-size:var(--uxdsl__space__7);--uxdsl__typography__h3-line:1.4;--uxdsl__typography__h4-size:var(--uxdsl__space__6);--uxdsl__typography__h4-line:1.5;--uxdsl__typography__h5-line:1.5;--uxdsl__typography__h6-line:1.5;--uxdsl__typography__p-line:1.7;--uxdsl__typography__body-line:1.7;--uxdsl__typography__span-line:1.7;--uxdsl__typography__small-line:1.5;--uxdsl__typography__code-line:1.6;--uxdsl__typography__pre-line:1.6;--uxdsl__typography__caption-line:1.5;--uxdsl__typography__body-sm-line:1.5;--uxdsl__typography__subtitle2-line:1.5}}@media (min-width:1024px){:root{--uxdsl__typography__h1-size:var(--uxdsl__space__9);--uxdsl__typography__h2-size:var(--uxdsl__space__8)}}@media (min-width:1280px){:root{--uxdsl__typography__h1-size:var(--uxdsl__space__10);--uxdsl__typography__h2-size:var(--uxdsl__space__9);--uxdsl__typography__h3-size:var(--uxdsl__space__8);--uxdsl__typography__h4-size:var(--uxdsl__space__7);--uxdsl__typography__h5-size:var(--uxdsl__space__6)}}:root{--uxdsl__shadow__0:none;--uxdsl__shadow__1:0 1px 2px rgba(0,0,0,.06),0 1px 3px rgba(0,0,0,.1);--uxdsl__shadow__2:0 1px 2px rgba(0,0,0,.05),0 2px 6px rgba(0,0,0,.12);--uxdsl__shadow__3:0 2px 4px rgba(0,0,0,.06),0 4px 10px rgba(0,0,0,.14);--uxdsl__shadow__4:0 4px 6px rgba(0,0,0,.08),0 10px 15px rgba(0,0,0,.16);--uxdsl__shadow__5:0 10px 15px rgba(0,0,0,.1),0 20px 25px rgba(0,0,0,.2);--uxdsl__border__1:1px solid var(--uxdsl__color__gray-300);--uxdsl__border__2:var(--uxdsl__space__1) solid var(--uxdsl__color__gray-300);--uxdsl__border__3:var(--uxdsl__space__2) solid var(--uxdsl__color__gray-400);--uxdsl__border__4:var(--uxdsl__space__3) solid var(--uxdsl__color__gray-500);--uxdsl__border__5:var(--uxdsl__space__4) solid var(--uxdsl__color__gray-600);--uxdsl__radius__0:0;--uxdsl__radius__1:var(--uxdsl__space__1);--uxdsl__radius__2:var(--uxdsl__space__2);--uxdsl__radius__3:var(--uxdsl__space__3);--uxdsl__radius__4:var(--uxdsl__space__4);--uxdsl__radius__5:var(--uxdsl__space__6)}@media (min-width:1024px){:root{--uxdsl__radius__1:var(--uxdsl__space__2);--uxdsl__radius__2:var(--uxdsl__space__3);--uxdsl__radius__3:var(--uxdsl__space__4);--uxdsl__radius__4:var(--uxdsl__space__6);--uxdsl__radius__5:var(--uxdsl__space__8)}}@media (min-width:768px){:root{--uxdsl__density__7:var(--uxdsl__space__8);--uxdsl__density__8:var(--uxdsl__space__9);--uxdsl__density__9:var(--uxdsl__space__10);--uxdsl__density__10:var(--uxdsl__space__11);--uxdsl__density__11:var(--uxdsl__space__12);--uxdsl__density__12:var(--uxdsl__space__13);--uxdsl__density__13:var(--uxdsl__space__14);--uxdsl__density__14:var(--uxdsl__space__15);--uxdsl__density__15:var(--uxdsl__space__16)}}@media (min-width:1024px){:root{--uxdsl__density__1:var(--uxdsl__space__2);--uxdsl__density__2:var(--uxdsl__space__3);--uxdsl__density__3:var(--uxdsl__space__4);--uxdsl__density__4:var(--uxdsl__space__5);--uxdsl__density__5:var(--uxdsl__space__6);--uxdsl__density__6:var(--uxdsl__space__7)}}@media (min-width:1280px){:root{--uxdsl__density__7:var(--uxdsl__space__9);--uxdsl__density__8:var(--uxdsl__space__10);--uxdsl__density__9:var(--uxdsl__space__11);--uxdsl__density__10:var(--uxdsl__space__12);--uxdsl__density__11:var(--uxdsl__space__13);--uxdsl__density__12:var(--uxdsl__space__14);--uxdsl__density__13:var(--uxdsl__space__15);--uxdsl__density__14:var(--uxdsl__space__16)}}:root{--uxdsl__surface__contained-padding:var(--uxdsl__density__2);--uxdsl__surface__contained-radius:var(--uxdsl__radius__2);--uxdsl__surface__contained-bg:var(--uxdsl__palette__surface-main);--uxdsl__surface__contained-color:var(--uxdsl__palette__surface-contrast);--uxdsl__surface__contained-border:1px solid var(--uxdsl__palette__surface-dark);--uxdsl__surface__contained-shadow:var(--uxdsl__shadow__1);--uxdsl__surface__outlined-padding:var(--uxdsl__density__2);--uxdsl__surface__outlined-radius:var(--uxdsl__radius__2);--uxdsl__surface__outlined-bg:transparent;--uxdsl__surface__outlined-color:var(--uxdsl__palette__surface-contrast);--uxdsl__surface__outlined-border:1px solid var(--uxdsl__palette__neutral-main);--uxdsl__surface__outlined-shadow:none;--uxdsl__surface__flat-padding:var(--uxdsl__density__2);--uxdsl__surface__flat-radius:var(--uxdsl__radius__2);--uxdsl__surface__flat-bg:transparent;--uxdsl__surface__flat-color:var(--uxdsl__palette__surface-contrast);--uxdsl__surface__flat-border:none;--uxdsl__surface__flat-shadow:none;--uxdsl__button__contained-hover-bg:var(--uxdsl__button__tone-dark,var(--uxdsl__palette__primary-dark));--uxdsl__button__contained-hover-color:var(--uxdsl__button__tone-contrast,var(--uxdsl__palette__primary-contrast));--uxdsl__button__contained-tone-primary-hover-bg:var(--uxdsl__palette__primary-dark);--uxdsl__button__contained-tone-primary-hover-color:var(--uxdsl__palette__primary-contrast);--uxdsl__button__contained-tone-surface-hover-bg:var(--uxdsl__palette__surface-dark);--uxdsl__button__contained-tone-surface-hover-color:var(--uxdsl__palette__surface-contrast);--uxdsl__button__contained-tone-neutral-hover-bg:var(--uxdsl__palette__neutral-dark);--uxdsl__button__contained-tone-neutral-hover-color:var(--uxdsl__palette__neutral-contrast);--uxdsl__button__contained-tone-error-hover-bg:var(--uxdsl__palette__error-dark);--uxdsl__button__contained-tone-error-hover-color:var(--uxdsl__palette__error-contrast);--uxdsl__button__contained-tone-secondary-hover-bg:var(--uxdsl__palette__secondary-dark);--uxdsl__button__contained-tone-secondary-hover-color:var(--uxdsl__palette__secondary-contrast);--uxdsl__button__contained-tone-tertiary-hover-bg:var(--uxdsl__palette__tertiary-dark);--uxdsl__button__contained-tone-tertiary-hover-color:var(--uxdsl__palette__tertiary-contrast);--uxdsl__button__contained-tone-success-hover-bg:var(--uxdsl__palette__success-dark);--uxdsl__button__contained-tone-success-hover-color:var(--uxdsl__palette__success-contrast);--uxdsl__button__contained-tone-info-hover-bg:var(--uxdsl__palette__info-dark);--uxdsl__button__contained-tone-info-hover-color:var(--uxdsl__palette__info-contrast);--uxdsl__button__contained-tone-warning-hover-bg:var(--uxdsl__palette__warning-dark);--uxdsl__button__contained-tone-warning-hover-color:var(--uxdsl__palette__warning-contrast);--uxdsl__button__contained-tone-dark-hover-bg:var(--uxdsl__palette__dark-dark);--uxdsl__button__contained-tone-dark-hover-color:var(--uxdsl__palette__dark-contrast);--uxdsl__button__contained-tone-light-hover-bg:var(--uxdsl__palette__light-dark);--uxdsl__button__contained-tone-light-hover-color:var(--uxdsl__palette__light-contrast);--uxdsl__button__contained-selected-bg:var(--uxdsl__button__tone-dark,var(--uxdsl__palette__primary-dark));--uxdsl__button__contained-selected-color:var(--uxdsl__button__tone-contrast,var(--uxdsl__palette__primary-contrast));--uxdsl__button__contained-tone-primary-selected-bg:var(--uxdsl__palette__primary-dark);--uxdsl__button__contained-tone-primary-selected-color:var(--uxdsl__palette__primary-contrast);--uxdsl__button__contained-tone-surface-selected-bg:var(--uxdsl__palette__surface-dark);--uxdsl__button__contained-tone-surface-selected-color:var(--uxdsl__palette__surface-contrast);--uxdsl__button__contained-tone-neutral-selected-bg:var(--uxdsl__palette__neutral-dark);--uxdsl__button__contained-tone-neutral-selected-color:var(--uxdsl__palette__neutral-contrast);--uxdsl__button__contained-tone-error-selected-bg:var(--uxdsl__palette__error-dark);--uxdsl__button__contained-tone-error-selected-color:var(--uxdsl__palette__error-contrast);--uxdsl__button__contained-tone-secondary-selected-bg:var(--uxdsl__palette__secondary-dark);--uxdsl__button__contained-tone-secondary-selected-color:var(--uxdsl__palette__secondary-contrast);--uxdsl__button__contained-tone-tertiary-selected-bg:var(--uxdsl__palette__tertiary-dark);--uxdsl__button__contained-tone-tertiary-selected-color:var(--uxdsl__palette__tertiary-contrast);--uxdsl__button__contained-tone-success-selected-bg:var(--uxdsl__palette__success-dark);--uxdsl__button__contained-tone-success-selected-color:var(--uxdsl__palette__success-contrast);--uxdsl__button__contained-tone-info-selected-bg:var(--uxdsl__palette__info-dark);--uxdsl__button__contained-tone-info-selected-color:var(--uxdsl__palette__info-contrast);--uxdsl__button__contained-tone-warning-selected-bg:var(--uxdsl__palette__warning-dark);--uxdsl__button__contained-tone-warning-selected-color:var(--uxdsl__palette__warning-contrast);--uxdsl__button__contained-tone-dark-selected-bg:var(--uxdsl__palette__dark-dark);--uxdsl__button__contained-tone-dark-selected-color:var(--uxdsl__palette__dark-contrast);--uxdsl__button__contained-tone-light-selected-bg:var(--uxdsl__palette__light-dark);--uxdsl__button__contained-tone-light-selected-color:var(--uxdsl__palette__light-contrast);--uxdsl__button__outlined-hover-color:var(--uxdsl__button__tone-dark,var(--uxdsl__palette__primary-dark));--uxdsl__button__outlined-hover-border:1px solid var(--uxdsl__button__tone-dark,var(--uxdsl__palette__primary-dark));--uxdsl__button__outlined-tone-primary-hover-color:var(--uxdsl__palette__primary-dark);--uxdsl__button__outlined-tone-primary-hover-border:1px solid var(--uxdsl__palette__primary-dark);--uxdsl__button__outlined-tone-surface-hover-color:var(--uxdsl__palette__surface-dark);--uxdsl__button__outlined-tone-surface-hover-border:1px solid var(--uxdsl__palette__surface-dark);--uxdsl__button__outlined-tone-neutral-hover-color:var(--uxdsl__palette__neutral-dark);--uxdsl__button__outlined-tone-neutral-hover-border:1px solid var(--uxdsl__palette__neutral-dark);--uxdsl__button__outlined-tone-error-hover-color:var(--uxdsl__palette__error-dark);--uxdsl__button__outlined-tone-error-hover-border:1px solid var(--uxdsl__palette__error-dark);--uxdsl__button__outlined-tone-secondary-hover-color:var(--uxdsl__palette__secondary-dark);--uxdsl__button__outlined-tone-secondary-hover-border:1px solid var(--uxdsl__palette__secondary-dark);--uxdsl__button__outlined-tone-tertiary-hover-color:var(--uxdsl__palette__tertiary-dark);--uxdsl__button__outlined-tone-tertiary-hover-border:1px solid var(--uxdsl__palette__tertiary-dark);--uxdsl__button__outlined-tone-success-hover-color:var(--uxdsl__palette__success-dark);--uxdsl__button__outlined-tone-success-hover-border:1px solid var(--uxdsl__palette__success-dark);--uxdsl__button__outlined-tone-info-hover-color:var(--uxdsl__palette__info-dark);--uxdsl__button__outlined-tone-info-hover-border:1px solid var(--uxdsl__palette__info-dark);--uxdsl__button__outlined-tone-warning-hover-color:var(--uxdsl__palette__warning-dark);--uxdsl__button__outlined-tone-warning-hover-border:1px solid var(--uxdsl__palette__warning-dark);--uxdsl__button__outlined-tone-dark-hover-color:var(--uxdsl__palette__dark-dark);--uxdsl__button__outlined-tone-dark-hover-border:1px solid var(--uxdsl__palette__dark-dark);--uxdsl__button__outlined-tone-light-hover-color:var(--uxdsl__palette__light-dark);--uxdsl__button__outlined-tone-light-hover-border:1px solid var(--uxdsl__palette__light-dark);--uxdsl__button__outlined-selected-bg:var(--uxdsl__button__tone-main,var(--uxdsl__palette__primary-main));--uxdsl__button__outlined-selected-color:var(--uxdsl__button__tone-contrast,var(--uxdsl__palette__primary-contrast));--uxdsl__button__outlined-selected-border:1px solid var(--uxdsl__button__tone-main,var(--uxdsl__palette__primary-main));--uxdsl__button__outlined-tone-primary-selected-bg:var(--uxdsl__palette__primary-main);--uxdsl__button__outlined-tone-primary-selected-color:var(--uxdsl__palette__primary-contrast);--uxdsl__button__outlined-tone-primary-selected-border:1px solid var(--uxdsl__palette__primary-main);--uxdsl__button__outlined-tone-surface-selected-bg:var(--uxdsl__palette__surface-main);--uxdsl__button__outlined-tone-surface-selected-color:var(--uxdsl__palette__surface-contrast);--uxdsl__button__outlined-tone-surface-selected-border:1px solid var(--uxdsl__palette__surface-main);--uxdsl__button__outlined-tone-neutral-selected-bg:var(--uxdsl__palette__neutral-main);--uxdsl__button__outlined-tone-neutral-selected-color:var(--uxdsl__palette__neutral-contrast);--uxdsl__button__outlined-tone-neutral-selected-border:1px solid var(--uxdsl__palette__neutral-main);--uxdsl__button__outlined-tone-error-selected-bg:var(--uxdsl__palette__error-main);--uxdsl__button__outlined-tone-error-selected-color:var(--uxdsl__palette__error-contrast);--uxdsl__button__outlined-tone-error-selected-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__button__outlined-tone-secondary-selected-bg:var(--uxdsl__palette__secondary-main);--uxdsl__button__outlined-tone-secondary-selected-color:var(--uxdsl__palette__secondary-contrast);--uxdsl__button__outlined-tone-secondary-selected-border:1px solid var(--uxdsl__palette__secondary-main);--uxdsl__button__outlined-tone-tertiary-selected-bg:var(--uxdsl__palette__tertiary-main);--uxdsl__button__outlined-tone-tertiary-selected-color:var(--uxdsl__palette__tertiary-contrast);--uxdsl__button__outlined-tone-tertiary-selected-border:1px solid var(--uxdsl__palette__tertiary-main);--uxdsl__button__outlined-tone-success-selected-bg:var(--uxdsl__palette__success-main);--uxdsl__button__outlined-tone-success-selected-color:var(--uxdsl__palette__success-contrast);--uxdsl__button__outlined-tone-success-selected-border:1px solid var(--uxdsl__palette__success-main);--uxdsl__button__outlined-tone-info-selected-bg:var(--uxdsl__palette__info-main);--uxdsl__button__outlined-tone-info-selected-color:var(--uxdsl__palette__info-contrast);--uxdsl__button__outlined-tone-info-selected-border:1px solid var(--uxdsl__palette__info-main);--uxdsl__button__outlined-tone-warning-selected-bg:var(--uxdsl__palette__warning-main);--uxdsl__button__outlined-tone-warning-selected-color:var(--uxdsl__palette__warning-contrast);--uxdsl__button__outlined-tone-warning-selected-border:1px solid var(--uxdsl__palette__warning-main);--uxdsl__button__outlined-tone-dark-selected-bg:var(--uxdsl__palette__dark-main);--uxdsl__button__outlined-tone-dark-selected-color:var(--uxdsl__palette__dark-contrast);--uxdsl__button__outlined-tone-dark-selected-border:1px solid var(--uxdsl__palette__dark-main);--uxdsl__button__outlined-tone-light-selected-bg:var(--uxdsl__palette__light-main);--uxdsl__button__outlined-tone-light-selected-color:var(--uxdsl__palette__light-contrast);--uxdsl__button__outlined-tone-light-selected-border:1px solid var(--uxdsl__palette__light-main);--uxdsl__button__flat-hover-color:var(--uxdsl__button__tone-dark,var(--uxdsl__palette__primary-dark));--uxdsl__button__flat-tone-primary-hover-color:var(--uxdsl__palette__primary-dark);--uxdsl__button__flat-tone-surface-hover-color:var(--uxdsl__palette__surface-dark);--uxdsl__button__flat-tone-neutral-hover-color:var(--uxdsl__palette__neutral-dark);--uxdsl__button__flat-tone-error-hover-color:var(--uxdsl__palette__error-dark);--uxdsl__button__flat-tone-secondary-hover-color:var(--uxdsl__palette__secondary-dark);--uxdsl__button__flat-tone-tertiary-hover-color:var(--uxdsl__palette__tertiary-dark);--uxdsl__button__flat-tone-success-hover-color:var(--uxdsl__palette__success-dark);--uxdsl__button__flat-tone-info-hover-color:var(--uxdsl__palette__info-dark);--uxdsl__button__flat-tone-warning-hover-color:var(--uxdsl__palette__warning-dark);--uxdsl__button__flat-tone-dark-hover-color:var(--uxdsl__palette__dark-dark);--uxdsl__button__flat-tone-light-hover-color:var(--uxdsl__palette__light-dark);--uxdsl__button__flat-selected-color:var(--uxdsl__button__tone-dark,var(--uxdsl__palette__primary-dark));--uxdsl__button__flat-tone-primary-selected-color:var(--uxdsl__palette__primary-dark);--uxdsl__button__flat-tone-surface-selected-color:var(--uxdsl__palette__surface-dark);--uxdsl__button__flat-tone-neutral-selected-color:var(--uxdsl__palette__neutral-dark);--uxdsl__button__flat-tone-error-selected-color:var(--uxdsl__palette__error-dark);--uxdsl__button__flat-tone-secondary-selected-color:var(--uxdsl__palette__secondary-dark);--uxdsl__button__flat-tone-tertiary-selected-color:var(--uxdsl__palette__tertiary-dark);--uxdsl__button__flat-tone-success-selected-color:var(--uxdsl__palette__success-dark);--uxdsl__button__flat-tone-info-selected-color:var(--uxdsl__palette__info-dark);--uxdsl__button__flat-tone-warning-selected-color:var(--uxdsl__palette__warning-dark);--uxdsl__button__flat-tone-dark-selected-color:var(--uxdsl__palette__dark-dark);--uxdsl__button__flat-tone-light-selected-color:var(--uxdsl__palette__light-dark);--uxdsl__input__contained-base-caret:var(--uxdsl__input__tone-main,var(--uxdsl__palette__primary-main));--uxdsl__input__contained-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-primary-base-caret:var(--uxdsl__palette__primary-main);--uxdsl__input__contained-tone-primary-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-surface-base-caret:var(--uxdsl__palette__surface-main);--uxdsl__input__contained-tone-surface-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-neutral-base-caret:var(--uxdsl__palette__neutral-main);--uxdsl__input__contained-tone-neutral-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-error-base-caret:var(--uxdsl__palette__error-main);--uxdsl__input__contained-tone-error-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-secondary-base-caret:var(--uxdsl__palette__secondary-main);--uxdsl__input__contained-tone-secondary-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-tertiary-base-caret:var(--uxdsl__palette__tertiary-main);--uxdsl__input__contained-tone-tertiary-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-success-base-caret:var(--uxdsl__palette__success-main);--uxdsl__input__contained-tone-success-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-info-base-caret:var(--uxdsl__palette__info-main);--uxdsl__input__contained-tone-info-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-warning-base-caret:var(--uxdsl__palette__warning-main);--uxdsl__input__contained-tone-warning-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-dark-base-caret:var(--uxdsl__palette__dark-main);--uxdsl__input__contained-tone-dark-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-light-base-caret:var(--uxdsl__palette__light-main);--uxdsl__input__contained-tone-light-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-focus-border:1px solid var(--uxdsl__input__tone-main,var(--uxdsl__palette__primary-main));--uxdsl__input__contained-focus-shadow:var(--uxdsl__shadow__2);--uxdsl__input__contained-tone-primary-focus-border:1px solid var(--uxdsl__palette__primary-main);--uxdsl__input__contained-tone-primary-focus-shadow:var(--uxdsl__shadow__2);--uxdsl__input__contained-tone-surface-focus-border:1px solid var(--uxdsl__palette__surface-main);--uxdsl__input__contained-tone-surface-focus-shadow:var(--uxdsl__shadow__2);--uxdsl__input__contained-tone-neutral-focus-border:1px solid var(--uxdsl__palette__neutral-main);--uxdsl__input__contained-tone-neutral-focus-shadow:var(--uxdsl__shadow__2);--uxdsl__input__contained-tone-error-focus-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__contained-tone-error-focus-shadow:var(--uxdsl__shadow__2);--uxdsl__input__contained-tone-secondary-focus-border:1px solid var(--uxdsl__palette__secondary-main);--uxdsl__input__contained-tone-secondary-focus-shadow:var(--uxdsl__shadow__2);--uxdsl__input__contained-tone-tertiary-focus-border:1px solid var(--uxdsl__palette__tertiary-main);--uxdsl__input__contained-tone-tertiary-focus-shadow:var(--uxdsl__shadow__2);--uxdsl__input__contained-tone-success-focus-border:1px solid var(--uxdsl__palette__success-main);--uxdsl__input__contained-tone-success-focus-shadow:var(--uxdsl__shadow__2);--uxdsl__input__contained-tone-info-focus-border:1px solid var(--uxdsl__palette__info-main);--uxdsl__input__contained-tone-info-focus-shadow:var(--uxdsl__shadow__2);--uxdsl__input__contained-tone-warning-focus-border:1px solid var(--uxdsl__palette__warning-main);--uxdsl__input__contained-tone-warning-focus-shadow:var(--uxdsl__shadow__2);--uxdsl__input__contained-tone-dark-focus-border:1px solid var(--uxdsl__palette__dark-main);--uxdsl__input__contained-tone-dark-focus-shadow:var(--uxdsl__shadow__2);--uxdsl__input__contained-tone-light-focus-border:1px solid var(--uxdsl__palette__light-main);--uxdsl__input__contained-tone-light-focus-shadow:var(--uxdsl__shadow__2);--uxdsl__input__contained-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__contained-tone-primary-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__contained-tone-surface-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__contained-tone-neutral-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__contained-tone-error-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__contained-tone-secondary-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__contained-tone-tertiary-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__contained-tone-success-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__contained-tone-info-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__contained-tone-warning-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__contained-tone-dark-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__contained-tone-light-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__contained-disabled-color:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-disabled-opacity:0.6;--uxdsl__input__contained-tone-primary-disabled-color:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-primary-disabled-opacity:0.6;--uxdsl__input__contained-tone-surface-disabled-color:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-surface-disabled-opacity:0.6;--uxdsl__input__contained-tone-neutral-disabled-color:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-neutral-disabled-opacity:0.6;--uxdsl__input__contained-tone-error-disabled-color:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-error-disabled-opacity:0.6;--uxdsl__input__contained-tone-secondary-disabled-color:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-secondary-disabled-opacity:0.6;--uxdsl__input__contained-tone-tertiary-disabled-color:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-tertiary-disabled-opacity:0.6;--uxdsl__input__contained-tone-success-disabled-color:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-success-disabled-opacity:0.6;--uxdsl__input__contained-tone-info-disabled-color:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-info-disabled-opacity:0.6;--uxdsl__input__contained-tone-warning-disabled-color:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-warning-disabled-opacity:0.6;--uxdsl__input__contained-tone-dark-disabled-color:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-dark-disabled-opacity:0.6;--uxdsl__input__contained-tone-light-disabled-color:var(--uxdsl__palette__neutral-dark);--uxdsl__input__contained-tone-light-disabled-opacity:0.6;--uxdsl__input__outlined-base-caret:var(--uxdsl__input__tone-main,var(--uxdsl__palette__primary-main));--uxdsl__input__outlined-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__outlined-tone-primary-base-caret:var(--uxdsl__palette__primary-main);--uxdsl__input__outlined-tone-primary-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__outlined-tone-surface-base-caret:var(--uxdsl__palette__surface-main);--uxdsl__input__outlined-tone-surface-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__outlined-tone-neutral-base-caret:var(--uxdsl__palette__neutral-main);--uxdsl__input__outlined-tone-neutral-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__outlined-tone-error-base-caret:var(--uxdsl__palette__error-main);--uxdsl__input__outlined-tone-error-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__outlined-tone-secondary-base-caret:var(--uxdsl__palette__secondary-main);--uxdsl__input__outlined-tone-secondary-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__outlined-tone-tertiary-base-caret:var(--uxdsl__palette__tertiary-main);--uxdsl__input__outlined-tone-tertiary-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__outlined-tone-success-base-caret:var(--uxdsl__palette__success-main);--uxdsl__input__outlined-tone-success-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__outlined-tone-info-base-caret:var(--uxdsl__palette__info-main);--uxdsl__input__outlined-tone-info-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__outlined-tone-warning-base-caret:var(--uxdsl__palette__warning-main);--uxdsl__input__outlined-tone-warning-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__outlined-tone-dark-base-caret:var(--uxdsl__palette__dark-main);--uxdsl__input__outlined-tone-dark-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__outlined-tone-light-base-caret:var(--uxdsl__palette__light-main);--uxdsl__input__outlined-tone-light-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__outlined-focus-border:1px solid var(--uxdsl__input__tone-main,var(--uxdsl__palette__primary-main));--uxdsl__input__outlined-tone-primary-focus-border:1px solid var(--uxdsl__palette__primary-main);--uxdsl__input__outlined-tone-surface-focus-border:1px solid var(--uxdsl__palette__surface-main);--uxdsl__input__outlined-tone-neutral-focus-border:1px solid var(--uxdsl__palette__neutral-main);--uxdsl__input__outlined-tone-error-focus-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__outlined-tone-secondary-focus-border:1px solid var(--uxdsl__palette__secondary-main);--uxdsl__input__outlined-tone-tertiary-focus-border:1px solid var(--uxdsl__palette__tertiary-main);--uxdsl__input__outlined-tone-success-focus-border:1px solid var(--uxdsl__palette__success-main);--uxdsl__input__outlined-tone-info-focus-border:1px solid var(--uxdsl__palette__info-main);--uxdsl__input__outlined-tone-warning-focus-border:1px solid var(--uxdsl__palette__warning-main);--uxdsl__input__outlined-tone-dark-focus-border:1px solid var(--uxdsl__palette__dark-main);--uxdsl__input__outlined-tone-light-focus-border:1px solid var(--uxdsl__palette__light-main);--uxdsl__input__outlined-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__outlined-tone-primary-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__outlined-tone-surface-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__outlined-tone-neutral-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__outlined-tone-error-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__outlined-tone-secondary-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__outlined-tone-tertiary-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__outlined-tone-success-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__outlined-tone-info-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__outlined-tone-warning-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__outlined-tone-dark-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__outlined-tone-light-invalid-border:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__outlined-disabled-opacity:0.6;--uxdsl__input__outlined-tone-primary-disabled-opacity:0.6;--uxdsl__input__outlined-tone-surface-disabled-opacity:0.6;--uxdsl__input__outlined-tone-neutral-disabled-opacity:0.6;--uxdsl__input__outlined-tone-error-disabled-opacity:0.6;--uxdsl__input__outlined-tone-secondary-disabled-opacity:0.6;--uxdsl__input__outlined-tone-tertiary-disabled-opacity:0.6;--uxdsl__input__outlined-tone-success-disabled-opacity:0.6;--uxdsl__input__outlined-tone-info-disabled-opacity:0.6;--uxdsl__input__outlined-tone-warning-disabled-opacity:0.6;--uxdsl__input__outlined-tone-dark-disabled-opacity:0.6;--uxdsl__input__outlined-tone-light-disabled-opacity:0.6;--uxdsl__input__underline-base-border:none;--uxdsl__input__underline-base-shadow:none;--uxdsl__input__underline-base-underline:1px solid var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-base-caret:var(--uxdsl__input__tone-main,var(--uxdsl__palette__primary-main));--uxdsl__input__underline-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-primary-base-border:none;--uxdsl__input__underline-tone-primary-base-shadow:none;--uxdsl__input__underline-tone-primary-base-underline:1px solid var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-primary-base-caret:var(--uxdsl__palette__primary-main);--uxdsl__input__underline-tone-primary-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-surface-base-border:none;--uxdsl__input__underline-tone-surface-base-shadow:none;--uxdsl__input__underline-tone-surface-base-underline:1px solid var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-surface-base-caret:var(--uxdsl__palette__surface-main);--uxdsl__input__underline-tone-surface-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-neutral-base-border:none;--uxdsl__input__underline-tone-neutral-base-shadow:none;--uxdsl__input__underline-tone-neutral-base-underline:1px solid var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-neutral-base-caret:var(--uxdsl__palette__neutral-main);--uxdsl__input__underline-tone-neutral-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-error-base-border:none;--uxdsl__input__underline-tone-error-base-shadow:none;--uxdsl__input__underline-tone-error-base-underline:1px solid var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-error-base-caret:var(--uxdsl__palette__error-main);--uxdsl__input__underline-tone-error-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-secondary-base-border:none;--uxdsl__input__underline-tone-secondary-base-shadow:none;--uxdsl__input__underline-tone-secondary-base-underline:1px solid var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-secondary-base-caret:var(--uxdsl__palette__secondary-main);--uxdsl__input__underline-tone-secondary-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-tertiary-base-border:none;--uxdsl__input__underline-tone-tertiary-base-shadow:none;--uxdsl__input__underline-tone-tertiary-base-underline:1px solid var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-tertiary-base-caret:var(--uxdsl__palette__tertiary-main);--uxdsl__input__underline-tone-tertiary-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-success-base-border:none;--uxdsl__input__underline-tone-success-base-shadow:none;--uxdsl__input__underline-tone-success-base-underline:1px solid var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-success-base-caret:var(--uxdsl__palette__success-main);--uxdsl__input__underline-tone-success-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-info-base-border:none;--uxdsl__input__underline-tone-info-base-shadow:none;--uxdsl__input__underline-tone-info-base-underline:1px solid var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-info-base-caret:var(--uxdsl__palette__info-main);--uxdsl__input__underline-tone-info-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-warning-base-border:none;--uxdsl__input__underline-tone-warning-base-shadow:none;--uxdsl__input__underline-tone-warning-base-underline:1px solid var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-warning-base-caret:var(--uxdsl__palette__warning-main);--uxdsl__input__underline-tone-warning-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-dark-base-border:none;--uxdsl__input__underline-tone-dark-base-shadow:none;--uxdsl__input__underline-tone-dark-base-underline:1px solid var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-dark-base-caret:var(--uxdsl__palette__dark-main);--uxdsl__input__underline-tone-dark-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-light-base-border:none;--uxdsl__input__underline-tone-light-base-shadow:none;--uxdsl__input__underline-tone-light-base-underline:1px solid var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-tone-light-base-caret:var(--uxdsl__palette__light-main);--uxdsl__input__underline-tone-light-base-placeholder:var(--uxdsl__palette__neutral-dark);--uxdsl__input__underline-focus-underline:1px solid var(--uxdsl__input__tone-main,var(--uxdsl__palette__primary-main));--uxdsl__input__underline-tone-primary-focus-underline:1px solid var(--uxdsl__palette__primary-main);--uxdsl__input__underline-tone-surface-focus-underline:1px solid var(--uxdsl__palette__surface-main);--uxdsl__input__underline-tone-neutral-focus-underline:1px solid var(--uxdsl__palette__neutral-main);--uxdsl__input__underline-tone-error-focus-underline:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__underline-tone-secondary-focus-underline:1px solid var(--uxdsl__palette__secondary-main);--uxdsl__input__underline-tone-tertiary-focus-underline:1px solid var(--uxdsl__palette__tertiary-main);--uxdsl__input__underline-tone-success-focus-underline:1px solid var(--uxdsl__palette__success-main);--uxdsl__input__underline-tone-info-focus-underline:1px solid var(--uxdsl__palette__info-main);--uxdsl__input__underline-tone-warning-focus-underline:1px solid var(--uxdsl__palette__warning-main);--uxdsl__input__underline-tone-dark-focus-underline:1px solid var(--uxdsl__palette__dark-main);--uxdsl__input__underline-tone-light-focus-underline:1px solid var(--uxdsl__palette__light-main);--uxdsl__input__underline-invalid-underline:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__underline-tone-primary-invalid-underline:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__underline-tone-surface-invalid-underline:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__underline-tone-neutral-invalid-underline:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__underline-tone-error-invalid-underline:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__underline-tone-secondary-invalid-underline:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__underline-tone-tertiary-invalid-underline:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__underline-tone-success-invalid-underline:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__underline-tone-info-invalid-underline:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__underline-tone-warning-invalid-underline:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__underline-tone-dark-invalid-underline:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__underline-tone-light-invalid-underline:1px solid var(--uxdsl__palette__error-main);--uxdsl__input__underline-disabled-opacity:0.6;--uxdsl__input__underline-tone-primary-disabled-opacity:0.6;--uxdsl__input__underline-tone-surface-disabled-opacity:0.6;--uxdsl__input__underline-tone-neutral-disabled-opacity:0.6;--uxdsl__input__underline-tone-error-disabled-opacity:0.6;--uxdsl__input__underline-tone-secondary-disabled-opacity:0.6;--uxdsl__input__underline-tone-tertiary-disabled-opacity:0.6;--uxdsl__input__underline-tone-success-disabled-opacity:0.6;--uxdsl__input__underline-tone-info-disabled-opacity:0.6;--uxdsl__input__underline-tone-warning-disabled-opacity:0.6;--uxdsl__input__underline-tone-dark-disabled-opacity:0.6;--uxdsl__input__underline-tone-light-disabled-opacity:0.6}#uxdsl-bp-meta{--bp:'{"xs":0,"sm":480,"md":768,"lg":1024,"xl":1280}';display:none}