@ui0/theme 0.0.0-stage → 0.1.0

package/src/generator/theme.default.css

@@ -0,0 +1,657 @@
+/* generated by ui0-theme from src/config.default.ts - do not edit by hand */
+@layer theme, ui0;
+@layer theme {
+body {
+  margin: 0;
+  font-size: 1rem;
+}
+.theme-default {
+  /* size */
+  --0-s-xxxs: 15px;
+  --0-s-xxs: 19px;
+  --0-s-xs: 22px;
+  --0-s-s: 27px;
+  --0-s-m: 32px;
+  --0-s-l: 38px;
+  --0-s-xl: 46px;
+  --0-s-xxl: 55px;
+  --0-s-xxxl: 66px;
+  --0-s-density: 1;
+  --0-uc1: calc(var(--0-s-m) * var(--0-s-density, 1) / 14);
+  --0-uc2: calc(var(--0-uc1) * 2);
+  --0-uc3: calc(var(--0-uc1) * 3);
+  --0-uc4: calc(var(--0-uc1) * 4);
+  --0-uc5: calc(var(--0-uc1) * 5);
+  --0-uc6: calc(var(--0-uc1) * 6);
+  --0-uc7: calc(var(--0-uc1) * 7);
+  --0-uc8: calc(var(--0-uc1) * 8);
+  --0-sc-xxxs: 13px;
+  --0-sc-xxs: 15px;
+  --0-sc-xs: 18px;
+  --0-sc-s: 22px;
+  --0-sc-m: 26px;
+  --0-sc-l: 31px;
+  --0-sc-xl: 37px;
+  --0-sc-xxl: 45px;
+  --0-sc-xxxl: 54px;
+  --0-ucc1: calc(var(--0-sc-m) * var(--0-s-density, 1) / 10);
+  --0-ucc2: calc(var(--0-ucc1) * 2);
+  --0-ucc3: calc(var(--0-ucc1) * 3);
+  --0-ucc4: calc(var(--0-ucc1) * 4);
+}
+.theme-default {
+  /* color */
+  --0-c-foreground-v: 0 0 0;
+  --0-c-background-v: 255 255 255;
+  --0-c-success-v: 56 136 34;
+  --0-c-error-v: 136 70 34;
+  --0-c-warning-v: 255 185 33;
+  --0-c-highlight-v: 22 227 197;
+  --0-c-white-v: 255 255 255;
+  --0-c-black-v: 0 0 0;
+  --0-c-cur-v: var(--0-c-foreground-v);
+  --0-c-cur: rgb(var(--0-c-cur-v, var(--0-c-foreground-v)) / var(--0-c-o, 1));
+  --0-f-cur-v: var(--0-c-background-v);
+  --0-f-cur: rgb(var(--0-f-cur-v, var(--0-c-background-v)) / var(--0-f-o, 1));
+}
+.theme-default {
+  /* round */
+  --0-r-base: 4px;
+  --0-r-tl: 0px;
+  --0-r-tr: 0px;
+  --0-r-bl: 0px;
+  --0-r-basic: calc(var(--0-s-m, 42px) * var(--0-s-density, 1));
+  --0-r-br: 0px;
+}
+.theme-default {
+  /* backdrop */
+  --0-backdrop-blur: 4px;
+  --0-backdrop-brightness: 0.5;
+  --0-backdrop-contrast: 0.5;
+  --0-backdrop-drop-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
+  --0-backdrop-grayscale: 1;
+  --0-backdrop-hue-rotate: 90deg;
+  --0-backdrop-invert: 1;
+  --0-backdrop-opacity: 0.5;
+  --0-backdrop-saturate: 0.5;
+  --0-backdrop-sepia: 1;
+}
+.theme-default {
+  /* elevation */
+  --0-elv-x1: 1px;
+  --0-elv-y1: calc(var(--0-elv-x1) * 3);
+  --0-elv-x2: calc(var(--0-elv-x1) * 1.5);
+  --0-elv-y2: calc(var(--0-elv-x1) * 1.5);
+}
+.theme-default {
+  /* display */
+  --0-display-xxs: 320px;
+  --0-display-xs: 480px;
+  --0-display-sm: 640px;
+  --0-display-md: 832px;
+  --0-display-lg: 1024px;
+  --0-display-hd: 1280px;
+  --0-display-xl: 1440px;
+  --0-display-xxl: 1680px;
+  --0-display-fhd: 1920px;
+  --0-display-qhd: 2560px;
+  --0-display-uhd: 3840px;
+}
+.theme-default {
+  /* typography */
+  --0-typo-fs: 20px;
+  --0-typo-h-ratio: 1.2;
+  --0-typo-h-fs: 22px;
+}
+.theme-default {
+  /* style */
+  --0-style-version: 1.0.0;
+  framework: ui0;
+}
+.theme-default.theme_dark {
+  color-scheme: dark;
+}
+.theme-default.theme_dark {
+  /* color */
+  --0-c-foreground-v: 255 255 255;
+  --0-c-background-v: 0 0 0;
+}
+.theme-default.theme_dark {
+  /* dark additions */
+  --0-elv-x1: 1px;
+  --0-elv-y1: calc(var(--0-elv-x1) * 3);
+  --0-elv-x2: calc(var(--0-elv-x1) * 1.5);
+  --0-elv-y2: calc(var(--0-elv-x1) * 1.5);
+  --0-r-base: 4px;
+  --0-r-tl: 0px;
+  --0-r-tr: 0px;
+  --0-r-bl: 0px;
+  --0-r-basic: calc(var(--0-s-m, 42px) * var(--0-s-density, 1));
+  --0-r-br: 0px;
+  --0-display-xxs: 320px;
+  --0-display-xs: 480px;
+  --0-display-sm: 640px;
+  --0-display-md: 832px;
+  --0-display-lg: 1024px;
+  --0-display-hd: 1280px;
+  --0-display-xl: 1440px;
+  --0-display-xxl: 1680px;
+  --0-display-fhd: 1920px;
+  --0-display-qhd: 2560px;
+  --0-display-uhd: 3840px;
+}
+.theme-default.theme_light {
+  color-scheme: light;
+}
+.theme-default.theme_light {
+  /* light additions */
+  --0-elv-x1: 1px;
+  --0-elv-y1: calc(var(--0-elv-x1) * 3);
+  --0-elv-x2: calc(var(--0-elv-x1) * 1.5);
+  --0-elv-y2: calc(var(--0-elv-x1) * 1.5);
+  --0-r-base: 4px;
+  --0-r-tl: 0px;
+  --0-r-tr: 0px;
+  --0-r-bl: 0px;
+  --0-r-basic: calc(var(--0-s-m, 42px) * var(--0-s-density, 1));
+  --0-r-br: 0px;
+  --0-display-xxs: 320px;
+  --0-display-xs: 480px;
+  --0-display-sm: 640px;
+  --0-display-md: 832px;
+  --0-display-lg: 1024px;
+  --0-display-hd: 1280px;
+  --0-display-xl: 1440px;
+  --0-display-xxl: 1680px;
+  --0-display-fhd: 1920px;
+  --0-display-qhd: 2560px;
+  --0-display-uhd: 3840px;
+}
+.si_bce5 {
+  --0-s: var(--0-s-xxxs);
+}
+
+.si_87d4 {
+  --0-s: var(--0-s-xxs);
+}
+
+.si_0820 {
+  --0-s: var(--0-s-xs);
+}
+
+.si_9329 {
+  --0-s: var(--0-s-s);
+}
+
+.si_96e7 {
+  --0-s: var(--0-s-m);
+}
+
+.si_05f9 {
+  --0-s: var(--0-s-l);
+}
+
+.si_81de {
+  --0-s: var(--0-s-xl);
+}
+
+.si_d16b {
+  --0-s: var(--0-s-xxl);
+}
+
+.si_5136 {
+  --0-s: var(--0-s-xxxl);
+}
+
+.si_e681 {
+  --0-s: var(--0-s-custom);
+}
+.co_ca8c { /* slot marker */ }
+.fi_8a2f { /* slot marker */ }
+.gr_9658 { /* slot marker */ }
+.c-_de6a { --0-c-cur-v: var(--0-c-foreground-v); }
+.f-_5fa1 { --0-f-cur-v: var(--0-c-foreground-v); }
+.c-_ce07 { --0-c-cur-v: var(--0-c-background-v); }
+.f-_e81f { --0-f-cur-v: var(--0-c-background-v); }
+.c-_a658 { --0-c-cur-v: var(--0-c-success-v); }
+.f-_dff2 { --0-f-cur-v: var(--0-c-success-v); }
+.c-_fc30 { --0-c-cur-v: var(--0-c-error-v); }
+.f-_3225 { --0-f-cur-v: var(--0-c-error-v); }
+.c-_8df9 { --0-c-cur-v: var(--0-c-warning-v); }
+.f-_a3e0 { --0-f-cur-v: var(--0-c-warning-v); }
+.c-_aee2 { --0-c-cur-v: var(--0-c-highlight-v); }
+.f-_2eee { --0-f-cur-v: var(--0-c-highlight-v); }
+.c-_5fb9 { --0-c-cur-v: var(--0-c-white-v); }
+.f-_cdea { --0-f-cur-v: var(--0-c-white-v); }
+.c-_7152 { --0-c-cur-v: var(--0-c-black-v); }
+.f-_79ae { --0-f-cur-v: var(--0-c-black-v); }
+.ho_6d01:hover { --0-c-cur-v: var(--0-c-foreground-v); }
+.ho_0cd4:hover { --0-f-cur-v: var(--0-c-foreground-v); }
+.ho_79ab:hover { --0-c-cur-v: var(--0-c-background-v); }
+.ho_4f78:hover { --0-f-cur-v: var(--0-c-background-v); }
+.ho_76f1:hover { --0-c-cur-v: var(--0-c-success-v); }
+.ho_efc6:hover { --0-f-cur-v: var(--0-c-success-v); }
+.ho_e222:hover { --0-c-cur-v: var(--0-c-error-v); }
+.ho_97b9:hover { --0-f-cur-v: var(--0-c-error-v); }
+.ho_dfc9:hover { --0-c-cur-v: var(--0-c-warning-v); }
+.ho_26ec:hover { --0-f-cur-v: var(--0-c-warning-v); }
+.ho_4d77:hover { --0-c-cur-v: var(--0-c-highlight-v); }
+.ho_a549:hover { --0-f-cur-v: var(--0-c-highlight-v); }
+.ho_dc37:hover { --0-c-cur-v: var(--0-c-white-v); }
+.ho_5d42:hover { --0-f-cur-v: var(--0-c-white-v); }
+.ho_a083:hover { --0-c-cur-v: var(--0-c-black-v); }
+.ho_3d85:hover { --0-f-cur-v: var(--0-c-black-v); }
+.ac_5e55:active { --0-c-cur-v: var(--0-c-foreground-v); }
+.ac_1048:active { --0-f-cur-v: var(--0-c-foreground-v); }
+.ac_388f:active { --0-c-cur-v: var(--0-c-background-v); }
+.ac_09ef:active { --0-f-cur-v: var(--0-c-background-v); }
+.ac_102d:active { --0-c-cur-v: var(--0-c-success-v); }
+.ac_56a2:active { --0-f-cur-v: var(--0-c-success-v); }
+.ac_5dd0:active { --0-c-cur-v: var(--0-c-error-v); }
+.ac_c12d:active { --0-f-cur-v: var(--0-c-error-v); }
+.ac_577f:active { --0-c-cur-v: var(--0-c-warning-v); }
+.ac_6fcd:active { --0-f-cur-v: var(--0-c-warning-v); }
+.ac_1c74:active { --0-c-cur-v: var(--0-c-highlight-v); }
+.ac_af14:active { --0-f-cur-v: var(--0-c-highlight-v); }
+.ac_c7bb:active { --0-c-cur-v: var(--0-c-white-v); }
+.ac_c65d:active { --0-f-cur-v: var(--0-c-white-v); }
+.ac_e06b:active { --0-c-cur-v: var(--0-c-black-v); }
+.ac_0306:active { --0-f-cur-v: var(--0-c-black-v); }
+.fo_5308:focus { --0-c-cur-v: var(--0-c-foreground-v); }
+.fo_00f9:focus { --0-f-cur-v: var(--0-c-foreground-v); }
+.fo_9050:focus { --0-c-cur-v: var(--0-c-background-v); }
+.fo_c056:focus { --0-f-cur-v: var(--0-c-background-v); }
+.fo_ccf3:focus { --0-c-cur-v: var(--0-c-success-v); }
+.fo_3238:focus { --0-f-cur-v: var(--0-c-success-v); }
+.fo_f4a6:focus { --0-c-cur-v: var(--0-c-error-v); }
+.fo_e4ca:focus { --0-f-cur-v: var(--0-c-error-v); }
+.fo_6061:focus { --0-c-cur-v: var(--0-c-warning-v); }
+.fo_9e7b:focus { --0-f-cur-v: var(--0-c-warning-v); }
+.fo_6516:focus { --0-c-cur-v: var(--0-c-highlight-v); }
+.fo_8a7c:focus { --0-f-cur-v: var(--0-c-highlight-v); }
+.fo_5106:focus { --0-c-cur-v: var(--0-c-white-v); }
+.fo_273e:focus { --0-f-cur-v: var(--0-c-white-v); }
+.fo_0137:focus { --0-c-cur-v: var(--0-c-black-v); }
+.fo_ffe7:focus { --0-f-cur-v: var(--0-c-black-v); }
+.theme_light .li_18d2 { --0-c-cur-v: var(--0-c-foreground-v); }
+.theme_light .li_2227 { --0-f-cur-v: var(--0-c-foreground-v); }
+.theme_light .li_2f22 { --0-c-cur-v: var(--0-c-background-v); }
+.theme_light .li_2a6e { --0-f-cur-v: var(--0-c-background-v); }
+.theme_light .li_2dd0 { --0-c-cur-v: var(--0-c-success-v); }
+.theme_light .li_8612 { --0-f-cur-v: var(--0-c-success-v); }
+.theme_light .li_ba19 { --0-c-cur-v: var(--0-c-error-v); }
+.theme_light .li_ef16 { --0-f-cur-v: var(--0-c-error-v); }
+.theme_light .li_27d4 { --0-c-cur-v: var(--0-c-warning-v); }
+.theme_light .li_416c { --0-f-cur-v: var(--0-c-warning-v); }
+.theme_light .li_2803 { --0-c-cur-v: var(--0-c-highlight-v); }
+.theme_light .li_2c0d { --0-f-cur-v: var(--0-c-highlight-v); }
+.theme_light .li_ad56 { --0-c-cur-v: var(--0-c-white-v); }
+.theme_light .li_c017 { --0-f-cur-v: var(--0-c-white-v); }
+.theme_light .li_cda9 { --0-c-cur-v: var(--0-c-black-v); }
+.theme_light .li_97f7 { --0-f-cur-v: var(--0-c-black-v); }
+.theme_light .li_d8b3:hover { --0-c-cur-v: var(--0-c-foreground-v); }
+.theme_light .li_3e44:hover { --0-f-cur-v: var(--0-c-foreground-v); }
+.theme_light .li_de88:hover { --0-c-cur-v: var(--0-c-background-v); }
+.theme_light .li_726a:hover { --0-f-cur-v: var(--0-c-background-v); }
+.theme_light .li_e679:hover { --0-c-cur-v: var(--0-c-success-v); }
+.theme_light .li_0435:hover { --0-f-cur-v: var(--0-c-success-v); }
+.theme_light .li_82ba:hover { --0-c-cur-v: var(--0-c-error-v); }
+.theme_light .li_3a1e:hover { --0-f-cur-v: var(--0-c-error-v); }
+.theme_light .li_60da:hover { --0-c-cur-v: var(--0-c-warning-v); }
+.theme_light .li_4256:hover { --0-f-cur-v: var(--0-c-warning-v); }
+.theme_light .li_38b1:hover { --0-c-cur-v: var(--0-c-highlight-v); }
+.theme_light .li_22f2:hover { --0-f-cur-v: var(--0-c-highlight-v); }
+.theme_light .li_dd04:hover { --0-c-cur-v: var(--0-c-white-v); }
+.theme_light .li_1494:hover { --0-f-cur-v: var(--0-c-white-v); }
+.theme_light .li_3cbb:hover { --0-c-cur-v: var(--0-c-black-v); }
+.theme_light .li_fe43:hover { --0-f-cur-v: var(--0-c-black-v); }
+.theme_light .li_a56a:active { --0-c-cur-v: var(--0-c-foreground-v); }
+.theme_light .li_e7c9:active { --0-f-cur-v: var(--0-c-foreground-v); }
+.theme_light .li_0234:active { --0-c-cur-v: var(--0-c-background-v); }
+.theme_light .li_d0a3:active { --0-f-cur-v: var(--0-c-background-v); }
+.theme_light .li_671c:active { --0-c-cur-v: var(--0-c-success-v); }
+.theme_light .li_7738:active { --0-f-cur-v: var(--0-c-success-v); }
+.theme_light .li_2720:active { --0-c-cur-v: var(--0-c-error-v); }
+.theme_light .li_92c6:active { --0-f-cur-v: var(--0-c-error-v); }
+.theme_light .li_16f9:active { --0-c-cur-v: var(--0-c-warning-v); }
+.theme_light .li_4a2c:active { --0-f-cur-v: var(--0-c-warning-v); }
+.theme_light .li_131c:active { --0-c-cur-v: var(--0-c-highlight-v); }
+.theme_light .li_c03a:active { --0-f-cur-v: var(--0-c-highlight-v); }
+.theme_light .li_7231:active { --0-c-cur-v: var(--0-c-white-v); }
+.theme_light .li_4aa0:active { --0-f-cur-v: var(--0-c-white-v); }
+.theme_light .li_3be4:active { --0-c-cur-v: var(--0-c-black-v); }
+.theme_light .li_9bdf:active { --0-f-cur-v: var(--0-c-black-v); }
+.theme_light .li_c4fa:focus { --0-c-cur-v: var(--0-c-foreground-v); }
+.theme_light .li_6583:focus { --0-f-cur-v: var(--0-c-foreground-v); }
+.theme_light .li_ccac:focus { --0-c-cur-v: var(--0-c-background-v); }
+.theme_light .li_fd67:focus { --0-f-cur-v: var(--0-c-background-v); }
+.theme_light .li_fd2c:focus { --0-c-cur-v: var(--0-c-success-v); }
+.theme_light .li_a33d:focus { --0-f-cur-v: var(--0-c-success-v); }
+.theme_light .li_3f18:focus { --0-c-cur-v: var(--0-c-error-v); }
+.theme_light .li_0df7:focus { --0-f-cur-v: var(--0-c-error-v); }
+.theme_light .li_bade:focus { --0-c-cur-v: var(--0-c-warning-v); }
+.theme_light .li_0b63:focus { --0-f-cur-v: var(--0-c-warning-v); }
+.theme_light .li_8766:focus { --0-c-cur-v: var(--0-c-highlight-v); }
+.theme_light .li_d07d:focus { --0-f-cur-v: var(--0-c-highlight-v); }
+.theme_light .li_a261:focus { --0-c-cur-v: var(--0-c-white-v); }
+.theme_light .li_6e50:focus { --0-f-cur-v: var(--0-c-white-v); }
+.theme_light .li_6c2c:focus { --0-c-cur-v: var(--0-c-black-v); }
+.theme_light .li_f0a8:focus { --0-f-cur-v: var(--0-c-black-v); }
+.theme_dark .da_9fba { --0-c-cur-v: var(--0-c-foreground-v); }
+.theme_dark .da_d095 { --0-f-cur-v: var(--0-c-foreground-v); }
+.theme_dark .da_5eb6 { --0-c-cur-v: var(--0-c-background-v); }
+.theme_dark .da_0e5b { --0-f-cur-v: var(--0-c-background-v); }
+.theme_dark .da_9df8 { --0-c-cur-v: var(--0-c-success-v); }
+.theme_dark .da_98a5 { --0-f-cur-v: var(--0-c-success-v); }
+.theme_dark .da_3dd0 { --0-c-cur-v: var(--0-c-error-v); }
+.theme_dark .da_53f8 { --0-f-cur-v: var(--0-c-error-v); }
+.theme_dark .da_f047 { --0-c-cur-v: var(--0-c-warning-v); }
+.theme_dark .da_d022 { --0-f-cur-v: var(--0-c-warning-v); }
+.theme_dark .da_f389 { --0-c-cur-v: var(--0-c-highlight-v); }
+.theme_dark .da_d116 { --0-f-cur-v: var(--0-c-highlight-v); }
+.theme_dark .da_8a89 { --0-c-cur-v: var(--0-c-white-v); }
+.theme_dark .da_948e { --0-f-cur-v: var(--0-c-white-v); }
+.theme_dark .da_06e5 { --0-c-cur-v: var(--0-c-black-v); }
+.theme_dark .da_8723 { --0-f-cur-v: var(--0-c-black-v); }
+.theme_dark .da_77d6:hover { --0-c-cur-v: var(--0-c-foreground-v); }
+.theme_dark .da_f6af:hover { --0-f-cur-v: var(--0-c-foreground-v); }
+.theme_dark .da_9f13:hover { --0-c-cur-v: var(--0-c-background-v); }
+.theme_dark .da_ada2:hover { --0-f-cur-v: var(--0-c-background-v); }
+.theme_dark .da_54c0:hover { --0-c-cur-v: var(--0-c-success-v); }
+.theme_dark .da_e571:hover { --0-f-cur-v: var(--0-c-success-v); }
+.theme_dark .da_077e:hover { --0-c-cur-v: var(--0-c-error-v); }
+.theme_dark .da_da6f:hover { --0-f-cur-v: var(--0-c-error-v); }
+.theme_dark .da_0783:hover { --0-c-cur-v: var(--0-c-warning-v); }
+.theme_dark .da_42be:hover { --0-f-cur-v: var(--0-c-warning-v); }
+.theme_dark .da_a8f1:hover { --0-c-cur-v: var(--0-c-highlight-v); }
+.theme_dark .da_b996:hover { --0-f-cur-v: var(--0-c-highlight-v); }
+.theme_dark .da_75a0:hover { --0-c-cur-v: var(--0-c-white-v); }
+.theme_dark .da_6351:hover { --0-f-cur-v: var(--0-c-white-v); }
+.theme_dark .da_5558:hover { --0-c-cur-v: var(--0-c-black-v); }
+.theme_dark .da_0126:hover { --0-f-cur-v: var(--0-c-black-v); }
+.theme_dark .da_29a7:active { --0-c-cur-v: var(--0-c-foreground-v); }
+.theme_dark .da_afcf:active { --0-f-cur-v: var(--0-c-foreground-v); }
+.theme_dark .da_65a6:active { --0-c-cur-v: var(--0-c-background-v); }
+.theme_dark .da_73b2:active { --0-f-cur-v: var(--0-c-background-v); }
+.theme_dark .da_b148:active { --0-c-cur-v: var(--0-c-success-v); }
+.theme_dark .da_ba0d:active { --0-f-cur-v: var(--0-c-success-v); }
+.theme_dark .da_7eb3:active { --0-c-cur-v: var(--0-c-error-v); }
+.theme_dark .da_eb46:active { --0-f-cur-v: var(--0-c-error-v); }
+.theme_dark .da_4bec:active { --0-c-cur-v: var(--0-c-warning-v); }
+.theme_dark .da_53e3:active { --0-f-cur-v: var(--0-c-warning-v); }
+.theme_dark .da_8430:active { --0-c-cur-v: var(--0-c-highlight-v); }
+.theme_dark .da_f509:active { --0-f-cur-v: var(--0-c-highlight-v); }
+.theme_dark .da_9d88:active { --0-c-cur-v: var(--0-c-white-v); }
+.theme_dark .da_b0a0:active { --0-f-cur-v: var(--0-c-white-v); }
+.theme_dark .da_6916:active { --0-c-cur-v: var(--0-c-black-v); }
+.theme_dark .da_d4e2:active { --0-f-cur-v: var(--0-c-black-v); }
+.theme_dark .da_512b:focus { --0-c-cur-v: var(--0-c-foreground-v); }
+.theme_dark .da_c398:focus { --0-f-cur-v: var(--0-c-foreground-v); }
+.theme_dark .da_3c97:focus { --0-c-cur-v: var(--0-c-background-v); }
+.theme_dark .da_cb01:focus { --0-f-cur-v: var(--0-c-background-v); }
+.theme_dark .da_8f58:focus { --0-c-cur-v: var(--0-c-success-v); }
+.theme_dark .da_4144:focus { --0-f-cur-v: var(--0-c-success-v); }
+.theme_dark .da_aa03:focus { --0-c-cur-v: var(--0-c-error-v); }
+.theme_dark .da_b020:focus { --0-f-cur-v: var(--0-c-error-v); }
+.theme_dark .da_62fa:focus { --0-c-cur-v: var(--0-c-warning-v); }
+.theme_dark .da_6ee4:focus { --0-f-cur-v: var(--0-c-warning-v); }
+.theme_dark .da_3896:focus { --0-c-cur-v: var(--0-c-highlight-v); }
+.theme_dark .da_82c3:focus { --0-f-cur-v: var(--0-c-highlight-v); }
+.theme_dark .da_5cf1:focus { --0-c-cur-v: var(--0-c-white-v); }
+.theme_dark .da_39b9:focus { --0-f-cur-v: var(--0-c-white-v); }
+.theme_dark .da_99e7:focus { --0-c-cur-v: var(--0-c-black-v); }
+.theme_dark .da_07f1:focus { --0-f-cur-v: var(--0-c-black-v); }
+.rF_7ee9 {
+  --0-r-tl: var(--0c-r-full, var(--0-r-full));
+  --0-r-tr: var(--0c-r-full, var(--0-r-full));
+  --0-r-bl: var(--0c-r-full, var(--0-r-full));
+  --0-r-br: var(--0c-r-full, var(--0-r-full));
+}
+
+.rS_e0da {
+  --0-r-tl: var(--0c-r-smooth, var(--0-r-smooth));
+  --0-r-tr: var(--0c-r-smooth, var(--0-r-smooth));
+  --0-r-bl: var(--0c-r-smooth, var(--0-r-smooth));
+  --0-r-br: var(--0c-r-smooth, var(--0-r-smooth));
+}
+
+.rB_2f08 {
+  --0-r-tl: var(--0c-r-basic, var(--0-r-basic));
+  --0-r-tr: var(--0c-r-basic, var(--0-r-basic));
+  --0-r-bl: var(--0c-r-basic, var(--0-r-basic));
+  --0-r-br: var(--0c-r-basic, var(--0-r-basic));
+}
+
+.rH_7415 {
+  --0-r-tl: var(--0c-r-hard, var(--0-r-hard));
+  --0-r-tr: var(--0c-r-hard, var(--0-r-hard));
+  --0-r-bl: var(--0c-r-hard, var(--0-r-hard));
+  --0-r-br: var(--0c-r-hard, var(--0-r-hard));
+}
+
+.rN_2296 {
+  --0-r-tl: var(--0c-r-none, var(--0-r-none));
+  --0-r-tr: var(--0c-r-none, var(--0-r-none));
+  --0-r-bl: var(--0c-r-none, var(--0-r-none));
+  --0-r-br: var(--0c-r-none, var(--0-r-none));
+}
+
+.ro_0102 {
+  --0-r-tl: var(--0c-r-basic, var(--0-r-basic));
+  --0-r-tr: var(--0c-r-basic, var(--0-r-basic));
+  --0-r-bl: var(--0c-r-basic, var(--0-r-basic));
+  --0-r-br: var(--0c-r-basic, var(--0-r-basic));
+}
+
+.rl_52df {
+  --0-r-tl: var(--0c-r-basic, var(--0-r-basic));
+  --0-r-bl: var(--0c-r-basic, var(--0-r-basic));
+}
+
+.rr_597c {
+  --0-r-tr: var(--0c-r-basic, var(--0-r-basic));
+  --0-r-br: var(--0c-r-basic, var(--0-r-basic));
+}
+
+.rt_cdff {
+  --0-r-tl: var(--0c-r-basic, var(--0-r-basic));
+  --0-r-tr: var(--0c-r-basic, var(--0-r-basic));
+}
+
+.rb_64f2 {
+  --0-r-bl: var(--0c-r-basic, var(--0-r-basic));
+  --0-r-br: var(--0c-r-basic, var(--0-r-basic));
+}
+
+.tl_e660 {
+  --0-r-tl: var(--0c-r-basic, var(--0-r-basic));
+}
+
+.tr_7817 {
+  --0-r-tr: var(--0c-r-basic, var(--0-r-basic));
+}
+
+.bl_29d9 {
+  --0-r-bl: var(--0c-r-basic, var(--0-r-basic));
+}
+
+.br_8850 {
+  --0-r-br: var(--0c-r-basic, var(--0-r-basic));
+}
+.ba_d486 {
+  backdrop-filter: var(--0-backdrop);
+  -webkit-backdrop-filter: var(--0-backdrop);
+  will-change: backdrop-filter;
+}
+.el_b4e0 {
+  box-shadow:
+    0 0 0 1px rgba(255 255 255 / .1),
+    var(--0-elv-i, ) 0px 1px 1px rgba(var(--0-elv-c, 0 0 0) / 0.1),
+    var(--0-elv-i, ) var(--0-elv-x1, 0px) var(--0-elv-y1, 0px) rgba(var(--0-elv-c, 0 0 0) / 0.095),
+    var(--0-elv-i, ) var(--0-elv-x2, 0px) var(--0-elv-y2, 0px) rgba(var(--0-elv-c, 0 0 0) / 0.13);
+}
+.el_5e0f {
+  --0-elv-x1: 1px;
+}
+.el_5995 {
+  --0-elv-x1: 1px;
+  --0-elv-i: inset;
+}
+.el_fb8f {
+  --0-elv-x1: 2px;
+}
+.el_af23 {
+  --0-elv-x1: 2px;
+  --0-elv-i: inset;
+}
+.el_8867 {
+  --0-elv-x1: 3px;
+}
+.el_6c3d {
+  --0-elv-x1: 3px;
+  --0-elv-i: inset;
+}
+.el_4d5e {
+  --0-elv-x1: 4px;
+}
+.el_a211 {
+  --0-elv-x1: 4px;
+  --0-elv-i: inset;
+}
+.el_1ab1 {
+  --0-elv-x1: 5px;
+}
+.el_2df9 {
+  --0-elv-x1: 5px;
+  --0-elv-i: inset;
+}
+.el_56bd {
+  --0-elv-x1: 6px;
+}
+.el_b036 {
+  --0-elv-x1: 6px;
+  --0-elv-i: inset;
+}
+.el_61ea {
+  --0-elv-x1: 7px;
+}
+.el_8003 {
+  --0-elv-x1: 7px;
+  --0-elv-i: inset;
+}
+.el_8924 {
+  --0-elv-x1: 8px;
+}
+.el_7bc0 {
+  --0-elv-x1: 8px;
+  --0-elv-i: inset;
+}
+.el_1bb1 {
+  --0-elv-x1: 9px;
+}
+.el_734f {
+  --0-elv-x1: 9px;
+  --0-elv-i: inset;
+}
+.el_40d4 {
+  --0-elv-x1: 10px;
+}
+.el_ef94 {
+  --0-elv-x1: 10px;
+  --0-elv-i: inset;
+}
+.el_a016 {
+  --0-elv-x1: 11px;
+}
+.el_fcd8 {
+  --0-elv-x1: 11px;
+  --0-elv-i: inset;
+}
+.el_1c39 {
+  --0-elv-x1: 12px;
+}
+.el_ba0c {
+  --0-elv-x1: 12px;
+  --0-elv-i: inset;
+}
+.el_5602 {
+  --0-elv-x1: 13px;
+}
+.el_d306 {
+  --0-elv-x1: 13px;
+  --0-elv-i: inset;
+}
+.el_3f15 {
+  --0-elv-x1: 14px;
+}
+.el_ece8 {
+  --0-elv-x1: 14px;
+  --0-elv-i: inset;
+}
+.el_3130 {
+  --0-elv-x1: 15px;
+}
+.el_5599 {
+  --0-elv-x1: 15px;
+  --0-elv-i: inset;
+}
+.el_c651 {
+  --0-elv-x1: 16px;
+}
+.el_f2d2 {
+  --0-elv-x1: 16px;
+  --0-elv-i: inset;
+}
+.di_17eb {
+  opacity: var(--0-dis-o, 0.5);
+}
+.di_e228 { /* point the component slot at the theme var */ }
+.fw_f5d2 { font-weight: 100 }
+.fw_25c0 { font-weight: 200 }
+.fw_de2b { font-weight: 300 }
+.fw_a02f { font-weight: 400 }
+.fw_c057 { font-weight: 500 }
+.fw_aee5 { font-weight: 600 }
+.fw_3207 { font-weight: 700 }
+.fw_d808 { font-weight: 800 }
+.fw_bb66 { font-weight: 900 }
+
+.tt_c60d { text-transform: uppercase }
+.tt_56d5 { text-transform: lowercase }
+.tt_ce2a { text-transform: capitalize }
+.tt_1ff4 { text-transform: none }
+.tt_59a5 { text-transform: full-width }
+.tt_50f0 { text-transform: full-size-kana }
+
+.ta_c49e { text-align: start }
+.ta_e1d2 { text-align: end }
+.ta_d725 { text-align: center }
+.ta_3342 { text-align: left }
+.ta_e5b8 { text-align: right }
+.ta_010c { text-align: justify }
+.ta_0241 { text-align: match-parent }
+
+.to_a88e { text-orientation: mixed }
+.to_4919 { text-orientation: sideways }
+.to_2640 { text-orientation: sideways-right }
+.to_de51 { text-orientation: use-glyph-orientation }
+.to_35e5 { text-orientation: upright }
+
+.tw_83bf { text-wrap: nowrap }
+.tw_d03a { text-wrap: wrap }
+.tw_4fdb { text-wrap: balance }
+.tw_f5a3 { text-wrap: pretty }
+.tw_698e { text-wrap: stable }
+h1, h2, h3, h4, h5, h6 {
+    --0-typo-step: 0.25rem; /* шаг (длина) */
+    font-size: calc(var(--0-typo-h-fs, var(--0-typo-fs, 1rem)) + var(--0-typo-step) * var(--0-typo-x));
+    line-height: calc(1 + 1 / var(--0-typo-x));
+
+}
+h1 { --0-typo-x: 6; }
+h2 { --0-typo-x: 5; }
+h3 { --0-typo-x: 4; }
+h4 { --0-typo-x: 3; }
+h5 { --0-typo-x: 2; }
+h6 { --0-typo-x: 1; }
+}

