@db-ux/core-foundations 4.5.4 → 4.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (111) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/README.md +16 -69
  3. package/agent/_instructions.md +84 -0
  4. package/agent/tailwind/Variables.md +11 -9
  5. package/build/styles/bundle.css +4820 -0
  6. package/build/styles/{index.scss → bundle.scss} +5 -0
  7. package/build/styles/colors/_default-color-mappings.scss +3461 -3472
  8. package/build/styles/colors/_placeholder.scss +155 -159
  9. package/build/styles/colors/classes/all.css +2499 -2601
  10. package/build/styles/colors/classes/blue.css +147 -185
  11. package/build/styles/colors/classes/brand.css +147 -185
  12. package/build/styles/colors/classes/burgundy.css +147 -185
  13. package/build/styles/colors/classes/critical.css +147 -185
  14. package/build/styles/colors/classes/cyan.css +147 -185
  15. package/build/styles/colors/classes/green.css +147 -185
  16. package/build/styles/colors/classes/informational.css +147 -185
  17. package/build/styles/colors/classes/light-green.css +147 -185
  18. package/build/styles/colors/classes/neutral.css +147 -185
  19. package/build/styles/colors/classes/orange.css +147 -185
  20. package/build/styles/colors/classes/pink.css +147 -185
  21. package/build/styles/colors/classes/red.css +147 -185
  22. package/build/styles/colors/classes/successful.css +147 -185
  23. package/build/styles/colors/classes/turquoise.css +147 -185
  24. package/build/styles/colors/classes/violet.css +147 -185
  25. package/build/styles/colors/classes/warning.css +147 -185
  26. package/build/styles/colors/classes/yellow.css +147 -185
  27. package/build/styles/defaults/default-code.css +97 -97
  28. package/build/styles/defaults/default-container-properties.css +1 -0
  29. package/build/styles/defaults/default-container-variables.css +1 -0
  30. package/build/styles/defaults/default-elevation.css +1 -1
  31. package/build/styles/defaults/default-fonts.css +1 -1
  32. package/build/styles/defaults/default-icons.css +1 -1
  33. package/build/styles/defaults/default-properties.css +1 -0
  34. package/build/styles/defaults/default-required.css +1 -1
  35. package/build/styles/defaults/default-required.scss +13 -16
  36. package/build/styles/defaults/default-root.css +97 -97
  37. package/build/styles/defaults/default-variables.css +1 -0
  38. package/build/styles/density/_scaling-placeholder.scss +51 -54
  39. package/build/styles/density/_typography-placeholder.scss +54 -60
  40. package/build/styles/density/classes/all.css +759 -907
  41. package/build/styles/density/classes/expressive.css +255 -377
  42. package/build/styles/density/classes/functional.css +255 -377
  43. package/build/styles/density/classes/regular.css +255 -377
  44. package/build/styles/fonts/_font-sizes.scss +10 -16
  45. package/build/styles/fonts/absolute.scss +1 -1
  46. package/build/styles/fonts/classes/all.css +54 -214
  47. package/build/styles/fonts/classes/body/2xl.css +3 -95
  48. package/build/styles/fonts/classes/body/2xs.css +3 -95
  49. package/build/styles/fonts/classes/body/3xl.css +3 -95
  50. package/build/styles/fonts/classes/body/3xs.css +3 -95
  51. package/build/styles/fonts/classes/body/all.css +27 -151
  52. package/build/styles/fonts/classes/body/lg.css +3 -95
  53. package/build/styles/fonts/classes/body/md.css +3 -95
  54. package/build/styles/fonts/classes/body/sm.css +3 -95
  55. package/build/styles/fonts/classes/body/xl.css +3 -95
  56. package/build/styles/fonts/classes/body/xs.css +3 -95
  57. package/build/styles/fonts/classes/headline/2xl.css +3 -95
  58. package/build/styles/fonts/classes/headline/2xs.css +3 -95
  59. package/build/styles/fonts/classes/headline/3xl.css +3 -95
  60. package/build/styles/fonts/classes/headline/3xs.css +3 -95
  61. package/build/styles/fonts/classes/headline/all.css +27 -151
  62. package/build/styles/fonts/classes/headline/lg.css +3 -95
  63. package/build/styles/fonts/classes/headline/md.css +3 -95
  64. package/build/styles/fonts/classes/headline/sm.css +3 -95
  65. package/build/styles/fonts/classes/headline/xl.css +3 -95
  66. package/build/styles/fonts/classes/headline/xs.css +3 -95
  67. package/build/styles/fonts/relative.scss +1 -1
  68. package/build/styles/fonts/rollup.scss +1 -1
  69. package/build/styles/fonts/webpack.scss +1 -1
  70. package/build/styles/helpers/_index.scss +0 -1
  71. package/build/styles/helpers/classes/all.css +0 -34
  72. package/build/styles/helpers/classes/divider.css +0 -34
  73. package/build/styles/helpers/classes/focus.css +0 -34
  74. package/build/styles/icons/absolute.css +1 -1
  75. package/build/styles/icons/absolute.scss +1 -1
  76. package/build/styles/icons/relative.css +1 -1
  77. package/build/styles/icons/relative.scss +1 -1
  78. package/build/styles/icons/rollup.css +1 -1
  79. package/build/styles/icons/rollup.scss +1 -1
  80. package/build/styles/icons/webpack.css +1 -1
  81. package/build/styles/icons/webpack.scss +1 -1
  82. package/build/styles/theme/absolute.css +1 -0
  83. package/build/styles/theme/relative.css +1 -0
  84. package/build/styles/{defaults/default-theme.scss → theme/relative.scss} +3 -6
  85. package/build/styles/theme/rollup.css +1 -0
  86. package/build/styles/theme/webpack.css +1 -0
  87. package/build/tailwind/theme/colors.css +1 -2953
  88. package/build/tailwind/theme/colors.scss +1 -10
  89. package/build/tailwind/theme/dimensions.css +77 -160
  90. package/package.json +4 -4
  91. package/build/styles/absolute.css +0 -10635
  92. package/build/styles/defaults/default-theme.css +0 -97
  93. package/build/styles/helpers/_layer.scss +0 -1
  94. package/build/styles/index.css +0 -4907
  95. package/build/styles/relative.css +0 -10635
  96. package/build/styles/relative.scss +0 -4
  97. package/build/styles/rollup.css +0 -10635
  98. package/build/styles/webpack.css +0 -10635
  99. package/build/tailwind/theme/_variables.scss +0 -77
  100. package/build/tailwind/theme/dimensions.scss +0 -17
  101. /package/build/styles/defaults/{_default-container-properties.scss → default-container-properties.scss} +0 -0
  102. /package/build/styles/defaults/{_default-container-variables.scss → default-container-variables.scss} +0 -0
  103. /package/build/styles/defaults/{_default-properties.scss → default-properties.scss} +0 -0
  104. /package/build/styles/defaults/{_default-variables.scss → default-variables.scss} +0 -0
  105. /package/build/styles/{_absolute.assets-paths.scss → theme/_absolute.assets-paths.scss} +0 -0
  106. /package/build/styles/{_default.assets-paths.scss → theme/_default.assets-paths.scss} +0 -0
  107. /package/build/styles/{_rollup.assets-paths.scss → theme/_rollup.assets-paths.scss} +0 -0
  108. /package/build/styles/{_webpack.assets-paths.scss → theme/_webpack.assets-paths.scss} +0 -0
  109. /package/build/styles/{absolute.scss → theme/absolute.scss} +0 -0
  110. /package/build/styles/{rollup.scss → theme/rollup.scss} +0 -0
  111. /package/build/styles/{webpack.scss → theme/webpack.scss} +0 -0
package/build/styles/density/classes/all.css CHANGED
@@ -1,64 +1,4 @@
1
1
  /* Variants for adaptive components like input, select, notification, ... */
2
- @layer variables {}
3
-
4
- @layer variables {}
5
-
6
- @layer variables {}
7
-
8
- @layer variables {}
9
-
10
- @layer variables {}
11
-
12
- @layer variables {}
13
-
14
- @layer variables {}
15
-
16
- @layer variables {}
17
-
18
- @layer variables {}
19
-
20
- @layer variables {}
21
-
22
- @layer variables {}
23
-
24
- @layer variables {}
25
-
26
- @layer variables {}
27
-
28
- @layer variables {}
29
-
30
- @layer variables {}
31
-
32
- @layer variables {}
33
-
34
- @layer variables {}
35
-
36
- @layer variables {}
37
-
38
- @layer variables {}
39
-
40
- @layer variables {}
41
-
42
- @layer variables {}
43
-
44
- @layer variables {}
45
-
46
- @layer variables {}
47
-
48
- @layer variables {}
49
-
50
- @layer variables {}
51
-
52
- @layer variables {}
53
-
54
- @layer variables {}
55
-
56
- @layer variables {}
57
-
58
- @layer variables {}
59
-
60
- @layer variables {}
61
-
62
2
  .db-density-expressive,
63
3
  [data-density=expressive], .db-density-regular,
64
4
  [data-density=regular], .db-density-functional,
@@ -71,942 +11,854 @@
71
11
  [data-density=regular], .db-density-functional,
72
12
  [data-density=functional] {
73
13
  font: var(--db-type-body-md);
74
- /* stylelint-disable-next-line at-rule-prelude-no-invalid,layer-name-pattern */
14
+ /* Those variables are only for components to calculate heights and change icons */
15
+ --db-icon-font-weight: var(--db-base-body-icon-weight-md);
16
+ --db-icon-font-size: var(--db-base-body-icon-font-size-md);
75
17
  }
76
- @layer variables {
77
- .db-density-expressive,
78
- [data-density=expressive], .db-density-regular,
79
- [data-density=regular], .db-density-functional,
80
- [data-density=functional] {
81
- /* Those variables are only for components to calculate heights and change icons */
82
- --db-icon-font-weight: var(--db-base-body-icon-weight-md);
83
- --db-icon-font-size: var(--db-base-body-icon-font-size-md);
84
- }
85
- }
86
-
87
- @layer variables {}
88
-
89
- @layer variables {}
90
-
91
- @layer variables {}
92
-
93
- @layer variables {}
94
-
95
- @layer variables {}
96
-
97
- @layer variables {}
98
-
99
- @layer variables {}
100
-
101
- @layer variables {}
102
-
103
- @layer variables {}
104
-
105
- @layer variables {}
106
-
107
- @layer variables {}
108
-
109
- @layer variables {}
110
-
111
- @layer variables {}
112
18
 
113
19
  .db-density-expressive,
114
20
  [data-density=expressive] {
115
- /* stylelint-disable-next-line at-rule-prelude-no-invalid,layer-name-pattern */
21
+ --db-sizing-3xs: var(--db-sizing-expressive-3xs);
22
+ --db-sizing-2xs: var(--db-sizing-expressive-2xs);
23
+ --db-sizing-xs: var(--db-sizing-expressive-xs);
24
+ --db-sizing-sm: var(--db-sizing-expressive-sm);
25
+ --db-sizing-md: var(--db-sizing-expressive-md);
26
+ --db-sizing-lg: var(--db-sizing-expressive-lg);
27
+ --db-sizing-xl: var(--db-sizing-expressive-xl);
28
+ --db-sizing-2xl: var(--db-sizing-expressive-2xl);
29
+ --db-sizing-3xl: var(--db-sizing-expressive-3xl);
30
+ --db-spacing-fixed-3xs: var(--db-spacing-fixed-expressive-3xs);
31
+ --db-spacing-fixed-2xs: var(--db-spacing-fixed-expressive-2xs);
32
+ --db-spacing-fixed-xs: var(--db-spacing-fixed-expressive-xs);
33
+ --db-spacing-fixed-sm: var(--db-spacing-fixed-expressive-sm);
34
+ --db-spacing-fixed-md: var(--db-spacing-fixed-expressive-md);
35
+ --db-spacing-fixed-lg: var(--db-spacing-fixed-expressive-lg);
36
+ --db-spacing-fixed-xl: var(--db-spacing-fixed-expressive-xl);
37
+ --db-spacing-fixed-2xl: var(--db-spacing-fixed-expressive-2xl);
38
+ --db-spacing-fixed-3xl: var(--db-spacing-fixed-expressive-3xl);
39
+ /* stylelint-disable-next-line media-query-no-invalid */
40
+ /* stylelint-disable-next-line at-rule-empty-line-before */
41
+ /* stylelint-disable-next-line media-query-no-invalid */
42
+ /* stylelint-disable-next-line at-rule-empty-line-before */
43
+ /* stylelint-disable-next-line media-query-no-invalid */
44
+ /* stylelint-disable-next-line at-rule-empty-line-before */
116
45
  }
