fulldev-ui 0.3.0-beta.3 → 0.3.3

package/src/css/radix.css

@@ -1,281 +0,0 @@
-:root,
-.light,
-.light-theme,
-.theme-light,
-[data-theme='light'] {
-  --base-1: #f8f9fb;
-  --base-2: #f4f6f9;
-  --base-3: #ebedef;
-  --base-4: #e3e4e7;
-  --base-5: #dcdde0;
-  --base-6: #d4d5d8;
-  --base-7: #c9cacd;
-  --base-8: #b6b7ba;
-  --base-9: #88898c;
-  --base-10: #7d7f81;
-  --base-11: #5f6062;
-  --base-12: #1e2022;
-
-  --base-a1: #3c3d3f04;
-  --base-a2: #1c3d5f08;
-  --base-a3: #0b1b1e11;
-  --base-a4: #07081419;
-  --base-a5: #03050f20;
-  --base-a6: #03040c28;
-  --base-a7: #01020933;
-  --base-a8: #04050a47;
-  --base-a9: #01020675;
-  --base-a10: #02040681;
-  --base-a11: #0102049f;
-  --base-a12: #000205e1;
-
-  --base-contrast: #ffffff;
-  --base-surface: #ffffffcc;
-  --base-indicator: #88898c;
-  --base-track: #88898c;
-
-  --brand-1: #f9fafb;
-  --brand-2: #f2f6ff;
-  --brand-3: #e7eeff;
-  --brand-4: #d9e5ff;
-  --brand-5: #c9d9ff;
-  --brand-6: #b4cbff;
-  --brand-7: #98b7ff;
-  --brand-8: #769aff;
-  --brand-9: #2b00ff;
-  --brand-10: #3e00c7;
-  --brand-11: #2f39f8;
-  --brand-12: #172574;
-
-  --brand-a1: #7c7d3f04;
-  --brand-a2: #f2f6ff;
-  --brand-a3: #e7eeff;
-  --brand-a4: #d9e5ff;
-  --brand-a5: #c9d9ff;
-  --brand-a6: #b4cbff;
-  --brand-a7: #98b7ff;
-  --brand-a8: #769aff;
-  --brand-a9: #2b00ff;
-  --brand-a10: #3e00c7;
-  --brand-a11: #010df7d0;
-  --brand-a12: #000f66e8;
-
-  --brand-contrast: #fff;
-  --brand-surface: #f0f5ffcc;
-  --brand-indicator: #2b00ff;
-  --brand-track: #2b00ff;
-
-  color-scheme: light;
-}
-
-@supports (color: color(display-p3 1 1 1)) {
-  @media (color-gamut: p3) {
-    :root,
-    .light,
-    .light-theme,
-    .theme-light,
-    [data-theme='light'] {
-      --base-1: oklch(98.1% 0.003 264.5);
-      --base-2: oklch(97.2% 0.004 264.5);
-      --base-3: oklch(94.4% 0.004 264.5);
-      --base-4: oklch(91.9% 0.004 264.5);
-      --base-5: oklch(89.7% 0.004 264.5);
-      --base-6: oklch(87.4% 0.004 264.5);
-      --base-7: oklch(83.9% 0.004 264.5);
-      --base-8: oklch(77.9% 0.004 264.5);
-      --base-9: oklch(63.1% 0.004 264.5);
-      --base-10: oklch(59.5% 0.004 264.5);
-      --base-11: oklch(48.8% 0.004 264.5);
-      --base-12: oklch(24.1% 0.004 264.5);
-
-      --base-a1: color(display-p3 0.008 0.012 0.02 / 0.012);
-      --base-a2: color(display-p3 0.008 0.149 0.298 / 0.028);
-      --base-a3: color(display-p3 0.008 0.071 0.078 / 0.064);
-      --base-a4: color(display-p3 0.008 0.012 0.059 / 0.096);
-      --base-a5: color(display-p3 0.004 0.008 0.047 / 0.124);
-      --base-a6: color(display-p3 0.008 0.012 0.043 / 0.156);
-      --base-a7: color(display-p3 0.004 0.008 0.035 / 0.2);
-      --base-a8: color(display-p3 0.004 0.004 0.027 / 0.275);
-      --base-a9: color(display-p3 0.004 0.008 0.024 / 0.459);
-      --base-a10: color(display-p3 0 0.012 0.02 / 0.502);
-      --base-a11: color(display-p3 0 0.008 0.016 / 0.622);
-      --base-a12: color(display-p3 0 0.008 0.02 / 0.881);
-
-      --base-contrast: #ffffff;
-      --base-surface: color(display-p3 1 1 1 / 80%);
-      --base-indicator: oklch(63.1% 0.004 264.5);
-      --base-track: oklch(63.1% 0.004 264.5);
-
-      --brand-1: oklch(98.4% 0.002 269);
-      --brand-2: oklch(97.2% 0.013 269);
-      --brand-3: oklch(94.9% 0.027 269);
-      --brand-4: oklch(92.3% 0.053 269);
-      --brand-5: oklch(89% 0.08 269);
-      --brand-6: oklch(84.9% 0.112 269);
-      --brand-7: oklch(79.3% 0.137 269);
-      --brand-8: oklch(71.5% 0.178 269);
-      --brand-9: oklch(46.3% 0.306 269);
-      --brand-10: oklch(40.9% 0.306 269);
-      --brand-11: oklch(49.5% 0.272 269);
-      --brand-12: oklch(31.3% 0.135 269);
-
-      --brand-a1: color(display-p3 0.333 0.337 0.02 / 0.012);
-      --brand-a2: color(display-p3 0.008 0.255 1 / 0.032);
-      --brand-a3: color(display-p3 0.004 0.267 0.945 / 0.076);
-      --brand-a4: color(display-p3 0.008 0.286 0.969 / 0.128);
-      --brand-a5: color(display-p3 0.004 0.239 0.957 / 0.188);
-      --brand-a6: color(display-p3 0.004 0.255 0.953 / 0.267);
-      --brand-a7: color(display-p3 0.004 0.247 0.945 / 0.371);
-      --brand-a8: color(display-p3 0 0.216 0.953 / 0.502);
-      --brand-a9: color(display-p3 0.141 0 0.961 / 0.989);
-      --brand-a10: color(display-p3 0.204 0 0.745 / 0.981);
-      --brand-a11: color(display-p3 0 0.039 0.918 / 0.805);
-      --brand-a12: color(display-p3 0 0.047 0.376 / 0.897);
-
-      --brand-contrast: #fff;
-      --brand-surface: color(display-p3 0.945 0.961 0.996 / 0.8);
-      --brand-indicator: oklch(46.3% 0.306 269);
-      --brand-track: oklch(46.3% 0.306 269);
-
-      color-scheme: dark;
-    }
-  }
-}
-
-.dark,
-.dark-theme,
-.theme-dark,
-[data-theme='dark'] {
-  --base-1: #080b14;
-  --base-2: #141822;
-  --base-3: #1c2130;
-  --base-4: #232938;
-  --base-5: #2a3040;
-  --base-6: #333949;
-  --base-7: #404758;
-  --base-8: #596072;
-  --base-9: #676d80;
-  --base-10: #747b8e;
-  --base-11: #abb3c7;
-  --base-12: #eaeef8;
-
-  --base-a1: #00000000;
-  --base-a2: #c8dbf410;
-  --base-a3: #adc0fa1f;
-  --base-a4: #b5cbfa28;
-  --base-a5: #bdd0fe30;
-  --base-a6: #c6d6fe3a;
-  --base-a7: #c9daff4a;
-  --base-a8: #d3dfff66;
-  --base-a9: #d6dffd76;
-  --base-a10: #d7e2fe85;
-  --base-a11: #dde6fec3;
-  --base-a12: #f1f5fef8;
-
-  --base-contrast: #ffffff;
-  --base-surface: rgba(0, 0, 0, 0.05);
-  --base-indicator: #676d80;
-  --base-track: #676d80;
-
-  --brand-1: #050a1c;
-  --brand-2: #0e152c;
-  --brand-3: #121d5b;
-  --brand-4: #17237c;
-  --brand-5: #1d2c93;
-  --brand-6: #2538a6;
-  --brand-7: #2d43be;
-  --brand-8: #354ede;
-  --brand-9: #2b00ff;
-  --brand-10: #3e00c7;
-  --brand-11: #96adff;
-  --brand-12: #d3e0ff;
-
-  --brand-a1: #0000f709;
-  --brand-a2: #416af71b;
-  --brand-a3: #2846fd4e;
-  --brand-a4: #2a42ff71;
-  --brand-a5: #2f48ff8a;
-  --brand-a6: #3754fe9f;
-  --brand-a7: #3b58ffb9;
-  --brand-a8: #3c58fedc;
-  --brand-a9: #2b00ff;
-  --brand-a10: #4f00fec3;
-  --brand-a11: #96adff;
-  --brand-a12: #d3e0ff;
-
-  --brand-contrast: #fff;
-  --brand-surface: #141f4480;
-  --brand-indicator: #2b00ff;
-  --brand-track: #2b00ff;
-}
-
-@supports (color: color(display-p3 1 1 1)) {
-  @media (color-gamut: p3) {
-    .dark,
-    .dark-theme,
-    .theme-dark,
-    [data-theme='dark'] {
-      --base-1: oklch(15.1% 0.02 269.2);
-      --base-2: oklch(20.9% 0.021 269.2);
-      --base-3: oklch(25.1% 0.029 269.2);
-      --base-4: oklch(28.1% 0.03 269.2);
-      --base-5: oklch(31.1% 0.03 269.2);
-      --base-6: oklch(34.6% 0.03 269.2);
-      --base-7: oklch(39.8% 0.03 269.2);
-      --base-8: oklch(49% 0.03 269.2);
-      --base-9: oklch(53.7% 0.03 269.2);
-      --base-10: oklch(58.3% 0.03 269.2);
-      --base-11: oklch(76.8% 0.03 269.2);
-      --base-12: oklch(94.9% 0.014 269.2);
-
-      --base-a1: color(display-p3 0 0 0 / 0);
-      --base-a2: color(display-p3 0.824 0.894 0.992 / 0.06);
-      --base-a3: color(display-p3 0.698 0.769 1 / 0.119);
-      --base-a4: color(display-p3 0.729 0.816 1 / 0.153);
-      --base-a5: color(display-p3 0.749 0.82 1 / 0.187);
-      --base-a6: color(display-p3 0.788 0.843 1 / 0.225);
-      --base-a7: color(display-p3 0.796 0.859 0.996 / 0.289);
-      --base-a8: color(display-p3 0.843 0.886 1 / 0.395);
-      --base-a9: color(display-p3 0.859 0.89 1 / 0.454);
-      --base-a10: color(display-p3 0.863 0.902 1 / 0.513);
-      --base-a11: color(display-p3 0.882 0.914 0.996 / 0.755);
-      --base-a12: color(display-p3 0.953 0.965 0.996 / 0.967);
-
-      --base-contrast: #ffffff;
-      --base-surface: color(display-p3 0 0 0 / 5%);
-      --base-indicator: oklch(53.7% 0.03 269.2);
-      --base-track: oklch(53.7% 0.03 269.2);
-
-      --brand-1: oklch(15.1% 0.04 269);
-      --brand-2: oklch(20.2% 0.048 269);
-      --brand-3: oklch(26.9% 0.111 269);
-      --brand-4: oklch(31.7% 0.149 269);
-      --brand-5: oklch(36.1% 0.167 269);
-      --brand-6: oklch(40.3% 0.177 269);
-      --brand-7: oklch(45% 0.192 269);
-      --brand-8: oklch(50.3% 0.22 269);
-      --brand-9: oklch(46.3% 0.306 269);
-      --brand-10: oklch(40.9% 0.306 269);
-      --brand-11: oklch(77.7% 0.197 269);
-      --brand-12: oklch(91.1% 0.068 269);
-
-      --brand-a1: color(display-p3 0 0 1 / 0.034);
-      --brand-a2: color(display-p3 0.278 0.447 0.996 / 0.098);
-      --brand-a3: color(display-p3 0.188 0.29 0.996 / 0.289);
-      --brand-a4: color(display-p3 0.196 0.267 1 / 0.424);
-      --brand-a5: color(display-p3 0.212 0.294 1 / 0.517);
-      --brand-a6: color(display-p3 0.243 0.333 1 / 0.598);
-      --brand-a7: color(display-p3 0.267 0.357 1 / 0.695);
-      --brand-a8: color(display-p3 0.267 0.357 1 / 0.827);
-      --brand-a9: color(display-p3 0.161 0.012 1 / 0.958);
-      --brand-a10: color(display-p3 0.29 0.012 1 / 0.729);
-      --brand-a11: color(display-p3 0.62 0.69 1 / 0.975);
-      --brand-a12: color(display-p3 0.847 0.89 1 / 0.988);
-
-      --brand-contrast: #fff;
-      --brand-surface: color(display-p3 0.078 0.118 0.259 / 0.5);
-      --brand-indicator: oklch(46.3% 0.306 269);
-      --brand-track: oklch(46.3% 0.306 269);
-    }
-  }
-}

