@seed-design/css 2.1.1 → 2.1.3

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 (33) hide show
  1. package/all.css +495 -511
  2. package/all.layered.css +495 -511
  3. package/all.layered.min.css +1 -1
  4. package/all.min.css +1 -1
  5. package/base.css +277 -277
  6. package/base.layered.css +277 -277
  7. package/base.layered.min.css +1 -1
  8. package/base.min.css +1 -1
  9. package/package.json +1 -1
  10. package/recipes/action-button.css +36 -36
  11. package/recipes/action-button.layered.css +36 -36
  12. package/recipes/bottom-sheet.css +39 -39
  13. package/recipes/bottom-sheet.layered.css +39 -39
  14. package/recipes/floating-action-button.css +2 -2
  15. package/recipes/floating-action-button.layered.css +2 -2
  16. package/recipes/help-bubble.css +10 -10
  17. package/recipes/help-bubble.layered.css +10 -10
  18. package/recipes/image-frame-reaction-button.css +1 -3
  19. package/recipes/image-frame-reaction-button.layered.css +1 -4
  20. package/recipes/list-item.css +36 -36
  21. package/recipes/list-item.layered.css +36 -36
  22. package/recipes/side-panel.css +74 -87
  23. package/recipes/side-panel.layered.css +74 -87
  24. package/recipes/skeleton.css +20 -20
  25. package/recipes/skeleton.layered.css +20 -20
  26. package/vars/component/floating-action-button.d.ts +1 -1
  27. package/vars/component/floating-action-button.mjs +1 -1
  28. package/vars/component/image-frame-reaction-button.d.ts +3 -2
  29. package/vars/component/image-frame-reaction-button.mjs +3 -2
  30. package/vars/component/side-panel-close-button.d.ts +6 -2
  31. package/vars/component/side-panel-close-button.mjs +6 -2
  32. package/vars/component/side-panel.d.ts +7 -4
  33. package/vars/component/side-panel.mjs +6 -4
package/all.layered.css CHANGED
@@ -107,157 +107,157 @@
107
107
  border-left-width: var(--seed-box-border-left-width);
108
108
  border-right-width: var(--seed-box-border-right-width);
109
109
  --seed-box-padding-base: 0;
110
- --seed-box-padding-sm: var(--seed-box-padding-base);
111
- --seed-box-padding-md: var(--seed-box-padding-sm);
112
- --seed-box-padding-lg: var(--seed-box-padding-md);
113
- --seed-box-padding-xl: var(--seed-box-padding-lg);
114
- --seed-box-padding: var(--seed-box-padding-base);
110
+ --seed-box-padding-sm: var(--seed-box-padding-base, initial);
111
+ --seed-box-padding-md: var(--seed-box-padding-sm, initial);
112
+ --seed-box-padding-lg: var(--seed-box-padding-md, initial);
113
+ --seed-box-padding-xl: var(--seed-box-padding-lg, initial);
114
+ --seed-box-padding: var(--seed-box-padding-base, initial);
115
115
  --seed-box-padding-y-base: var(--seed-box-padding);
116
- --seed-box-padding-y-sm: var(--seed-box-padding-y-base);
117
- --seed-box-padding-y-md: var(--seed-box-padding-y-sm);
118
- --seed-box-padding-y-lg: var(--seed-box-padding-y-md);
119
- --seed-box-padding-y-xl: var(--seed-box-padding-y-lg);
120
- --seed-box-padding-y: var(--seed-box-padding-y-base);
116
+ --seed-box-padding-y-sm: var(--seed-box-padding-y-base, initial);
117
+ --seed-box-padding-y-md: var(--seed-box-padding-y-sm, initial);
118
+ --seed-box-padding-y-lg: var(--seed-box-padding-y-md, initial);
119
+ --seed-box-padding-y-xl: var(--seed-box-padding-y-lg, initial);
120
+ --seed-box-padding-y: var(--seed-box-padding-y-base, initial);
121
121
  --seed-box-padding-x-base: var(--seed-box-padding);
122
- --seed-box-padding-x-sm: var(--seed-box-padding-x-base);
123
- --seed-box-padding-x-md: var(--seed-box-padding-x-sm);
124
- --seed-box-padding-x-lg: var(--seed-box-padding-x-md);
125
- --seed-box-padding-x-xl: var(--seed-box-padding-x-lg);
126
- --seed-box-padding-x: var(--seed-box-padding-x-base);
122
+ --seed-box-padding-x-sm: var(--seed-box-padding-x-base, initial);
123
+ --seed-box-padding-x-md: var(--seed-box-padding-x-sm, initial);
124
+ --seed-box-padding-x-lg: var(--seed-box-padding-x-md, initial);
125
+ --seed-box-padding-x-xl: var(--seed-box-padding-x-lg, initial);
126
+ --seed-box-padding-x: var(--seed-box-padding-x-base, initial);
127
127
  --seed-box-padding-bottom-base: var(--seed-box-padding-y);
128
- --seed-box-padding-bottom-sm: var(--seed-box-padding-bottom-base);
129
- --seed-box-padding-bottom-md: var(--seed-box-padding-bottom-sm);
130
- --seed-box-padding-bottom-lg: var(--seed-box-padding-bottom-md);
131
- --seed-box-padding-bottom-xl: var(--seed-box-padding-bottom-lg);
132
- --seed-box-padding-bottom: var(--seed-box-padding-bottom-base);
128
+ --seed-box-padding-bottom-sm: var(--seed-box-padding-bottom-base, initial);
129
+ --seed-box-padding-bottom-md: var(--seed-box-padding-bottom-sm, initial);
130
+ --seed-box-padding-bottom-lg: var(--seed-box-padding-bottom-md, initial);
131
+ --seed-box-padding-bottom-xl: var(--seed-box-padding-bottom-lg, initial);
132
+ --seed-box-padding-bottom: var(--seed-box-padding-bottom-base, initial);
133
133
  --seed-box-padding-top-base: var(--seed-box-padding-y);
134
- --seed-box-padding-top-sm: var(--seed-box-padding-top-base);
135
- --seed-box-padding-top-md: var(--seed-box-padding-top-sm);
136
- --seed-box-padding-top-lg: var(--seed-box-padding-top-md);
137
- --seed-box-padding-top-xl: var(--seed-box-padding-top-lg);
138
- --seed-box-padding-top: var(--seed-box-padding-top-base);
134
+ --seed-box-padding-top-sm: var(--seed-box-padding-top-base, initial);
135
+ --seed-box-padding-top-md: var(--seed-box-padding-top-sm, initial);
136
+ --seed-box-padding-top-lg: var(--seed-box-padding-top-md, initial);
137
+ --seed-box-padding-top-xl: var(--seed-box-padding-top-lg, initial);
138
+ --seed-box-padding-top: var(--seed-box-padding-top-base, initial);
139
139
  --seed-box-padding-left-base: var(--seed-box-padding-x);
140
- --seed-box-padding-left-sm: var(--seed-box-padding-left-base);
141
- --seed-box-padding-left-md: var(--seed-box-padding-left-sm);
142
- --seed-box-padding-left-lg: var(--seed-box-padding-left-md);
143
- --seed-box-padding-left-xl: var(--seed-box-padding-left-lg);
144
- --seed-box-padding-left: var(--seed-box-padding-left-base);
140
+ --seed-box-padding-left-sm: var(--seed-box-padding-left-base, initial);
141
+ --seed-box-padding-left-md: var(--seed-box-padding-left-sm, initial);
142
+ --seed-box-padding-left-lg: var(--seed-box-padding-left-md, initial);
143
+ --seed-box-padding-left-xl: var(--seed-box-padding-left-lg, initial);
144
+ --seed-box-padding-left: var(--seed-box-padding-left-base, initial);
145
145
  --seed-box-padding-right-base: var(--seed-box-padding-x);
146
- --seed-box-padding-right-sm: var(--seed-box-padding-right-base);
147
- --seed-box-padding-right-md: var(--seed-box-padding-right-sm);
148
- --seed-box-padding-right-lg: var(--seed-box-padding-right-md);
149
- --seed-box-padding-right-xl: var(--seed-box-padding-right-lg);
150
- --seed-box-padding-right: var(--seed-box-padding-right-base);
146
+ --seed-box-padding-right-sm: var(--seed-box-padding-right-base, initial);
147
+ --seed-box-padding-right-md: var(--seed-box-padding-right-sm, initial);
148
+ --seed-box-padding-right-lg: var(--seed-box-padding-right-md, initial);
149
+ --seed-box-padding-right-xl: var(--seed-box-padding-right-lg, initial);
150
+ --seed-box-padding-right: var(--seed-box-padding-right-base, initial);
151
151
  padding-top: var(--seed-box-padding-top);
152
152
  padding-bottom: var(--seed-box-padding-bottom);
153
153
  padding-left: var(--seed-box-padding-left);
154
154
  padding-right: var(--seed-box-padding-right);
155
155
  --seed-box-bleed-bottom-base: 0px;
156
- --seed-box-bleed-bottom-sm: var(--seed-box-bleed-bottom-base);
157
- --seed-box-bleed-bottom-md: var(--seed-box-bleed-bottom-sm);
158
- --seed-box-bleed-bottom-lg: var(--seed-box-bleed-bottom-md);
159
- --seed-box-bleed-bottom-xl: var(--seed-box-bleed-bottom-lg);
160
- --seed-box-bleed-bottom: var(--seed-box-bleed-bottom-base);
156
+ --seed-box-bleed-bottom-sm: var(--seed-box-bleed-bottom-base, initial);
157
+ --seed-box-bleed-bottom-md: var(--seed-box-bleed-bottom-sm, initial);
158
+ --seed-box-bleed-bottom-lg: var(--seed-box-bleed-bottom-md, initial);
159
+ --seed-box-bleed-bottom-xl: var(--seed-box-bleed-bottom-lg, initial);
160
+ --seed-box-bleed-bottom: var(--seed-box-bleed-bottom-base, initial);
161
161
  --seed-box-bleed-top-base: 0px;
162
- --seed-box-bleed-top-sm: var(--seed-box-bleed-top-base);
163
- --seed-box-bleed-top-md: var(--seed-box-bleed-top-sm);
164
- --seed-box-bleed-top-lg: var(--seed-box-bleed-top-md);
165
- --seed-box-bleed-top-xl: var(--seed-box-bleed-top-lg);
166
- --seed-box-bleed-top: var(--seed-box-bleed-top-base);
162
+ --seed-box-bleed-top-sm: var(--seed-box-bleed-top-base, initial);
163
+ --seed-box-bleed-top-md: var(--seed-box-bleed-top-sm, initial);
164
+ --seed-box-bleed-top-lg: var(--seed-box-bleed-top-md, initial);
165
+ --seed-box-bleed-top-xl: var(--seed-box-bleed-top-lg, initial);
166
+ --seed-box-bleed-top: var(--seed-box-bleed-top-base, initial);
167
167
  --seed-box-bleed-left-base: 0px;
168
- --seed-box-bleed-left-sm: var(--seed-box-bleed-left-base);
169
- --seed-box-bleed-left-md: var(--seed-box-bleed-left-sm);
170
- --seed-box-bleed-left-lg: var(--seed-box-bleed-left-md);
171
- --seed-box-bleed-left-xl: var(--seed-box-bleed-left-lg);
172
- --seed-box-bleed-left: var(--seed-box-bleed-left-base);
168
+ --seed-box-bleed-left-sm: var(--seed-box-bleed-left-base, initial);
169
+ --seed-box-bleed-left-md: var(--seed-box-bleed-left-sm, initial);
170
+ --seed-box-bleed-left-lg: var(--seed-box-bleed-left-md, initial);
171
+ --seed-box-bleed-left-xl: var(--seed-box-bleed-left-lg, initial);
172
+ --seed-box-bleed-left: var(--seed-box-bleed-left-base, initial);
173
173
  --seed-box-bleed-right-base: 0px;