117
- @layer variables {
46
+ @media (width <= 48em) {
118
47
  .db-density-expressive,
119
48
  [data-density=expressive] {
120
- --db-sizing-3xs: var(--db-sizing-expressive-3xs);
121
- --db-sizing-2xs: var(--db-sizing-expressive-2xs);
122
- --db-sizing-xs: var(--db-sizing-expressive-xs);
123
- --db-sizing-sm: var(--db-sizing-expressive-sm);
124
- --db-sizing-md: var(--db-sizing-expressive-md);
125
- --db-sizing-lg: var(--db-sizing-expressive-lg);
126
- --db-sizing-xl: var(--db-sizing-expressive-xl);
127
- --db-sizing-2xl: var(--db-sizing-expressive-2xl);
128
- --db-sizing-3xl: var(--db-sizing-expressive-3xl);
129
- --db-spacing-fixed-3xs: var(--db-spacing-fixed-expressive-3xs);
130
- --db-spacing-fixed-2xs: var(--db-spacing-fixed-expressive-2xs);
131
- --db-spacing-fixed-xs: var(--db-spacing-fixed-expressive-xs);
132
- --db-spacing-fixed-sm: var(--db-spacing-fixed-expressive-sm);
133
- --db-spacing-fixed-md: var(--db-spacing-fixed-expressive-md);
134
- --db-spacing-fixed-lg: var(--db-spacing-fixed-expressive-lg);
135
- --db-spacing-fixed-xl: var(--db-spacing-fixed-expressive-xl);
136
- --db-spacing-fixed-2xl: var(--db-spacing-fixed-expressive-2xl);
137
- --db-spacing-fixed-3xl: var(--db-spacing-fixed-expressive-3xl);
138
- /* stylelint-disable-next-line media-query-no-invalid */
139
- /* stylelint-disable-next-line at-rule-empty-line-before */
140
- /* stylelint-disable-next-line media-query-no-invalid */
141
- /* stylelint-disable-next-line at-rule-empty-line-before */
142
- /* stylelint-disable-next-line media-query-no-invalid */
143
- /* stylelint-disable-next-line at-rule-empty-line-before */
144
- }
145
- @media (width <= 48em) {
146
- .db-density-expressive,
147
- [data-density=expressive] {
148
- --db-spacing-responsive-3xs: var(--db-spacing-responsive-expressive-mobile-3xs);
149
- --db-spacing-responsive-2xs: var(--db-spacing-responsive-expressive-mobile-2xs);
150
- --db-spacing-responsive-xs: var(--db-spacing-responsive-expressive-mobile-xs);
151
- --db-spacing-responsive-sm: var(--db-spacing-responsive-expressive-mobile-sm);
152
- --db-spacing-responsive-md: var(--db-spacing-responsive-expressive-mobile-md);
153
- --db-spacing-responsive-lg: var(--db-spacing-responsive-expressive-mobile-lg);
154
- --db-spacing-responsive-xl: var(--db-spacing-responsive-expressive-mobile-xl);
155
- --db-spacing-responsive-2xl: var(--db-spacing-responsive-expressive-mobile-2xl);
156
- --db-spacing-responsive-3xl: var(--db-spacing-responsive-expressive-mobile-3xl);
157
- }
49
+ --db-spacing-responsive-3xs: var(--db-spacing-responsive-expressive-mobile-3xs);
50
+ --db-spacing-responsive-2xs: var(--db-spacing-responsive-expressive-mobile-2xs);
51
+ --db-spacing-responsive-xs: var(--db-spacing-responsive-expressive-mobile-xs);
52
+ --db-spacing-responsive-sm: var(--db-spacing-responsive-expressive-mobile-sm);
53
+ --db-spacing-responsive-md: var(--db-spacing-responsive-expressive-mobile-md);
54
+ --db-spacing-responsive-lg: var(--db-spacing-responsive-expressive-mobile-lg);
55
+ --db-spacing-responsive-xl: var(--db-spacing-responsive-expressive-mobile-xl);
56
+ --db-spacing-responsive-2xl: var(--db-spacing-responsive-expressive-mobile-2xl);
57
+ --db-spacing-responsive-3xl: var(--db-spacing-responsive-expressive-mobile-3xl);
158
58
  }
159
- @media (48em < width <= 64em) {
160
- .db-density-expressive,
161
- [data-density=expressive] {
162
- --db-spacing-responsive-3xs: var(--db-spacing-responsive-expressive-tablet-3xs);
163
- --db-spacing-responsive-2xs: var(--db-spacing-responsive-expressive-tablet-2xs);
164
- --db-spacing-responsive-xs: var(--db-spacing-responsive-expressive-tablet-xs);
165
- --db-spacing-responsive-sm: var(--db-spacing-responsive-expressive-tablet-sm);
166
- --db-spacing-responsive-md: var(--db-spacing-responsive-expressive-tablet-md);
167
- --db-spacing-responsive-lg: var(--db-spacing-responsive-expressive-tablet-lg);
168
- --db-spacing-responsive-xl: var(--db-spacing-responsive-expressive-tablet-xl);
169
- --db-spacing-responsive-2xl: var(--db-spacing-responsive-expressive-tablet-2xl);
170
- --db-spacing-responsive-3xl: var(--db-spacing-responsive-expressive-tablet-3xl);
171
- }
59
+ }
60
+ @media (48em < width <= 64em) {
61
+ .db-density-expressive,
62
+ [data-density=expressive] {
63
+ --db-spacing-responsive-3xs: var(--db-spacing-responsive-expressive-tablet-3xs);
64
+ --db-spacing-responsive-2xs: var(--db-spacing-responsive-expressive-tablet-2xs);
65
+ --db-spacing-responsive-xs: var(--db-spacing-responsive-expressive-tablet-xs);
66
+ --db-spacing-responsive-sm: var(--db-spacing-responsive-expressive-tablet-sm);
67
+ --db-spacing-responsive-md: var(--db-spacing-responsive-expressive-tablet-md);
68
+ --db-spacing-responsive-lg: var(--db-spacing-responsive-expressive-tablet-lg);
69
+ --db-spacing-responsive-xl: var(--db-spacing-responsive-expressive-tablet-xl);
70
+ --db-spacing-responsive-2xl: var(--db-spacing-responsive-expressive-tablet-2xl);
71
+ --db-spacing-responsive-3xl: var(--db-spacing-responsive-expressive-tablet-3xl);
172
72
  }
173
- @media (64em < width) {
174
- .db-density-expressive,
175
- [data-density=expressive] {
176
- --db-spacing-responsive-3xs: var(--db-spacing-responsive-expressive-desktop-3xs);
177
- --db-spacing-responsive-2xs: var(--db-spacing-responsive-expressive-desktop-2xs);
178
- --db-spacing-responsive-xs: var(--db-spacing-responsive-expressive-desktop-xs);
179
- --db-spacing-responsive-sm: var(--db-spacing-responsive-expressive-desktop-sm);
180
- --db-spacing-responsive-md: var(--db-spacing-responsive-expressive-desktop-md);
181
- --db-spacing-responsive-lg: var(--db-spacing-responsive-expressive-desktop-lg);
182
- --db-spacing-responsive-xl: var(--db-spacing-responsive-expressive-desktop-xl);
183
- --db-spacing-responsive-2xl: var(--db-spacing-responsive-expressive-desktop-2xl);
184
- --db-spacing-responsive-3xl: var(--db-spacing-responsive-expressive-desktop-3xl);
185
- }
73
+ }
74
+ @media (64em < width) {
75
+ .db-density-expressive,
76
+ [data-density=expressive] {
77
+ --db-spacing-responsive-3xs: var(--db-spacing-responsive-expressive-desktop-3xs);
78
+ --db-spacing-responsive-2xs: var(--db-spacing-responsive-expressive-desktop-2xs);
79
+ --db-spacing-responsive-xs: var(--db-spacing-responsive-expressive-desktop-xs);
80
+ --db-spacing-responsive-sm: var(--db-spacing-responsive-expressive-desktop-sm);
81
+ --db-spacing-responsive-md: var(--db-spacing-responsive-expressive-desktop-md);
82
+ --db-spacing-responsive-lg: var(--db-spacing-responsive-expressive-desktop-lg);
83
+ --db-spacing-responsive-xl: var(--db-spacing-responsive-expressive-desktop-xl);
84
+ --db-spacing-responsive-2xl: var(--db-spacing-responsive-expressive-desktop-2xl);
85
+ --db-spacing-responsive-3xl: var(--db-spacing-responsive-expressive-desktop-3xl);
186
86
  }
187
87
  }
188
88
 
189
89
  .db-density-regular,
190
90
  [data-density=regular] {
191
- /* stylelint-disable-next-line at-rule-prelude-no-invalid,layer-name-pattern */
91
+ --db-sizing-3xs: var(--db-sizing-regular-3xs);
92
+ --db-sizing-2xs: var(--db-sizing-regular-2xs);
93
+ --db-sizing-xs: var(--db-sizing-regular-xs);
94
+ --db-sizing-sm: var(--db-sizing-regular-sm);
95
+ --db-sizing-md: var(--db-sizing-regular-md);
96
+ --db-sizing-lg: var(--db-sizing-regular-lg);
97
+ --db-sizing-xl: var(--db-sizing-regular-xl);
98
+ --db-sizing-2xl: var(--db-sizing-regular-2xl);
99
+ --db-sizing-3xl: var(--db-sizing-regular-3xl);
100
+ --db-spacing-fixed-3xs: var(--db-spacing-fixed-regular-3xs);
101
+ --db-spacing-fixed-2xs: var(--db-spacing-fixed-regular-2xs);
102
+ --db-spacing-fixed-xs: var(--db-spacing-fixed-regular-xs);
103
+ --db-spacing-fixed-sm: var(--db-spacing-fixed-regular-sm);
104
+ --db-spacing-fixed-md: var(--db-spacing-fixed-regular-md);
105
+ --db-spacing-fixed-lg: var(--db-spacing-fixed-regular-lg);
106
+ --db-spacing-fixed-xl: var(--db-spacing-fixed-regular-xl);
107
+ --db-spacing-fixed-2xl: var(--db-spacing-fixed-regular-2xl);
108
+ --db-spacing-fixed-3xl: var(--db-spacing-fixed-regular-3xl);
109
+ /* stylelint-disable-next-line media-query-no-invalid */
110
+ /* stylelint-disable-next-line at-rule-empty-line-before */
111
+ /* stylelint-disable-next-line media-query-no-invalid */
112
+ /* stylelint-disable-next-line at-rule-empty-line-before */
113
+ /* stylelint-disable-next-line media-query-no-invalid */
114
+ /* stylelint-disable-next-line at-rule-empty-line-before */
192
115
  }
193
- @layer variables {
116
+ @media (width <= 48em) {
194
117
  .db-density-regular,
195
118
  [data-density=regular] {
196
- --db-sizing-3xs: var(--db-sizing-regular-3xs);
197
- --db-sizing-2xs: var(--db-sizing-regular-2xs);
198
- --db-sizing-xs: var(--db-sizing-regular-xs);
199
- --db-sizing-sm: var(--db-sizing-regular-sm);
200
- --db-sizing-md: var(--db-sizing-regular-md);
201
- --db-sizing-lg: var(--db-sizing-regular-lg);
202
- --db-sizing-xl: var(--db-sizing-regular-xl);
203
- --db-sizing-2xl: var(--db-sizing-regular-2xl);
204
- --db-sizing-3xl: var(--db-sizing-regular-3xl);
205
- --db-spacing-fixed-3xs: var(--db-spacing-fixed-regular-3xs);
206
- --db-spacing-fixed-2xs: var(--db-spacing-fixed-regular-2xs);
207
- --db-spacing-fixed-xs: var(--db-spacing-fixed-regular-xs);
208
- --db-spacing-fixed-sm: var(--db-spacing-fixed-regular-sm);
209
- --db-spacing-fixed-md: var(--db-spacing-fixed-regular-md);
210
- --db-spacing-fixed-lg: var(--db-spacing-fixed-regular-lg);
211
- --db-spacing-fixed-xl: var(--db-spacing-fixed-regular-xl);
212
- --db-spacing-fixed-2xl: var(--db-spacing-fixed-regular-2xl);
213
- --db-spacing-fixed-3xl: var(--db-spacing-fixed-regular-3xl);
214
- /* stylelint-disable-next-line media-query-no-invalid */
215
- /* stylelint-disable-next-line at-rule-empty-line-before */
216
- /* stylelint-disable-next-line media-query-no-invalid */
217
- /* stylelint-disable-next-line at-rule-empty-line-before */
218
- /* stylelint-disable-next-line media-query-no-invalid */
219
- /* stylelint-disable-next-line at-rule-empty-line-before */
220
- }
221
- @media (width <= 48em) {
222
- .db-density-regular,
223
- [data-density=regular] {
224
- --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-mobile-3xs);
225
- --db-spacing-responsive-2xs: var(--db-spacing-responsive-regular-mobile-2xs);
226
- --db-spacing-responsive-xs: var(--db-spacing-responsive-regular-mobile-xs);
227
- --db-spacing-responsive-sm: var(--db-spacing-responsive-regular-mobile-sm);
228
- --db-spacing-responsive-md: var(--db-spacing-responsive-regular-mobile-md);
229
- --db-spacing-responsive-lg: var(--db-spacing-responsive-regular-mobile-lg);
230
- --db-spacing-responsive-xl: var(--db-spacing-responsive-regular-mobile-xl);
231
- --db-spacing-responsive-2xl: var(--db-spacing-responsive-regular-mobile-2xl);
232
- --db-spacing-responsive-3xl: var(--db-spacing-responsive-regular-mobile-3xl);
233
- }
119
+ --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-mobile-3xs);
120
+ --db-spacing-responsive-2xs: var(--db-spacing-responsive-regular-mobile-2xs);
121
+ --db-spacing-responsive-xs: var(--db-spacing-responsive-regular-mobile-xs);
122
+ --db-spacing-responsive-sm: var(--db-spacing-responsive-regular-mobile-sm);
123
+ --db-spacing-responsive-md: var(--db-spacing-responsive-regular-mobile-md);
124
+ --db-spacing-responsive-lg: var(--db-spacing-responsive-regular-mobile-lg);
125
+ --db-spacing-responsive-xl: var(--db-spacing-responsive-regular-mobile-xl);
126
+ --db-spacing-responsive-2xl: var(--db-spacing-responsive-regular-mobile-2xl);
127
+ --db-spacing-responsive-3xl: var(--db-spacing-responsive-regular-mobile-3xl);
234
128
  }
235
- @media (48em < width <= 64em) {
236
- .db-density-regular,
237
- [data-density=regular] {
238
- --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-tablet-3xs);
239
- --db-spacing-responsive-2xs: var(--db-spacing-responsive-regular-tablet-2xs);
240
- --db-spacing-responsive-xs: var(--db-spacing-responsive-regular-tablet-xs);
241
- --db-spacing-responsive-sm: var(--db-spacing-responsive-regular-tablet-sm);
242
- --db-spacing-responsive-md: var(--db-spacing-responsive-regular-tablet-md);
243
- --db-spacing-responsive-lg: var(--db-spacing-responsive-regular-tablet-lg);
244
- --db-spacing-responsive-xl: var(--db-spacing-responsive-regular-tablet-xl);
245
- --db-spacing-responsive-2xl: var(--db-spacing-responsive-regular-tablet-2xl);
246
- --db-spacing-responsive-3xl: var(--db-spacing-responsive-regular-tablet-3xl);
247
- }
129
+ }
130
+ @media (48em < width <= 64em) {
131
+ .db-density-regular,
132
+ [data-density=regular] {
133
+ --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-tablet-3xs);
134
+ --db-spacing-responsive-2xs: var(--db-spacing-responsive-regular-tablet-2xs);
135
+ --db-spacing-responsive-xs: var(--db-spacing-responsive-regular-tablet-xs);
136
+ --db-spacing-responsive-sm: var(--db-spacing-responsive-regular-tablet-sm);
137
+ --db-spacing-responsive-md: var(--db-spacing-responsive-regular-tablet-md);
138
+ --db-spacing-responsive-lg: var(--db-spacing-responsive-regular-tablet-lg);
139
+ --db-spacing-responsive-xl: var(--db-spacing-responsive-regular-tablet-xl);
140
+ --db-spacing-responsive-2xl: var(--db-spacing-responsive-regular-tablet-2xl);
141
+ --db-spacing-responsive-3xl: var(--db-spacing-responsive-regular-tablet-3xl);
248
142
  }
249
- @media (64em < width) {
250
- .db-density-regular,
251
- [data-density=regular] {
252
- --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-desktop-3xs);
253
- --db-spacing-responsive-2xs: var(--db-spacing-responsive-regular-desktop-2xs);
254
- --db-spacing-responsive-xs: var(--db-spacing-responsive-regular-desktop-xs);
255
- --db-spacing-responsive-sm: var(--db-spacing-responsive-regular-desktop-sm);
256
- --db-spacing-responsive-md: var(--db-spacing-responsive-regular-desktop-md);
257
- --db-spacing-responsive-lg: var(--db-spacing-responsive-regular-desktop-lg);
258
- --db-spacing-responsive-xl: var(--db-spacing-responsive-regular-desktop-xl);
259
- --db-spacing-responsive-2xl: var(--db-spacing-responsive-regular-desktop-2xl);
260
- --db-spacing-responsive-3xl: var(--db-spacing-responsive-regular-desktop-3xl);
261
- }
143
+ }
144
+ @media (64em < width) {
145
+ .db-density-regular,
146
+ [data-density=regular] {
147
+ --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-desktop-3xs);
148
+ --db-spacing-responsive-2xs: var(--db-spacing-responsive-regular-desktop-2xs);
149
+ --db-spacing-responsive-xs: var(--db-spacing-responsive-regular-desktop-xs);
150
+ --db-spacing-responsive-sm: var(--db-spacing-responsive-regular-desktop-sm);
151
+ --db-spacing-responsive-md: var(--db-spacing-responsive-regular-desktop-md);
152
+ --db-spacing-responsive-lg: var(--db-spacing-responsive-regular-desktop-lg);
153
+ --db-spacing-responsive-xl: var(--db-spacing-responsive-regular-desktop-xl);
154
+ --db-spacing-responsive-2xl: var(--db-spacing-responsive-regular-desktop-2xl);
155
+ --db-spacing-responsive-3xl: var(--db-spacing-responsive-regular-desktop-3xl);
262
156
  }
263
157
  }
