beercss 3.7.14 → 3.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (18) hide show
  1. package/README.md +15 -7
  2. package/dist/cdn/beer.css +44 -21
  3. package/dist/cdn/beer.js +46 -1
  4. package/dist/cdn/beer.min.css +1 -1
  5. package/dist/cdn/beer.min.js +1 -1
  6. package/package.json +1 -1
  7. package/src/cdn/beer.css +1 -0
  8. package/src/cdn/beer.ts +2 -0
  9. package/src/cdn/elements/dialogs.css +2 -2
  10. package/src/cdn/elements/dialogs.ts +7 -4
  11. package/src/cdn/elements/fields.ts +12 -0
  12. package/src/cdn/elements/menus.css +5 -7
  13. package/src/cdn/elements/navigations.css +1 -2
  14. package/src/cdn/elements/sliders.css +1 -1
  15. package/src/cdn/helpers/ripples.css +34 -0
  16. package/src/cdn/helpers/ripples.ts +31 -0
  17. package/src/cdn/helpers/waves.css +3 -6
  18. package/src/cdn/settings/fonts.css +3 -3
package/README.md CHANGED
@@ -27,7 +27,15 @@ Beer CSS is an MIT-licensed open source project with its ongoing development mad
27
27
  <p><a href="https://opencollective.com/beercss#support"><img src="https://opencollective.com/beercss/backers.svg?avatarHeight=40&button=false" alt="Backers"></a></p>
28
28
 
29
29
  ### Github sponsors
30
- <p><a href="https://github.com/sponsors/beercss"><img src="https://avatars.githubusercontent.com/u/74856856?s=40&v=4" alt="Sponsors"></a></p>
30
+ <p>
31
+ <a href="https://github.com/sponsors/beercss">
32
+ <img src="https://avatars.githubusercontent.com/u/74856856?s=40&v=4" alt="Sponsors">
33
+ <img src="https://avatars.githubusercontent.com/u/419690?s=40&v=4" alt="Sponsors">
34
+ <img src="https://avatars.githubusercontent.com/u/181576?s=40&v=4 alt="Sponsors">
35
+ <img src="https://avatars.githubusercontent.com/u/797439?s=40&v=4 alt="Sponsors">
36
+ <img src="https://avatars.githubusercontent.com/u/3647943?s=40&v=4 alt="Sponsors">
37
+ </a>
38
+ </p>
31
39
 
32
40
  # Why?
33
41
 
@@ -123,19 +131,19 @@ From jsdelivr.net.
123
131
 
124
132
  ```html
125
133
  // with html
126
- <link href="https://cdn.jsdelivr.net/npm/beercss@3.7.14/dist/cdn/beer.min.css" rel="stylesheet" />
127
- <script type="module" src="https://cdn.jsdelivr.net/npm/beercss@3.7.14/dist/cdn/beer.min.js"></script>
134
+ <link href="https://cdn.jsdelivr.net/npm/beercss@3.8.0/dist/cdn/beer.min.css" rel="stylesheet" />
135
+ <script type="module" src="https://cdn.jsdelivr.net/npm/beercss@3.8.0/dist/cdn/beer.min.js"></script>
128
136
  <script type="module" src="https://cdn.jsdelivr.net/npm/material-dynamic-colors@1.1.2/dist/cdn/material-dynamic-colors.min.js"></script>
129
137
  ```
130
138
 
131
139
  ```css
132
140
  // with css
133
- @import "https://cdn.jsdelivr.net/npm/beercss@3.7.14/dist/cdn/beer.min.css";
141
+ @import "https://cdn.jsdelivr.net/npm/beercss@3.8.0/dist/cdn/beer.min.css";
134
142
  ```
135
143
 
136
144
  ```js
137
145
  // with javascript
138
- import "https://cdn.jsdelivr.net/npm/beercss@3.7.14/dist/cdn/beer.min.js";
146
+ import "https://cdn.jsdelivr.net/npm/beercss@3.8.0/dist/cdn/beer.min.js";
139
147
  import "https://cdn.jsdelivr.net/npm/material-dynamic-colors@1.1.2/dist/cdn/material-dynamic-colors.min.js";
140
148
  ```
141
149
 