package/src/css/size.css

@@ -1,334 +0,0 @@
-:root {
-  --space-sm-1: 3px;
-  --space-sm-2: 6px;
-  --space-sm-3: 12px;
-  --space-sm-4: 24px;
-  --space-sm-5: 48px;
-  --space-sm-6: 72px;
-  --space-md-1: 4px;
-  --space-md-2: 8px;
-  --space-md-3: 16px;
-  --space-md-4: 32px;
-  --space-md-5: 64px;
-  --space-md-6: 96px;
-  --space-lg-1: 5px;
-  --space-lg-2: 10px;
-  --space-lg-3: 20px;
-  --space-lg-4: 40px;
-  --space-lg-5: 80px;
-  --space-lg-6: 120px;
-
-  --element-sm-1: 6px;
-  --element-sm-2: 9px;
-  --element-sm-3: 12px;
-  --element-md-1: 8px;
-  --element-md-2: 12px;
-  --element-md-3: 16px;
-  --element-lg-1: 10px;
-  --element-lg-2: 16px;
-  --element-lg-3: 20px;
-
-  --text-label-sm: 12px;
-  --text-label-md: 14px;
-  --text-label-lg: 16px;
-
-  --text-body-xs: 12px;
-  --text-body-sm: 14px;
-  --text-body-md: 16px;
-  --text-body-lg: 18px;
-  --text-body-xl: 20px;
-
-  --text-heading-xs: 16px;
-  --text-heading-sm: 18px;
-  --text-heading-md: 20px;
-  --text-heading-lg: 24px;
-  --text-heading-xl: 30px;
-  --text-heading-2xl: 36px;
-  --text-heading-3xl: 48px;
-  --text-heading-4xl: 48px;
-  --text-heading-5xl: 60px;
-
-  @media (min-width: 768px) {
-    --text-heading-xs: 16px;
-    --text-heading-sm: 20px;
-    --text-heading-md: 24px;
-    --text-heading-lg: 30px;
-    --text-heading-xl: 36px;
-    --text-heading-2xl: 48px;
-    --text-heading-3xl: 60px;
-    --text-heading-4xl: 72px;
-    --text-heading-5xl: 96px;
-  }
-}
-
-.compact {
-  --space-sm-1: 3px;
-  --space-sm-2: 6px;
-  --space-sm-3: 9px;
-  --space-sm-4: 12px;
-  --space-sm-5: 15px;
-  --space-sm-6: 18px;
-  --space-md-1: 4px;
-  --space-md-2: 8px;
-  --space-md-3: 12px;
-  --space-md-4: 16px;
-  --space-md-5: 20px;
-  --space-md-6: 24px;
-  --space-lg-1: 5px;
-  --space-lg-2: 10px;
-  --space-lg-3: 15px;
-  --space-lg-4: 20px;
-  --space-lg-5: 25px;
-  --space-lg-6: 30px;
-
-  --element-sm-1: 6px;
-  --element-sm-2: 8px;
-  --element-sm-3: 10px;
-  --element-md-1: 8px;
-  --element-md-2: 10px;
-  --element-md-3: 12px;
-  --element-lg-1: 10px;
-  --element-lg-2: 12px;
-  --element-lg-3: 14px;
-
-  --text-heading-xs: 16px;
-  --text-heading-sm: 18px;
-  --text-heading-md: 20px;
-  --text-heading-lg: 24px;
-  --text-heading-xl: 30px;
-  --text-heading-2xl: 30px;
-  --text-heading-3xl: 30px;
-  --text-heading-4xl: 30px;
-  --text-heading-5xl: 30px;
-}
-
-/* --------------------------- */
-/* Generate sizes */
-/* --------------------------- */
-
-.size-xs,
-.size-xs
-  .compact:not(.size-xs [class*='size-'] .compact):not(
-    .size-xs [class*='size-'].compact
-  ) {
-  --space-1: var(--space-sm-1);
-  --space-2: var(--space-sm-2);
-  --space-3: var(--space-sm-3);
-  --space-4: var(--space-sm-4);
-  --space-5: var(--space-sm-5);
-  --space-6: var(--space-sm-6);
-
-  --element-1: var(--element-sm-1);
-  --element-2: var(--element-sm-2);
-  --element-3: var(--element-sm-3);
-
-  --radius-1: calc(var(--border-radius, 1) * var(--element-sm-1));
-  --radius-2: calc(var(--border-radius, 1) * var(--element-sm-2));
-  --radius-3: calc(var(--border-radius, 1) * var(--element-sm-3));
-
-  --text-label: var(--text-label-sm);
-  --text-body: var(--text-body-xs);
-  --text-heading: var(--text-heading-xs);
-}
-
-.size-sm,
-.size-sm
-  .compact:not(.size-sm [class*='size-'] .compact):not(
-    .size-sm [class*='size-'].compact
-  ) {
-  --space-1: var(--space-sm-1);
-  --space-2: var(--space-sm-2);
-  --space-3: var(--space-sm-3);
-  --space-4: var(--space-sm-4);
-  --space-5: var(--space-sm-5);
-  --space-6: var(--space-sm-6);
-
-  --element-1: var(--element-sm-1);
-  --element-2: var(--element-sm-2);
-  --element-3: var(--element-sm-3);
-
-  --radius-1: calc(var(--border-radius, 1) * var(--element-sm-1));
-  --radius-2: calc(var(--border-radius, 1) * var(--element-sm-2));
-  --radius-3: calc(var(--border-radius, 1) * var(--element-sm-3));
-
-  --text-label: var(--text-label-sm);
-  --text-body: var(--text-body-sm);
-  --text-heading: var(--text-heading-sm);
-}
-
-:where(:root),
-:where(.compact),
-.size-md,
-.size-md
-  .compact:not(.size-md [class*='size-'] .compact):not(
-    .size-md [class*='size-'].compact
-  ) {
-  --space-1: var(--space-md-1);
-  --space-2: var(--space-md-2);
-  --space-3: var(--space-md-3);
-  --space-4: var(--space-md-4);
-  --space-5: var(--space-md-5);
-  --space-6: var(--space-md-6);
-
-  --element-1: var(--element-md-1);
-  --element-2: var(--element-md-2);
-  --element-3: var(--element-md-3);
-
-  --radius-1: calc(var(--border-radius, 1) * var(--element-md-1));
-  --radius-2: calc(var(--border-radius, 1) * var(--element-md-2));
-  --radius-3: calc(var(--border-radius, 1) * var(--element-md-3));
-
-  --text-label: var(--text-label-md);
-  --text-body: var(--text-body-md);
-  --text-heading: var(--text-heading-md);
-}
-
-.size-lg,
-.size-lg
-  .compact:not(.size-lg [class*='size-'] .compact):not(
-    .size-lg [class*='size-'].compact
-  ) {
-  --space-1: var(--space-lg-1);
-  --space-2: var(--space-lg-2);
-  --space-3: var(--space-lg-3);
-  --space-4: var(--space-lg-4);
-  --space-5: var(--space-lg-5);
-  --space-6: var(--space-lg-6);
-
-  --element-1: var(--element-lg-1);
-  --element-2: var(--element-lg-2);
-  --element-3: var(--element-lg-3);
-
-  --radius-1: calc(var(--border-radius, 1) * var(--element-lg-1));
-  --radius-2: calc(var(--border-radius, 1) * var(--element-lg-2));
-  --radius-3: calc(var(--border-radius, 1) * var(--element-lg-3));
-
-  --text-label: var(--text-label-lg);
-  --text-body: var(--text-body-lg);
-  --text-heading: var(--text-heading-lg);
-}
-
-.size-xl,
-.size-xl
-  .compact:not(.size-xl [class*='size-'] .compact):not(
-    .size-xl [class*='size-'].compact
-  ) {
-  --space-1: var(--space-lg-1);
-  --space-2: var(--space-lg-2);
-  --space-3: var(--space-lg-3);
-  --space-4: var(--space-lg-4);
-  --space-5: var(--space-lg-5);
-  --space-6: var(--space-lg-6);
-
-  --element-1: var(--element-lg-1);
-  --element-2: var(--element-lg-2);
-  --element-3: var(--element-lg-3);
-
-  --radius-1: calc(var(--border-radius, 1) * var(--element-lg-1));
-  --radius-2: calc(var(--border-radius, 1) * var(--element-lg-2));
-  --radius-3: calc(var(--border-radius, 1) * var(--element-lg-3));
-
-  --text-label: var(--text-label-lg);
-  --text-body: var(--text-body-xl);
-  --text-heading: var(--text-heading-xl);
-}
-
-.size-2xl,
-.size-2xl
-  .compact:not(.size-2xl [class*='size-'] .compact):not(
-    .size-2xl [class*='size-'].compact
-  ) {
-  --space-1: var(--space-lg-1);
-  --space-2: var(--space-lg-2);
-  --space-3: var(--space-lg-3);
-  --space-4: var(--space-lg-4);
-  --space-5: var(--space-lg-5);
-  --space-6: var(--space-lg-6);
-
-  --element-1: var(--element-lg-1);
-  --element-2: var(--element-lg-2);
-  --element-3: var(--element-lg-3);
-
-  --radius-1: calc(var(--border-radius, 1) * var(--element-lg-1));
-  --radius-2: calc(var(--border-radius, 1) * var(--element-lg-2));
-  --radius-3: calc(var(--border-radius, 1) * var(--element-lg-3));
-
-  --text-label: var(--text-label-lg);
-  --text-body: var(--text-body-xl);
-  --text-heading: var(--text-heading-2xl);
-}
-
-.size-3xl,
-.size-3xl
-  .compact:not(.size-3xl [class*='size-'] .compact):not(
-    .size-3xl [class*='size-'].compact
-  ) {
-  --space-1: var(--space-lg-1);
-  --space-2: var(--space-lg-2);
-  --space-3: var(--space-lg-3);
-  --space-4: var(--space-lg-4);
-  --space-5: var(--space-lg-5);
-  --space-6: var(--space-lg-6);
-
-  --element-1: var(--element-lg-1);
-  --element-2: var(--element-lg-2);
-  --element-3: var(--element-lg-3);
-
-  --radius-1: calc(var(--border-radius, 1) * var(--element-lg-1));
-  --radius-2: calc(var(--border-radius, 1) * var(--element-lg-2));
-  --radius-3: calc(var(--border-radius, 1) * var(--element-lg-3));
-
-  --text-label: var(--text-label-lg);
-  --text-body: var(--text-body-xl);
-  --text-heading: var(--text-heading-3xl);
-}
-
-.size-4xl,
-.size-4xl
-  .compact:not(.size-4xl [class*='size-'] .compact):not(
-    .size-4xl [class*='size-'].compact
-  ) {
-  --space-1: var(--space-lg-1);
-  --space-2: var(--space-lg-2);
-  --space-3: var(--space-lg-3);
-  --space-4: var(--space-lg-4);
-  --space-5: var(--space-lg-5);
-  --space-6: var(--space-lg-6);
-
-  --element-1: var(--element-lg-1);
-  --element-2: var(--element-lg-2);
-  --element-3: var(--element-lg-3);
-
-  --radius-1: calc(var(--border-radius, 1) * var(--element-lg-1));
-  --radius-2: calc(var(--border-radius, 1) * var(--element-lg-2));
-  --radius-3: calc(var(--border-radius, 1) * var(--element-lg-3));
-
-  --text-label: var(--text-label-lg);
-  --text-body: var(--text-body-xl);
-  --text-heading: var(--text-heading-4xl);
-}
-
-.size-5xl,
-.size-5xl
-  .compact:not(.size-5xl [class*='size-'] .compact):not(
-    .size-5xl [class*='size-'].compact
-  ) {
-  --space-1: var(--space-lg-1);
-  --space-2: var(--space-lg-2);
-  --space-3: var(--space-lg-3);
-  --space-4: var(--space-lg-4);
-  --space-5: var(--space-lg-5);
-  --space-6: var(--space-lg-6);
-
-  --element-1: var(--element-lg-1);
-  --element-2: var(--element-lg-2);
-  --element-3: var(--element-lg-3);
-
-  --radius-1: calc(var(--border-radius, 1) * var(--element-lg-1));
-  --radius-2: calc(var(--border-radius, 1) * var(--element-lg-2));
-  --radius-3: calc(var(--border-radius, 1) * var(--element-lg-3));
-
-  --text-label: var(--text-label-lg);
-  --text-body: var(--text-body-xl);
-  --text-heading: var(--text-heading-5xl);
-}