264
158
 
265
159
  .db-density-functional,
266
160
  [data-density=functional] {
267
- /* stylelint-disable-next-line at-rule-prelude-no-invalid,layer-name-pattern */
161
+ --db-sizing-3xs: var(--db-sizing-functional-3xs);
162
+ --db-sizing-2xs: var(--db-sizing-functional-2xs);
163
+ --db-sizing-xs: var(--db-sizing-functional-xs);
164
+ --db-sizing-sm: var(--db-sizing-functional-sm);
165
+ --db-sizing-md: var(--db-sizing-functional-md);
166
+ --db-sizing-lg: var(--db-sizing-functional-lg);
167
+ --db-sizing-xl: var(--db-sizing-functional-xl);
168
+ --db-sizing-2xl: var(--db-sizing-functional-2xl);
169
+ --db-sizing-3xl: var(--db-sizing-functional-3xl);
170
+ --db-spacing-fixed-3xs: var(--db-spacing-fixed-functional-3xs);
171
+ --db-spacing-fixed-2xs: var(--db-spacing-fixed-functional-2xs);
172
+ --db-spacing-fixed-xs: var(--db-spacing-fixed-functional-xs);
173
+ --db-spacing-fixed-sm: var(--db-spacing-fixed-functional-sm);
174
+ --db-spacing-fixed-md: var(--db-spacing-fixed-functional-md);
175
+ --db-spacing-fixed-lg: var(--db-spacing-fixed-functional-lg);
176
+ --db-spacing-fixed-xl: var(--db-spacing-fixed-functional-xl);
177
+ --db-spacing-fixed-2xl: var(--db-spacing-fixed-functional-2xl);
178
+ --db-spacing-fixed-3xl: var(--db-spacing-fixed-functional-3xl);
179
+ /* stylelint-disable-next-line media-query-no-invalid */
180
+ /* stylelint-disable-next-line at-rule-empty-line-before */
181
+ /* stylelint-disable-next-line media-query-no-invalid */
182
+ /* stylelint-disable-next-line at-rule-empty-line-before */
183
+ /* stylelint-disable-next-line media-query-no-invalid */
184
+ /* stylelint-disable-next-line at-rule-empty-line-before */
268
185
  }
269
- @layer variables {
186
+ @media (width <= 48em) {
270
187
  .db-density-functional,
271
188
  [data-density=functional] {
272
- --db-sizing-3xs: var(--db-sizing-functional-3xs);
273
- --db-sizing-2xs: var(--db-sizing-functional-2xs);
274
- --db-sizing-xs: var(--db-sizing-functional-xs);
275
- --db-sizing-sm: var(--db-sizing-functional-sm);
276
- --db-sizing-md: var(--db-sizing-functional-md);
277
- --db-sizing-lg: var(--db-sizing-functional-lg);
278
- --db-sizing-xl: var(--db-sizing-functional-xl);
279
- --db-sizing-2xl: var(--db-sizing-functional-2xl);
280
- --db-sizing-3xl: var(--db-sizing-functional-3xl);
281
- --db-spacing-fixed-3xs: var(--db-spacing-fixed-functional-3xs);
282
- --db-spacing-fixed-2xs: var(--db-spacing-fixed-functional-2xs);
283
- --db-spacing-fixed-xs: var(--db-spacing-fixed-functional-xs);
284
- --db-spacing-fixed-sm: var(--db-spacing-fixed-functional-sm);
285
- --db-spacing-fixed-md: var(--db-spacing-fixed-functional-md);
286
- --db-spacing-fixed-lg: var(--db-spacing-fixed-functional-lg);
287
- --db-spacing-fixed-xl: var(--db-spacing-fixed-functional-xl);
288
- --db-spacing-fixed-2xl: var(--db-spacing-fixed-functional-2xl);
289
- --db-spacing-fixed-3xl: var(--db-spacing-fixed-functional-3xl);
290
- /* stylelint-disable-next-line media-query-no-invalid */
291
- /* stylelint-disable-next-line at-rule-empty-line-before */
292
- /* stylelint-disable-next-line media-query-no-invalid */
293
- /* stylelint-disable-next-line at-rule-empty-line-before */
294
- /* stylelint-disable-next-line media-query-no-invalid */
295
- /* stylelint-disable-next-line at-rule-empty-line-before */
296
- }
297
- @media (width <= 48em) {
298
- .db-density-functional,
299
- [data-density=functional] {
300
- --db-spacing-responsive-3xs: var(--db-spacing-responsive-functional-mobile-3xs);
301
- --db-spacing-responsive-2xs: var(--db-spacing-responsive-functional-mobile-2xs);
302
- --db-spacing-responsive-xs: var(--db-spacing-responsive-functional-mobile-xs);
303
- --db-spacing-responsive-sm: var(--db-spacing-responsive-functional-mobile-sm);
304
- --db-spacing-responsive-md: var(--db-spacing-responsive-functional-mobile-md);
305
- --db-spacing-responsive-lg: var(--db-spacing-responsive-functional-mobile-lg);
306
- --db-spacing-responsive-xl: var(--db-spacing-responsive-functional-mobile-xl);
307
- --db-spacing-responsive-2xl: var(--db-spacing-responsive-functional-mobile-2xl);
308
- --db-spacing-responsive-3xl: var(--db-spacing-responsive-functional-mobile-3xl);
309
- }
189
+ --db-spacing-responsive-3xs: var(--db-spacing-responsive-functional-mobile-3xs);
190
+ --db-spacing-responsive-2xs: var(--db-spacing-responsive-functional-mobile-2xs);
191
+ --db-spacing-responsive-xs: var(--db-spacing-responsive-functional-mobile-xs);
192
+ --db-spacing-responsive-sm: var(--db-spacing-responsive-functional-mobile-sm);
193
+ --db-spacing-responsive-md: var(--db-spacing-responsive-functional-mobile-md);
194
+ --db-spacing-responsive-lg: var(--db-spacing-responsive-functional-mobile-lg);
195
+ --db-spacing-responsive-xl: var(--db-spacing-responsive-functional-mobile-xl);
196
+ --db-spacing-responsive-2xl: var(--db-spacing-responsive-functional-mobile-2xl);
197
+ --db-spacing-responsive-3xl: var(--db-spacing-responsive-functional-mobile-3xl);
310
198
  }
311
- @media (48em < width <= 64em) {
312
- .db-density-functional,
313
- [data-density=functional] {
314
- --db-spacing-responsive-3xs: var(--db-spacing-responsive-functional-tablet-3xs);
315
- --db-spacing-responsive-2xs: var(--db-spacing-responsive-functional-tablet-2xs);
316
- --db-spacing-responsive-xs: var(--db-spacing-responsive-functional-tablet-xs);
317
- --db-spacing-responsive-sm: var(--db-spacing-responsive-functional-tablet-sm);
318
- --db-spacing-responsive-md: var(--db-spacing-responsive-functional-tablet-md);
319
- --db-spacing-responsive-lg: var(--db-spacing-responsive-functional-tablet-lg);
320
- --db-spacing-responsive-xl: var(--db-spacing-responsive-functional-tablet-xl);
321
- --db-spacing-responsive-2xl: var(--db-spacing-responsive-functional-tablet-2xl);
322
- --db-spacing-responsive-3xl: var(--db-spacing-responsive-functional-tablet-3xl);
323
- }
199
+ }
200
+ @media (48em < width <= 64em) {
201
+ .db-density-functional,
202
+ [data-density=functional] {
203
+ --db-spacing-responsive-3xs: var(--db-spacing-responsive-functional-tablet-3xs);
204
+ --db-spacing-responsive-2xs: var(--db-spacing-responsive-functional-tablet-2xs);
205
+ --db-spacing-responsive-xs: var(--db-spacing-responsive-functional-tablet-xs);
206
+ --db-spacing-responsive-sm: var(--db-spacing-responsive-functional-tablet-sm);
207
+ --db-spacing-responsive-md: var(--db-spacing-responsive-functional-tablet-md);
208
+ --db-spacing-responsive-lg: var(--db-spacing-responsive-functional-tablet-lg);
209
+ --db-spacing-responsive-xl: var(--db-spacing-responsive-functional-tablet-xl);
210
+ --db-spacing-responsive-2xl: var(--db-spacing-responsive-functional-tablet-2xl);
211
+ --db-spacing-responsive-3xl: var(--db-spacing-responsive-functional-tablet-3xl);
324
212
  }
325
- @media (64em < width) {
326
- .db-density-functional,
327
- [data-density=functional] {
328
- --db-spacing-responsive-3xs: var(--db-spacing-responsive-functional-desktop-3xs);
329
- --db-spacing-responsive-2xs: var(--db-spacing-responsive-functional-desktop-2xs);
330
- --db-spacing-responsive-xs: var(--db-spacing-responsive-functional-desktop-xs);
331
- --db-spacing-responsive-sm: var(--db-spacing-responsive-functional-desktop-sm);
332
- --db-spacing-responsive-md: var(--db-spacing-responsive-functional-desktop-md);
333
- --db-spacing-responsive-lg: var(--db-spacing-responsive-functional-desktop-lg);
334
- --db-spacing-responsive-xl: var(--db-spacing-responsive-functional-desktop-xl);
335
- --db-spacing-responsive-2xl: var(--db-spacing-responsive-functional-desktop-2xl);
336
- --db-spacing-responsive-3xl: var(--db-spacing-responsive-functional-desktop-3xl);
337
- }
213
+ }
214
+ @media (64em < width) {
215
+ .db-density-functional,
216
+ [data-density=functional] {
217
+ --db-spacing-responsive-3xs: var(--db-spacing-responsive-functional-desktop-3xs);
218
+ --db-spacing-responsive-2xs: var(--db-spacing-responsive-functional-desktop-2xs);
219
+ --db-spacing-responsive-xs: var(--db-spacing-responsive-functional-desktop-xs);
220
+ --db-spacing-responsive-sm: var(--db-spacing-responsive-functional-desktop-sm);
221
+ --db-spacing-responsive-md: var(--db-spacing-responsive-functional-desktop-md);
222
+ --db-spacing-responsive-lg: var(--db-spacing-responsive-functional-desktop-lg);
223
+ --db-spacing-responsive-xl: var(--db-spacing-responsive-functional-desktop-xl);
224
+ --db-spacing-responsive-2xl: var(--db-spacing-responsive-functional-desktop-2xl);
225
+ --db-spacing-responsive-3xl: var(--db-spacing-responsive-functional-desktop-3xl);
338
226
  }
339
227
  }
340
228
 
341
229
  .db-density-expressive,
342
230
  [data-density=expressive] {
343
- /* stylelint-disable-next-line at-rule-prelude-no-invalid,layer-name-pattern */
231
+ /* stylelint-disable-next-line media-query-no-invalid */
232
+ /* stylelint-disable-next-line at-rule-empty-line-before */
233
+ /* stylelint-disable-next-line media-query-no-invalid */
234
+ /* stylelint-disable-next-line at-rule-empty-line-before */
235
+ /* stylelint-disable-next-line media-query-no-invalid */
236
+ /* stylelint-disable-next-line at-rule-empty-line-before */
344
237
  }
345
- @layer variables {
238
+ @media (width <= 48em) {
346
239
  .db-density-expressive,
347
240
  [data-density=expressive] {
348
- /* stylelint-disable-next-line media-query-no-invalid */
349
- /* stylelint-disable-next-line at-rule-empty-line-before */
350
- /* stylelint-disable-next-line media-query-no-invalid */
351
- /* stylelint-disable-next-line at-rule-empty-line-before */
352
- /* stylelint-disable-next-line media-query-no-invalid */
353
- /* stylelint-disable-next-line at-rule-empty-line-before */
354
- }
355
- @media (width <= 48em) {
356
- .db-density-expressive,
357
- [data-density=expressive] {
358
- --db-type-headline-3xs: var(--db-typography-expressive-mobile-headline-3xs);
359
- --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-expressive-mobile-headline-3xs);
360
- --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-expressive-mobile-headline-3xs);
361
- --db-type-headline-2xs: var(--db-typography-expressive-mobile-headline-2xs);
362
- --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-expressive-mobile-headline-2xs);
363
- --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-expressive-mobile-headline-2xs);
364
- --db-type-headline-xs: var(--db-typography-expressive-mobile-headline-xs);
365
- --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-expressive-mobile-headline-xs);
366
- --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-expressive-mobile-headline-xs);
367
- --db-type-headline-sm: var(--db-typography-expressive-mobile-headline-sm);
368
- --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-expressive-mobile-headline-sm);
369
- --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-expressive-mobile-headline-sm);
370
- --db-type-headline-md: var(--db-typography-expressive-mobile-headline-md);
371
- --db-base-headline-icon-weight-md: var(--db-base-icon-weight-expressive-mobile-headline-md);
372
- --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-expressive-mobile-headline-md);
373
- --db-type-headline-lg: var(--db-typography-expressive-mobile-headline-lg);
374
- --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-expressive-mobile-headline-lg);
375
- --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-expressive-mobile-headline-lg);
376
- --db-type-headline-xl: var(--db-typography-expressive-mobile-headline-xl);
377
- --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-expressive-mobile-headline-xl);
378
- --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-expressive-mobile-headline-xl);
379
- --db-type-headline-2xl: var(--db-typography-expressive-mobile-headline-2xl);
380
- --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-expressive-mobile-headline-2xl);
381
- --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-expressive-mobile-headline-2xl);
382
- --db-type-headline-3xl: var(--db-typography-expressive-mobile-headline-3xl);
383
- --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-expressive-mobile-headline-3xl);
384
- --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-expressive-mobile-headline-3xl);
385
- }
241
+ --db-type-headline-3xs: var(--db-typography-expressive-mobile-headline-3xs);
242
+ --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-expressive-mobile-headline-3xs);
243
+ --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-expressive-mobile-headline-3xs);
244
+ --db-type-headline-2xs: var(--db-typography-expressive-mobile-headline-2xs);
245
+ --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-expressive-mobile-headline-2xs);
246
+ --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-expressive-mobile-headline-2xs);
247
+ --db-type-headline-xs: var(--db-typography-expressive-mobile-headline-xs);
248
+ --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-expressive-mobile-headline-xs);
249
+ --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-expressive-mobile-headline-xs);
250
+ --db-type-headline-sm: var(--db-typography-expressive-mobile-headline-sm);
251
+ --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-expressive-mobile-headline-sm);
252
+ --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-expressive-mobile-headline-sm);
253
+ --db-type-headline-md: var(--db-typography-expressive-mobile-headline-md);
254
+ --db-base-headline-icon-weight-md: var(--db-base-icon-weight-expressive-mobile-headline-md);
255
+ --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-expressive-mobile-headline-md);
256
+ --db-type-headline-lg: var(--db-typography-expressive-mobile-headline-lg);
257
+ --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-expressive-mobile-headline-lg);
258
+ --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-expressive-mobile-headline-lg);
259
+ --db-type-headline-xl: var(--db-typography-expressive-mobile-headline-xl);
260
+ --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-expressive-mobile-headline-xl);
261
+ --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-expressive-mobile-headline-xl);
262
+ --db-type-headline-2xl: var(--db-typography-expressive-mobile-headline-2xl);
263
+ --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-expressive-mobile-headline-2xl);
264
+ --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-expressive-mobile-headline-2xl);
265
+ --db-type-headline-3xl: var(--db-typography-expressive-mobile-headline-3xl);
266
+ --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-expressive-mobile-headline-3xl);
267
+ --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-expressive-mobile-headline-3xl);
386
268
  }