174
- --seed-box-bleed-right-sm: var(--seed-box-bleed-right-base);
175
- --seed-box-bleed-right-md: var(--seed-box-bleed-right-sm);
176
- --seed-box-bleed-right-lg: var(--seed-box-bleed-right-md);
177
- --seed-box-bleed-right-xl: var(--seed-box-bleed-right-lg);
178
- --seed-box-bleed-right: var(--seed-box-bleed-right-base);
174
+ --seed-box-bleed-right-sm: var(--seed-box-bleed-right-base, initial);
175
+ --seed-box-bleed-right-md: var(--seed-box-bleed-right-sm, initial);
176
+ --seed-box-bleed-right-lg: var(--seed-box-bleed-right-md, initial);
177
+ --seed-box-bleed-right-xl: var(--seed-box-bleed-right-lg, initial);
178
+ --seed-box-bleed-right: var(--seed-box-bleed-right-base, initial);
179
179
  --seed-box-margin-base: initial;
180
- --seed-box-margin-sm: var(--seed-box-margin-base);
181
- --seed-box-margin-md: var(--seed-box-margin-sm);
182
- --seed-box-margin-lg: var(--seed-box-margin-md);
183
- --seed-box-margin-xl: var(--seed-box-margin-lg);
184
- --seed-box-margin: var(--seed-box-margin-base);
185
- --seed-box-margin-y-base: var(--seed-box-margin);
186
- --seed-box-margin-y-sm: var(--seed-box-margin-y-base);
187
- --seed-box-margin-y-md: var(--seed-box-margin-y-sm);
188
- --seed-box-margin-y-lg: var(--seed-box-margin-y-md);
189
- --seed-box-margin-y-xl: var(--seed-box-margin-y-lg);
190
- --seed-box-margin-y: var(--seed-box-margin-y-base);
191
- --seed-box-margin-x-base: var(--seed-box-margin);
192
- --seed-box-margin-x-sm: var(--seed-box-margin-x-base);
193
- --seed-box-margin-x-md: var(--seed-box-margin-x-sm);
194
- --seed-box-margin-x-lg: var(--seed-box-margin-x-md);
195
- --seed-box-margin-x-xl: var(--seed-box-margin-x-lg);
196
- --seed-box-margin-x: var(--seed-box-margin-x-base);
197
- --seed-box-margin-top-base: var(--seed-box-margin-y);
198
- --seed-box-margin-top-sm: var(--seed-box-margin-top-base);
199
- --seed-box-margin-top-md: var(--seed-box-margin-top-sm);
200
- --seed-box-margin-top-lg: var(--seed-box-margin-top-md);
201
- --seed-box-margin-top-xl: var(--seed-box-margin-top-lg);
202
- --seed-box-margin-top: var(--seed-box-margin-top-base);
203
- --seed-box-margin-bottom-base: var(--seed-box-margin-y);
204
- --seed-box-margin-bottom-sm: var(--seed-box-margin-bottom-base);
205
- --seed-box-margin-bottom-md: var(--seed-box-margin-bottom-sm);
206
- --seed-box-margin-bottom-lg: var(--seed-box-margin-bottom-md);
207
- --seed-box-margin-bottom-xl: var(--seed-box-margin-bottom-lg);
208
- --seed-box-margin-bottom: var(--seed-box-margin-bottom-base);
209
- --seed-box-margin-left-base: var(--seed-box-margin-x);
210
- --seed-box-margin-left-sm: var(--seed-box-margin-left-base);
211
- --seed-box-margin-left-md: var(--seed-box-margin-left-sm);
212
- --seed-box-margin-left-lg: var(--seed-box-margin-left-md);
213
- --seed-box-margin-left-xl: var(--seed-box-margin-left-lg);
214
- --seed-box-margin-left: var(--seed-box-margin-left-base);
215
- --seed-box-margin-right-base: var(--seed-box-margin-x);
216
- --seed-box-margin-right-sm: var(--seed-box-margin-right-base);
217
- --seed-box-margin-right-md: var(--seed-box-margin-right-sm);
218
- --seed-box-margin-right-lg: var(--seed-box-margin-right-md);
219
- --seed-box-margin-right-xl: var(--seed-box-margin-right-lg);
220
- --seed-box-margin-right: var(--seed-box-margin-right-base);
180
+ --seed-box-margin-sm: var(--seed-box-margin-base, initial);
181
+ --seed-box-margin-md: var(--seed-box-margin-sm, initial);
182
+ --seed-box-margin-lg: var(--seed-box-margin-md, initial);
183
+ --seed-box-margin-xl: var(--seed-box-margin-lg, initial);
184
+ --seed-box-margin: var(--seed-box-margin-base, initial);
185
+ --seed-box-margin-y-base: var(--seed-box-margin, initial);
186
+ --seed-box-margin-y-sm: var(--seed-box-margin-y-base, initial);
187
+ --seed-box-margin-y-md: var(--seed-box-margin-y-sm, initial);
188
+ --seed-box-margin-y-lg: var(--seed-box-margin-y-md, initial);
189
+ --seed-box-margin-y-xl: var(--seed-box-margin-y-lg, initial);
190
+ --seed-box-margin-y: var(--seed-box-margin-y-base, initial);
191
+ --seed-box-margin-x-base: var(--seed-box-margin, initial);
192
+ --seed-box-margin-x-sm: var(--seed-box-margin-x-base, initial);
193
+ --seed-box-margin-x-md: var(--seed-box-margin-x-sm, initial);
194
+ --seed-box-margin-x-lg: var(--seed-box-margin-x-md, initial);
195
+ --seed-box-margin-x-xl: var(--seed-box-margin-x-lg, initial);
196
+ --seed-box-margin-x: var(--seed-box-margin-x-base, initial);
197
+ --seed-box-margin-top-base: var(--seed-box-margin-y, initial);
198
+ --seed-box-margin-top-sm: var(--seed-box-margin-top-base, initial);
199
+ --seed-box-margin-top-md: var(--seed-box-margin-top-sm, initial);
200
+ --seed-box-margin-top-lg: var(--seed-box-margin-top-md, initial);
201
+ --seed-box-margin-top-xl: var(--seed-box-margin-top-lg, initial);
202
+ --seed-box-margin-top: var(--seed-box-margin-top-base, initial);
203
+ --seed-box-margin-bottom-base: var(--seed-box-margin-y, initial);
204
+ --seed-box-margin-bottom-sm: var(--seed-box-margin-bottom-base, initial);
205
+ --seed-box-margin-bottom-md: var(--seed-box-margin-bottom-sm, initial);
206
+ --seed-box-margin-bottom-lg: var(--seed-box-margin-bottom-md, initial);
207
+ --seed-box-margin-bottom-xl: var(--seed-box-margin-bottom-lg, initial);
208
+ --seed-box-margin-bottom: var(--seed-box-margin-bottom-base, initial);
209
+ --seed-box-margin-left-base: var(--seed-box-margin-x, initial);
210
+ --seed-box-margin-left-sm: var(--seed-box-margin-left-base, initial);
211
+ --seed-box-margin-left-md: var(--seed-box-margin-left-sm, initial);
212
+ --seed-box-margin-left-lg: var(--seed-box-margin-left-md, initial);
213
+ --seed-box-margin-left-xl: var(--seed-box-margin-left-lg, initial);
214
+ --seed-box-margin-left: var(--seed-box-margin-left-base, initial);
215
+ --seed-box-margin-right-base: var(--seed-box-margin-x, initial);
216
+ --seed-box-margin-right-sm: var(--seed-box-margin-right-base, initial);
217
+ --seed-box-margin-right-md: var(--seed-box-margin-right-sm, initial);
218
+ --seed-box-margin-right-lg: var(--seed-box-margin-right-md, initial);
219
+ --seed-box-margin-right-xl: var(--seed-box-margin-right-lg, initial);
220
+ --seed-box-margin-right: var(--seed-box-margin-right-base, initial);
221
221
  margin-top: var(--seed-box-margin-top, calc(var(--seed-box-bleed-top) * -1));
222
222
  margin-bottom: var(--seed-box-margin-bottom, calc(var(--seed-box-bleed-bottom) * -1));
223
223
  margin-left: var(--seed-box-margin-left, calc(var(--seed-box-bleed-left) * -1));
224
224
  margin-right: var(--seed-box-margin-right, calc(var(--seed-box-bleed-right) * -1));
225
- --seed-box-min-height-base: initial;
226
- --seed-box-min-height-sm: var(--seed-box-min-height-base);
227
- --seed-box-min-height-md: var(--seed-box-min-height-sm);
228
- --seed-box-min-height-lg: var(--seed-box-min-height-md);
229
- --seed-box-min-height-xl: var(--seed-box-min-height-lg);
230
- --seed-box-min-height: var(--seed-box-min-height-base);
231
- --seed-box-max-height-base: initial;
232
- --seed-box-max-height-sm: var(--seed-box-max-height-base);
233
- --seed-box-max-height-md: var(--seed-box-max-height-sm);
234
- --seed-box-max-height-lg: var(--seed-box-max-height-md);
235
- --seed-box-max-height-xl: var(--seed-box-max-height-lg);
236
- --seed-box-max-height: var(--seed-box-max-height-base);
237
- --seed-box-height-base: initial;
238
- --seed-box-height-sm: var(--seed-box-height-base);
239
- --seed-box-height-md: var(--seed-box-height-sm);
240
- --seed-box-height-lg: var(--seed-box-height-md);
241
- --seed-box-height-xl: var(--seed-box-height-lg);
242
- --seed-box-height: var(--seed-box-height-base);
243
- --seed-box-min-width-base: initial;
244
- --seed-box-min-width-sm: var(--seed-box-min-width-base);
245
- --seed-box-min-width-md: var(--seed-box-min-width-sm);
246
- --seed-box-min-width-lg: var(--seed-box-min-width-md);
247
- --seed-box-min-width-xl: var(--seed-box-min-width-lg);
248
- --seed-box-min-width: var(--seed-box-min-width-base);
249
- --seed-box-max-width-base: initial;
250
- --seed-box-max-width-sm: var(--seed-box-max-width-base);
251
- --seed-box-max-width-md: var(--seed-box-max-width-sm);
252
- --seed-box-max-width-lg: var(--seed-box-max-width-md);
253
- --seed-box-max-width-xl: var(--seed-box-max-width-lg);
254
- --seed-box-max-width: var(--seed-box-max-width-base);
255
- --seed-box-width-base: initial;
256
- --seed-box-width-sm: var(--seed-box-width-base);
257
- --seed-box-width-md: var(--seed-box-width-sm);
258
- --seed-box-width-lg: var(--seed-box-width-md);
259
- --seed-box-width-xl: var(--seed-box-width-lg);
260
- --seed-box-width: var(--seed-box-width-base);
225
+ --seed-box-min-height-base: auto;
226
+ --seed-box-min-height-sm: var(--seed-box-min-height-base, initial);
227
+ --seed-box-min-height-md: var(--seed-box-min-height-sm, initial);
228
+ --seed-box-min-height-lg: var(--seed-box-min-height-md, initial);
229
+ --seed-box-min-height-xl: var(--seed-box-min-height-lg, initial);
230
+ --seed-box-min-height: var(--seed-box-min-height-base, initial);
231
+ --seed-box-max-height-base: none;
232
+ --seed-box-max-height-sm: var(--seed-box-max-height-base, initial);
233
+ --seed-box-max-height-md: var(--seed-box-max-height-sm, initial);
234
+ --seed-box-max-height-lg: var(--seed-box-max-height-md, initial);
235
+ --seed-box-max-height-xl: var(--seed-box-max-height-lg, initial);
236
+ --seed-box-max-height: var(--seed-box-max-height-base, initial);
237
+ --seed-box-height-base: auto;
238
+ --seed-box-height-sm: var(--seed-box-height-base, initial);
239
+ --seed-box-height-md: var(--seed-box-height-sm, initial);
240
+ --seed-box-height-lg: var(--seed-box-height-md, initial);
241
+ --seed-box-height-xl: var(--seed-box-height-lg, initial);
242
+ --seed-box-height: var(--seed-box-height-base, initial);
243
+ --seed-box-min-width-base: auto;
244
+ --seed-box-min-width-sm: var(--seed-box-min-width-base, initial);
245
+ --seed-box-min-width-md: var(--seed-box-min-width-sm, initial);
246
+ --seed-box-min-width-lg: var(--seed-box-min-width-md, initial);
247
+ --seed-box-min-width-xl: var(--seed-box-min-width-lg, initial);
248
+ --seed-box-min-width: var(--seed-box-min-width-base, initial);
249
+ --seed-box-max-width-base: none;
250
+ --seed-box-max-width-sm: var(--seed-box-max-width-base, initial);
251
+ --seed-box-max-width-md: var(--seed-box-max-width-sm, initial);
252
+ --seed-box-max-width-lg: var(--seed-box-max-width-md, initial);
253
+ --seed-box-max-width-xl: var(--seed-box-max-width-lg, initial);
254
+ --seed-box-max-width: var(--seed-box-max-width-base, initial);
255
+ --seed-box-width-base: auto;
256
+ --seed-box-width-sm: var(--seed-box-width-base, initial);
257
+ --seed-box-width-md: var(--seed-box-width-sm, initial);
258
+ --seed-box-width-lg: var(--seed-box-width-md, initial);
259
+ --seed-box-width-xl: var(--seed-box-width-lg, initial);
260
+ --seed-box-width: var(--seed-box-width-base, initial);
261
261
  min-height: var(--seed-box-min-height);