package/src/styles/duration.scss

@@ -0,0 +1,17 @@
+@mixin use {
+  --0-d-superfast: 40ms;
+  --0-d-faster: 75ms;
+  --0-d-fast: 90ms;
+  --0-d-gently: 144ms;
+  --0-d-basic: 200ms;
+  --0-d-slow: 400ms;
+  --0-d-superslow: 1000ms;
+}
+
+$duration-superfast: var(--0-d-superfast);
+$duration-faster: var(--0-d-faster);
+$duration-fast: var(--0-d-fast);
+$duration-gently: var(--0-d-gently);
+$duration-basic: var(--0-d-basic);
+$duration-slow: var(--0-d-slow);
+$duration-superslow: var(--0-d-superslow);

package/src/styles/index.md

@@ -0,0 +1,18 @@
+duration.scss
+is.scss
+theme.scss
+
+Internal SCSS utilities shared by components and contracts - not prop
+contracts themselves. The contracts (size/color/round/backdrop scss + marker
+classes + prop typings) live in ../contracts.
+
+Distilled into dist/ at build (same pipeline as the contract scss), so
+consumers import them exactly like a contract:
+@use '@ui0/theme/is' as is;
+@use '@ui0/theme/theme'; // aggregator: color + isDark/isLight
+
+Inside this package the same paths resolve against src/ via the aliases in
+vite.config.ts (themeScssAliases).
+
+--0- - global namespace
+--0c- private namespace