387
- @media (48em < width <= 64em) {
388
- .db-density-expressive,
389
- [data-density=expressive] {
390
- --db-type-headline-3xs: var(--db-typography-expressive-tablet-headline-3xs);
391
- --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-expressive-tablet-headline-3xs);
392
- --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-expressive-tablet-headline-3xs);
393
- --db-type-headline-2xs: var(--db-typography-expressive-tablet-headline-2xs);
394
- --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-expressive-tablet-headline-2xs);
395
- --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-expressive-tablet-headline-2xs);
396
- --db-type-headline-xs: var(--db-typography-expressive-tablet-headline-xs);
397
- --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-expressive-tablet-headline-xs);
398
- --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-expressive-tablet-headline-xs);
399
- --db-type-headline-sm: var(--db-typography-expressive-tablet-headline-sm);
400
- --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-expressive-tablet-headline-sm);
401
- --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-expressive-tablet-headline-sm);
402
- --db-type-headline-md: var(--db-typography-expressive-tablet-headline-md);
403
- --db-base-headline-icon-weight-md: var(--db-base-icon-weight-expressive-tablet-headline-md);
404
- --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-expressive-tablet-headline-md);
405
- --db-type-headline-lg: var(--db-typography-expressive-tablet-headline-lg);
406
- --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-expressive-tablet-headline-lg);
407
- --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-expressive-tablet-headline-lg);
408
- --db-type-headline-xl: var(--db-typography-expressive-tablet-headline-xl);
409
- --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-expressive-tablet-headline-xl);
410
- --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-expressive-tablet-headline-xl);
411
- --db-type-headline-2xl: var(--db-typography-expressive-tablet-headline-2xl);
412
- --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-expressive-tablet-headline-2xl);
413
- --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-expressive-tablet-headline-2xl);
414
- --db-type-headline-3xl: var(--db-typography-expressive-tablet-headline-3xl);
415
- --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-expressive-tablet-headline-3xl);
416
- --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-expressive-tablet-headline-3xl);
417
- }
269
+ }
270
+ @media (48em < width <= 64em) {
271
+ .db-density-expressive,
272
+ [data-density=expressive] {
273
+ --db-type-headline-3xs: var(--db-typography-expressive-tablet-headline-3xs);
274
+ --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-expressive-tablet-headline-3xs);
275
+ --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-expressive-tablet-headline-3xs);
276
+ --db-type-headline-2xs: var(--db-typography-expressive-tablet-headline-2xs);
277
+ --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-expressive-tablet-headline-2xs);
278
+ --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-expressive-tablet-headline-2xs);
279
+ --db-type-headline-xs: var(--db-typography-expressive-tablet-headline-xs);
280
+ --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-expressive-tablet-headline-xs);
281
+ --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-expressive-tablet-headline-xs);
282
+ --db-type-headline-sm: var(--db-typography-expressive-tablet-headline-sm);
283
+ --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-expressive-tablet-headline-sm);
284
+ --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-expressive-tablet-headline-sm);
285
+ --db-type-headline-md: var(--db-typography-expressive-tablet-headline-md);
286
+ --db-base-headline-icon-weight-md: var(--db-base-icon-weight-expressive-tablet-headline-md);
287
+ --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-expressive-tablet-headline-md);
288
+ --db-type-headline-lg: var(--db-typography-expressive-tablet-headline-lg);
289
+ --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-expressive-tablet-headline-lg);
290
+ --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-expressive-tablet-headline-lg);
291
+ --db-type-headline-xl: var(--db-typography-expressive-tablet-headline-xl);
292
+ --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-expressive-tablet-headline-xl);
293
+ --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-expressive-tablet-headline-xl);
294
+ --db-type-headline-2xl: var(--db-typography-expressive-tablet-headline-2xl);
295
+ --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-expressive-tablet-headline-2xl);
296
+ --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-expressive-tablet-headline-2xl);
297
+ --db-type-headline-3xl: var(--db-typography-expressive-tablet-headline-3xl);
298
+ --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-expressive-tablet-headline-3xl);
299
+ --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-expressive-tablet-headline-3xl);
418
300
  }
419
- @media (64em < width) {
420
- .db-density-expressive,
421
- [data-density=expressive] {
422
- --db-type-headline-3xs: var(--db-typography-expressive-desktop-headline-3xs);
423
- --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-expressive-desktop-headline-3xs);
424
- --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-expressive-desktop-headline-3xs);
425
- --db-type-headline-2xs: var(--db-typography-expressive-desktop-headline-2xs);
426
- --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-expressive-desktop-headline-2xs);
427
- --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-expressive-desktop-headline-2xs);
428
- --db-type-headline-xs: var(--db-typography-expressive-desktop-headline-xs);
429
- --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-expressive-desktop-headline-xs);
430
- --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-expressive-desktop-headline-xs);
431
- --db-type-headline-sm: var(--db-typography-expressive-desktop-headline-sm);
432
- --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-expressive-desktop-headline-sm);
433
- --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-expressive-desktop-headline-sm);
434
- --db-type-headline-md: var(--db-typography-expressive-desktop-headline-md);
435
- --db-base-headline-icon-weight-md: var(--db-base-icon-weight-expressive-desktop-headline-md);
436
- --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-expressive-desktop-headline-md);
437
- --db-type-headline-lg: var(--db-typography-expressive-desktop-headline-lg);
438
- --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-expressive-desktop-headline-lg);
439
- --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-expressive-desktop-headline-lg);
440
- --db-type-headline-xl: var(--db-typography-expressive-desktop-headline-xl);
441
- --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-expressive-desktop-headline-xl);
442
- --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-expressive-desktop-headline-xl);
443
- --db-type-headline-2xl: var(--db-typography-expressive-desktop-headline-2xl);
444
- --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-expressive-desktop-headline-2xl);
445
- --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-expressive-desktop-headline-2xl);
446
- --db-type-headline-3xl: var(--db-typography-expressive-desktop-headline-3xl);
447
- --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-expressive-desktop-headline-3xl);
448
- --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-expressive-desktop-headline-3xl);
449
- }
301
+ }
302
+ @media (64em < width) {
303
+ .db-density-expressive,
304
+ [data-density=expressive] {
305
+ --db-type-headline-3xs: var(--db-typography-expressive-desktop-headline-3xs);
306
+ --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-expressive-desktop-headline-3xs);
307
+ --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-expressive-desktop-headline-3xs);
308
+ --db-type-headline-2xs: var(--db-typography-expressive-desktop-headline-2xs);
309
+ --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-expressive-desktop-headline-2xs);
310
+ --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-expressive-desktop-headline-2xs);
311
+ --db-type-headline-xs: var(--db-typography-expressive-desktop-headline-xs);
312
+ --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-expressive-desktop-headline-xs);
313
+ --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-expressive-desktop-headline-xs);
314
+ --db-type-headline-sm: var(--db-typography-expressive-desktop-headline-sm);
315
+ --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-expressive-desktop-headline-sm);
316
+ --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-expressive-desktop-headline-sm);
317
+ --db-type-headline-md: var(--db-typography-expressive-desktop-headline-md);
318
+ --db-base-headline-icon-weight-md: var(--db-base-icon-weight-expressive-desktop-headline-md);
319
+ --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-expressive-desktop-headline-md);
320
+ --db-type-headline-lg: var(--db-typography-expressive-desktop-headline-lg);
321
+ --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-expressive-desktop-headline-lg);
322
+ --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-expressive-desktop-headline-lg);
323
+ --db-type-headline-xl: var(--db-typography-expressive-desktop-headline-xl);
324
+ --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-expressive-desktop-headline-xl);
325
+ --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-expressive-desktop-headline-xl);
326
+ --db-type-headline-2xl: var(--db-typography-expressive-desktop-headline-2xl);
327
+ --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-expressive-desktop-headline-2xl);
328
+ --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-expressive-desktop-headline-2xl);
329
+ --db-type-headline-3xl: var(--db-typography-expressive-desktop-headline-3xl);
330
+ --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-expressive-desktop-headline-3xl);
331
+ --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-expressive-desktop-headline-3xl);
450
332
  }
451
333
  }
452
334
 
453
335
  .db-density-expressive,
454
336
  [data-density=expressive] {
455
- /* stylelint-disable-next-line at-rule-prelude-no-invalid,layer-name-pattern */
337
+ /* stylelint-disable-next-line media-query-no-invalid */
338
+ /* stylelint-disable-next-line at-rule-empty-line-before */
339
+ /* stylelint-disable-next-line media-query-no-invalid */
340
+ /* stylelint-disable-next-line at-rule-empty-line-before */
341
+ /* stylelint-disable-next-line media-query-no-invalid */
342
+ /* stylelint-disable-next-line at-rule-empty-line-before */
456
343
  }
457
- @layer variables {
344
+ @media (width <= 48em) {
458
345
  .db-density-expressive,
459
346
  [data-density=expressive] {
460
- /* stylelint-disable-next-line media-query-no-invalid */
461
- /* stylelint-disable-next-line at-rule-empty-line-before */
462
- /* stylelint-disable-next-line media-query-no-invalid */
463
- /* stylelint-disable-next-line at-rule-empty-line-before */
464
- /* stylelint-disable-next-line media-query-no-invalid */
465
- /* stylelint-disable-next-line at-rule-empty-line-before */
466
- }
467
- @media (width <= 48em) {
468
- .db-density-expressive,
469
- [data-density=expressive] {
470
- --db-type-body-3xs: var(--db-typography-expressive-mobile-body-3xs);
471
- --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-expressive-mobile-body-3xs);
472
- --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-expressive-mobile-body-3xs);
473
- --db-type-body-2xs: var(--db-typography-expressive-mobile-body-2xs);
474
- --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-expressive-mobile-body-2xs);
475
- --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-expressive-mobile-body-2xs);
476
- --db-type-body-xs: var(--db-typography-expressive-mobile-body-xs);
477
- --db-base-body-icon-weight-xs: var(--db-base-icon-weight-expressive-mobile-body-xs);
478
- --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-expressive-mobile-body-xs);
479
- --db-type-body-sm: var(--db-typography-expressive-mobile-body-sm);
480
- --db-base-body-icon-weight-sm: var(--db-base-icon-weight-expressive-mobile-body-sm);
481
- --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-expressive-mobile-body-sm);
482
- --db-type-body-md: var(--db-typography-expressive-mobile-body-md);
483
- --db-base-body-icon-weight-md: var(--db-base-icon-weight-expressive-mobile-body-md);
484
- --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-expressive-mobile-body-md);
485
- --db-type-body-lg: var(--db-typography-expressive-mobile-body-lg);
486
- --db-base-body-icon-weight-lg: var(--db-base-icon-weight-expressive-mobile-body-lg);
487
- --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-expressive-mobile-body-lg);
488
- --db-type-body-xl: var(--db-typography-expressive-mobile-body-xl);
489
- --db-base-body-icon-weight-xl: var(--db-base-icon-weight-expressive-mobile-body-xl);
490
- --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-expressive-mobile-body-xl);
491
- --db-type-body-2xl: var(--db-typography-expressive-mobile-body-2xl);
492
- --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-expressive-mobile-body-2xl);
493
- --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-expressive-mobile-body-2xl);
494
- --db-type-body-3xl: var(--db-typography-expressive-mobile-body-3xl);
495
- --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-expressive-mobile-body-3xl);
496
- --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-expressive-mobile-body-3xl);
497
- }
347
+ --db-type-body-3xs: var(--db-typography-expressive-mobile-body-3xs);
348
+ --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-expressive-mobile-body-3xs);
349
+ --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-expressive-mobile-body-3xs);
350
+ --db-type-body-2xs: var(--db-typography-expressive-mobile-body-2xs);
351
+ --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-expressive-mobile-body-2xs);
352
+ --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-expressive-mobile-body-2xs);
353
+ --db-type-body-xs: var(--db-typography-expressive-mobile-body-xs);
354
+ --db-base-body-icon-weight-xs: var(--db-base-icon-weight-expressive-mobile-body-xs);
355
+ --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-expressive-mobile-body-xs);
356
+ --db-type-body-sm: var(--db-typography-expressive-mobile-body-sm);
357
+ --db-base-body-icon-weight-sm: var(--db-base-icon-weight-expressive-mobile-body-sm);
358
+ --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-expressive-mobile-body-sm);
359
+ --db-type-body-md: var(--db-typography-expressive-mobile-body-md);
360
+ --db-base-body-icon-weight-md: var(--db-base-icon-weight-expressive-mobile-body-md);
361
+ --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-expressive-mobile-body-md);
362
+ --db-type-body-lg: var(--db-typography-expressive-mobile-body-lg);
363
+ --db-base-body-icon-weight-lg: var(--db-base-icon-weight-expressive-mobile-body-lg);
364
+ --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-expressive-mobile-body-lg);
365
+ --db-type-body-xl: var(--db-typography-expressive-mobile-body-xl);
366
+ --db-base-body-icon-weight-xl: var(--db-base-icon-weight-expressive-mobile-body-xl);
367
+ --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-expressive-mobile-body-xl);
368
+ --db-type-body-2xl: var(--db-typography-expressive-mobile-body-2xl);
369
+ --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-expressive-mobile-body-2xl);
370
+ --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-expressive-mobile-body-2xl);
371
+ --db-type-body-3xl: var(--db-typography-expressive-mobile-body-3xl);
372
+ --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-expressive-mobile-body-3xl);
373
+ --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-expressive-mobile-body-3xl);
498
374
  }