262
262
  max-height: var(--seed-box-max-height);
263
263
  height: var(--seed-box-height);
@@ -284,11 +284,11 @@
284
284
  --seed-box-box-shadow: initial;
285
285
  box-shadow: var(--seed-box-box-shadow);
286
286
  --seed-box-display-base: block;
287
- --seed-box-display-sm: var(--seed-box-display-base);
288
- --seed-box-display-md: var(--seed-box-display-sm);
289
- --seed-box-display-lg: var(--seed-box-display-md);
290
- --seed-box-display-xl: var(--seed-box-display-lg);
291
- --seed-box-display: var(--seed-box-display-base);
287
+ --seed-box-display-sm: var(--seed-box-display-base, initial);
288
+ --seed-box-display-md: var(--seed-box-display-sm, initial);
289
+ --seed-box-display-lg: var(--seed-box-display-md, initial);
290
+ --seed-box-display-xl: var(--seed-box-display-lg, initial);
291
+ --seed-box-display: var(--seed-box-display-base, initial);
292
292
  --seed-box-position: initial;
293
293
  display: var(--seed-box-display);
294
294
  position: var(--seed-box-position);
@@ -304,24 +304,24 @@
304
304
  --seed-box-flex-shrink: initial;
305
305
  flex-grow: var(--seed-box-flex-grow);
306
306
  flex-shrink: var(--seed-box-flex-shrink);
307
- --seed-box-flex-direction-base: initial;
308
- --seed-box-flex-direction-sm: var(--seed-box-flex-direction-base);
309
- --seed-box-flex-direction-md: var(--seed-box-flex-direction-sm);
310
- --seed-box-flex-direction-lg: var(--seed-box-flex-direction-md);
311
- --seed-box-flex-direction-xl: var(--seed-box-flex-direction-lg);
312
- --seed-box-flex-direction: var(--seed-box-flex-direction-base);
307
+ --seed-box-flex-direction-base: row;
308
+ --seed-box-flex-direction-sm: var(--seed-box-flex-direction-base, initial);
309
+ --seed-box-flex-direction-md: var(--seed-box-flex-direction-sm, initial);
310
+ --seed-box-flex-direction-lg: var(--seed-box-flex-direction-md, initial);
311
+ --seed-box-flex-direction-xl: var(--seed-box-flex-direction-lg, initial);
312
+ --seed-box-flex-direction: var(--seed-box-flex-direction-base, initial);
313
313
  --seed-box-flex-wrap: initial;
314
314
  --seed-box-justify-content: initial;
315
315
  --seed-box-justify-self: auto;
316
316
  --seed-box-align-items: stretch;
317
317
  --seed-box-align-content: stretch;
318
318
  --seed-box-align-self: auto;
319
- --seed-box-gap-base: initial;
320
- --seed-box-gap-sm: var(--seed-box-gap-base);
321
- --seed-box-gap-md: var(--seed-box-gap-sm);
322
- --seed-box-gap-lg: var(--seed-box-gap-md);
323
- --seed-box-gap-xl: var(--seed-box-gap-lg);
324
- --seed-box-gap: var(--seed-box-gap-base);
319
+ --seed-box-gap-base: 0px;
320
+ --seed-box-gap-sm: var(--seed-box-gap-base, initial);
321
+ --seed-box-gap-md: var(--seed-box-gap-sm, initial);
322
+ --seed-box-gap-lg: var(--seed-box-gap-md, initial);
323
+ --seed-box-gap-xl: var(--seed-box-gap-lg, initial);
324
+ --seed-box-gap: var(--seed-box-gap-base, initial);
325
325
  flex-direction: var(--seed-box-flex-direction);
326
326
  flex-wrap: var(--seed-box-flex-wrap);
327
327
  justify-content: var(--seed-box-justify-content);
@@ -341,19 +341,19 @@
341
341
  }
342
342
 