@@ -187,8 +195,8 @@ You can use this html to setup your project. See on [Codepen](https://codepen.io
187
195
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
188
196
  <meta name="google" content="notranslate">
189
197
  <title>Hello world</title>
190
- <link href="https://cdn.jsdelivr.net/npm/beercss@3.7.14/dist/cdn/beer.min.css" rel="stylesheet">
191
- <script type="module" src="https://cdn.jsdelivr.net/npm/beercss@3.7.14/dist/cdn/beer.min.js"></script>
198
+ <link href="https://cdn.jsdelivr.net/npm/beercss@3.8.0/dist/cdn/beer.min.css" rel="stylesheet">
199
+ <script type="module" src="https://cdn.jsdelivr.net/npm/beercss@3.8.0/dist/cdn/beer.min.js"></script>
192
200
  <script type="module" src="https://cdn.jsdelivr.net/npm/material-dynamic-colors@1.1.2/dist/cdn/material-dynamic-colors.min.js"></script>
193
201
  </head>
194
202
  <body class="dark">
package/dist/cdn/beer.css CHANGED
@@ -101,7 +101,7 @@ body.dark {
101
101
  font-display: block;
102
102
  src:
103
103
  url("material-symbols-outlined.woff2") format("woff2"),
104
- url("https://cdn.jsdelivr.net/npm/beercss@3.7.14/dist/cdn/material-symbols-outlined.woff2") format("woff2");
104
+ url("https://cdn.jsdelivr.net/npm/beercss@3.8.0/dist/cdn/material-symbols-outlined.woff2") format("woff2");
105
105
  }
106
106
  /* rounded icons */
107
107
  @font-face {
@@ -111,7 +111,7 @@ body.dark {
111
111
  font-display: block;
112
112
  src:
113
113
  url("material-symbols-rounded.woff2") format("woff2"),
114
- url("https://cdn.jsdelivr.net/npm/beercss@3.7.14/dist/cdn/material-symbols-rounded.woff2") format("woff2");
114
+ url("https://cdn.jsdelivr.net/npm/beercss@3.8.0/dist/cdn/material-symbols-rounded.woff2") format("woff2");
115
115
  }
116
116
  /* sharp icons */
117
117
  @font-face {
@@ -121,7 +121,7 @@ body.dark {
121
121
  font-display: block;
122
122
  src:
123
123
  url("material-symbols-sharp.woff2") format("woff2"),
124
- url("https://cdn.jsdelivr.net/npm/beercss@3.7.14/dist/cdn/material-symbols-sharp.woff2") format("woff2");
124
+ url("https://cdn.jsdelivr.net/npm/beercss@3.8.0/dist/cdn/material-symbols-sharp.woff2") format("woff2");
125
125
  }
126
126
  * {
127
127
  -webkit-tap-highlight-color: transparent;
@@ -1308,6 +1308,35 @@ body :is(:hover,:focus)::-webkit-scrollbar-thumb {
1308
1308
  [dir=rtl] .middle.center {
1309
1309
  transform: translate(50%, -50%);
1310
1310
  }
1311
+ .ripple {
1312
+ ---duration: 600ms;
1313
+ }
1314
+ .fast-ripple {
1315
+ ---duration: 200ms;
1316
+ }
1317
+ .slow-ripple {
1318
+ ---duration: 1800ms;
1319
+ }
1320
+ .ripple-js {
1321
+ position: absolute;
1322
+ inset: 0;
1323
+ pointer-events: none;
1324
+ overflow: hidden;
1325
+ }
1326
+ .ripple-js > div {
1327
+ position: absolute;
1328
+ border-radius: 50%;
1329
+ background: currentColor;
1330
+ opacity: 0.3;
1331
+ transform: scale(0);
1332
+ animation: to-ripple var(---duration) linear;
1333
+ }
1334
+ @keyframes to-ripple {
1335
+ to {
1336
+ transform: scale(4);
1337
+ opacity: 0;
1338
+ }
1339
+ }
1311
1340
  .scroll {
1312
1341
  overflow: auto;
1313
1342
  }
@@ -1557,10 +1586,7 @@ pre:has(> code){
1557
1586
  direction: ltr;
1558
1587
  text-align: start;
1559
1588
  }
1560
- .wave::after,
1561
- .chip::after,
1562
- :is(.button, button)::after,
1563
- :is(nav.tabbed, .tabs) > a::after {
1589
+ :is(.wave, .chip, .button, button, nav.tabbed > a, .tabs > a):not(.slow-ripple, .ripple, .fast-ripple)::after {
1564
1590
  content: "";
1565
1591
  position: absolute;
1566
1592
  inset: 0;
@@ -1573,12 +1599,12 @@ pre:has(> code){
1573
1599
  opacity: 0;
1574
1600
  transition: none;
1575
1601
  }
1576
- :is(.wave, .chip, .button, button, nav.tabbed > a, .tabs > a):is(:focus-visible, :hover)::after {
1602
+ :is(.wave, .chip, .button, button, nav.tabbed > a, .tabs > a):not(.slow-ripple, .ripple, .fast-ripple):is(:focus-visible, :hover)::after {
1577
1603
  background-size: 15000%;
1578
1604
  opacity: 0.1;
1579
1605
  transition: background-size var(--speed2) linear;
1580
1606
  }
1581
- :is(.wave, .chip, .button, button, nav.tabbed > a, .tabs > a):active::after {
1607
+ :is(.wave, .chip, .button, button, nav.tabbed > a, .tabs > a):not(.slow-ripple, .ripple, .fast-ripple):active::after {
1582
1608
  background-size: 5000%;
1583
1609
  opacity: 0;
1584
1610
  transition: none;
@@ -1965,9 +1991,9 @@ aside:not(.fixed, .absolute).left {
1965
1991
  }
1966
1992
  dialog {
1967
1993
  display: block;
1994
+ visibility: hidden;
1968
1995
  border: none;
1969
1996
  opacity: 0;
1970
- visibility: hidden;
1971
1997
  position: fixed;
1972
1998
  box-shadow: var(--elevate2);
1973
1999
  color: var(--on-surface);
@@ -2001,8 +2027,8 @@ dialog.large {
2001
2027
  block-size: 75%;
2002
2028
  }
2003
2029
  dialog:is(.active, [open]) {
2004
- opacity: 1;
2005
2030
  visibility: visible;
2031
+ opacity: 1;
2006
2032
  transform: translate(-50%, 0);
2007
2033
  }
2008
2034
  dialog.top {
@@ -2942,7 +2968,7 @@ menu.no-wrap {
2942
2968
  menu.active,
2943
2969
  menu:not([data-ui]):active,
2944
2970
  :not(menu, [data-ui]):focus-within > menu,
2945
- menu > :is(a, li):hover + menu,
2971
+ menu > :is(a, li, nav):hover + menu,
2946
2972
  menu > menu:hover {
2947
2973
  opacity: 1;
2948
2974
  visibility: visible;
@@ -2951,20 +2977,18 @@ menu > menu:hover {
2951
2977
  menu * {
2952
2978
  white-space: inherit !important;
2953
2979
  }
2954
- menu > a,
2955
- menu > li > a {
2980
+ menu > :is(a, nav, li > a, li > nav) {
2956
2981
  padding: 0.5rem 1rem;
2957
2982
  min-block-size: 3rem;
2958
2983
  flex: 1;
2984
+ margin: 0 !important;
2959
2985
  }
2960
- menu > a:not(.row),
2961
- menu > li > a:not(.row) {
2986
+ menu > :is(a, li > a):not(.row) {
2962
2987
  display: flex;
2963
2988
  flex-direction: column;
2964
2989
  align-items: flex-start;
2965
2990
  }
2966
- menu > a:is(:hover, :focus, .active),
2967
- menu > li > a:is(:hover, :focus, .active) {
2991
+ menu > :is(a, nav, li > a, li > nav):is(:hover, :focus, .active) {
2968
2992
  background-color: var(--active);
2969
2993
  }
2970
2994
  menu.min {
@@ -3206,8 +3230,7 @@ nav.drawer > header {
3206
3230
  }
3207
3231
  nav.drawer > :is(a, label),
3208
3232
  nav.drawer > :is(ol, ul) > li > :is(a, label),
3209
- a.row.wave,
3210
- nav.row.wave {
3233
+ :is(a.row, nav.row):is(.wave, .slow-ripple, .ripple, .fast-ripple) {
3211
3234
  padding: 0.75rem;
3212
3235
  font-size: inherit;
3213
3236
  }
@@ -3838,7 +3861,7 @@ progress.max + * {
3838
3861
  inset: calc(50% - 0.5rem) var(---end) auto var(---start);
3839
3862
  clip-path: polygon(0 0, calc(100% - 0.5rem) 0, calc(100% - 0.5rem) 100%, 0 100%);
3840
3863
  }
3841
- .slider > input + input ~ span {
3864
+ .slider > input[type=range] + input[type=range] ~ span {
3842
3865
  border-radius: 0;
3843
3866
  clip-path: polygon(0.5rem 0, max(0.5rem, calc(100% - 0.5rem)) 0, max(0.5rem, calc(100% - 0.5rem)) 100%, 0.5rem 100%);
3844
3867
  }
package/dist/cdn/beer.js CHANGED
@@ -144,6 +144,13 @@ function onInputTextarea(e) {
144
144
  const textarea = e.currentTarget;
145
145
  updateTextarea(textarea);
146
146
  }
147
+ function onPasswordIconClick(e) {
148
+ var _a;
149
+ const icon = e.currentTarget;
150
+ const input = query("input", parent(icon));
151
+ if (input && ((_a = icon.textContent) == null ? void 0 : _a.includes("visibility")))
152
+ input.type = input.type === "password" ? "text" : "password";
153
+ }
147
154
  function updateAllLabels() {
148
155
  const labels = queryAll(".field > label");
149
156
  for (let i = 0; i < labels.length; i++)
@@ -187,6 +194,11 @@ function updateAllTextareas() {
187
194
  updateTextarea(textareas[i]);
188
195
  }
189
196
  }
197
+ function updateAllPasswordIcons() {
198
+ const icons = queryAll("input[type=password] ~ :is(i, a)");
199
+ for (let i = 0; i < icons.length; i++)
200
+ on(icons[i], "click", onPasswordIconClick);
201
+ }
190
202
  function updateInput(input) {
191
203
  if (hasType(input, "number") && !input.value)
192
204
  input.value = "";
@@ -238,6 +250,7 @@ function updateAllFields() {
238
250
  updateAllFiles();
239
251
  updateAllColors();
240
252
  updateAllTextareas();
253
+ updateAllPasswordIcons();
241
254
  }
242
255
  function onInputDocument(e) {
243
256
  const input = e.target;
@@ -400,6 +413,10 @@ function onKeydownDialog(e) {
400
413
  void updateDialog(dialog, dialog);
401
414
  }
402
415
  }
416
+ function focusOnDialogOrElement(dialog) {
417
+ const element = query("[autofocus]", dialog) ?? dialog;
418
+ element.focus();
419
+ }
403
420
  function closeDialog(dialog, overlay) {
404
421
  removeClass(queryAllDataUi(dialog.id), "active");
405
422
  removeClass(dialog, "active");
@@ -425,9 +442,9 @@ async function openDialog(dialog, overlay, isModal, from) {
425
442
  if (!isModal)
426
443
  on(dialog, "keydown", onKeydownDialog, false);
427
444
  _dialogs.push(dialog);
428
- dialog.focus();
429
445
  if (isTouchable())
430
446
  document.body.classList.add("no-scroll");
447
+ focusOnDialogOrElement(dialog);
431
448
  }
432
449
  function onClickOverlay(e) {
433
450
  const overlay = e.currentTarget;
@@ -518,6 +535,33 @@ function updatePage(page) {
518
535
  removeClass(queryAll(":scope > .page", container), "active");
519
536
  addClass(page, "active");
520
537
  }
538
+ function onPointerDownRipple(e) {
539
+ updateRipple(e);
540
+ }
541
+ function updateRipple(e) {
542
+ const element = e.currentTarget;
543
+ const rect = element.getBoundingClientRect();
544
+ const diameter = Math.max(rect.width, rect.height);
545
+ const radius = diameter / 2;
546
+ const x = e.clientX - rect.left - radius;
547
+ const y = e.clientY - rect.top - radius;
548
+ const rippleContainer = document.createElement("div");
549
+ rippleContainer.className = "ripple-js";
550
+ const ripple = document.createElement("div");
551
+ ripple.style.inlineSize = ripple.style.blockSize = `${diameter}px`;
552
+ ripple.style.left = `${x}px`;
553
+ ripple.style.top = `${y}px`;
554
+ ripple.addEventListener("animationend", () => {
555
+ rippleContainer.remove();
556
+ });
557
+ rippleContainer.appendChild(ripple);
558
+ element.appendChild(rippleContainer);
559
+ }
560
+ function updateAllRipples() {
561
+ const ripples = queryAll(".slow-ripple, .ripple, .fast-ripple");
562
+ for (let i = 0; i < ripples.length; i++)
563
+ on(ripples[i], "pointerdown", onPointerDownRipple);
564
+ }
521
565
  let _timeoutMutation;
522
566
  let _mutation;
523
567
  function onMutation() {
@@ -597,6 +641,7 @@ function ui(selector, options) {
597
641
  updateAllDataUis();
598
642
  updateAllFields();
599
643
  updateAllSliders();
644
+ updateAllRipples();
600
645
  }
601
646
  function start() {
602
647
  var _a;
package/dist/cdn/beer.min.css CHANGED
@@ -1 +1 @@
1
- :root{--size: 16px;--font: Inter, Roboto, "Helvetica Neue", "Arial Nova", "Nimbus Sans", Noto Sans, Arial, sans-serif;--font-icon: "Material Symbols Outlined";--speed1: .1s;--speed2: .2s;--speed3: .3s;--speed4: .4s;--active: rgb(128 128 128 / .192);--overlay: rgb(0 0 0 / .5);--elevate1: 0 .125rem .125rem 0 rgb(0 0 0 / .32);--elevate2: 0 .25rem .5rem 0 rgb(0 0 0 / .4);--elevate3: 0 .375rem .75rem 0 rgb(0 0 0 / .48);--top: env(safe-area-inset-top);--bottom: env(safe-area-inset-bottom);--left: env(safe-area-inset-left);--right: env(safe-area-inset-right)}:root,body.light{--primary: #6750a4;--on-primary: #ffffff;--primary-container: #e9ddff;--on-primary-container: #22005d;--secondary: #625b71;--on-secondary: #ffffff;--secondary-container: #e8def8;--on-secondary-container: #1e192b;--tertiary: #7e5260;--on-tertiary: #ffffff;--tertiary-container: #ffd9e3;--on-tertiary-container: #31101d;--error: #ba1a1a;--on-error: #ffffff;--error-container: #ffdad6;--on-error-container: #410002;--background: #fffbff;--on-background: #1c1b1e;--surface: #fdf8fd;--on-surface: #1c1b1e;--surface-variant: #e7e0eb;--on-surface-variant: #49454e;--outline: #7a757f;--outline-variant: #cac4cf;--shadow: #000000;--scrim: #000000;--inverse-surface: #313033;--inverse-on-surface: #f4eff4;--inverse-primary: #cfbcff;--surface-dim: #ddd8dd;--surface-bright: #fdf8fd;--surface-container-lowest: #ffffff;--surface-container-low: #f7f2f7;--surface-container: #f2ecf1;--surface-container-high: #ece7eb;--surface-container-highest: #e6e1e6}body.dark{--primary: #cfbcff;--on-primary: #381e72;--primary-container: #4f378a;--on-primary-container: #e9ddff;--secondary: #cbc2db;--on-secondary: #332d41;--secondary-container: #4a4458;--on-secondary-container: #e8def8;--tertiary: #efb8c8;--on-tertiary: #4a2532;--tertiary-container: #633b48;--on-tertiary-container: #ffd9e3;--error: #ffb4ab;--on-error: #690005;--error-container: #93000a;--on-error-container: #ffb4ab;--background: #1c1b1e;--on-background: #e6e1e6;--surface: #141316;--on-surface: #e6e1e6;--surface-variant: #49454e;--on-surface-variant: #cac4cf;--outline: #948f99;--outline-variant: #49454e;--shadow: #000000;--scrim: #000000;--inverse-surface: #e6e1e6;--inverse-on-surface: #313033;--inverse-primary: #6750a4;--surface-dim: #141316;--surface-bright: #3a383c;--surface-container-lowest: #0f0e11;--surface-container-low: #1c1b1e;--surface-container: #201f22;--surface-container-high: #2b292d;--surface-container-highest: #363438}@font-face{font-family:Material Symbols Outlined;font-style:normal;font-weight:400;font-display:block;src:url(material-symbols-outlined.woff2) format("woff2"),url(https://cdn.jsdelivr.net/npm/beercss@3.7.14/dist/cdn/material-symbols-outlined.woff2) format("woff2")}@font-face{font-family:Material Symbols Rounded;font-style:normal;font-weight:400;font-display:block;src:url(material-symbols-rounded.woff2) format("woff2"),url(https://cdn.jsdelivr.net/npm/beercss@3.7.14/dist/cdn/material-symbols-rounded.woff2) format("woff2")}@font-face{font-family:Material Symbols Sharp;font-style:normal;font-weight:400;font-display:block;src:url(material-symbols-sharp.woff2) format("woff2"),url(https://cdn.jsdelivr.net/npm/beercss@3.7.14/dist/cdn/material-symbols-sharp.woff2) format("woff2")}*{-webkit-tap-highlight-color:transparent;position:relative;vertical-align:middle;color:inherit;margin:0;padding:0;border-radius:inherit;box-sizing:border-box}body{color:var(--on-surface);background-color:var(--surface);overflow-x:hidden}label{font-size:.75rem;vertical-align:baseline}a,b,i,span,strong,em,code{vertical-align:baseline}a,button,.button{cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;border:none;font-family:inherit;outline:inherit;justify-content:center}a,button,.button,i,label{-webkit-user-select:none;user-select:none}body ::-webkit-scrollbar,body ::-webkit-scrollbar-thumb,body ::-webkit-scrollbar-button{background:none;inline-size:.4rem;block-size:.4rem}body :is(:hover,:focus)::-webkit-scrollbar-thumb{background:var(--outline);border-radius:1rem}*+:is(address,article,blockquote,code,.field,fieldset,form,.grid,h1,h2,h3,h4,h5,h6,nav,ol,p,pre,.row,section,aside,table,.tabs,ul){margin-block-start:1rem}:is(a,button,.button,.chip):focus-visible{outline:.125rem solid var(--primary);outline-offset:.25rem}.transparent{background-color:transparent!important;box-shadow:none!important;color:inherit!important}.primary{background-color:var(--primary)!important;color:var(--on-primary)!important}.primary-text{color:var(--primary)!important}.primary-border{border-color:var(--primary)!important}.primary-container{background-color:var(--primary-container)!important;color:var(--on-primary-container)!important}.secondary{background-color:var(--secondary)!important;color:var(--on-secondary)!important}.secondary-text{color:var(--secondary)!important}.secondary-border{border-color:var(--secondary)!important}.secondary-container{background-color:var(--secondary-container)!important;color:var(--on-secondary-container)!important}.tertiary{background-color:var(--tertiary)!important;color:var(--on-tertiary)!important}.tertiary-text{color:var(--tertiary)!important}.tertiary-border{border-color:var(--tertiary)!important}.tertiary-container{background-color:var(--tertiary-container)!important;color:var(--on-tertiary-container)!important}.error{background-color:var(--error)!important;color:var(--on-error)!important}.error-text{color:var(--error)!important}.error-border{border-color:var(--error)!important}.error-container{background-color:var(--error-container)!important;color:var(--on-error-container)!important}.background{background-color:var(--background)!important;color:var(--on-background)!important}.surface,.surface-dim,.surface-bright,.surface-container-lowest,.surface-container-low,.surface-container,.surface-container-high,.surface-container-highest{background-color:var(--surface)!important;color:var(--on-surface)!important}.surface-variant{background-color:var(--surface-variant)!important;color:var(--on-surface-variant)!important}.inverse-surface{background-color:var(--inverse-surface);color:var(--inverse-on-surface)}.inverse-primary{background-color:var(--inverse-primary);color:var(--primary)}.inverse-primary-text{color:var(--inverse-primary)!important}.inverse-primary-border{border-color:var(--inverse-primary)!important}.surface-dim{background-color:var(--surface-dim)!important}.surface-bright{background-color:var(--surface-bright)!important}.surface-container-lowest{background-color:var(--surface-container-lowest)!important}.surface-container{background-color:var(--surface-container)!important}.surface-container-high{background-color:var(--surface-container-high)!important}.surface-container-highest{background-color:var(--surface-container-highest)!important}.surface-container-low{background-color:var(--surface-container-low)!important}.black{background-color:#000!important}.black-border{border-color:#000!important}.black-text{color:#000!important}.white{background-color:#fff!important}.white-border{border-color:#fff!important}.white-text{color:#fff!important}.transparent-border{border-color:transparent!important}.transparent-text{color:transparent!important}.fill:not(i){background-color:var(--surface-variant)!important;color:var(--on-surface-variant)!important}.middle-align{display:flex;align-items:center!important}.bottom-align{display:flex;align-items:flex-end!important}.top-align{display:flex;align-items:flex-start!important}.left-align{text-align:start;justify-content:flex-start!important}.right-align{text-align:end;justify-content:flex-end!important}.center-align{text-align:center;justify-content:center!important}.red,.red6{background-color:#f44336!important}.red-border{border-color:#f44336!important}.red-text{color:#f44336!important}.red1{background-color:#ffebee!important}.red2{background-color:#ffcdd2!important}.red3{background-color:#ef9a9a!important}.red4{background-color:#e57373!important}.red5{background-color:#ef5350!important}.red7{background-color:#e53935!important}.red8{background-color:#d32f2f!important}.red9{background-color:#c62828!important}.red10{background-color:#b71c1c!important}.pink,.pink6{background-color:#e91e63!important}.pink-border{border-color:#e91e63!important}.pink-text{color:#e91e63!important}.pink1{background-color:#fce4ec!important}.pink2{background-color:#f8bbd0!important}.pink3{background-color:#f48fb1!important}.pink4{background-color:#f06292!important}.pink5{background-color:#ec407a!important}.pink7{background-color:#d81b60!important}.pink8{background-color:#c2185b!important}.pink9{background-color:#ad1457!important}.pink10{background-color:#880e4f!important}.purple,.purple6{background-color:#9c27b0!important}.purple-border{border-color:#9c27b0!important}.purple-text{color:#9c27b0!important}.purple1{background-color:#f3e5f5!important}.purple2{background-color:#e1bee7!important}.purple3{background-color:#ce93d8!important}.purple4{background-color:#ba68c8!important}.purple5{background-color:#ab47bc!important}.purple7{background-color:#8e24aa!important}.purple8{background-color:#7b1fa2!important}.purple9{background-color:#6a1b9a!important}.purple10{background-color:#4a148c!important}.deep-purple,.deep-purple6{background-color:#673ab7!important}.deep-purple-border{border-color:#673ab7!important}.deep-purple-text{color:#673ab7!important}.deep-purple1{background-color:#ede7f6!important}.deep-purple2{background-color:#d1c4e9!important}.deep-purple3{background-color:#b39ddb!important}.deep-purple4{background-color:#9575cd!important}.deep-purple5{background-color:#7e57c2!important}.deep-purple7{background-color:#5e35b1!important}.deep-purple8{background-color:#512da8!important}.deep-purple9{background-color:#4527a0!important}.deep-purple10{background-color:#311b92!important}.indigo,.indigo6{background-color:#3f51b5!important}.indigo-border{border-color:#3f51b5!important}.indigo-text{color:#3f51b5!important}.indigo1{background-color:#e8eaf6!important}.indigo2{background-color:#c5cae9!important}.indigo3{background-color:#9fa8da!important}.indigo4{background-color:#7986cb!important}.indigo5{background-color:#5c6bc0!important}.indigo7{background-color:#3949ab!important}.indigo8{background-color:#303f9f!important}.indigo9{background-color:#283593!important}.indigo10{background-color:#1a237e!important}.blue,.blue6{background-color:#2196f3!important}.blue-border{border-color:#2196f3!important}.blue-text{color:#2196f3!important}.blue1{background-color:#e3f2fd!important}.blue2{background-color:#bbdefb!important}.blue3{background-color:#90caf9!important}.blue4{background-color:#64b5f6!important}.blue5{background-color:#42a5f5!important}.blue7{background-color:#1e88e5!important}.blue8{background-color:#1976d2!important}.blue9{background-color:#1565c0!important}.blue10{background-color:#0d47a1!important}.light-blue,.light-blue6{background-color:#03a9f4!important}.light-blue-border{border-color:#03a9f4!important}.light-blue-text{color:#03a9f4!important}.light-blue1{background-color:#e1f5fe!important}.light-blue2{background-color:#b3e5fc!important}.light-blue3{background-color:#81d4fa!important}.light-blue4{background-color:#4fc3f7!important}.light-blue5{background-color:#29b6f6!important}.light-blue7{background-color:#039be5!important}.light-blue8{background-color:#0288d1!important}.light-blue9{background-color:#0277bd!important}.light-blue10{background-color:#01579b!important}.cyan,.cyan6{background-color:#00bcd4!important}.cyan-border{border-color:#00bcd4!important}.cyan-text{color:#00bcd4!important}.cyan1{background-color:#e0f7fa!important}.cyan2{background-color:#b2ebf2!important}.cyan3{background-color:#80deea!important}.cyan4{background-color:#4dd0e1!important}.cyan5{background-color:#26c6da!important}.cyan7{background-color:#00acc1!important}.cyan8{background-color:#0097a7!important}.cyan9{background-color:#00838f!important}.cyan10{background-color:#006064!important}.teal,.teal6{background-color:#009688!important}.teal-border{border-color:#009688!important}.teal-text{color:#009688!important}.teal1{background-color:#e0f2f1!important}.teal2{background-color:#b2dfdb!important}.teal3{background-color:#80cbc4!important}.teal4{background-color:#4db6ac!important}.teal5{background-color:#26a69a!important}.teal7{background-color:#00897b!important}.teal8{background-color:#00796b!important}.teal9{background-color:#00695c!important}.teal10{background-color:#004d40!important}.green,.green6{background-color:#4caf50!important}.green-border{border-color:#4caf50!important}.green-text{color:#4caf50!important}.green1{background-color:#e8f5e9!important}.green2{background-color:#c8e6c9!important}.green3{background-color:#a5d6a7!important}.green4{background-color:#81c784!important}.green5{background-color:#66bb6a!important}.green7{background-color:#43a047!important}.green8{background-color:#388e3c!important}.green9{background-color:#2e7d32!important}.green10{background-color:#1b5e20!important}.light-green,.light-green6{background-color:#8bc34a!important}.light-green-border{border-color:#8bc34a!important}.light-green-text{color:#8bc34a!important}.light-green1{background-color:#f1f8e9!important}.light-green2{background-color:#dcedc8!important}.light-green3{background-color:#c5e1a5!important}.light-green4{background-color:#aed581!important}.light-green5{background-color:#9ccc65!important}.light-green7{background-color:#7cb342!important}.light-green8{background-color:#689f38!important}.light-green9{background-color:#558b2f!important}.light-green10{background-color:#33691e!important}.lime,.lime6{background-color:#cddc39!important}.lime-border{border-color:#cddc39!important}.lime-text{color:#cddc39!important}.lime1{background-color:#f9fbe7!important}.lime2{background-color:#f0f4c3!important}.lime3{background-color:#e6ee9c!important}.lime4{background-color:#dce775!important}.lime5{background-color:#d4e157!important}.lime7{background-color:#c0ca33!important}.lime8{background-color:#afb42b!important}.lime9{background-color:#9e9d24!important}.lime10{background-color:#827717!important}.yellow,.yellow6{background-color:#ffeb3b!important}.yellow-border{border-color:#ffeb3b!important}.yellow-text{color:#ffeb3b!important}.yellow1{background-color:#fffde7!important}.yellow2{background-color:#fff9c4!important}.yellow3{background-color:#fff59d!important}.yellow4{background-color:#fff176!important}.yellow5{background-color:#ffee58!important}.yellow7{background-color:#fdd835!important}.yellow8{background-color:#fbc02d!important}.yellow9{background-color:#f9a825!important}.yellow10{background-color:#f57f17!important}.amber,.amber6{background-color:#ffc107!important}.amber-border{border-color:#ffc107!important}.amber-text{color:#ffc107!important}.amber1{background-color:#fff8e1!important}.amber2{background-color:#ffecb3!important}.amber3{background-color:#ffe082!important}.amber4{background-color:#ffd54f!important}.amber5{background-color:#ffca28!important}.amber7{background-color:#ffb300!important}.amber8{background-color:#ffa000!important}.amber9{background-color:#ff8f00!important}.amber10{background-color:#ff6f00!important}.orange,.orange6{background-color:#ff9800!important}.orange-border{border-color:#ff9800!important}.orange-text{color:#ff9800!important}.orange1{background-color:#fff3e0!important}.orange2{background-color:#ffe0b2!important}.orange3{background-color:#ffcc80!important}.orange4{background-color:#ffb74d!important}.orange5{background-color:#ffa726!important}.orange7{background-color:#fb8c00!important}.orange8{background-color:#f57c00!important}.orange9{background-color:#ef6c00!important}.orange10{background-color:#e65100!important}.deep-orange,.deep-orange6{background-color:#ff5722!important}.deep-orange-border{border-color:#ff5722!important}.deep-orange-text{color:#ff5722!important}.deep-orange1{background-color:#fbe9e7!important}.deep-orange2{background-color:#ffccbc!important}.deep-orange3{background-color:#ffab91!important}.deep-orange4{background-color:#ff8a65!important}.deep-orange5{background-color:#ff7043!important}.deep-orange7{background-color:#f4511e!important}.deep-orange8{background-color:#e64a19!important}.deep-orange9{background-color:#d84315!important}.deep-orange10{background-color:#bf360c!important}.brown,.brown6{background-color:#795548!important}.brown-border{border-color:#795548!important}.brown-text{color:#795548!important}.brown1{background-color:#efebe9!important}.brown2{background-color:#d7ccc8!important}.brown3{background-color:#bcaaa4!important}.brown4{background-color:#a1887f!important}.brown5{background-color:#8d6e63!important}.brown7{background-color:#6d4c41!important}.brown8{background-color:#5d4037!important}.brown9{background-color:#4e342e!important}.brown10{background-color:#3e2723!important}.blue-grey,.blue-grey6{background-color:#607d8b!important}.blue-grey-border{border-color:#607d8b!important}.blue-grey-text{color:#607d8b!important}.blue-grey1{background-color:#eceff1!important}.blue-grey2{background-color:#cfd8dc!important}.blue-grey3{background-color:#b0bec5!important}.blue-grey4{background-color:#90a4ae!important}.blue-grey5{background-color:#78909c!important}.blue-grey7{background-color:#546e7a!important}.blue-grey8{background-color:#455a64!important}.blue-grey9{background-color:#37474f!important}.blue-grey10{background-color:#263238!important}.grey,.grey6{background-color:#9e9e9e!important}.grey-border{border-color:#9e9e9e!important}.grey-text{color:#9e9e9e!important}.grey1{background-color:#fafafa!important}.grey2{background-color:#f5f5f5!important}.grey3{background-color:#eee!important}.grey4{background-color:#e0e0e0!important}.grey5{background-color:#bdbdbd!important}.grey7{background-color:#757575!important}.grey8{background-color:#616161!important}.grey9{background-color:#424242!important}.grey10{background-color:#212121!important}.horizontal{display:inline-flex;flex-direction:row!important;gap:1rem;inline-size:auto!important;max-inline-size:none!important}.horizontal>*{margin-block:0!important}.vertical{display:flex;flex-direction:column!important}:is(a,button,.button,.chip).vertical{display:inline-flex;gap:.25rem;block-size:auto!important;max-block-size:none!important;padding-block:.5rem}.vertical>*{margin-inline:0!important}.no-elevate{box-shadow:none!important}.small-elevate,.elevate{box-shadow:var(--elevate1)!important}.medium-elevate{box-shadow:var(--elevate2)!important}.large-elevate{box-shadow:var(--elevate3)!important}.round{border-radius:var(---round)}.small-round,.medium-round,.large-round{border-radius:var(---round)!important}.top-round,.bottom-round,.left-round,.right-round,.medium-round,.round{---round: 2rem}.small-round{---round: .5rem}.large-round{---round: 3.5rem}.no-round,.square,.top-round,.bottom-round,.left-round,.right-round{border-radius:0!important}.top-round{border-start-start-radius:var(---round)!important;border-start-end-radius:var(---round)!important}.bottom-round{border-end-end-radius:var(---round)!important;border-end-start-radius:var(---round)!important}.left-round{border-start-start-radius:var(---round)!important;border-end-start-radius:var(---round)!important}.right-round{border-start-end-radius:var(---round)!important;border-end-end-radius:var(---round)!important}.circle{border-radius:50%}:is(button,.button,.chip).circle{border-radius:2.5rem}:is(.circle,.square):not(i,img,video,svg),:is(.circle,.square).chip.medium{block-size:2.5rem;inline-size:2.5rem;padding:0}:is(.circle,.square)>span{display:none}:is(.circle,.square).small:not(i,img,video,svg),:is(.circle,.square).chip{block-size:2rem;inline-size:2rem}:is(.circle,.square).large:not(i,img,video,svg){block-size:3rem;inline-size:3rem}:is(.circle,.square).extra:not(i,img,video,svg){block-size:3.5rem;inline-size:3.5rem}:is(.circle,.square).round{border-radius:1rem!important}.border:not(table,.field){box-sizing:border-box;border:.0625rem solid var(--outline);background-color:transparent;box-shadow:none}.no-border{border-color:transparent!important}:is(nav,.row,dialog.max,header.fixed,footer.fixed,menu>a,menu.max,table,.tabs):not(.round){border-radius:0}[class*=margin]:not(.left-margin,.right-margin,.top-margin,.bottom-margin,.horizontal-margin,.vertical-margin){margin:var(---margin)!important}[class*=margin]{---margin: 1rem}.no-margin{---margin: 0}.auto-margin{---margin: auto}.tiny-margin{---margin: .25rem}.small-margin{---margin: .5rem}.large-margin{---margin: 1.5rem}.left-margin,.horizontal-margin{margin-inline-start:var(---margin)!important}.right-margin,.horizontal-margin{margin-inline-end:var(---margin)!important}.top-margin,.vertical-margin{margin-block-start:var(---margin)!important}.bottom-margin,.vertical-margin{margin-block-end:var(---margin)!important}.no-opacity{opacity:1!important}.opacity{opacity:0!important}.small-opacity{opacity:.75!important}.medium-opacity{opacity:.5!important}.large-opacity{opacity:.25!important}[class*=padding]:not(.left-padding,.right-padding,.top-padding,.bottom-padding,.horizontal-padding,.vertical-padding){padding:var(---padding)!important}[class*=padding]{---padding: 1rem}.no-padding{---padding: 0}.tiny-padding{---padding: .25rem}.small-padding{---padding: .5rem}.large-padding{---padding: 1.5rem}.left-padding,.horizontal-padding{padding-inline-start:var(---padding)!important}.right-padding,.horizontal-padding{padding-inline-end:var(---padding)!important}.top-padding,.vertical-padding{padding-block-start:var(---padding)!important}.bottom-padding,.vertical-padding{padding-block-end:var(---padding)!important}.front{z-index:10!important}.back{z-index:-10!important}.left{inset-inline-start:0}.right{inset-inline-end:0}.top{inset-block-start:0}.bottom{inset-block-end:0}.center{inset-inline-start:50%;transform:translate(-50%)}[dir=rtl] .center{transform:translate(50%)}.middle{inset-block-start:50%;transform:translateY(-50%)}.middle.center{transform:translate(-50%,-50%)}[dir=rtl] .middle.center{transform:translate(50%,-50%)}.scroll{overflow:auto}.no-scroll{overflow:hidden}[class*=width]{max-inline-size:100%}.auto-width{inline-size:auto}.small-width{inline-size:12rem!important}.medium-width{inline-size:24rem!important}.large-width{inline-size:36rem!important}.auto-height{block-size:auto}.small-height{block-size:12rem!important}.medium-height{block-size:24rem!important}.large-height{block-size:36rem!important}.wrap{display:block;white-space:normal}.no-wrap:not(menu){display:flex;white-space:nowrap}.tiny-space:not(nav,ol,ul,.row,.grid,table,.tooltip){block-size:.5rem}:is(.space,.small-space):not(nav,ol,ul,.row,.grid,table,.tooltip){block-size:1rem}.medium-space:not(nav,ol,ul,.row,.grid,table,.tooltip){block-size:2rem}.large-space:not(nav,ol,ul,.row,.grid,table,.tooltip){block-size:3rem}.responsive{inline-size:-webkit-fill-available;inline-size:-moz-available}@media only screen and (max-width: 600px){.m:not(.s),.l:not(.s),.m.l:not(.s){display:none}}@media only screen and (min-width: 601px) and (max-width: 992px){.s:not(.m),.l:not(.m),.s.l:not(.m){display:none}}@media only screen and (min-width: 993px){.m:not(.l),.s:not(.l),.m.s:not(.l){display:none}}html{font-size:var(--size)}body{font-family:var(--font);font-size:.875rem;line-height:1.5rem;letter-spacing:.0313rem}h1,h2,h3,h4,h5,h6{font-weight:400;display:block;align-items:center;line-height:normal}h1{font-size:3.5625rem}h2{font-size:2.8125rem}h3{font-size:2.25rem}h4{font-size:2rem}h5{font-size:1.75rem}h6{font-size:1.5rem}h1.small{font-size:3.0625rem}h2.small{font-size:2.3125rem}h3.small{font-size:1.75rem}h4.small{font-size:1.5rem}h5.small{font-size:1.25rem}h6.small{font-size:1rem}h1.large{font-size:4.0625rem}h2.large{font-size:3.3125rem}h3.large{font-size:2.75rem}h4.large{font-size:2.5rem}h5.large{font-size:2.25rem}h6.large{font-size:2rem}.link{color:var(--primary)!important}.inverse-link{color:var(--inverse-primary)!important}.truncate{overflow:hidden;white-space:nowrap!important;text-overflow:ellipsis;flex:inherit}.truncate>*{white-space:nowrap!important}.small-text{font-size:.75rem}.medium-text{font-size:.875rem}.large-text{font-size:1rem}.upper{text-transform:uppercase}.lower{text-transform:lowercase}.capitalize{text-transform:capitalize}.bold{font-weight:700}.overline{text-decoration:line-through}.underline{text-decoration:underline}.italic{font-style:italic}p{margin:.5rem 0}.no-line{line-height:normal}.tiny-line{line-height:1.25rem}.small-line{line-height:1.5rem}.medium-line{line-height:1.75rem}.large-line{line-height:2rem}.extra-line{line-height:2.25rem}pre{border-radius:0;background-color:var(--surface-container);white-space:pre-wrap;padding:1rem;border-inline-start:.25rem solid var(--primary);font-family:inherit}blockquote{border-radius:0;padding:1rem;border-inline-start:.25rem solid var(--primary);font-family:inherit}code{border-radius:0;background-color:var(--surface-container);white-space:pre-wrap;padding:.25rem}pre>code,blockquote>code{padding:0}.scroll>code{white-space:pre}pre:has(>code){direction:ltr;text-align:start}.wave:after,.chip:after,:is(.button,button):after,:is(nav.tabbed,.tabs)>a:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;border-radius:inherit;inline-size:100%;block-size:100%;background-position:center;background-image:radial-gradient(circle,currentColor 1%,transparent 1%);opacity:0;transition:none}:is(.wave,.chip,.button,button,nav.tabbed>a,.tabs>a):is(:focus-visible,:hover):after{background-size:15000%;opacity:.1;transition:background-size var(--speed2) linear}:is(.wave,.chip,.button,button,nav.tabbed>a,.tabs>a):active:after{background-size:5000%;opacity:0;transition:none}.no-wave:after,.no-wave:is(:hover,:active):after{display:none}.badge{display:inline-flex;align-items:center;justify-content:center;position:absolute;font-size:.6875rem;text-transform:none;z-index:2;padding:0 .25rem;min-block-size:1rem;min-inline-size:1rem;background-color:var(--error);color:var(--on-error);line-height:normal;border-radius:1rem;inset:50% auto auto 50%;transform:translateY(-100%);font-family:var(--font)}.badge.top{transform:translate(-50%,-100%)}.badge.bottom{transform:translate(-50%)}.badge.left{transform:translate(-100%,-50%)}.badge.right{transform:translateY(-50%)}.badge.top.left{transform:translate(-100%,-100%)}.badge.bottom.left{transform:translate(-100%)}.badge.top.right{transform:translateY(-100%)}.badge.bottom.right{transform:translate(0)}.badge.border{border-color:var(--error);color:var(--error);background-color:var(--surface)}.badge:is(.circle,.square){text-align:center;inline-size:auto;block-size:auto;padding:0 .25rem;border-radius:1rem}.badge.square{border-radius:0}.badge.min>*{display:none}.badge.min{clip-path:circle(18.75% at 50% 50%)}nav:is(.left,.right,.top,.bottom)>a>.badge,nav:is(.left,.right,.top,.bottom)>:is(ol,ul)>li>a>.badge{inset:1rem auto auto 50%}.badge.none{inset:auto!important;transform:none;position:relative;margin:0 .125rem}:is(button,.button,.chip)>.badge.none{margin:0 -.5rem}.button,button{box-sizing:content-box;display:inline-flex;align-items:center;justify-content:center;block-size:2.5rem;min-inline-size:2.5rem;font-size:.875rem;font-weight:500;color:var(--on-primary);padding:0 1.5rem;background-color:var(--primary);margin:0 .5rem;border-radius:1.25rem;transition:transform var(--speed3),border-radius var(--speed3),padding var(--speed3);-webkit-user-select:none;user-select:none;gap:1rem;line-height:normal}:is(button,.button).small{block-size:2rem;min-inline-size:2rem;border-radius:1rem}:is(button,.button).large{block-size:3rem;min-inline-size:3rem;border-radius:1.5rem}:is(.button,button):is(.extra,.extend){block-size:3.5rem;min-inline-size:3.5rem;font-size:1rem;border-radius:1.75rem}:is(button,.button).border{border-color:var(--outline);color:var(--primary)}:is(button,.button):not(.border,.chip):hover{box-shadow:var(--elevate1)}.extend>span{display:none}.extend:is(:hover,.active){inline-size:auto;padding:0 1.5rem}.extend:is(:hover,.active)>i+span{display:inherit;margin-inline-start:1.5rem}.extend:is(:hover,.active)>:is(img,svg)+span{display:inherit;margin-inline-start:2.5rem}:is(.button,button)[disabled]{opacity:.5;cursor:not-allowed}.button[disabled]{pointer-events:none}:is(.button,button)[disabled]:before,:is(.button,button)[disabled]:after{display:none}:is(.button,button).fill{background-color:var(--secondary-container)!important;color:var(--on-secondary-container)!important}:is(.button,button).vertical{border-radius:2rem}article{box-shadow:var(--elevate1);background-color:var(--surface-container-low);color:var(--on-surface);padding:1rem;border-radius:.75rem;display:block;transition:transform var(--speed3),border-radius var(--speed3),padding var(--speed3)}article.small{block-size:12rem}article.medium{block-size:20rem}article.large{block-size:32rem}.chip{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;block-size:2rem;min-inline-size:2rem;font-size:.875rem;font-weight:500;background-color:transparent;border:.0625rem solid var(--outline-variant);color:var(--on-surface-variant);padding:0 1rem;margin:0 .5rem;text-transform:none;border-radius:.5rem;transition:transform var(--speed3),border-radius var(--speed3),padding var(--speed3);-webkit-user-select:none;user-select:none;gap:1rem;line-height:normal;letter-spacing:normal}.chip.fill:hover{box-shadow:var(--elevate1)}.chip.medium{block-size:2.5rem;min-inline-size:2.5rem;border-radius:.5rem}.chip.large{block-size:3rem;min-inline-size:3rem;border-radius:.5rem}.chip.fill{background-color:var(--secondary-container)!important;border:none}.chip.round.small{border-radius:1rem}.chip.round{border-radius:1.25rem}.chip.round.large{border-radius:1.5rem}main.responsive{flex:1;padding:.5rem;overflow-x:hidden}:is(main,header,footer,section).responsive{max-inline-size:75rem;margin:0 auto}:is(main,header,footer,section).responsive.max{max-inline-size:100%}*:has(>main.responsive){display:flex;flex-direction:column;min-block-size:100vh}*:has(>nav.bottom:not(.s,.m,.l)){padding-block-end:calc(var(--bottom) + 5rem)}*:has(>nav.top:not(.s,.m,.l)){padding-block-start:calc(var(--top) + 5rem)}*:has(>nav.left:not(.s,.m,.l)){padding-inline-start:calc(var(--left) + 5rem)}*:has(>nav.right:not(.s,.m,.l)){padding-inline-end:calc(var(--right) + 5rem)}*:has(>nav.drawer.left:not(.s,.m,.l)){padding-inline-start:calc(var(--left) + 20rem)}*:has(>nav.drawer.right:not(.s,.m,.l)){padding-inline-end:calc(var(--right) + 20rem)}nav.top:not(.s,.m,.l)~header.fixed{inset-block-start:5rem}nav.bottom:not(.s,.m,.l)~footer.fixed{inset-block-end:5rem}:not(main):has(>aside){overflow:auto}aside{z-index:1}aside:not(.fixed,.absolute).right{float:right}aside:not(.fixed,.absolute).left{float:left}@media only screen and (max-width: 600px){*:has(>nav.s.bottom){padding-block-end:calc(var(--bottom) + 5rem)}*:has(>nav.s.top){padding-block-start:calc(var(--top) + 5rem)}*:has(>nav.s.left){padding-inline-start:calc(var(--left) + 5rem)}*:has(>nav.s.right){padding-inline-end:calc(var(--right) + 5rem)}*:has(>nav.s.drawer.left){padding-inline-start:calc(var(--left) + 20rem)}*:has(>nav.s.drawer.right){padding-inline-end:calc(var(--right) + 20rem)}nav.s.top~header.fixed{inset-block-start:5rem}nav.s.bottom~footer.fixed{inset-block-end:5rem}}@media only screen and (min-width: 601px) and (max-width: 992px){*:has(>nav.m.bottom){padding-block-end:calc(var(--bottom) + 5rem)}*:has(>nav.m.top){padding-block-start:calc(var(--top) + 5rem)}*:has(>nav.m.left){padding-inline-start:calc(var(--left) + 5rem)}*:has(>nav.m.right){padding-inline-end:calc(var(--right) + 5rem)}*:has(>nav.m.drawer.left){padding-inline-start:calc(var(--left) + 20rem)}*:has(>nav.m.drawer.right){padding-inline-end:calc(var(--right) + 20rem)}nav.m.top~header.fixed{inset-block-start:5rem}nav.m.bottom~footer.fixed{inset-block-end:5rem}}@media only screen and (min-width: 993px){*:has(>nav.l.bottom){padding-block-end:calc(var(--bottom) + 5rem)}*:has(>nav.l.top){padding-block-start:calc(var(--top) + 5rem)}*:has(>nav.l.left){padding-inline-start:calc(var(--left) + 5rem)}*:has(>nav.l.right){padding-inline-end:calc(var(--right) + 5rem)}*:has(>nav.l.drawer.left){padding-inline-start:calc(var(--left) + 20rem)}*:has(>nav.l.drawer.right){padding-inline-end:calc(var(--right) + 20rem)}nav.l.top~header.fixed{inset-block-start:5rem}nav.l.bottom~footer.fixed{inset-block-end:5rem}}@media only screen and (max-width: 600px){main.responsive{padding-inline:calc(var(--left) + .5rem) calc(var(--right) + .5rem)}}dialog{display:block;border:none;opacity:0;visibility:hidden;position:fixed;box-shadow:var(--elevate2);color:var(--on-surface);background-color:var(--surface-container-high);padding:1.5rem;z-index:100;inset:10% auto auto 50%;min-inline-size:20rem;max-inline-size:100%;max-block-size:80%;overflow-x:hidden;overflow-y:auto;transition:all var(--speed3),0s background-color;border-radius:1.75rem;transform:translate(-50%,-4rem);outline:none}dialog::backdrop{display:none}dialog.small{inline-size:25%;block-size:25%}dialog.medium{inline-size:50%;block-size:50%}dialog.large{inline-size:75%;block-size:75%}dialog:is(.active,[open]){opacity:1;visibility:visible;transform:translate(-50%)}dialog.top{opacity:1;padding:1rem;inset:0 auto auto 0;block-size:auto;inline-size:100%;min-inline-size:auto;max-block-size:100%;transform:translateY(-100%);border-radius:0 0 1rem 1rem}[dir=rtl] dialog.right,dialog.left{opacity:1;padding:1rem;inset:0 auto auto 0;inline-size:auto;block-size:100%;max-block-size:100%;border-radius:0 1rem 1rem 0;background-color:var(--surface);transform:translate(-100%)}[dir=rtl] dialog.left,dialog.right{opacity:1;padding:1rem;inset:0 0 auto auto;inline-size:auto;block-size:100%;max-block-size:100%;border-radius:1rem 0 0 1rem;background-color:var(--surface);transform:translate(100%)}dialog.bottom{opacity:1;padding:1rem;inset:auto auto 0 0;block-size:auto;inline-size:100%;min-inline-size:auto;max-block-size:100%;transform:translateY(100%);border-radius:1rem 1rem 0 0}dialog.max{inset:0 auto auto 0;inline-size:100%;block-size:100%;max-inline-size:100%;max-block-size:100%;transform:translateY(4rem);background-color:var(--surface)}dialog:is(.active,[open]):is(.left,.right,.top,.bottom,.max){transform:translate(0)}dialog.small:is(.left,.right){inline-size:20rem}dialog.medium:is(.left,.right){inline-size:32rem}dialog.large:is(.left,.right){inline-size:44rem}dialog.small:is(.top,.bottom){block-size:16rem}dialog.medium:is(.top,.bottom){block-size:24rem}dialog.large:is(.top,.bottom){block-size:32rem}hr,[class*=divider]{all:unset;min-inline-size:1.5rem;min-block-size:auto;block-size:.0625rem;background-color:var(--outline-variant);display:block}hr+*,[class*=divider]+*{margin:0!important}hr.medium,.medium-divider{margin:1rem 0!important}hr.large,.large-divider{margin:1.5rem 0!important}hr.small,.small-divider{margin:.5rem 0!important}hr.vertical,.divider.vertical{min-inline-size:auto;min-block-size:1.5rem;inline-size:.0625rem}summary.none{list-style-type:none}summary.none::-webkit-details-marker{display:none}summary{cursor:pointer}summary:focus{outline:none}.field{---size: 3rem;---start: 1.2rem;block-size:var(---size);margin-block-end:2rem;border-radius:.25rem .25rem 0 0}.grid>*>.field{margin-block-end:1rem}.grid>*>.field+.field{margin-block-start:2rem}.grid.no-space>*>.field+.field{margin-block-start:1rem}.grid.medium-space>*>.field+.field{margin-block-start:2.5rem}.grid.large-space>*>.field+.field{margin-block-start:3rem}.field.small{---size: 2.5rem;---start: 1rem}.field.large{---size: 3.5rem;---start: 1.4rem}.field.extra{---size: 4rem;---start: 1.6rem}.field.border{border-radius:.25rem}.field.round.small{border-radius:1.25rem}.field.round{border-radius:1.5rem}.field.round.large{border-radius:1.75rem}.field.round.extra{border-radius:2rem}.field>:is(i,img,svg,progress,a:not(.helper,.error)){position:absolute;inset:50% auto auto auto;transform:translateY(-50%);cursor:pointer;z-index:0;inline-size:1.5rem;block-size:1.5rem}.field>:is(i,img,svg,progress,a:not(.helper,.error)),[dir=rtl] .field>:is(i,img,svg,progress,a:not(.helper,.error)):first-child{inset:50% 1rem auto auto}.field>:is(i,img,svg,progress,a:not(.helper,.error)):first-child,[dir=rtl] .field>:is(i,img,svg,progress,a:not(.helper,.error)){inset:50% auto auto 1rem}.field.invalid>i{color:var(--error)}.field>progress.circle{inset-block-start:calc(50% - .75rem)!important;border-width:.1875rem}.field>a:not(.helper,.error){z-index:10}.field>a>:is(i,img,svg,progress,a:not(.helper,.error)){inline-size:1.5rem;block-size:1.5rem}.field>:is(input,textarea,select){all:unset;position:relative;display:flex;align-items:center;box-sizing:border-box;border-radius:inherit;border:.0625rem solid transparent;padding:0 .9375rem;font-family:inherit;font-size:1rem;inline-size:100%;block-size:100%;outline:none;z-index:1;background:none;resize:none;text-align:start;cursor:text}input::-webkit-date-and-time-value{text-align:start}:is(input,select,textarea):-webkit-autofill{-webkit-background-clip:text;-webkit-text-fill-color:var(--on-surface)}.field>:is(input,textarea,select):focus{border:.125rem solid transparent;padding:0 .875rem}.field.min>textarea{overflow:hidden;position:absolute;top:0;right:0;bottom:0;left:0;max-block-size:12rem}input[type=file],input[type=color],:not(.field)>input[type^=date],:not(.field)>input[type^=time],input::-webkit-calendar-picker-indicator{opacity:0;position:absolute;top:0;right:0;bottom:0;left:0;inline-size:100%;block-size:100%;margin:0;padding:0;border:0;outline:0;z-index:2!important}input::-webkit-search-decoration,input::-webkit-search-cancel-button,input::-webkit-search-results-button,input::-webkit-search-results-decoration,input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{display:none}input[type=number]{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}.field.border>:is(input,textarea,select){border-color:var(--outline)}.field.border>:is(input,textarea,select):focus{border-color:var(--primary)}.field.round>:is(input,textarea,select){padding-inline:1.4376rem}.field.round>:is(input,textarea,select):focus{padding-inline:1.375rem}.field.prefix>:is(input,textarea,select){padding-inline-start:2.9375rem}.field.prefix>.slider{margin-inline-start:3.5rem}.field.prefix>:is(input,textarea,select):focus{padding-inline-start:2.875rem}.field.suffix>:is(input,textarea,select){padding-inline-end:2.9375rem}.field.suffix>.slider{margin-inline-end:3.5rem}.field.suffix>:is(input,textarea,select):focus{padding-inline-end:2.875rem}.field:not(.border,.round)>:is(input,textarea,select){border-block-end-color:var(--outline)}.field:not(.border,.round)>:is(input,textarea,select):focus{border-block-end-color:var(--primary)}.field.round:not(.border,.fill)>:is(input,textarea,select),.field.round:not(.border)>:is(input,textarea,select):focus{box-shadow:var(--elevate1)}.field.round:not(.border,.fill)>:is(input,textarea,select):focus{box-shadow:var(--elevate2)}.field.invalid:not(.border,.round)>:is(input,textarea,select),.field.invalid:not(.border,.round)>:is(input,textarea,select):focus{border-block-end-color:var(--error)}.field.invalid.border>:is(input,textarea,select),.field.invalid.border>:is(input,textarea,select):focus{border-color:var(--error)}.field:has(>:disabled){opacity:.5;cursor:not-allowed}.field>:disabled{cursor:not-allowed}.field.textarea.small:not(.min){---size: 4.5rem}.field.textarea:not(.min){---size: 5.5rem}.field.textarea.large:not(.min){---size: 6.5rem}.field.textarea.extra:not(.min){---size: 7.5rem}.field>select{-webkit-user-select:none;user-select:none}.field>select>option{background-color:var(--surface-container);color:var(--on-surface)}.field.label>:is(input,select){padding-block-start:1rem}.field.label.border:not(.fill)>:is(input,select){padding-block-start:0}.field>textarea{padding-block-start:var(---start);white-space:pre-wrap}.field>textarea:focus{padding-block-start:calc(var(---start) - .06rem)}.field:not(.label)>textarea,.field.border.label:not(.fill)>textarea{padding-block-start:calc(var(---start) - .5rem)}.field:not(.label)>textarea:focus,.field.border.label:not(.fill)>textarea:focus{padding-block-start:calc(var(---start) - .56rem)}.field.label>label{position:absolute;inset:-.5rem auto auto 1rem;display:flex;inline-size:calc(100% - 5rem);block-size:4rem;line-height:4rem;font-size:1rem;transition:all .2s;gap:.25rem;white-space:nowrap}[dir=rtl] .field.label>label{inset:-.5rem 1rem auto auto}.field.label.small>label{block-size:3.5rem;line-height:3.5rem}.field.label.large>label{block-size:4.5rem;line-height:4.5rem}.field.label.extra>label{block-size:5rem;line-height:5rem}.field.label.border.prefix:not(.fill)>:is(label.active,:focus+label,[placeholder]:not(:placeholder-shown)+label,select+label){inset-inline-start:1rem}.field.label.round>label,.field.label.border.prefix.round:not(.fill)>:is(label.active,:focus+label,[placeholder]:not(:placeholder-shown)+label,select+label){inset-inline-start:1.5rem}.field.label.prefix>label{inset-inline-start:3rem}.field.label>:is(label.active,:focus+label,[placeholder]:not(:placeholder-shown)+label,select+label){block-size:2.5rem;line-height:2.5rem;font-size:.75rem}.field.label.border:not(.fill)>:is(label.active,:focus+label,[placeholder]:not(:placeholder-shown)+label,select+label){block-size:1rem;line-height:1rem}.field.label.border:not(.fill)>label:after{content:"";display:block;margin-block-start:.5rem;border-block-start:.0625rem solid var(--outline);block-size:1rem;transition:none;flex:auto}.field.label.border:not(.fill)>:focus+label:after{border-block-start:.125rem solid var(--primary)}.field.label.border:not(.fill)>:is(input,textarea):is(:focus,[placeholder]:not(:placeholder-shown),.active),.field.label.border:not(.fill)>select{clip-path:polygon(-2% -2%,.75rem -2%,.75rem .5rem,calc(100% - 5rem) .5rem,calc(100% - 5rem) -2%,102% -2%,102% 102%,-2% 102%)}[dir=rtl] .field.label.border:not(.fill)>:is(input,textarea):is(:focus,[placeholder]:not(:placeholder-shown),.active),[dir=rtl] .field.label.border:not(.fill)>select{clip-path:polygon(-2% -2%,5rem -2%,5rem .5rem,calc(100% - .75rem) .5rem,calc(100% - .75rem) -2%,102% -2%,102% 102%,-2% 102%)}.field.label.border.round:not(.fill)>:is(input,textarea):is(:focus,[placeholder]:not(:placeholder-shown),.active),.field.label.border.round:not(.fill)>select{clip-path:polygon(-2% -2%,1.25rem -2%,1.25rem .5rem,calc(100% - 5rem) .5rem,calc(100% - 5rem) -2%,102% -2%,102% 102%,-2% 102%)}[dir=rtl] .field.label.border.round:not(.fill)>:is(input,textarea):is(:focus,[placeholder]:not(:placeholder-shown),.active),[dir=rtl] .field.label.border.round:not(.fill)>select{clip-path:polygon(-2% -2%,5rem -2%,5rem .5rem,calc(100% - 1.25rem) .5rem,calc(100% - 1.25rem) -2%,102% -2%,102% 102%,-2% 102%)}.field.label>:focus+label{color:var(--primary)}.field.label.invalid>label,.field.label.invalid>label:after{color:var(--error)!important;border-color:var(--error)!important}.field.label>label>a{block-size:inherit;line-height:inherit;inline-size:1rem}.field.label>label>a>:is(i,img,svg){block-size:1rem;line-height:1rem;inline-size:1rem;font-size:1rem}.field>:is(.helper,.error){position:absolute;inset:auto auto 0 1rem;transform:translateY(100%);font-size:.75rem;background:none!important;padding-block-start:.125rem}[dir=rtl] .field>:is(.helper,.error){inset:auto 1rem 0 auto}a.helper{color:var(--primary)}.field>.error{color:var(--error)!important}.field.round>:is(.helper,.error){inset-inline-start:1.5rem}.field.invalid>.helper{display:none}table td>.field{margin:0}fieldset{border-radius:.25rem;padding:1rem;border:.0625rem solid var(--outline-variant)}fieldset>legend{margin:0 -.25rem;padding:0 .25rem}fieldset>legend+*{margin-block-start:0!important}.grid{---gap: 1rem;display:grid;grid-template-columns:repeat(12,calc(8.33% - var(---gap) + (var(---gap) / 12)));gap:var(---gap)}.grid.no-space{---gap: 0rem}.grid.medium-space{---gap: 1.5rem}.grid.large-space{---gap: 2rem}.grid>*{margin:0}.s1{grid-area:auto/span 1}.s2{grid-area:auto/span 2}.s3{grid-area:auto/span 3}.s4{grid-area:auto/span 4}.s5{grid-area:auto/span 5}.s6{grid-area:auto/span 6}.s7{grid-area:auto/span 7}.s8{grid-area:auto/span 8}.s9{grid-area:auto/span 9}.s10{grid-area:auto/span 10}.s11{grid-area:auto/span 11}.s12{grid-area:auto/span 12}@media only screen and (min-width: 601px){.m1{grid-area:auto/span 1}.m2{grid-area:auto/span 2}.m3{grid-area:auto/span 3}.m4{grid-area:auto/span 4}.m5{grid-area:auto/span 5}.m6{grid-area:auto/span 6}.m7{grid-area:auto/span 7}.m8{grid-area:auto/span 8}.m9{grid-area:auto/span 9}.m10{grid-area:auto/span 10}.m11{grid-area:auto/span 11}.m12{grid-area:auto/span 12}}@media only screen and (min-width: 993px){.l1{grid-area:auto/span 1}.l2{grid-area:auto/span 2}.l3{grid-area:auto/span 3}.l4{grid-area:auto/span 4}.l5{grid-area:auto/span 5}.l6{grid-area:auto/span 6}.l7{grid-area:auto/span 7}.l8{grid-area:auto/span 8}.l9{grid-area:auto/span 9}.l10{grid-area:auto/span 10}.l11{grid-area:auto/span 11}.l12{grid-area:auto/span 12}}i,:is(.checkbox,.radio,.switch)>span:before,.icon>span>i{---size: 1.5rem;font-family:var(--font-icon);font-weight:400;font-style:normal;font-size:var(---size);letter-spacing:normal;text-transform:none;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;word-wrap:normal;direction:ltr;font-feature-settings:"liga";-webkit-font-smoothing:antialiased;vertical-align:middle;text-align:center;overflow:hidden;inline-size:var(---size);min-inline-size:var(---size);block-size:var(---size);min-block-size:var(---size);box-sizing:content-box;line-height:normal}i.tiny{---size: 1rem}.chip>i,i.small{---size: 1.25rem}i.medium{---size: 1.5rem}i.large{---size: 1.75rem}i.extra{---size: 2rem}i.fill,a.row:is(:hover,:focus)>i,.transparent:is(:hover,:focus)>i{font-variation-settings:"FILL" 1}i>:is(img,svg){inline-size:100%;block-size:100%;background-size:100%;border-radius:inherit;position:absolute;inset:0 auto auto 0;padding:inherit}i[class*=fa-]{font-size:calc(var(---size) * .85);line-height:normal;block-size:auto;min-block-size:auto}.absolute{position:absolute}.fixed{position:fixed}:is(.absolute,.fixed).left.right{inline-size:auto}:is(.absolute,.fixed).left.right.small{block-size:20rem}:is(.absolute,.fixed).left.right.medium{block-size:28rem}:is(.absolute,.fixed).left.right.large{block-size:44rem}:is(.absolute,.fixed).top.bottom.small{inline-size:20rem}:is(.absolute,.fixed).top.bottom.medium{inline-size:28rem}:is(.absolute,.fixed).top.bottom.large{inline-size:44rem}header,footer{display:flex;justify-content:center;flex-direction:column;min-block-size:4rem;padding:0 1rem;background-color:var(--surface-container)}main~footer{min-block-size:5rem}:is(header,footer).fixed.responsive{z-index:12}:is(header,footer,menu>*).fixed{position:sticky;top:0;right:0;bottom:0;left:0;z-index:11;background-color:inherit}:is(dialog,menu,nav,article)>:is(header,footer){background-color:inherit;padding:0}:is(dialog,article,[class*=padding])>:is(header,footer).fixed{---translateY: 1rem;transform:translateY(var(---translateY))}:is(dialog,article,[class*=padding])>header.fixed{transform:translateY(calc(-1 * var(---translateY)))}.no-padding>:is(header,footer).fixed{transform:none}.small-padding>:is(header,footer).fixed{---translateY: .5rem}:is(.large-padding,dialog:not(.left,.right,.top,.bottom))>:is(header,footer).fixed{---translateY: 1.5rem}svg{fill:currentcolor}:is(img,svg,video):is(.small,.medium,.large,.tiny,.extra,.round,.circle,.responsive){object-fit:cover;object-position:center;transition:transform var(--speed3),border-radius var(--speed3),padding var(--speed3);block-size:3rem;inline-size:3rem}:is(img,svg,video).round{border-radius:.5rem}:is(img,svg,video).tiny{block-size:2rem;inline-size:2rem}:is(img,svg,video).small{block-size:2.5rem;inline-size:2.5rem}:is(img,svg,video).large{block-size:3.5rem;inline-size:3.5rem}:is(img,svg,video).extra{block-size:4rem;inline-size:4rem}:is(img,svg,video).responsive{inline-size:100%;block-size:100%;margin:0 auto}:is(button,.button,.chip):not(.transparent)>.responsive{border:.25rem solid transparent}:is(button,.button,.chip.medium)>.responsive{inline-size:2.5rem}:is(button.small,.button.small,.chip:not(.medium))>.responsive{inline-size:2rem}:is(button,.button,.chip).large>.responsive{inline-size:3rem}:is(button,.button,.chip).extra>.responsive{inline-size:3.5rem}:is(img,svg,video).responsive.tiny{inline-size:100%;block-size:4rem}:is(img,svg,video).responsive.small{inline-size:100%;block-size:8rem}:is(img,svg,video).responsive.medium{inline-size:100%;block-size:12rem}:is(img,svg,video).responsive.large{inline-size:100%;block-size:16rem}:is(img,svg,video).responsive.extra{inline-size:100%;block-size:20rem}:is(img,svg,video).responsive.round{border-radius:2rem}:is(img,svg,video).empty-state{max-inline-size:100%;inline-size:24rem}:is(button,.button,.chip,.field)>:is(img,svg):not(.responsive,.tiny,.small,.medium,.large,.extra),.tabs :is(img,svg):not(.responsive,.tiny,.small,.medium,.large,.extra){min-inline-size:1.5rem;max-inline-size:1.5rem;min-block-size:1.5rem;max-block-size:1.5rem}:is(button,.button,.chip)>:is(i,img,svg),:is(button,.button,.chip)>.responsive{margin:0 -.5rem}:is(button,.button)>.responsive{margin-inline-start:-1.5rem}:is(button,.button)>span+.responsive{margin-inline-start:-.5rem;margin-inline-end:-1.5rem}.chip>.responsive{margin-inline-start:-1rem}.chip>span+.responsive{margin-inline-start:-.5rem;margin-inline-end:-1rem}:is(.circle,.square)>.responsive{margin:0}.extend>:is(.responsive,i){margin:0;position:absolute;inset-inline:1rem;z-index:1}.extend>.responsive{inset-inline:0;inline-size:3.5rem}.extend.border>.responsive{inline-size:3.375rem}menu>li{all:unset}menu{opacity:0;visibility:hidden;position:absolute;box-shadow:var(--elevate2);background-color:var(--surface-container);z-index:11;inset:auto auto 0 0;inline-size:100%;max-block-size:50vh;max-inline-size:none!important;overflow-x:hidden;overflow-y:auto;font-size:.875rem;font-weight:400;text-transform:none;color:var(--on-surface);line-height:normal;text-align:start;border-radius:.25rem;transform:scale(.8) translateY(120%);transition:all var(--speed2),0s background-color}[dir=rtl] menu{inset:auto 0 0 auto}menu.no-wrap{inline-size:max-content;white-space:nowrap!important}menu.active,menu:not([data-ui]):active,:not(menu,[data-ui]):focus-within>menu,menu>:is(a,li):hover+menu,menu>menu:hover{opacity:1;visibility:visible;transform:scale(1) translateY(100%)}menu *{white-space:inherit!important}menu>a,menu>li>a{padding:.5rem 1rem;min-block-size:3rem;flex:1}menu>a:not(.row),menu>li>a:not(.row){display:flex;flex-direction:column;align-items:flex-start}menu>a:is(:hover,:focus,.active),menu>li>a:is(:hover,:focus,.active){background-color:var(--active)}menu.min{inset:0 0 auto 0;transform:none!important;border-radius:inherit}[dir=rtl] menu.min.right,menu.min.left{inset:0 0 auto auto}[dir=rtl] menu.min.left,menu.min.right{inset:0 auto auto 0}menu.max{position:fixed;top:0;right:0;bottom:0;left:0;block-size:100%;max-block-size:none;min-block-size:auto;z-index:100;transform:none!important}menu.no-wrap:is(.min,.max){min-inline-size:16rem}[dir=rtl] menu.right,menu.left{inset:auto 0 0 auto}[dir=rtl] menu.left,menu.right{inset:auto auto 0 0}menu:has(>menu),menu>menu{---child: 1;---type: 0;overflow:unset;white-space:nowrap;inline-size:auto;min-inline-size:12rem;max-block-size:none}menu>menu,menu>menu.right,[dir=rtl] menu>menu.left{inset:auto auto calc(3rem * (var(---child) - var(---type))) 100%}[dir=rtl] menu>menu,[dir=rtl] menu>menu.right,menu>menu.left{inset:auto 100% calc(3rem * (var(---child) - var(---type))) auto}menu>:nth-last-child(2){---child: 2}menu>:nth-last-child(3){---child: 3}menu>:nth-last-child(4){---child: 4}menu>:nth-last-child(5){---child: 5}menu>:nth-last-child(6){---child: 6}menu>:nth-last-child(7){---child: 7}menu>:nth-last-child(8){---child: 8}menu>:nth-last-child(9){---child: 9}menu>:nth-last-child(10){---child: 10}menu>:nth-last-child(11){---child: 11}menu>:nth-last-of-type(2){---type: 1}menu>:nth-last-of-type(3){---type: 2}menu>:nth-last-of-type(4){---type: 3}menu>:nth-last-of-type(5){---type: 4}menu>:nth-last-of-type(6){---type: 5}menu>:nth-last-of-type(7){---type: 6}menu>:nth-last-of-type(8){---type: 7}menu>:nth-last-of-type(9){---type: 8}menu>:nth-last-of-type(10){---type: 9}menu>:nth-last-of-type(11){---type: 10}nav>:is(ol,ul),nav>:is(ol,ul)>li{all:unset}nav,.row,a.row,nav.drawer>:is(a,label),nav.drawer>:is(ol,ul)>li>:is(a,label){display:flex;align-items:center;align-self:normal;text-align:start;justify-content:flex-start;white-space:nowrap;gap:1rem}a.row,nav.row{min-block-size:3rem;margin:0}:is(nav,.row,.max)>:only-child,nav>:is(ol,ul)>li>:only-child{margin:0}:is(nav,.row)>*{margin:0;white-space:normal;flex:none}:is(nav,.row).no-space{gap:0}:is(nav,.row).no-space:not(.vertical)>.border+.border{border-inline-start:0}:is(nav,.row).no-space.vertical>.border+.border{border-top:0}:is(nav,.row).medium-space{gap:1.5rem}:is(nav,.row).large-space{gap:2rem}:is(nav,.row)>.max,:is(nav,.row)>:is(ol,ul)>.max,nav.drawer>:is(a,label)>.max,nav.drawer>:is(ol,ul)>li>:is(a,label)>.max{flex:1}:is(nav,.row).wrap{display:flex;flex-wrap:wrap}:is(header,footer)>:is(nav,.row){min-block-size:inherit}:is(nav,.row)>.border.no-margin+.border.no-margin{border-inline-start:0}nav:is(.left,.right,.top,.bottom){border:0;position:fixed;color:var(--on-surface);transform:none;z-index:100;block-size:auto;inline-size:auto;text-align:center;padding:.5rem 1rem;inset:var(--top) var(--right) var(--bottom) var(--left);margin:0}nav:is(.left,.right){inline-size:5rem;justify-content:flex-start;flex-direction:column;background-color:var(--surface)}nav:is(.top,.bottom){block-size:5rem;justify-content:center;flex-direction:row;background-color:var(--surface-container)}nav.top{inset-block-end:auto}nav.left{inset-inline-end:auto}nav.right{inset-inline-start:auto}nav.bottom{inset-block-start:auto}nav.drawer{flex-direction:column;align-items:normal;inline-size:20rem;gap:0;padding:.5rem 1rem}nav.drawer:is(.min,.max){inline-size:auto}nav.drawer.max{inline-size:100%}:is(nav,.row)>header{background-color:inherit}nav:is(.left,.right)>header{transform:translateY(-.5rem)}nav.drawer>header{transform:translateY(-.75rem);min-block-size:4.5rem;align-self:stretch}nav.drawer>:is(a,label),nav.drawer>:is(ol,ul)>li>:is(a,label),a.row.wave,nav.row.wave{padding:.75rem;font-size:inherit}nav.drawer>a,nav.drawer>:is(ol,ul)>li>a{border-radius:2rem}nav.drawer>a:is(:hover,.active),nav.drawer>:is(ol,ul)>li>a:is(:hover,.active){background-color:var(--secondary-container)}nav.drawer>a:is(:hover,:focus,.active)>i,nav.drawer>:is(ol,ul)>li>a:is(:hover,:focus,.active)>i{font-variation-settings:"FILL" 1}nav>:is(ol,ul){all:inherit;flex:auto}nav:not(.left,.right,.bottom,.top)>:is(ol,ul){padding:0}nav:is(.left,.right,.top,.bottom):not(.drawer)>a:not(.button,.chip),nav:is(.left,.right,.top,.bottom):not(.drawer)>:is(ol,ul)>li>a:not(.button,.chip){align-self:center;display:flex;flex-direction:column;gap:.25rem;line-height:normal}nav:is(.top,.bottom):not(.drawer)>a:not(.button,.chip),nav:is(.top,.bottom):not(.drawer)>:is(ol,ul)>li>a:not(.button,.chip){inline-size:3.5rem}nav:is(.left,.right,.top,.bottom):not(.drawer)>a:not(.button,.chip)>i,nav:is(.left,.right,.top,.bottom):not(.drawer)>:is(ol,ul)>li>a:not(.button,.chip)>i{padding:.25rem;border-radius:2rem;transition:padding var(--speed1) linear;margin:0 auto}nav:is(.left,.right,.top,.bottom):not(.drawer)>a:not(.button,.chip):is(:hover,:focus,.active)>i,nav:is(.left,.right,.top,.bottom):not(.drawer)>:is(ol,ul)>li>a:not(.button,.chip):is(:hover,:focus,.active)>i{background-color:var(--secondary-container);color:var(--on-secondary-container);padding:.25rem 1rem;font-variation-settings:"FILL" 1}:is(nav,.row):is(.left-align,.top-align,.vertical){justify-content:flex-start}:is(nav,.row):is(.right-align,.bottom-align){justify-content:flex-end}:is(nav,.row):is(.center-align,.middle-align){justify-content:center}:is(nav,.row):is(.left-align,.top-align,.vertical).vertical{align-items:flex-start}:is(nav,.row):is(.right-align,.bottom-align).vertical{align-items:flex-end}:is(nav,.row):is(.center-align,.middle-align).vertical{align-items:center}:is(.drawer,.vertical)>:is(li,[class*=divider],hr):not(.vertical),:is(.drawer,.vertical)>:is(ol,ul)>li:not(.vertical){align-self:stretch}nav:not(.left,.right)>.space{inline-size:.5rem}nav:not(.left,.right)>.medium-space{inline-size:1rem}nav:not(.left,.right)>.large-space{inline-size:1.5rem}nav.tabbed{background-color:var(--surface-container);border-radius:4rem!important;gap:0rem;block-size:4rem}nav.tabbed.small{block-size:3rem}nav.tabbed.large{block-size:5rem}nav.tabbed>a{border-radius:inherit;block-size:inherit;display:inline-flex;align-items:center;padding-inline:1rem;gap:.5rem;font-size:1rem;flex:1}nav.tabbed>a.active{background-color:var(--primary-container)}:not(nav)>:is(ul,ol){all:revert}:is(.scroll,.no-scroll,.no-space,.tabs,.tabbed)>:focus-visible{outline:.125rem solid var(--primary);outline-offset:-.125rem}@media only screen and (max-width: 600px){nav.top,nav.bottom{justify-content:space-around}}.overlay{opacity:0;visibility:hidden;position:fixed;top:0;right:0;bottom:0;left:0;color:var(--on-surface);background-color:var(--overlay);z-index:100;transition:all var(--speed3),0s background-color}.overlay.active{opacity:1;visibility:visible}.page{---transform: translate(0, 0);opacity:0;position:absolute;display:none}.page.active{opacity:1;position:inherit;display:inherit;animation:var(--speed4) to-page ease}.page.active.top{---transform: translate(0, -4rem)}.page.active.bottom{---transform: translate(0, 4rem)}.page.active.left{---transform: translate(-4rem, 0)}.page.active.right{---transform: translate(4rem, 0)}@keyframes to-page{0%{opacity:0;transform:var(---transform)}to{opacity:1;transform:translate(0)}}progress{position:relative;inline-size:100%;block-size:.5rem;color:var(--primary);background:var(--primary-container);border-radius:1rem;flex:none;border:none;overflow:hidden;writing-mode:horizontal-tb;direction:ltr;-webkit-appearance:none}progress.small{inline-size:4rem}progress.medium{inline-size:8rem}progress.large{inline-size:12rem}progress:not(.circle,[value]):after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;inline-size:100%;block-size:100%;clip-path:none;background:currentcolor;animation:1.6s to-linear ease infinite}progress:not(.circle,[value])::-moz-progress-bar{animation:1.6s to-linear ease infinite}progress:not(.circle,[value])::-webkit-progress-value{animation:1.6s to-linear ease infinite}progress::-webkit-progress-bar{background:none}progress::-webkit-progress-value{background:currentcolor}progress::-moz-progress-bar{background:currentcolor}progress.circle{display:inline-block;inline-size:2.5rem;block-size:2.5rem;border-radius:50%;border-width:.3rem;border-style:solid;border-color:currentcolor;animation:1.6s to-circular linear infinite;background:none;flex:none}progress.circle::-moz-progress-bar{background:none}progress.circle.small{inline-size:1.5rem;block-size:1.5rem;border-width:.2rem}progress.circle.large{inline-size:3.5rem;block-size:3.5rem;border-width:.4rem}:is(nav,.row,.field)>progress:not(.circle,.small,.medium,.large){flex:auto}progress.max{display:unset;position:absolute;inline-size:100%!important;block-size:100%!important;color:var(--active);background:none;top:0;right:0;bottom:0;left:0;border-radius:inherit;animation:none;writing-mode:horizontal-tb}progress:is(.horizontal,.vertical,.max){display:unset;inline-size:100%!important}progress.vertical{writing-mode:vertical-lr}progress.max.vertical{transform:rotate(-180deg)}progress.max+*{margin-block-start:0}:is(.button,button,.chip)>progress.circle{color:inherit}@supports (-moz-appearance:none){progress.max.vertical{transform:none}}@keyframes to-linear{0%{margin-inline-start:0%;inline-size:0%}50%{margin-inline-start:0%;inline-size:100%}to{margin-inline-start:100%;inline-size:0%}}@keyframes to-circular{0%{transform:rotate(0);clip-path:polygon(50% 50%,0% 0%,50% 0%,50% 0%,50% 0%,50% 0%,50% 0%,50% 0%,50% 0%)}20%{clip-path:polygon(50% 50%,0% 0%,50% 0%,100% 0%,100% 0%,100% 0%,100% 0%,100% 0%,100% 0%)}30%{clip-path:polygon(50% 50%,0% 0%,50% 0%,100% 0%,100% 50%,100% 50%,100% 50%,100% 50%,100% 50%)}40%{clip-path:polygon(50% 50%,0% 0%,50% 0%,100% 0%,100% 50%,100% 100%,100% 100%,100% 100%,100% 100%)}50%{clip-path:polygon(50% 50%,50% 0%,50% 0%,100% 0%,100% 50%,100% 100%,50% 100%,50% 100%,50% 100%)}60%{clip-path:polygon(50% 50%,100% 50%,100% 50%,100% 50%,100% 50%,100% 100%,50% 100%,0% 100%,0% 100%)}70%{clip-path:polygon(50% 50%,50% 100%,50% 100%,50% 100%,50% 100%,50% 100%,50% 100%,0% 100%,0% 50%)}80%{clip-path:polygon(50% 50%,0% 100%,0% 100%,0% 100%,0% 100%,0% 100%,0% 100%,0% 100%,0% 50%)}90%{transform:rotate(360deg);clip-path:polygon(50% 50%,0% 50%,0% 50%,0% 50%,0% 50%,0% 50%,0% 50%,0% 50%,0% 50%)}to{clip-path:polygon(50% 50%,0% 50%,0% 50%,0% 50%,0% 50%,0% 50%,0% 50%,0% 50%,0% 50%)}}.checkbox,.radio,.switch{direction:ltr;inline-size:auto;block-size:auto;line-height:normal;white-space:nowrap;cursor:pointer;display:inline-flex;align-items:center}:is(.checkbox,.radio)>input{inline-size:1.5rem;block-size:1.5rem;opacity:0}.switch>input{inline-size:3.25rem;block-size:2rem;opacity:0}:is(.checkbox,.radio,.switch)>span{display:inline-flex;align-items:center;color:var(--on-surface);font-size:.875rem}:is(.checkbox,.radio)>span:not(:empty){padding-inline-start:.25rem}:is(.checkbox,.radio,.switch)>span:before,.icon>span>i,:is(.checkbox,.radio)>span:after{content:"";inline-size:1.5rem;block-size:1.5rem;box-sizing:border-box;margin:0 auto;outline:none;color:var(--primary);position:absolute;inset:auto auto auto -1.5rem;border-radius:50%;-webkit-user-select:none;user-select:none;z-index:1}.switch>span:before,.switch.icon>span>i{position:absolute;inset:50% auto auto 0;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;transition:all var(--speed2);font-size:1rem;-webkit-user-select:none;user-select:none;min-inline-size:auto;content:"";color:var(--surface-variant);background-color:var(--outline)}.switch>span:before,.switch.icon>span>i{transform:translate(-3rem,-50%) scale(.6)}.switch.icon>span>i{transform:translate(-3rem,-50%) scale(1)}.checkbox>span:before{content:"check_box_outline_blank"}.checkbox>input:checked+span:before{content:"check_box";font-variation-settings:"FILL" 1}.checkbox>input:indeterminate+span:before{content:"indeterminate_check_box"}.radio>span:before{content:"radio_button_unchecked"}.radio>input:checked+span:before{content:"radio_button_checked"}:is(.radio,.checkbox,.switch).icon>span:before{content:""!important;font-variation-settings:unset!important}:is(.checkbox,.radio)>span:after{transition:all var(--speed1);background-color:currentColor;box-shadow:0 0 0 0 currentColor;opacity:0}:is(.checkbox,.radio):is(:hover)>input:not(:disabled)+span:after,:is(.checkbox,.radio)>input:not(:disabled):is(:focus)+span:after{box-shadow:0 0 0 .5rem currentColor;opacity:.1}.switch>input:not(:disabled):is(:focus,:hover)+span:before,.switch.icon>input:not(:disabled):is(:focus,:hover)+span>i{box-shadow:0 0 0 .5rem var(--active)}:is(.checkbox,.radio)>input:checked+span:before,:is(.checkbox,.radio).icon>input:checked+span>i{color:var(--primary)}.icon>input:checked+span>i:first-child,.icon>span>i:last-child{opacity:0}.icon>input:checked+span>i:last-child,.icon>span>i:first-child{opacity:1}.switch>input:checked+span:after{border:none;background-color:var(--primary)}.switch>input:checked+span:before,.switch.icon>input:checked+span>i{content:"check";color:var(--primary);background-color:var(--on-primary)}.switch>input:checked+span:before,.switch.icon>input:checked+span>i{transform:translate(-1.75rem,-50%) scale(1)}:is(.checkbox,.radio,.switch)>input:disabled+span{opacity:.5;cursor:not-allowed}.switch>span:after{content:"";position:absolute;inset:50% auto auto 0;background-color:var(--active);border:.125rem solid var(--outline);box-sizing:border-box;inline-size:3.25rem;block-size:2rem;border-radius:2rem}.switch>span:after{transform:translate(-3.25rem,-50%)}.field>:is(nav,.row){flex-grow:1;padding:0 1rem}.field.round>:is(nav,.row){flex-grow:1;padding:0 1.5rem}[dir=rtl] .switch{transform:scale(-1)}[dir=rtl] .switch>span:before,[dir=rtl] .switch.icon>span>i{transform:translate(-3rem,-50%) scale(-.6)}[dir=rtl] .switch.icon>span>i{transform:translate(-3rem,-50%) scale(-1)}[dir=rtl] .switch>input:checked+span:before,[dir=rtl] .switch.icon>input:checked+span>i{transform:translate(-1.75rem,-50%) scale(-1)}.switch>:focus-visible+span:after{outline:.125rem solid var(--primary);outline-offset:.25rem}:is(.checkbox,.radio)>:focus-visible+span:before{outline:.125rem solid var(--primary);outline-offset:.375rem}.slider{---start: 0%;---end: 0%;---value1: "";---value2: "";display:flex;align-items:center!important;inline-size:auto;block-size:1.25rem;margin:1.125rem;flex:none;direction:ltr}[dir=rtl] .slider{transform:scaleX(-1)}.slider.vertical{flex-direction:row!important;margin:.5rem auto!important;padding:50% 0;transform:rotate(-90deg);inline-size:100%}.slider.small{inline-size:4rem}.slider.medium{inline-size:8rem}.slider.large{inline-size:12rem}.slider>input{-webkit-appearance:none;-moz-appearance:none;appearance:none;box-shadow:none;border:none;outline:none;pointer-events:none;inline-size:100%;block-size:1rem;background:none;z-index:1;padding:0;margin:0;transform:rotate(0)}.slider>input:only-of-type{pointer-events:all}.slider>input+input{position:absolute}.slider>input::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;box-shadow:none;border:none;outline:none;pointer-events:all;block-size:2.75rem;inline-size:.25rem;border-radius:.25rem;background:var(--primary);cursor:grab;margin:0}.slider>input::-webkit-slider-thumb:active{cursor:grabbing}.slider>input::-moz-range-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;box-shadow:none;border:none;outline:none;pointer-events:all;block-size:2.75rem;inline-size:.25rem;border-radius:.25rem;background:var(--primary);cursor:grab;margin:0}.slider>input::-moz-range-thumb:active{cursor:grabbing}.slider>input:not(:disabled):is(:focus)::-webkit-slider-thumb{transform:scaleX(.6)}.slider>input:not(:disabled):is(:focus)::-moz-range-thumb{transform:scaleX(.6)}.slider>input:disabled{cursor:not-allowed;opacity:1}.slider>input:disabled::-webkit-slider-thumb{background:#9e9e9e;cursor:not-allowed}.slider>input:disabled::-moz-range-thumb{background:#9e9e9e;cursor:not-allowed}.slider>input:disabled~span{background:#9e9e9e}.slider>span{position:absolute;block-size:1rem;border-radius:1rem 0 0 1rem;background:var(--primary);z-index:0;inset:calc(50% - .5rem) var(---end) auto var(---start);clip-path:polygon(0 0,calc(100% - .5rem) 0,calc(100% - .5rem) 100%,0 100%)}.slider>input+input~span{border-radius:0;clip-path:polygon(.5rem 0,max(.5rem,calc(100% - .5rem)) 0,max(.5rem,calc(100% - .5rem)) 100%,.5rem 100%)}.field>.slider{inline-size:100%}.slider:before{content:"";position:absolute;inline-size:100%;block-size:1rem;border-radius:1rem;background:var(--primary-container);clip-path:polygon(calc(var(---start) - .5rem) 0,0 0,0 100%,calc(var(---start) - .5rem) 100%,calc(var(---start) - .5rem) 0,calc(100% - var(---end) + .5rem) 0,100% 0,100% 100%,calc(100% - var(---end) + .5rem) 100%,calc(100% - var(---end) + .5rem) 0)}.slider:has(>[disabled]):before{background:var(--active)}.slider>.tooltip{visibility:hidden!important;opacity:0!important;inset:0 auto auto calc(100% - var(---end));border-radius:2rem;transition:top var(--speed2) ease,opacity var(--speed2) ease;transform:translate(-50%,-50%)!important;padding:.75rem 1rem}[dir=rtl] .slider>.tooltip{transform:translate(-50%,-50%) scaleX(-1)!important}.slider>.tooltip+.tooltip{inset:.25rem calc(100% - var(---start)) auto auto;transform:translate(50%,-50%)!important}[dir=rtl] .slider>.tooltip+.tooltip{transform:translate(50%,-50%) scaleX(-1)!important}.slider>.tooltip:before{content:var(---value1)}.slider>.tooltip+.tooltip:before{content:var(---value2)}.slider>:focus~.tooltip{inset-block-start:-1rem!important;opacity:1!important;visibility:visible!important}.slider.vertical>.tooltip{display:none}:is(nav,.row,.field)>.slider:not(.circle,.small,.medium,.large){flex:auto}.slider.max,.slider.max.vertical,.slider.max>input,.slider.max.vertical>input{all:unset;margin:0!important;position:absolute;color:var(--primary);top:0;right:0;bottom:0;left:0;border-radius:inherit;overflow:hidden;z-index:2;cursor:grab;inline-size:100%;block-size:100%}.slider.max:before{display:none}.slider.max.vertical>input{writing-mode:vertical-lr;transform:rotate(-180deg)}.slider.max>input::-webkit-slider-thumb{opacity:0;inline-size:1rem;block-size:100vh;transform:none!important}.slider.max>input::-moz-range-thumb{opacity:0;inline-size:1rem;block-size:100vh;transform:none!important}.slider.max>span{block-size:auto!important;inset:0 var(---end) 0 var(---start);clip-path:none;background:currentcolor;border-radius:0}.slider.max.vertical>span{inset:var(---end) 0 var(---start) 0}.slider>input:focus-visible::-webkit-slider-thumb{outline:.1875rem solid var(--primary);outline-offset:.25rem}.slider>input:focus-visible::-moz-range-thumb{outline:.1875rem solid var(--primary);outline-offset:.25rem}.slider.max>input:focus-visible{outline:.1875rem solid var(--primary);outline-offset:-.125rem}@media (pointer: coarse){.slider>:hover~.tooltip{inset-block-start:-1rem!important;opacity:1!important;visibility:visible!important}}.snackbar{position:fixed;inset:auto auto 6rem 50%;inline-size:80%;block-size:auto;z-index:200;visibility:hidden;display:flex;box-shadow:var(--elevate2);color:var(--inverse-on-surface);background-color:var(--inverse-surface);padding:1rem;opacity:1;cursor:pointer;text-align:start;align-items:center;border-radius:.25rem;gap:.5rem;transition:all var(--speed2);transform:translate(-50%,1rem);opacity:0}.snackbar.top{inset:6rem auto auto 50%}.snackbar.active{visibility:visible;transform:translate(-50%);opacity:1}.snackbar>.max{flex:auto}@media only screen and (min-width: 993px){.snackbar{inline-size:40%}}table{inline-size:100%;border-spacing:0;font-size:.875rem;text-align:start}.scroll>table,table :is(thead,tbody,tfoot,tr,th,td){background-color:inherit;color:inherit}:is(th,td){inline-size:auto;text-align:inherit;padding:.5rem}:is(th,td)>*{vertical-align:middle}table.border>tbody>tr:not(:last-child)>td,thead>tr>th{border-block-end:.0625rem solid var(--outline)}tfoot>tr>th{border-block-start:.0625rem solid var(--outline)}table.stripes>tbody>tr:nth-child(odd){background-color:var(--active)}table.no-space :is(th,td){padding:0}table.medium-space :is(th,td){padding:.75rem}table.large-space :is(th,td){padding:1rem}table>.fixed,th.fixed{position:sticky;z-index:1;inset-block-start:0}tfoot.fixed,tfoot th.fixed{inset-block-end:0}:is(td,th).min{inline-size:.1%;white-space:nowrap}.tabs{display:flex;white-space:nowrap;border-block-end:.0625rem solid var(--surface-variant)}.tabs:not(.left-align,.right-align,.center-align){justify-content:space-around}.tabs>a{display:flex;font-size:.875rem;font-weight:500;color:var(--on-surface-variant);padding:.5rem 1rem;text-align:center;min-block-size:3rem;inline-size:100%;gap:.25rem}.tabs.small>a{min-block-size:2rem}.tabs.large>a{min-block-size:4rem}.tabs>a.active,.tabs>a.active>i{color:var(--primary)}.tabs>a.active:before{content:"";position:absolute;inset:auto 0 0 0;block-size:.125rem;background-color:var(--primary)}.tabs.min>a.active:before{margin:0 auto;max-inline-size:min(100%,4rem)}.tabs:is(.left-align,.center-align,.right-align)>a{inline-size:auto}.tooltip{---space: -.5rem;visibility:hidden;display:flex;align-items:center;justify-content:center;gap:.5rem;background-color:var(--inverse-surface);color:var(--inverse-on-surface);font-size:.75rem;text-align:center;border-radius:.25rem;padding:.5rem;position:absolute;z-index:3;inset:0 auto auto 50%;inline-size:auto;white-space:nowrap;font-weight:500;opacity:0;transition:all var(--speed2);line-height:normal;transform:translate(-50%,-100%) scale(.9)}.tooltip.left{inset:50% auto auto 0;transform:translate(-100%,-50%) scale(.9)}.tooltip.right{inset:50% 0 auto auto;transform:translate(100%,-50%) scale(.9)}.tooltip.bottom{inset:auto auto 0 50%;transform:translate(-50%,100%) scale(.9)}.tooltip.small{inline-size:8rem;white-space:normal}.tooltip.medium{inline-size:12rem;white-space:normal}.tooltip.large{inline-size:16rem;white-space:normal}:hover>.tooltip{visibility:visible;opacity:1;transform:translate(-50%,-100%) scale(1)}:hover>.tooltip.left{transform:translate(-100%,-50%) scale(1)}:hover>.tooltip.right{transform:translate(100%,-50%) scale(1)}:hover>.tooltip.bottom{transform:translate(-50%,100%) scale(1)}.tooltip.no-space{---space: 0}.tooltip.medium-space{---space: -1rem}.tooltip.large-space{---space: -1.5rem}.tooltip:not(.left,.right,.bottom){margin-block-start:var(---space)!important}.tooltip.left,.tooltip.right{margin-inline:var(---space)!important}.tooltip.bottom{margin-block-end:var(---space)!important}menu:active~.tooltip,:is(button,.button):focus>menu~.tooltip,.field>:focus~menu~.tooltip{visibility:hidden}.slider>.tooltip{---space: -1.25rem}.slider.vertical>.tooltip{---space: -.75rem}.slider.vertical>.tooltip:is(.left,.right){---space: -.5rem}.tooltip.max{display:block;font-size:inherit;white-space:normal;text-align:start;inline-size:20rem;border-radius:.5rem;padding:1rem;box-shadow:var(--elevate2)}[class*=blur],[class*=blur].light{---blur: 1rem;-webkit-backdrop-filter:blur(var(---blur));backdrop-filter:blur(var(---blur));color:var(--on-surface);background-color:#ffffff80}.dark [class*=blur],[class*=blur].dark{background-color:#00000080}.small-blur{---blur: .5rem}.large-blur{---blur: 1.5rem}.shadow{background-color:#00000050}:is(.left-shadow,.right-shadow,.top-shadow,.bottom-shadow){background-color:transparent!important}.left-shadow{background-image:linear-gradient(to right,black,transparent)}.right-shadow{background-image:linear-gradient(to left,black,transparent)}.bottom-shadow{background-image:linear-gradient(to top,black,transparent)}.top-shadow{background-image:linear-gradient(to bottom,black,transparent)}
1
+ :root{--size: 16px;--font: Inter, Roboto, "Helvetica Neue", "Arial Nova", "Nimbus Sans", Noto Sans, Arial, sans-serif;--font-icon: "Material Symbols Outlined";--speed1: .1s;--speed2: .2s;--speed3: .3s;--speed4: .4s;--active: rgb(128 128 128 / .192);--overlay: rgb(0 0 0 / .5);--elevate1: 0 .125rem .125rem 0 rgb(0 0 0 / .32);--elevate2: 0 .25rem .5rem 0 rgb(0 0 0 / .4);--elevate3: 0 .375rem .75rem 0 rgb(0 0 0 / .48);--top: env(safe-area-inset-top);--bottom: env(safe-area-inset-bottom);--left: env(safe-area-inset-left);--right: env(safe-area-inset-right)}:root,body.light{--primary: #6750a4;--on-primary: #ffffff;--primary-container: #e9ddff;--on-primary-container: #22005d;--secondary: #625b71;--on-secondary: #ffffff;--secondary-container: #e8def8;--on-secondary-container: #1e192b;--tertiary: #7e5260;--on-tertiary: #ffffff;--tertiary-container: #ffd9e3;--on-tertiary-container: #31101d;--error: #ba1a1a;--on-error: #ffffff;--error-container: #ffdad6;--on-error-container: #410002;--background: #fffbff;--on-background: #1c1b1e;--surface: #fdf8fd;--on-surface: #1c1b1e;--surface-variant: #e7e0eb;--on-surface-variant: #49454e;--outline: #7a757f;--outline-variant: #cac4cf;--shadow: #000000;--scrim: #000000;--inverse-surface: #313033;--inverse-on-surface: #f4eff4;--inverse-primary: #cfbcff;--surface-dim: #ddd8dd;--surface-bright: #fdf8fd;--surface-container-lowest: #ffffff;--surface-container-low: #f7f2f7;--surface-container: #f2ecf1;--surface-container-high: #ece7eb;--surface-container-highest: #e6e1e6}body.dark{--primary: #cfbcff;--on-primary: #381e72;--primary-container: #4f378a;--on-primary-container: #e9ddff;--secondary: #cbc2db;--on-secondary: #332d41;--secondary-container: #4a4458;--on-secondary-container: #e8def8;--tertiary: #efb8c8;--on-tertiary: #4a2532;--tertiary-container: #633b48;--on-tertiary-container: #ffd9e3;--error: #ffb4ab;--on-error: #690005;--error-container: #93000a;--on-error-container: #ffb4ab;--background: #1c1b1e;--on-background: #e6e1e6;--surface: #141316;--on-surface: #e6e1e6;--surface-variant: #49454e;--on-surface-variant: #cac4cf;--outline: #948f99;--outline-variant: #49454e;--shadow: #000000;--scrim: #000000;--inverse-surface: #e6e1e6;--inverse-on-surface: #313033;--inverse-primary: #6750a4;--surface-dim: #141316;--surface-bright: #3a383c;--surface-container-lowest: #0f0e11;--surface-container-low: #1c1b1e;--surface-container: #201f22;--surface-container-high: #2b292d;--surface-container-highest: #363438}@font-face{font-family:Material Symbols Outlined;font-style:normal;font-weight:400;font-display:block;src:url(material-symbols-outlined.woff2) format("woff2"),url(https://cdn.jsdelivr.net/npm/beercss@3.8.0/dist/cdn/material-symbols-outlined.woff2) format("woff2")}@font-face{font-family:Material Symbols Rounded;font-style:normal;font-weight:400;font-display:block;src:url(material-symbols-rounded.woff2) format("woff2"),url(https://cdn.jsdelivr.net/npm/beercss@3.8.0/dist/cdn/material-symbols-rounded.woff2) format("woff2")}@font-face{font-family:Material Symbols Sharp;font-style:normal;font-weight:400;font-display:block;src:url(material-symbols-sharp.woff2) format("woff2"),url(https://cdn.jsdelivr.net/npm/beercss@3.8.0/dist/cdn/material-symbols-sharp.woff2) format("woff2")}*{-webkit-tap-highlight-color:transparent;position:relative;vertical-align:middle;color:inherit;margin:0;padding:0;border-radius:inherit;box-sizing:border-box}body{color:var(--on-surface);background-color:var(--surface);overflow-x:hidden}label{font-size:.75rem;vertical-align:baseline}a,b,i,span,strong,em,code{vertical-align:baseline}a,button,.button{cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;border:none;font-family:inherit;outline:inherit;justify-content:center}a,button,.button,i,label{-webkit-user-select:none;user-select:none}body ::-webkit-scrollbar,body ::-webkit-scrollbar-thumb,body ::-webkit-scrollbar-button{background:none;inline-size:.4rem;block-size:.4rem}body :is(:hover,:focus)::-webkit-scrollbar-thumb{background:var(--outline);border-radius:1rem}*+:is(address,article,blockquote,code,.field,fieldset,form,.grid,h1,h2,h3,h4,h5,h6,nav,ol,p,pre,.row,section,aside,table,.tabs,ul){margin-block-start:1rem}:is(a,button,.button,.chip):focus-visible{outline:.125rem solid var(--primary);outline-offset:.25rem}.transparent{background-color:transparent!important;box-shadow:none!important;color:inherit!important}.primary{background-color:var(--primary)!important;color:var(--on-primary)!important}.primary-text{color:var(--primary)!important}.primary-border{border-color:var(--primary)!important}.primary-container{background-color:var(--primary-container)!important;color:var(--on-primary-container)!important}.secondary{background-color:var(--secondary)!important;color:var(--on-secondary)!important}.secondary-text{color:var(--secondary)!important}.secondary-border{border-color:var(--secondary)!important}.secondary-container{background-color:var(--secondary-container)!important;color:var(--on-secondary-container)!important}.tertiary{background-color:var(--tertiary)!important;color:var(--on-tertiary)!important}.tertiary-text{color:var(--tertiary)!important}.tertiary-border{border-color:var(--tertiary)!important}.tertiary-container{background-color:var(--tertiary-container)!important;color:var(--on-tertiary-container)!important}.error{background-color:var(--error)!important;color:var(--on-error)!important}.error-text{color:var(--error)!important}.error-border{border-color:var(--error)!important}.error-container{background-color:var(--error-container)!important;color:var(--on-error-container)!important}.background{background-color:var(--background)!important;color:var(--on-background)!important}.surface,.surface-dim,.surface-bright,.surface-container-lowest,.surface-container-low,.surface-container,.surface-container-high,.surface-container-highest{background-color:var(--surface)!important;color:var(--on-surface)!important}.surface-variant{background-color:var(--surface-variant)!important;color:var(--on-surface-variant)!important}.inverse-surface{background-color:var(--inverse-surface);color:var(--inverse-on-surface)}.inverse-primary{background-color:var(--inverse-primary);color:var(--primary)}.inverse-primary-text{color:var(--inverse-primary)!important}.inverse-primary-border{border-color:var(--inverse-primary)!important}.surface-dim{background-color:var(--surface-dim)!important}.surface-bright{background-color:var(--surface-bright)!important}.surface-container-lowest{background-color:var(--surface-container-lowest)!important}.surface-container{background-color:var(--surface-container)!important}.surface-container-high{background-color:var(--surface-container-high)!important}.surface-container-highest{background-color:var(--surface-container-highest)!important}.surface-container-low{background-color:var(--surface-container-low)!important}.black{background-color:#000!important}.black-border{border-color:#000!important}.black-text{color:#000!important}.white{background-color:#fff!important}.white-border{border-color:#fff!important}.white-text{color:#fff!important}.transparent-border{border-color:transparent!important}.transparent-text{color:transparent!important}.fill:not(i){background-color:var(--surface-variant)!important;color:var(--on-surface-variant)!important}.middle-align{display:flex;align-items:center!important}.bottom-align{display:flex;align-items:flex-end!important}.top-align{display:flex;align-items:flex-start!important}.left-align{text-align:start;justify-content:flex-start!important}.right-align{text-align:end;justify-content:flex-end!important}.center-align{text-align:center;justify-content:center!important}.red,.red6{background-color:#f44336!important}.red-border{border-color:#f44336!important}.red-text{color:#f44336!important}.red1{background-color:#ffebee!important}.red2{background-color:#ffcdd2!important}.red3{background-color:#ef9a9a!important}.red4{background-color:#e57373!important}.red5{background-color:#ef5350!important}.red7{background-color:#e53935!important}.red8{background-color:#d32f2f!important}.red9{background-color:#c62828!important}.red10{background-color:#b71c1c!important}.pink,.pink6{background-color:#e91e63!important}.pink-border{border-color:#e91e63!important}.pink-text{color:#e91e63!important}.pink1{background-color:#fce4ec!important}.pink2{background-color:#f8bbd0!important}.pink3{background-color:#f48fb1!important}.pink4{background-color:#f06292!important}.pink5{background-color:#ec407a!important}.pink7{background-color:#d81b60!important}.pink8{background-color:#c2185b!important}.pink9{background-color:#ad1457!important}.pink10{background-color:#880e4f!important}.purple,.purple6{background-color:#9c27b0!important}.purple-border{border-color:#9c27b0!important}.purple-text{color:#9c27b0!important}.purple1{background-color:#f3e5f5!important}.purple2{background-color:#e1bee7!important}.purple3{background-color:#ce93d8!important}.purple4{background-color:#ba68c8!important}.purple5{background-color:#ab47bc!important}.purple7{background-color:#8e24aa!important}.purple8{background-color:#7b1fa2!important}.purple9{background-color:#6a1b9a!important}.purple10{background-color:#4a148c!important}.deep-purple,.deep-purple6{background-color:#673ab7!important}.deep-purple-border{border-color:#673ab7!important}.deep-purple-text{color:#673ab7!important}.deep-purple1{background-color:#ede7f6!important}.deep-purple2{background-color:#d1c4e9!important}.deep-purple3{background-color:#b39ddb!important}.deep-purple4{background-color:#9575cd!important}.deep-purple5{background-color:#7e57c2!important}.deep-purple7{background-color:#5e35b1!important}.deep-purple8{background-color:#512da8!important}.deep-purple9{background-color:#4527a0!important}.deep-purple10{background-color:#311b92!important}.indigo,.indigo6{background-color:#3f51b5!important}.indigo-border{border-color:#3f51b5!important}.indigo-text{color:#3f51b5!important}.indigo1{background-color:#e8eaf6!important}.indigo2{background-color:#c5cae9!important}.indigo3{background-color:#9fa8da!important}.indigo4{background-color:#7986cb!important}.indigo5{background-color:#5c6bc0!important}.indigo7{background-color:#3949ab!important}.indigo8{background-color:#303f9f!important}.indigo9{background-color:#283593!important}.indigo10{background-color:#1a237e!important}.blue,.blue6{background-color:#2196f3!important}.blue-border{border-color:#2196f3!important}.blue-text{color:#2196f3!important}.blue1{background-color:#e3f2fd!important}.blue2{background-color:#bbdefb!important}.blue3{background-color:#90caf9!important}.blue4{background-color:#64b5f6!important}.blue5{background-color:#42a5f5!important}.blue7{background-color:#1e88e5!important}.blue8{background-color:#1976d2!important}.blue9{background-color:#1565c0!important}.blue10{background-color:#0d47a1!important}.light-blue,.light-blue6{background-color:#03a9f4!important}.light-blue-border{border-color:#03a9f4!important}.light-blue-text{color:#03a9f4!important}.light-blue1{background-color:#e1f5fe!important}.light-blue2{background-color:#b3e5fc!important}.light-blue3{background-color:#81d4fa!important}.light-blue4{background-color:#4fc3f7!important}.light-blue5{background-color:#29b6f6!important}.light-blue7{background-color:#039be5!important}.light-blue8{background-color:#0288d1!important}.light-blue9{background-color:#0277bd!important}.light-blue10{background-color:#01579b!important}.cyan,.cyan6{background-color:#00bcd4!important}.cyan-border{border-color:#00bcd4!important}.cyan-text{color:#00bcd4!important}.cyan1{background-color:#e0f7fa!important}.cyan2{background-color:#b2ebf2!important}.cyan3{background-color:#80deea!important}.cyan4{background-color:#4dd0e1!important}.cyan5{background-color:#26c6da!important}.cyan7{background-color:#00acc1!important}.cyan8{background-color:#0097a7!important}.cyan9{background-color:#00838f!important}.cyan10{background-color:#006064!important}.teal,.teal6{background-color:#009688!important}.teal-border{border-color:#009688!important}.teal-text{color:#009688!important}.teal1{background-color:#e0f2f1!important}.teal2{background-color:#b2dfdb!important}.teal3{background-color:#80cbc4!important}.teal4{background-color:#4db6ac!important}.teal5{background-color:#26a69a!important}.teal7{background-color:#00897b!important}.teal8{background-color:#00796b!important}.teal9{background-color:#00695c!important}.teal10{background-color:#004d40!important}.green,.green6{background-color:#4caf50!important}.green-border{border-color:#4caf50!important}.green-text{color:#4caf50!important}.green1{background-color:#e8f5e9!important}.green2{background-color:#c8e6c9!important}.green3{background-color:#a5d6a7!important}.green4{background-color:#81c784!important}.green5{background-color:#66bb6a!important}.green7{background-color:#43a047!important}.green8{background-color:#388e3c!important}.green9{background-color:#2e7d32!important}.green10{background-color:#1b5e20!important}.light-green,.light-green6{background-color:#8bc34a!important}.light-green-border{border-color:#8bc34a!important}.light-green-text{color:#8bc34a!important}.light-green1{background-color:#f1f8e9!important}.light-green2{background-color:#dcedc8!important}.light-green3{background-color:#c5e1a5!important}.light-green4{background-color:#aed581!important}.light-green5{background-color:#9ccc65!important}.light-green7{background-color:#7cb342!important}.light-green8{background-color:#689f38!important}.light-green9{background-color:#558b2f!important}.light-green10{background-color:#33691e!important}.lime,.lime6{background-color:#cddc39!important}.lime-border{border-color:#cddc39!important}.lime-text{color:#cddc39!important}.lime1{background-color:#f9fbe7!important}.lime2{background-color:#f0f4c3!important}.lime3{background-color:#e6ee9c!important}.lime4{background-color:#dce775!important}.lime5{background-color:#d4e157!important}.lime7{background-color:#c0ca33!important}.lime8{background-color:#afb42b!important}.lime9{background-color:#9e9d24!important}.lime10{background-color:#827717!important}.yellow,.yellow6{background-color:#ffeb3b!important}.yellow-border{border-color:#ffeb3b!important}.yellow-text{color:#ffeb3b!important}.yellow1{background-color:#fffde7!important}.yellow2{background-color:#fff9c4!important}.yellow3{background-color:#fff59d!important}.yellow4{background-color:#fff176!important}.yellow5{background-color:#ffee58!important}.yellow7{background-color:#fdd835!important}.yellow8{background-color:#fbc02d!important}.yellow9{background-color:#f9a825!important}.yellow10{background-color:#f57f17!important}.amber,.amber6{background-color:#ffc107!important}.amber-border{border-color:#ffc107!important}.amber-text{color:#ffc107!important}.amber1{background-color:#fff8e1!important}.amber2{background-color:#ffecb3!important}.amber3{background-color:#ffe082!important}.amber4{background-color:#ffd54f!important}.amber5{background-color:#ffca28!important}.amber7{background-color:#ffb300!important}.amber8{background-color:#ffa000!important}.amber9{background-color:#ff8f00!important}.amber10{background-color:#ff6f00!important}.orange,.orange6{background-color:#ff9800!important}.orange-border{border-color:#ff9800!important}.orange-text{color:#ff9800!important}.orange1{background-color:#fff3e0!important}.orange2{background-color:#ffe0b2!important}.orange3{background-color:#ffcc80!important}.orange4{background-color:#ffb74d!important}.orange5{background-color:#ffa726!important}.orange7{background-color:#fb8c00!important}.orange8{background-color:#f57c00!important}.orange9{background-color:#ef6c00!important}.orange10{background-color:#e65100!important}.deep-orange,.deep-orange6{background-color:#ff5722!important}.deep-orange-border{border-color:#ff5722!important}.deep-orange-text{color:#ff5722!important}.deep-orange1{background-color:#fbe9e7!important}.deep-orange2{background-color:#ffccbc!important}.deep-orange3{background-color:#ffab91!important}.deep-orange4{background-color:#ff8a65!important}.deep-orange5{background-color:#ff7043!important}.deep-orange7{background-color:#f4511e!important}.deep-orange8{background-color:#e64a19!important}.deep-orange9{background-color:#d84315!important}.deep-orange10{background-color:#bf360c!important}.brown,.brown6{background-color:#795548!important}.brown-border{border-color:#795548!important}.brown-text{color:#795548!important}.brown1{background-color:#efebe9!important}.brown2{background-color:#d7ccc8!important}.brown3{background-color:#bcaaa4!important}.brown4{background-color:#a1887f!important}.brown5{background-color:#8d6e63!important}.brown7{background-color:#6d4c41!important}.brown8{background-color:#5d4037!important}.brown9{background-color:#4e342e!important}.brown10{background-color:#3e2723!important}.blue-grey,.blue-grey6{background-color:#607d8b!important}.blue-grey-border{border-color:#607d8b!important}.blue-grey-text{color:#607d8b!important}.blue-grey1{background-color:#eceff1!important}.blue-grey2{background-color:#cfd8dc!important}.blue-grey3{background-color:#b0bec5!important}.blue-grey4{background-color:#90a4ae!important}.blue-grey5{background-color:#78909c!important}.blue-grey7{background-color:#546e7a!important}.blue-grey8{background-color:#455a64!important}.blue-grey9{background-color:#37474f!important}.blue-grey10{background-color:#263238!important}.grey,.grey6{background-color:#9e9e9e!important}.grey-border{border-color:#9e9e9e!important}.grey-text{color:#9e9e9e!important}.grey1{background-color:#fafafa!important}.grey2{background-color:#f5f5f5!important}.grey3{background-color:#eee!important}.grey4{background-color:#e0e0e0!important}.grey5{background-color:#bdbdbd!important}.grey7{background-color:#757575!important}.grey8{background-color:#616161!important}.grey9{background-color:#424242!important}.grey10{background-color:#212121!important}.horizontal{display:inline-flex;flex-direction:row!important;gap:1rem;inline-size:auto!important;max-inline-size:none!important}.horizontal>*{margin-block:0!important}.vertical{display:flex;flex-direction:column!important}:is(a,button,.button,.chip).vertical{display:inline-flex;gap:.25rem;block-size:auto!important;max-block-size:none!important;padding-block:.5rem}.vertical>*{margin-inline:0!important}.no-elevate{box-shadow:none!important}.small-elevate,.elevate{box-shadow:var(--elevate1)!important}.medium-elevate{box-shadow:var(--elevate2)!important}.large-elevate{box-shadow:var(--elevate3)!important}.round{border-radius:var(---round)}.small-round,.medium-round,.large-round{border-radius:var(---round)!important}.top-round,.bottom-round,.left-round,.right-round,.medium-round,.round{---round: 2rem}.small-round{---round: .5rem}.large-round{---round: 3.5rem}.no-round,.square,.top-round,.bottom-round,.left-round,.right-round{border-radius:0!important}.top-round{border-start-start-radius:var(---round)!important;border-start-end-radius:var(---round)!important}.bottom-round{border-end-end-radius:var(---round)!important;border-end-start-radius:var(---round)!important}.left-round{border-start-start-radius:var(---round)!important;border-end-start-radius:var(---round)!important}.right-round{border-start-end-radius:var(---round)!important;border-end-end-radius:var(---round)!important}.circle{border-radius:50%}:is(button,.button,.chip).circle{border-radius:2.5rem}:is(.circle,.square):not(i,img,video,svg),:is(.circle,.square).chip.medium{block-size:2.5rem;inline-size:2.5rem;padding:0}:is(.circle,.square)>span{display:none}:is(.circle,.square).small:not(i,img,video,svg),:is(.circle,.square).chip{block-size:2rem;inline-size:2rem}:is(.circle,.square).large:not(i,img,video,svg){block-size:3rem;inline-size:3rem}:is(.circle,.square).extra:not(i,img,video,svg){block-size:3.5rem;inline-size:3.5rem}:is(.circle,.square).round{border-radius:1rem!important}.border:not(table,.field){box-sizing:border-box;border:.0625rem solid var(--outline);background-color:transparent;box-shadow:none}.no-border{border-color:transparent!important}:is(nav,.row,dialog.max,header.fixed,footer.fixed,menu>a,menu.max,table,.tabs):not(.round){border-radius:0}[class*=margin]:not(.left-margin,.right-margin,.top-margin,.bottom-margin,.horizontal-margin,.vertical-margin){margin:var(---margin)!important}[class*=margin]{---margin: 1rem}.no-margin{---margin: 0}.auto-margin{---margin: auto}.tiny-margin{---margin: .25rem}.small-margin{---margin: .5rem}.large-margin{---margin: 1.5rem}.left-margin,.horizontal-margin{margin-inline-start:var(---margin)!important}.right-margin,.horizontal-margin{margin-inline-end:var(---margin)!important}.top-margin,.vertical-margin{margin-block-start:var(---margin)!important}.bottom-margin,.vertical-margin{margin-block-end:var(---margin)!important}.no-opacity{opacity:1!important}.opacity{opacity:0!important}.small-opacity{opacity:.75!important}.medium-opacity{opacity:.5!important}.large-opacity{opacity:.25!important}[class*=padding]:not(.left-padding,.right-padding,.top-padding,.bottom-padding,.horizontal-padding,.vertical-padding){padding:var(---padding)!important}[class*=padding]{---padding: 1rem}.no-padding{---padding: 0}.tiny-padding{---padding: .25rem}.small-padding{---padding: .5rem}.large-padding{---padding: 1.5rem}.left-padding,.horizontal-padding{padding-inline-start:var(---padding)!important}.right-padding,.horizontal-padding{padding-inline-end:var(---padding)!important}.top-padding,.vertical-padding{padding-block-start:var(---padding)!important}.bottom-padding,.vertical-padding{padding-block-end:var(---padding)!important}.front{z-index:10!important}.back{z-index:-10!important}.left{inset-inline-start:0}.right{inset-inline-end:0}.top{inset-block-start:0}.bottom{inset-block-end:0}.center{inset-inline-start:50%;transform:translate(-50%)}[dir=rtl] .center{transform:translate(50%)}.middle{inset-block-start:50%;transform:translateY(-50%)}.middle.center{transform:translate(-50%,-50%)}[dir=rtl] .middle.center{transform:translate(50%,-50%)}.ripple{---duration: .6s}.fast-ripple{---duration: .2s}.slow-ripple{---duration: 1.8s}.ripple-js{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden}.ripple-js>div{position:absolute;border-radius:50%;background:currentColor;opacity:.3;transform:scale(0);animation:to-ripple var(---duration) linear}@keyframes to-ripple{to{transform:scale(4);opacity:0}}.scroll{overflow:auto}.no-scroll{overflow:hidden}[class*=width]{max-inline-size:100%}.auto-width{inline-size:auto}.small-width{inline-size:12rem!important}.medium-width{inline-size:24rem!important}.large-width{inline-size:36rem!important}.auto-height{block-size:auto}.small-height{block-size:12rem!important}.medium-height{block-size:24rem!important}.large-height{block-size:36rem!important}.wrap{display:block;white-space:normal}.no-wrap:not(menu){display:flex;white-space:nowrap}.tiny-space:not(nav,ol,ul,.row,.grid,table,.tooltip){block-size:.5rem}:is(.space,.small-space):not(nav,ol,ul,.row,.grid,table,.tooltip){block-size:1rem}.medium-space:not(nav,ol,ul,.row,.grid,table,.tooltip){block-size:2rem}.large-space:not(nav,ol,ul,.row,.grid,table,.tooltip){block-size:3rem}.responsive{inline-size:-webkit-fill-available;inline-size:-moz-available}@media only screen and (max-width: 600px){.m:not(.s),.l:not(.s),.m.l:not(.s){display:none}}@media only screen and (min-width: 601px) and (max-width: 992px){.s:not(.m),.l:not(.m),.s.l:not(.m){display:none}}@media only screen and (min-width: 993px){.m:not(.l),.s:not(.l),.m.s:not(.l){display:none}}html{font-size:var(--size)}body{font-family:var(--font);font-size:.875rem;line-height:1.5rem;letter-spacing:.0313rem}h1,h2,h3,h4,h5,h6{font-weight:400;display:block;align-items:center;line-height:normal}h1{font-size:3.5625rem}h2{font-size:2.8125rem}h3{font-size:2.25rem}h4{font-size:2rem}h5{font-size:1.75rem}h6{font-size:1.5rem}h1.small{font-size:3.0625rem}h2.small{font-size:2.3125rem}h3.small{font-size:1.75rem}h4.small{font-size:1.5rem}h5.small{font-size:1.25rem}h6.small{font-size:1rem}h1.large{font-size:4.0625rem}h2.large{font-size:3.3125rem}h3.large{font-size:2.75rem}h4.large{font-size:2.5rem}h5.large{font-size:2.25rem}h6.large{font-size:2rem}.link{color:var(--primary)!important}.inverse-link{color:var(--inverse-primary)!important}.truncate{overflow:hidden;white-space:nowrap!important;text-overflow:ellipsis;flex:inherit}.truncate>*{white-space:nowrap!important}.small-text{font-size:.75rem}.medium-text{font-size:.875rem}.large-text{font-size:1rem}.upper{text-transform:uppercase}.lower{text-transform:lowercase}.capitalize{text-transform:capitalize}.bold{font-weight:700}.overline{text-decoration:line-through}.underline{text-decoration:underline}.italic{font-style:italic}p{margin:.5rem 0}.no-line{line-height:normal}.tiny-line{line-height:1.25rem}.small-line{line-height:1.5rem}.medium-line{line-height:1.75rem}.large-line{line-height:2rem}.extra-line{line-height:2.25rem}pre{border-radius:0;background-color:var(--surface-container);white-space:pre-wrap;padding:1rem;border-inline-start:.25rem solid var(--primary);font-family:inherit}blockquote{border-radius:0;padding:1rem;border-inline-start:.25rem solid var(--primary);font-family:inherit}code{border-radius:0;background-color:var(--surface-container);white-space:pre-wrap;padding:.25rem}pre>code,blockquote>code{padding:0}.scroll>code{white-space:pre}pre:has(>code){direction:ltr;text-align:start}:is(.wave,.chip,.button,button,nav.tabbed>a,.tabs>a):not(.slow-ripple,.ripple,.fast-ripple):after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;border-radius:inherit;inline-size:100%;block-size:100%;background-position:center;background-image:radial-gradient(circle,currentColor 1%,transparent 1%);opacity:0;transition:none}:is(.wave,.chip,.button,button,nav.tabbed>a,.tabs>a):not(.slow-ripple,.ripple,.fast-ripple):is(:focus-visible,:hover):after{background-size:15000%;opacity:.1;transition:background-size var(--speed2) linear}:is(.wave,.chip,.button,button,nav.tabbed>a,.tabs>a):not(.slow-ripple,.ripple,.fast-ripple):active:after{background-size:5000%;opacity:0;transition:none}.no-wave:after,.no-wave:is(:hover,:active):after{display:none}.badge{display:inline-flex;align-items:center;justify-content:center;position:absolute;font-size:.6875rem;text-transform:none;z-index:2;padding:0 .25rem;min-block-size:1rem;min-inline-size:1rem;background-color:var(--error);color:var(--on-error);line-height:normal;border-radius:1rem;inset:50% auto auto 50%;transform:translateY(-100%);font-family:var(--font)}.badge.top{transform:translate(-50%,-100%)}.badge.bottom{transform:translate(-50%)}.badge.left{transform:translate(-100%,-50%)}.badge.right{transform:translateY(-50%)}.badge.top.left{transform:translate(-100%,-100%)}.badge.bottom.left{transform:translate(-100%)}.badge.top.right{transform:translateY(-100%)}.badge.bottom.right{transform:translate(0)}.badge.border{border-color:var(--error);color:var(--error);background-color:var(--surface)}.badge:is(.circle,.square){text-align:center;inline-size:auto;block-size:auto;padding:0 .25rem;border-radius:1rem}.badge.square{border-radius:0}.badge.min>*{display:none}.badge.min{clip-path:circle(18.75% at 50% 50%)}nav:is(.left,.right,.top,.bottom)>a>.badge,nav:is(.left,.right,.top,.bottom)>:is(ol,ul)>li>a>.badge{inset:1rem auto auto 50%}.badge.none{inset:auto!important;transform:none;position:relative;margin:0 .125rem}:is(button,.button,.chip)>.badge.none{margin:0 -.5rem}.button,button{box-sizing:content-box;display:inline-flex;align-items:center;justify-content:center;block-size:2.5rem;min-inline-size:2.5rem;font-size:.875rem;font-weight:500;color:var(--on-primary);padding:0 1.5rem;background-color:var(--primary);margin:0 .5rem;border-radius:1.25rem;transition:transform var(--speed3),border-radius var(--speed3),padding var(--speed3);-webkit-user-select:none;user-select:none;gap:1rem;line-height:normal}:is(button,.button).small{block-size:2rem;min-inline-size:2rem;border-radius:1rem}:is(button,.button).large{block-size:3rem;min-inline-size:3rem;border-radius:1.5rem}:is(.button,button):is(.extra,.extend){block-size:3.5rem;min-inline-size:3.5rem;font-size:1rem;border-radius:1.75rem}:is(button,.button).border{border-color:var(--outline);color:var(--primary)}:is(button,.button):not(.border,.chip):hover{box-shadow:var(--elevate1)}.extend>span{display:none}.extend:is(:hover,.active){inline-size:auto;padding:0 1.5rem}.extend:is(:hover,.active)>i+span{display:inherit;margin-inline-start:1.5rem}.extend:is(:hover,.active)>:is(img,svg)+span{display:inherit;margin-inline-start:2.5rem}:is(.button,button)[disabled]{opacity:.5;cursor:not-allowed}.button[disabled]{pointer-events:none}:is(.button,button)[disabled]:before,:is(.button,button)[disabled]:after{display:none}:is(.button,button).fill{background-color:var(--secondary-container)!important;color:var(--on-secondary-container)!important}:is(.button,button).vertical{border-radius:2rem}article{box-shadow:var(--elevate1);background-color:var(--surface-container-low);color:var(--on-surface);padding:1rem;border-radius:.75rem;display:block;transition:transform var(--speed3),border-radius var(--speed3),padding var(--speed3)}article.small{block-size:12rem}article.medium{block-size:20rem}article.large{block-size:32rem}.chip{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;block-size:2rem;min-inline-size:2rem;font-size:.875rem;font-weight:500;background-color:transparent;border:.0625rem solid var(--outline-variant);color:var(--on-surface-variant);padding:0 1rem;margin:0 .5rem;text-transform:none;border-radius:.5rem;transition:transform var(--speed3),border-radius var(--speed3),padding var(--speed3);-webkit-user-select:none;user-select:none;gap:1rem;line-height:normal;letter-spacing:normal}.chip.fill:hover{box-shadow:var(--elevate1)}.chip.medium{block-size:2.5rem;min-inline-size:2.5rem;border-radius:.5rem}.chip.large{block-size:3rem;min-inline-size:3rem;border-radius:.5rem}.chip.fill{background-color:var(--secondary-container)!important;border:none}.chip.round.small{border-radius:1rem}.chip.round{border-radius:1.25rem}.chip.round.large{border-radius:1.5rem}main.responsive{flex:1;padding:.5rem;overflow-x:hidden}:is(main,header,footer,section).responsive{max-inline-size:75rem;margin:0 auto}:is(main,header,footer,section).responsive.max{max-inline-size:100%}*:has(>main.responsive){display:flex;flex-direction:column;min-block-size:100vh}*:has(>nav.bottom:not(.s,.m,.l)){padding-block-end:calc(var(--bottom) + 5rem)}*:has(>nav.top:not(.s,.m,.l)){padding-block-start:calc(var(--top) + 5rem)}*:has(>nav.left:not(.s,.m,.l)){padding-inline-start:calc(var(--left) + 5rem)}*:has(>nav.right:not(.s,.m,.l)){padding-inline-end:calc(var(--right) + 5rem)}*:has(>nav.drawer.left:not(.s,.m,.l)){padding-inline-start:calc(var(--left) + 20rem)}*:has(>nav.drawer.right:not(.s,.m,.l)){padding-inline-end:calc(var(--right) + 20rem)}nav.top:not(.s,.m,.l)~header.fixed{inset-block-start:5rem}nav.bottom:not(.s,.m,.l)~footer.fixed{inset-block-end:5rem}:not(main):has(>aside){overflow:auto}aside{z-index:1}aside:not(.fixed,.absolute).right{float:right}aside:not(.fixed,.absolute).left{float:left}@media only screen and (max-width: 600px){*:has(>nav.s.bottom){padding-block-end:calc(var(--bottom) + 5rem)}*:has(>nav.s.top){padding-block-start:calc(var(--top) + 5rem)}*:has(>nav.s.left){padding-inline-start:calc(var(--left) + 5rem)}*:has(>nav.s.right){padding-inline-end:calc(var(--right) + 5rem)}*:has(>nav.s.drawer.left){padding-inline-start:calc(var(--left) + 20rem)}*:has(>nav.s.drawer.right){padding-inline-end:calc(var(--right) + 20rem)}nav.s.top~header.fixed{inset-block-start:5rem}nav.s.bottom~footer.fixed{inset-block-end:5rem}}@media only screen and (min-width: 601px) and (max-width: 992px){*:has(>nav.m.bottom){padding-block-end:calc(var(--bottom) + 5rem)}*:has(>nav.m.top){padding-block-start:calc(var(--top) + 5rem)}*:has(>nav.m.left){padding-inline-start:calc(var(--left) + 5rem)}*:has(>nav.m.right){padding-inline-end:calc(var(--right) + 5rem)}*:has(>nav.m.drawer.left){padding-inline-start:calc(var(--left) + 20rem)}*:has(>nav.m.drawer.right){padding-inline-end:calc(var(--right) + 20rem)}nav.m.top~header.fixed{inset-block-start:5rem}nav.m.bottom~footer.fixed{inset-block-end:5rem}}@media only screen and (min-width: 993px){*:has(>nav.l.bottom){padding-block-end:calc(var(--bottom) + 5rem)}*:has(>nav.l.top){padding-block-start:calc(var(--top) + 5rem)}*:has(>nav.l.left){padding-inline-start:calc(var(--left) + 5rem)}*:has(>nav.l.right){padding-inline-end:calc(var(--right) + 5rem)}*:has(>nav.l.drawer.left){padding-inline-start:calc(var(--left) + 20rem)}*:has(>nav.l.drawer.right){padding-inline-end:calc(var(--right) + 20rem)}nav.l.top~header.fixed{inset-block-start:5rem}nav.l.bottom~footer.fixed{inset-block-end:5rem}}@media only screen and (max-width: 600px){main.responsive{padding-inline:calc(var(--left) + .5rem) calc(var(--right) + .5rem)}}dialog{display:block;visibility:hidden;border:none;opacity:0;position:fixed;box-shadow:var(--elevate2);color:var(--on-surface);background-color:var(--surface-container-high);padding:1.5rem;z-index:100;inset:10% auto auto 50%;min-inline-size:20rem;max-inline-size:100%;max-block-size:80%;overflow-x:hidden;overflow-y:auto;transition:all var(--speed3),0s background-color;border-radius:1.75rem;transform:translate(-50%,-4rem);outline:none}dialog::backdrop{display:none}dialog.small{inline-size:25%;block-size:25%}dialog.medium{inline-size:50%;block-size:50%}dialog.large{inline-size:75%;block-size:75%}dialog:is(.active,[open]){visibility:visible;opacity:1;transform:translate(-50%)}dialog.top{opacity:1;padding:1rem;inset:0 auto auto 0;block-size:auto;inline-size:100%;min-inline-size:auto;max-block-size:100%;transform:translateY(-100%);border-radius:0 0 1rem 1rem}[dir=rtl] dialog.right,dialog.left{opacity:1;padding:1rem;inset:0 auto auto 0;inline-size:auto;block-size:100%;max-block-size:100%;border-radius:0 1rem 1rem 0;background-color:var(--surface);transform:translate(-100%)}[dir=rtl] dialog.left,dialog.right{opacity:1;padding:1rem;inset:0 0 auto auto;inline-size:auto;block-size:100%;max-block-size:100%;border-radius:1rem 0 0 1rem;background-color:var(--surface);transform:translate(100%)}dialog.bottom{opacity:1;padding:1rem;inset:auto auto 0 0;block-size:auto;inline-size:100%;min-inline-size:auto;max-block-size:100%;transform:translateY(100%);border-radius:1rem 1rem 0 0}dialog.max{inset:0 auto auto 0;inline-size:100%;block-size:100%;max-inline-size:100%;max-block-size:100%;transform:translateY(4rem);background-color:var(--surface)}dialog:is(.active,[open]):is(.left,.right,.top,.bottom,.max){transform:translate(0)}dialog.small:is(.left,.right){inline-size:20rem}dialog.medium:is(.left,.right){inline-size:32rem}dialog.large:is(.left,.right){inline-size:44rem}dialog.small:is(.top,.bottom){block-size:16rem}dialog.medium:is(.top,.bottom){block-size:24rem}dialog.large:is(.top,.bottom){block-size:32rem}hr,[class*=divider]{all:unset;min-inline-size:1.5rem;min-block-size:auto;block-size:.0625rem;background-color:var(--outline-variant);display:block}hr+*,[class*=divider]+*{margin:0!important}hr.medium,.medium-divider{margin:1rem 0!important}hr.large,.large-divider{margin:1.5rem 0!important}hr.small,.small-divider{margin:.5rem 0!important}hr.vertical,.divider.vertical{min-inline-size:auto;min-block-size:1.5rem;inline-size:.0625rem}summary.none{list-style-type:none}summary.none::-webkit-details-marker{display:none}summary{cursor:pointer}summary:focus{outline:none}.field{---size: 3rem;---start: 1.2rem;block-size:var(---size);margin-block-end:2rem;border-radius:.25rem .25rem 0 0}.grid>*>.field{margin-block-end:1rem}.grid>*>.field+.field{margin-block-start:2rem}.grid.no-space>*>.field+.field{margin-block-start:1rem}.grid.medium-space>*>.field+.field{margin-block-start:2.5rem}.grid.large-space>*>.field+.field{margin-block-start:3rem}.field.small{---size: 2.5rem;---start: 1rem}.field.large{---size: 3.5rem;---start: 1.4rem}.field.extra{---size: 4rem;---start: 1.6rem}.field.border{border-radius:.25rem}.field.round.small{border-radius:1.25rem}.field.round{border-radius:1.5rem}.field.round.large{border-radius:1.75rem}.field.round.extra{border-radius:2rem}.field>:is(i,img,svg,progress,a:not(.helper,.error)){position:absolute;inset:50% auto auto auto;transform:translateY(-50%);cursor:pointer;z-index:0;inline-size:1.5rem;block-size:1.5rem}.field>:is(i,img,svg,progress,a:not(.helper,.error)),[dir=rtl] .field>:is(i,img,svg,progress,a:not(.helper,.error)):first-child{inset:50% 1rem auto auto}.field>:is(i,img,svg,progress,a:not(.helper,.error)):first-child,[dir=rtl] .field>:is(i,img,svg,progress,a:not(.helper,.error)){inset:50% auto auto 1rem}.field.invalid>i{color:var(--error)}.field>progress.circle{inset-block-start:calc(50% - .75rem)!important;border-width:.1875rem}.field>a:not(.helper,.error){z-index:10}.field>a>:is(i,img,svg,progress,a:not(.helper,.error)){inline-size:1.5rem;block-size:1.5rem}.field>:is(input,textarea,select){all:unset;position:relative;display:flex;align-items:center;box-sizing:border-box;border-radius:inherit;border:.0625rem solid transparent;padding:0 .9375rem;font-family:inherit;font-size:1rem;inline-size:100%;block-size:100%;outline:none;z-index:1;background:none;resize:none;text-align:start;cursor:text}input::-webkit-date-and-time-value{text-align:start}:is(input,select,textarea):-webkit-autofill{-webkit-background-clip:text;-webkit-text-fill-color:var(--on-surface)}.field>:is(input,textarea,select):focus{border:.125rem solid transparent;padding:0 .875rem}.field.min>textarea{overflow:hidden;position:absolute;top:0;right:0;bottom:0;left:0;max-block-size:12rem}input[type=file],input[type=color],:not(.field)>input[type^=date],:not(.field)>input[type^=time],input::-webkit-calendar-picker-indicator{opacity:0;position:absolute;top:0;right:0;bottom:0;left:0;inline-size:100%;block-size:100%;margin:0;padding:0;border:0;outline:0;z-index:2!important}input::-webkit-search-decoration,input::-webkit-search-cancel-button,input::-webkit-search-results-button,input::-webkit-search-results-decoration,input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{display:none}input[type=number]{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}.field.border>:is(input,textarea,select){border-color:var(--outline)}.field.border>:is(input,textarea,select):focus{border-color:var(--primary)}.field.round>:is(input,textarea,select){padding-inline:1.4376rem}.field.round>:is(input,textarea,select):focus{padding-inline:1.375rem}.field.prefix>:is(input,textarea,select){padding-inline-start:2.9375rem}.field.prefix>.slider{margin-inline-start:3.5rem}.field.prefix>:is(input,textarea,select):focus{padding-inline-start:2.875rem}.field.suffix>:is(input,textarea,select){padding-inline-end:2.9375rem}.field.suffix>.slider{margin-inline-end:3.5rem}.field.suffix>:is(input,textarea,select):focus{padding-inline-end:2.875rem}.field:not(.border,.round)>:is(input,textarea,select){border-block-end-color:var(--outline)}.field:not(.border,.round)>:is(input,textarea,select):focus{border-block-end-color:var(--primary)}.field.round:not(.border,.fill)>:is(input,textarea,select),.field.round:not(.border)>:is(input,textarea,select):focus{box-shadow:var(--elevate1)}.field.round:not(.border,.fill)>:is(input,textarea,select):focus{box-shadow:var(--elevate2)}.field.invalid:not(.border,.round)>:is(input,textarea,select),.field.invalid:not(.border,.round)>:is(input,textarea,select):focus{border-block-end-color:var(--error)}.field.invalid.border>:is(input,textarea,select),.field.invalid.border>:is(input,textarea,select):focus{border-color:var(--error)}.field:has(>:disabled){opacity:.5;cursor:not-allowed}.field>:disabled{cursor:not-allowed}.field.textarea.small:not(.min){---size: 4.5rem}.field.textarea:not(.min){---size: 5.5rem}.field.textarea.large:not(.min){---size: 6.5rem}.field.textarea.extra:not(.min){---size: 7.5rem}.field>select{-webkit-user-select:none;user-select:none}.field>select>option{background-color:var(--surface-container);color:var(--on-surface)}.field.label>:is(input,select){padding-block-start:1rem}.field.label.border:not(.fill)>:is(input,select){padding-block-start:0}.field>textarea{padding-block-start:var(---start);white-space:pre-wrap}.field>textarea:focus{padding-block-start:calc(var(---start) - .06rem)}.field:not(.label)>textarea,.field.border.label:not(.fill)>textarea{padding-block-start:calc(var(---start) - .5rem)}.field:not(.label)>textarea:focus,.field.border.label:not(.fill)>textarea:focus{padding-block-start:calc(var(---start) - .56rem)}.field.label>label{position:absolute;inset:-.5rem auto auto 1rem;display:flex;inline-size:calc(100% - 5rem);block-size:4rem;line-height:4rem;font-size:1rem;transition:all .2s;gap:.25rem;white-space:nowrap}[dir=rtl] .field.label>label{inset:-.5rem 1rem auto auto}.field.label.small>label{block-size:3.5rem;line-height:3.5rem}.field.label.large>label{block-size:4.5rem;line-height:4.5rem}.field.label.extra>label{block-size:5rem;line-height:5rem}.field.label.border.prefix:not(.fill)>:is(label.active,:focus+label,[placeholder]:not(:placeholder-shown)+label,select+label){inset-inline-start:1rem}.field.label.round>label,.field.label.border.prefix.round:not(.fill)>:is(label.active,:focus+label,[placeholder]:not(:placeholder-shown)+label,select+label){inset-inline-start:1.5rem}.field.label.prefix>label{inset-inline-start:3rem}.field.label>:is(label.active,:focus+label,[placeholder]:not(:placeholder-shown)+label,select+label){block-size:2.5rem;line-height:2.5rem;font-size:.75rem}.field.label.border:not(.fill)>:is(label.active,:focus+label,[placeholder]:not(:placeholder-shown)+label,select+label){block-size:1rem;line-height:1rem}.field.label.border:not(.fill)>label:after{content:"";display:block;margin-block-start:.5rem;border-block-start:.0625rem solid var(--outline);block-size:1rem;transition:none;flex:auto}.field.label.border:not(.fill)>:focus+label:after{border-block-start:.125rem solid var(--primary)}.field.label.border:not(.fill)>:is(input,textarea):is(:focus,[placeholder]:not(:placeholder-shown),.active),.field.label.border:not(.fill)>select{clip-path:polygon(-2% -2%,.75rem -2%,.75rem .5rem,calc(100% - 5rem) .5rem,calc(100% - 5rem) -2%,102% -2%,102% 102%,-2% 102%)}[dir=rtl] .field.label.border:not(.fill)>:is(input,textarea):is(:focus,[placeholder]:not(:placeholder-shown),.active),[dir=rtl] .field.label.border:not(.fill)>select{clip-path:polygon(-2% -2%,5rem -2%,5rem .5rem,calc(100% - .75rem) .5rem,calc(100% - .75rem) -2%,102% -2%,102% 102%,-2% 102%)}.field.label.border.round:not(.fill)>:is(input,textarea):is(:focus,[placeholder]:not(:placeholder-shown),.active),.field.label.border.round:not(.fill)>select{clip-path:polygon(-2% -2%,1.25rem -2%,1.25rem .5rem,calc(100% - 5rem) .5rem,calc(100% - 5rem) -2%,102% -2%,102% 102%,-2% 102%)}[dir=rtl] .field.label.border.round:not(.fill)>:is(input,textarea):is(:focus,[placeholder]:not(:placeholder-shown),.active),[dir=rtl] .field.label.border.round:not(.fill)>select{clip-path:polygon(-2% -2%,5rem -2%,5rem .5rem,calc(100% - 1.25rem) .5rem,calc(100% - 1.25rem) -2%,102% -2%,102% 102%,-2% 102%)}.field.label>:focus+label{color:var(--primary)}.field.label.invalid>label,.field.label.invalid>label:after{color:var(--error)!important;border-color:var(--error)!important}.field.label>label>a{block-size:inherit;line-height:inherit;inline-size:1rem}.field.label>label>a>:is(i,img,svg){block-size:1rem;line-height:1rem;inline-size:1rem;font-size:1rem}.field>:is(.helper,.error){position:absolute;inset:auto auto 0 1rem;transform:translateY(100%);font-size:.75rem;background:none!important;padding-block-start:.125rem}[dir=rtl] .field>:is(.helper,.error){inset:auto 1rem 0 auto}a.helper{color:var(--primary)}.field>.error{color:var(--error)!important}.field.round>:is(.helper,.error){inset-inline-start:1.5rem}.field.invalid>.helper{display:none}table td>.field{margin:0}fieldset{border-radius:.25rem;padding:1rem;border:.0625rem solid var(--outline-variant)}fieldset>legend{margin:0 -.25rem;padding:0 .25rem}fieldset>legend+*{margin-block-start:0!important}.grid{---gap: 1rem;display:grid;grid-template-columns:repeat(12,calc(8.33% - var(---gap) + (var(---gap) / 12)));gap:var(---gap)}.grid.no-space{---gap: 0rem}.grid.medium-space{---gap: 1.5rem}.grid.large-space{---gap: 2rem}.grid>*{margin:0}.s1{grid-area:auto/span 1}.s2{grid-area:auto/span 2}.s3{grid-area:auto/span 3}.s4{grid-area:auto/span 4}.s5{grid-area:auto/span 5}.s6{grid-area:auto/span 6}.s7{grid-area:auto/span 7}.s8{grid-area:auto/span 8}.s9{grid-area:auto/span 9}.s10{grid-area:auto/span 10}.s11{grid-area:auto/span 11}.s12{grid-area:auto/span 12}@media only screen and (min-width: 601px){.m1{grid-area:auto/span 1}.m2{grid-area:auto/span 2}.m3{grid-area:auto/span 3}.m4{grid-area:auto/span 4}.m5{grid-area:auto/span 5}.m6{grid-area:auto/span 6}.m7{grid-area:auto/span 7}.m8{grid-area:auto/span 8}.m9{grid-area:auto/span 9}.m10{grid-area:auto/span 10}.m11{grid-area:auto/span 11}.m12{grid-area:auto/span 12}}@media only screen and (min-width: 993px){.l1{grid-area:auto/span 1}.l2{grid-area:auto/span 2}.l3{grid-area:auto/span 3}.l4{grid-area:auto/span 4}.l5{grid-area:auto/span 5}.l6{grid-area:auto/span 6}.l7{grid-area:auto/span 7}.l8{grid-area:auto/span 8}.l9{grid-area:auto/span 9}.l10{grid-area:auto/span 10}.l11{grid-area:auto/span 11}.l12{grid-area:auto/span 12}}i,:is(.checkbox,.radio,.switch)>span:before,.icon>span>i{---size: 1.5rem;font-family:var(--font-icon);font-weight:400;font-style:normal;font-size:var(---size);letter-spacing:normal;text-transform:none;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;word-wrap:normal;direction:ltr;font-feature-settings:"liga";-webkit-font-smoothing:antialiased;vertical-align:middle;text-align:center;overflow:hidden;inline-size:var(---size);min-inline-size:var(---size);block-size:var(---size);min-block-size:var(---size);box-sizing:content-box;line-height:normal}i.tiny{---size: 1rem}.chip>i,i.small{---size: 1.25rem}i.medium{---size: 1.5rem}i.large{---size: 1.75rem}i.extra{---size: 2rem}i.fill,a.row:is(:hover,:focus)>i,.transparent:is(:hover,:focus)>i{font-variation-settings:"FILL" 1}i>:is(img,svg){inline-size:100%;block-size:100%;background-size:100%;border-radius:inherit;position:absolute;inset:0 auto auto 0;padding:inherit}i[class*=fa-]{font-size:calc(var(---size) * .85);line-height:normal;block-size:auto;min-block-size:auto}.absolute{position:absolute}.fixed{position:fixed}:is(.absolute,.fixed).left.right{inline-size:auto}:is(.absolute,.fixed).left.right.small{block-size:20rem}:is(.absolute,.fixed).left.right.medium{block-size:28rem}:is(.absolute,.fixed).left.right.large{block-size:44rem}:is(.absolute,.fixed).top.bottom.small{inline-size:20rem}:is(.absolute,.fixed).top.bottom.medium{inline-size:28rem}:is(.absolute,.fixed).top.bottom.large{inline-size:44rem}header,footer{display:flex;justify-content:center;flex-direction:column;min-block-size:4rem;padding:0 1rem;background-color:var(--surface-container)}main~footer{min-block-size:5rem}:is(header,footer).fixed.responsive{z-index:12}:is(header,footer,menu>*).fixed{position:sticky;top:0;right:0;bottom:0;left:0;z-index:11;background-color:inherit}:is(dialog,menu,nav,article)>:is(header,footer){background-color:inherit;padding:0}:is(dialog,article,[class*=padding])>:is(header,footer).fixed{---translateY: 1rem;transform:translateY(var(---translateY))}:is(dialog,article,[class*=padding])>header.fixed{transform:translateY(calc(-1 * var(---translateY)))}.no-padding>:is(header,footer).fixed{transform:none}.small-padding>:is(header,footer).fixed{---translateY: .5rem}:is(.large-padding,dialog:not(.left,.right,.top,.bottom))>:is(header,footer).fixed{---translateY: 1.5rem}svg{fill:currentcolor}:is(img,svg,video):is(.small,.medium,.large,.tiny,.extra,.round,.circle,.responsive){object-fit:cover;object-position:center;transition:transform var(--speed3),border-radius var(--speed3),padding var(--speed3);block-size:3rem;inline-size:3rem}:is(img,svg,video).round{border-radius:.5rem}:is(img,svg,video).tiny{block-size:2rem;inline-size:2rem}:is(img,svg,video).small{block-size:2.5rem;inline-size:2.5rem}:is(img,svg,video).large{block-size:3.5rem;inline-size:3.5rem}:is(img,svg,video).extra{block-size:4rem;inline-size:4rem}:is(img,svg,video).responsive{inline-size:100%;block-size:100%;margin:0 auto}:is(button,.button,.chip):not(.transparent)>.responsive{border:.25rem solid transparent}:is(button,.button,.chip.medium)>.responsive{inline-size:2.5rem}:is(button.small,.button.small,.chip:not(.medium))>.responsive{inline-size:2rem}:is(button,.button,.chip).large>.responsive{inline-size:3rem}:is(button,.button,.chip).extra>.responsive{inline-size:3.5rem}:is(img,svg,video).responsive.tiny{inline-size:100%;block-size:4rem}:is(img,svg,video).responsive.small{inline-size:100%;block-size:8rem}:is(img,svg,video).responsive.medium{inline-size:100%;block-size:12rem}:is(img,svg,video).responsive.large{inline-size:100%;block-size:16rem}:is(img,svg,video).responsive.extra{inline-size:100%;block-size:20rem}:is(img,svg,video).responsive.round{border-radius:2rem}:is(img,svg,video).empty-state{max-inline-size:100%;inline-size:24rem}:is(button,.button,.chip,.field)>:is(img,svg):not(.responsive,.tiny,.small,.medium,.large,.extra),.tabs :is(img,svg):not(.responsive,.tiny,.small,.medium,.large,.extra){min-inline-size:1.5rem;max-inline-size:1.5rem;min-block-size:1.5rem;max-block-size:1.5rem}:is(button,.button,.chip)>:is(i,img,svg),:is(button,.button,.chip)>.responsive{margin:0 -.5rem}:is(button,.button)>.responsive{margin-inline-start:-1.5rem}:is(button,.button)>span+.responsive{margin-inline-start:-.5rem;margin-inline-end:-1.5rem}.chip>.responsive{margin-inline-start:-1rem}.chip>span+.responsive{margin-inline-start:-.5rem;margin-inline-end:-1rem}:is(.circle,.square)>.responsive{margin:0}.extend>:is(.responsive,i){margin:0;position:absolute;inset-inline:1rem;z-index:1}.extend>.responsive{inset-inline:0;inline-size:3.5rem}.extend.border>.responsive{inline-size:3.375rem}menu>li{all:unset}menu{opacity:0;visibility:hidden;position:absolute;box-shadow:var(--elevate2);background-color:var(--surface-container);z-index:11;inset:auto auto 0 0;inline-size:100%;max-block-size:50vh;max-inline-size:none!important;overflow-x:hidden;overflow-y:auto;font-size:.875rem;font-weight:400;text-transform:none;color:var(--on-surface);line-height:normal;text-align:start;border-radius:.25rem;transform:scale(.8) translateY(120%);transition:all var(--speed2),0s background-color}[dir=rtl] menu{inset:auto 0 0 auto}menu.no-wrap{inline-size:max-content;white-space:nowrap!important}menu.active,menu:not([data-ui]):active,:not(menu,[data-ui]):focus-within>menu,menu>:is(a,li,nav):hover+menu,menu>menu:hover{opacity:1;visibility:visible;transform:scale(1) translateY(100%)}menu *{white-space:inherit!important}menu>:is(a,nav,li>a,li>nav){padding:.5rem 1rem;min-block-size:3rem;flex:1;margin:0!important}menu>:is(a,li>a):not(.row){display:flex;flex-direction:column;align-items:flex-start}menu>:is(a,nav,li>a,li>nav):is(:hover,:focus,.active){background-color:var(--active)}menu.min{inset:0 0 auto 0;transform:none!important;border-radius:inherit}[dir=rtl] menu.min.right,menu.min.left{inset:0 0 auto auto}[dir=rtl] menu.min.left,menu.min.right{inset:0 auto auto 0}menu.max{position:fixed;top:0;right:0;bottom:0;left:0;block-size:100%;max-block-size:none;min-block-size:auto;z-index:100;transform:none!important}menu.no-wrap:is(.min,.max){min-inline-size:16rem}[dir=rtl] menu.right,menu.left{inset:auto 0 0 auto}[dir=rtl] menu.left,menu.right{inset:auto auto 0 0}menu:has(>menu),menu>menu{---child: 1;---type: 0;overflow:unset;white-space:nowrap;inline-size:auto;min-inline-size:12rem;max-block-size:none}menu>menu,menu>menu.right,[dir=rtl] menu>menu.left{inset:auto auto calc(3rem * (var(---child) - var(---type))) 100%}[dir=rtl] menu>menu,[dir=rtl] menu>menu.right,menu>menu.left{inset:auto 100% calc(3rem * (var(---child) - var(---type))) auto}menu>:nth-last-child(2){---child: 2}menu>:nth-last-child(3){---child: 3}menu>:nth-last-child(4){---child: 4}menu>:nth-last-child(5){---child: 5}menu>:nth-last-child(6){---child: 6}menu>:nth-last-child(7){---child: 7}menu>:nth-last-child(8){---child: 8}menu>:nth-last-child(9){---child: 9}menu>:nth-last-child(10){---child: 10}menu>:nth-last-child(11){---child: 11}menu>:nth-last-of-type(2){---type: 1}menu>:nth-last-of-type(3){---type: 2}menu>:nth-last-of-type(4){---type: 3}menu>:nth-last-of-type(5){---type: 4}menu>:nth-last-of-type(6){---type: 5}menu>:nth-last-of-type(7){---type: 6}menu>:nth-last-of-type(8){---type: 7}menu>:nth-last-of-type(9){---type: 8}menu>:nth-last-of-type(10){---type: 9}menu>:nth-last-of-type(11){---type: 10}nav>:is(ol,ul),nav>:is(ol,ul)>li{all:unset}nav,.row,a.row,nav.drawer>:is(a,label),nav.drawer>:is(ol,ul)>li>:is(a,label){display:flex;align-items:center;align-self:normal;text-align:start;justify-content:flex-start;white-space:nowrap;gap:1rem}a.row,nav.row{min-block-size:3rem;margin:0}:is(nav,.row,.max)>:only-child,nav>:is(ol,ul)>li>:only-child{margin:0}:is(nav,.row)>*{margin:0;white-space:normal;flex:none}:is(nav,.row).no-space{gap:0}:is(nav,.row).no-space:not(.vertical)>.border+.border{border-inline-start:0}:is(nav,.row).no-space.vertical>.border+.border{border-top:0}:is(nav,.row).medium-space{gap:1.5rem}:is(nav,.row).large-space{gap:2rem}:is(nav,.row)>.max,:is(nav,.row)>:is(ol,ul)>.max,nav.drawer>:is(a,label)>.max,nav.drawer>:is(ol,ul)>li>:is(a,label)>.max{flex:1}:is(nav,.row).wrap{display:flex;flex-wrap:wrap}:is(header,footer)>:is(nav,.row){min-block-size:inherit}:is(nav,.row)>.border.no-margin+.border.no-margin{border-inline-start:0}nav:is(.left,.right,.top,.bottom){border:0;position:fixed;color:var(--on-surface);transform:none;z-index:100;block-size:auto;inline-size:auto;text-align:center;padding:.5rem 1rem;inset:var(--top) var(--right) var(--bottom) var(--left);margin:0}nav:is(.left,.right){inline-size:5rem;justify-content:flex-start;flex-direction:column;background-color:var(--surface)}nav:is(.top,.bottom){block-size:5rem;justify-content:center;flex-direction:row;background-color:var(--surface-container)}nav.top{inset-block-end:auto}nav.left{inset-inline-end:auto}nav.right{inset-inline-start:auto}nav.bottom{inset-block-start:auto}nav.drawer{flex-direction:column;align-items:normal;inline-size:20rem;gap:0;padding:.5rem 1rem}nav.drawer:is(.min,.max){inline-size:auto}nav.drawer.max{inline-size:100%}:is(nav,.row)>header{background-color:inherit}nav:is(.left,.right)>header{transform:translateY(-.5rem)}nav.drawer>header{transform:translateY(-.75rem);min-block-size:4.5rem;align-self:stretch}nav.drawer>:is(a,label),nav.drawer>:is(ol,ul)>li>:is(a,label),:is(a.row,nav.row):is(.wave,.slow-ripple,.ripple,.fast-ripple){padding:.75rem;font-size:inherit}nav.drawer>a,nav.drawer>:is(ol,ul)>li>a{border-radius:2rem}nav.drawer>a:is(:hover,.active),nav.drawer>:is(ol,ul)>li>a:is(:hover,.active){background-color:var(--secondary-container)}nav.drawer>a:is(:hover,:focus,.active)>i,nav.drawer>:is(ol,ul)>li>a:is(:hover,:focus,.active)>i{font-variation-settings:"FILL" 1}nav>:is(ol,ul){all:inherit;flex:auto}nav:not(.left,.right,.bottom,.top)>:is(ol,ul){padding:0}nav:is(.left,.right,.top,.bottom):not(.drawer)>a:not(.button,.chip),nav:is(.left,.right,.top,.bottom):not(.drawer)>:is(ol,ul)>li>a:not(.button,.chip){align-self:center;display:flex;flex-direction:column;gap:.25rem;line-height:normal}nav:is(.top,.bottom):not(.drawer)>a:not(.button,.chip),nav:is(.top,.bottom):not(.drawer)>:is(ol,ul)>li>a:not(.button,.chip){inline-size:3.5rem}nav:is(.left,.right,.top,.bottom):not(.drawer)>a:not(.button,.chip)>i,nav:is(.left,.right,.top,.bottom):not(.drawer)>:is(ol,ul)>li>a:not(.button,.chip)>i{padding:.25rem;border-radius:2rem;transition:padding var(--speed1) linear;margin:0 auto}nav:is(.left,.right,.top,.bottom):not(.drawer)>a:not(.button,.chip):is(:hover,:focus,.active)>i,nav:is(.left,.right,.top,.bottom):not(.drawer)>:is(ol,ul)>li>a:not(.button,.chip):is(:hover,:focus,.active)>i{background-color:var(--secondary-container);color:var(--on-secondary-container);padding:.25rem 1rem;font-variation-settings:"FILL" 1}:is(nav,.row):is(.left-align,.top-align,.vertical){justify-content:flex-start}:is(nav,.row):is(.right-align,.bottom-align){justify-content:flex-end}:is(nav,.row):is(.center-align,.middle-align){justify-content:center}:is(nav,.row):is(.left-align,.top-align,.vertical).vertical{align-items:flex-start}:is(nav,.row):is(.right-align,.bottom-align).vertical{align-items:flex-end}:is(nav,.row):is(.center-align,.middle-align).vertical{align-items:center}:is(.drawer,.vertical)>:is(li,[class*=divider],hr):not(.vertical),:is(.drawer,.vertical)>:is(ol,ul)>li:not(.vertical){align-self:stretch}nav:not(.left,.right)>.space{inline-size:.5rem}nav:not(.left,.right)>.medium-space{inline-size:1rem}nav:not(.left,.right)>.large-space{inline-size:1.5rem}nav.tabbed{background-color:var(--surface-container);border-radius:4rem!important;gap:0rem;block-size:4rem}nav.tabbed.small{block-size:3rem}nav.tabbed.large{block-size:5rem}nav.tabbed>a{border-radius:inherit;block-size:inherit;display:inline-flex;align-items:center;padding-inline:1rem;gap:.5rem;font-size:1rem;flex:1}nav.tabbed>a.active{background-color:var(--primary-container)}:not(nav)>:is(ul,ol){all:revert}:is(.scroll,.no-scroll,.no-space,.tabs,.tabbed)>:focus-visible{outline:.125rem solid var(--primary);outline-offset:-.125rem}@media only screen and (max-width: 600px){nav.top,nav.bottom{justify-content:space-around}}.overlay{opacity:0;visibility:hidden;position:fixed;top:0;right:0;bottom:0;left:0;color:var(--on-surface);background-color:var(--overlay);z-index:100;transition:all var(--speed3),0s background-color}.overlay.active{opacity:1;visibility:visible}.page{---transform: translate(0, 0);opacity:0;position:absolute;display:none}.page.active{opacity:1;position:inherit;display:inherit;animation:var(--speed4) to-page ease}.page.active.top{---transform: translate(0, -4rem)}.page.active.bottom{---transform: translate(0, 4rem)}.page.active.left{---transform: translate(-4rem, 0)}.page.active.right{---transform: translate(4rem, 0)}@keyframes to-page{0%{opacity:0;transform:var(---transform)}to{opacity:1;transform:translate(0)}}progress{position:relative;inline-size:100%;block-size:.5rem;color:var(--primary);background:var(--primary-container);border-radius:1rem;flex:none;border:none;overflow:hidden;writing-mode:horizontal-tb;direction:ltr;-webkit-appearance:none}progress.small{inline-size:4rem}progress.medium{inline-size:8rem}progress.large{inline-size:12rem}progress:not(.circle,[value]):after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;inline-size:100%;block-size:100%;clip-path:none;background:currentcolor;animation:1.6s to-linear ease infinite}progress:not(.circle,[value])::-moz-progress-bar{animation:1.6s to-linear ease infinite}progress:not(.circle,[value])::-webkit-progress-value{animation:1.6s to-linear ease infinite}progress::-webkit-progress-bar{background:none}progress::-webkit-progress-value{background:currentcolor}progress::-moz-progress-bar{background:currentcolor}progress.circle{display:inline-block;inline-size:2.5rem;block-size:2.5rem;border-radius:50%;border-width:.3rem;border-style:solid;border-color:currentcolor;animation:1.6s to-circular linear infinite;background:none;flex:none}progress.circle::-moz-progress-bar{background:none}progress.circle.small{inline-size:1.5rem;block-size:1.5rem;border-width:.2rem}progress.circle.large{inline-size:3.5rem;block-size:3.5rem;border-width:.4rem}:is(nav,.row,.field)>progress:not(.circle,.small,.medium,.large){flex:auto}progress.max{display:unset;position:absolute;inline-size:100%!important;block-size:100%!important;color:var(--active);background:none;top:0;right:0;bottom:0;left:0;border-radius:inherit;animation:none;writing-mode:horizontal-tb}progress:is(.horizontal,.vertical,.max){display:unset;inline-size:100%!important}progress.vertical{writing-mode:vertical-lr}progress.max.vertical{transform:rotate(-180deg)}progress.max+*{margin-block-start:0}:is(.button,button,.chip)>progress.circle{color:inherit}@supports (-moz-appearance:none){progress.max.vertical{transform:none}}@keyframes to-linear{0%{margin-inline-start:0%;inline-size:0%}50%{margin-inline-start:0%;inline-size:100%}to{margin-inline-start:100%;inline-size:0%}}@keyframes to-circular{0%{transform:rotate(0);clip-path:polygon(50% 50%,0% 0%,50% 0%,50% 0%,50% 0%,50% 0%,50% 0%,50% 0%,50% 0%)}20%{clip-path:polygon(50% 50%,0% 0%,50% 0%,100% 0%,100% 0%,100% 0%,100% 0%,100% 0%,100% 0%)}30%{clip-path:polygon(50% 50%,0% 0%,50% 0%,100% 0%,100% 50%,100% 50%,100% 50%,100% 50%,100% 50%)}40%{clip-path:polygon(50% 50%,0% 0%,50% 0%,100% 0%,100% 50%,100% 100%,100% 100%,100% 100%,100% 100%)}50%{clip-path:polygon(50% 50%,50% 0%,50% 0%,100% 0%,100% 50%,100% 100%,50% 100%,50% 100%,50% 100%)}60%{clip-path:polygon(50% 50%,100% 50%,100% 50%,100% 50%,100% 50%,100% 100%,50% 100%,0% 100%,0% 100%)}70%{clip-path:polygon(50% 50%,50% 100%,50% 100%,50% 100%,50% 100%,50% 100%,50% 100%,0% 100%,0% 50%)}80%{clip-path:polygon(50% 50%,0% 100%,0% 100%,0% 100%,0% 100%,0% 100%,0% 100%,0% 100%,0% 50%)}90%{transform:rotate(360deg);clip-path:polygon(50% 50%,0% 50%,0% 50%,0% 50%,0% 50%,0% 50%,0% 50%,0% 50%,0% 50%)}to{clip-path:polygon(50% 50%,0% 50%,0% 50%,0% 50%,0% 50%,0% 50%,0% 50%,0% 50%,0% 50%)}}.checkbox,.radio,.switch{direction:ltr;inline-size:auto;block-size:auto;line-height:normal;white-space:nowrap;cursor:pointer;display:inline-flex;align-items:center}:is(.checkbox,.radio)>input{inline-size:1.5rem;block-size:1.5rem;opacity:0}.switch>input{inline-size:3.25rem;block-size:2rem;opacity:0}:is(.checkbox,.radio,.switch)>span{display:inline-flex;align-items:center;color:var(--on-surface);font-size:.875rem}:is(.checkbox,.radio)>span:not(:empty){padding-inline-start:.25rem}:is(.checkbox,.radio,.switch)>span:before,.icon>span>i,:is(.checkbox,.radio)>span:after{content:"";inline-size:1.5rem;block-size:1.5rem;box-sizing:border-box;margin:0 auto;outline:none;color:var(--primary);position:absolute;inset:auto auto auto -1.5rem;border-radius:50%;-webkit-user-select:none;user-select:none;z-index:1}.switch>span:before,.switch.icon>span>i{position:absolute;inset:50% auto auto 0;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;transition:all var(--speed2);font-size:1rem;-webkit-user-select:none;user-select:none;min-inline-size:auto;content:"";color:var(--surface-variant);background-color:var(--outline)}.switch>span:before,.switch.icon>span>i{transform:translate(-3rem,-50%) scale(.6)}.switch.icon>span>i{transform:translate(-3rem,-50%) scale(1)}.checkbox>span:before{content:"check_box_outline_blank"}.checkbox>input:checked+span:before{content:"check_box";font-variation-settings:"FILL" 1}.checkbox>input:indeterminate+span:before{content:"indeterminate_check_box"}.radio>span:before{content:"radio_button_unchecked"}.radio>input:checked+span:before{content:"radio_button_checked"}:is(.radio,.checkbox,.switch).icon>span:before{content:""!important;font-variation-settings:unset!important}:is(.checkbox,.radio)>span:after{transition:all var(--speed1);background-color:currentColor;box-shadow:0 0 0 0 currentColor;opacity:0}:is(.checkbox,.radio):is(:hover)>input:not(:disabled)+span:after,:is(.checkbox,.radio)>input:not(:disabled):is(:focus)+span:after{box-shadow:0 0 0 .5rem currentColor;opacity:.1}.switch>input:not(:disabled):is(:focus,:hover)+span:before,.switch.icon>input:not(:disabled):is(:focus,:hover)+span>i{box-shadow:0 0 0 .5rem var(--active)}:is(.checkbox,.radio)>input:checked+span:before,:is(.checkbox,.radio).icon>input:checked+span>i{color:var(--primary)}.icon>input:checked+span>i:first-child,.icon>span>i:last-child{opacity:0}.icon>input:checked+span>i:last-child,.icon>span>i:first-child{opacity:1}.switch>input:checked+span:after{border:none;background-color:var(--primary)}.switch>input:checked+span:before,.switch.icon>input:checked+span>i{content:"check";color:var(--primary);background-color:var(--on-primary)}.switch>input:checked+span:before,.switch.icon>input:checked+span>i{transform:translate(-1.75rem,-50%) scale(1)}:is(.checkbox,.radio,.switch)>input:disabled+span{opacity:.5;cursor:not-allowed}.switch>span:after{content:"";position:absolute;inset:50% auto auto 0;background-color:var(--active);border:.125rem solid var(--outline);box-sizing:border-box;inline-size:3.25rem;block-size:2rem;border-radius:2rem}.switch>span:after{transform:translate(-3.25rem,-50%)}.field>:is(nav,.row){flex-grow:1;padding:0 1rem}.field.round>:is(nav,.row){flex-grow:1;padding:0 1.5rem}[dir=rtl] .switch{transform:scale(-1)}[dir=rtl] .switch>span:before,[dir=rtl] .switch.icon>span>i{transform:translate(-3rem,-50%) scale(-.6)}[dir=rtl] .switch.icon>span>i{transform:translate(-3rem,-50%) scale(-1)}[dir=rtl] .switch>input:checked+span:before,[dir=rtl] .switch.icon>input:checked+span>i{transform:translate(-1.75rem,-50%) scale(-1)}.switch>:focus-visible+span:after{outline:.125rem solid var(--primary);outline-offset:.25rem}:is(.checkbox,.radio)>:focus-visible+span:before{outline:.125rem solid var(--primary);outline-offset:.375rem}.slider{---start: 0%;---end: 0%;---value1: "";---value2: "";display:flex;align-items:center!important;inline-size:auto;block-size:1.25rem;margin:1.125rem;flex:none;direction:ltr}[dir=rtl] .slider{transform:scaleX(-1)}.slider.vertical{flex-direction:row!important;margin:.5rem auto!important;padding:50% 0;transform:rotate(-90deg);inline-size:100%}.slider.small{inline-size:4rem}.slider.medium{inline-size:8rem}.slider.large{inline-size:12rem}.slider>input{-webkit-appearance:none;-moz-appearance:none;appearance:none;box-shadow:none;border:none;outline:none;pointer-events:none;inline-size:100%;block-size:1rem;background:none;z-index:1;padding:0;margin:0;transform:rotate(0)}.slider>input:only-of-type{pointer-events:all}.slider>input+input{position:absolute}.slider>input::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;box-shadow:none;border:none;outline:none;pointer-events:all;block-size:2.75rem;inline-size:.25rem;border-radius:.25rem;background:var(--primary);cursor:grab;margin:0}.slider>input::-webkit-slider-thumb:active{cursor:grabbing}.slider>input::-moz-range-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;box-shadow:none;border:none;outline:none;pointer-events:all;block-size:2.75rem;inline-size:.25rem;border-radius:.25rem;background:var(--primary);cursor:grab;margin:0}.slider>input::-moz-range-thumb:active{cursor:grabbing}.slider>input:not(:disabled):is(:focus)::-webkit-slider-thumb{transform:scaleX(.6)}.slider>input:not(:disabled):is(:focus)::-moz-range-thumb{transform:scaleX(.6)}.slider>input:disabled{cursor:not-allowed;opacity:1}.slider>input:disabled::-webkit-slider-thumb{background:#9e9e9e;cursor:not-allowed}.slider>input:disabled::-moz-range-thumb{background:#9e9e9e;cursor:not-allowed}.slider>input:disabled~span{background:#9e9e9e}.slider>span{position:absolute;block-size:1rem;border-radius:1rem 0 0 1rem;background:var(--primary);z-index:0;inset:calc(50% - .5rem) var(---end) auto var(---start);clip-path:polygon(0 0,calc(100% - .5rem) 0,calc(100% - .5rem) 100%,0 100%)}.slider>input[type=range]+input[type=range]~span{border-radius:0;clip-path:polygon(.5rem 0,max(.5rem,calc(100% - .5rem)) 0,max(.5rem,calc(100% - .5rem)) 100%,.5rem 100%)}.field>.slider{inline-size:100%}.slider:before{content:"";position:absolute;inline-size:100%;block-size:1rem;border-radius:1rem;background:var(--primary-container);clip-path:polygon(calc(var(---start) - .5rem) 0,0 0,0 100%,calc(var(---start) - .5rem) 100%,calc(var(---start) - .5rem) 0,calc(100% - var(---end) + .5rem) 0,100% 0,100% 100%,calc(100% - var(---end) + .5rem) 100%,calc(100% - var(---end) + .5rem) 0)}.slider:has(>[disabled]):before{background:var(--active)}.slider>.tooltip{visibility:hidden!important;opacity:0!important;inset:0 auto auto calc(100% - var(---end));border-radius:2rem;transition:top var(--speed2) ease,opacity var(--speed2) ease;transform:translate(-50%,-50%)!important;padding:.75rem 1rem}[dir=rtl] .slider>.tooltip{transform:translate(-50%,-50%) scaleX(-1)!important}.slider>.tooltip+.tooltip{inset:.25rem calc(100% - var(---start)) auto auto;transform:translate(50%,-50%)!important}[dir=rtl] .slider>.tooltip+.tooltip{transform:translate(50%,-50%) scaleX(-1)!important}.slider>.tooltip:before{content:var(---value1)}.slider>.tooltip+.tooltip:before{content:var(---value2)}.slider>:focus~.tooltip{inset-block-start:-1rem!important;opacity:1!important;visibility:visible!important}.slider.vertical>.tooltip{display:none}:is(nav,.row,.field)>.slider:not(.circle,.small,.medium,.large){flex:auto}.slider.max,.slider.max.vertical,.slider.max>input,.slider.max.vertical>input{all:unset;margin:0!important;position:absolute;color:var(--primary);top:0;right:0;bottom:0;left:0;border-radius:inherit;overflow:hidden;z-index:2;cursor:grab;inline-size:100%;block-size:100%}.slider.max:before{display:none}.slider.max.vertical>input{writing-mode:vertical-lr;transform:rotate(-180deg)}.slider.max>input::-webkit-slider-thumb{opacity:0;inline-size:1rem;block-size:100vh;transform:none!important}.slider.max>input::-moz-range-thumb{opacity:0;inline-size:1rem;block-size:100vh;transform:none!important}.slider.max>span{block-size:auto!important;inset:0 var(---end) 0 var(---start);clip-path:none;background:currentcolor;border-radius:0}.slider.max.vertical>span{inset:var(---end) 0 var(---start) 0}.slider>input:focus-visible::-webkit-slider-thumb{outline:.1875rem solid var(--primary);outline-offset:.25rem}.slider>input:focus-visible::-moz-range-thumb{outline:.1875rem solid var(--primary);outline-offset:.25rem}.slider.max>input:focus-visible{outline:.1875rem solid var(--primary);outline-offset:-.125rem}@media (pointer: coarse){.slider>:hover~.tooltip{inset-block-start:-1rem!important;opacity:1!important;visibility:visible!important}}.snackbar{position:fixed;inset:auto auto 6rem 50%;inline-size:80%;block-size:auto;z-index:200;visibility:hidden;display:flex;box-shadow:var(--elevate2);color:var(--inverse-on-surface);background-color:var(--inverse-surface);padding:1rem;opacity:1;cursor:pointer;text-align:start;align-items:center;border-radius:.25rem;gap:.5rem;transition:all var(--speed2);transform:translate(-50%,1rem);opacity:0}.snackbar.top{inset:6rem auto auto 50%}.snackbar.active{visibility:visible;transform:translate(-50%);opacity:1}.snackbar>.max{flex:auto}@media only screen and (min-width: 993px){.snackbar{inline-size:40%}}table{inline-size:100%;border-spacing:0;font-size:.875rem;text-align:start}.scroll>table,table :is(thead,tbody,tfoot,tr,th,td){background-color:inherit;color:inherit}:is(th,td){inline-size:auto;text-align:inherit;padding:.5rem}:is(th,td)>*{vertical-align:middle}table.border>tbody>tr:not(:last-child)>td,thead>tr>th{border-block-end:.0625rem solid var(--outline)}tfoot>tr>th{border-block-start:.0625rem solid var(--outline)}table.stripes>tbody>tr:nth-child(odd){background-color:var(--active)}table.no-space :is(th,td){padding:0}table.medium-space :is(th,td){padding:.75rem}table.large-space :is(th,td){padding:1rem}table>.fixed,th.fixed{position:sticky;z-index:1;inset-block-start:0}tfoot.fixed,tfoot th.fixed{inset-block-end:0}:is(td,th).min{inline-size:.1%;white-space:nowrap}.tabs{display:flex;white-space:nowrap;border-block-end:.0625rem solid var(--surface-variant)}.tabs:not(.left-align,.right-align,.center-align){justify-content:space-around}.tabs>a{display:flex;font-size:.875rem;font-weight:500;color:var(--on-surface-variant);padding:.5rem 1rem;text-align:center;min-block-size:3rem;inline-size:100%;gap:.25rem}.tabs.small>a{min-block-size:2rem}.tabs.large>a{min-block-size:4rem}.tabs>a.active,.tabs>a.active>i{color:var(--primary)}.tabs>a.active:before{content:"";position:absolute;inset:auto 0 0 0;block-size:.125rem;background-color:var(--primary)}.tabs.min>a.active:before{margin:0 auto;max-inline-size:min(100%,4rem)}.tabs:is(.left-align,.center-align,.right-align)>a{inline-size:auto}.tooltip{---space: -.5rem;visibility:hidden;display:flex;align-items:center;justify-content:center;gap:.5rem;background-color:var(--inverse-surface);color:var(--inverse-on-surface);font-size:.75rem;text-align:center;border-radius:.25rem;padding:.5rem;position:absolute;z-index:3;inset:0 auto auto 50%;inline-size:auto;white-space:nowrap;font-weight:500;opacity:0;transition:all var(--speed2);line-height:normal;transform:translate(-50%,-100%) scale(.9)}.tooltip.left{inset:50% auto auto 0;transform:translate(-100%,-50%) scale(.9)}.tooltip.right{inset:50% 0 auto auto;transform:translate(100%,-50%) scale(.9)}.tooltip.bottom{inset:auto auto 0 50%;transform:translate(-50%,100%) scale(.9)}.tooltip.small{inline-size:8rem;white-space:normal}.tooltip.medium{inline-size:12rem;white-space:normal}.tooltip.large{inline-size:16rem;white-space:normal}:hover>.tooltip{visibility:visible;opacity:1;transform:translate(-50%,-100%) scale(1)}:hover>.tooltip.left{transform:translate(-100%,-50%) scale(1)}:hover>.tooltip.right{transform:translate(100%,-50%) scale(1)}:hover>.tooltip.bottom{transform:translate(-50%,100%) scale(1)}.tooltip.no-space{---space: 0}.tooltip.medium-space{---space: -1rem}.tooltip.large-space{---space: -1.5rem}.tooltip:not(.left,.right,.bottom){margin-block-start:var(---space)!important}.tooltip.left,.tooltip.right{margin-inline:var(---space)!important}.tooltip.bottom{margin-block-end:var(---space)!important}menu:active~.tooltip,:is(button,.button):focus>menu~.tooltip,.field>:focus~menu~.tooltip{visibility:hidden}.slider>.tooltip{---space: -1.25rem}.slider.vertical>.tooltip{---space: -.75rem}.slider.vertical>.tooltip:is(.left,.right){---space: -.5rem}.tooltip.max{display:block;font-size:inherit;white-space:normal;text-align:start;inline-size:20rem;border-radius:.5rem;padding:1rem;box-shadow:var(--elevate2)}[class*=blur],[class*=blur].light{---blur: 1rem;-webkit-backdrop-filter:blur(var(---blur));backdrop-filter:blur(var(---blur));color:var(--on-surface);background-color:#ffffff80}.dark [class*=blur],[class*=blur].dark{background-color:#00000080}.small-blur{---blur: .5rem}.large-blur{---blur: 1.5rem}.shadow{background-color:#00000050}:is(.left-shadow,.right-shadow,.top-shadow,.bottom-shadow){background-color:transparent!important}.left-shadow{background-image:linear-gradient(to right,black,transparent)}.right-shadow{background-image:linear-gradient(to left,black,transparent)}.bottom-shadow{background-image:linear-gradient(to top,black,transparent)}.top-shadow{background-image:linear-gradient(to bottom,black,transparent)}
package/dist/cdn/beer.min.js CHANGED
@@ -1 +1 @@
1
- const U=[];function E(){return window.matchMedia("(pointer: coarse)").matches}function st(){return window.matchMedia("(prefers-color-scheme: dark)").matches}async function Z(t){await new Promise(n=>setTimeout(n,t))}function lt(){return"fxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,t=>{const n=Math.random()*16|0;return(t==="x"?n:n&3|8).toString(16)})}function x(t,n){try{return typeof t=="string"?(n??document).querySelector(t):t}catch{return null}}function u(t,n){try{return typeof t=="string"?(n??document).querySelectorAll(t):t??U}catch{return U}}function a(t,n){return(t==null?void 0:t.classList.contains(n))??!1}function p(t,n){var e;return((e=t==null?void 0:t.tagName)==null?void 0:e.toLowerCase())===n}function C(t,n){var e;return((e=t==null?void 0:t.type)==null?void 0:e.toLowerCase())===n}function y(t,n){if(t instanceof NodeList)for(let e=0;e<t.length;e++)t[e].classList.add(n);else t==null||t.classList.add(n)}function f(t,n){if(t instanceof NodeList)for(let e=0;e<t.length;e++)t[e].classList.remove(n);else t==null||t.classList.remove(n)}function o(t,n,e,i=!0){t!=null&&t.addEventListener&&t.addEventListener(n,e,i)}function P(t,n,e,i=!0){t!=null&&t.removeEventListener&&t.removeEventListener(n,e,i)}function ft(t,n){var e;(e=n==null?void 0:n.parentNode)==null||e.insertBefore(t,n)}function F(t){return t==null?void 0:t.previousElementSibling}function O(t){return t==null?void 0:t.nextElementSibling}function b(t){return t==null?void 0:t.parentElement}function dt(t){const n=document.createElement("div");for(let e=0,i=Object.keys(t),s=i.length;e<s;e++){const c=i[e],r=t[c];n.setAttribute(c,r)}return n}function N(){var t;(t=document.activeElement)==null||t.blur()}function pt(t){return u('[data-ui="#'+t+'"]')}function yt(t){return x('[data-ui="#'+t+'"]')}function gt(t){t.id&&a(t,"page")&&(t=yt(t.id)??t);const n=b(t);if(!a(n,"tabs")&&!a(n,"tabbed")&&!p(n,"nav"))return;const e=u("a",n);for(let i=0;i<e.length;i++)f(e[i],"active");y(t,"active")}function W(t){t.placeholder||(t.placeholder=" ")}function ht(t){const n=t.currentTarget,e=b(n),i=x("input:not([type=file], [type=checkbox], [type=radio]), select, textarea",e);i&&i.focus()}function _(t){const n=t.currentTarget;w(n)}function $(t){const n=t.currentTarget;w(n)}function vt(t){const n=t.currentTarget;q(n)}function bt(t){const n=t.currentTarget;z(n)}function kt(t){const n=t.currentTarget;q(n,t)}function xt(t){const n=t.currentTarget;z(n,t)}function mt(t){const n=t.currentTarget;G(n)}function Tt(){const t=u(".field > label");for(let n=0;n<t.length;n++)o(t[n],"click",ht)}function Ct(){const t=u(".field > input:not([type=file], [type=color], [type=range])");for(let n=0;n<t.length;n++)o(t[n],"focus",_),o(t[n],"blur",$),w(t[n])}function wt(){const t=u(".field > select");for(let n=0;n<t.length;n++)o(t[n],"focus",_),o(t[n],"blur",$)}function Lt(){const t=u(".field > input[type=file]");for(let n=0;n<t.length;n++)o(t[n],"change",vt),q(t[n])}function At(){const t=u(".field > input[type=color]");for(let n=0;n<t.length;n++)o(t[n],"change",bt),z(t[n])}function Et(){const t=u(".field.textarea > textarea");for(let n=0;n<t.length;n++)o(t[n],"focus",_),o(t[n],"blur",$),o(t[n],"input",mt),G(t[n])}function w(t){C(t,"number")&&!t.value&&(t.value=""),W(t)}function q(t,n){if((n==null?void 0:n.key)==="Enter"){const i=F(t);if(!C(i,"file"))return;i.click();return}const e=O(t);C(e,"text")&&(e.value=t.files?Array.from(t.files).map(i=>i.name).join(", "):"",e.readOnly=!0,o(e,"keydown",kt,!1),w(e))}function z(t,n){if((n==null?void 0:n.key)==="Enter"){const i=F(t);if(!C(i,"color"))return;i.click();return}const e=O(t);C(e,"text")&&(e.readOnly=!0,e.value=t.value,o(e,"keydown",xt,!1),w(e))}function G(t){W(t);const n=b(t);n.removeAttribute("style"),a(n,"min")&&n.style.setProperty("---size",`${Math.max(t.scrollHeight,n.offsetHeight)}px`)}function St(){Tt(),Ct(),wt(),Lt(),At(),Et()}function V(t){const n=t.target;!p(n,"input")&&!p(n,"select")||(n.type==="range"?(n.focus(),X(n)):Q())}function Dt(t){if(!E())return;const n=t.target,e=b(n);a(e,"vertical")&&document.body.classList.add("no-scroll")}function Mt(t){if(!E())return;const n=t.target,e=b(n);a(e,"vertical")&&document.body.classList.remove("no-scroll")}function Q(){const t=document.body,n=u(".slider > input[type=range]");n.length?o(t,"input",V,!1):P(t,"input",V,!1);for(let e=0;e<n.length;e++)X(n[e])}function X(t){o(t,"focus",Dt),o(t,"blur",Mt);const n=b(t),e=x("span",n),i=u("input",n);if(!i.length||!e)return;const s=parseInt(getComputedStyle(document.documentElement).getPropertyValue("--size"))||16,c=a(n,"max")?0:.25*s*100/i[0].offsetWidth,r=[],d=[];for(let v=0,ct=i.length;v<ct;v++){const K=parseFloat(i[v].min)||0,at=parseFloat(i[v].max)||100,R=parseFloat(i[v].value)||0,j=(R-K)*100/(at-K),ut=c/2-c*j/100;r.push(j+ut),d.push(R)}let g=r[0],h=0,L=100-h-g,k=d[0],m=d[1]||0;i.length>1&&(g=Math.abs(r[1]-r[0]),h=r[1]>r[0]?r[0]:r[1],L=100-h-g,m>k&&(k=d[1]||0,m=d[0])),n.style.setProperty("---start",`${h}%`),n.style.setProperty("---end",`${L}%`),n.style.setProperty("---value1",`'${k}'`),n.style.setProperty("---value2",`'${m}'`)}function It(){Q()}const l={light:"",dark:""};function I(){var t;return(t=document==null?void 0:document.body)!=null&&t.classList.contains("dark")?"dark":"light"}function Pt(){if(l.light&&l.dark)return l;const t=document.body,n=document.createElement("body");n.className="light",t.appendChild(n);const e=document.createElement("body");e.className="dark",t.appendChild(e);const i=getComputedStyle(n),s=getComputedStyle(e),c=["--primary","--on-primary","--primary-container","--on-primary-container","--secondary","--on-secondary","--secondary-container","--on-secondary-container","--tertiary","--on-tertiary","--tertiary-container","--on-tertiary-container","--error","--on-error","--error-container","--on-error-container","--background","--on-background","--surface","--on-surface","--surface-variant","--on-surface-variant","--outline","--outline-variant","--shadow","--scrim","--inverse-surface","--inverse-on-surface","--inverse-primary","--surface-dim","--surface-bright","--surface-container-lowest","--surface-container-low","--surface-container","--surface-container-high","--surface-container-highest"];for(let r=0,d=c.length;r<d;r++)l.light+=c[r]+":"+i.getPropertyValue(c[r])+";",l.dark+=c[r]+":"+s.getPropertyValue(c[r])+";";return t.removeChild(n),t.removeChild(e),l}function Ft(t){const n=globalThis,e=document.body;if(!t||!n.materialDynamicColors)return Pt();const i=I();return t.light&&t.dark?(l.light=t.light,l.dark=t.dark,e.setAttribute("style",t[i]),t):n.materialDynamicColors(t).then(s=>{const c=r=>{let d="";for(let g=0,h=Object.keys(r),L=h.length;g<L;g++){const k=h[g],m=r[k],v=k.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g,"$1-$2").toLowerCase();d+="--"+v+":"+m+";"}return d};return l.light=c(s.light),l.dark=c(s.dark),e.setAttribute("style",l[i]),l})}function Y(t){const n=globalThis,e=document.body;if(!e)return t;if(!t)return I();t==="auto"&&(t=st()?"dark":"light"),e.classList.remove("light","dark"),e.classList.add(t);const i=t==="light"?l.light:l.dark;return n.materialDynamicColors&&e.setAttribute("style",i),I()}const A=[];function J(t){if(t.key==="Escape"){const n=t.currentTarget;nt(n,n)}}function tt(t,n){f(pt(t.id),"active"),f(t,"active"),f(n,"active"),t.close(),A.pop();const e=A[A.length-1];e?e.focus():E()&&document.body.classList.remove("no-scroll")}async function Ot(t,n,e,i){!p(i,"button")&&!a(i,"button")&&!a(i,"chip")&&y(i,"active"),y(n,"active"),y(t,"active"),e?t.showModal():t.show(),await Z(90),e||o(t,"keydown",J,!1),A.push(t),t.focus(),E()&&document.body.classList.add("no-scroll")}function Nt(t){const n=t.currentTarget,e=O(n);p(e,"dialog")&&tt(e,n)}async function nt(t,n){N();let e=F(n);const i=a(n,"active")||n.open,s=a(n,"modal");s||P(n,"keydown",J,!1),a(e,"overlay")||(e=dt({class:"overlay"}),ft(e,n),await Z(90)),s||o(e,"click",Nt,!1),i?tt(n,e):Ot(n,e,s,t)}let S;function et(t){P(document.body,"click",et);const n=t.target,e=u("menu.active");for(let i=0;i<e.length;i++)it(n,e[i],t)}function _t(t){setTimeout(()=>{const n=x(".field > input",t);n?n.focus():t.focus()},90)}function it(t,n,e){S&&clearTimeout(S),S=setTimeout(()=>{o(document.body,"click",et),p(document.activeElement,"input")||N();const i=a(n,"active"),s=(e==null?void 0:e.target)===t,c=!!t.closest("menu");if(!i&&c||i&&s){f(n,"active");return}f(u("menu.active"),"active"),y(n,"active"),_t(n)},90)}let T;function $t(t){const n=t.currentTarget;f(n,"active"),T&&clearTimeout(T)}function qt(t,n){N();const e=u(".snackbar.active");for(let i=0;i<e.length;i++)f(e[i],"active");y(t,"active"),o(t,"click",$t),T&&clearTimeout(T),n!==-1&&(T=setTimeout(()=>{f(t,"active")},n??6e3))}function zt(t){const n=b(t);n&&f(u(":scope > .page",n),"active"),y(t,"active")}let D,M;function H(){D&&clearTimeout(D),D=setTimeout(async()=>await rt(),180)}async function B(t,n,e,i){if(!(!n&&(n=x(t.getAttribute("data-ui")),!n))){if(gt(t),p(n,"dialog")){await nt(t,n);return}if(p(n,"menu")){it(t,n,i);return}if(a(n,"snackbar")){qt(n,e);return}if(a(n,"page")){zt(n);return}if(a(n,"active")){f(t,"active"),f(n,"active");return}y(n,"active")}}function Bt(t){B(t.currentTarget,null,null,t)}function Kt(t){t.key==="Enter"&&B(t.currentTarget,null,null,t)}function ot(){M||(M=new MutationObserver(H),M.observe(document.body,{childList:!0,subtree:!0}),H())}function Rt(){const t=u("[data-ui]");for(let n=0,e=t.length;n<e;n++)o(t[n],"click",Bt),p(t[n],"a")&&!t[n].getAttribute("href")&&o(t[n],"keydown",Kt)}function rt(t,n){if(t){if(t==="setup"){ot();return}if(t==="guid")return lt();if(t==="mode")return Y(n);if(t==="theme")return Ft(n);const e=x(t);if(!e)return;B(e,e,n)}Rt(),St(),It()}function jt(){var e;const t=globalThis,n=(e=t==null?void 0:t.document)==null?void 0:e.body;n&&!n.classList.contains("dark")&&!n.classList.contains("light")&&Y("auto"),o(t,"load",ot,!1),t.ui=rt}jt();export{rt as default,rt as ui};
1
+ const U=[];function E(){return window.matchMedia("(pointer: coarse)").matches}function ut(){return window.matchMedia("(prefers-color-scheme: dark)").matches}async function Z(t){await new Promise(n=>setTimeout(n,t))}function lt(){return"fxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,t=>{const n=Math.random()*16|0;return(t==="x"?n:n&3|8).toString(16)})}function h(t,n){try{return typeof t=="string"?(n??document).querySelector(t):t}catch{return null}}function s(t,n){try{return typeof t=="string"?(n??document).querySelectorAll(t):t??U}catch{return U}}function u(t,n){return(t==null?void 0:t.classList.contains(n))??!1}function y(t,n){var e;return((e=t==null?void 0:t.tagName)==null?void 0:e.toLowerCase())===n}function C(t,n){var e;return((e=t==null?void 0:t.type)==null?void 0:e.toLowerCase())===n}function g(t,n){if(t instanceof NodeList)for(let e=0;e<t.length;e++)t[e].classList.add(n);else t==null||t.classList.add(n)}function p(t,n){if(t instanceof NodeList)for(let e=0;e<t.length;e++)t[e].classList.remove(n);else t==null||t.classList.remove(n)}function o(t,n,e,i=!0){t!=null&&t.addEventListener&&t.addEventListener(n,e,i)}function P(t,n,e,i=!0){t!=null&&t.removeEventListener&&t.removeEventListener(n,e,i)}function ft(t,n){var e;(e=n==null?void 0:n.parentNode)==null||e.insertBefore(t,n)}function F(t){return t==null?void 0:t.previousElementSibling}function O(t){return t==null?void 0:t.nextElementSibling}function v(t){return t==null?void 0:t.parentElement}function dt(t){const n=document.createElement("div");for(let e=0,i=Object.keys(t),a=i.length;e<a;e++){const c=i[e],r=t[c];n.setAttribute(c,r)}return n}function $(){var t;(t=document.activeElement)==null||t.blur()}function pt(t){return s('[data-ui="#'+t+'"]')}function yt(t){return h('[data-ui="#'+t+'"]')}function gt(t){t.id&&u(t,"page")&&(t=yt(t.id)??t);const n=v(t);if(!u(n,"tabs")&&!u(n,"tabbed")&&!y(n,"nav"))return;const e=s("a",n);for(let i=0;i<e.length;i++)p(e[i],"active");g(t,"active")}function W(t){t.placeholder||(t.placeholder=" ")}function ht(t){const n=t.currentTarget,e=v(n),i=h("input:not([type=file], [type=checkbox], [type=radio]), select, textarea",e);i&&i.focus()}function N(t){const n=t.currentTarget;T(n)}function R(t){const n=t.currentTarget;T(n)}function vt(t){const n=t.currentTarget;_(n)}function bt(t){const n=t.currentTarget;q(n)}function kt(t){const n=t.currentTarget;_(n,t)}function xt(t){const n=t.currentTarget;q(n,t)}function mt(t){const n=t.currentTarget;X(n)}function wt(t){var i;const n=t.currentTarget,e=h("input",v(n));e&&((i=n.textContent)!=null&&i.includes("visibility"))&&(e.type=e.type==="password"?"text":"password")}function Ct(){const t=s(".field > label");for(let n=0;n<t.length;n++)o(t[n],"click",ht)}function Tt(){const t=s(".field > input:not([type=file], [type=color], [type=range])");for(let n=0;n<t.length;n++)o(t[n],"focus",N),o(t[n],"blur",R),T(t[n])}function Lt(){const t=s(".field > select");for(let n=0;n<t.length;n++)o(t[n],"focus",N),o(t[n],"blur",R)}function At(){const t=s(".field > input[type=file]");for(let n=0;n<t.length;n++)o(t[n],"change",vt),_(t[n])}function Et(){const t=s(".field > input[type=color]");for(let n=0;n<t.length;n++)o(t[n],"change",bt),q(t[n])}function St(){const t=s(".field.textarea > textarea");for(let n=0;n<t.length;n++)o(t[n],"focus",N),o(t[n],"blur",R),o(t[n],"input",mt),X(t[n])}function Dt(){const t=s("input[type=password] ~ :is(i, a)");for(let n=0;n<t.length;n++)o(t[n],"click",wt)}function T(t){C(t,"number")&&!t.value&&(t.value=""),W(t)}function _(t,n){if((n==null?void 0:n.key)==="Enter"){const i=F(t);if(!C(i,"file"))return;i.click();return}const e=O(t);C(e,"text")&&(e.value=t.files?Array.from(t.files).map(i=>i.name).join(", "):"",e.readOnly=!0,o(e,"keydown",kt,!1),T(e))}function q(t,n){if((n==null?void 0:n.key)==="Enter"){const i=F(t);if(!C(i,"color"))return;i.click();return}const e=O(t);C(e,"text")&&(e.readOnly=!0,e.value=t.value,o(e,"keydown",xt,!1),T(e))}function X(t){W(t);const n=v(t);n.removeAttribute("style"),u(n,"min")&&n.style.setProperty("---size",`${Math.max(t.scrollHeight,n.offsetHeight)}px`)}function Mt(){Ct(),Tt(),Lt(),At(),Et(),St(),Dt()}function V(t){const n=t.target;!y(n,"input")&&!y(n,"select")||(n.type==="range"?(n.focus(),G(n)):Y())}function It(t){if(!E())return;const n=t.target,e=v(n);u(e,"vertical")&&document.body.classList.add("no-scroll")}function Pt(t){if(!E())return;const n=t.target,e=v(n);u(e,"vertical")&&document.body.classList.remove("no-scroll")}function Y(){const t=document.body,n=s(".slider > input[type=range]");n.length?o(t,"input",V,!1):P(t,"input",V,!1);for(let e=0;e<n.length;e++)G(n[e])}function G(t){o(t,"focus",It),o(t,"blur",Pt);const n=v(t),e=h("span",n),i=s("input",n);if(!i.length||!e)return;const a=parseInt(getComputedStyle(document.documentElement).getPropertyValue("--size"))||16,c=u(n,"max")?0:.25*a*100/i[0].offsetWidth,r=[],l=[];for(let k=0,ct=i.length;k<ct;k++){const B=parseFloat(i[k].min)||0,at=parseFloat(i[k].max)||100,j=parseFloat(i[k].value)||0,K=(j-B)*100/(at-B),st=c/2-c*K/100;r.push(K+st),l.push(j)}let f=r[0],b=0,L=100-b-f,x=l[0],m=l[1]||0;i.length>1&&(f=Math.abs(r[1]-r[0]),b=r[1]>r[0]?r[0]:r[1],L=100-b-f,m>x&&(x=l[1]||0,m=l[0])),n.style.setProperty("---start",`${b}%`),n.style.setProperty("---end",`${L}%`),n.style.setProperty("---value1",`'${x}'`),n.style.setProperty("---value2",`'${m}'`)}function Ft(){Y()}const d={light:"",dark:""};function I(){var t;return(t=document==null?void 0:document.body)!=null&&t.classList.contains("dark")?"dark":"light"}function Ot(){if(d.light&&d.dark)return d;const t=document.body,n=document.createElement("body");n.className="light",t.appendChild(n);const e=document.createElement("body");e.className="dark",t.appendChild(e);const i=getComputedStyle(n),a=getComputedStyle(e),c=["--primary","--on-primary","--primary-container","--on-primary-container","--secondary","--on-secondary","--secondary-container","--on-secondary-container","--tertiary","--on-tertiary","--tertiary-container","--on-tertiary-container","--error","--on-error","--error-container","--on-error-container","--background","--on-background","--surface","--on-surface","--surface-variant","--on-surface-variant","--outline","--outline-variant","--shadow","--scrim","--inverse-surface","--inverse-on-surface","--inverse-primary","--surface-dim","--surface-bright","--surface-container-lowest","--surface-container-low","--surface-container","--surface-container-high","--surface-container-highest"];for(let r=0,l=c.length;r<l;r++)d.light+=c[r]+":"+i.getPropertyValue(c[r])+";",d.dark+=c[r]+":"+a.getPropertyValue(c[r])+";";return t.removeChild(n),t.removeChild(e),d}function $t(t){const n=globalThis,e=document.body;if(!t||!n.materialDynamicColors)return Ot();const i=I();return t.light&&t.dark?(d.light=t.light,d.dark=t.dark,e.setAttribute("style",t[i]),t):n.materialDynamicColors(t).then(a=>{const c=r=>{let l="";for(let f=0,b=Object.keys(r),L=b.length;f<L;f++){const x=b[f],m=r[x],k=x.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g,"$1-$2").toLowerCase();l+="--"+k+":"+m+";"}return l};return d.light=c(a.light),d.dark=c(a.dark),e.setAttribute("style",d[i]),d})}function Q(t){const n=globalThis,e=document.body;if(!e)return t;if(!t)return I();t==="auto"&&(t=ut()?"dark":"light"),e.classList.remove("light","dark"),e.classList.add(t);const i=t==="light"?d.light:d.dark;return n.materialDynamicColors&&e.setAttribute("style",i),I()}const A=[];function J(t){if(t.key==="Escape"){const n=t.currentTarget;nt(n,n)}}function Nt(t){(h("[autofocus]",t)??t).focus()}function tt(t,n){p(pt(t.id),"active"),p(t,"active"),p(n,"active"),t.close(),A.pop();const e=A[A.length-1];e?e.focus():E()&&document.body.classList.remove("no-scroll")}async function Rt(t,n,e,i){!y(i,"button")&&!u(i,"button")&&!u(i,"chip")&&g(i,"active"),g(n,"active"),g(t,"active"),e?t.showModal():t.show(),await Z(90),e||o(t,"keydown",J,!1),A.push(t),E()&&document.body.classList.add("no-scroll"),Nt(t)}function _t(t){const n=t.currentTarget,e=O(n);y(e,"dialog")&&tt(e,n)}async function nt(t,n){$();let e=F(n);const i=u(n,"active")||n.open,a=u(n,"modal");a||P(n,"keydown",J,!1),u(e,"overlay")||(e=dt({class:"overlay"}),ft(e,n),await Z(90)),a||o(e,"click",_t,!1),i?tt(n,e):Rt(n,e,a,t)}let S;function et(t){P(document.body,"click",et);const n=t.target,e=s("menu.active");for(let i=0;i<e.length;i++)it(n,e[i],t)}function qt(t){setTimeout(()=>{const n=h(".field > input",t);n?n.focus():t.focus()},90)}function it(t,n,e){S&&clearTimeout(S),S=setTimeout(()=>{o(document.body,"click",et),y(document.activeElement,"input")||$();const i=u(n,"active"),a=(e==null?void 0:e.target)===t,c=!!t.closest("menu");if(!i&&c||i&&a){p(n,"active");return}p(s("menu.active"),"active"),g(n,"active"),qt(n)},90)}let w;function zt(t){const n=t.currentTarget;p(n,"active"),w&&clearTimeout(w)}function Bt(t,n){$();const e=s(".snackbar.active");for(let i=0;i<e.length;i++)p(e[i],"active");g(t,"active"),o(t,"click",zt),w&&clearTimeout(w),n!==-1&&(w=setTimeout(()=>{p(t,"active")},n??6e3))}function jt(t){const n=v(t);n&&p(s(":scope > .page",n),"active"),g(t,"active")}function Kt(t){Ut(t)}function Ut(t){const n=t.currentTarget,e=n.getBoundingClientRect(),i=Math.max(e.width,e.height),a=i/2,c=t.clientX-e.left-a,r=t.clientY-e.top-a,l=document.createElement("div");l.className="ripple-js";const f=document.createElement("div");f.style.inlineSize=f.style.blockSize=`${i}px`,f.style.left=`${c}px`,f.style.top=`${r}px`,f.addEventListener("animationend",()=>{l.remove()}),l.appendChild(f),n.appendChild(l)}function Vt(){const t=s(".slow-ripple, .ripple, .fast-ripple");for(let n=0;n<t.length;n++)o(t[n],"pointerdown",Kt)}let D,M;function H(){D&&clearTimeout(D),D=setTimeout(async()=>await rt(),180)}async function z(t,n,e,i){if(!(!n&&(n=h(t.getAttribute("data-ui")),!n))){if(gt(t),y(n,"dialog")){await nt(t,n);return}if(y(n,"menu")){it(t,n,i);return}if(u(n,"snackbar")){Bt(n,e);return}if(u(n,"page")){jt(n);return}if(u(n,"active")){p(t,"active"),p(n,"active");return}g(n,"active")}}function Ht(t){z(t.currentTarget,null,null,t)}function Zt(t){t.key==="Enter"&&z(t.currentTarget,null,null,t)}function ot(){M||(M=new MutationObserver(H),M.observe(document.body,{childList:!0,subtree:!0}),H())}function Wt(){const t=s("[data-ui]");for(let n=0,e=t.length;n<e;n++)o(t[n],"click",Ht),y(t[n],"a")&&!t[n].getAttribute("href")&&o(t[n],"keydown",Zt)}function rt(t,n){if(t){if(t==="setup"){ot();return}if(t==="guid")return lt();if(t==="mode")return Q(n);if(t==="theme")return $t(n);const e=h(t);if(!e)return;z(e,e,n)}Wt(),Mt(),Ft(),Vt()}function Xt(){var e;const t=globalThis,n=(e=t==null?void 0:t.document)==null?void 0:e.body;n&&!n.classList.contains("dark")&&!n.classList.contains("light")&&Q("auto"),o(t,"load",ot,!1),t.ui=rt}Xt();export{rt as default,rt as ui};
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "author": "Everton and Leonardo",
3
3
  "description": "Build material design interfaces in record time... without stress for devs.",
4
4
  "homepage": "https://www.beercss.com/",
5
- "version": "3.7.14",
5
+ "version": "3.8.0",
6
6
  "name": "beercss",
7
7
  "license": "MIT",
8
8
  "type": "module",
package/src/cdn/beer.css CHANGED
@@ -13,6 +13,7 @@
13
13
  @import "./helpers/opacities.css";
14
14
  @import "./helpers/paddings.css";
15
15
  @import "./helpers/positions.css";
16
+ @import "./helpers/ripples.css";
16
17
  @import "./helpers/scrolls.css";
17
18
  @import "./helpers/sizes.css";
18
19
  @import "./helpers/spaces.css";
package/src/cdn/beer.ts CHANGED
@@ -7,6 +7,7 @@ import {updateDialog} from "./elements/dialogs";
7
7
  import {updateMenu} from "./elements/menus";
8
8
  import {updateSnackbar} from "./elements/snackbars";
9
9
  import {updatePage} from "./elements/pages";
10
+ import {updateAllRipples} from "./helpers/ripples";
10
11
 
11
12
  let _timeoutMutation: ReturnType<typeof setTimeout>;
12
13
  let _mutation: MutationObserver | null;
@@ -91,6 +92,7 @@ function ui(selector?: string | Element, options?: string | number | IBeerCssThe
91
92
  updateAllDataUis();
92
93
  updateAllFields();
93
94
  updateAllSliders();
95
+ updateAllRipples();
94
96
  }
95
97
 
96
98
  function start() {
package/src/cdn/elements/dialogs.css CHANGED
@@ -1,8 +1,8 @@
1
1
  dialog {
2
2
  display: block;
3
+ visibility: hidden;
3
4
  border: none;
4
5
  opacity: 0;
5
- visibility: hidden;
6
6
  position: fixed;
7
7
  box-shadow: var(--elevate2);
8
8
  color: var(--on-surface);
@@ -41,8 +41,8 @@ dialog.large {
41
41
  }
42
42
 
43
43
  dialog:is(.active, [open]) {
44
- opacity: 1;
45
44
  visibility: visible;
45
+ opacity: 1;
46
46
  transform: translate(-50%, 0);
47
47
  }
48
48
 
package/src/cdn/elements/dialogs.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { addClass, next, prev, hasTag, insertBefore, wait, create, hasClass, removeClass, on, off, queryAllDataUi, isTouchable, blurActiveElement } from "../utils";
1
+ import { addClass, next, prev, hasTag, insertBefore, wait, create, hasClass, removeClass, on, off, queryAllDataUi, isTouchable, blurActiveElement, query } from "../utils";
2
2
 
3
3
  const _dialogs: Array<HTMLDialogElement> = [];
4
4
 
@@ -9,6 +9,11 @@ function onKeydownDialog(e: KeyboardEvent) {
9
9
  }
10
10
  }
11
11
 
12
+ function focusOnDialogOrElement(dialog: HTMLDialogElement) {
13
+ const element = (query("[autofocus]", dialog) ?? dialog) as HTMLElement;
14
+ element.focus();
15
+ }
16
+
12
17
  function closeDialog(dialog: HTMLDialogElement, overlay: Element) {
13
18
  removeClass(queryAllDataUi(dialog.id), "active");
14
19
  removeClass(dialog, "active");
@@ -33,11 +38,9 @@ async function openDialog(dialog: HTMLDialogElement, overlay: Element, isModal:
33
38
  await wait(90);
34
39
 
35
40
  if (!isModal) on(dialog, "keydown", onKeydownDialog, false);
36
-
37
41
  _dialogs.push(dialog);
38
- dialog.focus();
39
-
40
42
  if (isTouchable()) document.body.classList.add("no-scroll");
43
+ focusOnDialogOrElement(dialog);
41
44
  }
42
45
 
43
46
  function onClickOverlay(e: Event) {
package/src/cdn/elements/fields.ts CHANGED
@@ -46,6 +46,12 @@ function onInputTextarea(e: Event) {
46
46
  updateTextarea(textarea);
47
47
  }
48
48
 
49
+ function onPasswordIconClick(e: Event) {
50
+ const icon = e.currentTarget as HTMLElement;
51
+ const input = query("input", parent(icon)) as HTMLInputElement;
52
+ if (input && icon.textContent?.includes("visibility")) input.type = input.type === "password" ? "text" : "password";
53
+ }
54
+
49
55
  function updateAllLabels() {
50
56
  const labels = queryAll(".field > label");
51
57
  for (let i=0; i<labels.length; i++) on(labels[i], "click", onClickLabel);
@@ -94,6 +100,11 @@ function updateAllTextareas() {
94
100
  }
95
101
  }
96
102
 
103
+ function updateAllPasswordIcons() {
104
+ const icons = queryAll("input[type=password] ~ :is(i, a)");
105
+ for (let i=0; i<icons.length; i++) on(icons[i], "click", onPasswordIconClick);
106
+ }
107
+
97
108
  function updateInput(input: HTMLInputElement) {
98
109
  if (hasType(input, "number") && !input.value) input.value = "";
99
110
  updatePlaceholder(input);
@@ -143,4 +154,5 @@ export function updateAllFields() {
143
154
  updateAllFiles();
144
155
  updateAllColors();
145
156
  updateAllTextareas();
157
+ updateAllPasswordIcons();
146
158
  }
package/src/cdn/elements/menus.css CHANGED
@@ -38,7 +38,7 @@ menu.no-wrap {
38
38
  menu.active,
39
39
  menu:not([data-ui]):active,
40
40
  :not(menu, [data-ui]):focus-within > menu,
41
- menu > :is(a, li):hover + menu,
41
+ menu > :is(a, li, nav):hover + menu,
42
42
  menu > menu:hover {
43
43
  opacity: 1;
44
44
  visibility: visible;
@@ -49,22 +49,20 @@ menu * {
49
49
  white-space: inherit !important;
50
50
  }
51
51
 
52
- menu > a,
53
- menu > li > a {
52
+ menu > :is(a, nav, li > a, li > nav) {
54
53
  padding: 0.5rem 1rem;
55
54
  min-block-size: 3rem;
56
55
  flex: 1;
56
+ margin: 0 !important;
57
57
  }
58
58
 
59
- menu > a:not(.row),
60
- menu > li > a:not(.row) {
59
+ menu > :is(a, li > a):not(.row) {
61
60
  display: flex;
62
61
  flex-direction: column;
63
62
  align-items: flex-start;
64
63
  }
65
64
 
66
- menu > a:is(:hover, :focus, .active),
67
- menu > li > a:is(:hover, :focus, .active) {
65
+ menu > :is(a, nav, li > a, li > nav):is(:hover, :focus, .active) {
68
66
  background-color: var(--active);
69
67
  }
70
68
 
package/src/cdn/elements/navigations.css CHANGED
@@ -150,8 +150,7 @@ nav.drawer > header {
150
150
 
151
151
  nav.drawer > :is(a, label),
152
152
  nav.drawer > :is(ol, ul) > li > :is(a, label),
153
- a.row.wave,
154
- nav.row.wave {
153
+ :is(a.row, nav.row):is(.wave, .slow-ripple, .ripple, .fast-ripple) {
155
154
  padding: 0.75rem;
156
155
  font-size: inherit;
157
156
  }
package/src/cdn/elements/sliders.css CHANGED
@@ -133,7 +133,7 @@
133
133
  clip-path: polygon(0 0, calc(100% - 0.5rem) 0, calc(100% - 0.5rem) 100%, 0 100%);
134
134
  }
135
135
 
136
- .slider > input + input ~ span {
136
+ .slider > input[type=range] + input[type=range] ~ span {
137
137
  border-radius: 0;
138
138
  clip-path: polygon(0.5rem 0, max(0.5rem, calc(100% - 0.5rem)) 0, max(0.5rem, calc(100% - 0.5rem)) 100%, 0.5rem 100%);
139
139
  }
package/src/cdn/helpers/ripples.css ADDED
@@ -0,0 +1,34 @@
1
+ .ripple {
2
+ ---duration: 600ms;
3
+ }
4
+
5
+ .fast-ripple {
6
+ ---duration: 200ms;
7
+ }
8
+
9
+ .slow-ripple {
10
+ ---duration: 1800ms;
11
+ }
12
+
13
+ .ripple-js {
14
+ position: absolute;
15
+ inset: 0;
16
+ pointer-events: none;
17
+ overflow: hidden;
18
+ }
19
+
20
+ .ripple-js > div {
21
+ position: absolute;
22
+ border-radius: 50%;
23
+ background: currentColor;
24
+ opacity: 0.3;
25
+ transform: scale(0);
26
+ animation: to-ripple var(---duration) linear;
27
+ }
28
+
29
+ @keyframes to-ripple {
30
+ to {
31
+ transform: scale(4);
32
+ opacity: 0;
33
+ }
34
+ }
package/src/cdn/helpers/ripples.ts ADDED
@@ -0,0 +1,31 @@
1
+ import { queryAll, on } from "../utils";
2
+
3
+ function onPointerDownRipple(e: PointerEvent) {
4
+ updateRipple(e);
5
+ }
6
+
7
+ function updateRipple(e: PointerEvent) {
8
+ const element = e.currentTarget as HTMLElement;
9
+ const rect = element.getBoundingClientRect();
10
+ const diameter = Math.max(rect.width, rect.height);
11
+ const radius = diameter / 2;
12
+ const x = e.clientX - rect.left - radius;
13
+ const y = e.clientY - rect.top - radius;
14
+
15
+ const rippleContainer = document.createElement("div");
16
+ rippleContainer.className = "ripple-js";
17
+
18
+ const ripple = document.createElement("div");
19
+ ripple.style.inlineSize = ripple.style.blockSize = `${diameter}px`;
20
+ ripple.style.left = `${x}px`;
21
+ ripple.style.top = `${y}px`;
22
+ ripple.addEventListener("animationend", () => { rippleContainer.remove(); });
23
+
24
+ rippleContainer.appendChild(ripple);
25
+ element.appendChild(rippleContainer);
26
+ }
27
+
28
+ export function updateAllRipples() {
29
+ const ripples = queryAll(".slow-ripple, .ripple, .fast-ripple");
30
+ for(let i=0; i<ripples.length; i++) on(ripples[i], "pointerdown", onPointerDownRipple);
31
+ }
package/src/cdn/helpers/waves.css CHANGED
@@ -1,7 +1,4 @@
1
- .wave::after,
2
- .chip::after,
3
- :is(.button, button)::after,
4
- :is(nav.tabbed, .tabs) > a::after {
1
+ :is(.wave, .chip, .button, button, nav.tabbed > a, .tabs > a):not(.slow-ripple, .ripple, .fast-ripple)::after {
5
2
  content: "";
6
3
  position: absolute;
7
4
  inset: 0;
@@ -15,13 +12,13 @@
15
12
  transition: none;
16
13
  }
17
14
 
18
- :is(.wave, .chip, .button, button, nav.tabbed > a, .tabs > a):is(:focus-visible, :hover)::after {
15
+ :is(.wave, .chip, .button, button, nav.tabbed > a, .tabs > a):not(.slow-ripple, .ripple, .fast-ripple):is(:focus-visible, :hover)::after {
19
16
  background-size: 15000%;
20
17
  opacity: 0.1;
21
18
  transition: background-size var(--speed2) linear;
22
19
  }
23
20
 
24
- :is(.wave, .chip, .button, button, nav.tabbed > a, .tabs > a):active::after {
21
+ :is(.wave, .chip, .button, button, nav.tabbed > a, .tabs > a):not(.slow-ripple, .ripple, .fast-ripple):active::after {
25
22
  background-size: 5000%;
26
23
  opacity: 0;
27
24
  transition: none;
package/src/cdn/settings/fonts.css CHANGED
@@ -6,7 +6,7 @@
6
6
  font-display: block;
7
7
  src:
8
8
  url("../material-symbols-outlined.woff2") format("woff2"),
9
- url("https://cdn.jsdelivr.net/npm/beercss@3.7.14/dist/cdn/material-symbols-outlined.woff2") format("woff2");
9
+ url("https://cdn.jsdelivr.net/npm/beercss@3.8.0/dist/cdn/material-symbols-outlined.woff2") format("woff2");
10
10
  }
11
11
 
12
12
  /* rounded icons */
@@ -17,7 +17,7 @@
17
17
  font-display: block;
18
18
  src:
19
19
  url("../material-symbols-rounded.woff2") format("woff2"),
20
- url("https://cdn.jsdelivr.net/npm/beercss@3.7.14/dist/cdn/material-symbols-rounded.woff2") format("woff2");
20
+ url("https://cdn.jsdelivr.net/npm/beercss@3.8.0/dist/cdn/material-symbols-rounded.woff2") format("woff2");
21
21
  }
22
22
 
23
23
  /* sharp icons */
@@ -28,5 +28,5 @@
28
28
  font-display: block;
29
29
  src:
30
30
  url("../material-symbols-sharp.woff2") format("woff2"),
31
- url("https://cdn.jsdelivr.net/npm/beercss@3.7.14/dist/cdn/material-symbols-sharp.woff2") format("woff2");
31
+ url("https://cdn.jsdelivr.net/npm/beercss@3.8.0/dist/cdn/material-symbols-sharp.woff2") format("woff2");
32
32
  }