@plastic-js/tsumiki 0.1.50 → 0.1.52

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 (24) hide show
  1. package/dist/components/BottomSheet.js +0 -1
  2. package/dist/components/Button.js +0 -1
  3. package/dist/components/Checkbox.js +0 -1
  4. package/dist/components/Clipboard.js +0 -1
  5. package/dist/components/ColorPicker.js +1 -2
  6. package/dist/components/Combobox.js +0 -1
  7. package/dist/components/DateInput.js +1 -5
  8. package/dist/components/FilterGroup.js +9 -3
  9. package/dist/components/Input.js +0 -1
  10. package/dist/components/Listbox.js +1 -2
  11. package/dist/components/Menu.js +0 -1
  12. package/dist/components/NumberInput.js +0 -1
  13. package/dist/components/Popover.js +0 -1
  14. package/dist/components/RadioGroup.js +0 -2
  15. package/dist/components/Select.js +51 -50
  16. package/dist/components/SelectPc.js +0 -2
  17. package/dist/components/Slider.js +0 -1
  18. package/dist/components/Switch.js +0 -1
  19. package/dist/components/TagsInput.js +0 -1
  20. package/dist/components/Toggle.js +0 -1
  21. package/dist/tsumiki.css +1 -1
  22. package/docs/api.md +1 -1
  23. package/package.json +3 -3
  24. package/src/styles/reset.css +4 -0