343
343
  .seed-grid {
344
- --seed-grid-columns-base: initial;
345
- --seed-grid-columns-sm: var(--seed-grid-columns-base);
346
- --seed-grid-columns-md: var(--seed-grid-columns-sm);
347
- --seed-grid-columns-lg: var(--seed-grid-columns-md);
348
- --seed-grid-columns-xl: var(--seed-grid-columns-lg);
349
- --seed-grid-columns: var(--seed-grid-columns-base);
344
+ --seed-grid-columns-base: none;
345
+ --seed-grid-columns-sm: var(--seed-grid-columns-base, initial);
346
+ --seed-grid-columns-md: var(--seed-grid-columns-sm, initial);
347
+ --seed-grid-columns-lg: var(--seed-grid-columns-md, initial);
348
+ --seed-grid-columns-xl: var(--seed-grid-columns-lg, initial);
349
+ --seed-grid-columns: var(--seed-grid-columns-base, initial);
350
350
  grid-template-columns: var(--seed-grid-columns);
351
- --seed-grid-rows-base: initial;
352
- --seed-grid-rows-sm: var(--seed-grid-rows-base);
353
- --seed-grid-rows-md: var(--seed-grid-rows-sm);
354
- --seed-grid-rows-lg: var(--seed-grid-rows-md);
355
- --seed-grid-rows-xl: var(--seed-grid-rows-lg);
356
- --seed-grid-rows: var(--seed-grid-rows-base);
351
+ --seed-grid-rows-base: none;
352
+ --seed-grid-rows-sm: var(--seed-grid-rows-base, initial);
353
+ --seed-grid-rows-md: var(--seed-grid-rows-sm, initial);
354
+ --seed-grid-rows-lg: var(--seed-grid-rows-md, initial);
355
+ --seed-grid-rows-xl: var(--seed-grid-rows-lg, initial);
356
+ --seed-grid-rows: var(--seed-grid-rows-base, initial);
357
357
  grid-template-rows: var(--seed-grid-rows);
358
358
  --seed-grid-auto-flow: initial;
359
359
  grid-auto-flow: var(--seed-grid-auto-flow);
@@ -1030,149 +1030,149 @@
1030
1030
 
1031
1031
  @media (width >= 480px) {
1032
1032
  .seed-box {
1033
- --seed-box-padding: var(--seed-box-padding-sm);
1034
- --seed-box-padding-y: var(--seed-box-padding-y-sm);
1035
- --seed-box-padding-x: var(--seed-box-padding-x-sm);
1036
- --seed-box-padding-bottom: var(--seed-box-padding-bottom-sm);
1037
- --seed-box-padding-top: var(--seed-box-padding-top-sm);
1038
- --seed-box-padding-left: var(--seed-box-padding-left-sm);
1039
- --seed-box-padding-right: var(--seed-box-padding-right-sm);
1040
- --seed-box-bleed-bottom: var(--seed-box-bleed-bottom-sm);
1041
- --seed-box-bleed-top: var(--seed-box-bleed-top-sm);
1042
- --seed-box-bleed-left: var(--seed-box-bleed-left-sm);
1043
- --seed-box-bleed-right: var(--seed-box-bleed-right-sm);
1044
- --seed-box-margin: var(--seed-box-margin-sm);
1045
- --seed-box-margin-y: var(--seed-box-margin-y-sm);
1046
- --seed-box-margin-x: var(--seed-box-margin-x-sm);
1047
- --seed-box-margin-top: var(--seed-box-margin-top-sm);
1048
- --seed-box-margin-bottom: var(--seed-box-margin-bottom-sm);
1049
- --seed-box-margin-left: var(--seed-box-margin-left-sm);
1050
- --seed-box-margin-right: var(--seed-box-margin-right-sm);
1051
- --seed-box-min-height: var(--seed-box-min-height-sm);
1052
- --seed-box-max-height: var(--seed-box-max-height-sm);
1053
- --seed-box-height: var(--seed-box-height-sm);
1054
- --seed-box-min-width: var(--seed-box-min-width-sm);
1055
- --seed-box-max-width: var(--seed-box-max-width-sm);
1056
- --seed-box-width: var(--seed-box-width-sm);
1057
- --seed-box-display: var(--seed-box-display-sm);
1058
- --seed-box-flex-direction: var(--seed-box-flex-direction-sm);
1059
- --seed-box-gap: var(--seed-box-gap-sm);
1033
+ --seed-box-padding: var(--seed-box-padding-sm, initial);
1034
+ --seed-box-padding-y: var(--seed-box-padding-y-sm, initial);
1035
+ --seed-box-padding-x: var(--seed-box-padding-x-sm, initial);
1036
+ --seed-box-padding-bottom: var(--seed-box-padding-bottom-sm, initial);
1037
+ --seed-box-padding-top: var(--seed-box-padding-top-sm, initial);
1038
+ --seed-box-padding-left: var(--seed-box-padding-left-sm, initial);
1039
+ --seed-box-padding-right: var(--seed-box-padding-right-sm, initial);
1040
+ --seed-box-bleed-bottom: var(--seed-box-bleed-bottom-sm, initial);
1041
+ --seed-box-bleed-top: var(--seed-box-bleed-top-sm, initial);
1042
+ --seed-box-bleed-left: var(--seed-box-bleed-left-sm, initial);
1043
+ --seed-box-bleed-right: var(--seed-box-bleed-right-sm, initial);
1044
+ --seed-box-margin: var(--seed-box-margin-sm, initial);
1045
+ --seed-box-margin-y: var(--seed-box-margin-y-sm, initial);
1046
+ --seed-box-margin-x: var(--seed-box-margin-x-sm, initial);
1047
+ --seed-box-margin-top: var(--seed-box-margin-top-sm, initial);
1048
+ --seed-box-margin-bottom: var(--seed-box-margin-bottom-sm, initial);
1049
+ --seed-box-margin-left: var(--seed-box-margin-left-sm, initial);
1050
+ --seed-box-margin-right: var(--seed-box-margin-right-sm, initial);
1051
+ --seed-box-min-height: var(--seed-box-min-height-sm, initial);
1052
+ --seed-box-max-height: var(--seed-box-max-height-sm, initial);
1053
+ --seed-box-height: var(--seed-box-height-sm, initial);
1054
+ --seed-box-min-width: var(--seed-box-min-width-sm, initial);
1055
+ --seed-box-max-width: var(--seed-box-max-width-sm, initial);
1056
+ --seed-box-width: var(--seed-box-width-sm, initial);
1057
+ --seed-box-display: var(--seed-box-display-sm, initial);
1058
+ --seed-box-flex-direction: var(--seed-box-flex-direction-sm, initial);
1059
+ --seed-box-gap: var(--seed-box-gap-sm, initial);
1060
1060
  }
1061
1061
 
1062
1062
  .seed-grid {
1063
- --seed-grid-columns: var(--seed-grid-columns-sm);
1064
- --seed-grid-rows: var(--seed-grid-rows-sm);
1063
+ --seed-grid-columns: var(--seed-grid-columns-sm, initial);
1064
+ --seed-grid-rows: var(--seed-grid-rows-sm, initial);
1065
1065
  }
1066
1066
  }
1067
1067
 
1068
1068
  @media (width >= 768px) {
1069
1069
  .seed-box {
1070
- --seed-box-padding: var(--seed-box-padding-md);
1071
- --seed-box-padding-y: var(--seed-box-padding-y-md);
1072
- --seed-box-padding-x: var(--seed-box-padding-x-md);
1073
- --seed-box-padding-bottom: var(--seed-box-padding-bottom-md);
1074
- --seed-box-padding-top: var(--seed-box-padding-top-md);
1075
- --seed-box-padding-left: var(--seed-box-padding-left-md);
1076
- --seed-box-padding-right: var(--seed-box-padding-right-md);
1077
- --seed-box-bleed-bottom: var(--seed-box-bleed-bottom-md);
1078
- --seed-box-bleed-top: var(--seed-box-bleed-top-md);
1079
- --seed-box-bleed-left: var(--seed-box-bleed-left-md);
1080
- --seed-box-bleed-right: var(--seed-box-bleed-right-md);
1081
- --seed-box-margin: var(--seed-box-margin-md);
1082
- --seed-box-margin-y: var(--seed-box-margin-y-md);
1083
- --seed-box-margin-x: var(--seed-box-margin-x-md);
1084
- --seed-box-margin-top: var(--seed-box-margin-top-md);
1085
- --seed-box-margin-bottom: var(--seed-box-margin-bottom-md);
1086
- --seed-box-margin-left: var(--seed-box-margin-left-md);
1087
- --seed-box-margin-right: var(--seed-box-margin-right-md);
1088
- --seed-box-min-height: var(--seed-box-min-height-md);
1089
- --seed-box-max-height: var(--seed-box-max-height-md);
1090
- --seed-box-height: var(--seed-box-height-md);
1091
- --seed-box-min-width: var(--seed-box-min-width-md);
1092
- --seed-box-max-width: var(--seed-box-max-width-md);
1093
- --seed-box-width: var(--seed-box-width-md);
1094
- --seed-box-display: var(--seed-box-display-md);
1095
- --seed-box-flex-direction: var(--seed-box-flex-direction-md);
1096
- --seed-box-gap: var(--seed-box-gap-md);
1070
+ --seed-box-padding: var(--seed-box-padding-md, initial);
1071
+ --seed-box-padding-y: var(--seed-box-padding-y-md, initial);
1072
+ --seed-box-padding-x: var(--seed-box-padding-x-md, initial);
1073
+ --seed-box-padding-bottom: var(--seed-box-padding-bottom-md, initial);
1074
+ --seed-box-padding-top: var(--seed-box-padding-top-md, initial);
1075
+ --seed-box-padding-left: var(--seed-box-padding-left-md, initial);
1076
+ --seed-box-padding-right: var(--seed-box-padding-right-md, initial);
1077
+ --seed-box-bleed-bottom: var(--seed-box-bleed-bottom-md, initial);
1078
+ --seed-box-bleed-top: var(--seed-box-bleed-top-md, initial);
1079
+ --seed-box-bleed-left: var(--seed-box-bleed-left-md, initial);
1080
+ --seed-box-bleed-right: var(--seed-box-bleed-right-md, initial);
1081
+ --seed-box-margin: var(--seed-box-margin-md, initial);
1082
+ --seed-box-margin-y: var(--seed-box-margin-y-md, initial);
1083
+ --seed-box-margin-x: var(--seed-box-margin-x-md, initial);
1084
+ --seed-box-margin-top: var(--seed-box-margin-top-md, initial);
1085
+ --seed-box-margin-bottom: var(--seed-box-margin-bottom-md, initial);
1086
+ --seed-box-margin-left: var(--seed-box-margin-left-md, initial);
1087
+ --seed-box-margin-right: var(--seed-box-margin-right-md, initial);
1088
+ --seed-box-min-height: var(--seed-box-min-height-md, initial);
1089
+ --seed-box-max-height: var(--seed-box-max-height-md, initial);
1090
+ --seed-box-height: var(--seed-box-height-md, initial);
1091
+ --seed-box-min-width: var(--seed-box-min-width-md, initial);
1092
+ --seed-box-max-width: var(--seed-box-max-width-md, initial);
1093
+ --seed-box-width: var(--seed-box-width-md, initial);
1094
+ --seed-box-display: var(--seed-box-display-md, initial);
1095
+ --seed-box-flex-direction: var(--seed-box-flex-direction-md, initial);
1096
+ --seed-box-gap: var(--seed-box-gap-md, initial);
1097
1097
  }
1098
1098
 
1099
1099
  .seed-grid {
1100
- --seed-grid-columns: var(--seed-grid-columns-md);
1101
- --seed-grid-rows: var(--seed-grid-rows-md);
1100
+ --seed-grid-columns: var(--seed-grid-columns-md, initial);
1101
+ --seed-grid-rows: var(--seed-grid-rows-md, initial);
1102
1102
  }
1103
1103
  }
1104
1104
 
1105
1105
  @media (width >= 1280px) {
1106
1106
  .seed-box {
1107
- --seed-box-padding: var(--seed-box-padding-lg);
1108
- --seed-box-padding-y: var(--seed-box-padding-y-lg);
1109
- --seed-box-padding-x: var(--seed-box-padding-x-lg);
1110
- --seed-box-padding-bottom: var(--seed-box-padding-bottom-lg);
1111
- --seed-box-padding-top: var(--seed-box-padding-top-lg);
1112
- --seed-box-padding-left: var(--seed-box-padding-left-lg);
1113
- --seed-box-padding-right: var(--seed-box-padding-right-lg);
1114
- --seed-box-bleed-bottom: var(--seed-box-bleed-bottom-lg);
1115
- --seed-box-bleed-top: var(--seed-box-bleed-top-lg);
1116
- --seed-box-bleed-left: var(--seed-box-bleed-left-lg);
1117
- --seed-box-bleed-right: var(--seed-box-bleed-right-lg);
1118
- --seed-box-margin: var(--seed-box-margin-lg);
1119
- --seed-box-margin-y: var(--seed-box-margin-y-lg);
1120
- --seed-box-margin-x: var(--seed-box-margin-x-lg);
1121
- --seed-box-margin-top: var(--seed-box-margin-top-lg);
1122
- --seed-box-margin-bottom: var(--seed-box-margin-bottom-lg);
1123
- --seed-box-margin-left: var(--seed-box-margin-left-lg);
1124
- --seed-box-margin-right: var(--seed-box-margin-right-lg);
1125
- --seed-box-min-height: var(--seed-box-min-height-lg);
1126
- --seed-box-max-height: var(--seed-box-max-height-lg);
1127
- --seed-box-height: var(--seed-box-height-lg);
1128
- --seed-box-min-width: var(--seed-box-min-width-lg);
1129
- --seed-box-max-width: var(--seed-box-max-width-lg);
1130
- --seed-box-width: var(--seed-box-width-lg);
1131
- --seed-box-display: var(--seed-box-display-lg);
1132
- --seed-box-flex-direction: var(--seed-box-flex-direction-lg);
1133
- --seed-box-gap: var(--seed-box-gap-lg);
1107
+ --seed-box-padding: var(--seed-box-padding-lg, initial);
1108
+ --seed-box-padding-y: var(--seed-box-padding-y-lg, initial);
1109
+ --seed-box-padding-x: var(--seed-box-padding-x-lg, initial);
1110
+ --seed-box-padding-bottom: var(--seed-box-padding-bottom-lg, initial);
1111
+ --seed-box-padding-top: var(--seed-box-padding-top-lg, initial);
1112
+ --seed-box-padding-left: var(--seed-box-padding-left-lg, initial);
1113
+ --seed-box-padding-right: var(--seed-box-padding-right-lg, initial);
1114
+ --seed-box-bleed-bottom: var(--seed-box-bleed-bottom-lg, initial);
1115
+ --seed-box-bleed-top: var(--seed-box-bleed-top-lg, initial);
1116
+ --seed-box-bleed-left: var(--seed-box-bleed-left-lg, initial);
1117
+ --seed-box-bleed-right: var(--seed-box-bleed-right-lg, initial);
1118
+ --seed-box-margin: var(--seed-box-margin-lg, initial);
1119
+ --seed-box-margin-y: var(--seed-box-margin-y-lg, initial);
1120
+ --seed-box-margin-x: var(--seed-box-margin-x-lg, initial);
1121
+ --seed-box-margin-top: var(--seed-box-margin-top-lg, initial);
1122
+ --seed-box-margin-bottom: var(--seed-box-margin-bottom-lg, initial);
1123
+ --seed-box-margin-left: var(--seed-box-margin-left-lg, initial);
1124
+ --seed-box-margin-right: var(--seed-box-margin-right-lg, initial);
1125
+ --seed-box-min-height: var(--seed-box-min-height-lg, initial);
1126
+ --seed-box-max-height: var(--seed-box-max-height-lg, initial);
1127
+ --seed-box-height: var(--seed-box-height-lg, initial);
1128
+ --seed-box-min-width: var(--seed-box-min-width-lg, initial);
1129
+ --seed-box-max-width: var(--seed-box-max-width-lg, initial);
1130
+ --seed-box-width: var(--seed-box-width-lg, initial);
1131
+ --seed-box-display: var(--seed-box-display-lg, initial);
1132
+ --seed-box-flex-direction: var(--seed-box-flex-direction-lg, initial);
1133
+ --seed-box-gap: var(--seed-box-gap-lg, initial);
1134
1134
  }
1135
1135
 
1136
1136
  .seed-grid {
1137
- --seed-grid-columns: var(--seed-grid-columns-lg);
1138
- --seed-grid-rows: var(--seed-grid-rows-lg);
1137
+ --seed-grid-columns: var(--seed-grid-columns-lg, initial);
1138
+ --seed-grid-rows: var(--seed-grid-rows-lg, initial);
1139
1139
  }
1140
1140
  }
1141
1141
 
1142
1142
  @media (width >= 1440px) {
1143
1143
  .seed-box {
1144
- --seed-box-padding: var(--seed-box-padding-xl);
1145
- --seed-box-padding-y: var(--seed-box-padding-y-xl);
1146
- --seed-box-padding-x: var(--seed-box-padding-x-xl);
1147
- --seed-box-padding-bottom: var(--seed-box-padding-bottom-xl);
1148
- --seed-box-padding-top: var(--seed-box-padding-top-xl);
1149
- --seed-box-padding-left: var(--seed-box-padding-left-xl);
1150
- --seed-box-padding-right: var(--seed-box-padding-right-xl);
1151
- --seed-box-bleed-bottom: var(--seed-box-bleed-bottom-xl);
1152
- --seed-box-bleed-top: var(--seed-box-bleed-top-xl);
1153
- --seed-box-bleed-left: var(--seed-box-bleed-left-xl);
1154
- --seed-box-bleed-right: var(--seed-box-bleed-right-xl);
1155
- --seed-box-margin: var(--seed-box-margin-xl);
1156
- --seed-box-margin-y: var(--seed-box-margin-y-xl);
1157
- --seed-box-margin-x: var(--seed-box-margin-x-xl);
1158
- --seed-box-margin-top: var(--seed-box-margin-top-xl);
1159
- --seed-box-margin-bottom: var(--seed-box-margin-bottom-xl);
1160
- --seed-box-margin-left: var(--seed-box-margin-left-xl);
1161
- --seed-box-margin-right: var(--seed-box-margin-right-xl);
1162
- --seed-box-min-height: var(--seed-box-min-height-xl);
1163
- --seed-box-max-height: var(--seed-box-max-height-xl);
1164
- --seed-box-height: var(--seed-box-height-xl);
1165
- --seed-box-min-width: var(--seed-box-min-width-xl);
1166
- --seed-box-max-width: var(--seed-box-max-width-xl);
1167
- --seed-box-width: var(--seed-box-width-xl);
1168
- --seed-box-display: var(--seed-box-display-xl);
1169
- --seed-box-flex-direction: var(--seed-box-flex-direction-xl);
1170
- --seed-box-gap: var(--seed-box-gap-xl);
1144
+ --seed-box-padding: var(--seed-box-padding-xl, initial);
1145
+ --seed-box-padding-y: var(--seed-box-padding-y-xl, initial);
1146
+ --seed-box-padding-x: var(--seed-box-padding-x-xl, initial);
1147
+ --seed-box-padding-bottom: var(--seed-box-padding-bottom-xl, initial);
1148
+ --seed-box-padding-top: var(--seed-box-padding-top-xl, initial);
1149
+ --seed-box-padding-left: var(--seed-box-padding-left-xl, initial);
1150
+ --seed-box-padding-right: var(--seed-box-padding-right-xl, initial);
1151
+ --seed-box-bleed-bottom: var(--seed-box-bleed-bottom-xl, initial);
1152
+ --seed-box-bleed-top: var(--seed-box-bleed-top-xl, initial);
1153
+ --seed-box-bleed-left: var(--seed-box-bleed-left-xl, initial);
1154
+ --seed-box-bleed-right: var(--seed-box-bleed-right-xl, initial);
1155
+ --seed-box-margin: var(--seed-box-margin-xl, initial);
1156
+ --seed-box-margin-y: var(--seed-box-margin-y-xl, initial);
1157
+ --seed-box-margin-x: var(--seed-box-margin-x-xl, initial);
1158
+ --seed-box-margin-top: var(--seed-box-margin-top-xl, initial);
1159
+ --seed-box-margin-bottom: var(--seed-box-margin-bottom-xl, initial);
1160
+ --seed-box-margin-left: var(--seed-box-margin-left-xl, initial);
1161
+ --seed-box-margin-right: var(--seed-box-margin-right-xl, initial);
1162
+ --seed-box-min-height: var(--seed-box-min-height-xl, initial);
1163
+ --seed-box-max-height: var(--seed-box-max-height-xl, initial);
1164
+ --seed-box-height: var(--seed-box-height-xl, initial);
1165
+ --seed-box-min-width: var(--seed-box-min-width-xl, initial);
1166
+ --seed-box-max-width: var(--seed-box-max-width-xl, initial);
1167
+ --seed-box-width: var(--seed-box-width-xl, initial);
1168
+ --seed-box-display: var(--seed-box-display-xl, initial);
1169
+ --seed-box-flex-direction: var(--seed-box-flex-direction-xl, initial);
1170
+ --seed-box-gap: var(--seed-box-gap-xl, initial);
1171
1171
  }
1172
1172
 
1173
1173
  .seed-grid {
1174
- --seed-grid-columns: var(--seed-grid-columns-xl);
1175
- --seed-grid-rows: var(--seed-grid-rows-xl);
1174
+ --seed-grid-columns: var(--seed-grid-columns-xl, initial);
1175
+ --seed-grid-rows: var(--seed-grid-rows-xl, initial);
1176
1176
  }
1177
1177
  }
1178
1178
  }