499
- @media (48em < width <= 64em) {
500
- .db-density-expressive,
501
- [data-density=expressive] {
502
- --db-type-body-3xs: var(--db-typography-expressive-tablet-body-3xs);
503
- --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-expressive-tablet-body-3xs);
504
- --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-expressive-tablet-body-3xs);
505
- --db-type-body-2xs: var(--db-typography-expressive-tablet-body-2xs);
506
- --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-expressive-tablet-body-2xs);
507
- --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-expressive-tablet-body-2xs);
508
- --db-type-body-xs: var(--db-typography-expressive-tablet-body-xs);
509
- --db-base-body-icon-weight-xs: var(--db-base-icon-weight-expressive-tablet-body-xs);
510
- --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-expressive-tablet-body-xs);
511
- --db-type-body-sm: var(--db-typography-expressive-tablet-body-sm);
512
- --db-base-body-icon-weight-sm: var(--db-base-icon-weight-expressive-tablet-body-sm);
513
- --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-expressive-tablet-body-sm);
514
- --db-type-body-md: var(--db-typography-expressive-tablet-body-md);
515
- --db-base-body-icon-weight-md: var(--db-base-icon-weight-expressive-tablet-body-md);
516
- --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-expressive-tablet-body-md);
517
- --db-type-body-lg: var(--db-typography-expressive-tablet-body-lg);
518
- --db-base-body-icon-weight-lg: var(--db-base-icon-weight-expressive-tablet-body-lg);
519
- --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-expressive-tablet-body-lg);
520
- --db-type-body-xl: var(--db-typography-expressive-tablet-body-xl);
521
- --db-base-body-icon-weight-xl: var(--db-base-icon-weight-expressive-tablet-body-xl);
522
- --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-expressive-tablet-body-xl);
523
- --db-type-body-2xl: var(--db-typography-expressive-tablet-body-2xl);
524
- --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-expressive-tablet-body-2xl);
525
- --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-expressive-tablet-body-2xl);
526
- --db-type-body-3xl: var(--db-typography-expressive-tablet-body-3xl);
527
- --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-expressive-tablet-body-3xl);
528
- --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-expressive-tablet-body-3xl);
529
- }
375
+ }
376
+ @media (48em < width <= 64em) {
377
+ .db-density-expressive,
378
+ [data-density=expressive] {
379
+ --db-type-body-3xs: var(--db-typography-expressive-tablet-body-3xs);
380
+ --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-expressive-tablet-body-3xs);
381
+ --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-expressive-tablet-body-3xs);
382
+ --db-type-body-2xs: var(--db-typography-expressive-tablet-body-2xs);
383
+ --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-expressive-tablet-body-2xs);
384
+ --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-expressive-tablet-body-2xs);
385
+ --db-type-body-xs: var(--db-typography-expressive-tablet-body-xs);
386
+ --db-base-body-icon-weight-xs: var(--db-base-icon-weight-expressive-tablet-body-xs);
387
+ --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-expressive-tablet-body-xs);
388
+ --db-type-body-sm: var(--db-typography-expressive-tablet-body-sm);
389
+ --db-base-body-icon-weight-sm: var(--db-base-icon-weight-expressive-tablet-body-sm);
390
+ --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-expressive-tablet-body-sm);
391
+ --db-type-body-md: var(--db-typography-expressive-tablet-body-md);
392
+ --db-base-body-icon-weight-md: var(--db-base-icon-weight-expressive-tablet-body-md);
393
+ --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-expressive-tablet-body-md);
394
+ --db-type-body-lg: var(--db-typography-expressive-tablet-body-lg);
395
+ --db-base-body-icon-weight-lg: var(--db-base-icon-weight-expressive-tablet-body-lg);
396
+ --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-expressive-tablet-body-lg);
397
+ --db-type-body-xl: var(--db-typography-expressive-tablet-body-xl);
398
+ --db-base-body-icon-weight-xl: var(--db-base-icon-weight-expressive-tablet-body-xl);
399
+ --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-expressive-tablet-body-xl);
400
+ --db-type-body-2xl: var(--db-typography-expressive-tablet-body-2xl);
401
+ --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-expressive-tablet-body-2xl);
402
+ --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-expressive-tablet-body-2xl);
403
+ --db-type-body-3xl: var(--db-typography-expressive-tablet-body-3xl);
404
+ --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-expressive-tablet-body-3xl);
405
+ --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-expressive-tablet-body-3xl);
530
406
  }
531
- @media (64em < width) {
532
- .db-density-expressive,
533
- [data-density=expressive] {
534
- --db-type-body-3xs: var(--db-typography-expressive-desktop-body-3xs);
535
- --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-expressive-desktop-body-3xs);
536
- --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-expressive-desktop-body-3xs);
537
- --db-type-body-2xs: var(--db-typography-expressive-desktop-body-2xs);
538
- --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-expressive-desktop-body-2xs);
539
- --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-expressive-desktop-body-2xs);
540
- --db-type-body-xs: var(--db-typography-expressive-desktop-body-xs);
541
- --db-base-body-icon-weight-xs: var(--db-base-icon-weight-expressive-desktop-body-xs);
542
- --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-expressive-desktop-body-xs);
543
- --db-type-body-sm: var(--db-typography-expressive-desktop-body-sm);
544
- --db-base-body-icon-weight-sm: var(--db-base-icon-weight-expressive-desktop-body-sm);
545
- --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-expressive-desktop-body-sm);
546
- --db-type-body-md: var(--db-typography-expressive-desktop-body-md);
547
- --db-base-body-icon-weight-md: var(--db-base-icon-weight-expressive-desktop-body-md);
548
- --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-expressive-desktop-body-md);
549
- --db-type-body-lg: var(--db-typography-expressive-desktop-body-lg);
550
- --db-base-body-icon-weight-lg: var(--db-base-icon-weight-expressive-desktop-body-lg);
551
- --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-expressive-desktop-body-lg);
552
- --db-type-body-xl: var(--db-typography-expressive-desktop-body-xl);
553
- --db-base-body-icon-weight-xl: var(--db-base-icon-weight-expressive-desktop-body-xl);
554
- --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-expressive-desktop-body-xl);
555
- --db-type-body-2xl: var(--db-typography-expressive-desktop-body-2xl);
556
- --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-expressive-desktop-body-2xl);
557
- --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-expressive-desktop-body-2xl);
558
- --db-type-body-3xl: var(--db-typography-expressive-desktop-body-3xl);
559
- --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-expressive-desktop-body-3xl);
560
- --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-expressive-desktop-body-3xl);
561
- }
407
+ }
408
+ @media (64em < width) {
409
+ .db-density-expressive,
410
+ [data-density=expressive] {
411
+ --db-type-body-3xs: var(--db-typography-expressive-desktop-body-3xs);
412
+ --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-expressive-desktop-body-3xs);
413
+ --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-expressive-desktop-body-3xs);
414
+ --db-type-body-2xs: var(--db-typography-expressive-desktop-body-2xs);
415
+ --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-expressive-desktop-body-2xs);
416
+ --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-expressive-desktop-body-2xs);
417
+ --db-type-body-xs: var(--db-typography-expressive-desktop-body-xs);
418
+ --db-base-body-icon-weight-xs: var(--db-base-icon-weight-expressive-desktop-body-xs);
419
+ --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-expressive-desktop-body-xs);
420
+ --db-type-body-sm: var(--db-typography-expressive-desktop-body-sm);
421
+ --db-base-body-icon-weight-sm: var(--db-base-icon-weight-expressive-desktop-body-sm);
422
+ --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-expressive-desktop-body-sm);
423
+ --db-type-body-md: var(--db-typography-expressive-desktop-body-md);
424
+ --db-base-body-icon-weight-md: var(--db-base-icon-weight-expressive-desktop-body-md);
425
+ --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-expressive-desktop-body-md);
426
+ --db-type-body-lg: var(--db-typography-expressive-desktop-body-lg);
427
+ --db-base-body-icon-weight-lg: var(--db-base-icon-weight-expressive-desktop-body-lg);
428
+ --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-expressive-desktop-body-lg);
429
+ --db-type-body-xl: var(--db-typography-expressive-desktop-body-xl);
430
+ --db-base-body-icon-weight-xl: var(--db-base-icon-weight-expressive-desktop-body-xl);
431
+ --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-expressive-desktop-body-xl);
432
+ --db-type-body-2xl: var(--db-typography-expressive-desktop-body-2xl);
433
+ --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-expressive-desktop-body-2xl);
434
+ --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-expressive-desktop-body-2xl);
435
+ --db-type-body-3xl: var(--db-typography-expressive-desktop-body-3xl);
436
+ --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-expressive-desktop-body-3xl);
437
+ --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-expressive-desktop-body-3xl);
562
438
  }
563
439
  }
564
440
 
565
441
  .db-density-regular,
566
442
  [data-density=regular] {
567
- /* stylelint-disable-next-line at-rule-prelude-no-invalid,layer-name-pattern */
443
+ /* stylelint-disable-next-line media-query-no-invalid */
444
+ /* stylelint-disable-next-line at-rule-empty-line-before */
445
+ /* stylelint-disable-next-line media-query-no-invalid */
446
+ /* stylelint-disable-next-line at-rule-empty-line-before */
447
+ /* stylelint-disable-next-line media-query-no-invalid */
448
+ /* stylelint-disable-next-line at-rule-empty-line-before */
568
449
  }
569
- @layer variables {
450
+ @media (width <= 48em) {
570
451
  .db-density-regular,
571
452
  [data-density=regular] {
572
- /* stylelint-disable-next-line media-query-no-invalid */
573
- /* stylelint-disable-next-line at-rule-empty-line-before */
574
- /* stylelint-disable-next-line media-query-no-invalid */
575
- /* stylelint-disable-next-line at-rule-empty-line-before */
576
- /* stylelint-disable-next-line media-query-no-invalid */
577
- /* stylelint-disable-next-line at-rule-empty-line-before */
578
- }
579
- @media (width <= 48em) {
580
- .db-density-regular,
581
- [data-density=regular] {
582
- --db-type-headline-3xs: var(--db-typography-regular-mobile-headline-3xs);
583
- --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-regular-mobile-headline-3xs);
584
- --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-regular-mobile-headline-3xs);
585
- --db-type-headline-2xs: var(--db-typography-regular-mobile-headline-2xs);
586
- --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-regular-mobile-headline-2xs);
587
- --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-regular-mobile-headline-2xs);
588
- --db-type-headline-xs: var(--db-typography-regular-mobile-headline-xs);
589
- --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-regular-mobile-headline-xs);
590
- --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-regular-mobile-headline-xs);
591
- --db-type-headline-sm: var(--db-typography-regular-mobile-headline-sm);
592
- --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-regular-mobile-headline-sm);
593
- --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-regular-mobile-headline-sm);
594
- --db-type-headline-md: var(--db-typography-regular-mobile-headline-md);
595
- --db-base-headline-icon-weight-md: var(--db-base-icon-weight-regular-mobile-headline-md);
596
- --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-regular-mobile-headline-md);
597
- --db-type-headline-lg: var(--db-typography-regular-mobile-headline-lg);
598
- --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-regular-mobile-headline-lg);
599
- --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-regular-mobile-headline-lg);
600
- --db-type-headline-xl: var(--db-typography-regular-mobile-headline-xl);
601
- --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-regular-mobile-headline-xl);
602
- --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-regular-mobile-headline-xl);
603
- --db-type-headline-2xl: var(--db-typography-regular-mobile-headline-2xl);
604
- --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-regular-mobile-headline-2xl);
605
- --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-regular-mobile-headline-2xl);
606
- --db-type-headline-3xl: var(--db-typography-regular-mobile-headline-3xl);
607
- --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-regular-mobile-headline-3xl);
608
- --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-regular-mobile-headline-3xl);
609
- }
453
+ --db-type-headline-3xs: var(--db-typography-regular-mobile-headline-3xs);
454
+ --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-regular-mobile-headline-3xs);
455
+ --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-regular-mobile-headline-3xs);
456
+ --db-type-headline-2xs: var(--db-typography-regular-mobile-headline-2xs);
457
+ --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-regular-mobile-headline-2xs);
458
+ --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-regular-mobile-headline-2xs);
459
+ --db-type-headline-xs: var(--db-typography-regular-mobile-headline-xs);
460
+ --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-regular-mobile-headline-xs);
461
+ --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-regular-mobile-headline-xs);
462
+ --db-type-headline-sm: var(--db-typography-regular-mobile-headline-sm);
463
+ --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-regular-mobile-headline-sm);
464
+ --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-regular-mobile-headline-sm);
465
+ --db-type-headline-md: var(--db-typography-regular-mobile-headline-md);
466
+ --db-base-headline-icon-weight-md: var(--db-base-icon-weight-regular-mobile-headline-md);
467
+ --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-regular-mobile-headline-md);
468
+ --db-type-headline-lg: var(--db-typography-regular-mobile-headline-lg);
469
+ --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-regular-mobile-headline-lg);
470
+ --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-regular-mobile-headline-lg);
471
+ --db-type-headline-xl: var(--db-typography-regular-mobile-headline-xl);
472
+ --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-regular-mobile-headline-xl);
473
+ --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-regular-mobile-headline-xl);
474
+ --db-type-headline-2xl: var(--db-typography-regular-mobile-headline-2xl);
475
+ --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-regular-mobile-headline-2xl);
476
+ --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-regular-mobile-headline-2xl);
477
+ --db-type-headline-3xl: var(--db-typography-regular-mobile-headline-3xl);
478
+ --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-regular-mobile-headline-3xl);
479
+ --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-regular-mobile-headline-3xl);
610
480
  }
611
- @media (48em < width <= 64em) {
612
- .db-density-regular,
613
- [data-density=regular] {
614
- --db-type-headline-3xs: var(--db-typography-regular-tablet-headline-3xs);
615
- --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-regular-tablet-headline-3xs);
616
- --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-regular-tablet-headline-3xs);
617
- --db-type-headline-2xs: var(--db-typography-regular-tablet-headline-2xs);
618
- --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-regular-tablet-headline-2xs);
619
- --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-regular-tablet-headline-2xs);
620
- --db-type-headline-xs: var(--db-typography-regular-tablet-headline-xs);
621
- --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-regular-tablet-headline-xs);
622
- --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-regular-tablet-headline-xs);
623
- --db-type-headline-sm: var(--db-typography-regular-tablet-headline-sm);
624
- --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-regular-tablet-headline-sm);
625
- --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-regular-tablet-headline-sm);
626
- --db-type-headline-md: var(--db-typography-regular-tablet-headline-md);
627
- --db-base-headline-icon-weight-md: var(--db-base-icon-weight-regular-tablet-headline-md);
628
- --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-regular-tablet-headline-md);
629
- --db-type-headline-lg: var(--db-typography-regular-tablet-headline-lg);
630
- --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-regular-tablet-headline-lg);
631
- --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-regular-tablet-headline-lg);
632
- --db-type-headline-xl: var(--db-typography-regular-tablet-headline-xl);
633
- --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-regular-tablet-headline-xl);
634
- --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-regular-tablet-headline-xl);
635
- --db-type-headline-2xl: var(--db-typography-regular-tablet-headline-2xl);
636
- --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-regular-tablet-headline-2xl);
637
- --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-regular-tablet-headline-2xl);
638
- --db-type-headline-3xl: var(--db-typography-regular-tablet-headline-3xl);
639
- --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-regular-tablet-headline-3xl);
640
- --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-regular-tablet-headline-3xl);
641
- }
481
+ }
482
+ @media (48em < width <= 64em) {
483
+ .db-density-regular,
484
+ [data-density=regular] {
485
+ --db-type-headline-3xs: var(--db-typography-regular-tablet-headline-3xs);
486
+ --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-regular-tablet-headline-3xs);
487
+ --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-regular-tablet-headline-3xs);
488
+ --db-type-headline-2xs: var(--db-typography-regular-tablet-headline-2xs);
489
+ --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-regular-tablet-headline-2xs);
490
+ --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-regular-tablet-headline-2xs);
491
+ --db-type-headline-xs: var(--db-typography-regular-tablet-headline-xs);
492
+ --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-regular-tablet-headline-xs);
493
+ --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-regular-tablet-headline-xs);
494
+ --db-type-headline-sm: var(--db-typography-regular-tablet-headline-sm);
495
+ --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-regular-tablet-headline-sm);
496
+ --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-regular-tablet-headline-sm);
497
+ --db-type-headline-md: var(--db-typography-regular-tablet-headline-md);
498
+ --db-base-headline-icon-weight-md: var(--db-base-icon-weight-regular-tablet-headline-md);
499
+ --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-regular-tablet-headline-md);
500
+ --db-type-headline-lg: var(--db-typography-regular-tablet-headline-lg);
501
+ --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-regular-tablet-headline-lg);
502
+ --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-regular-tablet-headline-lg);
503
+ --db-type-headline-xl: var(--db-typography-regular-tablet-headline-xl);
504
+ --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-regular-tablet-headline-xl);
505
+ --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-regular-tablet-headline-xl);
506
+ --db-type-headline-2xl: var(--db-typography-regular-tablet-headline-2xl);
507
+ --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-regular-tablet-headline-2xl);
508
+ --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-regular-tablet-headline-2xl);
509
+ --db-type-headline-3xl: var(--db-typography-regular-tablet-headline-3xl);
510
+ --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-regular-tablet-headline-3xl);
511
+ --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-regular-tablet-headline-3xl);
642
512
  }