package/dist/components/BottomSheet.js CHANGED
@@ -84,7 +84,6 @@ var grabberClass = css({
84
84
  var contentClass = css({
85
85
  display: "flex",
86
86
  flexDirection: "column",
87
- padding: "0 var(--tsu-container-padding-lg)",
88
87
  flex: 1,
89
88
  minHeight: 0
90
89
  });
package/dist/components/Button.js CHANGED
@@ -16,7 +16,6 @@ var baseClass = css({
16
16
  whiteSpace: "nowrap",
17
17
  userSelect: "none",
18
18
  touchAction: "manipulation",
19
- WebkitTapHighlightColor: "transparent",
20
19
  transition: "background-color var(--tsu-transition-fast), border-color var(--tsu-transition-fast), opacity var(--tsu-transition-fast)",
21
20
  "&:disabled": {
22
21
  backgroundColor: "var(--tsu-disabled-bg)",
package/dist/components/Checkbox.js CHANGED
@@ -60,7 +60,6 @@ var rootClass = css({
60
60
  fontFamily: "inherit",
61
61
  userSelect: "none",
62
62
  touchAction: "manipulation",
63
- WebkitTapHighlightColor: "transparent",
64
63
  scrollMargin: 0,
65
64
  "&[data-disabled]": { cursor: "not-allowed" }
66
65
  });
package/dist/components/Clipboard.js CHANGED
@@ -25,7 +25,6 @@ var baseClass = css({
25
25
  borderRadius: "var(--_cb-radius, var(--tsu-radius-l1-md))",
26
26
  fontFamily: "inherit",
27
27
  cursor: "pointer",
28
- outline: "none",
29
28
  color: "var(--tsu-neutral-9)",
30
29
  backgroundColor: "transparent",
31
30
  userSelect: "none",
package/dist/components/ColorPicker.js CHANGED
@@ -123,8 +123,7 @@ var channelInputClass = css({
123
123
  borderRadius: "var(--tsu-radius-l1-sm)",
124
124
  padding: "4px 6px",
125
125
  background: "transparent",
126
- color: "var(--tsu-fg)",
127
- outline: "none"
126
+ color: "var(--tsu-fg)"
128
127
  });
129
128
  var eyeDropperClass = css({
130
129
  fontSize: "12px",
package/dist/components/Combobox.js CHANGED
@@ -13,7 +13,6 @@ var inputClass = css({
13
13
  color: "var(--tsu-fg)",
14
14
  fontSize: "var(--tsu-comp-font-size-md)",
15
15
  fontFamily: "inherit",
16
- outline: "none",
17
16
  "&::placeholder": { color: "var(--tsu-neutral-11)" },
18
17
  "&:focus": {
19
18
  backgroundColor: "var(--tsu-focus-bg)",
package/dist/components/DateInput.js CHANGED
@@ -54,9 +54,7 @@ var triggerWrapperClass = css({
54
54
  font: "inherit",
55
55
  cursor: "pointer",
56
56
  color: "inherit",
57
- outline: "none",
58
57
  borderRadius: "10px",
59
- WebkitTapHighlightColor: "transparent",
60
58
  "&:focus-visible": { boxShadow: "0 0 0 2px var(--tsu-accent-9)" },
61
59
  "&:disabled, &[aria-disabled=\"true\"]": {
62
60
  opacity: .4,
@@ -74,7 +72,6 @@ var triggerBaseClass = css({
74
72
  border: "1px solid var(--tsu-accent-8)",
75
73
  color: "var(--tsu-fg)",
76
74
  fontFamily: "inherit",
77
- outline: "none",
78
75
  boxSizing: "border-box",
79
76
  display: "flex",
80
77
  alignItems: "center",
@@ -175,8 +172,7 @@ var toolbarBtnClass = css({
175
172
  color: "var(--tsu-accent-9)",
176
173
  fontSize: "16px",
177
174
  fontFamily: "inherit",
178
- cursor: "pointer",
179
- WebkitTapHighlightColor: "transparent"
175
+ cursor: "pointer"
180
176
  });
181
177
  var toolbarTitleClass = css({
182
178
  fontSize: "15px",
package/dist/components/FilterGroup.js CHANGED
@@ -38,7 +38,7 @@ var sizeVars = {
38
38
  }
39
39
  };
40
40
  var defaultStyle = {
41
- "--_tg-border": "var(--tsu-accent-9)",
41
+ "--_tg-border": "var(--tsu-neutral-6)",
42
42
  "--_fg-gap": "var(--tsu-spacing-sm)"
43
43
  };
44
44
  var rootClass = css({
@@ -68,9 +68,10 @@ var allClass = css({
68
68
  fontFamily: "inherit",
69
69
  cursor: "pointer",
70
70
  touchAction: "manipulation",
71
- transition: "background-color var(--tsu-transition-fast), color var(--tsu-transition-fast)",
71
+ transition: "background-color var(--tsu-transition-fast), color var(--tsu-transition-fast), border-color var(--tsu-transition-fast)",
72
72
  "&[data-state=\"on\"]": {
73
- backgroundColor: "var(--tsu-accent-9)",
73
+ backgroundColor: "var(--tsu-neutral-9)",
74
+ borderColor: "var(--tsu-neutral-9)",
74
75
  color: "var(--tsu-bg)"
75
76
  },
76
77
  "&:disabled": {
@@ -92,6 +93,11 @@ var itemClass = css({
92
93
  border: "1px solid var(--_tg-border)",
93
94
  borderRadius: "var(--tsu-radius-round)",
94
95
  flexShrink: 0,
96
+ "&[data-state=\"on\"]": {
97
+ backgroundColor: "transparent",
98
+ borderColor: "var(--tsu-accent-9)",
99
+ color: "var(--tsu-accent-11)"
100
+ },
95
101
  "&:last-child": { border: "1px solid var(--_tg-border)" }
96
102
  });
97
103
  var FilterGroup = (props = {}) => {
package/dist/components/Input.js CHANGED
@@ -92,7 +92,6 @@ var inputClass = css({
92
92
  flex: 1,
93
93
  minWidth: 0,
94
94
  border: "none",
95
- outline: "none",
96
95
  background: "transparent",
97
96
  fontFamily: "inherit",
98
97
  fontSize: "inherit",
package/dist/components/Listbox.js CHANGED
@@ -10,8 +10,7 @@ css({
10
10
  boxShadow: "var(--tsu-shadow-lg)",
11
11
  zIndex: "var(--tsu-z-dropdown)",
12
12
  overflow: "hidden",
13
- padding: "var(--tsu-spacing-xs)",
14
- outline: "none"
13
+ padding: "var(--tsu-spacing-xs)"
15
14
  });
16
15
  css({
17
16
  display: "flex",
package/dist/components/Menu.js CHANGED
@@ -12,7 +12,6 @@ var contentClass = css({
12
12
  boxShadow: "var(--tsu-shadow-lg)",
13
13
  padding: "6px",
14
14
  minWidth: "160px",
15
- outline: "none",
16
15
  display: "flex",
17
16
  flexDirection: "column",
18
17
  "&[hidden]": { display: "none" }
package/dist/components/NumberInput.js CHANGED
@@ -62,7 +62,6 @@ var inputClass = css({
62
62
  color: "var(--tsu-fg)",
63
63
  fontFamily: "inherit",
64
64
  textAlign: "center",
65
- outline: "none",
66
65
  padding: 0,
67
66
  "&:disabled": { color: "var(--tsu-disabled-fg)" }
68
67
  });
package/dist/components/Popover.js CHANGED
@@ -25,7 +25,6 @@ var contentClass = css({
25
25
  borderRadius: "var(--tsu-radius-l2-md)",
26
26
  boxShadow: "var(--tsu-shadow-lg)",
27
27
  border: "1px solid var(--tsu-neutral-6)",
28
- outline: "none",
29
28
  animation: `${popoverIn} var(--tsu-transition-fast)`
30
29
  });
31
30
  var arrowClass = css({
package/dist/components/RadioGroup.js CHANGED
@@ -26,7 +26,6 @@ var itemClass = css({
26
26
  fontSize: "var(--tsu-comp-font-size-md)",
27
27
  color: "var(--tsu-fg)",
28
28
  touchAction: "manipulation",
29
- WebkitTapHighlightColor: "transparent",
30
29
  "&:active": { backgroundColor: "transparent" },
31
30
  "&[data-disabled]": {
32
31
  color: "var(--tsu-disabled-fg)",
@@ -44,7 +43,6 @@ var itemControlClass = css({
44
43
  justifyContent: "center",
45
44
  flexShrink: 0,
46
45
  touchAction: "manipulation",
47
- WebkitTapHighlightColor: "transparent",
48
46
  transition: "border-color var(--tsu-transition-fast), background-color var(--tsu-transition-fast)",
49
47
  "&:active": { backgroundColor: "transparent" },
50
48
  "&[data-state=\"checked\"]": { borderColor: "var(--tsu-accent-9)" },
package/dist/components/Select.js CHANGED
@@ -26,9 +26,7 @@ var triggerBaseClass = css({
26
26
  color: "var(--tsu-fg)",
27
27
  fontFamily: "inherit",
28
28
  textAlign: "left",
29
- outline: "none",
30
29
  cursor: "pointer",
31
- WebkitTapHighlightColor: "transparent",
32
30
  "&:focus-visible": { borderColor: "var(--tsu-accent-9)" },
33
31
  "&[data-disabled]": {
34
32
  backgroundColor: "var(--tsu-disabled-bg)",
@@ -141,7 +139,6 @@ var filterInputClass = css({
141
139
  color: "var(--tsu-fg)",
142
140
  fontSize: "16px",
143
141
  fontFamily: "inherit",
144
- outline: "none",
145
142
  boxSizing: "border-box",
146
143
  "&:focus": { borderColor: "var(--tsu-accent-9)" },
147
144
  "&::placeholder": { color: "var(--tsu-neutral-11)" },
@@ -332,7 +329,7 @@ var Item = (props) => {
332
329
  children: jsx(Icon, mergeProps({ svg: checkSvg }))
333
330
  }))] }));
334
331
  };
335
- var Content = () => {
332
+ var List = () => {
336
333
  const ctx = useSelect();
337
334
  let filterInputEl = null;
338
335
  createEffect(() => {
@@ -342,6 +339,55 @@ var Content = () => {
342
339
  ctx.query("");
343
340
  filterInputEl?.focus();
344
341
  };
342
+ return jsx("div", mergeProps(() => part("list"), {
343
+ className: listClass,
344
+ children: [() => ctx.filter && (() => {
345
+ const _el0 = _tmpl.cloneNode(true);
346
+ const _el1 = _el0.firstChild;
347
+ const _el2 = _el0.firstChild.nextSibling;
348
+ const _el3 = _el0.firstChild.nextSibling.nextSibling;
349
+ insert(_el1, () => jsx(Icon, mergeProps({ svg: searchSvg })));
350
+ setProp(_el1, "className", () => filterIconClass);
351
+ setProp(_el2, "ref", (el) => {
352
+ filterInputEl = el;
353
+ });
354
+ setProp(_el2, "className", () => filterInputClass);
355
+ setProp(_el2, "value", () => ctx.query);
356
+ setProp(_el2, "onInput", (e) => ctx.query(e.target.value));
357
+ setProp(_el2, "onClick", (e) => e.stopPropagation());
358
+ insert(_el0, () => ctx.query() && (() => {
359
+ const _el0 = _tmpl2.cloneNode(true);
360
+ insert(_el0, () => jsx(Icon, mergeProps({ svg: xSvg })));
361
+ setProp(_el0, "className", () => filterClearClass);
362
+ setProp(_el0, "onClick", (e) => {
363
+ e.stopPropagation();
364
+ handleFilterClear();
365
+ });
366
+ return _el0;
367
+ }), _el3);
368
+ setProp(_el0, "className", () => filterWrapperClass);
369
+ return _el0;
370
+ }), () => {
371
+ const list = ctx.filter ? ctx.filteredItems() : ctx.items();
372
+ if (list.length === 0 && ctx.filter && ctx.open()) return (() => {
373
+ const _el0 = _tmpl3.cloneNode(true);
374
+ setProp(_el0, "className", () => noResultsClass);
375
+ return _el0;
376
+ })();
377
+ return jsx(Fragment, { children: jsx(Loop, mergeProps({
378
+ each: () => list,
379
+ children: (item) => jsx(Item, mergeProps({
380
+ item,
381
+ get key() {
382
+ return ctx.itemToValue(item);
383
+ }
384
+ }))
385
+ })) });
386
+ }]
387
+ }));
388
+ };
389
+ var Content = () => {
390
+ const ctx = useSelect();
345
391
  return jsx(BottomSheet, mergeProps({
346
392
  get open() {
347
393
  return ctx.open;
@@ -355,52 +401,7 @@ var Content = () => {
355
401
  return ctx.backdropStyle ?? { background: "rgba(0,0,0,0.5)" };
356
402
  },
357
403
  contentClassName: listBodyClass,
358
- children: jsx("div", mergeProps(() => part("list"), {
359
- className: listClass,
360
- children: [() => ctx.filter && (() => {
361
- const _el0 = _tmpl.cloneNode(true);
362
- const _el1 = _el0.firstChild;
363
- const _el2 = _el0.firstChild.nextSibling;
364
- const _el3 = _el0.firstChild.nextSibling.nextSibling;
365
- insert(_el1, () => jsx(Icon, mergeProps({ svg: searchSvg })));
366
- setProp(_el1, "className", () => filterIconClass);
367
- setProp(_el2, "ref", (el) => {
368
- filterInputEl = el;
369
- });
370
- setProp(_el2, "className", () => filterInputClass);
371
- setProp(_el2, "value", () => ctx.query);
372
- setProp(_el2, "onInput", (e) => ctx.query(e.target.value));
373
- setProp(_el2, "onClick", (e) => e.stopPropagation());
374
- insert(_el0, () => ctx.query() && (() => {
375
- const _el0 = _tmpl2.cloneNode(true);
376
- insert(_el0, () => jsx(Icon, mergeProps({ svg: xSvg })));
377
- setProp(_el0, "className", () => filterClearClass);
378
- setProp(_el0, "onClick", (e) => {
379
- e.stopPropagation();
380
- handleFilterClear();
381
- });
382
- return _el0;
383
- }), _el3);
384
- setProp(_el0, "className", () => filterWrapperClass);
385
- return _el0;
386
- }), () => {
387
- const list = ctx.filter ? ctx.filteredItems() : ctx.items();
388
- if (list.length === 0 && ctx.filter && ctx.open()) return (() => {
389
- const _el0 = _tmpl3.cloneNode(true);
390
- setProp(_el0, "className", () => noResultsClass);
391
- return _el0;
392
- })();
393
- return jsx(Fragment, { children: jsx(Loop, mergeProps({
394
- each: () => list,
395
- children: (item) => jsx(Item, mergeProps({
396
- item,
397
- get key() {
398
- return ctx.itemToValue(item);
399
- }
400
- }))
401
- })) });
402
- }]
403
- }))
404
+ children: jsx(List, {})
404
405
  }));
405
406
  };
406
407
  //#endregion
package/dist/components/SelectPc.js CHANGED
@@ -14,10 +14,8 @@ var triggerBaseClass = css({
14
14
  width: "100%",
15
15
  borderRadius: "var(--_trigger-radius, var(--tsu-radius-l1-md))",
16
16
  fontFamily: "inherit",
17
- outline: "none",
18
17
  appearance: "none",
19
18
  touchAction: "manipulation",
20
- WebkitTapHighlightColor: "transparent",
21
19
  transition: "background-color var(--tsu-transition-fast), border-color var(--tsu-transition-fast)",
22
20
  cursor: "pointer",
23
21
  textAlign: "start",
package/dist/components/Slider.js CHANGED
@@ -43,7 +43,6 @@ var thumbClass = css({
43
43
  border: "2px solid var(--tsu-accent-9)",
44
44
  boxShadow: "0 1px 3px rgba(0,0,0,0.4)",
45
45
  cursor: "pointer",
46
- outline: "none",
47
46
  zIndex: 2,
48
47
  transition: "box-shadow var(--tsu-transition-fast)",
49
48
  "&:focus-visible": { boxShadow: "0 0 0 3px var(--tsu-accent-3)" }
package/dist/components/Switch.js CHANGED
@@ -74,7 +74,6 @@ var rootClass = css({
74
74
  fontFamily: "inherit",
75
75
  userSelect: "none",
76
76
  touchAction: "manipulation",
77
- WebkitTapHighlightColor: "transparent",
78
77
  "&[data-disabled]": { cursor: "not-allowed" }
79
78
  });
80
79
  var controlClass = css({
package/dist/components/TagsInput.js CHANGED
@@ -57,7 +57,6 @@ var inputClass = css({
57
57
  flex: 1,
58
58
  minWidth: "80px",
59
59
  border: "none",
60
- outline: "none",
61
60
  background: "transparent",
62
61
  color: "var(--tsu-fg)",
63
62
  fontSize: "var(--tsu-comp-font-size-md)",
package/dist/components/Toggle.js CHANGED
@@ -17,7 +17,6 @@ var rootClass = css({
17
17
  cursor: "pointer",
18
18
  fontFamily: "inherit",
19
19
  touchAction: "manipulation",
20
- WebkitTapHighlightColor: "transparent",
21
20
  transition: "background-color var(--tsu-transition-fast), border-color var(--tsu-transition-fast), color var(--tsu-transition-fast)",
22
21
  "&[data-pressed]": {
23
22
  backgroundColor: "var(--tsu-accent-9)",
package/dist/tsumiki.css CHANGED
@@ -1 +1 @@
1
- :root,.light,.light-theme{--indigo-1:#fdfdfe;--indigo-2:#f7f9ff;--indigo-3:#edf2fe;--indigo-4:#e1e9ff;--indigo-5:#d2deff;--indigo-6:#c1d0ff;--indigo-7:#abbdf9;--indigo-8:#8da4ef;--indigo-9:#3e63dd;--indigo-10:#3358d4;--indigo-11:#3a5bc7;--indigo-12:#1f2d5c}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){:root,.light,.light-theme{--indigo-1:color(display-p3 .992 .992 .996);--indigo-2:color(display-p3 .971 .977 .998);--indigo-3:color(display-p3 .933 .948 .992);--indigo-4:color(display-p3 .885 .914 1);--indigo-5:color(display-p3 .831 .87 1);--indigo-6:color(display-p3 .767 .814 .995);--indigo-7:color(display-p3 .685 .74 .957);--indigo-8:color(display-p3 .569 .639 .916);--indigo-9:color(display-p3 .276 .384 .837);--indigo-10:color(display-p3 .234 .343 .801);--indigo-11:color(display-p3 .256 .354 .755);--indigo-12:color(display-p3 .133 .175 .348)}}}:root,.light,.light-theme{--indigo-a1:#00008002;--indigo-a2:#0040ff08;--indigo-a3:#0047f112;--indigo-a4:#0044ff1e;--indigo-a5:#0044ff2d;--indigo-a6:#003eff3e;--indigo-a7:#0037ed54;--indigo-a8:#0034dc72;--indigo-a9:#0031d2c1;--indigo-a10:#002ec9cc;--indigo-a11:#002bb7c5;--indigo-a12:#001046e0}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){:root,.light,.light-theme{--indigo-a1:color(display-p3 .02 .02 .51/.008);--indigo-a2:color(display-p3 .024 .161 .863/.028);--indigo-a3:color(display-p3 .008 .239 .886/.067);--indigo-a4:color(display-p3 .004 .247 1/.114);--indigo-a5:color(display-p3 .004 .235 1/.169);--indigo-a6:color(display-p3 .004 .208 .984/.232);--indigo-a7:color(display-p3 .004 .176 .863/.314);--indigo-a8:color(display-p3 .004 .165 .812/.432);--indigo-a9:color(display-p3 0 .153 .773/.726);--indigo-a10:color(display-p3 0 .137 .737/.765);--indigo-a11:color(display-p3 .256 .354 .755);--indigo-a12:color(display-p3 .133 .175 .348)}}}:root,.light,.light-theme{--olive-1:#fcfdfc;--olive-2:#f8faf8;--olive-3:#eff1ef;--olive-4:#e7e9e7;--olive-5:#dfe2df;--olive-6:#d7dad7;--olive-7:#cccfcc;--olive-8:#b9bcb8;--olive-9:#898e87;--olive-10:#7f847d;--olive-11:#60655f;--olive-12:#1d211c}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){:root,.light,.light-theme{--olive-1:color(display-p3 .989 .992 .989);--olive-2:color(display-p3 .974 .98 .973);--olive-3:color(display-p3 .939 .945 .937);--olive-4:color(display-p3 .907 .914 .905);--olive-5:color(display-p3 .878 .885 .875);--olive-6:color(display-p3 .846 .855 .843);--olive-7:color(display-p3 .803 .812 .8);--olive-8:color(display-p3 .727 .738 .723);--olive-9:color(display-p3 .541 .556 .532);--olive-10:color(display-p3 .5 .515 .491);--olive-11:color(display-p3 .38 .395 .374);--olive-12:color(display-p3 .117 .129 .111)}}}:root,.light,.light-theme{--olive-a1:#00550003;--olive-a2:#00490007;--olive-a3:#00200010;--olive-a4:#00160018;--olive-a5:#00180020;--olive-a6:#00140028;--olive-a7:#000f0033;--olive-a8:#040f0047;--olive-a9:#050f0078;--olive-a10:#040e0082;--olive-a11:#020a00a0;--olive-a12:#010600e3}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){:root,.light,.light-theme{--olive-a1:color(display-p3 .024 .349 .024/.012);--olive-a2:color(display-p3 .024 .302 .024/.028);--olive-a3:color(display-p3 .008 .129 .008/.063);--olive-a4:color(display-p3 .012 .094 .012/.095);--olive-a5:color(display-p3 .035 .098 .008/.126);--olive-a6:color(display-p3 .027 .078 .004/.157);--olive-a7:color(display-p3 .02 .059 0/.2);--olive-a8:color(display-p3 .02 .059 .004/.279);--olive-a9:color(display-p3 .02 .051 .004/.467);--olive-a10:color(display-p3 .024 .047 0/.51);--olive-a11:color(display-p3 .012 .039 0/.628);--olive-a12:color(display-p3 .008 .024 0/.891)}}}.dark,.dark-theme{--indigo-1:#11131f;--indigo-2:#141726;--indigo-3:#182449;--indigo-4:#1d2e62;--indigo-5:#253974;--indigo-6:#304384;--indigo-7:#3a4f97;--indigo-8:#435db1;--indigo-9:#3e63dd;--indigo-10:#5472e4;--indigo-11:#9eb1ff;--indigo-12:#d6e1ff}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){.dark,.dark-theme{--indigo-1:color(display-p3 .068 .074 .118);--indigo-2:color(display-p3 .081 .089 .144);--indigo-3:color(display-p3 .105 .141 .275);--indigo-4:color(display-p3 .129 .18 .369);--indigo-5:color(display-p3 .163 .22 .439);--indigo-6:color(display-p3 .203 .262 .5);--indigo-7:color(display-p3 .245 .309 .575);--indigo-8:color(display-p3 .285 .362 .674);--indigo-9:color(display-p3 .276 .384 .837);--indigo-10:color(display-p3 .354 .445 .866);--indigo-11:color(display-p3 .63 .69 1);--indigo-12:color(display-p3 .848 .881 .99)}}}.dark,.dark-theme{--indigo-a1:#1133ff0f;--indigo-a2:#3354fa17;--indigo-a3:#2f62ff3c;--indigo-a4:#3566ff57;--indigo-a5:#4171fd6b;--indigo-a6:#5178fd7c;--indigo-a7:#5a7fff90;--indigo-a8:#5b81feac;--indigo-a9:#4671ffdb;--indigo-a10:#5c7efee3;--indigo-a11:#9eb1ff;--indigo-a12:#d6e1ff}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){.dark,.dark-theme{--indigo-a1:color(display-p3 .071 .212 .996/.055);--indigo-a2:color(display-p3 .251 .345 .988/.085);--indigo-a3:color(display-p3 .243 .404 1/.223);--indigo-a4:color(display-p3 .263 .42 1/.324);--indigo-a5:color(display-p3 .314 .451 1/.4);--indigo-a6:color(display-p3 .361 .49 1/.467);--indigo-a7:color(display-p3 .388 .51 1/.547);--indigo-a8:color(display-p3 .404 .518 1/.652);--indigo-a9:color(display-p3 .318 .451 1/.824);--indigo-a10:color(display-p3 .404 .506 1/.858);--indigo-a11:color(display-p3 .63 .69 1);--indigo-a12:color(display-p3 .848 .881 .99)}}}.dark,.dark-theme{--olive-1:#111210;--olive-2:#181917;--olive-3:#212220;--olive-4:#282a27;--olive-5:#2f312e;--olive-6:#383a36;--olive-7:#454843;--olive-8:#5c625b;--olive-9:#687066;--olive-10:#767d74;--olive-11:#afb5ad;--olive-12:#eceeec}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){.dark,.dark-theme{--olive-1:color(display-p3 .067 .07 .063);--olive-2:color(display-p3 .095 .098 .091);--olive-3:color(display-p3 .131 .135 .126);--olive-4:color(display-p3 .158 .163 .153);--olive-5:color(display-p3 .186 .192 .18);--olive-6:color(display-p3 .221 .229 .215);--olive-7:color(display-p3 .273 .284 .266);--olive-8:color(display-p3 .365 .382 .359);--olive-9:color(display-p3 .414 .438 .404);--olive-10:color(display-p3 .467 .49 .458);--olive-11:color(display-p3 .69 .709 .682);--olive-12:color(display-p3 .927 .933 .926)}}}.dark,.dark-theme{--olive-a1:#0000;--olive-a2:#f1f2f008;--olive-a3:#f4f5f312;--olive-a4:#f3fef21a;--olive-a5:#f2fbf122;--olive-a6:#f4faed2c;--olive-a7:#f2fced3b;--olive-a8:#edfdeb57;--olive-a9:#ebfde766;--olive-a10:#f0fdec74;--olive-a11:#f6fef4b0;--olive-a12:#fdfffded}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){.dark,.dark-theme{--olive-a1:color(display-p3 0 0 0/0);--olive-a2:color(display-p3 .984 .988 .976/.03);--olive-a3:color(display-p3 .992 .996 .988/.068);--olive-a4:color(display-p3 .953 .996 .949/.102);--olive-a5:color(display-p3 .969 1 .965/.131);--olive-a6:color(display-p3 .973 1 .969/.169);--olive-a7:color(display-p3 .98 1 .961/.228);--olive-a8:color(display-p3 .961 1 .957/.334);--olive-a9:color(display-p3 .949 1 .922/.397);--olive-a10:color(display-p3 .953 1 .941/.452);--olive-a11:color(display-p3 .976 1 .965/.688);--olive-a12:color(display-p3 .992 1 .992/.929)}}}:root{--tsu-accent-1:var(--indigo-1);--tsu-accent-2:var(--indigo-2);--tsu-accent-3:var(--indigo-3);--tsu-accent-4:var(--indigo-4);--tsu-accent-5:var(--indigo-5);--tsu-accent-6:var(--indigo-6);--tsu-accent-7:var(--indigo-7);--tsu-accent-8:var(--indigo-8);--tsu-accent-9:var(--indigo-9);--tsu-accent-10:var(--indigo-10);--tsu-accent-11:var(--indigo-11);--tsu-accent-12:var(--indigo-12);--tsu-neutral-1:var(--olive-1);--tsu-neutral-2:var(--olive-2);--tsu-neutral-3:var(--olive-3);--tsu-neutral-4:var(--olive-4);--tsu-neutral-5:var(--olive-5);--tsu-neutral-6:var(--olive-6);--tsu-neutral-7:var(--olive-7);--tsu-neutral-8:var(--olive-8);--tsu-neutral-9:var(--olive-9);--tsu-neutral-10:var(--olive-10);--tsu-neutral-11:var(--olive-11);--tsu-neutral-12:var(--olive-12)}:root,.light,.light-theme{--red-1:#fffcfc;--red-2:#fff7f7;--red-3:#feebec;--red-4:#ffdbdc;--red-5:#ffcdce;--red-6:#fdbdbe;--red-7:#f4a9aa;--red-8:#eb8e90;--red-9:#e5484d;--red-10:#dc3e42;--red-11:#ce2c31;--red-12:#641723}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){:root,.light,.light-theme{--red-1:color(display-p3 .998 .989 .988);--red-2:color(display-p3 .995 .971 .971);--red-3:color(display-p3 .985 .925 .925);--red-4:color(display-p3 .999 .866 .866);--red-5:color(display-p3 .984 .812 .811);--red-6:color(display-p3 .955 .751 .749);--red-7:color(display-p3 .915 .675 .672);--red-8:color(display-p3 .872 .575 .572);--red-9:color(display-p3 .83 .329 .324);--red-10:color(display-p3 .798 .294 .285);--red-11:color(display-p3 .744 .234 .222);--red-12:color(display-p3 .36 .115 .143)}}}:root,.light,.light-theme{--red-a1:#ff000003;--red-a2:#ff000008;--red-a3:#f3000d14;--red-a4:#ff000824;--red-a5:#ff000632;--red-a6:#f8000442;--red-a7:#df000356;--red-a8:#d2000571;--red-a9:#db0007b7;--red-a10:#d10005c1;--red-a11:#c40006d3;--red-a12:#55000de8}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){:root,.light,.light-theme{--red-a1:color(display-p3 .675 .024 .024/.012);--red-a2:color(display-p3 .863 .024 .024/.028);--red-a3:color(display-p3 .792 .008 .008/.075);--red-a4:color(display-p3 1 .008 .008/.134);--red-a5:color(display-p3 .918 .008 .008/.189);--red-a6:color(display-p3 .831 .02 .004/.251);--red-a7:color(display-p3 .741 .016 .004/.33);--red-a8:color(display-p3 .698 .012 .004/.428);--red-a9:color(display-p3 .749 .008 0/.675);--red-a10:color(display-p3 .714 .012 0/.714);--red-a11:color(display-p3 .744 .234 .222);--red-a12:color(display-p3 .36 .115 .143)}}}.dark,.dark-theme{--red-1:#191111;--red-2:#201314;--red-3:#3b1219;--red-4:#500f1c;--red-5:#611623;--red-6:#72232d;--red-7:#8c333a;--red-8:#b54548;--red-9:#e5484d;--red-10:#ec5d5e;--red-11:#ff9592;--red-12:#ffd1d9}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){.dark,.dark-theme{--red-1:color(display-p3 .093 .068 .067);--red-2:color(display-p3 .118 .077 .079);--red-3:color(display-p3 .211 .081 .099);--red-4:color(display-p3 .287 .079 .113);--red-5:color(display-p3 .348 .11 .142);--red-6:color(display-p3 .414 .16 .183);--red-7:color(display-p3 .508 .224 .236);--red-8:color(display-p3 .659 .298 .297);--red-9:color(display-p3 .83 .329 .324);--red-10:color(display-p3 .861 .403 .387);--red-11:color(display-p3 1 .57 .55);--red-12:color(display-p3 .971 .826 .852)}}}.dark,.dark-theme{--red-a1:#f4121209;--red-a2:#f22f3e11;--red-a3:#ff173f2d;--red-a4:#fe0a3b44;--red-a5:#ff204756;--red-a6:#ff3e5668;--red-a7:#ff536184;--red-a8:#ff5d61b0;--red-a9:#fe4e54e4;--red-a10:#ff6465eb;--red-a11:#ff9592;--red-a12:#ffd1d9}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){.dark,.dark-theme{--red-a1:color(display-p3 .984 .071 .071/.03);--red-a2:color(display-p3 .996 .282 .282/.055);--red-a3:color(display-p3 1 .169 .271/.156);--red-a4:color(display-p3 1 .118 .267/.236);--red-a5:color(display-p3 1 .212 .314/.303);--red-a6:color(display-p3 1 .318 .38/.374);--red-a7:color(display-p3 1 .4 .424/.475);--red-a8:color(display-p3 1 .431 .431/.635);--red-a9:color(display-p3 1 .388 .384/.82);--red-a10:color(display-p3 1 .463 .447/.853);--red-a11:color(display-p3 1 .57 .55);--red-a12:color(display-p3 .971 .826 .852)}}}:root,.light,.light-theme{--green-1:#fbfefc;--green-2:#f4fbf6;--green-3:#e6f6eb;--green-4:#d6f1df;--green-5:#c4e8d1;--green-6:#adddc0;--green-7:#8eceaa;--green-8:#5bb98b;--green-9:#30a46c;--green-10:#2b9a66;--green-11:#218358;--green-12:#193b2d}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){:root,.light,.light-theme{--green-1:color(display-p3 .986 .996 .989);--green-2:color(display-p3 .963 .983 .967);--green-3:color(display-p3 .913 .964 .925);--green-4:color(display-p3 .859 .94 .879);--green-5:color(display-p3 .796 .907 .826);--green-6:color(display-p3 .718 .863 .761);--green-7:color(display-p3 .61 .801 .675);--green-8:color(display-p3 .451 .715 .559);--green-9:color(display-p3 .332 .634 .442);--green-10:color(display-p3 .308 .595 .417);--green-11:color(display-p3 .19 .5 .32);--green-12:color(display-p3 .132 .228 .18)}}}:root,.light,.light-theme{--green-a1:#00c04004;--green-a2:#00a32f0b;--green-a3:#00a43319;--green-a4:#00a83829;--green-a5:#019c393b;--green-a6:#00963c52;--green-a7:#00914071;--green-a8:#00924ba4;--green-a9:#008f4acf;--green-a10:#008647d4;--green-a11:#00713fde;--green-a12:#002616e6}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){:root,.light,.light-theme{--green-a1:color(display-p3 .024 .757 .267/.016);--green-a2:color(display-p3 .024 .565 .129/.036);--green-a3:color(display-p3 .012 .596 .145/.087);--green-a4:color(display-p3 .008 .588 .145/.142);--green-a5:color(display-p3 .004 .541 .157/.204);--green-a6:color(display-p3 .004 .518 .157/.283);--green-a7:color(display-p3 .004 .486 .165/.389);--green-a8:color(display-p3 0 .478 .2/.55);--green-a9:color(display-p3 0 .455 .165/.667);--green-a10:color(display-p3 0 .416 .153/.691);--green-a11:color(display-p3 .19 .5 .32);--green-a12:color(display-p3 .132 .228 .18)}}}.dark,.dark-theme{--green-1:#0e1512;--green-2:#121b17;--green-3:#132d21;--green-4:#113b29;--green-5:#174933;--green-6:#20573e;--green-7:#28684a;--green-8:#2f7c57;--green-9:#30a46c;--green-10:#33b074;--green-11:#3dd68c;--green-12:#b1f1cb}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){.dark,.dark-theme{--green-1:color(display-p3 .062 .083 .071);--green-2:color(display-p3 .079 .106 .09);--green-3:color(display-p3 .1 .173 .133);--green-4:color(display-p3 .115 .229 .166);--green-5:color(display-p3 .147 .282 .206);--green-6:color(display-p3 .185 .338 .25);--green-7:color(display-p3 .227 .403 .298);--green-8:color(display-p3 .27 .479 .351);--green-9:color(display-p3 .332 .634 .442);--green-10:color(display-p3 .357 .682 .474);--green-11:color(display-p3 .434 .828 .573);--green-12:color(display-p3 .747 .938 .807)}}}.dark,.dark-theme{--green-a1:#00de4505;--green-a2:#29f99d0b;--green-a3:#22ff991e;--green-a4:#11ff992d;--green-a5:#2bffa23c;--green-a6:#44ffaa4b;--green-a7:#50fdac5e;--green-a8:#54ffad73;--green-a9:#44ffa49e;--green-a10:#43fea4ab;--green-a11:#46fea5d4;--green-a12:#bbffd7f0}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){.dark,.dark-theme{--green-a1:color(display-p3 0 .992 .298/.017);--green-a2:color(display-p3 .341 .98 .616/.043);--green-a3:color(display-p3 .376 .996 .655/.114);--green-a4:color(display-p3 .341 .996 .635/.173);--green-a5:color(display-p3 .408 1 .678/.232);--green-a6:color(display-p3 .475 1 .706/.29);--green-a7:color(display-p3 .514 1 .706/.362);--green-a8:color(display-p3 .529 1 .718/.442);--green-a9:color(display-p3 .502 .996 .682/.61);--green-a10:color(display-p3 .506 1 .682/.66);--green-a11:color(display-p3 .434 .828 .573);--green-a12:color(display-p3 .747 .938 .807)}}}:root,.light,.light-theme{--amber-1:#fefdfb;--amber-2:#fefbe9;--amber-3:#fff7c2;--amber-4:#ffee9c;--amber-5:#fbe577;--amber-6:#f3d673;--amber-7:#e9c162;--amber-8:#e2a336;--amber-9:#ffc53d;--amber-10:#ffba18;--amber-11:#ab6400;--amber-12:#4f3422}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){:root,.light,.light-theme{--amber-1:color(display-p3 .995 .992 .985);--amber-2:color(display-p3 .994 .986 .921);--amber-3:color(display-p3 .994 .969 .782);--amber-4:color(display-p3 .989 .937 .65);--amber-5:color(display-p3 .97 .902 .527);--amber-6:color(display-p3 .936 .844 .506);--amber-7:color(display-p3 .89 .762 .443);--amber-8:color(display-p3 .85 .65 .3);--amber-9:color(display-p3 1 .77 .26);--amber-10:color(display-p3 .959 .741 .274);--amber-11:color(display-p3 .64 .4 0);--amber-12:color(display-p3 .294 .208 .145)}}}:root,.light,.light-theme{--amber-a1:#c0800004;--amber-a2:#f4d10016;--amber-a3:#ffde003d;--amber-a4:#ffd40063;--amber-a5:#f8cf0088;--amber-a6:#eab5008c;--amber-a7:#dc9b009d;--amber-a8:#da8a00c9;--amber-a9:#ffb300c2;--amber-a10:#ffb300e7;--amber-a11:#ab6400;--amber-a12:#341500dd}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){:root,.light,.light-theme{--amber-a1:color(display-p3 .757 .514 .024/.016);--amber-a2:color(display-p3 .902 .804 .008/.079);--amber-a3:color(display-p3 .965 .859 .004/.22);--amber-a4:color(display-p3 .969 .82 .004/.35);--amber-a5:color(display-p3 .933 .796 .004/.475);--amber-a6:color(display-p3 .875 .682 .004/.495);--amber-a7:color(display-p3 .804 .573 0/.557);--amber-a8:color(display-p3 .788 .502 0/.699);--amber-a9:color(display-p3 1 .686 0/.742);--amber-a10:color(display-p3 .945 .643 0/.726);--amber-a11:color(display-p3 .64 .4 0);--amber-a12:color(display-p3 .294 .208 .145)}}}.dark,.dark-theme{--amber-1:#16120c;--amber-2:#1d180f;--amber-3:#302008;--amber-4:#3f2700;--amber-5:#4d3000;--amber-6:#5c3d05;--amber-7:#714f19;--amber-8:#8f6424;--amber-9:#ffc53d;--amber-10:#ffd60a;--amber-11:#ffca16;--amber-12:#ffe7b3}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){.dark,.dark-theme{--amber-1:color(display-p3 .082 .07 .05);--amber-2:color(display-p3 .111 .094 .064);--amber-3:color(display-p3 .178 .128 .049);--amber-4:color(display-p3 .239 .156 0);--amber-5:color(display-p3 .29 .193 0);--amber-6:color(display-p3 .344 .245 .076);--amber-7:color(display-p3 .422 .314 .141);--amber-8:color(display-p3 .535 .399 .189);--amber-9:color(display-p3 1 .77 .26);--amber-10:color(display-p3 1 .87 .15);--amber-11:color(display-p3 1 .8 .29);--amber-12:color(display-p3 .984 .909 .726)}}}.dark,.dark-theme{--amber-a1:#e63c0006;--amber-a2:#fd9b000d;--amber-a3:#fa820022;--amber-a4:#fc820032;--amber-a5:#fd8b0041;--amber-a6:#fd9b0051;--amber-a7:#ffab2567;--amber-a8:#ffae3587;--amber-a9:#ffc53d;--amber-a10:#ffd60a;--amber-a11:#ffca16;--amber-a12:#ffe7b3}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){.dark,.dark-theme{--amber-a1:color(display-p3 .992 .298 0/.017);--amber-a2:color(display-p3 .988 .651 0/.047);--amber-a3:color(display-p3 1 .6 0/.118);--amber-a4:color(display-p3 1 .557 0/.185);--amber-a5:color(display-p3 1 .592 0/.24);--amber-a6:color(display-p3 1 .659 .094/.299);--amber-a7:color(display-p3 1 .714 .263/.383);--amber-a8:color(display-p3 .996 .729 .306/.5);--amber-a9:color(display-p3 1 .769 .259);--amber-a10:color(display-p3 1 .871 .149);--amber-a11:color(display-p3 1 .8 .29);--amber-a12:color(display-p3 .984 .909 .726)}}}:root{--tsu-bg:var(--tsu-neutral-1);--tsu-fg:var(--tsu-neutral-12);--tsu-surface:var(--tsu-neutral-2);--tsu-surface-raised:var(--tsu-neutral-3);--tsu-surface-raised-hover:var(--tsu-neutral-4);--tsu-color-pressed:var(--tsu-surface-raised);--tsu-color-pressed-accent:var(--tsu-accent-3);--tsu-color-muted:var(--tsu-neutral-alpha-7);--tsu-color-muted-subtle:var(--tsu-neutral-alpha-5);--tsu-info-1:var(--tsu-accent-1);--tsu-info-2:var(--tsu-accent-2);--tsu-info-3:var(--tsu-accent-3);--tsu-info-4:var(--tsu-accent-4);--tsu-info-5:var(--tsu-accent-5);--tsu-info-6:var(--tsu-accent-6);--tsu-info-7:var(--tsu-accent-7);--tsu-info-8:var(--tsu-accent-8);--tsu-info-9:var(--tsu-accent-9);--tsu-info-10:var(--tsu-accent-10);--tsu-info-11:var(--tsu-accent-11);--tsu-info-12:var(--tsu-accent-12);--tsu-danger-1:var(--red-1);--tsu-danger-2:var(--red-2);--tsu-danger-3:var(--red-3);--tsu-danger-4:var(--red-4);--tsu-danger-5:var(--red-5);--tsu-danger-6:var(--red-6);--tsu-danger-7:var(--red-7);--tsu-danger-8:var(--red-8);--tsu-danger-9:var(--red-9);--tsu-danger-10:var(--red-10);--tsu-danger-11:var(--red-11);--tsu-danger-12:var(--red-12);--tsu-success-1:var(--green-1);--tsu-success-2:var(--green-2);--tsu-success-3:var(--green-3);--tsu-success-4:var(--green-4);--tsu-success-5:var(--green-5);--tsu-success-6:var(--green-6);--tsu-success-7:var(--green-7);--tsu-success-8:var(--green-8);--tsu-success-9:var(--green-9);--tsu-success-10:var(--green-10);--tsu-success-11:var(--green-11);--tsu-success-12:var(--green-12);--tsu-warning-1:var(--amber-1);--tsu-warning-2:var(--amber-2);--tsu-warning-3:var(--amber-3);--tsu-warning-4:var(--amber-4);--tsu-warning-5:var(--amber-5);--tsu-warning-6:var(--amber-6);--tsu-warning-7:var(--amber-7);--tsu-warning-8:var(--amber-8);--tsu-warning-9:var(--amber-9);--tsu-warning-10:var(--amber-10);--tsu-warning-11:var(--amber-11);--tsu-warning-12:var(--amber-12);--tsu-neutral-alpha-1:var(--olive-a1);--tsu-neutral-alpha-2:var(--olive-a2);--tsu-neutral-alpha-3:var(--olive-a3);--tsu-neutral-alpha-4:var(--olive-a4);--tsu-neutral-alpha-5:var(--olive-a5);--tsu-neutral-alpha-6:var(--olive-a6);--tsu-neutral-alpha-7:var(--olive-a7);--tsu-neutral-alpha-8:var(--olive-a8);--tsu-neutral-alpha-9:var(--olive-a9);--tsu-neutral-alpha-10:var(--olive-a10);--tsu-neutral-alpha-11:var(--olive-a11);--tsu-neutral-alpha-12:var(--olive-a12);--tsu-disabled-bg:var(--tsu-surface-raised);--tsu-disabled-fg:var(--tsu-neutral-9);--tsu-disabled-border:var(--tsu-neutral-7);--tsu-focus-bg:var(--tsu-surface-raised-hover);--tsu-focus-border:var(--tsu-accent-8);--ink:var(--tsu-fg);--muted:var(--tsu-neutral-11);--accent:var(--tsu-accent-9);--surface:var(--tsu-bg);--bg:var(--tsu-neutral-2);--border:var(--tsu-neutral-7);--danger:var(--tsu-danger-9)}:root.dark{--tsu-fg:#fff}:root{--tsu-radius-round:9999px;--tsu-radius-l3-xs:14px;--tsu-radius-l2-xs:6px;--tsu-radius-l1-xs:2px;--tsu-radius-l3-sm:14px;--tsu-radius-l2-sm:6px;--tsu-radius-l1-sm:2px;--tsu-radius-l3-md:16px;--tsu-radius-l2-md:8px;--tsu-radius-l1-md:4px;--tsu-radius-l3-lg:18px;--tsu-radius-l2-lg:10px;--tsu-radius-l1-lg:6px;--tsu-radius-l3-xl:20px;--tsu-radius-l2-xl:12px;--tsu-radius-l1-xl:8px;--tsu-radius-l3-xxl:28px;--tsu-radius-l2-xxl:20px;--tsu-radius-l1-xxl:16px;--tsu-level-primary-xs:32px;--tsu-level-primary-sm:36px;--tsu-level-primary-md:40px;--tsu-level-primary-lg:44px;--tsu-level-primary-xl:48px;--tsu-level-primary-xxl:64px;--tsu-level-secondary-xs:16px;--tsu-level-secondary-sm:18px;--tsu-level-secondary-md:20px;--tsu-level-secondary-lg:22px;--tsu-level-secondary-xl:24px;--tsu-level-secondary-xxl:32px;--tsu-comp-height-xs:var(--tsu-level-primary-xs);--tsu-comp-height-sm:var(--tsu-level-primary-sm);--tsu-comp-height-md:var(--tsu-level-primary-md);--tsu-comp-height-lg:var(--tsu-level-primary-lg);--tsu-comp-height-xl:var(--tsu-level-primary-xl);--tsu-comp-height-xxl:var(--tsu-level-primary-xxl);--tsu-comp-font-size-xs:12px;--tsu-comp-font-size-sm:14px;--tsu-comp-font-size-md:14px;--tsu-comp-font-size-lg:16px;--tsu-comp-font-size-xl:18px;--tsu-comp-font-size-xxl:20px;--tsu-comp-line-height-xs:16px;--tsu-comp-line-height-sm:20px;--tsu-comp-line-height-md:20px;--tsu-comp-line-height-lg:24px;--tsu-comp-line-height-xl:28px;--tsu-comp-line-height-xxl:30px;--tsu-comp-padding-y-xs:7px;--tsu-comp-padding-y-sm:7px;--tsu-comp-padding-y-md:9px;--tsu-comp-padding-y-lg:9px;--tsu-comp-padding-y-xl:9px;--tsu-comp-padding-y-xxl:16px;--tsu-comp-padding-x-xs:8px;--tsu-comp-padding-x-sm:12px;--tsu-comp-padding-x-md:16px;--tsu-comp-padding-x-lg:20px;--tsu-comp-padding-x-xl:24px;--tsu-comp-padding-x-xxl:32px;--tsu-comp-secondary-height-xs:var(--tsu-level-secondary-xs);--tsu-comp-secondary-height-sm:var(--tsu-level-secondary-sm);--tsu-comp-secondary-height-md:var(--tsu-level-secondary-md);--tsu-comp-secondary-height-lg:var(--tsu-level-secondary-lg);--tsu-comp-secondary-height-xl:var(--tsu-level-secondary-xl);--tsu-comp-secondary-height-xxl:var(--tsu-level-secondary-xxl);--tsu-font-size-xs:10px;--tsu-font-size-sm:12px;--tsu-font-size-md:14px;--tsu-font-size-lg:16px;--tsu-font-size-xl:20px;--tsu-font-size-xxl:24px;--tsu-font-weight-regular:400;--tsu-font-weight-medium:500;--tsu-font-weight-semibold:600;--tsu-text-title-size:var(--tsu-font-size-lg);--tsu-text-title-weight:var(--tsu-font-weight-semibold);--tsu-text-title-line-height:24px;--tsu-text-body-size:var(--tsu-font-size-md);--tsu-text-body-weight:var(--tsu-font-weight-regular);--tsu-text-body-line-height:20px;--tsu-text-label-size:var(--tsu-font-size-md);--tsu-text-label-weight:var(--tsu-font-weight-medium);--tsu-text-label-line-height:20px;--tsu-text-caption-size:var(--tsu-font-size-sm);--tsu-text-caption-weight:var(--tsu-font-weight-regular);--tsu-text-caption-line-height:16px;--tsu-spacing-xxs:2px;--tsu-spacing-xs:4px;--tsu-spacing-sm:8px;--tsu-spacing-md:12px;--tsu-spacing-lg:16px;--tsu-spacing-xl:24px;--tsu-spacing-xxl:32px;--tsu-duration-fast:.15s;--tsu-duration-normal:.25s;--tsu-duration-overlay-enter:.35s;--tsu-duration-overlay-exit:.2s;--tsu-ease-standard:cubic-bezier(.2, 0, 0, 1);--tsu-ease-out:cubic-bezier(.32, .72, 0, 1);--tsu-ease-in:cubic-bezier(.4, 0, 1, 1);--tsu-transition-fast:var(--tsu-duration-fast) var(--tsu-ease-standard);--tsu-transition-normal:var(--tsu-duration-normal) var(--tsu-ease-standard);--tsu-transition-overlay-enter:var(--tsu-duration-overlay-enter) var(--tsu-ease-out);--tsu-transition-overlay-exit:var(--tsu-duration-overlay-exit) var(--tsu-ease-in);--tsu-transition-overlay:var(--tsu-transition-overlay-enter);--tsu-shadow-sm:0 1px 2px var(--tsu-neutral-alpha-6), 0 2px 4px var(--tsu-neutral-alpha-7);--tsu-shadow-md:0 1px 3px var(--tsu-neutral-alpha-6), 0 4px 16px var(--tsu-neutral-alpha-8);--tsu-shadow-lg:0 2px 6px var(--tsu-neutral-alpha-6), 0 12px 32px var(--tsu-neutral-alpha-10);--tsu-font-family:system-ui, -apple-system, sans-serif;--tsu-line-height:1.5;--tsu-container-padding-sm:12px;--tsu-container-padding-md:16px;--tsu-container-padding-lg:24px;--tsu-container-padding-xl:32px;--tsu-z-base:0;--tsu-z-dropdown:100;--tsu-z-modal:200;--tsu-z-toast:300}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:none;-moz-text-size-adjust:none;text-size-adjust:none}*{-webkit-tap-highlight-color:#0000;margin:0;padding:0}body{min-height:100vh;font-family:var(--tsu-font-family);font-size:var(--tsu-font-size-md);line-height:var(--tsu-line-height);color:var(--tsu-fg);background-color:var(--tsu-bg);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}img,picture,video,canvas,svg{max-inline-size:100%;display:block}input,button,textarea,select{font:inherit;color:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}p{text-wrap:pretty}h1,h2,h3,h4,h5,h6{text-wrap:balance;font-weight:var(--tsu-font-weight-semibold)}a{color:inherit;text-decoration:none}textarea:not([rows]){min-height:10em}:target{scroll-margin-block:5ex}:where(ul,ol){list-style:none}:where(table){border-collapse:collapse;border-spacing:0}:where(button){appearance:none;cursor:pointer;background:0 0;border:none}:where([hidden]){display:none}input[type=search]::-webkit-search-cancel-button{display:none}input[type=search]::-ms-clear{display:none}
1
+ :root,.light,.light-theme{--indigo-1:#fdfdfe;--indigo-2:#f7f9ff;--indigo-3:#edf2fe;--indigo-4:#e1e9ff;--indigo-5:#d2deff;--indigo-6:#c1d0ff;--indigo-7:#abbdf9;--indigo-8:#8da4ef;--indigo-9:#3e63dd;--indigo-10:#3358d4;--indigo-11:#3a5bc7;--indigo-12:#1f2d5c}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){:root,.light,.light-theme{--indigo-1:color(display-p3 .992 .992 .996);--indigo-2:color(display-p3 .971 .977 .998);--indigo-3:color(display-p3 .933 .948 .992);--indigo-4:color(display-p3 .885 .914 1);--indigo-5:color(display-p3 .831 .87 1);--indigo-6:color(display-p3 .767 .814 .995);--indigo-7:color(display-p3 .685 .74 .957);--indigo-8:color(display-p3 .569 .639 .916);--indigo-9:color(display-p3 .276 .384 .837);--indigo-10:color(display-p3 .234 .343 .801);--indigo-11:color(display-p3 .256 .354 .755);--indigo-12:color(display-p3 .133 .175 .348)}}}:root,.light,.light-theme{--indigo-a1:#00008002;--indigo-a2:#0040ff08;--indigo-a3:#0047f112;--indigo-a4:#0044ff1e;--indigo-a5:#0044ff2d;--indigo-a6:#003eff3e;--indigo-a7:#0037ed54;--indigo-a8:#0034dc72;--indigo-a9:#0031d2c1;--indigo-a10:#002ec9cc;--indigo-a11:#002bb7c5;--indigo-a12:#001046e0}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){:root,.light,.light-theme{--indigo-a1:color(display-p3 .02 .02 .51/.008);--indigo-a2:color(display-p3 .024 .161 .863/.028);--indigo-a3:color(display-p3 .008 .239 .886/.067);--indigo-a4:color(display-p3 .004 .247 1/.114);--indigo-a5:color(display-p3 .004 .235 1/.169);--indigo-a6:color(display-p3 .004 .208 .984/.232);--indigo-a7:color(display-p3 .004 .176 .863/.314);--indigo-a8:color(display-p3 .004 .165 .812/.432);--indigo-a9:color(display-p3 0 .153 .773/.726);--indigo-a10:color(display-p3 0 .137 .737/.765);--indigo-a11:color(display-p3 .256 .354 .755);--indigo-a12:color(display-p3 .133 .175 .348)}}}:root,.light,.light-theme{--olive-1:#fcfdfc;--olive-2:#f8faf8;--olive-3:#eff1ef;--olive-4:#e7e9e7;--olive-5:#dfe2df;--olive-6:#d7dad7;--olive-7:#cccfcc;--olive-8:#b9bcb8;--olive-9:#898e87;--olive-10:#7f847d;--olive-11:#60655f;--olive-12:#1d211c}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){:root,.light,.light-theme{--olive-1:color(display-p3 .989 .992 .989);--olive-2:color(display-p3 .974 .98 .973);--olive-3:color(display-p3 .939 .945 .937);--olive-4:color(display-p3 .907 .914 .905);--olive-5:color(display-p3 .878 .885 .875);--olive-6:color(display-p3 .846 .855 .843);--olive-7:color(display-p3 .803 .812 .8);--olive-8:color(display-p3 .727 .738 .723);--olive-9:color(display-p3 .541 .556 .532);--olive-10:color(display-p3 .5 .515 .491);--olive-11:color(display-p3 .38 .395 .374);--olive-12:color(display-p3 .117 .129 .111)}}}:root,.light,.light-theme{--olive-a1:#00550003;--olive-a2:#00490007;--olive-a3:#00200010;--olive-a4:#00160018;--olive-a5:#00180020;--olive-a6:#00140028;--olive-a7:#000f0033;--olive-a8:#040f0047;--olive-a9:#050f0078;--olive-a10:#040e0082;--olive-a11:#020a00a0;--olive-a12:#010600e3}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){:root,.light,.light-theme{--olive-a1:color(display-p3 .024 .349 .024/.012);--olive-a2:color(display-p3 .024 .302 .024/.028);--olive-a3:color(display-p3 .008 .129 .008/.063);--olive-a4:color(display-p3 .012 .094 .012/.095);--olive-a5:color(display-p3 .035 .098 .008/.126);--olive-a6:color(display-p3 .027 .078 .004/.157);--olive-a7:color(display-p3 .02 .059 0/.2);--olive-a8:color(display-p3 .02 .059 .004/.279);--olive-a9:color(display-p3 .02 .051 .004/.467);--olive-a10:color(display-p3 .024 .047 0/.51);--olive-a11:color(display-p3 .012 .039 0/.628);--olive-a12:color(display-p3 .008 .024 0/.891)}}}.dark,.dark-theme{--indigo-1:#11131f;--indigo-2:#141726;--indigo-3:#182449;--indigo-4:#1d2e62;--indigo-5:#253974;--indigo-6:#304384;--indigo-7:#3a4f97;--indigo-8:#435db1;--indigo-9:#3e63dd;--indigo-10:#5472e4;--indigo-11:#9eb1ff;--indigo-12:#d6e1ff}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){.dark,.dark-theme{--indigo-1:color(display-p3 .068 .074 .118);--indigo-2:color(display-p3 .081 .089 .144);--indigo-3:color(display-p3 .105 .141 .275);--indigo-4:color(display-p3 .129 .18 .369);--indigo-5:color(display-p3 .163 .22 .439);--indigo-6:color(display-p3 .203 .262 .5);--indigo-7:color(display-p3 .245 .309 .575);--indigo-8:color(display-p3 .285 .362 .674);--indigo-9:color(display-p3 .276 .384 .837);--indigo-10:color(display-p3 .354 .445 .866);--indigo-11:color(display-p3 .63 .69 1);--indigo-12:color(display-p3 .848 .881 .99)}}}.dark,.dark-theme{--indigo-a1:#1133ff0f;--indigo-a2:#3354fa17;--indigo-a3:#2f62ff3c;--indigo-a4:#3566ff57;--indigo-a5:#4171fd6b;--indigo-a6:#5178fd7c;--indigo-a7:#5a7fff90;--indigo-a8:#5b81feac;--indigo-a9:#4671ffdb;--indigo-a10:#5c7efee3;--indigo-a11:#9eb1ff;--indigo-a12:#d6e1ff}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){.dark,.dark-theme{--indigo-a1:color(display-p3 .071 .212 .996/.055);--indigo-a2:color(display-p3 .251 .345 .988/.085);--indigo-a3:color(display-p3 .243 .404 1/.223);--indigo-a4:color(display-p3 .263 .42 1/.324);--indigo-a5:color(display-p3 .314 .451 1/.4);--indigo-a6:color(display-p3 .361 .49 1/.467);--indigo-a7:color(display-p3 .388 .51 1/.547);--indigo-a8:color(display-p3 .404 .518 1/.652);--indigo-a9:color(display-p3 .318 .451 1/.824);--indigo-a10:color(display-p3 .404 .506 1/.858);--indigo-a11:color(display-p3 .63 .69 1);--indigo-a12:color(display-p3 .848 .881 .99)}}}.dark,.dark-theme{--olive-1:#111210;--olive-2:#181917;--olive-3:#212220;--olive-4:#282a27;--olive-5:#2f312e;--olive-6:#383a36;--olive-7:#454843;--olive-8:#5c625b;--olive-9:#687066;--olive-10:#767d74;--olive-11:#afb5ad;--olive-12:#eceeec}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){.dark,.dark-theme{--olive-1:color(display-p3 .067 .07 .063);--olive-2:color(display-p3 .095 .098 .091);--olive-3:color(display-p3 .131 .135 .126);--olive-4:color(display-p3 .158 .163 .153);--olive-5:color(display-p3 .186 .192 .18);--olive-6:color(display-p3 .221 .229 .215);--olive-7:color(display-p3 .273 .284 .266);--olive-8:color(display-p3 .365 .382 .359);--olive-9:color(display-p3 .414 .438 .404);--olive-10:color(display-p3 .467 .49 .458);--olive-11:color(display-p3 .69 .709 .682);--olive-12:color(display-p3 .927 .933 .926)}}}.dark,.dark-theme{--olive-a1:#0000;--olive-a2:#f1f2f008;--olive-a3:#f4f5f312;--olive-a4:#f3fef21a;--olive-a5:#f2fbf122;--olive-a6:#f4faed2c;--olive-a7:#f2fced3b;--olive-a8:#edfdeb57;--olive-a9:#ebfde766;--olive-a10:#f0fdec74;--olive-a11:#f6fef4b0;--olive-a12:#fdfffded}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){.dark,.dark-theme{--olive-a1:color(display-p3 0 0 0/0);--olive-a2:color(display-p3 .984 .988 .976/.03);--olive-a3:color(display-p3 .992 .996 .988/.068);--olive-a4:color(display-p3 .953 .996 .949/.102);--olive-a5:color(display-p3 .969 1 .965/.131);--olive-a6:color(display-p3 .973 1 .969/.169);--olive-a7:color(display-p3 .98 1 .961/.228);--olive-a8:color(display-p3 .961 1 .957/.334);--olive-a9:color(display-p3 .949 1 .922/.397);--olive-a10:color(display-p3 .953 1 .941/.452);--olive-a11:color(display-p3 .976 1 .965/.688);--olive-a12:color(display-p3 .992 1 .992/.929)}}}:root{--tsu-accent-1:var(--indigo-1);--tsu-accent-2:var(--indigo-2);--tsu-accent-3:var(--indigo-3);--tsu-accent-4:var(--indigo-4);--tsu-accent-5:var(--indigo-5);--tsu-accent-6:var(--indigo-6);--tsu-accent-7:var(--indigo-7);--tsu-accent-8:var(--indigo-8);--tsu-accent-9:var(--indigo-9);--tsu-accent-10:var(--indigo-10);--tsu-accent-11:var(--indigo-11);--tsu-accent-12:var(--indigo-12);--tsu-neutral-1:var(--olive-1);--tsu-neutral-2:var(--olive-2);--tsu-neutral-3:var(--olive-3);--tsu-neutral-4:var(--olive-4);--tsu-neutral-5:var(--olive-5);--tsu-neutral-6:var(--olive-6);--tsu-neutral-7:var(--olive-7);--tsu-neutral-8:var(--olive-8);--tsu-neutral-9:var(--olive-9);--tsu-neutral-10:var(--olive-10);--tsu-neutral-11:var(--olive-11);--tsu-neutral-12:var(--olive-12)}:root,.light,.light-theme{--red-1:#fffcfc;--red-2:#fff7f7;--red-3:#feebec;--red-4:#ffdbdc;--red-5:#ffcdce;--red-6:#fdbdbe;--red-7:#f4a9aa;--red-8:#eb8e90;--red-9:#e5484d;--red-10:#dc3e42;--red-11:#ce2c31;--red-12:#641723}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){:root,.light,.light-theme{--red-1:color(display-p3 .998 .989 .988);--red-2:color(display-p3 .995 .971 .971);--red-3:color(display-p3 .985 .925 .925);--red-4:color(display-p3 .999 .866 .866);--red-5:color(display-p3 .984 .812 .811);--red-6:color(display-p3 .955 .751 .749);--red-7:color(display-p3 .915 .675 .672);--red-8:color(display-p3 .872 .575 .572);--red-9:color(display-p3 .83 .329 .324);--red-10:color(display-p3 .798 .294 .285);--red-11:color(display-p3 .744 .234 .222);--red-12:color(display-p3 .36 .115 .143)}}}:root,.light,.light-theme{--red-a1:#ff000003;--red-a2:#ff000008;--red-a3:#f3000d14;--red-a4:#ff000824;--red-a5:#ff000632;--red-a6:#f8000442;--red-a7:#df000356;--red-a8:#d2000571;--red-a9:#db0007b7;--red-a10:#d10005c1;--red-a11:#c40006d3;--red-a12:#55000de8}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){:root,.light,.light-theme{--red-a1:color(display-p3 .675 .024 .024/.012);--red-a2:color(display-p3 .863 .024 .024/.028);--red-a3:color(display-p3 .792 .008 .008/.075);--red-a4:color(display-p3 1 .008 .008/.134);--red-a5:color(display-p3 .918 .008 .008/.189);--red-a6:color(display-p3 .831 .02 .004/.251);--red-a7:color(display-p3 .741 .016 .004/.33);--red-a8:color(display-p3 .698 .012 .004/.428);--red-a9:color(display-p3 .749 .008 0/.675);--red-a10:color(display-p3 .714 .012 0/.714);--red-a11:color(display-p3 .744 .234 .222);--red-a12:color(display-p3 .36 .115 .143)}}}.dark,.dark-theme{--red-1:#191111;--red-2:#201314;--red-3:#3b1219;--red-4:#500f1c;--red-5:#611623;--red-6:#72232d;--red-7:#8c333a;--red-8:#b54548;--red-9:#e5484d;--red-10:#ec5d5e;--red-11:#ff9592;--red-12:#ffd1d9}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){.dark,.dark-theme{--red-1:color(display-p3 .093 .068 .067);--red-2:color(display-p3 .118 .077 .079);--red-3:color(display-p3 .211 .081 .099);--red-4:color(display-p3 .287 .079 .113);--red-5:color(display-p3 .348 .11 .142);--red-6:color(display-p3 .414 .16 .183);--red-7:color(display-p3 .508 .224 .236);--red-8:color(display-p3 .659 .298 .297);--red-9:color(display-p3 .83 .329 .324);--red-10:color(display-p3 .861 .403 .387);--red-11:color(display-p3 1 .57 .55);--red-12:color(display-p3 .971 .826 .852)}}}.dark,.dark-theme{--red-a1:#f4121209;--red-a2:#f22f3e11;--red-a3:#ff173f2d;--red-a4:#fe0a3b44;--red-a5:#ff204756;--red-a6:#ff3e5668;--red-a7:#ff536184;--red-a8:#ff5d61b0;--red-a9:#fe4e54e4;--red-a10:#ff6465eb;--red-a11:#ff9592;--red-a12:#ffd1d9}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){.dark,.dark-theme{--red-a1:color(display-p3 .984 .071 .071/.03);--red-a2:color(display-p3 .996 .282 .282/.055);--red-a3:color(display-p3 1 .169 .271/.156);--red-a4:color(display-p3 1 .118 .267/.236);--red-a5:color(display-p3 1 .212 .314/.303);--red-a6:color(display-p3 1 .318 .38/.374);--red-a7:color(display-p3 1 .4 .424/.475);--red-a8:color(display-p3 1 .431 .431/.635);--red-a9:color(display-p3 1 .388 .384/.82);--red-a10:color(display-p3 1 .463 .447/.853);--red-a11:color(display-p3 1 .57 .55);--red-a12:color(display-p3 .971 .826 .852)}}}:root,.light,.light-theme{--green-1:#fbfefc;--green-2:#f4fbf6;--green-3:#e6f6eb;--green-4:#d6f1df;--green-5:#c4e8d1;--green-6:#adddc0;--green-7:#8eceaa;--green-8:#5bb98b;--green-9:#30a46c;--green-10:#2b9a66;--green-11:#218358;--green-12:#193b2d}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){:root,.light,.light-theme{--green-1:color(display-p3 .986 .996 .989);--green-2:color(display-p3 .963 .983 .967);--green-3:color(display-p3 .913 .964 .925);--green-4:color(display-p3 .859 .94 .879);--green-5:color(display-p3 .796 .907 .826);--green-6:color(display-p3 .718 .863 .761);--green-7:color(display-p3 .61 .801 .675);--green-8:color(display-p3 .451 .715 .559);--green-9:color(display-p3 .332 .634 .442);--green-10:color(display-p3 .308 .595 .417);--green-11:color(display-p3 .19 .5 .32);--green-12:color(display-p3 .132 .228 .18)}}}:root,.light,.light-theme{--green-a1:#00c04004;--green-a2:#00a32f0b;--green-a3:#00a43319;--green-a4:#00a83829;--green-a5:#019c393b;--green-a6:#00963c52;--green-a7:#00914071;--green-a8:#00924ba4;--green-a9:#008f4acf;--green-a10:#008647d4;--green-a11:#00713fde;--green-a12:#002616e6}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){:root,.light,.light-theme{--green-a1:color(display-p3 .024 .757 .267/.016);--green-a2:color(display-p3 .024 .565 .129/.036);--green-a3:color(display-p3 .012 .596 .145/.087);--green-a4:color(display-p3 .008 .588 .145/.142);--green-a5:color(display-p3 .004 .541 .157/.204);--green-a6:color(display-p3 .004 .518 .157/.283);--green-a7:color(display-p3 .004 .486 .165/.389);--green-a8:color(display-p3 0 .478 .2/.55);--green-a9:color(display-p3 0 .455 .165/.667);--green-a10:color(display-p3 0 .416 .153/.691);--green-a11:color(display-p3 .19 .5 .32);--green-a12:color(display-p3 .132 .228 .18)}}}.dark,.dark-theme{--green-1:#0e1512;--green-2:#121b17;--green-3:#132d21;--green-4:#113b29;--green-5:#174933;--green-6:#20573e;--green-7:#28684a;--green-8:#2f7c57;--green-9:#30a46c;--green-10:#33b074;--green-11:#3dd68c;--green-12:#b1f1cb}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){.dark,.dark-theme{--green-1:color(display-p3 .062 .083 .071);--green-2:color(display-p3 .079 .106 .09);--green-3:color(display-p3 .1 .173 .133);--green-4:color(display-p3 .115 .229 .166);--green-5:color(display-p3 .147 .282 .206);--green-6:color(display-p3 .185 .338 .25);--green-7:color(display-p3 .227 .403 .298);--green-8:color(display-p3 .27 .479 .351);--green-9:color(display-p3 .332 .634 .442);--green-10:color(display-p3 .357 .682 .474);--green-11:color(display-p3 .434 .828 .573);--green-12:color(display-p3 .747 .938 .807)}}}.dark,.dark-theme{--green-a1:#00de4505;--green-a2:#29f99d0b;--green-a3:#22ff991e;--green-a4:#11ff992d;--green-a5:#2bffa23c;--green-a6:#44ffaa4b;--green-a7:#50fdac5e;--green-a8:#54ffad73;--green-a9:#44ffa49e;--green-a10:#43fea4ab;--green-a11:#46fea5d4;--green-a12:#bbffd7f0}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){.dark,.dark-theme{--green-a1:color(display-p3 0 .992 .298/.017);--green-a2:color(display-p3 .341 .98 .616/.043);--green-a3:color(display-p3 .376 .996 .655/.114);--green-a4:color(display-p3 .341 .996 .635/.173);--green-a5:color(display-p3 .408 1 .678/.232);--green-a6:color(display-p3 .475 1 .706/.29);--green-a7:color(display-p3 .514 1 .706/.362);--green-a8:color(display-p3 .529 1 .718/.442);--green-a9:color(display-p3 .502 .996 .682/.61);--green-a10:color(display-p3 .506 1 .682/.66);--green-a11:color(display-p3 .434 .828 .573);--green-a12:color(display-p3 .747 .938 .807)}}}:root,.light,.light-theme{--amber-1:#fefdfb;--amber-2:#fefbe9;--amber-3:#fff7c2;--amber-4:#ffee9c;--amber-5:#fbe577;--amber-6:#f3d673;--amber-7:#e9c162;--amber-8:#e2a336;--amber-9:#ffc53d;--amber-10:#ffba18;--amber-11:#ab6400;--amber-12:#4f3422}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){:root,.light,.light-theme{--amber-1:color(display-p3 .995 .992 .985);--amber-2:color(display-p3 .994 .986 .921);--amber-3:color(display-p3 .994 .969 .782);--amber-4:color(display-p3 .989 .937 .65);--amber-5:color(display-p3 .97 .902 .527);--amber-6:color(display-p3 .936 .844 .506);--amber-7:color(display-p3 .89 .762 .443);--amber-8:color(display-p3 .85 .65 .3);--amber-9:color(display-p3 1 .77 .26);--amber-10:color(display-p3 .959 .741 .274);--amber-11:color(display-p3 .64 .4 0);--amber-12:color(display-p3 .294 .208 .145)}}}:root,.light,.light-theme{--amber-a1:#c0800004;--amber-a2:#f4d10016;--amber-a3:#ffde003d;--amber-a4:#ffd40063;--amber-a5:#f8cf0088;--amber-a6:#eab5008c;--amber-a7:#dc9b009d;--amber-a8:#da8a00c9;--amber-a9:#ffb300c2;--amber-a10:#ffb300e7;--amber-a11:#ab6400;--amber-a12:#341500dd}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){:root,.light,.light-theme{--amber-a1:color(display-p3 .757 .514 .024/.016);--amber-a2:color(display-p3 .902 .804 .008/.079);--amber-a3:color(display-p3 .965 .859 .004/.22);--amber-a4:color(display-p3 .969 .82 .004/.35);--amber-a5:color(display-p3 .933 .796 .004/.475);--amber-a6:color(display-p3 .875 .682 .004/.495);--amber-a7:color(display-p3 .804 .573 0/.557);--amber-a8:color(display-p3 .788 .502 0/.699);--amber-a9:color(display-p3 1 .686 0/.742);--amber-a10:color(display-p3 .945 .643 0/.726);--amber-a11:color(display-p3 .64 .4 0);--amber-a12:color(display-p3 .294 .208 .145)}}}.dark,.dark-theme{--amber-1:#16120c;--amber-2:#1d180f;--amber-3:#302008;--amber-4:#3f2700;--amber-5:#4d3000;--amber-6:#5c3d05;--amber-7:#714f19;--amber-8:#8f6424;--amber-9:#ffc53d;--amber-10:#ffd60a;--amber-11:#ffca16;--amber-12:#ffe7b3}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){.dark,.dark-theme{--amber-1:color(display-p3 .082 .07 .05);--amber-2:color(display-p3 .111 .094 .064);--amber-3:color(display-p3 .178 .128 .049);--amber-4:color(display-p3 .239 .156 0);--amber-5:color(display-p3 .29 .193 0);--amber-6:color(display-p3 .344 .245 .076);--amber-7:color(display-p3 .422 .314 .141);--amber-8:color(display-p3 .535 .399 .189);--amber-9:color(display-p3 1 .77 .26);--amber-10:color(display-p3 1 .87 .15);--amber-11:color(display-p3 1 .8 .29);--amber-12:color(display-p3 .984 .909 .726)}}}.dark,.dark-theme{--amber-a1:#e63c0006;--amber-a2:#fd9b000d;--amber-a3:#fa820022;--amber-a4:#fc820032;--amber-a5:#fd8b0041;--amber-a6:#fd9b0051;--amber-a7:#ffab2567;--amber-a8:#ffae3587;--amber-a9:#ffc53d;--amber-a10:#ffd60a;--amber-a11:#ffca16;--amber-a12:#ffe7b3}@supports (color:color(display-p3 1 1 1)){@media (color-gamut:p3){.dark,.dark-theme{--amber-a1:color(display-p3 .992 .298 0/.017);--amber-a2:color(display-p3 .988 .651 0/.047);--amber-a3:color(display-p3 1 .6 0/.118);--amber-a4:color(display-p3 1 .557 0/.185);--amber-a5:color(display-p3 1 .592 0/.24);--amber-a6:color(display-p3 1 .659 .094/.299);--amber-a7:color(display-p3 1 .714 .263/.383);--amber-a8:color(display-p3 .996 .729 .306/.5);--amber-a9:color(display-p3 1 .769 .259);--amber-a10:color(display-p3 1 .871 .149);--amber-a11:color(display-p3 1 .8 .29);--amber-a12:color(display-p3 .984 .909 .726)}}}:root{--tsu-bg:var(--tsu-neutral-1);--tsu-fg:var(--tsu-neutral-12);--tsu-surface:var(--tsu-neutral-2);--tsu-surface-raised:var(--tsu-neutral-3);--tsu-surface-raised-hover:var(--tsu-neutral-4);--tsu-color-pressed:var(--tsu-surface-raised);--tsu-color-pressed-accent:var(--tsu-accent-3);--tsu-color-muted:var(--tsu-neutral-alpha-7);--tsu-color-muted-subtle:var(--tsu-neutral-alpha-5);--tsu-info-1:var(--tsu-accent-1);--tsu-info-2:var(--tsu-accent-2);--tsu-info-3:var(--tsu-accent-3);--tsu-info-4:var(--tsu-accent-4);--tsu-info-5:var(--tsu-accent-5);--tsu-info-6:var(--tsu-accent-6);--tsu-info-7:var(--tsu-accent-7);--tsu-info-8:var(--tsu-accent-8);--tsu-info-9:var(--tsu-accent-9);--tsu-info-10:var(--tsu-accent-10);--tsu-info-11:var(--tsu-accent-11);--tsu-info-12:var(--tsu-accent-12);--tsu-danger-1:var(--red-1);--tsu-danger-2:var(--red-2);--tsu-danger-3:var(--red-3);--tsu-danger-4:var(--red-4);--tsu-danger-5:var(--red-5);--tsu-danger-6:var(--red-6);--tsu-danger-7:var(--red-7);--tsu-danger-8:var(--red-8);--tsu-danger-9:var(--red-9);--tsu-danger-10:var(--red-10);--tsu-danger-11:var(--red-11);--tsu-danger-12:var(--red-12);--tsu-success-1:var(--green-1);--tsu-success-2:var(--green-2);--tsu-success-3:var(--green-3);--tsu-success-4:var(--green-4);--tsu-success-5:var(--green-5);--tsu-success-6:var(--green-6);--tsu-success-7:var(--green-7);--tsu-success-8:var(--green-8);--tsu-success-9:var(--green-9);--tsu-success-10:var(--green-10);--tsu-success-11:var(--green-11);--tsu-success-12:var(--green-12);--tsu-warning-1:var(--amber-1);--tsu-warning-2:var(--amber-2);--tsu-warning-3:var(--amber-3);--tsu-warning-4:var(--amber-4);--tsu-warning-5:var(--amber-5);--tsu-warning-6:var(--amber-6);--tsu-warning-7:var(--amber-7);--tsu-warning-8:var(--amber-8);--tsu-warning-9:var(--amber-9);--tsu-warning-10:var(--amber-10);--tsu-warning-11:var(--amber-11);--tsu-warning-12:var(--amber-12);--tsu-neutral-alpha-1:var(--olive-a1);--tsu-neutral-alpha-2:var(--olive-a2);--tsu-neutral-alpha-3:var(--olive-a3);--tsu-neutral-alpha-4:var(--olive-a4);--tsu-neutral-alpha-5:var(--olive-a5);--tsu-neutral-alpha-6:var(--olive-a6);--tsu-neutral-alpha-7:var(--olive-a7);--tsu-neutral-alpha-8:var(--olive-a8);--tsu-neutral-alpha-9:var(--olive-a9);--tsu-neutral-alpha-10:var(--olive-a10);--tsu-neutral-alpha-11:var(--olive-a11);--tsu-neutral-alpha-12:var(--olive-a12);--tsu-disabled-bg:var(--tsu-surface-raised);--tsu-disabled-fg:var(--tsu-neutral-9);--tsu-disabled-border:var(--tsu-neutral-7);--tsu-focus-bg:var(--tsu-surface-raised-hover);--tsu-focus-border:var(--tsu-accent-8);--ink:var(--tsu-fg);--muted:var(--tsu-neutral-11);--accent:var(--tsu-accent-9);--surface:var(--tsu-bg);--bg:var(--tsu-neutral-2);--border:var(--tsu-neutral-7);--danger:var(--tsu-danger-9)}:root.dark{--tsu-fg:#fff}:root{--tsu-radius-round:9999px;--tsu-radius-l3-xs:14px;--tsu-radius-l2-xs:6px;--tsu-radius-l1-xs:2px;--tsu-radius-l3-sm:14px;--tsu-radius-l2-sm:6px;--tsu-radius-l1-sm:2px;--tsu-radius-l3-md:16px;--tsu-radius-l2-md:8px;--tsu-radius-l1-md:4px;--tsu-radius-l3-lg:18px;--tsu-radius-l2-lg:10px;--tsu-radius-l1-lg:6px;--tsu-radius-l3-xl:20px;--tsu-radius-l2-xl:12px;--tsu-radius-l1-xl:8px;--tsu-radius-l3-xxl:28px;--tsu-radius-l2-xxl:20px;--tsu-radius-l1-xxl:16px;--tsu-level-primary-xs:32px;--tsu-level-primary-sm:36px;--tsu-level-primary-md:40px;--tsu-level-primary-lg:44px;--tsu-level-primary-xl:48px;--tsu-level-primary-xxl:64px;--tsu-level-secondary-xs:16px;--tsu-level-secondary-sm:18px;--tsu-level-secondary-md:20px;--tsu-level-secondary-lg:22px;--tsu-level-secondary-xl:24px;--tsu-level-secondary-xxl:32px;--tsu-comp-height-xs:var(--tsu-level-primary-xs);--tsu-comp-height-sm:var(--tsu-level-primary-sm);--tsu-comp-height-md:var(--tsu-level-primary-md);--tsu-comp-height-lg:var(--tsu-level-primary-lg);--tsu-comp-height-xl:var(--tsu-level-primary-xl);--tsu-comp-height-xxl:var(--tsu-level-primary-xxl);--tsu-comp-font-size-xs:12px;--tsu-comp-font-size-sm:14px;--tsu-comp-font-size-md:14px;--tsu-comp-font-size-lg:16px;--tsu-comp-font-size-xl:18px;--tsu-comp-font-size-xxl:20px;--tsu-comp-line-height-xs:16px;--tsu-comp-line-height-sm:20px;--tsu-comp-line-height-md:20px;--tsu-comp-line-height-lg:24px;--tsu-comp-line-height-xl:28px;--tsu-comp-line-height-xxl:30px;--tsu-comp-padding-y-xs:7px;--tsu-comp-padding-y-sm:7px;--tsu-comp-padding-y-md:9px;--tsu-comp-padding-y-lg:9px;--tsu-comp-padding-y-xl:9px;--tsu-comp-padding-y-xxl:16px;--tsu-comp-padding-x-xs:8px;--tsu-comp-padding-x-sm:12px;--tsu-comp-padding-x-md:16px;--tsu-comp-padding-x-lg:20px;--tsu-comp-padding-x-xl:24px;--tsu-comp-padding-x-xxl:32px;--tsu-comp-secondary-height-xs:var(--tsu-level-secondary-xs);--tsu-comp-secondary-height-sm:var(--tsu-level-secondary-sm);--tsu-comp-secondary-height-md:var(--tsu-level-secondary-md);--tsu-comp-secondary-height-lg:var(--tsu-level-secondary-lg);--tsu-comp-secondary-height-xl:var(--tsu-level-secondary-xl);--tsu-comp-secondary-height-xxl:var(--tsu-level-secondary-xxl);--tsu-font-size-xs:10px;--tsu-font-size-sm:12px;--tsu-font-size-md:14px;--tsu-font-size-lg:16px;--tsu-font-size-xl:20px;--tsu-font-size-xxl:24px;--tsu-font-weight-regular:400;--tsu-font-weight-medium:500;--tsu-font-weight-semibold:600;--tsu-text-title-size:var(--tsu-font-size-lg);--tsu-text-title-weight:var(--tsu-font-weight-semibold);--tsu-text-title-line-height:24px;--tsu-text-body-size:var(--tsu-font-size-md);--tsu-text-body-weight:var(--tsu-font-weight-regular);--tsu-text-body-line-height:20px;--tsu-text-label-size:var(--tsu-font-size-md);--tsu-text-label-weight:var(--tsu-font-weight-medium);--tsu-text-label-line-height:20px;--tsu-text-caption-size:var(--tsu-font-size-sm);--tsu-text-caption-weight:var(--tsu-font-weight-regular);--tsu-text-caption-line-height:16px;--tsu-spacing-xxs:2px;--tsu-spacing-xs:4px;--tsu-spacing-sm:8px;--tsu-spacing-md:12px;--tsu-spacing-lg:16px;--tsu-spacing-xl:24px;--tsu-spacing-xxl:32px;--tsu-duration-fast:.15s;--tsu-duration-normal:.25s;--tsu-duration-overlay-enter:.35s;--tsu-duration-overlay-exit:.2s;--tsu-ease-standard:cubic-bezier(.2, 0, 0, 1);--tsu-ease-out:cubic-bezier(.32, .72, 0, 1);--tsu-ease-in:cubic-bezier(.4, 0, 1, 1);--tsu-transition-fast:var(--tsu-duration-fast) var(--tsu-ease-standard);--tsu-transition-normal:var(--tsu-duration-normal) var(--tsu-ease-standard);--tsu-transition-overlay-enter:var(--tsu-duration-overlay-enter) var(--tsu-ease-out);--tsu-transition-overlay-exit:var(--tsu-duration-overlay-exit) var(--tsu-ease-in);--tsu-transition-overlay:var(--tsu-transition-overlay-enter);--tsu-shadow-sm:0 1px 2px var(--tsu-neutral-alpha-6), 0 2px 4px var(--tsu-neutral-alpha-7);--tsu-shadow-md:0 1px 3px var(--tsu-neutral-alpha-6), 0 4px 16px var(--tsu-neutral-alpha-8);--tsu-shadow-lg:0 2px 6px var(--tsu-neutral-alpha-6), 0 12px 32px var(--tsu-neutral-alpha-10);--tsu-font-family:system-ui, -apple-system, sans-serif;--tsu-line-height:1.5;--tsu-container-padding-sm:12px;--tsu-container-padding-md:16px;--tsu-container-padding-lg:24px;--tsu-container-padding-xl:32px;--tsu-z-base:0;--tsu-z-dropdown:100;--tsu-z-modal:200;--tsu-z-toast:300}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:none;-moz-text-size-adjust:none;text-size-adjust:none}*{-webkit-tap-highlight-color:#0000;margin:0;padding:0}:focus{outline:none}body{min-height:100vh;font-family:var(--tsu-font-family);font-size:var(--tsu-font-size-md);line-height:var(--tsu-line-height);color:var(--tsu-fg);background-color:var(--tsu-bg);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}img,picture,video,canvas,svg{max-inline-size:100%;display:block}input,button,textarea,select{font:inherit;color:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}p{text-wrap:pretty}h1,h2,h3,h4,h5,h6{text-wrap:balance;font-weight:var(--tsu-font-weight-semibold)}a{color:inherit;text-decoration:none}textarea:not([rows]){min-height:10em}:target{scroll-margin-block:5ex}:where(ul,ol){list-style:none}:where(table){border-collapse:collapse;border-spacing:0}:where(button){appearance:none;cursor:pointer;background:0 0;border:none}:where([hidden]){display:none}input[type=search]::-webkit-search-cancel-button{display:none}input[type=search]::-ms-clear{display:none}
package/docs/api.md CHANGED
@@ -771,7 +771,7 @@ A free-form presentation layer: a backdrop, an optional drag grabber, and a scro
771
771
 
772
772
  **Rendered DOM parts:** exactly three — `data-part="backdrop"`, `data-part="grabber"` (only when `draggable`), and `data-part="content"`. With the default `lazyMount: true` + `unmountOnExit: true`, a closed sheet that was never opened renders **zero** nodes; after close it stays mounted only long enough for the exit transition, then unmounts. BottomSheet has no focus trap or Escape-to-close — use [`Dialog`](#dialog) when those are required.
773
773
 
774
- > **Design decision:** `content` is a pure container — `display: flex; flex-direction: column` with `padding: 0 24px` only. It has **no vertical padding, no margin, and no scrolling**. Spacing and scrolling are entirely consumer-owned: build your own layout inside `children` (the sheet caps height at `70vh`, so a scrollable section can be a `flex: 1; min-height: 0; overflow-y: auto` child).
774
+ > **Design decision:** `content` is a pure container — `display: flex; flex-direction: column` only, with **no padding, no margin, and no scrolling**. Spacing and scrolling are entirely consumer-owned: build your own layout inside `children` (the sheet caps height at `70vh`, so a scrollable section can be a `flex: 1; min-height: 0; overflow-y: auto` child).
775
775
 
776
776
  | Prop | Type | Default | Description |
777
777
  |---|---|---|---|---|
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@plastic-js/tsumiki",
3
- "version": "0.1.50",
3
+ "version": "0.1.52",
4
4
  "description": "A UI component library for Plastic JS.",
5
5
  "license": "MIT",
6
6
  "author": "tigre",
@@ -50,10 +50,10 @@
50
50
  "prepublishOnly": "npm run build",
51
51
  "preview": "vite preview",
52
52
  "theme": "node scripts/theme.js",
53
- "e2e:repro": "node e2e/dlgcbx-repro.mjs",
54
53
  "e2e:bottomsheet": "node e2e/bottomsheet-presence-verify.mjs",
55
54
  "e2e:dialog-portal": "node e2e/dialog-portal-verify.mjs",
56
- "e2e:bottomsheet-animation": "node e2e/bottomsheet-animation-verify.mjs"
55
+ "e2e:bottomsheet-animation": "node e2e/bottomsheet-animation-verify.mjs",
56
+ "e2e:select-rerender": "node e2e/select-rerender-verify.mjs"
57
57
  },
58
58
  "dependencies": {
59
59
  "@emotion/css": "^11.13.5",
package/src/styles/reset.css CHANGED
@@ -19,6 +19,10 @@ html {
19
19
  -webkit-tap-highlight-color: rgba(0,0,0,0);
20
20
  }
21
21
 
22
+ *:focus {
23
+ outline: none;
24
+ }
25
+
22
26
  body {
23
27
  min-height: 100vh;
24
28
  font-family: var(--tsu-font-family);