@@ -1507,29 +1507,29 @@
1507
1507
  padding-left: var(--seed-box-padding-left);
1508
1508
  padding-right: var(--seed-box-padding-right);
1509
1509
  --seed-box-bleed-bottom-base: 0px;
1510
- --seed-box-bleed-bottom-sm: var(--seed-box-bleed-bottom-base);
1511
- --seed-box-bleed-bottom-md: var(--seed-box-bleed-bottom-sm);
1512
- --seed-box-bleed-bottom-lg: var(--seed-box-bleed-bottom-md);
1513
- --seed-box-bleed-bottom-xl: var(--seed-box-bleed-bottom-lg);
1514
- --seed-box-bleed-bottom: var(--seed-box-bleed-bottom-base);
1510
+ --seed-box-bleed-bottom-sm: var(--seed-box-bleed-bottom-base, initial);
1511
+ --seed-box-bleed-bottom-md: var(--seed-box-bleed-bottom-sm, initial);
1512
+ --seed-box-bleed-bottom-lg: var(--seed-box-bleed-bottom-md, initial);
1513
+ --seed-box-bleed-bottom-xl: var(--seed-box-bleed-bottom-lg, initial);
1514
+ --seed-box-bleed-bottom: var(--seed-box-bleed-bottom-base, initial);
1515
1515
  --seed-box-bleed-top-base: 0px;
1516
- --seed-box-bleed-top-sm: var(--seed-box-bleed-top-base);
1517
- --seed-box-bleed-top-md: var(--seed-box-bleed-top-sm);
1518
- --seed-box-bleed-top-lg: var(--seed-box-bleed-top-md);
1519
- --seed-box-bleed-top-xl: var(--seed-box-bleed-top-lg);
1520
- --seed-box-bleed-top: var(--seed-box-bleed-top-base);
1516
+ --seed-box-bleed-top-sm: var(--seed-box-bleed-top-base, initial);
1517
+ --seed-box-bleed-top-md: var(--seed-box-bleed-top-sm, initial);
1518
+ --seed-box-bleed-top-lg: var(--seed-box-bleed-top-md, initial);
1519
+ --seed-box-bleed-top-xl: var(--seed-box-bleed-top-lg, initial);
1520
+ --seed-box-bleed-top: var(--seed-box-bleed-top-base, initial);
1521
1521
  --seed-box-bleed-left-base: 0px;
1522
- --seed-box-bleed-left-sm: var(--seed-box-bleed-left-base);
1523
- --seed-box-bleed-left-md: var(--seed-box-bleed-left-sm);
1524
- --seed-box-bleed-left-lg: var(--seed-box-bleed-left-md);
1525
- --seed-box-bleed-left-xl: var(--seed-box-bleed-left-lg);
1526
- --seed-box-bleed-left: var(--seed-box-bleed-left-base);
1522
+ --seed-box-bleed-left-sm: var(--seed-box-bleed-left-base, initial);
1523
+ --seed-box-bleed-left-md: var(--seed-box-bleed-left-sm, initial);
1524
+ --seed-box-bleed-left-lg: var(--seed-box-bleed-left-md, initial);
1525
+ --seed-box-bleed-left-xl: var(--seed-box-bleed-left-lg, initial);
1526
+ --seed-box-bleed-left: var(--seed-box-bleed-left-base, initial);
1527
1527
  --seed-box-bleed-right-base: 0px;
1528
- --seed-box-bleed-right-sm: var(--seed-box-bleed-right-base);
1529
- --seed-box-bleed-right-md: var(--seed-box-bleed-right-sm);
1530
- --seed-box-bleed-right-lg: var(--seed-box-bleed-right-md);
1531
- --seed-box-bleed-right-xl: var(--seed-box-bleed-right-lg);
1532
- --seed-box-bleed-right: var(--seed-box-bleed-right-base);
1528
+ --seed-box-bleed-right-sm: var(--seed-box-bleed-right-base, initial);
1529
+ --seed-box-bleed-right-md: var(--seed-box-bleed-right-sm, initial);
1530
+ --seed-box-bleed-right-lg: var(--seed-box-bleed-right-md, initial);
1531
+ --seed-box-bleed-right-xl: var(--seed-box-bleed-right-lg, initial);
1532
+ --seed-box-bleed-right: var(--seed-box-bleed-right-base, initial);
1533
1533
  margin-top: calc(var(--seed-box-bleed-top) * -1);
1534
1534
  margin-bottom: calc(var(--seed-box-bleed-bottom) * -1);
1535
1535
  margin-left: calc(var(--seed-box-bleed-left) * -1);
@@ -3117,29 +3117,29 @@
3117
3117
 
3118
3118
  .seed-bottom-sheet__body {
3119
3119
  --seed-box-padding-x-base: var(--seed-dimension-spacing-x-global-gutter);
3120
- --seed-box-padding-x-sm: var(--seed-box-padding-x-base);
3121
- --seed-box-padding-x-md: var(--seed-box-padding-x-sm);
3122
- --seed-box-padding-x-lg: var(--seed-box-padding-x-md);
3123
- --seed-box-padding-x-xl: var(--seed-box-padding-x-lg);
3124
- --seed-box-padding-x: var(--seed-box-padding-x-base);
3125
- --seed-box-height-base: initial;
3126
- --seed-box-height-sm: var(--seed-box-height-base);
3127
- --seed-box-height-md: var(--seed-box-height-sm);
3128
- --seed-box-height-lg: var(--seed-box-height-md);
3129
- --seed-box-height-xl: var(--seed-box-height-lg);
3130
- --seed-box-height: var(--seed-box-height-base);
3131
- --seed-box-min-height-base: initial;
3132
- --seed-box-min-height-sm: var(--seed-box-min-height-base);
3133
- --seed-box-min-height-md: var(--seed-box-min-height-sm);
3134
- --seed-box-min-height-lg: var(--seed-box-min-height-md);
3135
- --seed-box-min-height-xl: var(--seed-box-min-height-lg);
3136
- --seed-box-min-height: var(--seed-box-min-height-base);
3137
- --seed-box-max-height-base: initial;
3138
- --seed-box-max-height-sm: var(--seed-box-max-height-base);
3139
- --seed-box-max-height-md: var(--seed-box-max-height-sm);
3140
- --seed-box-max-height-lg: var(--seed-box-max-height-md);
3141
- --seed-box-max-height-xl: var(--seed-box-max-height-lg);
3142
- --seed-box-max-height: var(--seed-box-max-height-base);
3120
+ --seed-box-padding-x-sm: var(--seed-box-padding-x-base, initial);
3121
+ --seed-box-padding-x-md: var(--seed-box-padding-x-sm, initial);
3122
+ --seed-box-padding-x-lg: var(--seed-box-padding-x-md, initial);
3123
+ --seed-box-padding-x-xl: var(--seed-box-padding-x-lg, initial);
3124
+ --seed-box-padding-x: var(--seed-box-padding-x-base, initial);
3125
+ --seed-box-height-base: auto;
3126
+ --seed-box-height-sm: var(--seed-box-height-base, initial);
3127
+ --seed-box-height-md: var(--seed-box-height-sm, initial);
3128
+ --seed-box-height-lg: var(--seed-box-height-md, initial);
3129
+ --seed-box-height-xl: var(--seed-box-height-lg, initial);
3130
+ --seed-box-height: var(--seed-box-height-base, initial);
3131
+ --seed-box-min-height-base: auto;
3132
+ --seed-box-min-height-sm: var(--seed-box-min-height-base, initial);
3133
+ --seed-box-min-height-md: var(--seed-box-min-height-sm, initial);
3134
+ --seed-box-min-height-lg: var(--seed-box-min-height-md, initial);
3135
+ --seed-box-min-height-xl: var(--seed-box-min-height-lg, initial);
3136
+ --seed-box-min-height: var(--seed-box-min-height-base, initial);
3137
+ --seed-box-max-height-base: none;
3138
+ --seed-box-max-height-sm: var(--seed-box-max-height-base, initial);
3139
+ --seed-box-max-height-md: var(--seed-box-max-height-sm, initial);
3140
+ --seed-box-max-height-lg: var(--seed-box-max-height-md, initial);
3141
+ --seed-box-max-height-xl: var(--seed-box-max-height-lg, initial);
3142
+ --seed-box-max-height: var(--seed-box-max-height-base, initial);
3143
3143
  --seed-box-justify-content: initial;
3144
3144
  --seed-box-align-items: initial;
3145
3145
  padding-left: var(--seed-box-padding-x);
@@ -5547,8 +5547,8 @@
5547
5547
  }
5548
5548
 