643
- @media (64em < width) {
644
- .db-density-regular,
645
- [data-density=regular] {
646
- --db-type-headline-3xs: var(--db-typography-regular-desktop-headline-3xs);
647
- --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-regular-desktop-headline-3xs);
648
- --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-regular-desktop-headline-3xs);
649
- --db-type-headline-2xs: var(--db-typography-regular-desktop-headline-2xs);
650
- --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-regular-desktop-headline-2xs);
651
- --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-regular-desktop-headline-2xs);
652
- --db-type-headline-xs: var(--db-typography-regular-desktop-headline-xs);
653
- --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-regular-desktop-headline-xs);
654
- --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-regular-desktop-headline-xs);
655
- --db-type-headline-sm: var(--db-typography-regular-desktop-headline-sm);
656
- --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-regular-desktop-headline-sm);
657
- --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-regular-desktop-headline-sm);
658
- --db-type-headline-md: var(--db-typography-regular-desktop-headline-md);
659
- --db-base-headline-icon-weight-md: var(--db-base-icon-weight-regular-desktop-headline-md);
660
- --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-regular-desktop-headline-md);
661
- --db-type-headline-lg: var(--db-typography-regular-desktop-headline-lg);
662
- --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-regular-desktop-headline-lg);
663
- --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-regular-desktop-headline-lg);
664
- --db-type-headline-xl: var(--db-typography-regular-desktop-headline-xl);
665
- --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-regular-desktop-headline-xl);
666
- --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-regular-desktop-headline-xl);
667
- --db-type-headline-2xl: var(--db-typography-regular-desktop-headline-2xl);
668
- --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-regular-desktop-headline-2xl);
669
- --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-regular-desktop-headline-2xl);
670
- --db-type-headline-3xl: var(--db-typography-regular-desktop-headline-3xl);
671
- --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-regular-desktop-headline-3xl);
672
- --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-regular-desktop-headline-3xl);
673
- }
513
+ }
514
+ @media (64em < width) {
515
+ .db-density-regular,
516
+ [data-density=regular] {
517
+ --db-type-headline-3xs: var(--db-typography-regular-desktop-headline-3xs);
518
+ --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-regular-desktop-headline-3xs);
519
+ --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-regular-desktop-headline-3xs);
520
+ --db-type-headline-2xs: var(--db-typography-regular-desktop-headline-2xs);
521
+ --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-regular-desktop-headline-2xs);
522
+ --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-regular-desktop-headline-2xs);
523
+ --db-type-headline-xs: var(--db-typography-regular-desktop-headline-xs);
524
+ --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-regular-desktop-headline-xs);
525
+ --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-regular-desktop-headline-xs);
526
+ --db-type-headline-sm: var(--db-typography-regular-desktop-headline-sm);
527
+ --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-regular-desktop-headline-sm);
528
+ --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-regular-desktop-headline-sm);
529
+ --db-type-headline-md: var(--db-typography-regular-desktop-headline-md);
530
+ --db-base-headline-icon-weight-md: var(--db-base-icon-weight-regular-desktop-headline-md);
531
+ --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-regular-desktop-headline-md);
532
+ --db-type-headline-lg: var(--db-typography-regular-desktop-headline-lg);
533
+ --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-regular-desktop-headline-lg);
534
+ --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-regular-desktop-headline-lg);
535
+ --db-type-headline-xl: var(--db-typography-regular-desktop-headline-xl);
536
+ --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-regular-desktop-headline-xl);
537
+ --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-regular-desktop-headline-xl);
538
+ --db-type-headline-2xl: var(--db-typography-regular-desktop-headline-2xl);
539
+ --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-regular-desktop-headline-2xl);
540
+ --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-regular-desktop-headline-2xl);
541
+ --db-type-headline-3xl: var(--db-typography-regular-desktop-headline-3xl);
542
+ --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-regular-desktop-headline-3xl);
543
+ --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-regular-desktop-headline-3xl);
674
544
  }
675
545
  }
676
546
 
677
547
  .db-density-regular,
678
548
  [data-density=regular] {
679
- /* stylelint-disable-next-line at-rule-prelude-no-invalid,layer-name-pattern */
549
+ /* stylelint-disable-next-line media-query-no-invalid */
550
+ /* stylelint-disable-next-line at-rule-empty-line-before */
551
+ /* stylelint-disable-next-line media-query-no-invalid */
552
+ /* stylelint-disable-next-line at-rule-empty-line-before */
553
+ /* stylelint-disable-next-line media-query-no-invalid */
554
+ /* stylelint-disable-next-line at-rule-empty-line-before */
680
555
  }
681
- @layer variables {
556
+ @media (width <= 48em) {
682
557
  .db-density-regular,
683
558
  [data-density=regular] {
684
- /* stylelint-disable-next-line media-query-no-invalid */
685
- /* stylelint-disable-next-line at-rule-empty-line-before */
686
- /* stylelint-disable-next-line media-query-no-invalid */
687
- /* stylelint-disable-next-line at-rule-empty-line-before */
688
- /* stylelint-disable-next-line media-query-no-invalid */
689
- /* stylelint-disable-next-line at-rule-empty-line-before */
690
- }
691
- @media (width <= 48em) {
692
- .db-density-regular,
693
- [data-density=regular] {
694
- --db-type-body-3xs: var(--db-typography-regular-mobile-body-3xs);
695
- --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-regular-mobile-body-3xs);
696
- --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-regular-mobile-body-3xs);
697
- --db-type-body-2xs: var(--db-typography-regular-mobile-body-2xs);
698
- --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-regular-mobile-body-2xs);
699
- --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-regular-mobile-body-2xs);
700
- --db-type-body-xs: var(--db-typography-regular-mobile-body-xs);
701
- --db-base-body-icon-weight-xs: var(--db-base-icon-weight-regular-mobile-body-xs);
702
- --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-regular-mobile-body-xs);
703
- --db-type-body-sm: var(--db-typography-regular-mobile-body-sm);
704
- --db-base-body-icon-weight-sm: var(--db-base-icon-weight-regular-mobile-body-sm);
705
- --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-regular-mobile-body-sm);
706
- --db-type-body-md: var(--db-typography-regular-mobile-body-md);
707
- --db-base-body-icon-weight-md: var(--db-base-icon-weight-regular-mobile-body-md);
708
- --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-regular-mobile-body-md);
709
- --db-type-body-lg: var(--db-typography-regular-mobile-body-lg);
710
- --db-base-body-icon-weight-lg: var(--db-base-icon-weight-regular-mobile-body-lg);
711
- --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-regular-mobile-body-lg);
712
- --db-type-body-xl: var(--db-typography-regular-mobile-body-xl);
713
- --db-base-body-icon-weight-xl: var(--db-base-icon-weight-regular-mobile-body-xl);
714
- --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-regular-mobile-body-xl);
715
- --db-type-body-2xl: var(--db-typography-regular-mobile-body-2xl);
716
- --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-regular-mobile-body-2xl);
717
- --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-regular-mobile-body-2xl);
718
- --db-type-body-3xl: var(--db-typography-regular-mobile-body-3xl);
719
- --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-regular-mobile-body-3xl);
720
- --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-regular-mobile-body-3xl);
721
- }
559
+ --db-type-body-3xs: var(--db-typography-regular-mobile-body-3xs);
560
+ --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-regular-mobile-body-3xs);
561
+ --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-regular-mobile-body-3xs);
562
+ --db-type-body-2xs: var(--db-typography-regular-mobile-body-2xs);
563
+ --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-regular-mobile-body-2xs);
564
+ --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-regular-mobile-body-2xs);
565
+ --db-type-body-xs: var(--db-typography-regular-mobile-body-xs);
566
+ --db-base-body-icon-weight-xs: var(--db-base-icon-weight-regular-mobile-body-xs);
567
+ --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-regular-mobile-body-xs);
568
+ --db-type-body-sm: var(--db-typography-regular-mobile-body-sm);
569
+ --db-base-body-icon-weight-sm: var(--db-base-icon-weight-regular-mobile-body-sm);
570
+ --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-regular-mobile-body-sm);
571
+ --db-type-body-md: var(--db-typography-regular-mobile-body-md);
572
+ --db-base-body-icon-weight-md: var(--db-base-icon-weight-regular-mobile-body-md);
573
+ --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-regular-mobile-body-md);
574
+ --db-type-body-lg: var(--db-typography-regular-mobile-body-lg);
575
+ --db-base-body-icon-weight-lg: var(--db-base-icon-weight-regular-mobile-body-lg);
576
+ --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-regular-mobile-body-lg);
577
+ --db-type-body-xl: var(--db-typography-regular-mobile-body-xl);
578
+ --db-base-body-icon-weight-xl: var(--db-base-icon-weight-regular-mobile-body-xl);
579
+ --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-regular-mobile-body-xl);
580
+ --db-type-body-2xl: var(--db-typography-regular-mobile-body-2xl);
581
+ --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-regular-mobile-body-2xl);
582
+ --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-regular-mobile-body-2xl);
583
+ --db-type-body-3xl: var(--db-typography-regular-mobile-body-3xl);
584
+ --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-regular-mobile-body-3xl);
585
+ --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-regular-mobile-body-3xl);
722
586
  }
723
- @media (48em < width <= 64em) {
724
- .db-density-regular,
725
- [data-density=regular] {
726
- --db-type-body-3xs: var(--db-typography-regular-tablet-body-3xs);
727
- --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-regular-tablet-body-3xs);
728
- --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-regular-tablet-body-3xs);
729
- --db-type-body-2xs: var(--db-typography-regular-tablet-body-2xs);
730
- --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-regular-tablet-body-2xs);
731
- --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-regular-tablet-body-2xs);
732
- --db-type-body-xs: var(--db-typography-regular-tablet-body-xs);
733
- --db-base-body-icon-weight-xs: var(--db-base-icon-weight-regular-tablet-body-xs);
734
- --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-regular-tablet-body-xs);
735
- --db-type-body-sm: var(--db-typography-regular-tablet-body-sm);
736
- --db-base-body-icon-weight-sm: var(--db-base-icon-weight-regular-tablet-body-sm);
737
- --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-regular-tablet-body-sm);
738
- --db-type-body-md: var(--db-typography-regular-tablet-body-md);
739
- --db-base-body-icon-weight-md: var(--db-base-icon-weight-regular-tablet-body-md);
740
- --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-regular-tablet-body-md);
741
- --db-type-body-lg: var(--db-typography-regular-tablet-body-lg);
742
- --db-base-body-icon-weight-lg: var(--db-base-icon-weight-regular-tablet-body-lg);
743
- --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-regular-tablet-body-lg);
744
- --db-type-body-xl: var(--db-typography-regular-tablet-body-xl);
745
- --db-base-body-icon-weight-xl: var(--db-base-icon-weight-regular-tablet-body-xl);
746
- --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-regular-tablet-body-xl);
747
- --db-type-body-2xl: var(--db-typography-regular-tablet-body-2xl);
748
- --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-regular-tablet-body-2xl);
749
- --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-regular-tablet-body-2xl);
750
- --db-type-body-3xl: var(--db-typography-regular-tablet-body-3xl);
751
- --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-regular-tablet-body-3xl);
752
- --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-regular-tablet-body-3xl);
753
- }
587
+ }
588
+ @media (48em < width <= 64em) {
589
+ .db-density-regular,
590
+ [data-density=regular] {
591
+ --db-type-body-3xs: var(--db-typography-regular-tablet-body-3xs);
592
+ --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-regular-tablet-body-3xs);
593
+ --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-regular-tablet-body-3xs);
594
+ --db-type-body-2xs: var(--db-typography-regular-tablet-body-2xs);
595
+ --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-regular-tablet-body-2xs);
596
+ --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-regular-tablet-body-2xs);
597
+ --db-type-body-xs: var(--db-typography-regular-tablet-body-xs);
598
+ --db-base-body-icon-weight-xs: var(--db-base-icon-weight-regular-tablet-body-xs);
599
+ --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-regular-tablet-body-xs);
600
+ --db-type-body-sm: var(--db-typography-regular-tablet-body-sm);
601
+ --db-base-body-icon-weight-sm: var(--db-base-icon-weight-regular-tablet-body-sm);
602
+ --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-regular-tablet-body-sm);
603
+ --db-type-body-md: var(--db-typography-regular-tablet-body-md);
604
+ --db-base-body-icon-weight-md: var(--db-base-icon-weight-regular-tablet-body-md);
605
+ --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-regular-tablet-body-md);
606
+ --db-type-body-lg: var(--db-typography-regular-tablet-body-lg);
607
+ --db-base-body-icon-weight-lg: var(--db-base-icon-weight-regular-tablet-body-lg);
608
+ --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-regular-tablet-body-lg);
609
+ --db-type-body-xl: var(--db-typography-regular-tablet-body-xl);
610
+ --db-base-body-icon-weight-xl: var(--db-base-icon-weight-regular-tablet-body-xl);
611
+ --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-regular-tablet-body-xl);
612
+ --db-type-body-2xl: var(--db-typography-regular-tablet-body-2xl);
613
+ --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-regular-tablet-body-2xl);
614
+ --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-regular-tablet-body-2xl);
615
+ --db-type-body-3xl: var(--db-typography-regular-tablet-body-3xl);
616
+ --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-regular-tablet-body-3xl);
617
+ --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-regular-tablet-body-3xl);
754
618
  }
