mtrl 0.9.5 → 0.9.8

package/dist/core/compose/features/icon.js

@@ -1,3 +1,4 @@
+import { setHTML } from "../../dom/html.js";
 const createIcon = (element, config = {}) => {
     let iconElement = null;
     const PREFIX = config.prefix || "mtrl";
@@ -12,7 +13,7 @@ const createIcon = (element, config = {}) => {
         if (config.iconSize) {
             iconEl.classList.add(`${PREFIX}-icon--${config.iconSize}`);
         }
-        iconEl.innerHTML = html;
+        setHTML(iconEl, html);
         return iconEl;
     };
     return {
@@ -38,7 +39,7 @@ const createIcon = (element, config = {}) => {
                 }
             }
             else if (iconElement && html) {
-                iconElement.innerHTML = html;
+                setHTML(iconElement, html);
             }
             return this;
         },

package/dist/core/compose/features/input.js

@@ -17,7 +17,7 @@ export const withInput = (config = {}) => (component) => {
         required: config.required,
         disabled: config.disabled,
         value: config.value || "on",
-        "aria-label": config.label || config.ariaLabel,
+        "aria-label": config.ariaLabel || config.label,
     };
     Object.entries(attributes).forEach(([key, value]) => {
         if (value !== null && value !== undefined) {

package/dist/core/compose/features/lifecycle.js

@@ -28,6 +28,13 @@ export const withLifecycle = () => (component) => {
     const destroyElement = component.destroy?.bind(component);
     const emitter = createEmitter();
     resources.add(() => emitter.clear());
+    const unmount = () => {
+        if (mounted) {
+            mounted = false;
+            emitter.emit('unmount');
+            emitter.clear();
+        }
+    };
     const lifecycle = {
         onMount: (handler) => emitter.on('mount', handler),
         onUnmount: (handler) => emitter.on('unmount', handler),
@@ -37,21 +44,13 @@ export const withLifecycle = () => (component) => {
                 emitter.emit('mount');
             }
         },
-        unmount: () => {
-            if (mounted) {
-                mounted = false;
-                emitter.emit('unmount');
-                emitter.clear();
-            }
-        },
+        unmount,
         isMounted: () => mounted,
-        destroy() {
+        destroy: () => {
             if (destroyed)
                 return;
             destroyed = true;
-            if (mounted) {
-                this.unmount();
-            }
+            unmount();
             emitter.clear();
             resources.destroy();
             if (hasEvents(component)) {

package/dist/core/compose/features/textlabel.js

@@ -10,6 +10,9 @@ export const withTextLabel = (config = {}) => (component) => {
         if (!input.id)
             input.id = `${config.prefix}-${config.componentName}-${Math.random().toString(36).slice(2, 9)}`;
         labelElement.htmlFor = input.id;
+        if (input.getAttribute("aria-label") === config.label) {
+            input.removeAttribute("aria-label");
+        }
     }
     if (position === "start") {
         if (component.element.firstChild) {

package/dist/core/compose/features/track.js

@@ -1,3 +1,4 @@
+import { setHTML } from "../../dom/html.js";
 const DEFAULT_ICON = `
 <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
   <polyline points="20 6 9 17 4 12"></polyline>
@@ -11,7 +12,7 @@ export const withTrack = (config) => (component) => {
     if (config.icon !== 'none') {
         const icon = document.createElement('span');
         icon.className = `${config.prefix}-${config.componentName}-thumb-icon`;
-        icon.innerHTML = config.icon || DEFAULT_ICON;
+        setHTML(icon, config.icon || DEFAULT_ICON);
         thumb.appendChild(icon);
     }
     component.element.appendChild(track);

package/dist/core/config/component.d.ts

@@ -86,7 +86,7 @@ export declare const processClassNames: (classNames: string | string[] | null) =
 export declare const createElementConfig: (config: BaseComponentConfig, options: {
     tag: string;
     attributes?: Record<string, unknown>;
-    className?: string | string[] | null;
+    className?: string | (string | null | undefined)[] | null;
     html?: string;
     text?: string;
     forwardEvents?: Record<string, EventCondition>;

package/dist/core/config/component.js

@@ -44,7 +44,7 @@ export const createElementConfig = (config, options) => {
     const combinedClassNames = [
         ...(Array.isArray(configClasses) ? configClasses : [configClasses]),
         ...(Array.isArray(optionsClasses) ? optionsClasses : [optionsClasses]),
-    ].filter(Boolean);
+    ].filter((name) => Boolean(name));
     const elementAttributes = options.attributes || {};
     return {
         tag: options.tag,

package/dist/core/dom/create.js

@@ -1,6 +1,7 @@
 import { setAttributes } from "./attributes.js";
 import { addClass } from "./classes.js";
 import { safeUrl, URL_ATTRIBUTES } from "../utils/url.js";
+import { setHTML } from "./html.js";
 const EVENT_HANDLER_ATTRIBUTE = /^on[a-z]/i;
 const NAMEABLE_TAGS = new Set([
     "button", "fieldset", "form", "iframe", "img", "input",
@@ -73,7 +74,7 @@ class ElementPool {
         if (pool?.length) {
             const element = pool.pop();
             element.className = "";
-            element.innerHTML = "";
+            element.replaceChildren();
             element.removeAttribute("id");
             Object.keys(element.dataset).forEach((key) => delete element.dataset[key]);
             return element;
@@ -101,7 +102,7 @@ class ElementPool {
             delete element.__eventHandlers;
         }
         element.className = "";
-        element.innerHTML = "";
+        element.replaceChildren();
         element.removeAttribute("id");
         Object.keys(element.dataset).forEach((key) => delete element.dataset[key]);
         element.parentNode?.removeChild(element);
@@ -118,7 +119,7 @@ export const createElement = (options = {}) => {
     }
     const element = document.createElement(options.tag || "div");
     if (options.html)
-        element.innerHTML = options.html;
+        setHTML(element, options.html);
     else if (options.text)
         element.textContent = options.text;
     if (options.id)
@@ -184,7 +185,7 @@ export const createElement = (options = {}) => {
 export const createElementPooled = (options = {}) => {
     const element = getElementPool().acquire(options.tag || "div");
     if (options.html)
-        element.innerHTML = options.html;
+        setHTML(element, options.html);
     else if (options.text)
         element.textContent = options.text;
     if (options.id)

package/dist/core/dom/form-value.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Sets the value a hidden field submits, and does nothing when there is no
+ * field — the common case, since one exists only for a named component.
+ *
+ * Only the attribute is written. `type="hidden"` has the "default" value mode,
+ * so the `value` property reflects the content attribute with no dirty flag:
+ * the attribute is what the form submits, and `form.reset()` cannot leave the
+ * field carrying something the component is no longer showing.
+ */
+export declare const setFormValue: (input: HTMLInputElement | null, value: string) => void;
+/**
+ * Creates a hidden input that carries a component's value into a surrounding
+ * form.
+ *
+ * Components that render no form control of their own — a slider, a time
+ * picker — submit nothing however they are named, because a `name` on their
+ * root element is not a form field. This puts a real one inside them, and
+ * creates nothing at all without a name, so a component used outside a form
+ * is exactly as it was.
+ *
+ * Callers set `disabled` on the returned input directly: a disabled field
+ * submits nothing, which is what a disabled component means.
+ */
+export declare const createFormValue: (container: HTMLElement, name: string | undefined, value: string, disabled?: boolean) => HTMLInputElement | null;

package/dist/core/dom/form-value.js

@@ -0,0 +1,14 @@
+export const setFormValue = (input, value) => {
+    input?.setAttribute("value", value);
+};
+export const createFormValue = (container, name, value, disabled = false) => {
+    if (!name)
+        return null;
+    const input = document.createElement("input");
+    input.type = "hidden";
+    input.name = name;
+    input.disabled = disabled;
+    setFormValue(input, value);
+    container.appendChild(input);
+    return input;
+};

package/dist/core/dom/html.d.ts

@@ -0,0 +1,34 @@
+/** A value the browser's Trusted Types API accepts for innerHTML. */
+export interface TrustedHTMLLike {
+    toString(): string;
+}
+/** Markup a component accepts: a string, or a TrustedHTML from a policy. */
+export type HTMLInput = string | TrustedHTMLLike;
+export interface HTMLPolicy {
+    /**
+     * Called with every markup string before it is written. Return the markup
+     * to write: a sanitized string, or a TrustedHTML from a Trusted Types
+     * policy. Values that are already TrustedHTML are not passed through it.
+     */
+    sanitize: (html: string) => HTMLInput;
+}
+/**
+ * Sets the policy every component's markup goes through, or clears it with
+ * null.
+ *
+ * @example
+ * // DOMPurify
+ * configureHTML({ sanitize: (html) => DOMPurify.sanitize(html) });
+ *
+ * // Trusted Types: a policy the page's CSP allows
+ * const trusted = window.trustedTypes.createPolicy('mtrl', { createHTML: (html) => DOMPurify.sanitize(html) });
+ * configureHTML({ sanitize: (html) => trusted.createHTML(html) });
+ */
+export declare const configureHTML: (next: HTMLPolicy | null) => void;
+/** The policy in force, if any. */
+export declare const getHTMLPolicy: () => HTMLPolicy | null;
+/**
+ * Writes markup into an element, through the policy when one is set.
+ * An empty string empties the element without touching innerHTML.
+ */
+export declare const setHTML: (element: Element, html: HTMLInput | null | undefined) => void;

package/dist/core/dom/html.js

@@ -0,0 +1,13 @@
+let policy = null;
+export const configureHTML = (next) => {
+    policy = next;
+};
+export const getHTMLPolicy = () => policy;
+export const setHTML = (element, html) => {
+    if (html === null || html === undefined || html === "") {
+        element.replaceChildren();
+        return;
+    }
+    const markup = typeof html === "string" && policy ? policy.sanitize(html) : html;
+    element.innerHTML = markup;
+};

package/dist/core/dom/index.d.ts

@@ -4,3 +4,5 @@ export { setAttributes, removeAttributes, batchAttributes, hasAttribute, getAttr
 export { addClass, removeClass, toggleClass, hasClass, normalizeClasses, } from "./classes.js";
 export { createEventManager } from "./events.js";
 export type { EventManager } from "./events.js";
+export { setHTML, configureHTML, getHTMLPolicy } from "./html.js";
+export type { HTMLPolicy, HTMLInput, TrustedHTMLLike } from "./html.js";

package/dist/core/dom/index.js

@@ -2,3 +2,4 @@ export { createElement, createSVGElement } from "./create.js";
 export { setAttributes, removeAttributes, batchAttributes, hasAttribute, getAttribute, } from "./attributes.js";
 export { addClass, removeClass, toggleClass, hasClass, normalizeClasses, } from "./classes.js";
 export { createEventManager } from "./events.js";
+export { setHTML, configureHTML, getHTMLPolicy } from "./html.js";

package/dist/core/dom/utils.js

@@ -9,7 +9,7 @@ export const createElement = (tag, attributes = {}) => {
         else if (key === "style" && typeof value === "object") {
             Object.assign(element.style, value);
         }
-        else if (key === "data" && typeof value === "object") {
+        else if (key === "data" && value && typeof value === "object") {
             Object.entries(value).forEach(([dataKey, dataValue]) => {
                 element.dataset[dataKey] = String(dataValue);
             });

package/dist/core/state/emitter.js

@@ -15,7 +15,14 @@ export const createEmitter = () => {
         },
         emit: (event, ...args) => {
             const callbacks = events.get(event) || [];
-            callbacks.forEach(cb => cb(...args));
+            callbacks.forEach(cb => {
+                try {
+                    cb(...args);
+                }
+                catch (error) {
+                    console.error(`A listener for "${event}" threw:`, error);
+                }
+            });
         },
         clear: () => {
             events.clear();

package/dist/core/state/index.d.ts

@@ -1,7 +1,7 @@
 export { createEmitter } from "./emitter.js";
 export type { Emitter, EventCallback } from "./emitter.js";
 export { createStore, loggingMiddleware, deriveFiltered } from "./store.js";
-export type { Store, StoreOptions, Selector, Computation, Updater } from "./store.js";
+export type { Store, StoreOptions, Selector, Computation, Updater, DerivedState } from "./store.js";
 export { createLifecycle } from "./lifecycle.js";
 export type { LifecycleManager, LifecycleManagers } from "./lifecycle.js";
 export { createDisabled } from "./disabled.js";

package/dist/core/state/store.d.ts

@@ -19,6 +19,14 @@ export type Computation<T, R> = (state: T) => R;
  * State updater function type
  */
 export type Updater<T> = (state: T) => T;
+/**
+ * What derive() returns: call it to remove the derived value, or read the
+ * value, typed, through get(). getState() carries derived values at runtime
+ * but its type is the base state, so this is the typed way to read one.
+ */
+export type DerivedState<R> = (() => void) & {
+    get: () => R;
+};
 /**
  * State store interface
  */
@@ -27,7 +35,7 @@ export interface Store<T> {
      * Gets current state including derived values
      * @returns Current state
      */
-    getState: () => T;
+    getState: <D extends object = Record<never, never>>() => T & D;
     /**
      * Updates state
      * @param update - State update object or updater function
@@ -45,7 +53,7 @@ export interface Store<T> {
      * @param computation - Function to compute derived value
      * @returns Function to remove derived state
      */
-    derive: <K extends string, R>(key: K, computation: Computation<T, R>) => () => void;
+    derive: <K extends string, R>(key: K, computation: Computation<T, R>) => DerivedState<R>;
     /**
      * Selects a specific slice of state
      * @param selector - State selector function

package/dist/core/state/store.js

@@ -29,9 +29,10 @@ export const createStore = (initialState = {}, options = {}) => {
         subscribe: (listener) => emitter.on('change', listener),
         derive: (key, computation) => {
             derivedStates.set(key, computation);
-            return () => {
+            const remove = () => {
                 derivedStates.delete(key);
             };
+            return Object.assign(remove, { get: () => computation(state) });
         },
         select: (selector) => selector(state),
         reset: () => {

package/dist/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mtrl",
-  "version": "0.9.5",
+  "version": "0.9.8",
   "description": "A functional TypeScript/JavaScript component library with composable architecture based on Material Design 3",
   "author": "floor",
   "license": "MIT",
@@ -34,7 +34,10 @@
       "import": "./index.js",
       "require": "./index.cjs"
     },
-    "./styles": "./styles.css",
+    "./styles": {
+      "types": "./styles.d.ts",
+      "default": "./styles.css"
+    },
     "./components/*/constants": {
       "types": "./components/*/constants.d.ts",
       "import": "./components/*/constants.js"

package/dist/styles/badge.css

@@ -1,2 +1,2 @@
-/*! mtrl v0.9.5 | MIT */
+/*! mtrl v0.9.8 | MIT */
 @layer mtrl.base,mtrl.utilities,mtrl.textfield,mtrl.badge,mtrl.bottom-app-bar,mtrl.bottom-sheet,mtrl.side-sheet,mtrl.menu,mtrl.slider,mtrl.switch,mtrl.select,mtrl.progress,mtrl.button,mtrl.tabs,mtrl.top-app-bar,mtrl.icon-button,mtrl.button-group,mtrl.fab,mtrl.extended-fab,mtrl.segmented-button,mtrl.card,mtrl.carousel,mtrl.checkbox,mtrl.chips,mtrl.divider,mtrl.dialog,mtrl.drawer,mtrl.loading-indicator,mtrl.split-button,mtrl.radios,mtrl.timepicker,mtrl.search,mtrl.snackbar,mtrl.navigation-rail,mtrl.navigation,mtrl.list,mtrl.tooltip;@layer mtrl.badge{.mtrl-badge-wrapper{position:relative;display:inline-flex;flex-shrink:0}.mtrl-badge{position:absolute;display:flex;align-items:center;justify-content:center;font-weight:500;box-sizing:border-box;overflow:hidden;transition:all 200ms ease;text-overflow:ellipsis}.mtrl-badge--invisible{display:none}.mtrl-badge--small{width:6px;height:6px;min-width:6px;border-radius:3px;font-size:0;padding:0}.mtrl-badge--large{height:16px;min-width:16px;border-radius:8px;padding:0 4px;font-size:11px;line-height:16px;padding-top:.5px}.mtrl-badge--large.mtrl-badge--overflow{min-width:auto;max-width:34px;padding:0 4px}.mtrl-badge--positioned.mtrl-badge--small.mtrl-badge--top-right{top:-3px;right:-3px}.mtrl-badge--positioned.mtrl-badge--small.mtrl-badge--top-left{top:-3px;left:-3px}.mtrl-badge--positioned.mtrl-badge--small.mtrl-badge--bottom-right{bottom:-3px;right:-3px}.mtrl-badge--positioned.mtrl-badge--small.mtrl-badge--bottom-left{bottom:-3px;left:-3px}.mtrl-badge--positioned.mtrl-badge--large.mtrl-badge--top-right{top:-8px;right:-8px}.mtrl-badge--positioned.mtrl-badge--large.mtrl-badge--top-left{top:-8px;left:-8px}.mtrl-badge--positioned.mtrl-badge--large.mtrl-badge--bottom-right{bottom:-8px;right:-8px}.mtrl-badge--positioned.mtrl-badge--large.mtrl-badge--bottom-left{bottom:-8px;left:-8px}.mtrl-badge--error{background-color:var(--mtrl-sys-color-error);color:var(--mtrl-sys-color-on-error)}.mtrl-badge--primary{background-color:var(--mtrl-sys-color-primary);color:var(--mtrl-sys-color-on-primary)}.mtrl-badge--secondary{background-color:var(--mtrl-sys-color-secondary);color:var(--mtrl-sys-color-on-secondary)}.mtrl-badge--tertiary{background-color:var(--mtrl-sys-color-tertiary);color:var(--mtrl-sys-color-on-tertiary)}.mtrl-badge--success{background-color:var(--mtrl-sys-color-success);color:var(--mtrl-sys-color-on-success)}.mtrl-badge--warning{background-color:var(--mtrl-sys-color-warning);color:var(--mtrl-sys-color-on-warning)}.mtrl-badge--info{background-color:var(--mtrl-sys-color-info);color:var(--mtrl-sys-color-on-info)}[dir=rtl] .mtrl-badge--positioned.mtrl-badge--top-right{right:auto;left:-8px}[dir=rtl] .mtrl-badge--positioned.mtrl-badge--top-left{left:auto;right:-8px}[dir=rtl] .mtrl-badge--positioned.mtrl-badge--bottom-right{right:auto;left:-8px}[dir=rtl] .mtrl-badge--positioned.mtrl-badge--bottom-left{left:auto;right:-8px}}

package/dist/styles/base.css

@@ -1,2 +1,2 @@
-/*! mtrl v0.9.5 | MIT */
-@layer mtrl.base,mtrl.utilities,mtrl.textfield,mtrl.badge,mtrl.bottom-app-bar,mtrl.bottom-sheet,mtrl.side-sheet,mtrl.menu,mtrl.slider,mtrl.switch,mtrl.select,mtrl.progress,mtrl.button,mtrl.tabs,mtrl.top-app-bar,mtrl.icon-button,mtrl.button-group,mtrl.fab,mtrl.extended-fab,mtrl.segmented-button,mtrl.card,mtrl.carousel,mtrl.checkbox,mtrl.chips,mtrl.divider,mtrl.dialog,mtrl.drawer,mtrl.loading-indicator,mtrl.split-button,mtrl.radios,mtrl.timepicker,mtrl.search,mtrl.snackbar,mtrl.navigation-rail,mtrl.navigation,mtrl.list,mtrl.tooltip;@layer mtrl.base{:root{--mtrl-sys-color-error: #B3261E;--mtrl-sys-color-error-rgb: 179, 38, 30;--mtrl-sys-color-on-error: #FFFFFF;--mtrl-sys-color-on-error-rgb: 255, 255, 255;--mtrl-sys-color-primary: #6750a4;--mtrl-sys-color-primary-rgb: 103, 80, 164;--mtrl-sys-color-on-primary: #ffffff;--mtrl-sys-color-on-primary-rgb: 255, 255, 255;--mtrl-sys-color-primary-container: #eaddff;--mtrl-sys-color-primary-container-rgb: 234, 221, 255;--mtrl-sys-color-on-primary-container: #21005d;--mtrl-sys-color-on-primary-container-rgb: 33, 0, 93;--mtrl-sys-color-secondary: #625b71;--mtrl-sys-color-secondary-rgb: 98, 91, 113;--mtrl-sys-color-on-secondary: #ffffff;--mtrl-sys-color-on-secondary-rgb: 255, 255, 255;--mtrl-sys-color-secondary-container: #e8def8;--mtrl-sys-color-secondary-container-rgb: 232, 222, 248;--mtrl-sys-color-on-secondary-container: #1d192b;--mtrl-sys-color-on-secondary-container-rgb: 29, 25, 43;--mtrl-sys-color-tertiary: #7d5260;--mtrl-sys-color-tertiary-rgb: 125, 82, 96;--mtrl-sys-color-on-tertiary: #ffffff;--mtrl-sys-color-on-tertiary-rgb: 255, 255, 255;--mtrl-sys-color-tertiary-container: #ffd8e4;--mtrl-sys-color-tertiary-container-rgb: 255, 216, 228;--mtrl-sys-color-on-tertiary-container: #31111d;--mtrl-sys-color-on-tertiary-container-rgb: 49, 17, 29;--mtrl-sys-color-surface: #fffbfe;--mtrl-sys-color-surface-rgb: 28, 27, 31;--mtrl-sys-color-surface-dim: #ded8e1;--mtrl-sys-color-surface-dim-rgb: 222, 216, 225;--mtrl-sys-color-surface-bright: #fff8f7;--mtrl-sys-color-surface-bright-rgb: 255, 248, 247;--mtrl-sys-color-surface-container-lowest: #ffffff;--mtrl-sys-color-surface-container-lowest-rgb: 255, 255, 255;--mtrl-sys-color-surface-container-low: #f7f2fa;--mtrl-sys-color-surface-container-low-rgb: 247, 242, 250;--mtrl-sys-color-surface-container: #f3edf7;--mtrl-sys-color-surface-container-rgb: 243, 237, 247;--mtrl-sys-color-surface-container-high: #ece6f0;--mtrl-sys-color-surface-container-high-rgb: 236, 230, 240;--mtrl-sys-color-surface-container-highest: #e6e0e9;--mtrl-sys-color-surface-container-highest-rgb: 230, 224, 233;--mtrl-sys-color-on-surface: #1c1b1f;--mtrl-sys-color-on-surface-rgb: 28, 27, 31;--mtrl-sys-color-on-surface-variant: #49454f;--mtrl-sys-color-on-surface-variant-rgb: 73, 69, 79;--mtrl-sys-color-outline: #79747e;--mtrl-sys-color-outline-rgb: 121, 116, 126;--mtrl-sys-color-outline-variant: #cac4d0;--mtrl-sys-color-outline-variant-rgb: 202, 196, 208;--mtrl-sys-color-shadow: #000000;--mtrl-sys-color-shadow-rgb: 0, 0, 0;--mtrl-sys-color-scrim: #000000;--mtrl-sys-color-scrim-rgb: 0, 0, 0;--mtrl-sys-color-inverse-surface: #313033;--mtrl-sys-color-inverse-surface-rgb: 49, 48, 51;--mtrl-sys-color-inverse-on-surface: #f4eff4;--mtrl-sys-color-inverse-on-surface-rgb: 244, 239, 244;--mtrl-sys-color-inverse-primary: #d0bcff;--mtrl-sys-color-inverse-primary-rgb: 208, 188, 255;--mtrl-sys-state-hover-state-layer-opacity: 0.08;--mtrl-sys-state-focus-state-layer-opacity: 0.12;--mtrl-sys-state-pressed-state-layer-opacity: 0.12;--mtrl-sys-state-dragged-state-layer-opacity: 0.16}@media(prefers-color-scheme: dark){:root{--mtrl-sys-color-error: #F2B8B5;--mtrl-sys-color-error-rgb: 242, 184, 181;--mtrl-sys-color-on-error: #601410;--mtrl-sys-color-on-error-rgb: 96, 20, 16;--mtrl-sys-color-primary: #d0bcff;--mtrl-sys-color-primary-rgb: 208, 188, 255;--mtrl-sys-color-on-primary: #381e72;--mtrl-sys-color-on-primary-rgb: 56, 30, 114;--mtrl-sys-color-primary-container: #4f378b;--mtrl-sys-color-primary-container-rgb: 79, 55, 139;--mtrl-sys-color-on-primary-container: #eaddff;--mtrl-sys-color-on-primary-container-rgb: 234, 221, 255;--mtrl-sys-color-secondary: #ccc2dc;--mtrl-sys-color-secondary-rgb: 204, 194, 220;--mtrl-sys-color-on-secondary: #332d41;--mtrl-sys-color-on-secondary-rgb: 51, 45, 65;--mtrl-sys-color-secondary-container: #4a4458;--mtrl-sys-color-secondary-container-rgb: 74, 68, 88;--mtrl-sys-color-on-secondary-container: #e8def8;--mtrl-sys-color-on-secondary-container-rgb: 232, 222, 248;--mtrl-sys-color-tertiary: #efb8c8;--mtrl-sys-color-tertiary-rgb: 239, 184, 200;--mtrl-sys-color-on-tertiary: #492532;--mtrl-sys-color-on-tertiary-rgb: 73, 37, 50;--mtrl-sys-color-tertiary-container: #633b48;--mtrl-sys-color-tertiary-container-rgb: 99, 59, 72;--mtrl-sys-color-on-tertiary-container: #ffd8e4;--mtrl-sys-color-on-tertiary-container-rgb: 255, 216, 228;--mtrl-sys-color-surface: #1c1b1f;--mtrl-sys-color-surface-rgb: 28, 27, 31;--mtrl-sys-color-surface-dim: #141218;--mtrl-sys-color-surface-dim-rgb: 20, 18, 24;--mtrl-sys-color-surface-bright: #3b383d;--mtrl-sys-color-surface-bright-rgb: 59, 56, 61;--mtrl-sys-color-surface-container-lowest: #0f0d13;--mtrl-sys-color-surface-container-lowest-rgb: 15, 13, 19;--mtrl-sys-color-surface-container-low: #1d1b20;--mtrl-sys-color-surface-container-low-rgb: 29, 27, 32;--mtrl-sys-color-surface-container: #211f26;--mtrl-sys-color-surface-container-rgb: 33, 31, 38;--mtrl-sys-color-surface-container-high: #2b2930;--mtrl-sys-color-surface-container-high-rgb: 43, 41, 48;--mtrl-sys-color-surface-container-highest: #36343b;--mtrl-sys-color-surface-container-highest-rgb: 54, 52, 59;--mtrl-sys-color-on-surface: #e6e1e5;--mtrl-sys-color-on-surface-rgb: 230, 225, 229;--mtrl-sys-color-on-surface-variant: #cac4d0;--mtrl-sys-color-on-surface-variant-rgb: 202, 196, 208;--mtrl-sys-color-outline: #938f99;--mtrl-sys-color-outline-rgb: 147, 143, 153;--mtrl-sys-color-outline-variant: #444746;--mtrl-sys-color-outline-variant-rgb: 68, 71, 70;--mtrl-sys-color-shadow: #000000;--mtrl-sys-color-shadow-rgb: 0, 0, 0;--mtrl-sys-color-scrim: #000000;--mtrl-sys-color-scrim-rgb: 0, 0, 0;--mtrl-sys-color-inverse-surface: #e6e1e5;--mtrl-sys-color-inverse-surface-rgb: 230, 225, 229;--mtrl-sys-color-inverse-on-surface: #313033;--mtrl-sys-color-inverse-on-surface-rgb: 49, 48, 51;--mtrl-sys-color-inverse-primary: #6750a4;--mtrl-sys-color-inverse-primary-rgb: 103, 80, 164}}.dark-theme{--mtrl-sys-color-error: #F2B8B5;--mtrl-sys-color-error-rgb: 242, 184, 181;--mtrl-sys-color-on-error: #601410;--mtrl-sys-color-on-error-rgb: 96, 20, 16;--mtrl-sys-color-primary: #d0bcff;--mtrl-sys-color-primary-rgb: 208, 188, 255;--mtrl-sys-color-on-primary: #381e72;--mtrl-sys-color-on-primary-rgb: 56, 30, 114;--mtrl-sys-color-primary-container: #4f378b;--mtrl-sys-color-primary-container-rgb: 79, 55, 139;--mtrl-sys-color-on-primary-container: #eaddff;--mtrl-sys-color-on-primary-container-rgb: 234, 221, 255;--mtrl-sys-color-secondary: #ccc2dc;--mtrl-sys-color-secondary-rgb: 204, 194, 220;--mtrl-sys-color-on-secondary: #332d41;--mtrl-sys-color-on-secondary-rgb: 51, 45, 65;--mtrl-sys-color-secondary-container: #4a4458;--mtrl-sys-color-secondary-container-rgb: 74, 68, 88;--mtrl-sys-color-on-secondary-container: #e8def8;--mtrl-sys-color-on-secondary-container-rgb: 232, 222, 248;--mtrl-sys-color-tertiary: #efb8c8;--mtrl-sys-color-tertiary-rgb: 239, 184, 200;--mtrl-sys-color-on-tertiary: #492532;--mtrl-sys-color-on-tertiary-rgb: 73, 37, 50;--mtrl-sys-color-tertiary-container: #633b48;--mtrl-sys-color-tertiary-container-rgb: 99, 59, 72;--mtrl-sys-color-on-tertiary-container: #ffd8e4;--mtrl-sys-color-on-tertiary-container-rgb: 255, 216, 228;--mtrl-sys-color-surface: #1c1b1f;--mtrl-sys-color-surface-rgb: 28, 27, 31;--mtrl-sys-color-surface-dim: #141218;--mtrl-sys-color-surface-dim-rgb: 20, 18, 24;--mtrl-sys-color-surface-bright: #3b383d;--mtrl-sys-color-surface-bright-rgb: 59, 56, 61;--mtrl-sys-color-surface-container-lowest: #0f0d13;--mtrl-sys-color-surface-container-lowest-rgb: 15, 13, 19;--mtrl-sys-color-surface-container-low: #1d1b20;--mtrl-sys-color-surface-container-low-rgb: 29, 27, 32;--mtrl-sys-color-surface-container: #211f26;--mtrl-sys-color-surface-container-rgb: 33, 31, 38;--mtrl-sys-color-surface-container-high: #2b2930;--mtrl-sys-color-surface-container-high-rgb: 43, 41, 48;--mtrl-sys-color-surface-container-highest: #36343b;--mtrl-sys-color-surface-container-highest-rgb: 54, 52, 59;--mtrl-sys-color-on-surface: #e6e1e5;--mtrl-sys-color-on-surface-rgb: 230, 225, 229;--mtrl-sys-color-on-surface-variant: #cac4d0;--mtrl-sys-color-on-surface-variant-rgb: 202, 196, 208;--mtrl-sys-color-outline: #938f99;--mtrl-sys-color-outline-rgb: 147, 143, 153;--mtrl-sys-color-outline-variant: #444746;--mtrl-sys-color-outline-variant-rgb: 68, 71, 70;--mtrl-sys-color-shadow: #000000;--mtrl-sys-color-shadow-rgb: 0, 0, 0;--mtrl-sys-color-scrim: #000000;--mtrl-sys-color-scrim-rgb: 0, 0, 0;--mtrl-sys-color-inverse-surface: #e6e1e5;--mtrl-sys-color-inverse-surface-rgb: 230, 225, 229;--mtrl-sys-color-inverse-on-surface: #313033;--mtrl-sys-color-inverse-on-surface-rgb: 49, 48, 51;--mtrl-sys-color-inverse-primary: #6750a4;--mtrl-sys-color-inverse-primary-rgb: 103, 80, 164}[data-theme=baseline]{--mtrl-sys-color-error: #B3261E;--mtrl-sys-color-error-rgb: 179, 38, 30;--mtrl-sys-color-on-error: #FFFFFF;--mtrl-sys-color-on-error-rgb: 255, 255, 255;--mtrl-sys-color-primary: #6750a4;--mtrl-sys-color-primary-rgb: 103, 80, 164;--mtrl-sys-color-on-primary: #ffffff;--mtrl-sys-color-on-primary-rgb: 255, 255, 255;--mtrl-sys-color-primary-container: #eaddff;--mtrl-sys-color-primary-container-rgb: 234, 221, 255;--mtrl-sys-color-on-primary-container: #21005d;--mtrl-sys-color-on-primary-container-rgb: 33, 0, 93;--mtrl-sys-color-secondary: #625b71;--mtrl-sys-color-secondary-rgb: 98, 91, 113;--mtrl-sys-color-on-secondary: #ffffff;--mtrl-sys-color-on-secondary-rgb: 255, 255, 255;--mtrl-sys-color-secondary-container: #e8def8;--mtrl-sys-color-secondary-container-rgb: 232, 222, 248;--mtrl-sys-color-on-secondary-container: #1d192b;--mtrl-sys-color-on-secondary-container-rgb: 29, 25, 43;--mtrl-sys-color-tertiary: #7d5260;--mtrl-sys-color-tertiary-rgb: 125, 82, 96;--mtrl-sys-color-on-tertiary: #ffffff;--mtrl-sys-color-on-tertiary-rgb: 255, 255, 255;--mtrl-sys-color-tertiary-container: #ffd8e4;--mtrl-sys-color-tertiary-container-rgb: 255, 216, 228;--mtrl-sys-color-on-tertiary-container: #31111d;--mtrl-sys-color-on-tertiary-container-rgb: 49, 17, 29;--mtrl-sys-color-surface: #fffbfe;--mtrl-sys-color-surface-rgb: 28, 27, 31;--mtrl-sys-color-surface-dim: #ded8e1;--mtrl-sys-color-surface-dim-rgb: 222, 216, 225;--mtrl-sys-color-surface-bright: #fff8f7;--mtrl-sys-color-surface-bright-rgb: 255, 248, 247;--mtrl-sys-color-surface-container-lowest: #ffffff;--mtrl-sys-color-surface-container-lowest-rgb: 255, 255, 255;--mtrl-sys-color-surface-container-low: #f7f2fa;--mtrl-sys-color-surface-container-low-rgb: 247, 242, 250;--mtrl-sys-color-surface-container: #f3edf7;--mtrl-sys-color-surface-container-rgb: 243, 237, 247;--mtrl-sys-color-surface-container-high: #ece6f0;--mtrl-sys-color-surface-container-high-rgb: 236, 230, 240;--mtrl-sys-color-surface-container-highest: #e6e0e9;--mtrl-sys-color-surface-container-highest-rgb: 230, 224, 233;--mtrl-sys-color-on-surface: #1c1b1f;--mtrl-sys-color-on-surface-rgb: 28, 27, 31;--mtrl-sys-color-on-surface-variant: #49454f;--mtrl-sys-color-on-surface-variant-rgb: 73, 69, 79;--mtrl-sys-color-outline: #79747e;--mtrl-sys-color-outline-rgb: 121, 116, 126;--mtrl-sys-color-outline-variant: #cac4d0;--mtrl-sys-color-outline-variant-rgb: 202, 196, 208;--mtrl-sys-color-shadow: #000000;--mtrl-sys-color-shadow-rgb: 0, 0, 0;--mtrl-sys-color-scrim: #000000;--mtrl-sys-color-scrim-rgb: 0, 0, 0;--mtrl-sys-color-inverse-surface: #313033;--mtrl-sys-color-inverse-surface-rgb: 49, 48, 51;--mtrl-sys-color-inverse-on-surface: #f4eff4;--mtrl-sys-color-inverse-on-surface-rgb: 244, 239, 244;--mtrl-sys-color-inverse-primary: #d0bcff;--mtrl-sys-color-inverse-primary-rgb: 208, 188, 255;--mtrl-sys-state-hover-state-layer-opacity: 0.08;--mtrl-sys-state-focus-state-layer-opacity: 0.12;--mtrl-sys-state-pressed-state-layer-opacity: 0.12;--mtrl-sys-state-dragged-state-layer-opacity: 0.16}[data-theme=baseline][data-theme-mode=dark]{--mtrl-sys-color-error: #F2B8B5;--mtrl-sys-color-error-rgb: 242, 184, 181;--mtrl-sys-color-on-error: #601410;--mtrl-sys-color-on-error-rgb: 96, 20, 16;--mtrl-sys-color-primary: #d0bcff;--mtrl-sys-color-primary-rgb: 208, 188, 255;--mtrl-sys-color-on-primary: #381e72;--mtrl-sys-color-on-primary-rgb: 56, 30, 114;--mtrl-sys-color-primary-container: #4f378b;--mtrl-sys-color-primary-container-rgb: 79, 55, 139;--mtrl-sys-color-on-primary-container: #eaddff;--mtrl-sys-color-on-primary-container-rgb: 234, 221, 255;--mtrl-sys-color-secondary: #ccc2dc;--mtrl-sys-color-secondary-rgb: 204, 194, 220;--mtrl-sys-color-on-secondary: #332d41;--mtrl-sys-color-on-secondary-rgb: 51, 45, 65;--mtrl-sys-color-secondary-container: #4a4458;--mtrl-sys-color-secondary-container-rgb: 74, 68, 88;--mtrl-sys-color-on-secondary-container: #e8def8;--mtrl-sys-color-on-secondary-container-rgb: 232, 222, 248;--mtrl-sys-color-tertiary: #efb8c8;--mtrl-sys-color-tertiary-rgb: 239, 184, 200;--mtrl-sys-color-on-tertiary: #492532;--mtrl-sys-color-on-tertiary-rgb: 73, 37, 50;--mtrl-sys-color-tertiary-container: #633b48;--mtrl-sys-color-tertiary-container-rgb: 99, 59, 72;--mtrl-sys-color-on-tertiary-container: #ffd8e4;--mtrl-sys-color-on-tertiary-container-rgb: 255, 216, 228;--mtrl-sys-color-surface: #1c1b1f;--mtrl-sys-color-surface-rgb: 28, 27, 31;--mtrl-sys-color-surface-dim: #141218;--mtrl-sys-color-surface-dim-rgb: 20, 18, 24;--mtrl-sys-color-surface-bright: #3b383d;--mtrl-sys-color-surface-bright-rgb: 59, 56, 61;--mtrl-sys-color-surface-container-lowest: #0f0d13;--mtrl-sys-color-surface-container-lowest-rgb: 15, 13, 19;--mtrl-sys-color-surface-container-low: #1d1b20;--mtrl-sys-color-surface-container-low-rgb: 29, 27, 32;--mtrl-sys-color-surface-container: #211f26;--mtrl-sys-color-surface-container-rgb: 33, 31, 38;--mtrl-sys-color-surface-container-high: #2b2930;--mtrl-sys-color-surface-container-high-rgb: 43, 41, 48;--mtrl-sys-color-surface-container-highest: #36343b;--mtrl-sys-color-surface-container-highest-rgb: 54, 52, 59;--mtrl-sys-color-on-surface: #e6e1e5;--mtrl-sys-color-on-surface-rgb: 230, 225, 229;--mtrl-sys-color-on-surface-variant: #cac4d0;--mtrl-sys-color-on-surface-variant-rgb: 202, 196, 208;--mtrl-sys-color-outline: #938f99;--mtrl-sys-color-outline-rgb: 147, 143, 153;--mtrl-sys-color-outline-variant: #444746;--mtrl-sys-color-outline-variant-rgb: 68, 71, 70;--mtrl-sys-color-shadow: #000000;--mtrl-sys-color-shadow-rgb: 0, 0, 0;--mtrl-sys-color-scrim: #000000;--mtrl-sys-color-scrim-rgb: 0, 0, 0;--mtrl-sys-color-inverse-surface: #e6e1e5;--mtrl-sys-color-inverse-surface-rgb: 230, 225, 229;--mtrl-sys-color-inverse-on-surface: #313033;--mtrl-sys-color-inverse-on-surface-rgb: 49, 48, 51;--mtrl-sys-color-inverse-primary: #6750a4;--mtrl-sys-color-inverse-primary-rgb: 103, 80, 164}:root{--mtrl-ref-typeface-brand: Roboto, sans-serif;--mtrl-ref-typeface-plain: Roboto, sans-serif;--mtrl-sys-shape-corner-none: 0;--mtrl-sys-shape-corner-extra-tiny: 1px;--mtrl-sys-shape-corner-tiny: 2px;--mtrl-sys-shape-corner-extra-small: 4px;--mtrl-sys-shape-corner-small: 8px;--mtrl-sys-shape-corner-medium: 12px;--mtrl-sys-shape-corner-large: 16px;--mtrl-sys-shape-corner-large-increased: 20px;--mtrl-sys-shape-corner-extra-large: 28px;--mtrl-sys-shape-corner-full: 9999px;--mtrl-sys-shape-corner-pill: 100px;--mtrl-sys-typescale-display-large-font: var(--mtrl-ref-typeface-brand);--mtrl-sys-typescale-display-large-font-size: 57px;--mtrl-sys-typescale-display-large-line-height: 64px;--mtrl-sys-typescale-display-large-letter-spacing: -0.25px;--mtrl-sys-typescale-display-large-font-weight: 400;--mtrl-sys-typescale-display-medium-font: var(--mtrl-ref-typeface-brand);--mtrl-sys-typescale-display-medium-font-size: 45px;--mtrl-sys-typescale-display-medium-line-height: 52px;--mtrl-sys-typescale-display-medium-letter-spacing: 0;--mtrl-sys-typescale-display-medium-font-weight: 400;--mtrl-sys-typescale-display-small-font: var(--mtrl-ref-typeface-brand);--mtrl-sys-typescale-display-small-font-size: 36px;--mtrl-sys-typescale-display-small-line-height: 44px;--mtrl-sys-typescale-display-small-letter-spacing: 0;--mtrl-sys-typescale-display-small-font-weight: 400;--mtrl-sys-typescale-headline-large-font: var(--mtrl-ref-typeface-brand);--mtrl-sys-typescale-headline-large-font-size: 32px;--mtrl-sys-typescale-headline-large-line-height: 40px;--mtrl-sys-typescale-headline-large-letter-spacing: 0;--mtrl-sys-typescale-headline-large-font-weight: 400;--mtrl-sys-typescale-headline-medium-font: var(--mtrl-ref-typeface-brand);--mtrl-sys-typescale-headline-medium-font-size: 28px;--mtrl-sys-typescale-headline-medium-line-height: 36px;--mtrl-sys-typescale-headline-medium-letter-spacing: 0;--mtrl-sys-typescale-headline-medium-font-weight: 400;--mtrl-sys-typescale-headline-small-font: var(--mtrl-ref-typeface-brand);--mtrl-sys-typescale-headline-small-font-size: 24px;--mtrl-sys-typescale-headline-small-line-height: 32px;--mtrl-sys-typescale-headline-small-letter-spacing: 0;--mtrl-sys-typescale-headline-small-font-weight: 400;--mtrl-sys-typescale-title-large-font: var(--mtrl-ref-typeface-brand);--mtrl-sys-typescale-title-large-font-size: 22px;--mtrl-sys-typescale-title-large-line-height: 28px;--mtrl-sys-typescale-title-large-letter-spacing: 0;--mtrl-sys-typescale-title-large-font-weight: 400;--mtrl-sys-typescale-title-medium-font: var(--mtrl-ref-typeface-brand);--mtrl-sys-typescale-title-medium-font-size: 16px;--mtrl-sys-typescale-title-medium-line-height: 24px;--mtrl-sys-typescale-title-medium-letter-spacing: 0.15px;--mtrl-sys-typescale-title-medium-font-weight: 500;--mtrl-sys-typescale-title-small-font: var(--mtrl-ref-typeface-brand);--mtrl-sys-typescale-title-small-font-size: 14px;--mtrl-sys-typescale-title-small-line-height: 20px;--mtrl-sys-typescale-title-small-letter-spacing: 0.1px;--mtrl-sys-typescale-title-small-font-weight: 500;--mtrl-sys-typescale-body-large-font: var(--mtrl-ref-typeface-plain);--mtrl-sys-typescale-body-large-font-size: 16px;--mtrl-sys-typescale-body-large-line-height: 24px;--mtrl-sys-typescale-body-large-letter-spacing: 0.5px;--mtrl-sys-typescale-body-large-font-weight: 400;--mtrl-sys-typescale-body-medium-font: var(--mtrl-ref-typeface-plain);--mtrl-sys-typescale-body-medium-font-size: 14px;--mtrl-sys-typescale-body-medium-line-height: 20px;--mtrl-sys-typescale-body-medium-letter-spacing: 0.25px;--mtrl-sys-typescale-body-medium-font-weight: 400;--mtrl-sys-typescale-body-small-font: var(--mtrl-ref-typeface-plain);--mtrl-sys-typescale-body-small-font-size: 12px;--mtrl-sys-typescale-body-small-line-height: 16px;--mtrl-sys-typescale-body-small-letter-spacing: 0.4px;--mtrl-sys-typescale-body-small-font-weight: 400;--mtrl-sys-typescale-label-large-font: var(--mtrl-ref-typeface-plain);--mtrl-sys-typescale-label-large-font-size: 14px;--mtrl-sys-typescale-label-large-line-height: 20px;--mtrl-sys-typescale-label-large-letter-spacing: 0.1px;--mtrl-sys-typescale-label-large-font-weight: 500;--mtrl-sys-typescale-label-medium-font: var(--mtrl-ref-typeface-plain);--mtrl-sys-typescale-label-medium-font-size: 12px;--mtrl-sys-typescale-label-medium-line-height: 16px;--mtrl-sys-typescale-label-medium-letter-spacing: 0.5px;--mtrl-sys-typescale-label-medium-font-weight: 500;--mtrl-sys-typescale-label-small-font: var(--mtrl-ref-typeface-plain);--mtrl-sys-typescale-label-small-font-size: 11px;--mtrl-sys-typescale-label-small-line-height: 16px;--mtrl-sys-typescale-label-small-letter-spacing: 0.5px;--mtrl-sys-typescale-label-small-font-weight: 500}*,*::before,*::after{box-sizing:border-box}html,body,h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd{margin:0;padding:0}body{min-height:100vh;text-rendering:optimizeSpeed;line-height:1.5}img,picture{max-width:100%;display:block}input,button,textarea,select{font:inherit}@media(prefers-reduced-motion: reduce){html:focus-within{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}}button{background:rgba(0,0,0,0);border:none;cursor:pointer;padding:0}ul,ol{list-style:none;margin:0;padding:0}a{text-decoration:none;color:inherit}table{border-collapse:collapse;border-spacing:0}.mtrl-display-large{font-family:"Roboto",sans-serif;font-size:57px;line-height:64px;letter-spacing:-0.25px;font-weight:400}.mtrl-display-medium{font-family:"Roboto",sans-serif;font-size:45px;line-height:52px;letter-spacing:0;font-weight:400}.mtrl-display-small{font-family:"Roboto",sans-serif;font-size:36px;line-height:44px;letter-spacing:0;font-weight:400}.mtrl-headline-large{font-family:"Roboto",sans-serif;font-size:32px;line-height:40px;letter-spacing:0;font-weight:400}.mtrl-headline-medium{font-family:"Roboto",sans-serif;font-size:28px;line-height:36px;letter-spacing:0;font-weight:400}.mtrl-headline-small{font-family:"Roboto",sans-serif;font-size:24px;line-height:32px;letter-spacing:0;font-weight:400}.mtrl-title-large{font-family:"Roboto",sans-serif;font-size:22px;line-height:28px;letter-spacing:0;font-weight:400}.mtrl-title-medium{font-family:"Roboto",sans-serif;font-size:16px;line-height:24px;letter-spacing:.15px;font-weight:500}.mtrl-title-small{font-family:"Roboto",sans-serif;font-size:14px;line-height:20px;letter-spacing:.1px;font-weight:500}.mtrl-body-large{font-family:"Roboto",sans-serif;font-size:16px;line-height:24px;letter-spacing:.5px;font-weight:400}.mtrl-body-medium{font-family:"Roboto",sans-serif;font-size:14px;line-height:20px;letter-spacing:.25px;font-weight:400}.mtrl-body-small{font-family:"Roboto",sans-serif;font-size:12px;line-height:16px;letter-spacing:.4px;font-weight:400}.mtrl-label-large{font-family:"Roboto",sans-serif;font-size:14px;line-height:20px;letter-spacing:.1px;font-weight:500}.mtrl-label-medium{font-family:"Roboto",sans-serif;font-size:12px;line-height:16px;letter-spacing:.5px;font-weight:500}.mtrl-label-small{font-family:"Roboto",sans-serif;font-size:11px;line-height:16px;letter-spacing:.5px;font-weight:500}.mtrl-text-center{text-align:center}.mtrl-text-left{text-align:left}.mtrl-text-right{text-align:right}.mtrl-font-thin{font-weight:100}.mtrl-font-light{font-weight:300}.mtrl-font-regular{font-weight:400}.mtrl-font-medium{font-weight:500}.mtrl-font-bold{font-weight:700}.mtrl-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mtrl-truncate-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.mtrl-truncate-3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}h1{font-family:"Roboto",sans-serif;font-size:32px;line-height:40px;letter-spacing:0;font-weight:400;margin-bottom:.5em}h2{font-family:"Roboto",sans-serif;font-size:28px;line-height:36px;letter-spacing:0;font-weight:400;margin-bottom:.5em}h3{font-family:"Roboto",sans-serif;font-size:24px;line-height:32px;letter-spacing:0;font-weight:400;margin-bottom:.5em}h4{font-family:"Roboto",sans-serif;font-size:22px;line-height:28px;letter-spacing:0;font-weight:400;margin-bottom:.5em}h5{font-family:"Roboto",sans-serif;font-size:16px;line-height:24px;letter-spacing:.15px;font-weight:500;margin-bottom:.5em}h6{font-family:"Roboto",sans-serif;font-size:14px;line-height:20px;letter-spacing:.1px;font-weight:500;margin-bottom:.5em}p{font-family:"Roboto",sans-serif;font-size:14px;line-height:20px;letter-spacing:.25px;font-weight:400;margin-bottom:1em}.mtrl-ripple{position:absolute;top:0;left:0;right:0;bottom:0;overflow:hidden;border-radius:inherit;pointer-events:none;z-index:0}.mtrl-ripple-wave{position:absolute;border-radius:50%;background-color:currentColor;opacity:0;transform:scale(0);pointer-events:none;will-change:transform,opacity;transition:opacity .4s cubic-bezier(0.4, 0, 0.2, 1)}.mtrl-ripple-wave.active{animation:mtrl-ripple-expand .4s cubic-bezier(0.4, 0, 0.2, 1) both;opacity:.08}.mtrl-ripple-wave.fade-out{opacity:0}@keyframes mtrl-ripple-expand{from{transform:scale(0)}to{transform:scale(1)}}@media(prefers-reduced-motion: reduce){.mtrl-ripple-wave.active{animation:none;transform:scale(1)}.mtrl-ripple-wave{transition:none}}[data-ripple]{position:relative;overflow:hidden}[data-ripple]::after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;z-index:0;pointer-events:none}[data-ripple][data-ripple=light]::after{background-color:hsla(0,0%,100%,.3)}[data-ripple][data-ripple=dark]::after{background-color:rgba(0,0,0,.1)}[data-ripple]>*{position:relative;z-index:1}body{margin:0;padding:0;background-color:var(--mtrl-sys-color-surface);color:var(--mtrl-sys-color-on-surface);font-family:var(--mtrl-sys-typescale-body-medium-font);font-size:var(--mtrl-sys-typescale-body-medium-font-size);line-height:var(--mtrl-sys-typescale-body-medium-line-height);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transition:background-color 200ms cubic-bezier(0.2, 0, 0, 1),color 200ms cubic-bezier(0.2, 0, 0, 1)}html{scroll-behavior:smooth}@media(prefers-reduced-motion: reduce){html{scroll-behavior:auto}}*,*::before,*::after{box-sizing:border-box}}
+/*! mtrl v0.9.8 | MIT */
+@layer mtrl.base,mtrl.utilities,mtrl.textfield,mtrl.badge,mtrl.bottom-app-bar,mtrl.bottom-sheet,mtrl.side-sheet,mtrl.menu,mtrl.slider,mtrl.switch,mtrl.select,mtrl.progress,mtrl.button,mtrl.tabs,mtrl.top-app-bar,mtrl.icon-button,mtrl.button-group,mtrl.fab,mtrl.extended-fab,mtrl.segmented-button,mtrl.card,mtrl.carousel,mtrl.checkbox,mtrl.chips,mtrl.divider,mtrl.dialog,mtrl.drawer,mtrl.loading-indicator,mtrl.split-button,mtrl.radios,mtrl.timepicker,mtrl.search,mtrl.snackbar,mtrl.navigation-rail,mtrl.navigation,mtrl.list,mtrl.tooltip;@layer mtrl.base{:root{--mtrl-sys-color-error: #B3261E;--mtrl-sys-color-error-rgb: 179, 38, 30;--mtrl-sys-color-on-error: #FFFFFF;--mtrl-sys-color-on-error-rgb: 255, 255, 255;--mtrl-sys-color-primary: #6750a4;--mtrl-sys-color-primary-rgb: 103, 80, 164;--mtrl-sys-color-on-primary: #ffffff;--mtrl-sys-color-on-primary-rgb: 255, 255, 255;--mtrl-sys-color-primary-container: #eaddff;--mtrl-sys-color-primary-container-rgb: 234, 221, 255;--mtrl-sys-color-on-primary-container: #21005d;--mtrl-sys-color-on-primary-container-rgb: 33, 0, 93;--mtrl-sys-color-secondary: #625b71;--mtrl-sys-color-secondary-rgb: 98, 91, 113;--mtrl-sys-color-on-secondary: #ffffff;--mtrl-sys-color-on-secondary-rgb: 255, 255, 255;--mtrl-sys-color-secondary-container: #e8def8;--mtrl-sys-color-secondary-container-rgb: 232, 222, 248;--mtrl-sys-color-on-secondary-container: #1d192b;--mtrl-sys-color-on-secondary-container-rgb: 29, 25, 43;--mtrl-sys-color-tertiary: #7d5260;--mtrl-sys-color-tertiary-rgb: 125, 82, 96;--mtrl-sys-color-on-tertiary: #ffffff;--mtrl-sys-color-on-tertiary-rgb: 255, 255, 255;--mtrl-sys-color-tertiary-container: #ffd8e4;--mtrl-sys-color-tertiary-container-rgb: 255, 216, 228;--mtrl-sys-color-on-tertiary-container: #31111d;--mtrl-sys-color-on-tertiary-container-rgb: 49, 17, 29;--mtrl-sys-color-surface: #fffbfe;--mtrl-sys-color-surface-rgb: 28, 27, 31;--mtrl-sys-color-surface-dim: #ded8e1;--mtrl-sys-color-surface-dim-rgb: 222, 216, 225;--mtrl-sys-color-surface-bright: #fff8f7;--mtrl-sys-color-surface-bright-rgb: 255, 248, 247;--mtrl-sys-color-surface-container-lowest: #ffffff;--mtrl-sys-color-surface-container-lowest-rgb: 255, 255, 255;--mtrl-sys-color-surface-container-low: #f7f2fa;--mtrl-sys-color-surface-container-low-rgb: 247, 242, 250;--mtrl-sys-color-surface-container: #f3edf7;--mtrl-sys-color-surface-container-rgb: 243, 237, 247;--mtrl-sys-color-surface-container-high: #ece6f0;--mtrl-sys-color-surface-container-high-rgb: 236, 230, 240;--mtrl-sys-color-surface-container-highest: #e6e0e9;--mtrl-sys-color-surface-container-highest-rgb: 230, 224, 233;--mtrl-sys-color-on-surface: #1c1b1f;--mtrl-sys-color-on-surface-rgb: 28, 27, 31;--mtrl-sys-color-on-surface-variant: #49454f;--mtrl-sys-color-on-surface-variant-rgb: 73, 69, 79;--mtrl-sys-color-outline: #79747e;--mtrl-sys-color-outline-rgb: 121, 116, 126;--mtrl-sys-color-outline-variant: #cac4d0;--mtrl-sys-color-outline-variant-rgb: 202, 196, 208;--mtrl-sys-color-shadow: #000000;--mtrl-sys-color-shadow-rgb: 0, 0, 0;--mtrl-sys-color-scrim: #000000;--mtrl-sys-color-scrim-rgb: 0, 0, 0;--mtrl-sys-color-inverse-surface: #313033;--mtrl-sys-color-inverse-surface-rgb: 49, 48, 51;--mtrl-sys-color-inverse-on-surface: #f4eff4;--mtrl-sys-color-inverse-on-surface-rgb: 244, 239, 244;--mtrl-sys-color-inverse-primary: #d0bcff;--mtrl-sys-color-inverse-primary-rgb: 208, 188, 255;--mtrl-sys-state-hover-state-layer-opacity: 0.08;--mtrl-sys-state-focus-state-layer-opacity: 0.12;--mtrl-sys-state-pressed-state-layer-opacity: 0.12;--mtrl-sys-state-dragged-state-layer-opacity: 0.16}@media(prefers-color-scheme: dark){:root{--mtrl-sys-color-error: #F2B8B5;--mtrl-sys-color-error-rgb: 242, 184, 181;--mtrl-sys-color-on-error: #601410;--mtrl-sys-color-on-error-rgb: 96, 20, 16;--mtrl-sys-color-primary: #d0bcff;--mtrl-sys-color-primary-rgb: 208, 188, 255;--mtrl-sys-color-on-primary: #381e72;--mtrl-sys-color-on-primary-rgb: 56, 30, 114;--mtrl-sys-color-primary-container: #4f378b;--mtrl-sys-color-primary-container-rgb: 79, 55, 139;--mtrl-sys-color-on-primary-container: #eaddff;--mtrl-sys-color-on-primary-container-rgb: 234, 221, 255;--mtrl-sys-color-secondary: #ccc2dc;--mtrl-sys-color-secondary-rgb: 204, 194, 220;--mtrl-sys-color-on-secondary: #332d41;--mtrl-sys-color-on-secondary-rgb: 51, 45, 65;--mtrl-sys-color-secondary-container: #4a4458;--mtrl-sys-color-secondary-container-rgb: 74, 68, 88;--mtrl-sys-color-on-secondary-container: #e8def8;--mtrl-sys-color-on-secondary-container-rgb: 232, 222, 248;--mtrl-sys-color-tertiary: #efb8c8;--mtrl-sys-color-tertiary-rgb: 239, 184, 200;--mtrl-sys-color-on-tertiary: #492532;--mtrl-sys-color-on-tertiary-rgb: 73, 37, 50;--mtrl-sys-color-tertiary-container: #633b48;--mtrl-sys-color-tertiary-container-rgb: 99, 59, 72;--mtrl-sys-color-on-tertiary-container: #ffd8e4;--mtrl-sys-color-on-tertiary-container-rgb: 255, 216, 228;--mtrl-sys-color-surface: #1c1b1f;--mtrl-sys-color-surface-rgb: 28, 27, 31;--mtrl-sys-color-surface-dim: #141218;--mtrl-sys-color-surface-dim-rgb: 20, 18, 24;--mtrl-sys-color-surface-bright: #3b383d;--mtrl-sys-color-surface-bright-rgb: 59, 56, 61;--mtrl-sys-color-surface-container-lowest: #0f0d13;--mtrl-sys-color-surface-container-lowest-rgb: 15, 13, 19;--mtrl-sys-color-surface-container-low: #1d1b20;--mtrl-sys-color-surface-container-low-rgb: 29, 27, 32;--mtrl-sys-color-surface-container: #211f26;--mtrl-sys-color-surface-container-rgb: 33, 31, 38;--mtrl-sys-color-surface-container-high: #2b2930;--mtrl-sys-color-surface-container-high-rgb: 43, 41, 48;--mtrl-sys-color-surface-container-highest: #36343b;--mtrl-sys-color-surface-container-highest-rgb: 54, 52, 59;--mtrl-sys-color-on-surface: #e6e1e5;--mtrl-sys-color-on-surface-rgb: 230, 225, 229;--mtrl-sys-color-on-surface-variant: #cac4d0;--mtrl-sys-color-on-surface-variant-rgb: 202, 196, 208;--mtrl-sys-color-outline: #938f99;--mtrl-sys-color-outline-rgb: 147, 143, 153;--mtrl-sys-color-outline-variant: #444746;--mtrl-sys-color-outline-variant-rgb: 68, 71, 70;--mtrl-sys-color-shadow: #000000;--mtrl-sys-color-shadow-rgb: 0, 0, 0;--mtrl-sys-color-scrim: #000000;--mtrl-sys-color-scrim-rgb: 0, 0, 0;--mtrl-sys-color-inverse-surface: #e6e1e5;--mtrl-sys-color-inverse-surface-rgb: 230, 225, 229;--mtrl-sys-color-inverse-on-surface: #313033;--mtrl-sys-color-inverse-on-surface-rgb: 49, 48, 51;--mtrl-sys-color-inverse-primary: #6750a4;--mtrl-sys-color-inverse-primary-rgb: 103, 80, 164}}.dark-theme{--mtrl-sys-color-error: #F2B8B5;--mtrl-sys-color-error-rgb: 242, 184, 181;--mtrl-sys-color-on-error: #601410;--mtrl-sys-color-on-error-rgb: 96, 20, 16;--mtrl-sys-color-primary: #d0bcff;--mtrl-sys-color-primary-rgb: 208, 188, 255;--mtrl-sys-color-on-primary: #381e72;--mtrl-sys-color-on-primary-rgb: 56, 30, 114;--mtrl-sys-color-primary-container: #4f378b;--mtrl-sys-color-primary-container-rgb: 79, 55, 139;--mtrl-sys-color-on-primary-container: #eaddff;--mtrl-sys-color-on-primary-container-rgb: 234, 221, 255;--mtrl-sys-color-secondary: #ccc2dc;--mtrl-sys-color-secondary-rgb: 204, 194, 220;--mtrl-sys-color-on-secondary: #332d41;--mtrl-sys-color-on-secondary-rgb: 51, 45, 65;--mtrl-sys-color-secondary-container: #4a4458;--mtrl-sys-color-secondary-container-rgb: 74, 68, 88;--mtrl-sys-color-on-secondary-container: #e8def8;--mtrl-sys-color-on-secondary-container-rgb: 232, 222, 248;--mtrl-sys-color-tertiary: #efb8c8;--mtrl-sys-color-tertiary-rgb: 239, 184, 200;--mtrl-sys-color-on-tertiary: #492532;--mtrl-sys-color-on-tertiary-rgb: 73, 37, 50;--mtrl-sys-color-tertiary-container: #633b48;--mtrl-sys-color-tertiary-container-rgb: 99, 59, 72;--mtrl-sys-color-on-tertiary-container: #ffd8e4;--mtrl-sys-color-on-tertiary-container-rgb: 255, 216, 228;--mtrl-sys-color-surface: #1c1b1f;--mtrl-sys-color-surface-rgb: 28, 27, 31;--mtrl-sys-color-surface-dim: #141218;--mtrl-sys-color-surface-dim-rgb: 20, 18, 24;--mtrl-sys-color-surface-bright: #3b383d;--mtrl-sys-color-surface-bright-rgb: 59, 56, 61;--mtrl-sys-color-surface-container-lowest: #0f0d13;--mtrl-sys-color-surface-container-lowest-rgb: 15, 13, 19;--mtrl-sys-color-surface-container-low: #1d1b20;--mtrl-sys-color-surface-container-low-rgb: 29, 27, 32;--mtrl-sys-color-surface-container: #211f26;--mtrl-sys-color-surface-container-rgb: 33, 31, 38;--mtrl-sys-color-surface-container-high: #2b2930;--mtrl-sys-color-surface-container-high-rgb: 43, 41, 48;--mtrl-sys-color-surface-container-highest: #36343b;--mtrl-sys-color-surface-container-highest-rgb: 54, 52, 59;--mtrl-sys-color-on-surface: #e6e1e5;--mtrl-sys-color-on-surface-rgb: 230, 225, 229;--mtrl-sys-color-on-surface-variant: #cac4d0;--mtrl-sys-color-on-surface-variant-rgb: 202, 196, 208;--mtrl-sys-color-outline: #938f99;--mtrl-sys-color-outline-rgb: 147, 143, 153;--mtrl-sys-color-outline-variant: #444746;--mtrl-sys-color-outline-variant-rgb: 68, 71, 70;--mtrl-sys-color-shadow: #000000;--mtrl-sys-color-shadow-rgb: 0, 0, 0;--mtrl-sys-color-scrim: #000000;--mtrl-sys-color-scrim-rgb: 0, 0, 0;--mtrl-sys-color-inverse-surface: #e6e1e5;--mtrl-sys-color-inverse-surface-rgb: 230, 225, 229;--mtrl-sys-color-inverse-on-surface: #313033;--mtrl-sys-color-inverse-on-surface-rgb: 49, 48, 51;--mtrl-sys-color-inverse-primary: #6750a4;--mtrl-sys-color-inverse-primary-rgb: 103, 80, 164}[data-theme=baseline]{--mtrl-sys-color-error: #B3261E;--mtrl-sys-color-error-rgb: 179, 38, 30;--mtrl-sys-color-on-error: #FFFFFF;--mtrl-sys-color-on-error-rgb: 255, 255, 255;--mtrl-sys-color-primary: #6750a4;--mtrl-sys-color-primary-rgb: 103, 80, 164;--mtrl-sys-color-on-primary: #ffffff;--mtrl-sys-color-on-primary-rgb: 255, 255, 255;--mtrl-sys-color-primary-container: #eaddff;--mtrl-sys-color-primary-container-rgb: 234, 221, 255;--mtrl-sys-color-on-primary-container: #21005d;--mtrl-sys-color-on-primary-container-rgb: 33, 0, 93;--mtrl-sys-color-secondary: #625b71;--mtrl-sys-color-secondary-rgb: 98, 91, 113;--mtrl-sys-color-on-secondary: #ffffff;--mtrl-sys-color-on-secondary-rgb: 255, 255, 255;--mtrl-sys-color-secondary-container: #e8def8;--mtrl-sys-color-secondary-container-rgb: 232, 222, 248;--mtrl-sys-color-on-secondary-container: #1d192b;--mtrl-sys-color-on-secondary-container-rgb: 29, 25, 43;--mtrl-sys-color-tertiary: #7d5260;--mtrl-sys-color-tertiary-rgb: 125, 82, 96;--mtrl-sys-color-on-tertiary: #ffffff;--mtrl-sys-color-on-tertiary-rgb: 255, 255, 255;--mtrl-sys-color-tertiary-container: #ffd8e4;--mtrl-sys-color-tertiary-container-rgb: 255, 216, 228;--mtrl-sys-color-on-tertiary-container: #31111d;--mtrl-sys-color-on-tertiary-container-rgb: 49, 17, 29;--mtrl-sys-color-surface: #fffbfe;--mtrl-sys-color-surface-rgb: 28, 27, 31;--mtrl-sys-color-surface-dim: #ded8e1;--mtrl-sys-color-surface-dim-rgb: 222, 216, 225;--mtrl-sys-color-surface-bright: #fff8f7;--mtrl-sys-color-surface-bright-rgb: 255, 248, 247;--mtrl-sys-color-surface-container-lowest: #ffffff;--mtrl-sys-color-surface-container-lowest-rgb: 255, 255, 255;--mtrl-sys-color-surface-container-low: #f7f2fa;--mtrl-sys-color-surface-container-low-rgb: 247, 242, 250;--mtrl-sys-color-surface-container: #f3edf7;--mtrl-sys-color-surface-container-rgb: 243, 237, 247;--mtrl-sys-color-surface-container-high: #ece6f0;--mtrl-sys-color-surface-container-high-rgb: 236, 230, 240;--mtrl-sys-color-surface-container-highest: #e6e0e9;--mtrl-sys-color-surface-container-highest-rgb: 230, 224, 233;--mtrl-sys-color-on-surface: #1c1b1f;--mtrl-sys-color-on-surface-rgb: 28, 27, 31;--mtrl-sys-color-on-surface-variant: #49454f;--mtrl-sys-color-on-surface-variant-rgb: 73, 69, 79;--mtrl-sys-color-outline: #79747e;--mtrl-sys-color-outline-rgb: 121, 116, 126;--mtrl-sys-color-outline-variant: #cac4d0;--mtrl-sys-color-outline-variant-rgb: 202, 196, 208;--mtrl-sys-color-shadow: #000000;--mtrl-sys-color-shadow-rgb: 0, 0, 0;--mtrl-sys-color-scrim: #000000;--mtrl-sys-color-scrim-rgb: 0, 0, 0;--mtrl-sys-color-inverse-surface: #313033;--mtrl-sys-color-inverse-surface-rgb: 49, 48, 51;--mtrl-sys-color-inverse-on-surface: #f4eff4;--mtrl-sys-color-inverse-on-surface-rgb: 244, 239, 244;--mtrl-sys-color-inverse-primary: #d0bcff;--mtrl-sys-color-inverse-primary-rgb: 208, 188, 255;--mtrl-sys-state-hover-state-layer-opacity: 0.08;--mtrl-sys-state-focus-state-layer-opacity: 0.12;--mtrl-sys-state-pressed-state-layer-opacity: 0.12;--mtrl-sys-state-dragged-state-layer-opacity: 0.16}[data-theme=baseline][data-theme-mode=dark]{--mtrl-sys-color-error: #F2B8B5;--mtrl-sys-color-error-rgb: 242, 184, 181;--mtrl-sys-color-on-error: #601410;--mtrl-sys-color-on-error-rgb: 96, 20, 16;--mtrl-sys-color-primary: #d0bcff;--mtrl-sys-color-primary-rgb: 208, 188, 255;--mtrl-sys-color-on-primary: #381e72;--mtrl-sys-color-on-primary-rgb: 56, 30, 114;--mtrl-sys-color-primary-container: #4f378b;--mtrl-sys-color-primary-container-rgb: 79, 55, 139;--mtrl-sys-color-on-primary-container: #eaddff;--mtrl-sys-color-on-primary-container-rgb: 234, 221, 255;--mtrl-sys-color-secondary: #ccc2dc;--mtrl-sys-color-secondary-rgb: 204, 194, 220;--mtrl-sys-color-on-secondary: #332d41;--mtrl-sys-color-on-secondary-rgb: 51, 45, 65;--mtrl-sys-color-secondary-container: #4a4458;--mtrl-sys-color-secondary-container-rgb: 74, 68, 88;--mtrl-sys-color-on-secondary-container: #e8def8;--mtrl-sys-color-on-secondary-container-rgb: 232, 222, 248;--mtrl-sys-color-tertiary: #efb8c8;--mtrl-sys-color-tertiary-rgb: 239, 184, 200;--mtrl-sys-color-on-tertiary: #492532;--mtrl-sys-color-on-tertiary-rgb: 73, 37, 50;--mtrl-sys-color-tertiary-container: #633b48;--mtrl-sys-color-tertiary-container-rgb: 99, 59, 72;--mtrl-sys-color-on-tertiary-container: #ffd8e4;--mtrl-sys-color-on-tertiary-container-rgb: 255, 216, 228;--mtrl-sys-color-surface: #1c1b1f;--mtrl-sys-color-surface-rgb: 28, 27, 31;--mtrl-sys-color-surface-dim: #141218;--mtrl-sys-color-surface-dim-rgb: 20, 18, 24;--mtrl-sys-color-surface-bright: #3b383d;--mtrl-sys-color-surface-bright-rgb: 59, 56, 61;--mtrl-sys-color-surface-container-lowest: #0f0d13;--mtrl-sys-color-surface-container-lowest-rgb: 15, 13, 19;--mtrl-sys-color-surface-container-low: #1d1b20;--mtrl-sys-color-surface-container-low-rgb: 29, 27, 32;--mtrl-sys-color-surface-container: #211f26;--mtrl-sys-color-surface-container-rgb: 33, 31, 38;--mtrl-sys-color-surface-container-high: #2b2930;--mtrl-sys-color-surface-container-high-rgb: 43, 41, 48;--mtrl-sys-color-surface-container-highest: #36343b;--mtrl-sys-color-surface-container-highest-rgb: 54, 52, 59;--mtrl-sys-color-on-surface: #e6e1e5;--mtrl-sys-color-on-surface-rgb: 230, 225, 229;--mtrl-sys-color-on-surface-variant: #cac4d0;--mtrl-sys-color-on-surface-variant-rgb: 202, 196, 208;--mtrl-sys-color-outline: #938f99;--mtrl-sys-color-outline-rgb: 147, 143, 153;--mtrl-sys-color-outline-variant: #444746;--mtrl-sys-color-outline-variant-rgb: 68, 71, 70;--mtrl-sys-color-shadow: #000000;--mtrl-sys-color-shadow-rgb: 0, 0, 0;--mtrl-sys-color-scrim: #000000;--mtrl-sys-color-scrim-rgb: 0, 0, 0;--mtrl-sys-color-inverse-surface: #e6e1e5;--mtrl-sys-color-inverse-surface-rgb: 230, 225, 229;--mtrl-sys-color-inverse-on-surface: #313033;--mtrl-sys-color-inverse-on-surface-rgb: 49, 48, 51;--mtrl-sys-color-inverse-primary: #6750a4;--mtrl-sys-color-inverse-primary-rgb: 103, 80, 164}:root{--mtrl-ref-typeface-brand: Roboto, sans-serif;--mtrl-ref-typeface-plain: Roboto, sans-serif;--mtrl-sys-shape-corner-none: 0;--mtrl-sys-shape-corner-extra-tiny: 1px;--mtrl-sys-shape-corner-tiny: 2px;--mtrl-sys-shape-corner-extra-small: 4px;--mtrl-sys-shape-corner-small: 8px;--mtrl-sys-shape-corner-medium: 12px;--mtrl-sys-shape-corner-large: 16px;--mtrl-sys-shape-corner-large-increased: 20px;--mtrl-sys-shape-corner-extra-large: 28px;--mtrl-sys-shape-corner-full: 9999px;--mtrl-sys-shape-corner-pill: 100px;--mtrl-sys-typescale-display-large-font: var(--mtrl-ref-typeface-brand);--mtrl-sys-typescale-display-large-font-size: 57px;--mtrl-sys-typescale-display-large-line-height: 64px;--mtrl-sys-typescale-display-large-letter-spacing: -0.25px;--mtrl-sys-typescale-display-large-font-weight: 400;--mtrl-sys-typescale-display-medium-font: var(--mtrl-ref-typeface-brand);--mtrl-sys-typescale-display-medium-font-size: 45px;--mtrl-sys-typescale-display-medium-line-height: 52px;--mtrl-sys-typescale-display-medium-letter-spacing: 0;--mtrl-sys-typescale-display-medium-font-weight: 400;--mtrl-sys-typescale-display-small-font: var(--mtrl-ref-typeface-brand);--mtrl-sys-typescale-display-small-font-size: 36px;--mtrl-sys-typescale-display-small-line-height: 44px;--mtrl-sys-typescale-display-small-letter-spacing: 0;--mtrl-sys-typescale-display-small-font-weight: 400;--mtrl-sys-typescale-headline-large-font: var(--mtrl-ref-typeface-brand);--mtrl-sys-typescale-headline-large-font-size: 32px;--mtrl-sys-typescale-headline-large-line-height: 40px;--mtrl-sys-typescale-headline-large-letter-spacing: 0;--mtrl-sys-typescale-headline-large-font-weight: 400;--mtrl-sys-typescale-headline-medium-font: var(--mtrl-ref-typeface-brand);--mtrl-sys-typescale-headline-medium-font-size: 28px;--mtrl-sys-typescale-headline-medium-line-height: 36px;--mtrl-sys-typescale-headline-medium-letter-spacing: 0;--mtrl-sys-typescale-headline-medium-font-weight: 400;--mtrl-sys-typescale-headline-small-font: var(--mtrl-ref-typeface-brand);--mtrl-sys-typescale-headline-small-font-size: 24px;--mtrl-sys-typescale-headline-small-line-height: 32px;--mtrl-sys-typescale-headline-small-letter-spacing: 0;--mtrl-sys-typescale-headline-small-font-weight: 400;--mtrl-sys-typescale-title-large-font: var(--mtrl-ref-typeface-brand);--mtrl-sys-typescale-title-large-font-size: 22px;--mtrl-sys-typescale-title-large-line-height: 28px;--mtrl-sys-typescale-title-large-letter-spacing: 0;--mtrl-sys-typescale-title-large-font-weight: 400;--mtrl-sys-typescale-title-medium-font: var(--mtrl-ref-typeface-brand);--mtrl-sys-typescale-title-medium-font-size: 16px;--mtrl-sys-typescale-title-medium-line-height: 24px;--mtrl-sys-typescale-title-medium-letter-spacing: 0.15px;--mtrl-sys-typescale-title-medium-font-weight: 500;--mtrl-sys-typescale-title-small-font: var(--mtrl-ref-typeface-brand);--mtrl-sys-typescale-title-small-font-size: 14px;--mtrl-sys-typescale-title-small-line-height: 20px;--mtrl-sys-typescale-title-small-letter-spacing: 0.1px;--mtrl-sys-typescale-title-small-font-weight: 500;--mtrl-sys-typescale-body-large-font: var(--mtrl-ref-typeface-plain);--mtrl-sys-typescale-body-large-font-size: 16px;--mtrl-sys-typescale-body-large-line-height: 24px;--mtrl-sys-typescale-body-large-letter-spacing: 0.5px;--mtrl-sys-typescale-body-large-font-weight: 400;--mtrl-sys-typescale-body-medium-font: var(--mtrl-ref-typeface-plain);--mtrl-sys-typescale-body-medium-font-size: 14px;--mtrl-sys-typescale-body-medium-line-height: 20px;--mtrl-sys-typescale-body-medium-letter-spacing: 0.25px;--mtrl-sys-typescale-body-medium-font-weight: 400;--mtrl-sys-typescale-body-small-font: var(--mtrl-ref-typeface-plain);--mtrl-sys-typescale-body-small-font-size: 12px;--mtrl-sys-typescale-body-small-line-height: 16px;--mtrl-sys-typescale-body-small-letter-spacing: 0.4px;--mtrl-sys-typescale-body-small-font-weight: 400;--mtrl-sys-typescale-label-large-font: var(--mtrl-ref-typeface-plain);--mtrl-sys-typescale-label-large-font-size: 14px;--mtrl-sys-typescale-label-large-line-height: 20px;--mtrl-sys-typescale-label-large-letter-spacing: 0.1px;--mtrl-sys-typescale-label-large-font-weight: 500;--mtrl-sys-typescale-label-medium-font: var(--mtrl-ref-typeface-plain);--mtrl-sys-typescale-label-medium-font-size: 12px;--mtrl-sys-typescale-label-medium-line-height: 16px;--mtrl-sys-typescale-label-medium-letter-spacing: 0.5px;--mtrl-sys-typescale-label-medium-font-weight: 500;--mtrl-sys-typescale-label-small-font: var(--mtrl-ref-typeface-plain);--mtrl-sys-typescale-label-small-font-size: 11px;--mtrl-sys-typescale-label-small-line-height: 16px;--mtrl-sys-typescale-label-small-letter-spacing: 0.5px;--mtrl-sys-typescale-label-small-font-weight: 500}*,*::before,*::after{box-sizing:border-box}html,body,h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd{margin:0;padding:0}body{min-height:100vh;text-rendering:optimizeSpeed;line-height:1.5}img,picture{max-width:100%;display:block}input,button,textarea,select{font:inherit}@media(prefers-reduced-motion: reduce){html:focus-within{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-property:opacity,color,background-color,border-color,outline-color,box-shadow,visibility !important;scroll-behavior:auto !important}}button{background:rgba(0,0,0,0);border:none;cursor:pointer;padding:0}ul,ol{list-style:none;margin:0;padding:0}a{text-decoration:none;color:inherit}table{border-collapse:collapse;border-spacing:0}.mtrl-display-large{font-family:"Roboto",sans-serif;font-size:57px;line-height:64px;letter-spacing:-0.25px;font-weight:400}.mtrl-display-medium{font-family:"Roboto",sans-serif;font-size:45px;line-height:52px;letter-spacing:0;font-weight:400}.mtrl-display-small{font-family:"Roboto",sans-serif;font-size:36px;line-height:44px;letter-spacing:0;font-weight:400}.mtrl-headline-large{font-family:"Roboto",sans-serif;font-size:32px;line-height:40px;letter-spacing:0;font-weight:400}.mtrl-headline-medium{font-family:"Roboto",sans-serif;font-size:28px;line-height:36px;letter-spacing:0;font-weight:400}.mtrl-headline-small{font-family:"Roboto",sans-serif;font-size:24px;line-height:32px;letter-spacing:0;font-weight:400}.mtrl-title-large{font-family:"Roboto",sans-serif;font-size:22px;line-height:28px;letter-spacing:0;font-weight:400}.mtrl-title-medium{font-family:"Roboto",sans-serif;font-size:16px;line-height:24px;letter-spacing:.15px;font-weight:500}.mtrl-title-small{font-family:"Roboto",sans-serif;font-size:14px;line-height:20px;letter-spacing:.1px;font-weight:500}.mtrl-body-large{font-family:"Roboto",sans-serif;font-size:16px;line-height:24px;letter-spacing:.5px;font-weight:400}.mtrl-body-medium{font-family:"Roboto",sans-serif;font-size:14px;line-height:20px;letter-spacing:.25px;font-weight:400}.mtrl-body-small{font-family:"Roboto",sans-serif;font-size:12px;line-height:16px;letter-spacing:.4px;font-weight:400}.mtrl-label-large{font-family:"Roboto",sans-serif;font-size:14px;line-height:20px;letter-spacing:.1px;font-weight:500}.mtrl-label-medium{font-family:"Roboto",sans-serif;font-size:12px;line-height:16px;letter-spacing:.5px;font-weight:500}.mtrl-label-small{font-family:"Roboto",sans-serif;font-size:11px;line-height:16px;letter-spacing:.5px;font-weight:500}.mtrl-text-center{text-align:center}.mtrl-text-left{text-align:left}.mtrl-text-right{text-align:right}.mtrl-font-thin{font-weight:100}.mtrl-font-light{font-weight:300}.mtrl-font-regular{font-weight:400}.mtrl-font-medium{font-weight:500}.mtrl-font-bold{font-weight:700}.mtrl-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mtrl-truncate-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.mtrl-truncate-3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}h1{font-family:"Roboto",sans-serif;font-size:32px;line-height:40px;letter-spacing:0;font-weight:400;margin-bottom:.5em}h2{font-family:"Roboto",sans-serif;font-size:28px;line-height:36px;letter-spacing:0;font-weight:400;margin-bottom:.5em}h3{font-family:"Roboto",sans-serif;font-size:24px;line-height:32px;letter-spacing:0;font-weight:400;margin-bottom:.5em}h4{font-family:"Roboto",sans-serif;font-size:22px;line-height:28px;letter-spacing:0;font-weight:400;margin-bottom:.5em}h5{font-family:"Roboto",sans-serif;font-size:16px;line-height:24px;letter-spacing:.15px;font-weight:500;margin-bottom:.5em}h6{font-family:"Roboto",sans-serif;font-size:14px;line-height:20px;letter-spacing:.1px;font-weight:500;margin-bottom:.5em}p{font-family:"Roboto",sans-serif;font-size:14px;line-height:20px;letter-spacing:.25px;font-weight:400;margin-bottom:1em}.mtrl-ripple{position:absolute;top:0;left:0;right:0;bottom:0;overflow:hidden;border-radius:inherit;pointer-events:none;z-index:0}.mtrl-ripple-wave{position:absolute;border-radius:50%;background-color:currentColor;opacity:0;transform:scale(0);pointer-events:none;will-change:transform,opacity;transition:opacity .4s cubic-bezier(0.4, 0, 0.2, 1)}.mtrl-ripple-wave.active{animation:mtrl-ripple-expand .4s cubic-bezier(0.4, 0, 0.2, 1) both;opacity:.08}.mtrl-ripple-wave.fade-out{opacity:0}@keyframes mtrl-ripple-expand{from{transform:scale(0)}to{transform:scale(1)}}@media(prefers-reduced-motion: reduce){.mtrl-ripple-wave.active{animation:none;transform:scale(1)}.mtrl-ripple-wave{transition:none}}[data-ripple]{position:relative;overflow:hidden}[data-ripple]::after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;z-index:0;pointer-events:none}[data-ripple][data-ripple=light]::after{background-color:hsla(0,0%,100%,.3)}[data-ripple][data-ripple=dark]::after{background-color:rgba(0,0,0,.1)}[data-ripple]>*{position:relative;z-index:1}body{margin:0;padding:0;background-color:var(--mtrl-sys-color-surface);color:var(--mtrl-sys-color-on-surface);font-family:var(--mtrl-sys-typescale-body-medium-font);font-size:var(--mtrl-sys-typescale-body-medium-font-size);line-height:var(--mtrl-sys-typescale-body-medium-line-height);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transition:background-color 100ms cubic-bezier(0.2, 0, 0, 1),color 100ms cubic-bezier(0.2, 0, 0, 1)}html{scroll-behavior:smooth}@media(prefers-reduced-motion: reduce){html{scroll-behavior:auto}}*,*::before,*::after{box-sizing:border-box}}

package/dist/styles/bottom-app-bar.css

@@ -1,2 +1,2 @@
-/*! mtrl v0.9.5 | MIT */
+/*! mtrl v0.9.8 | MIT */
 @layer mtrl.base,mtrl.utilities,mtrl.textfield,mtrl.badge,mtrl.bottom-app-bar,mtrl.bottom-sheet,mtrl.side-sheet,mtrl.menu,mtrl.slider,mtrl.switch,mtrl.select,mtrl.progress,mtrl.button,mtrl.tabs,mtrl.top-app-bar,mtrl.icon-button,mtrl.button-group,mtrl.fab,mtrl.extended-fab,mtrl.segmented-button,mtrl.card,mtrl.carousel,mtrl.checkbox,mtrl.chips,mtrl.divider,mtrl.dialog,mtrl.drawer,mtrl.loading-indicator,mtrl.split-button,mtrl.radios,mtrl.timepicker,mtrl.search,mtrl.snackbar,mtrl.navigation-rail,mtrl.navigation,mtrl.list,mtrl.tooltip;@layer mtrl.bottom-app-bar{.mtrl-bottom-app-bar{position:absolute;bottom:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;height:80px;padding:12px 16px 12px 4px;background-color:var(--mtrl-sys-color-surface-container);box-shadow:0px 1px 2px rgba(0,0,0,.3),0px 2px 6px 2px rgba(0,0,0,.15);border-top-left-radius:var(--mtrl-sys-shape-medium);border-top-right-radius:var(--mtrl-sys-shape-medium);transition:transform .3s ease-in-out}.mtrl-bottom-app-bar-actions{display:flex;align-items:center;gap:4px;height:100%}.mtrl-bottom-app-bar-actions>*{flex-shrink:0}.mtrl-bottom-app-bar-fab-container{display:flex;align-items:center;justify-content:center;margin-left:auto}.mtrl-bottom-app-bar--with-fab{height:72px}.mtrl-bottom-app-bar--fab-center .mtrl-bottom-app-bar-fab-container{position:absolute;left:50%;transform:translateX(-50%)}.mtrl-bottom-app-bar--hidden{transform:translateY(100%)}[dir=rtl] .mtrl-bottom-app-bar{padding:12px 4px 12px 16px}[dir=rtl] .mtrl-bottom-app-bar-actions{flex-direction:row-reverse}[dir=rtl] .mtrl-bottom-app-bar-fab-container{margin-right:auto;margin-left:initial}@media(prefers-reduced-motion: reduce){.mtrl-bottom-app-bar{transition-duration:.01ms}}@media(forced-colors: active){.mtrl-bottom-app-bar{border-top:1px solid currentColor}}}

package/dist/styles/bottom-sheet.css

@@ -1,2 +1,2 @@
-/*! mtrl v0.9.5 | MIT */
-@layer mtrl.base,mtrl.utilities,mtrl.textfield,mtrl.badge,mtrl.bottom-app-bar,mtrl.bottom-sheet,mtrl.side-sheet,mtrl.menu,mtrl.slider,mtrl.switch,mtrl.select,mtrl.progress,mtrl.button,mtrl.tabs,mtrl.top-app-bar,mtrl.icon-button,mtrl.button-group,mtrl.fab,mtrl.extended-fab,mtrl.segmented-button,mtrl.card,mtrl.carousel,mtrl.checkbox,mtrl.chips,mtrl.divider,mtrl.dialog,mtrl.drawer,mtrl.loading-indicator,mtrl.split-button,mtrl.radios,mtrl.timepicker,mtrl.search,mtrl.snackbar,mtrl.navigation-rail,mtrl.navigation,mtrl.list,mtrl.tooltip;@layer mtrl.bottom-sheet{.mtrl-bottom-sheet{position:fixed;inset:0;z-index:1000;display:flex;align-items:flex-end;justify-content:center;pointer-events:none}.mtrl-bottom-sheet--scrim-visible,.mtrl-bottom-sheet--partial,.mtrl-bottom-sheet--expanded{pointer-events:auto}.mtrl-bottom-sheet-scrim{position:absolute;inset:0;background-color:color-mix(in srgb, var(--mtrl-sys-color-scrim) 32%, transparent);opacity:0;visibility:hidden;transition:opacity 400ms cubic-bezier(0.2, 0, 0, 1),visibility 400ms cubic-bezier(0.2, 0, 0, 1)}.mtrl-bottom-sheet-container{position:relative;width:100%;max-width:640px;max-height:100%;display:flex;flex-direction:column;box-sizing:border-box;pointer-events:auto;background-color:var(--mtrl-sys-color-surface-container-low);color:var(--mtrl-sys-color-on-surface);border-start-start-radius:28px;border-start-end-radius:28px;box-shadow:0px 1px 2px rgba(0,0,0,.3),0px 1px 3px 1px rgba(0,0,0,.15);transform:translateY(100%);transition:transform 500ms cubic-bezier(0.2, 0, 0, 1)}.mtrl-bottom-sheet-container:focus{outline:none}.mtrl-bottom-sheet-container:focus-visible{outline:3px solid var(--mtrl-sys-color-secondary);outline-offset:-3px}.mtrl-bottom-sheet-handle{flex:0 0 auto;width:32px;height:4px;margin:16px auto;border-radius:28px;background-color:var(--mtrl-sys-color-on-surface-variant);cursor:grab;touch-action:none}.mtrl-bottom-sheet-handle:active{cursor:grabbing}.mtrl-bottom-sheet-header{flex:0 0 auto;padding:0 24px 16px}.mtrl-bottom-sheet-title{margin:0;color:var(--mtrl-sys-color-on-surface);font-family:"Roboto",sans-serif;font-size:24px;line-height:32px;letter-spacing:0;font-weight:400}.mtrl-bottom-sheet-content{flex:1 1 auto;min-height:0;overflow-y:auto;padding:0 24px 24px;font-family:"Roboto",sans-serif;font-size:14px;line-height:20px;letter-spacing:.25px;font-weight:400;color:var(--mtrl-sys-color-on-surface-variant)}.mtrl-bottom-sheet--partial .mtrl-bottom-sheet-container{transform:translateY(0);max-height:50%}.mtrl-bottom-sheet--partial .mtrl-bottom-sheet-scrim{opacity:1;visibility:visible}.mtrl-bottom-sheet--expanded .mtrl-bottom-sheet-container{transform:translateY(0);max-height:100%}.mtrl-bottom-sheet--expanded .mtrl-bottom-sheet-container:where(.mtrl-bottom-sheet--full-height *){border-start-start-radius:0;border-start-end-radius:0}.mtrl-bottom-sheet--expanded .mtrl-bottom-sheet-scrim{opacity:1;visibility:visible}.mtrl-bottom-sheet--standard{pointer-events:none}.mtrl-bottom-sheet--standard .mtrl-bottom-sheet-container{pointer-events:auto}@media(prefers-reduced-motion: reduce){.mtrl-bottom-sheet .mtrl-bottom-sheet-container,.mtrl-bottom-sheet .mtrl-bottom-sheet-scrim{transition:none}}}
+/*! mtrl v0.9.8 | MIT */
+@layer mtrl.base,mtrl.utilities,mtrl.textfield,mtrl.badge,mtrl.bottom-app-bar,mtrl.bottom-sheet,mtrl.side-sheet,mtrl.menu,mtrl.slider,mtrl.switch,mtrl.select,mtrl.progress,mtrl.button,mtrl.tabs,mtrl.top-app-bar,mtrl.icon-button,mtrl.button-group,mtrl.fab,mtrl.extended-fab,mtrl.segmented-button,mtrl.card,mtrl.carousel,mtrl.checkbox,mtrl.chips,mtrl.divider,mtrl.dialog,mtrl.drawer,mtrl.loading-indicator,mtrl.split-button,mtrl.radios,mtrl.timepicker,mtrl.search,mtrl.snackbar,mtrl.navigation-rail,mtrl.navigation,mtrl.list,mtrl.tooltip;@layer mtrl.bottom-sheet{.mtrl-bottom-sheet{position:fixed;inset:0;z-index:1000;display:flex;align-items:flex-end;justify-content:center;pointer-events:none}.mtrl-bottom-sheet--scrim-visible,.mtrl-bottom-sheet--partial,.mtrl-bottom-sheet--expanded{pointer-events:auto}.mtrl-bottom-sheet-scrim{position:absolute;inset:0;background-color:color-mix(in srgb, var(--mtrl-sys-color-scrim) 32%, transparent);opacity:0;visibility:hidden;transition:opacity 250ms linear(0, 0.066, 0.203, 0.355, 0.496, 0.616, 0.713, 0.788, 0.845, 0.888, 0.92, 0.943, 0.96, 0.971, 0.98, 0.986, 0.99, 0.993, 0.995, 0.997, 0.998, 0.998, 0.999, 0.999, 1),visibility 0s linear 250ms}.mtrl-bottom-sheet-container{position:relative;width:100%;max-width:640px;max-height:100%;display:flex;flex-direction:column;box-sizing:border-box;pointer-events:auto;background-color:var(--mtrl-sys-color-surface-container-low);color:var(--mtrl-sys-color-on-surface);border-start-start-radius:28px;border-start-end-radius:28px;box-shadow:0px 1px 2px rgba(0,0,0,.3),0px 1px 3px 1px rgba(0,0,0,.15),0 32px 0 0 var(--mtrl-sys-color-surface-container-low);transform:translateY(100%);transition:transform 175ms linear(0, 0.075, 0.227, 0.39, 0.537, 0.657, 0.751, 0.822, 0.874, 0.912, 0.939, 0.958, 0.971, 0.98, 0.987, 0.991, 0.994, 0.996, 0.997, 0.998, 0.999, 0.999, 0.999, 1, 1)}.mtrl-bottom-sheet-container:focus{outline:none}.mtrl-bottom-sheet-container:focus-visible{outline:3px solid var(--mtrl-sys-color-secondary);outline-offset:-3px}.mtrl-bottom-sheet-handle{flex:0 0 auto;width:32px;height:4px;margin:16px auto;border-radius:28px;background-color:var(--mtrl-sys-color-on-surface-variant);cursor:grab;touch-action:none}.mtrl-bottom-sheet-handle:active{cursor:grabbing}.mtrl-bottom-sheet-header{flex:0 0 auto;padding:0 24px 16px}.mtrl-bottom-sheet-title{margin:0;color:var(--mtrl-sys-color-on-surface);font-family:"Roboto",sans-serif;font-size:24px;line-height:32px;letter-spacing:0;font-weight:400}.mtrl-bottom-sheet-content{flex:1 1 auto;min-height:0;overflow-y:auto;padding:0 24px 24px;font-family:"Roboto",sans-serif;font-size:14px;line-height:20px;letter-spacing:.25px;font-weight:400;color:var(--mtrl-sys-color-on-surface-variant)}.mtrl-bottom-sheet--partial .mtrl-bottom-sheet-container{transform:translateY(0);max-height:50%;transition:transform 450ms linear(0, 0.055, 0.18, 0.332, 0.483, 0.619, 0.733, 0.823, 0.891, 0.94, 0.973, 0.994, 1.007, 1.013, 1.015, 1.015, 1.013, 1.011, 1.009, 1.006, 1.005, 1.003, 1.002, 1.001, 1)}.mtrl-bottom-sheet--partial .mtrl-bottom-sheet-scrim{opacity:1;visibility:visible;transition:opacity 250ms linear(0, 0.066, 0.203, 0.355, 0.496, 0.616, 0.713, 0.788, 0.845, 0.888, 0.92, 0.943, 0.96, 0.971, 0.98, 0.986, 0.99, 0.993, 0.995, 0.997, 0.998, 0.998, 0.999, 0.999, 1),visibility 0s}.mtrl-bottom-sheet--expanded .mtrl-bottom-sheet-container{transform:translateY(0);max-height:100%;transition:transform 450ms linear(0, 0.055, 0.18, 0.332, 0.483, 0.619, 0.733, 0.823, 0.891, 0.94, 0.973, 0.994, 1.007, 1.013, 1.015, 1.015, 1.013, 1.011, 1.009, 1.006, 1.005, 1.003, 1.002, 1.001, 1)}.mtrl-bottom-sheet--expanded .mtrl-bottom-sheet-container:where(.mtrl-bottom-sheet--full-height *){border-start-start-radius:0;border-start-end-radius:0}.mtrl-bottom-sheet--expanded .mtrl-bottom-sheet-scrim{opacity:1;visibility:visible;transition:opacity 250ms linear(0, 0.066, 0.203, 0.355, 0.496, 0.616, 0.713, 0.788, 0.845, 0.888, 0.92, 0.943, 0.96, 0.971, 0.98, 0.986, 0.99, 0.993, 0.995, 0.997, 0.998, 0.998, 0.999, 0.999, 1),visibility 0s}.mtrl-bottom-sheet--standard{pointer-events:none}.mtrl-bottom-sheet--standard .mtrl-bottom-sheet-container{pointer-events:auto}@media(prefers-reduced-motion: reduce){.mtrl-bottom-sheet .mtrl-bottom-sheet-container,.mtrl-bottom-sheet .mtrl-bottom-sheet-scrim,.mtrl-bottom-sheet--partial .mtrl-bottom-sheet-container,.mtrl-bottom-sheet--partial .mtrl-bottom-sheet-scrim,.mtrl-bottom-sheet--expanded .mtrl-bottom-sheet-container,.mtrl-bottom-sheet--expanded .mtrl-bottom-sheet-scrim{transition:none}}}

package/dist/styles/button-group.css

@@ -1,2 +1,2 @@
-/*! mtrl v0.9.5 | MIT */
+/*! mtrl v0.9.8 | MIT */
 @layer mtrl.base,mtrl.utilities,mtrl.textfield,mtrl.badge,mtrl.bottom-app-bar,mtrl.bottom-sheet,mtrl.side-sheet,mtrl.menu,mtrl.slider,mtrl.switch,mtrl.select,mtrl.progress,mtrl.button,mtrl.tabs,mtrl.top-app-bar,mtrl.icon-button,mtrl.button-group,mtrl.fab,mtrl.extended-fab,mtrl.segmented-button,mtrl.card,mtrl.carousel,mtrl.checkbox,mtrl.chips,mtrl.divider,mtrl.dialog,mtrl.drawer,mtrl.loading-indicator,mtrl.split-button,mtrl.radios,mtrl.timepicker,mtrl.search,mtrl.snackbar,mtrl.navigation-rail,mtrl.navigation,mtrl.list,mtrl.tooltip;@layer mtrl.button-group{.mtrl-button-group{position:relative;display:inline-flex;flex-direction:row;align-items:center;gap:var(--mtrl-button-group-gap, 12px);--mtrl-button-group-height: 40px;--mtrl-button-group-icon: 20px;--mtrl-button-group-gap: 12px;--mtrl-button-group-inner-corner: 8px;--mtrl-button-group-pressed-corner: 4px;--mtrl-button-group-radius: 20px}.mtrl-button-group--vertical{flex-direction:column;align-items:stretch}.mtrl-button-group>.mtrl-button,.mtrl-button-group>.mtrl-icon-button{margin:0;flex-shrink:0;height:var(--mtrl-button-group-height);transition:background-color 250ms linear(0, 0.066, 0.203, 0.355, 0.496, 0.616, 0.713, 0.788, 0.845, 0.888, 0.92, 0.943, 0.96, 0.971, 0.98, 0.986, 0.99, 0.993, 0.995, 0.997, 0.998, 0.998, 0.999, 0.999, 1),color 250ms linear(0, 0.066, 0.203, 0.355, 0.496, 0.616, 0.713, 0.788, 0.845, 0.888, 0.92, 0.943, 0.96, 0.971, 0.98, 0.986, 0.99, 0.993, 0.995, 0.997, 0.998, 0.998, 0.999, 0.999, 1),box-shadow 250ms linear(0, 0.066, 0.203, 0.355, 0.496, 0.616, 0.713, 0.788, 0.845, 0.888, 0.92, 0.943, 0.96, 0.971, 0.98, 0.986, 0.99, 0.993, 0.995, 0.997, 0.998, 0.998, 0.999, 0.999, 1),border-color 250ms linear(0, 0.066, 0.203, 0.355, 0.496, 0.616, 0.713, 0.788, 0.845, 0.888, 0.92, 0.943, 0.96, 0.971, 0.98, 0.986, 0.99, 0.993, 0.995, 0.997, 0.998, 0.998, 0.999, 0.999, 1),border-radius 425ms linear(0, 0.102, 0.323, 0.57, 0.784, 0.942, 1.039, 1.085, 1.094, 1.082, 1.06, 1.037, 1.018, 1.004, 0.995, 0.992, 0.991, 0.992, 0.995, 0.997, 0.999, 1, 1.001, 1.001, 1),width 425ms linear(0, 0.102, 0.323, 0.57, 0.784, 0.942, 1.039, 1.085, 1.094, 1.082, 1.06, 1.037, 1.018, 1.004, 0.995, 0.992, 0.991, 0.992, 0.995, 0.997, 0.999, 1, 1.001, 1.001, 1),padding 425ms linear(0, 0.102, 0.323, 0.57, 0.784, 0.942, 1.039, 1.085, 1.094, 1.082, 1.06, 1.037, 1.018, 1.004, 0.995, 0.992, 0.991, 0.992, 0.995, 0.997, 0.999, 1, 1.001, 1.001, 1),gap 425ms linear(0, 0.102, 0.323, 0.57, 0.784, 0.942, 1.039, 1.085, 1.094, 1.082, 1.06, 1.037, 1.018, 1.004, 0.995, 0.992, 0.991, 0.992, 0.995, 0.997, 0.999, 1, 1.001, 1.001, 1)}.mtrl-button-group>.mtrl-button:active,.mtrl-button-group>.mtrl-icon-button:active{transition:background-color 250ms linear(0, 0.066, 0.203, 0.355, 0.496, 0.616, 0.713, 0.788, 0.845, 0.888, 0.92, 0.943, 0.96, 0.971, 0.98, 0.986, 0.99, 0.993, 0.995, 0.997, 0.998, 0.998, 0.999, 0.999, 1),color 250ms linear(0, 0.066, 0.203, 0.355, 0.496, 0.616, 0.713, 0.788, 0.845, 0.888, 0.92, 0.943, 0.96, 0.971, 0.98, 0.986, 0.99, 0.993, 0.995, 0.997, 0.998, 0.998, 0.999, 0.999, 1),box-shadow 250ms linear(0, 0.066, 0.203, 0.355, 0.496, 0.616, 0.713, 0.788, 0.845, 0.888, 0.92, 0.943, 0.96, 0.971, 0.98, 0.986, 0.99, 0.993, 0.995, 0.997, 0.998, 0.998, 0.999, 0.999, 1),border-color 250ms linear(0, 0.066, 0.203, 0.355, 0.496, 0.616, 0.713, 0.788, 0.845, 0.888, 0.92, 0.943, 0.96, 0.971, 0.98, 0.986, 0.99, 0.993, 0.995, 0.997, 0.998, 0.998, 0.999, 0.999, 1),border-radius 450ms linear(0, 0.055, 0.18, 0.332, 0.483, 0.619, 0.733, 0.823, 0.891, 0.94, 0.973, 0.994, 1.007, 1.013, 1.015, 1.015, 1.013, 1.011, 1.009, 1.006, 1.005, 1.003, 1.002, 1.001, 1),width 425ms linear(0, 0.102, 0.323, 0.57, 0.784, 0.942, 1.039, 1.085, 1.094, 1.082, 1.06, 1.037, 1.018, 1.004, 0.995, 0.992, 0.991, 0.992, 0.995, 0.997, 0.999, 1, 1.001, 1.001, 1),padding 425ms linear(0, 0.102, 0.323, 0.57, 0.784, 0.942, 1.039, 1.085, 1.094, 1.082, 1.06, 1.037, 1.018, 1.004, 0.995, 0.992, 0.991, 0.992, 0.995, 0.997, 0.999, 1, 1.001, 1.001, 1),gap 425ms linear(0, 0.102, 0.323, 0.57, 0.784, 0.942, 1.039, 1.085, 1.094, 1.082, 1.06, 1.037, 1.018, 1.004, 0.995, 0.992, 0.991, 0.992, 0.995, 0.997, 0.999, 1, 1.001, 1.001, 1)}.mtrl-button-group>.mtrl-icon-button{width:var(--mtrl-button-group-height)}.mtrl-button-group--equal-width>.mtrl-button{flex:1 1 0;justify-content:center}.mtrl-button-group--disabled{pointer-events:none}.mtrl-button-group--connected>.mtrl-button,.mtrl-button-group--connected>.mtrl-icon-button{--mtrl-button-shape:var(--mtrl-button-group-inner-corner);--mtrl-button-shape-pressed:var(--mtrl-button-group-pressed-corner);--mtrl-button-shape-selected:var(--mtrl-button-group-radius)}.mtrl-button-group--connected>.mtrl-button-group__button--first{--mtrl-button-shape:var(--mtrl-button-group-radius) var(--mtrl-button-group-inner-corner) var(--mtrl-button-group-inner-corner) var(--mtrl-button-group-radius);--mtrl-button-shape-pressed:var(--mtrl-button-group-radius) var(--mtrl-button-group-pressed-corner) var(--mtrl-button-group-pressed-corner) var(--mtrl-button-group-radius)}.mtrl-button-group--connected>.mtrl-button-group__button--last{--mtrl-button-shape:var(--mtrl-button-group-inner-corner) var(--mtrl-button-group-radius) var(--mtrl-button-group-radius) var(--mtrl-button-group-inner-corner);--mtrl-button-shape-pressed:var(--mtrl-button-group-pressed-corner) var(--mtrl-button-group-radius) var(--mtrl-button-group-radius) var(--mtrl-button-group-pressed-corner)}.mtrl-button-group--connected>.mtrl-button-group__button--single{--mtrl-button-shape:var(--mtrl-button-group-radius);--mtrl-button-shape-pressed:var(--mtrl-button-group-radius)}.mtrl-button-group--connected.mtrl-button-group--vertical>.mtrl-button-group__button--first{--mtrl-button-shape:var(--mtrl-button-group-radius) var(--mtrl-button-group-radius) var(--mtrl-button-group-inner-corner) var(--mtrl-button-group-inner-corner);--mtrl-button-shape-pressed:var(--mtrl-button-group-radius) var(--mtrl-button-group-radius) var(--mtrl-button-group-pressed-corner) var(--mtrl-button-group-pressed-corner)}.mtrl-button-group--connected.mtrl-button-group--vertical>.mtrl-button-group__button--last{--mtrl-button-shape:var(--mtrl-button-group-inner-corner) var(--mtrl-button-group-inner-corner) var(--mtrl-button-group-radius) var(--mtrl-button-group-radius);--mtrl-button-shape-pressed:var(--mtrl-button-group-pressed-corner) var(--mtrl-button-group-pressed-corner) var(--mtrl-button-group-radius) var(--mtrl-button-group-radius)}.mtrl-button-group--connected.mtrl-button-group--square>.mtrl-button-group__button--first,.mtrl-button-group--connected.mtrl-button-group--square>.mtrl-button-group__button--last,.mtrl-button-group--connected.mtrl-button-group--square>.mtrl-button-group__button--single{--mtrl-button-shape:var(--mtrl-button-group-inner-corner);--mtrl-button-shape-pressed:var(--mtrl-button-group-pressed-corner)}.mtrl-button-group--connected.mtrl-button-group--size-xs>.mtrl-button,.mtrl-button-group--connected.mtrl-button-group--size-xs>.mtrl-icon-button,.mtrl-button-group--connected.mtrl-button-group--size-s>.mtrl-button,.mtrl-button-group--connected.mtrl-button-group--size-s>.mtrl-icon-button{min-width:48px}.mtrl-button-group--labels-selected>.mtrl-button{gap:0;min-width:var(--mtrl-button-group-height);padding:0 calc((var(--mtrl-button-group-height) - var(--mtrl-button-group-icon))/2)}.mtrl-button-group--labels-selected>.mtrl-button .mtrl-button-text{display:inline-block;max-width:0;opacity:0;overflow:hidden;white-space:nowrap;text-overflow:clip;transition:max-width 425ms linear(0, 0.102, 0.323, 0.57, 0.784, 0.942, 1.039, 1.085, 1.094, 1.082, 1.06, 1.037, 1.018, 1.004, 0.995, 0.992, 0.991, 0.992, 0.995, 0.997, 0.999, 1, 1.001, 1.001, 1),opacity 250ms linear(0, 0.066, 0.203, 0.355, 0.496, 0.616, 0.713, 0.788, 0.845, 0.888, 0.92, 0.943, 0.96, 0.971, 0.98, 0.986, 0.99, 0.993, 0.995, 0.997, 0.998, 0.998, 0.999, 0.999, 1)}.mtrl-button-group--labels-selected>.mtrl-button-group__button--selected{gap:8px;padding:0 16px}.mtrl-button-group--labels-selected>.mtrl-button-group__button--selected .mtrl-button-text{max-width:12em;opacity:1}}