5549
5549
  .seed-floating-action-button__icon--extended_true {
5550
- width: var(--seed-dimension-x5);
5551
- height: var(--seed-dimension-x5);
5550
+ width: var(--seed-dimension-x4);
5551
+ height: var(--seed-dimension-x4);
5552
5552
  margin-right: var(--seed-dimension-x1);
5553
5553
  transition: none;
5554
5554
  }
@@ -5637,12 +5637,12 @@
5637
5637
  padding-top: var(--seed-dimension-x2_5);
5638
5638
  padding-bottom: var(--seed-dimension-x2_5);
5639
5639
  border-radius: var(--seed-radius-r3);
5640
- --seed-box-max-width-base: initial;
5641
- --seed-box-max-width-sm: var(--seed-box-max-width-base);
5642
- --seed-box-max-width-md: var(--seed-box-max-width-sm);
5643
- --seed-box-max-width-lg: var(--seed-box-max-width-md);
5644
- --seed-box-max-width-xl: var(--seed-box-max-width-lg);
5645
- --seed-box-max-width: var(--seed-box-max-width-base);
5640
+ --seed-box-max-width-base: none;
5641
+ --seed-box-max-width-sm: var(--seed-box-max-width-base, initial);
5642
+ --seed-box-max-width-md: var(--seed-box-max-width-sm, initial);
5643
+ --seed-box-max-width-lg: var(--seed-box-max-width-md, initial);
5644
+ --seed-box-max-width-xl: var(--seed-box-max-width-lg, initial);
5645
+ --seed-box-max-width: var(--seed-box-max-width-base, initial);
5646
5646
  max-width: var(--seed-box-max-width);
5647
5647
  align-items: flex-start;
5648
5648
  display: flex;
@@ -5871,15 +5871,12 @@
5871
5871
  height: var(--seed-dimension-x6);
5872
5872
  color: var(--seed-color-palette-static-white);
5873
5873
  pointer-events: none;
5874
+ filter: drop-shadow(0 2px 2px #00000026);
5874
5875
  margin: auto;
5875
5876
  position: absolute;
5876
5877
  inset: 0;
5877
5878
  }
5878
5879
 