755
- @media (64em < width) {
756
- .db-density-regular,
757
- [data-density=regular] {
758
- --db-type-body-3xs: var(--db-typography-regular-desktop-body-3xs);
759
- --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-regular-desktop-body-3xs);
760
- --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-regular-desktop-body-3xs);
761
- --db-type-body-2xs: var(--db-typography-regular-desktop-body-2xs);
762
- --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-regular-desktop-body-2xs);
763
- --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-regular-desktop-body-2xs);
764
- --db-type-body-xs: var(--db-typography-regular-desktop-body-xs);
765
- --db-base-body-icon-weight-xs: var(--db-base-icon-weight-regular-desktop-body-xs);
766
- --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-regular-desktop-body-xs);
767
- --db-type-body-sm: var(--db-typography-regular-desktop-body-sm);
768
- --db-base-body-icon-weight-sm: var(--db-base-icon-weight-regular-desktop-body-sm);
769
- --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-regular-desktop-body-sm);
770
- --db-type-body-md: var(--db-typography-regular-desktop-body-md);
771
- --db-base-body-icon-weight-md: var(--db-base-icon-weight-regular-desktop-body-md);
772
- --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-regular-desktop-body-md);
773
- --db-type-body-lg: var(--db-typography-regular-desktop-body-lg);
774
- --db-base-body-icon-weight-lg: var(--db-base-icon-weight-regular-desktop-body-lg);
775
- --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-regular-desktop-body-lg);
776
- --db-type-body-xl: var(--db-typography-regular-desktop-body-xl);
777
- --db-base-body-icon-weight-xl: var(--db-base-icon-weight-regular-desktop-body-xl);
778
- --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-regular-desktop-body-xl);
779
- --db-type-body-2xl: var(--db-typography-regular-desktop-body-2xl);
780
- --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-regular-desktop-body-2xl);
781
- --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-regular-desktop-body-2xl);
782
- --db-type-body-3xl: var(--db-typography-regular-desktop-body-3xl);
783
- --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-regular-desktop-body-3xl);
784
- --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-regular-desktop-body-3xl);
785
- }
619
+ }
620
+ @media (64em < width) {
621
+ .db-density-regular,
622
+ [data-density=regular] {
623
+ --db-type-body-3xs: var(--db-typography-regular-desktop-body-3xs);
624
+ --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-regular-desktop-body-3xs);
625
+ --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-regular-desktop-body-3xs);
626
+ --db-type-body-2xs: var(--db-typography-regular-desktop-body-2xs);
627
+ --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-regular-desktop-body-2xs);
628
+ --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-regular-desktop-body-2xs);
629
+ --db-type-body-xs: var(--db-typography-regular-desktop-body-xs);
630
+ --db-base-body-icon-weight-xs: var(--db-base-icon-weight-regular-desktop-body-xs);
631
+ --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-regular-desktop-body-xs);
632
+ --db-type-body-sm: var(--db-typography-regular-desktop-body-sm);
633
+ --db-base-body-icon-weight-sm: var(--db-base-icon-weight-regular-desktop-body-sm);
634
+ --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-regular-desktop-body-sm);
635
+ --db-type-body-md: var(--db-typography-regular-desktop-body-md);
636
+ --db-base-body-icon-weight-md: var(--db-base-icon-weight-regular-desktop-body-md);
637
+ --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-regular-desktop-body-md);
638
+ --db-type-body-lg: var(--db-typography-regular-desktop-body-lg);
639
+ --db-base-body-icon-weight-lg: var(--db-base-icon-weight-regular-desktop-body-lg);
640
+ --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-regular-desktop-body-lg);
641
+ --db-type-body-xl: var(--db-typography-regular-desktop-body-xl);
642
+ --db-base-body-icon-weight-xl: var(--db-base-icon-weight-regular-desktop-body-xl);
643
+ --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-regular-desktop-body-xl);
644
+ --db-type-body-2xl: var(--db-typography-regular-desktop-body-2xl);
645
+ --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-regular-desktop-body-2xl);
646
+ --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-regular-desktop-body-2xl);
647
+ --db-type-body-3xl: var(--db-typography-regular-desktop-body-3xl);
648
+ --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-regular-desktop-body-3xl);
649
+ --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-regular-desktop-body-3xl);
786
650
  }
787
651
  }
788
652
 
789
653
  .db-density-functional,
790
654
  [data-density=functional] {
791
- /* stylelint-disable-next-line at-rule-prelude-no-invalid,layer-name-pattern */
655
+ /* stylelint-disable-next-line media-query-no-invalid */
656
+ /* stylelint-disable-next-line at-rule-empty-line-before */
657
+ /* stylelint-disable-next-line media-query-no-invalid */
658
+ /* stylelint-disable-next-line at-rule-empty-line-before */
659
+ /* stylelint-disable-next-line media-query-no-invalid */
660
+ /* stylelint-disable-next-line at-rule-empty-line-before */
792
661
  }
793
- @layer variables {
662
+ @media (width <= 48em) {
794
663
  .db-density-functional,
795
664
  [data-density=functional] {
796
- /* stylelint-disable-next-line media-query-no-invalid */
797
- /* stylelint-disable-next-line at-rule-empty-line-before */
798
- /* stylelint-disable-next-line media-query-no-invalid */
799
- /* stylelint-disable-next-line at-rule-empty-line-before */
800
- /* stylelint-disable-next-line media-query-no-invalid */
801
- /* stylelint-disable-next-line at-rule-empty-line-before */
802
- }
803
- @media (width <= 48em) {
804
- .db-density-functional,
805
- [data-density=functional] {
806
- --db-type-headline-3xs: var(--db-typography-functional-mobile-headline-3xs);
807
- --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-functional-mobile-headline-3xs);
808
- --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-functional-mobile-headline-3xs);
809
- --db-type-headline-2xs: var(--db-typography-functional-mobile-headline-2xs);
810
- --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-functional-mobile-headline-2xs);
811
- --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-functional-mobile-headline-2xs);
812
- --db-type-headline-xs: var(--db-typography-functional-mobile-headline-xs);
813
- --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-functional-mobile-headline-xs);
814
- --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-functional-mobile-headline-xs);
815
- --db-type-headline-sm: var(--db-typography-functional-mobile-headline-sm);
816
- --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-functional-mobile-headline-sm);
817
- --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-functional-mobile-headline-sm);
818
- --db-type-headline-md: var(--db-typography-functional-mobile-headline-md);
819
- --db-base-headline-icon-weight-md: var(--db-base-icon-weight-functional-mobile-headline-md);
820
- --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-functional-mobile-headline-md);
821
- --db-type-headline-lg: var(--db-typography-functional-mobile-headline-lg);
822
- --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-functional-mobile-headline-lg);
823
- --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-functional-mobile-headline-lg);
824
- --db-type-headline-xl: var(--db-typography-functional-mobile-headline-xl);
825
- --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-functional-mobile-headline-xl);
826
- --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-functional-mobile-headline-xl);
827
- --db-type-headline-2xl: var(--db-typography-functional-mobile-headline-2xl);
828
- --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-functional-mobile-headline-2xl);
829
- --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-functional-mobile-headline-2xl);
830
- --db-type-headline-3xl: var(--db-typography-functional-mobile-headline-3xl);
831
- --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-functional-mobile-headline-3xl);
832
- --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-functional-mobile-headline-3xl);
833
- }
665
+ --db-type-headline-3xs: var(--db-typography-functional-mobile-headline-3xs);
666
+ --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-functional-mobile-headline-3xs);
667
+ --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-functional-mobile-headline-3xs);
668
+ --db-type-headline-2xs: var(--db-typography-functional-mobile-headline-2xs);
669
+ --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-functional-mobile-headline-2xs);
670
+ --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-functional-mobile-headline-2xs);
671
+ --db-type-headline-xs: var(--db-typography-functional-mobile-headline-xs);
672
+ --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-functional-mobile-headline-xs);
673
+ --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-functional-mobile-headline-xs);
674
+ --db-type-headline-sm: var(--db-typography-functional-mobile-headline-sm);
675
+ --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-functional-mobile-headline-sm);
676
+ --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-functional-mobile-headline-sm);
677
+ --db-type-headline-md: var(--db-typography-functional-mobile-headline-md);
678
+ --db-base-headline-icon-weight-md: var(--db-base-icon-weight-functional-mobile-headline-md);
679
+ --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-functional-mobile-headline-md);
680
+ --db-type-headline-lg: var(--db-typography-functional-mobile-headline-lg);
681
+ --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-functional-mobile-headline-lg);
682
+ --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-functional-mobile-headline-lg);
683
+ --db-type-headline-xl: var(--db-typography-functional-mobile-headline-xl);
684
+ --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-functional-mobile-headline-xl);
685
+ --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-functional-mobile-headline-xl);
686
+ --db-type-headline-2xl: var(--db-typography-functional-mobile-headline-2xl);
687
+ --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-functional-mobile-headline-2xl);
688
+ --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-functional-mobile-headline-2xl);
689
+ --db-type-headline-3xl: var(--db-typography-functional-mobile-headline-3xl);
690
+ --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-functional-mobile-headline-3xl);
691
+ --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-functional-mobile-headline-3xl);
834
692
  }
835
- @media (48em < width <= 64em) {
836
- .db-density-functional,
837
- [data-density=functional] {
838
- --db-type-headline-3xs: var(--db-typography-functional-tablet-headline-3xs);
839
- --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-functional-tablet-headline-3xs);
840
- --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-functional-tablet-headline-3xs);
841
- --db-type-headline-2xs: var(--db-typography-functional-tablet-headline-2xs);
842
- --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-functional-tablet-headline-2xs);
843
- --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-functional-tablet-headline-2xs);
844
- --db-type-headline-xs: var(--db-typography-functional-tablet-headline-xs);
845
- --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-functional-tablet-headline-xs);
846
- --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-functional-tablet-headline-xs);
847
- --db-type-headline-sm: var(--db-typography-functional-tablet-headline-sm);
848
- --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-functional-tablet-headline-sm);
849
- --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-functional-tablet-headline-sm);
850
- --db-type-headline-md: var(--db-typography-functional-tablet-headline-md);
851
- --db-base-headline-icon-weight-md: var(--db-base-icon-weight-functional-tablet-headline-md);
852
- --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-functional-tablet-headline-md);
853
- --db-type-headline-lg: var(--db-typography-functional-tablet-headline-lg);
854
- --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-functional-tablet-headline-lg);
855
- --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-functional-tablet-headline-lg);
856
- --db-type-headline-xl: var(--db-typography-functional-tablet-headline-xl);
857
- --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-functional-tablet-headline-xl);
858
- --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-functional-tablet-headline-xl);
859
- --db-type-headline-2xl: var(--db-typography-functional-tablet-headline-2xl);
860
- --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-functional-tablet-headline-2xl);
861
- --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-functional-tablet-headline-2xl);
862
- --db-type-headline-3xl: var(--db-typography-functional-tablet-headline-3xl);
863
- --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-functional-tablet-headline-3xl);
864
- --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-functional-tablet-headline-3xl);
865
- }
693
+ }
694
+ @media (48em < width <= 64em) {
695
+ .db-density-functional,
696
+ [data-density=functional] {
697
+ --db-type-headline-3xs: var(--db-typography-functional-tablet-headline-3xs);
698
+ --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-functional-tablet-headline-3xs);
699
+ --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-functional-tablet-headline-3xs);
700
+ --db-type-headline-2xs: var(--db-typography-functional-tablet-headline-2xs);
701
+ --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-functional-tablet-headline-2xs);
702
+ --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-functional-tablet-headline-2xs);
703
+ --db-type-headline-xs: var(--db-typography-functional-tablet-headline-xs);
704
+ --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-functional-tablet-headline-xs);
705
+ --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-functional-tablet-headline-xs);
706
+ --db-type-headline-sm: var(--db-typography-functional-tablet-headline-sm);
707
+ --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-functional-tablet-headline-sm);
708
+ --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-functional-tablet-headline-sm);
709
+ --db-type-headline-md: var(--db-typography-functional-tablet-headline-md);
710
+ --db-base-headline-icon-weight-md: var(--db-base-icon-weight-functional-tablet-headline-md);
711
+ --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-functional-tablet-headline-md);
712
+ --db-type-headline-lg: var(--db-typography-functional-tablet-headline-lg);
713
+ --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-functional-tablet-headline-lg);
714
+ --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-functional-tablet-headline-lg);
715
+ --db-type-headline-xl: var(--db-typography-functional-tablet-headline-xl);
716
+ --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-functional-tablet-headline-xl);
717
+ --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-functional-tablet-headline-xl);
718
+ --db-type-headline-2xl: var(--db-typography-functional-tablet-headline-2xl);
719
+ --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-functional-tablet-headline-2xl);
720
+ --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-functional-tablet-headline-2xl);
721
+ --db-type-headline-3xl: var(--db-typography-functional-tablet-headline-3xl);
722
+ --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-functional-tablet-headline-3xl);
723
+ --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-functional-tablet-headline-3xl);
866
724
  }
867
- @media (64em < width) {
868
- .db-density-functional,
869
- [data-density=functional] {
870
- --db-type-headline-3xs: var(--db-typography-functional-desktop-headline-3xs);
871
- --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-functional-desktop-headline-3xs);
872
- --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-functional-desktop-headline-3xs);
873
- --db-type-headline-2xs: var(--db-typography-functional-desktop-headline-2xs);
874
- --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-functional-desktop-headline-2xs);
875
- --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-functional-desktop-headline-2xs);
876
- --db-type-headline-xs: var(--db-typography-functional-desktop-headline-xs);
877
- --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-functional-desktop-headline-xs);
878
- --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-functional-desktop-headline-xs);
879
- --db-type-headline-sm: var(--db-typography-functional-desktop-headline-sm);
880
- --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-functional-desktop-headline-sm);
881
- --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-functional-desktop-headline-sm);
882
- --db-type-headline-md: var(--db-typography-functional-desktop-headline-md);
883
- --db-base-headline-icon-weight-md: var(--db-base-icon-weight-functional-desktop-headline-md);
884
- --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-functional-desktop-headline-md);
885
- --db-type-headline-lg: var(--db-typography-functional-desktop-headline-lg);
886
- --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-functional-desktop-headline-lg);
887
- --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-functional-desktop-headline-lg);
888
- --db-type-headline-xl: var(--db-typography-functional-desktop-headline-xl);
889
- --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-functional-desktop-headline-xl);
890
- --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-functional-desktop-headline-xl);
891
- --db-type-headline-2xl: var(--db-typography-functional-desktop-headline-2xl);
892
- --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-functional-desktop-headline-2xl);
893
- --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-functional-desktop-headline-2xl);
894
- --db-type-headline-3xl: var(--db-typography-functional-desktop-headline-3xl);
895
- --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-functional-desktop-headline-3xl);
896
- --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-functional-desktop-headline-3xl);
897
- }
725
+ }
726
+ @media (64em < width) {
727
+ .db-density-functional,
728
+ [data-density=functional] {
729
+ --db-type-headline-3xs: var(--db-typography-functional-desktop-headline-3xs);
730
+ --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-functional-desktop-headline-3xs);
731
+ --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-functional-desktop-headline-3xs);
732
+ --db-type-headline-2xs: var(--db-typography-functional-desktop-headline-2xs);
733
+ --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-functional-desktop-headline-2xs);
734
+ --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-functional-desktop-headline-2xs);
735
+ --db-type-headline-xs: var(--db-typography-functional-desktop-headline-xs);
736
+ --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-functional-desktop-headline-xs);
737
+ --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-functional-desktop-headline-xs);
738
+ --db-type-headline-sm: var(--db-typography-functional-desktop-headline-sm);
739
+ --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-functional-desktop-headline-sm);
740
+ --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-functional-desktop-headline-sm);
741
+ --db-type-headline-md: var(--db-typography-functional-desktop-headline-md);
742
+ --db-base-headline-icon-weight-md: var(--db-base-icon-weight-functional-desktop-headline-md);
743
+ --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-functional-desktop-headline-md);
744
+ --db-type-headline-lg: var(--db-typography-functional-desktop-headline-lg);
745
+ --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-functional-desktop-headline-lg);
746
+ --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-functional-desktop-headline-lg);
747
+ --db-type-headline-xl: var(--db-typography-functional-desktop-headline-xl);
748
+ --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-functional-desktop-headline-xl);
749
+ --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-functional-desktop-headline-xl);
750
+ --db-type-headline-2xl: var(--db-typography-functional-desktop-headline-2xl);
751
+ --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-functional-desktop-headline-2xl);
752
+ --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-functional-desktop-headline-2xl);
753
+ --db-type-headline-3xl: var(--db-typography-functional-desktop-headline-3xl);
754
+ --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-functional-desktop-headline-3xl);
755
+ --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-functional-desktop-headline-3xl);
898
756
  }