5879
- .seed-image-frame-reaction-button__lineIcon:is([aria-pressed="true"], [data-pressed]) {
5880
- color: var(--seed-color-bg-transparent);
5881
- }
5882
-
5883
5880
  .seed-inline-banner__root {
5884
5881
  box-sizing: border-box;
5885
5882
  -webkit-font-smoothing: antialiased;
@@ -6498,11 +6495,11 @@
6498
6495
 
6499
6496
  .seed-list-item__prefix {
6500
6497
  --seed-box-padding-right-base: var(--seed-dimension-x3);
6501
- --seed-box-padding-right-sm: var(--seed-box-padding-right-base);
6502
- --seed-box-padding-right-md: var(--seed-box-padding-right-sm);
6503
- --seed-box-padding-right-lg: var(--seed-box-padding-right-md);
6504
- --seed-box-padding-right-xl: var(--seed-box-padding-right-lg);
6505
- --seed-box-padding-right: var(--seed-box-padding-right-base);
6498
+ --seed-box-padding-right-sm: var(--seed-box-padding-right-base, initial);
6499
+ --seed-box-padding-right-md: var(--seed-box-padding-right-sm, initial);
6500
+ --seed-box-padding-right-lg: var(--seed-box-padding-right-md, initial);
6501
+ --seed-box-padding-right-xl: var(--seed-box-padding-right-lg, initial);
6502
+ --seed-box-padding-right: var(--seed-box-padding-right-base, initial);
6506
6503
  padding-right: var(--seed-box-padding-right);
6507
6504
  --seed-focus-ring: none;
6508
6505
  --seed-icon-size: 22px;
@@ -6520,11 +6517,11 @@
6520
6517
  --seed-box-position: initial;
6521
6518
  position: var(--seed-box-position);
6522
6519
  --seed-box-gap-base: var(--seed-dimension-x1);
6523
- --seed-box-gap-sm: var(--seed-box-gap-base);
6524
- --seed-box-gap-md: var(--seed-box-gap-sm);
6525
- --seed-box-gap-lg: var(--seed-box-gap-md);
6526
- --seed-box-gap-xl: var(--seed-box-gap-lg);
6527
- --seed-box-gap: var(--seed-box-gap-base);
6520
+ --seed-box-gap-sm: var(--seed-box-gap-base, initial);
6521
+ --seed-box-gap-md: var(--seed-box-gap-sm, initial);
6522
+ --seed-box-gap-lg: var(--seed-box-gap-md, initial);
6523
+ --seed-box-gap-xl: var(--seed-box-gap-lg, initial);
6524
+ --seed-box-gap: var(--seed-box-gap-base, initial);
6528
6525
  align-items: center;
6529
6526
  gap: var(--seed-box-gap);
6530
6527
  --seed-focus-ring: none;
@@ -6546,19 +6543,19 @@
6546
6543
  box-sizing: border-box;
6547
6544
  text-align: start;
6548
6545
  --seed-box-gap-base: var(--seed-dimension-x0_5);
6549
- --seed-box-gap-sm: var(--seed-box-gap-base);
6550
- --seed-box-gap-md: var(--seed-box-gap-sm);
6551
- --seed-box-gap-lg: var(--seed-box-gap-md);
6552
- --seed-box-gap-xl: var(--seed-box-gap-lg);
6553
- --seed-box-gap: var(--seed-box-gap-base);
6546
+ --seed-box-gap-sm: var(--seed-box-gap-base, initial);
6547
+ --seed-box-gap-md: var(--seed-box-gap-sm, initial);
6548
+ --seed-box-gap-lg: var(--seed-box-gap-md, initial);
6549
+ --seed-box-gap-xl: var(--seed-box-gap-lg, initial);
6550
+ --seed-box-gap: var(--seed-box-gap-base, initial);
6554
6551
  align-items: flex-start;
6555
6552
  gap: var(--seed-box-gap);
6556
6553
  --seed-box-padding-right-base: var(--seed-dimension-x2_5);
6557
- --seed-box-padding-right-sm: var(--seed-box-padding-right-base);
6558
- --seed-box-padding-right-md: var(--seed-box-padding-right-sm);
6559
- --seed-box-padding-right-lg: var(--seed-box-padding-right-md);
6560
- --seed-box-padding-right-xl: var(--seed-box-padding-right-lg);
6561
- --seed-box-padding-right: var(--seed-box-padding-right-base);
6554
+ --seed-box-padding-right-sm: var(--seed-box-padding-right-base, initial);
6555
+ --seed-box-padding-right-md: var(--seed-box-padding-right-sm, initial);
6556
+ --seed-box-padding-right-lg: var(--seed-box-padding-right-md, initial);
6557
+ --seed-box-padding-right-xl: var(--seed-box-padding-right-lg, initial);
6558
+ --seed-box-padding-right: var(--seed-box-padding-right-base, initial);
6562
6559
  padding: 0 var(--seed-box-padding-right) 0 0;
6563
6560
  background-color: #0000;
6564
6561
  border: none;
@@ -8913,19 +8910,20 @@
8913
8910
  background: var(--seed-color-bg-layer-floating);
8914
8911
  touch-action: none;
8915
8912
  will-change: transform;
8916
- --seed-box-width-base: initial;
8917
- --seed-box-width-sm: var(--seed-box-width-base);
8918
- --seed-box-width-md: var(--seed-box-width-sm);
8919
- --seed-box-width-lg: var(--seed-box-width-md);
8920
- --seed-box-width-xl: var(--seed-box-width-lg);
8921
- --seed-box-width: var(--seed-box-width-base);
8913
+ --side-panel-default-width: calc(.8 * 100vw);
8914
+ --seed-box-width-base: var(--side-panel-default-width);
8915
+ --seed-box-width-sm: var(--seed-box-width-base, initial);
8916
+ --seed-box-width-md: var(--seed-box-width-sm, initial);
8917
+ --seed-box-width-lg: var(--seed-box-width-md, initial);
8918
+ --seed-box-width-xl: var(--seed-box-width-lg, initial);
8919
+ --seed-box-width: var(--seed-box-width-base, initial);
8922
8920
  --seed-box-max-width-base: calc(.8 * 100%);
8923
- --seed-box-max-width-sm: var(--seed-box-max-width-base);
8924
- --seed-box-max-width-md: var(--seed-box-max-width-sm);
8925
- --seed-box-max-width-lg: var(--seed-box-max-width-md);
8926
- --seed-box-max-width-xl: var(--seed-box-max-width-lg);
8927
- --seed-box-max-width: var(--seed-box-max-width-base);
8928
- width: var(--seed-box-width, calc(.8 * 100vw));
8921
+ --seed-box-max-width-sm: var(--seed-box-max-width-base, initial);
8922
+ --seed-box-max-width-md: var(--seed-box-max-width-sm, initial);
8923
+ --seed-box-max-width-lg: var(--seed-box-max-width-md, initial);
8924
+ --seed-box-max-width-xl: var(--seed-box-max-width-lg, initial);
8925
+ --seed-box-max-width: var(--seed-box-max-width-base, initial);
8926
+ width: var(--seed-box-width);
8929
8927
  max-width: var(--seed-box-max-width);
8930
8928
  padding-bottom: var(--seed-safe-area-bottom);
8931
8929
  flex-direction: column;
@@ -8937,7 +8935,7 @@
8937
8935
 
8938
8936
  @media (width >= 768px) {
8939
8937
  .seed-side-panel__content {
8940
- width: var(--seed-box-width, var(--side-panel-size-width));
8938
+ --side-panel-default-width: var(--side-panel-size-width);
8941
8939
  }
8942
8940
  }
8943
8941
 
@@ -9029,7 +9027,7 @@
9029
9027
  }
9030
9028
 
9031
9029
  .seed-side-panel__header[data-show-close-button] {
9032
- padding-right: calc(var(--seed-dimension-x6) + 52px);
9030
+ padding-right: calc(24px + 22px + var(--seed-dimension-x1_5));
9033
9031
  }
9034
9032
 
9035
9033
  .seed-side-panel__title {
@@ -9051,30 +9049,31 @@
9051
9049
  }
9052
9050
 
9053
9051
  .seed-side-panel__body {
9052
+ box-sizing: border-box;
9054
9053
  --seed-box-padding-x-base: var(--seed-dimension-x6);
9055
- --seed-box-padding-x-sm: var(--seed-box-padding-x-base);
9056
- --seed-box-padding-x-md: var(--seed-box-padding-x-sm);
9057
- --seed-box-padding-x-lg: var(--seed-box-padding-x-md);
9058
- --seed-box-padding-x-xl: var(--seed-box-padding-x-lg);
9059
- --seed-box-padding-x: var(--seed-box-padding-x-base);
9060
- --seed-box-height-base: initial;
9061
- --seed-box-height-sm: var(--seed-box-height-base);
9062
- --seed-box-height-md: var(--seed-box-height-sm);
9063
- --seed-box-height-lg: var(--seed-box-height-md);
9064
- --seed-box-height-xl: var(--seed-box-height-lg);
9065
- --seed-box-height: var(--seed-box-height-base);
9066
- --seed-box-min-height-base: initial;
9067
- --seed-box-min-height-sm: var(--seed-box-min-height-base);
9068
- --seed-box-min-height-md: var(--seed-box-min-height-sm);
9069
- --seed-box-min-height-lg: var(--seed-box-min-height-md);
9070
- --seed-box-min-height-xl: var(--seed-box-min-height-lg);
9071
- --seed-box-min-height: var(--seed-box-min-height-base);
9072
- --seed-box-max-height-base: initial;
9073
- --seed-box-max-height-sm: var(--seed-box-max-height-base);
9074
- --seed-box-max-height-md: var(--seed-box-max-height-sm);
9075
- --seed-box-max-height-lg: var(--seed-box-max-height-md);
9076
- --seed-box-max-height-xl: var(--seed-box-max-height-lg);
9077
- --seed-box-max-height: var(--seed-box-max-height-base);
9054
+ --seed-box-padding-x-sm: var(--seed-box-padding-x-base, initial);
9055
+ --seed-box-padding-x-md: var(--seed-box-padding-x-sm, initial);
9056
+ --seed-box-padding-x-lg: var(--seed-box-padding-x-md, initial);
9057
+ --seed-box-padding-x-xl: var(--seed-box-padding-x-lg, initial);
9058
+ --seed-box-padding-x: var(--seed-box-padding-x-base, initial);
9059
+ --seed-box-height-base: auto;
9060
+ --seed-box-height-sm: var(--seed-box-height-base, initial);
9061
+ --seed-box-height-md: var(--seed-box-height-sm, initial);
9062
+ --seed-box-height-lg: var(--seed-box-height-md, initial);
9063
+ --seed-box-height-xl: var(--seed-box-height-lg, initial);
9064
+ --seed-box-height: var(--seed-box-height-base, initial);
9065
+ --seed-box-min-height-base: auto;
9066
+ --seed-box-min-height-sm: var(--seed-box-min-height-base, initial);
9067
+ --seed-box-min-height-md: var(--seed-box-min-height-sm, initial);
9068
+ --seed-box-min-height-lg: var(--seed-box-min-height-md, initial);
9069
+ --seed-box-min-height-xl: var(--seed-box-min-height-lg, initial);
9070
+ --seed-box-min-height: var(--seed-box-min-height-base, initial);
9071
+ --seed-box-max-height-base: none;
9072
+ --seed-box-max-height-sm: var(--seed-box-max-height-base, initial);
9073
+ --seed-box-max-height-md: var(--seed-box-max-height-sm, initial);
9074
+ --seed-box-max-height-lg: var(--seed-box-max-height-md, initial);
9075
+ --seed-box-max-height-xl: var(--seed-box-max-height-lg, initial);
9076
+ --seed-box-max-height: var(--seed-box-max-height-base, initial);
9078
9077
  --seed-box-justify-content: initial;
9079
9078
  --seed-box-align-items: initial;
9080
9079
  padding-left: var(--seed-box-padding-x);
@@ -9111,57 +9110,42 @@
9111
9110
  }
9112
9111
 
9113
9112
  .seed-side-panel__closeButton {
9113
+ background: var(--seed-color-bg-transparent);
9114
9114
  top: calc(28px + var(--seed-safe-area-top));
9115
9115
  border-radius: var(--seed-radius-r3);
9116
- background: var(--seed-color-bg-transparent);
9117
9116
  cursor: pointer;
9117
+ transition: background var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
9118
9118
  --seed-icon-size: 22px;
9119
9119
  --seed-icon-color: var(--seed-color-fg-neutral-subtle);
9120
+ outline: var(--seed-dimension-x0_5) solid transparent;
9121
+ outline-offset: var(--seed-dimension-x0_5);
9120
9122
  border: none;
9121
9123
  justify-content: center;
9122
9124
  align-items: center;
9123
- width: 22px;
9124
- height: 22px;
9125
+ margin: -15px;
9126
+ padding: 15px;
9125
9127
  display: flex;
9126
9128
  position: absolute;
9127
9129
  right: 24px;
9128
9130
  }
9129
9131
 
9130
- .seed-side-panel__closeButton :where(.seed-icon) {
9131
- transition: color var(--seed-duration-color-transition) var(--seed-timing-function-easing);
9132
+ .seed-side-panel__closeButton:is(:focus-visible, [data-focus-visible]) {
9133
+ outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
9134
+ outline-offset: var(--seed-dimension-x0_5);
9132
9135
  }
9133
9136
 
9134
9137
  @media (hover: hover) and (pointer: fine) {
9135
9138
  .seed-side-panel__closeButton:is(:hover, [data-hover]) {
9136
- --seed-icon-color: var(--seed-color-fg-neutral);
9139
+ background: var(--seed-color-bg-transparent-pressed);
9137
9140
  }
9138
9141
  }
9139
9142
 
9140
9143
  @media not all and (hover: hover) and (pointer: fine) {
9141
9144
  .seed-side-panel__closeButton:is(:active, [data-active]) {
9142
- --seed-icon-color: var(--seed-color-fg-neutral);
9145
+ background: var(--seed-color-bg-transparent-pressed);
9143
9146
  }
9144
9147
  }
9145
9148
 
9146
- .seed-side-panel__closeButton:after {
9147
- content: "";
9148
- border-radius: var(--seed-radius-r3);
9149
- outline: var(--seed-dimension-x0_5) solid transparent;
9150
- outline-offset: calc(var(--seed-dimension-x0_5) * -1);
9151
- transition: outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
9152
- position: absolute;
9153
- inset: -15px;
9154
- }
9155
-
9156
- .seed-side-panel__closeButton:is(:focus, [data-focus]) {
9157
- outline: none;
9158
- }
9159
-
9160
- .seed-side-panel__closeButton:is(:focus-visible, [data-focus-visible]):after {
9161
- outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
9162
- outline-offset: calc(var(--seed-dimension-x0_5) * -1);
9163
- }
9164
-
9165
9149
  .seed-side-panel__content--size_small {
9166
9150
  --side-panel-size-width: 480px;
9167
9151
  }
@@ -9176,18 +9160,18 @@
9176
9160
 
9177
9161
  .seed-skeleton {
9178
9162
  box-sizing: border-box;
9179
- --seed-box-width-base: initial;
9180
- --seed-box-width-sm: var(--seed-box-width-base);
9181
- --seed-box-width-md: var(--seed-box-width-sm);
9182
- --seed-box-width-lg: var(--seed-box-width-md);
9183
- --seed-box-width-xl: var(--seed-box-width-lg);
9184
- --seed-box-width: var(--seed-box-width-base);
9185
- --seed-box-height-base: initial;
9186
- --seed-box-height-sm: var(--seed-box-height-base);
9187
- --seed-box-height-md: var(--seed-box-height-sm);
9188
- --seed-box-height-lg: var(--seed-box-height-md);
9189
- --seed-box-height-xl: var(--seed-box-height-lg);
9190
- --seed-box-height: var(--seed-box-height-base);
9163
+ --seed-box-width-base: auto;
9164
+ --seed-box-width-sm: var(--seed-box-width-base, initial);
9165
+ --seed-box-width-md: var(--seed-box-width-sm, initial);
9166
+ --seed-box-width-lg: var(--seed-box-width-md, initial);
9167
+ --seed-box-width-xl: var(--seed-box-width-lg, initial);
9168
+ --seed-box-width: var(--seed-box-width-base, initial);
9169
+ --seed-box-height-base: auto;
9170
+ --seed-box-height-sm: var(--seed-box-height-base, initial);
9171
+ --seed-box-height-md: var(--seed-box-height-sm, initial);
9172
+ --seed-box-height-lg: var(--seed-box-height-md, initial);
9173
+ --seed-box-height-xl: var(--seed-box-height-lg, initial);
9174
+ --seed-box-height: var(--seed-box-height-base, initial);
9191
9175
  width: var(--seed-box-width);
9192
9176
  height: var(--seed-box-height);
9193
9177
  display: inline-block;
@@ -11551,201 +11535,201 @@
11551
11535
 
11552
11536
  @media (width >= 480px) {
11553
11537
  .seed-action-button {
11554
- --seed-box-bleed-bottom: var(--seed-box-bleed-bottom-sm);
11555
- --seed-box-bleed-top: var(--seed-box-bleed-top-sm);
11556
- --seed-box-bleed-left: var(--seed-box-bleed-left-sm);
11557
- --seed-box-bleed-right: var(--seed-box-bleed-right-sm);
11538
+ --seed-box-bleed-bottom: var(--seed-box-bleed-bottom-sm, initial);
11539
+ --seed-box-bleed-top: var(--seed-box-bleed-top-sm, initial);
11540
+ --seed-box-bleed-left: var(--seed-box-bleed-left-sm, initial);
11541
+ --seed-box-bleed-right: var(--seed-box-bleed-right-sm, initial);
11558
11542
  }
11559
11543
 
11560
11544
  .seed-bottom-sheet__body {
11561
- --seed-box-padding-x: var(--seed-box-padding-x-sm);
11562
- --seed-box-height: var(--seed-box-height-sm);
11563
- --seed-box-min-height: var(--seed-box-min-height-sm);
11564
- --seed-box-max-height: var(--seed-box-max-height-sm);
11545
+ --seed-box-padding-x: var(--seed-box-padding-x-sm, initial);
11546
+ --seed-box-height: var(--seed-box-height-sm, initial);
11547
+ --seed-box-min-height: var(--seed-box-min-height-sm, initial);
11548
+ --seed-box-max-height: var(--seed-box-max-height-sm, initial);
11565
11549
  }
11566
11550
 
11567
11551
  .seed-help-bubble__content {
11568
- --seed-box-max-width: var(--seed-box-max-width-sm);
11552
+ --seed-box-max-width: var(--seed-box-max-width-sm, initial);
11569
11553
  }
11570
11554
 
11571
11555
  .seed-list-item__prefix {
11572
- --seed-box-padding-right: var(--seed-box-padding-right-sm);
11556
+ --seed-box-padding-right: var(--seed-box-padding-right-sm, initial);
11573
11557
  }
11574
11558
 
11575
11559
  .seed-list-item__suffix {
11576
- --seed-box-gap: var(--seed-box-gap-sm);
11560
+ --seed-box-gap: var(--seed-box-gap-sm, initial);
11577
11561
  }
11578
11562
 
11579
11563
  .seed-list-item__content {
11580
- --seed-box-gap: var(--seed-box-gap-sm);
11581
- --seed-box-padding-right: var(--seed-box-padding-right-sm);
11564
+ --seed-box-gap: var(--seed-box-gap-sm, initial);
11565
+ --seed-box-padding-right: var(--seed-box-padding-right-sm, initial);
11582
11566
  }
11583
11567
 
11584
11568
  .seed-side-panel__content {
11585
- --seed-box-width: var(--seed-box-width-sm);
11586
- --seed-box-max-width: var(--seed-box-max-width-sm);
11569
+ --seed-box-width: var(--seed-box-width-sm, initial);
11570
+ --seed-box-max-width: var(--seed-box-max-width-sm, initial);
11587
11571
  }
11588
11572
 
11589
11573
  .seed-side-panel__body {
11590
- --seed-box-padding-x: var(--seed-box-padding-x-sm);
11591
- --seed-box-height: var(--seed-box-height-sm);
11592
- --seed-box-min-height: var(--seed-box-min-height-sm);
11593
- --seed-box-max-height: var(--seed-box-max-height-sm);
11574
+ --seed-box-padding-x: var(--seed-box-padding-x-sm, initial);
11575
+ --seed-box-height: var(--seed-box-height-sm, initial);
11576
+ --seed-box-min-height: var(--seed-box-min-height-sm, initial);
11577
+ --seed-box-max-height: var(--seed-box-max-height-sm, initial);
11594
11578
  }
11595
11579
 
11596
11580
  .seed-skeleton {
11597
- --seed-box-width: var(--seed-box-width-sm);
11598
- --seed-box-height: var(--seed-box-height-sm);
11581
+ --seed-box-width: var(--seed-box-width-sm, initial);
11582
+ --seed-box-height: var(--seed-box-height-sm, initial);
11599
11583
  }
11600
11584
  }
11601
11585
 
11602
11586
  @media (width >= 768px) {
11603
11587
  .seed-action-button {
11604
- --seed-box-bleed-bottom: var(--seed-box-bleed-bottom-md);
11605
- --seed-box-bleed-top: var(--seed-box-bleed-top-md);
11606
- --seed-box-bleed-left: var(--seed-box-bleed-left-md);
11607
- --seed-box-bleed-right: var(--seed-box-bleed-right-md);
11588
+ --seed-box-bleed-bottom: var(--seed-box-bleed-bottom-md, initial);
11589
+ --seed-box-bleed-top: var(--seed-box-bleed-top-md, initial);
11590
+ --seed-box-bleed-left: var(--seed-box-bleed-left-md, initial);
11591
+ --seed-box-bleed-right: var(--seed-box-bleed-right-md, initial);
11608
11592
  }
11609
11593
 
11610
11594
  .seed-bottom-sheet__body {
11611
- --seed-box-padding-x: var(--seed-box-padding-x-md);
11612
- --seed-box-height: var(--seed-box-height-md);
11613
- --seed-box-min-height: var(--seed-box-min-height-md);
11614
- --seed-box-max-height: var(--seed-box-max-height-md);
11595
+ --seed-box-padding-x: var(--seed-box-padding-x-md, initial);
11596
+ --seed-box-height: var(--seed-box-height-md, initial);
11597
+ --seed-box-min-height: var(--seed-box-min-height-md, initial);
11598
+ --seed-box-max-height: var(--seed-box-max-height-md, initial);
11615
11599
  }
11616
11600
 
11617
11601
  .seed-help-bubble__content {
11618
- --seed-box-max-width: var(--seed-box-max-width-md);
11602
+ --seed-box-max-width: var(--seed-box-max-width-md, initial);
11619
11603
  }
11620
11604
 
11621
11605
  .seed-list-item__prefix {
11622
- --seed-box-padding-right: var(--seed-box-padding-right-md);
11606
+ --seed-box-padding-right: var(--seed-box-padding-right-md, initial);
11623
11607
  }
11624
11608
 
11625
11609
  .seed-list-item__suffix {
11626
- --seed-box-gap: var(--seed-box-gap-md);
11610
+ --seed-box-gap: var(--seed-box-gap-md, initial);
11627
11611
  }
11628
11612
 
11629
11613
  .seed-list-item__content {
11630
- --seed-box-gap: var(--seed-box-gap-md);
11631
- --seed-box-padding-right: var(--seed-box-padding-right-md);
11614
+ --seed-box-gap: var(--seed-box-gap-md, initial);
11615
+ --seed-box-padding-right: var(--seed-box-padding-right-md, initial);
11632
11616
  }
11633
11617
 
11634
11618
  .seed-side-panel__content {
11635
- --seed-box-width: var(--seed-box-width-md);
11636
- --seed-box-max-width: var(--seed-box-max-width-md);
11619
+ --seed-box-width: var(--seed-box-width-md, initial);
11620
+ --seed-box-max-width: var(--seed-box-max-width-md, initial);
11637
11621
  }
11638
11622
 
11639
11623
  .seed-side-panel__body {
11640
- --seed-box-padding-x: var(--seed-box-padding-x-md);
11641
- --seed-box-height: var(--seed-box-height-md);
11642
- --seed-box-min-height: var(--seed-box-min-height-md);
11643
- --seed-box-max-height: var(--seed-box-max-height-md);
11624
+ --seed-box-padding-x: var(--seed-box-padding-x-md, initial);
11625
+ --seed-box-height: var(--seed-box-height-md, initial);
11626
+ --seed-box-min-height: var(--seed-box-min-height-md, initial);
11627
+ --seed-box-max-height: var(--seed-box-max-height-md, initial);
11644
11628
  }
11645
11629
 
11646
11630
  .seed-skeleton {
11647
- --seed-box-width: var(--seed-box-width-md);
11648
- --seed-box-height: var(--seed-box-height-md);
11631
+ --seed-box-width: var(--seed-box-width-md, initial);
11632
+ --seed-box-height: var(--seed-box-height-md, initial);
11649
11633
  }
11650
11634
  }
11651
11635
 
11652
11636
  @media (width >= 1280px) {
11653
11637
  .seed-action-button {
11654
- --seed-box-bleed-bottom: var(--seed-box-bleed-bottom-lg);
11655
- --seed-box-bleed-top: var(--seed-box-bleed-top-lg);
11656
- --seed-box-bleed-left: var(--seed-box-bleed-left-lg);
11657
- --seed-box-bleed-right: var(--seed-box-bleed-right-lg);
11638
+ --seed-box-bleed-bottom: var(--seed-box-bleed-bottom-lg, initial);
11639
+ --seed-box-bleed-top: var(--seed-box-bleed-top-lg, initial);
11640
+ --seed-box-bleed-left: var(--seed-box-bleed-left-lg, initial);
11641
+ --seed-box-bleed-right: var(--seed-box-bleed-right-lg, initial);
11658
11642
  }
11659
11643
 
11660
11644
  .seed-bottom-sheet__body {
11661
- --seed-box-padding-x: var(--seed-box-padding-x-lg);
11662
- --seed-box-height: var(--seed-box-height-lg);
11663
- --seed-box-min-height: var(--seed-box-min-height-lg);
11664
- --seed-box-max-height: var(--seed-box-max-height-lg);
11645
+ --seed-box-padding-x: var(--seed-box-padding-x-lg, initial);
11646
+ --seed-box-height: var(--seed-box-height-lg, initial);
11647
+ --seed-box-min-height: var(--seed-box-min-height-lg, initial);
11648
+ --seed-box-max-height: var(--seed-box-max-height-lg, initial);
11665
11649
  }
11666
11650
 
11667
11651
  .seed-help-bubble__content {
11668
- --seed-box-max-width: var(--seed-box-max-width-lg);
11652
+ --seed-box-max-width: var(--seed-box-max-width-lg, initial);
11669
11653
  }
11670
11654
 
11671
11655
  .seed-list-item__prefix {
11672
- --seed-box-padding-right: var(--seed-box-padding-right-lg);
11656
+ --seed-box-padding-right: var(--seed-box-padding-right-lg, initial);
11673
11657
  }
11674
11658
 
11675
11659
  .seed-list-item__suffix {
11676
- --seed-box-gap: var(--seed-box-gap-lg);
11660
+ --seed-box-gap: var(--seed-box-gap-lg, initial);
11677
11661
  }
11678
11662
 
11679
11663
  .seed-list-item__content {
11680
- --seed-box-gap: var(--seed-box-gap-lg);
11681
- --seed-box-padding-right: var(--seed-box-padding-right-lg);
11664
+ --seed-box-gap: var(--seed-box-gap-lg, initial);
11665
+ --seed-box-padding-right: var(--seed-box-padding-right-lg, initial);
11682
11666
  }
11683
11667
 
11684
11668
  .seed-side-panel__content {
11685
- --seed-box-width: var(--seed-box-width-lg);
11686
- --seed-box-max-width: var(--seed-box-max-width-lg);
11669
+ --seed-box-width: var(--seed-box-width-lg, initial);
11670
+ --seed-box-max-width: var(--seed-box-max-width-lg, initial);
11687
11671
  }
11688
11672
 
11689
11673
  .seed-side-panel__body {
11690
- --seed-box-padding-x: var(--seed-box-padding-x-lg);
11691
- --seed-box-height: var(--seed-box-height-lg);
11692
- --seed-box-min-height: var(--seed-box-min-height-lg);
11693
- --seed-box-max-height: var(--seed-box-max-height-lg);
11674
+ --seed-box-padding-x: var(--seed-box-padding-x-lg, initial);
11675
+ --seed-box-height: var(--seed-box-height-lg, initial);
11676
+ --seed-box-min-height: var(--seed-box-min-height-lg, initial);
11677
+ --seed-box-max-height: var(--seed-box-max-height-lg, initial);
11694
11678
  }
11695
11679
 
11696
11680
  .seed-skeleton {
11697
- --seed-box-width: var(--seed-box-width-lg);
11698
- --seed-box-height: var(--seed-box-height-lg);
11681
+ --seed-box-width: var(--seed-box-width-lg, initial);
11682
+ --seed-box-height: var(--seed-box-height-lg, initial);
11699
11683
  }
11700
11684
  }
11701
11685
 
11702
11686
  @media (width >= 1440px) {
11703
11687
  .seed-action-button {
11704
- --seed-box-bleed-bottom: var(--seed-box-bleed-bottom-xl);
11705
- --seed-box-bleed-top: var(--seed-box-bleed-top-xl);
11706
- --seed-box-bleed-left: var(--seed-box-bleed-left-xl);
11707
- --seed-box-bleed-right: var(--seed-box-bleed-right-xl);
11688
+ --seed-box-bleed-bottom: var(--seed-box-bleed-bottom-xl, initial);
11689
+ --seed-box-bleed-top: var(--seed-box-bleed-top-xl, initial);
11690
+ --seed-box-bleed-left: var(--seed-box-bleed-left-xl, initial);
11691
+ --seed-box-bleed-right: var(--seed-box-bleed-right-xl, initial);
11708
11692
  }
11709
11693
 
11710
11694
  .seed-bottom-sheet__body {
11711
- --seed-box-padding-x: var(--seed-box-padding-x-xl);
11712
- --seed-box-height: var(--seed-box-height-xl);
11713
- --seed-box-min-height: var(--seed-box-min-height-xl);
11714
- --seed-box-max-height: var(--seed-box-max-height-xl);
11695
+ --seed-box-padding-x: var(--seed-box-padding-x-xl, initial);
11696
+ --seed-box-height: var(--seed-box-height-xl, initial);
11697
+ --seed-box-min-height: var(--seed-box-min-height-xl, initial);
11698
+ --seed-box-max-height: var(--seed-box-max-height-xl, initial);
11715
11699
  }
11716
11700
 
11717
11701
  .seed-help-bubble__content {
11718
- --seed-box-max-width: var(--seed-box-max-width-xl);
11702
+ --seed-box-max-width: var(--seed-box-max-width-xl, initial);
11719
11703
  }
11720
11704
 
11721
11705
  .seed-list-item__prefix {
11722
- --seed-box-padding-right: var(--seed-box-padding-right-xl);
11706
+ --seed-box-padding-right: var(--seed-box-padding-right-xl, initial);
11723
11707
  }
11724
11708
 
11725
11709
  .seed-list-item__suffix {
11726
- --seed-box-gap: var(--seed-box-gap-xl);
11710
+ --seed-box-gap: var(--seed-box-gap-xl, initial);
11727
11711
  }
11728
11712
 
11729
11713
  .seed-list-item__content {
11730
- --seed-box-gap: var(--seed-box-gap-xl);
11731
- --seed-box-padding-right: var(--seed-box-padding-right-xl);
11714
+ --seed-box-gap: var(--seed-box-gap-xl, initial);
11715
+ --seed-box-padding-right: var(--seed-box-padding-right-xl, initial);
11732
11716
  }
11733
11717
 
11734
11718
  .seed-side-panel__content {
11735
- --seed-box-width: var(--seed-box-width-xl);
11736
- --seed-box-max-width: var(--seed-box-max-width-xl);
11719
+ --seed-box-width: var(--seed-box-width-xl, initial);
11720
+ --seed-box-max-width: var(--seed-box-max-width-xl, initial);
11737
11721
  }
11738
11722
 
11739
11723
  .seed-side-panel__body {
11740
- --seed-box-padding-x: var(--seed-box-padding-x-xl);
11741
- --seed-box-height: var(--seed-box-height-xl);
11742
- --seed-box-min-height: var(--seed-box-min-height-xl);
11743
- --seed-box-max-height: var(--seed-box-max-height-xl);
11724
+ --seed-box-padding-x: var(--seed-box-padding-x-xl, initial);
11725
+ --seed-box-height: var(--seed-box-height-xl, initial);
11726
+ --seed-box-min-height: var(--seed-box-min-height-xl, initial);
11727
+ --seed-box-max-height: var(--seed-box-max-height-xl, initial);
11744
11728
  }
11745
11729
 
11746
11730
  .seed-skeleton {
11747
- --seed-box-width: var(--seed-box-width-xl);
11748
- --seed-box-height: var(--seed-box-height-xl);
11731
+ --seed-box-width: var(--seed-box-width-xl, initial);
11732
+ --seed-box-height: var(--seed-box-height-xl, initial);
11749
11733
  }
11750
11734
  }
11751
11735
  }