899
757
  }
900
758
 
901
759
  .db-density-functional,
902
760
  [data-density=functional] {
903
- /* stylelint-disable-next-line at-rule-prelude-no-invalid,layer-name-pattern */
761
+ /* stylelint-disable-next-line media-query-no-invalid */
762
+ /* stylelint-disable-next-line at-rule-empty-line-before */
763
+ /* stylelint-disable-next-line media-query-no-invalid */
764
+ /* stylelint-disable-next-line at-rule-empty-line-before */
765
+ /* stylelint-disable-next-line media-query-no-invalid */
766
+ /* stylelint-disable-next-line at-rule-empty-line-before */
904
767
  }
905
- @layer variables {
768
+ @media (width <= 48em) {
906
769
  .db-density-functional,
907
770
  [data-density=functional] {
908
- /* stylelint-disable-next-line media-query-no-invalid */
909
- /* stylelint-disable-next-line at-rule-empty-line-before */
910
- /* stylelint-disable-next-line media-query-no-invalid */
911
- /* stylelint-disable-next-line at-rule-empty-line-before */
912
- /* stylelint-disable-next-line media-query-no-invalid */
913
- /* stylelint-disable-next-line at-rule-empty-line-before */
914
- }
915
- @media (width <= 48em) {
916
- .db-density-functional,
917
- [data-density=functional] {
918
- --db-type-body-3xs: var(--db-typography-functional-mobile-body-3xs);
919
- --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-functional-mobile-body-3xs);
920
- --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-functional-mobile-body-3xs);
921
- --db-type-body-2xs: var(--db-typography-functional-mobile-body-2xs);
922
- --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-functional-mobile-body-2xs);
923
- --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-functional-mobile-body-2xs);
924
- --db-type-body-xs: var(--db-typography-functional-mobile-body-xs);
925
- --db-base-body-icon-weight-xs: var(--db-base-icon-weight-functional-mobile-body-xs);
926
- --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-functional-mobile-body-xs);
927
- --db-type-body-sm: var(--db-typography-functional-mobile-body-sm);
928
- --db-base-body-icon-weight-sm: var(--db-base-icon-weight-functional-mobile-body-sm);
929
- --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-functional-mobile-body-sm);
930
- --db-type-body-md: var(--db-typography-functional-mobile-body-md);
931
- --db-base-body-icon-weight-md: var(--db-base-icon-weight-functional-mobile-body-md);
932
- --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-functional-mobile-body-md);
933
- --db-type-body-lg: var(--db-typography-functional-mobile-body-lg);
934
- --db-base-body-icon-weight-lg: var(--db-base-icon-weight-functional-mobile-body-lg);
935
- --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-functional-mobile-body-lg);
936
- --db-type-body-xl: var(--db-typography-functional-mobile-body-xl);
937
- --db-base-body-icon-weight-xl: var(--db-base-icon-weight-functional-mobile-body-xl);
938
- --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-functional-mobile-body-xl);
939
- --db-type-body-2xl: var(--db-typography-functional-mobile-body-2xl);
940
- --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-functional-mobile-body-2xl);
941
- --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-functional-mobile-body-2xl);
942
- --db-type-body-3xl: var(--db-typography-functional-mobile-body-3xl);
943
- --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-functional-mobile-body-3xl);
944
- --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-functional-mobile-body-3xl);
945
- }
771
+ --db-type-body-3xs: var(--db-typography-functional-mobile-body-3xs);
772
+ --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-functional-mobile-body-3xs);
773
+ --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-functional-mobile-body-3xs);
774
+ --db-type-body-2xs: var(--db-typography-functional-mobile-body-2xs);
775
+ --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-functional-mobile-body-2xs);
776
+ --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-functional-mobile-body-2xs);
777
+ --db-type-body-xs: var(--db-typography-functional-mobile-body-xs);
778
+ --db-base-body-icon-weight-xs: var(--db-base-icon-weight-functional-mobile-body-xs);
779
+ --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-functional-mobile-body-xs);
780
+ --db-type-body-sm: var(--db-typography-functional-mobile-body-sm);
781
+ --db-base-body-icon-weight-sm: var(--db-base-icon-weight-functional-mobile-body-sm);
782
+ --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-functional-mobile-body-sm);
783
+ --db-type-body-md: var(--db-typography-functional-mobile-body-md);
784
+ --db-base-body-icon-weight-md: var(--db-base-icon-weight-functional-mobile-body-md);
785
+ --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-functional-mobile-body-md);
786
+ --db-type-body-lg: var(--db-typography-functional-mobile-body-lg);
787
+ --db-base-body-icon-weight-lg: var(--db-base-icon-weight-functional-mobile-body-lg);
788
+ --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-functional-mobile-body-lg);
789
+ --db-type-body-xl: var(--db-typography-functional-mobile-body-xl);
790
+ --db-base-body-icon-weight-xl: var(--db-base-icon-weight-functional-mobile-body-xl);
791
+ --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-functional-mobile-body-xl);
792
+ --db-type-body-2xl: var(--db-typography-functional-mobile-body-2xl);
793
+ --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-functional-mobile-body-2xl);
794
+ --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-functional-mobile-body-2xl);
795
+ --db-type-body-3xl: var(--db-typography-functional-mobile-body-3xl);
796
+ --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-functional-mobile-body-3xl);
797
+ --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-functional-mobile-body-3xl);
946
798
  }
947
- @media (48em < width <= 64em) {
948
- .db-density-functional,
949
- [data-density=functional] {
950
- --db-type-body-3xs: var(--db-typography-functional-tablet-body-3xs);
951
- --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-functional-tablet-body-3xs);
952
- --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-functional-tablet-body-3xs);
953
- --db-type-body-2xs: var(--db-typography-functional-tablet-body-2xs);
954
- --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-functional-tablet-body-2xs);
955
- --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-functional-tablet-body-2xs);
956
- --db-type-body-xs: var(--db-typography-functional-tablet-body-xs);
957
- --db-base-body-icon-weight-xs: var(--db-base-icon-weight-functional-tablet-body-xs);
958
- --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-functional-tablet-body-xs);
959
- --db-type-body-sm: var(--db-typography-functional-tablet-body-sm);
960
- --db-base-body-icon-weight-sm: var(--db-base-icon-weight-functional-tablet-body-sm);
961
- --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-functional-tablet-body-sm);
962
- --db-type-body-md: var(--db-typography-functional-tablet-body-md);
963
- --db-base-body-icon-weight-md: var(--db-base-icon-weight-functional-tablet-body-md);
964
- --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-functional-tablet-body-md);
965
- --db-type-body-lg: var(--db-typography-functional-tablet-body-lg);
966
- --db-base-body-icon-weight-lg: var(--db-base-icon-weight-functional-tablet-body-lg);
967
- --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-functional-tablet-body-lg);
968
- --db-type-body-xl: var(--db-typography-functional-tablet-body-xl);
969
- --db-base-body-icon-weight-xl: var(--db-base-icon-weight-functional-tablet-body-xl);
970
- --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-functional-tablet-body-xl);
971
- --db-type-body-2xl: var(--db-typography-functional-tablet-body-2xl);
972
- --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-functional-tablet-body-2xl);
973
- --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-functional-tablet-body-2xl);
974
- --db-type-body-3xl: var(--db-typography-functional-tablet-body-3xl);
975
- --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-functional-tablet-body-3xl);
976
- --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-functional-tablet-body-3xl);
977
- }
799
+ }
800
+ @media (48em < width <= 64em) {
801
+ .db-density-functional,
802
+ [data-density=functional] {
803
+ --db-type-body-3xs: var(--db-typography-functional-tablet-body-3xs);
804
+ --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-functional-tablet-body-3xs);
805
+ --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-functional-tablet-body-3xs);
806
+ --db-type-body-2xs: var(--db-typography-functional-tablet-body-2xs);
807
+ --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-functional-tablet-body-2xs);
808
+ --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-functional-tablet-body-2xs);
809
+ --db-type-body-xs: var(--db-typography-functional-tablet-body-xs);
810
+ --db-base-body-icon-weight-xs: var(--db-base-icon-weight-functional-tablet-body-xs);
811
+ --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-functional-tablet-body-xs);
812
+ --db-type-body-sm: var(--db-typography-functional-tablet-body-sm);
813
+ --db-base-body-icon-weight-sm: var(--db-base-icon-weight-functional-tablet-body-sm);
814
+ --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-functional-tablet-body-sm);
815
+ --db-type-body-md: var(--db-typography-functional-tablet-body-md);
816
+ --db-base-body-icon-weight-md: var(--db-base-icon-weight-functional-tablet-body-md);
817
+ --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-functional-tablet-body-md);
818
+ --db-type-body-lg: var(--db-typography-functional-tablet-body-lg);
819
+ --db-base-body-icon-weight-lg: var(--db-base-icon-weight-functional-tablet-body-lg);
820
+ --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-functional-tablet-body-lg);
821
+ --db-type-body-xl: var(--db-typography-functional-tablet-body-xl);
822
+ --db-base-body-icon-weight-xl: var(--db-base-icon-weight-functional-tablet-body-xl);
823
+ --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-functional-tablet-body-xl);
824
+ --db-type-body-2xl: var(--db-typography-functional-tablet-body-2xl);
825
+ --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-functional-tablet-body-2xl);
826
+ --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-functional-tablet-body-2xl);
827
+ --db-type-body-3xl: var(--db-typography-functional-tablet-body-3xl);
828
+ --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-functional-tablet-body-3xl);
829
+ --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-functional-tablet-body-3xl);
978
830
  }
979
- @media (64em < width) {
980
- .db-density-functional,
981
- [data-density=functional] {
982
- --db-type-body-3xs: var(--db-typography-functional-desktop-body-3xs);
983
- --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-functional-desktop-body-3xs);
984
- --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-functional-desktop-body-3xs);
985
- --db-type-body-2xs: var(--db-typography-functional-desktop-body-2xs);
986
- --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-functional-desktop-body-2xs);
987
- --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-functional-desktop-body-2xs);
988
- --db-type-body-xs: var(--db-typography-functional-desktop-body-xs);
989
- --db-base-body-icon-weight-xs: var(--db-base-icon-weight-functional-desktop-body-xs);
990
- --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-functional-desktop-body-xs);
991
- --db-type-body-sm: var(--db-typography-functional-desktop-body-sm);
992
- --db-base-body-icon-weight-sm: var(--db-base-icon-weight-functional-desktop-body-sm);
993
- --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-functional-desktop-body-sm);
994
- --db-type-body-md: var(--db-typography-functional-desktop-body-md);
995
- --db-base-body-icon-weight-md: var(--db-base-icon-weight-functional-desktop-body-md);
996
- --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-functional-desktop-body-md);
997
- --db-type-body-lg: var(--db-typography-functional-desktop-body-lg);
998
- --db-base-body-icon-weight-lg: var(--db-base-icon-weight-functional-desktop-body-lg);
999
- --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-functional-desktop-body-lg);
1000
- --db-type-body-xl: var(--db-typography-functional-desktop-body-xl);
1001
- --db-base-body-icon-weight-xl: var(--db-base-icon-weight-functional-desktop-body-xl);
1002
- --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-functional-desktop-body-xl);
1003
- --db-type-body-2xl: var(--db-typography-functional-desktop-body-2xl);
1004
- --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-functional-desktop-body-2xl);
1005
- --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-functional-desktop-body-2xl);
1006
- --db-type-body-3xl: var(--db-typography-functional-desktop-body-3xl);
1007
- --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-functional-desktop-body-3xl);
1008
- --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-functional-desktop-body-3xl);
1009
- }
831
+ }
832
+ @media (64em < width) {
833
+ .db-density-functional,
834
+ [data-density=functional] {
835
+ --db-type-body-3xs: var(--db-typography-functional-desktop-body-3xs);
836
+ --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-functional-desktop-body-3xs);
837
+ --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-functional-desktop-body-3xs);
838
+ --db-type-body-2xs: var(--db-typography-functional-desktop-body-2xs);
839
+ --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-functional-desktop-body-2xs);
840
+ --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-functional-desktop-body-2xs);
841
+ --db-type-body-xs: var(--db-typography-functional-desktop-body-xs);
842
+ --db-base-body-icon-weight-xs: var(--db-base-icon-weight-functional-desktop-body-xs);
843
+ --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-functional-desktop-body-xs);
844
+ --db-type-body-sm: var(--db-typography-functional-desktop-body-sm);
845
+ --db-base-body-icon-weight-sm: var(--db-base-icon-weight-functional-desktop-body-sm);
846
+ --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-functional-desktop-body-sm);
847
+ --db-type-body-md: var(--db-typography-functional-desktop-body-md);
848
+ --db-base-body-icon-weight-md: var(--db-base-icon-weight-functional-desktop-body-md);
849
+ --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-functional-desktop-body-md);
850
+ --db-type-body-lg: var(--db-typography-functional-desktop-body-lg);
851
+ --db-base-body-icon-weight-lg: var(--db-base-icon-weight-functional-desktop-body-lg);
852
+ --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-functional-desktop-body-lg);
853
+ --db-type-body-xl: var(--db-typography-functional-desktop-body-xl);
854
+ --db-base-body-icon-weight-xl: var(--db-base-icon-weight-functional-desktop-body-xl);
855
+ --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-functional-desktop-body-xl);
856
+ --db-type-body-2xl: var(--db-typography-functional-desktop-body-2xl);
857
+ --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-functional-desktop-body-2xl);
858
+ --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-functional-desktop-body-2xl);
859
+ --db-type-body-3xl: var(--db-typography-functional-desktop-body-3xl);
860
+ --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-functional-desktop-body-3xl);
861
+ --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-functional-desktop-body-3xl);
1010
862
  }
1011
863
  }
1012
864